creating-widgets

Guide users through developing custom widgets for the StickerNest platform.

Updated Jan 19, 2026
One-click install
npx skills add https://github.com/hkcm91/StickerNestV4 --skill creating-widgets-hkcm91
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: creating-widgets
Source: https://github.com/hkcm91/StickerNestV4/tree/main/.claude/skills/creating-widgets
Command: npx skills add https://github.com/hkcm91/StickerNestV4 --skill creating-widgets-hkcm91

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides a comprehensive guide to creating new, custom widgets for the StickerNest platform, enabling users to extend its functionality with their own unique components.

Core Features & Use Cases

  • Widget Development Framework: Understand the "Lego Brick Model" for composable widgets.
  • Layered Architecture: Learn about the five conceptual layers of a widget (Theme, Logic, State, Data Binding, Pipeline I/O).
  • Manifest Definition: Define widget properties, data inputs/outputs, and capabilities.
  • Use Case: You need a custom widget to display real-time stock prices fetched from a specific API. This Skill will guide you through defining its manifest, handling data binding, and implementing its display logic.

Quick Start

Use the creating-widgets skill to create a new widget by following the steps outlined in the 'Quick Start: Creating an Inline Widget' section.

Frequently Asked Questions about creating-widgets

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I develop custom widgets for the StickerNest platform?

To develop custom widgets for StickerNest, you follow a guide covering widget architecture, manifest creation, data binding, theming, event protocols, and registration to extend the platform with bespoke UI components.

What is the widget architecture model used for creating custom components?

The widget architecture uses a composable "Lego Brick Model" with five conceptual layers: Theme, Logic, State, Data Binding, and Pipeline I/O, which collectively define the structure and behavior of custom components.

How do I define data inputs and outputs when building a custom widget?

You define widget properties, data inputs, and outputs by creating a manifest, which acts as the configuration file specifying the capabilities and data binding contracts for your custom component.

Can I build a widget to display real-time data from an API?

Yes, you can build a widget for real-time API data by defining its manifest, configuring the data binding layer to fetch the external data, and implementing the display logic to render the updates.

What are the steps to register a new UI component after development?

After developing your UI component, you complete the registration process by defining its manifest properties and configuring the event protocols, ensuring the custom widget integrates with the platform's capabilities.

Do I need to configure theming and event protocols for every custom widget?

Yes, theming and event protocols are essential layers of the widget architecture, ensuring your custom component visually integrates with the platform and can properly handle interactive data flows.