@nypl/design-system-react-components 1.2.0-rc-2 → 1.2.0-rc-3

package/dist/design-system-react-components.esm.js

@@ -2508,33 +2508,49 @@ var AudioPlayer = /*#__PURE__*/chakra( /*#__PURE__*/forwardRef(function (props,
       id = props.id,
       _props$iframeTitle = props.iframeTitle,
       iframeTitle = _props$iframeTitle === void 0 ? null : _props$iframeTitle,
-      rest = _objectWithoutPropertiesLoose(props, _excluded$Z); // The root iframe object generated from the embedCode.
+      rest = _objectWithoutPropertiesLoose(props, _excluded$Z);
 
+  var _useState = useState(false),
+      invalidEmbed = _useState[0],
+      setInvalidEmbed = _useState[1];
 
-  var iframeDoc = parseIframeEmbedCode(embedCode); // when no embedCode or it was a broken code.
+  var _useState2 = useState(undefined),
+      iframeDoc = _useState2[0],
+      setIframeDoc = _useState2[1];
+  /**
+   * Main hooks to check the embedCode structure.
+   */
 
-  var isInvalidEmbed = !embedCode || !iframeDoc || !isValidEmbedCode(iframeDoc);
-  var errorMessage = "<strong>Error: </strong>This audio player has not been configured properly. Please contact the site administrator.";
 
-  function isValidEmbedCode(doc) {
-    var _doc$src;
+  useEffect(function () {
+    // The root iframe object generated from the embedCode.
+    var iframe = parseIframeEmbedCode(embedCode); // when no embedCode or it was a broken code.
 
-    return audioType !== "file" && (doc == null ? void 0 : (_doc$src = doc.src) == null ? void 0 : _doc$src.includes(audioType + ".com"));
-  } // Only set the iframe title if it doesn't already have it in the iframe.
+    var isInvalidEmbed = !embedCode || !iframe || !isValidEmbedCode(audioType, iframe); // Only set the iframe title if it doesn't already have it in the iframe.
 
+    if (iframe && !iframe.title) {
+      iframe.title = iframeTitle ? iframeTitle : "Embedded audio player";
+    }
 
-  if (iframeDoc && !iframeDoc.title) {
-    iframeDoc.title = iframeTitle ? iframeTitle : "Embedded audio player";
-  }
+    var isThirdPartyService = !!thirdPartyServices.find(function (service) {
+      return service === audioType;
+    });
+    var isThirdPartyWithoutCode = isThirdPartyService && !embedCode;
 
-  var isThirdPartyService = !!thirdPartyServices.find(function (service) {
-    return service === audioType;
-  });
-  var isThirdPartyWithoutCode = isThirdPartyService && !embedCode;
+    if (isThirdPartyWithoutCode) {
+      console.warn("NYPL Reservoir AudioPlayer: The `embedCode` prop is required when using a 3rd party streaming service.");
+      isInvalidEmbed = true;
+    }
+
+    setInvalidEmbed(isInvalidEmbed);
+    setIframeDoc(iframe);
+  }, [embedCode, audioType, iframeTitle]);
+  var errorMessage = "<strong>Error: </strong>This audio player has not been configured properly. Please contact the site administrator.";
+
+  function isValidEmbedCode(audioType, doc) {
+    var _doc$src;
 
-  if (isThirdPartyWithoutCode) {
-    console.warn("NYPL Reservoir AudioPlayer: The `embedCode` prop is required when using a 3rd party streaming service.");
-    isInvalidEmbed = true;
+    return audioType !== "file" && (doc == null ? void 0 : (_doc$src = doc.src) == null ? void 0 : _doc$src.includes(audioType + ".com"));
   }
 
   var styles = useMultiStyleConfig("AudioPlayer", {});
@@ -2561,7 +2577,7 @@ var AudioPlayer = /*#__PURE__*/chakra( /*#__PURE__*/forwardRef(function (props,
     "data-testid": "audio-player-component",
     ref: ref,
     __css: styles
-  }, rest), isInvalidEmbed ? React__default.createElement(Box, {
+  }, rest), invalidEmbed ? React__default.createElement(Box, {
     dangerouslySetInnerHTML: {
       __html: errorMessage
     },
@@ -15587,10 +15603,10 @@ var Tooltip$1 = /*#__PURE__*/chakra( /*#__PURE__*/forwardRef(function (props, re
       shouldWrapChildren = props.shouldWrapChildren,
       rest = _objectWithoutPropertiesLoose(props, _excluded$2d);
 
-  if (typeof content !== "string") {
+  if (typeof content !== "string" && typeof content !== "number") {
     React__default.Children.map(content, function (contentChild) {
       if (contentChild.type !== Icon || contentChild.type !== Image) {
-        console.warn("NYPL Reservoir Tooltip: Pass in a string, DS Icon, or DS Image into the 'content' prop.");
+        console.warn("NYPL Reservoir Tooltip: Pass in a string, number, DS Icon, or DS Image into the 'content' prop.");
       }
     });
   }