canvas-app

Name: canvas-app
Author: microsoft

116installs103forks

How to install canvas-app?

microsoft/power-platform-skills/canvas-app

$npx -y skills add microsoft/power-platform-skills --skill canvas-app

Installs into the current project.

Summary

Creates or edits a Power Apps Canvas App through the Canvas Authoring MCP coauthoring session. Handles new app generation from requirements, simple inline edits, and complex multi-screen changes with parallel screen builders. Triggers on requests to create, build, generate, modif

Files · 1

View on GitHub

SKILL.md

1	# Create or Edit a Canvas App
2
3	Create or edit a Power Apps canvas app for the following requirements:
4
5	$ARGUMENTS
6
7	## Overview
8
9	This skill handles both creating and editing canvas apps through a unified workflow.
10	It syncs the current app state to detect whether the app has existing content, then routes
11	accordingly:
12
13	- CREATE mode — the app is empty or has no meaningful content; a new app is generated
14	from scratch using a preferences wizard and parallel screen builders.
15	- EDIT mode (simple) — the app has existing content and the requested changes are small;
16	edits are applied inline without planning agents.
17	- EDIT mode (complex) — the app has existing content and the requested changes are
18	substantial; a planner designs the changes and parallel screen builders execute them.
19
20	Two specialist agents are used for planned work:
21
22	1. `canvas-app-planner` — discovers available controls, APIs, and data sources; gathers
23	control property definitions; and writes the shared plan document (`canvas-app-plan.md`)
24	and `App.pa.yaml`. Receives the approved plan from the skill.
25	2. `canvas-screen-builder` — writes or modifies exactly one screen's YAML; multiple
26	builders run in parallel after the plan is approved
27
28	You (the skill) coordinate the agents, detect mode, design and present the plan for user
29	approval, and own the compilation + error-fixing loop after all screens are written.
30
31	---
32
33	## Phase 0 — Create App Folder
34
35	Before syncing or editing, create a subfolder to contain the app's YAML files:
36
37	1. Extract the app name or a 2–4 word summary from `$ARGUMENTS`
38	2. Convert to kebab-case (e.g., "Expense Tracker" → `expense-tracker`, "my travel planner" →
39	`my-travel-planner`)
40	3. Create the folder using `Bash`: `mkdir -p <folder-name>`
41	4. Resolve its absolute path — this is the working directory for all subsequent phases
42
43	Pass this absolute path as the working directory in every agent prompt below.
44
45	---
46
47	## Phase 1 — Sync
48
49	Call the `sync_canvas` MCP tool targeting the working directory. This pulls the current app
50	state from the coauthoring session into local `.pa.yaml` files. Only proceed after
51	`sync_canvas` completes successfully.
52
53	---
54
55	## Phase 2 — Detect Mode
56
57	After `sync_canvas` completes, read the synced `.pa.yaml` files and check whether the app
58	has meaningful content. An app is considered empty if:
59
60	- No `.pa.yaml` files were written, or
61	- The only files present contain no screens, or
62	- Every screen present has no controls (only bare screen-level YAML with no children), or
63	- Every screen's controls consist solely of containers (e.g., `GroupContainer`) with no
64	leaf controls inside them
65
66	If the app is empty → CREATE mode. Proceed to Phase 3.
67
68	If the app has meaningful content → EDIT mode. Skip Phase 3 and proceed to Phase 4.
69
70	---
71
72	## Phase 3 — Gather Preferences (CREATE mode only)
73
74	Use `AskUserQuestion` to collect design preferences that cannot be reliably inferred from
75	`$ARGUMENTS`. Parse `$ARGUMENTS` first to determine which questions to skip — but a
76	short request like "visitor check-in app" or "expense tracker" leaves most preferences
77	unspecified and you MUST ask.
78
79	Call `AskUserQuestion` with the applicable questions from the table below (include only the
80	ones that need answers):
81
82	\| Question \| Header \| When to Ask \| Options \|
83	\|----------\|--------\|-------------\|---------\|
84	\| Who will primarily use this app, and on what device? \| Target Users & Device \| Only if not clear from `$ARGUMENTS` \| (3–4 dynamically inferred options that combine the user role with their likely device, e.g., for "visitor check-in": Front desk staff on desktop/tablet, Security team on tablet, Self-service kiosk on tablet, Visitors on their phone) \|
85	\| Do you have a screenshot or mockup for reference? (paste an image or provide a file path) \| Reference \| Only if user has NOT already attached/pasted an image with their request \| Yes I'll share one now, No just pick a direction for me \|
86	\| What aesthetic direction? \| Aesthetic \| Only if not clear from `$ARGUMENTS` (skip if user already described a visual direction like "dark themed", "minimal", "corporate style", or provided a reference image) \| Clean & Professional (Recommended), Bold & High-Contrast, Soft & Approachable, Dense & Utilitarian \|
87	\| Which features do you need? (multi-select) \| Features \| Only if `

People who liked this also viewed

6 picks

Type

canvas-app

116installs103forks

View on GitHub

How to install canvas-app?

microsoft/power-platform-skills/canvas-app

$npx -y skills add microsoft/power-platform-skills --skill canvas-app

Installs into the current project.

Summary

Files · 1

View on GitHub

SKILL.md

1	# Create or Edit a Canvas App
2
3	Create or edit a Power Apps canvas app for the following requirements:
4
5	$ARGUMENTS
6
7	## Overview
8
9	This skill handles both creating and editing canvas apps through a unified workflow.
10	It syncs the current app state to detect whether the app has existing content, then routes
11	accordingly:
12
13	- CREATE mode — the app is empty or has no meaningful content; a new app is generated
14	from scratch using a preferences wizard and parallel screen builders.
15	- EDIT mode (simple) — the app has existing content and the requested changes are small;
16	edits are applied inline without planning agents.
17	- EDIT mode (complex) — the app has existing content and the requested changes are
18	substantial; a planner designs the changes and parallel screen builders execute them.
19
20	Two specialist agents are used for planned work:
21
22	1. `canvas-app-planner` — discovers available controls, APIs, and data sources; gathers
23	control property definitions; and writes the shared plan document (`canvas-app-plan.md`)
24	and `App.pa.yaml`. Receives the approved plan from the skill.
25	2. `canvas-screen-builder` — writes or modifies exactly one screen's YAML; multiple
26	builders run in parallel after the plan is approved
27
28	You (the skill) coordinate the agents, detect mode, design and present the plan for user
29	approval, and own the compilation + error-fixing loop after all screens are written.
30
31	---
32
33	## Phase 0 — Create App Folder
34
35	Before syncing or editing, create a subfolder to contain the app's YAML files:
36
37	1. Extract the app name or a 2–4 word summary from `$ARGUMENTS`
38	2. Convert to kebab-case (e.g., "Expense Tracker" → `expense-tracker`, "my travel planner" →
39	`my-travel-planner`)
40	3. Create the folder using `Bash`: `mkdir -p <folder-name>`
41	4. Resolve its absolute path — this is the working directory for all subsequent phases
42
43	Pass this absolute path as the working directory in every agent prompt below.
44
45	---
46
47	## Phase 1 — Sync
48
49	Call the `sync_canvas` MCP tool targeting the working directory. This pulls the current app
50	state from the coauthoring session into local `.pa.yaml` files. Only proceed after
51	`sync_canvas` completes successfully.
52
53	---
54
55	## Phase 2 — Detect Mode
56
57	After `sync_canvas` completes, read the synced `.pa.yaml` files and check whether the app
58	has meaningful content. An app is considered empty if:
59
60	- No `.pa.yaml` files were written, or
61	- The only files present contain no screens, or
62	- Every screen present has no controls (only bare screen-level YAML with no children), or
63	- Every screen's controls consist solely of containers (e.g., `GroupContainer`) with no
64	leaf controls inside them
65
66	If the app is empty → CREATE mode. Proceed to Phase 3.
67
68	If the app has meaningful content → EDIT mode. Skip Phase 3 and proceed to Phase 4.
69
70	---
71
72	## Phase 3 — Gather Preferences (CREATE mode only)
73
74	Use `AskUserQuestion` to collect design preferences that cannot be reliably inferred from
75	`$ARGUMENTS`. Parse `$ARGUMENTS` first to determine which questions to skip — but a
76	short request like "visitor check-in app" or "expense tracker" leaves most preferences
77	unspecified and you MUST ask.
78
79	Call `AskUserQuestion` with the applicable questions from the table below (include only the
80	ones that need answers):
81
82	\| Question \| Header \| When to Ask \| Options \|
83	\|----------\|--------\|-------------\|---------\|
84	\| Who will primarily use this app, and on what device? \| Target Users & Device \| Only if not clear from `$ARGUMENTS` \| (3–4 dynamically inferred options that combine the user role with their likely device, e.g., for "visitor check-in": Front desk staff on desktop/tablet, Security team on tablet, Self-service kiosk on tablet, Visitors on their phone) \|
85	\| Do you have a screenshot or mockup for reference? (paste an image or provide a file path) \| Reference \| Only if user has NOT already attached/pasted an image with their request \| Yes I'll share one now, No just pick a direction for me \|
86	\| What aesthetic direction? \| Aesthetic \| Only if not clear from `$ARGUMENTS` (skip if user already described a visual direction like "dark themed", "minimal", "corporate style", or provided a reference image) \| Clean & Professional (Recommended), Bold & High-Contrast, Soft & Approachable, Dense & Utilitarian \|
87	\| Which features do you need? (multi-select) \| Features \| Only if `

People who liked this also viewed

6 picks

Type