Feat/skills hub

[fabianrbz]

Description

Fixes #issue

Preview Links

Checklist

• Tested how-to docs. If not, note why here.
• All pages contain metadata.
• Any new docs link to existing docs.
• All autogenerated instructions render correctly (API, decK, Konnect, Kong Manager).
• Style guide (capitalized gateway entities, placeholder URLs) implemented correctly.
• Every page has a description entry in frontmatter.
• Add new pages to the product documentation index (if applicable).

[Copilot]

Pull request overview

Adds a new “Kong Skills Hub” area to the Kong Developer site by integrating the Kong/skills repo (as a submodule), generating skill overview pages and .well-known/skills discovery output, and wiring up the UI (cards, install tabs, search).

Changes:

• Introduces a Jekyll generator to load skills content from a configured repo/submodule and render /skills/* pages plus a .well-known/skills/index.json discovery index.
• Adds new Skills Hub pages, layouts, includes (cards/info box/install tabs), and a small JS search/filter entrypoint.
• Updates config/schema/hooks/styles/icons to support the new skill content type and UI.

Reviewed changes

Copilot reviewed 27 out of 41 changed files in this pull request and generated 5 comments.

Show a summary per file

File	Description
tailwind.config.js	Adds skills pages to Tailwind content scanning.
jekyll.yml	Adds skills repo config and .well-known/skills output path.
jekyll-dev.yml	Adds skip.skills toggle for local/dev builds.
app/skills/install.html	New install guide page that includes generated install tabs.
app/skills/index.html	New Skills Hub index page with search UI and cards grid.
app/assets/icons/skills/scripts.svg	New icon for “scripts” indicator.
app/assets/icons/skills/references.svg	New icon for “references” indicator.
app/assets/icons/skills/assets.svg	New icon for “assets” indicator.
app/assets/icons/search.svg	Adds a search icon used by the Skills Hub search input.
app/assets/icons/other-tools.svg	Adds icon used for “other tools”.
app/assets/icons/goose.svg	Adds icon for Goose tool.
app/assets/icons/ai-tools/other-tools.svg	Adds themed “other tools” icon variant.
app/assets/icons/ai-tools/goose.svg	Adds themed Goose icon variant.
app/assets/icons/ai-tools/github-copilot.svg	Adds themed GitHub Copilot icon.
app/assets/icons/ai-tools/gemini-cli.svg	Adds themed Gemini CLI icon.
app/assets/icons/ai-tools/cursor.svg	Adds themed Cursor icon.
app/assets/icons/ai-tools/codex.svg	Adds themed Codex icon.
app/assets/icons/ai-tools/claude-code.svg	Adds themed Claude Code icon.
app/_plugins/hooks/split_into_sections.rb	Enables section-splitting for content_type: skill pages.
app/_plugins/generators/skills/skill.rb	Introduces a Skill model to parse SKILL.md frontmatter/content.
app/_plugins/generators/skills/pages/static_skill_file.rb	Emits skill repo files as static output under .well-known/skills/.
app/_plugins/generators/skills/pages/overview.rb	Generates per-skill overview pages under /skills/:slug/.
app/_plugins/generators/skills/generator.rb	Main skills generator: loads skills + install tabs + overview pages.
app/_plugins/generators/skills/discovery.rb	Builds .well-known/skills/index.json and static file exports.
app/_plugins/generators/skills.rb	Registers the skills generator with Jekyll.
app/_plugins/generators/data/search_tags/base.rb	Maps content_type: skill into the search tag pipeline.
app/_plugins/converters/shiki.rb	Adds markdown to the Shiki language whitelist.
app/_layouts/skill.html	Adds a dedicated layout for skill pages with an info box.
app/_layouts/default.html	Loads the skills Vite entrypoint when page.skills_index is set.
app/_includes/skills/quick_install.md	Adds an “npx skills add …” quick-install snippet include.
app/_includes/skills/overview.md	Template used for generated skill overview content.
app/_includes/skills/install.md	Renders install instructions as navtabs from site.data.skill_install_tabs.
app/_includes/info_box/skill.html	Adds a skill-specific info box (source/version/license/tools/contents).
app/_includes/components/tabs.html	Adds optional icon rendering for tab buttons.
app/_includes/cards/skill.html	Adds a skills card for hub grid rendering + search dataset attributes.
app/_data/schemas/frontmatter/base.json	Extends allowed content_type enum with skill.
app/_assets/stylesheets/index.css	Adds styling for skill pages and skills grid code blocks.
app/_assets/entrypoints/skills.js	Adds client-side search/filter + URL query sync for the hub.
.gitmodules	Adds the skills repo as a git submodule.
.github/workflows/sync-skills-submodule.yml	Adds scheduled/dispatch workflow to sync the skills submodule.

[Copilot]

site.data.skill_install_tabs can be nil (for example when skip.skills is true or the skills repo isn't present), so calling .size here can raise during site build; guard for nil or default it to an empty array before checking size.

Suggested change

	{% if site.data.skill_install_tabs.size > 0 %}
	{% if site.data.skill_install_tabs and site.data.skill_install_tabs.size > 0 %}

[Copilot]

Skill title/description are injected into HTML attributes and text without escaping; if the upstream skills metadata contains quotes/HTML this can break markup or enable injection—apply HTML escaping (especially for data-* attributes and the heading/paragraph).

Suggested change

	data-title="{{ skill.title | downcase }}"
	data-description="{{ skill.description | downcase | truncate: 200 }}"
	>
	<a href="{{ skill.url }}" class="flex flex-col gap-5 hover:no-underline text-secondary w-full p-6">
	<div class="flex items-center justify-between">
	<h3 class="font-mono">/{{ skill.title }}</h3>
	{% if skill.version %}<span class="badge w-fit text-xs">{{ skill.version }}</span>{% endif %}
	</div>
	<div class="flex flex-col gap-3 flex-grow">
	<p class="text-sm line-clamp-3">{{ skill.description }}</p>
	data-title="{{ skill.title | downcase | escape }}"
	data-description="{{ skill.description | downcase | truncate: 200 | escape }}"
	>
	<a href="{{ skill.url }}" class="flex flex-col gap-5 hover:no-underline text-secondary w-full p-6">
	<div class="flex items-center justify-between">
	<h3 class="font-mono">/{{ skill.title | escape }}</h3>
	{% if skill.version %}<span class="badge w-fit text-xs">{{ skill.version }}</span>{% endif %}
	</div>
	<div class="flex flex-col gap-3 flex-grow">
	<p class="text-sm line-clamp-3">{{ skill.description | escape }}</p>

[Copilot]

e.target isn't guaranteed to be an Element (it can be a text node), so calling e.target.closest(...) can throw and break click handling; check e.target instanceof Element (or use e.composedPath()/closest on a casted element) before calling closest.

Suggested change

	if (e.target.closest("clipboard-copy")) {
	if (e.target instanceof Element && e.target.closest("clipboard-copy")) {

[Copilot]

require 'digest' appears unused in this file; please remove it to avoid dead dependencies and keep the generator code minimal.

Suggested change

require 'digest'

[Copilot]

The skills submodule uses an SSH URL (git@github.com:...), which will fail in environments without an SSH key (CI/Netlify/submodule sync); switch this to an HTTPS URL like the existing kuma submodule.

Suggested change

	url = git@github.com:Kong/skills.git
	url = https://github.com/Kong/skills.git

[netlify]

❌ Deploy Preview for kongdeveloper failed.

Name	Link
🔨 Latest commit	0163901
🔍 Latest deploy log	https://app.netlify.com/projects/kongdeveloper/deploys/69e78552dd475b00089b3b45