@htmlbricks/hb-dashboard-card1 0.66.26 → 0.67.0

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.
Files changed (5) hide show
  1. package/README.md +7 -4
  2. package/main.iife.js +242 -71
  3. package/main.iife.js.map +1 -1
  4. package/manifest.json +30 -4
  5. package/package.json +2 -2
package/README.md CHANGED
@@ -4,7 +4,7 @@
4
4
 
5
5
  ### What it does
6
6
 
7
- Bootstrap card shell for dashboards: JSON `header` supplies optional Bootstrap Icon name, title label, and right-aligned badge; JSON `body` can remove inner padding with `noborder`. Slots let you inject markup (metadata lists `content`; description also references `header_content` for layout between header and body—confirm in implementation if both exist).
7
+ Bulma card shell for dashboards: JSON `header` supplies optional Bootstrap Icon name, title label, and right-aligned tag; JSON `body` can remove inner padding with `noborder`. Slots let you inject markup (`header_content`, `content`). Bootstrap Icons are loaded from the CDN in `svelte:head` for `bi` classes on the optional header icon.
8
8
 
9
9
  ### Custom element
10
10
 
@@ -19,16 +19,19 @@ Bootstrap card shell for dashboards: JSON `header` supplies optional Bootstrap I
19
19
  | `header` | object (optional) | JSON `{ icon?: string; label: string; badge?: string }`. |
20
20
  | `body` | object (optional) | JSON `{ noborder?: boolean }`. |
21
21
 
22
- **Bootstrap `--bs-*` theme vars.** **Parts:** `text_placeholder`, `badge`, `card`. **Slot (metadata):** `content`.
22
+ **Bulma `--bulma-*` theme vars** (see `extra/docs.ts`). **Parts:** `text_placeholder`, `badge`, `card`. **Slots:** `header_content`, `content`.
23
23
 
24
24
  ### Events (`CustomEvent` names)
25
25
 
26
26
  None declared in types (`Events` is an empty object).
27
27
 
28
+ ### Styling (Bulma)
29
+
30
+ The component uses Bulma `card`, `card-header`, `card-header-title`, `card-content`, and `tag`. Theme defaults are applied on `:host` via Bulma’s light theme and `setup-theme`. Override card look with public `--bulma-*` properties (for example `--bulma-card-background-color`, `--bulma-card-shadow`, `--bulma-card-header-color`). Bootstrap Icons remain a separate stylesheet for `header.icon`.
31
+
28
32
  ### Usage notes
29
33
 
30
- - Styling is Bootstrap 5–aligned via standard color variables.
31
- - `header.icon` should be a bootstrap-icons icon name string.
34
+ - `header.icon` should be a bootstrap-icons icon name string (without the `bi-` prefix).
32
35
  - Use `::part(card)` and related parts for host-level theming inside shadow root.
33
36
  - No i18n in `docs.ts`.
34
37