@m3e/web 2.1.0 → 2.1.1

package/dist/core.js

@@ -1616,6 +1616,9 @@ function isAttachInternalsMixin(value) {
   return hasKeys(value, internals);
 }
 const _internals = Symbol("_internals");
+// Since flushing custom state doesn't flush in Safari (affecting all iOS browsers),
+// a copy of custom state is retained locally so components can correctly read after write.
+const _customState = Symbol("_customState");
 /**
  * Mixin to augment an element with behavior that attaches to `ElementInternals`.
  * @template T The type of the base class.
@@ -1624,9 +1627,17 @@ const _internals = Symbol("_internals");
  * @returns {Constructor<AttachInternalsMixin> & T} A constructor that implements `AttachInternalsMixin`.
  */
 function AttachInternals(base, formAssociated) {
+  var _a;
   class _AttachInternals extends base {
+    constructor() {
+      super(...arguments);
+      // Since flushing custom state doesn't flush in Safari (affecting all iOS browsers),
+      // a copy of custom state is retained locally so components can correctly read after write.
+      /** @private */
+      this[_a] = new Set();
+    }
     /** @internal */
-    get [internals]() {
+    get [(_a = _customState, internals)]() {
       return this[_internals] ?? (this[_internals] = this.attachInternals());
     }
   }
@@ -1641,6 +1652,13 @@ function AttachInternals(base, formAssociated) {
  * @returns {boolean} Whether `element` has `state`.
  */
 function hasCustomState(element, state) {
+  // Since flushing custom state doesn't flush in Safari (affecting all iOS browsers),
+  // a copy of custom state is retained locally so components can correctly read after write.
+  if (_customState in element) {
+    return element[_customState].has(state);
+  }
+  // This should never get called due to needing a local copy of custom state
+  // since reading after write to flush doesn't work in Safari (affecting all iOS browsers).
   return element[internals].states.has(state);
 }
 /**
@@ -1649,8 +1667,13 @@ function hasCustomState(element, state) {
  * @param {string} state The custom state to add.
  */
 function addCustomState(element, state) {
+  // Since flushing custom state doesn't flush in Safari (affecting all iOS browsers),
+  // a copy of custom state is retained locally so components can correctly read after write.
+  if (_customState in element) {
+    element[_customState].add(state);
+  }
   element[internals]?.states.add(state);
-  element[internals]?.states.has(state); // flush
+  element[internals]?.states.has(state); // flush (even though this doesn't work in Safari)
 }
 /**
  * Convenience function used to delete custom state from an element.
@@ -1659,8 +1682,13 @@ function addCustomState(element, state) {
  * @returns {boolean} Whether `state` was removed from `element`.
  */
 function deleteCustomState(element, state) {
+  // Since flushing custom state doesn't flush in Safari (affecting all iOS browsers),
+  // a copy of custom state is retained locally so components can correctly read after write.
+  if (_customState in element) {
+    element[_customState].delete(state);
+  }
   if (element[internals]?.states.delete(state)) {
-    element[internals]?.states.has(state); // flush
+    element[internals]?.states.has(state); // flush (even though this doesn't work in Safari)
     return true;
   }
   return false;