@thebase/ui 1.1.3 → 1.1.4

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 (94) hide show
  1. package/CHANGELOG.md +18 -18
  2. package/README.md +20 -20
  3. package/bin/create-baseui-app.mjs +7 -7
  4. package/dist/baseui.apidoc.esm.js +935 -0
  5. package/dist/baseui.apidoc.min.js +936 -0
  6. package/dist/baseui.esm.js +1 -1
  7. package/dist/baseui.min.js +1 -1
  8. package/dist/baseui.registry.json +3 -3
  9. package/dist/baseui.templates.xml +1 -1
  10. package/dist/types/apidoc.d.ts +27 -0
  11. package/docs/analytics.md +3 -3
  12. package/docs/blocks.md +5 -5
  13. package/docs/components/accordion.md +3 -3
  14. package/docs/components/alert-dialog.md +2 -2
  15. package/docs/components/alert.md +2 -2
  16. package/docs/components/apidoc.md +17 -4
  17. package/docs/components/aspect-ratio.md +2 -2
  18. package/docs/components/attachment.md +3 -3
  19. package/docs/components/avatar.md +5 -5
  20. package/docs/components/badge.md +2 -2
  21. package/docs/components/block-viewer.md +4 -4
  22. package/docs/components/breadcrumb.md +3 -3
  23. package/docs/components/bubble.md +2 -2
  24. package/docs/components/button-group.md +2 -2
  25. package/docs/components/button.md +2 -2
  26. package/docs/components/calendar.md +5 -5
  27. package/docs/components/card.md +2 -2
  28. package/docs/components/carousel.md +5 -5
  29. package/docs/components/chart.md +5 -5
  30. package/docs/components/checkbox.md +2 -2
  31. package/docs/components/clipboard-button.md +2 -2
  32. package/docs/components/collapsible.md +2 -2
  33. package/docs/components/combobox.md +5 -5
  34. package/docs/components/command.md +5 -5
  35. package/docs/components/context-menu.md +5 -5
  36. package/docs/components/data-table.md +6 -6
  37. package/docs/components/date-picker.md +5 -5
  38. package/docs/components/dialog.md +4 -4
  39. package/docs/components/direction.md +2 -2
  40. package/docs/components/drawer.md +3 -3
  41. package/docs/components/dropdown-menu.md +3 -3
  42. package/docs/components/empty.md +3 -3
  43. package/docs/components/field.md +1 -1
  44. package/docs/components/form.md +3 -3
  45. package/docs/components/hover-card.md +2 -2
  46. package/docs/components/icon.md +3 -3
  47. package/docs/components/input-group.md +2 -2
  48. package/docs/components/input-otp.md +5 -5
  49. package/docs/components/input.md +5 -5
  50. package/docs/components/item.md +2 -2
  51. package/docs/components/kbd.md +2 -2
  52. package/docs/components/label.md +2 -2
  53. package/docs/components/markdown.md +3 -3
  54. package/docs/components/marker.md +2 -2
  55. package/docs/components/menubar.md +2 -2
  56. package/docs/components/message-scroller.md +5 -5
  57. package/docs/components/message.md +5 -5
  58. package/docs/components/native-select.md +2 -2
  59. package/docs/components/navigation-menu.md +3 -3
  60. package/docs/components/pagination.md +3 -3
  61. package/docs/components/popover.md +7 -7
  62. package/docs/components/progress.md +2 -2
  63. package/docs/components/pwa.md +2 -2
  64. package/docs/components/questionnaire.md +5 -5
  65. package/docs/components/radio-group.md +2 -2
  66. package/docs/components/resizable.md +5 -5
  67. package/docs/components/scroll-area.md +5 -5
  68. package/docs/components/select.md +2 -2
  69. package/docs/components/separator.md +2 -2
  70. package/docs/components/sheet.md +3 -3
  71. package/docs/components/shell.md +2 -2
  72. package/docs/components/sidebar.md +2 -2
  73. package/docs/components/skeleton.md +2 -2
  74. package/docs/components/slider.md +2 -2
  75. package/docs/components/spinner.md +3 -3
  76. package/docs/components/switch.md +2 -2
  77. package/docs/components/table.md +2 -2
  78. package/docs/components/tabs.md +4 -4
  79. package/docs/components/text-editor.md +2 -2
  80. package/docs/components/textarea.md +3 -3
  81. package/docs/components/theme-button.md +4 -4
  82. package/docs/components/toast.md +3 -3
  83. package/docs/components/toggle-group.md +5 -5
  84. package/docs/components/toggle.md +5 -5
  85. package/docs/components/tooltip.md +7 -7
  86. package/docs/components/typography.md +3 -3
  87. package/docs/icons.md +7 -7
  88. package/docs/installation.md +12 -11
  89. package/docs/owl-components.md +16 -16
  90. package/docs/registry.md +8 -8
  91. package/docs/runtime-api.md +3 -3
  92. package/docs/theming.md +4 -4
  93. package/docs/usage-guide.md +21 -21
  94. package/package.json +8 -1
