docyard 0.8.0 → 1.0.0

data/lib/docyard/server/sse_server.rb

@@ -0,0 +1,157 @@
+# frozen_string_literal: true
+
+require "socket"
+require "json"
+
+module Docyard
+  class SSEServer
+    HEARTBEAT_INTERVAL = 15
+    DEFAULT_PORT = 4201
+
+    def initialize(port: DEFAULT_PORT)
+      @port = port
+      @connections = []
+      @mutex = Mutex.new
+      @running = false
+      @server = nil
+      @accept_thread = nil
+      @heartbeat_thread = nil
+    end
+
+    attr_reader :port
+
+    def start
+      @running = true
+      @server = TCPServer.new("127.0.0.1", @port)
+      @server.setsockopt(Socket::SOL_SOCKET, Socket::SO_REUSEADDR, true)
+
+      start_accept_thread
+      start_heartbeat_thread
+    end
+
+    def stop
+      @running = false
+      close_server
+      @accept_thread&.kill
+      @heartbeat_thread&.kill
+      close_all_connections
+    end
+
+    def broadcast(event_type, data = {})
+      message = format_sse_message(event_type, data)
+      dead_connections = []
+
+      @mutex.synchronize do
+        @connections.each do |conn|
+          write_to_connection(conn, message) or dead_connections << conn
+        end
+
+        dead_connections.each { |conn| remove_connection_unsafe(conn) }
+      end
+    end
+
+    def connection_count
+      @mutex.synchronize { @connections.size }
+    end
+
+    private
+
+    def close_server
+      @server&.close
+    rescue StandardError
+      nil
+    end
+
+    def start_accept_thread
+      @accept_thread = Thread.new do
+        while @running
+          begin
+            client = @server.accept
+            Thread.new { handle_new_connection(client) }
+          rescue IOError, Errno::EBADF
+            break unless @running
+          end
+        end
+      end
+    end
+
+    def handle_new_connection(client)
+      request = read_http_request(client)
+      return close_client(client) unless valid_sse_request?(request)
+
+      send_sse_headers(client)
+      @mutex.synchronize { @connections << client }
+    rescue StandardError
+      close_client(client)
+    end
+
+    def close_client(client)
+      client.close
+    rescue StandardError
+      nil
+    end
+
+    def read_http_request(client)
+      lines = []
+      while (line = client.gets)
+        break if line.strip.empty?
+
+        lines << line
+      end
+      lines.join
+    end
+
+    def valid_sse_request?(request)
+      request.include?("GET /_docyard/events") || request.include?("GET / ")
+    end
+
+    def send_sse_headers(client)
+      headers = [
+        "HTTP/1.1 200 OK",
+        "Content-Type: text/event-stream",
+        "Cache-Control: no-cache",
+        "Connection: keep-alive",
+        "Access-Control-Allow-Origin: *",
+        "",
+        ""
+      ].join("\r\n")
+
+      client.write(headers)
+      client.write("retry: 1000\n\n")
+      client.flush
+    end
+
+    def start_heartbeat_thread
+      @heartbeat_thread = Thread.new do
+        while @running
+          sleep HEARTBEAT_INTERVAL
+          broadcast("heartbeat", { time: Time.now.to_i }) if @running
+        end
+      end
+    end
+
+    def write_to_connection(conn, message)
+      conn.write_nonblock(message)
+      true
+    rescue IO::WaitWritable, IOError, Errno::EPIPE, Errno::ECONNRESET, Errno::ETIMEDOUT
+      false
+    end
+
+    def format_sse_message(event_type, data)
+      json_data = data.to_json
+      "event: #{event_type}\ndata: #{json_data}\n\n"
+    end
+
+    def remove_connection_unsafe(conn)
+      @connections.delete(conn)
+      close_client(conn)
+    end
+
+    def close_all_connections
+      @mutex.synchronize do
+        @connections.each { |conn| close_client(conn) }
+        @connections.clear
+      end
+    end
+  end
+end

