livemark 0.7.2 → 0.8.0

package/{build/website → source}/elements/command.tsx

@@ -2,7 +2,7 @@ import * as React from "react"
 import { Command as CommandPrimitive } from "cmdk"
 import { CheckIcon, SearchIcon, XIcon } from "lucide-react"
 
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 import {
   Dialog,
   DialogContent,

package/{build/website → source}/elements/context-menu.tsx

@@ -2,7 +2,7 @@ import * as React from "react"
 import { ContextMenu as ContextMenuPrimitive } from "@base-ui/react/context-menu"
 import { CheckIcon, ChevronRightIcon } from "lucide-react"
 
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function ContextMenu({ ...props }: ContextMenuPrimitive.Root.Props) {
   return <ContextMenuPrimitive.Root data-slot="context-menu" {...props} />

package/{build/website → source}/elements/dialog.tsx

@@ -1,6 +1,6 @@
 import { Dialog as DialogPrimitive } from "@base-ui/react/dialog"
 import { XIcon } from "lucide-react"
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 import { Button } from "./button.tsx"
 
 function Dialog({ ...props }: DialogPrimitive.Root.Props) {

package/{build/website → source}/elements/drawer.tsx

@@ -1,5 +1,5 @@
 import { Drawer as DrawerPrimitive } from "vaul"
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function Drawer({
   ...props

package/{build/website → source}/elements/dropdown-menu.tsx

@@ -1,6 +1,6 @@
 import { Menu as MenuPrimitive } from "@base-ui/react/menu"
 import { CheckIcon, ChevronRightIcon } from "lucide-react"
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function DropdownMenu({ ...props }: MenuPrimitive.Root.Props) {
   return <MenuPrimitive.Root data-slot="dropdown-menu" {...props} />

package/{build/website → source}/elements/empty.tsx

@@ -1,6 +1,6 @@
 import { cva, type VariantProps } from "class-variance-authority"
 
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function Empty({ className, ...props }: React.ComponentProps<"div">) {
   return (

package/{build/website → source}/elements/field.tsx

@@ -1,6 +1,6 @@
 import { cva, type VariantProps } from "class-variance-authority"
 import { useMemo } from "react"
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 import { Label } from "./label.tsx"
 import { Separator } from "./separator.tsx"
 

package/{build/website → source}/elements/hover-card.tsx

@@ -1,6 +1,6 @@
 import { PreviewCard as PreviewCardPrimitive } from "@base-ui/react/preview-card"
 
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function HoverCard({ ...props }: PreviewCardPrimitive.Root.Props) {
   return <PreviewCardPrimitive.Root data-slot="hover-card" {...props} />

package/{build/website → source}/elements/input-group.tsx

@@ -1,5 +1,5 @@
 import { cva, type VariantProps } from "class-variance-authority"
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 import { Button } from "./button.tsx"
 import { Input } from "./input.tsx"
 import { Textarea } from "./textarea.tsx"

package/{build/website → source}/elements/input-otp.tsx

@@ -2,7 +2,7 @@ import * as React from "react"
 import { OTPInput, OTPInputContext } from "input-otp"
 import { MinusIcon } from "lucide-react"
 
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function InputOTP({
   className,

package/{build/website → source}/elements/input.tsx

@@ -1,5 +1,5 @@
 import { Input as InputPrimitive } from "@base-ui/react/input"
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function Input({ className, type, ...props }: React.ComponentProps<"input">) {
   return (

package/{build/website → source}/elements/item.tsx

@@ -1,7 +1,7 @@
 import { mergeProps } from "@base-ui/react/merge-props"
 import { useRender } from "@base-ui/react/use-render"
 import { cva, type VariantProps } from "class-variance-authority"
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 import { Separator } from "./separator.tsx"
 
 function ItemGroup({ className, ...props }: React.ComponentProps<"div">) {

package/{build/website → source}/elements/kbd.tsx

@@ -1,4 +1,4 @@
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function Kbd({ className, ...props }: React.ComponentProps<"kbd">) {
   return (

package/{build/website → source}/elements/label.tsx

@@ -1,5 +1,5 @@
 // biome-ignore-all lint: shadcn
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function Label({ className, ...props }: React.ComponentProps<"label">) {
   return (

package/{build/website → source}/elements/menubar.tsx

@@ -3,7 +3,7 @@ import { Menu as MenuPrimitive } from "@base-ui/react/menu"
 import { Menubar as MenubarPrimitive } from "@base-ui/react/menubar"
 import { CheckIcon } from "lucide-react"
 
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 import {
   DropdownMenu,
   DropdownMenuContent,

package/{build/website → source}/elements/native-select.tsx

@@ -1,7 +1,7 @@
 import * as React from "react"
 import { ChevronDownIcon } from "lucide-react"
 
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 type NativeSelectProps = Omit<React.ComponentProps<"select">, "size"> & {
   size?: "sm" | "default"

package/{build/website → source}/elements/navigation-menu.tsx

@@ -2,7 +2,7 @@ import { NavigationMenu as NavigationMenuPrimitive } from "@base-ui/react/naviga
 import { cva } from "class-variance-authority"
 import { ChevronDownIcon } from "lucide-react"
 
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function NavigationMenu({
   align = "start",

package/{build/website → source}/elements/pagination.tsx

@@ -5,7 +5,7 @@ import {
   MoreHorizontalIcon,
 } from "lucide-react"
 
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 import { Button } from "./button.tsx"
 
 function Pagination({ className, ...props }: React.ComponentProps<"nav">) {

package/{build/website → source}/elements/popover.tsx

@@ -1,7 +1,7 @@
 import * as React from "react"
 import { Popover as PopoverPrimitive } from "@base-ui/react/popover"
 
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function Popover({ ...props }: PopoverPrimitive.Root.Props) {
   return <PopoverPrimitive.Root data-slot="popover" {...props} />

package/{build/website → source}/elements/progress.tsx

@@ -1,6 +1,6 @@
 import { Progress as ProgressPrimitive } from "@base-ui/react/progress"
 
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function Progress({
   className,

package/{build/website → source}/elements/radio-group.tsx

@@ -1,7 +1,7 @@
 import { Radio as RadioPrimitive } from "@base-ui/react/radio"
 import { RadioGroup as RadioGroupPrimitive } from "@base-ui/react/radio-group"
 
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function RadioGroup({ className, ...props }: RadioGroupPrimitive.Props) {
   return (

package/{build/website → source}/elements/resizable.tsx

@@ -1,6 +1,6 @@
 import * as ResizablePrimitive from "react-resizable-panels"
 
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function ResizablePanelGroup({
   className,

package/{build/website → source}/elements/scroll-area.tsx

@@ -1,5 +1,5 @@
 import { ScrollArea as ScrollAreaPrimitive } from "@base-ui/react/scroll-area"
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function ScrollArea({
   className,

package/{build/website → source}/elements/select.tsx

@@ -2,7 +2,7 @@ import * as React from "react"
 import { Select as SelectPrimitive } from "@base-ui/react/select"
 import { CheckIcon, ChevronDownIcon, ChevronUpIcon } from "lucide-react"
 
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 const Select = SelectPrimitive.Root
 

package/{build/website → source}/elements/separator.tsx

@@ -1,5 +1,5 @@
 import { Separator as SeparatorPrimitive } from "@base-ui/react/separator"
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function Separator({
   className,

package/{build/website → source}/elements/sheet.tsx

@@ -1,6 +1,6 @@
 import { Dialog as SheetPrimitive } from "@base-ui/react/dialog"
 import { XIcon } from "lucide-react"
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 import { Button } from "./button.tsx"
 
 function Sheet({ ...props }: SheetPrimitive.Root.Props) {

package/{build/website → source}/elements/sidebar.tsx

@@ -4,8 +4,8 @@ import { useRender } from "@base-ui/react/use-render"
 import { cva, type VariantProps } from "class-variance-authority"
 import { Menu } from "lucide-react"
 import * as React from "react"
-import { cn } from "../helpers/style.ts"
-import { useIsMobile } from "../hooks/media.ts"
+import { cn } from "../utils/style.ts"
+import { isMobileNow, useIsMobile } from "../hooks/media.ts"
 import { Button } from "./button.tsx"
 import { Input } from "./input.tsx"
 import { Separator } from "./separator.tsx"
@@ -83,9 +83,12 @@ function SidebarProvider({
   )
 
   // Helper to toggle the sidebar.
+  // Reads matchMedia synchronously instead of relying on `isMobile` React
+  // state, which can be momentarily stale on the first click after a
+  // SidebarProvider key remount (e.g. landing → article navigation).
   const toggleSidebar = React.useCallback(() => {
-    return isMobile ? setOpenMobile(open => !open) : setOpen(open => !open)
-  }, [isMobile, setOpen, setOpenMobile])
+    return isMobileNow() ? setOpenMobile(open => !open) : setOpen(open => !open)
+  }, [setOpen, setOpenMobile])
 
   // Adds a keyboard shortcut to toggle the sidebar.
   React.useEffect(() => {

package/{build/website → source}/elements/skeleton.tsx

@@ -1,4 +1,4 @@
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function Skeleton({ className, ...props }: React.ComponentProps<"div">) {
   return (

package/{build/website → source}/elements/slider.tsx

@@ -1,7 +1,7 @@
 import * as React from "react"
 import { Slider as SliderPrimitive } from "@base-ui/react/slider"
 
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function Slider({
   className,

package/{build/website → source}/elements/spinner.tsx

@@ -1,6 +1,6 @@
 import { Loader2Icon } from "lucide-react"
 
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function Spinner({ className, ...props }: React.ComponentProps<"svg">) {
   return (

package/{build/website → source}/elements/switch.tsx

@@ -1,6 +1,6 @@
 import { Switch as SwitchPrimitive } from "@base-ui/react/switch"
 
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function Switch({
   className,

package/{build/website → source}/elements/table.tsx

@@ -1,4 +1,4 @@
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function Table({ className, ...props }: React.ComponentProps<"table">) {
   return (

package/{build/website → source}/elements/tabs.tsx

@@ -1,6 +1,6 @@
 import { Tabs as TabsPrimitive } from "@base-ui/react/tabs"
 import { cva, type VariantProps } from "class-variance-authority"
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function Tabs({
   className,

package/{build/website → source}/elements/textarea.tsx

@@ -1,4 +1,4 @@
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
   return (

package/{build/website → source}/elements/toggle-group.tsx

@@ -3,7 +3,7 @@ import { Toggle as TogglePrimitive } from "@base-ui/react/toggle"
 import { ToggleGroup as ToggleGroupPrimitive } from "@base-ui/react/toggle-group"
 import { type VariantProps } from "class-variance-authority"
 
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 import { toggleVariants } from "./toggle.tsx"
 
 const ToggleGroupContext = React.createContext<

package/{build/website → source}/elements/toggle.tsx

@@ -1,7 +1,7 @@
 import { Toggle as TogglePrimitive } from "@base-ui/react/toggle"
 import { cva, type VariantProps } from "class-variance-authority"
 
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 const toggleVariants = cva(
   "group/toggle inline-flex items-center justify-center gap-1 rounded-md text-sm font-medium whitespace-nowrap transition-[color,box-shadow] outline-none hover:bg-muted hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 aria-pressed:bg-muted dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",

package/{build/website → source}/elements/tooltip.tsx

@@ -1,5 +1,5 @@
 import { Tooltip as TooltipPrimitive } from "@base-ui/react/tooltip"
-import { cn } from "../helpers/style.ts"
+import { cn } from "../utils/style.ts"
 
 function TooltipProvider({
   delay = 0,

package/source/entrypoints/main.ts

@@ -0,0 +1,12 @@
+#!/usr/bin/env node
+
+process.removeAllListeners("warning")
+process.on("warning", warning => {
+  if (warning.name === "ExperimentalWarning") {
+    return
+  }
+  console.warn(warning)
+})
+
+const { program } = await import("../program.ts")
+program.parse()

package/{build/website → source}/env.d.ts

@@ -1,5 +1,5 @@
 interface ImportMetaEnv {
-  readonly CONFIG: import("../models/config.ts").WebsiteConfig
+  readonly CONFIG: import("./models/config.ts").WebsiteConfig
 }
 
 declare module "content-collections" {

package/source/helpers/program.ts

@@ -0,0 +1,6 @@
+import type { HelpConfiguration } from "commander"
+import pc from "picocolors"
+
+export const helpConfiguration: HelpConfiguration = {
+  styleTitle: str => pc.bold(str.toUpperCase().replace(":", "")),
+}

package/{build/website → source}/helpers/section.ts

@@ -1,4 +1,4 @@
-import type { Section } from "../../models/section.ts"
+import type { Section } from "../models/section.ts"
 
 const DEFAULT_ICONS: Record<Section["type"], string> = {
   article: "book-open",

package/source/hooks/media.ts

@@ -0,0 +1,29 @@
+import { useSyncExternalStore } from "react"
+
+export const MOBILE_BREAKPOINT = 768
+
+export function useIsMobile() {
+  return useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot)
+}
+
+/** Synchronous, render-cycle-independent check.
+ *  Use at event-handler call sites where React state may be momentarily stale
+ *  (e.g. right after a SidebarProvider key remount). */
+export function isMobileNow() {
+  if (typeof window === "undefined") return false
+  return window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`).matches
+}
+
+function subscribe(callback: () => void) {
+  const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`)
+  mql.addEventListener("change", callback)
+  return () => mql.removeEventListener("change", callback)
+}
+
+function getSnapshot() {
+  return window.innerWidth < MOBILE_BREAKPOINT
+}
+
+function getServerSnapshot() {
+  return false
+}

package/source/index.ts

@@ -0,0 +1 @@
+export { defineConfig } from "./actions/config/define.ts"

package/{build/website → source}/models/article.ts

@@ -19,6 +19,8 @@ export const Article = z.object({
   author: z.union([nonEmptyString, z.array(nonEmptyString)]).optional(),
   date: nonEmptyString.optional(),
   tags: z.array(nonEmptyString).optional(),
+  sourceUrl: nonEmptyString.optional(),
+  sourceAction: z.enum(["edit", "view"]).default("edit"),
 })
 
 /** Processed article ready for page rendering (result of content-collections transform). */
@@ -35,6 +37,8 @@ export interface ArticleView {
   author?: string | string[]
   date?: string
   tags?: string[]
+  sourceUrl?: string
+  sourceAction?: "edit" | "view"
 }
 
 export interface ArticleNode {

package/source/models/config.ts

@@ -0,0 +1,51 @@
+import { z } from "zod"
+import { Link } from "./link.ts"
+import { Patch } from "./patch.ts"
+import { Section } from "./section.ts"
+import { CodeThemeDark, CodeThemeLight } from "./theme.ts"
+
+/**
+ * User-provided configuration for Livemark.
+ */
+export type UserConfig = z.infer<typeof UserConfig>
+export const UserConfig = z.object({
+  site: z.string().optional(),
+  favicon: z.string().optional(),
+  logo: z.string().optional(),
+  title: z.string().default("Livemark"),
+  description: z.string().default("Markdown site generator"),
+  include: z.union([z.string(), z.array(z.string())]),
+  exclude: z.union([z.string(), z.array(z.string())]).optional(),
+  codeThemeLight: CodeThemeLight.default("catppuccin-latte"),
+  codeThemeDark: CodeThemeDark.default("catppuccin-mocha"),
+  links: z.array(Link).optional(),
+  sections: z.array(Section).optional(),
+  patches: z.array(Patch).optional(),
+})
+
+/** Website configuration injected at build time via Vite define */
+export type WebsiteConfig = z.infer<typeof WebsiteConfig>
+export const WebsiteConfig = UserConfig.pick({
+  title: true,
+  description: true,
+  site: true,
+  favicon: true,
+  logo: true,
+  links: true,
+  sections: true,
+})
+
+/**
+ * System-computed configuration derived from the config file location.
+ */
+export type SystemConfig = z.infer<typeof SystemConfig>
+export const SystemConfig = z.object({
+  root: z.string(),
+  configPath: z.string(),
+})
+
+/**
+ * Fully resolved Livemark configuration.
+ */
+export type Config = z.infer<typeof Config>
+export const Config = UserConfig.merge(SystemConfig)

package/source/models/link.ts

@@ -0,0 +1,11 @@
+import { z } from "zod"
+
+/** Header or sidebar link to an external URL. */
+export type Link = z.infer<typeof Link>
+export const Link = z.object({
+  url: z.string(),
+  title: z.string(),
+  icon: z.string().optional(),
+  prefix: z.string().optional(),
+  position: z.enum(["header", "sidebar"]).default("header"),
+})

package/source/models/patch.ts

@@ -0,0 +1,9 @@
+import { z } from "zod"
+import { Article } from "./article.ts"
+
+/** Per-file override for article frontmatter provided via `livemark.config.ts`. */
+export type Patch = z.infer<typeof Patch>
+export const Patch = z.object({
+  file: z.string(),
+  article: Article.omit({ content: true }).partial().strict(),
+})

package/source/models/section.ts

@@ -0,0 +1,45 @@
+import { z } from "zod"
+
+const BaseSection = z.object({
+  icon: z.string().optional(),
+  title: z.string(),
+  prefix: z.string(),
+  position: z.enum(["header", "sidebar"]).default("header"),
+})
+
+/** Default section: renders articles. */
+export type ArticleSection = z.infer<typeof ArticleSection>
+export const ArticleSection = BaseSection.extend({
+  type: z.literal("article"),
+})
+
+/** Blog section: date-sorted posts with tags and index. */
+export type BlogSection = z.infer<typeof BlogSection>
+export const BlogSection = BaseSection.extend({
+  type: z.literal("blog"),
+})
+
+/** Changelog section: single file or GitHub releases, split per version. */
+export type ChangelogSection = z.infer<typeof ChangelogSection>
+export const ChangelogSection = BaseSection.extend({
+  type: z.literal("changelog"),
+  source: z.string(),
+  version: z.boolean().optional(),
+})
+
+/**
+ * A site section. Discriminated on `type`.
+ * When `type` is omitted, it defaults to "article" so plain
+ * `{ title, prefix }` entries keep working.
+ */
+export type Section = z.infer<typeof Section>
+export const Section = z.preprocess(
+  input => {
+    if (input === null || typeof input !== "object" || Array.isArray(input)) {
+      return input
+    }
+    const record = input as Record<string, unknown>
+    return "type" in record ? record : { ...record, type: "article" }
+  },
+  z.discriminatedUnion("type", [ArticleSection, BlogSection, ChangelogSection]),
+)

package/source/models/theme.ts

@@ -0,0 +1,74 @@
+import { z } from "zod"
+
+/** Light syntax highlighting theme (Shiki) */
+export const CodeThemeLight = z.enum([
+  "ayu-light",
+  "catppuccin-latte",
+  "everforest-light",
+  "github-light",
+  "github-light-default",
+  "github-light-high-contrast",
+  "gruvbox-light-hard",
+  "gruvbox-light-medium",
+  "gruvbox-light-soft",
+  "horizon-bright",
+  "kanagawa-lotus",
+  "light-plus",
+  "material-theme-lighter",
+  "min-light",
+  "night-owl-light",
+  "one-light",
+  "rose-pine-dawn",
+  "slack-ochin",
+  "snazzy-light",
+  "solarized-light",
+  "vitesse-light",
+])
+
+/** Dark syntax highlighting theme (Shiki) */
+export const CodeThemeDark = z.enum([
+  "andromeeda",
+  "aurora-x",
+  "ayu-dark",
+  "ayu-mirage",
+  "catppuccin-frappe",
+  "catppuccin-macchiato",
+  "catppuccin-mocha",
+  "dark-plus",
+  "dracula",
+  "dracula-soft",
+  "everforest-dark",
+  "github-dark",
+  "github-dark-default",
+  "github-dark-dimmed",
+  "github-dark-high-contrast",
+  "gruvbox-dark-hard",
+  "gruvbox-dark-medium",
+  "gruvbox-dark-soft",
+  "horizon",
+  "houston",
+  "kanagawa-dragon",
+  "kanagawa-wave",
+  "laserwave",
+  "material-theme",
+  "material-theme-darker",
+  "material-theme-ocean",
+  "material-theme-palenight",
+  "min-dark",
+  "monokai",
+  "night-owl",
+  "nord",
+  "one-dark-pro",
+  "plastic",
+  "poimandres",
+  "red",
+  "rose-pine",
+  "rose-pine-moon",
+  "slack-dark",
+  "solarized-dark",
+  "synthwave-84",
+  "tokyo-night",
+  "vesper",
+  "vitesse-black",
+  "vitesse-dark",
+])