completion-kit 0.5.3 → 0.5.4

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: f64415a327bca168f071390f5b44188e5fb3b7f66a9b92f5a0d6e03da1977454
-  data.tar.gz: a64a0446f6b6ee0d10e076e10405be75cb298377e8d4a45f921fe3ff8d2946d6
+  metadata.gz: eb708ad1732ab18fac5f415ad90f53374832bd8e629ab2f1530e860a2eca6c03
+  data.tar.gz: 3e159d8c80601f791a8b5e9fcabea66c1755dfb1635d268efa104a0a17bd9eb1
 SHA512:
-  metadata.gz: 02c394c4216d8fcefa8a585e4c0fdab80a64d63cd865664c24c99047065bb371dc9f4c490340c3da825331549fcbbee873b93547afc5b655e4138d938a39731c
-  data.tar.gz: d04afd98a0b25bfdc500b1826ec71dd3f055a106eec7528f4deff615c95c0ba3d76517320869e023739e7e43ff59f92ebaa754a3fc10446e42985dcb21124ae5
+  metadata.gz: 2d6bb436f79222b66d6f12bb0cb82642eb9e50c48704bbea76fb6b47c3c3b65f665363a905b4d8e57062445ad31bee44ba65c901de2a07d716d231fdef59e7df
+  data.tar.gz: ba8c62309efc2f19d343c6744b47e1db25c2a64e3597f19f957bdfd971dac6ee5118fd7f2017c573799f04a5423ac030627ff91ec9785d77822bc22a9ba7d27b

data/app/assets/stylesheets/completion_kit/application.css

@@ -494,10 +494,18 @@ tr:hover .ck-chip--publish {
   letter-spacing: 0.04em;
   text-transform: uppercase;
   line-height: 1;
+  white-space: nowrap;
   cursor: pointer;
   transition: all 0.15s ease;
 }
 
+.ck-magic-icon {
+  width: 1.1em;
+  height: 1.1em;
+  flex-shrink: 0;
+  color: var(--ck-warning);
+}
+
 .ck-button:hover {
   transform: translateY(-1px);
 }
