powerpagestoolkit 1.3.204 → 1.3.304

package/README.md

@@ -67,7 +67,7 @@ yesRadio: DOMNodeReference;
 noRadio: DOMNodeReference;
 // and if 'this' is the instance of a yesRadio or noRadio
 // checked will represent wether the radio has been checked or not
-checked: boolean
+checked: boolean;
 ```
 
 ##### Methods
@@ -107,7 +107,7 @@ toggleVisibility(shouldShow: boolean | () => boolean)
   */
 configureConditionalRendering(
   condition: (this: DOMNodeReference) => boolean,
-  dependencies: DOMNodeReference[]
+  dependencies: Array<DOMNodeReference>
   )
 
 
@@ -200,6 +200,9 @@ setValue(value: any)
 // Sets the inner HTML content of the associated HTML element.
 setTextContent(text: string)
 
+// set any style attribute for 'this' with standard CSS style declaration
+setStyle(options: Partial<CSSStyleDeclaration>): void;
+
 // Appends child elements to the associated HTML element.
 append(...elements: HTMLElement[])
 

package/dist/index.bundle.js

@@ -935,16 +935,19 @@ var DOMNodeReference = /*#__PURE__*/function () {
     key: "on",
     value: function on(eventType, eventHandler) {
       this.element.addEventListener(eventType, eventHandler.bind(this));
+      return this;
     }
   }, {
     key: "hide",
     value: function hide() {
       this.visibilityController.style.display = "none";
+      return this;
     }
   }, {
     key: "show",
     value: function show() {
       this.visibilityController.style.display = this.defaultDisplay;
+      return this;
     }
   }, {
     key: "toggleVisibility",
@@ -954,6 +957,7 @@ var DOMNodeReference = /*#__PURE__*/function () {
       } else {
         shouldShow ? this.show() : this.hide();
       }
+      return this;
     }
   }, {
     key: "setValue",
@@ -964,6 +968,7 @@ var DOMNodeReference = /*#__PURE__*/function () {
       } else {
         this.element.value = value;
       }
+      return this;
     }
   }, {
     key: "disable",
@@ -973,6 +978,7 @@ var DOMNodeReference = /*#__PURE__*/function () {
       } catch (e) {
         throw new Error("There was an error trying to disable the target: ".concat(this.target));
       }
+      return this;
     }
   }, {
     key: "enable",
@@ -982,6 +988,7 @@ var DOMNodeReference = /*#__PURE__*/function () {
       } catch (e) {
         throw new Error("There was an error trying to disable the target: ".concat(this.target));
       }
+      return this;
     }
   }, {
     key: "prepend",
@@ -997,6 +1004,7 @@ var DOMNodeReference = /*#__PURE__*/function () {
           _this.element.prepend(node);
         }
       });
+      return this;
     }
   }, {
     key: "append",
@@ -1012,6 +1020,7 @@ var DOMNodeReference = /*#__PURE__*/function () {
           _this2.element.append(node);
         }
       });
+      return this;
     }
   }, {
     key: "before",
@@ -1027,6 +1036,7 @@ var DOMNodeReference = /*#__PURE__*/function () {
           _this3.element.before(node);
         }
       });
+      return this;
     }
   }, {
     key: "after",
@@ -1042,6 +1052,7 @@ var DOMNodeReference = /*#__PURE__*/function () {
           _this4.element.after(node);
         }
       });
+      return this;
     }
   }, {
     key: "getLabel",
@@ -1058,21 +1069,37 @@ var DOMNodeReference = /*#__PURE__*/function () {
         }
         label.append.apply(label, [" "].concat(elements));
       }
+      return this;
     }
   }, {
     key: "addLabelTooltip",
     value: function addLabelTooltip(text) {
       this.appendToLabel(CreateInfoEl(text));
+      return this;
     }
   }, {
     key: "addTooltip",
     value: function addTooltip(text) {
       this.append(CreateInfoEl(text));
+      return this;
     }
   }, {
     key: "setTextContent",
     value: function setTextContent(text) {
       this.element.innerHTML = text;
+      return this;
+    }
+  }, {
+    key: "setStyle",
+    value: function setStyle(options) {
+      var _this5 = this;
+      if (Object.prototype.toString.call(options) !== "[object Object]") {
+        throw new Error("powerpagestoolkit: 'DOMNodeReference.setStyle' required options to be in the form of an object. Argument passed was of type: ".concat(DOMNodeReferences_typeof(options)));
+      }
+      Object.keys(options).forEach(function (key) {
+        _this5.element.style[key] = options[key];
+      });
+      return this;
     }
   }, {
     key: "uncheckRadios",
@@ -1083,22 +1110,23 @@ var DOMNodeReference = /*#__PURE__*/function () {
       } else {
         console.error("[SYNACT] Attempted to uncheck radios for an element that has no radios");
       }
+      return this;
     }
   }, {
     key: "configureConditionalRendering",
     value: function configureConditionalRendering(condition, triggerNodes) {
-      var _this5 = this;
+      var _this6 = this;
       try {
         this.toggleVisibility(condition(this));
         if (triggerNodes) {
           var nodes = Array.isArray(triggerNodes) ? triggerNodes : [triggerNodes];
           nodes.forEach(function (node) {
             node.on("change", function () {
-              return _this5.toggleVisibility(condition(_this5));
+              return _this6.toggleVisibility(condition(_this6));
             });
             var observer = new MutationObserver(function () {
               var display = window.getComputedStyle(node.visibilityController).display;
-              _this5.toggleVisibility(display !== "none" && condition(_this5));
+              _this6.toggleVisibility(display !== "none" && condition(_this6));
             });
             observer.observe(node.visibilityController, {
               attributes: true,
@@ -1109,11 +1137,12 @@ var DOMNodeReference = /*#__PURE__*/function () {
       } catch (e) {
         throw new ConditionalRenderingError(this, e);
       }
+      return this;
     }
   }, {
     key: "configureValidationAndRequirements",
     value: function configureValidationAndRequirements(isRequired, isValid, fieldDisplayName) {
-      var _this6 = this;
+      var _this7 = this;
       var dependencies = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : [];
       if (typeof Page_Validators !== "undefined") {
         var newValidator = document.createElement("span");
@@ -1128,13 +1157,14 @@ var DOMNodeReference = /*#__PURE__*/function () {
         throw new Error("Attempted to add to Validator where Page_Validators do not exist");
       }
       this.setRequiredLevel(isRequired(this));
-      if (!dependencies) return;
+      if (!dependencies) return this;
       dependencies = Array.isArray(dependencies) ? dependencies : [dependencies];
       dependencies.forEach(function (dep) {
         dep.element.addEventListener("change", function () {
-          return _this6.setRequiredLevel(isRequired(_this6));
+          return _this7.setRequiredLevel(isRequired(_this7));
         });
       });
+      return this;
     }
   }, {
     key: "setRequiredLevel",
@@ -1144,19 +1174,20 @@ var DOMNodeReference = /*#__PURE__*/function () {
       } else {
         this.getLabel().classList.remove("required-field");
       }
+      return this;
     }
   }, {
     key: "onceLoaded",
     value: function onceLoaded(callback) {
-      var _this7 = this;
+      var _this8 = this;
       if (this.isLoaded) {
         callback(this);
       } else {
         var observer = new MutationObserver(function () {
-          if (document.querySelector(_this7.target)) {
+          if (document.querySelector(_this8.target)) {
             observer.disconnect(); // Stop observing once loaded
-            _this7.isLoaded = true;
-            callback(_this7); // Call the provided callback
+            _this8.isLoaded = true;
+            callback(_this8); // Call the provided callback
           }
         });
         observer.observe(document.body, {

package/index.d.ts

@@ -8,7 +8,6 @@ class DOMNodeReference {
    */
   constructor(target: string): DOMNodeReference;
 
-  target: string;
   /**
    * The element targeted when instantiating DOMNodeReference.
    * Made available in order to perform normal DOM traversal,
@@ -17,8 +16,6 @@ class DOMNodeReference {
    */
   element: HTMLElement | null;
   isLoaded: boolean;
-  visibilityController: HTMLElement | null;
-  defaultDisplay: string;
   /**
    * The value of the element that this node represents
    * stays in syncs with the live DOM elements via event handler
@@ -167,6 +164,13 @@ class DOMNodeReference {
    */
   setTextContent(text: string): void;
 
+  /**
+   *
+   * @param {Partial<CSSStyleDeclaration>} options - An object with the style properties (keys) and updated styles (values)
+   * to apply to the this. {"key": "value"}
+   */
+  setStyle(options: Partial<CSSStyleDeclaration>): void;
+
   /**
    *
    * @param {boolean} shouldShow shows or hides the target

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "powerpagestoolkit",
-  "version": "1.3.204",
+  "version": "1.3.304",
   "description": "Reference, manipulate, and engage with Power Pages sites through the nodes in the DOM; use a variety of custom methods that allow customizing your power pages site quicker and easier.  ",
   "main": "./dist/index.bundle.js",
   "types": "index.d.ts",