Merge pull request #13 from jimeh/redesign

This commit is contained in:
2026-01-13 09:52:28 +00:00
committed by GitHub
74 changed files with 6611 additions and 2450 deletions

View File

@@ -1,11 +1,22 @@
{
"permissions": {
"allow": [
"Bash(cat:*)",
"Bash(git add:*)",
"Bash(git commit:*)",
"Bash(git diff:*)",
"Bash(ls:*)",
"Bash(npm install:*)",
"Bash(npm run astro:*)",
"Bash(npm run build:*)",
"Bash(npm run update:*)",
"Bash(npm run check:*)",
"Bash(npm run dev:*)",
"Bash(npm run format:*)",
"Bash(npm run format:check:*)",
"Bash(npm run lint:*)",
"Bash(npm run preview:*)",
"Bash(npm run update-specs:*)",
"mcp__deepwiki__ask_question"
]
}
}

3
.gitignore vendored
View File

@@ -2,6 +2,9 @@
dist/
.astro/
# Claude
.claude/settings.local.json
# Node
node_modules/

5
.prettierignore Normal file
View File

@@ -0,0 +1,5 @@
.astro/
dist/
node_modules/
package-lock.json
src/content/spec/

View File

@@ -12,45 +12,81 @@ that combines GitHub Flow with versioned releases.
## Build Commands
```bash
# Install tooling (node) via mise
mise install
# Install dependencies
npm install
# Development server
npm run dev
# Build site (outputs to docs/ directory)
# Build site (outputs to dist/ directory)
npm run build
# Preview built site
npm run preview
# Type checking
npm run check
# Linting
npm run lint
# Formatting
npm run format
npm run format:check
# Update specs from upstream (fetches from github.com/jimeh/common-flow)
npm run update
npm run update-specs
```
The site is built to `docs/` for GitHub Pages hosting.
The site is built to `dist/` and deployed to Cloudflare Workers.
## Architecture
- **Astro 5.x** static site generator
- **Tailwind CSS 4.x** for styling with dark mode support
- **astro-icon** with Heroicons and Simple Icons for icons
- **Content Collections** for spec markdown files
- **TypeScript** throughout
- **Node.js** as JavaScript runtime (managed via mise)
### Key Files
- `src/config.ts` - Site configuration with version list
- `src/config.ts` - Site configuration (metadata, update settings)
- `src/content.config.ts` - Astro content collection definition
- `src/layouts/Default.astro` - Main layout with sidebar
- `src/components/` - Sidebar, MenuToggle, ThemeToggle components
- `src/styles/global.css` - Global Tailwind styles
- `src/layouts/BaseLayout.astro` - Base layout with head, meta tags, theme scripts
- `src/layouts/SpecLayout.astro` - Spec page layout composing all sections
- `src/components/` - UI components:
- `Header.astro` - Site header with navigation
- `Footer.astro` - Site footer
- `Hero.astro` - Landing page hero section
- `AboutSection.astro` - About Common-Flow section
- `FAQSection.astro` - FAQ section
- `SectionHeader.astro` - Reusable section header (title + subtitle)
- `SpecSection.astro` - Spec section with terminology and specification
- `SpecSidebar.astro` - Spec page table of contents sidebar
- `TocLink.astro` - Reusable TOC link component
- `ThemeToggle.astro` - Dark/light mode toggle
- `VersionSelector.astro` - Spec version dropdown
- `src/scripts/` - Client-side TypeScript:
- `activeSectionTracker.ts` - Scroll-based active section tracking
- `clauseHighlight.ts` - Clause highlight on anchor navigation
- `src/pages/index.astro` - Landing page
- `src/pages/404.astro` - 404 error page
- `src/pages/spec/[version].astro` - Dynamic route for spec versions
- `src/pages/spec/[version]/raw.astro` - Raw markdown spec page
- `src/utils/` - Utility functions:
- `parseSpecContent.ts` - Markdown parsing utilities
- `versions.ts` - Version info helper (derives current version from specs)
- `src/content/spec/*.md` - Versioned spec documents
- `public/spec/*.svg` - SVG diagrams for each version
- `scripts/update-specs.ts` - Fetches specs from GitHub
- `wrangler.jsonc` - Cloudflare Workers deployment config
### Updating Spec Versions
1. Add new version to `versions` array in `src/config.ts`
2. Update `currentVersion` if this is the new default
3. Run `npm run update` to fetch specs from GitHub
4. Run `npm run build` to rebuild the site
1. Run `npm run update-specs` to fetch specs from GitHub
2. Run `npm run build` to rebuild the site

View File

