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,52 @@
+<script module>
+  import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@cio/ui/base/collapsible';
+  import { Button } from '@cio/ui';
+  import { FIELDS } from './fields';
+
+  const { Story } = defineMeta({
+    title: 'Atom/Collapsible',
+    component: Collapsible,
+    parameters: {
+      layout: 'centered',
+      controls: {
+        include: FIELDS
+      }
+    },
+    tags: ['autodocs']
+  });
+</script>
+
+<Story name="Default">
+  {#snippet template()}
+    <Collapsible class="w-[350px] space-y-2">
+      <div class="flex items-center justify-between space-x-4 px-4">
+        <h4 class="text-sm font-semibold">@peduarte starred 3 repositories</h4>
+        <CollapsibleTrigger>
+          <Button.Root variant="ghost" size="sm" class="w-9 p-0">
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              width="24"
+              height="24"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              stroke-width="2"
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              class="h-4 w-4"
+            >
+              <polyline points="6 9 12 15 18 9"></polyline>
+            </svg>
+            <span class="sr-only">Toggle</span>
+          </Button.Root>
+        </CollapsibleTrigger>
+      </div>
+      <div class="rounded-md border px-4 py-3 font-mono text-sm">@radix-ui/primitives</div>
+      <CollapsibleContent class="space-y-2">
+        <div class="rounded-md border px-4 py-3 font-mono text-sm">@radix-ui/colors</div>
+        <div class="rounded-md border px-4 py-3 font-mono text-sm">@stitches/react</div>
+      </CollapsibleContent>
+    </Collapsible>
+  {/snippet}
+</Story>