@@ -1699,10 +1699,10 @@
1699
1699
  "integrity": {
1700
1700
  "baseui.min.css": "sha384-RP2d04etuqh6nmVNHdJFYqK79B7N55jITUg52YrEXI3lyla5kJA4AHa2hUq79v0m",
1701
1701
  "bootstrap.bundle.min.js": "sha384-RMbllTJcplkCRnELNTOc5Kz/3AvFDE/rNlJqWqfgmRWruobClBdfwvl10akQZkR1",
1702
- "baseui.min.js": "sha384-3kwM3Q4HqvaVSHDfkmmIFzU9nr7VfuMAqeNpacnv8iWs2k8FAvCg3vW+j18Uoq4Y",
1703
- "baseui.esm.js": "sha384-Kg7yHA4YxH2uOdvcC4sWN5SrLfMLT09TGKzE6+WldH1rveQTfE3okF7YZPYX1TY0",
1702
+ "baseui.min.js": "sha384-6WmmDQaq2vveoleqTuVjap7gNc/1I9cKo+GmkXdLpgKwap8gwo8P5Yw80YWT+Cuj",
1703
+ "baseui.esm.js": "sha384-9haHF/FrXo5MXP2GQGK33GkmwAXQAde21ogM5mvCuWyOHwhyEwSw8isxrzgaHrs7",
1704
1704
  "baseui.icons.esm.js": "sha384-hj39VMhzcFvmYnjob2hlioMOAqwAXCURGreF6s9RitXFp/iYi7rUdqtfCI+ICQeS",
1705
- "baseui.templates.xml": "sha384-A1BT9HyTN/3AyKq21IwbLUfMWcvMRoESKDoDOzOcEWEEapHVc/7rBBHygOUWpree",
1705
+ "baseui.templates.xml": "sha384-4pEOfbxiBDpMq0vJHvl9+ZFNcnTDhvZGdTZcmCFOELE0vXQrateo0qlO8VeuoKdq",
1706
1706
  "baseui.block-viewer.esm.js": "sha384-6GNPYUTwsoi1ZsfOWhVWqw4vI328WX6Xb5f7A4HygyT5s+fmJaEbL7ZQmPamoyJz",
1707
1707
  "baseui.analytics.esm.js": "sha384-M6TVmchmceTvpSzgI+DNA6zAn9xmz9a+YEexCLslSo/Ngxyp2kmzs9fm+PxWy+Da",
1708
1708
  "baseui.analytics.min.js": "sha384-B0hBkVDbT7gmDmUMazlN4Nc1KnYGSpL+IcW2hd8840knx73HGImPgGs84MvS3hKE",
@@ -731,7 +731,7 @@
731
731
  <section t-att-class="state.mode === 'code' ? 'bu-block-code-panel is-active' : 'bu-block-code-panel'">
732
732
  <div class="bu-block-code-toolbar" role="group" aria-label="Code source">
733
733
  <Button variant="'ghost'" type="'button'" ariaPressed="state.codeVariant === 'owl' ? 'true' : 'false'" onClick="() => this.setCodeVariant('owl')">
734
- Pure Owl Component
734
+ Base Component
735
735
  </Button>
736
736
  <Button variant="'ghost'" type="'button'" ariaPressed="state.codeVariant === 'template' ? 'true' : 'false'" onClick="() => this.setCodeVariant('template')">
737
737
  Template
@@ -0,0 +1,27 @@
1
+ /** Standalone ApiDoc: renders an OpenAPI 3.x document. Load dist/baseui.min.css for styling. */
2
+ export interface ApiDocProps {
3
+ src?: string;
4
+ spec?: object;
5
+ title?: string;
6
+ serverUrl?: string;
7
+ theme?: "light" | "dark" | "auto";
8
+ themeToggle?: boolean;
9
+ hash?: boolean;
10
+ operation?: string;
11
+ tryIt?: boolean;
12
+ authorize?: boolean;
13
+ languages?: string[];
14
+ language?: string;
15
+ assetBase?: string;
16
+ oauthRedirectUri?: string;
17
+ height?: string;
18
+ className?: string;
19
+ style?: string | Record<string, string>;
20
+ onLoad?(doc: unknown): void;
21
+ onError?(error: unknown): void;
22
+ onNavigate?(id: string): void;
23
+ }
24
+ export interface ApiDocApp { destroy(): void }
25
+ export const ApiDoc: unknown;
26
+ /** Mounts ApiDoc into an element (or selector) and returns the application. */
27
+ export function mountApiDoc(target: Element | string, props?: ApiDocProps): Promise<ApiDocApp> | ApiDocApp;
package/docs/analytics.md CHANGED
@@ -1,8 +1,8 @@
1
1
  # Analytics
2
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.
3
+ The Base UI 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
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):
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 the Base UI (~5.6 KB minified):
6
6
 
