diff options
Diffstat (limited to 'modules/ext/skill-pack-core.js')
| -rw-r--r-- | modules/ext/skill-pack-core.js | 36 |
1 files changed, 35 insertions, 1 deletions
diff --git a/modules/ext/skill-pack-core.js b/modules/ext/skill-pack-core.js index 6f7ad4c..abbc7ab 100644 --- a/modules/ext/skill-pack-core.js +++ b/modules/ext/skill-pack-core.js @@ -471,7 +471,41 @@ class SkillPackCoreModule { ## When to use - User wants to brainstorm, organize ideas, plan features - User says "map out", "diagram", "brainstorm", "organize thoughts" -- Visualizing project structure or task decomposition`) +- Visualizing project structure or task decomposition`), + + sk('floating-ui', 'How to create, manage, and remove floating UI elements — buttons, collapsible menus, and status panels that persist across page reloads', ['floating', 'ui', 'buttons', 'menu', 'gui'], 'ui', +`## Commands + +1. **Create a floating button:** + - floating-add btn <id> <label> <command> + - Example: floating-add btn files "📁 Files" ls + - Button appears at bottom-right, persists across reloads + +2. **Create a collapsible menu:** + - floating-add menu <id> <label> btn:SubLabel|command btn:Sub2|cmd2 ... + - Example: floating-add menu tools "🔧 Tools" btn:Help|help btn:Clear|clear + - Click header to expand/collapse. State persists. + +3. **Create a text panel:** + - floating-add panel <id> <title> <content> + - Example: floating-add panel status "📊 Status" "CPU: 2%" + +4. **Manage elements:** + - floating-list — show all elements with IDs and positions + - floating-remove <id> — delete by ID + - floating-toggle <id> — show/hide without deleting + - floating-pos <id> x|auto y|auto — reposition or reset to auto + - floating-clear — remove everything + +5. **Persistence:** + - All elements auto-save to localStorage (webx11_floating_elements) + - Survive page reload, browser restart + - Run floating-clear to start fresh + +## When to use +- User wants quick-access buttons instead of typing commands +- User says "add a button for X", "make a shortcut", "floating menu" +- Creating a dashboard with status panels and action buttons`) ]; } registerCommands() { |