feat: move away from carbon components and TinyMCE (#597)

* feat: remove tinymce & replace org sidebar * chore: PR Fixes * chore: move ui font into src dir * remove files in vite config * use google font import for loading font * remove custom font * more fonts update * remove font bold * more removals of font bold * fix import * checkpoint * chore: checkpoint (add course & lms shadcn sidebar) * minor css improvements and try out font sans * chore: replace carbon components with shadcn's * chore: replace carbon components with shadcn _ v3 * chore: ui fixes & storybook update * feat: UI cleanup * fix: quick ui fixes * chore: update pnpm-lock.yaml with new dependencies and versions; fix output.css formatting * chore: add isloading to button * feat: add loading state to button stories * chore: feedback fixes * fix: feedback fixes * chore: remove console * fix: PR comments * fix: PR comments --------- Co-authored-by: Rotimi Best <best@classroomio.com>
2025-11-21 12:18:04 +01:00
parent 2145782385
commit cbf6ae7e63
499 changed files with 19708 additions and 15603 deletions
@@ -0,0 +1,67 @@
+<script module>
+  import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { Toaster, toast } from '@cio/ui/base/sonner';
+  import { Button } from '@cio/ui/base/button';
+  import { FIELDS } from './fields';
+
+  const { Story } = defineMeta({
+    title: 'Atom/Sonner (Toast)',
+    component: Toaster,
+    parameters: {
+      layout: 'centered',
+      controls: {
+        include: FIELDS
+      }
+    },
+    tags: ['autodocs']
+  });
+</script>
+
+<Story name="Default">
+  {#snippet template()}
+    <div class="flex flex-col gap-4">
+      <Toaster />
+      <Button onclick={() => toast('This is a default toast message')}>Show Toast</Button>
+    </div>
+  {/snippet}
+</Story>
+
+<Story name="Success">
+  {#snippet template()}
+    <div class="flex flex-col gap-4">
+      <Toaster />
+      <Button variant="outline" onclick={() => toast.success('Course created successfully!')}>
+        Show Success Toast
+      </Button>
+    </div>
+  {/snippet}
+</Story>
+
+<Story name="Error">
+  {#snippet template()}
+    <div class="flex flex-col gap-4">
+      <Toaster />
+      <Button variant="destructive" onclick={() => toast.error('Failed to save changes. Please try again.')}>
+        Show Error Toast
+      </Button>
+    </div>
+  {/snippet}
+</Story>
+
+<Story name="Warning">
+  {#snippet template()}
+    <div class="flex flex-col gap-4">
+      <Toaster />
+      <Button variant="outline" onclick={() => toast.warning('You have unsaved changes!')}>Show Warning Toast</Button>
+    </div>
+  {/snippet}
+</Story>
+
+<Story name="Info">
+  {#snippet template()}
+    <div class="flex flex-col gap-4">
+      <Toaster />
+      <Button variant="secondary" onclick={() => toast.info('New updates are available')}>Show Info Toast</Button>
+    </div>
+  {/snippet}
+</Story>