7
7
  ```js
8
8
  // npm / bundler
@@ -228,7 +228,7 @@ curl -i -X POST http://localhost:8080/api/event -H 'Content-Type: text/plain' \
228
228
 
229
229
  [`examples/analytics/`](../examples/analytics/dashboard/?backend=http://localhost:8080) contains a working dashboard plus two complete sample backends: [`server-go`](../examples/analytics/server-go/main.go) (Fiber v3) and [`server-fastapi`](../examples/analytics/server-fastapi/main.py). Each one extends the receivers above with an in-memory store, a daily-salted cookieless visitor hash, a `GET /api/stats` endpoint, and static hosting for the dashboard.
230
230
 
231
- The dashboard ([`dashboard/`](../examples/analytics/dashboard/?backend=http://localhost:8080)) is a pure Owl app that loads `@thebase/ui@1.1.3` from jsDelivr: KPI `Card`s, an area `Chart`, top pages/sources/events `Table`s, site and period `NativeSelect`s, and a `ThemeButton`. It refreshes every 30 s and tracks its own visits through `@thebase/ui/analytics`, so a fresh backend has data straight away.
231
+ The dashboard ([`dashboard/`](../examples/analytics/dashboard/?backend=http://localhost:8080)) is a pure application that loads `@thebase/ui@1.1.3` from jsDelivr: KPI `Card`s, an area `Chart`, top pages/sources/events `Table`s, site and period `NativeSelect`s, and a `ThemeButton`. It refreshes every 30 s and tracks its own visits through `@thebase/ui/analytics`, so a fresh backend has data straight away.
232
232
 
233
233
  ```sh
234
234
  # Go (1.25+)
package/docs/blocks.md CHANGED
@@ -1,19 +1,19 @@
1
1
  # Blocks
2
2
 
3
- BaseUI blocks are static HTML compositions styled by the same shadcn-aligned tokens as the component library. They are based on the public shadcn/ui blocks page and keep the same sizing landmarks: `min-height: 100svh`, sidebar widths, header heights, `gap-4`/`gap-6`, muted backgrounds, and auth-card widths.
3
+ The Base UI blocks are static HTML compositions styled by the same shadcn-aligned tokens as the component library. They are based on the public shadcn/ui blocks page and keep the same sizing landmarks: `min-height: 100svh`, sidebar widths, header heights, `gap-4`/`gap-6`, muted backgrounds, and auth-card widths.
4
4
 
5
5
  Each block has its own source stylesheet in `examples/blocks/<block-name>.css`. Shared helpers live in `examples/blocks/shared.css`; new blocks should not be folded into an all-in-one block stylesheet.
6
6
 
7
- Block navigation icons must use BaseUI's built-in Lucide icon component, for example `<span b-icon="layout-dashboard" b-block-icon></span>`. Do not use placeholder letters inside `b-block-icon`.
7
+ Block navigation icons must use the Base UI's built-in Lucide icon component, for example `<span b-icon="layout-dashboard" b-block-icon></span>`. Do not use placeholder letters inside `b-block-icon`.
8
8
 
9
- Blocks are not standalone runtime components. Paste the markup and load the normal BaseUI assets:
9
+ Blocks are not standalone runtime components. Paste the markup and load the normal the Base UI assets:
10
10
 
11
11
  ```html
12
12
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@thebase/ui@latest/dist/baseui.min.css">
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. `@1.1.3`, 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).
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.3`, 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 application and you'd rather compose the equivalent layout from [Base Components](owl-components.md).
17
17
 
18
18
  Use `b-block` to select the block style:
19
19
 
@@ -30,7 +30,7 @@ The docs/dev server serves the block gallery at `/blocks` through the shared `ex
30
30
 
31
31
  ## Included Blocks
32
32
 
33
- - `apidoc-01`: full-page API reference built from an OpenAPI 3 file with the pure Owl `ApiDoc` component (sidebar, schemas, Try It, Authorize); see [ApiDoc](components/apidoc.md).
33
+ - `apidoc-01`: full-page API reference built from an OpenAPI 3 file with the pure Base `ApiDoc` component (sidebar, schemas, Try It, Authorize); see [ApiDoc](components/apidoc.md).
34
34
  - `chart-01`: copyable usage block showing how to compose `b-ui="chart"` with chart slots, SVG primitives, tokens, and footer copy.
35
35
  - `dashboard-01`: dashboard shell with inset sidebar, header, metric cards, chart surface, and table area.
36
36
  - `sidebar-01` through `sidebar-16`: static conversions of the current shadcn/ui sidebar block family, including documentation sidebars, collapsible groups, inset navigation, mail, workspace, file explorer, calendar, dialog, right TOC, dual-sidebar, and sticky-header variants.
@@ -2,7 +2,7 @@
2
2
 
3
3
  Use `b-ui="accordion"` for grouped disclosure panels.
4
4
 
5
- ## Pure Owl component
5
+ ## Base component
6
6
 
7
7
  ```js
8
8
  import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "@thebase/ui";
@@ -37,7 +37,7 @@ import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "@t
37
37
  | `AccordionItem` | `className` | `String` | optional |
38
38
  | `AccordionTrigger` | `className` | `String` | optional |
39
39
 
40
- See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
40
+ See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
41
41
 
42
42
  ## Static component
43
43
 
@@ -67,6 +67,6 @@ See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for
67
67
  </div>
