Can't get Interior Script Props to be recognized

[otherjohn]

Perhaps I am doing this wrong, but I can't get Interior Script Props to work. Can someone give me some insight on what I may be doing wrong?

Index.html

<my-calculator data-rate="data-rate-works">
      <script type="text/props">{
        "formHeader": "Page:My Calculator(not working)"
        }</script>
    </my-calculator>

calculator.island.ts

export const Calculator = ({
  rate,
  theme,
  formHeader,
}: {
  rate: string
  theme?: string
  formHeader?: string
}) => {
  useWebComponentEvents(islandName)
  
  useEffect(() => {
    console.log('formHeader', formHeader); // InitialProps shows here but not interior.
  }, [formHeader])
  ...
  
  ...
const island = createIslandWebComponent(islandName, Calculator)
island.render({
  selector: islandName,
   initialProps: {
    "formHeader": 'Initial Header Works',
  },
})