@htmlbricks/hb-area-code 0.66.8 → 0.66.10
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 +38 -0
- package/manifest.json +1 -1
- package/package.json +1 -1
package/README.md
ADDED
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
## `hb-area-code` — area-code
|
|
2
|
+
|
|
3
|
+
**Category:** utilities | **Tags:** utilities, developer
|
|
4
|
+
|
|
5
|
+
### What it does
|
|
6
|
+
|
|
7
|
+
Displays arbitrary text inside a `<code>` block with a themed background. A copy button copies the content to the clipboard, shows brief confirmation, and dispatches a `clipboardCopyText` custom event with the copied string.
|
|
8
|
+
|
|
9
|
+
### Custom element
|
|
10
|
+
|
|
11
|
+
`hb-area-code`
|
|
12
|
+
|
|
13
|
+
### Attributes / props (snake_case)
|
|
14
|
+
|
|
15
|
+
| Property | Type | Notes |
|
|
16
|
+
| --- | --- | --- |
|
|
17
|
+
| `id` | string (optional) | Element identifier. |
|
|
18
|
+
| `style` | string (optional) | Inline style string. |
|
|
19
|
+
| `content` | string (required) | Text shown inside the code block. |
|
|
20
|
+
|
|
21
|
+
**Style / theming:** CSS custom property `--hb-area-code-background` (color). **CSS part:** `content` (the code element). No HTML slots.
|
|
22
|
+
|
|
23
|
+
### Events (`CustomEvent` names)
|
|
24
|
+
|
|
25
|
+
- **`clipboardCopyText`** — `{ text: string }` — Fired after a successful clipboard copy with the copied text.
|
|
26
|
+
|
|
27
|
+
### Usage notes
|
|
28
|
+
|
|
29
|
+
- Uses Bootstrap-aligned theming patterns; primary styling is the component SCSS and `--hb-area-code-background`.
|
|
30
|
+
- Icons: not central to this component (copy UI is internal).
|
|
31
|
+
- Shadow DOM: `::part(content)` can target the code element.
|
|
32
|
+
- No i18n entries in `docs.ts`.
|
|
33
|
+
|
|
34
|
+
### Minimal HTML example
|
|
35
|
+
|
|
36
|
+
```html
|
|
37
|
+
<hb-area-code content="npm install @htmlbricks/hb-area-code"></hb-area-code>
|
|
38
|
+
```
|
package/manifest.json
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@htmlbricks/hb-area-code",
|
|
3
|
-
"version": "0.66.
|
|
3
|
+
"version": "0.66.10",
|
|
4
4
|
"contributors": [],
|
|
5
5
|
"description": "Displays arbitrary text inside a `<code>` block with a themed background. A small copy button copies the content to the clipboard, briefly shows confirmation, and dispatches a `clipboardCopyText` custom event with the copied string.",
|
|
6
6
|
"licenses": [
|