@htmlbricks/mcp 0.68.9 → 0.68.11
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/assets/AGENT_WEBCOMPONENTS_REFERENCE.md +217 -121
- package/assets/list.json +1 -1
- package/package.json +1 -1
|
@@ -55,107 +55,107 @@ Every published **`@htmlbricks/hb-<folder>`** tarball includes a **`types/`** fo
|
|
|
55
55
|
### Table of contents — how to use this with LLMs
|
|
56
56
|
|
|
57
57
|
- The **full text** of each component’s `README.md` is **included later in this same document**, under an HTML anchor `id="wc-<folder>"` (Markdown link: `#wc-<folder>`).
|
|
58
|
-
- The **jsDelivr** URL is the **canonical** `README.md` from npm (`@htmlbricks/hb-<folder>` at version **0.68.
|
|
58
|
+
- The **jsDelivr** URL is the **canonical** `README.md` from npm (`@htmlbricks/hb-<folder>` at version **0.68.11**). The prose merged **below this TOC** is the **same document body** (duplicate for single-file reading).
|
|
59
59
|
- When answering **from this file only**, use the **in-document** link (`#wc-…`) so the model stays in one context. Use the **jsDelivr** link when you need the standalone README URL (e.g. fetching from the CDN).
|
|
60
60
|
|
|
61
61
|
## Table of contents
|
|
62
62
|
|
|
63
63
|
Each line lists: **tag — folder**, then **canonical README (npm/jsDelivr)**, then **same content inside this file**.
|
|
64
64
|
|
|
65
|
-
- **`hb-area-code` — `area-code`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-area-code@0.68.
|
|
66
|
-
- **`hb-auth` — `auth`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-auth@0.68.
|
|
67
|
-
- **`hb-auth-social-login-button` — `auth-social-login-button`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-auth-social-login-button@0.68.
|
|
68
|
-
- **`hb-banner` — `banner`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-banner@0.68.
|
|
69
|
-
- **`hb-calendar-appointments` — `calendar-appointments`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-calendar-appointments@0.68.
|
|
70
|
-
- **`hb-calendar-events` — `calendar-events`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-calendar-events@0.68.
|
|
71
|
-
- **`hb-captcha-google-recaptcha-v2-invisible` — `captcha-google-recaptcha-v2-invisible`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-captcha-google-recaptcha-v2-invisible@0.68.
|
|
72
|
-
- **`hb-card-video` — `card-video`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-card-video@0.68.
|
|
73
|
-
- **`hb-chartjs` — `chartjs`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-chartjs@0.68.
|
|
74
|
-
- **`hb-checkout` — `checkout`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-checkout@0.68.
|
|
75
|
-
- **`hb-checkout-shopping-cart` — `checkout-shopping-cart`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-checkout-shopping-cart@0.68.
|
|
76
|
-
- **`hb-contact-card` — `contact-card`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-contact-card@0.68.
|
|
77
|
-
- **`hb-contact-item` — `contact-item`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-contact-item@0.68.
|
|
78
|
-
- **`hb-cookie-law-banner` — `cookie-law-banner`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-cookie-law-banner@0.68.
|
|
79
|
-
- **`hb-dashboard-card1` — `dashboard-card1`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-dashboard-card1@0.68.
|
|
80
|
-
- **`hb-dashboard-counter-lines` — `dashboard-counter-lines`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-dashboard-counter-lines@0.68.
|
|
81
|
-
- **`hb-dashboard-indicator` — `dashboard-indicator`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-dashboard-indicator@0.68.
|
|
82
|
-
- **`hb-dialog` — `dialog`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-dialog@0.68.
|
|
83
|
-
- **`hb-dialog-loader` — `dialog-loader`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-dialog-loader@0.68.
|
|
84
|
-
- **`hb-dialogform` — `dialogform`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-dialogform@0.68.
|
|
85
|
-
- **`hb-downloader` — `downloader`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-downloader@0.68.
|
|
86
|
-
- **`hb-dropdown-notifications` — `dropdown-notifications`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-dropdown-notifications@0.68.
|
|
87
|
-
- **`hb-dropdown-simple` — `dropdown-simple`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-dropdown-simple@0.68.
|
|
88
|
-
- **`hb-editor-video` — `editor-video`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-editor-video@0.68.
|
|
89
|
-
- **`hb-faq-component` — `faq-component`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-faq-component@0.68.
|
|
90
|
-
- **`hb-footer` — `footer`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-footer@0.68.
|
|
91
|
-
- **`hb-form` — `form`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-form@0.68.
|
|
92
|
-
- **`hb-form-composer` — `form-composer`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-form-composer@0.68.
|
|
93
|
-
- **`hb-form-contact` — `form-contact`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-form-contact@0.68.
|
|
94
|
-
- **`hb-funnel` — `funnel`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-funnel@0.68.
|
|
95
|
-
- **`hb-gallery-video` — `gallery-video`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-gallery-video@0.68.
|
|
96
|
-
- **`hb-gauge` — `gauge`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-gauge@0.68.
|
|
97
|
-
- **`hb-input-area` — `input-area`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-area@0.68.
|
|
98
|
-
- **`hb-input-array-objects` — `input-array-objects`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-array-objects@0.68.
|
|
99
|
-
- **`hb-input-array-tags` — `input-array-tags`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-array-tags@0.68.
|
|
100
|
-
- **`hb-input-checkbox` — `input-checkbox`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-checkbox@0.68.
|
|
101
|
-
- **`hb-input-color` — `input-color`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-color@0.68.
|
|
102
|
-
- **`hb-input-coords` — `input-coords`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-coords@0.68.
|
|
103
|
-
- **`hb-input-date` — `input-date`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-date@0.68.
|
|
104
|
-
- **`hb-input-datetime` — `input-datetime`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-datetime@0.68.
|
|
105
|
-
- **`hb-input-email` — `input-email`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-email@0.68.
|
|
106
|
-
- **`hb-input-file` — `input-file`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-file@0.68.
|
|
107
|
-
- **`hb-input-number` — `input-number`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-number@0.68.
|
|
108
|
-
- **`hb-input-radio` — `input-radio`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-radio@0.68.
|
|
109
|
-
- **`hb-input-range` — `input-range`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-range@0.68.
|
|
110
|
-
- **`hb-input-select` — `input-select`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-select@0.68.
|
|
111
|
-
- **`hb-input-text` — `input-text`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-text@0.68.
|
|
112
|
-
- **`hb-json-viewer` — `json-viewer`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-json-viewer@0.68.
|
|
113
|
-
- **`hb-layout` — `layout`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-layout@0.68.
|
|
114
|
-
- **`hb-layout-desktop` — `layout-desktop`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-layout-desktop@0.68.
|
|
115
|
-
- **`hb-layout-mobile` — `layout-mobile`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-layout-mobile@0.68.
|
|
116
|
-
- **`hb-map` — `map`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-map@0.68.
|
|
117
|
-
- **`hb-markdown-viewer` — `markdown-viewer`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-markdown-viewer@0.68.
|
|
118
|
-
- **`hb-matrix-video` — `matrix-video`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-matrix-video@0.68.
|
|
119
|
-
- **`hb-messages-box` — `messages-box`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-messages-box@0.68.
|
|
120
|
-
- **`hb-messages-list` — `messages-list`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-messages-list@0.68.
|
|
121
|
-
- **`hb-messages-send` — `messages-send`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-messages-send@0.68.
|
|
122
|
-
- **`hb-messages-topics-card` — `messages-topics-card`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-messages-topics-card@0.68.
|
|
123
|
-
- **`hb-modal-video` — `modal-video`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-modal-video@0.68.
|
|
124
|
-
- **`hb-navbar` — `navbar`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-navbar@0.68.
|
|
125
|
-
- **`hb-offcanvas` — `offcanvas`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-offcanvas@0.68.
|
|
126
|
-
- **`hb-order-list` — `order-list`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-order-list@0.68.
|
|
127
|
-
- **`hb-pad-joystick` — `pad-joystick`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-pad-joystick@0.68.
|
|
128
|
-
- **`hb-page-checkout` — `page-checkout`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-page-checkout@0.68.
|
|
129
|
-
- **`hb-page-invoice` — `page-invoice`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-page-invoice@0.68.
|
|
130
|
-
- **`hb-paginate` — `paginate`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-paginate@0.68.
|
|
131
|
-
- **`hb-paragraps-around-image` — `paragraps-around-image`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-paragraps-around-image@0.68.
|
|
132
|
-
- **`hb-paragraps-around-image-cell` — `paragraps-around-image-cell`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-paragraps-around-image-cell@0.68.
|
|
133
|
-
- **`hb-payment-paypal` — `payment-paypal`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-payment-paypal@0.68.
|
|
134
|
-
- **`hb-player-input-streaming` — `player-input-streaming`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-player-input-streaming@0.68.
|
|
135
|
-
- **`hb-player-live` — `player-live`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-player-live@0.68.
|
|
136
|
-
- **`hb-player-live-camera-ptz` — `player-live-camera-ptz`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-player-live-camera-ptz@0.68.
|
|
137
|
-
- **`hb-product-comparison` — `product-comparison`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-product-comparison@0.68.
|
|
138
|
-
- **`hb-range-slider` — `range-slider`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-range-slider@0.68.
|
|
139
|
-
- **`hb-searchbar` — `searchbar`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-searchbar@0.68.
|
|
140
|
-
- **`hb-shop-item-cell` — `shop-item-cell`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-shop-item-cell@0.68.
|
|
141
|
-
- **`hb-shop-item-row` — `shop-item-row`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-shop-item-row@0.68.
|
|
142
|
-
- **`hb-sidebar-cards-navigator` — `sidebar-cards-navigator`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-sidebar-cards-navigator@0.68.
|
|
143
|
-
- **`hb-sidebar-desktop` — `sidebar-desktop`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-sidebar-desktop@0.68.
|
|
144
|
-
- **`hb-sidenav-button` — `sidenav-button`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-sidenav-button@0.68.
|
|
145
|
-
- **`hb-sidenav-link` — `sidenav-link`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-sidenav-link@0.68.
|
|
146
|
-
- **`hb-site-contacts-row` — `site-contacts-row`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-site-contacts-row@0.68.
|
|
147
|
-
- **`hb-site-paragraph-with-image` — `site-paragraph-with-image`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-site-paragraph-with-image@0.68.
|
|
148
|
-
- **`hb-site-slideshow` — `site-slideshow`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-site-slideshow@0.68.
|
|
149
|
-
- **`hb-site-slideshow-horizontal` — `site-slideshow-horizontal`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-site-slideshow-horizontal@0.68.
|
|
150
|
-
- **`hb-skeleton-component` — `skeleton-component`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-skeleton-component@0.68.
|
|
151
|
-
- **`hb-stylus-notebook` — `stylus-notebook`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-stylus-notebook@0.68.
|
|
152
|
-
- **`hb-stylus-paper` — `stylus-paper`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-stylus-paper@0.68.
|
|
153
|
-
- **`hb-table` — `table`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-table@0.68.
|
|
154
|
-
- **`hb-terms-doc-templates` — `terms-doc-templates`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-terms-doc-templates@0.68.
|
|
155
|
-
- **`hb-toast` — `toast`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-toast@0.68.
|
|
156
|
-
- **`hb-tooltip` — `tooltip`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-tooltip@0.68.
|
|
157
|
-
- **`hb-uploader` — `uploader`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-uploader@0.68.
|
|
158
|
-
- **`hb-vertical-img-txt-archive` — `vertical-img-txt-archive`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-vertical-img-txt-archive@0.68.
|
|
65
|
+
- **`hb-area-code` — `area-code`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-area-code@0.68.11/README.md) · [same text in this document](#wc-area-code)
|
|
66
|
+
- **`hb-auth` — `auth`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-auth@0.68.11/README.md) · [same text in this document](#wc-auth)
|
|
67
|
+
- **`hb-auth-social-login-button` — `auth-social-login-button`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-auth-social-login-button@0.68.11/README.md) · [same text in this document](#wc-auth-social-login-button)
|
|
68
|
+
- **`hb-banner` — `banner`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-banner@0.68.11/README.md) · [same text in this document](#wc-banner)
|
|
69
|
+
- **`hb-calendar-appointments` — `calendar-appointments`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-calendar-appointments@0.68.11/README.md) · [same text in this document](#wc-calendar-appointments)
|
|
70
|
+
- **`hb-calendar-events` — `calendar-events`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-calendar-events@0.68.11/README.md) · [same text in this document](#wc-calendar-events)
|
|
71
|
+
- **`hb-captcha-google-recaptcha-v2-invisible` — `captcha-google-recaptcha-v2-invisible`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-captcha-google-recaptcha-v2-invisible@0.68.11/README.md) · [same text in this document](#wc-captcha-google-recaptcha-v2-invisible)
|
|
72
|
+
- **`hb-card-video` — `card-video`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-card-video@0.68.11/README.md) · [same text in this document](#wc-card-video)
|
|
73
|
+
- **`hb-chartjs` — `chartjs`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-chartjs@0.68.11/README.md) · [same text in this document](#wc-chartjs)
|
|
74
|
+
- **`hb-checkout` — `checkout`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-checkout@0.68.11/README.md) · [same text in this document](#wc-checkout)
|
|
75
|
+
- **`hb-checkout-shopping-cart` — `checkout-shopping-cart`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-checkout-shopping-cart@0.68.11/README.md) · [same text in this document](#wc-checkout-shopping-cart)
|
|
76
|
+
- **`hb-contact-card` — `contact-card`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-contact-card@0.68.11/README.md) · [same text in this document](#wc-contact-card)
|
|
77
|
+
- **`hb-contact-item` — `contact-item`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-contact-item@0.68.11/README.md) · [same text in this document](#wc-contact-item)
|
|
78
|
+
- **`hb-cookie-law-banner` — `cookie-law-banner`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-cookie-law-banner@0.68.11/README.md) · [same text in this document](#wc-cookie-law-banner)
|
|
79
|
+
- **`hb-dashboard-card1` — `dashboard-card1`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-dashboard-card1@0.68.11/README.md) · [same text in this document](#wc-dashboard-card1)
|
|
80
|
+
- **`hb-dashboard-counter-lines` — `dashboard-counter-lines`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-dashboard-counter-lines@0.68.11/README.md) · [same text in this document](#wc-dashboard-counter-lines)
|
|
81
|
+
- **`hb-dashboard-indicator` — `dashboard-indicator`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-dashboard-indicator@0.68.11/README.md) · [same text in this document](#wc-dashboard-indicator)
|
|
82
|
+
- **`hb-dialog` — `dialog`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-dialog@0.68.11/README.md) · [same text in this document](#wc-dialog)
|
|
83
|
+
- **`hb-dialog-loader` — `dialog-loader`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-dialog-loader@0.68.11/README.md) · [same text in this document](#wc-dialog-loader)
|
|
84
|
+
- **`hb-dialogform` — `dialogform`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-dialogform@0.68.11/README.md) · [same text in this document](#wc-dialogform)
|
|
85
|
+
- **`hb-downloader` — `downloader`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-downloader@0.68.11/README.md) · [same text in this document](#wc-downloader)
|
|
86
|
+
- **`hb-dropdown-notifications` — `dropdown-notifications`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-dropdown-notifications@0.68.11/README.md) · [same text in this document](#wc-dropdown-notifications)
|
|
87
|
+
- **`hb-dropdown-simple` — `dropdown-simple`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-dropdown-simple@0.68.11/README.md) · [same text in this document](#wc-dropdown-simple)
|
|
88
|
+
- **`hb-editor-video` — `editor-video`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-editor-video@0.68.11/README.md) · [same text in this document](#wc-editor-video)
|
|
89
|
+
- **`hb-faq-component` — `faq-component`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-faq-component@0.68.11/README.md) · [same text in this document](#wc-faq-component)
|
|
90
|
+
- **`hb-footer` — `footer`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-footer@0.68.11/README.md) · [same text in this document](#wc-footer)
|
|
91
|
+
- **`hb-form` — `form`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-form@0.68.11/README.md) · [same text in this document](#wc-form)
|
|
92
|
+
- **`hb-form-composer` — `form-composer`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-form-composer@0.68.11/README.md) · [same text in this document](#wc-form-composer)
|
|
93
|
+
- **`hb-form-contact` — `form-contact`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-form-contact@0.68.11/README.md) · [same text in this document](#wc-form-contact)
|
|
94
|
+
- **`hb-funnel` — `funnel`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-funnel@0.68.11/README.md) · [same text in this document](#wc-funnel)
|
|
95
|
+
- **`hb-gallery-video` — `gallery-video`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-gallery-video@0.68.11/README.md) · [same text in this document](#wc-gallery-video)
|
|
96
|
+
- **`hb-gauge` — `gauge`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-gauge@0.68.11/README.md) · [same text in this document](#wc-gauge)
|
|
97
|
+
- **`hb-input-area` — `input-area`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-area@0.68.11/README.md) · [same text in this document](#wc-input-area)
|
|
98
|
+
- **`hb-input-array-objects` — `input-array-objects`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-array-objects@0.68.11/README.md) · [same text in this document](#wc-input-array-objects)
|
|
99
|
+
- **`hb-input-array-tags` — `input-array-tags`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-array-tags@0.68.11/README.md) · [same text in this document](#wc-input-array-tags)
|
|
100
|
+
- **`hb-input-checkbox` — `input-checkbox`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-checkbox@0.68.11/README.md) · [same text in this document](#wc-input-checkbox)
|
|
101
|
+
- **`hb-input-color` — `input-color`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-color@0.68.11/README.md) · [same text in this document](#wc-input-color)
|
|
102
|
+
- **`hb-input-coords` — `input-coords`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-coords@0.68.11/README.md) · [same text in this document](#wc-input-coords)
|
|
103
|
+
- **`hb-input-date` — `input-date`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-date@0.68.11/README.md) · [same text in this document](#wc-input-date)
|
|
104
|
+
- **`hb-input-datetime` — `input-datetime`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-datetime@0.68.11/README.md) · [same text in this document](#wc-input-datetime)
|
|
105
|
+
- **`hb-input-email` — `input-email`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-email@0.68.11/README.md) · [same text in this document](#wc-input-email)
|
|
106
|
+
- **`hb-input-file` — `input-file`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-file@0.68.11/README.md) · [same text in this document](#wc-input-file)
|
|
107
|
+
- **`hb-input-number` — `input-number`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-number@0.68.11/README.md) · [same text in this document](#wc-input-number)
|
|
108
|
+
- **`hb-input-radio` — `input-radio`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-radio@0.68.11/README.md) · [same text in this document](#wc-input-radio)
|
|
109
|
+
- **`hb-input-range` — `input-range`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-range@0.68.11/README.md) · [same text in this document](#wc-input-range)
|
|
110
|
+
- **`hb-input-select` — `input-select`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-select@0.68.11/README.md) · [same text in this document](#wc-input-select)
|
|
111
|
+
- **`hb-input-text` — `input-text`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-input-text@0.68.11/README.md) · [same text in this document](#wc-input-text)
|
|
112
|
+
- **`hb-json-viewer` — `json-viewer`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-json-viewer@0.68.11/README.md) · [same text in this document](#wc-json-viewer)
|
|
113
|
+
- **`hb-layout` — `layout`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-layout@0.68.11/README.md) · [same text in this document](#wc-layout)
|
|
114
|
+
- **`hb-layout-desktop` — `layout-desktop`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-layout-desktop@0.68.11/README.md) · [same text in this document](#wc-layout-desktop)
|
|
115
|
+
- **`hb-layout-mobile` — `layout-mobile`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-layout-mobile@0.68.11/README.md) · [same text in this document](#wc-layout-mobile)
|
|
116
|
+
- **`hb-map` — `map`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-map@0.68.11/README.md) · [same text in this document](#wc-map)
|
|
117
|
+
- **`hb-markdown-viewer` — `markdown-viewer`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-markdown-viewer@0.68.11/README.md) · [same text in this document](#wc-markdown-viewer)
|
|
118
|
+
- **`hb-matrix-video` — `matrix-video`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-matrix-video@0.68.11/README.md) · [same text in this document](#wc-matrix-video)
|
|
119
|
+
- **`hb-messages-box` — `messages-box`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-messages-box@0.68.11/README.md) · [same text in this document](#wc-messages-box)
|
|
120
|
+
- **`hb-messages-list` — `messages-list`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-messages-list@0.68.11/README.md) · [same text in this document](#wc-messages-list)
|
|
121
|
+
- **`hb-messages-send` — `messages-send`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-messages-send@0.68.11/README.md) · [same text in this document](#wc-messages-send)
|
|
122
|
+
- **`hb-messages-topics-card` — `messages-topics-card`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-messages-topics-card@0.68.11/README.md) · [same text in this document](#wc-messages-topics-card)
|
|
123
|
+
- **`hb-modal-video` — `modal-video`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-modal-video@0.68.11/README.md) · [same text in this document](#wc-modal-video)
|
|
124
|
+
- **`hb-navbar` — `navbar`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-navbar@0.68.11/README.md) · [same text in this document](#wc-navbar)
|
|
125
|
+
- **`hb-offcanvas` — `offcanvas`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-offcanvas@0.68.11/README.md) · [same text in this document](#wc-offcanvas)
|
|
126
|
+
- **`hb-order-list` — `order-list`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-order-list@0.68.11/README.md) · [same text in this document](#wc-order-list)
|
|
127
|
+
- **`hb-pad-joystick` — `pad-joystick`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-pad-joystick@0.68.11/README.md) · [same text in this document](#wc-pad-joystick)
|
|
128
|
+
- **`hb-page-checkout` — `page-checkout`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-page-checkout@0.68.11/README.md) · [same text in this document](#wc-page-checkout)
|
|
129
|
+
- **`hb-page-invoice` — `page-invoice`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-page-invoice@0.68.11/README.md) · [same text in this document](#wc-page-invoice)
|
|
130
|
+
- **`hb-paginate` — `paginate`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-paginate@0.68.11/README.md) · [same text in this document](#wc-paginate)
|
|
131
|
+
- **`hb-paragraps-around-image` — `paragraps-around-image`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-paragraps-around-image@0.68.11/README.md) · [same text in this document](#wc-paragraps-around-image)
|
|
132
|
+
- **`hb-paragraps-around-image-cell` — `paragraps-around-image-cell`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-paragraps-around-image-cell@0.68.11/README.md) · [same text in this document](#wc-paragraps-around-image-cell)
|
|
133
|
+
- **`hb-payment-paypal` — `payment-paypal`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-payment-paypal@0.68.11/README.md) · [same text in this document](#wc-payment-paypal)
|
|
134
|
+
- **`hb-player-input-streaming` — `player-input-streaming`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-player-input-streaming@0.68.11/README.md) · [same text in this document](#wc-player-input-streaming)
|
|
135
|
+
- **`hb-player-live` — `player-live`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-player-live@0.68.11/README.md) · [same text in this document](#wc-player-live)
|
|
136
|
+
- **`hb-player-live-camera-ptz` — `player-live-camera-ptz`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-player-live-camera-ptz@0.68.11/README.md) · [same text in this document](#wc-player-live-camera-ptz)
|
|
137
|
+
- **`hb-product-comparison` — `product-comparison`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-product-comparison@0.68.11/README.md) · [same text in this document](#wc-product-comparison)
|
|
138
|
+
- **`hb-range-slider` — `range-slider`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-range-slider@0.68.11/README.md) · [same text in this document](#wc-range-slider)
|
|
139
|
+
- **`hb-searchbar` — `searchbar`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-searchbar@0.68.11/README.md) · [same text in this document](#wc-searchbar)
|
|
140
|
+
- **`hb-shop-item-cell` — `shop-item-cell`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-shop-item-cell@0.68.11/README.md) · [same text in this document](#wc-shop-item-cell)
|
|
141
|
+
- **`hb-shop-item-row` — `shop-item-row`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-shop-item-row@0.68.11/README.md) · [same text in this document](#wc-shop-item-row)
|
|
142
|
+
- **`hb-sidebar-cards-navigator` — `sidebar-cards-navigator`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-sidebar-cards-navigator@0.68.11/README.md) · [same text in this document](#wc-sidebar-cards-navigator)
|
|
143
|
+
- **`hb-sidebar-desktop` — `sidebar-desktop`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-sidebar-desktop@0.68.11/README.md) · [same text in this document](#wc-sidebar-desktop)
|
|
144
|
+
- **`hb-sidenav-button` — `sidenav-button`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-sidenav-button@0.68.11/README.md) · [same text in this document](#wc-sidenav-button)
|
|
145
|
+
- **`hb-sidenav-link` — `sidenav-link`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-sidenav-link@0.68.11/README.md) · [same text in this document](#wc-sidenav-link)
|
|
146
|
+
- **`hb-site-contacts-row` — `site-contacts-row`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-site-contacts-row@0.68.11/README.md) · [same text in this document](#wc-site-contacts-row)
|
|
147
|
+
- **`hb-site-paragraph-with-image` — `site-paragraph-with-image`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-site-paragraph-with-image@0.68.11/README.md) · [same text in this document](#wc-site-paragraph-with-image)
|
|
148
|
+
- **`hb-site-slideshow` — `site-slideshow`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-site-slideshow@0.68.11/README.md) · [same text in this document](#wc-site-slideshow)
|
|
149
|
+
- **`hb-site-slideshow-horizontal` — `site-slideshow-horizontal`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-site-slideshow-horizontal@0.68.11/README.md) · [same text in this document](#wc-site-slideshow-horizontal)
|
|
150
|
+
- **`hb-skeleton-component` — `skeleton-component`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-skeleton-component@0.68.11/README.md) · [same text in this document](#wc-skeleton-component)
|
|
151
|
+
- **`hb-stylus-notebook` — `stylus-notebook`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-stylus-notebook@0.68.11/README.md) · [same text in this document](#wc-stylus-notebook)
|
|
152
|
+
- **`hb-stylus-paper` — `stylus-paper`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-stylus-paper@0.68.11/README.md) · [same text in this document](#wc-stylus-paper)
|
|
153
|
+
- **`hb-table` — `table`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-table@0.68.11/README.md) · [same text in this document](#wc-table)
|
|
154
|
+
- **`hb-terms-doc-templates` — `terms-doc-templates`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-terms-doc-templates@0.68.11/README.md) · [same text in this document](#wc-terms-doc-templates)
|
|
155
|
+
- **`hb-toast` — `toast`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-toast@0.68.11/README.md) · [same text in this document](#wc-toast)
|
|
156
|
+
- **`hb-tooltip` — `tooltip`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-tooltip@0.68.11/README.md) · [same text in this document](#wc-tooltip)
|
|
157
|
+
- **`hb-uploader` — `uploader`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-uploader@0.68.11/README.md) · [same text in this document](#wc-uploader)
|
|
158
|
+
- **`hb-vertical-img-txt-archive` — `vertical-img-txt-archive`** — [README on jsDelivr](https://cdn.jsdelivr.net/npm/@htmlbricks/hb-vertical-img-txt-archive@0.68.11/README.md) · [same text in this document](#wc-vertical-img-txt-archive)
|
|
159
159
|
|
|
160
160
|
---
|
|
161
161
|
|
|
@@ -1107,7 +1107,7 @@ Compact KPI tile: large `number`, caption `text`, configurable Bootstrap Icon, a
|
|
|
1107
1107
|
### Events (`CustomEvent` names)
|
|
1108
1108
|
|
|
1109
1109
|
- **`modalConfirm`** — `{ id: string; confirm: boolean }`
|
|
1110
|
-
- **`modalShow`** — `{ id: string; show:
|
|
1110
|
+
- **`modalShow`** — `{ id: string; show: boolean }`
|
|
1111
1111
|
|
|
1112
1112
|
### Usage notes
|
|
1113
1113
|
|
|
@@ -1159,7 +1159,7 @@ Thin wrapper around `hb-dialog` that opens automatically while numeric `percenta
|
|
|
1159
1159
|
|
|
1160
1160
|
### Events (`CustomEvent` names)
|
|
1161
1161
|
|
|
1162
|
-
- **`modalShow`** — `{ id: string; show:
|
|
1162
|
+
- **`modalShow`** — `{ id: string; show: boolean }` — Forwarded from inner `hb-dialog`.
|
|
1163
1163
|
|
|
1164
1164
|
### Usage notes
|
|
1165
1165
|
|
|
@@ -1213,7 +1213,7 @@ Modal that embeds `hb-form` with the same `schema` contract: live form updates m
|
|
|
1213
1213
|
### Events (`CustomEvent` names)
|
|
1214
1214
|
|
|
1215
1215
|
- **`modalFormConfirm`** — `{ [key: string]: any }` — Submitted field map / payload (types use open object).
|
|
1216
|
-
- **`modalShow`** — `{ id: string; show:
|
|
1216
|
+
- **`modalShow`** — `{ id: string; show: boolean }`
|
|
1217
1217
|
- **`modalFormCancel`** — `{ id: string; error?: string }`
|
|
1218
1218
|
- **`updateForm`** — same detail shape as `hb-form` `update` (see form event types).
|
|
1219
1219
|
|
|
@@ -1266,7 +1266,7 @@ Opens `hb-dialog` while `uri` is set and downloads the resource with `XMLHttpReq
|
|
|
1266
1266
|
|
|
1267
1267
|
- `downloadError` — `{ downloaded: boolean; id: string; error: Error }`
|
|
1268
1268
|
- `downloadComplete` — `{ downloaded: boolean; id: string }`
|
|
1269
|
-
- `modalShow` — `{ id: string; show:
|
|
1269
|
+
- `modalShow` — `{ id: string; show: boolean }`
|
|
1270
1270
|
|
|
1271
1271
|
### Usage notes
|
|
1272
1272
|
|
|
@@ -2615,6 +2615,12 @@ export type Events = {
|
|
|
2615
2615
|
|
|
2616
2616
|
Responsive application shell: below 800px viewport width it mounts the mobile layout; otherwise the desktop layout. Forwards navigation slots, page content, cookie-law options, and layout events from the active child.
|
|
2617
2617
|
|
|
2618
|
+
## Navigation `navlinks` and Bootstrap Icons
|
|
2619
|
+
|
|
2620
|
+
Set `navlinks` on `hb-layout` as a serialized JSON array (HTML attribute) or as an array in JS. The active child forwards it to either `hb-layout-desktop` (sidebar with `hb-sidebar-desktop`) or `hb-layout-mobile` (offcanvas with the same navigation model).
|
|
2621
|
+
|
|
2622
|
+
Use the same `icon` field on each link as for `hb-sidebar-desktop`: Bootstrap Icons **name only** after `bi-` (e.g. `"gear"`, not `"bi bi-gear"`). Details and copy-paste examples: [`hb-sidebar-desktop` README](../sidebar-desktop/README.md#navigation-icons-bootstrap-icons).
|
|
2623
|
+
|
|
2618
2624
|
## Types
|
|
2619
2625
|
|
|
2620
2626
|
```typescript
|
|
@@ -2679,6 +2685,13 @@ export type Events = {
|
|
|
2679
2685
|
|
|
2680
2686
|
Desktop layout with top navbar, optional left sidebar (sidebar-desktop) when navigation links are present, main page area, optional cookie-law banner, and footer. Without `single_screen`, the page column scrolls and the cookie banner and footer are inside that scroll (footer appears after the slot when you scroll down). With `single_screen`, the cookie banner and footer stay fixed at the bottom of the main column (always visible); only the page slot area scrolls, and `footer.type` `auto` uses the compact footer. The sidebar rail is capped to the viewport band. Forwards navigation and footer events.
|
|
2681
2687
|
|
|
2688
|
+
## Passing `navlinks` and sidebar icons
|
|
2689
|
+
|
|
2690
|
+
When `navlinks` is non-empty, this layout renders `hb-sidebar-desktop` and forwards your navigation data to it.
|
|
2691
|
+
|
|
2692
|
+
- **Property / attribute:** set `navlinks` on `hb-layout-desktop` the same way as on `hb-sidebar-desktop`: in HTML use a **JSON string** (serialized `INavLink[]`). In JavaScript you may assign an array of objects directly if your binding supports it.
|
|
2693
|
+
- **Icons:** each link object can include optional `icon` with the Bootstrap Icons **glyph name only** (the part after `bi-` in the official class, e.g. `house-door` for `bi-house-door`). See the [`hb-sidebar-desktop` README](../sidebar-desktop/README.md#navigation-icons-bootstrap-icons) for the full rules, examples, and `subLinks` behavior.
|
|
2694
|
+
|
|
2682
2695
|
## Types
|
|
2683
2696
|
|
|
2684
2697
|
```typescript
|
|
@@ -2737,6 +2750,12 @@ export type Events = {
|
|
|
2737
2750
|
|
|
2738
2751
|
Mobile layout with optional offcanvas sidebar navigation, top navbar, main page slot, optional cookie-law banner, and footer. Without `single_screen`, the main column scrolls and includes the cookie banner and footer after the slot. With `single_screen`, cookie and footer stay at the bottom of the shell (always visible) and only the page slot area scrolls. Forwards navbar, footer, and navigation events.
|
|
2739
2752
|
|
|
2753
|
+
## Passing `navlinks` and sidebar icons
|
|
2754
|
+
|
|
2755
|
+
When `navlinks` is non-empty, navigation is shown inside `hb-offcanvas`, which hosts `hb-sidebar-desktop`. Set `navlinks` on `hb-layout-mobile` as a JSON string (in HTML) or array (in JS), same shape as for `hb-sidebar-desktop`.
|
|
2756
|
+
|
|
2757
|
+
For each link, optional `icon` must be the Bootstrap Icons **glyph name only** (suffix after `bi-`, e.g. `house-door`). See [`hb-sidebar-desktop` README](../sidebar-desktop/README.md#navigation-icons-bootstrap-icons).
|
|
2758
|
+
|
|
2740
2759
|
## Types
|
|
2741
2760
|
|
|
2742
2761
|
```typescript
|
|
@@ -3230,7 +3249,7 @@ Slide-in sidebar panel that hosts `hb-sidebar-desktop`. Uses a fixed panel plus
|
|
|
3230
3249
|
- `enablefooter` (optional): boolean string.
|
|
3231
3250
|
- `type` (optional): `"open"` | `"autohide"` | `"small"` — backdrop and sizing.
|
|
3232
3251
|
- `navpage` (optional): string — active page key.
|
|
3233
|
-
- `navlinks` (optional): JSON string — `INavLink[]` (label, key, icon, badge, subLinks, etc.).
|
|
3252
|
+
- `navlinks` (optional): JSON string — `INavLink[]` (label, key, optional `icon` for Bootstrap Icons, badge, subLinks, etc.). Icon values follow the same rules as `hb-sidebar-desktop`; see [Navigation icons (Bootstrap Icons)](../sidebar-desktop/README.md#navigation-icons-bootstrap-icons).
|
|
3234
3253
|
|
|
3235
3254
|
### Events
|
|
3236
3255
|
|
|
@@ -3242,6 +3261,7 @@ Slide-in sidebar panel that hosts `hb-sidebar-desktop`. Uses a fixed panel plus
|
|
|
3242
3261
|
- **Slots:** `test`, `header`, `footer`.
|
|
3243
3262
|
- **CSS parts:** `header` (on nested `hb-sidebar-desktop`).
|
|
3244
3263
|
- Bulma theme variables apply inside each web component’s shadow root; Bootstrap Icons CSS is loaded for nested nav icons.
|
|
3264
|
+
- The panel embeds `hb-sidebar-desktop`; pass `navlinks` on `hb-offcanvas` exactly as you would on `hb-sidebar-desktop` (including each item’s optional `icon` string: Bootstrap glyph name only, e.g. `house-door`).
|
|
3245
3265
|
- Pair with `hb-sidebar-desktop` / `hb-sidenav-link`; see Storybook examples in `extra/docs.ts`.
|
|
3246
3266
|
|
|
3247
3267
|
### Minimal HTML example
|
|
@@ -4103,7 +4123,7 @@ Fixed-width desktop sidebar: optional company logo and title, header/footer slot
|
|
|
4103
4123
|
- `groups` (optional): JSON string — `{ key; label }[]`.
|
|
4104
4124
|
- `enablefooter` (optional): boolean string.
|
|
4105
4125
|
- `navpage` (optional): string — active page key.
|
|
4106
|
-
- `navlinks` (optional): JSON string — `INavLink[]` for `hb-sidenav-link
|
|
4126
|
+
- `navlinks` (optional): JSON string — `INavLink[]` for `hb-sidenav-link` (see **Navigation icons** below).
|
|
4107
4127
|
- `cookielawallowdecline`, `cookielawlanguage`, `cookielawuri4more` (optional): strings for cookie banner integration.
|
|
4108
4128
|
- `single_screen` (optional): `"yes"` | `"no"` | empty — layout mode flag.
|
|
4109
4129
|
|
|
@@ -4111,12 +4131,37 @@ Fixed-width desktop sidebar: optional company logo and title, header/footer slot
|
|
|
4111
4131
|
|
|
4112
4132
|
- `pageChange`: `{ page: string }`.
|
|
4113
4133
|
|
|
4134
|
+
### Navigation icons (Bootstrap Icons)
|
|
4135
|
+
|
|
4136
|
+
Each entry in `navlinks` (and each item in `subLinks`, if any) may include an optional string property `icon`. Icons use the [Bootstrap Icons](https://icons.getbootstrap.com/) web font; this component loads `bootstrap-icons.css` for the nested `hb-sidenav-link` elements.
|
|
4137
|
+
|
|
4138
|
+
**What value to pass:** pass only the **icon name** (the suffix of the official class), not the full class list.
|
|
4139
|
+
|
|
4140
|
+
- On the Bootstrap Icons site, an icon is used as `<i class="bi bi-house-door"></i>`. In `navlinks` JSON, set `"icon": "house-door"`.
|
|
4141
|
+
- Do **not** prefix with `bi` or `bi-`, and do **not** pass a full class string like `bi bi-house-door`. The child link renders `class="bi bi-{icon}"`; extra prefixes would break the class name.
|
|
4142
|
+
|
|
4143
|
+
**HTML example** (attribute must be a JSON string):
|
|
4144
|
+
|
|
4145
|
+
```html
|
|
4146
|
+
navlinks='[{"label":"Home","key":"home","icon":"house-door"},{"label":"Settings","key":"settings","icon":"gear"}]'
|
|
4147
|
+
```
|
|
4148
|
+
|
|
4149
|
+
**JavaScript** (property can be an array of objects):
|
|
4150
|
+
|
|
4151
|
+
```js
|
|
4152
|
+
el.navlinks = [
|
|
4153
|
+
{ label: "Home", key: "home", icon: "house-door" },
|
|
4154
|
+
{ label: "Settings", key: "settings", icon: "gear" },
|
|
4155
|
+
];
|
|
4156
|
+
```
|
|
4157
|
+
|
|
4158
|
+
Grouped links and expandable rows use the same `icon` field on each object.
|
|
4159
|
+
|
|
4114
4160
|
### Usage notes
|
|
4115
4161
|
|
|
4116
4162
|
- **Slots:** `test`, `header`, `footer`.
|
|
4117
4163
|
- **CSS parts:** `header`.
|
|
4118
|
-
-
|
|
4119
|
-
- Matches the navigation model used inside `hb-offcanvas`.
|
|
4164
|
+
- Matches the navigation model used inside `hb-offcanvas` (same `navlinks` / `icon` rules).
|
|
4120
4165
|
|
|
4121
4166
|
### Minimal HTML example
|
|
4122
4167
|
|
|
@@ -4567,12 +4612,14 @@ While **`is_loading`** is enabled, the tbody shows **Bulma skeleton** rows (`ske
|
|
|
4567
4612
|
|
|
4568
4613
|
Use **`actions`** for a column of buttons that is the same for every row (one set per row, same definitions). Use **`_actions`** on a single row object for buttons only on that row (e.g. variable actions per record). Both use the same **`IActionButton`** shape.
|
|
4569
4614
|
|
|
4615
|
+
Pass **`actions`** / per-row **`_actions`** as JSON (HTML attribute string or parsed array in JS). Each entry can drive a **text** or **icon** button; icon buttons use [Bootstrap Icons](https://icons.getbootstrap.com/) and optional **`btnClass`** for Bulma-coloured hosts (see below).
|
|
4616
|
+
|
|
4570
4617
|
| Field | Purpose |
|
|
4571
4618
|
| --- | --- |
|
|
4572
4619
|
| `name` | Stable id for the action; emitted in events as `action`. |
|
|
4573
|
-
| `type` | `"text"` — show `iconOrText` as label; `"icon"` — show a
|
|
4574
|
-
| `iconOrText` |
|
|
4575
|
-
| `btnClass` | Optional
|
|
4620
|
+
| `type` | `"text"` — show `iconOrText` as the button label; `"icon"` — show a Bootstrap Icon (see **Action icons (Bootstrap Icons)**). |
|
|
4621
|
+
| `iconOrText` | If `type: "text"`, the visible label. If `type: "icon"`, the icon glyph name only (see **Action icons (Bootstrap Icons)**). |
|
|
4622
|
+
| `btnClass` | Optional colour/style token for the hosting `<button>` (see **Button colours (`btnClass`)**). |
|
|
4576
4623
|
| `disabled` | If true, the control is disabled. |
|
|
4577
4624
|
| `confirm` | If set, clicking opens **`hb-dialog`** confirm; on confirm the table emits `tableaction` / related confirm events. |
|
|
4578
4625
|
| `edit` | If set (and no `confirm`), clicking opens **`hb-dialogform`** with the given `schema`. |
|
|
@@ -4580,7 +4627,67 @@ Use **`actions`** for a column of buttons that is the same for every row (one se
|
|
|
4580
4627
|
|
|
4581
4628
|
**Behaviour without `confirm` / `edit`:** the table dispatches **`tableaction`** with `{ itemId, action }` where `action` is the button `name`. For **`_actions`** on a row, the same flow applies but the event **`tableCustomActionClick`** is also fired with `{ itemId, action }` so you can distinguish custom per-row actions if needed.
|
|
4582
4629
|
|
|
4583
|
-
|
|
4630
|
+
#### Action icons (Bootstrap Icons)
|
|
4631
|
+
|
|
4632
|
+
For `type: "icon"`, set **`iconOrText`** to the **glyph name** from Bootstrap Icons: the segment that appears **after** `bi-` in the official class name.
|
|
4633
|
+
|
|
4634
|
+
- Docs show `<i class="bi bi-pencil"></i>` → use `"iconOrText": "pencil"`.
|
|
4635
|
+
- For hyphenated names (e.g. `house-door`) use the full slug: `"house-door"`.
|
|
4636
|
+
- Do **not** repeat the `bi-` prefix in the value (use `"pencil"`, not `"bi-pencil"`). The table renders `<i class="bi-{iconOrText}"></i>` (e.g. `class="bi-pencil"`).
|
|
4637
|
+
|
|
4638
|
+
**Global `actions` (HTML):**
|
|
4639
|
+
|
|
4640
|
+
```html
|
|
4641
|
+
actions='[{"name":"edit","type":"icon","iconOrText":"pencil","btnClass":"primary"}]'
|
|
4642
|
+
```
|
|
4643
|
+
|
|
4644
|
+
**Per-row `_actions` inside `rows`:**
|
|
4645
|
+
|
|
4646
|
+
```json
|
|
4647
|
+
{
|
|
4648
|
+
"_id": "1",
|
|
4649
|
+
"name": "Alice",
|
|
4650
|
+
"_actions": [
|
|
4651
|
+
{ "name": "preview", "type": "icon", "iconOrText": "eye", "btnClass": "info" },
|
|
4652
|
+
{ "name": "remove", "type": "icon", "iconOrText": "trash", "btnClass": "danger" }
|
|
4653
|
+
]
|
|
4654
|
+
}
|
|
4655
|
+
```
|
|
4656
|
+
|
|
4657
|
+
The component loads Bootstrap Icons CSS via `<svelte:head>` so the font is available for those `<i>` elements.
|
|
4658
|
+
|
|
4659
|
+
#### Button colours (`btnClass`)
|
|
4660
|
+
|
|
4661
|
+
The table maps **`btnClass`** to **Bulma** `button` modifiers on the hosting control (not literal Bootstrap `btn btn-*` classes in the DOM).
|
|
4662
|
+
|
|
4663
|
+
| You pass (`btnClass`) | Button classes applied |
|
|
4664
|
+
| --- | --- |
|
|
4665
|
+
| `primary` | `button is-primary` |
|
|
4666
|
+
| `secondary` | `button is-light` |
|
|
4667
|
+
| `success` | `button is-success` |
|
|
4668
|
+
| `danger` | `button is-danger` |
|
|
4669
|
+
| `warning` | `button is-warning` |
|
|
4670
|
+
| `info` | `button is-info` |
|
|
4671
|
+
| `light` | `button is-light` |
|
|
4672
|
+
| `dark` | `button is-dark` |
|
|
4673
|
+
| `link` | `button is-ghost` |
|
|
4674
|
+
|
|
4675
|
+
Matching is case-insensitive; an optional `btn-` prefix is stripped (e.g. `btn-danger` and `danger` are equivalent). If **`btnClass` is omitted**, **text** actions default to **`link`** (`is-ghost`); **icon** actions default to **`light`** (`is-light`).
|
|
4676
|
+
|
|
4677
|
+
**Legacy:** if you pass a string that already starts with `button ` (e.g. `button is-warning`), it is used as-is. Strings like `btn btn-danger` are normalised to the same mapping as `danger`.
|
|
4678
|
+
|
|
4679
|
+
**Example (icons + colours):**
|
|
4680
|
+
|
|
4681
|
+
```html
|
|
4682
|
+
<hb-table
|
|
4683
|
+
headers='[{"label":"Name","key":"name"},{"label":"Tools","key":"x","type":"actions","nosort":true}]'
|
|
4684
|
+
rows='[{"_id":"1","name":"Alice","_actions":[{"name":"star","type":"icon","iconOrText":"star","btnClass":"warning"}]}]'
|
|
4685
|
+
actions='[
|
|
4686
|
+
{"name":"edit","type":"icon","iconOrText":"pencil","btnClass":"primary"},
|
|
4687
|
+
{"name":"delete","type":"icon","iconOrText":"trash","btnClass":"danger"}
|
|
4688
|
+
]'
|
|
4689
|
+
></hb-table>
|
|
4690
|
+
```
|
|
4584
4691
|
|
|
4585
4692
|
### Multi-select (`enableselect`, `selectactions`)
|
|
4586
4693
|
|
|
@@ -4660,20 +4767,9 @@ Set **`add_item`** to `"yes"` / `"true"` (or boolean `true` in frameworks) to sh
|
|
|
4660
4767
|
></hb-table>
|
|
4661
4768
|
```
|
|
4662
4769
|
|
|
4663
|
-
### Actions
|
|
4664
|
-
|
|
4665
|
-
```html
|
|
4666
|
-
<hb-table
|
|
4667
|
-
headers='[{"label":"Name","key":"name"},{"label":"Tools","key":"tools","type":"actions","nosort":true}]'
|
|
4668
|
-
rows='[{"_id":"1","name":"Alice"}]'
|
|
4669
|
-
actions='[
|
|
4670
|
-
{"name":"edit","type":"icon","iconOrText":"pencil","btnClass":"primary"},
|
|
4671
|
-
{"name":"delete","type":"icon","iconOrText":"trash","btnClass":"danger"}
|
|
4672
|
-
]'
|
|
4673
|
-
></hb-table>
|
|
4674
|
-
```
|
|
4770
|
+
### Actions — handling clicks
|
|
4675
4771
|
|
|
4676
|
-
|
|
4772
|
+
Use the **`actions`** / **`_actions`** JSON shape and icon / `btnClass` rules in the **Actions** section above. Listen for **`tableaction`** with `{ itemId, action }`; for per-row **`_actions`**, **`tableCustomActionClick`** is also emitted if you need to separate custom row tools from the global column.
|
|
4677
4773
|
|
|
4678
4774
|
---
|
|
4679
4775
|
|
|
@@ -4835,7 +4931,7 @@ Upload progress UI driven by `fetch_data` (`url`, `data`, optional `method`, `he
|
|
|
4835
4931
|
|
|
4836
4932
|
- `uploadError`: `{ completed: boolean; id: string; error: Error }`.
|
|
4837
4933
|
- `uploadComplete`: `{ completed: boolean; id: string }`.
|
|
4838
|
-
- `modalShow`: forwarded from `hb-dialog` — `{ id: string; show:
|
|
4934
|
+
- `modalShow`: forwarded from `hb-dialog` — `{ id: string; show: boolean }` (see dialog typings).
|
|
4839
4935
|
|
|
4840
4936
|
### Usage notes
|
|
4841
4937
|
|