@openedx/paragon 22.4.0 → 22.5.0

package/dist/Hyperlink/index.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+export declare const HYPER_LINK_EXTERNAL_LINK_ALT_TEXT = "in a new tab";
+export declare const HYPER_LINK_EXTERNAL_LINK_TITLE = "Opens in a new tab";
+interface Props extends Omit<React.ComponentPropsWithRef<'a'>, 'href' | 'target'> {
+    /** specifies the URL */
+    destination: string;
+    /** Content of the hyperlink */
+    children: React.ReactNode;
+    /** Custom class names for the hyperlink */
+    className?: string;
+    /** Alt text for the icon indicating that this link opens in a new tab, if target="_blank". e.g. _("in a new tab") */
+    externalLinkAlternativeText?: string;
+    /** Tooltip text for the "opens in new tab" icon, if target="_blank". e.g. _("Opens in a new tab"). */
+    externalLinkTitle?: string;
+    /** type of hyperlink */
+    variant?: 'default' | 'muted' | 'brand';
+    /** Display the link with an underline. By default, it is only underlined on hover. */
+    isInline?: boolean;
+    /** specify if we need to show launch Icon. By default, it will be visible. */
+    showLaunchIcon?: boolean;
+    target?: '_blank' | '_self';
+}
+declare const Hyperlink: React.ForwardRefExoticComponent<Pick<Props, "variant" | "className" | "children" | "key" | "slot" | "style" | "title" | "onClick" | "tabIndex" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "download" | "hrefLang" | "media" | "ping" | "rel" | "target" | "type" | "referrerPolicy" | "destination" | "externalLinkAlternativeText" | "externalLinkTitle" | "isInline" | "showLaunchIcon"> & React.RefAttributes<HTMLAnchorElement>>;
+export default Hyperlink;

package/dist/Hyperlink/index.js

@@ -5,24 +5,22 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 import React from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
-import isRequiredIf from 'react-proptype-conditional-require';
 import { Launch } from '../../icons';
 import Icon from '../Icon';
-import withDeprecatedProps, { DeprTypes } from '../withDeprecatedProps';
 export var HYPER_LINK_EXTERNAL_LINK_ALT_TEXT = 'in a new tab';
 export var HYPER_LINK_EXTERNAL_LINK_TITLE = 'Opens in a new tab';
