@thebase/ui 0.0.12 → 1.0.0

package/dist/baseui.registry.json

@@ -1658,13 +1658,13 @@
     }
   ],
   "integrity": {
-    "baseui.min.css": "sha384-Ch4QycX7bzrzVYY3SYE8bMsQVlodiOu+aLfwR41PYuI+FX6VY5Ej2VrSZ/n2NvkV",
+    "baseui.min.css": "sha384-hYFwlV6T/ONYzawtDGDFUoruqgNwYl9AVvLDHx24IWgKSMXqwACo/nX04I3gnyT9",
     "bootstrap.bundle.min.js": "sha384-RMbllTJcplkCRnELNTOc5Kz/3AvFDE/rNlJqWqfgmRWruobClBdfwvl10akQZkR1",
-    "baseui.min.js": "sha384-EKZte5iBvFtHs2JRjSpR9UboGjLkAQyGgY4UN49FB2CzD6sM99NMWJT4MM3FYe9l",
-    "baseui.esm.js": "sha384-0PLgaL+pEKNqDuxI0wvf2djAw4mfReUzHjuByAdRMo/LjZpyCoBUn7bMVvFQVFWM",
-    "baseui.icons.esm.js": "sha384-psQsxRLNJYUFrDOH/UAEqVR7h0OxjqG/CixSCjolHz/fYlIMpSjCMRbShw/C2XVF",
+    "baseui.min.js": "sha384-dgJ6Mbk5+apdFpV1iU/Lnp4CQWZXgBpsUn3r7oh8DHH2rNqIqNmsHKPVub5ZEq+D",
+    "baseui.esm.js": "sha384-AP0mGX4n1avSDWoAUakm71/JAR0vvd6n2qR39RI8nssDriB8lhN4wXZijA6XfVeJ",
+    "baseui.icons.esm.js": "sha384-M30zHGB1h8ys1b2YBuLR7J3VzcYqft9L+wVI/EM1P8h8fY5Y2h1woOQzyE5DZ+lp",
     "baseui.templates.xml": "sha384-XkqmfurKcEF6WuIQHWAbnZfW6oz19n7SDVRDU3g0hc3qOr4kPd/qfNGcTmcDDIgQ",
-    "baseui.block-viewer.esm.js": "sha384-hYgkf7lao86+laVebZT9MpBGkSZCI13ERhghHbOkarkuYRBVtRZnkwAiBQBECj39",
+    "baseui.block-viewer.esm.js": "sha384-rQ7YMxLWDA+ccC/JwTcOV8DKUjZTZofqJwNX8xrKTpZbsBVRa4taXLOLpRQ6poR4",
     "icons/lucide.json": "sha384-mc5mzpmq9eOgZVa2IcjrL33Ty4nMXE8aoZMfy+lgkC/jMQ4aYnk2S58mFsSGFnW1",
     "themes/baseui-light.css": "sha384-/TosvycgVJ5aZ7EOWd4cr8Zen4nayAC/iA9BgGdXKH0LuHSnZk4guDaWM5WPC7yy",
     "themes/baseui-dark.css": "sha384-zF9Rhfjpv90sxuJ2WK7GBPCltN6mkebzK1w9EzQGY9DYHiX3eIX/fcE7fXzfIZVF"

package/docs/blocks.md

@@ -13,7 +13,7 @@ Blocks are not standalone runtime components. Paste the markup and load the norm
 <script src="https://cdn.jsdelivr.net/npm/@thebase/ui@latest/dist/baseui.min.js" defer></script>
 ```
 
-`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. `@0.0.4`) 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).
+`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.0.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).
 
 Use `b-block` to select the block style:
 

package/docs/components/button.md

@@ -50,9 +50,12 @@ import { Button } from "@thebase/ui";
 | `id` | `String` | forwarded to the rendered `<a>`/`<button>` |
 | `title` | `String` | forwarded to the rendered `<a>`/`<button>` |
 | `className` | `String` | appended to the generated `btn ...` classes |
+| `unstyled` | `Boolean` | drops the forced `btn bu-button`/variant/size classes so only `className` applies — for reusing Button's behavior under your own CSS |
+| `attrs` | `Object` | extra attributes spread onto the rendered `<a>`/`<button>` (`aria-*`, `data-*`, `data-bs-*`, custom directives) that have no first-class prop |
+| `getRef` | `Function` | called with the rendered root element after mount, and with `null` on unmount |
 | `onClick` | `Function` | called with the native click event |
 
-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`.
+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`.
 
 ## Static component
 

package/docs/components/sidebar.md

@@ -166,6 +166,8 @@ import { Sidebar, SidebarContent, SidebarFooter, SidebarHeader, SidebarMenu, Sid
 
 Reusable nav-content primitives, extracted from the recurring group/item shapes across the `sidebar-*` example blocks (`examples/blocks/sidebar-01.html`, `-02`, `-03`, `-08`, `-10`, etc.). Compose them instead of hand-rolling static markup for each new sidebar.
 
+`SidebarMenu` (`.bu-sidebar-menu`) fills the remaining height of the panel and scrolls on its own (`overflow-y: auto`) when its items overflow. `SidebarHeader` and `SidebarFooter` stay in place, so a long nav list no longer pushes the footer off-screen.
+
 ```base-ui
 <Sidebar defaultOpen="true">
   <SidebarContent>

