starlight-theme-bejamas 0.1.1 → 0.1.2

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # starlight-theme-bejamas
 
+## 0.1.2
+
+### Patch Changes
+
+- [#6](https://github.com/bejamas/ui/pull/6) [`fcca220`](https://github.com/bejamas/ui/commit/fcca220c0d4760edbaaefbfe2ce0af512bfadc26) Thanks [@thomkrupa](https://github.com/thomkrupa)! - convert component names to PascalCase for barrel import
+
+- [#6](https://github.com/bejamas/ui/pull/6) [`41d9e97`](https://github.com/bejamas/ui/commit/41d9e97f7cee67e95d9c9eeb112762d1487d4e4f) Thanks [@thomkrupa](https://github.com/thomkrupa)! - change imports of bejamas/ui components
+
 ## 0.1.1
 
 ### Patch Changes

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "starlight-theme-bejamas",
   "author": "Bejamas",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "license": "MIT",
   "description": "A Starlight theme using bejamas/ui",
   "type": "module",

package/src/lib/vite.ts

@@ -27,6 +27,17 @@ export function vitePluginStarlightThemeBejamas(
           return `export default (()=>{ throw new Error(\"starlight-theme-bejamas: No component mapping found for '${componentName}'. Add it under 'components' in your starlightThemeBejamas config.\"); })()`;
         }
 
+        // Check if target is a barrel import (no .astro extension) or old-style file import
+        const isBarrelImport = !target.endsWith(".astro");
+
+        if (isBarrelImport) {
+          // For barrel imports, the component is exported as a named export in PascalCase
+          // Convert componentName (e.g., 'button') to PascalCase (e.g., 'Button')
+          const pascalCaseName = componentName.charAt(0).toUpperCase() + componentName.slice(1);
+          return `export { ${pascalCaseName} as default, ${pascalCaseName} } from "${target}"; export * from "${target}";`;
+        }
+
+        // Old pattern: .astro file with default export
         return `export { default } from "${target}"; export * from "${target}";`;
       }
 

package/src/overrides/Header.astro

@@ -9,7 +9,7 @@ import ThemeSelect from "virtual:starlight/components/ThemeSelect";
 
 import options from "virtual:starlight-theme-bejamas/user-config";
 
-import Button from "virtual:starlight-theme-bejamas/components/Button.astro";
+import { Button } from "virtual:starlight-theme-bejamas/components/button";
 /**
  * Render the `Search` component if Pagefind is enabled or the default search component has been overridden.
  */

package/src/overrides/Hero.astro

@@ -1,6 +1,6 @@
 ---
 import { Image } from "astro:assets";
-import Button from "virtual:starlight-theme-bejamas/components/Button.astro";
+import { Button } from "virtual:starlight-theme-bejamas/components/button";
 
 const { data } = Astro.locals.starlightRoute.entry;
 const { title = data.title, tagline, image, actions = [] } = data.hero || {};

package/src/overrides/PageTitle.astro

@@ -1,5 +1,5 @@
 ---
-import Button from "virtual:starlight-theme-bejamas/components/Button.astro";
+import { Button } from "virtual:starlight-theme-bejamas/components/button";
 
 import { ArrowRight, ArrowLeft, ArrowUpRight } from "@lucide/astro";
 

package/src/overrides/Pagination.astro

@@ -1,6 +1,5 @@
 ---
-// import { Icon } from "@astrojs/starlight/components";
-import Button from "virtual:starlight-theme-bejamas/components/Button.astro";
+import { Button } from "virtual:starlight-theme-bejamas/components/button";
 import { ArrowRight, ArrowLeft } from "@lucide/astro";
 
 const { dir, pagination } = Astro.locals.starlightRoute;
@@ -27,14 +26,6 @@ const isRtl = dir === "rtl";
   }
 </div>
 
-<!-- <div class="text-center text-sm text-muted-foreground page-footer">
-  <p>
-    Built at <a href="https://bejamas.com" class="underline underline-offset-4"
-      >Bejamas</a
-    >.
-  </p>
-</div> -->
-
 <style>
   @layer starlight.core {
     .pagination-links {

package/src/overrides/ThemeSelect.astro

@@ -1,5 +1,10 @@
 ---
-import Select from "virtual:starlight-theme-bejamas/components/Select.astro";
+import {
+  Select,
+  SelectControl,
+  SelectIndicator,
+  SelectOption,
+} from "virtual:starlight-theme-bejamas/components/select";
 
 import { SunIcon, MoonIcon, LaptopIcon } from "@lucide/astro";
 ---
@@ -12,22 +17,21 @@ import { SunIcon, MoonIcon, LaptopIcon } from "@lucide/astro";
       <LaptopIcon class="theme-icon theme-icon-auto size-4" />
     </div>
     <Select showCheckmark={false}>
-      <Select part="indicator" />
-      <Select
-        part="control"
+      <SelectIndicator />
+      <SelectControl
         showCheckmark={false}
         class="sl-bejamas-theme-select-control"
       >
-        <Select part="option" value="light"
-          ><SunIcon class="size-4" /> Light</Select
+        <SelectOption value="light"
+          ><SunIcon class="size-4" /> Light</SelectOption
         >
-        <Select part="option" value="dark"
-          ><MoonIcon class="size-4" /> Dark</Select
+        <SelectOption value="dark"
+          ><MoonIcon class="size-4" /> Dark</SelectOption
         >
-        <Select part="option" value="auto"
-          ><LaptopIcon class="size-4" /> Auto</Select
+        <SelectOption value="auto"
+          ><LaptopIcon class="size-4" /> Auto</SelectOption
         >
-      </Select>
+      </SelectControl>
     </Select>
   </div>
 </starlight-theme-select>