From a1fdb683b6d2d631b2c45b91b9c99776200ff8ae Mon Sep 17 00:00:00 2001
From: Valentin Palkovic <valentin@chromatic.com>
Date: Wed, 11 Oct 2023 11:29:58 +0200
Subject: [PATCH] Add Stories to cover argsToTemplate functionality

---
 .../template.component.ts                     | 27 +++++++++++++++++++
 .../template.stories.ts                       | 24 +++++++++++++++++
 2 files changed, 51 insertions(+)
 create mode 100644 code/frameworks/angular/template/stories/basics/component-with-template/template.component.ts
 create mode 100644 code/frameworks/angular/template/stories/basics/component-with-template/template.stories.ts

diff --git a/code/frameworks/angular/template/stories/basics/component-with-template/template.component.ts b/code/frameworks/angular/template/stories/basics/component-with-template/template.component.ts
new file mode 100644
index 000000000000..2071a6db7738
--- /dev/null
+++ b/code/frameworks/angular/template/stories/basics/component-with-template/template.component.ts
@@ -0,0 +1,27 @@
+import { CommonModule } from '@angular/common';
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+
+@Component({
+  selector: 'app-template',
+  imports: [CommonModule],
+  template: `<div (click)="event($event)">
+    Label: {{ label }}
+    <br />
+    Label2: {{ label2 }}
+    <br />
+    <button (click)="inc()">+</button>
+  </div>`,
+  styles: [],
+  standalone: true,
+})
+export class Template {
+  @Input() label = 'default label';
+
+  @Input() label2 = 'default label2';
+
+  @Output() changed = new EventEmitter<string>();
+
+  inc() {
+    this.changed.emit('Increase');
+  }
+}
diff --git a/code/frameworks/angular/template/stories/basics/component-with-template/template.stories.ts b/code/frameworks/angular/template/stories/basics/component-with-template/template.stories.ts
new file mode 100644
index 000000000000..55639870f262
--- /dev/null
+++ b/code/frameworks/angular/template/stories/basics/component-with-template/template.stories.ts
@@ -0,0 +1,24 @@
+import { Meta, StoryObj, argsToTemplate } from '@storybook/angular';
+import { Template } from './template.component';
+
+const meta: Meta<Template> = {
+  component: Template,
+};
+
+export default meta;
+
+type Story = StoryObj<Template>;
+
+export const Default: Story = {
+  render: (args) => ({
+    props: args,
+    template: `<app-template ${argsToTemplate(args)}></app-template>`,
+  }),
+};
+
+export const SetOneInput: Story = {
+  ...Default,
+  args: {
+    label: 'Label Example 1',
+  },
+};