I will assume that you copied the JavaScript of both the custom macro framework itself and that of the Speech Box into your project’s Story JavaScript area.
I debugged the JavaScript code used by Speech Box itself, and it is displaying the (Hook) textual content supplied to it by the custom macro framework’s own Macro call parser, so it would appear that the issue is in that parser.
The main page of Chapel's Unofficial Custom Macro Framework for Harlowe repository includes the following warning…
This is unofficial code, and relies on hacks. Future versions of Harlowe may break it at any time.
…and it would appear that (at least) one of the many changes to Harlowe 3.x that have occurred in the last 5 years (1) has broken something in this unofficial framework.
But all isn’t lost, because you can use a Custom Harlowe Macro like the following to achieve a similar result. This code would be placed in the project’s startup tagged Passage.
(set: $say to (macro: str-type _name, str-type _image, str-type _content, [
(output:)[{
<div class="say">
(print: '<img src="' + _image + '">')
<p>_name</p>
<p>_content</p>
</div>
}]
]))
And CSS like the following in the project’s Story Stylesheet area can be used to layout the HTML generated by the above Custom Macro…
.say {
border: 1px solid #eee;
overflow: auto;
& > tw-expression[name="print"] > img {
max-width: 20%;
float: left;
margin-right: 1em;
}
& > p:first-of-type {
font-weight: bold;
margin: 0.2em 0;
border-bottom: 1px solid #eee;
}
& > p:last-of-type {
padding: 0.5em;
margin: 0;
}
}
The above custom macro is used like so…
($say: "Anna Avatar", "images/ai.png", "Welcome, my name is Anna")
However, if you want to continue using Chapel’s framework, then I suggest you report the error you’ve found on that framework’s Issues page.
(1) which is how much time has pasted since this framework was last updated.