bug: ion-datetime (and other components) throw `instance[watchMethodName] is not a function` when used inside inline IonModal (React)

[nam-aepsy]

Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Ionic Framework Version

v7.x

Current Behavior

TypeError: instance[watchMethodName] is not a function
    at Datetime.set [as min]
    at attributeChangedCallback

Expected Behavior

Ionic components should not throw runtime errors when used inside IonModal, even when controlled via React props.

At minimum:
• setting props like min, value, or isOpen should be safe
• or Ionic should document that this pattern is unsupported

Steps to Reproduce

const Example = () => {
  const [open, setOpen] = useState(true);

  return (
    <IonModal isOpen={open}>
      <IonDatetime
        presentation="date"
        min="2026-01-19"
        value="2026-01-20"
      />
    </IonModal>
  );
};

Code Reproduction URL

null

Ionic Info

This affects multiple components that using Overlay

Additional Information

No response

[msio]

please fix it !

[DwieDima]

maybe related to #30504 ?

[innocentlyloud]

in your package.json use below code:

"overrides": {
"@stencil/core": "4.1.0"
},

ioinic uses stencil/core internally and current version causing it to break. you can use @stencil/core 4.1.0/4.38.0 also worked for me.

[danis039]

in your package.json use below code:

"overrides": { "@stencil/core": "4.1.0" },

ioinic uses stencil/core internally and current version causing it to break. you can use @stencil/core 4.1.0/4.38.0 also worked for me.

Thanks @innocentlyloud! This workaround fixed it for me.

Ionic team, any chance we could get a permanent fix for this, please?