ember-cli-addon-docs icon indicating copy to clipboard operation
ember-cli-addon-docs copied to clipboard

Use `gts` components for examples

Open barryofguilder opened this issue 1 month ago • 0 comments

Is there a way to use gts components for the examples? I've tried doing this, but I get runtime errors.

My example component (menu-default.gts) for the docs:

// BEGIN-SNIPPET docs-menu-default.gts
import Component from '@glimmer/component';
import UiMenu from '@onwardcare/ui-components/components/ui-menu';
import UiPortalTargets from '@onwardcare/ui-components/components/ui-portal-targets';
import DocsDemo from 'ember-cli-addon-docs/components/docs-demo';

interface Signature {
  Element: null;
}

export default class MenuDefault extends Component<Signature> {
  <template>
    <DocsDemo as |demo|>
      <demo.example @name='docs-menu-default.gts'>
        <UiPortalTargets />

        <UiMenu as |menu|>
          <menu.Trigger>Open Menu</menu.Trigger>

          <menu.Content as |content|>
            <content.Item>Item 1</content.Item>
            <content.Item>Item 2</content.Item>
          </menu.Content>
        </UiMenu>
      </demo.example>

      <demo.snippet @name='docs-menu-default.gts' />
    </DocsDemo>
  </template>
}
// END-SNIPPET

The runtime error I receive: Image

barryofguilder avatar Dec 03 '25 19:12 barryofguilder