feat: create stories for Profile

I also updated the icons to reflect all in use.

Signed-off-by: André Jaenisch <andre.jaenisch@posteo.de>

stories/icons/AlertFill16.stories.ts

@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/svelte';
-import AlertFill16 from 'svelte-octicons/lib/AlertFill16.svelte';
+import { AlertFill16 } from 'svelte-octicons';
 
 const meta = {
 	title: 'Icons/AlertFill16',

stories/icons/Info16.stories.ts

@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/svelte';
-import Info16 from 'svelte-octicons/lib/Info16.svelte';
+import { Info16 } from 'svelte-octicons';
 
 const meta = {
 	title: 'Icons/Info16',

stories/icons/NorthStar24.stories.ts

@@ -0,0 +1,18 @@
+import type { Meta, StoryObj } from '@storybook/svelte';
+import { NorthStar24 } from 'svelte-octicons';
+
+const meta = {
+	title: 'Icons/NorthStar24',
+	component: NorthStar24,
+	tags: ['autodocs'],
+	argTypes: {
+		fill: {
+			control: 'color'
+		}
+	}
+} satisfies Meta<NorthStar24>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Plain: Story = {};

stories/icons/Repo24.stories.ts

@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/svelte';
-import Repo24 from 'svelte-octicons/lib/Repo24.svelte';
+import { Repo24 } from 'svelte-octicons';
 
 const meta = {
 	title: 'Icons/Repo24',

stories/icons/Star16.stories.ts

@@ -0,0 +1,18 @@
+import type { Meta, StoryObj } from '@storybook/svelte';
+import { Star16 } from 'svelte-octicons';
+
+const meta = {
+	title: 'Icons/Star16',
+	component: Star16,
+	tags: ['autodocs'],
+	argTypes: {
+		fill: {
+			control: 'color'
+		}
+	}
+} satisfies Meta<Star16>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Plain: Story = {};

stories/icons/Upload16.stories.ts

@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/svelte';
-import Upload16 from 'svelte-octicons/lib/Upload16.svelte';
+import { Upload16 } from 'svelte-octicons';
 
 const meta = {
 	title: 'Icons/Upload16',

stories/pages/Profile.stories.ts

@@ -0,0 +1,35 @@
+import type { Meta, StoryObj } from '@storybook/svelte';
+
+import Profile from '$lib/components/pages/Profile.svelte';
+
+const meta = {
+	title: 'Pages/Profile',
+	component: Profile,
+	tags: ['autodocs'],
+	argTypes: {
+		data: { controls: 'object' }
+	}
+} satisfies Meta<Profile>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Plain: Story = {
+	args: {
+		data: {
+			user: {
+				avatar: '',
+				created_at: new Date(),
+				created_at_formatted: (function () {
+					const locale = 'en-US';
+					return new Intl.DateTimeFormat(locale).format(new Date());
+				})(),
+				created_with: 'Anvil',
+				display_name: 'Jane Doe',
+				instance: 'domain.example',
+				pronoun: 'she/her',
+				username: 'jane_doe'
+			}
+		}
+	}
+};

stories/templates/Profile.stories.ts

@@ -0,0 +1,35 @@
+import type { Meta, StoryObj } from '@storybook/svelte';
+
+import Profile from '$lib/components/templates/Profile.svelte';
+
+const meta = {
+	title: 'Templates/Profile',
+	component: Profile,
+	tags: ['autodocs'],
+	argTypes: {
+		data: { controls: 'object' }
+	}
+} satisfies Meta<Profile>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Plain: Story = {
+	args: {
+		data: {
+			user: {
+				avatar: '',
+				created_at: new Date(),
+				created_at_formatted: (function () {
+					const locale = 'en-US';
+					return new Intl.DateTimeFormat(locale).format(new Date());
+				})(),
+				created_with: 'Anvil',
+				display_name: 'Jane Doe',
+				instance: 'domain.example',
+				pronoun: 'she/her',
+				username: 'jane_doe'
+			}
+		}
+	}
+};