placer-toolkit 0.5.1 → 1.0.0-alpha.2

package/dist/internal/form.js

@@ -1,282 +1,314 @@
-const formCollections = new WeakMap();
-const reportValidityOverloads = new WeakMap();
-const checkValidityOverloads = new WeakMap();
-const userInteractedControls = new WeakSet();
-const interactions = new WeakMap();
-class FormControlController {
-    constructor(host, options) {
-        this.handleFormData = (event) => {
-            const disabled = this.options.disabled(this.host);
-            const name = this.options.name(this.host);
-            const value = this.options.value(this.host);
-            if (this.host.isConnected &&
-                !disabled &&
-                typeof name === "string" &&
-                name.length > 0 &&
-                typeof value !== "undefined") {
-                if (Array.isArray(value)) {
-                    value.forEach((val) => {
-                        event.formData.append(name, val.toString());
-                    });
-                }
-                else {
-                    event.formData.append(name, value.toString());
-                }
-            }
-        };
-        this.handleFormSubmit = (event) => {
-            const disabled = this.options.disabled(this.host);
-            const reportValidity = this.options.reportValidity;
-            if (this.form && !this.form.noValidate) {
-                formCollections.get(this.form)?.forEach((control) => {
-                    this.setUserInteracted(control, true);
-                });
-            }
-            if (this.form &&
-                !this.form.noValidate &&
-                !disabled &&
-                !reportValidity(this.host)) {
-                event.preventDefault();
-                event.stopImmediatePropagation();
-            }
-        };
-        this.handleFormReset = () => {
-            this.options.setValue(this.host, this.options.defaultValue(this.host));
-            this.setUserInteracted(this.host, false);
-            interactions.set(this.host, []);
-        };
-        this.handleInteraction = (event) => {
-            const emittedEvents = interactions.get(this.host);
-            if (!emittedEvents.includes(event.type)) {
-                emittedEvents.push(event.type);
-            }
-            if (emittedEvents.length === this.options.assumeInteractionOn.length) {
-                this.setUserInteracted(this.host, true);
-            }
-        };
-        this.checkFormValidity = () => {
-            if (this.form && !this.form.noValidate) {
-                const elements = this.form.querySelectorAll("*");
-                for (const element of Array.from(elements)) {
-                    if (typeof element.checkValidity === "function") {
-                        if (!element.checkValidity()) {
-                            return false;
-                        }
-                    }
-                }
-            }
-            return true;
-        };
-        this.reportFormValidity = () => {
-            if (this.form && !this.form.noValidate) {
-                const elements = this.form.querySelectorAll("*");
-                for (const element of Array.from(elements)) {
-                    if (typeof element.reportValidity === "function") {
-                        if (!element.reportValidity()) {
-                            return false;
-                        }
-                    }
-                }
-            }
-            return true;
-        };
-        (this.host = host).addController(this);
-        this.options = {
-            form: (input) => input.closest("form"),
-            name: (input) => input.name,
-            value: (input) => input.value,
-            defaultValue: (input) => input.defaultValue,
-            disabled: (input) => input.disabled,
-            reportValidity: (input) => typeof input.reportValidity === "function"
-                ? input.reportValidity()
-                : true,
-            checkValidity: (input) => typeof input.checkValidity === "function"
-                ? input.checkValidity()
-                : true,
-            setValue: (input, value) => (input.value = value),
-            assumeInteractionOn: ["input"],
-            ...options,
-        };
-    }
-    hostConnected() {
-        const form = this.options.form(this.host);
-        if (form) {
-            this.attachForm(form);
+// src/internal/form.ts
+var formCollections = /* @__PURE__ */ new WeakMap();
+var reportValidityOverloads = /* @__PURE__ */ new WeakMap();
+var checkValidityOverloads = /* @__PURE__ */ new WeakMap();
+var userInteractedControls = /* @__PURE__ */ new WeakSet();
+var interactions = /* @__PURE__ */ new WeakMap();
+var FormControlController = class {
+  constructor(host, options) {
+    this.handleFormData = (event) => {
+      const disabled = this.options.disabled(this.host);
+      const name = this.options.name(this.host);
+      const value = this.options.value(this.host);
+      const isButton = this.host.tagName.toLowerCase() === "pc-button";
+      if (this.host.isConnected && !disabled && !isButton && typeof name === "string" && name.length > 0 && typeof value !== "undefined") {
+        if (Array.isArray(value)) {
+          value.forEach((val) => {
+            event.formData.append(
+              name,
+              val.toString()
+            );
+          });
+        } else {
+          event.formData.append(
+            name,
+            value.toString()
+          );
         }
-        interactions.set(this.host, []);
-        this.options.assumeInteractionOn.forEach((event) => {
-            this.host.addEventListener(event, this.handleInteraction);
+      }
+    };
+    this.handleFormSubmit = (event) => {
+      const disabled = this.options.disabled(this.host);
+      const reportValidity = this.options.reportValidity;
+      if (this.form && !this.form.noValidate) {
+        formCollections.get(this.form)?.forEach((control) => {
+          this.setUserInteracted(control, true);
         });
-    }
-    hostDisconnected() {
-        this.detachForm();
-        interactions.delete(this.host);
-        this.options.assumeInteractionOn.forEach((event) => {
-            this.host.removeEventListener(event, this.handleInteraction);
-        });
-    }
-    hostUpdated() {
-        const form = this.options.form(this.host);
-        if (!form) {
-            this.detachForm();
-        }
-        if (form && this.form !== form) {
-            this.detachForm();
-            this.attachForm(form);
-        }
-        if ("hasUpdated" in this.host && this.host.hasUpdated) {
-            this.setValidity(this.host.validity.valid);
-        }
-    }
-    attachForm(form) {
-        if (form) {
-            this.form = form;
-            if (formCollections.has(this.form)) {
-                formCollections.get(this.form).add(this.host);
-            }
-            else {
-                formCollections.set(this.form, new Set([this.host]));
+      }
+      if (this.form && !this.form.noValidate && !disabled && !reportValidity(this.host)) {
+        event.preventDefault();
+        event.stopImmediatePropagation();
+      }
+    };
+    this.handleFormReset = () => {
+      this.options.setValue(this.host, this.options.defaultValue(this.host));
+      this.setUserInteracted(this.host, false);
+      interactions.set(this.host, []);
+    };
+    this.handleInteraction = (event) => {
+      const emittedEvents = interactions.get(this.host);
+      if (!emittedEvents.includes(event.type)) {
+        emittedEvents.push(event.type);
+      }
+      if (emittedEvents.length === this.options.assumeInteractionOn.length) {
+        this.setUserInteracted(this.host, true);
+      }
+    };
+    this.checkFormValidity = () => {
+      if (this.form && !this.form.noValidate) {
+        const elements = this.form.querySelectorAll("*");
+        for (const element of elements) {
+          if (typeof element.checkValidity === "function") {
+            if (!element.checkValidity()) {
+              return false;
             }
-            this.form.addEventListener("formdata", this.handleFormData);
-            this.form.addEventListener("submit", this.handleFormSubmit);
-            this.form.addEventListener("reset", this.handleFormReset);
-            if (!reportValidityOverloads.has(this.form)) {
-                reportValidityOverloads.set(this.form, this.form.reportValidity);
-                this.form.reportValidity = () => this.reportFormValidity();
-            }
-            if (!checkValidityOverloads.has(this.form)) {
-                checkValidityOverloads.set(this.form, this.form.checkValidity);
-                this.form.checkValidity = () => this.checkFormValidity();
+          }
+        }
+      }
+      return true;
+    };
+    this.reportFormValidity = () => {
+      if (this.form && !this.form.noValidate) {
+        const elements = this.form.querySelectorAll("*");
+        for (const element of elements) {
+          if (typeof element.reportValidity === "function") {
+            if (!element.reportValidity()) {
+              return false;
             }
+          }
         }
-        else {
-            this.form = undefined;
+      }
+      return true;
+    };
+    (this.host = host).addController(this);
+    this.options = {
+      form: (input) => {
+        const formID = input.form;
+        if (formID) {
+          const root = input.getRootNode();
+          const form = root.querySelector(`#${formID}`);
+          if (form) {
+            return form;
+          }
         }
+        return input.closest("form");
+      },
+      name: (input) => input.name,
+      value: (input) => input.value,
+      defaultValue: (input) => input.defaultValue,
+      disabled: (input) => input.disabled ?? false,
+      reportValidity: (input) => typeof input.reportValidity === "function" ? input.reportValidity() : true,
+      checkValidity: (input) => typeof input.checkValidity === "function" ? input.checkValidity() : true,
+      setValue: (input, value) => input.value = value,
+      assumeInteractionOn: ["pc-input"],
+      ...options
+    };
+  }
+  hostConnected() {
+    const form = this.options.form(this.host);
+    if (form) {
+      this.attachForm(form);
     }
-    detachForm() {
-        if (!this.form) {
-            return;
-        }
-        const formCollection = formCollections.get(this.form);
-        if (!formCollection) {
-            return;
-        }
-        formCollection.delete(this.host);
-        if (formCollection.size <= 0) {
-            this.form.removeEventListener("formdata", this.handleFormData);
-            this.form.removeEventListener("submit", this.handleFormSubmit);
-            this.form.removeEventListener("reset", this.handleFormReset);
-            if (reportValidityOverloads.has(this.form)) {
-                this.form.reportValidity = reportValidityOverloads.get(this.form);
-                reportValidityOverloads.delete(this.form);
-            }
-            if (checkValidityOverloads.has(this.form)) {
-                this.form.checkValidity = checkValidityOverloads.get(this.form);
-                checkValidityOverloads.delete(this.form);
-            }
-            this.form = undefined;
-        }
+    interactions.set(this.host, []);
+    this.options.assumeInteractionOn.forEach((event) => {
+      this.host.addEventListener(event, this.handleInteraction);
+    });
+  }
+  hostDisconnected() {
+    this.detachForm();
+    interactions.delete(this.host);
+    this.options.assumeInteractionOn.forEach((event) => {
+      this.host.removeEventListener(event, this.handleInteraction);
+    });
+  }
+  hostUpdated() {
+    const form = this.options.form(this.host);
+    if (!form) {
+      this.detachForm();
     }
-    setUserInteracted(el, hasInteracted) {
-        if (hasInteracted) {
-            userInteractedControls.add(el);
-        }
-        else {
-            userInteractedControls.delete(el);
-        }
-        el.dispatchEvent(new Event("update"));
+    if (form && this.form !== form) {
+      this.detachForm();
+      this.attachForm(form);
     }
-    doAction(type, submitter) {
-        if (this.form) {
-            const button = document.createElement("button");
-            button.type = type;
-            button.style.position = "absolute";
-            button.style.width = "0";
-            button.style.height = "0";
-            button.style.clipPath = "inset(50%)";
-            button.style.overflow = "hidden";
-            button.style.whiteSpace = "nowrap";
-            if (submitter) {
-                button.name = submitter.name;
-                button.value = submitter.value;
-                [
-                    "formaction",
-                    "formenctype",
-                    "formmethod",
-                    "formnovalidate",
-                    "formtarget",
-                ].forEach((attr) => {
-                    if (submitter.hasAttribute(attr)) {
-                        button.setAttribute(attr, submitter.getAttribute(attr));
-                    }
-                });
-            }
-            this.form.append(button);
-            button.click();
-            button.remove();
-        }
+    if (this.host.hasUpdated) {
+      this.setValidity(this.host.validity.valid);
     }
-    getForm() {
-        return this.form ?? null;
+  }
+  attachForm(form) {
+    if (form) {
+      this.form = form;
+      if (formCollections.has(this.form)) {
+        formCollections.get(this.form).add(this.host);
+      } else {
+        formCollections.set(
+          this.form,
+          /* @__PURE__ */ new Set([this.host])
+        );
+      }
+      this.form.addEventListener("formdata", this.handleFormData);
+      this.form.addEventListener("submit", this.handleFormSubmit);
+      this.form.addEventListener("reset", this.handleFormReset);
+      if (!reportValidityOverloads.has(this.form)) {
+        reportValidityOverloads.set(
+          this.form,
+          this.form.reportValidity
+        );
+        this.form.reportValidity = () => this.reportFormValidity();
+      }
+      if (!checkValidityOverloads.has(this.form)) {
+        checkValidityOverloads.set(this.form, this.form.checkValidity);
+        this.form.checkValidity = () => this.checkFormValidity();
+      }
+    } else {
+      this.form = void 0;
     }
-    reset(submitter) {
-        this.doAction("reset", submitter);
+  }
+  detachForm() {
+    if (!this.form) {
+      return;
     }
-    submit(submitter) {
-        this.doAction("submit", submitter);
+    const formCollection = formCollections.get(this.form);
+    if (!formCollection) {
+      return;
     }
-    setValidity(isValid) {
-        const host = this.host;
-        const hasInteracted = Boolean(userInteractedControls.has(host));
-        const required = Boolean(host.required);
-        host.toggleAttribute("data-required", required);
-        host.toggleAttribute("data-optional", !required);
-        host.toggleAttribute("data-invalid", !isValid);
-        host.toggleAttribute("data-valid", isValid);
-        host.toggleAttribute("data-user-invalid", !isValid && hasInteracted);
-        host.toggleAttribute("data-user-valid", isValid && hasInteracted);
+    formCollection.delete(this.host);
+    if (formCollection.size <= 0) {
+      this.form.removeEventListener("formdata", this.handleFormData);
+      this.form.removeEventListener("submit", this.handleFormSubmit);
+      this.form.removeEventListener("reset", this.handleFormReset);
+      if (reportValidityOverloads.has(this.form)) {
+        this.form.reportValidity = reportValidityOverloads.get(
+          this.form
+        );
+        reportValidityOverloads.delete(this.form);
+      }
+      if (checkValidityOverloads.has(this.form)) {
+        this.form.checkValidity = checkValidityOverloads.get(
+          this.form
+        );
+        checkValidityOverloads.delete(this.form);
+      }
+      this.form = void 0;
     }
-    updateValidity() {
-        const host = this.host;
-        this.setValidity(host.validity.valid);
+  }
+  setUserInteracted(element, hasInteracted) {
+    if (hasInteracted) {
+      userInteractedControls.add(element);
+    } else {
+      userInteractedControls.delete(element);
     }
-    emitInvalidEvent(originalInvalidEvent) {
-        const pcInvalidEvent = new CustomEvent("pc-invalid", {
-            bubbles: false,
-            composed: false,
-            cancelable: true,
-            detail: {},
+    element.requestUpdate();
+  }
+  doAction(type, submitter) {
+    if (this.form) {
+      const button = document.createElement("button");
+      button.type = type;
+      button.style.position = "absolute";
+      button.style.inlineSize = "0";
+      button.style.blockSize = "0";
+      button.style.width = "0";
+      button.style.height = "0";
+      button.style.clipPath = "inset(50%)";
+      button.style.overflow = "hidden";
+      button.style.whiteSpace = "nowrap";
+      if (submitter) {
+        button.name = submitter.name;
+        button.value = submitter.value;
+        [
+          "formaction",
+          "formenctype",
+          "formmethod",
+          "formnovalidate",
+          "formtarget"
+        ].forEach((attribute) => {
+          if (submitter.hasAttribute(attribute)) {
+            button.setAttribute(
+              attribute,
+              submitter.getAttribute(attribute)
+            );
+          }
         });
-        if (!originalInvalidEvent) {
-            pcInvalidEvent.preventDefault();
-        }
-        if (!this.host.dispatchEvent(pcInvalidEvent)) {
-            originalInvalidEvent?.preventDefault();
-        }
+      }
+      this.form.append(button);
+      button.click();
+      button.remove();
+    }
+  }
+  /** Returns the associated `<form>` element, if one exists. */
+  getForm() {
+    return this.form ?? null;
+  }
+  /** Resets the form, restoring all form controls to their default value. */
+  reset(submitter) {
+    this.doAction("reset", submitter);
+  }
+  /** Submits the form, triggering validation and form data injection. */
+  submit(submitter) {
+    this.doAction("submit", submitter);
+  }
+  /** Synchronously sets the form control’s validity. Call this when you know the future validity state but need to update the host element immediately (i.e., before Lit updates the component in the next update). */
+  setValidity(isValid) {
+    const host = this.host;
+    const hasInteracted = Boolean(userInteractedControls.has(host));
+    const required = Boolean(host.required);
+    host.toggleAttribute("data-required", required);
+    host.toggleAttribute("data-optional", !required);
+    host.toggleAttribute("data-invalid", !isValid);
+    host.toggleAttribute("data-valid", isValid);
+    host.toggleAttribute("data-user-invalid", !isValid && hasInteracted);
+    host.toggleAttribute("data-user-valid", isValid && hasInteracted);
+  }
+  /** Updates the form control’s validity based on the current value of `host.validity.valid`. Call this when anything that affects constraint validation changes so the component receives the correct validity states. */
+  updateValidity() {
+    const host = this.host;
+    this.setValidity(host.validity.valid);
+  }
+  /** Dispatches a non‐bubbling, cancellable custom event called `pc-invalid`. If the `pc-invalid` event will be cancelled, then the original `invalid` event (which may have been passed as an argument) will also be cancelled. If no original `invalid` event has been passed, then the `pc-invalid` event will be cancelled before being dispatched. */
+  emitInvalidEvent(originalInvalidEvent) {
+    const pcInvalidEvent = new CustomEvent(
+      "pc-invalid",
+      {
+        bubbles: false,
+        composed: false,
+        cancelable: true,
+        detail: {}
+      }
+    );
+    if (!originalInvalidEvent) {
+      pcInvalidEvent.preventDefault();
+    }
+    if (!this.host.dispatchEvent(pcInvalidEvent)) {
+      originalInvalidEvent?.preventDefault();
     }
-}
-const validValidityState = Object.freeze({
-    badInput: false,
-    customError: false,
-    patternMismatch: false,
-    rangeOverflow: false,
-    rangeUnderflow: false,
-    stepMismatch: false,
-    tooLong: false,
-    tooShort: false,
-    typeMismatch: false,
-    valid: true,
-    valueMissing: false,
+  }
+};
+var validValidityState = Object.freeze({
+  badInput: false,
+  customError: false,
+  patternMismatch: false,
+  rangeOverflow: false,
+  rangeUnderflow: false,
+  stepMismatch: false,
+  tooLong: false,
+  tooShort: false,
+  typeMismatch: false,
+  valid: true,
+  valueMissing: false
 });
-const valueMissingValidityState = Object.freeze({
-    ...validValidityState,
-    valid: false,
-    valueMissing: true,
+var valueMissingValidityState = Object.freeze({
+  ...validValidityState,
+  valid: false,
+  valueMissing: true
 });
-const customErrorValidityState = Object.freeze({
-    ...validValidityState,
-    valid: false,
-    customError: true,
+var customErrorValidityState = Object.freeze({
+  ...validValidityState,
+  valid: false,
+  customError: true
 });
-
-export { FormControlController, customErrorValidityState, formCollections, validValidityState, valueMissingValidityState };
+export {
+  FormControlController,
+  customErrorValidityState,
+  formCollections,
+  validValidityState,
+  valueMissingValidityState
+};

package/dist/internal/math.d.ts

@@ -1 +1,4 @@
+/** Ensures a number stays within a minimum and maximum value. This is similar to the CSS `clamp()` function. */
 export declare function clamp(value: number, min: number, max: number): number;
+/** Generates a 21‐character long random ID with a specified prefix. */
+export declare function uniqueID(prefix?: string): string;

package/dist/internal/math.js

@@ -1,12 +1,31 @@
+// node_modules/nanoid/url-alphabet/index.js
+var urlAlphabet = "useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict";
+
+// node_modules/nanoid/index.browser.js
+var nanoid = (size = 21) => {
+  let id = "";
+  let bytes = crypto.getRandomValues(new Uint8Array(size |= 0));
+  while (size--) {
+    id += urlAlphabet[bytes[size] & 63];
+  }
+  return id;
+};
+
+// src/internal/math.ts
 function clamp(value, min, max) {
-    const noNegativeZero = (number) => Object.is(number, -0) ? 0 : number;
-    if (value < min) {
-        return noNegativeZero(min);
-    }
-    if (value > max) {
-        return noNegativeZero(max);
-    }
-    return noNegativeZero(value);
+  const noNegativeZero = (number) => Object.is(number, -0) ? 0 : number;
+  if (value < min) {
+    return noNegativeZero(min);
+  }
+  if (value > max) {
+    return noNegativeZero(max);
+  }
+  return noNegativeZero(value);
 }
-
-export { clamp };
+function uniqueID(prefix = "") {
+  return `${prefix}${nanoid()}`;
+}
+export {
+  clamp,
+  uniqueID
+};

package/dist/internal/offset.d.ts

@@ -1,3 +1,4 @@
+/** Returns an element’s offset relative to its parent. Similar to `element.offsetTop` and `element.offsetLeft`, except the parent doesn’t have to be positioned relative or absolute. Note: This was created to work around what appears to be a bug in Chrome where a slotted element’s `offsetParent` seems to ignore elements inside the surrounding shadow DOM (https://issues.chromium.org/issues/41434587). */
 export declare function getOffset(element: HTMLElement, parent: HTMLElement): {
     top: number;
     left: number;

package/dist/internal/offset.js

@@ -1,10 +1,14 @@
+// src/internal/offset.ts
 function getOffset(element, parent) {
-    return {
-        top: Math.round(element.getBoundingClientRect().top -
-            parent.getBoundingClientRect().top),
-        left: Math.round(element.getBoundingClientRect().left -
-            parent.getBoundingClientRect().left),
-    };
+  return {
+    top: Math.round(
+      element.getBoundingClientRect().top - parent.getBoundingClientRect().top
+    ),
+    left: Math.round(
+      element.getBoundingClientRect().left - parent.getBoundingClientRect().left
+    )
+  };
 }
-
-export { getOffset };
+export {
+  getOffset
+};

package/dist/internal/parse.d.ts

@@ -0,0 +1,2 @@
+/** Parses a space‐delimited set of tokens and returns an array with all whitespace removed. */
+export declare function parseSpaceDelimitedTokens(input: string): string[];

package/dist/internal/parse.js

@@ -0,0 +1,7 @@
+// src/internal/parse.ts
+function parseSpaceDelimitedTokens(input) {
+  return input.split(" ").map((token) => token.trim()).filter((token) => token !== "");
+}
+export {
+  parseSpaceDelimitedTokens
+};