storybook lib schematic generates bad story code on @HostBinding(attr.id)

[nhhockeyplayer]

Current Behavior

I have a button widget in a library as follows

export class ButtonComponent {
  static defaultClassName = 'sls-button'
  /** Add optional ID to host
   */
  @HostBinding('attr.id') @Input() id?: string
...
}

i execute the following

nx generate @nrwl/angular:storybook-configuration sls-shared-widgets
nx run sls-shared-widgets:storybook 

schematic had generated bad story code that wont compile

export const Primary = Template.bind({});
Primary.args = {
    attr.id:  '',

compile error is as follows

TS2322: Type '{ attr: any; "": any; button: any; size: "sm"; active: false; disabled: false; style: "primary"; border: "info\""; extraClasses: string; }' is not assignable to type 'Partial<ButtonComponent>'.   Object literal may only specify known properties, and 'attr' does not exist in type 'Partial<ButtonComponent>'.

Expected Behavior

should run storybook and show my button widget

the code generated should look like this

export const Primary = Template.bind({});
Primary.args = {
   id:  '',

Steps to Reproduce

just create a button widget and make its id as above

Environment

NX Report complete - copy this into the issue template

Node : 16.13.0
OS : darwin x64
yarn : 1.22.17

nx : 13.9.3
@nrwl/angular : 13.9.3
@nrwl/cypress : 13.9.3
@nrwl/detox : undefined
@nrwl/devkit : 13.9.3
@nrwl/eslint-plugin-nx : 13.9.3
@nrwl/express : undefined
@nrwl/jest : 13.9.3
@nrwl/js : 13.9.3
@nrwl/linter : 13.9.3
@nrwl/nest : 13.9.3
@nrwl/next : undefined
@nrwl/node : 13.9.3
@nrwl/nx-cloud : undefined
@nrwl/nx-plugin : undefined
@nrwl/react : undefined
@nrwl/react-native : undefined
@nrwl/schematics : undefined
@nrwl/storybook : 13.9.3
@nrwl/web : undefined
@nrwl/workspace : 13.9.3
typescript : 4.5.5
rxjs : 7.4.0

Community plugins:
@storybook/angular: 6.4.19

[github-actions]

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.