fixes

src/components/Dropdown.svelte

@@ -1,10 +1,9 @@
 <script>
   import Button from "./Button.svelte";
-  import ButtonBorderless from "./ButtonBorderless.svelte";
 
   // Props
   export let name = "";
-  export let variant = "default"; // 'default' | 'borderless' aka 'Button' | 'ButtonBorderless'
+  export let border = false;
 
   let isOpen = false;
 
@@ -22,45 +21,24 @@
 </script>
 
 <div class="relative inline-block" on:focusout={handleFocusOut}>
-  {#if variant === "borderless"}
+  <Button onClick={toggle} border={border}>
-    <ButtonBorderless onClick={toggle}>
+    {name}
-      {name}
+    <svg
-      <svg
+      xmlns="http://www.w3.org/2000/svg"
-        xmlns="http://www.w3.org/2000/svg"
+      fill="none"
-        fill="none"
+      viewBox="0 0 24 24"
-        viewBox="0 0 24 24"
+      stroke-width="2"
-        stroke-width="2"
+      stroke="currentColor"
-        stroke="currentColor"
+      class="w-5 ml-2 mt-1 transition-transform inline-block"
-        class="w-5 ml-2 mt-1 transition-transform inline-block"
+      style:transform={isOpen ? "rotate(180deg)" : "none"}
-        style:transform={isOpen ? "rotate(180deg)" : "none"}
+    >
-      >
+      <path
-        <path
+        stroke-linecap="round"
-          stroke-linecap="round"
+        stroke-linejoin="round"
-          stroke-linejoin="round"
+        d="m19.5 8.25-7.5 7.5-7.5-7.5"
-          d="m19.5 8.25-7.5 7.5-7.5-7.5"
+      />
-        />
+    </svg>
-      </svg>
+  </Button>
-    </ButtonBorderless>
-  {:else}
-    <Button onClick={toggle}>
-      {name}
-      <svg
-        xmlns="http://www.w3.org/2000/svg"
-        fill="none"
-        viewBox="0 0 24 24"
-        stroke-width="2"
-        stroke="currentColor"
-        class="w-5 ml-2 mt-1 transition-transform inline-block"
-        style:transform={isOpen ? "rotate(180deg)" : "none"}
-      >
-        <path
-          stroke-linecap="round"
-          stroke-linejoin="round"
-          d="m19.5 8.25-7.5 7.5-7.5-7.5"
-        />
-      </svg>
-    </Button>
-  {/if}
 
   <div
     class="absolute mt-2 rounded-md shadow-lg bg-white ring-1 ring-black/5 overflow-hidden flex flex-col"

src/components/index.js

@@ -5,5 +5,4 @@ export { default as Grid } from './layout/Grid.svelte'
 export { default as Center } from './layout/Center.svelte'
 
 export { default as Button } from './Button.svelte'
-export { default as ButtonBorderless } from './ButtonBorderless.svelte'
 export { default as Dropdown } from './Dropdown.svelte'

src/routes/Home.svelte

@@ -1,7 +1,6 @@
 <script>
   import {
     Button,
-    ButtonBorderless,
     Container,
     Card,
     Stack,
@@ -19,9 +18,7 @@
         “Lapikud”.
       </p>
       <Button href="/docs/getting-started">Get Started</Button>
-      <ButtonBorderless href="/docs/components"
+      <Button href="/docs/components">Explore Components</Button>
-        >Explore Components</ButtonBorderless
-      >
     </Card>
 
     <Grid min="250px" gap="var(--space-4)">

src/routes/Test.svelte

@@ -1 +0,0 @@
-<div>testing</div>