# widgetkit

Skill for building and reviewing WidgetKit widgets and controls: timelines, configurable widgets, interactive buttons. Use it when your app needs a Home Screen or Lock Screen widget.

- skill · `type=skill` · Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode · 4000 installs · ★ 1237
- Author: dpearson2699
- License: LicenseRef-Unknown · policy=link-only · description only; the file stays with the author
- Source: https://github.com/dpearson2699/swift-ios-skills/tree/HEAD/skills/widgetkit/SKILL.md
- Updated: 2026-07-31
- HTML: https://affpapa.org/en/nevibecode/skills/widgetkit

## What it does

The skill walks an agent through a widget extension from the first step: adding the target, defining the entry type, writing the provider, laying out the SwiftUI view for each `WidgetFamily`, declaring the `Widget` struct and registering everything in a `WidgetBundle` marked `@main`. Widgets nobody configures use `StaticConfiguration`. Widgets with user options use `AppIntentConfiguration` together with `AppIntentTimelineProvider`, which is async by design.

Past the Home Screen there is material on interactive widgets driven by `Button` and `Toggle`, controls in Control Center built on `ControlWidgetButton` and `ControlWidgetToggle`, Lock Screen and StandBy surfaces, widget URLs for deep links, Smart Stack relevance, Liquid Glass rendering. App Groups belong on the extension setup step, because the app and the widget reach each other's data through that container.

Live Activity lifecycles and App Intents entity modelling are pushed to sibling skills `activitykit` and `app-intents`; they show up here only where a widget surface is involved. Timeline strategies, push updates and Xcode setup live in `references/widgetkit-advanced.md`. A review checklist closes the skill out.

## Install

### Claude Code (native platform)

1. **Skills CLI (Vercel)**
```bash
npx skills add dpearson2699/swift-ios-skills --skill widgetkit -a claude-code
```

2. **Manually: put the files in place**
- File: `~/.claude/skills/widgetkit/SKILL.md` — Copy the whole skill folder; for one project use .claude/skills/widgetkit/

### Codex

1. **Skills CLI (Vercel)**
```bash
npx skills add dpearson2699/swift-ios-skills --skill widgetkit -a codex
```

2. **Manually: put the files in place**
- File: `.agents/skills/widgetkit/SKILL.md` — For all projects use ~/.agents/skills/

### Cursor

1. **Skills CLI (Vercel)**
```bash
npx skills add dpearson2699/swift-ios-skills --skill widgetkit -a cursor
```

2. **Manually: put the files in place**
- File: `.cursor/skills/widgetkit/SKILL.md` — Cursor also reads .agents/skills/ and .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install dpearson2699/swift-ios-skills widgetkit
```

2. **Manually: put the files in place**
- File: `.github/skills/widgetkit/SKILL.md`

### Gemini CLI

1. **Skills CLI (Vercel)**
```bash
npx skills add dpearson2699/swift-ios-skills --skill widgetkit -a gemini-cli
```

2. **Platform CLI**
```bash
gemini skills install https://github.com/dpearson2699/swift-ios-skills --path skills/widgetkit
```

### Windsurf (Devin Desktop)

**Manually: put the files in place**
- File: `.devin/skills/widgetkit/SKILL.md` — The legacy .windsurf/skills/ path still works

### OpenCode

**Skills CLI (Vercel)**
```bash
npx skills add dpearson2699/swift-ios-skills --skill widgetkit -a opencode
```

### Claude.ai

**Claude.ai**
- Zip the folder and upload it in Settings → Capabilities → Skills

Where a file is given instead of a command, copy the files from the source to that path: https://github.com/dpearson2699/swift-ios-skills/tree/HEAD/skills/widgetkit/SKILL.md

## When to use it
- build a timeline that refreshes on a schedule
- switch a static widget to a configurable one with AppIntent
- wire a button inside a widget to an app action
- ship a Control Center toggle on iOS 18+
- review existing widget code against a checklist

## Example prompts
- Build a Home Screen widget that reads order data from the shared App Group container and refreshes hourly.
- Convert `OrderStatusWidget` into a configurable widget using `AppIntentTimelineProvider`.
- Review this widget against the checklist and point out the family layout mistakes.

## Similar
- [vercel-react-native-skills](https://affpapa.org/en/nevibecode/skills/vercel-react-native-skills.md) — skill · 255200 installs
- [animate-expo](https://affpapa.org/en/nevibecode/skills/animate-expo.md) — skill · 137900 installs
- [mobile-native](https://affpapa.org/en/nevibecode/skills/mobile-native.md) — skill · 86600 installs
- [aso](https://affpapa.org/en/nevibecode/skills/aso.md) — skill · 75400 installs
- [swiftui-pro](https://affpapa.org/en/nevibecode/skills/swiftui-pro.md) — skill · 35200 installs
- [orca-emulator](https://affpapa.org/en/nevibecode/skills/orca-emulator.md) — skill · 5800 installs

## Other versions with the same name
- [widgetkit · prisma-labs-dev](https://affpapa.org/en/nevibecode/skills/prisma-labs-dev-widgetkit.md) — 458 installs

From the same set: [dpearson2699/swift-ios-skills](https://affpapa.org/en/nevibecode/by/dpearson2699/swift-ios-skills.md) — 86 cards

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md