@mathiscode/pucc 1.0.2 → 1.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +84 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -199,10 +199,25 @@ The `<pucc-terminal>` custom element can use either:
|
|
|
199
199
|
```html
|
|
200
200
|
<pucc-terminal
|
|
201
201
|
embedded="true"
|
|
202
|
+
height="300px"
|
|
203
|
+
theme="dark"
|
|
204
|
+
prompt="# "
|
|
205
|
+
hotkey="alt+s"
|
|
206
|
+
initial-content="Welcome to my terminal!"
|
|
202
207
|
pucc-options='{"enableGlobalRegistrations": false, "commandPrefix": "_"}'>
|
|
203
208
|
</pucc-terminal>
|
|
204
209
|
```
|
|
205
210
|
|
|
211
|
+
**Terminal Attributes:**
|
|
212
|
+
|
|
213
|
+
- `embedded` - Set to `"true"` for embedded mode (always visible)
|
|
214
|
+
- `height` - Terminal height (e.g., `"300px"`, `"50vh"`)
|
|
215
|
+
- `theme` - Color theme (`"dark"` or `"light"`)
|
|
216
|
+
- `prompt` - Custom prompt text (default: `"$ "`)
|
|
217
|
+
- `hotkey` - Keyboard shortcut for dropdown terminals (e.g., `"alt+s"`, `"ctrl+shift+t"`)
|
|
218
|
+
- `initial-content` - Custom initial content to display instead of the default welcome message (supports newlines with `\n`)
|
|
219
|
+
- `pucc-options` - JSON string with Pucc constructor options (see below)
|
|
220
|
+
|
|
206
221
|
**Via property (for full functionality, including functions):**
|
|
207
222
|
|
|
208
223
|
```javascript
|
|
@@ -261,6 +276,40 @@ shell.addCommand('shared', () => console.log('Shared command'), 'Shared command'
|
|
|
261
276
|
|
|
262
277
|
**Note:** The `pucc-options` attribute only supports JSON-serializable options (`enableGlobalRegistrations`, `commandPrefix`). For options that include functions (`customHelpHandler`, `initialCommands`), use the `puccOptions` property instead.
|
|
263
278
|
|
|
279
|
+
### Customizing Terminal Appearance with CSS
|
|
280
|
+
|
|
281
|
+
The terminal component supports CSS custom properties for advanced styling:
|
|
282
|
+
|
|
283
|
+
```css
|
|
284
|
+
pucc-terminal {
|
|
285
|
+
--shell-bg: #1a1a1a;
|
|
286
|
+
--shell-fg: #e0e0e0;
|
|
287
|
+
--shell-accent: #00aaff;
|
|
288
|
+
--shell-border: rgba(255, 255, 255, 0.1);
|
|
289
|
+
--shell-font-family: 'Courier New', monospace;
|
|
290
|
+
--shell-font-size: 16px;
|
|
291
|
+
--shell-padding: 20px;
|
|
292
|
+
--shell-animation-duration: 0.3s;
|
|
293
|
+
--shell-border-radius: 12px;
|
|
294
|
+
--shell-shadow: 0 12px 48px rgba(0, 0, 0, 0.5);
|
|
295
|
+
--shell-backdrop-blur: 15px;
|
|
296
|
+
}
|
|
297
|
+
```
|
|
298
|
+
|
|
299
|
+
**Available CSS Variables:**
|
|
300
|
+
|
|
301
|
+
- `--shell-bg` - Background color
|
|
302
|
+
- `--shell-fg` - Foreground/text color
|
|
303
|
+
- `--shell-accent` - Accent color (cursor, selection)
|
|
304
|
+
- `--shell-border` - Border color
|
|
305
|
+
- `--shell-font-family` - Font family
|
|
306
|
+
- `--shell-font-size` - Font size
|
|
307
|
+
- `--shell-padding` - Padding
|
|
308
|
+
- `--shell-animation-duration` - Animation duration
|
|
309
|
+
- `--shell-border-radius` - Border radius
|
|
310
|
+
- `--shell-shadow` - Box shadow
|
|
311
|
+
- `--shell-backdrop-blur` - Backdrop blur amount (dropdown terminals only)
|
|
312
|
+
|
|
264
313
|
## API Reference
|
|
265
314
|
|
|
266
315
|
### `new Pucc(options?)`
|
|
@@ -318,6 +367,41 @@ shell.addCommand('greet', (args) => {
|
|
|
318
367
|
|
|
319
368
|
**Note:** In IIFE builds, you can also use `Pucc.addCommand()` which adds to the global instance automatically created.
|
|
320
369
|
|
|
370
|
+
### `shell.removeCommand(name)`
|
|
371
|
+
|
|
372
|
+
Remove a command from a Pucc instance. The command is immediately removed from terminals and (if `enableGlobalRegistrations` is true) from the console.
|
|
373
|
+
|
|
374
|
+
**Parameters:**
|
|
375
|
+
|
|
376
|
+
- `name` (string): Command name (without prefix)
|
|
377
|
+
|
|
378
|
+
**Returns:**
|
|
379
|
+
|
|
380
|
+
- `boolean`: `true` if the command was successfully removed, `false` if the command was not found
|
|
381
|
+
|
|
382
|
+
**Example:**
|
|
383
|
+
|
|
384
|
+
```javascript
|
|
385
|
+
const shell = new Pucc();
|
|
386
|
+
|
|
387
|
+
// Add a command
|
|
388
|
+
shell.addCommand('greet', (args) => {
|
|
389
|
+
console.log(`Hello, ${args._[0] || 'World'}!`);
|
|
390
|
+
}, 'Greet someone');
|
|
391
|
+
|
|
392
|
+
// Remove the command
|
|
393
|
+
const removed = shell.removeCommand('greet');
|
|
394
|
+
if (removed) {
|
|
395
|
+
console.log('Command removed successfully');
|
|
396
|
+
} else {
|
|
397
|
+
console.log('Command not found');
|
|
398
|
+
}
|
|
399
|
+
|
|
400
|
+
// The command is no longer available in console or terminals
|
|
401
|
+
```
|
|
402
|
+
|
|
403
|
+
**Note:** In IIFE builds, you can also use `Pucc.removeCommand()` which removes from the global instance automatically created.
|
|
404
|
+
|
|
321
405
|
### `ParsedArgs`
|
|
322
406
|
|
|
323
407
|
The argument object passed to command handlers:
|