<git-show>

Render one commit's metadata and patch from a public GitHub, GitLab.com, or Bitbucket Cloud repository. See supported Git hosts for accepted repository URL formats and API limits.

Commit and patch

revision accepts a branch, tag, or full commit ID. Like git show <revision>, a branch or tag resolves to the commit it currently names.

<git-show
  repository="https://github.com/erkde/git-elements.js"
  revision="v0.1.1"
  line-numbers
></git-show>

Loading commit…The commit is unavailable.

Change summaries

Stat

Add stat for a per-file change graph and a totals line:

<git-show
  repository="https://github.com/erkde/git-elements.js"
  revision="v0.1.1"
  stat
></git-show>

Loading commit…The commit is unavailable.

The bars and counts come from the loaded commit patch. New, deleted, renamed, copied, and mode-changed files get compact labels. If several summary attributes are present, stat takes precedence.

Numstat

Add numstat to show additions and deletions for each file in the commit patch:

<git-show
  repository="https://github.com/erkde/git-elements.js"
  revision="v0.1.1"
  numstat
></git-show>

Loading commit…The commit is unavailable.

The counts come from the same patch as the full view. Binary files show - for both counts. If numstat and shortstat are both present, numstat is shown.

Short stat

Add shortstat to show changed-file, insertion, and deletion totals in place of the commit patch:

<git-show
  repository="https://github.com/erkde/git-elements.js"
  revision="v0.1.1"
  shortstat
></git-show>

Loading commit…The commit is unavailable.

The totals are calculated from the commit patch loaded by the nested <git-diff> element.

Revision semantics

<git-show> accepts one revision rather than a revision set. Two-dot and three-dot expressions belong to <git-log> and are rejected here.

For ordinary commits, the patch shows the commit relative to its first parent. Root commits are shown relative to an empty tree. See large-diff limits for commits whose host omits part of a patch.

The current implementation supports hosted public repositories only. It does not interpret local-only names such as HEAD, origin/main, reflog expressions, or unpushed commits.

Repository caching

An uncached show requires commit metadata and diff data from the provider. Identical instances share both requests. See repository caching for stored results, expiration, and reload() behavior.

API

Attributes

Name	Type	Description
repository	string	Public repository URL.
revision	string	Branch, tag, or full commit ID to show.
line-numbers	boolean	Show old and new line-number gutters in the patch.
shortstat	boolean	Show file, insertion, and deletion totals instead of the patch.
numstat	boolean	Show additions and deletions per file instead of the patch.
stat	boolean	Show a per-file change graph and totals instead of the patch.
theme	"light" | "dark"	Override the operating-system color preference.

Properties

Name	Type	Description
repository	string	Public repository URL containing the revision.
revision	string	Branch, tag, or full commit ID currently selected.
lineNumbers	boolean	Whether old and new line-number gutters are shown in the patch.
shortStat	boolean	Whether file, insertion, and deletion totals replace the patch.
numStat	boolean	Whether per-file addition and deletion counts replace the patch.
stat	boolean	Whether per-file change graphs and totals replace the patch.
commit	GitShowCommit | null	Normalized metadata for the commit currently displayed. Read-only.
patch	string	Raw unified diff text for the commit currently displayed. Read-only.

Methods

Name	Returns	Description
reload()	Promise<void>	Bypass cached data and request the commit and patch again.

Slots

Name	Description
loading	Content shown when loading exceeds the configured delay.
error	Content shown when the commit cannot be loaded.

Events

Name	Type	Description
load	Event	Fired after the commit and patch load and render.
error	Event	Fired when the commit or patch cannot be loaded.

CSS custom properties

Name	Default	Description
--git-show-bg	#f5f5f4	Component background color.
--git-show-text-color	#292524	Primary text color.
--git-show-border-color	#d6d3d1	Border color.
--git-show-muted-color	#78716c	Commit label color.
--git-show-link-color	#006d8f	Commit hash link color.
--git-show-font-family	ui-monospace, monospace	Component font family.
--git-show-font-size	12px	Component font size.
--git-show-line-height	20px	Component line height.
--git-show-loading-delay	150ms	Delay before slotted loading content appears.

CSS parts

Name	Description
container	Container for the commit metadata and patch.
header	Commit metadata header.
hash	Full commit hash and link.
author	Commit author identity.
date	Author date.
message	Full commit message.
subject	First line of the commit message.
body	Remaining commit message body.
diff	Nested <git-diff> element.
loading	Loading-state container.
error	Error-state container.

Exports and registration

Name	Kind	Module
<git-show>	Custom element registration	@erkde/git-elements
GitShowElement	Class	@erkde/git-elements/components/git-show

See loading and errors for states and events, and styling for custom properties and CSS parts.