starlight-theme-nova 0.0.2 → 0.0.3

package/lib/markdown.css

@@ -20,8 +20,18 @@
 }
 
 /* <code> inside asides */
-@supports (border-color: color-mix(in srgb, var(--sl-color-asides-text-accent) 12%, transparent)) {
-	.sl-markdown-content .starlight-aside code:not(:where(.not-content *)) {
-		border-color: color-mix(in srgb, var(--sl-color-asides-text-accent) 12%, transparent);
-	}
+@supports (
+  border-color: color-mix(
+      in srgb,
+      var(--sl-color-asides-text-accent) 12%,
+      transparent
+    )
+) {
+  .sl-markdown-content .starlight-aside code:not(:where(.not-content *)) {
+    border-color: color-mix(
+      in srgb,
+      var(--sl-color-asides-text-accent) 12%,
+      transparent
+    );
+  }
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "starlight-theme-nova",
   "type": "module",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "description": "",
   "author": "ocavue <ocavue@gmail.com>",
   "license": "MIT",
@@ -18,6 +18,7 @@
   "exports": {
     ".": "./src/index.ts",
     "./*.css": "./lib/*.css",
+    "./components": "./src/components/index.ts",
     "./components/*.astro": "./src/components/*.astro"
   },
   "files": [

package/src/astro.d.ts

@@ -0,0 +1,6 @@
+declare module '*.astro' {
+  import { type AstroComponentFactory } from 'astro/runtime/server/index.js'
+
+  const content: AstroComponentFactory
+  export default content
+}

package/src/components/CodePackageManagers.astro

@@ -0,0 +1,55 @@
+---
+import { CodeTabItem, CodeTabs } from 'starlight-theme-nova/components'
+
+type PackageManager = 'pnpm' | 'npm' | 'yarn' | 'bun'
+
+interface Props {
+  /**
+   * The package managers to use.
+   *
+   * @default ['pnpm', 'npm', 'yarn', 'bun']
+   */
+  packageManagers?: PackageManager[]
+
+  /**
+   * The packages to install. If you want to install multiple packages, you can pass a space-separated string.
+   */
+  packages: string
+
+  /**
+   * Whether to install the packages as dev dependencies.
+   *
+   * @default false
+   */
+  dev?: boolean
+}
+
+const props: Props = Astro.props
+
+const packageManagers = props.packageManagers ?? ['pnpm', 'npm', 'yarn', 'bun']
+
+function getCode(packageManager: PackageManager) {
+  const parts: string[] = [
+    {
+      pnpm: 'pnpm add',
+      npm: 'npm install',
+      yarn: 'yarn add',
+      bun: 'bun add',
+    }[packageManager],
+
+    props.dev ? '-D' : '',
+
+    props.packages,
+  ]
+
+  return parts.filter(Boolean).join(' ')
+}
+---
+
+<CodeTabs syncKey="code-group-installation">
+  {
+    packageManagers.map((pkg) => (
+      <CodeTabItem label={pkg} lang="shell" code={getCode(pkg)} />
+    ))
+  }
+</CodeTabs>

package/src/components/MarkdownContent.astro

@@ -9,7 +9,7 @@ import CodeCopy from './CodeCopy.astro'
 
 <style is:global>
   :root .sl-markdown-content dd:not(:where(.not-content *)) {
-  	padding-inline-start: 2rem;
+    padding-inline-start: 2rem;
   }
 </style>
 

package/src/components/SocialIcons.astro

@@ -10,14 +10,12 @@ const links = Object.entries(config.social || {}) as [Platform, SocialConfig][]
 {
   links.length > 0 && (
     <>
-      {
-        links.map(([platform, { label, url }]) => (
-          <a href={url} rel="me" class="nova-social-icons-link">
-            <span class="sr-only">{label}</span>
-            <Icon name={platform} size="1rem" color="currentColor" />
-          </a>
-        ))
-      }
+      {links.map(([platform, { label, url }]) => (
+        <a href={url} rel="me" class="nova-social-icons-link">
+          <span class="sr-only">{label}</span>
+          <Icon name={platform} size="1rem" color="currentColor" />
+        </a>
+      ))}
     </>
   )
 }

package/src/components/index.ts

@@ -0,0 +1,6 @@
+export { default as Code } from './Code.astro'
+export { default as CodePackageManagers } from './CodePackageManagers.astro'
+export { default as CodeTabs } from './CodeTabs.astro'
+export { default as CodeTabItem } from './CodeTabItem.astro'
+export { default as LinkButton } from './LinkButton.astro'
+export { default as LinkCard } from './LinkCard.astro'