data/lib/docyard/server/static_file_app.rb

@@ -0,0 +1,42 @@
+# frozen_string_literal: true
+
+require "rack/mime"
+
+module Docyard
+  class StaticFileApp
+    def initialize(root)
+      @root = root
+    end
+
+    def call(env)
+      path = env["PATH_INFO"]
+      file_path = File.join(@root, path)
+
+      if path.end_with?("/") || File.directory?(file_path)
+        index_path = File.join(file_path, "index.html")
+        return serve_file(index_path) if File.file?(index_path)
+      elsif File.file?(file_path)
+        return serve_file(file_path)
+      end
+
+      serve_not_found
+    end
+
+    private
+
+    def serve_file(path)
+      content = File.read(path)
+      content_type = Rack::Mime.mime_type(File.extname(path), "application/octet-stream")
+      [200, { "content-type" => content_type }, [content]]
+    end
+
+    def serve_not_found
+      error_page = File.join(@root, "404.html")
+      if File.file?(error_page)
+        [404, { "content-type" => "text/html; charset=utf-8" }, [File.read(error_page)]]
+      else
+        [404, { "content-type" => "text/plain" }, ["Not Found"]]
+      end
+    end
+  end
+end

data/lib/docyard/templates/assets/css/components/abbreviation.css

@@ -0,0 +1,86 @@
+.docyard-abbr {
+  text-decoration: underline;
+  text-decoration-style: dotted;
+  text-decoration-color: var(--muted-foreground);
+  text-underline-offset: 3px;
+  cursor: help;
+  position: relative;
+}
+
+.docyard-abbr:hover {
+  text-decoration-color: var(--primary);
+}
+
+.docyard-abbr-popover {
+  position: absolute;
+  z-index: 1000;
+  width: max-content;
+  max-width: 280px;
+  padding: var(--spacing-3) var(--spacing-4);
+  background: var(--background);
+  border: 1px solid var(--border);
+  border-radius: var(--radius-lg);
+  box-shadow:
+    0 4px 6px -1px oklch(from var(--foreground) l c h / 8%),
+    0 2px 4px -2px oklch(from var(--foreground) l c h / 6%);
+  pointer-events: none;
+  opacity: 0;
+  transform: translateY(-4px) scale(0.96);
+  transition:
+    opacity 0.15s ease,
+    transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1);
+}
+
+.docyard-abbr-popover.is-visible {
+  opacity: 1;
+  transform: translateY(0) scale(1);
+}
+
+.docyard-abbr-popover::after {
+  content: "";
+  position: absolute;
+  bottom: -6px;
+  left: var(--arrow-left, 16px);
+  width: 10px;
+  height: 10px;
+  background: var(--background);
+  border-bottom: 1px solid var(--border);
+  border-right: 1px solid var(--border);
+  transform: rotate(45deg);
+}
+
+.docyard-abbr-popover.is-below::after {
+  top: -6px;
+  bottom: auto;
+  border-bottom: none;
+  border-right: none;
+  border-top: 1px solid var(--border);
+  border-left: 1px solid var(--border);
+}
+
+.docyard-abbr-popover__term {
+  display: block;
+  font-weight: var(--font-semibold);
+  font-size: var(--text-sm);
+  color: var(--foreground);
+  margin-bottom: var(--spacing-1);
+}
+
+.docyard-abbr-popover__definition {
+  display: block;
+  font-size: var(--text-sm);
+  color: var(--muted-foreground);
+  line-height: var(--leading-relaxed);
+}
+
+@media (max-width: 640px) {
+  .docyard-abbr-popover {
+    max-width: 240px;
+    padding: var(--spacing-2) var(--spacing-3);
+  }
+
+  .docyard-abbr-popover__term,
+  .docyard-abbr-popover__definition {
+    font-size: var(--text-xs);
+  }
+}

data/lib/docyard/templates/assets/css/components/accordion.css

