@htmlbricks/hb-dashboard-counter-lines 0.66.8 → 0.66.9
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 +40 -0
- package/manifest.json +1 -1
- package/package.json +1 -1
package/README.md
ADDED
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
## `hb-dashboard-counter-lines` — dashboard-counter-lines
|
|
2
|
+
|
|
3
|
+
**Category:** data | **Tags:** data, dashboard
|
|
4
|
+
|
|
5
|
+
### What it does
|
|
6
|
+
|
|
7
|
+
Vertical list of metric rows from JSON `lines`: each row shows optional Bootstrap Icon, label text, and a secondary badge value. `link.type` chooses behavior—open URI in a new tab, same-window navigation, custom `counterClick` event with a key, or a static row with no click handler.
|
|
8
|
+
|
|
9
|
+
### Custom element
|
|
10
|
+
|
|
11
|
+
`hb-dashboard-counter-lines`
|
|
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
|
+
| `lines` | array (optional) | JSON `Line[]`: text, value, link?: `{ type: "tab" \| "page" \| "event"; uri: string }`, index?, icon?. |
|
|
20
|
+
|
|
21
|
+
**Bootstrap `--bs-*` vars.** **Parts:** `item`, `icon`, `text`, `value`. No slots.
|
|
22
|
+
|
|
23
|
+
### Events (`CustomEvent` names)
|
|
24
|
+
|
|
25
|
+
- **`counterClick`** — `{ key: string }` — Used when a line’s `link.type` is `"event"` (per docs behavior).
|
|
26
|
+
|
|
27
|
+
### Usage notes
|
|
28
|
+
|
|
29
|
+
- Icons use bootstrap-icons names in the `icon` field.
|
|
30
|
+
- Rows are dashboard-style metrics, not a navigation menu.
|
|
31
|
+
- Shadow DOM exposes granular parts per row segment.
|
|
32
|
+
- No i18n in `docs.ts`.
|
|
33
|
+
|
|
34
|
+
### Minimal HTML example
|
|
35
|
+
|
|
36
|
+
```html
|
|
37
|
+
<hb-dashboard-counter-lines
|
|
38
|
+
lines='[{"text":"Active users","value":"1.2k","icon":"people"},{"text":"Errors","value":"3","icon":"exclamation-triangle"}]'
|
|
39
|
+
></hb-dashboard-counter-lines>
|
|
40
|
+
```
|
package/manifest.json
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@htmlbricks/hb-dashboard-counter-lines",
|
|
3
|
-
"version": "0.66.
|
|
3
|
+
"version": "0.66.9",
|
|
4
4
|
"contributors": [],
|
|
5
5
|
"description": "Vertical list of metric rows from JSON `lines`: each row shows optional Bootstrap Icon, label text, and a secondary badge value. `link.type` chooses behavior—open URI in a new tab, same-window navigation, custom `counterClick` event with a key, or a static row with no click handler.",
|
|
6
6
|
"licenses": [
|