How to give a `TemplateRef` as an `@Input` arg to a Story?

I'm trying to make a Story that uses a component that takes a TemplateRef as an @Input. But I can't figure out how.

TestComponent

@Component({
selector: 'test',
templateUrl: './test.component.html',
})
export class TestComponent {
@Input() public set value(value: TemplateRef<void>) {
// ...
}
}


Story

export default {
title: 'Components/Test',
component: TestComponent,
} as Meta;

const Template: Story<TestComponent> = (args) => ({
props: args,
});

export const TemplateRefStory = Template.bind({});
TemplateRefStory.args = {
value: ???, // <-- what do I put here?
};


I've tried a variety of things, they're similar to the below. Which doesn't really make sense.

export const TemplateRef: Story<TestComponent> = (args) => ({
template: `<ng-template #hello>Hello</ng-template>`,
props: args,
});

TemplateRef.args = {
value: '#hello',
};

Continue reading...