@salesforcedevs/docs-components 1.20.13-redocly → 1.20.13-redocly1

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@salesforcedevs/docs-components",
-    "version": "1.20.13-redocly",
+    "version": "1.20.13-redocly1",
     "description": "Docs Lightning web components for DSC",
     "license": "MIT",
     "main": "index.js",

package/src/modules/doc/redocReference/redocReference.html

@@ -2,7 +2,7 @@
     <slot></slot>
     <dx-error-fallback
         if:true={showError}
-        title="API Documentation Unavailable"
-        description="This API reference is currently unavailable. Please try again later."
+        title={title}
+        description={description}
     ></dx-error-fallback>
 </template>

package/src/modules/doc/redocReference/redocReference.ts

@@ -21,6 +21,8 @@ type ReferenceConfig = {
     refList: ReferenceItem[];
 };
 
+declare const Sprig: (eventType: string, eventNme: string) => void;
+
 export default class RedocReference extends LightningElement {
     private _referenceConfig: ReferenceConfig = { refList: [] };
     private _parentDocPhaseInfo: string | null = null;
@@ -31,6 +33,9 @@ export default class RedocReference extends LightningElement {
     private redocInitialized = false;
 
     showError = false;
+    title: string = "API Documentation Unavailable";
+    description: string =
+        "This API reference is currently unavailable. Please try again later.";
 
     @api
     get referenceConfig(): ReferenceConfig {
@@ -42,7 +47,14 @@ export default class RedocReference extends LightningElement {
             const refConfig =
                 typeof value === "string" ? JSON.parse(value) : value;
             this._referenceConfig = refConfig;
-        } catch (e) {
+        } catch (error) {
+            this.title = "Failed to parse reference configuration data";
+            this.description =
+                "An error occurred while reading/parsing the reference configuration. Please check the config file for syntax errors or invalid references and try again.";
+            console.error(
+                "Failed to parse reference configuration data",
+                error
+            );
             this._referenceConfig = { refList: [] };
         }
     }
@@ -187,11 +199,17 @@ export default class RedocReference extends LightningElement {
                     );
                 } else {
                     this.showError = true;
+                    console.error(
+                        "Failed to initialize Redoc, required params missing."
+                    );
                 }
             }
         } catch (error) {
+            this.title = "Failed to load API specification";
+            this.description =
+                "An error occurred while trying to initialize Redoc. This may be due to a missing or invalid source in the configuration file, or a network connectivity issue. Please verify the source path and your internet connection and try again.";
+            console.error("Failed to load API specification", error);
             this.showError = true;
-            console.error("Failed to load data:", error);
         }
     }
 
@@ -209,9 +227,14 @@ export default class RedocReference extends LightningElement {
                         docPhaseInfo
                     );
                 }
-                this.insertSprigSurvey(apiContentDiv as HTMLElement);
+
+                if (typeof Sprig !== "undefined") {
+                    this.insertSprigSurvey(apiContentDiv as HTMLElement);
+                }
+
                 this.insertFooter(apiContentDiv as HTMLElement);
             } catch (error) {
+                this.showError = true;
                 console.error(
                     "Error showing banner and footer elements",
                     error
@@ -247,10 +270,11 @@ export default class RedocReference extends LightningElement {
             is: SprigSurvey
         });
 
-        const wrapper = document.createElement("div");
-        wrapper.className = "feedback-wrapper";
-        wrapper.appendChild(feedbackElement);
-
-        container.appendChild(wrapper);
+        // targeting the last element of middle section of page
+        const targetElement =
+            container.lastElementChild?.firstElementChild?.firstElementChild;
+        if (targetElement) {
+            targetElement.appendChild(feedbackElement);
+        }
     }
 }