@@ -0,0 +1,138 @@
+.docyard-accordion {
+  margin: var(--spacing-4) 0;
+  border: 1px solid var(--border);
+  border-radius: var(--radius-xl);
+  background-color: var(--card);
+}
+
+.docyard-accordion__summary {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-3);
+  padding: var(--spacing-3) var(--spacing-4);
+  cursor: pointer;
+  user-select: none;
+  font-weight: var(--font-medium);
+  font-size: var(--text-sm);
+  color: var(--foreground);
+  list-style: none;
+  transition: background-color var(--transition-fast);
+  border-radius: var(--radius-xl);
+}
+
+.docyard-accordion__summary::-webkit-details-marker {
+  display: none;
+}
+
+.docyard-accordion__summary::marker {
+  display: none;
+  content: "";
+}
+
+.docyard-accordion__summary:hover {
+  background-color: var(--accent);
+}
+
+.docyard-accordion__summary:focus-visible {
+  outline: 2px solid var(--ring);
+  outline-offset: -2px;
+}
+
+.docyard-accordion[open] .docyard-accordion__summary {
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0;
+}
+
+.docyard-accordion__icon {
+  flex-shrink: 0;
+  width: 1rem;
+  height: 1rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--muted-foreground);
+  transition: transform var(--transition-fast);
+}
+
+.docyard-accordion__icon svg {
+  width: 100%;
+  height: 100%;
+}
+
+.docyard-accordion[open] .docyard-accordion__icon {
+  transform: rotate(90deg);
+}
+
+.docyard-accordion__title {
+  flex: 1;
+}
+
+.docyard-accordion__content {
+  padding: var(--spacing-4);
+  font-size: var(--text-sm);
+  color: var(--foreground);
+  line-height: var(--leading-relaxed);
+  border-top: 1px solid var(--border);
+}
+
+.docyard-accordion__content > *:first-child {
+  margin-top: 0;
+}
+
+.docyard-accordion__content > *:last-child {
+  margin-bottom: 0;
+}
+
+.docyard-accordion__content a {
+  color: var(--primary);
+  text-decoration: underline;
+  text-underline-offset: 3px;
+}
+
+.docyard-accordion__content a:hover {
+  color: var(--foreground);
+}
+
+.docyard-accordion__content pre {
+  margin: var(--spacing-4) 0;
+  border-radius: var(--radius-lg);
+}
+
+.docyard-accordion__content :not(pre) > code {
+  background-color: var(--muted);
+  padding: 0.125rem 0.375rem;
+  border-radius: var(--radius-sm);
+  font-size: 0.875em;
+}
+
+.docyard-accordion + .docyard-accordion {
+  margin-top: -1px;
+  border-top-left-radius: 0;
+  border-top-right-radius: 0;
+}
+
+.docyard-accordion + .docyard-accordion .docyard-accordion__summary {
+  border-top-left-radius: 0;
+  border-top-right-radius: 0;
+}
+
+.docyard-accordion:has(+ .docyard-accordion) {
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0;
+  margin-bottom: 0;
+}
+
+.docyard-accordion:has(+ .docyard-accordion) .docyard-accordion__summary {
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .docyard-accordion__icon {
+    transition: none;
+  }
+
+  .docyard-accordion__summary {
+    transition: none;
+  }
+}

data/lib/docyard/templates/assets/css/components/badges.css