@@ -1,11 +1,12 @@
import { defineConfig } from "astro/config";
import tailwindcss from "@tailwindcss/vite";
import sitemap from "@astrojs/sitemap";
import icon from "astro-icon";
export default defineConfig({
site: "https://commonflow.org",
outDir: "./docs",
integrations: [sitemap()],
outDir: "./dist",
integrations: [sitemap(), icon()],
vite: {
plugins: [tailwindcss()],
},

View File

View File

@@ -1,15 +0,0 @@
<!DOCTYPE html><html lang="en" data-astro-cid-jwirc66j> <head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="canonical" href="https://commonflow.org/404/"><title>Page Not Found | Git Common Flow</title><meta name="description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><meta name="author" content="Jim Myhrberg"><!-- Open Graph --><meta property="og:title" content="Page Not Found | Git Common Flow"><meta property="og:description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><meta property="og:type" content="website"><meta property="og:url" content="https://commonflow.org/404/"><!-- Twitter --><meta name="twitter:card" content="summary"><meta name="twitter:title" content="Page Not Found | Git Common Flow"><meta name="twitter:description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><!-- Fonts --><link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@300;700&family=Open+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet"><link rel="stylesheet" href="/_astro/index.BMC0NJ9O.css">
<style>.not-found[data-astro-cid-zetdm5md]{text-align:center;padding-top:4rem}.not-found[data-astro-cid-zetdm5md] h1[data-astro-cid-zetdm5md]{font-size:6rem;margin-bottom:.5rem;color:#999}.dark[data-astro-cid-zetdm5md] .not-found[data-astro-cid-zetdm5md] h1[data-astro-cid-zetdm5md]{color:#666}.not-found[data-astro-cid-zetdm5md] p[data-astro-cid-zetdm5md]{font-size:1.25rem;margin-bottom:1rem}.not-found[data-astro-cid-zetdm5md] a[data-astro-cid-zetdm5md]{color:#1f8dd6;text-decoration:none}.not-found[data-astro-cid-zetdm5md] a[data-astro-cid-zetdm5md]:hover{text-decoration:underline}.dark[data-astro-cid-zetdm5md] .not-found[data-astro-cid-zetdm5md] a[data-astro-cid-zetdm5md]{color:#4da6e8}
</style></head> <body data-astro-cid-jwirc66j> <div id="layout" data-astro-cid-jwirc66j> <a href="#menu" id="menuLink" class="menu-link" data-astro-cid-jyixok4n> <span data-astro-cid-jyixok4n></span> </a> <script type="module">function c(){const e=document.getElementById("layout"),n=document.getElementById("menu"),t=document.getElementById("menuLink"),s=document.getElementById("main");function i(o){o.preventDefault(),e?.classList.toggle("active"),n?.classList.toggle("active"),t?.classList.toggle("active")}function a(){e?.classList.remove("active"),n?.classList.remove("active"),t?.classList.remove("active")}t?.addEventListener("click",i),s?.addEventListener("click",()=>{e?.classList.contains("active")&&a()})}c();document.addEventListener("astro:after-swap",c);</script> <div id="menu" data-astro-cid-ssfzsv2f> <div class="menu-inner" data-astro-cid-ssfzsv2f> <ul class="menu-list" data-astro-cid-ssfzsv2f> <li class="menu-label" data-astro-cid-ssfzsv2f>Versions:</li> <li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.5" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.5 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.4" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.4 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.3" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.3 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.2" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.2 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.1" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.1 </a> </li> </ul> </div> <div class="links" data-astro-cid-ssfzsv2f> <a href="https://github.com/jimeh/common-flow" aria-label="View on GitHub" class="github-link" data-astro-cid-ssfzsv2f> <svg class="w-12 h-12" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true" data-astro-cid-ssfzsv2f> <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839
9.504.5.092.682-.217.682-.483
0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608
1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088
2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951
0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65
0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004
1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546
1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028
2.688 0 3.848-2.339 4.695-4.566
4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012
2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22
6.484 17.522 2 12 2z" clip-rule="evenodd" data-astro-cid-ssfzsv2f></path> </svg> </a> </div> </div> <div id="main" data-astro-cid-jwirc66j> <div class="content" data-astro-cid-jwirc66j> <div class="not-found" data-astro-cid-zetdm5md> <h1 data-astro-cid-zetdm5md>404</h1> <p data-astro-cid-zetdm5md>Page not found.</p> <p data-astro-cid-zetdm5md> <a href="/" data-astro-cid-zetdm5md>Go to the homepage</a> </p> </div> </div> </div> </div> </body></html>

File diff suppressed because one or more lines are too long

View File

@@ -1,370 +0,0 @@
<!DOCTYPE html><html lang="en" data-astro-cid-jwirc66j> <head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="canonical" href="https://commonflow.org/"><title>Git Common-Flow 1.0.0-rc.5 | Git Common Flow</title><meta name="description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><meta name="author" content="Jim Myhrberg"><!-- Open Graph --><meta property="og:title" content="Git Common-Flow 1.0.0-rc.5 | Git Common Flow"><meta property="og:description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><meta property="og:type" content="website"><meta property="og:url" content="https://commonflow.org/"><!-- Twitter --><meta name="twitter:card" content="summary"><meta name="twitter:title" content="Git Common-Flow 1.0.0-rc.5 | Git Common Flow"><meta name="twitter:description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><!-- Fonts --><link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@300;700&family=Open+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet"><link rel="stylesheet" href="/_astro/index.BMC0NJ9O.css"></head> <body data-astro-cid-jwirc66j> <div id="layout" data-astro-cid-jwirc66j> <a href="#menu" id="menuLink" class="menu-link" data-astro-cid-jyixok4n> <span data-astro-cid-jyixok4n></span> </a> <script type="module">function c(){const e=document.getElementById("layout"),n=document.getElementById("menu"),t=document.getElementById("menuLink"),s=document.getElementById("main");function i(o){o.preventDefault(),e?.classList.toggle("active"),n?.classList.toggle("active"),t?.classList.toggle("active")}function a(){e?.classList.remove("active"),n?.classList.remove("active"),t?.classList.remove("active")}t?.addEventListener("click",i),s?.addEventListener("click",()=>{e?.classList.contains("active")&&a()})}c();document.addEventListener("astro:after-swap",c);</script> <div id="menu" data-astro-cid-ssfzsv2f> <div class="menu-inner" data-astro-cid-ssfzsv2f> <ul class="menu-list" data-astro-cid-ssfzsv2f> <li class="menu-label" data-astro-cid-ssfzsv2f>Versions:</li> <li class="menu-item selected" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.5" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.5 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.4" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.4 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.3" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.3 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.2" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.2 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.1" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.1 </a> </li> </ul> </div> <div class="links" data-astro-cid-ssfzsv2f> <a href="https://github.com/jimeh/common-flow" aria-label="View on GitHub" class="github-link" data-astro-cid-ssfzsv2f> <svg class="w-12 h-12" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true" data-astro-cid-ssfzsv2f> <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839
9.504.5.092.682-.217.682-.483
0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608
1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088
2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951
0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65
0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004
1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546
1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028
2.688 0 3.848-2.339 4.695-4.566
4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012
2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22
6.484 17.522 2 12 2z" clip-rule="evenodd" data-astro-cid-ssfzsv2f></path> </svg> </a> </div> </div> <div id="main" data-astro-cid-jwirc66j> <div class="content" data-astro-cid-jwirc66j> <article class="spec-content"> <h1 id="git-common-flow-100-rc5">Git Common-Flow 1.0.0-rc.5</h1>
<img src="/spec/1.0.0-rc.5.svg" alt="Git Common-Flow 1.0.0-rc.5 diagram" width="100%">
<h2 id="introduction">Introduction</h2>
<p>Common-Flow is an attempt to gather a sensible selection of the most common
usage patterns of git into a single and concise specification. It is based on
the <a href="http://scottchacon.com/2011/08/31/github-flow.html">original variant</a>
of <a href="https://guides.github.com/introduction/flow/">GitHub Flow</a>, while taking
into account how a lot of open source projects most commonly use git.</p>
<p>In short, Common-Flow is essentially GitHub Flow with the addition of versioned
releases, optional release branches, and without the requirement to deploy to
production all the time.</p>
<h2 id="summary">Summary</h2>
<ul>
<li>The “master” branch is the mainline branch with latest changes, and must not
be broken.</li>
<li>Changes (features, bugfixes, etc.) are done on “change branches” created from
the master branch.</li>
<li>Rebase change branches <a href="https://i.imgur.com/1RS8x2d.png">early and often</a>.</li>
<li>When a change branch is stable and ready, it is merged back in to master.</li>
<li>A release is just a git tag whos name is the exact release version string
(e.g. “2.11.4”).</li>
<li>Release branches can be used to avoid change freezes on master. They are not
required, instead they are available if you need them.</li>
</ul>
<h2 id="terminology">Terminology</h2>
<ul>
<li><strong>Master Branch</strong> - Must be named “master”, must always have passing tests,
and is not guaranteed to always work in production environments.</li>
<li><strong>Change Branches</strong> - Any branch that introduces changes like a new feature, a
bug fix, etc.</li>
<li><strong>Source Branch</strong> - The branch that a change branch was created from. New
changes in the source branch should be incorporated into the change branch via
rebasing.</li>
<li><strong>Merge Target</strong> - A branch that is the intended merge target for a change
branch. Typically the merge target branch will be the same as the source
branch.</li>
<li><strong>Pull Request</strong> - A means of requesting that a change branch is merged in to
its merge target, allowing others to review, discuss and approve the changes.</li>
<li><strong>Release</strong> - May be considered safe to use in production environments. Is
effectively just a git tag named after the version of the release.</li>
<li><strong>Release Branches</strong> - Used both for short-term preparations of a release, and
also for long-term maintenance of older version.</li>
</ul>
<h2 id="git-common-flow-specification-common-flow">Git Common-Flow Specification (Common-Flow)</h2>
<p>The key words “MUST”, “MUST NOT”, “REQUIRED”, “SHALL”, “SHALL NOT”, “SHOULD”,
“SHOULD NOT”, “RECOMMENDED”, “MAY”, and “OPTIONAL” in this document are to be
interpreted as described in <a href="https://tools.ietf.org/html/rfc2119">RFC 2119</a>.</p>
<ol>
<li>TL;DR
<ol>
<li>Do not break the master branch.</li>
<li>A release is a git tag.</li>
</ol>
</li>
<li>The Master Branch
<ol>
<li>A branch named “master” MUST exist and it MUST be referred to as the
“master branch”.</li>
<li>The master branch MUST always be in a non-broken state with its test
suite passing.</li>
<li>The master branch IS NOT guaranteed to always work in production
environments. Despite test suites passing it may at times contain
unfinished work. Only releases may be considered safe for production use.</li>
<li>The master branch SHOULD always be in a “as near as possibly ready for
release/production” state to reduce any friction with creating a new
release.</li>
</ol>
</li>
<li>Change Branches
<ol>
<li>Each change (feature, bugfix, etc.) MUST be performed on separate
branches that SHOULD be referred to as “change branches”.</li>
<li>All change branches MUST have descriptive names.</li>
<li>It is RECOMMENDED that you commit often locally, and that you try and
keep the commits reasonably structured to avoid a messy and confusing git
history.</li>
<li>You SHOULD regularly push your work to the same named branch on the
remote server.</li>
<li>You SHOULD create separate change branches for each distinctly different
change. You SHOULD NOT include multiple unrelated changes into a single
change branch.</li>
<li>When a change branch is created, the branch that it is created from
SHOULD be referred to as the “source branch”. Each change branch also
needs a designated “merge target” branch, typically this will be the same
as the source branch.</li>
<li>Change branches MUST be regularly updated with any changes from their
source branch. This MUST be done by rebasing the change branch on top of
the source branch.</li>
<li>After updating a change branch from its source branch you MUST push the
change branch to the remote server. Due to the nature of rebasing, you
will be required to do a force push, and you MUST use the
“—force-with-lease” git push option when doing so instead of the regular
“—force”.</li>
<li>If there is a truly valid technical reason to not use rebase when
updating change branches, then you can update change branches via merge
instead of rebase. The decision to use merge MUST only be taken after all
possible options to use rebase have been tried and failed. People not
understanding how to use rebase is NOT a valid reason to use merge. If
you do decide to use merge instead of rebase, you MUST NOT use a mixture
of both methods, pick one and stick to it.</li>
</ol>
</li>
<li>Pull Requests
<ol>
<li>To merge a change branch into its merge target, you MUST open a “pull
request” (or equivalent).</li>
<li>The purpose of a pull request is to allow others to review your changes
and give feedback. You can then fix any issues, complaints, and more that
might arise, and then let people review again.</li>
<li>Before creating a pull request, it is RECOMMENDED that you consider the
state of your change branchs commit history. If it is messy and
confusing, it might be a good idea to rebase your branch with “git rebase
-i” to present a cleaner and easier to follow commit history for your
reviewers.</li>
<li>A pull request MUST only be merged when the change branch is up-to-date
with its source branch, the test suite is passing, and you and others are
happy with the change. This is especially important if the merge target
is the master branch.</li>
<li>To get feedback, help, or generally just discuss a change branch with
others, it is RECOMMENDED you create a pull request and discuss the
changes with others there. This leaves a clear and visible history of
how, when, and why the code looks and behaves the way it does.</li>
</ol>
</li>
<li>Versioning
<ol>
<li>A “version string” is a typically mostly numeric string that identifies a
specific version of a project. The version string itself MUST NOT have a
“v” prefix, but the version string can be displayed with a “v” prefix to
indicate it is a version that is being referred to.</li>
<li>The source of truth for a projects version MUST be a git tag with a name
based on the version string. This kind of tag MUST be referred to as a
“release tag”.</li>
<li>It is OPTIONAL, but RECOMMENDED to also keep the version string
hard-coded somewhere in the project code-base.</li>
<li>If you hard-code the version string into the code-base, it is RECOMMENDED
that you do so in a file called “VERSION” located in the root of the
project. But be mindful of the conventions of your programming language
and community when choosing if, where and how to hard-code the version
string.</li>
<li>If you are using a “VERSION” file in the root of the project, this file
MUST only contain the exact version string, meaning it MUST NOT have a
“v” prefix. For example “v2.11.4” is bad, and “2.11.4” is good.</li>
<li>It is OPTIONAL, but RECOMMENDED that that the version string follows
Semantic Versioning (<a href="http://semver.org/">http://semver.org/</a>).</li>
</ol>
</li>
<li>Releases
<ol>
<li>To create a new release, you MUST create a git tag named as the exact
version string of the release. This kind of tag MUST be referred to as a
“release tag”.</li>
<li>The release tag name can OPTIONALLY be prefixed with “v”. For example the
tag name can be either “2.11.4” or “v2.11.4”. It is however RECOMMENDED
that you do not use a “v” prefix. You MUST NOT use a mixture of “v”
prefixed and non-prefixed tags. Pick one form and stick to it.</li>
<li>If the version string is hard-coded into the code-base, you MUST create a
“version bump” commit which changes the hard-coded version string of the
project.</li>
<li>When using version bump commits, the release tag MUST be placed on the
version bump commit.</li>
<li>If you are not using a release branch, then the release tag, and if
relevant the version bump commit, MUST be created directly on the master
branch.</li>
<li>The version bump commit SHOULD have a commit message title of “Bump
version to VERSION”. For example, if the new version string is “2.11.4”,
the first line of the commit message SHOULD read: “Bump version to
2.11.4”</li>
<li>It is RECOMMENDED that release tags are lightweight tags, but you can
OPTIONALLY use annotated tags if you want to include changelog
information in the release tag itself.</li>
<li>If you use annotated release tags, the first line of the annotation
SHOULD read “Release VERSION”. For example for version “2.11.4” the first
line of the tag annotation SHOULD read “Release 2.11.4”. The second line
MUST be blank, and the changelog MUST start on the third line.</li>
</ol>
</li>
<li>Short-Term Release Branches
<ol>
<li>Any branch that has a name starting with “release-” SHOULD be referred to
as a “release branch”.</li>
<li>Any release branch which has a name ending with a specific version
string, MUST be referred to as a “short-term release branch”.</li>
<li>Use of short-term release branches are OPTIONAL, and intended to be used
to create a specific versioned release.</li>
<li>A short-term release branch is RECOMMENDED if there is a lengthy
pre-release verification process to avoid a code freeze on the master
branch.</li>
<li>Short-term release branches MUST have a name of “release-VERSION”. For
example for version “2.11.4” the release branch name MUST be
“release-2.11.4”.</li>
<li>When using a short-term release branch to create a release, the release
tag and if used, version bump commit, MUST be placed directly on the
short-term release branch itself.</li>
<li>Only very minor changes should be performed on a short-term release
branch directly. Any larger changes SHOULD be done in the master branch,
and SHOULD be pulled into the release branch by rebasing it on top of the
master branch the same way a change branch pulls in updates from its
source branch.</li>
<li>After a release tag has been created, the release branch MUST be merged
back into its source branch and then deleted. Typically the source branch
will be the master branch.</li>
</ol>
</li>
<li>Long-term Release Branches
<ol>
<li>Any release branch which has a name ending with a non-specific version
string, MUST be referred to as a “long-term release branch”. For example
“release-2.11” is a long-term release branch, while “release-2.11.4” is a
short-term release branch.</li>
<li>Use of long-term release branches are OPTIONAL, and intended for work on
versions which are not currently part of the master branch. Typically
this is useful when you need to create a new maintenance release for a
older version.</li>
<li>A long-term release branch MUST have a name with a non-specific version
number. For example a long-term release branch for creating new 2.9.x
releases MUST be named “release-2.9”.</li>
<li>Long-term release branches for maintenance releases of older versions
MUST be created from the relevant release tag. For example if the master
branch is on version 2.11.4 and there is a security fix for all 2.9.x
releases, the latest of which is “2.9.7”. Create a new branch called
“release-2.9” from the “2.9.7” release tag. The security fix release will
then end up being version “2.9.8”.</li>
<li>To create a new release from a long-term release branch, you MUST follow
the same process as a release from the master branch, except the
long-term release branch takes the place of the master branch.</li>
<li>A long-term release branch should be treated with the same respect as the
master branch. It is effectively the master branch for the release series
in question. Meaning it MUST always be in a non-broken state, MUST NOT be
force pushed to, etc.</li>
</ol>
</li>
<li>Bug Fixes &#x26; Rollback
<ol>
<li>You MUST NOT under any circumstances force push to the master branch or
to long-term release branches.</li>
<li>If a change branch which has been merged into the master branch is found
to have a bug in it, the bug fix work MUST be done as a new separate
change branch and MUST follow the same workflow as any other change
branch.</li>
<li>If a change branch is wrongfully merged into master, or for any other
reason the merge must be undone, you MUST undo the merge by reverting the
merge commit itself. Effectively creating a new commit that reverses all
the relevant changes.</li>
</ol>
</li>
<li>Git Best Practices
<ol>
<li>All commit messages SHOULD follow the Commit Guidelines and format from
the official git
documentation:
<a href="https://git-scm.com/book/en/v2/Distributed-Git-Contributing-to-a-Project#_commit_guidelines">https://git-scm.com/book/en/v2/Distributed-Git-Contributing-to-a-Project#_commit_guidelines</a></li>
<li>You SHOULD never blindly commit all changes with “git commit -a”. It is
RECOMMENDED you use “git add -i” or “git add -p” to add individual
changes to the staging area so you are fully aware of what you are
committing.</li>
<li>You SHOULD always use “—force-with-lease” when doing a force push. The
regular “—force” option is dangerous and destructive. More
information:
<a href="https://developer.atlassian.com/blog/2015/04/force-with-lease/">https://developer.atlassian.com/blog/2015/04/force-with-lease/</a></li>
<li>You SHOULD understand and be comfortable with
rebasing: <a href="https://git-scm.com/book/en/v2/Git-Branching-Rebasing">https://git-scm.com/book/en/v2/Git-Branching-Rebasing</a></li>
<li>It is RECOMMENDED that you always do “git pull —rebase” instead of “git
pull” to avoid unnecessary merge commits. You can make this the default
behavior of “git pull” with “git config —global pull.rebase true”.</li>
<li>It is RECOMMENDED that all branches be merged using “git merge —no-ff”.
This makes sure the reference to the original branch is kept in the
commits, allows one to revert a merge by reverting a single merge commit,
and creates a merge commit to mark the integration of the branch with
master.</li>
</ol>
</li>
</ol>
<h2 id="faq">FAQ</h2>
<h3 id="why-use-common-flow-instead-of-git-flow-and-how-does-it-differ">Why use Common-Flow instead of Git Flow, and how does it differ?</h3>
<p>Common-Flow tries to be a lot less complicated than Git Flow by having fewer
types of branches, and simpler rules. Normal day to day development doesnt
really change much:</p>
<ul>
<li>You create change branches instead of feature branches, without the need of a
“feature/” or “change/” prefix in the branch name.</li>
<li>Change branches are typically created from and merged back into “master”
instead of “develop”.</li>
<li>Creating a release is done by simply creating a git tag, typically on the
master branch.</li>
</ul>
<p>In detail, the main differences between Git Flow and Common-Flow are:</p>
<ul>
<li>There is no “develop” branch, there is only a “master” branch which contains
the latest work. In Git Flow the master branch effectively ends up just being
a pointer to the latest release, despite the fact that Git Flow includes
release tags too. In Common-Flow you just look at the tags to find the latest
release.</li>
<li>There are no “feature” or “hotfix” branches, theres only “change”
branches. Any branch that is not master and introduces changes is a change
branch. Change branches also dont have a enforced naming convention, they
just have to have a “descriptive name”. This makes things simpler and allows
more flexibility.</li>
<li>Release branches are available, but optional. Instead of enforcing the use of
release branches like Git Flow, Common-Flow only recommends the use of release
branches when it makes things easier. If creating a new release by tagging
“master” works for you, great, do that.</li>
</ul>
<h3 id="why-use-common-flow-instead-of-github-flow-and-how-does-it-differ">Why use Common-Flow instead of GitHub Flow, and how does it differ?</h3>
<p>Common-Flow is essentially GitHub Flow with the addition of a “Release” concept
that uses tags. It also attempts to define how certain common tasks are done,
like updating change/feature branches from their source branches for
example. This is to help end arguments about how such things are done.</p>
<p>If a deployment/release for you is just getting the latest code in the master
branch out, without caring about bumping version numbers or anything, then
GitHub Flow is a good fit for you, and you probably dont need the extras of
Common-Flow.</p>
<p>However if your deployments/releases have specific version numbers, then
Common-Flow gives you a simple set of rules of how to create and manage
releases, on top of what GitHub Flow already does.</p>
<h3 id="what-does-descriptive-name-mean-for-change-branches">What does “descriptive name” mean for change branches?</h3>
<p>It means what it sounds like. The name should be descriptive, as in by just
reading the name of the branch you should understand what the branchs purpose
is and what it does. Heres a few examples:</p>
<ul>
<li>add-2fa-support</li>
<li>fix-login-issue</li>
<li>remove-sort-by-middle-name-functionality</li>
<li>update-font-awesome</li>
<li>change-search-behavior</li>
<li>improve-pagination-performance</li>
<li>tweak-footer-style</li>
</ul>
<p>Notice how none of these have any prefixes like “feature/” or “hotfix/”, theyre
not needed when branch names are properly descriptive. However theres nothing
to say you cant use such prefixes if you want.</p>
<p>You can also add ticket numbers to the branch name if your team/org has that as
part of its process. But it is recommended that ticket numbers are added to the
end of the branch name. The ticket number is essentially metadata, so put it at
the end and out of the way of humans trying to read the descriptive name from
left to right.</p>
<h3 id="how-do-we-release-an-emergency-hotfix-when-the-master-branch-is-broken">How do we release an emergency hotfix when the master branch is broken?</h3>
<p>This should ideally never happen, however if it does you can do one of the
following:</p>
<ul>
<li>Review why the master branch is broken and revert the changes that caused the
issues. Then apply the hotfix and release.</li>
<li>Or use a short-term release branch created from the latest release tag instead
of the master branch. Apply the hotfix to the release branch, create a release
tag on the release branch, and then merge it back into master.</li>
</ul>
<p>In this situation, it is recommended you try to revert the offending changes
thats preventing a new release from master. But if that proves to be a
complicated task and youre short on time, a short-term release branch gives you
a instant fix to the situation at hand, and lets you resolve the issues with
the master branch when you have more time on your hands.</p>
<h2 id="about">About</h2>
<p>The Git Common-Flow specification is authored
by <a href="https://jimeh.me/">Jim Myhrberg</a>.</p>
<p>If youd like to leave feedback,
please <a href="https://github.com/jimeh/common-flow/issues">open an issue on GitHub</a>.</p>
<h2 id="license">License</h2>
<p><a href="https://creativecommons.org/licenses/by/4.0/">Creative Commons - CC BY 4.0</a></p> </article> </div> </div> </div> </body></html>

View File

@@ -1 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?><urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:news="http://www.google.com/schemas/sitemap-news/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml" xmlns:image="http://www.google.com/schemas/sitemap-image/1.1" xmlns:video="http://www.google.com/schemas/sitemap-video/1.1"><url><loc>https://commonflow.org/</loc></url><url><loc>https://commonflow.org/spec/1.0.0-rc.1/</loc></url><url><loc>https://commonflow.org/spec/1.0.0-rc.2/</loc></url><url><loc>https://commonflow.org/spec/1.0.0-rc.3/</loc></url><url><loc>https://commonflow.org/spec/1.0.0-rc.4/</loc></url><url><loc>https://commonflow.org/spec/1.0.0-rc.5/</loc></url></urlset>

View File

@@ -1 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?><sitemapindex xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"><sitemap><loc>https://commonflow.org/sitemap-0.xml</loc></sitemap></sitemapindex>

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 18 KiB

View File

@@ -1,196 +0,0 @@
<!DOCTYPE html><html lang="en" data-astro-cid-jwirc66j> <head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="canonical" href="https://commonflow.org/spec/1.0.0-rc.1/"><title>Git Common-Flow 1.0.0-rc.1 | Git Common Flow</title><meta name="description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><meta name="author" content="Jim Myhrberg"><!-- Open Graph --><meta property="og:title" content="Git Common-Flow 1.0.0-rc.1 | Git Common Flow"><meta property="og:description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><meta property="og:type" content="website"><meta property="og:url" content="https://commonflow.org/spec/1.0.0-rc.1/"><!-- Twitter --><meta name="twitter:card" content="summary"><meta name="twitter:title" content="Git Common-Flow 1.0.0-rc.1 | Git Common Flow"><meta name="twitter:description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><!-- Fonts --><link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@300;700&family=Open+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet"><link rel="stylesheet" href="/_astro/index.BMC0NJ9O.css"></head> <body data-astro-cid-jwirc66j> <div id="layout" data-astro-cid-jwirc66j> <a href="#menu" id="menuLink" class="menu-link" data-astro-cid-jyixok4n> <span data-astro-cid-jyixok4n></span> </a> <script type="module">function c(){const e=document.getElementById("layout"),n=document.getElementById("menu"),t=document.getElementById("menuLink"),s=document.getElementById("main");function i(o){o.preventDefault(),e?.classList.toggle("active"),n?.classList.toggle("active"),t?.classList.toggle("active")}function a(){e?.classList.remove("active"),n?.classList.remove("active"),t?.classList.remove("active")}t?.addEventListener("click",i),s?.addEventListener("click",()=>{e?.classList.contains("active")&&a()})}c();document.addEventListener("astro:after-swap",c);</script> <div id="menu" data-astro-cid-ssfzsv2f> <div class="menu-inner" data-astro-cid-ssfzsv2f> <ul class="menu-list" data-astro-cid-ssfzsv2f> <li class="menu-label" data-astro-cid-ssfzsv2f>Versions:</li> <li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.5" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.5 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.4" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.4 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.3" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.3 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.2" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.2 </a> </li><li class="menu-item selected" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.1" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.1 </a> </li> </ul> </div> <div class="links" data-astro-cid-ssfzsv2f> <a href="https://github.com/jimeh/common-flow" aria-label="View on GitHub" class="github-link" data-astro-cid-ssfzsv2f> <svg class="w-12 h-12" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true" data-astro-cid-ssfzsv2f> <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839
9.504.5.092.682-.217.682-.483
0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608
1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088
2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951
0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65
0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004
1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546
1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028
2.688 0 3.848-2.339 4.695-4.566
4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012
2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22
6.484 17.522 2 12 2z" clip-rule="evenodd" data-astro-cid-ssfzsv2f></path> </svg> </a> </div> </div> <div id="main" data-astro-cid-jwirc66j> <div class="content" data-astro-cid-jwirc66j> <article class="spec-content"> <h1 id="git-common-flow-100-rc1">Git Common-Flow 1.0.0-rc.1</h1>
<img src="/spec/1.0.0-rc.1.svg" alt="Git Common-Flow 1.0.0-rc.1 diagram" width="100%">
<h2 id="summary">Summary</h2>
<p>Common-Flow is an attempt to gather a sensible selection of the most common
usage patterns of git into a single and concise specification. It is based on
the <a href="http://scottchacon.com/2011/08/31/github-flow.html">original variant</a>
of <a href="https://guides.github.com/introduction/flow/">GitHub Flow</a>, while taking
into account how a lot of open source projects use git.</p>
<p>TL;DR: Common-Flow is basically GitHub Flow with the addition of versioned
releases, maintenance releases for old versions, and without the requirement to
deploy to production all the time.</p>
<h2 id="terminology">Terminology</h2>
<ul>
<li><strong>Master Branch</strong> - Must always have passing tests, is considered bleeding
edge, and must be named <code>master</code>.</li>
<li><strong>Change Branches</strong> - Any branch that introduces changes like a new feature, a
bug fix, etc.</li>
<li><strong>Source Branch</strong> - The branch that a change branch was created from. New
changes in the source branch should be incorporated into the change branch via
rebasing.</li>
<li><strong>Merge Target</strong> - A branch that is the intended merge target for a change
branch. Typically the merge target branch will be the same as the source
branch.</li>
<li><strong>Maintenance Branches</strong> - Used for maintaining old versions and releasing
PATCH updates when the master branch has moved on. Should follow a
<code>stable-X.Y</code> naming pattern, where <code>X</code> is MAJOR version and <code>Y</code> is MINOR
version.</li>
<li><strong>Pull Request</strong> - A means of requesting that a change branch is merged in to
its merge target, allowing others to review, discuss and approve the changes.</li>
<li><strong>Release</strong> - Consists of a version bump commit directly on the master branch,
and a git tag named according to the new version string placed on said commit.</li>
<li><strong>Maintenance Release</strong> - Just like a regular release, except the version bump
commit and release tag are on a maintenance branch instead of the master
branch.</li>
</ul>
<h2 id="git-common-flow-specification-common-flow">Git Common-Flow Specification (Common-Flow)</h2>
<p>The key words “MUST”, “MUST NOT”, “REQUIRED”, “SHALL”, “SHALL NOT”, “SHOULD”,
“SHOULD NOT”, “RECOMMENDED”, “MAY”, and “OPTIONAL” in this document are to be
interpreted as described in <a href="https://tools.ietf.org/html/rfc2119">RFC 2119</a>.</p>
<ol>
<li>The Master Branch
<ol>
<li>A branch named “master” MUST exist and it MUST be referred to as the
“master branch”.</li>
<li>The master branch MUST be considered bleeding edge.</li>
<li>The master branch MUST always be in a non-broken state with its test
suite passing.</li>
<li>The master branch SHOULD always be in a “as near as possible ready for
release/production” state to reduce the friction of creating a new
release.</li>
</ol>
</li>
<li>Changes
<ol>
<li>Changes MUST be performed on a separate branch that SHOULD be referred to
as a “change branch”. All change branches MUST have descriptive names. It
is RECOMMENDED that you commit often locally, and you SHOULD regularly
push your work to the same named branch on the remote server.</li>
<li>When a change branch is created, the branch that it is created from
SHOULD be referred to as the “source branch”. Each change branch also
needs a designated “merge target branch”, typically this will be the same
as the source branch.</li>
<li>Change branches MUST be regularly updated with any changes from their
source branch. This MUST be done by rebasing the change branch on top of
the source branch. To be clear you MUST NOT merge a source branch into a
change branch.</li>
<li>After rebasing a change branch on top of its source branch you MUST push
the change branch to the remote server. This will require you do a force
push, and you SHOULD use the “—force-with-lease” git push option.</li>
<li>To merge a change branch into its merge target branch, you MUST open a
“pull request” (or equivalent) so others can review and approve your
changes.</li>
<li>A pull request MUST only be merged when the change branch is up-to-date
with its source branch, the test suite is passing, and you and others are
happy with the change. This is especially important if the merge target
is the master branch.</li>
<li>To get feedback, help, or generally just discuss a change branch with
others, it is RECOMMENDED you do this by creating a pull request and
discuss the changes with others there.</li>
</ol>
</li>
<li>Git Best Practices
<ol>
<li>All commit messages SHOULD follow the Commit Guidelines and format from
the official git
documentation:
<a href="https://git-scm.com/book/en/v2/Distributed-Git-Contributing-to-a-Project">https://git-scm.com/book/en/v2/Distributed-Git-Contributing-to-a-Project</a></li>
<li>You SHOULD always use “—force-with-lease” when doing a force push. The
plain “—force” option is dangerous and destructive. More
information:
<a href="https://developer.atlassian.com/blog/2015/04/force-with-lease/">https://developer.atlassian.com/blog/2015/04/force-with-lease/</a></li>
<li>You SHOULD understand and be comfortable with
rebasing: <a href="https://git-scm.com/book/en/v2/Git-Branching-Rebasing">https://git-scm.com/book/en/v2/Git-Branching-Rebasing</a></li>
<li>It is RECOMMENDED that you always do “git pull —rebase” instead of “git
pull” to avoid unnecessary merge commits. You can make this the default
behavior of “git pull” with “git config —global pull.rebase true”.</li>
<li>It is RECOMMENDED that all branches be merged using “git merge —no-ff”.
This makes sure the reference to the original branch is kept in the commits,
allows one to revert a merge by reverting a single merge commit, and creates
a merge commit to mark the integration of the branch with master.</li>
</ol>
</li>
<li>Versioning
<ol>
<li>The project MUST have its version hard-coded somewhere in the
code-base. It is RECOMMENDED that this is done in a file called “VERSION”
located in the root of the project.</li>
<li>If you are using a “VERSION” file in the root of the project, this MUST
only contain the exact version string.</li>
<li>The version string SHOULD follow the Semantic Versioning
(<a href="http://semver.org/">http://semver.org/</a>) format. Use of Semantic Versioning is OPTIONAL,
but the version string MUST NOT have a “v” prefix. For example “v2.11.4”
is bad, and “2.11.4” is good.</li>
</ol>
</li>
<li>Releases
<ol>
<li>To create a new release, you MUST create a “version bump” commit directly
on the master branch which changes the hard-coded version value of the
project. The version bump commit MUST have a git tag created on it and
named as the exact version string.</li>
<li>A version bump commit MUST have a commit message title of “Bump version
to VERSION”. For example, if the new version string is “2.11.4”, the
first line of the commit message MUST read: “Bump version to 2.11.4”</li>
<li>The release tag on the version bump commit MUST be named exactly the same
as the version string. The tag name can OPTIONALLY be prefixed with
“v”. For example the tag name can be either “2.11.4” or “v2.11.4”.</li>
<li>It is RECOMMENDED that release tags are lightweight tags, but you can
OPTIONALLY use annotated tags if you want to include changelog
information in the release tag itself.</li>
<li>If you use annotated release tags, the first line of the annotation MUST
read “Release VERSION”. For example for version “2.11.4” the first line
of the tag annotation would read “Release 2.11.4”. The second line must
be blank, and the changelog MUST start on the third line.</li>
</ol>
</li>
<li>Bug Fixes &#x26; Rollback
<ol>
<li>You MUST NOT under any circumstances force push to the master branch.</li>
<li>If a change branch which has been merged in to the master branch is found
to have a bug in it, the bug fix work MUST be done as a new separate
change branch and MUST follow the same workflow as any other change
branch.</li>
<li>If a change branch is wrongfully merged in to master, or for any other
reason the merge must be undone, you MUST undo the merge by reverting the
merge commit itself. Effectively creating a new commit that reverses all
the relevant changes.</li>
</ol>
</li>
<li>Maintenance Releases
<ol>
<li>Any branch that has a name starting with “stable-” SHOULD be referred to
as a “maintenance branch”.</li>
<li>Maintenance branches are used for managing new releases of older
versions. Typically this is used to provide security updates for older
versions when the master branch has moved on to a point that a new
release for the old version cannot be made from the master branch.</li>
<li>A “maintenance release” is identical to a regular release, except the
version bump commit and the release tag are placed on the maintenance
branch instead of on the master branch.</li>
<li>A maintenance branch SHOULD follow a “stable-X.Y” naming pattern, where
“X” is the MAJOR version and “Y” is the minor version.</li>
<li>A maintenance branch MUST be created from the relevant release tag. For
example if there is a security fix for all 2.9.x releases, the latest of
which is “2.9.7”, we create a new branch called “stable-2.9” off of the
“2.9.7” release tag. The security fix release will then end up being
version “2.9.8”.</li>
<li>When working on a maintenance release, the relevant maintenance branch
MUST be thought of as the master branch for that maintenance work.</li>
<li>Changes in a maintenance branch SHOULD typically come from work being
done against the master branch. Meaning changes SHOULD only trickle
downwards from the master branch. If a change needs to trickle back up
into the master branch, that work should have happened against the master
branch in the first place.</li>
</ol>
</li>
</ol>
<h2 id="about">About</h2>
<p>The Git Common-Flow specification is authored
by <a href="http://jimeh.me">Jim Myhrberg</a>.</p>
<p>If youd like to leave feedback,
please <a href="https://github.com/jimeh/common-flow/issues">open an issue on GitHub</a>.</p>
<h2 id="license">License</h2>
<p><a href="http://creativecommons.org/licenses/by/3.0/">Creative Commons - CC BY 3.0</a></p> </article> </div> </div> </div> </body></html>

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 18 KiB

View File

@@ -1,230 +0,0 @@
<!DOCTYPE html><html lang="en" data-astro-cid-jwirc66j> <head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="canonical" href="https://commonflow.org/spec/1.0.0-rc.2/"><title>Git Common-Flow 1.0.0-rc.2 | Git Common Flow</title><meta name="description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><meta name="author" content="Jim Myhrberg"><!-- Open Graph --><meta property="og:title" content="Git Common-Flow 1.0.0-rc.2 | Git Common Flow"><meta property="og:description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><meta property="og:type" content="website"><meta property="og:url" content="https://commonflow.org/spec/1.0.0-rc.2/"><!-- Twitter --><meta name="twitter:card" content="summary"><meta name="twitter:title" content="Git Common-Flow 1.0.0-rc.2 | Git Common Flow"><meta name="twitter:description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><!-- Fonts --><link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@300;700&family=Open+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet"><link rel="stylesheet" href="/_astro/index.BMC0NJ9O.css"></head> <body data-astro-cid-jwirc66j> <div id="layout" data-astro-cid-jwirc66j> <a href="#menu" id="menuLink" class="menu-link" data-astro-cid-jyixok4n> <span data-astro-cid-jyixok4n></span> </a> <script type="module">function c(){const e=document.getElementById("layout"),n=document.getElementById("menu"),t=document.getElementById("menuLink"),s=document.getElementById("main");function i(o){o.preventDefault(),e?.classList.toggle("active"),n?.classList.toggle("active"),t?.classList.toggle("active")}function a(){e?.classList.remove("active"),n?.classList.remove("active"),t?.classList.remove("active")}t?.addEventListener("click",i),s?.addEventListener("click",()=>{e?.classList.contains("active")&&a()})}c();document.addEventListener("astro:after-swap",c);</script> <div id="menu" data-astro-cid-ssfzsv2f> <div class="menu-inner" data-astro-cid-ssfzsv2f> <ul class="menu-list" data-astro-cid-ssfzsv2f> <li class="menu-label" data-astro-cid-ssfzsv2f>Versions:</li> <li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.5" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.5 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.4" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.4 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.3" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.3 </a> </li><li class="menu-item selected" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.2" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.2 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.1" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.1 </a> </li> </ul> </div> <div class="links" data-astro-cid-ssfzsv2f> <a href="https://github.com/jimeh/common-flow" aria-label="View on GitHub" class="github-link" data-astro-cid-ssfzsv2f> <svg class="w-12 h-12" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true" data-astro-cid-ssfzsv2f> <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839
9.504.5.092.682-.217.682-.483
0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608
1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088
2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951
0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65
0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004
1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546
1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028
2.688 0 3.848-2.339 4.695-4.566
4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012
2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22
6.484 17.522 2 12 2z" clip-rule="evenodd" data-astro-cid-ssfzsv2f></path> </svg> </a> </div> </div> <div id="main" data-astro-cid-jwirc66j> <div class="content" data-astro-cid-jwirc66j> <article class="spec-content"> <h1 id="git-common-flow-100-rc2">Git Common-Flow 1.0.0-rc.2</h1>
<img src="/spec/1.0.0-rc.2.svg" alt="Git Common-Flow 1.0.0-rc.2 diagram" width="100%">
<h2 id="summary">Summary</h2>
<p>Common-Flow is an attempt to gather a sensible selection of the most common
usage patterns of git into a single and concise specification. It is based on
the <a href="http://scottchacon.com/2011/08/31/github-flow.html">original variant</a>
of <a href="https://guides.github.com/introduction/flow/">GitHub Flow</a>, while taking
into account how a lot of open source projects use git.</p>
<p>TL;DR: Common-Flow is basically GitHub Flow with the addition of versioned
releases, maintenance releases for old versions, and without the requirement to
deploy to production all the time.</p>
<h2 id="terminology">Terminology</h2>
<ul>
<li><strong>Master Branch</strong> - Must always have passing tests, is considered bleeding
edge, and must be named <code>master</code>.</li>
<li><strong>Change Branches</strong> - Any branch that introduces changes like a new feature, a
bug fix, etc.</li>
<li><strong>Source Branch</strong> - The branch that a change branch was created from. New
changes in the source branch should be incorporated into the change branch via
rebasing.</li>
<li><strong>Merge Target</strong> - A branch that is the intended merge target for a change
branch. Typically the merge target branch will be the same as the source
branch.</li>
<li><strong>Pull Request</strong> - A means of requesting that a change branch is merged in to
its merge target, allowing others to review, discuss and approve the changes.</li>
<li><strong>Release</strong> - Consists of a version bump commit, and a git tag named according
to the new version string placed on said commit.</li>
<li><strong>Release Branches</strong> - Used both for short-term preparations of a release, and
also for long-term maintenance of older version.</li>
</ul>
<h2 id="git-common-flow-specification-common-flow">Git Common-Flow Specification (Common-Flow)</h2>
<p>The key words “MUST”, “MUST NOT”, “REQUIRED”, “SHALL”, “SHALL NOT”, “SHOULD”,
“SHOULD NOT”, “RECOMMENDED”, “MAY”, and “OPTIONAL” in this document are to be
interpreted as described in <a href="https://tools.ietf.org/html/rfc2119">RFC 2119</a>.</p>
<ol>
<li>The Master Branch
<ol>
<li>A branch named “master” MUST exist and it MUST be referred to as the
“master branch”.</li>
<li>The master branch MUST be considered bleeding edge.</li>
<li>The master branch MUST always be in a non-broken state with its test
suite passing.</li>
<li>The master branch SHOULD always be in a “as near as possibly ready for
release/production” state to reduce any friction with creating a new
release.</li>
</ol>
</li>
<li>Change Branches
<ol>
<li>Each change (feature, bugfix, etc.) MUST be performed on separate
branches that SHOULD be referred to as “change branches”. All change
branches MUST have descriptive names. It is RECOMMENDED that you commit
often locally, and you SHOULD regularly push your work to the same named
branch on the remote server.</li>
<li>You MUST create separate change branches for each distinctly different
change. You MUST NOT include multiple unrelated changes into a single
change branch.</li>
<li>When a change branch is created, the branch that it is created from
SHOULD be referred to as the “source branch”. Each change branch also
needs a designated “merge target” branch, typically this will be the same
as the source branch.</li>
<li>Change branches MUST be regularly updated with any changes from their
source branch. This MUST be done by rebasing the change branch on top of
the source branch.</li>
<li>After rebasing a change branch on top of its source branch you MUST push
the change branch to the remote server. This will require you to do a
force push, and you SHOULD use the “—force-with-lease” git push option.</li>
</ol>
</li>
<li>Pull Requests
<ol>
<li>To merge a change branch into its merge target, you MUST open a “pull
request” (or equivalent) so others can review and approve your changes.</li>
<li>A pull request MUST only be merged when the change branch is up-to-date
with its source branch, the test suite is passing, and you and others are
happy with the change. This is especially important if the merge target
is the master branch.</li>
<li>To get feedback, help, or generally just discuss a change branch with
others, the RECOMMENDED way to do so is by creating a pull request and
discuss the changes with others there.</li>
</ol>
</li>
<li>Versioning
<ol>
<li>The project MUST have its version hard-coded somewhere in the
code-base. It is RECOMMENDED that this is done in a file called “VERSION”
located in the root of the project.</li>
<li>If you are using a “VERSION” file in the root of the project, this MUST
only contain the exact version string.</li>
<li>The version string SHOULD follow the Semantic Versioning
(<a href="http://semver.org/">http://semver.org/</a>) format. Use of Semantic Versioning is OPTIONAL,
but the version string MUST NOT have a “v” prefix. For example “v2.11.4”
is bad, and “2.11.4” is good.</li>
</ol>
</li>
<li>Releases
<ol>
<li>To create a new release, you MUST create a “version bump” commit which
changes the hard-coded version string of the project. The version bump
commit MUST have a git tag created on it and named as the exact version
string.</li>
<li>If you are not using a release branch, then the version bump commit MUST
be created directly on the master branch.</li>
<li>The version bump commit MUST have a commit message title of “Bump version
to VERSION”. For example, if the new version string is “2.11.4”, the
first line of the commit message MUST read: “Bump version to 2.11.4”</li>
<li>The release tag on the version bump commit MUST be named exactly the same
as the version string. The tag name can OPTIONALLY be prefixed with
“v”. For example the tag name can be either “2.11.4” or “v2.11.4”. You
MUST not use a mix of “v” prefixed and non-prefixed tags. Pick one form
and stick to it.</li>
<li>It is RECOMMENDED that release tags are lightweight tags, but you can
OPTIONALLY use annotated tags if you want to include changelog
information in the release tag itself.</li>
<li>If you use annotated release tags, the first line of the annotation MUST
read “Release VERSION”. For example for version “2.11.4” the first line
of the tag annotation would read “Release 2.11.4”. The second line must
be blank, and the changelog MUST start on the third line.</li>
</ol>
</li>
<li>Release Branches
<ol>
<li>Any branch that has a name starting with “release-” SHOULD be referred to
as a “release branch”.</li>
<li>Use of release branches is OPTIONAL.</li>
<li>Changes in a release branch SHOULD typically come from work being
done against the master branch. Meaning changes SHOULD only trickle
downwards from the master branch. If a change needs to trickle back up
into the master branch, that work should have happened against the master
branch in the first place. One exception to this is version bump commits.</li>
<li>There are two types of release branches; short-term, and long-term.</li>
<li>Short-Term Release Branches
<ol>
<li>Used for creating a specific versioned release.</li>
<li>A short-term release branch is RECOMMENDED if there is a lengthy
pre-release verification process to avoid a code freeze on the master
branch.</li>
<li>MUST have a name of “release-VERSION”. For example for version
“2.11.4” the release branch name MUST be “release-2.11.4”.</li>
<li>When using a short-term release branch, the version bump commit and
release tag MUST be made directly on the release branch itself.</li>
<li>Only very minor changes should be performed on a short-term release
branch directly. Any larger changes SHOULD be done in the master
branch, and SHOULD be pulled into the release branch by rebasing it
on top of the master branch the same way a change branch pulls in
updates from its source branch.</li>
<li>After the version bump commit and release tag have been created, the
release branch MUST be merged back into its source branch and then
deleted. Typically the source branch will be the master branch.</li>
</ol>
</li>
<li>Long-Term Release Branches
<ol>
<li>Used for work on versions which are not currently part of the master
branch. Typically this is useful when you need to create a new
maintenance release for a older version.</li>
<li>The branch name MUST have a non-specific version number. For example
a long-term release branch for creating new 2.9.x releases would be
named “release-2.9”.</li>
<li>To create a new release from a long-term release branch, you MUST
create a version bump commit and release tag directly on the release
branch.</li>
<li>A long-term release branch MUST be created from the relevant release
tag. For example if the master branch is on version 2.11.4 and there
is a security fix for all 2.9.x releases, the latest of which is
“2.9.7”. Create a new branch called “release-2.9” off of the “2.9.7”
release tag. The security fix release will then end up being version
“2.9.8”.</li>
</ol>
</li>
</ol>
</li>
<li>Bug Fixes &#x26; Rollback
<ol>
<li>You MUST NOT under any circumstances force push to the master branch.</li>
<li>If a change branch which has been merged into the master branch is found
to have a bug in it, the bug fix work MUST be done as a new separate
change branch and MUST follow the same workflow as any other change
branch.</li>
<li>If a change branch is wrongfully merged into master, or for any other
reason the merge must be undone, you MUST undo the merge by reverting the
merge commit itself. Effectively creating a new commit that reverses all
the relevant changes.</li>
</ol>
</li>
<li>Git Best Practices
<ol>
<li>All commit messages SHOULD follow the Commit Guidelines and format from
the official git
documentation:
<a href="https://git-scm.com/book/en/v2/Distributed-Git-Contributing-to-a-Project">https://git-scm.com/book/en/v2/Distributed-Git-Contributing-to-a-Project</a></li>
<li>You SHOULD never blindly commit all changes with “git commit -a”. It is
RECOMMENDED you use “git add -i” to add individual changes to the staging
area so you are fully aware of what you are committing.</li>
<li>You SHOULD always use “—force-with-lease” when doing a force push. The
regular “—force” option is dangerous and destructive. More
information:
<a href="https://developer.atlassian.com/blog/2015/04/force-with-lease/">https://developer.atlassian.com/blog/2015/04/force-with-lease/</a></li>
<li>You SHOULD understand and be comfortable with
rebasing: <a href="https://git-scm.com/book/en/v2/Git-Branching-Rebasing">https://git-scm.com/book/en/v2/Git-Branching-Rebasing</a></li>
<li>It is RECOMMENDED that you always do “git pull —rebase” instead of “git
pull” to avoid unnecessary merge commits. You can make this the default
behavior of “git pull” with “git config —global pull.rebase true”.</li>
<li>It is RECOMMENDED that all branches be merged using “git merge —no-ff”.
This makes sure the reference to the original branch is kept in the
commits, allows one to revert a merge by reverting a single merge commit,
and creates a merge commit to mark the integration of the branch with
master.</li>
</ol>
</li>
</ol>
<h2 id="about">About</h2>
<p>The Git Common-Flow specification is authored
by <a href="http://jimeh.me">Jim Myhrberg</a>.</p>
<p>If youd like to leave feedback,
please <a href="https://github.com/jimeh/common-flow/issues">open an issue on GitHub</a>.</p>
<h2 id="license">License</h2>
<p><a href="http://creativecommons.org/licenses/by/3.0/">Creative Commons - CC BY 3.0</a></p> </article> </div> </div> </div> </body></html>

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 18 KiB

View File

@@ -1,239 +0,0 @@
<!DOCTYPE html><html lang="en" data-astro-cid-jwirc66j> <head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="canonical" href="https://commonflow.org/spec/1.0.0-rc.3/"><title>Git Common-Flow 1.0.0-rc.3 | Git Common Flow</title><meta name="description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><meta name="author" content="Jim Myhrberg"><!-- Open Graph --><meta property="og:title" content="Git Common-Flow 1.0.0-rc.3 | Git Common Flow"><meta property="og:description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><meta property="og:type" content="website"><meta property="og:url" content="https://commonflow.org/spec/1.0.0-rc.3/"><!-- Twitter --><meta name="twitter:card" content="summary"><meta name="twitter:title" content="Git Common-Flow 1.0.0-rc.3 | Git Common Flow"><meta name="twitter:description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><!-- Fonts --><link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@300;700&family=Open+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet"><link rel="stylesheet" href="/_astro/index.BMC0NJ9O.css"></head> <body data-astro-cid-jwirc66j> <div id="layout" data-astro-cid-jwirc66j> <a href="#menu" id="menuLink" class="menu-link" data-astro-cid-jyixok4n> <span data-astro-cid-jyixok4n></span> </a> <script type="module">function c(){const e=document.getElementById("layout"),n=document.getElementById("menu"),t=document.getElementById("menuLink"),s=document.getElementById("main");function i(o){o.preventDefault(),e?.classList.toggle("active"),n?.classList.toggle("active"),t?.classList.toggle("active")}function a(){e?.classList.remove("active"),n?.classList.remove("active"),t?.classList.remove("active")}t?.addEventListener("click",i),s?.addEventListener("click",()=>{e?.classList.contains("active")&&a()})}c();document.addEventListener("astro:after-swap",c);</script> <div id="menu" data-astro-cid-ssfzsv2f> <div class="menu-inner" data-astro-cid-ssfzsv2f> <ul class="menu-list" data-astro-cid-ssfzsv2f> <li class="menu-label" data-astro-cid-ssfzsv2f>Versions:</li> <li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.5" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.5 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.4" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.4 </a> </li><li class="menu-item selected" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.3" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.3 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.2" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.2 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.1" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.1 </a> </li> </ul> </div> <div class="links" data-astro-cid-ssfzsv2f> <a href="https://github.com/jimeh/common-flow" aria-label="View on GitHub" class="github-link" data-astro-cid-ssfzsv2f> <svg class="w-12 h-12" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true" data-astro-cid-ssfzsv2f> <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839
9.504.5.092.682-.217.682-.483
0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608
1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088
2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951
0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65
0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004
1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546
1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028
2.688 0 3.848-2.339 4.695-4.566
4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012
2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22
6.484 17.522 2 12 2z" clip-rule="evenodd" data-astro-cid-ssfzsv2f></path> </svg> </a> </div> </div> <div id="main" data-astro-cid-jwirc66j> <div class="content" data-astro-cid-jwirc66j> <article class="spec-content"> <h1 id="git-common-flow-100-rc3">Git Common-Flow 1.0.0-rc.3</h1>
<img src="/spec/1.0.0-rc.3.svg" alt="Git Common-Flow 1.0.0-rc.3 diagram" width="100%">
<h2 id="summary">Summary</h2>
<p>Common-Flow is an attempt to gather a sensible selection of the most common
usage patterns of git into a single and concise specification. It is based on
the <a href="http://scottchacon.com/2011/08/31/github-flow.html">original variant</a>
of <a href="https://guides.github.com/introduction/flow/">GitHub Flow</a>, while taking
into account how a lot of open source projects use git.</p>
<p>In short, Common-Flow is essentially GitHub Flow with the addition of versioned
releases, optional release branches, and without the requirement to deploy to
production all the time.</p>
<h2 id="terminology">Terminology</h2>
<ul>
<li><strong>Master Branch</strong> - Must be named “master”, must always have passing tests,
and is not guaranteed to always work in production environments.</li>
<li><strong>Change Branches</strong> - Any branch that introduces changes like a new feature, a
bug fix, etc.</li>
<li><strong>Source Branch</strong> - The branch that a change branch was created from. New
changes in the source branch should be incorporated into the change branch via
rebasing.</li>
<li><strong>Merge Target</strong> - A branch that is the intended merge target for a change
branch. Typically the merge target branch will be the same as the source
branch.</li>
<li><strong>Pull Request</strong> - A means of requesting that a change branch is merged in to
its merge target, allowing others to review, discuss and approve the changes.</li>
<li><strong>Release</strong> - May be considered safe to use in production
environments. Consists of a version bump commit, and a git tag named according
to the new version string placed on said commit.</li>
<li><strong>Release Branches</strong> - Used both for short-term preparations of a release, and
also for long-term maintenance of older version.</li>
</ul>
<h2 id="git-common-flow-specification-common-flow">Git Common-Flow Specification (Common-Flow)</h2>
<p>The key words “MUST”, “MUST NOT”, “REQUIRED”, “SHALL”, “SHALL NOT”, “SHOULD”,
“SHOULD NOT”, “RECOMMENDED”, “MAY”, and “OPTIONAL” in this document are to be
interpreted as described in <a href="https://tools.ietf.org/html/rfc2119">RFC 2119</a>.</p>
<ol>
<li>TL;DR
<ol>
<li>Dont break the master branch.</li>
<li>A release is a git tag.</li>
</ol>
</li>
<li>The Master Branch
<ol>
<li>A branch named “master” MUST exist and it MUST be referred to as the
“master branch”.</li>
<li>The master branch MUST always be in a non-broken state with its test
suite passing.</li>
<li>The master branch IS NOT guaranteed to always work in production
environments. Despite test suites passing it may at times contain
unfinished work. Only releases may be considered safe for production use.</li>
<li>The master branch SHOULD always be in a “as near as possibly ready for
release/production” state to reduce any friction with creating a new
release.</li>
</ol>
</li>
<li>Change Branches
<ol>
<li>Each change (feature, bugfix, etc.) MUST be performed on separate
branches that SHOULD be referred to as “change branches”. All change
branches MUST have descriptive names. It is RECOMMENDED that you commit
often locally, and you SHOULD regularly push your work to the same named
branch on the remote server.</li>
<li>You MUST create separate change branches for each distinctly different
change. You MUST NOT include multiple unrelated changes into a single
change branch.</li>
<li>When a change branch is created, the branch that it is created from
SHOULD be referred to as the “source branch”. Each change branch also
needs a designated “merge target” branch, typically this will be the same
as the source branch.</li>
<li>Change branches MUST be regularly updated with any changes from their
source branch. This MUST be done by rebasing the change branch on top of
the source branch.</li>
<li>After rebasing a change branch on top of its source branch you MUST push
the change branch to the remote server. This will require you to do a
force push, and you SHOULD use the “—force-with-lease” git push option.</li>
</ol>
</li>
<li>Pull Requests
<ol>
<li>To merge a change branch into its merge target, you MUST open a “pull
request” (or equivalent) so others can review and approve your changes.</li>
<li>A pull request MUST only be merged when the change branch is up-to-date
with its source branch, the test suite is passing, and you and others are
happy with the change. This is especially important if the merge target
is the master branch.</li>
<li>To get feedback, help, or generally just discuss a change branch with
others, the RECOMMENDED way to do so is by creating a pull request and
discuss the changes with others there.</li>
</ol>
</li>
<li>Versioning
<ol>
<li>The project MUST have its version hard-coded somewhere in the
code-base. It is RECOMMENDED that this is done in a file called “VERSION”
located in the root of the project.</li>
<li>If you are using a “VERSION” file in the root of the project, this MUST
only contain the exact version string.</li>
<li>The version string SHOULD follow the Semantic Versioning
(<a href="http://semver.org/">http://semver.org/</a>) format. Use of Semantic Versioning is OPTIONAL,
but the version string MUST NOT have a “v” prefix. For example “v2.11.4”
is bad, and “2.11.4” is good.</li>
</ol>
</li>
<li>Releases
<ol>
<li>To create a new release, you MUST create a “version bump” commit which
changes the hard-coded version string of the project. The version bump
commit MUST have a git tag created on it and named as the exact version
string.</li>
<li>If you are not using a release branch, then the version bump commit MUST
be created directly on the master branch.</li>
<li>The version bump commit MUST have a commit message title of “Bump version
to VERSION”. For example, if the new version string is “2.11.4”, the
first line of the commit message MUST read: “Bump version to 2.11.4”</li>
<li>The release tag on the version bump commit MUST be named exactly the same
as the version string. The tag name can OPTIONALLY be prefixed with
“v”. For example the tag name can be either “2.11.4” or “v2.11.4”. You
MUST not use a mix of “v” prefixed and non-prefixed tags. Pick one form
and stick to it.</li>
<li>It is RECOMMENDED that release tags are lightweight tags, but you can
OPTIONALLY use annotated tags if you want to include changelog
information in the release tag itself.</li>
<li>If you use annotated release tags, the first line of the annotation MUST
read “Release VERSION”. For example for version “2.11.4” the first line
of the tag annotation would read “Release 2.11.4”. The second line must
be blank, and the changelog MUST start on the third line.</li>
</ol>
</li>
<li>Release Branches
<ol>
<li>Any branch that has a name starting with “release-” SHOULD be referred to
as a “release branch”.</li>
<li>Use of release branches is OPTIONAL.</li>
<li>Changes in a release branch SHOULD typically come from work being
done against the master branch. Meaning changes SHOULD only trickle
downwards from the master branch. If a change needs to trickle back up
into the master branch, that work should have happened against the master
branch in the first place. One exception to this is version bump commits.</li>
<li>There are two types of release branches; short-term, and long-term.</li>
<li>Short-Term Release Branches
<ol>
<li>Used for creating a specific versioned release.</li>
<li>A short-term release branch is RECOMMENDED if there is a lengthy
pre-release verification process to avoid a code freeze on the master
branch.</li>
<li>MUST have a name of “release-VERSION”. For example for version
“2.11.4” the release branch name MUST be “release-2.11.4”.</li>
<li>When using a short-term release branch, the version bump commit and
release tag MUST be made directly on the release branch itself.</li>
<li>Only very minor changes should be performed on a short-term release
branch directly. Any larger changes SHOULD be done in the master
branch, and SHOULD be pulled into the release branch by rebasing it
on top of the master branch the same way a change branch pulls in
updates from its source branch.</li>
<li>After the version bump commit and release tag have been created, the
release branch MUST be merged back into its source branch and then
deleted. Typically the source branch will be the master branch.</li>
</ol>
</li>
<li>Long-Term Release Branches
<ol>
<li>Used for work on versions which are not currently part of the master
branch. Typically this is useful when you need to create a new
maintenance release for a older version.</li>
<li>The branch name MUST have a non-specific version number. For example
a long-term release branch for creating new 2.9.x releases would be
named “release-2.9”.</li>
<li>To create a new release from a long-term release branch, you MUST
create a version bump commit and release tag directly on the release
branch.</li>
<li>A long-term release branch MUST be created from the relevant release
tag. For example if the master branch is on version 2.11.4 and there
is a security fix for all 2.9.x releases, the latest of which is
“2.9.7”. Create a new branch called “release-2.9” off of the “2.9.7”
release tag. The security fix release will then end up being version
“2.9.8”.</li>
</ol>
</li>
</ol>
</li>
<li>Bug Fixes &#x26; Rollback
<ol>
<li>You MUST NOT under any circumstances force push to the master branch.</li>
<li>If a change branch which has been merged into the master branch is found
to have a bug in it, the bug fix work MUST be done as a new separate
change branch and MUST follow the same workflow as any other change
branch.</li>
<li>If a change branch is wrongfully merged into master, or for any other
reason the merge must be undone, you MUST undo the merge by reverting the
merge commit itself. Effectively creating a new commit that reverses all
the relevant changes.</li>
</ol>
</li>
<li>Git Best Practices
<ol>
<li>All commit messages SHOULD follow the Commit Guidelines and format from
the official git
documentation:
<a href="https://git-scm.com/book/en/v2/Distributed-Git-Contributing-to-a-Project#_commit_guidelines">https://git-scm.com/book/en/v2/Distributed-Git-Contributing-to-a-Project#_commit_guidelines</a></li>
<li>You SHOULD never blindly commit all changes with “git commit -a”. It is
RECOMMENDED you use “git add -i” to add individual changes to the staging
area so you are fully aware of what you are committing.</li>
<li>You SHOULD always use “—force-with-lease” when doing a force push. The
regular “—force” option is dangerous and destructive. More
information:
<a href="https://developer.atlassian.com/blog/2015/04/force-with-lease/">https://developer.atlassian.com/blog/2015/04/force-with-lease/</a></li>
<li>You SHOULD understand and be comfortable with
rebasing: <a href="https://git-scm.com/book/en/v2/Git-Branching-Rebasing">https://git-scm.com/book/en/v2/Git-Branching-Rebasing</a></li>
<li>It is RECOMMENDED that you always do “git pull —rebase” instead of “git
pull” to avoid unnecessary merge commits. You can make this the default
behavior of “git pull” with “git config —global pull.rebase true”.</li>
<li>It is RECOMMENDED that all branches be merged using “git merge —no-ff”.
This makes sure the reference to the original branch is kept in the
commits, allows one to revert a merge by reverting a single merge commit,
and creates a merge commit to mark the integration of the branch with
master.</li>
</ol>
</li>
</ol>
<h2 id="about">About</h2>
<p>The Git Common-Flow specification is authored
by <a href="http://jimeh.me">Jim Myhrberg</a>.</p>
<p>If youd like to leave feedback,
please <a href="https://github.com/jimeh/common-flow/issues">open an issue on GitHub</a>.</p>
<h2 id="license">License</h2>
<p><a href="http://creativecommons.org/licenses/by/3.0/">Creative Commons - CC BY 3.0</a></p> </article> </div> </div> </div> </body></html>

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 18 KiB

View File

@@ -1,351 +0,0 @@
<!DOCTYPE html><html lang="en" data-astro-cid-jwirc66j> <head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="canonical" href="https://commonflow.org/spec/1.0.0-rc.4/"><title>Git Common-Flow 1.0.0-rc.4 | Git Common Flow</title><meta name="description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><meta name="author" content="Jim Myhrberg"><!-- Open Graph --><meta property="og:title" content="Git Common-Flow 1.0.0-rc.4 | Git Common Flow"><meta property="og:description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><meta property="og:type" content="website"><meta property="og:url" content="https://commonflow.org/spec/1.0.0-rc.4/"><!-- Twitter --><meta name="twitter:card" content="summary"><meta name="twitter:title" content="Git Common-Flow 1.0.0-rc.4 | Git Common Flow"><meta name="twitter:description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><!-- Fonts --><link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@300;700&family=Open+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet"><link rel="stylesheet" href="/_astro/index.BMC0NJ9O.css"></head> <body data-astro-cid-jwirc66j> <div id="layout" data-astro-cid-jwirc66j> <a href="#menu" id="menuLink" class="menu-link" data-astro-cid-jyixok4n> <span data-astro-cid-jyixok4n></span> </a> <script type="module">function c(){const e=document.getElementById("layout"),n=document.getElementById("menu"),t=document.getElementById("menuLink"),s=document.getElementById("main");function i(o){o.preventDefault(),e?.classList.toggle("active"),n?.classList.toggle("active"),t?.classList.toggle("active")}function a(){e?.classList.remove("active"),n?.classList.remove("active"),t?.classList.remove("active")}t?.addEventListener("click",i),s?.addEventListener("click",()=>{e?.classList.contains("active")&&a()})}c();document.addEventListener("astro:after-swap",c);</script> <div id="menu" data-astro-cid-ssfzsv2f> <div class="menu-inner" data-astro-cid-ssfzsv2f> <ul class="menu-list" data-astro-cid-ssfzsv2f> <li class="menu-label" data-astro-cid-ssfzsv2f>Versions:</li> <li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.5" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.5 </a> </li><li class="menu-item selected" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.4" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.4 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.3" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.3 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.2" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.2 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.1" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.1 </a> </li> </ul> </div> <div class="links" data-astro-cid-ssfzsv2f> <a href="https://github.com/jimeh/common-flow" aria-label="View on GitHub" class="github-link" data-astro-cid-ssfzsv2f> <svg class="w-12 h-12" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true" data-astro-cid-ssfzsv2f> <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839
9.504.5.092.682-.217.682-.483
0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608
1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088
2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951
0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65
0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004
1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546
1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028
2.688 0 3.848-2.339 4.695-4.566
4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012
2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22
6.484 17.522 2 12 2z" clip-rule="evenodd" data-astro-cid-ssfzsv2f></path> </svg> </a> </div> </div> <div id="main" data-astro-cid-jwirc66j> <div class="content" data-astro-cid-jwirc66j> <article class="spec-content"> <h1 id="git-common-flow-100-rc4">Git Common-Flow 1.0.0-rc.4</h1>
<img src="/spec/1.0.0-rc.4.svg" alt="Git Common-Flow 1.0.0-rc.4 diagram" width="100%">
<h2 id="summary">Summary</h2>
<p>Common-Flow is an attempt to gather a sensible selection of the most common
usage patterns of git into a single and concise specification. It is based on
the <a href="http://scottchacon.com/2011/08/31/github-flow.html">original variant</a>
of <a href="https://guides.github.com/introduction/flow/">GitHub Flow</a>, while taking
into account how a lot of open source projects use git.</p>
<p>In short, Common-Flow is essentially GitHub Flow with the addition of versioned
releases, optional release branches, and without the requirement to deploy to
production all the time.</p>
<h2 id="terminology">Terminology</h2>
<ul>
<li><strong>Master Branch</strong> - Must be named “master”, must always have passing tests,
and is not guaranteed to always work in production environments.</li>
<li><strong>Change Branches</strong> - Any branch that introduces changes like a new feature, a
bug fix, etc.</li>
<li><strong>Source Branch</strong> - The branch that a change branch was created from. New
changes in the source branch should be incorporated into the change branch via
rebasing.</li>
<li><strong>Merge Target</strong> - A branch that is the intended merge target for a change
branch. Typically the merge target branch will be the same as the source
branch.</li>
<li><strong>Pull Request</strong> - A means of requesting that a change branch is merged in to
its merge target, allowing others to review, discuss and approve the changes.</li>
<li><strong>Release</strong> - May be considered safe to use in production environments. Is
effectively just a git tag named after the version of the release.</li>
<li><strong>Release Branches</strong> - Used both for short-term preparations of a release, and
also for long-term maintenance of older version.</li>
</ul>
<h2 id="git-common-flow-specification-common-flow">Git Common-Flow Specification (Common-Flow)</h2>
<p>The key words “MUST”, “MUST NOT”, “REQUIRED”, “SHALL”, “SHALL NOT”, “SHOULD”,
“SHOULD NOT”, “RECOMMENDED”, “MAY”, and “OPTIONAL” in this document are to be
interpreted as described in <a href="https://tools.ietf.org/html/rfc2119">RFC 2119</a>.</p>
<ol>
<li>TL;DR
<ol>
<li>Dont break the master branch.</li>
<li>A release is a git tag.</li>
</ol>
</li>
<li>The Master Branch
<ol>
<li>A branch named “master” MUST exist and it MUST be referred to as the
“master branch”.</li>
<li>The master branch MUST always be in a non-broken state with its test
suite passing.</li>
<li>The master branch IS NOT guaranteed to always work in production
environments. Despite test suites passing it may at times contain
unfinished work. Only releases may be considered safe for production use.</li>
<li>The master branch SHOULD always be in a “as near as possibly ready for
release/production” state to reduce any friction with creating a new
release.</li>
</ol>
</li>
<li>Change Branches
<ol>
<li>Each change (feature, bugfix, etc.) MUST be performed on separate
branches that SHOULD be referred to as “change branches”.</li>
<li>All change branches MUST have descriptive names.</li>
<li>It is RECOMMENDED that you commit often locally, and that you try and
keep the commits reasonably structured to avoid a messy and confusing git
history.</li>
<li>You SHOULD regularly push your work to the same named branch on the
remote server.</li>
<li>You SHOULD create separate change branches for each distinctly different
change. You SHOULD NOT include multiple unrelated changes into a single
change branch.</li>
<li>When a change branch is created, the branch that it is created from
SHOULD be referred to as the “source branch”. Each change branch also
needs a designated “merge target” branch, typically this will be the same
as the source branch.</li>
<li>Change branches MUST be regularly updated with any changes from their
source branch. This MUST be done by rebasing the change branch on top of
the source branch.</li>
<li>After updating a change branch from its source branch you MUST push the
change branch to the remote server. Due to the nature of rebasing, you
will be required to do a force push, and you MUST use the
“—force-with-lease” git push option when doing so instead of the regular
“—force”.</li>
<li>If there is a truly valid technical reason to not use rebase when
updating change branches, then you can update change branches via merge
instead of rebase. The decision to use merge MUST only be taken after all
possible options to use rebase have been tried and failed. People not
understanding how to use rebase is NOT a valid reason to use merge. If
you do decide to use merge instead of rebase, you MUST NOT use a mixture
of both methods, pick one and stick to it.</li>
</ol>
</li>
<li>Pull Requests
<ol>
<li>To merge a change branch into its merge target, you MUST open a “pull
request” (or equivalent).</li>
<li>The purpose of a pull request is to allow others to review your changes
and give feedback. You can then fix any issues, complaints, and more that
might arise, and then let people review again.</li>
<li>Before creating a pull request, it is RECOMMENDED that you consider the
state of your change branchs commit history. If it is messy and
confusing, it might be a good idea to rebase your branch with “git rebase
-i” to present a cleaner and easier to follow commit history for your
reviewers.</li>
<li>A pull request MUST only be merged when the change branch is up-to-date
with its source branch, the test suite is passing, and you and others are
happy with the change. This is especially important if the merge target
is the master branch.</li>
<li>To get feedback, help, or generally just discuss a change branch with
others, the RECOMMENDED way to do so is by creating a pull request and
discuss the changes with others there.</li>
</ol>
</li>
<li>Versioning
<ol>
<li>A “version string” is a typically mostly numeric string that identifies a
specific version of a project. The version string itself MUST NOT have a
“v” prefix, but the version string can be displayed with a “v” prefix to
indicate it is a version that is being referred to.</li>
<li>The source of truth for a projects version MUST be a git tag with a name
based on the version string. This kind of tag MUST be referred to as a
“release tag”.</li>
<li>It is OPTIONAL, but RECOMMENDED to also keep the version string
hard-coded somewhere in the project code-base.</li>
<li>If you hard-code the version string into the code-base, it is RECOMMENDED
that you do so in a file called “VERSION” located in the root of the
project. But be mindful of the conventions of your programming language
and community when choosing if, where and how to hard-code the version
string.</li>
<li>If you are using a “VERSION” file in the root of the project, this file
MUST only contain the exact version string, meaning it MUST NOT have a
“v” prefix. For example “v2.11.4” is bad, and “2.11.4” is good.</li>
<li>It is OPTIONAL, but RECOMMENDED that that the version string follows
Semantic Versioning (<a href="http://semver.org/">http://semver.org/</a>).</li>
</ol>
</li>
<li>Releases
<ol>
<li>To create a new release, you MUST create a git tag named as the exact
version string of the release. This kind of tag MUST be referred to as a
“release tag”.</li>
<li>The release tag name can OPTIONALLY be prefixed with “v”. For example the
tag name can be either “2.11.4” or “v2.11.4”. It is however RECOMMENDED
that you do not use a “v” prefix. You MUST NOT use a mixture of “v”
prefixed and non-prefixed tags. Pick one form and stick to it.</li>
<li>If the version string is hard-coded into the code-base, you MUST create a
“version bump” commit which changes the hard-coded version string of the
project.</li>
<li>When using version bump commits, the release tag MUST be placed on the
version bump commit.</li>
<li>If you are not using a release branch, then the release tag, and if
relevant the version bump commit, MUST be created directly on the master
branch.</li>
<li>The version bump commit SHOULD have a commit message title of “Bump
version to VERSION”. For example, if the new version string is “2.11.4”,
the first line of the commit message SHOULD read: “Bump version to
2.11.4”</li>
<li>It is RECOMMENDED that release tags are lightweight tags, but you can
OPTIONALLY use annotated tags if you want to include changelog
information in the release tag itself.</li>
<li>If you use annotated release tags, the first line of the annotation
SHOULD read “Release VERSION”. For example for version “2.11.4” the first
line of the tag annotation SHOULD read “Release 2.11.4”. The second line
MUST be blank, and the changelog MUST start on the third line.</li>
</ol>
</li>
<li>Short-Term Release Branches
<ol>
<li>Any branch that has a name starting with “release-” SHOULD be referred to
as a “release branch”.</li>
<li>Any release branch which has a name ending with a specific version
string, MUST be referred to as a “short-term release branch”.</li>
<li>Use of short-term release branches are OPTIONAL, and intended to be used
to create a specific versioned release.</li>
<li>A short-term release branch is RECOMMENDED if there is a lengthy
pre-release verification process to avoid a code freeze on the master
branch.</li>
<li>Short-term release branches MUST have a name of “release-VERSION”. For
example for version “2.11.4” the release branch name MUST be
“release-2.11.4”.</li>
<li>When using a short-term release branch to create a release, the release
tag and if used, version bump commit, MUST be placed directly on the
short-term release branch itself.</li>
<li>Only very minor changes should be performed on a short-term release
branch directly. Any larger changes SHOULD be done in the master branch,
and SHOULD be pulled into the release branch by rebasing it on top of the
master branch the same way a change branch pulls in updates from its
source branch.</li>
<li>After a release tag has been created, the release branch MUST be merged
back into its source branch and then deleted. Typically the source branch
will be the master branch.</li>
</ol>
</li>
<li>Long-term Release Branches
<ol>
<li>Any release branch which has a name ending with a non-specific version
string, MUST be referred to as a “long-term release branch”. For example
“release-2.11” is a long-term release branch, while “release-2.11.4” is a
short-term release branch.</li>
<li>Use of long-term release branches are OPTIONAL, and intended for work on
versions which are not currently part of the master branch. Typically
this is useful when you need to create a new maintenance release for a
older version.</li>
<li>A long-term release branch MUST have a name with a non-specific version
number. For example a long-term release branch for creating new 2.9.x
releases MUST be named “release-2.9”.</li>
<li>Long-term release branches for maintenance releases of older versions
MUST be created from the relevant release tag. For example if the master
branch is on version 2.11.4 and there is a security fix for all 2.9.x
releases, the latest of which is “2.9.7”. Create a new branch called
“release-2.9” off of the “2.9.7” release tag. The security fix release
will then end up being version “2.9.8”.</li>
<li>To create a new release from a long-term release branch, you MUST follow
the same process as a release from the master branch, except the
long-term release branch takes the place of the master branch.</li>
<li>A long-term release branch should be treated with the same respect as the
master branch. It is effectively the master branch for the release series
in question. Meaning it MUST always be in a non-broken state, MUST NOT be
force pushed to, etc.</li>
</ol>
</li>
<li>Bug Fixes &#x26; Rollback
<ol>
<li>You MUST NOT under any circumstances force push to the master branch or
to long-term release branches.</li>
<li>If a change branch which has been merged into the master branch is found
to have a bug in it, the bug fix work MUST be done as a new separate
change branch and MUST follow the same workflow as any other change
branch.</li>
<li>If a change branch is wrongfully merged into master, or for any other
reason the merge must be undone, you MUST undo the merge by reverting the
merge commit itself. Effectively creating a new commit that reverses all
the relevant changes.</li>
</ol>
</li>
<li>Git Best Practices
<ol>
<li>All commit messages SHOULD follow the Commit Guidelines and format from
the official git
documentation:
<a href="https://git-scm.com/book/en/v2/Distributed-Git-Contributing-to-a-Project#_commit_guidelines">https://git-scm.com/book/en/v2/Distributed-Git-Contributing-to-a-Project#_commit_guidelines</a></li>
<li>You SHOULD never blindly commit all changes with “git commit -a”. It is
RECOMMENDED you use “git add -i” or “git add -p” to add individual
changes to the staging area so you are fully aware of what you are
committing.</li>
<li>You SHOULD always use “—force-with-lease” when doing a force push. The
regular “—force” option is dangerous and destructive. More
information:
<a href="https://developer.atlassian.com/blog/2015/04/force-with-lease/">https://developer.atlassian.com/blog/2015/04/force-with-lease/</a></li>
<li>You SHOULD understand and be comfortable with
rebasing: <a href="https://git-scm.com/book/en/v2/Git-Branching-Rebasing">https://git-scm.com/book/en/v2/Git-Branching-Rebasing</a></li>
<li>It is RECOMMENDED that you always do “git pull —rebase” instead of “git
pull” to avoid unnecessary merge commits. You can make this the default
behavior of “git pull” with “git config —global pull.rebase true”.</li>
<li>It is RECOMMENDED that all branches be merged using “git merge —no-ff”.
This makes sure the reference to the original branch is kept in the
commits, allows one to revert a merge by reverting a single merge commit,
and creates a merge commit to mark the integration of the branch with
master.</li>
</ol>
</li>
</ol>
<h2 id="faq">FAQ</h2>
<h3 id="why-use-common-flow-instead-of-git-flow-and-how-does-it-differ">Why use Common-Flow instead of Git Flow, and how does it differ?</h3>
<p>Common-Flow tries to be a lot less complicated than Git Flow by having fewer
types of branches, and simpler rules. Normal day to day development doesnt
really change much:</p>
<ul>
<li>You create change branches instead of feature branches, without the need of a
“feature/” or “change/” prefix in the branch name.</li>
<li>Change branches are typically created off of and merged back into “master”
instead of “develop”.</li>
<li>Creating a release is done by simply creating a git tag, typically on the
master branch.</li>
</ul>
<p>In detail, the main differences between Git Flow and Common-Flow are:</p>
<ul>
<li>There is no “develop” branch, there is only a “master” branch which contains
the latest work. In Git Flow the master branch effectively ends up just being
a pointer to the latest release, despite the fact that Git Flow includes
release tags too. In Common-Flow you just look at the tags to find the latest
release.</li>
<li>There are no “feature” or “hotfix” branches, theres only “change”
branches. Any branch that is not master and introduces changes is a change
branch. Change branches also dont have a enforced naming convention, they
just have to have a “descriptive name”. This makes things simpler and allows
more flexibility.</li>
<li>Release branches are available, but optional. Instead of enforcing the use of
release branches like Git Flow, Common-Flow only recommends the use of release
branches when it makes things easier. If creating a new release by tagging
“master” works for you, great, do that.</li>
</ul>
<h3 id="why-use-common-flow-instead-of-github-flow-and-how-does-it-differ">Why use Common-Flow instead of GitHub Flow, and how does it differ?</h3>
<p>Common-Flow is essentially GitHub Flow with the addition of a “Release” concept
that uses tags. It also attempts to define how certain common tasks are done,
like updating change/feature branches from their source branches for
example. This is to help end arguments about how such things are done.</p>
<p>If a deployment/release for you is just getting the latest code in the master
branch out, without caring about bumping version numbers or anything, then
GitHub Flow is a good fit for you, and you probably dont need the extras of
Common-Flow.</p>
<p>However if your deployments/releases have specific version numbers, then
Common-Flow gives you a simple set of rules of how to create and manage
releases, on top of what GitHub Flow already does.</p>
<h3 id="what-does-descriptive-name-mean-for-change-branches">What does “descriptive name” mean for change branches?</h3>
<p>It means what it sounds like. The name should be descriptive, as in by just
reading the name of the branch you should understand what the branchs purpose
is and what it does. Heres a few examples:</p>
<ul>
<li>add-2fa-support</li>
<li>fix-login-issue</li>
<li>remove-sort-by-middle-name-functionality</li>
<li>update-font-awesome</li>
<li>change-search-behavior</li>
<li>tweak-footer-style</li>
</ul>
<p>Notice how none of these have any prefixes like “feature/” or “hotfix/”, theyre
not needed when branch names are properly descriptive. However theres nothing
to say you cant use such prefixes if you want. That also means that you can add
ticket number prefixes if your team/org has that as part of its process.</p>
<h3 id="how-do-we-release-an-emergency-hotfix-when-the-master-branch-is-broken">How do we release an emergency hotfix when the master branch is broken?</h3>
<p>This should ideally never happen, however if it does you can do one of the
following:</p>
<ul>
<li>Review why the master branch is broken and revert the changes that caused the
issues. Then apply the hotfix and release.</li>
<li>Or use a short-term release branch created from the latest release tag instead
of the master branch. Apply the hotfix to the release branch, create a release
tag on the release branch, and then merge it back into master.</li>
</ul>
<p>In this situation, it is recommended you try to revert the offending changes
thats preventing a new release from master. But if that proves to be a
complicated task and youre short on time, a short-term release branch gives you
a instant fix to the situation at hand, and lets you resolve the issues with
the master branch when you have more time on your hands.</p>
<h2 id="about">About</h2>
<p>The Git Common-Flow specification is authored
by <a href="http://jimeh.me">Jim Myhrberg</a>.</p>
<p>If youd like to leave feedback,
please <a href="https://github.com/jimeh/common-flow/issues">open an issue on GitHub</a>.</p>
<h2 id="license">License</h2>
<p><a href="http://creativecommons.org/licenses/by/3.0/">Creative Commons - CC BY 3.0</a></p> </article> </div> </div> </div> </body></html>

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 18 KiB

View File

@@ -1,370 +0,0 @@
<!DOCTYPE html><html lang="en" data-astro-cid-jwirc66j> <head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="canonical" href="https://commonflow.org/spec/1.0.0-rc.5/"><title>Git Common-Flow 1.0.0-rc.5 | Git Common Flow</title><meta name="description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><meta name="author" content="Jim Myhrberg"><!-- Open Graph --><meta property="og:title" content="Git Common-Flow 1.0.0-rc.5 | Git Common Flow"><meta property="og:description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><meta property="og:type" content="website"><meta property="og:url" content="https://commonflow.org/spec/1.0.0-rc.5/"><!-- Twitter --><meta name="twitter:card" content="summary"><meta name="twitter:title" content="Git Common-Flow 1.0.0-rc.5 | Git Common Flow"><meta name="twitter:description" content="An attempt to gather a sensible selection of the most common usage patterns of git into a single and concise specification."><!-- Fonts --><link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@300;700&family=Open+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet"><link rel="stylesheet" href="/_astro/index.BMC0NJ9O.css"></head> <body data-astro-cid-jwirc66j> <div id="layout" data-astro-cid-jwirc66j> <a href="#menu" id="menuLink" class="menu-link" data-astro-cid-jyixok4n> <span data-astro-cid-jyixok4n></span> </a> <script type="module">function c(){const e=document.getElementById("layout"),n=document.getElementById("menu"),t=document.getElementById("menuLink"),s=document.getElementById("main");function i(o){o.preventDefault(),e?.classList.toggle("active"),n?.classList.toggle("active"),t?.classList.toggle("active")}function a(){e?.classList.remove("active"),n?.classList.remove("active"),t?.classList.remove("active")}t?.addEventListener("click",i),s?.addEventListener("click",()=>{e?.classList.contains("active")&&a()})}c();document.addEventListener("astro:after-swap",c);</script> <div id="menu" data-astro-cid-ssfzsv2f> <div class="menu-inner" data-astro-cid-ssfzsv2f> <ul class="menu-list" data-astro-cid-ssfzsv2f> <li class="menu-label" data-astro-cid-ssfzsv2f>Versions:</li> <li class="menu-item selected" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.5" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.5 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.4" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.4 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.3" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.3 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.2" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.2 </a> </li><li class="menu-item" data-astro-cid-ssfzsv2f> <a href="/spec/1.0.0-rc.1" class="menu-link-item" data-astro-cid-ssfzsv2f> 1.0.0-rc.1 </a> </li> </ul> </div> <div class="links" data-astro-cid-ssfzsv2f> <a href="https://github.com/jimeh/common-flow" aria-label="View on GitHub" class="github-link" data-astro-cid-ssfzsv2f> <svg class="w-12 h-12" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true" data-astro-cid-ssfzsv2f> <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839
9.504.5.092.682-.217.682-.483
0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608
1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088
2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951
0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65
0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004
1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546
1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028
2.688 0 3.848-2.339 4.695-4.566
4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012
2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22
6.484 17.522 2 12 2z" clip-rule="evenodd" data-astro-cid-ssfzsv2f></path> </svg> </a> </div> </div> <div id="main" data-astro-cid-jwirc66j> <div class="content" data-astro-cid-jwirc66j> <article class="spec-content"> <h1 id="git-common-flow-100-rc5">Git Common-Flow 1.0.0-rc.5</h1>
<img src="/spec/1.0.0-rc.5.svg" alt="Git Common-Flow 1.0.0-rc.5 diagram" width="100%">
<h2 id="introduction">Introduction</h2>
<p>Common-Flow is an attempt to gather a sensible selection of the most common
usage patterns of git into a single and concise specification. It is based on
the <a href="http://scottchacon.com/2011/08/31/github-flow.html">original variant</a>
of <a href="https://guides.github.com/introduction/flow/">GitHub Flow</a>, while taking
into account how a lot of open source projects most commonly use git.</p>
<p>In short, Common-Flow is essentially GitHub Flow with the addition of versioned
releases, optional release branches, and without the requirement to deploy to
production all the time.</p>
<h2 id="summary">Summary</h2>
<ul>
<li>The “master” branch is the mainline branch with latest changes, and must not
be broken.</li>
<li>Changes (features, bugfixes, etc.) are done on “change branches” created from
the master branch.</li>
<li>Rebase change branches <a href="https://i.imgur.com/1RS8x2d.png">early and often</a>.</li>
<li>When a change branch is stable and ready, it is merged back in to master.</li>
<li>A release is just a git tag whos name is the exact release version string
(e.g. “2.11.4”).</li>
<li>Release branches can be used to avoid change freezes on master. They are not
required, instead they are available if you need them.</li>
</ul>
<h2 id="terminology">Terminology</h2>
<ul>
<li><strong>Master Branch</strong> - Must be named “master”, must always have passing tests,
and is not guaranteed to always work in production environments.</li>
<li><strong>Change Branches</strong> - Any branch that introduces changes like a new feature, a
bug fix, etc.</li>
<li><strong>Source Branch</strong> - The branch that a change branch was created from. New
changes in the source branch should be incorporated into the change branch via
rebasing.</li>
<li><strong>Merge Target</strong> - A branch that is the intended merge target for a change
branch. Typically the merge target branch will be the same as the source
branch.</li>
<li><strong>Pull Request</strong> - A means of requesting that a change branch is merged in to
its merge target, allowing others to review, discuss and approve the changes.</li>
<li><strong>Release</strong> - May be considered safe to use in production environments. Is
effectively just a git tag named after the version of the release.</li>
<li><strong>Release Branches</strong> - Used both for short-term preparations of a release, and
also for long-term maintenance of older version.</li>
</ul>
<h2 id="git-common-flow-specification-common-flow">Git Common-Flow Specification (Common-Flow)</h2>
<p>The key words “MUST”, “MUST NOT”, “REQUIRED”, “SHALL”, “SHALL NOT”, “SHOULD”,
“SHOULD NOT”, “RECOMMENDED”, “MAY”, and “OPTIONAL” in this document are to be
interpreted as described in <a href="https://tools.ietf.org/html/rfc2119">RFC 2119</a>.</p>
<ol>
<li>TL;DR
<ol>
<li>Do not break the master branch.</li>
<li>A release is a git tag.</li>
</ol>
</li>
<li>The Master Branch
<ol>
<li>A branch named “master” MUST exist and it MUST be referred to as the
“master branch”.</li>
<li>The master branch MUST always be in a non-broken state with its test
suite passing.</li>
<li>The master branch IS NOT guaranteed to always work in production
environments. Despite test suites passing it may at times contain
unfinished work. Only releases may be considered safe for production use.</li>
<li>The master branch SHOULD always be in a “as near as possibly ready for
release/production” state to reduce any friction with creating a new
release.</li>
</ol>
</li>
<li>Change Branches
<ol>
<li>Each change (feature, bugfix, etc.) MUST be performed on separate
branches that SHOULD be referred to as “change branches”.</li>
<li>All change branches MUST have descriptive names.</li>
<li>It is RECOMMENDED that you commit often locally, and that you try and
keep the commits reasonably structured to avoid a messy and confusing git
history.</li>
<li>You SHOULD regularly push your work to the same named branch on the
remote server.</li>
<li>You SHOULD create separate change branches for each distinctly different
change. You SHOULD NOT include multiple unrelated changes into a single
change branch.</li>
<li>When a change branch is created, the branch that it is created from
SHOULD be referred to as the “source branch”. Each change branch also
needs a designated “merge target” branch, typically this will be the same
as the source branch.</li>
<li>Change branches MUST be regularly updated with any changes from their
source branch. This MUST be done by rebasing the change branch on top of
the source branch.</li>
<li>After updating a change branch from its source branch you MUST push the
change branch to the remote server. Due to the nature of rebasing, you
will be required to do a force push, and you MUST use the
“—force-with-lease” git push option when doing so instead of the regular
“—force”.</li>
<li>If there is a truly valid technical reason to not use rebase when
updating change branches, then you can update change branches via merge
instead of rebase. The decision to use merge MUST only be taken after all
possible options to use rebase have been tried and failed. People not
understanding how to use rebase is NOT a valid reason to use merge. If
you do decide to use merge instead of rebase, you MUST NOT use a mixture
of both methods, pick one and stick to it.</li>
</ol>
</li>
<li>Pull Requests
<ol>
<li>To merge a change branch into its merge target, you MUST open a “pull
request” (or equivalent).</li>
<li>The purpose of a pull request is to allow others to review your changes
and give feedback. You can then fix any issues, complaints, and more that
might arise, and then let people review again.</li>
<li>Before creating a pull request, it is RECOMMENDED that you consider the
state of your change branchs commit history. If it is messy and
confusing, it might be a good idea to rebase your branch with “git rebase
-i” to present a cleaner and easier to follow commit history for your
reviewers.</li>
<li>A pull request MUST only be merged when the change branch is up-to-date
with its source branch, the test suite is passing, and you and others are
happy with the change. This is especially important if the merge target
is the master branch.</li>
<li>To get feedback, help, or generally just discuss a change branch with
others, it is RECOMMENDED you create a pull request and discuss the
changes with others there. This leaves a clear and visible history of
how, when, and why the code looks and behaves the way it does.</li>
</ol>
</li>
<li>Versioning
<ol>
<li>A “version string” is a typically mostly numeric string that identifies a
specific version of a project. The version string itself MUST NOT have a
“v” prefix, but the version string can be displayed with a “v” prefix to
indicate it is a version that is being referred to.</li>
<li>The source of truth for a projects version MUST be a git tag with a name
based on the version string. This kind of tag MUST be referred to as a
“release tag”.</li>
<li>It is OPTIONAL, but RECOMMENDED to also keep the version string
hard-coded somewhere in the project code-base.</li>
<li>If you hard-code the version string into the code-base, it is RECOMMENDED
that you do so in a file called “VERSION” located in the root of the
project. But be mindful of the conventions of your programming language
and community when choosing if, where and how to hard-code the version
string.</li>
<li>If you are using a “VERSION” file in the root of the project, this file
MUST only contain the exact version string, meaning it MUST NOT have a
“v” prefix. For example “v2.11.4” is bad, and “2.11.4” is good.</li>
<li>It is OPTIONAL, but RECOMMENDED that that the version string follows
Semantic Versioning (<a href="http://semver.org/">http://semver.org/</a>).</li>
</ol>
</li>
<li>Releases
<ol>
<li>To create a new release, you MUST create a git tag named as the exact
version string of the release. This kind of tag MUST be referred to as a
“release tag”.</li>
<li>The release tag name can OPTIONALLY be prefixed with “v”. For example the
tag name can be either “2.11.4” or “v2.11.4”. It is however RECOMMENDED
that you do not use a “v” prefix. You MUST NOT use a mixture of “v”
prefixed and non-prefixed tags. Pick one form and stick to it.</li>
<li>If the version string is hard-coded into the code-base, you MUST create a
“version bump” commit which changes the hard-coded version string of the
project.</li>
<li>When using version bump commits, the release tag MUST be placed on the
version bump commit.</li>
<li>If you are not using a release branch, then the release tag, and if
relevant the version bump commit, MUST be created directly on the master
branch.</li>
<li>The version bump commit SHOULD have a commit message title of “Bump
version to VERSION”. For example, if the new version string is “2.11.4”,
the first line of the commit message SHOULD read: “Bump version to
2.11.4”</li>
<li>It is RECOMMENDED that release tags are lightweight tags, but you can
OPTIONALLY use annotated tags if you want to include changelog
information in the release tag itself.</li>
<li>If you use annotated release tags, the first line of the annotation
SHOULD read “Release VERSION”. For example for version “2.11.4” the first
line of the tag annotation SHOULD read “Release 2.11.4”. The second line
MUST be blank, and the changelog MUST start on the third line.</li>
</ol>
</li>
<li>Short-Term Release Branches
<ol>
<li>Any branch that has a name starting with “release-” SHOULD be referred to
as a “release branch”.</li>
<li>Any release branch which has a name ending with a specific version
string, MUST be referred to as a “short-term release branch”.</li>
<li>Use of short-term release branches are OPTIONAL, and intended to be used
to create a specific versioned release.</li>
<li>A short-term release branch is RECOMMENDED if there is a lengthy
pre-release verification process to avoid a code freeze on the master
branch.</li>
<li>Short-term release branches MUST have a name of “release-VERSION”. For
example for version “2.11.4” the release branch name MUST be
“release-2.11.4”.</li>
<li>When using a short-term release branch to create a release, the release
tag and if used, version bump commit, MUST be placed directly on the
short-term release branch itself.</li>
<li>Only very minor changes should be performed on a short-term release
branch directly. Any larger changes SHOULD be done in the master branch,
and SHOULD be pulled into the release branch by rebasing it on top of the
master branch the same way a change branch pulls in updates from its
source branch.</li>
<li>After a release tag has been created, the release branch MUST be merged
back into its source branch and then deleted. Typically the source branch
will be the master branch.</li>
</ol>
</li>
<li>Long-term Release Branches
<ol>
<li>Any release branch which has a name ending with a non-specific version
string, MUST be referred to as a “long-term release branch”. For example
“release-2.11” is a long-term release branch, while “release-2.11.4” is a
short-term release branch.</li>
<li>Use of long-term release branches are OPTIONAL, and intended for work on
versions which are not currently part of the master branch. Typically
this is useful when you need to create a new maintenance release for a
older version.</li>
<li>A long-term release branch MUST have a name with a non-specific version
number. For example a long-term release branch for creating new 2.9.x
releases MUST be named “release-2.9”.</li>
<li>Long-term release branches for maintenance releases of older versions
MUST be created from the relevant release tag. For example if the master
branch is on version 2.11.4 and there is a security fix for all 2.9.x
releases, the latest of which is “2.9.7”. Create a new branch called
“release-2.9” from the “2.9.7” release tag. The security fix release will
then end up being version “2.9.8”.</li>
<li>To create a new release from a long-term release branch, you MUST follow
the same process as a release from the master branch, except the
long-term release branch takes the place of the master branch.</li>
<li>A long-term release branch should be treated with the same respect as the
master branch. It is effectively the master branch for the release series
in question. Meaning it MUST always be in a non-broken state, MUST NOT be
force pushed to, etc.</li>
</ol>
</li>
<li>Bug Fixes &#x26; Rollback
<ol>
<li>You MUST NOT under any circumstances force push to the master branch or
to long-term release branches.</li>
<li>If a change branch which has been merged into the master branch is found
to have a bug in it, the bug fix work MUST be done as a new separate
change branch and MUST follow the same workflow as any other change
branch.</li>
<li>If a change branch is wrongfully merged into master, or for any other
reason the merge must be undone, you MUST undo the merge by reverting the
merge commit itself. Effectively creating a new commit that reverses all
the relevant changes.</li>
</ol>
</li>
<li>Git Best Practices
<ol>
<li>All commit messages SHOULD follow the Commit Guidelines and format from
the official git
documentation:
<a href="https://git-scm.com/book/en/v2/Distributed-Git-Contributing-to-a-Project#_commit_guidelines">https://git-scm.com/book/en/v2/Distributed-Git-Contributing-to-a-Project#_commit_guidelines</a></li>
<li>You SHOULD never blindly commit all changes with “git commit -a”. It is
RECOMMENDED you use “git add -i” or “git add -p” to add individual
changes to the staging area so you are fully aware of what you are
committing.</li>
<li>You SHOULD always use “—force-with-lease” when doing a force push. The
regular “—force” option is dangerous and destructive. More
information:
<a href="https://developer.atlassian.com/blog/2015/04/force-with-lease/">https://developer.atlassian.com/blog/2015/04/force-with-lease/</a></li>
<li>You SHOULD understand and be comfortable with
rebasing: <a href="https://git-scm.com/book/en/v2/Git-Branching-Rebasing">https://git-scm.com/book/en/v2/Git-Branching-Rebasing</a></li>
<li>It is RECOMMENDED that you always do “git pull —rebase” instead of “git
pull” to avoid unnecessary merge commits. You can make this the default
behavior of “git pull” with “git config —global pull.rebase true”.</li>
<li>It is RECOMMENDED that all branches be merged using “git merge —no-ff”.
This makes sure the reference to the original branch is kept in the
commits, allows one to revert a merge by reverting a single merge commit,
and creates a merge commit to mark the integration of the branch with
master.</li>
</ol>
</li>
</ol>
<h2 id="faq">FAQ</h2>
<h3 id="why-use-common-flow-instead-of-git-flow-and-how-does-it-differ">Why use Common-Flow instead of Git Flow, and how does it differ?</h3>
<p>Common-Flow tries to be a lot less complicated than Git Flow by having fewer
types of branches, and simpler rules. Normal day to day development doesnt
really change much:</p>
<ul>
<li>You create change branches instead of feature branches, without the need of a
“feature/” or “change/” prefix in the branch name.</li>
<li>Change branches are typically created from and merged back into “master”
instead of “develop”.</li>
<li>Creating a release is done by simply creating a git tag, typically on the
master branch.</li>
</ul>
<p>In detail, the main differences between Git Flow and Common-Flow are:</p>
<ul>
<li>There is no “develop” branch, there is only a “master” branch which contains
the latest work. In Git Flow the master branch effectively ends up just being
a pointer to the latest release, despite the fact that Git Flow includes
release tags too. In Common-Flow you just look at the tags to find the latest
release.</li>
<li>There are no “feature” or “hotfix” branches, theres only “change”
branches. Any branch that is not master and introduces changes is a change
branch. Change branches also dont have a enforced naming convention, they
just have to have a “descriptive name”. This makes things simpler and allows
more flexibility.</li>
<li>Release branches are available, but optional. Instead of enforcing the use of
release branches like Git Flow, Common-Flow only recommends the use of release
branches when it makes things easier. If creating a new release by tagging
“master” works for you, great, do that.</li>
</ul>
<h3 id="why-use-common-flow-instead-of-github-flow-and-how-does-it-differ">Why use Common-Flow instead of GitHub Flow, and how does it differ?</h3>
<p>Common-Flow is essentially GitHub Flow with the addition of a “Release” concept
that uses tags. It also attempts to define how certain common tasks are done,
like updating change/feature branches from their source branches for
example. This is to help end arguments about how such things are done.</p>
<p>If a deployment/release for you is just getting the latest code in the master
branch out, without caring about bumping version numbers or anything, then
GitHub Flow is a good fit for you, and you probably dont need the extras of
Common-Flow.</p>
<p>However if your deployments/releases have specific version numbers, then
Common-Flow gives you a simple set of rules of how to create and manage
releases, on top of what GitHub Flow already does.</p>
<h3 id="what-does-descriptive-name-mean-for-change-branches">What does “descriptive name” mean for change branches?</h3>
<p>It means what it sounds like. The name should be descriptive, as in by just
reading the name of the branch you should understand what the branchs purpose
is and what it does. Heres a few examples:</p>
<ul>
<li>add-2fa-support</li>
<li>fix-login-issue</li>
<li>remove-sort-by-middle-name-functionality</li>
<li>update-font-awesome</li>
<li>change-search-behavior</li>
<li>improve-pagination-performance</li>
<li>tweak-footer-style</li>
</ul>
<p>Notice how none of these have any prefixes like “feature/” or “hotfix/”, theyre
not needed when branch names are properly descriptive. However theres nothing
to say you cant use such prefixes if you want.</p>
<p>You can also add ticket numbers to the branch name if your team/org has that as
part of its process. But it is recommended that ticket numbers are added to the
end of the branch name. The ticket number is essentially metadata, so put it at
the end and out of the way of humans trying to read the descriptive name from
left to right.</p>
<h3 id="how-do-we-release-an-emergency-hotfix-when-the-master-branch-is-broken">How do we release an emergency hotfix when the master branch is broken?</h3>
<p>This should ideally never happen, however if it does you can do one of the
following:</p>
<ul>
<li>Review why the master branch is broken and revert the changes that caused the
issues. Then apply the hotfix and release.</li>
<li>Or use a short-term release branch created from the latest release tag instead
of the master branch. Apply the hotfix to the release branch, create a release
tag on the release branch, and then merge it back into master.</li>
</ul>
<p>In this situation, it is recommended you try to revert the offending changes
thats preventing a new release from master. But if that proves to be a
complicated task and youre short on time, a short-term release branch gives you
a instant fix to the situation at hand, and lets you resolve the issues with
the master branch when you have more time on your hands.</p>
<h2 id="about">About</h2>
<p>The Git Common-Flow specification is authored
by <a href="https://jimeh.me/">Jim Myhrberg</a>.</p>
<p>If youd like to leave feedback,
please <a href="https://github.com/jimeh/common-flow/issues">open an issue on GitHub</a>.</p>
<h2 id="license">License</h2>
<p><a href="https://creativecommons.org/licenses/by/4.0/">Creative Commons - CC BY 4.0</a></p> </article> </div> </div> </div> </body></html>

21
eslint.config.js Normal file
View File

@@ -0,0 +1,21 @@
import eslint from "@eslint/js";
import tseslint from "typescript-eslint";
import astro from "eslint-plugin-astro";
export default tseslint.config(
eslint.configs.recommended,
...tseslint.configs.recommended,
...astro.configs.recommended,
{
ignores: ["docs/**", ".astro/**"],
},
{
rules: {
// Allow unused vars prefixed with _
"@typescript-eslint/no-unused-vars": [
"error",
{ argsIgnorePattern: "^_", varsIgnorePattern: "^_" },
],
},
},
);

3403
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@@ -1,23 +1,49 @@
{
"name": "commonflow-org",
"type": "module",
"version": "0.0.1",
"version": "2.0.0",
"scripts": {
"dev": "astro dev",
"build": "astro build",
"preview": "astro preview",
"update": "tsx scripts/update-specs.ts",
"check": "astro check",
"lint": "eslint .",
"format": "prettier --write .",
"format:check": "prettier --check .",
"update-specs": "tsx scripts/update-specs.ts",
"astro": "astro"
},
"dependencies": {
"@astrojs/sitemap": "^3.2.1",
"astro": "^5.1.1"
"@astrojs/sitemap": "^3.6.1",
"@fontsource-variable/bricolage-grotesque": "^5.2.10",
"@fontsource-variable/dm-sans": "^5.2.8",
"@fontsource-variable/jetbrains-mono": "^5.2.8",
"@iconify-json/heroicons": "^1.2.3",
"@iconify-json/simple-icons": "^1.2.65",
"astro": "^5.16.8",
"astro-icon": "^1.1.5",
"rehype-autolink-headings": "^7.1.0",
"rehype-slug": "^6.0.0",
"rehype-stringify": "^10.0.1",
"remark-parse": "^11.0.0",
"remark-rehype": "^11.1.2",
"semver": "^7.7.3",
"unified": "^11.0.5"
},
"devDependencies": {
"@tailwindcss/typography": "^0.5.16",
"@tailwindcss/vite": "^4.0.0",
"tailwindcss": "^4.0.0",
"tsx": "^4.19.2",
"typescript": "^5.7.2"
"@astrojs/check": "^0.9.6",
"@eslint/js": "^9.39.2",
"@tailwindcss/typography": "^0.5.19",
"@tailwindcss/vite": "^4.1.18",
"@types/semver": "^7.7.1",
"eslint": "^9.39.2",
"eslint-plugin-astro": "^1.5.0",
"prettier": "^3.7.4",
"prettier-plugin-astro": "^0.14.1",
"svgo": "^4.0.0",
"tailwindcss": "^4.1.18",
"tsx": "^4.21.0",
"typescript": "^5.9.3",
"typescript-eslint": "^8.52.0"
}
}

12
prettier.config.js Normal file
View File

@@ -0,0 +1,12 @@
/** @type {import("prettier").Config} */
export default {
plugins: ["prettier-plugin-astro"],
overrides: [
{
files: "*.astro",
options: {
parser: "astro",
},
},
],
};

View File

BIN
public/apple-touch-icon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
public/favicon.ico Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

17
public/favicon.svg Normal file
View File

@@ -0,0 +1,17 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
<!-- Main horizontal line -->
<path d="M 4 10 L 28 10" fill="none" stroke="currentColor" stroke-width="2"/>
<!-- Branch line: down from left, curve, up to right -->
<path d="M 8 10 L 8 16 Q 8 22 16 22 Q 24 22 24 16 L 24 10"
fill="none" stroke="currentColor" stroke-width="2"/>
<!-- Left dot on main line -->
<circle cx="8" cy="10" r="3" fill="currentColor"/>
<!-- Right dot on main line -->
<circle cx="24" cy="10" r="3" fill="currentColor"/>
<!-- Middle dot on branch -->
<circle cx="16" cy="22" r="3" fill="currentColor"/>
</svg>

After

Width:  |  Height:  |  Size: 625 B

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 18 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 18 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 18 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 18 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 18 KiB

View File

@@ -2,43 +2,95 @@
* Fetches spec documents and diagrams from the common-flow GitHub repo
* and writes them to the appropriate locations for Astro to consume.
*
* Equivalent to the Jekyll Rakefile's `rake update` task.
* Versions are discovered from git tags and filtered based on config.
*/
import { execSync } from "node:child_process";
import * as fs from "node:fs";
import * as path from "node:path";
import * as semver from "semver";
import { optimize as optimizeSvg, type Config as SvgoConfig } from "svgo";
import { config } from "../src/config";
const config = {
currentVersion: "1.0.0-rc.5",
versions: [
"1.0.0-rc.5",
"1.0.0-rc.4",
"1.0.0-rc.3",
"1.0.0-rc.2",
"1.0.0-rc.1",
],
update: {
urlTemplate:
"https://github.com/jimeh/common-flow/raw/{{version}}/{{file}}",
bodyTemplate: `---
const updateConfig = {
bodyTemplate: `---
title: {{title}}
version: {{version}}
---
{{content}}`,
imgTemplate:
'<img src="/spec/{{file}}" alt="{{title}} diagram" width="100%" />',
outputDir: "src/content/spec",
publicDir: "public/spec",
files: {
document: "common-flow.md",
diagram: "common-flow.svg",
},
},
outputDir: "src/content/spec",
};
// SVGO config: use removeDimensions to convert width/height to viewBox
// for responsive scaling while preserving aspect ratio
const svgoConfig: SvgoConfig = {
plugins: ["preset-default", "removeDimensions"],
};
/**
* Fetch all tags from the GitHub repository.
*/
function fetchTags(repository: string): string[] {
const repoUrl = `https://github.com/${repository}.git`;
console.log(`Fetching tags from ${repoUrl}...`);
try {
const result = execSync(`git ls-remote --tags ${repoUrl}`, {
encoding: "utf-8",
});
return result
.split("\n")
.filter(Boolean)
.map((line: string) => line.match(/refs\/tags\/(.+)$/)?.[1])
.filter(
(tag: string | undefined): tag is string =>
tag !== undefined && !tag.endsWith("^{}"),
);
} catch (error) {
throw new Error(
`Failed to fetch tags: ${error instanceof Error ? error.message : String(error)}`,
);
}
}
/**
* Get the prerelease type of a version (e.g., "rc", "draft", or null for
* stable).
*/
function getPrereleaseType(version: string): string | null {
const prerelease = semver.prerelease(version);
if (!prerelease) return null;
return String(prerelease[0]);
}
/**
* Filter tags based on discovery configuration.
* Stable versions are always included; prereleases only if their type is in
* the includePrereleaseTypes list.
*/
function filterVersions(tags: string[]): string[] {
const { includePrereleaseTypes, excludeVersions } = config.update.discovery;
return tags.filter((tag) => {
// Must be valid semver
if (!semver.valid(tag)) return false;
// Check explicit exclusions
if (excludeVersions.includes(tag)) return false;
// Stable versions are always included
const prereleaseType = getPrereleaseType(tag);
if (prereleaseType === null) return true;
// Prereleases only if their type is in the list
return includePrereleaseTypes.includes(prereleaseType);
});
}
function buildFileUrl(
fileType: "document" | "diagram",
version: string
version: string,
): string {
const file = config.update.files[fileType];
return config.update.urlTemplate
@@ -67,19 +119,34 @@ function writeFile(filePath: string, content: string, comment = ""): void {
console.log(` - ${filePath}${comment}`);
}
function removeAllSpecs(): void {
console.log("\nRemoving existing spec files:");
/**
* Remove spec files for versions not in the provided list.
* Files for versions in the list are left alone (they'll be overwritten).
*/
function removeStaleSpecs(versionsToKeep: string[]): void {
const keepSet = new Set(versionsToKeep);
let removedAny = false;
for (const dir of [config.update.outputDir, config.update.publicDir]) {
if (fs.existsSync(dir)) {
const files = fs.readdirSync(dir);
for (const file of files) {
const filePath = path.join(dir, file);
fs.unlinkSync(filePath);
console.log(` ${filePath}`);
if (!fs.existsSync(updateConfig.outputDir)) return;
const files = fs.readdirSync(updateConfig.outputDir);
for (const file of files) {
// Extract version from filename (e.g., "1.0.0-rc.1.md" -> "1.0.0-rc.1")
const version = path.basename(file, path.extname(file));
if (!keepSet.has(version)) {
if (!removedAny) {
console.log("\nRemoving stale spec files:");
removedAny = true;
}
const filePath = path.join(updateConfig.outputDir, file);
fs.unlinkSync(filePath);
console.log(` ${filePath}`);
}
}
if (!removedAny) {
console.log("\nNo stale spec files to remove.");
}
}
interface Spec {
@@ -100,22 +167,22 @@ async function fetchSpec(version: string): Promise<Spec> {
throw new Error(`Failed to fetch document for version ${version}`);
}
// Replace {{version}} placeholder throughout the document
document = document.replaceAll("{{version}}", version);
// Replace {{version}} placeholder with v-prefixed version
document = document.replaceAll("{{version}}", `v${version}`);
// Extract title from first line (after version replacement)
const title = document.split("\n", 1)[0];
// If diagram exists, inject image tag after the title
if (diagram) {
const imgTag = config.update.imgTemplate
.replace("{{file}}", `${version}.svg`)
.replace("{{title}}", title);
document = document.replace(/^(.*\n=+\n)/, `$1\n${imgTag}\n`);
// Handle setext-style H1 heading (title with === underline)
const lines = document.split("\n");
if (lines.length >= 2 && /^=+$/.test(lines[1])) {
// Adjust the underline length to match the title
lines[1] = "=".repeat(lines[0].length);
document = lines.join("\n");
}
// Extract title from first line (after version replacement)
const title = lines[0];
// Build body with frontmatter
const body = config.update.bodyTemplate
const body = updateConfig.bodyTemplate
.replace("{{content}}", document)
.replace("{{title}}", title)
.replace("{{version}}", version);
@@ -129,22 +196,40 @@ async function fetchSpec(version: string): Promise<Spec> {
}
async function main(): Promise<void> {
removeAllSpecs();
// 1. Discover and filter versions
const tags = fetchTags(config.update.repository);
console.log(`Found ${tags.length} tags`);
console.log("\nFetching configured spec versions:");
const filtered = filterVersions(tags);
const sorted = semver.rsort([...filtered]);
for (const version of config.versions) {
console.log(`\nIncluded ${sorted.length} versions after filtering:`);
console.log(` ${sorted.join(", ")}`);
if (sorted.length === 0) {
console.error("\nNo versions to process. Exiting.");
process.exit(1);
}
// 2. Remove spec files for versions no longer in the list
removeStaleSpecs(sorted);
// 3. Fetch specs for all versions
console.log("\nFetching spec documents:");
for (const version of sorted) {
try {
const spec = await fetchSpec(version);
// Write markdown file to content collection
const mdPath = path.join(config.update.outputDir, `${version}.md`);
const mdPath = path.join(updateConfig.outputDir, `${version}.md`);
writeFile(mdPath, spec.body);
// Write SVG diagram to public directory
// Write SVG diagram next to markdown (with metadata stripped)
if (spec.diagram) {
const svgPath = path.join(config.update.publicDir, `${version}.svg`);
writeFile(svgPath, spec.diagram);
const svgPath = path.join(updateConfig.outputDir, `${version}.svg`);
const optimizedSvg = optimizeSvg(spec.diagram, svgoConfig).data;
writeFile(svgPath, optimizedSvg);
}
} catch (error) {
console.error(`Error processing version ${version}:`, error);

View File

@@ -0,0 +1,72 @@
---
import SectionHeader from "./SectionHeader.astro";
import { config } from "../config";
interface Props {
introduction: string;
summary: string;
license: string;
}
const { introduction, summary, license } = Astro.props;
---
<section id="about" class="py-20 sm:py-28">
<div class="section-container">
<div class="max-w-3xl mx-auto">
<SectionHeader
title="About Common-Flow"
subtitle="A practical git workflow that combines the best of GitHub Flow with versioned releases"
/>
<!-- Introduction -->
<div class="prose-spec mb-12" set:html={introduction} />
<!-- Summary as feature cards -->
<div class="mb-16">
<h3
class="text-xl font-display font-semibold mb-6
text-gray-950 dark:text-neutral-50"
>
Key Principles
</h3>
<div class="prose-spec" set:html={summary} />
</div>
<!-- Feedback & License -->
<div class="pt-8 border-t border-gray-200 dark:border-neutral-800">
<div class="grid sm:grid-cols-2 gap-8">
<div>
<h4
class="text-sm font-semibold uppercase tracking-wider mb-3
text-gray-500 dark:text-neutral-500"
>
Feedback
</h4>
<p class="text-gray-600 dark:text-neutral-400">
Please{" "}
<a
href={`${config.repoUrl}/issues`}
class="text-sky-600 hover:text-sky-400"
target="_blank"
rel="noopener noreferrer">open an issue on GitHub</a
>.
</p>
</div>
<div>
<h4
class="text-sm font-semibold uppercase tracking-wider mb-3
text-gray-500 dark:text-neutral-500"
>
License
</h4>
<div
class="text-gray-600 dark:text-neutral-400"
set:html={license}
/>
</div>
</div>
</div>
</div>
</div>
</section>

View File

@@ -0,0 +1,92 @@
---
import { Icon } from "astro-icon/components";
import SectionHeader from "./SectionHeader.astro";
import type { FAQItem } from "../utils/parseSpecContent";
interface Props {
items: FAQItem[];
}
const { items } = Astro.props;
---
<section id="faq" class="py-20 sm:py-28">
<div class="section-container">
<div class="max-w-3xl mx-auto">
<SectionHeader
title="FAQ"
subtitle="Common questions about Git Common-Flow"
/>
<!-- FAQ Items -->
<div class="space-y-0">
{
items.map((item) => (
<div
class="border-b border-gray-200 dark:border-neutral-800"
data-faq-item
>
<button
class="flex justify-between items-center w-full py-6 text-left
font-display text-lg font-semibold cursor-pointer
transition-colors
text-gray-950 dark:text-neutral-50
hover:text-sky-600"
aria-expanded="false"
data-faq-trigger
>
<span class="pr-4">{item.question}</span>
<Icon
name="heroicons:chevron-down"
class="w-5 h-5 flex-shrink-0 transition-transform duration-200"
data-faq-icon
/>
</button>
<div
class="grid grid-rows-[0fr] transition-[grid-template-rows] duration-300 ease-out"
data-faq-content
>
<div class="overflow-hidden">
<div
class="pb-6 text-gray-600 dark:text-neutral-400 prose-spec"
set:html={item.answer}
/>
</div>
</div>
</div>
))
}
</div>
</div>
</div>
</section>
<script>
function initFAQ() {
const items = document.querySelectorAll("[data-faq-item]");
items.forEach((item) => {
const trigger = item.querySelector("[data-faq-trigger]");
const content = item.querySelector("[data-faq-content]");
const icon = item.querySelector("[data-faq-icon]");
if (!trigger || !content || !icon) return;
trigger.addEventListener("click", () => {
const isExpanded = trigger.getAttribute("aria-expanded") === "true";
// Toggle current item
trigger.setAttribute("aria-expanded", isExpanded ? "false" : "true");
content.classList.toggle("grid-rows-[1fr]", !isExpanded);
content.classList.toggle("grid-rows-[0fr]", isExpanded);
icon.classList.toggle("rotate-180", !isExpanded);
});
});
}
// Initialize on load
initFAQ();
// Re-initialize on Astro page transitions
document.addEventListener("astro:after-swap", initFAQ);
</script>

View File

@@ -0,0 +1,37 @@
---
import { config } from "../config";
---
<footer
class="pt-12 pb-6 my-28 text-sm
text-gray-500 dark:text-neutral-500
border-t border-gray-200 dark:border-neutral-800"
>
<div
class="section-container flex flex-col items-center text-center
sm:flex-row sm:justify-between sm:items-center sm:text-left gap-2"
>
<p>
License:
<a
href={config.license.url}
class="hover:text-sky-600"
target="_blank"
rel="noopener noreferrer"
>
{config.license.name}
</a>
</p>
<p>
{config.title} by
<a
href={config.authorUrl}
class="hover:text-sky-600"
target="_blank"
rel="noopener noreferrer"
>
{config.author}
</a>
</p>
</div>
</footer>

182
src/components/Header.astro Normal file
View File

@@ -0,0 +1,182 @@
---
import { Icon } from "astro-icon/components";
import VersionSelector from "./VersionSelector.astro";
import ThemeToggle from "./ThemeToggle.astro";
import { config } from "../config";
interface Props {
version: string;
versions: string[];
}
const { version, versions } = Astro.props;
const navItems = [
{ id: "about", label: "About", icon: "heroicons:information-circle" },
{ id: "spec", label: "Spec", icon: "heroicons:document-text" },
{ id: "faq", label: "FAQ", icon: "heroicons:question-mark-circle" },
];
---
<header
id="site-header"
class="fixed top-0 inset-x-0 z-50 border-b border-transparent
translate-y-[-100%] transition-transform duration-300
backdrop-blur-xl bg-gray-50/85 dark:bg-neutral-950/85"
>
<div
class="max-w-6xl mx-auto px-4 sm:px-6 h-16 flex items-center justify-between"
>
<!-- Logo / Title + Version -->
<div class="flex items-center gap-3">
<a
href="#top"
class="flex items-center gap-3 no-underline
text-gray-950 dark:text-neutral-50
hover:text-sky-600 transition-colors"
>
<span class="font-display font-bold text-lg tracking-tight">
Git Common-Flow
</span>
</a>
<div class="hidden md:block">
<VersionSelector currentVersion={version} versions={versions} />
</div>
</div>
<!-- Desktop Navigation -->
<nav class="hidden md:flex items-center gap-1">
{
navItems.map((item) => (
<a
href={`#${item.id}`}
class="nav-link inline-flex items-center gap-1.5 px-4 py-2 text-sm
font-medium rounded-lg transition-colors cursor-pointer
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-neutral-800 dark:hover:text-neutral-50"
data-nav-link
data-section-id={item.id}
>
<Icon name={item.icon} class="w-4 h-4" />
{item.label}
</a>
))
}
</nav>
<!-- Right side: Theme, GitHub -->
<div class="flex items-center gap-3">
<ThemeToggle />
<a
href={config.repoUrl}
target="_blank"
rel="noopener noreferrer"
class="p-2 rounded-lg transition-colors
text-gray-500 dark:text-neutral-500
hover:text-gray-950 dark:hover:text-neutral-50
hover:bg-gray-100 dark:hover:bg-neutral-800"
aria-label="View on GitHub"
>
<Icon name="simple-icons:github" class="w-5 h-5" />
</a>
<!-- Mobile menu button -->
<button
id="mobile-menu-btn"
class="md:hidden p-2 rounded-lg
text-gray-500 dark:text-neutral-500
hover:bg-gray-100 dark:hover:bg-neutral-800"
aria-label="Toggle menu"
>
<Icon name="heroicons:bars-3" class="w-5 h-5" />
</button>
</div>
</div>
<!-- Mobile Navigation -->
<nav
id="mobile-nav"
class="md:hidden hidden border-t border-gray-200 dark:border-neutral-800"
>
<div class="px-4 py-3 space-y-1 text-center">
<div class="py-2 flex justify-center">
<VersionSelector currentVersion={version} versions={versions} />
</div>
{
navItems.map((item) => (
<a
href={`#${item.id}`}
class="nav-link flex items-center justify-center gap-1.5 py-2
text-gray-600 dark:text-neutral-400 hover:text-sky-600"
data-nav-link
data-section-id={item.id}
>
<Icon name={item.icon} class="w-4 h-4" />
{item.label}
</a>
))
}
</div>
</nav>
</header>
<script>
import { initActiveSectionTracker } from "../scripts/activeSectionTracker";
function initHeader() {
const header = document.getElementById("site-header");
const hero = document.getElementById("top");
const mobileMenuBtn = document.getElementById("mobile-menu-btn");
const mobileNav = document.getElementById("mobile-nav");
if (!header || !hero) return;
// Show/hide header based on scroll position
// Show header once scrolled down by the navbar height (64px)
const navbarHeight = 64;
function updateHeaderVisibility() {
if (!header) return;
if (window.scrollY >= navbarHeight) {
header.classList.remove("translate-y-[-100%]", "border-transparent");
header.classList.add("border-gray-200", "dark:border-neutral-800");
} else {
header.classList.add("translate-y-[-100%]", "border-transparent");
header.classList.remove("border-gray-200", "dark:border-neutral-800");
}
}
window.addEventListener("scroll", updateHeaderVisibility, {
passive: true,
});
updateHeaderVisibility();
// Mobile menu toggle
if (mobileMenuBtn && mobileNav) {
mobileMenuBtn.addEventListener("click", () => {
mobileNav.classList.toggle("hidden");
});
// Close menu when clicking a link
mobileNav.querySelectorAll("a").forEach((link) => {
link.addEventListener("click", () => {
mobileNav.classList.add("hidden");
});
});
}
// Active section tracking for nav links
initActiveSectionTracker({
linkSelector: "[data-nav-link]",
defaultToFirst: false,
});
}
// Initialize on load
initHeader();
// Re-initialize on Astro page transitions
document.addEventListener("astro:after-swap", initHeader);
</script>

196
src/components/Hero.astro Normal file
View File

@@ -0,0 +1,196 @@
---
import { Icon } from "astro-icon/components";
import VersionSelector from "./VersionSelector.astro";
import ThemeToggle from "./ThemeToggle.astro";
import { config } from "../config";
interface Props {
version: string;
versions: string[];
svgContent?: string | null;
}
const { version, versions, svgContent } = Astro.props;
const navItems = [
{ id: "about", label: "About" },
{ id: "spec", label: "Read the Spec", primary: true },
{ id: "faq", label: "FAQ" },
];
const baseClasses = `inline-flex items-center justify-center gap-2
px-4 py-2.5 sm:px-6 sm:py-3
text-sm sm:text-base font-medium rounded-lg
transition-all cursor-pointer`;
const primaryClasses = `bg-sky-600 text-white
hover:bg-sky-500 hover:-translate-y-0.5 hover:shadow-md`;
const secondaryClasses = `text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-neutral-800 dark:hover:text-neutral-50`;
---
<section
id="top"
class="relative min-h-[75vh] flex flex-col items-center justify-center
px-6 pt-16 pb-24 overflow-hidden"
>
<!-- Background gradient/texture -->
<div
class="absolute inset-0 bg-gradient-to-b
from-gray-100 to-gray-50
dark:from-neutral-900 dark:to-neutral-950"
>
</div>
<!-- Subtle grid pattern with fade -->
<div
class="absolute inset-0 opacity-[0.06] dark:opacity-[0.12]
bg-[linear-gradient(theme(colors.gray.950)_1px,transparent_1px),linear-gradient(90deg,theme(colors.gray.950)_1px,transparent_1px)]
dark:bg-[linear-gradient(theme(colors.neutral.600)_1px,transparent_1px),linear-gradient(90deg,theme(colors.neutral.600)_1px,transparent_1px)]
bg-[size:60px_60px] bg-center
[-webkit-mask-image:linear-gradient(to_bottom,black_20%,transparent_80%)]
[mask-image:linear-gradient(to_bottom,black_20%,transparent_80%)]"
>
</div>
<!-- Top bar with version & theme -->
<div
class="absolute top-0 inset-x-0 z-20 flex items-center justify-between
px-6 py-4 animate-fade-in-down"
>
<div class="flex items-center gap-3">
<VersionSelector currentVersion={version} versions={versions} />
</div>
<div class="flex items-center gap-2">
<ThemeToggle />
<a
href={config.repoUrl}
target="_blank"
rel="noopener noreferrer"
class="p-2 rounded-lg transition-colors
text-gray-500 dark:text-neutral-500
hover:text-gray-950 dark:hover:text-neutral-50
hover:bg-white/50 dark:hover:bg-neutral-800/50"
aria-label="View on GitHub"
>
<Icon name="simple-icons:github" class="w-5 h-5" />
</a>
</div>
</div>
<!-- Main content -->
<div class="relative z-10 w-full max-w-4xl mx-auto text-center">
<!-- Title -->
<h1
class="animate-fade-in-up mb-4
text-gray-950 dark:text-neutral-50"
>
Git Common-Flow
</h1>
<!-- Tagline -->
<p
class="animate-fade-in-up delay-100
text-lg sm:text-xl max-w-2xl mx-auto mb-8
text-gray-600 dark:text-neutral-400"
>
A sensible git workflow for teams who ship
</p>
<!-- Version badge -->
<div class="animate-fade-in-up delay-200 mb-10">
<span
class="inline-flex items-center px-3 py-1 font-mono text-xs font-medium
rounded-full border
bg-gray-100 border-gray-200 text-gray-500
dark:bg-neutral-800/50 dark:border-neutral-700 dark:text-neutral-400"
>
v{version}
</span>
</div>
<!-- SVG Diagram -->
{
svgContent && (
<div
class="animate-fade-in-up delay-300
relative mx-auto mb-12 py-8 px-6 sm:py-16 sm:px-14
bg-white dark:bg-neutral-900
rounded-2xl shadow-lg dark:shadow-none
border border-gray-200 dark:border-neutral-800"
>
<div
class="w-full max-w-3xl mx-auto [&>svg]:w-full [&>svg]:h-auto
dark:invert dark:hue-rotate-180 dark:contrast-90"
set:html={svgContent}
/>
</div>
)
}
<!-- Navigation links -->
<nav
class="animate-fade-in-up delay-400
flex flex-nowrap items-center justify-center gap-2 sm:gap-4"
>
{
navItems.map((item) => (
<a
href={`#${item.id}`}
class:list={[
baseClasses,
item.primary ? primaryClasses : secondaryClasses,
]}
>
{item.label}
</a>
))
}
</nav>
</div>
<!-- Scroll indicator -->
<a
href="#about"
class="absolute bottom-8 left-1/2 -translate-x-1/2
animate-fade-in delay-700
text-gray-500 dark:text-neutral-500
hover:text-sky-600 transition-colors"
aria-label="Scroll to content"
>
<Icon name="heroicons:arrow-down" class="w-6 h-6 animate-bounce-subtle" />
</a>
</section>
<script>
// Remove animation classes after they complete to prevent re-triggering
// on theme toggle.
const animationClasses = [
"animate-fade-in",
"animate-fade-in-up",
"animate-fade-in-down",
"animate-slide-in-left",
];
function cleanupAnimations() {
const selector = animationClasses.map((c) => `.${c}`).join(", ");
const animatedElements = document.querySelectorAll(selector);
animatedElements.forEach((el) => {
el.addEventListener(
"animationend",
() => {
animationClasses.forEach((cls) => el.classList.remove(cls));
// Also remove delay classes
el.className = el.className.replace(/\bdelay-\d+\b/g, "").trim();
},
{ once: true },
);
});
}
cleanupAnimations();
document.addEventListener("astro:after-swap", cleanupAnimations);
</script>

View File

@@ -1,100 +0,0 @@
---
// Mobile hamburger menu toggle button
---
<a href="#menu" id="menuLink" class="menu-link">
<span></span>
</a>
<style>
.menu-link {
position: fixed;
display: block;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.7);
font-size: 10px;
z-index: 10;
width: 2em;
height: auto;
padding: 2.1em 1.6em;
transition: all 0.2s ease-out;
}
.menu-link:hover,
.menu-link:focus {
background: #000;
}
.menu-link span {
position: relative;
display: block;
}
.menu-link span,
.menu-link span:before,
.menu-link span:after {
background-color: #fff;
width: 100%;
height: 0.2em;
}
.menu-link span:before,
.menu-link span:after {
position: absolute;
margin-top: -0.6em;
content: " ";
}
.menu-link span:after {
margin-top: 0.6em;
}
/* Desktop: hide toggle and position at sidebar edge */
@media (min-width: 48em) {
.menu-link {
left: 150px;
display: none;
}
}
/* When menu is active, move toggle */
:global(#layout.active) .menu-link {
left: 150px;
}
</style>
<script>
function initMenuToggle() {
const layout = document.getElementById("layout");
const menu = document.getElementById("menu");
const menuLink = document.getElementById("menuLink");
const main = document.getElementById("main");
function toggleMenu(e: Event) {
e.preventDefault();
layout?.classList.toggle("active");
menu?.classList.toggle("active");
menuLink?.classList.toggle("active");
}
function closeMenu() {
layout?.classList.remove("active");
menu?.classList.remove("active");
menuLink?.classList.remove("active");
}
menuLink?.addEventListener("click", toggleMenu);
main?.addEventListener("click", () => {
if (layout?.classList.contains("active")) {
closeMenu();
}
});
}
// Run on initial load
initMenuToggle();
// Re-run on Astro page transitions
document.addEventListener("astro:after-swap", initMenuToggle);
</script>

View File

@@ -0,0 +1,16 @@
---
interface Props {
title: string;
subtitle: string;
class?: string;
}
const { title, subtitle, class: className } = Astro.props;
---
<div class:list={["mb-12 text-center", className]}>
<h2 class="text-3xl sm:text-4xl mb-4">{title}</h2>
<p class="text-lg text-gray-600 dark:text-neutral-400">
{subtitle}
</p>
</div>

View File

@@ -1,161 +0,0 @@
---
import { config } from "../config";
interface Props {
currentVersion?: string;
}
const { currentVersion } = Astro.props;
---
<div id="menu">
<div class="menu-inner">
<ul class="menu-list">
<li class="menu-label">Versions:</li>
{
config.versions.map((version) => (
<li
class:list={[
"menu-item",
{ selected: version === currentVersion },
]}
>
<a href={`/spec/${version}`} class="menu-link-item">
{version}
</a>
</li>
))
}
</ul>
</div>
<div class="links">
<a
href={config.repoUrl}
aria-label="View on GitHub"
class="github-link"
>
<svg
class="w-12 h-12"
fill="currentColor"
viewBox="0 0 24 24"
aria-hidden="true"
>
<path
fill-rule="evenodd"
d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839
9.504.5.092.682-.217.682-.483
0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608
1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088
2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951
0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65
0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004
1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546
1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028
2.688 0 3.848-2.339 4.695-4.566
4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012
2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22
6.484 17.522 2 12 2z"
clip-rule="evenodd"></path>
</svg>
</a>
</div>
</div>
<style>
#menu {
margin-left: -150px;
width: 150px;
position: fixed;
top: 0;
left: 0;
bottom: 0;
z-index: 1000;
background: #191818;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
transition: all 0.2s ease-out;
display: flex;
flex-direction: column;
}
.menu-inner {
flex: 1;
}
.menu-list {
list-style: none;
margin: 0;
padding: 0;
border: none;
background: transparent;
border-top: 1px solid #333;
}
.menu-label {
color: #999;
border: none;
padding: 0.6em 0 0.6em 0.6em;
font-size: 0.9em;
}
.menu-item {
border: none;
}
.menu-link-item {
display: block;
color: #999;
border: none;
padding: 0.6em 0 0.6em 0.6em;
text-decoration: none;
transition: background-color 0.15s ease;
}
.menu-link-item:hover,
.menu-link-item:focus {
background: #333;
}
.menu-item.selected {
background: #1f8dd6;
}
.menu-item.selected .menu-link-item {
color: #fff;
}
.links {
font-size: 50px;
padding: 10px 0;
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
gap: 0.25rem;
}
.github-link {
color: #555;
padding: 0;
position: relative;
text-decoration: none;
transition: color 0.15s ease;
}
.github-link:hover {
color: #777;
}
/* Desktop: show menu */
@media (min-width: 48em) {
#menu {
left: 150px;
}
}
/* When menu is active (mobile) */
:global(#layout.active) #menu {
left: 150px;
width: 150px;
}
</style>

View File

@@ -0,0 +1,71 @@
---
import { Icon } from "astro-icon/components";
import SectionHeader from "./SectionHeader.astro";
import SpecSidebar from "./SpecSidebar.astro";
import type { TocItem } from "../utils/parseSpecContent";
interface Props {
terminology: string;
terminologyTitle: string;
specification: string;
tocItems: TocItem[];
version: string;
}
const { terminology, terminologyTitle, specification, tocItems, version } =
Astro.props;
---
<section id="spec" class="py-20 sm:py-28">
<div class="section-container">
<SectionHeader
title="The Specification"
subtitle="The complete Git Common-Flow specification"
class="max-w-3xl mx-auto"
/>
<div class="flex justify-center mb-8 -mt-8">
<a
href={`/spec/${version}/md`}
class="inline-flex items-center gap-1.5 px-3 py-1.5 text-sm
font-medium rounded-lg transition-colors
text-gray-500 dark:text-neutral-500
hover:bg-gray-100 hover:text-gray-700
dark:hover:bg-neutral-800 dark:hover:text-neutral-300"
>
<Icon name="heroicons:code-bracket" class="w-4 h-4" />
View Markdown Version
</a>
</div>
<!-- Content with sidebar -->
<div class="lg:flex lg:gap-8">
<!-- Sidebar -->
<div class="lg:w-64 lg:flex-shrink-0">
<SpecSidebar items={tocItems} />
</div>
<!-- Main content -->
<div class="flex-1 min-w-0">
<article class="prose-spec">
<!-- Terminology -->
<section id="terminology">
<h2>{terminologyTitle}</h2>
<Fragment set:html={terminology} />
</section>
<!-- Main specification -->
<section id="specification">
<h2>Specification</h2>
<Fragment set:html={specification} />
</section>
</article>
</div>
</div>
</div>
</section>
<script>
import { initClauseHighlight } from "../scripts/clauseHighlight";
initClauseHighlight();
</script>

View File

@@ -0,0 +1,132 @@
---
import { Icon } from "astro-icon/components";
import TocLink from "./TocLink.astro";
import type { TocItem } from "../utils/parseSpecContent";
interface Props {
items: TocItem[];
}
const { items } = Astro.props;
---
<aside
id="spec-sidebar"
class="hidden lg:block lg:sticky lg:top-24 lg:self-start
lg:max-h-[calc(100vh-8rem)] lg:overflow-y-auto
lg:pr-8 lg:mr-8 lg:border-r border-gray-200 dark:border-neutral-800"
>
<nav class="space-y-1 py-2">
<div
class="text-xs font-semibold uppercase tracking-wider mb-4
text-gray-500 dark:text-neutral-500"
>
Table of Contents
</div>
{items.map((item) => <TocLink item={item} trackActive />)}
</nav>
</aside>
<!-- Mobile floating button -->
<button
id="spec-toc-toggle"
class="lg:hidden fixed bottom-6 right-6 z-40
w-12 h-12 rounded-full shadow-lg
bg-sky-600 text-white
flex items-center justify-center
hover:bg-sky-500
transition-all duration-200"
aria-label="Jump to section"
>
<Icon name="heroicons:bars-3-bottom-left" class="w-5 h-5" />
</button>
<!-- Mobile TOC drawer -->
<div
id="spec-toc-drawer"
class="lg:hidden fixed inset-0 z-50 hidden"
data-toc-drawer
>
<!-- Backdrop -->
<div class="absolute inset-0 bg-black/50" data-toc-backdrop></div>
<!-- Drawer -->
<div
class="absolute bottom-0 inset-x-0 max-h-[70vh] overflow-y-auto
bg-gray-50 dark:bg-neutral-950
rounded-t-2xl shadow-xl p-6"
>
<div class="flex items-center justify-between mb-4">
<span
class="text-sm font-semibold uppercase tracking-wider
text-gray-500 dark:text-neutral-500"
>
Jump to Section
</span>
<button
class="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-neutral-800"
data-toc-close
aria-label="Close"
>
<Icon name="heroicons:x-mark" class="w-5 h-5" />
</button>
</div>
<nav class="space-y-1">
{items.map((item) => <TocLink item={item} />)}
</nav>
</div>
</div>
<script>
import { initActiveSectionTracker } from "../scripts/activeSectionTracker";
function initSpecSidebar() {
// Active section tracking for sidebar links
initActiveSectionTracker({
linkSelector: "[data-sidebar-link]",
});
// Mobile TOC drawer
const toggleBtn = document.getElementById("spec-toc-toggle");
const drawer = document.getElementById("spec-toc-drawer");
const backdrop = drawer?.querySelector("[data-toc-backdrop]");
const closeBtn = drawer?.querySelector("[data-toc-close]");
const tocLinks = drawer?.querySelectorAll("[data-toc-link]");
function openDrawer() {
drawer?.classList.remove("hidden");
document.body.style.overflow = "hidden";
}
function closeDrawer() {
drawer?.classList.add("hidden");
document.body.style.overflow = "";
}
toggleBtn?.addEventListener("click", openDrawer);
backdrop?.addEventListener("click", closeDrawer);
closeBtn?.addEventListener("click", closeDrawer);
tocLinks?.forEach((link) => {
link.addEventListener("click", closeDrawer);
});
// Show/hide mobile toggle based on spec section visibility
const specSection = document.getElementById("spec");
if (specSection && toggleBtn) {
const specObserver = new IntersectionObserver(
([entry]) => {
toggleBtn.classList.toggle("hidden", !entry.isIntersecting);
},
{ threshold: 0 },
);
specObserver.observe(specSection);
}
}
// Initialize on load
initSpecSidebar();
// Re-initialize on Astro page transitions
document.addEventListener("astro:after-swap", initSpecSidebar);
</script>

View File

@@ -0,0 +1,130 @@
---
import { Icon } from "astro-icon/components";
---
<div class="relative group">
<button
data-theme-toggle
type="button"
class="p-2 rounded-lg cursor-pointer transition-colors duration-200
text-gray-500 dark:text-neutral-500
hover:text-gray-950 dark:hover:text-neutral-50
hover:bg-gray-100 dark:hover:bg-neutral-800"
aria-label="Toggle theme"
>
<Icon name="heroicons:sun" data-theme-icon="light" class="hidden w-5 h-5" />
<Icon name="heroicons:moon" data-theme-icon="dark" class="hidden w-5 h-5" />
<Icon
name="heroicons:computer-desktop"
data-theme-icon="auto"
class="hidden w-5 h-5"
/>
</button>
<!-- Tooltip -->
<div
class="absolute left-1/2 -translate-x-1/2 top-full mt-2
px-2 py-1 text-xs font-medium whitespace-nowrap rounded-md shadow-sm
bg-gray-900 text-white dark:bg-white dark:text-gray-900
opacity-0 group-hover:opacity-100
transition-opacity duration-200 pointer-events-none"
>
<span data-tooltip-text="light" class="hidden">Light</span>
<span data-tooltip-text="dark" class="hidden">Dark</span>
<span data-tooltip-text="auto" class="hidden">System</span>
</div>
</div>
<script>
type ThemeMode = "light" | "dark" | "auto";
function initTheme() {
const toggles = document.querySelectorAll(
"[data-theme-toggle]",
) as NodeListOf<HTMLButtonElement>;
function getStoredMode(): ThemeMode {
const stored = localStorage.getItem("theme");
if (stored === "dark" || stored === "light" || stored === "auto") {
return stored;
}
return "auto";
}
function getSystemTheme(): "dark" | "light" {
return window.matchMedia("(prefers-color-scheme: dark)").matches
? "dark"
: "light";
}
function getEffectiveTheme(mode: ThemeMode): "dark" | "light" {
if (mode === "auto") {
return getSystemTheme();
}
return mode;
}
function updateAllIcons(mode: ThemeMode) {
document.querySelectorAll("[data-theme-icon]").forEach((icon) => {
const iconMode = (icon as HTMLElement).dataset.themeIcon;
icon.classList.toggle("hidden", iconMode !== mode);
});
document.querySelectorAll("[data-tooltip-text]").forEach((text) => {
const textMode = (text as HTMLElement).dataset.tooltipText;
text.classList.toggle("hidden", textMode !== mode);
});
}
function applyTheme(mode: ThemeMode) {
const effective = getEffectiveTheme(mode);
if (effective === "dark") {
document.documentElement.classList.add("dark");
} else {
document.documentElement.classList.remove("dark");
}
updateAllIcons(mode);
}
function setMode(mode: ThemeMode) {
localStorage.setItem("theme", mode);
applyTheme(mode);
}
function cycleMode(): ThemeMode {
const current = getStoredMode();
// Cycle: light → dark → auto → light
if (current === "light") return "dark";
if (current === "dark") return "auto";
return "light";
}
// Initialize theme
const currentMode = getStoredMode();
applyTheme(currentMode);
// Attach click handlers to all toggle buttons
toggles.forEach((toggle) => {
// Avoid adding duplicate listeners
if (toggle.dataset.initialized) return;
toggle.dataset.initialized = "true";
toggle.addEventListener("click", () => {
setMode(cycleMode());
});
});
// Listen for system preference changes (only affects auto mode)
window
.matchMedia("(prefers-color-scheme: dark)")
.addEventListener("change", () => {
if (getStoredMode() === "auto") {
applyTheme("auto");
}
});
}
// Run on initial load
initTheme();
// Re-run on Astro page transitions
document.addEventListener("astro:after-swap", initTheme);
</script>

View File

@@ -0,0 +1,34 @@
---
import type { TocItem } from "../utils/parseSpecContent";
interface Props {
item: TocItem;
trackActive?: boolean;
}
const { item, trackActive = false } = Astro.props;
---
<a
href={`#${item.id}`}
class:list={[
"sidebar-link block py-2 px-4 text-sm rounded-md",
"transition-colors",
"text-gray-500 hover:text-gray-950 hover:bg-gray-100",
"dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800",
item.level === 3 && "pl-6 text-[0.8125rem]",
item.clause && "flex",
]}
data-sidebar-link={trackActive ? "" : undefined}
data-section-id={trackActive ? item.id : undefined}
data-toc-link={!trackActive ? "" : undefined}
>
{
item.clause && (
<span class="shrink-0 w-6 text-gray-400 dark:text-neutral-600">
{item.clause}
</span>
)
}
<span>{item.title}</span>
</a>

View File

@@ -0,0 +1,136 @@
---
import { Icon } from "astro-icon/components";
interface Props {
currentVersion: string;
versions: string[];
}
const { currentVersion, versions } = Astro.props;
---
<div class="relative" data-version-selector>
<!-- Trigger button -->
<button
type="button"
data-version-trigger
aria-haspopup="listbox"
aria-expanded="false"
class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm font-mono
border border-gray-200 dark:border-neutral-700
rounded-md bg-transparent cursor-pointer transition-colors
text-gray-600 dark:text-neutral-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-neutral-50"
>
<span>v{currentVersion}</span>
<Icon
name="heroicons:chevron-down"
data-arrow-icon
class="w-3.5 h-3.5 transition-transform duration-150"
/>
</button>
<!-- Dropdown menu -->
<div
data-version-dropdown
role="listbox"
aria-label="Select version"
class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-neutral-900
border border-gray-200 dark:border-neutral-700
rounded-lg shadow-lg
opacity-0 invisible -translate-y-1 transition-all duration-150
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"
>
{
versions.map((v) => (
<a
href={`/spec/${v}`}
role="option"
aria-selected={v === currentVersion}
class:list={[
"block px-3 py-2 font-mono text-sm rounded transition-colors",
"text-gray-600 dark:text-neutral-400",
"hover:bg-gray-100 dark:hover:bg-neutral-800",
"hover:text-gray-950 dark:hover:text-neutral-50",
v === currentVersion && [
"bg-sky-500/15 dark:bg-sky-500/20",
"text-sky-600 dark:text-sky-400",
],
]}
>
v{v}
</a>
))
}
</div>
</div>
<script>
function initVersionSelectors() {
const selectors = document.querySelectorAll("[data-version-selector]");
selectors.forEach((selector) => {
if ((selector as HTMLElement).dataset.initialized) return;
(selector as HTMLElement).dataset.initialized = "true";
const trigger = selector.querySelector(
"[data-version-trigger]",
) as HTMLButtonElement;
const dropdown = selector.querySelector(
"[data-version-dropdown]",
) as HTMLElement;
const arrow = selector.querySelector("[data-arrow-icon]") as HTMLElement;
if (!trigger || !dropdown) return;
const open = () => {
dropdown.dataset.open = "true";
trigger.setAttribute("aria-expanded", "true");
if (arrow) arrow.style.transform = "rotate(180deg)";
};
const close = () => {
delete dropdown.dataset.open;
trigger.setAttribute("aria-expanded", "false");
if (arrow) arrow.style.transform = "";
};
trigger.addEventListener("click", (e) => {
e.stopPropagation();
const isOpen = dropdown.dataset.open === "true";
// Close all other dropdowns
document
.querySelectorAll("[data-version-dropdown][data-open]")
.forEach((d) => {
delete (d as HTMLElement).dataset.open;
const t = d.previousElementSibling as HTMLElement;
t?.setAttribute("aria-expanded", "false");
const a = t?.querySelector("[data-arrow-icon]") as HTMLElement;
if (a) a.style.transform = "";
});
if (isOpen) {
close();
} else {
open();
}
});
document.addEventListener("click", (e) => {
if (!selector.contains(e.target as Node)) close();
});
document.addEventListener("keydown", (e) => {
if (e.key === "Escape" && dropdown.dataset.open === "true") {
close();
trigger.focus();
}
});
});
}
initVersionSelectors();
document.addEventListener("astro:after-swap", initVersionSelectors);
</script>

View File

@@ -1,30 +1,37 @@
export const config = {
title: "Git Common Flow",
title: "Git Common-Flow",
description:
"An attempt to gather a sensible selection of the most common usage " +
"patterns of git into a single and concise specification.",
author: "Jim Myhrberg",
authorUrl: "https://jimeh.me/",
hostname: "commonflow.org",
url: "https://commonflow.org",
repoUrl: "https://github.com/jimeh/common-flow",
license: {
name: "CC BY 4.0",
url: "https://creativecommons.org/licenses/by/4.0/",
},
currentVersion: "1.0.0-rc.5",
versions: [
"1.0.0-rc.5",
"1.0.0-rc.4",
"1.0.0-rc.3",
"1.0.0-rc.2",
"1.0.0-rc.1",
],
// Optional override for current version (null = auto-detect from specs)
currentVersionOverride: null as string | null,
// Used by update script
update: {
repository: "jimeh/common-flow",
urlTemplate:
"https://github.com/jimeh/common-flow/raw/{{version}}/{{file}}",
files: {
document: "common-flow.md",
diagram: "common-flow.svg",
},
// Version discovery settings
discovery: {
// Prerelease types to include (stable versions are always included)
includePrereleaseTypes: ["rc"] as string[],
// Explicit versions to exclude
excludeVersions: [] as string[],
},
},
} as const;

View File

@@ -2,7 +2,12 @@ import { defineCollection, z } from "astro:content";
import { glob } from "astro/loaders";
const spec = defineCollection({
loader: glob({ pattern: "**/*.md", base: "./src/content/spec" }),
loader: glob({
pattern: "**/*.md",
base: "./src/content/spec",
// Use filename (without extension) as ID to preserve version strings
generateId: ({ entry }) => entry.replace(/\.md$/, ""),
}),
schema: z.object({
title: z.string(),
version: z.string(),

View File

@@ -3,9 +3,7 @@ title: Git Common-Flow 1.0.0-rc.1
version: 1.0.0-rc.1
---
Git Common-Flow 1.0.0-rc.1
==============================
<img src="/spec/1.0.0-rc.1.svg" alt="Git Common-Flow 1.0.0-rc.1 diagram" width="100%" />
==========================
Summary
-------

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 13 KiB

View File

@@ -1,11 +1,9 @@
---
title: Git Common-Flow 1.0.0-rc.2
title: Git Common-Flow v1.0.0-rc.2
version: 1.0.0-rc.2
---
Git Common-Flow 1.0.0-rc.2
==============================
<img src="/spec/1.0.0-rc.2.svg" alt="Git Common-Flow 1.0.0-rc.2 diagram" width="100%" />
Git Common-Flow v1.0.0-rc.2
===========================
Summary
-------

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 13 KiB

View File

@@ -1,12 +1,10 @@
---
title: Git Common-Flow 1.0.0-rc.3
title: Git Common-Flow v1.0.0-rc.3
version: 1.0.0-rc.3
---
Git Common-Flow 1.0.0-rc.3
Git Common-Flow v1.0.0-rc.3
===========================
<img src="/spec/1.0.0-rc.3.svg" alt="Git Common-Flow 1.0.0-rc.3 diagram" width="100%" />
Summary
-------

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 13 KiB

View File

@@ -1,12 +1,10 @@
---
title: Git Common-Flow 1.0.0-rc.4
title: Git Common-Flow v1.0.0-rc.4
version: 1.0.0-rc.4
---
Git Common-Flow 1.0.0-rc.4
Git Common-Flow v1.0.0-rc.4
===========================
<img src="/spec/1.0.0-rc.4.svg" alt="Git Common-Flow 1.0.0-rc.4 diagram" width="100%" />
Summary
-------

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 13 KiB

View File

@@ -1,12 +1,10 @@
---
title: Git Common-Flow 1.0.0-rc.5
title: Git Common-Flow v1.0.0-rc.5
version: 1.0.0-rc.5
---
Git Common-Flow 1.0.0-rc.5
Git Common-Flow v1.0.0-rc.5
===========================
<img src="/spec/1.0.0-rc.5.svg" alt="Git Common-Flow 1.0.0-rc.5 diagram" width="100%" />
Introduction
------------

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 13 KiB

View File

@@ -0,0 +1,76 @@
---
import "@fontsource-variable/bricolage-grotesque";
import "@fontsource-variable/dm-sans";
import "@fontsource-variable/jetbrains-mono";
import "../styles/global.css";
import { config } from "../config";
interface Props {
title: string;
description?: string;
}
const { title, description = config.description } = Astro.props;
const fullTitle = title === config.title ? title : `${title} | ${config.title}`;
const canonicalUrl = Astro.url.href;
---
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="canonical" href={canonicalUrl} />
<title>{fullTitle}</title>
<meta name="description" content={description} />
<meta name="author" content={config.author} />
<!-- Open Graph -->
<meta property="og:title" content={fullTitle} />
<meta property="og:description" content={description} />
<meta property="og:type" content="website" />
<meta property="og:url" content={canonicalUrl} />
<!-- Twitter -->
<meta name="twitter:card" content="summary" />
<meta name="twitter:title" content={fullTitle} />
<meta name="twitter:description" content={description} />
<!-- Favicon -->
<link rel="icon" href="/favicon.ico" sizes="32x32" />
<link rel="icon" href="/favicon.svg" type="image/svg+xml" />
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
<!-- Prevent flash of wrong theme -->
<script is:inline>
(function () {
const mode = localStorage.getItem("theme");
const prefersDark = window.matchMedia(
"(prefers-color-scheme: dark)",
).matches;
if (mode === "dark" || (mode !== "light" && prefersDark)) {
document.documentElement.classList.add("dark");
}
})();
</script>
</head>
<body class="min-h-screen">
<slot />
<!-- Re-init theme on Astro page transitions -->
<script>
document.addEventListener("astro:after-swap", () => {
const mode = localStorage.getItem("theme");
const prefersDark = window.matchMedia(
"(prefers-color-scheme: dark)",
).matches;
if (mode === "dark" || (mode !== "light" && prefersDark)) {
document.documentElement.classList.add("dark");
} else {
document.documentElement.classList.remove("dark");
}
});
</script>
</body>
</html>

View File

@@ -1,103 +0,0 @@
---
import "../styles/global.css";
import { config } from "../config";
import Sidebar from "../components/Sidebar.astro";
import MenuToggle from "../components/MenuToggle.astro";
interface Props {
title: string;
description?: string;
version?: string;
}
const { title, description = config.description, version } = Astro.props;
const fullTitle = title === config.title ? title : `${title} | ${config.title}`;
---
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="canonical" href={Astro.url} />
<title>{fullTitle}</title>
<meta name="description" content={description} />
<meta name="author" content={config.author} />
<!-- Open Graph -->
<meta property="og:title" content={fullTitle} />
<meta property="og:description" content={description} />
<meta property="og:type" content="website" />
<meta property="og:url" content={Astro.url} />
<!-- Twitter -->
<meta name="twitter:card" content="summary" />
<meta name="twitter:title" content={fullTitle} />
<meta name="twitter:description" content={description} />
<!-- Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@300;700&family=Open+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap"
rel="stylesheet"
/>
</head>
<body>
<div id="layout">
<MenuToggle />
<Sidebar currentVersion={version} />
<div id="main">
<div class="content">
<slot />
</div>
</div>
</div>
</body>
</html>
<style>
#layout {
position: relative;
left: 0;
padding-left: 0;
transition: all 0.2s ease-out;
}
#main {
min-height: 100vh;
}
.content {
margin: 0 auto;
padding: 0 2em;
max-width: 800px;
margin-bottom: 50px;
line-height: 1.6em;
padding-top: 80px;
}
/* Desktop layout */
@media (min-width: 48em) {
#layout {
padding-left: 150px;
left: 0;
}
.content {
padding-left: 2em;
padding-right: 2em;
}
}
/* Mobile: when menu is active */
@media (max-width: 48em) {
:global(#layout.active) {
position: relative;
left: 150px;
}
}
</style>

View File

@@ -0,0 +1,69 @@
---
import type { CollectionEntry } from "astro:content";
import * as fs from "node:fs";
import * as path from "node:path";
import BaseLayout from "./BaseLayout.astro";
import Header from "../components/Header.astro";
import Hero from "../components/Hero.astro";
import AboutSection from "../components/AboutSection.astro";
import SpecSection from "../components/SpecSection.astro";
import FAQSection from "../components/FAQSection.astro";
import Footer from "../components/Footer.astro";
import { parseSpecContent } from "../utils/parseSpecContent";
interface Props {
spec: CollectionEntry<"spec">;
versions: string[];
}
const { spec, versions } = Astro.props;
const version = spec.data.version;
// Read the markdown file
const filePath = path.join(process.cwd(), "src/content/spec", `${version}.md`);
const content = fs.readFileSync(filePath, "utf-8");
// Remove frontmatter
const markdown = content.replace(/^---[\s\S]*?---\n/, "");
// Parse the content into sections (handles markdown -> HTML internally)
const parsed = await parseSpecContent(markdown);
// Read SVG content for inline embedding
const svgFilePath = path.join(process.cwd(), "src/content/spec", `${version}.svg`);
let svgContent: string | null = null;
if (fs.existsSync(svgFilePath)) {
svgContent = fs.readFileSync(svgFilePath, "utf-8");
}
---
<BaseLayout title={spec.data.title}>
<Header version={version} versions={versions} />
<main>
<Hero
version={version}
versions={versions}
svgContent={svgContent}
/>
<AboutSection
introduction={parsed.introduction}
summary={parsed.summary}
license={parsed.license}
/>
<SpecSection
terminology={parsed.terminology}
terminologyTitle={parsed.terminologyTitle}
specification={parsed.specification}
tocItems={parsed.tocItems}
version={version}
/>
<FAQSection items={parsed.faq} />
</main>
<Footer />
</BaseLayout>

View File

@@ -1,48 +1,32 @@
---
import Default from "../layouts/Default.astro";
import BaseLayout from "../layouts/BaseLayout.astro";
---
<Default title="Page Not Found">
<div class="not-found">
<h1>404</h1>
<p>Page not found.</p>
<p>
<a href="/">Go to the homepage</a>
</p>
<BaseLayout title="Page Not Found">
<div class="flex flex-col items-center justify-center min-h-screen p-8">
<div class="text-center">
<h1
class="text-[8rem] sm:text-[12rem] font-display font-bold leading-none
text-gray-300 dark:text-neutral-700"
>
404
</h1>
<p class="text-xl mb-2 text-gray-600 dark:text-neutral-400">
Page not found
</p>
<p class="text-gray-500 dark:text-neutral-500">
The page you're looking for doesn't exist.
</p>
<a
href="/"
class="inline-flex items-center justify-center gap-2 mt-8
px-5 py-2.5 text-sm font-medium rounded-lg
transition-all cursor-pointer
bg-sky-600 text-white
hover:bg-sky-500 hover:-translate-y-0.5 hover:shadow-md"
>
Go to homepage
</a>
</div>
</div>
</Default>
<style>
.not-found {
text-align: center;
padding-top: 4rem;
}
.not-found h1 {
font-size: 6rem;
margin-bottom: 0.5rem;
color: #999;
}
.dark .not-found h1 {
color: #666;
}
.not-found p {
font-size: 1.25rem;
margin-bottom: 1rem;
}
.not-found a {
color: #1f8dd6;
text-decoration: none;
}
.not-found a:hover {
text-decoration: underline;
}
.dark .not-found a {
color: #4da6e8;
}
</style>
</BaseLayout>

View File

@@ -1,21 +1,17 @@
---
import { getCollection, render } from "astro:content";
import Default from "../layouts/Default.astro";
import { config } from "../config";
import { getCollection } from "astro:content";
// Get all specs and find the current version
import SpecLayout from "../layouts/SpecLayout.astro";
import { getVersionInfo } from "../utils/versions";
// Get version info and render the current/latest version
const { versions, currentVersion } = await getVersionInfo();
const specs = await getCollection("spec");
const currentSpec = specs.find((s) => s.data.version === config.currentVersion);
const spec = specs.find((s) => s.data.version === currentVersion);
if (!currentSpec) {
return Astro.redirect("/404");
if (!spec) {
throw new Error(`Spec version ${currentVersion} not found`);
}
const { Content } = await render(currentSpec);
---
<Default title={currentSpec.data.title} version={currentSpec.data.version}>
<article class="spec-content">
<Content />
</article>
</Default>
<SpecLayout spec={spec} versions={versions} />

View File

@@ -1,6 +1,8 @@
---
import { getCollection, render } from "astro:content";
import Default from "../../layouts/Default.astro";
import { getCollection } from "astro:content";
import SpecLayout from "../../layouts/SpecLayout.astro";
import { getVersionInfo } from "../../utils/versions";
export async function getStaticPaths() {
const specs = await getCollection("spec");
@@ -11,11 +13,7 @@ export async function getStaticPaths() {
}
const { spec } = Astro.props;
const { Content } = await render(spec);
const { versions } = await getVersionInfo();
---
<Default title={spec.data.title} version={spec.data.version}>
<article class="spec-content">
<Content />
</article>
</Default>
<SpecLayout spec={spec} versions={versions} />

View File

@@ -0,0 +1,518 @@
---
import { getCollection } from "astro:content";
import { Icon } from "astro-icon/components";
import * as fs from "node:fs";
import * as path from "node:path";
import { createHighlighter } from "shiki";
import { unified } from "unified";
import remarkParse from "remark-parse";
import remarkRehype from "remark-rehype";
import rehypeSlug from "rehype-slug";
import rehypeAutolinkHeadings from "rehype-autolink-headings";
import rehypeStringify from "rehype-stringify";
import { icons as heroicons } from "@iconify-json/heroicons";
import { getIconData, iconToSVG } from "@iconify/utils";
import BaseLayout from "../../../layouts/BaseLayout.astro";
import ThemeToggle from "../../../components/ThemeToggle.astro";
import { config } from "../../../config";
// Get the link icon SVG from heroicons for use in anchor links
const linkIconData = getIconData(heroicons, "link-20-solid");
const linkIconSvg = linkIconData ? iconToSVG(linkIconData) : null;
// Parse the icon body into hast nodes for rehype
function parseIconBody(body: string): import("hast").ElementContent[] {
// Simple regex-based parser for SVG path/g elements
const elements: import("hast").ElementContent[] = [];
const tagRegex = /<(\w+)([^>]*)(?:\/>|>([\s\S]*?)<\/\1>)/g;
let match;
while ((match = tagRegex.exec(body)) !== null) {
const [, tagName, attrs, children] = match;
const properties: Record<string, string> = {};
// Parse attributes
const attrRegex = /(\w+(?:-\w+)*)="([^"]*)"/g;
let attrMatch;
while ((attrMatch = attrRegex.exec(attrs)) !== null) {
properties[attrMatch[1]] = attrMatch[2];
}
elements.push({
type: "element",
tagName,
properties,
children: children ? parseIconBody(children) : [],
});
}
return elements;
}
export async function getStaticPaths() {
const specs = await getCollection("spec");
return specs.map((spec) => ({
params: { version: spec.data.version },
props: { spec },
}));
}
const { spec } = Astro.props;
const version = spec.data.version;
// Read the markdown file
const filePath = path.join(process.cwd(), "src/content/spec", `${version}.md`);
const content = fs.readFileSync(filePath, "utf-8");
// Remove frontmatter
const markdown = content.replace(/^---[\s\S]*?---\n/, "");
// Create syntax highlighter for code view
const highlighter = await createHighlighter({
themes: ["github-light", "github-dark"],
langs: ["markdown"],
});
const highlightedHtml = highlighter.codeToHtml(markdown, {
lang: "markdown",
themes: {
light: "github-light",
dark: "github-dark",
},
});
// Build the anchor link icon content from the heroicons data
const anchorIconContent = linkIconSvg
? {
type: "element" as const,
tagName: "svg",
properties: {
className: ["anchor-icon"],
viewBox: `0 0 ${linkIconSvg.attributes.width} ${linkIconSvg.attributes.height}`,
fill: "currentColor",
"aria-hidden": "true",
},
children: parseIconBody(linkIconSvg.body),
}
: { type: "text" as const, value: "#" };
// Render markdown to HTML for preview view
const previewHtml = await unified()
.use(remarkParse)
.use(remarkRehype)
.use(rehypeSlug)
.use(rehypeAutolinkHeadings, {
behavior: "append",
properties: {
className: ["anchor-link"],
ariaLabel: "Link to this section",
},
content: anchorIconContent,
})
.use(rehypeStringify)
.process(markdown)
.then((file) => String(file));
---
<BaseLayout title={`${spec.data.title} - Markdown`}>
<!-- Header -->
<header
class="sticky top-0 z-50 border-b
border-gray-200 dark:border-neutral-800
backdrop-blur-xl bg-gray-50/85 dark:bg-neutral-950/85"
>
<div
class="max-w-6xl mx-auto px-4 sm:px-6 h-16 flex items-center
justify-between"
>
<!-- Back link and title -->
<div class="flex items-center gap-4">
<a
href={`/spec/${version}`}
class="inline-flex items-center gap-1.5 text-sm font-medium
text-gray-600 dark:text-neutral-400
hover:text-sky-600 dark:hover:text-sky-400 transition-colors"
>
<Icon name="heroicons:arrow-left" class="w-4 h-4" />
<span class="hidden sm:inline">Back to Spec</span>
</a>
<span class="hidden sm:inline text-gray-300 dark:text-neutral-700"
>|</span
>
<span class="font-display font-bold text-lg tracking-tight">
Markdown
</span>
<span
class="px-2 py-0.5 text-xs font-semibold rounded-full
bg-sky-100 text-sky-700
dark:bg-sky-900/50 dark:text-sky-300"
>
v{version}
</span>
</div>
<!-- Right side: Theme, GitHub -->
<div class="flex items-center gap-2">
<ThemeToggle />
<a
href={config.repoUrl}
target="_blank"
rel="noopener noreferrer"
class="p-2 rounded-lg transition-colors
text-gray-500 dark:text-neutral-500
hover:text-gray-950 dark:hover:text-neutral-50
hover:bg-gray-100 dark:hover:bg-neutral-800"
aria-label="View on GitHub"
>
<Icon name="simple-icons:github" class="w-5 h-5" />
</a>
</div>
</div>
</header>
<!-- Main content -->
<main class="max-w-6xl mx-auto px-4 sm:px-6 py-8">
<div class="relative">
<!-- Hidden raw text for copying -->
<div id="markdown-raw" class="hidden">{markdown}</div>
<!-- Filename heading and actions -->
<div class="flex flex-col items-center mb-6">
<h1
class="font-mono font-semibold text-sm sm:text-base
text-gray-700 dark:text-neutral-300
max-w-full overflow-hidden text-ellipsis
whitespace-nowrap [direction:rtl] sm:[direction:ltr]"
>
git-common-flow-v{version}.md
</h1>
<div
class="flex flex-col sm:flex-row items-center gap-2 sm:gap-3 mt-3
w-full sm:w-auto"
>
<!-- Separator (hidden on mobile) -->
<span
class="hidden sm:inline text-gray-300 dark:text-neutral-700
order-2"
>|</span
>
<!-- Copy and Download buttons -->
<div class="flex items-center gap-3 order-1 sm:order-3">
<!-- Copy button -->
<div class="relative">
<button
id="copy-btn"
type="button"
class="inline-flex items-center gap-1.5 px-3 py-1.5 text-sm
font-medium rounded-lg transition-colors cursor-pointer
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-neutral-800 dark:hover:text-neutral-50"
>
<Icon name="heroicons:clipboard-document" class="w-4 h-4" />
<span data-copy-text>Copy</span>
</button>
<!-- Mobile tooltip -->
<div
id="copy-tooltip"
class="sm:hidden absolute left-1/2 -translate-x-1/2 top-full
mt-2 px-2 py-1 text-xs font-medium whitespace-nowrap
rounded-md shadow-sm bg-gray-900 text-white
dark:bg-white dark:text-gray-900 opacity-0
pointer-events-none transition-opacity duration-200"
>
Copied!
</div>
</div>
<!-- Download button -->
<button
id="download-btn"
type="button"
class="inline-flex items-center gap-1.5 px-3 py-1.5 text-sm
font-medium rounded-lg transition-colors cursor-pointer
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-neutral-800 dark:hover:text-neutral-50"
data-filename={`git-common-flow-v${version}.md`}
>
<Icon name="heroicons:arrow-down-tray" class="w-4 h-4" />
<span>Download</span>
</button>
</div>
<!-- Code/Preview toggle -->
<div
id="toggle-container"
class="relative inline-flex rounded-lg p-0.5 order-2 sm:order-1
mt-2 sm:mt-0 bg-gray-100 dark:bg-neutral-800"
>
<!-- Sliding indicator -->
<div
id="toggle-indicator"
class="absolute top-0.5 h-[calc(100%-4px)] rounded-md
bg-white dark:bg-neutral-700 shadow-sm
transition-all duration-200 ease-out"
>
</div>
<button
id="toggle-preview"
type="button"
class="relative z-10 inline-flex items-center gap-1.5 px-3 py-1
text-sm font-medium rounded-md cursor-pointer
transition-colors duration-200
text-gray-900 dark:text-neutral-100"
aria-pressed="true"
>
<Icon name="heroicons:eye" class="w-4 h-4" />
Preview
</button>
<button
id="toggle-code"
type="button"
class="relative z-10 inline-flex items-center gap-1.5 px-3 py-1
text-sm font-medium rounded-md cursor-pointer
transition-colors duration-200
text-gray-600 dark:text-neutral-400
hover:text-gray-900 dark:hover:text-neutral-200"
aria-pressed="false"
>
<Icon name="heroicons:code-bracket" class="w-4 h-4" />
Code
</button>
</div>
</div>
</div>
<!-- Code view (hidden by default) -->
<div
id="code-view"
class="hidden [&_pre]:overflow-x-auto [&_pre]:rounded-xl [&_pre]:p-6
[&_pre]:text-sm [&_pre]:leading-relaxed
[&_pre]:border [&_pre]:border-gray-200
dark:[&_pre]:border-neutral-800"
set:html={highlightedHtml}
/>
<!-- Preview view (visible by default) -->
<div
id="preview-view"
class="prose prose-slate dark:prose-invert max-w-none
rounded-xl p-6 border border-gray-200
dark:border-neutral-800 bg-white dark:bg-neutral-900"
set:html={previewHtml}
/>
</div>
</main>
</BaseLayout>
<style is:global>
/* Shiki dual theme support - override inline styles in dark mode */
.dark .shiki {
color: var(--shiki-dark) !important;
background-color: var(--shiki-dark-bg) !important;
}
.dark .shiki span {
color: var(--shiki-dark) !important;
}
/* Preview anchor links */
#preview-view :is(h1, h2, h3, h4, h5, h6) {
overflow: visible;
}
#preview-view .anchor-link {
display: inline-flex;
align-items: center;
justify-content: center;
margin-left: 0.5rem;
text-decoration: none;
opacity: 0;
transition: opacity 150ms ease;
vertical-align: middle;
}
#preview-view :is(h1, h2, h3, h4, h5, h6):hover .anchor-link {
opacity: 1;
}
#preview-view .anchor-link:hover {
opacity: 1;
}
#preview-view .anchor-icon {
flex-shrink: 0;
width: 20px;
height: 20px;
color: var(--color-slate-400);
}
#preview-view .anchor-link:hover .anchor-icon {
color: var(--color-sky-500);
}
.dark #preview-view .anchor-icon {
color: var(--color-neutral-500);
}
.dark #preview-view .anchor-link:hover .anchor-icon {
color: var(--color-sky-400);
}
</style>
<script>
function initPage() {
const copyBtn = document.getElementById("copy-btn");
const downloadBtn = document.getElementById("download-btn");
const rawContent = document.getElementById("markdown-raw");
const copyText = copyBtn?.querySelector("[data-copy-text]");
const copyTooltip = document.getElementById("copy-tooltip");
const toggleContainer = document.getElementById("toggle-container");
const toggleCode = document.getElementById("toggle-code");
const togglePreview = document.getElementById("toggle-preview");
const toggleIndicator = document.getElementById("toggle-indicator");
const codeView = document.getElementById("code-view");
const previewView = document.getElementById("preview-view");
if (!rawContent) return;
// Text color classes for active/inactive states
const activeTextClasses = ["text-gray-900", "dark:text-neutral-100"];
const inactiveTextClasses = [
"text-gray-600",
"dark:text-neutral-400",
"hover:text-gray-900",
"dark:hover:text-neutral-200",
];
function updateIndicator(button: HTMLElement) {
if (!toggleIndicator || !toggleContainer) return;
const containerRect = toggleContainer.getBoundingClientRect();
const buttonRect = button.getBoundingClientRect();
// Calculate position relative to container (accounting for container padding)
const left = buttonRect.left - containerRect.left;
toggleIndicator.style.left = `${left}px`;
toggleIndicator.style.width = `${buttonRect.width}px`;
}
function setActiveToggle(isCode: boolean) {
if (
!toggleCode ||
!togglePreview ||
!toggleIndicator ||
!codeView ||
!previewView
)
return;
if (isCode) {
// Show code, hide preview
codeView.classList.remove("hidden");
previewView.classList.add("hidden");
// Update indicator position and size
updateIndicator(toggleCode);
// Update text colors
toggleCode.classList.add(...activeTextClasses);
toggleCode.classList.remove(...inactiveTextClasses);
toggleCode.setAttribute("aria-pressed", "true");
togglePreview.classList.remove(...activeTextClasses);
togglePreview.classList.add(...inactiveTextClasses);
togglePreview.setAttribute("aria-pressed", "false");
} else {
// Show preview, hide code
codeView.classList.add("hidden");
previewView.classList.remove("hidden");
// Update indicator position and size
updateIndicator(togglePreview);
// Update text colors
togglePreview.classList.add(...activeTextClasses);
togglePreview.classList.remove(...inactiveTextClasses);
togglePreview.setAttribute("aria-pressed", "true");
toggleCode.classList.remove(...activeTextClasses);
toggleCode.classList.add(...inactiveTextClasses);
toggleCode.setAttribute("aria-pressed", "false");
}
}
// Initialize indicator position on load
if (togglePreview) {
updateIndicator(togglePreview);
}
// Toggle event listeners
toggleCode?.addEventListener("click", () => setActiveToggle(true));
togglePreview?.addEventListener("click", () => setActiveToggle(false));
function showCopiedFeedback() {
// Desktop: change button text
if (copyText) {
copyText.textContent = "Copied!";
setTimeout(() => {
copyText.textContent = "Copy";
}, 2000);
}
// Mobile: show tooltip
if (copyTooltip) {
copyTooltip.classList.remove("opacity-0");
copyTooltip.classList.add("opacity-100");
setTimeout(() => {
copyTooltip.classList.remove("opacity-100");
copyTooltip.classList.add("opacity-0");
}, 2000);
}
}
// Copy button
if (copyBtn) {
copyBtn.addEventListener("click", async () => {
try {
await navigator.clipboard.writeText(rawContent.textContent || "");
showCopiedFeedback();
} catch {
// Fallback for older browsers
const textarea = document.createElement("textarea");
textarea.value = rawContent.textContent || "";
textarea.style.position = "fixed";
textarea.style.opacity = "0";
document.body.appendChild(textarea);
textarea.select();
document.execCommand("copy");
document.body.removeChild(textarea);
showCopiedFeedback();
}
});
}
// Download button
if (downloadBtn) {
downloadBtn.addEventListener("click", () => {
const filename = downloadBtn.dataset.filename || "common-flow.md";
const content = rawContent.textContent || "";
const blob = new Blob([content], { type: "text/markdown" });
const url = URL.createObjectURL(blob);
const a = document.createElement("a");
a.href = url;
a.download = filename;
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
URL.revokeObjectURL(url);
});
}
}
initPage();
document.addEventListener("astro:after-swap", initPage);
</script>

View File

@@ -0,0 +1,64 @@
export interface ActiveSectionTrackerOptions {
linkSelector: string;
sectionIdAttr?: string;
headerOffset?: number;
defaultToFirst?: boolean;
}
export function initActiveSectionTracker(
options: ActiveSectionTrackerOptions,
): void {
const {
linkSelector,
sectionIdAttr = "data-section-id",
headerOffset = 100,
defaultToFirst = true,
} = options;
const links = document.querySelectorAll(linkSelector);
const sections: { id: string; element: Element }[] = [];
// Collect unique section IDs
const seenIds = new Set<string>();
links.forEach((link) => {
const id = link.getAttribute(sectionIdAttr);
if (id && !seenIds.has(id)) {
seenIds.add(id);
const section = document.getElementById(id);
if (section) {
sections.push({ id, element: section });
}
}
});
function updateActiveSection(): void {
let activeId: string | null = defaultToFirst ? sections[0]?.id : null;
for (const { id, element } of sections) {
const rect = element.getBoundingClientRect();
if (rect.top <= headerOffset) {
activeId = id;
}
}
links.forEach((link) => {
const linkId = link.getAttribute(sectionIdAttr);
link.classList.toggle("active", linkId === activeId);
});
}
// Update on scroll with throttling
let ticking = false;
window.addEventListener("scroll", () => {
if (!ticking) {
requestAnimationFrame(() => {
updateActiveSection();
ticking = false;
});
ticking = true;
}
});
// Initial update
updateActiveSection();
}

View File

@@ -0,0 +1,75 @@
/**
* Highlights clause elements when navigating to them via anchor links.
* Works on both initial page load with hash and when clicking anchor links.
*/
const HIGHLIGHT_DURATION = 2000;
const HIGHLIGHT_CLASS = "clause-highlight";
/**
* Highlight a clause element briefly
*/
function highlightClause(element: Element): void {
// Remove any existing highlight
element.classList.remove(HIGHLIGHT_CLASS);
// Force reflow to restart animation if needed
void (element as HTMLElement).offsetWidth;
// Add highlight class
element.classList.add(HIGHLIGHT_CLASS);
// Remove after animation completes
setTimeout(() => {
element.classList.remove(HIGHLIGHT_CLASS);
}, HIGHLIGHT_DURATION);
}
/**
* Handle hash change and highlight target clause
*/
function handleHashChange(): void {
const hash = window.location.hash;
if (!hash || !hash.startsWith("#clause-")) return;
const targetId = hash.slice(1);
const element = document.getElementById(targetId);
if (element) {
// Small delay to let scroll complete
setTimeout(() => highlightClause(element), 100);
}
}
/**
* Initialize clause highlight behavior
*/
export function initClauseHighlight(): void {
// Handle clicks on clause links
document.addEventListener("click", (e) => {
const link = (e.target as Element).closest('a[href^="#clause-"]');
if (!link) return;
const href = link.getAttribute("href");
if (!href) return;
const targetId = href.slice(1);
const element = document.getElementById(targetId);
if (element) {
// Small delay to let scroll complete
setTimeout(() => highlightClause(element), 100);
}
});
// Handle hash changes (back/forward navigation)
window.addEventListener("hashchange", handleHashChange);
// Handle initial page load with hash
if (window.location.hash?.startsWith("#clause-")) {
// Wait for page to be fully ready
if (document.readyState === "complete") {
handleHashChange();
} else {
window.addEventListener("load", handleHashChange);
}
}
}

View File

@@ -1,165 +1,555 @@
@import "tailwindcss";
@plugin "@tailwindcss/typography";
@theme {
/* Colors */
--color-sidebar: #191818;
--color-sidebar-hover: #333;
--color-accent: #1f8dd6;
--color-text-primary: #1a1a1a;
--color-text-secondary: #777;
--color-text-muted: #999;
--color-bg-primary: #fdfdfd;
--color-bg-code: #f6f8fa;
--color-bg-code-inline: rgba(27, 31, 35, 0.05);
--color-border: #333;
@custom-variant dark (&:where(.dark, .dark *));
/* Fonts */
--font-sans: "Open Sans", Helvetica, Arial, sans-serif;
--font-heading: "Open Sans Condensed", Helvetica, Arial, sans-serif;
--font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier,
monospace;
@theme {
/* Accent colors - using Tailwind sky palette */
--color-accent: theme(colors.sky.500);
--color-accent-light: theme(colors.sky.400);
/* Fonts - self-hosted via fontsource */
--font-display: "Bricolage Grotesque Variable", system-ui, sans-serif;
--font-sans: "DM Sans Variable", system-ui, sans-serif;
--font-mono: "JetBrains Mono Variable", "SF Mono", Consolas, monospace;
/* Sizing */
--sidebar-width: 150px;
--header-height: 4rem;
--sidebar-width: 260px;
--content-max-width: 800px;
--section-padding-y: 6rem;
--section-padding-x: 2rem;
/* Transitions */
--transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
--transition-base: 250ms cubic-bezier(0.4, 0, 0.2, 1);
--transition-slow: 400ms cubic-bezier(0.4, 0, 0.2, 1);
--transition-smooth: 600ms cubic-bezier(0.16, 1, 0.3, 1);
/* Shadows */
--shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
--shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
--shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.12);
--shadow-glow: 0 0 40px theme(colors.sky.500 / 15%);
}
/* Smooth scroll */
html {
scroll-behavior: smooth;
}
/* Scroll margin for anchor links */
[id] {
scroll-margin-top: calc(var(--header-height) + 2rem);
}
/* Base styles */
@layer base {
html {
height: 100%;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
body {
font-family: var(--font-sans);
font-size: 16px;
font-weight: 400;
line-height: 1.5;
color: var(--color-text-primary);
background-color: var(--color-bg-primary);
line-height: 1.7;
overflow-x: hidden;
background-color: theme(colors.slate.50);
color: theme(colors.slate.950);
}
.dark body {
background-color: theme(colors.neutral.950);
color: theme(colors.neutral.50);
}
/* Typography */
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: var(--font-heading);
font-family: var(--font-display);
font-weight: 700;
color: #333;
line-height: 1.2;
letter-spacing: -0.02em;
color: theme(colors.slate.950);
}
.dark h1,
.dark h2,
.dark h3,
.dark h4,
.dark h5,
.dark h6 {
color: theme(colors.neutral.50);
}
h1 {
font-size: 2.5em;
line-height: 1.2;
font-size: clamp(2.5rem, 6vw, 4.5rem);
font-weight: 800;
letter-spacing: -0.03em;
}
h2 {
font-size: clamp(1.75rem, 4vw, 2.5rem);
margin-top: 3rem;
margin-bottom: 1.5rem;
}
h3 {
font-size: clamp(1.25rem, 2vw, 1.5rem);
margin-top: 2rem;
margin-bottom: 1rem;
}
p {
margin-bottom: 1.25rem;
}
/* Links */
a {
color: var(--color-accent);
text-decoration: none;
transition: color var(--transition-fast);
word-break: break-word;
}
a:hover {
color: var(--color-accent-light);
}
/* Code */
code {
font-family: var(--font-mono);
font-size: 0.875em;
border-radius: 4px;
padding: 0.2em 0.4em;
background-color: theme(colors.slate.950 / 5%);
}
.dark code {
background-color: theme(colors.neutral.400 / 15%);
}
pre {
font-family: var(--font-mono);
border-radius: 8px;
padding: 1.25rem;
overflow-x: auto;
line-height: 1.6;
background-color: theme(colors.slate.200);
}
.dark pre {
background-color: theme(colors.neutral.900);
}
pre > code {
background-color: transparent !important;
padding: 0;
font-size: 0.875rem;
}
/* Lists */
ul,
ol {
margin-bottom: 1.25rem;
padding-left: 1.5rem;
}
ul {
list-style-type: disc;
}
ol {
list-style-type: decimal;
}
li {
margin-bottom: 0.5rem;
}
/* Nested list styling */
ol ol,
ul ol {
list-style-type: lower-roman;
list-style-type: decimal;
}
ul ul ol,
ul ol ol,
ol ul ol,
ol ol ol {
list-style-type: lower-alpha;
list-style-type: decimal;
}
a {
word-break: break-word;
/* Blockquotes */
blockquote {
border-left: 3px solid var(--color-accent);
padding-left: 1.5rem;
margin: 1.5rem 0;
font-style: italic;
color: theme(colors.slate.600);
}
code {
background-color: var(--color-bg-code-inline);
border-radius: 3px;
font-family: var(--font-mono);
font-size: 85%;
margin: 0;
padding: 0.3em 0.4em 0.1em 0.4em;
.dark blockquote {
color: theme(colors.neutral.400);
}
pre {
background-color: var(--color-bg-code);
border-radius: 3px;
line-height: 1.45;
padding: 16px;
/* Strong text */
strong {
font-weight: 600;
}
pre > code {
background-color: transparent !important;
border-radius: 0;
font-size: 90%;
padding: 0;
/* Focus styles */
:focus-visible {
outline: 2px solid var(--color-accent);
outline-offset: 2px;
}
}
/* Layout transitions */
/* Keyframe animations - defined outside layers for proper cascade */
@keyframes clause-highlight-pulse {
0% {
background-color: theme(colors.sky.500 / 15%);
}
100% {
background-color: transparent;
}
}
@keyframes clause-highlight-pulse-dark {
0% {
background-color: theme(colors.sky.700 / 20%);
}
100% {
background-color: transparent;
}
}
@keyframes fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes fade-in-up {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@keyframes fade-in-down {
from {
opacity: 0;
transform: translateY(-10px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@keyframes slide-in-left {
from {
opacity: 0;
transform: translateX(-20px);
}
to {
opacity: 1;
transform: translateX(0);
}
}
@keyframes bounce-subtle {
0%,
100% {
transform: translateY(0);
}
50% {
transform: translateY(-8px);
}
}
/* Animation utility classes */
.animate-fade-in {
opacity: 0;
animation: fade-in 400ms ease-out forwards;
}
.animate-fade-in-up {
opacity: 0;
animation: fade-in-up 600ms cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
.animate-fade-in-down {
opacity: 0;
animation: fade-in-down 250ms ease-out forwards;
}
.animate-slide-in-left {
opacity: 0;
animation: slide-in-left 600ms cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
.animate-bounce-subtle {
animation: bounce-subtle 2s ease-in-out infinite;
}
/* Animation delays */
.delay-100 {
animation-delay: 100ms;
}
.delay-200 {
animation-delay: 200ms;
}
.delay-300 {
animation-delay: 300ms;
}
.delay-400 {
animation-delay: 400ms;
}
.delay-500 {
animation-delay: 500ms;
}
.delay-600 {
animation-delay: 600ms;
}
.delay-700 {
animation-delay: 700ms;
}
.delay-800 {
animation-delay: 800ms;
}
/* Component styles */
@layer components {
#layout,
#menu,
.menu-link {
transition: all 0.2s ease-out;
/* Section container - uses CSS vars, keep here */
.section-container {
max-width: calc(var(--content-max-width) + var(--sidebar-width) + 4rem);
margin: 0 auto;
padding: 0 var(--section-padding-x);
}
/* Spec content styling */
.spec-content h1 {
margin-bottom: 0.5em;
/* Prose styling for markdown content - can't add classes to rendered HTML */
.prose-spec {
max-width: var(--content-max-width);
}
.spec-content h2 {
margin-top: 2em;
margin-bottom: 0.75em;
padding-bottom: 0.3em;
border-bottom: 1px solid #eee;
.prose-spec h2 {
font-size: 1.75rem;
margin-top: 3rem;
margin-bottom: 1.5rem;
padding-bottom: 0.75rem;
border-bottom: 1px solid theme(colors.slate.200);
}
.spec-content h3 {
margin-top: 1.5em;
margin-bottom: 0.5em;
.dark .prose-spec h2 {
border-bottom-color: theme(colors.neutral.800);
}
.spec-content p {
margin-bottom: 1em;
.prose-spec h2:first-child {
margin-top: 0;
}
.spec-content ul,
.spec-content ol {
margin-bottom: 1em;
padding-left: 2em;
.prose-spec h3 {
font-size: 1.25rem;
font-weight: 600;
margin-top: 2rem;
margin-bottom: 1rem;
color: theme(colors.slate.600);
}
.spec-content li {
margin-bottom: 0.25em;
.dark .prose-spec h3 {
color: theme(colors.neutral.400);
}
.spec-content a {
color: #1f8dd6;
.prose-spec p {
color: theme(colors.slate.600);
}
.dark .prose-spec p {
color: theme(colors.neutral.400);
}
.prose-spec strong {
color: theme(colors.slate.950);
}
.dark .prose-spec strong {
color: theme(colors.neutral.50);
}
.prose-spec li {
color: theme(colors.slate.600);
}
.dark .prose-spec li {
color: theme(colors.neutral.400);
}
/* Spec clauses - ordered list with CSS counters and hover anchor links */
.prose-spec ol {
padding-left: 2.25rem;
counter-reset: item;
list-style: none;
}
.prose-spec ol > li {
counter-increment: item;
position: relative;
margin-bottom: 0.5rem;
}
.prose-spec ol > li::before {
content: counters(item, ".") ".";
position: absolute;
left: -2.5rem;
width: 2rem;
text-align: right;
font-weight: 500;
color: theme(colors.slate.400);
}
.dark .prose-spec ol > li::before {
color: theme(colors.neutral.500);
}
/* Clause highlight effect using ::after pseudo-element */
.prose-spec ol > li::after {
content: "";
position: absolute;
inset: -0.25rem -0.5rem;
left: -2.75rem;
background-color: transparent;
border-radius: 4px;
pointer-events: none;
z-index: -1;
}
.prose-spec ol > li.clause-highlight::after {
animation: clause-highlight-pulse 2s ease-out forwards;
}
.dark .prose-spec ol > li.clause-highlight::after {
animation: clause-highlight-pulse-dark 2s ease-out forwards;
}
/* Anchor link with clause number - hidden by default, shown on hover */
.prose-spec .clause-link {
position: absolute;
right: 100%;
padding-right: 0.5rem;
font-weight: 500;
color: theme(colors.slate.400);
text-decoration: none;
opacity: 0;
display: flex;
align-items: center;
gap: 0.25rem;
white-space: nowrap;
}
.spec-content a:hover {
text-decoration: underline;
.dark .prose-spec .clause-link {
color: theme(colors.neutral.500);
}
.spec-content img {
/* Link icon in the anchor link */
.prose-spec .clause-link-icon {
flex-shrink: 0;
width: 0.875rem;
height: 0.875rem;
}
/* On hover: show anchor link, hide CSS counter */
.prose-spec ol > li:hover:not(:has(ol:hover)) > .clause-link,
.prose-spec ol > li:hover:not(:has(ol:hover)) > p > .clause-link,
.prose-spec .clause-link:hover {
opacity: 1;
}
.prose-spec ol > li:hover:not(:has(ol:hover))::before {
opacity: 0;
}
/* Orange color on direct hover of the link */
.prose-spec .clause-link:hover {
color: theme(colors.orange.500);
}
.prose-spec img {
max-width: 100%;
height: auto;
margin: 1em 0;
border-radius: 8px;
margin: 2rem 0;
}
.spec-content blockquote {
margin: 1em 0;
padding-left: 1em;
border-left: 4px solid #ddd;
color: #666;
.prose-spec p:last-child {
margin-bottom: 0;
}
.spec-content hr {
margin: 2em 0;
border: none;
border-top: 1px solid #eee;
/* Nav link active state (toggled by JavaScript) */
.nav-link.active {
color: theme(colors.sky.700) !important;
background-color: theme(colors.sky.600 / 15%) !important;
}
.dark .nav-link.active {
color: theme(colors.sky.400) !important;
background-color: theme(colors.sky.600 / 20%) !important;
}
/* Sidebar link active state (toggled by JavaScript) */
.sidebar-link.active {
color: theme(colors.sky.700) !important;
background-color: theme(colors.sky.600 / 15%) !important;
}
.dark .sidebar-link.active {
color: theme(colors.sky.400) !important;
background-color: theme(colors.sky.600 / 20%) !important;
}
/* Sidebar scrollbar styling */
#spec-sidebar::-webkit-scrollbar {
width: 4px;
}
#spec-sidebar::-webkit-scrollbar-track {
background: transparent;
}
#spec-sidebar::-webkit-scrollbar-thumb {
background-color: theme(colors.slate.200);
border-radius: 2px;
}
.dark #spec-sidebar::-webkit-scrollbar-thumb {
background-color: theme(colors.neutral.800);
}
}

View File

@@ -0,0 +1,437 @@
/**
* Parses spec content using markdown AST for robust section extraction.
*/
import { unified } from "unified";
import remarkParse from "remark-parse";
import remarkRehype from "remark-rehype";
import rehypeStringify from "rehype-stringify";
import { getIconData, iconToSVG, iconToHTML } from "@iconify/utils";
import heroicons from "@iconify-json/heroicons/icons.json";
import type { Root, RootContent, Heading, List, ListItem, Html } from "mdast";
import type { Root as HastRoot } from "hast";
export interface TocItem {
id: string;
title: string;
level: number;
clause?: string;
}
export interface FAQItem {
id: string;
question: string;
answer: string;
}
export interface SpecSection {
id: string;
title: string;
content: string;
clause: string;
}
export interface ParsedSpec {
introduction: string;
summary: string;
terminology: string;
terminologyTitle: string;
specification: string;
specificationTitle: string;
specSections: SpecSection[];
faq: FAQItem[];
license: string;
tocItems: TocItem[];
}
/**
* Convert text to a URL-friendly ID
*/
function slugify(text: string): string {
return text
.toLowerCase()
.replace(/[^\w\s-]/g, "")
.replace(/\s+/g, "-")
.trim();
}
/**
* Generate link icon SVG from heroicons icon set
*/
function generateLinkIconSvg(): string {
const iconData = getIconData(heroicons, "link");
if (!iconData) {
return "";
}
const result = iconToSVG(iconData);
return iconToHTML(result.body, {
...result.attributes,
class: "clause-link-icon",
stroke: "currentColor",
"stroke-width": "2",
});
}
type MdastNode = Root | RootContent;
/**
* Extract plain text from an mdast node tree
*/
function extractText(node: MdastNode): string {
if ("value" in node && typeof node.value === "string") {
return node.value;
}
if ("children" in node && Array.isArray(node.children)) {
return node.children.map((child) => extractText(child)).join("");
}
return "";
}
/**
* Find index of heading containing specific text
*/
function findHeadingIndex(
nodes: RootContent[],
text: string,
depth: number = 2,
): number {
return nodes.findIndex(
(node) =>
node.type === "heading" &&
(node as Heading).depth === depth &&
extractText(node).toLowerCase().includes(text.toLowerCase()),
);
}
/**
* Extract nodes between two headings
*/
function extractSectionNodes(
nodes: RootContent[],
startText: string,
depth: number = 2,
): RootContent[] {
const startIdx = findHeadingIndex(nodes, startText, depth);
if (startIdx === -1) return [];
// Find the next heading of same or higher level
let endIdx = nodes.length;
for (let i = startIdx + 1; i < nodes.length; i++) {
const node = nodes[i];
if (node.type === "heading" && (node as Heading).depth <= depth) {
endIdx = i;
break;
}
}
// Return nodes after the heading (not including the heading itself)
return nodes.slice(startIdx + 1, endIdx);
}
/**
* Get the full heading text
*/
function getHeadingText(
nodes: RootContent[],
text: string,
depth: number = 2,
): string {
const idx = findHeadingIndex(nodes, text, depth);
if (idx === -1) return text;
return extractText(nodes[idx]);
}
/**
* Convert mdast nodes to HTML string
*/
async function nodesToHtml(nodes: RootContent[]): Promise<string> {
if (nodes.length === 0) return "";
// Create a root node with these children
const root: Root = { type: "root", children: nodes };
const result = await unified()
.use(remarkRehype, { allowDangerousHtml: true })
.use(rehypeStringify, { allowDangerousHtml: true })
.run(root);
const html = unified()
.use(rehypeStringify, { allowDangerousHtml: true })
.stringify(result as HastRoot);
return html;
}
/**
* Extract top-level list item titles from an ordered list
*/
function extractListItemTitles(list: List): string[] {
const titles: string[] = [];
for (const item of list.children) {
if (item.type !== "listItem") continue;
// Get the first paragraph or text content of the list item
// The title is the text before any nested list
let title = "";
for (const child of item.children) {
if (child.type === "list") break; // Stop at nested list
if (child.type === "paragraph") {
title = extractText(child);
break;
}
// Handle inline text directly in list item
title += extractText(child);
}
title = title.split("\n")[0].trim();
if (title) {
titles.push(title);
}
}
return titles;
}
/**
* Find the first ordered list in nodes and extract its structure
*/
function findSpecSections(nodes: RootContent[]): SpecSection[] {
const sections: SpecSection[] = [];
for (const node of nodes) {
if (node.type === "list" && (node as List).ordered) {
const titles = extractListItemTitles(node as List);
for (let i = 0; i < titles.length; i++) {
const title = titles[i];
const clauseNum = i + 1;
sections.push({
id: `clause-${clauseNum}`,
title,
content: "",
clause: `${clauseNum}.`,
});
}
break; // Only process first ordered list
}
}
return sections;
}
/**
* Add anchor IDs and links to ordered list items recursively.
* Injects an invisible anchor link before content for hover-to-reveal behavior.
*/
function addClauseAnchors(list: List, prefix: string = ""): void {
for (let i = 0; i < list.children.length; i++) {
const item = list.children[i];
if (item.type !== "listItem") continue;
// Calculate clause number and ID
const clauseNum = prefix ? `${prefix}.${i + 1}` : `${i + 1}`;
const clauseId = `clause-${clauseNum.replace(/\./g, "-")}`;
// Add ID to the list item via hProperties
(item as ListItem & { data?: { hProperties?: { id?: string } } }).data = {
hProperties: { id: clauseId },
};
// Find the first paragraph in the item and prepend an anchor link
for (const child of item.children) {
if (child.type === "paragraph") {
// Create anchor link HTML with clause number text and link icon
const linkIcon = generateLinkIconSvg();
const anchorHtml: Html = {
type: "html",
value: `<a href="#${clauseId}" class="clause-link" aria-hidden="true">${linkIcon}${clauseNum}.</a>`,
};
// Prepend anchor to paragraph children
(child as { children: RootContent[] }).children.unshift(
anchorHtml as unknown as RootContent,
);
break;
}
}
// Recursively process nested ordered lists
for (const child of item.children) {
if (child.type === "list" && (child as List).ordered) {
addClauseAnchors(child as List, clauseNum);
}
}
}
}
/**
* Extract FAQ items from FAQ section nodes
*/
function extractFAQFromNodes(nodes: RootContent[]): FAQItem[] {
const items: FAQItem[] = [];
let currentQuestion = "";
let currentId = "";
for (const node of nodes) {
if (node.type === "heading" && (node as Heading).depth === 3) {
// Save previous FAQ item if we had one
if (currentQuestion) {
items.push({
id: currentId,
question: currentQuestion,
answer: "", // Placeholder, will be filled later
});
}
currentQuestion = extractText(node);
currentId = `faq-${slugify(currentQuestion).slice(0, 50)}`;
}
}
// Don't forget the last item
if (currentQuestion) {
items.push({
id: currentId,
question: currentQuestion,
answer: "",
});
}
return items;
}
/**
* Build table of contents from parsed sections
*/
function buildTocItems(parsed: Partial<ParsedSpec>): TocItem[] {
const items: TocItem[] = [];
if (parsed.terminology) {
items.push({
id: "terminology",
title: parsed.terminologyTitle || "Terminology",
level: 2,
});
}
if (parsed.specification) {
items.push({
id: "specification",
title: "Specification",
level: 2,
});
if (parsed.specSections) {
for (const section of parsed.specSections) {
items.push({
id: section.id,
title: section.title,
level: 3,
clause: section.clause,
});
}
}
}
return items;
}
/**
* Main parsing function - takes markdown content and returns structured content
*/
export async function parseSpecContent(
markdown: string,
): Promise<ParsedSpec> {
// Parse markdown to AST
const tree = unified().use(remarkParse).parse(markdown) as Root;
// Remove title (h1) from the tree - it's displayed separately in the Hero
const nodes = tree.children.filter((node) => {
if (node.type === "heading" && (node as Heading).depth === 1) return false;
return true;
});
// Get heading titles
const terminologyTitle = getHeadingText(nodes, "Terminology");
const specificationTitle = getHeadingText(
nodes,
"Git Common-Flow Specification",
);
// Extract section nodes
const introNodes = extractSectionNodes(nodes, "Introduction");
const summaryNodes = extractSectionNodes(nodes, "Summary");
const terminologyNodes = extractSectionNodes(nodes, "Terminology");
const specNodes = extractSectionNodes(nodes, "Git Common-Flow Specification");
const faqNodes = extractSectionNodes(nodes, "FAQ");
const licenseNodes = extractSectionNodes(nodes, "License");
// Extract spec sections from the first ordered list
const specSections = findSpecSections(specNodes);
// Add anchor IDs and links to spec list items
for (const node of specNodes) {
if (node.type === "list" && (node as List).ordered) {
addClauseAnchors(node as List);
break;
}
}
// Extract FAQ items structure
const faqItems = extractFAQFromNodes(faqNodes);
// Collect FAQ answer nodes for each item
const faqAnswerNodes: RootContent[][] = [];
let currentAnswerNodes: RootContent[] = [];
for (const node of faqNodes) {
if (node.type === "heading" && (node as Heading).depth === 3) {
if (currentAnswerNodes.length > 0) {
faqAnswerNodes.push(currentAnswerNodes);
}
currentAnswerNodes = [];
} else {
currentAnswerNodes.push(node);
}
}
// Don't forget the last answer
if (currentAnswerNodes.length > 0) {
faqAnswerNodes.push(currentAnswerNodes);
}
// Convert sections to HTML
const [introduction, summary, terminology, specification, license] =
await Promise.all([
nodesToHtml(introNodes),
nodesToHtml(summaryNodes),
nodesToHtml(terminologyNodes),
nodesToHtml(specNodes),
nodesToHtml(licenseNodes),
]);
// Convert FAQ answers to HTML
const faqAnswers = await Promise.all(
faqAnswerNodes.map((nodes) => nodesToHtml(nodes)),
);
// Assign FAQ answers
const faq = faqItems.map((item, i) => ({
...item,
answer: faqAnswers[i] || "",
}));
const parsed: ParsedSpec = {
introduction,
summary,
terminology,
terminologyTitle,
specification,
specificationTitle,
specSections,
faq,
license,
tocItems: [],
};
parsed.tocItems = buildTocItems(parsed);
return parsed;
}

48
src/utils/versions.ts Normal file
View File

@@ -0,0 +1,48 @@
import { getCollection } from "astro:content";
import * as semver from "semver";
import { config } from "../config";
export interface VersionInfo {
versions: string[];
currentVersion: string;
}
/**
* Get version information derived from available spec files.
* Returns all versions sorted newest-first and determines the current version.
*/
export async function getVersionInfo(): Promise<VersionInfo> {
const specs = await getCollection("spec");
const versions = specs
.map((s) => s.data.version)
.filter((v): v is string => semver.valid(v) !== null)
.sort((a, b) => semver.rcompare(a, b)); // newest first
const currentVersion =
config.currentVersionOverride ?? determineCurrentVersion(versions);
return { versions, currentVersion };
}
/**
* Determine the current version based on priority:
* 1. Latest stable version
* 2. Latest RC version
* 3. Newest available version
*/
function determineCurrentVersion(versions: string[]): string {
// Priority order: stable (null prerelease) first, then rc
const priority: (string | null)[] = [null, "rc"];
for (const type of priority) {
const match = versions.find((v) => {
const pre = semver.prerelease(v);
if (type === null) return pre === null;
return pre?.[0] === type;
});
if (match) return match;
}
// Fallback to newest overall
return versions[0] ?? "";
}

View File

@@ -1,5 +1,10 @@
{
"extends": "astro/tsconfigs/strict",
"include": [".astro/types.d.ts", "**/*"],
"exclude": ["dist", "docs"]
"include": [
".astro/types.d.ts",
"**/*"
],
"exclude": [
"dist"
]
}

View File

@@ -2,6 +2,6 @@
"name": "commonflow-org",
"compatibility_date": "2026-01-12",
"assets": {
"directory": "./docs"
"directory": "./dist"
}
}