@@ -3779,3 +3787,312 @@ a.tag-mark {
 .ck-tag-filter__clear:hover { color: var(--ck-accent); }
 
 
+/* --- Onboarding / launch checklist --- */
+@keyframes ck-launch-rise {
+  from { opacity: 0; transform: translateY(14px); }
+  to   { opacity: 1; transform: translateY(0); }
+}
+
+.ck-launch {
+  position: relative;
+  max-width: 720px;
+  margin: 1rem auto 4rem;
+  padding-top: 1rem;
+}
+
+.ck-launch__field {
+  position: absolute;
+  inset: -2rem -3rem auto -3rem;
+  height: 300px;
+  pointer-events: none;
+  z-index: 0;
+  background:
+    radial-gradient(ellipse 70% 80% at 50% 0%, var(--ck-accent-soft) 0%, transparent 65%),
+    repeating-linear-gradient(90deg, transparent 0 23px, rgba(148, 163, 184, 0.035) 23px 24px),
+    repeating-linear-gradient(0deg,  transparent 0 23px, rgba(148, 163, 184, 0.035) 23px 24px);
+  -webkit-mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
+          mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
+}
+
+.ck-launch__header {
+  position: relative;
+  z-index: 1;
+  text-align: center;
+  margin-bottom: 2.25rem;
+  animation: ck-launch-rise 0.5s ease both;
+}
+
+.ck-launch__overline {
+  margin: 0 0 0.6rem;
+  font-family: var(--ck-mono);
+  font-size: 0.72rem;
+  letter-spacing: 0.32em;
+  text-transform: uppercase;
+  color: var(--ck-accent);
+}
+
+.ck-launch__org {
+  margin: 0;
+  font-family: var(--ck-mono);
+  font-size: clamp(1.8rem, 4vw, 2.6rem);
+  font-weight: 600;
+  letter-spacing: -0.02em;
+  color: var(--ck-text);
+}
+
+.ck-launch__handle {
+  margin: 0.5rem 0 0;
+  font-family: var(--ck-mono);
+  font-size: 0.8rem;
+  letter-spacing: 0.04em;
+  color: var(--ck-muted);
+}
+
+.ck-launch__panel {
+  position: relative;
+  z-index: 1;
+  background: var(--ck-surface);
+  border: 1px solid var(--ck-line);
+  border-radius: var(--ck-radius-lg);
+  padding: 1.75rem 2rem 2rem;
+  box-shadow: 0 24px 64px -28px rgba(0, 0, 0, 0.5);
+  animation: ck-launch-rise 0.5s ease both;
+  animation-delay: 0.08s;
+}
+
+.ck-launch__progress {
+  padding-bottom: 1.5rem;
+  margin-bottom: 0.5rem;
+  border-bottom: 1px solid var(--ck-line);
+}
+.ck-launch__progress-head {
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+  gap: 1rem;
+  margin-bottom: 0.85rem;
+}
+.ck-launch__progress-title {
+  margin: 0;
+  font-family: var(--ck-mono);
+  font-size: 1.05rem;
+  font-weight: 600;
+  letter-spacing: -0.02em;
+  color: var(--ck-text);
+}
+.ck-launch__progress-count {
+  margin: 0;
+  font-family: var(--ck-mono);
+  font-size: 0.78rem;
+  letter-spacing: 0.02em;
+  color: var(--ck-muted);
+  white-space: nowrap;
+}
+.ck-launch__progress-bar {
+  height: 5px;
+  border-radius: 999px;
+  background: var(--ck-line);
+  overflow: hidden;
+}
+.ck-launch__progress-fill {
+  display: block;
+  height: 100%;
+  border-radius: 999px;
+  background: var(--ck-accent);
+  box-shadow: 0 0 10px var(--ck-accent-soft);
+  transition: width 0.4s ease;
+}
+
+.ck-launch__steps {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+}
+
+.ck-launch__step {
+  display: grid;
+  grid-template-columns: 2.4rem 1fr;
+  gap: 1rem;
+  align-items: baseline;
+  padding: 1.25rem 0 1.25rem 1rem;
+  border-top: 1px solid var(--ck-line);
+  border-left: 2px solid transparent;
+  animation: ck-launch-rise 0.45s ease both;
+  animation-delay: calc(0.24s + var(--i) * 0.07s);
+}
+
+.ck-launch__step-num {
+  font-family: var(--ck-mono);
+  font-size: 0.8rem;
+  font-weight: 600;
+  letter-spacing: 0.04em;
+  color: var(--ck-dim);
+  user-select: none;
+  white-space: nowrap;
+}
+.ck-launch__step--done .ck-launch__step-num { color: var(--ck-success); }
+.ck-launch__step--next .ck-launch__step-num { color: var(--ck-accent); }
+.ck-launch__step-tick { margin-left: 0.3em; font-size: 0.78em; }
+
+.ck-launch__step--done { border-left-color: rgba(45, 212, 168, 0.4); }
+
+.ck-launch__step-body { min-width: 0; }
+
+.ck-launch__step-head {
+  display: flex;
+  align-items: baseline;
+  gap: 0.7rem;
+  flex-wrap: wrap;
+  margin-bottom: 0.3rem;
+}
+
+.ck-launch__step-title {
+  margin: 0;
+  font-size: 1rem;
+  font-weight: 500;
+  letter-spacing: -0.005em;
+}
+.ck-launch__step-title a { color: var(--ck-text); text-decoration: none; }
+.ck-launch__step-title a:hover { color: var(--ck-accent); }
+.ck-launch__step--done .ck-launch__step-title { color: var(--ck-muted); }
+
+.ck-launch__step-tag {
+  font-family: var(--ck-mono);
+  font-size: 0.6rem;
+  letter-spacing: 0.18em;
+  text-transform: uppercase;
+  color: var(--ck-accent);
+  padding: 0.12rem 0.45rem;
+  border: 1px solid var(--ck-accent);
+  border-radius: 999px;
+  line-height: 1.4;
+}
+
+.ck-launch__step-desc {
+  margin: 0;
+  font-size: 0.9rem;
+  line-height: 1.55;
+  color: var(--ck-muted);
+}
+
+.ck-launch__step--pending .ck-launch__step-title,
+.ck-launch__step--pending .ck-launch__step-desc { opacity: 0.65; }
+
+.ck-launch__step--next {
+  border-left-color: var(--ck-accent);
+  background: linear-gradient(90deg, var(--ck-accent-soft) 0%, transparent 30%);
+  margin-left: -1rem;
+  padding-left: 2rem;
+  padding-right: 1rem;
+  border-radius: 0 var(--ck-radius) var(--ck-radius) 0;
+}
+
+.ck-launch__step-cta {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.4rem;
+  margin-top: 0.85rem;
+  padding: 0.5rem 0.95rem;
+  background: var(--ck-accent);
+  color: #06121a;
+  border-radius: var(--ck-radius);
+  font-family: var(--ck-mono);
+  font-size: 0.75rem;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+  font-weight: 600;
+  text-decoration: none;
+  transition: filter 0.15s, transform 0.15s;
+}
+.ck-launch__step-cta:hover { filter: brightness(1.1); transform: translateY(-1px); }
+
+.ck-launch__panel-footer {
+  margin-top: 1.75rem;
+  padding-top: 1.25rem;
+  border-top: 1px solid var(--ck-line);
+}
+.ck-launch__dismiss {
+  margin: 0;
+  padding: 0;
+  background: transparent;
+  border: none;
+  color: var(--ck-muted);
+  font-family: var(--ck-mono);
+  font-size: 0.78rem;
+  letter-spacing: 0.04em;
+  cursor: pointer;
+  text-decoration: underline;
+  text-underline-offset: 3px;
+  transition: color 0.15s;
+}
+.ck-launch__dismiss:hover { color: var(--ck-accent); }
+.ck-launch__dismiss-hint {
+  margin: 0.5rem 0 0;
+  font-size: 0.78rem;
+  color: var(--ck-dim);
+}
+
+.ck-launch__ready-panel {
+  position: relative;
+  z-index: 1;
+  background: var(--ck-surface);
+  border: 1px solid var(--ck-line);
+  border-radius: var(--ck-radius-lg);
+  padding: 2rem;
+  text-align: center;
+  animation: ck-launch-rise 0.5s ease both;
+  animation-delay: 0.08s;
+}
+
+.ck-launch__ready-flag {
+  margin: 0;
+  font-family: var(--ck-mono);
+  font-size: 0.85rem;
+  letter-spacing: 0.14em;
+  text-transform: uppercase;
+  color: var(--ck-success);
+  display: inline-flex;
+  align-items: center;
+  gap: 0.6rem;
+}
+.ck-launch__ready-dot {
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  background: var(--ck-success);
+  box-shadow: 0 0 12px var(--ck-success);
+}
+.ck-launch__ready-copy { margin: 0.6rem 0 1.5rem; color: var(--ck-muted); }
+
+.ck-launch__quicklinks {
+  display: flex;
+  gap: 0.6rem;
+  justify-content: center;
+  flex-wrap: wrap;
+}
+.ck-launch__quicklink {
+  padding: 0.5rem 0.95rem;
+  border: 1px solid var(--ck-line-strong);
+  border-radius: var(--ck-radius);
+  font-family: var(--ck-mono);
+  font-size: 0.75rem;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+  color: var(--ck-text);
+  text-decoration: none;
+  transition: border-color 0.15s, background 0.15s;
+}
+.ck-launch__quicklink:hover { border-color: var(--ck-accent); background: var(--ck-surface-hover); }
+
+@media (max-width: 560px) {
+  .ck-launch__panel { padding: 1.5rem 1.25rem; }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .ck-launch__header,
+  .ck-launch__panel,
+  .ck-launch__ready-panel,
+  .ck-launch__step { animation: none; }
+}

data/app/controllers/completion_kit/onboarding_controller.rb

@@ -0,0 +1,18 @@
+module CompletionKit
+  class OnboardingController < ApplicationController
+    DISMISS_COOKIE = :ck_onboarding_dismissed
+
+    def show
+      cookies.delete(DISMISS_COOKIE) if params[:reset]
+      @checklist = Onboarding::Checklist.new
+      return if params[:reset]
+
+      redirect_to prompts_path if @checklist.complete? || cookies[DISMISS_COOKIE]
+    end
+
+    def dismiss
+      cookies[DISMISS_COOKIE] = { value: "1", expires: 1.year.from_now, httponly: true }
+      redirect_to prompts_path, notice: "Setup skipped. Pick it back up from Settings → Getting started any time."
+    end
+  end
+end

data/app/services/completion_kit/onboarding/checklist.rb

@@ -0,0 +1,59 @@
+module CompletionKit
+  module Onboarding
+    Step = Data.define(:key, :title, :description, :path_name, :done?)
+
+    class Checklist
+      STEP_DEFS = [
+        {
+          key: :credential,
+          title: "Connect a provider",
+          description: "Add an API key for OpenAI, Anthropic, or another model provider so you can run prompts and score outputs.",
+          path_name: :new_provider_credential_path,
+          done: -> { CompletionKit::ProviderCredential.exists? }
+        },
+        {
+          key: :dataset,
+          title: "Upload a dataset",
+          description: "Drop in a CSV of test inputs. Column headers become the {{variables}} your prompts get evaluated against.",
+          path_name: :new_dataset_path,
+          done: -> { CompletionKit::Dataset.exists? }
+        },
+        {
+          key: :prompt,
+          title: "Write your first prompt",
+          description: "Create a versioned prompt template with {{variable}} placeholders. Publishing freezes it; editing makes a new version.",
+          path_name: :new_prompt_path,
+          done: -> { CompletionKit::Prompt.exists? }
+        },
+        {
+          key: :run,
+          title: "Run it",
+          description: "Kick off a run against the dataset and watch the responses come in, each scored by the LLM judge against your metrics.",
+          path_name: :runs_path,
+          done: -> { CompletionKit::Run.exists? }
+        }
+      ].freeze
+
+      def steps
+        @steps ||= STEP_DEFS.map do |d|
+          Step.new(
+            key: d[:key],
+            title: d[:title],
+            description: d[:description],
+            path_name: d[:path_name],
+            done?: d[:done].call
+          )
+        end
+      end
+
+      def complete?
+        steps.all?(&:done?)
+      end
+
+      def progress
+        done = steps.count(&:done?)
+        { done: done, total: steps.size, percent: ((done.to_f / steps.size) * 100).round }
+      end
+    end
+  end
+end

data/app/views/completion_kit/onboarding/show.html.erb

@@ -0,0 +1,80 @@
+<div class="ck-launch <%= "ck-launch--ready" if @checklist.complete? %>">
+  <div class="ck-launch__field" aria-hidden="true"></div>
+
+  <header class="ck-launch__header">
+    <p class="ck-launch__overline">Welcome to CompletionKit</p>
+    <h1 class="ck-launch__org">Your prompts need tests too</h1>
+    <p class="ck-launch__handle">Four steps from a fresh install to a scored test run.</p>
+  </header>
+
+  <% if @checklist.complete? %>
+    <section class="ck-launch__ready-panel">
+      <p class="ck-launch__ready-flag">
+        <span class="ck-launch__ready-dot" aria-hidden="true"></span>
+        You're all set up
+      </p>
+      <p class="ck-launch__ready-copy">Jump in wherever you like.</p>
+      <div class="ck-launch__quicklinks">
+        <%= link_to "Prompts",  prompts_path,  class: "ck-launch__quicklink" %>
+        <%= link_to "Datasets", datasets_path, class: "ck-launch__quicklink" %>
+        <%= link_to "Metrics",  metrics_path,  class: "ck-launch__quicklink" %>
+        <%= link_to "Runs",     runs_path,     class: "ck-launch__quicklink" %>
+      </div>
+    </section>
+  <% else %>
+    <% next_index = @checklist.steps.index { |s| !s.done? } %>
+    <% progress = @checklist.progress %>
+    <section class="ck-launch__panel">
+      <div class="ck-launch__progress">
+        <div class="ck-launch__progress-head">
+          <h2 class="ck-launch__progress-title">Finish setting up</h2>
+          <p class="ck-launch__progress-count"><%= progress[:done] %> of <%= progress[:total] %> done</p>
+        </div>
+        <div class="ck-launch__progress-bar" role="img" aria-label="<%= progress[:done] %> of <%= progress[:total] %> setup steps complete">
+          <span class="ck-launch__progress-fill" style="width: <%= progress[:percent] %>%"></span>
+        </div>
+      </div>
+
+      <ol class="ck-launch__steps">
+        <% @checklist.steps.each_with_index do |step, i| %>
+          <%
+            state = if step.done?
+                      "done"
+                    elsif i == next_index
+                      "next"
+                    else
+                      "pending"
+                    end
+            step_path = public_send(step.path_name)
+          %>
+          <li class="ck-launch__step ck-launch__step--<%= state %>" style="--i: <%= i %>">
+            <span class="ck-launch__step-num" aria-hidden="true"><%= format("%02d", i + 1) %><% if step.done? %><span class="ck-launch__step-tick">✓</span><% end %></span>
+            <div class="ck-launch__step-body">
+              <div class="ck-launch__step-head">
+                <h3 class="ck-launch__step-title">
+                  <% if step.done? %>
+                    <%= step.title %>
+                  <% else %>
+                    <%= link_to step.title, step_path %>
+                  <% end %>
+                </h3>
+                <% if state == "next" %><span class="ck-launch__step-tag">Next up</span><% end %>
+              </div>
+              <p class="ck-launch__step-desc"><%= step.description %></p>
+              <% if state == "next" %>
+                <%= link_to step_path, class: "ck-launch__step-cta" do %>Start <span aria-hidden="true">&rarr;</span><% end %>
+              <% end %>
+            </div>
+          </li>
+        <% end %>
+      </ol>
+
+      <div class="ck-launch__panel-footer">
+        <%= button_to dismiss_onboarding_path, method: :post, class: "ck-launch__dismiss", form: { style: "display:inline" } do %>
+          Skip setup &mdash; go to the app <span aria-hidden="true">&rarr;</span>
+        <% end %>
+        <p class="ck-launch__dismiss-hint">You can come back to this from <strong>Settings &rarr; Getting started</strong> any time.</p>
+      </div>
+    </section>
+  <% end %>
+</div>

data/app/views/completion_kit/prompts/show.html.erb

@@ -37,7 +37,7 @@
     <% judged_run = @runs.select { |r| r.prompt_id == @prompt.id && r.status == "completed" }.find { |r| r.responses.joins(:reviews).exists? } %>
     <% if judged_run %>
       <%= button_to suggest_run_path(judged_run), method: :post, class: ck_button_classes(:light, variant: :outline) + " ck-button--sm", form_class: "inline-block" do %>
-        <%= heroicon_tag "sparkles", variant: :outline, size: 14, "aria-hidden": "true" %>
+        <%= heroicon_tag "sparkles", variant: :outline, class: "ck-magic-icon", "aria-hidden": "true" %>
         Suggest improvements
       <% end %>
     <% else %>

data/app/views/completion_kit/runs/show.html.erb

@@ -67,7 +67,7 @@
       <%= link_to "View suggestion", suggestion_path(latest_suggestion, from: "run"), class: ck_button_classes(:light, variant: :outline) + " ck-button--sm" %>
     <% elsif @run.status == "completed" && @run.responses.joins(:reviews).exists? %>
       <%= button_to suggest_run_path(@run), method: :post, class: ck_button_classes(:light, variant: :outline) + " ck-button--sm", form_class: "inline-block" do %>
-        <%= heroicon_tag "sparkles", variant: :outline, size: 14, "aria-hidden": "true" %>
+        <%= heroicon_tag "sparkles", variant: :outline, class: "ck-magic-icon", "aria-hidden": "true" %>
         Suggest improvements
       <% end %>
     <% end %>

data/app/views/layouts/completion_kit/application.html.erb

@@ -23,7 +23,7 @@
         <%= link_to "Metrics", metrics_path, class: request.path.start_with?(metrics_path) || request.path.start_with?(metric_groups_path) ? ck_button_classes(:dark) : ck_button_classes(:light, variant: :outline) %>
         <%= link_to "Datasets", datasets_path, class: active.(datasets_path) %>
         <%= link_to "Runs", runs_path, class: active.(runs_path) %>
-        <% settings_active = request.path.start_with?(provider_credentials_path) || request.path.start_with?(tags_path) %>
+        <% settings_active = request.path.start_with?(provider_credentials_path) || request.path.start_with?(tags_path) || request.path.start_with?(onboarding_path) %>
         <details class="ck-settings-menu">
           <summary class="<%= settings_active ? ck_button_classes(:dark) : ck_button_classes(:light, variant: :outline) %> ck-settings-menu__trigger" aria-label="Settings">
             Settings
@@ -31,6 +31,7 @@
           <div class="ck-settings-menu__panel" role="menu">
             <%= link_to "Providers", provider_credentials_path, class: "ck-settings-menu__item" %>
             <%= link_to "Tags", tags_path, class: "ck-settings-menu__item" %>
+            <%= link_to "Getting started", onboarding_path(reset: 1), class: "ck-settings-menu__item" %>
           </div>
         </details>
         <%= link_to "API", api_reference_path, class: active.(api_reference_path) %>

data/config/routes.rb

@@ -1,5 +1,8 @@
 CompletionKit::Engine.routes.draw do
-  root to: "prompts#index"
+  root to: "onboarding#show"
+
+  get "onboarding", to: "onboarding#show", as: :onboarding
+  post "onboarding/dismiss", to: "onboarding#dismiss", as: :dismiss_onboarding
 
   resources :prompts do
     member do

data/lib/completion_kit/version.rb

@@ -1,3 +1,3 @@
 module CompletionKit
-  VERSION = "0.5.3"
+  VERSION = "0.5.4"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: completion-kit
 version: !ruby/object:Gem::Version
-  version: 0.5.3
+  version: 0.5.4
 platform: ruby
 authors:
 - Damien Bastin
@@ -245,6 +245,7 @@ files:
 - app/controllers/completion_kit/mcp_controller.rb
 - app/controllers/completion_kit/metric_groups_controller.rb
 - app/controllers/completion_kit/metrics_controller.rb
+- app/controllers/completion_kit/onboarding_controller.rb
 - app/controllers/completion_kit/prompts_controller.rb
 - app/controllers/completion_kit/provider_credentials_controller.rb
 - app/controllers/completion_kit/responses_controller.rb
@@ -292,6 +293,7 @@ files:
 - app/services/completion_kit/mcp_tools/tags.rb
 - app/services/completion_kit/model_discovery_service.rb
 - app/services/completion_kit/ollama_client.rb
+- app/services/completion_kit/onboarding/checklist.rb
 - app/services/completion_kit/open_ai_client.rb
 - app/services/completion_kit/open_router_client.rb
 - app/services/completion_kit/prompt_improvement_service.rb
@@ -314,6 +316,7 @@ files:
 - app/views/completion_kit/metrics/index.html.erb
 - app/views/completion_kit/metrics/new.html.erb
 - app/views/completion_kit/metrics/show.html.erb
+- app/views/completion_kit/onboarding/show.html.erb
 - app/views/completion_kit/prompts/_form.html.erb
 - app/views/completion_kit/prompts/edit.html.erb
 - app/views/completion_kit/prompts/index.html.erb