@thebase/ui 0.0.12 → 1.1.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.
- package/CHANGELOG.md +24 -0
- package/LICENSE +28 -0
- package/README.md +24 -4
- package/dist/baseui.analytics.esm.js +1 -0
- package/dist/baseui.analytics.min.js +1 -0
- package/dist/baseui.esm.js +12 -12
- package/dist/baseui.icons.esm.js +1 -1
- package/dist/baseui.min.css +1 -1
- package/dist/baseui.min.js +12 -12
- package/dist/baseui.registry.json +9 -5
- package/dist/types/analytics.d.ts +65 -0
- package/dist/types/index.d.ts +4 -0
- package/docs/analytics.md +77 -0
- package/docs/blocks.md +1 -1
- package/docs/components/avatar.md +3 -3
- package/docs/components/block-viewer.md +2 -2
- package/docs/components/button.md +4 -1
- package/docs/components/calendar.md +3 -3
- package/docs/components/carousel.md +3 -3
- package/docs/components/chart.md +3 -3
- package/docs/components/combobox.md +3 -3
- package/docs/components/command.md +3 -3
- package/docs/components/context-menu.md +3 -3
- package/docs/components/data-table.md +3 -3
- package/docs/components/date-picker.md +3 -3
- package/docs/components/icon.md +2 -2
- package/docs/components/input-otp.md +3 -3
- package/docs/components/input.md +2 -2
- package/docs/components/markdown.md +2 -2
- package/docs/components/message-scroller.md +3 -3
- package/docs/components/message.md +3 -3
- package/docs/components/popover.md +3 -3
- package/docs/components/questionnaire.md +3 -3
- package/docs/components/resizable.md +3 -3
- package/docs/components/scroll-area.md +3 -3
- package/docs/components/sidebar.md +2 -0
- package/docs/components/text-editor.md +1 -1
- package/docs/components/theme-button.md +2 -2
- package/docs/components/toggle-group.md +3 -3
- package/docs/components/toggle.md +3 -3
- package/docs/components/tooltip.md +3 -3
- package/docs/icons.md +5 -5
- package/docs/installation.md +4 -3
- package/docs/owl-components.md +27 -4
- package/docs/registry.md +2 -1
- package/docs/runtime-api.md +16 -12
- package/docs/theming.md +4 -4
- package/docs/usage-guide.md +15 -15
- package/package.json +8 -1
|
@@ -18,6 +18,8 @@
|
|
|
18
18
|
"baseui.icons.esm.js",
|
|
19
19
|
"baseui.templates.xml",
|
|
20
20
|
"baseui.block-viewer.esm.js",
|
|
21
|
+
"baseui.analytics.esm.js",
|
|
22
|
+
"baseui.analytics.min.js",
|
|
21
23
|
"icons/lucide.json"
|
|
22
24
|
],
|
|
23
25
|
"icons": {
|
|
@@ -1658,13 +1660,15 @@
|
|
|
1658
1660
|
}
|
|
1659
1661
|
],
|
|
1660
1662
|
"integrity": {
|
|
1661
|
-
"baseui.min.css": "sha384-
|
|
1663
|
+
"baseui.min.css": "sha384-hYFwlV6T/ONYzawtDGDFUoruqgNwYl9AVvLDHx24IWgKSMXqwACo/nX04I3gnyT9",
|
|
1662
1664
|
"bootstrap.bundle.min.js": "sha384-RMbllTJcplkCRnELNTOc5Kz/3AvFDE/rNlJqWqfgmRWruobClBdfwvl10akQZkR1",
|
|
1663
|
-
"baseui.min.js": "sha384-
|
|
1664
|
-
"baseui.esm.js": "sha384-
|
|
1665
|
-
"baseui.icons.esm.js": "sha384-
|
|
1665
|
+
"baseui.min.js": "sha384-jzPn6U5dm/0jM9kcSMnDNOiDWLfdN4h28z+YRNYU/IbGmMf4nFTSVsTn6siJ+UHH",
|
|
1666
|
+
"baseui.esm.js": "sha384-I61E5GCJymEsiX5xmIe5Ufd498zcuzGIWwu79WfKg1IKbtACkeC3LG1QXbIq/5cT",
|
|
1667
|
+
"baseui.icons.esm.js": "sha384-hj39VMhzcFvmYnjob2hlioMOAqwAXCURGreF6s9RitXFp/iYi7rUdqtfCI+ICQeS",
|
|
1666
1668
|
"baseui.templates.xml": "sha384-XkqmfurKcEF6WuIQHWAbnZfW6oz19n7SDVRDU3g0hc3qOr4kPd/qfNGcTmcDDIgQ",
|
|
1667
|
-
"baseui.block-viewer.esm.js": "sha384-
|
|
1669
|
+
"baseui.block-viewer.esm.js": "sha384-XlIb3jDxt6Q75dbC4rLctTdPU6u0vJFcbxp9Gl6VKOkhjpz3wRBe0E3dWd80425L",
|
|
1670
|
+
"baseui.analytics.esm.js": "sha384-M7jEmmio32O8iquXxQjhCbfEAqZAkHG+a1+Wt6sajMFCubQDzEx7QQMMpek0QxY6",
|
|
1671
|
+
"baseui.analytics.min.js": "sha384-aD3A1qm15yTTviPHRscI2enlOIHp7SaIdr+KBCBTgjChn23ZfEsOvY7izOB+hUZe",
|
|
1668
1672
|
"icons/lucide.json": "sha384-mc5mzpmq9eOgZVa2IcjrL33Ty4nMXE8aoZMfy+lgkC/jMQ4aYnk2S58mFsSGFnW1",
|
|
1669
1673
|
"themes/baseui-light.css": "sha384-/TosvycgVJ5aZ7EOWd4cr8Zen4nayAC/iA9BgGdXKH0LuHSnZk4guDaWM5WPC7yy",
|
|
1670
1674
|
"themes/baseui-dark.css": "sha384-zF9Rhfjpv90sxuJ2WK7GBPCltN6mkebzK1w9EzQGY9DYHiX3eIX/fcE7fXzfIZVF"
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
/** Cookieless analytics service (ported from @plausible-analytics/tracker 0.4.6). */
|
|
2
|
+
export interface BaseUIAnalytics {
|
|
3
|
+
/** Sets up the tracker. Can be called once. */
|
|
4
|
+
init(config: BaseUIAnalyticsConfig): void;
|
|
5
|
+
/** Tracks an event; requires `init` to be called first. */
|
|
6
|
+
track(eventName: string, options?: BaseUIAnalyticsEventOptions): void;
|
|
7
|
+
/** File types tracked by default when `fileDownloads` is enabled. */
|
|
8
|
+
DEFAULT_FILE_TYPES: string[];
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
export interface BaseUIAnalyticsConfig {
|
|
12
|
+
/** Analytics backend origin, e.g. "https://stats.example.com" — events go to `<backendUrl><apiPath>`. Required unless `endpoint` is given. */
|
|
13
|
+
backendUrl?: string;
|
|
14
|
+
/** Path appended to `backendUrl`. Defaults to "/api/event". */
|
|
15
|
+
apiPath?: string;
|
|
16
|
+
/** Full event URL (http(s):// or a same-site /path); overrides `backendUrl` and `apiPath`. */
|
|
17
|
+
endpoint?: string;
|
|
18
|
+
/** Site name reported with every event. Defaults to `location.hostname`. */
|
|
19
|
+
domain?: string;
|
|
20
|
+
/** Capture pageviews automatically (incl. pushState/popstate). Defaults to true. */
|
|
21
|
+
autoCapturePageviews?: boolean;
|
|
22
|
+
/** Page uses hash-based routing. Defaults to false. */
|
|
23
|
+
hashBasedRouting?: boolean;
|
|
24
|
+
/** Track outbound link clicks. Defaults to false. */
|
|
25
|
+
outboundLinks?: boolean;
|
|
26
|
+
/** Track file downloads, optionally with a custom extension list. Defaults to false. */
|
|
27
|
+
fileDownloads?: boolean | { fileExtensions: string[] };
|
|
28
|
+
/** Track form submissions. Defaults to false. */
|
|
29
|
+
formSubmissions?: boolean;
|
|
30
|
+
/** Capture events on localhost. Defaults to false. */
|
|
31
|
+
captureOnLocalhost?: boolean;
|
|
32
|
+
/** Log ignored events to the console. Defaults to true. */
|
|
33
|
+
logging?: boolean;
|
|
34
|
+
/** Properties added to every event, or a function returning them per event name. */
|
|
35
|
+
customProperties?: Record<string, string> | ((eventName: string) => Record<string, string>);
|
|
36
|
+
/** Rewrite the payload before sending; return a falsy value to drop the event. */
|
|
37
|
+
transformRequest?: (payload: BaseUIAnalyticsPayload) => BaseUIAnalyticsPayload | null;
|
|
38
|
+
/** Bind the tracker to `window.thebase.track`. Defaults to true. */
|
|
39
|
+
bindToWindow?: boolean;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
export interface BaseUIAnalyticsEventOptions {
|
|
43
|
+
props?: Record<string, string>;
|
|
44
|
+
/** Non-interactive events don't count towards bounce rate. Defaults to true. */
|
|
45
|
+
interactive?: boolean;
|
|
46
|
+
revenue?: { amount: number | string; currency: string };
|
|
47
|
+
/** Called with `{ status }`, `{ error }`, or undefined when the event was ignored. */
|
|
48
|
+
callback?: (result?: { status: number } | { error: unknown }) => void;
|
|
49
|
+
/** Overrides the page URL (defaults to `location.href`). */
|
|
50
|
+
url?: string;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
export type BaseUIAnalyticsPayload = {
|
|
54
|
+
n: string;
|
|
55
|
+
u: string;
|
|
56
|
+
d: string;
|
|
57
|
+
r?: string | null;
|
|
58
|
+
p?: Record<string, string>;
|
|
59
|
+
$?: { amount: number | string; currency: string };
|
|
60
|
+
i?: boolean;
|
|
61
|
+
} & Record<string, unknown>;
|
|
62
|
+
|
|
63
|
+
export const DEFAULT_FILE_TYPES: string[];
|
|
64
|
+
export function init(config: BaseUIAnalyticsConfig): void;
|
|
65
|
+
export function track(eventName: string, options?: BaseUIAnalyticsEventOptions): void;
|
package/dist/types/index.d.ts
CHANGED
|
@@ -25,6 +25,10 @@ export interface BaseUIApi {
|
|
|
25
25
|
};
|
|
26
26
|
};
|
|
27
27
|
theme: { set(modeOrTokens: string | Record<string, string>): void };
|
|
28
|
+
/** Set by dist/baseui.analytics.min.js (the optional analytics service). */
|
|
29
|
+
analytics?: import("./analytics").BaseUIAnalytics;
|
|
30
|
+
/** Bound by `analytics.init()` (unless `bindToWindow: false`). */
|
|
31
|
+
track?: import("./analytics").BaseUIAnalytics["track"];
|
|
28
32
|
}
|
|
29
33
|
|
|
30
34
|
export interface BaseUIThemeController {
|
|
@@ -0,0 +1,77 @@
|
|
|
1
|
+
# Analytics
|
|
2
|
+
|
|
3
|
+
BaseUI ships a cookieless web-analytics service, ported from [`@plausible-analytics/tracker`](https://www.npmjs.com/package/@plausible-analytics/tracker) 0.4.6 (MIT; notice in `LICENSE`). Nothing is collected until the page calls `init({ backendUrl })`. Available from `@thebase/ui` 1.1.0.
|
|
4
|
+
|
|
5
|
+
It is an optional, standalone feature: it is **not** part of `dist/baseui.min.js`/`dist/baseui.esm.js`, and it needs neither of them (no Owl, Bootstrap or component runtime). Load it on its own, with or without the rest of BaseUI (~5.6 KB minified):
|
|
6
|
+
|
|
7
|
+
```js
|
|
8
|
+
// npm / bundler
|
|
9
|
+
import { init, track } from "@thebase/ui/analytics";
|
|
10
|
+
init({ backendUrl: "https://stats.example.com" });
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
```html
|
|
14
|
+
<!-- ES module from the CDN (or map it as "@base/analytics" in an import map) -->
|
|
15
|
+
<script type="module">
|
|
16
|
+
import { init } from "https://cdn.jsdelivr.net/npm/@thebase/ui@1.1.0/dist/baseui.analytics.esm.js";
|
|
17
|
+
init({ backendUrl: "https://stats.example.com" });
|
|
18
|
+
</script>
|
|
19
|
+
|
|
20
|
+
<!-- Classic script tag: sets window.thebase.analytics (load order vs dist/baseui.min.js doesn't matter) -->
|
|
21
|
+
<script src="https://cdn.jsdelivr.net/npm/@thebase/ui@1.1.0/dist/baseui.analytics.min.js"></script>
|
|
22
|
+
<script>
|
|
23
|
+
thebase.analytics.init({ backendUrl: "https://stats.example.com" });
|
|
24
|
+
</script>
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
Types ship as `dist/types/analytics.d.ts` (resolved automatically for `@thebase/ui/analytics`).
|
|
28
|
+
|
|
29
|
+
`init()` can be called once. It sends the first pageview, then follows `history.pushState`/`popstate` navigations (or `hashchange` with `hashBasedRouting: true`).
|
|
30
|
+
|
|
31
|
+
## Options
|
|
32
|
+
|
|
33
|
+
| Option | Default | Effect |
|
|
34
|
+
| --- | --- | --- |
|
|
35
|
+
| `backendUrl` | required¹ | Analytics backend origin, e.g. `https://stats.example.com`. Events are POSTed (`text/plain` JSON, no CORS preflight) to `<backendUrl><apiPath>`; a trailing `/` is fine. |
|
|
36
|
+
| `apiPath` | `/api/event` | Path appended to `backendUrl` (leading `/` optional), e.g. `/v1/collect`. |
|
|
37
|
+
| `endpoint` | — | Full event URL instead of `backendUrl` + `apiPath` (`http(s)://…` or a same-site `/path`, e.g. behind a proxy). |
|
|
38
|
+
| `domain` | `location.hostname` | Site name reported with every event. |
|
|
39
|
+
| `autoCapturePageviews` | `true` | Send pageviews automatically. |
|
|
40
|
+
| `hashBasedRouting` | `false` | Treat `#` changes as navigations. |
|
|
41
|
+
| `outboundLinks` | `false` | Track clicks on links to other hosts as `Outbound Link: Click`. |
|
|
42
|
+
| `fileDownloads` | `false` | Track download links as `File Download`; pass `{ fileExtensions: [...] }` to replace `analytics.DEFAULT_FILE_TYPES`. |
|
|
43
|
+
| `formSubmissions` | `false` | Track valid form submits as `Form: Submission`. |
|
|
44
|
+
| `captureOnLocalhost` | `false` | Also send from `localhost`/`127.x`/`file:`. |
|
|
45
|
+
| `logging` | `true` | `console.warn` when an event is ignored. |
|
|
46
|
+
| `customProperties` | — | Props added to every event (object, or `(eventName) => object`). |
|
|
47
|
+
| `transformRequest` | — | Rewrite the payload; return a falsy value to drop the event. |
|
|
48
|
+
| `bindToWindow` | `true` | Bind the tracker to `window.thebase.track`. |
|
|
49
|
+
|
|
50
|
+
¹ One of `backendUrl` or `endpoint` is required. `init()` throws if neither is given, or if the URL has no `http(s)://` scheme and doesn't start with `/` (e.g. `stats.example.com`), since that would silently post to a path on your own site.
|
|
51
|
+
|
|
52
|
+
Your backend should answer with `Access-Control-Allow-Origin` for your site. The event is delivered either way (there is no preflight), but without that header the browser hides the response and `callback` receives `{ error }`.
|
|
53
|
+
|
|
54
|
+
## Custom events
|
|
55
|
+
|
|
56
|
+
```js
|
|
57
|
+
thebase.track("Signup", { props: { plan: "pro" }, revenue: { amount: 10, currency: "USD" } });
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
`track(name, options)` accepts `props`, `revenue`, `interactive: false` (excluded from bounce rate), `url` (override the page URL), and `callback(result)` — called with `{ status }`, `{ error }`, or `undefined` when the event was ignored.
|
|
61
|
+
|
|
62
|
+
Or tag markup with classes — no JavaScript needed:
|
|
63
|
+
|
|
64
|
+
```html
|
|
65
|
+
<button class="thebase-event-name=Signup thebase-event-plan=pro">Sign up</button>
|
|
66
|
+
<form class="thebase-event-name=Lead">...</form>
|
|
67
|
+
```
|
|
68
|
+
|
|
69
|
+
`+` in a class value becomes a space; `thebase-revenue-amount=10 thebase-revenue-currency=USD` attaches revenue.
|
|
70
|
+
|
|
71
|
+
## Engagement
|
|
72
|
+
|
|
73
|
+
After each pageview the service measures time on screen and maximum scroll depth, and sends an `engagement` event (`e` = ms, `sd` = %) when the tab is hidden, loses focus, or navigates — only if the visitor scrolled further or spent at least 3 seconds since the last report.
|
|
74
|
+
|
|
75
|
+
## Ignored visits
|
|
76
|
+
|
|
77
|
+
Events are dropped (and `callback()` gets `undefined`) on localhost unless `captureOnLocalhost` is set, in automated browsers (`navigator.webdriver`, Cypress, PhantomJS, Nightmare — unless `window.__thebase` is set), or when `localStorage.thebase_ignore === "true"` (set that on your own devices to exclude them).
|
package/docs/blocks.md
CHANGED
|
@@ -13,7 +13,7 @@ Blocks are not standalone runtime components. Paste the markup and load the norm
|
|
|
13
13
|
<script src="https://cdn.jsdelivr.net/npm/@thebase/ui@latest/dist/baseui.min.js" defer></script>
|
|
14
14
|
```
|
|
15
15
|
|
|
16
|
-
`https://unpkg.com/@thebase/ui@latest/dist/...` mirrors the same files as an alternative CDN if jsDelivr is unreachable. Pin an exact version (e.g. `@
|
|
16
|
+
`https://unpkg.com/@thebase/ui@latest/dist/...` mirrors the same files as an alternative CDN if jsDelivr is unreachable. Pin an exact version (e.g. `@1.1.0`, or `@1` to take only non-breaking updates) instead of `@latest` for production. Blocks are static markup, so they only need the static `b-ui` runtime above — see [Usage Guide](usage-guide.md) if the surrounding page is itself an Owl app and you'd rather compose the equivalent layout from [Pure Owl Components](owl-components.md).
|
|
17
17
|
|
|
18
18
|
Use `b-block` to select the block style:
|
|
19
19
|
|
|
@@ -37,7 +37,7 @@ See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for
|
|
|
37
37
|
|
|
38
38
|
## Enhanced usage
|
|
39
39
|
|
|
40
|
-
Call `
|
|
40
|
+
Call `thebase.mount(element)` or rely on `thebase.mountAll()` after the script loads.
|
|
41
41
|
|
|
42
42
|
## Options and attributes
|
|
43
43
|
|
|
@@ -45,7 +45,7 @@ See `dist/baseui.registry.json` for the supported attribute list.
|
|
|
45
45
|
|
|
46
46
|
## Methods
|
|
47
47
|
|
|
48
|
-
Use the global runtime methods: `
|
|
48
|
+
Use the global runtime methods: `thebase.mount()`, `thebase.mountAll()`, and `thebase.destroy()`.
|
|
49
49
|
|
|
50
50
|
## Events
|
|
51
51
|
|
|
@@ -69,4 +69,4 @@ BaseUI targets modern evergreen browsers that support ES modules, CSS variables,
|
|
|
69
69
|
|
|
70
70
|
## Test checklist
|
|
71
71
|
|
|
72
|
-
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `
|
|
72
|
+
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `thebase.destroy()`.
|
|
@@ -37,7 +37,7 @@ import { BlockViewer } from "@base/component";
|
|
|
37
37
|
</body>
|
|
38
38
|
```
|
|
39
39
|
|
|
40
|
-
`
|
|
40
|
+
`thebase.mountAll()` (called automatically on `DOMContentLoaded`) mounts the `b-ui="block-viewer"` element as a full Owl app, using the block's own inline template as its live preview and its serialized text as the "Code" panel.
|
|
41
41
|
|
|
42
42
|
## Options and attributes
|
|
43
43
|
|
|
@@ -49,4 +49,4 @@ See `dist/baseui.registry.json` for the full attribute list.
|
|
|
49
49
|
|
|
50
50
|
## Methods
|
|
51
51
|
|
|
52
|
-
Use the global runtime methods: `
|
|
52
|
+
Use the global runtime methods: `thebase.mount()`, `thebase.mountAll()`, and `thebase.destroy()`.
|
|
@@ -50,9 +50,12 @@ import { Button } from "@thebase/ui";
|
|
|
50
50
|
| `id` | `String` | forwarded to the rendered `<a>`/`<button>` |
|
|
51
51
|
| `title` | `String` | forwarded to the rendered `<a>`/`<button>` |
|
|
52
52
|
| `className` | `String` | appended to the generated `btn ...` classes |
|
|
53
|
+
| `unstyled` | `Boolean` | drops the forced `btn bu-button`/variant/size classes so only `className` applies — for reusing Button's behavior under your own CSS |
|
|
54
|
+
| `attrs` | `Object` | extra attributes spread onto the rendered `<a>`/`<button>` (`aria-*`, `data-*`, `data-bs-*`, custom directives) that have no first-class prop |
|
|
55
|
+
| `getRef` | `Function` | called with the rendered root element after mount, and with `null` on unmount |
|
|
53
56
|
| `onClick` | `Function` | called with the native click event |
|
|
54
57
|
|
|
55
|
-
Also accepts default slot content instead of `label`. See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
|
|
58
|
+
Also accepts default slot content instead of `label`. Every pure Owl BaseUI component that renders a clickable control (dialog close, tab triggers, toast action, select trigger, ...) renders it through `Button`, usually with `unstyled`, so those controls share one click/disabled/`href` implementation. See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
|
|
56
59
|
|
|
57
60
|
## Static component
|
|
58
61
|
|
|
@@ -36,7 +36,7 @@ See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for
|
|
|
36
36
|
|
|
37
37
|
## Enhanced usage
|
|
38
38
|
|
|
39
|
-
Call `
|
|
39
|
+
Call `thebase.mount(element)` or rely on `thebase.mountAll()` after the script loads.
|
|
40
40
|
|
|
41
41
|
## Options and attributes
|
|
42
42
|
|
|
@@ -44,7 +44,7 @@ See `dist/baseui.registry.json` for the supported attribute list.
|
|
|
44
44
|
|
|
45
45
|
## Methods
|
|
46
46
|
|
|
47
|
-
Use the global runtime methods: `
|
|
47
|
+
Use the global runtime methods: `thebase.mount()`, `thebase.mountAll()`, and `thebase.destroy()`.
|
|
48
48
|
|
|
49
49
|
## Events
|
|
50
50
|
|
|
@@ -68,4 +68,4 @@ BaseUI targets modern evergreen browsers that support ES modules, CSS variables,
|
|
|
68
68
|
|
|
69
69
|
## Test checklist
|
|
70
70
|
|
|
71
|
-
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `
|
|
71
|
+
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `thebase.destroy()`.
|
|
@@ -86,7 +86,7 @@ The static adapter builds the `.carousel-inner`/`.carousel-item` wrapper structu
|
|
|
86
86
|
|
|
87
87
|
## Enhanced usage
|
|
88
88
|
|
|
89
|
-
Call `
|
|
89
|
+
Call `thebase.mount(element)` or rely on `thebase.mountAll()` after the script loads.
|
|
90
90
|
|
|
91
91
|
## Options and attributes
|
|
92
92
|
|
|
@@ -94,7 +94,7 @@ See `dist/baseui.registry.json` for the supported attribute list.
|
|
|
94
94
|
|
|
95
95
|
## Methods
|
|
96
96
|
|
|
97
|
-
Use the global runtime methods: `
|
|
97
|
+
Use the global runtime methods: `thebase.mount()`, `thebase.mountAll()`, and `thebase.destroy()`.
|
|
98
98
|
|
|
99
99
|
## Events
|
|
100
100
|
|
|
@@ -118,4 +118,4 @@ BaseUI targets modern evergreen browsers that support ES modules, CSS variables,
|
|
|
118
118
|
|
|
119
119
|
## Test checklist
|
|
120
120
|
|
|
121
|
-
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `
|
|
121
|
+
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `thebase.destroy()`.
|
package/docs/components/chart.md
CHANGED
|
@@ -94,7 +94,7 @@ See `examples/charts/area.html` for the local copy of the shadcn area chart gall
|
|
|
94
94
|
|
|
95
95
|
## Enhanced usage
|
|
96
96
|
|
|
97
|
-
Call `
|
|
97
|
+
Call `thebase.mount(element)` or rely on `thebase.mountAll()` after the script loads.
|
|
98
98
|
|
|
99
99
|
## Options and attributes
|
|
100
100
|
|
|
@@ -102,7 +102,7 @@ See `dist/baseui.registry.json` for the supported attribute list.
|
|
|
102
102
|
|
|
103
103
|
## Methods
|
|
104
104
|
|
|
105
|
-
Use the global runtime methods: `
|
|
105
|
+
Use the global runtime methods: `thebase.mount()`, `thebase.mountAll()`, and `thebase.destroy()`.
|
|
106
106
|
|
|
107
107
|
## Events
|
|
108
108
|
|
|
@@ -126,4 +126,4 @@ BaseUI targets modern evergreen browsers that support ES modules, CSS variables,
|
|
|
126
126
|
|
|
127
127
|
## Test checklist
|
|
128
128
|
|
|
129
|
-
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `
|
|
129
|
+
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `thebase.destroy()`.
|
|
@@ -43,7 +43,7 @@ See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for
|
|
|
43
43
|
|
|
44
44
|
## Enhanced usage
|
|
45
45
|
|
|
46
|
-
Call `
|
|
46
|
+
Call `thebase.mount(element)` or rely on `thebase.mountAll()` after the script loads.
|
|
47
47
|
|
|
48
48
|
## Options and attributes
|
|
49
49
|
|
|
@@ -51,7 +51,7 @@ See `dist/baseui.registry.json` for the supported attribute list.
|
|
|
51
51
|
|
|
52
52
|
## Methods
|
|
53
53
|
|
|
54
|
-
Use the global runtime methods: `
|
|
54
|
+
Use the global runtime methods: `thebase.mount()`, `thebase.mountAll()`, and `thebase.destroy()`.
|
|
55
55
|
|
|
56
56
|
## Events
|
|
57
57
|
|
|
@@ -75,4 +75,4 @@ BaseUI targets modern evergreen browsers that support ES modules, CSS variables,
|
|
|
75
75
|
|
|
76
76
|
## Test checklist
|
|
77
77
|
|
|
78
|
-
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `
|
|
78
|
+
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `thebase.destroy()`.
|
|
@@ -46,7 +46,7 @@ See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for
|
|
|
46
46
|
|
|
47
47
|
## Enhanced usage
|
|
48
48
|
|
|
49
|
-
Call `
|
|
49
|
+
Call `thebase.mount(element)` or rely on `thebase.mountAll()` after the script loads.
|
|
50
50
|
|
|
51
51
|
## Options and attributes
|
|
52
52
|
|
|
@@ -54,7 +54,7 @@ See `dist/baseui.registry.json` for the supported attribute list.
|
|
|
54
54
|
|
|
55
55
|
## Methods
|
|
56
56
|
|
|
57
|
-
Use the global runtime methods: `
|
|
57
|
+
Use the global runtime methods: `thebase.mount()`, `thebase.mountAll()`, and `thebase.destroy()`.
|
|
58
58
|
|
|
59
59
|
## Events
|
|
60
60
|
|
|
@@ -78,4 +78,4 @@ BaseUI targets modern evergreen browsers that support ES modules, CSS variables,
|
|
|
78
78
|
|
|
79
79
|
## Test checklist
|
|
80
80
|
|
|
81
|
-
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `
|
|
81
|
+
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `thebase.destroy()`.
|
|
@@ -48,7 +48,7 @@ See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for
|
|
|
48
48
|
|
|
49
49
|
## Enhanced usage
|
|
50
50
|
|
|
51
|
-
Call `
|
|
51
|
+
Call `thebase.mount(element)` or rely on `thebase.mountAll()` after the script loads.
|
|
52
52
|
|
|
53
53
|
## Options and attributes
|
|
54
54
|
|
|
@@ -56,7 +56,7 @@ See `dist/baseui.registry.json` for the supported attribute list.
|
|
|
56
56
|
|
|
57
57
|
## Methods
|
|
58
58
|
|
|
59
|
-
Use the global runtime methods: `
|
|
59
|
+
Use the global runtime methods: `thebase.mount()`, `thebase.mountAll()`, and `thebase.destroy()`.
|
|
60
60
|
|
|
61
61
|
## Events
|
|
62
62
|
|
|
@@ -80,4 +80,4 @@ BaseUI targets modern evergreen browsers that support ES modules, CSS variables,
|
|
|
80
80
|
|
|
81
81
|
## Test checklist
|
|
82
82
|
|
|
83
|
-
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `
|
|
83
|
+
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `thebase.destroy()`.
|
|
@@ -74,7 +74,7 @@ See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for
|
|
|
74
74
|
|
|
75
75
|
## Enhanced usage
|
|
76
76
|
|
|
77
|
-
Call `
|
|
77
|
+
Call `thebase.mount(element)` or rely on `thebase.mountAll()` after the script loads.
|
|
78
78
|
|
|
79
79
|
## Options and attributes
|
|
80
80
|
|
|
@@ -82,7 +82,7 @@ See `dist/baseui.registry.json` for the supported attribute list.
|
|
|
82
82
|
|
|
83
83
|
## Methods
|
|
84
84
|
|
|
85
|
-
Use the global runtime methods: `
|
|
85
|
+
Use the global runtime methods: `thebase.mount()`, `thebase.mountAll()`, and `thebase.destroy()`.
|
|
86
86
|
|
|
87
87
|
## Events
|
|
88
88
|
|
|
@@ -154,4 +154,4 @@ BaseUI targets modern evergreen browsers that support ES modules, CSS variables,
|
|
|
154
154
|
|
|
155
155
|
## Test checklist
|
|
156
156
|
|
|
157
|
-
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `
|
|
157
|
+
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `thebase.destroy()`.
|
|
@@ -36,7 +36,7 @@ See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for
|
|
|
36
36
|
|
|
37
37
|
## Enhanced usage
|
|
38
38
|
|
|
39
|
-
Call `
|
|
39
|
+
Call `thebase.mount(element)` or rely on `thebase.mountAll()` after the script loads.
|
|
40
40
|
|
|
41
41
|
## Options and attributes
|
|
42
42
|
|
|
@@ -44,7 +44,7 @@ See `dist/baseui.registry.json` for the supported attribute list.
|
|
|
44
44
|
|
|
45
45
|
## Methods
|
|
46
46
|
|
|
47
|
-
Use the global runtime methods: `
|
|
47
|
+
Use the global runtime methods: `thebase.mount()`, `thebase.mountAll()`, and `thebase.destroy()`.
|
|
48
48
|
|
|
49
49
|
## Events
|
|
50
50
|
|
|
@@ -68,4 +68,4 @@ BaseUI targets modern evergreen browsers that support ES modules, CSS variables,
|
|
|
68
68
|
|
|
69
69
|
## Test checklist
|
|
70
70
|
|
|
71
|
-
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `
|
|
71
|
+
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `thebase.destroy()`.
|
package/docs/components/icon.md
CHANGED
|
@@ -46,8 +46,8 @@ For install patterns, accessibility guidance, self-hosting, and JavaScript examp
|
|
|
46
46
|
## JavaScript API
|
|
47
47
|
|
|
48
48
|
```js
|
|
49
|
-
|
|
50
|
-
|
|
49
|
+
thebase.icons.lucide.url("panel-left");
|
|
50
|
+
thebase.icons.lucide.render(document.querySelector("#icon"), "check", { size: "18px" });
|
|
51
51
|
```
|
|
52
52
|
|
|
53
53
|
By default, icon URLs point to `https://cdn.jsdelivr.net/npm/lucide-static@1.31.0/icons`. The build also publishes every SVG under `dist/icons/lucide/` plus a generated `dist/icons/lucide.json` manifest for self-hosted CDN deployments.
|
|
@@ -36,7 +36,7 @@ See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for
|
|
|
36
36
|
|
|
37
37
|
## Enhanced usage
|
|
38
38
|
|
|
39
|
-
Call `
|
|
39
|
+
Call `thebase.mount(element)` or rely on `thebase.mountAll()` after the script loads.
|
|
40
40
|
|
|
41
41
|
## Options and attributes
|
|
42
42
|
|
|
@@ -44,7 +44,7 @@ See `dist/baseui.registry.json` for the supported attribute list.
|
|
|
44
44
|
|
|
45
45
|
## Methods
|
|
46
46
|
|
|
47
|
-
Use the global runtime methods: `
|
|
47
|
+
Use the global runtime methods: `thebase.mount()`, `thebase.mountAll()`, and `thebase.destroy()`.
|
|
48
48
|
|
|
49
49
|
## Events
|
|
50
50
|
|
|
@@ -68,4 +68,4 @@ BaseUI targets modern evergreen browsers that support ES modules, CSS variables,
|
|
|
68
68
|
|
|
69
69
|
## Test checklist
|
|
70
70
|
|
|
71
|
-
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `
|
|
71
|
+
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `thebase.destroy()`.
|
package/docs/components/input.md
CHANGED
|
@@ -49,11 +49,11 @@ Load `baseui.min.css` and `baseui.min.js`.
|
|
|
49
49
|
|
|
50
50
|
## Enhanced usage
|
|
51
51
|
|
|
52
|
-
Input is a static component. It can be mounted by `
|
|
52
|
+
Input is a static component. It can be mounted by `thebase.mountAll()` with no extra JavaScript.
|
|
53
53
|
|
|
54
54
|
## Methods
|
|
55
55
|
|
|
56
|
-
Use the global runtime methods: `
|
|
56
|
+
Use the global runtime methods: `thebase.mount()`, `thebase.mountAll()`, and `thebase.destroy()`.
|
|
57
57
|
|
|
58
58
|
## Events
|
|
59
59
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Markdown
|
|
2
2
|
|
|
3
|
-
Use `b-ui="markdown"` (or the pure Owl `Markdown` component) to render Markdown or mount an editable Markdown document. Read-only parsing uses the vendored `src/runtime/marked/marked.min.js` (marked v15). Fenced ` ```mermaid ` code blocks render as inline SVG via `src/runtime/mermaid/mermaid.esm.min.mjs`. Fenced ` ```base-ui ` code blocks render as a live BaseUI preview through the page's global static runtime (`window.
|
|
3
|
+
Use `b-ui="markdown"` (or the pure Owl `Markdown` component) to render Markdown or mount an editable Markdown document. Read-only parsing uses the vendored `src/runtime/marked/marked.min.js` (marked v15). Fenced ` ```mermaid ` code blocks render as inline SVG via `src/runtime/mermaid/mermaid.esm.min.mjs`. Fenced ` ```base-ui ` code blocks render as a live BaseUI preview through the page's global static runtime (`window.thebase`, e.g. `dist/baseui.min.js`).
|
|
4
4
|
|
|
5
5
|
Editable mode lazy-loads `dist/runtime/milkdown/milkdown-editor.js`, which bundles Milkdown, Yjs, and y-webrtc only when `b-att-editable="true"` / `editable="true"` is used. The editor runtime enables CommonMark, GFM, history, clipboard, cursor, listener, indent, upload, block handle, tooltip, slash, streaming, and diff plugins. Collaborative mode uses Milkdown's Yjs-aware collab undo/redo instead of the plain history stack.
|
|
6
6
|
|
|
@@ -118,4 +118,4 @@ See `dist/baseui.registry.json` for the full attribute list.
|
|
|
118
118
|
|
|
119
119
|
## Methods
|
|
120
120
|
|
|
121
|
-
Use the global runtime methods: `
|
|
121
|
+
Use the global runtime methods: `thebase.mount()`, `thebase.mountAll()`, and `thebase.destroy()`.
|
|
@@ -58,7 +58,7 @@ See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for
|
|
|
58
58
|
|
|
59
59
|
## Enhanced usage
|
|
60
60
|
|
|
61
|
-
Call `
|
|
61
|
+
Call `thebase.mount(element)` or rely on `thebase.mountAll()` after the script loads.
|
|
62
62
|
|
|
63
63
|
## Options and attributes
|
|
64
64
|
|
|
@@ -66,7 +66,7 @@ See `dist/baseui.registry.json` for the supported attribute list.
|
|
|
66
66
|
|
|
67
67
|
## Methods
|
|
68
68
|
|
|
69
|
-
Use the global runtime methods: `
|
|
69
|
+
Use the global runtime methods: `thebase.mount()`, `thebase.mountAll()`, and `thebase.destroy()`.
|
|
70
70
|
|
|
71
71
|
## Events
|
|
72
72
|
|
|
@@ -90,4 +90,4 @@ BaseUI targets modern evergreen browsers that support ES modules, CSS variables,
|
|
|
90
90
|
|
|
91
91
|
## Test checklist
|
|
92
92
|
|
|
93
|
-
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `
|
|
93
|
+
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `thebase.destroy()`.
|
|
@@ -51,7 +51,7 @@ See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for
|
|
|
51
51
|
|
|
52
52
|
## Enhanced usage
|
|
53
53
|
|
|
54
|
-
Call `
|
|
54
|
+
Call `thebase.mount(element)` or rely on `thebase.mountAll()` after the script loads.
|
|
55
55
|
|
|
56
56
|
## Options and attributes
|
|
57
57
|
|
|
@@ -59,7 +59,7 @@ See `dist/baseui.registry.json` for the supported attribute list.
|
|
|
59
59
|
|
|
60
60
|
## Methods
|
|
61
61
|
|
|
62
|
-
Use the global runtime methods: `
|
|
62
|
+
Use the global runtime methods: `thebase.mount()`, `thebase.mountAll()`, and `thebase.destroy()`.
|
|
63
63
|
|
|
64
64
|
## Events
|
|
65
65
|
|
|
@@ -83,4 +83,4 @@ BaseUI targets modern evergreen browsers that support ES modules, CSS variables,
|
|
|
83
83
|
|
|
84
84
|
## Test checklist
|
|
85
85
|
|
|
86
|
-
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `
|
|
86
|
+
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `thebase.destroy()`.
|
|
@@ -53,7 +53,7 @@ The static adapter reads `[b-popover-content]` once at mount time as the popover
|
|
|
53
53
|
|
|
54
54
|
## Enhanced usage
|
|
55
55
|
|
|
56
|
-
Call `
|
|
56
|
+
Call `thebase.mount(element)` or rely on `thebase.mountAll()` after the script loads.
|
|
57
57
|
|
|
58
58
|
## Options and attributes
|
|
59
59
|
|
|
@@ -61,7 +61,7 @@ See `dist/baseui.registry.json` for the supported attribute list.
|
|
|
61
61
|
|
|
62
62
|
## Methods
|
|
63
63
|
|
|
64
|
-
Use the global runtime methods: `
|
|
64
|
+
Use the global runtime methods: `thebase.mount()`, `thebase.mountAll()`, and `thebase.destroy()`.
|
|
65
65
|
|
|
66
66
|
## Events
|
|
67
67
|
|
|
@@ -85,4 +85,4 @@ BaseUI targets modern evergreen browsers that support ES modules, CSS variables,
|
|
|
85
85
|
|
|
86
86
|
## Test checklist
|
|
87
87
|
|
|
88
|
-
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `
|
|
88
|
+
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `thebase.destroy()`.
|
|
@@ -93,7 +93,7 @@ See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for
|
|
|
93
93
|
|
|
94
94
|
## Enhanced usage
|
|
95
95
|
|
|
96
|
-
Call `
|
|
96
|
+
Call `thebase.mount(element)` or rely on `thebase.mountAll()` after the script loads.
|
|
97
97
|
|
|
98
98
|
## Options and attributes
|
|
99
99
|
|
|
@@ -101,7 +101,7 @@ See `dist/baseui.registry.json` for the supported attribute list.
|
|
|
101
101
|
|
|
102
102
|
## Methods
|
|
103
103
|
|
|
104
|
-
Use the global runtime methods: `
|
|
104
|
+
Use the global runtime methods: `thebase.mount()`, `thebase.mountAll()`, and `thebase.destroy()`.
|
|
105
105
|
|
|
106
106
|
## Events
|
|
107
107
|
|
|
@@ -125,4 +125,4 @@ BaseUI targets modern evergreen browsers that support ES modules, CSS variables,
|
|
|
125
125
|
|
|
126
126
|
## Test checklist
|
|
127
127
|
|
|
128
|
-
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `
|
|
128
|
+
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `thebase.destroy()`.
|
|
@@ -49,7 +49,7 @@ See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for
|
|
|
49
49
|
|
|
50
50
|
## Enhanced usage
|
|
51
51
|
|
|
52
|
-
Call `
|
|
52
|
+
Call `thebase.mount(element)` or rely on `thebase.mountAll()` after the script loads.
|
|
53
53
|
|
|
54
54
|
## Options and attributes
|
|
55
55
|
|
|
@@ -57,7 +57,7 @@ See `dist/baseui.registry.json` for the supported attribute list.
|
|
|
57
57
|
|
|
58
58
|
## Methods
|
|
59
59
|
|
|
60
|
-
Use the global runtime methods: `
|
|
60
|
+
Use the global runtime methods: `thebase.mount()`, `thebase.mountAll()`, and `thebase.destroy()`.
|
|
61
61
|
|
|
62
62
|
## Events
|
|
63
63
|
|
|
@@ -81,4 +81,4 @@ BaseUI targets modern evergreen browsers that support ES modules, CSS variables,
|
|
|
81
81
|
|
|
82
82
|
## Test checklist
|
|
83
83
|
|
|
84
|
-
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `
|
|
84
|
+
Verify light and dark themes, keyboard access for focusable controls, disabled or readonly states when applicable, and cleanup through `thebase.destroy()`.
|