@openedx/paragon 22.0.0-alpha.23 → 22.0.0-alpha.25

package/dist/Menu/MenuItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuItem.js","names":["React","PropTypes","classNames","Icon","MenuItem","_ref","as","children","defaultSelected","iconAfter","iconBefore","props","_objectWithoutProperties","_excluded","className","createElement","_objectSpread","Fragment","src","propTypes","bool","string","node","elementType","oneOfType","element","func","defaultProps","undefined"],"sources":["../../src/Menu/MenuItem.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport Icon from '../Icon';\n\nfunction MenuItem({\n  as,\n  children,\n  defaultSelected,\n  iconAfter,\n  iconBefore,\n  ...props\n}) {\n  const className = classNames(props.className, 'pgn__menu-item');\n\n  return React.createElement(\n    as,\n    {\n      ...props,\n      className,\n    },\n    (\n      <>\n        {iconBefore && <Icon className=\"btn-icon-before\" src={iconBefore} />}\n        <span className=\"pgn__menu-item-text\">{children}</span>\n        <span className=\"pgn__menu-item-content-spacer\" />\n        {iconAfter && <Icon className=\"btn-icon-after\" src={iconAfter} />}\n      </>\n    ),\n  );\n}\n\nMenuItem.propTypes = {\n  /** Specifies that this ``MenuItem`` is selected inside the ``SelectMenu`` */\n  defaultSelected: PropTypes.bool,\n  /** Specifies class name to append to the base element */\n  className: PropTypes.string,\n  /** Specifies the content of the ``MenuItem`` */\n  children: PropTypes.node,\n  /** Specifies the base element */\n  as: PropTypes.elementType,\n  /** Specifies the jsx before the content of the ``MenuItem`` */\n  iconBefore: PropTypes.oneOfType([PropTypes.element, PropTypes.func]),\n  /** Specifies the jsx after the content of the ``MenuItem`` */\n  iconAfter: PropTypes.oneOfType([PropTypes.element, PropTypes.func]),\n};\n\nMenuItem.defaultProps = {\n  defaultSelected: false,\n  as: 'button',\n  className: undefined,\n  children: null,\n  iconBefore: undefined,\n  iconAfter: undefined,\n};\n\nexport default MenuItem;\n"],"mappings":";;;;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,IAAI,MAAM,SAAS;AAE1B,SAASC,QAAQA,CAAAC,IAAA,EAOd;EAAA,IAPe;MAChBC,EAAE;MACFC,QAAQ;MACRC,eAAe;MACfC,SAAS;MACTC;IAEF,CAAC,GAAAL,IAAA;IADIM,KAAK,GAAAC,wBAAA,CAAAP,IAAA,EAAAQ,SAAA;EAER,MAAMC,SAAS,GAAGZ,UAAU,CAACS,KAAK,CAACG,SAAS,EAAE,gBAAgB,CAAC;EAE/D,oBAAOd,KAAK,CAACe,aAAa,CACxBT,EAAE,EAAAU,aAAA,CAAAA,aAAA,KAEGL,KAAK;IACRG;EAAS,iBAGTd,KAAA,CAAAe,aAAA,CAAAf,KAAA,CAAAiB,QAAA,QACGP,UAAU,iBAAIV,KAAA,CAAAe,aAAA,CAACZ,IAAI;IAACW,SAAS,EAAC,iBAAiB;IAACI,GAAG,EAAER;EAAW,CAAE,CAAC,eACpEV,KAAA,CAAAe,aAAA;IAAMD,SAAS,EAAC;EAAqB,GAAEP,QAAe,CAAC,eACvDP,KAAA,CAAAe,aAAA;IAAMD,SAAS,EAAC;EAA+B,CAAE,CAAC,EACjDL,SAAS,iBAAIT,KAAA,CAAAe,aAAA,CAACZ,IAAI;IAACW,SAAS,EAAC,gBAAgB;IAACI,GAAG,EAAET;EAAU,CAAE,CAChE,CAEN,CAAC;AACH;AAEAL,QAAQ,CAACe,SAAS,GAAG;EACnB;EACAX,eAAe,EAAEP,SAAS,CAACmB,IAAI;EAC/B;EACAN,SAAS,EAAEb,SAAS,CAACoB,MAAM;EAC3B;EACAd,QAAQ,EAAEN,SAAS,CAACqB,IAAI;EACxB;EACAhB,EAAE,EAAEL,SAAS,CAACsB,WAAW;EACzB;EACAb,UAAU,EAAET,SAAS,CAACuB,SAAS,CAAC,CAACvB,SAAS,CAACwB,OAAO,EAAExB,SAAS,CAACyB,IAAI,CAAC,CAAC;EACpE;EACAjB,SAAS,EAAER,SAAS,CAACuB,SAAS,CAAC,CAACvB,SAAS,CAACwB,OAAO,EAAExB,SAAS,CAACyB,IAAI,CAAC;AACpE,CAAC;AAEDtB,QAAQ,CAACuB,YAAY,GAAG;EACtBnB,eAAe,EAAE,KAAK;EACtBF,EAAE,EAAE,QAAQ;EACZQ,SAAS,EAAEc,SAAS;EACpBrB,QAAQ,EAAE,IAAI;EACdG,UAAU,EAAEkB,SAAS;EACrBnB,SAAS,EAAEmB;AACb,CAAC;AAED,eAAexB,QAAQ"}
+{"version":3,"file":"MenuItem.js","names":["React","PropTypes","classNames","Icon","MenuItem","_ref","as","children","defaultSelected","iconAfter","iconBefore","props","_objectWithoutProperties","_excluded","className","createElement","_objectSpread","Fragment","src","propTypes","bool","string","node","elementType","oneOfType","element","defaultProps","undefined"],"sources":["../../src/Menu/MenuItem.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport Icon from '../Icon';\n\nfunction MenuItem({\n  as,\n  children,\n  defaultSelected,\n  iconAfter,\n  iconBefore,\n  ...props\n}) {\n  const className = classNames(props.className, 'pgn__menu-item');\n\n  return React.createElement(\n    as,\n    {\n      ...props,\n      className,\n    },\n    (\n      <>\n        {iconBefore && <Icon className=\"btn-icon-before\" src={iconBefore} />}\n        <span className=\"pgn__menu-item-text\">{children}</span>\n        <span className=\"pgn__menu-item-content-spacer\" />\n        {iconAfter && <Icon className=\"btn-icon-after\" src={iconAfter} />}\n      </>\n    ),\n  );\n}\n\nMenuItem.propTypes = {\n  /** Specifies that this ``MenuItem`` is selected inside the ``SelectMenu`` */\n  defaultSelected: PropTypes.bool,\n  /** Specifies class name to append to the base element */\n  className: PropTypes.string,\n  /** Specifies the content of the ``MenuItem`` */\n  children: PropTypes.node,\n  /** Specifies the base element */\n  as: PropTypes.elementType,\n  /** Specifies the jsx before the content of the ``MenuItem`` */\n  iconBefore: PropTypes.oneOfType([PropTypes.element, PropTypes.elementType]),\n  /** Specifies the jsx after the content of the ``MenuItem`` */\n  iconAfter: PropTypes.oneOfType([PropTypes.element, PropTypes.elementType]),\n};\n\nMenuItem.defaultProps = {\n  defaultSelected: false,\n  as: 'button',\n  className: undefined,\n  children: null,\n  iconBefore: undefined,\n  iconAfter: undefined,\n};\n\nexport default MenuItem;\n"],"mappings":";;;;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,IAAI,MAAM,SAAS;AAE1B,SAASC,QAAQA,CAAAC,IAAA,EAOd;EAAA,IAPe;MAChBC,EAAE;MACFC,QAAQ;MACRC,eAAe;MACfC,SAAS;MACTC;IAEF,CAAC,GAAAL,IAAA;IADIM,KAAK,GAAAC,wBAAA,CAAAP,IAAA,EAAAQ,SAAA;EAER,MAAMC,SAAS,GAAGZ,UAAU,CAACS,KAAK,CAACG,SAAS,EAAE,gBAAgB,CAAC;EAE/D,oBAAOd,KAAK,CAACe,aAAa,CACxBT,EAAE,EAAAU,aAAA,CAAAA,aAAA,KAEGL,KAAK;IACRG;EAAS,iBAGTd,KAAA,CAAAe,aAAA,CAAAf,KAAA,CAAAiB,QAAA,QACGP,UAAU,iBAAIV,KAAA,CAAAe,aAAA,CAACZ,IAAI;IAACW,SAAS,EAAC,iBAAiB;IAACI,GAAG,EAAER;EAAW,CAAE,CAAC,eACpEV,KAAA,CAAAe,aAAA;IAAMD,SAAS,EAAC;EAAqB,GAAEP,QAAe,CAAC,eACvDP,KAAA,CAAAe,aAAA;IAAMD,SAAS,EAAC;EAA+B,CAAE,CAAC,EACjDL,SAAS,iBAAIT,KAAA,CAAAe,aAAA,CAACZ,IAAI;IAACW,SAAS,EAAC,gBAAgB;IAACI,GAAG,EAAET;EAAU,CAAE,CAChE,CAEN,CAAC;AACH;AAEAL,QAAQ,CAACe,SAAS,GAAG;EACnB;EACAX,eAAe,EAAEP,SAAS,CAACmB,IAAI;EAC/B;EACAN,SAAS,EAAEb,SAAS,CAACoB,MAAM;EAC3B;EACAd,QAAQ,EAAEN,SAAS,CAACqB,IAAI;EACxB;EACAhB,EAAE,EAAEL,SAAS,CAACsB,WAAW;EACzB;EACAb,UAAU,EAAET,SAAS,CAACuB,SAAS,CAAC,CAACvB,SAAS,CAACwB,OAAO,EAAExB,SAAS,CAACsB,WAAW,CAAC,CAAC;EAC3E;EACAd,SAAS,EAAER,SAAS,CAACuB,SAAS,CAAC,CAACvB,SAAS,CAACwB,OAAO,EAAExB,SAAS,CAACsB,WAAW,CAAC;AAC3E,CAAC;AAEDnB,QAAQ,CAACsB,YAAY,GAAG;EACtBlB,eAAe,EAAE,KAAK;EACtBF,EAAE,EAAE,QAAQ;EACZQ,SAAS,EAAEa,SAAS;EACpBpB,QAAQ,EAAE,IAAI;EACdG,UAAU,EAAEiB,SAAS;EACrBlB,SAAS,EAAEkB;AACb,CAAC;AAED,eAAevB,QAAQ"}

package/dist/Modal/ModalDialog.js

@@ -107,6 +107,9 @@ ModalDialog.propTypes = {
    * Prevent clicking on the backdrop to close the modal
    */
   isBlocking: PropTypes.bool,
+  /**
+   * Specifies the z-index of the modal
+   */
   zIndex: PropTypes.number
 };
 ModalDialog.defaultProps = {

package/dist/Modal/ModalDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalDialog.js","names":["React","PropTypes","classNames","useMediaQuery","ModalLayer","ModalCloseButton","ModalDialogHeader","ModalDialogTitle","ModalDialogFooter","ModalDialogBody","ModalDialogHero","Icon","IconButton","Close","MODAL_DIALOG_CLOSE_LABEL","ModalDialog","_ref","children","title","isOpen","onClose","size","variant","hasCloseButton","closeLabel","isFullscreenScroll","className","isFullscreenOnMobile","isBlocking","zIndex","isMobile","query","showFullScreen","createElement","role","as","iconAs","invertColors","src","alt","propTypes","node","isRequired","string","func","bool","oneOf","number","defaultProps","undefined","Header","Title","Footer","CloseButton","Body","Hero"],"sources":["../../src/Modal/ModalDialog.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { useMediaQuery } from 'react-responsive';\nimport ModalLayer from './ModalLayer';\nimport ModalCloseButton from './ModalCloseButton';\nimport ModalDialogHeader from './ModalDialogHeader';\nimport ModalDialogTitle from './ModalDialogTitle';\nimport ModalDialogFooter from './ModalDialogFooter';\nimport ModalDialogBody from './ModalDialogBody';\nimport ModalDialogHero from './ModalDialogHero';\n\nimport Icon from '../Icon';\nimport IconButton from '../IconButton';\nimport { Close } from '../../icons';\n\nexport const MODAL_DIALOG_CLOSE_LABEL = 'Close';\n\nfunction ModalDialog({\n  children,\n  title,\n  isOpen,\n  onClose,\n  size,\n  variant,\n  hasCloseButton,\n  closeLabel,\n  isFullscreenScroll,\n  className,\n  isFullscreenOnMobile,\n  isBlocking,\n  zIndex,\n}) {\n  const isMobile = useMediaQuery({ query: '(max-width: 767.98px)' });\n  const showFullScreen = (isFullscreenOnMobile && isMobile);\n  return (\n    <ModalLayer isOpen={isOpen} onClose={onClose} isBlocking={isBlocking} zIndex={zIndex}>\n      <div\n        role=\"dialog\"\n        aria-label={title}\n        className={classNames(\n          'pgn__modal',\n          {\n            [`pgn__modal-${showFullScreen ? 'fullscreen' : size}`]: size,\n            [`pgn__modal-${variant}`]: variant,\n            'pgn__modal-scroll-fullscreen': isFullscreenScroll,\n          },\n          className,\n        )}\n      >\n        {hasCloseButton && (\n          <div className=\"pgn__modal-close-container\">\n            <ModalCloseButton\n              as={IconButton}\n              iconAs={Icon}\n              invertColors={variant === 'dark'}\n              src={Close}\n              alt={closeLabel}\n            />\n          </div>\n        )}\n        {children}\n      </div>\n    </ModalLayer>\n  );\n}\n\nModalDialog.propTypes = {\n  /**\n   *  Specifies the content of the dialog\n   */\n  children: PropTypes.node.isRequired,\n  /**\n   * The aria-label of the dialog\n   */\n  title: PropTypes.string.isRequired,\n  /**\n   * A callback to close the modal dialog\n   */\n  onClose: PropTypes.func.isRequired,\n  /**\n   * Is the modal dialog open or closed\n   */\n  isOpen: PropTypes.bool,\n  /**\n   * The close 'x' icon button in the top right of the dialog box\n   */\n  hasCloseButton: PropTypes.bool,\n  /**\n   * Sizes determine the maximum width of the dialog box\n   */\n  size: PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'fullscreen']),\n  /**\n   * The visual style of the dialog box\n   */\n  variant: PropTypes.oneOf(['default', 'warning', 'danger', 'success', 'dark']),\n  /**\n   * The label supplied to the close icon button if one is rendered\n   */\n  closeLabel: PropTypes.string,\n  /**\n   *  Specifies class name to append to the base element\n   */\n  className: PropTypes.string,\n  /**\n   * Determines where a scrollbar should appear if a modal is too large for the\n   * viewport. When false, the ``ModalDialog``. Body receives a scrollbar, when true\n   * the browser window itself receives the scrollbar.\n   */\n  isFullscreenScroll: PropTypes.bool,\n  /**\n   * To show full screen view on mobile screens\n   */\n  isFullscreenOnMobile: PropTypes.bool,\n  /**\n   * Prevent clicking on the backdrop to close the modal\n   */\n  isBlocking: PropTypes.bool,\n  zIndex: PropTypes.number,\n};\n\nModalDialog.defaultProps = {\n  isOpen: false,\n  hasCloseButton: true,\n  size: 'md',\n  variant: 'default',\n  closeLabel: MODAL_DIALOG_CLOSE_LABEL,\n  className: undefined,\n  isFullscreenScroll: false,\n  isFullscreenOnMobile: false,\n  isBlocking: false,\n  zIndex: undefined,\n};\n\nModalDialog.Header = ModalDialogHeader;\nModalDialog.Title = ModalDialogTitle;\nModalDialog.Footer = ModalDialogFooter;\nModalDialog.CloseButton = ModalCloseButton;\nModalDialog.Body = ModalDialogBody;\nModalDialog.Hero = ModalDialogHero;\n\nexport default ModalDialog;\n"],"mappings":"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"}
+{"version":3,"file":"ModalDialog.js","names":["React","PropTypes","classNames","useMediaQuery","ModalLayer","ModalCloseButton","ModalDialogHeader","ModalDialogTitle","ModalDialogFooter","ModalDialogBody","ModalDialogHero","Icon","IconButton","Close","MODAL_DIALOG_CLOSE_LABEL","ModalDialog","_ref","children","title","isOpen","onClose","size","variant","hasCloseButton","closeLabel","isFullscreenScroll","className","isFullscreenOnMobile","isBlocking","zIndex","isMobile","query","showFullScreen","createElement","role","as","iconAs","invertColors","src","alt","propTypes","node","isRequired","string","func","bool","oneOf","number","defaultProps","undefined","Header","Title","Footer","CloseButton","Body","Hero"],"sources":["../../src/Modal/ModalDialog.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { useMediaQuery } from 'react-responsive';\nimport ModalLayer from './ModalLayer';\nimport ModalCloseButton from './ModalCloseButton';\nimport ModalDialogHeader from './ModalDialogHeader';\nimport ModalDialogTitle from './ModalDialogTitle';\nimport ModalDialogFooter from './ModalDialogFooter';\nimport ModalDialogBody from './ModalDialogBody';\nimport ModalDialogHero from './ModalDialogHero';\n\nimport Icon from '../Icon';\nimport IconButton from '../IconButton';\nimport { Close } from '../../icons';\n\nexport const MODAL_DIALOG_CLOSE_LABEL = 'Close';\n\nfunction ModalDialog({\n  children,\n  title,\n  isOpen,\n  onClose,\n  size,\n  variant,\n  hasCloseButton,\n  closeLabel,\n  isFullscreenScroll,\n  className,\n  isFullscreenOnMobile,\n  isBlocking,\n  zIndex,\n}) {\n  const isMobile = useMediaQuery({ query: '(max-width: 767.98px)' });\n  const showFullScreen = (isFullscreenOnMobile && isMobile);\n  return (\n    <ModalLayer isOpen={isOpen} onClose={onClose} isBlocking={isBlocking} zIndex={zIndex}>\n      <div\n        role=\"dialog\"\n        aria-label={title}\n        className={classNames(\n          'pgn__modal',\n          {\n            [`pgn__modal-${showFullScreen ? 'fullscreen' : size}`]: size,\n            [`pgn__modal-${variant}`]: variant,\n            'pgn__modal-scroll-fullscreen': isFullscreenScroll,\n          },\n          className,\n        )}\n      >\n        {hasCloseButton && (\n          <div className=\"pgn__modal-close-container\">\n            <ModalCloseButton\n              as={IconButton}\n              iconAs={Icon}\n              invertColors={variant === 'dark'}\n              src={Close}\n              alt={closeLabel}\n            />\n          </div>\n        )}\n        {children}\n      </div>\n    </ModalLayer>\n  );\n}\n\nModalDialog.propTypes = {\n  /**\n   *  Specifies the content of the dialog\n   */\n  children: PropTypes.node.isRequired,\n  /**\n   * The aria-label of the dialog\n   */\n  title: PropTypes.string.isRequired,\n  /**\n   * A callback to close the modal dialog\n   */\n  onClose: PropTypes.func.isRequired,\n  /**\n   * Is the modal dialog open or closed\n   */\n  isOpen: PropTypes.bool,\n  /**\n   * The close 'x' icon button in the top right of the dialog box\n   */\n  hasCloseButton: PropTypes.bool,\n  /**\n   * Sizes determine the maximum width of the dialog box\n   */\n  size: PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'fullscreen']),\n  /**\n   * The visual style of the dialog box\n   */\n  variant: PropTypes.oneOf(['default', 'warning', 'danger', 'success', 'dark']),\n  /**\n   * The label supplied to the close icon button if one is rendered\n   */\n  closeLabel: PropTypes.string,\n  /**\n   *  Specifies class name to append to the base element\n   */\n  className: PropTypes.string,\n  /**\n   * Determines where a scrollbar should appear if a modal is too large for the\n   * viewport. When false, the ``ModalDialog``. Body receives a scrollbar, when true\n   * the browser window itself receives the scrollbar.\n   */\n  isFullscreenScroll: PropTypes.bool,\n  /**\n   * To show full screen view on mobile screens\n   */\n  isFullscreenOnMobile: PropTypes.bool,\n  /**\n   * Prevent clicking on the backdrop to close the modal\n   */\n  isBlocking: PropTypes.bool,\n  /**\n   * Specifies the z-index of the modal\n   */\n  zIndex: PropTypes.number,\n};\n\nModalDialog.defaultProps = {\n  isOpen: false,\n  hasCloseButton: true,\n  size: 'md',\n  variant: 'default',\n  closeLabel: MODAL_DIALOG_CLOSE_LABEL,\n  className: undefined,\n  isFullscreenScroll: false,\n  isFullscreenOnMobile: false,\n  isBlocking: false,\n  zIndex: undefined,\n};\n\nModalDialog.Header = ModalDialogHeader;\nModalDialog.Title = ModalDialogTitle;\nModalDialog.Footer = ModalDialogFooter;\nModalDialog.CloseButton = ModalCloseButton;\nModalDialog.Body = ModalDialogBody;\nModalDialog.Hero = ModalDialogHero;\n\nexport default ModalDialog;\n"],"mappings":"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"}

package/dist/Popover/index.js

@@ -10,17 +10,17 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 import React from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
-import Popover from 'react-bootstrap/Popover';
+import BasePopover from 'react-bootstrap/Popover';
 import BasePopoverTitle from 'react-bootstrap/PopoverTitle';
 import BasePopoverContent from 'react-bootstrap/PopoverContent';
 const PLACEMENT_VARIANTS = ['auto', 'top', 'bottom', 'left', 'right'];
-const WrapperPopover = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+const Popover = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
       children,
       variant
     } = _ref,
     props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(Popover, _extends({}, props, {
+  return /*#__PURE__*/React.createElement(BasePopover, _extends({}, props, {
     className: classNames({
       [`popover-${variant}`]: !!variant
     }, props.className),
@@ -41,7 +41,7 @@ const commonPropTypes = {
 };
 PopoverTitle.propTypes = commonPropTypes;
 PopoverContent.propTypes = commonPropTypes;
-WrapperPopover.propTypes = _objectSpread(_objectSpread({}, Popover.propTypes), {}, {
+Popover.propTypes = _objectSpread(_objectSpread({}, BasePopover.propTypes), {}, {
   /** An html id attribute, necessary for accessibility. */
   id: PropTypes.string.isRequired,
   /**
@@ -82,7 +82,7 @@ WrapperPopover.propTypes = _objectSpread(_objectSpread({}, Popover.propTypes), {
   /** The visual style of the `Overlay` */
   variant: PropTypes.string
 });
-WrapperPopover.defaultProps = _objectSpread(_objectSpread({}, Popover.defaultProps), {}, {
+Popover.defaultProps = _objectSpread(_objectSpread({}, BasePopover.defaultProps), {}, {
   placement: 'right',
   title: undefined,
   arrowProps: undefined,
@@ -101,8 +101,8 @@ PopoverContent.defaultProps = {
   as: 'div',
   bsPrefix: 'popover-body'
 };
-WrapperPopover.Title = PopoverTitle;
-WrapperPopover.Content = PopoverContent;
+Popover.Title = PopoverTitle;
+Popover.Content = PopoverContent;
 export { PopoverTitle, PopoverContent };
-export default WrapperPopover;
+export default Popover;
 //# sourceMappingURL=index.js.map

package/dist/Popover/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","PropTypes","classNames","Popover","BasePopoverTitle","BasePopoverContent","PLACEMENT_VARIANTS","WrapperPopover","forwardRef","_ref","ref","children","variant","props","_objectWithoutProperties","_excluded","createElement","_extends","className","PopoverTitle","PopoverContent","commonPropTypes","as","elementType","bsPrefix","string","propTypes","_objectSpread","id","isRequired","placement","oneOf","title","arrowProps","shape","oneOfType","func","current","element","style","content","bool","popper","show","node","defaultProps","undefined","Title","Content"],"sources":["../../src/Popover/index.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport Popover from 'react-bootstrap/Popover';\nimport BasePopoverTitle from 'react-bootstrap/PopoverTitle';\nimport BasePopoverContent from 'react-bootstrap/PopoverContent';\n\nconst PLACEMENT_VARIANTS = [\n  'auto',\n  'top',\n  'bottom',\n  'left',\n  'right',\n];\n\nconst WrapperPopover = React.forwardRef(({\n  children,\n  variant,\n  ...props\n}, ref) => (\n  <Popover\n    {...props}\n    className={classNames({ [`popover-${variant}`]: !!variant }, props.className)}\n    ref={ref}\n  >\n    {children}\n  </Popover>\n));\n\nfunction PopoverTitle(props) {\n  return <BasePopoverTitle {...props} />;\n}\nfunction PopoverContent(props) {\n  return <BasePopoverContent {...props} />;\n}\n\nconst commonPropTypes = {\n  /** Specifies the base element */\n  as: PropTypes.elementType,\n  /** Overrides underlying component base CSS class name */\n  bsPrefix: PropTypes.string,\n};\n\nPopoverTitle.propTypes = commonPropTypes;\nPopoverContent.propTypes = commonPropTypes;\n\nWrapperPopover.propTypes = {\n  ...Popover.propTypes,\n  /** An html id attribute, necessary for accessibility. */\n  id: PropTypes.string.isRequired,\n  /**\n   * Sets the direction the Popover is positioned towards.\n   *\n   * This is generally provided by the `Overlay` component positioning the popover.\n   */\n  placement: PropTypes.oneOf(PLACEMENT_VARIANTS),\n  /**\n   * When this prop is set, it creates a `Popover` with\n   * a `Popover.Title` inside passing the children directly to it.\n   */\n  title: PropTypes.string,\n  /**\n   * An `Overlay` injected set of props for positioning the popover arrow.\n   *\n   * This is generally provided by the `Overlay` component positioning the popover.\n   */\n  arrowProps: PropTypes.shape({\n    ref: PropTypes.oneOfType([\n      PropTypes.func,\n      PropTypes.shape({ current: PropTypes.element }),\n    ]),\n    style: PropTypes.shape({}),\n  }),\n  /**\n   * When this prop is set, it creates a `Popover` with\n   * a `Popover.Content` inside passing the children directly to it.\n   */\n  content: PropTypes.bool,\n  /** A `Popper.js` config object passed to the the underlying popper instance. */\n  popper: PropTypes.shape({}),\n  /** Whether the `Overlay` is shown. */\n  show: PropTypes.bool,\n  /** Specifies the content of the `Overlay` */\n  children: PropTypes.node,\n  /** Specifies class name to append to the base element */\n  className: PropTypes.string,\n  /** The visual style of the `Overlay` */\n  variant: PropTypes.string,\n};\n\nWrapperPopover.defaultProps = {\n  ...Popover.defaultProps,\n  placement: 'right',\n  title: undefined,\n  arrowProps: undefined,\n  content: undefined,\n  popper: undefined,\n  show: undefined,\n  children: undefined,\n  className: undefined,\n  variant: undefined,\n};\n\nPopoverTitle.defaultProps = {\n  as: 'div',\n  bsPrefix: 'popover-header',\n};\n\nPopoverContent.defaultProps = {\n  as: 'div',\n  bsPrefix: 'popover-body',\n};\n\nWrapperPopover.Title = PopoverTitle;\nWrapperPopover.Content = PopoverContent;\n\nexport { PopoverTitle, PopoverContent };\nexport default WrapperPopover;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["React","PropTypes","classNames","BasePopover","BasePopoverTitle","BasePopoverContent","PLACEMENT_VARIANTS","Popover","forwardRef","_ref","ref","children","variant","props","_objectWithoutProperties","_excluded","createElement","_extends","className","PopoverTitle","PopoverContent","commonPropTypes","as","elementType","bsPrefix","string","propTypes","_objectSpread","id","isRequired","placement","oneOf","title","arrowProps","shape","oneOfType","func","current","element","style","content","bool","popper","show","node","defaultProps","undefined","Title","Content"],"sources":["../../src/Popover/index.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport BasePopover from 'react-bootstrap/Popover';\nimport BasePopoverTitle from 'react-bootstrap/PopoverTitle';\nimport BasePopoverContent from 'react-bootstrap/PopoverContent';\n\nconst PLACEMENT_VARIANTS = [\n  'auto',\n  'top',\n  'bottom',\n  'left',\n  'right',\n];\n\nconst Popover = React.forwardRef(({\n  children,\n  variant,\n  ...props\n}, ref) => (\n  <BasePopover\n    {...props}\n    className={classNames({ [`popover-${variant}`]: !!variant }, props.className)}\n    ref={ref}\n  >\n    {children}\n  </BasePopover>\n));\n\nfunction PopoverTitle(props) {\n  return <BasePopoverTitle {...props} />;\n}\nfunction PopoverContent(props) {\n  return <BasePopoverContent {...props} />;\n}\n\nconst commonPropTypes = {\n  /** Specifies the base element */\n  as: PropTypes.elementType,\n  /** Overrides underlying component base CSS class name */\n  bsPrefix: PropTypes.string,\n};\n\nPopoverTitle.propTypes = commonPropTypes;\nPopoverContent.propTypes = commonPropTypes;\n\nPopover.propTypes = {\n  ...BasePopover.propTypes,\n  /** An html id attribute, necessary for accessibility. */\n  id: PropTypes.string.isRequired,\n  /**\n   * Sets the direction the Popover is positioned towards.\n   *\n   * This is generally provided by the `Overlay` component positioning the popover.\n   */\n  placement: PropTypes.oneOf(PLACEMENT_VARIANTS),\n  /**\n   * When this prop is set, it creates a `Popover` with\n   * a `Popover.Title` inside passing the children directly to it.\n   */\n  title: PropTypes.string,\n  /**\n   * An `Overlay` injected set of props for positioning the popover arrow.\n   *\n   * This is generally provided by the `Overlay` component positioning the popover.\n   */\n  arrowProps: PropTypes.shape({\n    ref: PropTypes.oneOfType([\n      PropTypes.func,\n      PropTypes.shape({ current: PropTypes.element }),\n    ]),\n    style: PropTypes.shape({}),\n  }),\n  /**\n   * When this prop is set, it creates a `Popover` with\n   * a `Popover.Content` inside passing the children directly to it.\n   */\n  content: PropTypes.bool,\n  /** A `Popper.js` config object passed to the the underlying popper instance. */\n  popper: PropTypes.shape({}),\n  /** Whether the `Overlay` is shown. */\n  show: PropTypes.bool,\n  /** Specifies the content of the `Overlay` */\n  children: PropTypes.node,\n  /** Specifies class name to append to the base element */\n  className: PropTypes.string,\n  /** The visual style of the `Overlay` */\n  variant: PropTypes.string,\n};\n\nPopover.defaultProps = {\n  ...BasePopover.defaultProps,\n  placement: 'right',\n  title: undefined,\n  arrowProps: undefined,\n  content: undefined,\n  popper: undefined,\n  show: undefined,\n  children: undefined,\n  className: undefined,\n  variant: undefined,\n};\n\nPopoverTitle.defaultProps = {\n  as: 'div',\n  bsPrefix: 'popover-header',\n};\n\nPopoverContent.defaultProps = {\n  as: 'div',\n  bsPrefix: 'popover-body',\n};\n\nPopover.Title = PopoverTitle;\nPopover.Content = PopoverContent;\n\nexport { PopoverTitle, PopoverContent };\nexport default Popover;\n"],"mappings":"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"}

package/dist/ProductTour/Checkpoint.js

@@ -12,6 +12,7 @@ import CheckpointActionRow from './CheckpointActionRow';
 import CheckpointBody from './CheckpointBody';
 import CheckpointBreadcrumbs from './CheckpointBreadcrumbs';
 import CheckpointTitle from './CheckpointTitle';
+import messages from './messages';
 const Checkpoint = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
       body,
@@ -95,14 +96,11 @@ const Checkpoint = /*#__PURE__*/React.forwardRef((_ref, ref) => {
     }
   }, /*#__PURE__*/React.createElement("span", {
     className: "sr-only"
-  }, /*#__PURE__*/React.createElement(FormattedMessage, {
-    id: "pgn.ProductTour.Checkpoint.position-text",
-    defaultMessage: "Top of step {step}",
-    value: {
+  }, /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, messages.topPositionText, {
+    values: {
       step: index + 1
-    },
-    description: "Screen-reader message to indicate the user's position in a sequence of checkpoints."
-  })), (title || !isOnlyCheckpoint) && /*#__PURE__*/React.createElement("div", {
+    }
+  }))), (title || !isOnlyCheckpoint) && /*#__PURE__*/React.createElement("div", {
     className: "pgn__checkpoint-header"
   }, /*#__PURE__*/React.createElement(CheckpointTitle, null, title), /*#__PURE__*/React.createElement(CheckpointBreadcrumbs, {
     currentIndex: index,
@@ -115,7 +113,11 @@ const Checkpoint = /*#__PURE__*/React.forwardRef((_ref, ref) => {
     "data-popper-arrow": true
   }), /*#__PURE__*/React.createElement("span", {
     className: "sr-only"
-  }, "Bottom of step ", index + 1));
+  }, /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, messages.bottomPositionText, {
+    values: {
+      step: index + 1
+    }
+  }))));
 });
 Checkpoint.defaultProps = {
   advanceButtonText: null,

package/dist/ProductTour/Checkpoint.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkpoint.js","names":["React","useEffect","useState","useMediaQuery","PropTypes","createPopper","FormattedMessage","breakpoints","CheckpointActionRow","CheckpointBody","CheckpointBreadcrumbs","CheckpointTitle","Checkpoint","forwardRef","_ref","ref","body","index","placement","target","title","totalCheckpoints","props","_objectWithoutProperties","_excluded","checkpointVisible","setCheckpointVisible","isMobile","maxWidth","small","targetElement","document","querySelector","checkpoint","checkpointPopper","strategy","modifiers","name","options","padding","offset","tetherOffset","forceUpdate","targetOffset","getBoundingClientRect","top","bottom","global","innerHeight","includes","scrollTo","behavior","button","focus","isLastCheckpoint","isOnlyCheckpoint","createElement","id","className","role","style","visibility","pointerEvents","defaultMessage","value","step","description","currentIndex","_extends","defaultProps","advanceButtonText","dismissButtonText","endButtonText","showDismissButton","undefined","propTypes","node","number","isRequired","onAdvance","func","onDismiss","onEnd","oneOf","string","bool"],"sources":["../../src/ProductTour/Checkpoint.jsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { useMediaQuery } from 'react-responsive';\nimport PropTypes from 'prop-types';\nimport { createPopper } from '@popperjs/core';\nimport { FormattedMessage } from 'react-intl';\n\nimport breakpoints from '../utils/breakpoints';\n\nimport CheckpointActionRow from './CheckpointActionRow';\nimport CheckpointBody from './CheckpointBody';\nimport CheckpointBreadcrumbs from './CheckpointBreadcrumbs';\nimport CheckpointTitle from './CheckpointTitle';\n\nconst Checkpoint = React.forwardRef(({\n  body,\n  index,\n  placement,\n  target,\n  title,\n  totalCheckpoints,\n  ...props\n}, ref) => {\n  const [checkpointVisible, setCheckpointVisible] = useState(false);\n  const isMobile = useMediaQuery({ maxWidth: breakpoints.small.maxWidth });\n\n  useEffect(() => {\n    const targetElement = document.querySelector(target);\n    const checkpoint = document.querySelector('#pgn__checkpoint');\n    if (targetElement && checkpoint) {\n      // Use the Popper library to translate the Checkpoint to its target's coordinates\n      const checkpointPopper = createPopper(targetElement, checkpoint, {\n        placement: isMobile ? 'top' : placement,\n        strategy: 'fixed',\n        modifiers: [\n          {\n            name: 'arrow',\n            options: {\n              padding: 25,\n            },\n          },\n          {\n            name: 'offset',\n            options: {\n              offset: [0, 20],\n            },\n          },\n          {\n            name: 'preventOverflow',\n            options: {\n              padding: 20,\n              tetherOffset: 35,\n            },\n          },\n        ],\n      });\n      setCheckpointVisible(true);\n      if (checkpointPopper) {\n        checkpointPopper.forceUpdate();\n      }\n    }\n  }, [target, isMobile, placement]);\n\n  useEffect(() => {\n    if (checkpointVisible) {\n      // Scroll the Checkpoint into view once its rendered\n      const targetElement = document.querySelector(target);\n      let targetOffset = targetElement.getBoundingClientRect().top;\n      if ((targetOffset < 0) || (targetElement.getBoundingClientRect().bottom > global.innerHeight)) {\n        if (placement.includes('top')) {\n          if (targetOffset < 0) {\n            targetOffset *= -1;\n          }\n          targetOffset -= 280;\n        } else {\n          targetOffset -= 80;\n        }\n\n        global.scrollTo({\n          top: targetOffset, behavior: 'smooth',\n        });\n      }\n\n      const button = document.querySelector('.pgn__checkpoint-button_advance');\n      button.focus();\n    }\n  }, [target, checkpointVisible, placement]);\n\n  const isLastCheckpoint = index + 1 === totalCheckpoints;\n  const isOnlyCheckpoint = totalCheckpoints === 1;\n\n  return (\n    <div\n      id=\"pgn__checkpoint\"\n      className=\"pgn__checkpoint\"\n      aria-labelledby=\"pgn__checkpoint-title\"\n      ref={ref}\n      role=\"dialog\"\n      style={{ visibility: checkpointVisible ? 'visible' : 'hidden', pointerEvents: checkpointVisible ? 'auto' : 'none' }}\n    >\n      <span className=\"sr-only\">\n        <FormattedMessage\n          id=\"pgn.ProductTour.Checkpoint.position-text\"\n          defaultMessage=\"Top of step {step}\"\n          value={{ step: index + 1 }}\n          description=\"Screen-reader message to indicate the user's position in a sequence of checkpoints.\"\n        />\n      </span>\n      {(title || !isOnlyCheckpoint) && (\n        <div className=\"pgn__checkpoint-header\">\n          <CheckpointTitle>{title}</CheckpointTitle>\n          <CheckpointBreadcrumbs currentIndex={index} totalCheckpoints={totalCheckpoints} />\n        </div>\n      )}\n      <CheckpointBody>{body}</CheckpointBody>\n      <CheckpointActionRow\n        isLastCheckpoint={isLastCheckpoint}\n        index={index}\n        {...props}\n      />\n      <div id=\"pgn__checkpoint-arrow\" data-popper-arrow />\n      {/* This text is not translated due to Paragon's lack of i18n support */}\n      <span className=\"sr-only\">Bottom of step {index + 1}</span>\n    </div>\n  );\n});\n\nCheckpoint.defaultProps = {\n  advanceButtonText: null,\n  body: null,\n  dismissButtonText: null,\n  endButtonText: null,\n  placement: 'top',\n  title: null,\n  showDismissButton: undefined,\n};\n\nCheckpoint.propTypes = {\n  /** The text displayed on the button used to advance the tour for the given Checkpoint. */\n  advanceButtonText: PropTypes.node,\n  /** The text displayed in the body of the Checkpoint */\n  body: PropTypes.node,\n  /** The text displayed on the button used to dismiss the tour for the given Checkpoint. */\n  dismissButtonText: PropTypes.node,\n  /** The text displayed on the button used to end the tour for the given Checkpoint. */\n  endButtonText: PropTypes.node,\n  /** The current index of the given Checkpoint */\n  index: PropTypes.number.isRequired,\n  /** A function that runs when triggering the `onClick` event of the advance\n   * button for the given Checkpoint. */\n  onAdvance: PropTypes.func.isRequired,\n  /** A function that runs when triggering the `onClick` event of the dismiss\n   * button for the given Checkpoint. */\n  onDismiss: PropTypes.func.isRequired,\n  /** A function that runs when triggering the `onClick` event of the advance\n   * button if the given Checkpoint is the only or last Checkpoint in a tour. */\n  onEnd: PropTypes.func.isRequired,\n  /** A string that dictates the alignment of the Checkpoint around its target. */\n  placement: PropTypes.oneOf([\n    'top', 'top-start', 'top-end', 'right-start', 'right', 'right-end',\n    'left-start', 'left', 'left-end', 'bottom', 'bottom-start', 'bottom-end',\n  ]),\n  /** The CSS selector for the Checkpoint's desired target. */\n  target: PropTypes.string.isRequired,\n  /** The text displayed in the title of the Checkpoint */\n  title: PropTypes.node,\n  /** The total number of Checkpoints in a tour */\n  totalCheckpoints: PropTypes.number.isRequired,\n  /** Enforces visibility of the dismiss button under all circumstances */\n  showDismissButton: PropTypes.bool,\n};\n\nexport default Checkpoint;\n"],"mappings":"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"}
+{"version":3,"file":"Checkpoint.js","names":["React","useEffect","useState","useMediaQuery","PropTypes","createPopper","FormattedMessage","breakpoints","CheckpointActionRow","CheckpointBody","CheckpointBreadcrumbs","CheckpointTitle","messages","Checkpoint","forwardRef","_ref","ref","body","index","placement","target","title","totalCheckpoints","props","_objectWithoutProperties","_excluded","checkpointVisible","setCheckpointVisible","isMobile","maxWidth","small","targetElement","document","querySelector","checkpoint","checkpointPopper","strategy","modifiers","name","options","padding","offset","tetherOffset","forceUpdate","targetOffset","getBoundingClientRect","top","bottom","global","innerHeight","includes","scrollTo","behavior","button","focus","isLastCheckpoint","isOnlyCheckpoint","createElement","id","className","role","style","visibility","pointerEvents","_extends","topPositionText","values","step","currentIndex","bottomPositionText","defaultProps","advanceButtonText","dismissButtonText","endButtonText","showDismissButton","undefined","propTypes","node","number","isRequired","onAdvance","func","onDismiss","onEnd","oneOf","string","bool"],"sources":["../../src/ProductTour/Checkpoint.jsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { useMediaQuery } from 'react-responsive';\nimport PropTypes from 'prop-types';\nimport { createPopper } from '@popperjs/core';\nimport { FormattedMessage } from 'react-intl';\n\nimport breakpoints from '../utils/breakpoints';\n\nimport CheckpointActionRow from './CheckpointActionRow';\nimport CheckpointBody from './CheckpointBody';\nimport CheckpointBreadcrumbs from './CheckpointBreadcrumbs';\nimport CheckpointTitle from './CheckpointTitle';\nimport messages from './messages';\n\nconst Checkpoint = React.forwardRef(({\n  body,\n  index,\n  placement,\n  target,\n  title,\n  totalCheckpoints,\n  ...props\n}, ref) => {\n  const [checkpointVisible, setCheckpointVisible] = useState(false);\n  const isMobile = useMediaQuery({ maxWidth: breakpoints.small.maxWidth });\n\n  useEffect(() => {\n    const targetElement = document.querySelector(target);\n    const checkpoint = document.querySelector('#pgn__checkpoint');\n    if (targetElement && checkpoint) {\n      // Use the Popper library to translate the Checkpoint to its target's coordinates\n      const checkpointPopper = createPopper(targetElement, checkpoint, {\n        placement: isMobile ? 'top' : placement,\n        strategy: 'fixed',\n        modifiers: [\n          {\n            name: 'arrow',\n            options: {\n              padding: 25,\n            },\n          },\n          {\n            name: 'offset',\n            options: {\n              offset: [0, 20],\n            },\n          },\n          {\n            name: 'preventOverflow',\n            options: {\n              padding: 20,\n              tetherOffset: 35,\n            },\n          },\n        ],\n      });\n      setCheckpointVisible(true);\n      if (checkpointPopper) {\n        checkpointPopper.forceUpdate();\n      }\n    }\n  }, [target, isMobile, placement]);\n\n  useEffect(() => {\n    if (checkpointVisible) {\n      // Scroll the Checkpoint into view once its rendered\n      const targetElement = document.querySelector(target);\n      let targetOffset = targetElement.getBoundingClientRect().top;\n      if ((targetOffset < 0) || (targetElement.getBoundingClientRect().bottom > global.innerHeight)) {\n        if (placement.includes('top')) {\n          if (targetOffset < 0) {\n            targetOffset *= -1;\n          }\n          targetOffset -= 280;\n        } else {\n          targetOffset -= 80;\n        }\n\n        global.scrollTo({\n          top: targetOffset, behavior: 'smooth',\n        });\n      }\n\n      const button = document.querySelector('.pgn__checkpoint-button_advance');\n      button.focus();\n    }\n  }, [target, checkpointVisible, placement]);\n\n  const isLastCheckpoint = index + 1 === totalCheckpoints;\n  const isOnlyCheckpoint = totalCheckpoints === 1;\n\n  return (\n    <div\n      id=\"pgn__checkpoint\"\n      className=\"pgn__checkpoint\"\n      aria-labelledby=\"pgn__checkpoint-title\"\n      ref={ref}\n      role=\"dialog\"\n      style={{ visibility: checkpointVisible ? 'visible' : 'hidden', pointerEvents: checkpointVisible ? 'auto' : 'none' }}\n    >\n      <span className=\"sr-only\">\n        <FormattedMessage\n          {...messages.topPositionText}\n          values={{ step: index + 1 }}\n        />\n      </span>\n      {(title || !isOnlyCheckpoint) && (\n        <div className=\"pgn__checkpoint-header\">\n          <CheckpointTitle>{title}</CheckpointTitle>\n          <CheckpointBreadcrumbs currentIndex={index} totalCheckpoints={totalCheckpoints} />\n        </div>\n      )}\n      <CheckpointBody>{body}</CheckpointBody>\n      <CheckpointActionRow\n        isLastCheckpoint={isLastCheckpoint}\n        index={index}\n        {...props}\n      />\n      <div id=\"pgn__checkpoint-arrow\" data-popper-arrow />\n      <span className=\"sr-only\">\n        <FormattedMessage\n          {...messages.bottomPositionText}\n          values={{ step: index + 1 }}\n        />\n      </span>\n    </div>\n  );\n});\n\nCheckpoint.defaultProps = {\n  advanceButtonText: null,\n  body: null,\n  dismissButtonText: null,\n  endButtonText: null,\n  placement: 'top',\n  title: null,\n  showDismissButton: undefined,\n};\n\nCheckpoint.propTypes = {\n  /** The text displayed on the button used to advance the tour for the given Checkpoint. */\n  advanceButtonText: PropTypes.node,\n  /** The text displayed in the body of the Checkpoint */\n  body: PropTypes.node,\n  /** The text displayed on the button used to dismiss the tour for the given Checkpoint. */\n  dismissButtonText: PropTypes.node,\n  /** The text displayed on the button used to end the tour for the given Checkpoint. */\n  endButtonText: PropTypes.node,\n  /** The current index of the given Checkpoint */\n  index: PropTypes.number.isRequired,\n  /** A function that runs when triggering the `onClick` event of the advance\n   * button for the given Checkpoint. */\n  onAdvance: PropTypes.func.isRequired,\n  /** A function that runs when triggering the `onClick` event of the dismiss\n   * button for the given Checkpoint. */\n  onDismiss: PropTypes.func.isRequired,\n  /** A function that runs when triggering the `onClick` event of the advance\n   * button if the given Checkpoint is the only or last Checkpoint in a tour. */\n  onEnd: PropTypes.func.isRequired,\n  /** A string that dictates the alignment of the Checkpoint around its target. */\n  placement: PropTypes.oneOf([\n    'top', 'top-start', 'top-end', 'right-start', 'right', 'right-end',\n    'left-start', 'left', 'left-end', 'bottom', 'bottom-start', 'bottom-end',\n  ]),\n  /** The CSS selector for the Checkpoint's desired target. */\n  target: PropTypes.string.isRequired,\n  /** The text displayed in the title of the Checkpoint */\n  title: PropTypes.node,\n  /** The total number of Checkpoints in a tour */\n  totalCheckpoints: PropTypes.number.isRequired,\n  /** Enforces visibility of the dismiss button under all circumstances */\n  showDismissButton: PropTypes.bool,\n};\n\nexport default Checkpoint;\n"],"mappings":"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"}

package/dist/ProductTour/messages.js

@@ -0,0 +1,16 @@
+import { defineMessages } from 'react-intl';
+
+const messages = defineMessages({
+  topPositionText: {
+    id: 'pgn.ProductTour.Checkpoint.top-position-text',
+    defaultMessage: 'Top of step {step}',
+    description: 'Screen-reader message to notify user that they are located at the bottom of the product tour step.',
+  },
+  bottomPositionText: {
+    id: 'pgn.ProductTour.Checkpoint.bottom-position-text',
+    defaultMessage: 'Bottom of step {step}',
+    description: 'Screen-reader message to notify user that they are located at the bottom of the product tour step.',
+  },
+});
+
+export default messages;

package/dist/SearchField/SearchFieldAdvanced.js

@@ -2,7 +2,6 @@ const _excluded = ["children", "className", "screenReaderText", "icons", "onSubm
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-/* eslint-disable max-len */
 import React, { useRef, createContext, useState, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
@@ -108,27 +107,32 @@ SearchFieldAdvanced.propTypes = {
   onSubmit: PropTypes.func.isRequired,
   /** specifies a custom class name. */
   className: PropTypes.string,
-  /** specifies a callback function for when the user loses focus in the `SearchField` component. The default is an empty function. For example:
+  /** specifies a callback function for when the user loses focus in the `SearchField` component.
+   * The default is an empty function. For example:
   ```jsx
   <SearchField onBlur={event => console.log(event)} />
   ``` */
   onBlur: PropTypes.func,
-  /** specifies a callback function for when the value in `SearchField` is changed by the user. The default is an empty function. For example:
+  /** specifies a callback function for when the value in `SearchField` is changed by the user.
+   * The default is an empty function. For example:
   ```jsx
   <SearchField onChange={value => console.log(value)} />
   ``` */
   onChange: PropTypes.func,
-  /** specifies a callback function for when the value in `SearchField` is cleared by the user. The default is an empty function. For example:
+  /** specifies a callback function for when the value in `SearchField` is cleared by the user.
+   * The default is an empty function. For example:
   ```jsx
   <SearchField onClear={() => console.log('search cleared')} />
   ``` */
   onClear: PropTypes.func,
-  /** specifies a callback function for when the user focuses in the `SearchField` component. The default is an empty function. For example:
+  /** specifies a callback function for when the user focuses in the `SearchField` component.
+   * The default is an empty function. For example:
   ```jsx
   <SearchField onFocus={event => console.log(event)} />
   ``` */
   onFocus: PropTypes.func,
-  /** specifies the screenreader text for both the clear and submit buttons (e.g., for i18n translations). The default is `{ label: 'search', clearButton: 'clear search', searchButton: 'submit search' }`. */
+  /** specifies the screenreader text for both the clear and submit buttons (e.g., for i18n translations).
+   * The default is `{ label: 'search', clearButton: 'clear search', searchButton: 'submit search' }`. */
   screenReaderText: PropTypes.shape({
     label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,
     submitButton: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,
@@ -141,7 +145,8 @@ SearchFieldAdvanced.propTypes = {
     submit: PropTypes.element.isRequired,
     clear: PropTypes.element
   }),
-  /** specifies the aria-label attribute on the form element. This is useful if you use the `SearchField` component more than once on a page. */
+  /** specifies the aria-label attribute on the form element. This is useful if you use the `SearchField` component
+   * more than once on a page. */
   formAriaLabel: PropTypes.string,
   /** Specifies whether the `SearchField` is disabled. */
   disabled: PropTypes.bool,

package/dist/SearchField/SearchFieldAdvanced.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchFieldAdvanced.js","names":["React","useRef","createContext","useState","useEffect","PropTypes","classNames","Search","Close","newId","Icon","SearchFieldContext","BUTTON_LOCATION_VARIANTS","SearchFieldAdvanced","props","children","className","screenReaderText","icons","onSubmit","onClear","onChange","onBlur","onFocus","value","initialValue","formAriaLabel","disabled","submitButtonLocation","rest","_objectWithoutProperties","_excluded","hasFocus","setHasFocus","setValue","isInitialMount","inputId","inputRef","submitButtonRef","current","handleSubmit","event","preventDefault","focus","handleClear","handleFocus","handleBlur","handleChange","target","createElement","_extends","role","onReset","Provider","refs","input","submitButton","propTypes","node","isRequired","func","string","shape","label","oneOfType","element","clearButton","submit","clear","bool","oneOf","defaultProps","undefined","src"],"sources":["../../src/SearchField/SearchFieldAdvanced.jsx"],"sourcesContent":["/* eslint-disable max-len */\nimport React, {\n  useRef, createContext, useState, useEffect,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { Search, Close } from '../../icons';\nimport newId from '../utils/newId';\n\nimport Icon from '../Icon';\n\nexport const SearchFieldContext = createContext();\n\nconst BUTTON_LOCATION_VARIANTS = [\n  'internal',\n  'external',\n];\n\nfunction SearchFieldAdvanced(props) {\n  const {\n    children,\n    className,\n    screenReaderText,\n    icons,\n    onSubmit,\n    onClear,\n    onChange,\n    onBlur,\n    onFocus,\n    value: initialValue,\n    formAriaLabel,\n    disabled,\n    submitButtonLocation,\n    ...rest\n  } = props;\n\n  const [hasFocus, setHasFocus] = useState(false);\n  const [value, setValue] = useState(initialValue);\n\n  const isInitialMount = useRef(true);\n  const inputId = useRef(`${newId('pgn-searchfield-input-')}`);\n  const inputRef = useRef();\n  const submitButtonRef = useRef();\n\n  useEffect(() => {\n    setValue(initialValue);\n  }, [initialValue]);\n\n  useEffect(() => {\n    if (isInitialMount.current) {\n      isInitialMount.current = false;\n    } else {\n      onChange(value);\n    }\n  }, [value, onChange]);\n\n  const handleSubmit = (event) => {\n    event.preventDefault();\n    onSubmit(value);\n    if (submitButtonRef && submitButtonRef.current) {\n      submitButtonRef.current.focus();\n    }\n  };\n\n  const handleClear = () => {\n    setValue('');\n    onClear();\n    if (inputRef && inputRef.current) {\n      inputRef.current.focus();\n    }\n  };\n\n  const handleFocus = (event) => {\n    setHasFocus(true);\n    onFocus(event);\n  };\n\n  const handleBlur = (event) => {\n    setHasFocus(false);\n    onBlur(event);\n  };\n\n  const handleChange = (event) => {\n    setValue(event.target.value);\n  };\n\n  return (\n    <div\n      className={classNames(\n        'pgn__searchfield',\n        'd-flex',\n        {\n          'has-focus': hasFocus,\n          disabled,\n          'pgn__searchfield--external': submitButtonLocation === 'external',\n        },\n        className,\n      )}\n      {...rest}\n    >\n      <form\n        role=\"search\"\n        onSubmit={handleSubmit}\n        onReset={handleClear}\n        className=\"pgn__searchfield-form\"\n        aria-label={formAriaLabel}\n      >\n        <SearchFieldContext.Provider\n          value={{\n            inputId,\n            screenReaderText,\n            icons,\n            value,\n            disabled,\n            handleFocus,\n            handleBlur,\n            handleChange,\n            refs: {\n              input: inputRef,\n              submitButton: submitButtonRef,\n            },\n          }}\n        >\n          {children}\n        </SearchFieldContext.Provider>\n      </form>\n    </div>\n  );\n}\n\nSearchFieldAdvanced.propTypes = {\n  /** specifies the nested child elements. At a minimum, `SearchField.Label` and `SearchField.Input` are required. */\n  children: PropTypes.node.isRequired,\n  /** specifies a callback function for when the `SearchField` is submitted by the user. For example:\n  ```jsx\n  <SearchField onSubmit={(value) => { console.log(value); } />\n  ``` */\n  onSubmit: PropTypes.func.isRequired,\n  /** specifies a custom class name. */\n  className: PropTypes.string,\n  /** specifies a callback function for when the user loses focus in the `SearchField` component. The default is an empty function. For example:\n  ```jsx\n  <SearchField onBlur={event => console.log(event)} />\n  ``` */\n  onBlur: PropTypes.func,\n  /** specifies a callback function for when the value in `SearchField` is changed by the user. The default is an empty function. For example:\n  ```jsx\n  <SearchField onChange={value => console.log(value)} />\n  ``` */\n  onChange: PropTypes.func,\n  /** specifies a callback function for when the value in `SearchField` is cleared by the user. The default is an empty function. For example:\n  ```jsx\n  <SearchField onClear={() => console.log('search cleared')} />\n  ``` */\n  onClear: PropTypes.func,\n  /** specifies a callback function for when the user focuses in the `SearchField` component. The default is an empty function. For example:\n  ```jsx\n  <SearchField onFocus={event => console.log(event)} />\n  ``` */\n  onFocus: PropTypes.func,\n  /** specifies the screenreader text for both the clear and submit buttons (e.g., for i18n translations). The default is `{ label: 'search', clearButton: 'clear search', searchButton: 'submit search' }`. */\n  screenReaderText: PropTypes.shape({\n    label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,\n    submitButton: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,\n    clearButton: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),\n  }),\n  /** specifies the initial value for the input. The default is an empty string. */\n  value: PropTypes.string,\n  /** specifies the icon element(s) to use for the clear and submit buttons. */\n  icons: PropTypes.shape({\n    submit: PropTypes.element.isRequired,\n    clear: PropTypes.element,\n  }),\n  /** specifies the aria-label attribute on the form element. This is useful if you use the `SearchField` component more than once on a page. */\n  formAriaLabel: PropTypes.string,\n  /** Specifies whether the `SearchField` is disabled. */\n  disabled: PropTypes.bool,\n  /** Controls whether the search button is internal as an icon or external as a button. */\n  submitButtonLocation: PropTypes.oneOf(BUTTON_LOCATION_VARIANTS),\n};\n\nSearchFieldAdvanced.defaultProps = {\n  className: undefined,\n  formAriaLabel: undefined,\n  value: '',\n  screenReaderText: {\n    label: 'search',\n    submitButton: 'submit search',\n    clearButton: 'clear search',\n  },\n  icons: {\n    clear: <Icon src={Close} />,\n    submit: <Icon src={Search} />,\n  },\n  onBlur: () => {},\n  onChange: () => {},\n  onFocus: () => {},\n  onClear: () => {},\n  disabled: false,\n  submitButtonLocation: 'internal',\n};\n\nexport default SearchFieldAdvanced;\n"],"mappings":"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"}
+{"version":3,"file":"SearchFieldAdvanced.js","names":["React","useRef","createContext","useState","useEffect","PropTypes","classNames","Search","Close","newId","Icon","SearchFieldContext","BUTTON_LOCATION_VARIANTS","SearchFieldAdvanced","props","children","className","screenReaderText","icons","onSubmit","onClear","onChange","onBlur","onFocus","value","initialValue","formAriaLabel","disabled","submitButtonLocation","rest","_objectWithoutProperties","_excluded","hasFocus","setHasFocus","setValue","isInitialMount","inputId","inputRef","submitButtonRef","current","handleSubmit","event","preventDefault","focus","handleClear","handleFocus","handleBlur","handleChange","target","createElement","_extends","role","onReset","Provider","refs","input","submitButton","propTypes","node","isRequired","func","string","shape","label","oneOfType","element","clearButton","submit","clear","bool","oneOf","defaultProps","undefined","src"],"sources":["../../src/SearchField/SearchFieldAdvanced.jsx"],"sourcesContent":["import React, {\n  useRef, createContext, useState, useEffect,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { Search, Close } from '../../icons';\nimport newId from '../utils/newId';\n\nimport Icon from '../Icon';\n\nexport const SearchFieldContext = createContext();\n\nconst BUTTON_LOCATION_VARIANTS = [\n  'internal',\n  'external',\n];\n\nfunction SearchFieldAdvanced(props) {\n  const {\n    children,\n    className,\n    screenReaderText,\n    icons,\n    onSubmit,\n    onClear,\n    onChange,\n    onBlur,\n    onFocus,\n    value: initialValue,\n    formAriaLabel,\n    disabled,\n    submitButtonLocation,\n    ...rest\n  } = props;\n\n  const [hasFocus, setHasFocus] = useState(false);\n  const [value, setValue] = useState(initialValue);\n\n  const isInitialMount = useRef(true);\n  const inputId = useRef(`${newId('pgn-searchfield-input-')}`);\n  const inputRef = useRef();\n  const submitButtonRef = useRef();\n\n  useEffect(() => {\n    setValue(initialValue);\n  }, [initialValue]);\n\n  useEffect(() => {\n    if (isInitialMount.current) {\n      isInitialMount.current = false;\n    } else {\n      onChange(value);\n    }\n  }, [value, onChange]);\n\n  const handleSubmit = (event) => {\n    event.preventDefault();\n    onSubmit(value);\n    if (submitButtonRef && submitButtonRef.current) {\n      submitButtonRef.current.focus();\n    }\n  };\n\n  const handleClear = () => {\n    setValue('');\n    onClear();\n    if (inputRef && inputRef.current) {\n      inputRef.current.focus();\n    }\n  };\n\n  const handleFocus = (event) => {\n    setHasFocus(true);\n    onFocus(event);\n  };\n\n  const handleBlur = (event) => {\n    setHasFocus(false);\n    onBlur(event);\n  };\n\n  const handleChange = (event) => {\n    setValue(event.target.value);\n  };\n\n  return (\n    <div\n      className={classNames(\n        'pgn__searchfield',\n        'd-flex',\n        {\n          'has-focus': hasFocus,\n          disabled,\n          'pgn__searchfield--external': submitButtonLocation === 'external',\n        },\n        className,\n      )}\n      {...rest}\n    >\n      <form\n        role=\"search\"\n        onSubmit={handleSubmit}\n        onReset={handleClear}\n        className=\"pgn__searchfield-form\"\n        aria-label={formAriaLabel}\n      >\n        <SearchFieldContext.Provider\n          value={{\n            inputId,\n            screenReaderText,\n            icons,\n            value,\n            disabled,\n            handleFocus,\n            handleBlur,\n            handleChange,\n            refs: {\n              input: inputRef,\n              submitButton: submitButtonRef,\n            },\n          }}\n        >\n          {children}\n        </SearchFieldContext.Provider>\n      </form>\n    </div>\n  );\n}\n\nSearchFieldAdvanced.propTypes = {\n  /** specifies the nested child elements. At a minimum, `SearchField.Label` and `SearchField.Input` are required. */\n  children: PropTypes.node.isRequired,\n  /** specifies a callback function for when the `SearchField` is submitted by the user. For example:\n  ```jsx\n  <SearchField onSubmit={(value) => { console.log(value); } />\n  ``` */\n  onSubmit: PropTypes.func.isRequired,\n  /** specifies a custom class name. */\n  className: PropTypes.string,\n  /** specifies a callback function for when the user loses focus in the `SearchField` component.\n   * The default is an empty function. For example:\n  ```jsx\n  <SearchField onBlur={event => console.log(event)} />\n  ``` */\n  onBlur: PropTypes.func,\n  /** specifies a callback function for when the value in `SearchField` is changed by the user.\n   * The default is an empty function. For example:\n  ```jsx\n  <SearchField onChange={value => console.log(value)} />\n  ``` */\n  onChange: PropTypes.func,\n  /** specifies a callback function for when the value in `SearchField` is cleared by the user.\n   * The default is an empty function. For example:\n  ```jsx\n  <SearchField onClear={() => console.log('search cleared')} />\n  ``` */\n  onClear: PropTypes.func,\n  /** specifies a callback function for when the user focuses in the `SearchField` component.\n   * The default is an empty function. For example:\n  ```jsx\n  <SearchField onFocus={event => console.log(event)} />\n  ``` */\n  onFocus: PropTypes.func,\n  /** specifies the screenreader text for both the clear and submit buttons (e.g., for i18n translations).\n   * The default is `{ label: 'search', clearButton: 'clear search', searchButton: 'submit search' }`. */\n  screenReaderText: PropTypes.shape({\n    label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,\n    submitButton: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,\n    clearButton: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),\n  }),\n  /** specifies the initial value for the input. The default is an empty string. */\n  value: PropTypes.string,\n  /** specifies the icon element(s) to use for the clear and submit buttons. */\n  icons: PropTypes.shape({\n    submit: PropTypes.element.isRequired,\n    clear: PropTypes.element,\n  }),\n  /** specifies the aria-label attribute on the form element. This is useful if you use the `SearchField` component\n   * more than once on a page. */\n  formAriaLabel: PropTypes.string,\n  /** Specifies whether the `SearchField` is disabled. */\n  disabled: PropTypes.bool,\n  /** Controls whether the search button is internal as an icon or external as a button. */\n  submitButtonLocation: PropTypes.oneOf(BUTTON_LOCATION_VARIANTS),\n};\n\nSearchFieldAdvanced.defaultProps = {\n  className: undefined,\n  formAriaLabel: undefined,\n  value: '',\n  screenReaderText: {\n    label: 'search',\n    submitButton: 'submit search',\n    clearButton: 'clear search',\n  },\n  icons: {\n    clear: <Icon src={Close} />,\n    submit: <Icon src={Search} />,\n  },\n  onBlur: () => {},\n  onChange: () => {},\n  onFocus: () => {},\n  onClear: () => {},\n  disabled: false,\n  submitButtonLocation: 'internal',\n};\n\nexport default SearchFieldAdvanced;\n"],"mappings":"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"}

package/dist/SearchField/SearchFieldLabel.js

@@ -2,7 +2,6 @@ const _excluded = ["children"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-/* eslint-disable max-len */
 import React, { useContext } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
@@ -27,8 +26,9 @@ function SearchFieldLabel(_ref) {
 }
 SearchFieldLabel.propTypes = {
   /**
-   * specifies the label to use for the input field (e.g., for i18n translations). Note: if `children` is not provided,
-   * a screenreader-only label will be used in its placed based on the `screenReaderText.label` prop for `SearchField.Advanced`.
+   * specifies the label to use for the input field (e.g., for i18n translations).
+   * Note: if `children` is not provided, a screenreader-only label will be used in
+   * its placed based on the `screenReaderText.label` prop for `SearchField.Advanced`.
    */
   children: PropTypes.oneOfType([PropTypes.string, PropTypes.element])
 };

package/dist/SearchField/SearchFieldLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchFieldLabel.js","names":["React","useContext","PropTypes","classNames","SearchFieldContext","SearchFieldLabel","_ref","children","props","_objectWithoutProperties","_excluded","screenReaderText","inputId","createElement","_extends","htmlFor","current","className","label","propTypes","oneOfType","string","element","defaultProps","undefined"],"sources":["../../src/SearchField/SearchFieldLabel.jsx"],"sourcesContent":["/* eslint-disable max-len */\nimport React, { useContext } from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\n\nimport { SearchFieldContext } from './SearchFieldAdvanced';\n\nfunction SearchFieldLabel({ children, ...props }) {\n  const { screenReaderText, inputId } = useContext(SearchFieldContext);\n\n  return (\n    <label\n      htmlFor={inputId.current}\n      className={classNames('m-0', { 'has-label-text': !!children })}\n      {...props}\n    >\n      {children || <span className=\"sr-only\">{screenReaderText.label}</span>}\n    </label>\n  );\n}\n\nSearchFieldLabel.propTypes = {\n  /**\n   * specifies the label to use for the input field (e.g., for i18n translations). Note: if `children` is not provided,\n   * a screenreader-only label will be used in its placed based on the `screenReaderText.label` prop for `SearchField.Advanced`.\n   */\n  children: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),\n};\n\nSearchFieldLabel.defaultProps = {\n  children: undefined,\n};\n\nexport default SearchFieldLabel;\n"],"mappings":";;;;AAAA;AACA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,UAAU,MAAM,YAAY;AAEnC,SAASC,kBAAkB,QAAQ,uBAAuB;AAE1D,SAASC,gBAAgBA,CAAAC,IAAA,EAAyB;EAAA,IAAxB;MAAEC;IAAmB,CAAC,GAAAD,IAAA;IAAPE,KAAK,GAAAC,wBAAA,CAAAH,IAAA,EAAAI,SAAA;EAC5C,MAAM;IAAEC,gBAAgB;IAAEC;EAAQ,CAAC,GAAGX,UAAU,CAACG,kBAAkB,CAAC;EAEpE,oBACEJ,KAAA,CAAAa,aAAA,UAAAC,QAAA;IACEC,OAAO,EAAEH,OAAO,CAACI,OAAQ;IACzBC,SAAS,EAAEd,UAAU,CAAC,KAAK,EAAE;MAAE,gBAAgB,EAAE,CAAC,CAACI;IAAS,CAAC;EAAE,GAC3DC,KAAK,GAERD,QAAQ,iBAAIP,KAAA,CAAAa,aAAA;IAAMI,SAAS,EAAC;EAAS,GAAEN,gBAAgB,CAACO,KAAY,CAChE,CAAC;AAEZ;AAEAb,gBAAgB,CAACc,SAAS,GAAG;EAC3B;AACF;AACA;AACA;EACEZ,QAAQ,EAAEL,SAAS,CAACkB,SAAS,CAAC,CAAClB,SAAS,CAACmB,MAAM,EAAEnB,SAAS,CAACoB,OAAO,CAAC;AACrE,CAAC;AAEDjB,gBAAgB,CAACkB,YAAY,GAAG;EAC9BhB,QAAQ,EAAEiB;AACZ,CAAC;AAED,eAAenB,gBAAgB"}
+{"version":3,"file":"SearchFieldLabel.js","names":["React","useContext","PropTypes","classNames","SearchFieldContext","SearchFieldLabel","_ref","children","props","_objectWithoutProperties","_excluded","screenReaderText","inputId","createElement","_extends","htmlFor","current","className","label","propTypes","oneOfType","string","element","defaultProps","undefined"],"sources":["../../src/SearchField/SearchFieldLabel.jsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\n\nimport { SearchFieldContext } from './SearchFieldAdvanced';\n\nfunction SearchFieldLabel({ children, ...props }) {\n  const { screenReaderText, inputId } = useContext(SearchFieldContext);\n\n  return (\n    <label\n      htmlFor={inputId.current}\n      className={classNames('m-0', { 'has-label-text': !!children })}\n      {...props}\n    >\n      {children || <span className=\"sr-only\">{screenReaderText.label}</span>}\n    </label>\n  );\n}\n\nSearchFieldLabel.propTypes = {\n  /**\n   * specifies the label to use for the input field (e.g., for i18n translations).\n   * Note: if `children` is not provided, a screenreader-only label will be used in\n   * its placed based on the `screenReaderText.label` prop for `SearchField.Advanced`.\n   */\n  children: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),\n};\n\nSearchFieldLabel.defaultProps = {\n  children: undefined,\n};\n\nexport default SearchFieldLabel;\n"],"mappings":";;;;AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,UAAU,MAAM,YAAY;AAEnC,SAASC,kBAAkB,QAAQ,uBAAuB;AAE1D,SAASC,gBAAgBA,CAAAC,IAAA,EAAyB;EAAA,IAAxB;MAAEC;IAAmB,CAAC,GAAAD,IAAA;IAAPE,KAAK,GAAAC,wBAAA,CAAAH,IAAA,EAAAI,SAAA;EAC5C,MAAM;IAAEC,gBAAgB;IAAEC;EAAQ,CAAC,GAAGX,UAAU,CAACG,kBAAkB,CAAC;EAEpE,oBACEJ,KAAA,CAAAa,aAAA,UAAAC,QAAA;IACEC,OAAO,EAAEH,OAAO,CAACI,OAAQ;IACzBC,SAAS,EAAEd,UAAU,CAAC,KAAK,EAAE;MAAE,gBAAgB,EAAE,CAAC,CAACI;IAAS,CAAC;EAAE,GAC3DC,KAAK,GAERD,QAAQ,iBAAIP,KAAA,CAAAa,aAAA;IAAMI,SAAS,EAAC;EAAS,GAAEN,gBAAgB,CAACO,KAAY,CAChE,CAAC;AAEZ;AAEAb,gBAAgB,CAACc,SAAS,GAAG;EAC3B;AACF;AACA;AACA;AACA;EACEZ,QAAQ,EAAEL,SAAS,CAACkB,SAAS,CAAC,CAAClB,SAAS,CAACmB,MAAM,EAAEnB,SAAS,CAACoB,OAAO,CAAC;AACrE,CAAC;AAEDjB,gBAAgB,CAACkB,YAAY,GAAG;EAC9BhB,QAAQ,EAAEiB;AACZ,CAAC;AAED,eAAenB,gBAAgB"}

package/dist/SearchField/index.js

@@ -2,7 +2,6 @@ const _excluded = ["label", "placeholder", "inputProps", "variant", "submitButto
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-/* eslint-disable max-len */
 import React, { useCallback } from 'react';
 import PropTypes from 'prop-types';
 import { Search, Close } from '../../icons';

package/dist/SearchField/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useCallback","PropTypes","Search","Close","SearchFieldAdvanced","SearchFieldContext","SearchFieldLabel","SearchFieldInput","SearchFieldClearButton","SearchFieldSubmitButton","Icon","SEARCH_FIELD_SCREEN_READER_TEXT_LABEL","SEARCH_FIELD_SCREEN_READER_TEXT_SUBMIT_BUTTON","SEARCH_FIELD_SCREEN_READER_TEXT_CLEAR_BUTTON","SEARCH_FIELD_BUTTON_TEXT","STYLE_VARIANTS","BUTTON_LOCATION_VARIANTS","SearchField","props","label","placeholder","inputProps","variant","submitButtonLocation","buttonText","others","_objectWithoutProperties","_excluded","Wrapper","wrapperProps","createElement","className","children","Advanced","_extends","Label","Input","ClearButton","SubmitButton","propTypes","onSubmit","func","isRequired","oneOfType","string","element","onBlur","onChange","onClear","onFocus","screenReaderText","shape","submitButton","clearButton","value","icons","submit","clear","formAriaLabel","oneOf","disabled","bool","defaultProps","undefined","src","Context"],"sources":["../../src/SearchField/index.jsx"],"sourcesContent":["/* eslint-disable max-len */\nimport React, { useCallback } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { Search, Close } from '../../icons';\nimport SearchFieldAdvanced, { SearchFieldContext } from './SearchFieldAdvanced';\nimport SearchFieldLabel from './SearchFieldLabel';\nimport SearchFieldInput from './SearchFieldInput';\nimport SearchFieldClearButton from './SearchFieldClearButton';\nimport SearchFieldSubmitButton from './SearchFieldSubmitButton';\n\nimport Icon from '../Icon';\n\nexport const SEARCH_FIELD_SCREEN_READER_TEXT_LABEL = 'search';\nexport const SEARCH_FIELD_SCREEN_READER_TEXT_SUBMIT_BUTTON = 'submit search';\nexport const SEARCH_FIELD_SCREEN_READER_TEXT_CLEAR_BUTTON = 'clear search';\nexport const SEARCH_FIELD_BUTTON_TEXT = 'search';\n\nconst STYLE_VARIANTS = [\n  'light',\n  'dark',\n];\n\nconst BUTTON_LOCATION_VARIANTS = [\n  'internal',\n  'external',\n];\n\nfunction SearchField(props) {\n  const {\n    label,\n    placeholder,\n    inputProps,\n    variant,\n    submitButtonLocation,\n    buttonText,\n    ...others\n  } = props;\n\n  const Wrapper = useCallback(\n    (wrapperProps) => (submitButtonLocation === 'external'\n      ? <div className=\"pgn__searchfield_wrapper\">{wrapperProps.children}</div>\n      : wrapperProps.children),\n    [submitButtonLocation],\n  );\n\n  return (\n    <SearchField.Advanced {...others} submitButtonLocation={submitButtonLocation}>\n      <Wrapper>\n        <SearchField.Label>{label}</SearchField.Label>\n        <SearchField.Input placeholder={placeholder} {...inputProps} />\n        <SearchField.ClearButton />\n      </Wrapper>\n      <SearchField.SubmitButton\n        variant={variant}\n        submitButtonLocation={submitButtonLocation}\n        buttonText={buttonText}\n      />\n    </SearchField.Advanced>\n  );\n}\n\nSearchField.propTypes = {\n  /**\n   * Specifies a callback function for when the `SearchField` is submitted by the user. For example:\n   *\n   *```jsx\n   * <SearchField onSubmit={(value) => { console.log(value); } />\n   * ```\n   */\n  onSubmit: PropTypes.func.isRequired,\n  /** Specifies the label to use for the input field (e.g., for i18n translations). */\n  label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),\n  /** Specifies a custom class name. */\n  className: PropTypes.string,\n  /**\n   * Specifies a callback function for when the user loses focus in the\n   * `SearchField` component. The default is an empty function. For example:\n   *\n   * ```jsx\n   * <SearchField onBlur={event => console.log(event)} />\n   * ```\n   */\n  onBlur: PropTypes.func,\n  /**\n   * Specifies a callback function for when the value in `SearchField`\n   * is changed by the user. The default is an empty function. For example:\n   *\n   * ```jsx\n   * <SearchField onChange={value => console.log(value)} />\n   * ```\n   */\n  onChange: PropTypes.func,\n  /**\n   * Specifies a callback function for when the value in `SearchField`\n   * is cleared by the user. The default is an empty function. For example:\n   *\n   * ```jsx\n   * <SearchField onClear={() => console.log('search cleared')} />\n   * ```\n   */\n  onClear: PropTypes.func,\n  /**\n   * Specifies a callback function for when the user focuses in the `SearchField`\n   * component. The default is an empty function. For example:\n   *\n   * ```jsx\n   * <SearchField onFocus={event => console.log(event)} />\n   * ```\n   */\n  onFocus: PropTypes.func,\n  /** Specifies the placeholder text for the input. */\n  placeholder: PropTypes.string,\n  /**\n   * Specifies the screenreader text for both the clear and submit buttons\n   * (e.g., for i18n translations). The default is `{ label: 'search',\n   * clearButton: 'clear search', searchButton: 'submit search' }`.\n   */\n  screenReaderText: PropTypes.shape({\n    label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,\n    submitButton: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,\n    clearButton: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),\n  }),\n  /** Specifies the initial value for the input. The default is an empty string. */\n  value: PropTypes.string,\n  /**\n   * Specifies the icon element(s) to use for the clear and submit buttons.\n   * The default is:\n   *\n   * ```jsx\n   * {\n   *   submit: import {Search} from '@edx/paragon/icons';,\n   *   clear: import {Close} from '@edx/paragon/icons'.\n   * }\n   * ```\n   */\n  icons: PropTypes.shape({\n    submit: PropTypes.element.isRequired,\n    clear: PropTypes.element,\n  }),\n  /**\n   * Specifies the aria-label attribute on the form element.\n   * This is useful if you use the `SearchField` component more than once on a page.\n   */\n  formAriaLabel: PropTypes.string,\n  /** Props to be passed to the form input */\n  inputProps: PropTypes.shape({}),\n  /** The button style variant to use. */\n  variant: PropTypes.oneOf(STYLE_VARIANTS),\n  /** Specifies whether the `SearchField` is disabled. */\n  disabled: PropTypes.bool,\n  /** Controls whether the search button is internal as an icon or external as a button. */\n  submitButtonLocation: PropTypes.oneOf(BUTTON_LOCATION_VARIANTS),\n  /**\n   * Specifies a text that is displayed on the button.\n   * The `submitButtonLocation` prop should be set to `external`.\n   */\n  buttonText: PropTypes.string,\n};\n\nSearchField.defaultProps = {\n  label: undefined,\n  placeholder: undefined,\n  className: undefined,\n  formAriaLabel: undefined,\n  value: '',\n  screenReaderText: {\n    label: SEARCH_FIELD_SCREEN_READER_TEXT_LABEL,\n    submitButton: SEARCH_FIELD_SCREEN_READER_TEXT_SUBMIT_BUTTON,\n    clearButton: SEARCH_FIELD_SCREEN_READER_TEXT_CLEAR_BUTTON,\n  },\n  icons: {\n    clear: <Icon src={Close} />,\n    submit: <Icon src={Search} />,\n  },\n  onBlur: () => {},\n  onChange: () => {},\n  onFocus: () => {},\n  onClear: () => {},\n  inputProps: {},\n  variant: 'light',\n  disabled: false,\n  submitButtonLocation: 'internal',\n  buttonText: SEARCH_FIELD_BUTTON_TEXT,\n};\n\nSearchField.Advanced = SearchFieldAdvanced;\nSearchField.Label = SearchFieldLabel;\nSearchField.Input = SearchFieldInput;\nSearchField.ClearButton = SearchFieldClearButton;\nSearchField.SubmitButton = SearchFieldSubmitButton;\nSearchField.Context = SearchFieldContext;\n\nexport default SearchField;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["React","useCallback","PropTypes","Search","Close","SearchFieldAdvanced","SearchFieldContext","SearchFieldLabel","SearchFieldInput","SearchFieldClearButton","SearchFieldSubmitButton","Icon","SEARCH_FIELD_SCREEN_READER_TEXT_LABEL","SEARCH_FIELD_SCREEN_READER_TEXT_SUBMIT_BUTTON","SEARCH_FIELD_SCREEN_READER_TEXT_CLEAR_BUTTON","SEARCH_FIELD_BUTTON_TEXT","STYLE_VARIANTS","BUTTON_LOCATION_VARIANTS","SearchField","props","label","placeholder","inputProps","variant","submitButtonLocation","buttonText","others","_objectWithoutProperties","_excluded","Wrapper","wrapperProps","createElement","className","children","Advanced","_extends","Label","Input","ClearButton","SubmitButton","propTypes","onSubmit","func","isRequired","oneOfType","string","element","onBlur","onChange","onClear","onFocus","screenReaderText","shape","submitButton","clearButton","value","icons","submit","clear","formAriaLabel","oneOf","disabled","bool","defaultProps","undefined","src","Context"],"sources":["../../src/SearchField/index.jsx"],"sourcesContent":["import React, { useCallback } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { Search, Close } from '../../icons';\nimport SearchFieldAdvanced, { SearchFieldContext } from './SearchFieldAdvanced';\nimport SearchFieldLabel from './SearchFieldLabel';\nimport SearchFieldInput from './SearchFieldInput';\nimport SearchFieldClearButton from './SearchFieldClearButton';\nimport SearchFieldSubmitButton from './SearchFieldSubmitButton';\n\nimport Icon from '../Icon';\n\nexport const SEARCH_FIELD_SCREEN_READER_TEXT_LABEL = 'search';\nexport const SEARCH_FIELD_SCREEN_READER_TEXT_SUBMIT_BUTTON = 'submit search';\nexport const SEARCH_FIELD_SCREEN_READER_TEXT_CLEAR_BUTTON = 'clear search';\nexport const SEARCH_FIELD_BUTTON_TEXT = 'search';\n\nconst STYLE_VARIANTS = [\n  'light',\n  'dark',\n];\n\nconst BUTTON_LOCATION_VARIANTS = [\n  'internal',\n  'external',\n];\n\nfunction SearchField(props) {\n  const {\n    label,\n    placeholder,\n    inputProps,\n    variant,\n    submitButtonLocation,\n    buttonText,\n    ...others\n  } = props;\n\n  const Wrapper = useCallback(\n    (wrapperProps) => (submitButtonLocation === 'external'\n      ? <div className=\"pgn__searchfield_wrapper\">{wrapperProps.children}</div>\n      : wrapperProps.children),\n    [submitButtonLocation],\n  );\n\n  return (\n    <SearchField.Advanced {...others} submitButtonLocation={submitButtonLocation}>\n      <Wrapper>\n        <SearchField.Label>{label}</SearchField.Label>\n        <SearchField.Input placeholder={placeholder} {...inputProps} />\n        <SearchField.ClearButton />\n      </Wrapper>\n      <SearchField.SubmitButton\n        variant={variant}\n        submitButtonLocation={submitButtonLocation}\n        buttonText={buttonText}\n      />\n    </SearchField.Advanced>\n  );\n}\n\nSearchField.propTypes = {\n  /**\n   * Specifies a callback function for when the `SearchField` is submitted by the user. For example:\n   *\n   *```jsx\n   * <SearchField onSubmit={(value) => { console.log(value); } />\n   * ```\n   */\n  onSubmit: PropTypes.func.isRequired,\n  /** Specifies the label to use for the input field (e.g., for i18n translations). */\n  label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),\n  /** Specifies a custom class name. */\n  className: PropTypes.string,\n  /**\n   * Specifies a callback function for when the user loses focus in the\n   * `SearchField` component. The default is an empty function. For example:\n   *\n   * ```jsx\n   * <SearchField onBlur={event => console.log(event)} />\n   * ```\n   */\n  onBlur: PropTypes.func,\n  /**\n   * Specifies a callback function for when the value in `SearchField`\n   * is changed by the user. The default is an empty function. For example:\n   *\n   * ```jsx\n   * <SearchField onChange={value => console.log(value)} />\n   * ```\n   */\n  onChange: PropTypes.func,\n  /**\n   * Specifies a callback function for when the value in `SearchField`\n   * is cleared by the user. The default is an empty function. For example:\n   *\n   * ```jsx\n   * <SearchField onClear={() => console.log('search cleared')} />\n   * ```\n   */\n  onClear: PropTypes.func,\n  /**\n   * Specifies a callback function for when the user focuses in the `SearchField`\n   * component. The default is an empty function. For example:\n   *\n   * ```jsx\n   * <SearchField onFocus={event => console.log(event)} />\n   * ```\n   */\n  onFocus: PropTypes.func,\n  /** Specifies the placeholder text for the input. */\n  placeholder: PropTypes.string,\n  /**\n   * Specifies the screenreader text for both the clear and submit buttons\n   * (e.g., for i18n translations). The default is `{ label: 'search',\n   * clearButton: 'clear search', searchButton: 'submit search' }`.\n   */\n  screenReaderText: PropTypes.shape({\n    label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,\n    submitButton: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,\n    clearButton: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),\n  }),\n  /** Specifies the initial value for the input. The default is an empty string. */\n  value: PropTypes.string,\n  /**\n   * Specifies the icon element(s) to use for the clear and submit buttons.\n   * The default is:\n   *\n   * ```jsx\n   * {\n   *   submit: import {Search} from '@edx/paragon/icons';,\n   *   clear: import {Close} from '@edx/paragon/icons'.\n   * }\n   * ```\n   */\n  icons: PropTypes.shape({\n    submit: PropTypes.element.isRequired,\n    clear: PropTypes.element,\n  }),\n  /**\n   * Specifies the aria-label attribute on the form element.\n   * This is useful if you use the `SearchField` component more than once on a page.\n   */\n  formAriaLabel: PropTypes.string,\n  /** Props to be passed to the form input */\n  inputProps: PropTypes.shape({}),\n  /** The button style variant to use. */\n  variant: PropTypes.oneOf(STYLE_VARIANTS),\n  /** Specifies whether the `SearchField` is disabled. */\n  disabled: PropTypes.bool,\n  /** Controls whether the search button is internal as an icon or external as a button. */\n  submitButtonLocation: PropTypes.oneOf(BUTTON_LOCATION_VARIANTS),\n  /**\n   * Specifies a text that is displayed on the button.\n   * The `submitButtonLocation` prop should be set to `external`.\n   */\n  buttonText: PropTypes.string,\n};\n\nSearchField.defaultProps = {\n  label: undefined,\n  placeholder: undefined,\n  className: undefined,\n  formAriaLabel: undefined,\n  value: '',\n  screenReaderText: {\n    label: SEARCH_FIELD_SCREEN_READER_TEXT_LABEL,\n    submitButton: SEARCH_FIELD_SCREEN_READER_TEXT_SUBMIT_BUTTON,\n    clearButton: SEARCH_FIELD_SCREEN_READER_TEXT_CLEAR_BUTTON,\n  },\n  icons: {\n    clear: <Icon src={Close} />,\n    submit: <Icon src={Search} />,\n  },\n  onBlur: () => {},\n  onChange: () => {},\n  onFocus: () => {},\n  onClear: () => {},\n  inputProps: {},\n  variant: 'light',\n  disabled: false,\n  submitButtonLocation: 'internal',\n  buttonText: SEARCH_FIELD_BUTTON_TEXT,\n};\n\nSearchField.Advanced = SearchFieldAdvanced;\nSearchField.Label = SearchFieldLabel;\nSearchField.Input = SearchFieldInput;\nSearchField.ClearButton = SearchFieldClearButton;\nSearchField.SubmitButton = SearchFieldSubmitButton;\nSearchField.Context = SearchFieldContext;\n\nexport default SearchField;\n"],"mappings":";;;;AAAA,OAAOA,KAAK,IAAIC,WAAW,QAAQ,OAAO;AAC1C,OAAOC,SAAS,MAAM,YAAY;AAElC,SAASC,MAAM,EAAEC,KAAK,QAAQ,aAAa;AAC3C,OAAOC,mBAAmB,IAAIC,kBAAkB,QAAQ,uBAAuB;AAC/E,OAAOC,gBAAgB,MAAM,oBAAoB;AACjD,OAAOC,gBAAgB,MAAM,oBAAoB;AACjD,OAAOC,sBAAsB,MAAM,0BAA0B;AAC7D,OAAOC,uBAAuB,MAAM,2BAA2B;AAE/D,OAAOC,IAAI,MAAM,SAAS;AAE1B,OAAO,MAAMC,qCAAqC,GAAG,QAAQ;AAC7D,OAAO,MAAMC,6CAA6C,GAAG,eAAe;AAC5E,OAAO,MAAMC,4CAA4C,GAAG,cAAc;AAC1E,OAAO,MAAMC,wBAAwB,GAAG,QAAQ;AAEhD,MAAMC,cAAc,GAAG,CACrB,OAAO,EACP,MAAM,CACP;AAED,MAAMC,wBAAwB,GAAG,CAC/B,UAAU,EACV,UAAU,CACX;AAED,SAASC,WAAWA,CAACC,KAAK,EAAE;EAC1B,MAAM;MACJC,KAAK;MACLC,WAAW;MACXC,UAAU;MACVC,OAAO;MACPC,oBAAoB;MACpBC;IAEF,CAAC,GAAGN,KAAK;IADJO,MAAM,GAAAC,wBAAA,CACPR,KAAK,EAAAS,SAAA;EAET,MAAMC,OAAO,GAAG5B,WAAW,CACxB6B,YAAY,IAAMN,oBAAoB,KAAK,UAAU,gBAClDxB,KAAA,CAAA+B,aAAA;IAAKC,SAAS,EAAC;EAA0B,GAAEF,YAAY,CAACG,QAAc,CAAC,GACvEH,YAAY,CAACG,QAAS,EAC1B,CAACT,oBAAoB,CACvB,CAAC;EAED,oBACExB,KAAA,CAAA+B,aAAA,CAACb,WAAW,CAACgB,QAAQ,EAAAC,QAAA,KAAKT,MAAM;IAAEF,oBAAoB,EAAEA;EAAqB,iBAC3ExB,KAAA,CAAA+B,aAAA,CAACF,OAAO,qBACN7B,KAAA,CAAA+B,aAAA,CAACb,WAAW,CAACkB,KAAK,QAAEhB,KAAyB,CAAC,eAC9CpB,KAAA,CAAA+B,aAAA,CAACb,WAAW,CAACmB,KAAK,EAAAF,QAAA;IAACd,WAAW,EAAEA;EAAY,GAAKC,UAAU,CAAG,CAAC,eAC/DtB,KAAA,CAAA+B,aAAA,CAACb,WAAW,CAACoB,WAAW,MAAE,CACnB,CAAC,eACVtC,KAAA,CAAA+B,aAAA,CAACb,WAAW,CAACqB,YAAY;IACvBhB,OAAO,EAAEA,OAAQ;IACjBC,oBAAoB,EAAEA,oBAAqB;IAC3CC,UAAU,EAAEA;EAAW,CACxB,CACmB,CAAC;AAE3B;AAEAP,WAAW,CAACsB,SAAS,GAAG;EACtB;AACF;AACA;AACA;AACA;AACA;AACA;EACEC,QAAQ,EAAEvC,SAAS,CAACwC,IAAI,CAACC,UAAU;EACnC;EACAvB,KAAK,EAAElB,SAAS,CAAC0C,SAAS,CAAC,CAAC1C,SAAS,CAAC2C,MAAM,EAAE3C,SAAS,CAAC4C,OAAO,CAAC,CAAC;EACjE;EACAd,SAAS,EAAE9B,SAAS,CAAC2C,MAAM;EAC3B;AACF;AACA;AACA;AACA;AACA;AACA;AACA;EACEE,MAAM,EAAE7C,SAAS,CAACwC,IAAI;EACtB;AACF;AACA;AACA;AACA;AACA;AACA;AACA;EACEM,QAAQ,EAAE9C,SAAS,CAACwC,IAAI;EACxB;AACF;AACA;AACA;AACA;AACA;AACA;AACA;EACEO,OAAO,EAAE/C,SAAS,CAACwC,IAAI;EACvB;AACF;AACA;AACA;AACA;AACA;AACA;AACA;EACEQ,OAAO,EAAEhD,SAAS,CAACwC,IAAI;EACvB;EACArB,WAAW,EAAEnB,SAAS,CAAC2C,MAAM;EAC7B;AACF;AACA;AACA;AACA;EACEM,gBAAgB,EAAEjD,SAAS,CAACkD,KAAK,CAAC;IAChChC,KAAK,EAAElB,SAAS,CAAC0C,SAAS,CAAC,CAAC1C,SAAS,CAAC2C,MAAM,EAAE3C,SAAS,CAAC4C,OAAO,CAAC,CAAC,CAACH,UAAU;IAC5EU,YAAY,EAAEnD,SAAS,CAAC0C,SAAS,CAAC,CAAC1C,SAAS,CAAC2C,MAAM,EAAE3C,SAAS,CAAC4C,OAAO,CAAC,CAAC,CAACH,UAAU;IACnFW,WAAW,EAAEpD,SAAS,CAAC0C,SAAS,CAAC,CAAC1C,SAAS,CAAC2C,MAAM,EAAE3C,SAAS,CAAC4C,OAAO,CAAC;EACxE,CAAC,CAAC;EACF;EACAS,KAAK,EAAErD,SAAS,CAAC2C,MAAM;EACvB;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACEW,KAAK,EAAEtD,SAAS,CAACkD,KAAK,CAAC;IACrBK,MAAM,EAAEvD,SAAS,CAAC4C,OAAO,CAACH,UAAU;IACpCe,KAAK,EAAExD,SAAS,CAAC4C;EACnB,CAAC,CAAC;EACF;AACF;AACA;AACA;EACEa,aAAa,EAAEzD,SAAS,CAAC2C,MAAM;EAC/B;EACAvB,UAAU,EAAEpB,SAAS,CAACkD,KAAK,CAAC,CAAC,CAAC,CAAC;EAC/B;EACA7B,OAAO,EAAErB,SAAS,CAAC0D,KAAK,CAAC5C,cAAc,CAAC;EACxC;EACA6C,QAAQ,EAAE3D,SAAS,CAAC4D,IAAI;EACxB;EACAtC,oBAAoB,EAAEtB,SAAS,CAAC0D,KAAK,CAAC3C,wBAAwB,CAAC;EAC/D;AACF;AACA;AACA;EACEQ,UAAU,EAAEvB,SAAS,CAAC2C;AACxB,CAAC;AAED3B,WAAW,CAAC6C,YAAY,GAAG;EACzB3C,KAAK,EAAE4C,SAAS;EAChB3C,WAAW,EAAE2C,SAAS;EACtBhC,SAAS,EAAEgC,SAAS;EACpBL,aAAa,EAAEK,SAAS;EACxBT,KAAK,EAAE,EAAE;EACTJ,gBAAgB,EAAE;IAChB/B,KAAK,EAAER,qCAAqC;IAC5CyC,YAAY,EAAExC,6CAA6C;IAC3DyC,WAAW,EAAExC;EACf,CAAC;EACD0C,KAAK,EAAE;IACLE,KAAK,eAAE1D,KAAA,CAAA+B,aAAA,CAACpB,IAAI;MAACsD,GAAG,EAAE7D;IAAM,CAAE,CAAC;IAC3BqD,MAAM,eAAEzD,KAAA,CAAA+B,aAAA,CAACpB,IAAI;MAACsD,GAAG,EAAE9D;IAAO,CAAE;EAC9B,CAAC;EACD4C,MAAM,EAAEA,CAAA,KAAM,CAAC,CAAC;EAChBC,QAAQ,EAAEA,CAAA,KAAM,CAAC,CAAC;EAClBE,OAAO,EAAEA,CAAA,KAAM,CAAC,CAAC;EACjBD,OAAO,EAAEA,CAAA,KAAM,CAAC,CAAC;EACjB3B,UAAU,EAAE,CAAC,CAAC;EACdC,OAAO,EAAE,OAAO;EAChBsC,QAAQ,EAAE,KAAK;EACfrC,oBAAoB,EAAE,UAAU;EAChCC,UAAU,EAAEV;AACd,CAAC;AAEDG,WAAW,CAACgB,QAAQ,GAAG7B,mBAAmB;AAC1Ca,WAAW,CAACkB,KAAK,GAAG7B,gBAAgB;AACpCW,WAAW,CAACmB,KAAK,GAAG7B,gBAAgB;AACpCU,WAAW,CAACoB,WAAW,GAAG7B,sBAAsB;AAChDS,WAAW,CAACqB,YAAY,GAAG7B,uBAAuB;AAClDQ,WAAW,CAACgD,OAAO,GAAG5D,kBAAkB;AAExC,eAAeY,WAAW"}

package/dist/Tabs/index.js

@@ -8,7 +8,7 @@ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typ
 function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-import React, { useEffect, useMemo, useRef } from 'react';
+import React, { useEffect, useMemo, useRef, useState, useCallback } from 'react';
 import classNames from 'classnames';
 import PropTypes from 'prop-types';
 import BaseTabs from 'react-bootstrap/Tabs';
@@ -26,11 +26,11 @@ function Tabs(_ref) {
       activeKey
     } = _ref,
     props = _objectWithoutProperties(_ref, _excluded);
-  const containerElementRef = useRef(null);
+  const [containerElementRef, setContainerElementRef] = useState(null);
   const overflowElementRef = useRef(null);
-  const indexOfLastVisibleChild = useIndexOfLastVisibleChild(containerElementRef.current?.children[0], overflowElementRef.current?.parentNode);
+  const indexOfLastVisibleChild = useIndexOfLastVisibleChild(containerElementRef?.firstChild, overflowElementRef.current?.parentNode);
   useEffect(() => {
-    if (containerElementRef.current) {
+    if (containerElementRef) {
       const observer = new MutationObserver(mutations => {
         mutations.forEach(mutation => {
           // React-Bootstrap attribute 'data-rb-event-key' is responsible for the tab identification
@@ -39,8 +39,8 @@ function Tabs(_ref) {
           const isActive = mutation.target.getAttribute('aria-selected') === 'true';
           // datakey attribute is added manually to the dropdown
           // elements so that they correspond to the native tabs' eventKey
-          const element = containerElementRef.current.querySelector(`[datakey='${eventKey}']`);
-          const moreTab = containerElementRef.current.querySelector('.pgn__tab_more');
+          const element = containerElementRef.querySelector(`[datakey='${eventKey}']`);
+          const moreTab = containerElementRef.querySelector('.pgn__tab_more');
           if (isActive) {
             element?.classList.add('active');
             // Here we add active class to the 'More Tab' if element exists in the dropdown
@@ -54,7 +54,7 @@ function Tabs(_ref) {
           }
         });
       });
-      observer.observe(containerElementRef.current, {
+      observer.observe(containerElementRef, {
         attributes: true,
         subtree: true,
         attributeFilter: ['aria-selected']
@@ -62,16 +62,16 @@ function Tabs(_ref) {
       return () => observer.disconnect();
     }
     return undefined;
-  }, []);
+  }, [containerElementRef]);
   useEffect(() => {
     if (overflowElementRef.current?.parentNode) {
       overflowElementRef.current.parentNode.tabIndex = -1;
     }
   }, [overflowElementRef.current?.parentNode]);
-  const handleDropdownTabClick = eventKey => {
-    const hiddenTab = containerElementRef.current.querySelector(`[data-rb-event-key='${eventKey}']`);
+  const handleDropdownTabClick = useCallback(eventKey => {
+    const hiddenTab = containerElementRef.querySelector(`[data-rb-event-key='${eventKey}']`);
     hiddenTab.click();
-  };
+  }, [containerElementRef]);
   const tabsChildren = useMemo(() => {
     const indexOfOverflowStart = indexOfLastVisibleChild + 1;
     const handleDropdownKeyPress = (e, eventKey) => {
@@ -150,9 +150,9 @@ function Tabs(_ref) {
       }, overflowChildren))
     }));
     return childrenList;
-  }, [activeKey, children, defaultActiveKey, indexOfLastVisibleChild, moreTabText]);
+  }, [activeKey, children, defaultActiveKey, indexOfLastVisibleChild, moreTabText, handleDropdownTabClick]);
   return /*#__PURE__*/React.createElement("div", {
-    ref: containerElementRef
+    ref: setContainerElementRef
   }, /*#__PURE__*/React.createElement(BaseTabs, _extends({
     defaultActiveKey: defaultActiveKey,
     activeKey: activeKey