@@ -0,0 +1,47 @@
+.docyard-badge {
+  display: inline-flex;
+  align-items: center;
+  padding: 0.125rem 0.5rem;
+  font-size: var(--text-xs);
+  font-weight: var(--font-medium);
+  line-height: var(--leading-normal);
+  border-radius: var(--radius-4xl);
+  white-space: nowrap;
+  vertical-align: middle;
+}
+
+.docyard-badge--default {
+  background-color: var(--muted);
+  color: var(--muted-foreground);
+}
+
+.docyard-badge--success {
+  background-color: var(--callout-tip-background);
+  color: var(--callout-tip-foreground);
+  border: 1px solid var(--callout-tip-border);
+}
+
+.docyard-badge--warning {
+  background-color: var(--callout-warning-background);
+  color: var(--callout-warning-foreground);
+  border: 1px solid var(--callout-warning-border);
+}
+
+.docyard-badge--danger {
+  background-color: var(--callout-danger-background);
+  color: var(--callout-danger-foreground);
+  border: 1px solid var(--callout-danger-border);
+}
+
+h1 .docyard-badge,
+h2 .docyard-badge,
+h3 .docyard-badge,
+h4 .docyard-badge,
+h5 .docyard-badge,
+h6 .docyard-badge {
+  margin-left: var(--spacing-2);
+  font-size: var(--text-xs);
+  vertical-align: middle;
+  position: relative;
+  top: -0.1em;
+}

data/lib/docyard/templates/assets/css/components/banner.css

