powerpagestoolkit 1.3.4 → 1.3.5

package/dist/DOMNodeReference.js

@@ -0,0 +1,447 @@
+import waitFor from "@/waitFor.js";
+import createInfoEl from "@/createInfoElement.js";
+import { DOMNodeInitializationError, DOMNodeNotFoundError, ConditionalRenderingError, } from "@/errors.js";
+import { createDOMNodeReference } from "@/createDOMNodeReferences.js";
+export const _init = Symbol("_init");
+/******/ /******/ /******/ export default class DOMNodeReference {
+    // properties initialized in the constructor
+    target;
+    isLoaded;
+    defaultDisplay;
+    /**
+     * The value of the element that this node represents
+     * stays in syncs with the live DOM elements via event handler
+     * @type {any}
+     */
+    value;
+    /**
+     * Creates an instance of DOMNodeReference.
+     * @param {string} target - The CSS selector to find the desired DOM element.
+     */
+    /******/ /******/ constructor(target) {
+        this.target = target;
+        this.isLoaded = false;
+        this.defaultDisplay = "";
+        this.value = null;
+        // we defer the rest of initialization
+    }
+    async [_init]() {
+        /**
+         * dynamically define the _init method using our custom symbol
+         * this makes it so that the _init method cannot be accessed outside
+         * of this package: i.e. by any consumers of the package
+         */
+        try {
+            const element = await waitFor(this.target);
+            this.element = element;
+            if (!this.element) {
+                throw new DOMNodeNotFoundError(this);
+            }
+            if (this.element.classList.contains("boolean-radio")) {
+                await this._attachRadioButtons();
+            }
+            this._initValueSync();
+            this._attachVisibilityController();
+            this.defaultDisplay = this.visibilityController.style.display;
+            this.isLoaded = true;
+        }
+        catch (e) {
+            throw new DOMNodeInitializationError(this, e);
+        }
+    }
+    // Function to update this.value based on element type
+    _initValueSync() {
+        // Initial sync
+        this.updateValue();
+        // Event listeners for real-time changes based on element type
+        const elementType = this.element.type;
+        if (elementType === "checkbox" || elementType === "radio") {
+            this.element.addEventListener("click", this.updateValue.bind(this));
+        }
+        else if (elementType === "select-one" ||
+            elementType === "select-multiple") {
+            this.element.addEventListener("change", this.updateValue.bind(this));
+        }
+        else {
+            this.element.addEventListener("input", this.updateValue.bind(this));
+        }
+    }
+    updateValue() {
+        switch (this.element.type) {
+            case "checkbox":
+            case "radio":
+                this.value = this.element.checked;
+                this.checked = this.element.checked;
+                break;
+            case "select-multiple":
+                this.value = Array.from(this.element.selectedOptions).map((option) => option.value);
+                break;
+            case "number":
+                this.value =
+                    this.element.value !== ""
+                        ? Number(this.element.value)
+                        : null;
+                break;
+            default:
+                this.value = null;
+                break;
+        }
+        if (this.element.classList.contains("boolean-radio")) {
+            this.yesRadio.updateValue();
+            this.noRadio.updateValue();
+        }
+    }
+    _attachVisibilityController() {
+        // Set the default visibility controller to the element itself
+        this.visibilityController = this.element;
+        // If the element is a table, use its closest fieldset as the controller
+        if (this.element.tagName === "TABLE") {
+            const fieldset = this.element.closest("fieldset");
+            if (fieldset) {
+                this.visibilityController = fieldset;
+            }
+            return;
+        }
+        // For specific tag types, use the closest 'td' if available as the controller
+        const tagsRequiringTdParent = [
+            "SPAN",
+            "INPUT",
+            "TEXTAREA",
+            "SELECT",
+            "TABLE",
+        ];
+        if (tagsRequiringTdParent.includes(this.element.tagName)) {
+            const tdParent = this.element.closest("td");
+            if (tdParent) {
+                this.visibilityController = tdParent;
+            }
+        }
+    }
+    async _attachRadioButtons() {
+        this.yesRadio = await createDOMNodeReference(`#${this.element.id}_1`);
+        this.noRadio = await createDOMNodeReference(`#${this.element.id}_0`);
+    }
+    /**
+     * Sets up an event listener based on the specified event type, executing the specified
+     * event handler
+     * @param {string} eventType - The DOM event to watch for
+     * @param {(this: DOMNodeReference, e: Event) => void} eventHandler - The callback function that runs when the
+     * specified event occurs
+     * @returns - Instance of this
+     */
+    on(eventType, eventHandler) {
+        this.element.addEventListener(eventType, eventHandler.bind(this));
+        return this;
+    }
+    /**
+     * Hides the element by setting its display style to "none".
+     * @returns - Instance of this
+     */
+    hide() {
+        this.visibilityController.style.display = "none";
+        return this;
+    }
+    /**
+     * Shows the element by restoring its default display style.
+     * @returns - Instance of this
+     */
+    show() {
+        this.visibilityController.style.display = this.defaultDisplay;
+        return this;
+    }
+    /**
+     *
+     * @param {function(this: DOMNodeReference): boolean | boolean} shouldShow - Either a function that returns true or false,
+     * or a natural boolean to determine the visibility of this
+     * @returns - Instance of this
+     */
+    toggleVisibility(shouldShow) {
+        if (shouldShow instanceof Function) {
+            shouldShow(this) ? this.show() : this.hide();
+        }
+        else {
+            shouldShow ? this.show() : this.hide();
+        }
+        return this;
+    }
+    /**
+     * Sets the value of the HTML element.
+     * @param {() => any} value - The value to set for the HTML element.
+     * for parents of boolean radios, pass true or false as value, or
+     * an expression returning a boolean
+     * @returns - Instance of this
+     */
+    setValue(value) {
+        if (this.element.classList.contains("boolean-radio")) {
+            this.yesRadio.element.checked = value;
+            this.noRadio.element.checked =
+                !value;
+        }
+        else {
+            this.element.value = value;
+        }
+        return this;
+    }
+    /**
+     * Disables the element so that users cannot input any data
+     * @returns - Instance of this
+     */
+    disable() {
+        try {
+            this.element.disabled = true;
+        }
+        catch (e) {
+            throw new Error(`There was an error trying to disable the target: ${this.target}`);
+        }
+        return this;
+    }
+    /**
+     * Enables the element so that users can input data
+     * @returns - Instance of this
+     */
+    enable() {
+        try {
+            this.element.disabled = false;
+        }
+        catch (e) {
+            throw new Error(`There was an error trying to disable the target: ${this.target}`);
+        }
+        return this;
+    }
+    /**
+     *
+     * @param {...HTMLElement} elements - The elements to prepend to the element targeted by this.
+     * @returns - Instance of this
+     */
+    prepend(...elements) {
+        this.element.prepend(...elements);
+        return this;
+    }
+    /**
+     * Appends child elements to the HTML element.
+     * @param {...HTMLElement} elements - The elements to append to the element targeted by this.
+     * @returns - Instance of this
+     */
+    append(...elements) {
+        this.element.append(...elements);
+        return this;
+    }
+    /**
+     * Inserts elements before the HTML element.
+     * @param {...HTMLElement} elements - The elements to insert before the HTML element.
+     * @returns - Instance of this
+     */
+    before(...elements) {
+        this.element.before(...elements);
+        return this;
+    }
+    /**
+     * Inserts elements after the HTML element.
+     * @param {...HTMLElement} elements - The elements to insert after the HTML element.
+     * @returns - Instance of this
+     */
+    after(...elements) {
+        this.element.after(...elements);
+        return this;
+    }
+    /**
+     * Retrieves the label associated with the HTML element.
+     * @returns {HTMLElement} The label element associated with this element.
+     */
+    getLabel() {
+        return document.querySelector(`#${this.element.id}_label`) || null;
+    }
+    /**
+     * Appends child elements to the label associated with the HTML element.
+     * @param {...HTMLElement} elements - The elements to append to the label.
+     * @returns - Instance of this
+     */
+    appendToLabel(...elements) {
+        const label = this.getLabel();
+        if (label) {
+            label.append(" ", ...elements);
+        }
+        return this;
+    }
+    /**
+     * Adds a tooltip with specified text to the label associated with the HTML element.
+     * @param {string} text - The text to display in the tooltip.
+     * @returns - Instance of this
+     */
+    addLabelTooltip(text) {
+        this.appendToLabel(createInfoEl(text));
+        return this;
+    }
+    /**
+     * Adds a tooltip with the specified text to the element
+     * @param {string} text - The text to display in the tooltip
+     * @returns - Instance of this
+     */
+    addTooltip(text) {
+        this.append(createInfoEl(text));
+        return this;
+    }
+    /**
+     * Sets the inner HTML content of the HTML element.
+     * @param {string} string - The text to set as the inner HTML of the element.
+     * @returns - Instance of this
+     */
+    setInnerHTML(string) {
+        this.element.innerHTML = string;
+        return this;
+    }
+    /**
+     * Removes this element from the DOM
+     * @returns - Instance of this
+     */
+    remove() {
+        this.element.remove();
+        return this;
+    }
+    /**
+     *
+     * @param {Partial<CSSStyleDeclaration} options and object containing the styles you want to set : {key: value} e.g.: {'display': 'block'}
+     * @returns - Instance of this
+     */
+    setStyle(options) {
+        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: ${typeof options}`);
+        }
+        for (const key in options) {
+            this.element.style[key] = options[key];
+        }
+        return this;
+    }
+    /**
+     * Unchecks both the yes and no radio buttons if they exist.
+     * @returns - Instance of this
+     */
+    uncheckRadios() {
+        if (this.yesRadio && this.noRadio) {
+            this.yesRadio.element.checked = false;
+            this.noRadio.element.checked = false;
+        }
+        else {
+            console.error("[SYNACT] Attempted to uncheck radios for an element that has no radios");
+        }
+        return this;
+    }
+    /**
+     * Configures conditional rendering for the target element based on a condition
+     * and the visibility of one or more trigger elements.
+     *
+     * @param {(this: DOMNodeReference) => boolean} condition - A function that returns a boolean to determine
+     * the visibility of the target element. If `condition()` returns true, the element is shown;
+     * otherwise, it is hidden.
+     * @param {Array<DOMNodeReference>} [dependencies] - An array of `DOMNodeReference` instances. Event listeners are
+     * registered on each to toggle the visibility of the target element based on the `condition` and the visibility of
+     * the target node.
+     * @returns - Instance of this
+     */
+    configureConditionalRendering(condition, dependencies) {
+        try {
+            this.toggleVisibility(condition());
+            if (!dependencies) {
+                console.warn(`powerpagestoolkit: No dependencies were found when configuring conditional rendering for ${this}. Be sure that if you are referencing other nodes in your rendering logic, that you include those nodes in the dependency array`);
+                return this;
+            }
+            dependencies.forEach((node) => {
+                node.on("change", () => this.toggleVisibility(condition()));
+                const observer = new MutationObserver(() => {
+                    const display = window.getComputedStyle(node.visibilityController).display;
+                    this.toggleVisibility(display !== "none" && condition());
+                });
+                observer.observe(node.visibilityController, {
+                    attributes: true,
+                    attributeFilter: ["style"],
+                });
+            });
+            return this;
+        }
+        catch (e) {
+            throw new ConditionalRenderingError(this, e);
+        }
+    }
+    /**
+     * Sets up validation and requirement rules for the field. This function dynamically updates the field's required status and validates its input based on the specified conditions.
+     *
+     * @param {function(this: DOMNodeReference): boolean} isRequired - A function that determines whether the field should be required. Returns `true` if required, `false` otherwise.
+     * @param {function(this: DOMNodeReference): boolean} isValid - A function that checks if the field's input is valid. Returns `true` if valid, `false` otherwise.
+     * @param {string} fieldDisplayName - The name of the field, used in error messages if validation fails.
+     * @param {Array<DOMNodeReference>} [dependencies] Other fields that this field’s requirement depends on. When these fields change, the required status of this field is re-evaluated. Make sure any DOMNodeReference used in `isRequired` or `isValid` is included in this array.
+     * @returns - Instance of this
+     */
+    configureValidationAndRequirements(isRequired, isValid, fieldDisplayName, dependencies) {
+        if (typeof Page_Validators !== "undefined") {
+            const newValidator = document.createElement("span");
+            newValidator.style.display = "none";
+            newValidator.id = `${this.element.id}Validator`;
+            newValidator.controltovalidate = this.element.id;
+            newValidator.errormessage = `<a href='#${this.element.id}_label'>${fieldDisplayName} is a required field</a>`;
+            newValidator.evaluationfunction = isValid.bind(this);
+            //eslint-disable-next-line
+            Page_Validators.push(newValidator);
+        }
+        else {
+            throw new Error("Attempted to add to Validator where Page_Validators do not exist");
+        }
+        this.setRequiredLevel(isRequired(this));
+        if (!dependencies) {
+            console.warn(`powerpagestoolkit: No dependencies were found when configuring requirement and validation for ${this}. Be sure that if you are referencing other nodes in your requirement or validation logic, that you include those nodes in the dependency array`);
+            return this;
+        }
+        dependencies.forEach((dep) => {
+            dep.element.addEventListener("change", () => this.setRequiredLevel(isRequired(this)));
+        });
+        return this;
+    }
+    /**
+     * Sets the required level for the field by adding or removing the "required-field" class on the label.
+     *
+     * @param {boolean} isRequired - Determines whether the field should be marked as required.
+     * If true, the "required-field" class is added to the label; if false, it is removed.
+     * @returns - Instance of this
+     */
+    setRequiredLevel(isRequired) {
+        if (isRequired instanceof Function) {
+            isRequired()
+                ? this.getLabel()?.classList.add("required-field")
+                : this.getLabel()?.classList.remove("required-field");
+            return this;
+        }
+        else {
+            isRequired
+                ? this.getLabel()?.classList.add("required-field")
+                : this.getLabel()?.classList.remove("required-field");
+            return this;
+        }
+    }
+    /**
+     * Executes a callback function once the element is fully loaded.
+     * If the element is already loaded, the callback is called immediately.
+     * Otherwise, a MutationObserver is used to detect when the element is added to the DOM.
+     * @param {Function} callback - A callback function to execute once the element is loaded.
+     */
+    onceLoaded(callback) {
+        if (this.isLoaded) {
+            callback(this);
+            return;
+        }
+        if (this.target instanceof HTMLElement) {
+            callback(this);
+            return;
+        }
+        const observer = new MutationObserver(() => {
+            if (document.querySelector(this.target)) {
+                observer.disconnect(); // Stop observing once loaded
+                this.isLoaded = true;
+                callback(this); // Call the provided callback
+            }
+        });
+        observer.observe(document.body, {
+            subtree: true,
+            childList: true,
+        });
+    }
+}
+//# sourceMappingURL=DOMNodeReference.js.map

package/dist/DOMNodeReference.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DOMNodeReference.js","sourceRoot":"","sources":["../src/DOMNodeReference.ts"],"names":[],"mappings":"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"}

package/dist/List.js

@@ -0,0 +1,18 @@
+import { createMultipleDOMNodeReferences } from "./createDOMNodeReferences.js";
+import DOMNodeReference, { _init } from "./DOMNodeReference.js";
+export const _listInit = Symbol("_listInit");
+/******/ /******/ /******/ export default class List extends DOMNodeReference {
+    constructor(target) {
+        super(target);
+        this.listItems = [];
+    }
+    async [_listInit]() {
+        await super[_init]();
+        const li = await createMultipleDOMNodeReferences("div.ms-DetailsRow-fields");
+        console.log(li);
+        setTimeout(() => {
+            console.log(li);
+        }, 1000);
+    }
+}
+//# sourceMappingURL=List.js.map

package/dist/List.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"List.js","sourceRoot":"","sources":["../src/List.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,+BAA+B,EAAE,MAAM,8BAA8B,CAAC;AAC/E,OAAO,gBAAgB,EAAE,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAEhE,MAAM,CAAC,MAAM,SAAS,GAAG,MAAM,CAAC,WAAW,CAAC,CAAC;AAE7C,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,OAAO,OAAO,IAAK,SAAQ,gBAAgB;IAM3E,YAAY,MAA4B;QACtC,KAAK,CAAC,MAAM,CAAC,CAAC;QACd,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;IACtB,CAAC;IAEM,KAAK,CAAC,CAAC,SAAS,CAAC;QACtB,MAAM,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC;QACrB,MAAM,EAAE,GAAG,MAAM,+BAA+B,CAC9C,0BAA0B,CAC3B,CAAC;QACF,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;QAChB,UAAU,CAAC,GAAG,EAAE;YACd,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;QAClB,CAAC,EAAE,IAAI,CAAC,CAAC;IACX,CAAC;CACF"}

package/dist/ListItem.js

@@ -0,0 +1,28 @@
+import DOMNodeReference from "./DOMNodeReference.js";
+/******/ /******/ /******/ export default class ListItem extends DOMNodeReference {
+    constructor(target) {
+        super(target);
+        // this.firstColumn = this.element.querySelector(
+        //   "div[role='gridcell']"
+        // ) as HTMLElement;
+    }
+    removeTarget() {
+        this.element.querySelectorAll("a").forEach((el) => {
+            el.removeAttribute("href");
+        });
+    }
+    setFirstRowLink(path) {
+        // get the first row, turn it into an <a href="path"/>
+        const a = this.firstColumn?.querySelector("a");
+        if (a) {
+            a.href = path;
+        }
+        else {
+            const a = document.createElement("a");
+            a.innerHTML = this.firstColumn.innerHTML;
+            a.href = path;
+        }
+        return this;
+    }
+}
+//# sourceMappingURL=ListItem.js.map

package/dist/ListItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItem.js","sourceRoot":"","sources":["../src/ListItem.ts"],"names":[],"mappings":"AAAA,OAAO,gBAAgB,MAAM,uBAAuB,CAAC;AAErD,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,OAAO,OAAO,QAAS,SAAQ,gBAAgB;IAM/E,YAAY,MAA4B;QACtC,KAAK,CAAC,MAAM,CAAC,CAAC;QACd,iDAAiD;QACjD,2BAA2B;QAC3B,oBAAoB;IACtB,CAAC;IAEM,YAAY;QACjB,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE;YAChD,EAAE,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;QAC7B,CAAC,CAAC,CAAC;IACL,CAAC;IAEM,eAAe,CAAC,IAAY;QACjC,sDAAsD;QACtD,MAAM,CAAC,GAAG,IAAI,CAAC,WAAW,EAAE,aAAa,CAAC,GAAG,CAAC,CAAC;QAC/C,IAAI,CAAC,EAAE,CAAC;YACN,CAAC,CAAC,IAAI,GAAG,IAAI,CAAC;QAChB,CAAC;aAAM,CAAC;YACN,MAAM,CAAC,GAAG,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;YACtC,CAAC,CAAC,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC;YACzC,CAAC,CAAC,IAAI,GAAG,IAAI,CAAC;QAChB,CAAC;QAED,OAAO,IAAI,CAAC;IACd,CAAC;CACF"}

package/dist/bundle.css

@@ -0,0 +1,36 @@
+/* src/style.css */
+.info-icon {
+  position: relative;
+  display: inline-block;
+}
+.info-icon .fa-info-circle {
+  cursor: pointer;
+}
+.info-icon .flyout-content {
+  max-width: calc(100vw - 20px);
+  display: none;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  background-color: #f9f9f9;
+  padding: 10px;
+  border: 1px solid #ddd;
+  z-index: 1;
+  min-width: 200px;
+  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
+  border-radius: 4px;
+}
+@media (max-width: 600px) {
+  .info-icon .flyout-content {
+    max-width: 95vw;
+    padding: 12px;
+    font-size: 0.9em;
+    display: block;
+    right: auto;
+  }
+}
+.required-field::after {
+  content: " *" !important;
+  color: #f00 !important;
+}
+/*# sourceMappingURL=bundle.css.map */

package/dist/bundle.css.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/style.css"],
+  "sourcesContent": [".info-icon {\r\n  position: relative;\r\n  display: inline-block;\r\n}\r\n\r\n.info-icon .fa-info-circle {\r\n  cursor: pointer; /* Ensures the icon is recognized as interactive */\r\n}\r\n\r\n.info-icon .flyout-content {\r\n  max-width: calc(100vw - 20px); /* 20px margin on both sides */\r\n  display: none; /* Initially hidden */\r\n  position: absolute;\r\n  left: 50%; /* Center horizontally */\r\n  transform: translateX(-50%); /* Adjust positioning */\r\n  background-color: #f9f9f9;\r\n  padding: 10px;\r\n  border: 1px solid #ddd;\r\n  z-index: 1;\r\n  min-width: 200px; /* Minimum width for better readability */\r\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);\r\n  border-radius: 4px; /* Rounded corners */\r\n}\r\n\r\n@media (max-width: 600px) {\r\n  .info-icon .flyout-content {\r\n    max-width: 95vw;\r\n    padding: 12px;\r\n    font-size: 0.9em;\r\n    display: block;\r\n    right: auto;\r\n  }\r\n}\r\n\r\n.required-field::after {\r\n  content: \" *\" !important;\r\n  color: #f00 !important;\r\n}\r\n"],
+  "mappings": ";AAAA,CAAC;AACC,YAAU;AACV,WAAS;AACX;AAEA,CALC,UAKU,CAAC;AACV,UAAQ;AACV;AAEA,CATC,UASU,CAAC;AACV,aAAW,KAAK,MAAM,EAAE;AACxB,WAAS;AACT,YAAU;AACV,QAAM;AACN,aAAW,WAAW;AACtB,oBAAkB;AAClB,WAAS;AACT,UAAQ,IAAI,MAAM;AAClB,WAAS;AACT,aAAW;AACX,cAAY,IAAI,IAAI,IAAI,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;AACtC,iBAAe;AACjB;AAEA,OAAO,CAAC,SAAS,EAAE;AACjB,GAzBD,UAyBY,CAhBD;AAiBR,eAAW;AACX,aAAS;AACT,eAAW;AACX,aAAS;AACT,WAAO;AACT;AACF;AAEA,CAAC,cAAc;AACb,WAAS;AACT,SAAO;AACT;",
+  "names": []
+}