68
68
  ```
69
69
 
70
- Options: `b-att-multiple="true"` allows more than one item to stay open. Events: `baseui:change`. Keyboard: buttons use native activation and focus behavior. The static adapter only wires ARIA/toggle behavior onto author-provided markup — add your own trailing chevron icon (`b-icon="chevron-down" class="bu-accordion-trigger-icon"`) inside the trigger for the rotating-chevron look the pure Owl `AccordionTrigger` renders automatically, and set `b-att-state="open"` on an item to have it expanded by default.
70
+ Options: `b-att-multiple="true"` allows more than one item to stay open. Events: `baseui:change`. Keyboard: buttons use native activation and focus behavior. The static adapter only wires ARIA/toggle behavior onto author-provided markup — add your own trailing chevron icon (`b-icon="chevron-down" class="bu-accordion-trigger-icon"`) inside the trigger for the rotating-chevron look the pure Base `AccordionTrigger` renders automatically, and set `b-att-state="open"` on an item to have it expanded by default.
71
71
 
72
72
  Each panel (`b-accordion-panel` / `AccordionContent`'s root) is driven by its own live `bootstrap.Collapse` instance: it always carries the Bootstrap `collapse` class (plus `show` while open), and Bootstrap itself manages the `collapsing`/height transition and the `show` class across toggles — don't rely on `hidden`/node removal to detect open state. In single-open mode (the default, without `multiple`), opening one item hides every other open item's own `bootstrap.Collapse` instance before showing the clicked item's.
@@ -1,6 +1,6 @@
1
1
  # Alert Dialog
2
2
 
3
- ## Pure Owl component
3
+ ## Base component
4
4
 
5
5
  ```js
6
6
  import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogTitle, AlertDialogTrigger, Icon } from "@thebase/ui";
@@ -41,7 +41,7 @@ import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent,
41
41
  | `AlertDialogTitle` | `className` | `String` | optional |
42
42
  | `AlertDialogTrigger` | `className` | `String` | optional |
43
43
 
44
- See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
44
+ See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
45
45
 
46
46
  ## Static component
47
47
 
@@ -1,6 +1,6 @@
1
1
  # Alert
2
2
 
3
- ## Pure Owl component
3
+ ## Base component
4
4
 
5
5
  ```js
6
6
  import { Alert, AlertAction, AlertDescription, AlertTitle, Button, Icon } from "@thebase/ui";
@@ -30,7 +30,7 @@ import { Alert, AlertAction, AlertDescription, AlertTitle, Button, Icon } from "
30
30
  | `AlertDescription` | `className` | `String` | optional |
31
31
  | `AlertAction` | `className` | `String` | optional |
32
32
 
33
- See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
33
+ See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
34
34
 
35
35
  ## Static component
36
36
 
@@ -1,12 +1,12 @@
1
1
  # ApiDoc
2
2
 
3
- Use `b-ui="apidoc"` (or the pure Owl `ApiDoc` component) to render an **OpenAPI 3.0+ JSON** document as browsable API documentation: a grouped sidebar, per-operation parameters / request body / responses / callbacks, a **Try It** panel with request code samples in 17 languages, and an **Authorize** dialog (API key, HTTP basic, bearer, OpenID Connect token, OAuth2 implicit / authorization-code / password / client-credentials).
3
+ Use `b-ui="apidoc"` (or the pure Base `ApiDoc` component) to render an **OpenAPI 3.0+ JSON** document as browsable API documentation: a grouped sidebar, per-operation parameters / request body / responses / callbacks, a **Try It** panel with request code samples in 17 languages, and an **Authorize** dialog (API key, HTTP basic, bearer, OpenID Connect token, OAuth2 implicit / authorization-code / password / client-credentials).
4
4
 
5
5
  Swagger 2.0 documents still render, but OpenAPI 3.x is the supported input: `requestBody`, `components.securitySchemes` (`http`, `apiKey`, `oauth2` `flows`, `openIdConnect`, `mutualTLS`), `servers` with variables, `webhooks`, `callbacks`, `links`, tag `parent`/`kind`, and `$ref` to components are all understood.
6
6
 
7
7
  Markdown in `info.description`, tag and operation descriptions is rendered with the [Markdown](markdown.md) component (fenced ` ```mermaid ` blocks become diagrams). The spec is trusted content — descriptions are rendered as Markdown/HTML, so do not point ApiDoc at a spec you do not control.
8
8
 
9
- ## Pure Owl component
9
+ ## Base component
10
10
 
11
11
  ```js
12
12
  import { ApiDoc } from "@base/component";
@@ -22,13 +22,26 @@ Pass an already-parsed document with `spec` instead of `src`:
22
22
  <ApiDoc spec="state.spec" serverUrl="'https://api.example.com'" tryIt="false"/>
23
23
  ```
24
24
 