@@ -0,0 +1,233 @@
+.docyard-announcement {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0.4rem 3rem;
+  background: linear-gradient(135deg, oklch(0.68 0.13 215) 0%, var(--primary) 15%, var(--primary) 85%, oklch(0.52 0.10 225) 100%);
+  color: white;
+  font-size: var(--text-sm);
+  z-index: 9999;
+}
+
+.docyard-announcement.is-dismissed {
+  animation: docyard-announcement-exit 0.35s cubic-bezier(0.4, 0, 1, 1) forwards;
+}
+
+@keyframes docyard-announcement-exit {
+  from {
+    transform: translateY(0);
+    opacity: 1;
+  }
+  to {
+    transform: translateY(-100%);
+    opacity: 0;
+  }
+}
+
+body.has-announcement {
+  --announcement-height: 2rem;
+}
+
+body.has-announcement .header {
+  top: var(--announcement-height);
+}
+
+body.has-announcement .tab-bar {
+  top: calc(var(--header-height) + var(--announcement-height));
+}
+
+body.has-announcement .sidebar {
+  top: calc(var(--header-height) + var(--tab-bar-height) + var(--announcement-height));
+  height: calc(100vh - var(--header-height) - var(--tab-bar-height) - var(--announcement-height));
+}
+
+body.has-announcement .doc-aside {
+  top: calc(var(--header-height) + var(--tab-bar-height) + var(--announcement-height));
+}
+
+body.has-announcement .secondary-header {
+  top: calc(var(--header-height) + var(--tab-bar-height) + var(--announcement-height));
+}
+
+body.has-announcement:not(.has-tabs) .secondary-header {
+  top: calc(var(--header-height) + var(--announcement-height));
+}
+
+body.has-announcement .layout {
+  padding-top: calc(var(--header-height) + var(--tab-bar-height) + var(--announcement-height));
+}
+
+body.has-announcement:not(.has-tabs) .sidebar {
+  top: calc(var(--header-height) + var(--announcement-height));
+  height: calc(100vh - var(--header-height) - var(--announcement-height));
+}
+
+body.has-announcement:not(.has-tabs) .doc-aside {
+  top: calc(var(--header-height) + var(--announcement-height));
+}
+
+body.has-announcement:not(.has-tabs) .layout {
+  padding-top: calc(var(--header-height) + var(--announcement-height));
+}
+
+@media (max-width: 1280px) and (min-width: 1025px) {
+  body.has-announcement .layout {
+    padding-top: calc(var(--header-height) + var(--tab-bar-height) + var(--announcement-height) + 3rem);
+  }
+
+  body.has-announcement:not(.has-tabs) .layout {
+    padding-top: calc(var(--header-height) + var(--announcement-height) + 3rem);
+  }
+}
+
+/* Mobile: tab bar is hidden, so don't include tab-bar-height */
+@media (max-width: 1024px) {
+  body.has-announcement .secondary-header {
+    top: calc(var(--header-height) + var(--announcement-height));
+  }
+
+  body.has-announcement .layout {
+    padding-top: calc(var(--header-height) + var(--announcement-height) + 3rem);
+  }
+
+  body.has-announcement .sidebar {
+    top: 0;
+    height: 100vh;
+    height: 100dvh;
+  }
+}
+
+.docyard-announcement__content {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 0.75rem;
+  min-width: 0;
+  overflow: hidden;
+}
+
+.docyard-announcement__text {
+  font-weight: 500;
+  letter-spacing: -0.01em;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.docyard-announcement__link {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.375rem;
+  color: white;
+  text-decoration: none;
+  min-width: 0;
+  transition: gap 0.2s cubic-bezier(0.16, 1, 0.3, 1);
+}
+
+.docyard-announcement__link:hover {
+  gap: 0.5rem;
+  color: white;
+}
+
+.docyard-announcement__link .icon {
+  width: 1rem;
+  height: 1rem;
+  flex-shrink: 0;
+  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
+}
+
+.docyard-announcement__link:hover .icon {
+  transform: translateX(2px);
+}
+
+.docyard-announcement[data-has-button="true"] .docyard-announcement__link .icon {
+  display: none;
+}
+
+.docyard-announcement__button {
+  display: inline-flex;
+  align-items: center;
+  flex-shrink: 0;
+  padding: 0.175rem 0.625rem;
+  background: rgba(255, 255, 255, 0.15);
+  border: 1px solid rgba(255, 255, 255, 0.25);
+  border-radius: 9999px;
+  color: white;
+  font-size: var(--text-xs);
+  font-weight: 600;
+  text-decoration: none;
+  backdrop-filter: blur(4px);
+  transition:
+    transform 0.5s cubic-bezier(0.16, 1, 0.3, 1),
+    background 0.2s cubic-bezier(0.16, 1, 0.3, 1),
+    border-color 0.2s cubic-bezier(0.16, 1, 0.3, 1);
+}
+
+.docyard-announcement__button:hover {
+  background: rgba(255, 255, 255, 0.25);
+  border-color: rgba(255, 255, 255, 0.4);
+  color: white;
+}
+
+.docyard-announcement__button:active {
+  transform: scale(0.95);
+  transition: transform 0.1s cubic-bezier(0.4, 0, 1, 1);
+}
+
+.docyard-announcement__dismiss {
+  position: absolute;
+  right: 0.75rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 1.5rem;
+  height: 1.5rem;
+  padding: 0;
+  background: transparent;
+  border: none;
+  border-radius: var(--radius-4xl);
+  color: white;
+  cursor: pointer;
+  transition: background-color var(--transition-fast), color var(--transition-fast);
+}
+
+.docyard-announcement__dismiss:hover {
+  color: white;
+  background-color: rgba(255, 255, 255, 0.15);
+}
+
+.docyard-announcement__dismiss .icon {
+  width: 0.875rem;
+  height: 0.875rem;
+}
+
+@media (max-width: 768px) {
+  .docyard-announcement {
+    padding: 0.4rem 2.5rem;
+    font-size: var(--text-xs);
+  }
+
+  .docyard-announcement__content {
+    gap: 0.5rem;
+  }
+
+  .docyard-announcement[data-has-button="true"] .docyard-announcement__link .icon {
+    display: inline-flex;
+  }
+
+  .docyard-announcement__button {
+    display: none;
+  }
+
+  .docyard-announcement__dismiss {
+    right: 0.5rem;
+  }
+}
+
+.dark .docyard-announcement {
+  background: linear-gradient(135deg, oklch(0.78 0.14 210) 0%, var(--primary) 15%, var(--primary) 85%, oklch(0.58 0.11 225) 100%);
+}

data/lib/docyard/templates/assets/css/components/breadcrumbs.css

@@ -40,7 +40,8 @@
   box-shadow: 0 0 0 var(--ring-width) oklch(from var(--ring) l c h / 50%);
 }
 
-.breadcrumb-toggle .docyard-icon {
+.breadcrumb-toggle .docyard-icon,
+.breadcrumb-toggle i[class*="ph-"] {
   width: 18px;
   height: 18px;
 }