@vonage/vivid 4.16.2 → 4.18.0

package/shared/text-field2.cjs

@@ -1,575 +0,0 @@
-'use strict';
-
-const applyMixins = require('./apply-mixins.cjs');
-const vividElement = require('./vivid-element.cjs');
-const applyMixinsWithObservables = require('./applyMixinsWithObservables.cjs');
-const formAssociated = require('./form-associated.cjs');
-const definition = require('./definition27.cjs');
-const formElements = require('./form-elements.cjs');
-const ariaGlobal = require('./aria-global.cjs');
-const affix = require('./affix.cjs');
-
-const byteToHex = [];
-for (let i = 0; i < 256; ++i) {
-    byteToHex.push((i + 0x100).toString(16).slice(1));
-}
-function unsafeStringify(arr, offset = 0) {
-    return (byteToHex[arr[offset + 0]] +
-        byteToHex[arr[offset + 1]] +
-        byteToHex[arr[offset + 2]] +
-        byteToHex[arr[offset + 3]] +
-        '-' +
-        byteToHex[arr[offset + 4]] +
-        byteToHex[arr[offset + 5]] +
-        '-' +
-        byteToHex[arr[offset + 6]] +
-        byteToHex[arr[offset + 7]] +
-        '-' +
-        byteToHex[arr[offset + 8]] +
-        byteToHex[arr[offset + 9]] +
-        '-' +
-        byteToHex[arr[offset + 10]] +
-        byteToHex[arr[offset + 11]] +
-        byteToHex[arr[offset + 12]] +
-        byteToHex[arr[offset + 13]] +
-        byteToHex[arr[offset + 14]] +
-        byteToHex[arr[offset + 15]]).toLowerCase();
-}
-
-let getRandomValues;
-const rnds8 = new Uint8Array(16);
-function rng() {
-    if (!getRandomValues) {
-        if (typeof crypto === 'undefined' || !crypto.getRandomValues) {
-            throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported');
-        }
-        getRandomValues = crypto.getRandomValues.bind(crypto);
-    }
-    return getRandomValues(rnds8);
-}
-
-const randomUUID = typeof crypto !== 'undefined' && crypto.randomUUID && crypto.randomUUID.bind(crypto);
-const native = { randomUUID };
-
-function v4(options, buf, offset) {
-    if (native.randomUUID && !buf && !options) {
-        return native.randomUUID();
-    }
-    options = options || {};
-    const rnds = options.random ?? options.rng?.() ?? rng();
-    if (rnds.length < 16) {
-        throw new Error('Random bytes length must be >= 16');
-    }
-    rnds[6] = (rnds[6] & 0x0f) | 0x40;
-    rnds[8] = (rnds[8] & 0x3f) | 0x80;
-    return unsafeStringify(rnds);
-}
-
-const generateRandomId = () => v4();
-
-class Reflector {
-  #reflectedProperties = /* @__PURE__ */ new Map();
-  #source;
-  #target;
-  constructor(source, target) {
-    this.#source = source;
-    this.#target = target;
-  }
-  attribute(propertyName, attributeName) {
-    this.#addReflectedProperty(propertyName, {
-      type: "attribute",
-      destination: attributeName
-    });
-  }
-  booleanAttribute(propertyName, attributeName) {
-    this.#addReflectedProperty(propertyName, {
-      type: "boolean-attribute",
-      destination: attributeName
-    });
-  }
-  property(propertyName, targetProperty, skipIfEqual = false) {
-    this.#addReflectedProperty(propertyName, {
-      type: "property",
-      destination: targetProperty,
-      skipIfEqual
-    });
-  }
-  destroy() {
-    const notifier = vividElement.Observable.getNotifier(this.#source);
-    for (const prop of this.#reflectedProperties.keys()) {
-      notifier.unsubscribe(this.#propertyChangeHandler, prop);
-    }
-    this.#reflectedProperties.clear();
-  }
-  #addReflectedProperty(name, reflected) {
-    this.#reflectedProperties.set(name, reflected);
-    const notifier = vividElement.Observable.getNotifier(this.#source);
-    notifier.subscribe(this.#propertyChangeHandler, name);
-    this.#propertyChangeHandler.handleChange(this.#source, name);
-  }
-  #propertyChangeHandler = {
-    handleChange: (source, propertyName) => {
-      const reflectedProperty = this.#reflectedProperties.get(propertyName);
-      const value = source[propertyName];
-      switch (reflectedProperty.type) {
-        case "boolean-attribute":
-          vividElement.DOM.setBooleanAttribute(
-            this.#target,
-            reflectedProperty.destination,
-            Boolean(value)
-          );
-          break;
-        case "attribute":
-          vividElement.DOM.setAttribute(this.#target, reflectedProperty.destination, value);
-          break;
-        case "property":
-          if (reflectedProperty.skipIfEqual && this.#target[reflectedProperty.destination] === value) {
-            return;
-          }
-          this.#target[reflectedProperty.destination] = value;
-          break;
-      }
-    }
-  };
-}
-
-class _TextField extends vividElement.VividElement {
-}
-class FormAssociatedTextField extends formAssociated.FormAssociated(_TextField) {
-  constructor() {
-    super(...arguments);
-    this.proxy = document.createElement("input");
-  }
-}
-
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __typeError = (msg) => {
-  throw TypeError(msg);
-};
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
-var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
-var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
-var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
-var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _TextField_instances, handleLabelChange_fn, _reflectToInput, _helperTextMirrorEl, _helperTextSlotMutationObserver, updateHelperTextMutationObserver_fn, updateMirroredHelperText_fn;
-const TextFieldType = {
-  /**
-   * An email TextField
-   */
-  email: "email",
-  /**
-   * A password TextField
-   */
-  password: "password",
-  /**
-   * A telephone TextField
-   */
-  tel: "tel",
-  /**
-   * A text TextField
-   */
-  text: "text",
-  /**
-   * A URL TextField
-   */
-  url: "url"
-};
-const safariWorkaroundClassName = "_vvd-3-text-field-safari-workaround";
-const getSafariWorkaroundStyleSheet = definition.memoizeWith(
-  () => "",
-  () => {
-    const styleSheet = new CSSStyleSheet();
-    const supportsReplaceSync = "replaceSync" in styleSheet;
-    if (supportsReplaceSync) {
-      styleSheet.replaceSync(`
-.${safariWorkaroundClassName}::placeholder {
-	opacity: 1 !important;
-	-webkit-text-fill-color: var(--_low-ink-color) !important;
-}`);
-    }
-    return styleSheet;
-  }
-);
-const installSafariWorkaroundStyle = (forElement) => {
-  const root = forElement.getRootNode();
-  const workaroundStyleSheet = getSafariWorkaroundStyleSheet();
-  const supportsAdoptedStyleSheets = "adoptedStyleSheets" in root;
-  if (!supportsAdoptedStyleSheets) {
-    return;
-  }
-  if (!root.adoptedStyleSheets.includes(workaroundStyleSheet)) {
-    root.adoptedStyleSheets = [
-      ...root.adoptedStyleSheets,
-      workaroundStyleSheet
-    ];
-  }
-};
-exports.TextField = class TextField extends FormAssociatedTextField {
-  constructor() {
-    super(...arguments);
-    __privateAdd(this, _TextField_instances);
-    // eslint-disable-next-line @nrwl/nx/workspace/no-attribute-default-value
-    this.type = TextFieldType.text;
-    /**
-     * @internal
-     */
-    this._labelEl = null;
-    __privateAdd(this, _reflectToInput);
-    __privateAdd(this, _helperTextMirrorEl);
-    __privateAdd(this, _helperTextSlotMutationObserver);
-  }
-  /**
-   * @internal
-   */
-  readOnlyChanged() {
-    if (this.proxy instanceof HTMLInputElement) {
-      this.proxy.readOnly = this.readOnly;
-      this.validate();
-    }
-  }
-  /**
-   * @internal
-   */
-  autofocusChanged() {
-    if (this.proxy instanceof HTMLInputElement) {
-      this.proxy.autofocus = this.autofocus;
-      this.validate();
-    }
-  }
-  /**
-   * @internal
-   */
-  placeholderChanged() {
-    if (this.proxy instanceof HTMLInputElement) {
-      this.proxy.placeholder = this.placeholder;
-    }
-  }
-  /**
-   * @internal
-   */
-  typeChanged() {
-    if (this.proxy instanceof HTMLInputElement) {
-      this.proxy.type = this.type;
-      this.validate();
-    }
-  }
-  /**
-   * @internal
-   */
-  listChanged() {
-    if (this.proxy instanceof HTMLInputElement) {
-      this.proxy.setAttribute("list", this.list);
-      this.validate();
-    }
-  }
-  /**
-   * @internal
-   */
-  maxlengthChanged() {
-    if (this.proxy instanceof HTMLInputElement) {
-      this.proxy.maxLength = this.maxlength;
-      this.validate();
-    }
-  }
-  /**
-   * @internal
-   */
-  minlengthChanged() {
-    if (this.proxy instanceof HTMLInputElement) {
-      this.proxy.minLength = this.minlength;
-      this.validate();
-    }
-  }
-  /**
-   * @internal
-   */
-  patternChanged() {
-    if (this.proxy instanceof HTMLInputElement) {
-      this.proxy.pattern = this.pattern;
-      this.validate();
-    }
-  }
-  /**
-   * @internal
-   */
-  sizeChanged() {
-    if (this.proxy instanceof HTMLInputElement) {
-      this.proxy.size = this.size;
-    }
-  }
-  /**
-   * @internal
-   */
-  spellcheckChanged() {
-    if (this.proxy instanceof HTMLInputElement) {
-      this.proxy.spellcheck = this.spellcheck;
-    }
-  }
-  /**
-   * Selects all the text in the text field
-   *
-   * @public
-   */
-  select() {
-    this.control.select();
-  }
-  /**
-   * Handles the internal control's `input` event
-   * @internal
-   */
-  handleTextInput() {
-    this.value = this.control.value;
-  }
-  /**
-   * Change event handler for inner control.
-   * @remarks
-   * "Change" events are not `composable` so they will not
-   * permeate the shadow DOM boundary. This fn effectively proxies
-   * the change event, emitting a `change` event whenever the internal
-   * control emits a `change` event
-   * @internal
-   */
-  handleChange() {
-    this.$emit("change");
-  }
-  /** {@inheritDoc (FormAssociated:interface).validate} */
-  validate() {
-    super.validate(this.control);
-  }
-  /**
-   * @internal
-   */
-  labelChanged() {
-    if (this._labelEl) {
-      __privateMethod(this, _TextField_instances, handleLabelChange_fn).call(this, this._labelEl);
-    }
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    this.proxy.setAttribute("type", this.type);
-    this.validate();
-    if (this.autofocus) {
-      vividElement.DOM.queueUpdate(() => {
-        this.focus();
-      });
-    }
-    if (!this.control) {
-      const uniqueId = this.id || generateRandomId();
-      const controlId = `vvd-text-field-control-${uniqueId}`;
-      const helperTextId = `vvd-text-field-helper-text-${uniqueId}`;
-      const input = document.createElement("input");
-      input.slot = "_control";
-      input.id = controlId;
-      input.className = safariWorkaroundClassName;
-      this.control = input;
-      input.addEventListener("input", () => {
-        this.handleTextInput();
-      });
-      input.addEventListener("change", () => {
-        this.handleChange();
-      });
-      input.addEventListener("blur", () => {
-        this.$emit("blur", void 0, { bubbles: false });
-      });
-      input.addEventListener("focus", () => {
-        this.$emit("focus", void 0, { bubbles: false });
-      });
-      this.appendChild(input);
-      const label = document.createElement("label");
-      label.slot = "_label";
-      label.htmlFor = controlId;
-      this._labelEl = label;
-      __privateMethod(this, _TextField_instances, handleLabelChange_fn).call(this, label);
-      __privateSet(this, _helperTextMirrorEl, document.createElement("div"));
-      __privateGet(this, _helperTextMirrorEl).id = helperTextId;
-      __privateGet(this, _helperTextMirrorEl).slot = "_mirrored-helper-text";
-      __privateMethod(this, _TextField_instances, updateMirroredHelperText_fn).call(this);
-      this.appendChild(__privateGet(this, _helperTextMirrorEl));
-      installSafariWorkaroundStyle(this);
-    }
-    __privateSet(this, _reflectToInput, new Reflector(this, this.control));
-    __privateGet(this, _reflectToInput).booleanAttribute("autofocus", "autofocus");
-    __privateGet(this, _reflectToInput).booleanAttribute("disabled", "disabled");
-    __privateGet(this, _reflectToInput).booleanAttribute("readOnly", "readonly");
-    __privateGet(this, _reflectToInput).booleanAttribute("required", "required");
-    __privateGet(this, _reflectToInput).booleanAttribute("spellcheck", "spellcheck");
-    __privateGet(this, _reflectToInput).attribute("list", "list");
-    __privateGet(this, _reflectToInput).attribute("maxlength", "maxlength");
-    __privateGet(this, _reflectToInput).attribute("minlength", "minlength");
-    __privateGet(this, _reflectToInput).attribute("pattern", "pattern");
-    __privateGet(this, _reflectToInput).attribute("placeholder", "placeholder");
-    __privateGet(this, _reflectToInput).attribute("size", "size");
-    __privateGet(this, _reflectToInput).attribute("autoComplete", "autocomplete");
-    __privateGet(this, _reflectToInput).attribute("type", "type");
-    __privateGet(this, _reflectToInput).attribute("inputMode", "inputmode");
-    __privateGet(this, _reflectToInput).attribute("ariaAtomic", "aria-atomic");
-    __privateGet(this, _reflectToInput).attribute("ariaBusy", "aria-busy");
-    __privateGet(this, _reflectToInput).attribute("ariaCurrent", "aria-current");
-    __privateGet(this, _reflectToInput).attribute("ariaDetails", "aria-details");
-    __privateGet(this, _reflectToInput).attribute("ariaDisabled", "aria-disabled");
-    __privateGet(this, _reflectToInput).attribute("ariaHaspopup", "aria-haspopup");
-    __privateGet(this, _reflectToInput).attribute("ariaHidden", "aria-hidden");
-    __privateGet(this, _reflectToInput).attribute("ariaInvalid", "aria-invalid");
-    __privateGet(this, _reflectToInput).attribute("ariaKeyshortcuts", "aria-keyshortcuts");
-    __privateGet(this, _reflectToInput).attribute("ariaLabel", "aria-label");
-    __privateGet(this, _reflectToInput).attribute("ariaLive", "aria-live");
-    __privateGet(this, _reflectToInput).attribute("ariaRelevant", "aria-relevant");
-    __privateGet(this, _reflectToInput).attribute(
-      "ariaRoledescription",
-      "aria-roledescription"
-    );
-    __privateGet(this, _reflectToInput).property("value", "value", true);
-    __privateMethod(this, _TextField_instances, updateHelperTextMutationObserver_fn).call(this);
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback();
-    __privateGet(this, _reflectToInput).destroy();
-    __privateSet(this, _reflectToInput, void 0);
-    __privateMethod(this, _TextField_instances, updateHelperTextMutationObserver_fn).call(this);
-  }
-  focus() {
-    this.control?.focus();
-  }
-  /**
-   * @internal
-   */
-  helperTextChanged() {
-    __privateMethod(this, _TextField_instances, updateMirroredHelperText_fn).call(this);
-  }
-  /**
-   * @internal
-   */
-  _helperTextSlottedContentChanged() {
-    __privateMethod(this, _TextField_instances, updateMirroredHelperText_fn).call(this);
-    __privateMethod(this, _TextField_instances, updateHelperTextMutationObserver_fn).call(this);
-  }
-};
-_TextField_instances = new WeakSet();
-handleLabelChange_fn = function(labelEl) {
-  if (!this.label) {
-    labelEl.remove();
-  } else {
-    labelEl.textContent = this.label;
-    if (!labelEl.isConnected) {
-      this.appendChild(labelEl);
-    }
-  }
-};
-_reflectToInput = new WeakMap();
-_helperTextMirrorEl = new WeakMap();
-_helperTextSlotMutationObserver = new WeakMap();
-updateHelperTextMutationObserver_fn = function() {
-  const usesHelperTextSlot = this._helperTextSlottedContent.length;
-  const shouldHaveMutationObserver = usesHelperTextSlot && this.isConnected;
-  if (shouldHaveMutationObserver && !__privateGet(this, _helperTextSlotMutationObserver)) {
-    __privateSet(this, _helperTextSlotMutationObserver, new MutationObserver((records) => {
-      if (records.some((record) => record.target !== __privateGet(this, _helperTextMirrorEl))) {
-        __privateMethod(this, _TextField_instances, updateMirroredHelperText_fn).call(this);
-      }
-    }));
-    __privateGet(this, _helperTextSlotMutationObserver).observe(this, {
-      subtree: true,
-      childList: true,
-      characterData: true
-    });
-  }
-  if (!shouldHaveMutationObserver && __privateGet(this, _helperTextSlotMutationObserver)) {
-    __privateGet(this, _helperTextSlotMutationObserver).disconnect();
-    __privateSet(this, _helperTextSlotMutationObserver, void 0);
-  }
-};
-updateMirroredHelperText_fn = function() {
-  let helperText = this.helperText ?? "";
-  if (this._helperTextSlottedContent?.length) {
-    helperText = this._helperTextSlottedContent.map((node) => node.innerText).join(" ");
-  }
-  if (__privateGet(this, _helperTextMirrorEl)) {
-    __privateGet(this, _helperTextMirrorEl).textContent = helperText;
-    if (helperText) {
-      this.control.setAttribute(
-        "aria-describedby",
-        __privateGet(this, _helperTextMirrorEl).id
-      );
-    } else {
-      this.control.removeAttribute("aria-describedby");
-    }
-  }
-};
-__decorateClass([
-  vividElement.attr({ attribute: "readonly", mode: "boolean" })
-], exports.TextField.prototype, "readOnly", 2);
-__decorateClass([
-  vividElement.attr({ mode: "boolean" })
-], exports.TextField.prototype, "autofocus", 2);
-__decorateClass([
-  vividElement.attr
-], exports.TextField.prototype, "placeholder", 2);
-__decorateClass([
-  vividElement.attr
-], exports.TextField.prototype, "type", 2);
-__decorateClass([
-  vividElement.attr
-], exports.TextField.prototype, "list", 2);
-__decorateClass([
-  vividElement.attr({ converter: vividElement.nullableNumberConverter })
-], exports.TextField.prototype, "maxlength", 2);
-__decorateClass([
-  vividElement.attr({ converter: vividElement.nullableNumberConverter })
-], exports.TextField.prototype, "minlength", 2);
-__decorateClass([
-  vividElement.attr
-], exports.TextField.prototype, "pattern", 2);
-__decorateClass([
-  vividElement.attr({ converter: vividElement.nullableNumberConverter })
-], exports.TextField.prototype, "size", 2);
-__decorateClass([
-  vividElement.attr({ mode: "boolean" })
-], exports.TextField.prototype, "spellcheck", 2);
-__decorateClass([
-  vividElement.attr
-], exports.TextField.prototype, "appearance", 2);
-__decorateClass([
-  vividElement.attr
-], exports.TextField.prototype, "shape", 2);
-__decorateClass([
-  vividElement.attr
-], exports.TextField.prototype, "autoComplete", 2);
-__decorateClass([
-  vividElement.attr()
-], exports.TextField.prototype, "scale", 2);
-__decorateClass([
-  vividElement.attr({ attribute: "inputmode" })
-], exports.TextField.prototype, "inputMode", 2);
-__decorateClass([
-  vividElement.observable
-], exports.TextField.prototype, "actionItemsSlottedContent", 2);
-__decorateClass([
-  vividElement.observable
-], exports.TextField.prototype, "leadingActionItemsSlottedContent", 2);
-exports.TextField = __decorateClass([
-  formElements.errorText,
-  formElements.formElements
-], exports.TextField);
-class DelegatesARIATextbox {
-}
-applyMixins.applyMixins(DelegatesARIATextbox, ariaGlobal.ARIAGlobalStatesAndProperties);
-applyMixinsWithObservables.applyMixinsWithObservables(
-  exports.TextField,
-  affix.AffixIcon,
-  formElements.FormElementCharCount,
-  formElements.FormElementHelperText,
-  formElements.FormElementSuccessText,
-  DelegatesARIATextbox
-);
-
-exports.DelegatesARIATextbox = DelegatesARIATextbox;
-exports.Reflector = Reflector;