package/docs/icons.md

@@ -22,7 +22,7 @@ Load the normal BaseUI assets. No separate icon script is required.
 <script src="https://cdn.jsdelivr.net/npm/@thebase/ui@latest/dist/baseui.min.js" defer></script>
 ```
 
-`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. `@0.0.4`) instead of `@latest` for production. `b-icon` also works with the [pure Owl `Icon` component](components/icon.md) — the recommended API in an Owl app; the classic script above is for pages using the static `b-ui` API.
+`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.0.0`, or `@1` to take only non-breaking updates) instead of `@latest` for production. `b-icon` also works with the [pure Owl `Icon` component](components/icon.md) — the recommended API in an Owl app; the classic script above is for pages using the static `b-ui` API.
 
 The build publishes every Lucide SVG to `dist/icons/lucide/` and writes the generated icon manifest to `dist/icons/lucide.json`.
 

package/docs/installation.md

@@ -4,7 +4,7 @@ See the [Usage Guide](usage-guide.md) for the end-to-end integration path (choos
 
 BaseUI is distributed as one CSS file and one JavaScript file for browser use. `dist/baseui.min.js` is fully self-contained: Bootstrap's JS bundle (Popper.js included) and the Owl runtime are embedded ahead of BaseUI's own code, in load order (Bootstrap, then Owl, then BaseUI) — nothing else needs to load first. Both install paths below load this same file; the pure Owl component API is the recommended way to consume BaseUI in an Owl app, with the static `b-ui` markup API available as a lighter-weight alternative for non-Owl pages.
 
-The snippets below use the `@latest` tag for readability. Pin an exact version instead (e.g. `@0.0.4`) for any production page — `@latest` can silently change what your page loads the moment a new version is published.
+The snippets below use the `@latest` tag for readability. Pin an exact version instead (e.g. `@1.0.0`, or `@1` to take only non-breaking updates) for any production page — `@latest` can silently change what your page loads the moment a new version is published.
 
 ## Pure Owl component install (recommended)
 
@@ -43,7 +43,7 @@ For static HTML, a server-rendered page, or a Base HUB website page that has no
 
 Bootstrap 5 is the bundled baseline CSS framework, and its JS bundle now drives BaseUI's interactive components directly.
 
-`@thebase/ui` is published on npm, so [unpkg](https://unpkg.com/@thebase/ui@latest/) mirrors the same files as an alternative CDN (`https://unpkg.com/@thebase/ui@latest/dist/baseui.min.css` / `baseui.min.js`) if jsDelivr is unreachable in your environment. Pin an exact version (e.g. `@0.0.4`) instead of `@latest` for production.
+`@thebase/ui` is published on npm, so [unpkg](https://unpkg.com/@thebase/ui@latest/) mirrors the same files as an alternative CDN (`https://unpkg.com/@thebase/ui@latest/dist/baseui.min.css` / `baseui.min.js`) if jsDelivr is unreachable in your environment. Pin an exact version (e.g. `@1.0.0`, or `@1` to take only non-breaking updates) instead of `@latest` for production.
 
 For npm/self-hosted usage:
 

package/docs/owl-components.md

@@ -55,7 +55,7 @@ Everything — the static `b-ui` runtime, the Owl framework, every pure Owl comp
 </script>
 ```
 
-`https://unpkg.com/@thebase/ui@latest/dist/...` mirrors the same files as an alternative CDN if jsDelivr is unreachable — swap the host in each URL above. For a self-hosted build, replace the CDN host with your own served path (e.g. `/dist/baseui.esm.js`). These snippets use `@latest` for readability; pin an exact version (e.g. `@0.0.4`) in production so a new release can't change what your page loads.
+`https://unpkg.com/@thebase/ui@latest/dist/...` mirrors the same files as an alternative CDN if jsDelivr is unreachable — swap the host in each URL above. For a self-hosted build, replace the CDN host with your own served path (e.g. `/dist/baseui.esm.js`). These snippets use `@latest` for readability; pin an exact version (e.g. `@1.0.0`, or `@1` to take only non-breaking updates) in production so a new release can't change what your page loads.
 
 No `@odoo/owl` import appears anywhere in that snippet — `@base/owl` is the only Owl entry point BaseUI components and consumer apps need. Because `@base/owl`, `@base/component`, and `@base/theme` all point at the exact same `dist/baseui.esm.js` URL, the browser fetches and evaluates it once and every key shares the same module instance — no separate classic `<script>` needs to load first to set up a shared global.
 
@@ -95,11 +95,34 @@ Both APIs come from the exact same bundle now, so there's nothing extra to load
 - Events are callback props (`onClick`, `onChange`, `onOpenChange`), not DOM `CustomEvent`s — that's the static API's contract, not this one.
 - Default slot content works as normal Owl children (`<Badge>Draft</Badge>`); compound components use named slots/sub-tags (`<CardHeader>`, `<DialogFooter>`).
 
+## Global component fallback
+
+`Component` exported from `@base/owl` / `@thebase/ui` is Owl's `Component` with one addition: any component that extends it can use every registered BaseUI component (`<Icon/>`, `<Button/>`, `<Card/>`, ...) in its template, even if its own `static components` doesn't list it. Without this, Owl only checks a component's own `static components` map, so a nested child that used `<Icon/>` without declaring it crashed with `Cannot find the definition of component "Icon"`.
+
+- The fallback applies to every component in the tree, not only the root passed to `mount()`.
+- Entries in your own `static components` still take precedence over a BaseUI component with the same name.
+- Listing BaseUI classes in `static components` is still allowed and is the clearest choice for shared or library code. The fallback mainly protects deeply nested app components.
+- The fallback only works for classes that extend BaseUI's `Component`. A class built on `Component` from `@odoo/owl` directly does not get it.
+
+```js
+import { Component, mount, xml } from "@base/owl";
+
+class SaveRow extends Component {
+  // No static components — <Button/> and <Icon/> resolve from the BaseUI registry.
+  static template = xml`<div><Icon name="'save'"/><Button label="'Save'"/></div>`;
+}
+
+class Root extends Component {
+  static components = { SaveRow };
+  static template = xml`<SaveRow/>`;
+}
+```
+
 See each component's page under [`docs/components/`](components/) for its specific props table and an Owl usage example alongside the static `b-ui` one.
 
 ## Common mistakes
 
 - **Rendering a bare `<Button/>` with no template loaded.** `mount(Root, target)` without `{ templates }` (or `app.addTemplates(...)`) throws — the `.xml` file is a real build/runtime input, not documentation.
-- **Registering `Button` under the wrong tag name.** `static components = { Button }` must match the tag used in the template (`<Button/>`), same as any other Owl component.
-- **Importing from `@odoo/owl`.** Always import from `@base/owl` instead, even in your own app code — it keeps your app on the exact Owl version this BaseUI release was tested against.
+- **Registering `Button` under the wrong tag name.** `static components = { Button }` must match the tag used in the template (`<Button/>`), same as any other Owl component. If you alias a BaseUI class under a different tag (`{ PrimaryButton: Button }`), the alias exists only in that component's map.
+- **Importing from `@odoo/owl`.** Always import from `@base/owl` instead, even in your own app code — it keeps your app on the exact Owl version this BaseUI release was tested against, and only `@base/owl`'s `Component` provides the [global component fallback](#global-component-fallback).
 - **Adding a `baseui.owl.min.js`/`baseui.owl.esm.js`/`baseui.components.esm.js` script or import-map entry.** None of those files are published anymore — point `@base/owl`/`@base/component`/`@base/theme` all at `dist/baseui.esm.js` instead.

package/docs/runtime-api.md

@@ -25,7 +25,7 @@ Mounted components dispatch lifecycle events on their root element:
 
 `BaseUI.theme.set(...)` is the low-level setter. For persisted light/dark toggles, button-label synchronization, URL `?theme=` overrides, and iframe preview sync, import `createThemeController` from `@base/theme` in browser import maps or `@thebase/ui` in npm/bundler apps.
 
-`BaseUI.mountAll()` is for static `b-ui`/`b-att-*` markers and `b-icon` markers only. It does not register Owl component tags (`<Button/>`, `<Card/>`, ...) and does not know about `@thebase/ui` or `dist/baseui.templates.xml`. To use pure Owl components, import their classes, fetch the templates XML, and list those classes in your own component's `static components`; see [Pure Owl Components](owl-components.md).
+`BaseUI.mountAll()` is for static `b-ui`/`b-att-*` markers and `b-icon` markers only. It does not register Owl component tags (`<Button/>`, `<Card/>`, ...) and does not know about `@thebase/ui` or `dist/baseui.templates.xml`. To use pure Owl components, extend `Component` from `@base/owl`, fetch the templates XML, and pass it to `mount()`. Registered BaseUI components then resolve in every template, whether or not they are listed in `static components`; see [Pure Owl Components](owl-components.md#global-component-fallback).
 
 ## `cn()` class-name helper
 

package/docs/theming.md

@@ -38,7 +38,7 @@ For a reusable theme toggle with persistence, URL override, button-label sync, a
 </script>
 ```
 
-`https://unpkg.com/@thebase/ui@latest/dist/baseui.esm.js` mirrors the same file as an alternative CDN if jsDelivr is unreachable. Pin an exact version (e.g. `@0.0.4`) instead of `@latest` for production. Npm/bundler consumers can import the same API from `@thebase/ui`.
+`https://unpkg.com/@thebase/ui@latest/dist/baseui.esm.js` mirrors the same file as an alternative CDN if jsDelivr is unreachable. Pin an exact version (e.g. `@1.0.0`, or `@1` to take only non-breaking updates) instead of `@latest` for production. Npm/bundler consumers can import the same API from `@thebase/ui`.
 
 For a ready-made icon button, use the BaseUI component instead of wiring your own click handler:
 

package/docs/usage-guide.md

@@ -32,7 +32,7 @@ Save this as an `.html` file and open it — no build step, no server required.
 </html>
 ```
 
-`https://cdn.jsdelivr.net/npm/@thebase/ui@latest/dist/...` is the real jsDelivr URL for the published `@thebase/ui` npm package's `latest` tag, used here for a copy-paste-and-go quick start. Pin an exact version instead (e.g. `@0.0.4`) for production, so a new release can't change what your page loads. See [Installation](installation.md) for jsDelivr/unpkg/npm/self-hosted paths.
+`https://cdn.jsdelivr.net/npm/@thebase/ui@latest/dist/...` is the real jsDelivr URL for the published `@thebase/ui` npm package's `latest` tag, used here for a copy-paste-and-go quick start. Pin an exact version instead (e.g. `@1.0.0`, or `@1` to take only non-breaking updates) for production, so a new release can't change what your page loads. See [Installation](installation.md) for jsDelivr/unpkg/npm/self-hosted paths.
 
 The static bundle calls `BaseUI.mountAll()` automatically on `DOMContentLoaded`, so initial `[b-ui]` and `[b-icon]` markup mounts without an extra script. Call `BaseUI.mountAll(root)` yourself only after injecting new markup or when mounting a specific fragment. If the consumer is itself an Owl app, use [step 2](#2-install-pure-owl-api--recommended) instead — that's the recommended path.
 
@@ -63,7 +63,7 @@ Both APIs come from the same package and the same CSS file, and can be mixed on
 </script>
 ```
 
-`https://unpkg.com/@thebase/ui@latest/dist/...` mirrors the same files as an alternative CDN if jsDelivr is unreachable — swap the host in each URL above. Pin an exact version (e.g. `@0.0.4`) instead of `@latest` for production.
+`https://unpkg.com/@thebase/ui@latest/dist/...` mirrors the same files as an alternative CDN if jsDelivr is unreachable — swap the host in each URL above. Pin an exact version (e.g. `@1.0.0`, or `@1` to take only non-breaking updates) instead of `@latest` for production.
 
 ```html
 <script type="module">
@@ -103,7 +103,7 @@ Two rules that account for most integration failures — see [Pure Owl Component
 <script src="https://cdn.jsdelivr.net/npm/@thebase/ui@latest/dist/baseui.min.js" defer></script>
 ```
 
-`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. `@0.0.4`) instead of `@latest` for production.
+`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.0.0`, or `@1` to take only non-breaking updates) instead of `@latest` for production.
 
 **Option B — npm (bundler-based apps: Vite, webpack, etc.):**
 
@@ -120,7 +120,7 @@ import "@thebase/ui"; // side-effect import: registers window.BaseUI and auto-mo
 
 Rule that applies to both options:
 
-- Production pages must use a pinned version (e.g. `@thebase/ui@0.0.4`), never `@latest`.
+- Production pages must use a pinned version (e.g. `@thebase/ui@1.0.0` or `@thebase/ui@1`), never `@latest`.
 
 Mount markup:
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thebase/ui",
-  "version": "0.0.12",
+  "version": "1.0.0",
   "description": "CDN-installable Owl and Bootstrap 5 UI component library.",
   "type": "module",
   "main": "./dist/baseui.min.js",