@mathiscode/pucc 1.0.0 → 1.0.2

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/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ # MIT License
2
+
3
+ Copyright (c) 2026 Jay Mathis
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md CHANGED
@@ -1,6 +1,16 @@
1
1
  # Pucc
2
2
 
3
- Power User Console Component - A browser library that provides a console command system.
3
+ [![Live Demo](https://img.shields.io/badge/Live%20Demo-rebeccapurple)](https://mathiscode.github.io/pucc/)
4
+
5
+ [![npm](https://img.shields.io/npm/v/@mathiscode/pucc)](https://www.npmjs.com/package/@mathiscode/pucc)
6
+ [![Created](https://img.shields.io/github/created-at/mathiscode/pucc?style=flat&label=created&color=success)](https://github.com/mathiscode/pucc/pulse)
7
+ [![Star on GitHub](https://img.shields.io/github/stars/mathiscode/pucc?style=flat&logo=github&label=⭐️%20stars)](https://github.com/mathiscode/pucc/stargazers)
8
+ [![GitHub forks](https://img.shields.io/github/forks/mathiscode/pucc?style=flat&logo=github&label=🔀%20forks)](https://github.com/mathiscode/pucc/forks)
9
+ [![GitHub watchers](https://img.shields.io/github/watchers/mathiscode/pucc?style=flat&logo=github&label=👀%20watchers)](https://github.com/mathiscode/pucc/watchers)
10
+ [![Sponsors](https://img.shields.io/github/sponsors/mathiscode?color=red&logo=github&label=💖%20sponsors)](https://github.com/sponsors/mathiscode)
11
+ [![Contributors](https://img.shields.io/github/contributors/mathiscode/pucc?color=yellow&logo=github&label=👥%20contributors)](https://github.com/mathiscode/pucc/graphs/contributors)
12
+
13
+ Power User Console Component - A browser library that provides a console command system.
4
14
 
5
15
  Register custom commands and execute them via the browser console with a `$` prefix or via the dropdown or embedded terminal Custom Element.
6
16
 
@@ -92,40 +102,49 @@ $new customer name="John Smith" balance=5400
92
102
 
93
103
  ### Module Import (ESM)
94
104
 
105
+ When using ESM, no global instance is created automatically. You have full control over how Pucc instances are created and used:
106
+
95
107
  ```javascript
96
108
  import { Pucc } from 'pucc';
97
109
 
98
- // When using ESM, no global instance is created automatically
99
- // You have full control over whether to create a global instance
100
- // or use terminal-only commands
101
-
102
- // Option 1: Create a global instance (like IIFE build)
110
+ // Create a Pucc instance
111
+ // Commands are automatically registered on window (for console access)
103
112
  const shell = new Pucc();
104
- shell.initialize();
105
- // Now commands are available: $help(), $about()
106
113
 
107
- // Option 2: Create a terminal-only instance
108
- const shell = new Pucc({ enableGlobalRegistrations: false });
109
- // Commands only available in terminal elements, not globally
114
+ // Add commands - they're immediately available in console AND terminals
115
+ shell.addCommand('greet', (args) => {
116
+ console.log(`Hello, ${args._[0] || 'World'}!`);
117
+ }, 'Greet someone');
118
+
119
+ // Commands are now available:
120
+ // - In browser console: $greet('Alice') or greet('Alice')
121
+ // - In terminal elements: greet Alice
110
122
  ```
111
123
 
112
- ### Disabling Global Command Registrations
124
+ ### Understanding Global Registrations
113
125
 
114
- By default, commands are registered globally on the `window` object, making them accessible from the browser console. If you want to limit command execution to only the terminal element (avoiding global namespace pollution), you can disable global registrations:
126
+ By default, `enableGlobalRegistrations: true` registers commands on the `window` object, making them accessible from the browser console. This does NOT affect terminal access - terminals can use any Pucc instance regardless of this setting.
115
127
 
116
128
  ```javascript
117
129
  import { Pucc } from 'pucc';
118
130
 
119
- // Create a Pucc instance with global registrations disabled
120
- const shell = new Pucc({ enableGlobalRegistrations: false });
131
+ // Option 1: Commands available in console AND terminals (default)
132
+ const shell = new Pucc();
133
+ shell.addCommand('test', () => console.log('test'), 'Test command');
134
+ // Available as: $test() in console, or "test" in terminals
121
135
 
122
- // Commands will only be available through the terminal
123
- // They will NOT be accessible via window.$commandName
124
- shell.addCommand('mycommand', (args) => {
125
- console.log('This command is only available in the terminal');
126
- }, 'A terminal-only command');
136
+ // Option 2: Commands available ONLY in terminals (not in console)
137
+ const shell = new Pucc({ enableGlobalRegistrations: false });
138
+ shell.addCommand('test', () => console.log('test'), 'Test command');
139
+ // Available as: "test" in terminals only (not on window)
127
140
  ```
128
141
 
142
+ **Key Points:**
143
+
144
+ - `enableGlobalRegistrations` only controls whether commands appear on `window` (for console access)
145
+ - Terminals can use ANY Pucc instance, regardless of this setting
146
+ - Set to `false` if you want to avoid polluting the global namespace
147
+
129
148
  ### Custom Command Prefix
130
149
 
131
150
  By default, commands use the `$` prefix (e.g., `$help`, `$about`). You can customize this prefix when creating a Pucc instance:
@@ -166,9 +185,14 @@ shell.addCommand('greet', (args) => {
166
185
 
167
186
  **Note:** The prefix must be a valid JavaScript identifier (starts with a letter, underscore, or dollar sign; can only contain letters, digits, underscores, and dollar signs). The prefix is used for console commands and is automatically stripped when parsing command input. Commands can always be called with or without the prefix in the terminal.
168
187
 
169
- ### Passing Pucc Options to Terminal Element
188
+ ### Using Terminal Elements
189
+
190
+ The `<pucc-terminal>` custom element can use either:
191
+
192
+ 1. A shared global instance (`window.Pucc`) - created automatically in IIFE builds
193
+ 2. Its own isolated instance - configured via `puccOptions`
170
194
 
171
- When using the `pucc-terminal` custom element, you can pass Pucc constructor options in two ways:
195
+ **Configuring a Terminal with Its Own Instance:**
172
196
 
173
197
  **Via attribute (for simple options):**
174
198
 
@@ -204,6 +228,37 @@ terminal.puccOptions = {
204
228
  };
205
229
  ```
206
230
 
231
+ **Adding Commands to a Terminal Element:**
232
+
233
+ If a terminal uses its own instance (via `puccOptions`), you can add commands to it:
234
+
235
+ ```javascript
236
+ const terminal = document.querySelector('pucc-terminal');
237
+
238
+ // Get the terminal's Pucc instance
239
+ const shell = terminal.shellInstance;
240
+
241
+ if (shell) {
242
+ // Add commands directly to the terminal's instance
243
+ shell.addCommand('mycommand', (args) => {
244
+ console.log('Command executed in terminal');
245
+ }, 'My custom command');
246
+ }
247
+ ```
248
+
249
+ **Using the Global Instance:**
250
+
251
+ If a terminal doesn't have `puccOptions` set, it automatically uses `window.Pucc` (if available). In this case, commands added to the global instance are available in all terminals:
252
+
253
+ ```javascript
254
+ // In IIFE builds, window.Pucc is created automatically
255
+ // In ESM builds, create it yourself:
256
+ window.Pucc = new Pucc();
257
+
258
+ // Add commands - they're available in all terminals using the global instance
259
+ shell.addCommand('shared', () => console.log('Shared command'), 'Shared command');
260
+ ```
261
+
207
262
  **Note:** The `pucc-options` attribute only supports JSON-serializable options (`enableGlobalRegistrations`, `commandPrefix`). For options that include functions (`customHelpHandler`, `initialCommands`), use the `puccOptions` property instead.
208
263
 
209
264
  ## API Reference
@@ -217,42 +272,52 @@ Create a new Pucc instance.
217
272
  - `options` (object, optional): Configuration options
218
273
  - `customHelpHandler` (function, optional): Custom handler for the `help` command
219
274
  - `initialCommands` (Command[], optional): Array of commands to register on initialization
220
- - `enableGlobalRegistrations` (boolean, optional): Whether to register commands globally on `window`. Defaults to `true`. Set to `false` to limit commands to the dropdown/embedded terminal only.
221
- - `commandPrefix` (string, optional): Custom prefix for console commands. Defaults to `$`. Must be a valid JavaScript identifier (starts with letter, underscore, or dollar sign; can contain letters, digits, underscores, and dollar signs). Commands can be called with or without the prefix.
275
+ - `enableGlobalRegistrations` (boolean, optional): Whether to register commands globally on `window` for console access. Defaults to `true`. Set to `false` to avoid polluting the global namespace. **Note:** This only affects console access, not terminal access - terminals can use any instance regardless of this setting.
276
+ - `commandPrefix` (string, optional): Custom prefix for console commands. Defaults to `$`. Must be a valid JavaScript identifier (starts with letter, underscore, or dollar sign; can contain letters, digits, underscores, and dollar signs). Commands can be called with or without the prefix in terminals.
222
277
 
223
278
  **Example:**
224
279
 
225
280
  ```javascript
226
281
  // Default behavior (global registrations enabled, $ prefix)
227
282
  const shell = new Pucc();
283
+ // Commands immediately available in console and terminals
228
284
 
229
- // Disable global registrations
285
+ // Disable global registrations (console access only, terminals still work)
230
286
  const shell = new Pucc({ enableGlobalRegistrations: false });
287
+ // Commands available in terminals, NOT in console
231
288
 
232
- // Use custom command prefix (must be a valid JavaScript identifier)
289
+ // Use custom command prefix
233
290
  const shell = new Pucc({ commandPrefix: 'cmd_' });
234
- // Now commands can be called as cmd_help, cmd_about, etc.
291
+ // Console: cmd_help(), Terminal: help or cmd_help
235
292
  ```
236
293
 
237
- ### `Pucc.addCommand(name, handler, description)`
294
+ ### `shell.addCommand(name, handler, description)`
238
295
 
239
- Register a new command.
296
+ Register a new command on a Pucc instance. The command is immediately available in terminals and (if `enableGlobalRegistrations` is true) in the console.
240
297
 
241
298
  **Parameters:**
242
299
 
243
300
  - `name` (string): Command name (without prefix)
244
- - `handler` (function): Command handler function `(args: ParsedArgs) => void | Promise<void>`
245
- - `description` (string): Command description (shown in `$help`)
301
+ - `handler` (function): Command handler function `(args: ParsedArgs, shell?: Pucc) => void | Promise<void>`
302
+ - `description` (string): Command description (shown in `help`)
246
303
 
247
304
  **Example:**
248
305
 
249
306
  ```javascript
250
- Pucc.addCommand('greet', (args) => {
307
+ const shell = new Pucc();
308
+
309
+ // Add a command - immediately available
310
+ shell.addCommand('greet', (args) => {
251
311
  const name = args.name || args._[0] || 'World';
252
312
  console.log(`Hello, ${name}!`);
253
313
  }, 'Greet someone by name');
314
+
315
+ // In console: $greet('Alice') or greet('Alice')
316
+ // In terminal: greet Alice or greet name=Alice
254
317
  ```
255
318
 
319
+ **Note:** In IIFE builds, you can also use `Pucc.addCommand()` which adds to the global instance automatically created.
320
+
256
321
  ### `ParsedArgs`
257
322
 
258
323
  The argument object passed to command handlers:
@@ -293,7 +358,7 @@ pnpm type-check
293
358
 
294
359
  ### Project Structure
295
360
 
296
- ```
361
+ ```text
297
362
  pucc/
298
363
  ├── src/
299
364
  │ ├── index.ts # Main entry point
@@ -302,13 +367,31 @@ pucc/
302
367
  │ │ └── CommandParser.ts # Command parser
303
368
  │ ├── commands/
304
369
  │ │ ├── help.ts # $help command
305
- │ │ └── about.ts # $about command
306
- │ └── types.ts # Type definitions
370
+ │ │ ├── about.ts # $about command
371
+ └── echo.ts # $echo command
372
+ │ ├── components/
373
+ │ │ ├── ShellTerminal.ts # Terminal custom element
374
+ │ │ └── TerminalLogger.ts # Terminal logger component
375
+ │ ├── types.ts # Type definitions
376
+ │ └── demo.css # Demo styles
307
377
  ├── config/
308
378
  │ └── build.js # Build configuration
309
- └── dist/ # Build output
379
+ ├── public/ # Demo and development files
380
+ ├── dist/ # Build output
381
+ ├── eslint.config.mts # ESLint configuration
382
+ ├── tsconfig.json # TypeScript configuration
383
+ └── server.js # Development server
310
384
  ```
311
385
 
312
386
  ## License
313
387
 
314
- MIT
388
+ [MIT](LICENSE)
389
+
390
+ ## About the Author
391
+
392
+ Pucc is created and maintained by [Jay Mathis](https://github.com/mathiscode), a developer passionate about building useful tools for the web.
393
+
394
+ Connect and explore:
395
+
396
+ - [GitHub Profile](https://github.com/mathiscode) - Check out my other projects and contributions
397
+ - [Website](https://jaymath.is) - Learn more about me and my work
package/dist/index.html CHANGED
@@ -20,7 +20,7 @@
20
20
  <span>View on GitHub</span>
21
21
  </a>
22
22
  </div>
23
- <p>A browser library that provides a console command system. Register custom commands and execute them via the browser console with a <code>$</code> (configurable) prefix or via the dropdown or embedded terminal Custom Element.</p>
23
+ <p>A browser library that provides a console command system. Register custom commands and execute them via the browser console with a <code>$</code> (configurable) prefix or via the dropdown or embedded terminal Custom Element (<code>pucc-terminal</code>).</p>
24
24
  <br />
25
25
  <p>This can be very useful for web apps that need to provide a console for users to interact with the app, bypassing the UI for power users.</p>
26
26
  </div>
@@ -139,7 +139,7 @@ about</code></pre>
139
139
  <div class="card">
140
140
  <h2>Module Import (ESM)</h2>
141
141
  <p>When using ESM, no global instance is created automatically. You have full control:</p>
142
- <pre><code>import { Pucc } from 'pucc';
142
+ <pre><code>import { Pucc } from '@mathiscode/pucc';
143
143
 
144
144
  // Option 1: Create a global instance (like IIFE build)
145
145
  const shell = new Pucc();
@@ -154,7 +154,7 @@ const shell = new Pucc({ enableGlobalRegistrations: false });
154
154
  <div class="card">
155
155
  <h2>Disabling Global Registrations</h2>
156
156
  <p>Limit commands to the terminal only (avoiding global namespace pollution):</p>
157
- <pre><code>import { Pucc } from 'pucc';
157
+ <pre><code>import { Pucc } from '@mathiscode/pucc';
158
158
 
159
159
  const shell = new Pucc({ enableGlobalRegistrations: false });
160
160
 
@@ -168,7 +168,7 @@ shell.addCommand('mycommand', (args) => {
168
168
  <div class="card">
169
169
  <h2>Custom Command Prefix</h2>
170
170
  <p>Customize the command prefix (must be a valid JavaScript identifier):</p>
171
- <pre><code>import { Pucc } from 'pucc';
171
+ <pre><code>import { Pucc } from '@mathiscode/pucc';
172
172
 
173
173
  const shell = new Pucc({ commandPrefix: 'cmd' });
174
174
 
package/dist/pucc.esm.js CHANGED
@@ -1,4 +1,4 @@
1
- /*! @mathiscode/pucc v1.0.0 */
1
+ /*! @mathiscode/pucc v1.0.1 */
2
2
 
3
3
  // src/core/CommandParser.ts
4
4
  var CommandParser = class {
package/dist/pucc.js CHANGED
@@ -1,4 +1,4 @@
1
- /*! @mathiscode/pucc v1.0.0 */
1
+ /*! @mathiscode/pucc v1.0.1 */
2
2
  "use strict";
3
3
  (() => {
4
4
  // src/core/CommandParser.ts
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mathiscode/pucc",
3
- "version": "1.0.0",
3
+ "version": "1.0.2",
4
4
  "license": "MIT",
5
5
  "description": "Power User Console Component - A browser console command system library",
6
6
  "author": {