-var Hyperlink = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var className = props.className,
-    destination = props.destination,
-    children = props.children,
-    target = props.target,
-    onClick = props.onClick,
-    externalLinkAlternativeText = props.externalLinkAlternativeText,
-    externalLinkTitle = props.externalLinkTitle,
-    variant = props.variant,
-    isInline = props.isInline,
-    showLaunchIcon = props.showLaunchIcon,
-    attrs = _objectWithoutProperties(props, _excluded);
+var Hyperlink = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+    destination = _ref.destination,
+    children = _ref.children,
+    target = _ref.target,
+    onClick = _ref.onClick,
+    externalLinkAlternativeText = _ref.externalLinkAlternativeText,
+    externalLinkTitle = _ref.externalLinkTitle,
+    variant = _ref.variant,
+    isInline = _ref.isInline,
+    showLaunchIcon = _ref.showLaunchIcon,
+    attrs = _objectWithoutProperties(_ref, _excluded);
   var externalLinkIcon;
   if (target === '_blank') {
     var generateRel = function generateRel() {
@@ -88,30 +86,20 @@ Hyperlink.propTypes = {
    * loaded into the same browsing context as the current one.
    * If the target is `_blank` (opening a new window) `rel='noopener'` will be added to the anchor tag to prevent
    * any potential [reverse tabnabbing attack](https://www.owasp.org/index.php/Reverse_Tabnabbing).
-  */
-  target: PropTypes.string,
+   */
+  target: PropTypes.oneOf(['_blank', '_self']),
   /** specifies the callback function when the link is clicked */
   onClick: PropTypes.func,
-  /** specifies the text for links with a `_blank` target (which loads the URL in a new browsing context). */
-  externalLinkAlternativeText: isRequiredIf(PropTypes.string, function (props) {
-    return props.target === '_blank';
-  }),
-  /** specifies the title for links with a `_blank` target (which loads the URL in a new browsing context). */
-  externalLinkTitle: isRequiredIf(PropTypes.string, function (props) {
-    return props.target === '_blank';
-  }),
+  /** Alt text for the icon indicating that this link opens in a new tab, if target="_blank". e.g. _("in a new tab") */
+  externalLinkAlternativeText: PropTypes.string,
+  /** Tooltip text for the "opens in new tab" icon, if target="_blank". e.g. _("Opens in a new tab"). */
+  externalLinkTitle: PropTypes.string,
   /** type of hyperlink */
   variant: PropTypes.oneOf(['default', 'muted', 'brand']),
-  /** specify the link style. By default, it will be underlined. */
+  /** Display the link with an underline. By default, it is only underlined on hover. */
   isInline: PropTypes.bool,
   /** specify if we need to show launch Icon. By default, it will be visible. */
   showLaunchIcon: PropTypes.bool
 };
-export default withDeprecatedProps(Hyperlink, 'Hyperlink', {
-  /** specifies the text or element that a URL should be associated with */
-  content: {
-    deprType: DeprTypes.MOVED,
-    newName: 'children'
-  }
-});
+export default Hyperlink;
 //# sourceMappingURL=index.js.map

package/dist/Hyperlink/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","PropTypes","classNames","isRequiredIf","Launch","Icon","withDeprecatedProps","DeprTypes","HYPER_LINK_EXTERNAL_LINK_ALT_TEXT","HYPER_LINK_EXTERNAL_LINK_TITLE","Hyperlink","forwardRef","props","ref","className","destination","children","target","onClick","externalLinkAlternativeText","externalLinkTitle","variant","isInline","showLaunchIcon","attrs","_objectWithoutProperties","_excluded","externalLinkIcon","generateRel","rel","includes","createElement","title","src","screenReaderText","style","height","width","_extends","concat","href","defaultProps","undefined","propTypes","string","isRequired","node","func","oneOf","bool","content","deprType","MOVED","newName"],"sources":["../../src/Hyperlink/index.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport isRequiredIf from 'react-proptype-conditional-require';\nimport { Launch } from '../../icons';\nimport Icon from '../Icon';\n\nimport withDeprecatedProps, { DeprTypes } from '../withDeprecatedProps';\n\nexport const HYPER_LINK_EXTERNAL_LINK_ALT_TEXT = 'in a new tab';\nexport const HYPER_LINK_EXTERNAL_LINK_TITLE = 'Opens in a new tab';\n\nconst Hyperlink = React.forwardRef((props, ref) => {\n  const {\n    className,\n    destination,\n    children,\n    target,\n    onClick,\n    externalLinkAlternativeText,\n    externalLinkTitle,\n    variant,\n    isInline,\n    showLaunchIcon,\n    ...attrs\n  } = props;\n  let externalLinkIcon;\n\n  if (target === '_blank') {\n    const generateRel = () => {\n      let { rel } = attrs;\n      if (!rel) {\n        return 'noopener noreferrer';\n      }\n      if (!rel.includes('noopener')) {\n        rel += ' noopener';\n      }\n      if (!rel.includes('noreferrer')) {\n        rel += ' noreferrer';\n      }\n      return rel;\n    };\n\n    // Add this rel attribute to prevent Reverse Tabnabbing\n    attrs.rel = generateRel();\n    if (showLaunchIcon) {\n      externalLinkIcon = (\n        <span\n          className=\"pgn__hyperlink__external-icon\"\n          title={externalLinkTitle}\n        >\n          <Icon\n            src={Launch}\n            screenReaderText={externalLinkAlternativeText}\n            style={{ height: '1em', width: '1em' }}\n            data-testid=\"hyperlink-icon\"\n          />\n        </span>\n      );\n    }\n  }\n\n  return (\n    <a\n      ref={ref}\n      className={classNames(\n        'pgn__hyperlink',\n        `${variant}-link`,\n        {\n          'standalone-link': !isInline,\n          'inline-link': isInline,\n        },\n        className,\n      )}\n      href={destination}\n      target={target}\n      onClick={onClick}\n      {...attrs}\n    >\n      {children}\n      {externalLinkIcon}\n    </a>\n  );\n});\n\nHyperlink.defaultProps = {\n  className: undefined,\n  target: '_self',\n  onClick: () => {},\n  externalLinkAlternativeText: HYPER_LINK_EXTERNAL_LINK_ALT_TEXT,\n  externalLinkTitle: HYPER_LINK_EXTERNAL_LINK_TITLE,\n  variant: 'default',\n  isInline: false,\n  showLaunchIcon: true,\n};\n\nHyperlink.propTypes = {\n  /** specifies the URL */\n  destination: PropTypes.string.isRequired,\n  /** Content of the hyperlink */\n  children: PropTypes.node.isRequired,\n  /** Custom class names for the hyperlink */\n  className: PropTypes.string,\n  /** specifies where the link should open. The default behavior is `_self`, which means that the URL will be\n   * loaded into the same browsing context as the current one.\n   * If the target is `_blank` (opening a new window) `rel='noopener'` will be added to the anchor tag to prevent\n   * any potential [reverse tabnabbing attack](https://www.owasp.org/index.php/Reverse_Tabnabbing).\n  */\n  target: PropTypes.string,\n  /** specifies the callback function when the link is clicked */\n  onClick: PropTypes.func,\n  /** specifies the text for links with a `_blank` target (which loads the URL in a new browsing context). */\n  externalLinkAlternativeText: isRequiredIf(\n    PropTypes.string,\n    props => props.target === '_blank',\n  ),\n  /** specifies the title for links with a `_blank` target (which loads the URL in a new browsing context). */\n  externalLinkTitle: isRequiredIf(\n    PropTypes.string,\n    props => props.target === '_blank',\n  ),\n  /** type of hyperlink */\n  variant: PropTypes.oneOf(['default', 'muted', 'brand']),\n  /** specify the link style. By default, it will be underlined. */\n  isInline: PropTypes.bool,\n  /** specify if we need to show launch Icon. By default, it will be visible. */\n  showLaunchIcon: PropTypes.bool,\n};\n\nexport default withDeprecatedProps(Hyperlink, 'Hyperlink', {\n  /** specifies the text or element that a URL should be associated with */\n  content: {\n    deprType: DeprTypes.MOVED,\n    newName: 'children',\n  },\n});\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","PropTypes","classNames","Launch","Icon","HYPER_LINK_EXTERNAL_LINK_ALT_TEXT","HYPER_LINK_EXTERNAL_LINK_TITLE","Hyperlink","forwardRef","_ref","ref","className","destination","children","target","onClick","externalLinkAlternativeText","externalLinkTitle","variant","isInline","showLaunchIcon","attrs","_objectWithoutProperties","_excluded","externalLinkIcon","generateRel","rel","includes","createElement","title","src","screenReaderText","style","height","width","_extends","concat","href","defaultProps","undefined","propTypes","string","isRequired","node","oneOf","func","bool"],"sources":["../../src/Hyperlink/index.tsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { Launch } from '../../icons';\nimport Icon from '../Icon';\n\nexport const HYPER_LINK_EXTERNAL_LINK_ALT_TEXT = 'in a new tab';\nexport const HYPER_LINK_EXTERNAL_LINK_TITLE = 'Opens in a new tab';\n\ninterface Props extends Omit<React.ComponentPropsWithRef<'a'>, 'href' | 'target'> {\n  /** specifies the URL */\n  destination: string;\n  /** Content of the hyperlink */\n  children: React.ReactNode;\n  /** Custom class names for the hyperlink */\n  className?: string;\n  /** Alt text for the icon indicating that this link opens in a new tab, if target=\"_blank\". e.g. _(\"in a new tab\") */\n  externalLinkAlternativeText?: string;\n  /** Tooltip text for the \"opens in new tab\" icon, if target=\"_blank\". e.g. _(\"Opens in a new tab\"). */\n  externalLinkTitle?: string;\n  /** type of hyperlink */\n  variant?: 'default' | 'muted' | 'brand';\n  /** Display the link with an underline. By default, it is only underlined on hover. */\n  isInline?: boolean;\n  /** specify if we need to show launch Icon. By default, it will be visible. */\n  showLaunchIcon?: boolean;\n  target?: '_blank' | '_self';\n}\n\nconst Hyperlink = React.forwardRef<HTMLAnchorElement, Props>(({\n  className,\n  destination,\n  children,\n  target,\n  onClick,\n  externalLinkAlternativeText,\n  externalLinkTitle,\n  variant,\n  isInline,\n  showLaunchIcon,\n  ...attrs\n}, ref) => {\n  let externalLinkIcon;\n\n  if (target === '_blank') {\n    const generateRel = () => {\n      let { rel } = attrs;\n      if (!rel) {\n        return 'noopener noreferrer';\n      }\n      if (!rel.includes('noopener')) {\n        rel += ' noopener';\n      }\n      if (!rel.includes('noreferrer')) {\n        rel += ' noreferrer';\n      }\n      return rel;\n    };\n\n    // Add this rel attribute to prevent Reverse Tabnabbing\n    attrs.rel = generateRel();\n    if (showLaunchIcon) {\n      externalLinkIcon = (\n        <span\n          className=\"pgn__hyperlink__external-icon\"\n          title={externalLinkTitle}\n        >\n          <Icon\n            src={Launch}\n            screenReaderText={externalLinkAlternativeText}\n            style={{ height: '1em', width: '1em' }}\n            data-testid=\"hyperlink-icon\"\n          />\n        </span>\n      );\n    }\n  }\n\n  return (\n    <a\n      ref={ref}\n      className={classNames(\n        'pgn__hyperlink',\n        `${variant}-link`,\n        {\n          'standalone-link': !isInline,\n          'inline-link': isInline,\n        },\n        className,\n      )}\n      href={destination}\n      target={target}\n      onClick={onClick}\n      {...attrs}\n    >\n      {children}\n      {externalLinkIcon}\n    </a>\n  );\n});\n\nHyperlink.defaultProps = {\n  className: undefined,\n  target: '_self',\n  onClick: () => {},\n  externalLinkAlternativeText: HYPER_LINK_EXTERNAL_LINK_ALT_TEXT,\n  externalLinkTitle: HYPER_LINK_EXTERNAL_LINK_TITLE,\n  variant: 'default',\n  isInline: false,\n  showLaunchIcon: true,\n};\n\nHyperlink.propTypes = {\n  /** specifies the URL */\n  destination: PropTypes.string.isRequired,\n  /** Content of the hyperlink */\n  children: PropTypes.node.isRequired,\n  /** Custom class names for the hyperlink */\n  className: PropTypes.string,\n  /** specifies where the link should open. The default behavior is `_self`, which means that the URL will be\n   * loaded into the same browsing context as the current one.\n   * If the target is `_blank` (opening a new window) `rel='noopener'` will be added to the anchor tag to prevent\n   * any potential [reverse tabnabbing attack](https://www.owasp.org/index.php/Reverse_Tabnabbing).\n   */\n  target: PropTypes.oneOf(['_blank', '_self']),\n  /** specifies the callback function when the link is clicked */\n  onClick: PropTypes.func,\n  /** Alt text for the icon indicating that this link opens in a new tab, if target=\"_blank\". e.g. _(\"in a new tab\") */\n  externalLinkAlternativeText: PropTypes.string,\n  /** Tooltip text for the \"opens in new tab\" icon, if target=\"_blank\". e.g. _(\"Opens in a new tab\"). */\n  externalLinkTitle: PropTypes.string,\n  /** type of hyperlink */\n  variant: PropTypes.oneOf(['default', 'muted', 'brand']),\n  /** Display the link with an underline. By default, it is only underlined on hover. */\n  isInline: PropTypes.bool,\n  /** specify if we need to show launch Icon. By default, it will be visible. */\n  showLaunchIcon: PropTypes.bool,\n};\n\nexport default Hyperlink;\n"],"mappings":"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","ignoreList":[]}

package/dist/index.d.ts

@@ -7,6 +7,7 @@
 export { default as Bubble } from './Bubble';
 export { default as Chip, CHIP_PGN_CLASS } from './Chip';
 export { default as ChipCarousel } from './ChipCarousel';
+export { default as Hyperlink, HYPER_LINK_EXTERNAL_LINK_ALT_TEXT, HYPER_LINK_EXTERNAL_LINK_TITLE } from './Hyperlink';
 export { default as Icon } from './Icon';
 
 // // // // // // // // // // // // // // // // // // // // // // // // // // //
@@ -72,7 +73,6 @@ export const
   FormAutosuggestOption: any,
   InputGroup: any;
 // from './Form';
-export const Hyperlink: any, HYPER_LINK_EXTERNAL_LINK_ALT_TEXT: string, HYPER_LINK_EXTERNAL_LINK_TITLE: string; // from './Hyperlink';
 export const IconButton: any, IconButtonWithTooltip: any; // from './IconButton';
 export const IconButtonToggle: any; // from './IconButtonToggle';
 export const Input: any; // from './Input';

package/dist/index.js

@@ -7,6 +7,7 @@
 export { default as Bubble } from './Bubble';
 export { default as Chip, CHIP_PGN_CLASS } from './Chip';
 export { default as ChipCarousel } from './ChipCarousel';
+export { default as Hyperlink, HYPER_LINK_EXTERNAL_LINK_ALT_TEXT, HYPER_LINK_EXTERNAL_LINK_TITLE } from './Hyperlink';
 export { default as Icon } from './Icon';
 
 // // // // // // // // // // // // // // // // // // // // // // // // // // //
@@ -72,7 +73,6 @@ export {
   FormAutosuggestOption,
   InputGroup,
 } from './Form';
-export { default as Hyperlink, HYPER_LINK_EXTERNAL_LINK_ALT_TEXT, HYPER_LINK_EXTERNAL_LINK_TITLE } from './Hyperlink';
 export { default as IconButton, IconButtonWithTooltip } from './IconButton';
 export { default as IconButtonToggle } from './IconButtonToggle';
 export { default as Input } from './Input';

package/dist/setupTest.d.ts

@@ -0,0 +1,2 @@
+import 'regenerator-runtime/runtime';
+import '@testing-library/jest-dom';

package/dist/setupTest.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"setupTest.js","names":["crypto","require","ResizeObserver","_classCallCheck","_createClass","key","value","observe","unobserve","disconnect","window","getRandomValues","arr","randomBytes","length"],"sources":["../src/setupTest.ts"],"sourcesContent":["/* eslint-disable import/no-extraneous-dependencies */\nimport 'regenerator-runtime/runtime';\n\nimport '@testing-library/jest-dom';\n\nconst crypto = require('crypto');\n\nclass ResizeObserver {\n  observe() {\n    // do nothing\n  }\n\n  unobserve() {\n    // do nothing\n  }\n\n  disconnect() {\n    // do nothing\n  }\n}\n\nwindow.ResizeObserver = ResizeObserver;\n\n(window as any).crypto = {\n  getRandomValues: (arr: any) => crypto.randomBytes(arr.length),\n};\n"],"mappings":";;;;;;AAAA;AACA,OAAO,6BAA6B;AAEpC,OAAO,2BAA2B;AAElC,IAAMA,MAAM,GAAGC,OAAO,CAAC,QAAQ,CAAC;AAAC,IAE3BC,cAAc;EAAA,SAAAA,eAAA;IAAAC,eAAA,OAAAD,cAAA;EAAA;EAAAE,YAAA,CAAAF,cAAA;IAAAG,GAAA;IAAAC,KAAA,EAClB,SAAAC,QAAA,EAAU;MACR;IAAA;EACD;IAAAF,GAAA;IAAAC,KAAA,EAED,SAAAE,UAAA,EAAY;MACV;IAAA;EACD;IAAAH,GAAA;IAAAC,KAAA,EAED,SAAAG,WAAA,EAAa;MACX;IAAA;EACD;EAAA,OAAAP,cAAA;AAAA;AAGHQ,MAAM,CAACR,cAAc,GAAGA,cAAc;AAErCQ,MAAM,CAASV,MAAM,GAAG;EACvBW,eAAe,EAAE,SAAAA,gBAACC,GAAQ;IAAA,OAAKZ,MAAM,CAACa,WAAW,CAACD,GAAG,CAACE,MAAM,CAAC;EAAA;AAC/D,CAAC","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openedx/paragon",
-  "version": "22.4.0",
+  "version": "22.5.0",
   "description": "Accessible, responsive UI component library based on Bootstrap.",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -153,7 +153,7 @@
       "^.+\\.tsx?$": "ts-jest"
     },
     "setupFilesAfterEnv": [
-      "./src/setupTest.js"
+      "./src/setupTest.ts"
     ],
     "moduleNameMapper": {
       "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__mocks__/fileMock.js",
@@ -164,7 +164,7 @@
     ],
     "coveragePathIgnorePatterns": [
       "/node_modules/",
-      "src/setupTest.js",
+      "src/setupTest.ts",
       "src/index.js",
       "/tests/",
       "/www/",

package/src/Hyperlink/{Hyperlink.test.jsx → Hyperlink.test.tsx}

@@ -4,30 +4,34 @@ import userEvent from '@testing-library/user-event';
 
 import Hyperlink from '.';
 
-const content = 'content';
 const destination = 'destination';
+const content = 'content';
 const onClick = jest.fn();
 const props = {
-  content,
   destination,
   onClick,
 };
 const externalLinkAlternativeText = 'externalLinkAlternativeText';
 const externalLinkTitle = 'externalLinkTitle';
 const externalLinkProps = {
-  target: '_blank',
+  target: '_blank' as const,
   externalLinkAlternativeText,
   externalLinkTitle,
   ...props,
 };
 
 describe('correct rendering', () => {
+  beforeEach(() => {
+    onClick.mockClear();
+  });
+
   it('renders Hyperlink', async () => {
-    const { getByRole } = render(<Hyperlink {...props} />);
+    const { getByRole } = render(<Hyperlink {...props}>{content}</Hyperlink>);
     const wrapper = getByRole('link');
     expect(wrapper).toBeInTheDocument();
 
     expect(wrapper).toHaveClass('pgn__hyperlink');
+    expect(wrapper).toHaveClass('standalone-link');
     expect(wrapper).toHaveTextContent(content);
     expect(wrapper).toHaveAttribute('href', destination);
     expect(wrapper).toHaveAttribute('target', '_self');
@@ -36,8 +40,17 @@ describe('correct rendering', () => {
     expect(onClick).toHaveBeenCalledTimes(1);
   });
 
+  it('renders an underlined Hyperlink', async () => {
+    const { getByRole } = render(<Hyperlink isInline {...props}>{content}</Hyperlink>);
+    const wrapper = getByRole('link');
+    expect(wrapper).toBeInTheDocument();
+    expect(wrapper).toHaveClass('pgn__hyperlink');
+    expect(wrapper).not.toHaveClass('standalone-link');
+    expect(wrapper).toHaveClass('inline-link');
+  });
+
   it('renders external Hyperlink', () => {
-    const { getByRole, getByTestId } = render(<Hyperlink {...externalLinkProps} />);
+    const { getByRole, getByTestId } = render(<Hyperlink {...externalLinkProps}>{content}</Hyperlink>);
     const wrapper = getByRole('link');
     const icon = getByTestId('hyperlink-icon');
     const iconSvg = icon.querySelector('svg');
@@ -53,18 +66,16 @@ describe('correct rendering', () => {
 
 describe('security', () => {
   it('prevents reverse tabnabbing for links with target="_blank"', () => {
-    const { getByRole } = render(<Hyperlink {...externalLinkProps} />);
+    const { getByRole } = render(<Hyperlink {...externalLinkProps}>{content}</Hyperlink>);
     const wrapper = getByRole('link');
     expect(wrapper).toHaveAttribute('rel', 'noopener noreferrer');
   });
 });
 
 describe('event handlers are triggered correctly', () => {
-  let spy;
-  beforeEach(() => { spy = jest.fn(); });
-
   it('should fire onClick', async () => {
-    const { getByRole } = render(<Hyperlink {...props} onClick={spy} />);
+    const spy = jest.fn();
+    const { getByRole } = render(<Hyperlink {...props} onClick={spy}>{content}</Hyperlink>);
     const wrapper = getByRole('link');
     expect(spy).toHaveBeenCalledTimes(0);
     await userEvent.click(wrapper);

package/src/Hyperlink/{index.jsx → index.tsx}

@@ -1,29 +1,45 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
-import isRequiredIf from 'react-proptype-conditional-require';
 import { Launch } from '../../icons';
 import Icon from '../Icon';
 
-import withDeprecatedProps, { DeprTypes } from '../withDeprecatedProps';
-
 export const HYPER_LINK_EXTERNAL_LINK_ALT_TEXT = 'in a new tab';
 export const HYPER_LINK_EXTERNAL_LINK_TITLE = 'Opens in a new tab';
 
-const Hyperlink = React.forwardRef((props, ref) => {
-  const {
-    className,
-    destination,
-    children,
-    target,
-    onClick,
-    externalLinkAlternativeText,
-    externalLinkTitle,
-    variant,
-    isInline,
-    showLaunchIcon,
-    ...attrs
-  } = props;
+interface Props extends Omit<React.ComponentPropsWithRef<'a'>, 'href' | 'target'> {
+  /** specifies the URL */
+  destination: string;
+  /** Content of the hyperlink */
+  children: React.ReactNode;
+  /** Custom class names for the hyperlink */
+  className?: string;
+  /** Alt text for the icon indicating that this link opens in a new tab, if target="_blank". e.g. _("in a new tab") */
+  externalLinkAlternativeText?: string;
+  /** Tooltip text for the "opens in new tab" icon, if target="_blank". e.g. _("Opens in a new tab"). */
+  externalLinkTitle?: string;
+  /** type of hyperlink */
+  variant?: 'default' | 'muted' | 'brand';
+  /** Display the link with an underline. By default, it is only underlined on hover. */
+  isInline?: boolean;
+  /** specify if we need to show launch Icon. By default, it will be visible. */
+  showLaunchIcon?: boolean;
+  target?: '_blank' | '_self';
+}
+
+const Hyperlink = React.forwardRef<HTMLAnchorElement, Props>(({
+  className,
+  destination,
+  children,
+  target,
+  onClick,
+  externalLinkAlternativeText,
+  externalLinkTitle,
+  variant,
+  isInline,
+  showLaunchIcon,
+  ...attrs
+}, ref) => {
   let externalLinkIcon;
 
   if (target === '_blank') {
@@ -105,32 +121,20 @@ Hyperlink.propTypes = {
    * loaded into the same browsing context as the current one.
    * If the target is `_blank` (opening a new window) `rel='noopener'` will be added to the anchor tag to prevent
    * any potential [reverse tabnabbing attack](https://www.owasp.org/index.php/Reverse_Tabnabbing).
-  */
-  target: PropTypes.string,
+   */
+  target: PropTypes.oneOf(['_blank', '_self']),
   /** specifies the callback function when the link is clicked */
   onClick: PropTypes.func,
-  /** specifies the text for links with a `_blank` target (which loads the URL in a new browsing context). */
-  externalLinkAlternativeText: isRequiredIf(
-    PropTypes.string,
-    props => props.target === '_blank',
-  ),
-  /** specifies the title for links with a `_blank` target (which loads the URL in a new browsing context). */
-  externalLinkTitle: isRequiredIf(
-    PropTypes.string,
-    props => props.target === '_blank',
-  ),
+  /** Alt text for the icon indicating that this link opens in a new tab, if target="_blank". e.g. _("in a new tab") */
+  externalLinkAlternativeText: PropTypes.string,
+  /** Tooltip text for the "opens in new tab" icon, if target="_blank". e.g. _("Opens in a new tab"). */
+  externalLinkTitle: PropTypes.string,
   /** type of hyperlink */
   variant: PropTypes.oneOf(['default', 'muted', 'brand']),
-  /** specify the link style. By default, it will be underlined. */
+  /** Display the link with an underline. By default, it is only underlined on hover. */
   isInline: PropTypes.bool,
   /** specify if we need to show launch Icon. By default, it will be visible. */
   showLaunchIcon: PropTypes.bool,
 };
 
-export default withDeprecatedProps(Hyperlink, 'Hyperlink', {
-  /** specifies the text or element that a URL should be associated with */
-  content: {
-    deprType: DeprTypes.MOVED,
-    newName: 'children',
-  },
-});
+export default Hyperlink;

package/src/index.d.ts

@@ -7,6 +7,7 @@
 export { default as Bubble } from './Bubble';
 export { default as Chip, CHIP_PGN_CLASS } from './Chip';
 export { default as ChipCarousel } from './ChipCarousel';
+export { default as Hyperlink, HYPER_LINK_EXTERNAL_LINK_ALT_TEXT, HYPER_LINK_EXTERNAL_LINK_TITLE } from './Hyperlink';
 export { default as Icon } from './Icon';
 
 // // // // // // // // // // // // // // // // // // // // // // // // // // //
@@ -72,7 +73,6 @@ export const
   FormAutosuggestOption: any,
   InputGroup: any;
 // from './Form';
-export const Hyperlink: any, HYPER_LINK_EXTERNAL_LINK_ALT_TEXT: string, HYPER_LINK_EXTERNAL_LINK_TITLE: string; // from './Hyperlink';
 export const IconButton: any, IconButtonWithTooltip: any; // from './IconButton';
 export const IconButtonToggle: any; // from './IconButtonToggle';
 export const Input: any; // from './Input';

package/src/index.js

@@ -7,6 +7,7 @@
 export { default as Bubble } from './Bubble';
 export { default as Chip, CHIP_PGN_CLASS } from './Chip';
 export { default as ChipCarousel } from './ChipCarousel';
+export { default as Hyperlink, HYPER_LINK_EXTERNAL_LINK_ALT_TEXT, HYPER_LINK_EXTERNAL_LINK_TITLE } from './Hyperlink';
 export { default as Icon } from './Icon';
 
 // // // // // // // // // // // // // // // // // // // // // // // // // // //
@@ -72,7 +73,6 @@ export {
   FormAutosuggestOption,
   InputGroup,
 } from './Form';
-export { default as Hyperlink, HYPER_LINK_EXTERNAL_LINK_ALT_TEXT, HYPER_LINK_EXTERNAL_LINK_TITLE } from './Hyperlink';
 export { default as IconButton, IconButtonWithTooltip } from './IconButton';
 export { default as IconButtonToggle } from './IconButtonToggle';
 export { default as Input } from './Input';

package/src/{setupTest.js → setupTest.ts}

@@ -1,3 +1,4 @@
+/* eslint-disable import/no-extraneous-dependencies */
 import 'regenerator-runtime/runtime';
 
 import '@testing-library/jest-dom';
@@ -20,6 +21,6 @@ class ResizeObserver {
 
 window.ResizeObserver = ResizeObserver;
 
-window.crypto = {
-  getRandomValues: arr => crypto.randomBytes(arr.length),
+(window as any).crypto = {
+  getRandomValues: (arr: any) => crypto.randomBytes(arr.length),
 };