25
+ ## Standalone (`@thebase/ui/apidoc`)
26
+
27
+ Like the analytics service, ApiDoc also ships as its own bundle that needs neither the full the Base UI script nor a templates file (Owl and ApiDoc's templates are embedded). Load `baseui.min.css` for styling.
28
+
29
+ ```js
30
+ import { mountApiDoc } from "@thebase/ui/apidoc";
31
+
32
+ const app = await mountApiDoc("#docs", { src: "/openapi.json", hash: true, assetBase: "/node_modules/@thebase/ui/dist/apidoc" });
33
+ // app.destroy() removes it
34
+ ```
35
+
36
+ `mountApiDoc(target, props)` takes an element or selector plus the props below. Without a bundler, import `dist/baseui.apidoc.esm.js` from a CDN, or load `dist/baseui.apidoc.min.js`, which sets `window.thebase.apidoc.mountApiDoc`.
37
+
25
38
  ## Static component
26
39
 
27
40
  ```html
28
41
  <div b-ui="apidoc" b-att-src="/openapi.json" b-att-height="100vh" b-att-hash="true"></div>
29
42
  ```
30
43
 
31
- The static adapter fetches `baseui.templates.xml` from the folder the BaseUI script was loaded from; set `b-att-templates` to override.
44
+ The static adapter fetches `baseui.templates.xml` from the folder the Base UI script was loaded from; set `b-att-templates` to override.
32
45
 
33
46
  ## Props / attributes
34
47
 
@@ -46,7 +59,7 @@ The static adapter fetches `baseui.templates.xml` from the folder the BaseUI scr
46
59
  | `authorize` | `b-att-authorize` | `true` | Show the Authorize button when the spec defines security schemes. |
47
60
  | `languages` | `b-att-languages` | all 17 | Which code-sample languages to offer, e.g. `['curl', 'node', 'python']` / `curl,node,python`. |
48
61
  | `language` | `b-att-language` | `curl` | Language selected first. |
49
- | `assetBase` | `b-att-asset-base` | `dist/apidoc` beside the BaseUI script | Folder that holds `img/*.svg` language logos. Empty string hides the logos. |
62
+ | `assetBase` | `b-att-asset-base` | `dist/apidoc` beside the Base UI script | Folder that holds `img/*.svg` language logos. Empty string hides the logos. |
50
63
  | `oauthRedirectUri` | `b-att-oauth-redirect-uri` | `oauth2-redirect.html` next to the page | Popup landing page for the implicit / authorization-code flows (see `src/components/apidoc/oauth2-redirect.html`). |
51
64
  | `height` | `b-att-height` | `100vh` | CSS height of the component. |
52
65
  | `className`, `style` | — | — | Standard root class / inline style. |
@@ -1,6 +1,6 @@
1
1
  # Aspect Ratio
2
2
 
3
- ## Pure Owl component
3
+ ## Base component
4
4
 
5
5
  ```js
6
6
  import { AspectRatio } from "@thebase/ui";
@@ -21,7 +21,7 @@ import { AspectRatio } from "@thebase/ui";
21
21
  | `AspectRatio` | `height` | `Number` | optional |
22
22
  | `AspectRatio` | `className` | `String` | optional |
23
23
 
24
- See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
24
+ See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
25
25
 
26
26
  ## Static component
27
27
 
@@ -4,9 +4,9 @@ Use `b-ui="attachment"` for a CDN-ready attachment card with media, metadata, up
4
4
 
5
5
  ## CDN install requirements
6
6
 
7
- Load the pinned BaseUI CSS and JavaScript files; no extra dependency is required for this component.
7
+ Load the pinned the Base UI CSS and JavaScript files; no extra dependency is required for this component.
8
8
 
9
- ## Pure Owl component
9
+ ## Base component
10
10
 
11
11
  ```js
12
12
  import {
@@ -121,7 +121,7 @@ import {
121
121
  | `AttachmentDropzone` | `disabled` | `Boolean` | disables click/drag/drop |
122
122
  | `AttachmentDropzone` | `onFilesSelected` | `Function` | receives the picked/dropped `File[]` |
123
123
 
124
- See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
124
+ See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
125
125
 
126
126
  ## Static component
127
127
 
@@ -4,9 +4,9 @@ Use `b-ui="avatar"` for a CDN-ready avatar component.
4
4
 
5
5
  ## CDN install requirements
6
6
 
7
- Load the pinned BaseUI CSS and JavaScript files; no extra dependency is required for this component.
7
+ Load the pinned the Base UI CSS and JavaScript files; no extra dependency is required for this component.
8
8
 
9
- ## Pure Owl component
9
+ ## Base component
10
10
 
11
11
  ```js
12
12
  import { Avatar } from "@thebase/ui";
@@ -27,7 +27,7 @@ import { Avatar } from "@thebase/ui";
27
27
  | `Avatar` | `title` | `String` | optional, native hover tooltip |
28
28
  | `Avatar` | `className` | `String` | optional |
29
29
 
30
- See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
30
+ See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
31
31
 
32
32
  ## Static component
33
33
 
@@ -53,7 +53,7 @@ Interactive components emit documented `baseui:*` events from their root element
53
53
 
54
54
  ## CSS variables
55
55
 
56
- The component inherits BaseUI semantic tokens such as `--b-surface`, `--b-border`, `--b-primary`, and `--b-radius`.
56
+ The component inherits the Base UI semantic tokens such as `--b-surface`, `--b-border`, `--b-primary`, and `--b-radius`.
57
57
 
58
58
  ## Accessibility behavior
59
59
 
@@ -65,7 +65,7 @@ See `examples/index.html` for a working CDN-style page.
65
65
 
66
66
  ## Browser support
67
67
 
68
- BaseUI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
68
+ The Base UI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
69
69
 
70
70
  ## Test checklist
71
71
 
@@ -2,7 +2,7 @@
2
2
 
3
3
  Small status label for counts, states, and metadata.
4
4
 
5
- ## Pure Owl component
5
+ ## Base component
6
6
 
7
7
  ```js
8
8
  import { Badge } from "@thebase/ui";
@@ -24,7 +24,7 @@ import { Badge } from "@thebase/ui";
24
24
  | `label` | `String` | alternative to default-slot children |
25
25
  | `className` | `String` | appended to the generated `badge ...` classes |
26
26
 
27
- See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
27
+ See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
28
28
 
29
29
  ## Static component
30
30
 
@@ -1,10 +1,10 @@
1
1
  # Block Viewer
2
2
 
3
- `BlockViewer` is the page-root component used by the BaseUI block gallery detail pages (`examples/blocks/*.html`). It reads a title/description from `document.body.dataset`, renders a sample block's markup from a `[b-block-code-template]` script tag into a live preview panel, and offers a preview/code toggle with desktop/tablet/mobile viewport switching and a "copy code" action.
3
+ `BlockViewer` is the page-root component used by the Base UI block gallery detail pages (`examples/blocks/*.html`). It reads a title/description from `document.body.dataset`, renders a sample block's markup from a `[b-block-code-template]` script tag into a live preview panel, and offers a preview/code toggle with desktop/tablet/mobile viewport switching and a "copy code" action.
4
4
 
5
5
  ## CDN install requirements
6
6
 
7
- Load the pinned BaseUI CSS and JavaScript files, plus the block-viewer adapter bundle (it is not part of `baseui.min.js`, since it pulls in the full component export surface only when a block sample needs it — but it's self-contained, no import map required):
7
+ Load the pinned the Base UI CSS and JavaScript files, plus the block-viewer adapter bundle (it is not part of `baseui.min.js`, since it pulls in the full component export surface only when a block sample needs it — but it's self-contained, no import map required):
8
8
 
9
9
  ```html
10
10
  <link rel="stylesheet" href="/dist/baseui.min.css">
@@ -12,7 +12,7 @@ Load the pinned BaseUI CSS and JavaScript files, plus the block-viewer adapter b
12
12
  <script src="/dist/baseui.min.js" defer></script>
13
13
  ```
14
14
 
15
- ## Pure Owl component
15
+ ## Base component
16
16
 
17
17
  ```js
18
18
  import { BlockViewer } from "@base/component";
@@ -37,7 +37,7 @@ import { BlockViewer } from "@base/component";
37
37
  </body>
38
38
  ```
39
39
 
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.
40
+ `thebase.mountAll()` (called automatically on `DOMContentLoaded`) mounts the `b-ui="block-viewer"` element as a full application, 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
 
@@ -2,7 +2,7 @@
2
2
 
3
3
  Displays the path to the current resource using a hierarchy of links.
4
4
 
5
- ## Pure Owl component
5
+ ## Base component
6
6
 
7
7
  ```js
8
8
  import {
@@ -48,7 +48,7 @@ import {
48
48
  | `BreadcrumbSeparator` | `className` | `String` | optional; custom children override the chevron |
49
49
  | `BreadcrumbEllipsis` | `className` | `String` | optional |
50
50
 
51
- See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
51
+ See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
52
52
 
53
53
  ## Static component
54
54
 
@@ -63,7 +63,7 @@ See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for
63
63
  </nav>
64
64
  ```
65
65
 
66
- BaseUI adds the shadcn/Nova breadcrumb classes, inserts chevron separators when none are authored, styles links and the current page, and marks the current page with `aria-current="page"`.
66
+ The Base UI adds the shadcn/Nova breadcrumb classes, inserts chevron separators when none are authored, styles links and the current page, and marks the current page with `aria-current="page"`.
67
67
 
68
68
  ## Dropdown
69
69
 
@@ -1,6 +1,6 @@
1
1
  # Bubble
2
2
 
3
- ## Pure Owl component
3
+ ## Base component
4
4
 
5
5
  ```js
6
6
  import { Bubble } from "@thebase/ui";
@@ -39,7 +39,7 @@ import { Bubble } from "@thebase/ui";
39
39
  | --- | --- | --- | --- |
40
40
  | `Bubble` | `className` | `String` | optional |
41
41
 
42
- See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
42
+ See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
43
43
 
44
44
  ## Static component
45
45
 
@@ -2,7 +2,7 @@
2
2
 
3
3
  Groups related buttons while preserving native button semantics.
4
4
 
5
- ## Pure Owl component
5
+ ## Base component
6
6
 
7
7
  ```js
8
8
  import { ButtonGroup, ButtonGroupSeparator, ButtonGroupText } from "@thebase/ui";
@@ -88,7 +88,7 @@ import { ButtonGroup, ButtonGroupSeparator, ButtonGroupText } from "@thebase/ui"
88
88
  | `ButtonGroupSeparator` | `className` | `String` | optional |
89
89
  | `ButtonGroupText` | `className` | `String` | optional |
90
90
 
91
- See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
91
+ See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
92
92
 
93
93
  ## Static component
94
94
 
@@ -2,7 +2,7 @@
2
2
 
3
3
  Use `b-ui="button"` on a native button or link.
4
4
 
5
- ## Pure Owl component
5
+ ## Base component
6
6
 
7
7
  ```js
8
8
  import { Button } from "@thebase/ui";
@@ -55,7 +55,7 @@ import { Button } from "@thebase/ui";
55
55
  | `getRef` | `Function` | called with the rendered root element after mount, and with `null` on unmount |
56
56
  | `onClick` | `Function` | called with the native click event |
57
57
 
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`.
58
+ Also accepts default slot content instead of `label`. Every pure Base the Base UI 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 [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
59
59
 
60
60
  ## Static component
61
61
 
@@ -4,9 +4,9 @@ Use `b-ui="calendar"` for a CDN-ready calendar component.
4
4
 
5
5
  ## CDN install requirements
6
6
 
7
- Load the pinned BaseUI CSS and JavaScript files; no extra dependency is required for this component.
7
+ Load the pinned the Base UI CSS and JavaScript files; no extra dependency is required for this component.
8
8
 
9
- ## Pure Owl component
9
+ ## Base component
10
10
 
11
11
  ```js
12
12
  import { Calendar } from "@thebase/ui";
@@ -26,7 +26,7 @@ import { Calendar } from "@thebase/ui";
26
26
  | `Calendar` | `className` | `String` | optional |
27
27
  | `Calendar` | `onChange` | `Function` | optional |
28
28
 
29
- See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
29
+ See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
30
30
 
31
31
  ## Static component
32
32
 
@@ -52,7 +52,7 @@ Interactive components emit documented `baseui:*` events from their root element
52
52
 
53
53
  ## CSS variables
54
54
 
55
- The component inherits BaseUI semantic tokens such as `--b-surface`, `--b-border`, `--b-primary`, and `--b-radius`.
55
+ The component inherits the Base UI semantic tokens such as `--b-surface`, `--b-border`, `--b-primary`, and `--b-radius`.
56
56
 
57
57
  ## Accessibility behavior
58
58
 
@@ -64,7 +64,7 @@ See `examples/index.html` for a working CDN-style page.
64
64
 
65
65
  ## Browser support
66
66
 
67
- BaseUI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
67
+ The Base UI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
68
68
 
69
69
  ## Test checklist
70
70
 
@@ -1,6 +1,6 @@
1
1
  # Card
2
2
 
3
- ## Pure Owl component
3
+ ## Base component
4
4
 
5
5
  ```js
6
6
  import { Card, CardBody, CardDescription, CardFooter, CardHeader, CardTitle } from "@thebase/ui";
@@ -32,7 +32,7 @@ import { Card, CardBody, CardDescription, CardFooter, CardHeader, CardTitle } fr
32
32
  </div>
33
33
  ```
34
34
 
35
- `Card`, `CardHeader`, `CardBody`, `CardFooter`, `CardTitle`, and `CardDescription` each accept `className` (`String`, optional) and render their default slot as-is. `Card` additionally accepts `tag` (`String`, optional, default `"div"`) to render a different semantic root element, e.g. `tag="'aside'"` for complementary content. See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
35
+ `Card`, `CardHeader`, `CardBody`, `CardFooter`, `CardTitle`, and `CardDescription` each accept `className` (`String`, optional) and render their default slot as-is. `Card` additionally accepts `tag` (`String`, optional, default `"div"`) to render a different semantic root element, e.g. `tag="'aside'"` for complementary content. See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
36
36
 
37
37
  ## Static component
38
38
 
@@ -4,9 +4,9 @@ Use `b-ui="carousel"` for a CDN-ready carousel component.
4
4
 
5
5
  ## CDN install requirements
6
6
 
7
- Load the pinned BaseUI CSS and JavaScript files; no extra dependency is required for this component.
7
+ Load the pinned the Base UI CSS and JavaScript files; no extra dependency is required for this component.
8
8
 
9
- ## Pure Owl component
9
+ ## Base component
10
10
 
11
11
  ```js
12
12
  import { Carousel, CarouselNext, CarouselPrevious, CarouselSlide } from "@thebase/ui";
@@ -67,7 +67,7 @@ import { Carousel, CarouselNext, CarouselPrevious, CarouselSlide } from "@thebas
67
67
  | `CarouselSlide` | `index` | `Number` | required |
68
68
  | `CarouselSlide` | `className` | `String` | optional |
69
69
 
70
- See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
70
+ See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
71
71
 
72
72
  The whole group shares a single live `bootstrap.Carousel` instance, owned by the root `Carousel`/`b-ui="carousel"` element: the root always carries classes `carousel slide` and wraps its slides in a `.carousel-inner` container, each `CarouselSlide`/`b-carousel-slide` renders permanently as a `.carousel-item` (exactly one carrying `.active` at a time) — don't rely on node removal to detect the active slide. `CarouselPrevious`/`CarouselNext` (and the static `[b-carousel-prev]`/`[b-carousel-next]` buttons) call `.prev()`/`.next()` on that shared instance directly; Bootstrap's `wrap: true` handles wrap-around at both ends and `interval: false` keeps autoplay off.
73
73
 
@@ -102,7 +102,7 @@ Interactive components emit documented `baseui:*` events from their root element
102
102
 
103
103
  ## CSS variables
104
104
 
105
- The component inherits BaseUI semantic tokens such as `--b-surface`, `--b-border`, `--b-primary`, and `--b-radius`.
105
+ The component inherits the Base UI semantic tokens such as `--b-surface`, `--b-border`, `--b-primary`, and `--b-radius`.
106
106
 
107
107
  ## Accessibility behavior
108
108
 
@@ -114,7 +114,7 @@ See `examples/index.html` for a working CDN-style page.
114
114
 
115
115
  ## Browser support
116
116
 
117
- BaseUI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
117
+ The Base UI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
118
118
 
119
119
  ## Test checklist
120
120
 
@@ -4,9 +4,9 @@ Use `b-ui="chart"` for a CDN-ready chart component styled after the current shad
4
4
 
5
5
  ## CDN install requirements
6
6
 
7
- Load the pinned BaseUI CSS and JavaScript files. No extra dependency is required for static charts. If you provide a `canvas` and a global `window.Chart`, BaseUI will initialize Chart.js v3 from JSON config without bundling Chart.js into BaseUI.
7
+ Load the pinned the Base UI CSS and JavaScript files. No extra dependency is required for static charts. If you provide a `canvas` and a global `window.Chart`, the Base UI will initialize Chart.js v3 from JSON config without bundling Chart.js into the Base UI.
8
8
 
9
- ## Pure Owl component
9
+ ## Base component
10
10
 
11
11
  ```js
12
12
  import { Chart } from "@thebase/ui";
@@ -50,7 +50,7 @@ import { Chart } from "@thebase/ui";
50
50
  | `Chart` | `variant` | `String` | optional |
51
51
  | `Chart` | `className` | `String` | optional |
52
52
 
53
- See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
53
+ See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
54
54
 
55
55
  ## Static component
56
56
 
@@ -110,7 +110,7 @@ Interactive components emit documented `baseui:*` events from their root element
110
110
 
111
111
  ## CSS variables
112
112
 
113
- The component inherits BaseUI semantic tokens plus shadcn-compatible chart tokens: `--b-chart-1` through `--b-chart-5`. Area-card examples also use `--b-chart-height`, `--b-chart-grid`, `b-chart-area`, `b-chart-line`, `b-chart-axis`, `b-chart-footer`, `b-chart-trend`, and `b-chart-range`.
113
+ The component inherits the Base UI semantic tokens plus shadcn-compatible chart tokens: `--b-chart-1` through `--b-chart-5`. Area-card examples also use `--b-chart-height`, `--b-chart-grid`, `b-chart-area`, `b-chart-line`, `b-chart-axis`, `b-chart-footer`, `b-chart-trend`, and `b-chart-range`.
114
114
 
115
115
  ## Accessibility behavior
116
116
 
@@ -122,7 +122,7 @@ See `examples/index.html` for a working CDN-style page.
122
122
 
123
123
  ## Browser support
124
124
 
125
- BaseUI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
125
+ The Base UI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
126
126
 
127
127
  ## Test checklist
128
128
 
@@ -2,7 +2,7 @@
2
2
 
3
3
  Native checkbox input or label wrapper.
4
4
 
5
- ## Pure Owl component
5
+ ## Base component
6
6
 
7
7
  ```js
8
8
  import { Checkbox } from "@thebase/ui";
@@ -22,7 +22,7 @@ import { Checkbox } from "@thebase/ui";
22
22
  | `Checkbox` | `id` | `String` | optional, e.g. for `Label`'s `for` |
23
23
  | `Checkbox` | `onChange` | `Function` | optional |
24
24
 
25
- See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
25
+ See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
26
26
 
27
27
  ## Static component
28
28
 
@@ -8,7 +8,7 @@ Use `b-ui="clipboard-button"` on a native button to copy specific data to the cl
8
8
  <pre id="snippet">const x = 1;</pre>
9
9
  ```
10
10
 
11
- ## Pure Owl component
11
+ ## Base component
12
12
 
13
13
  ```js
14
14
  import { ClipboardButton } from "@thebase/ui";
@@ -35,7 +35,7 @@ import { ClipboardButton } from "@thebase/ui";
35
35
  | `onCopy` | `Function` | called with `{ value, event }` after a successful copy |
36
36
  | `onCopyError` | `Function` | called with `{ error, event }` when both the Clipboard API and the fallback fail |
37
37
 
38
- 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`.
38
+ Also accepts default slot content instead of `label`. See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
39
39
 
40
40
  ## Static component
41
41