OZG-7047 Add story for tooltip

alfa-client/apps/demo/src/app/app.component.html

@@ -19,7 +19,7 @@
             <a
               href="#"
               class="flex flex-col items-start justify-between gap-2 rounded-t-md border-primary-600/50 px-6 py-4 hover:bg-background-150 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus lg:flex-row lg:gap-6"
-              [tooltip]="'This is tooltip attached to link element'"
+              tooltip="This is tooltip attached to link element"
             >
               <div class="flex-1 basis-5/6">
                 <div class="flex flex-wrap items-center gap-x-3">
@@ -397,7 +397,7 @@
       </form>
       <app-bescheid-dialog-button></app-bescheid-dialog-button>
       <div class="my-4 flex gap-4">
-        <ods-button text="Button 1" [tooltip]="'Sample tooltip'" />
+        <ods-button text="Button 1" tooltip="Sample tooltip" />
         <ods-button size="medium" [isLoading]="true" text="Button 2" />
         <ods-button type="outline" text="Button 3" />
       </div>

alfa-client/libs/design-system/src/lib/tooltip/tooltip.stories.ts

+import { moduleMetadata, type Meta, type StoryObj } from '@storybook/angular';
+import { TooltipDirective } from './tooltip.directive';
+
+const meta: Meta = {
+  title: 'Tooltip',
+  excludeStories: /.*Data$/,
+  tags: ['autodocs'],
+  decorators: [
+    moduleMetadata({
+      imports: [TooltipDirective],
+    }),
+  ],
+  parameters: {
+    docs: {
+      description: {
+        component: 'Tooltip directive that can be used with every element (check out default story to see tooltip working).',
+      },
+    },
+  },
+};
+
+export default meta;
+type Story = StoryObj;
+
+export const Default: Story = {
+  render: () => ({
+    template: '<button tooltip="Hello">I have a tooltip!</button>',
+  }),
+};