@salesforcedevs/docs-components - npm Package Compare versions

Comparing version 0.4.3 to 0.4.11

package.json

 {
     "name": "@salesforcedevs/docs-components",
-    "version": "0.4.3",
+    "version": "0.4.11",
     "description": "Docs Lightning web components for DSC",
@@ -17,3 +17,3 @@ "license": "MIT",
     },
-    "gitHead": "608f18afc8dd71922a4c8dfc51c7018ae9b79fb2"
+    "gitHead": "17dba209f8efc70362cf1f6360cb6516f88f4956"
 }

src/modules/doc/content/__tests__/content.test.ts

@@ -22,2 +22,23 @@ import { createRenderComponent } from "utils/tests";
 
+    it("renders both with and wothout pagination buttons", () => {
+        const c_buttons = render({
+            docsData: mockContent.withButtons,
+            pageReference: mockPageReference,
+            showPaginationButtons: true,
+            _isStorybook: false
+        });
+        const dx_buttons = c_buttons.shadowRoot.querySelectorAll("dx-button");
+        expect(dx_buttons.length).toEqual(2);
+
+        const c_no_buttons = render({
+            docsData: mockContent.withButtons,
+            pageReference: mockPageReference,
+            _isStorybook: false
+        });
+        const empty_dx_buttons = c_no_buttons.shadowRoot.querySelectorAll(
+            "dx-button"
+        );
+        expect(empty_dx_buttons.length).toEqual(0);
+    });
+
     it("swaps out images", () => {
@@ -24,0 +45,0 @@ const component = render({

src/modules/doc/content/__tests__/mockDocContent.ts

@@ -31,2 +31,36 @@ export const content = `<div><a name='apex_dev_guide'><!-- --></a><h1 class='helpHead1'>Apex Developer Guide</h1><div class='shortdesc'>Salesforce has changed the way organizations do business by moving enterprise
 
+export const withButtons = `<div><a name='apex_dev_guide'><!-- --></a><h1 class='helpHead1'>Apex Developer Guide</h1><div class='shortdesc'>Salesforce has changed the way organizations do business by moving enterprise
+applications that were traditionally client-server-based into the Lightning Platform, an
+on-demand, multitenant Web environment. This environment enables you to run and customize
+applications, such as Salesforce Automation and Service &amp; Support, and build new custom
+applications based on particular business needs. </div><div id='sfdc:seealso' class='related-links'>
+<ul class='ullinks'>
+<li class='link ulchildlink'>
+<strong><a href='atlas.en-us.apexcode.meta/apexcode/apex_intro_get_started.htm'>Getting Started with Apex</a></strong><br>
+Apex is a strongly typed, object-oriented programming language that allows developers         to execute flow and transaction control statements on the Lightning Platform server, in         conjunction with calls to the API.</li>
+<li class='link ulchildlink'>
+<strong><a href='atlas.en-us.apexcode.meta/apexcode/apex_writing.htm'>Writing Apex</a></strong><br>
+Apex is like Java for Salesforce. It enables you to add and interact with data in the         Lightning Platform persistence layer. It uses classes, data types, variables, and if-else         statements. You can make it execute based on a condition, or have a block of code execute         repeatedly.</li>
+<li class='link ulchildlink'>
+<strong><a href='atlas.en-us.apexcode.meta/apexcode/apex_running.htm'>Running Apex</a></strong><br>
+You can access many features of the Salesforce user interface programmatically in         Apex, and you can integrate with external SOAP and REST Web services. You can run Apex code         using a variety of mechanisms. Apex code runs in atomic transactions. </li>
+<li class='link ulchildlink'>
+<strong><a href='atlas.en-us.apexcode.meta/apexcode/apex_debug_test_deploy.htm'>Debugging, Testing, and Deploying Apex</a></strong><br>
+Develop your Apex code in a sandbox and debug it with the Developer Console and debug         logs. Unit-test your code, then distribute it to customers using packages.</li>
+<li class='link ulchildlink'>
+<strong><a href='atlas.en-us.apexcode.meta/apexcode/apex_reference.htm'>Apex Language Reference</a></strong><br>
+This Apex reference goes into detail about DML statements and the built-in Apex         classes and interfaces.</li>
+<li class='link ulchildlink'>
+<strong><a href='atlas.en-us.apexcode.meta/apexcode/apex_appendices.htm'>Appendices</a></strong><br>
+</li>
+<li class='link ulchildlink'>
+<strong><a href='atlas.en-us.apexcode.meta/apexcode/glossary_apex.htm'>Glossary</a></strong><br>
+</li>
+<div style='display: flex; justify-content: space-between; width: 220px; margin-top: 15px;'>
+<a href='atlas.en-us.apexcode.meta/apexcode/glossary_apex.htm'>← Previous</a>
+<a href='atlas.en-us.apexcode.meta/apexcode/glossary_apex.htm'>Next →</a>
+</div>
+</ul>
+</div><!--DRC 228.7--></div>`;
+
 export const withImages = `<div>
@@ -33,0 +67,0 @@ <div class='section'>

src/modules/doc/content/content.stories.ts

@@ -7,3 +7,12 @@ import * as mockDocContent from "./__tests__/mockDocContent";
     title: "docs/doc-content",
-    component: "doc-content"
+    component: "doc-content",
+
+    argTypes: {
+        showPaginationButtons: {
+            defaultValue: false,
+            control: {
+                type: "boolean"
+            }
+        }
+    }
 };
@@ -48,3 +57,4 @@
         page-reference="${JSON.stringify(args.pageReference)}"
-        docs-data="${args.docsData}">
+        docs-data="${args.docsData}"
+    >
     </doc-content>
@@ -85,1 +95,17 @@ `;
 };
+
+export const PaginationButtons = (args: any) => {
+    return `
+    <doc-content
+        is-storybook="${args.isStorybook}"
+        page-reference="${JSON.stringify(args.pageReference)}"
+        docs-data="${args.docsData}"
+        ${args.showPaginationButtons ? `show-pagination-buttons=true` : ``}
+    ></doc-content>`;
+};
+
+PaginationButtons.args = {
+    ...defaultArgs,
+    showPaginationButtons: false,
+    docsData: mockDocContent.withButtons
+};

src/modules/doc/content/content.ts

@@ -13,2 +13,3 @@ /* eslint-disable @lwc/lwc/no-inner-html */
     @api codeBlockType: string = "card";
+    @api showPaginationButtons: boolean = false;
     @api
@@ -50,2 +51,20 @@ set docsData(value) {
 
+    renderPaginationButton(anchorEl: HTMLElement) {
+        const isNext = anchorEl.textContent.includes("Next →");
+        anchorEl.innerHTML = "";
+        const buttonEl = createElement("dx-button", { is: Button });
+        const params = isNext
+            ? { iconSymbol: "chevronright" }
+            : {
+                  iconPosition: "left",
+                  iconSymbol: "chevronleft",
+                  variant: "secondary"
+              };
+        Object.assign(buttonEl, params);
+        const textEl = document.createDocumentFragment();
+        textEl.textContent = isNext ? "Next" : "Previous";
+        buttonEl.appendChild(textEl);
+        anchorEl.appendChild(buttonEl);
+    }
+
     // We don't use any tracked field here. The challenge is that
@@ -118,26 +137,12 @@ // for security reasons you can't pass pure HTML via a class
         anchorEls.forEach((anchorEl) => {
-            if (anchorEl.textContent.includes("Next →")) {
-                anchorEl.innerHTML = "";
-                const buttonEl = createElement("dx-button", { is: Button });
-                Object.assign(buttonEl, {
-                    iconSymbol: "chevronright"
-                });
-                const textEl = document.createDocumentFragment();
-                textEl.textContent = "Next";
-                buttonEl.appendChild(textEl);
-                anchorEl.appendChild(buttonEl);
+            if (
+                anchorEl.textContent.includes("Next →") ||
+                anchorEl.textContent.includes("← Previous")
+            ) {
+                if (this.showPaginationButtons) {
+                    this.renderPaginationButton(anchorEl);
+                } else {
+                    anchorEl.remove();
+                }
             }
-            if (anchorEl.textContent.includes("← Previous")) {
-                anchorEl.innerHTML = "";
-                const buttonEl = createElement("dx-button", { is: Button });
-                Object.assign(buttonEl, {
-                    iconPosition: "left",
-                    iconSymbol: "chevronleft",
-                    variant: "secondary"
-                });
-                const textEl = document.createDocumentFragment();
-                textEl.textContent = "Previous";
-                buttonEl.appendChild(textEl);
-                anchorEl.appendChild(buttonEl);
-            }
             const href = anchorEl.href.split("/");
@@ -144,0 +149,0 @@ if (

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

417814

increased by1.06%

Lines of code

8110

increased by0.98%

No dependency changes