@thebase/ui 0.0.4

package/dist/baseui.templates.xml

@@ -0,0 +1,2411 @@
+<templates>
+<t t-name="baseui.alert-dialog">
+    <div b-ui="alert-dialog">
+      <div b-alert-dialog-panel="">
+        <t t-esc="props.content"/>
+      </div>
+    </div>
+  </t>
+  <t t-name="baseui.AlertDialog">
+    <t t-slot="default"/>
+  </t>
+  <t t-name="AlertDialog" t-call="baseui.AlertDialog"/>
+  <t t-name="baseui.AlertDialogTrigger">
+    <button type="button" data-slot="alert-dialog-trigger" class="btn baseui-button btn-outline-secondary baseui-alert-dialog-trigger" t-att-style="props.style" t-on-click="onClick">
+      <t t-slot="default"/>
+    </button>
+  </t>
+  <t t-name="AlertDialogTrigger" t-call="baseui.AlertDialogTrigger"/>
+  <t t-name="baseui.AlertDialogContent">
+    <div t-if="open" data-slot="alert-dialog-overlay" class="baseui-dialog-backdrop" t-ref="root" role="alertdialog" aria-modal="true" tabindex="-1" t-on-keydown="onKeyDown">
+      <div data-slot="alert-dialog-content" t-att-data-size="size" t-att-class="'baseui-dialog-panel baseui-alert-dialog-panel' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+        <t t-slot="default"/>
+      </div>
+    </div>
+  </t>
+  <t t-name="AlertDialogContent" t-call="baseui.AlertDialogContent"/>
+  <t t-name="baseui.AlertDialogHeader">
+    <div data-slot="alert-dialog-header" class="baseui-dialog-header baseui-alert-dialog-header" t-att-style="props.style">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="AlertDialogHeader" t-call="baseui.AlertDialogHeader"/>
+  <t t-name="baseui.AlertDialogFooter">
+    <div data-slot="alert-dialog-footer" class="baseui-dialog-footer baseui-alert-dialog-footer" t-att-style="props.style">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="AlertDialogFooter" t-call="baseui.AlertDialogFooter"/>
+  <t t-name="baseui.AlertDialogMedia">
+    <div data-slot="alert-dialog-media" class="baseui-alert-dialog-media" t-att-style="props.style">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="AlertDialogMedia" t-call="baseui.AlertDialogMedia"/>
+  <t t-name="baseui.AlertDialogTitle">
+    <h2 data-slot="alert-dialog-title" class="baseui-dialog-title baseui-alert-dialog-title" t-att-style="props.style">
+      <t t-slot="default"/>
+    </h2>
+  </t>
+  <t t-name="AlertDialogTitle" t-call="baseui.AlertDialogTitle"/>
+  <t t-name="baseui.AlertDialogDescription">
+    <p data-slot="alert-dialog-description" class="baseui-dialog-description baseui-alert-dialog-description" t-att-style="props.style">
+      <t t-slot="default"/>
+    </p>
+  </t>
+  <t t-name="AlertDialogDescription" t-call="baseui.AlertDialogDescription"/>
+
+  <t t-name="baseui.AlertDialogCancel">
+    <button type="button" data-slot="alert-dialog-cancel" class="btn baseui-button btn-outline-secondary baseui-alert-dialog-cancel" t-att-style="props.style" t-on-click="onClick">
+      <t t-slot="default"/>
+    </button>
+  </t>
+  <t t-name="AlertDialogCancel" t-call="baseui.AlertDialogCancel"/>
+  <t t-name="baseui.AlertDialogAction">
+    <button type="button" data-slot="alert-dialog-action" class="btn baseui-button btn-primary baseui-alert-dialog-action" t-att-style="props.style" t-on-click="onClick">
+      <t t-slot="default"/>
+    </button>
+  </t>
+  <t t-name="AlertDialogAction" t-call="baseui.AlertDialogAction"/>
+<t t-name="baseui.alert">
+    <div class="alert baseui-alert baseui-alert-default" role="alert"><t t-esc="props.message"/></div>
+  </t>
+  <t t-name="baseui.Alert">
+    <div data-slot="alert" t-att-class="classNames" t-att-style="props.style" role="alert" t-ref="root">
+      <t t-slot="default"/>
+      <button t-if="props.dismissible" type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"/>
+    </div>
+  </t>
+  <t t-name="Alert" t-call="baseui.Alert"/>
+  <t t-name="baseui.AlertTitle">
+    <div data-slot="alert-title" t-att-class="'baseui-alert-title' + (props.className ? ' ' + props.className : '')" t-att-style="props.style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="AlertTitle" t-call="baseui.AlertTitle"/>
+  <t t-name="baseui.AlertDescription">
+    <div data-slot="alert-description" t-att-class="'baseui-alert-description' + (props.className ? ' ' + props.className : '')" t-att-style="props.style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="AlertDescription" t-call="baseui.AlertDescription"/>
+  <t t-name="baseui.AlertAction">
+    <div data-slot="alert-action" t-att-class="'baseui-alert-action' + (props.className ? ' ' + props.className : '')" t-att-style="props.style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="AlertAction" t-call="baseui.AlertAction"/>
+<t t-name="baseui.accordion">
+    <div b-ui="accordion"><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.Accordion">
+    <div data-slot="accordion" t-att-class="'baseui-accordion' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" role="presentation">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="Accordion" t-call="baseui.Accordion"/>
+  <t t-name="baseui.AccordionItem">
+    <div data-slot="accordion-item" class="baseui-accordion-item" t-att-style="props.style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="AccordionItem" t-call="baseui.AccordionItem"/>
+  <t t-name="baseui.AccordionTrigger">
+    <div class="baseui-accordion-header" t-att-style="props.style">
+      <button type="button" data-slot="accordion-trigger" class="baseui-accordion-trigger" t-att-aria-expanded="open ? 'true' : 'false'" t-on-click="onClick">
+        <t t-slot="default"/>
+        <Icon name="'chevron-down'" className="'baseui-accordion-trigger-icon'"/>
+      </button>
+    </div>
+  </t>
+  <t t-name="AccordionTrigger" t-call="baseui.AccordionTrigger"/>
+  <t t-name="baseui.AccordionContent">
+    <div t-ref="root" data-slot="accordion-content" t-att-class="'collapse baseui-accordion-content' + (initialOpen ? ' show' : '')" t-att-style="props.style" t-att-aria-hidden="open ? undefined : 'true'">
+      <div class="baseui-accordion-content-inner"><t t-slot="default"/></div>
+    </div>
+  </t>
+  <t t-name="AccordionContent" t-call="baseui.AccordionContent"/>
+<t t-name="baseui.aspect-ratio">
+    <div b-ui="aspect-ratio"><t t-esc="props.content"/></div>
+  </t>
+  <t t-name="baseui.AspectRatio">
+    <div t-att-class="classNames" t-att-style="style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="AspectRatio" t-call="baseui.AspectRatio"/>
+<t t-name="baseui.attachment">
+    <div class="baseui-attachment"/>
+  </t>
+  <t t-name="baseui.Attachment">
+    <div
+      t-att-class="classNames"
+      t-att-data-state="state"
+      t-att-data-size="size"
+      t-att-data-orientation="orientation"
+      data-slot="attachment"
+      t-att-style="props.style"
+    >
+      <t t-if="hasContent" t-slot="default"/>
+      <input t-else="" type="file" class="form-control" t-att-multiple="props.multiple" t-on-change="onChange"/>
+    </div>
+  </t>
+  <t t-name="baseui.AttachmentMedia">
+    <div t-att-class="classNames" t-att-data-variant="variant" data-slot="attachment-media" t-att-style="props.style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.AttachmentContent">
+    <div t-att-class="'baseui-attachment-content' + (props.className ? ' ' + props.className : '')" data-slot="attachment-content" t-att-style="props.style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.AttachmentTitle">
+    <div t-att-class="'baseui-attachment-title' + (props.className ? ' ' + props.className : '')" data-slot="attachment-title" t-att-style="props.style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.AttachmentDescription">
+    <div t-att-class="'baseui-attachment-description' + (props.className ? ' ' + props.className : '')" data-slot="attachment-description" t-att-style="props.style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.AttachmentActions">
+    <div t-att-class="'baseui-attachment-actions' + (props.className ? ' ' + props.className : '')" data-slot="attachment-actions" t-att-style="props.style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.AttachmentAction">
+    <button
+      t-att-class="classNames"
+      t-att-type="props.type || 'button'"
+      t-att-disabled="props.disabled"
+      t-att-aria-label="ariaLabel"
+      data-slot="attachment-action"
+      t-att-style="props.style"
+      t-on-click="onClick"
+    ><t t-if="props.label" t-esc="props.label"/><t t-else="" t-slot="default"/></button>
+  </t>
+  <t t-name="baseui.AttachmentTrigger">
+    <a
+      t-if="props.href"
+      t-att-class="classNames"
+      t-att-href="props.href"
+      t-att-target="props.target"
+      t-att-rel="props.rel || (props.target === '_blank' ? 'noreferrer' : undefined)"
+      t-att-aria-label="ariaLabel"
+      data-slot="attachment-trigger"
+      t-att-style="props.style"
+      t-on-click="onClick"
+    ></a>
+    <button
+      t-else=""
+      t-att-class="classNames"
+      t-att-type="props.type || 'button'"
+      t-att-aria-label="ariaLabel"
+      data-slot="attachment-trigger"
+      t-att-style="props.style"
+      t-on-click="onClick"
+    ></button>
+  </t>
+  <t t-name="baseui.AttachmentGroup">
+    <div t-att-class="classNames" data-slot="attachment-group" t-att-style="props.style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.AttachmentDropzone">
+    <div
+      t-att-class="classNames"
+      data-slot="attachment-dropzone"
+      t-att-style="props.style"
+      t-on-dragover="onDragOver"
+      t-on-dragleave="onDragLeave"
+      t-on-drop="onDrop"
+      t-on-click="openPicker"
+    >
+      <input
+        type="file"
+        class="visually-hidden"
+        t-att-multiple="props.multiple"
+        t-att-disabled="props.disabled"
+        t-ref="fileInput"
+        tabindex="-1"
+        t-on-change="onInputChange"
+      />
+      <t t-if="hasContent" t-slot="default"/>
+      <t t-else="">
+        <p class="baseui-attachment-dropzone-hint">Drag and drop a file here, or click to browse.</p>
+      </t>
+    </div>
+  </t>
+  <t t-name="Attachment" t-call="baseui.Attachment"/>
+  <t t-name="AttachmentMedia" t-call="baseui.AttachmentMedia"/>
+  <t t-name="AttachmentContent" t-call="baseui.AttachmentContent"/>
+  <t t-name="AttachmentTitle" t-call="baseui.AttachmentTitle"/>
+  <t t-name="AttachmentDescription" t-call="baseui.AttachmentDescription"/>
+  <t t-name="AttachmentActions" t-call="baseui.AttachmentActions"/>
+  <t t-name="AttachmentAction" t-call="baseui.AttachmentAction"/>
+  <t t-name="AttachmentTrigger" t-call="baseui.AttachmentTrigger"/>
+  <t t-name="AttachmentGroup" t-call="baseui.AttachmentGroup"/>
+  <t t-name="AttachmentDropzone" t-call="baseui.AttachmentDropzone"/>
+<t t-name="baseui.avatar">
+    <span class="baseui-avatar"><t t-out="props.content"/></span>
+  </t>
+  <t t-name="baseui.Avatar">
+    <span t-att-class="'baseui-avatar' + (props.className ? ' ' + props.className : '')" t-att-title="props.title" t-att-style="props.style">
+      <img t-if="showImage" t-att-src="props.src" t-att-alt="props.alt" t-on-error="onError"/>
+      <t t-if="!showImage" t-slot="fallback"/>
+    </span>
+  </t>
+  <t t-name="Avatar" t-call="baseui.Avatar"/>
+<t t-name="baseui.Badge">
+    <span t-att-class="classNames" t-att-style="props.style">
+      <t t-if="props.label" t-esc="props.label"/>
+      <t t-else="" t-slot="default"/>
+    </span>
+  </t>
+  <t t-name="Badge" t-call="baseui.Badge"/>
+<t t-name="baseui.BlockViewer">
+    <t t-if="state.embed">
+      <div class="baseui-block-embed-root" t-ref="embedRoot"></div>
+    </t>
+    <t t-else="">
+      <div class="baseui-block-viewer">
+        <t t-call="baseui.BlockViewerNav"/>
+        <div class="baseui-block-viewer-shell">
+          <header class="baseui-block-viewer-header">
+            <div class="baseui-block-viewer-title">
+              <a href="/blocks" class="baseui-block-muted">Blocks</a>
+              <h1 t-esc="title"/>
+              <p t-esc="description"/>
+            </div>
+            <div class="baseui-block-viewer-actions">
+              <Button variant="'outline'" type="'button'" ariaPressed="state.mode === 'preview' ? 'true' : 'false'" onClick="() => this.setMode('preview')">
+                <Icon name="'eye'"/>
+                Preview
+              </Button>
+              <Button variant="'outline'" type="'button'" ariaPressed="state.mode === 'code' ? 'true' : 'false'" onClick="() => this.setMode('code')">
+                <Icon name="'code'"/>
+                Code
+              </Button>
+              <Button variant="'ghost'" type="'button'" className="'baseui-icon-button'" ariaLabel="'Desktop preview'" ariaPressed="state.viewport === 'desktop' ? 'true' : 'false'" onClick="() => this.setViewport('desktop')">
+                <Icon name="'monitor'"/>
+              </Button>
+              <Button variant="'ghost'" type="'button'" className="'baseui-icon-button'" ariaLabel="'Tablet preview'" ariaPressed="state.viewport === 'tablet' ? 'true' : 'false'" onClick="() => this.setViewport('tablet')">
+                <Icon name="'tablet'"/>
+              </Button>
+              <Button variant="'ghost'" type="'button'" className="'baseui-icon-button'" ariaLabel="'Mobile preview'" ariaPressed="state.viewport === 'mobile' ? 'true' : 'false'" onClick="() => this.setViewport('mobile')">
+                <Icon name="'smartphone'"/>
+              </Button>
+              <Button variant="'outline'" type="'button'" onClick="() => this.copyCode()">
+                <Icon name="'copy'"/>
+                <span t-esc="state.copyLabel"/>
+              </Button>
+            </div>
+          </header>
+          <main class="baseui-block-viewer-main">
+            <section t-att-class="state.mode === 'code' ? 'baseui-block-preview-panel is-hidden' : 'baseui-block-preview-panel'">
+              <div class="baseui-block-preview-frame" t-att-style="previewStyle" t-ref="previewFrame"></div>
+            </section>
+            <section t-att-class="state.mode === 'code' ? 'baseui-block-code-panel is-active' : 'baseui-block-code-panel'">
+              <div class="baseui-block-code-toolbar" role="group" aria-label="Code source">
+                <Button variant="'ghost'" type="'button'" ariaPressed="state.codeVariant === 'owl' ? 'true' : 'false'" onClick="() => this.setCodeVariant('owl')">
+                  Pure Owl Component
+                </Button>
+                <Button variant="'ghost'" type="'button'" ariaPressed="state.codeVariant === 'template' ? 'true' : 'false'" onClick="() => this.setCodeVariant('template')">
+                  Template
+                </Button>
+              </div>
+              <pre class="baseui-block-code" t-esc="activeCode"/>
+            </section>
+          </main>
+        </div>
+      </div>
+    </t>
+  </t>
+
+  <t t-name="baseui.BlockViewerNav">
+    <header class="baseui-example-header">
+      <nav class="container baseui-example-nav" aria-label="BaseUI pages">
+        <a class="navbar-brand fw-semibold text-decoration-none baseui-example-brand" href="/docs">BaseUI</a>
+        <div class="baseui-example-nav-menu" aria-label="BaseUI pages">
+          <a t-foreach="navItems" t-as="item" t-key="item.key" t-att-href="item.href" t-att-class="item.key === 'blocks' ? 'is-active' : ''" t-att-aria-current="item.key === 'blocks' ? 'page' : undefined">
+            <t t-esc="item.label"/>
+          </a>
+        </div>
+        <ThemeButton variant="'outline'" storageKey="'baseui-example-theme'"/>
+      </nav>
+    </header>
+  </t>
+
+  <t t-name="BlockViewer" t-call="baseui.BlockViewer"/>
+<t t-name="baseui.breadcrumb">
+    <nav b-ui="breadcrumb" aria-label="breadcrumb"><ol><t t-slot="default"/></ol></nav>
+  </t>
+  <t t-name="baseui.Breadcrumb">
+    <nav
+      data-slot="breadcrumb"
+      t-att-class="'baseui-breadcrumb' + (props.className ? ' ' + props.className : '')"
+      aria-label="breadcrumb"
+      t-att-style="props.style"
+    >
+      <t t-slot="default"/>
+    </nav>
+  </t>
+  <t t-name="Breadcrumb" t-call="baseui.Breadcrumb"/>
+  <t t-name="baseui.BreadcrumbList">
+    <ol
+      data-slot="breadcrumb-list"
+      t-att-class="'breadcrumb baseui-breadcrumb-list' + (props.className ? ' ' + props.className : '')"
+      t-att-style="props.style"
+    >
+      <t t-slot="default"/>
+    </ol>
+  </t>
+  <t t-name="BreadcrumbList" t-call="baseui.BreadcrumbList"/>
+  <t t-name="baseui.BreadcrumbItem">
+    <li data-slot="breadcrumb-item" t-att-class="classNames" t-att-aria-current="props.current ? 'page' : undefined" t-att-style="props.style">
+      <t t-slot="default"/>
+    </li>
+  </t>
+  <t t-name="BreadcrumbItem" t-call="baseui.BreadcrumbItem"/>
+  <t t-name="baseui.BreadcrumbLink">
+    <a
+      data-slot="breadcrumb-link"
+      t-att-href="props.href || '#'"
+      t-att-target="props.target"
+      t-att-rel="props.rel"
+      t-att-class="classNames"
+      t-att-style="props.style"
+      t-on-click="onClick"
+    >
+      <t t-slot="default"/>
+    </a>
+  </t>
+  <t t-name="BreadcrumbLink" t-call="baseui.BreadcrumbLink"/>
+  <t t-name="baseui.BreadcrumbPage">
+    <span
+      data-slot="breadcrumb-page"
+      role="link"
+      aria-disabled="true"
+      aria-current="page"
+      t-att-class="classNames"
+      t-att-style="props.style"
+    >
+      <t t-slot="default"/>
+    </span>
+  </t>
+  <t t-name="BreadcrumbPage" t-call="baseui.BreadcrumbPage"/>
+  <t t-name="baseui.BreadcrumbSeparator">
+    <li
+      data-slot="breadcrumb-separator"
+      role="presentation"
+      aria-hidden="true"
+      t-att-class="classNames"
+      t-att-style="props.style"
+    >
+      <t t-if="hasCustomContent" t-slot="default"/>
+      <Icon t-else="" name="'chevron-right'" className="'baseui-breadcrumb-separator-icon'"/>
+    </li>
+  </t>
+  <t t-name="BreadcrumbSeparator" t-call="baseui.BreadcrumbSeparator"/>
+  <t t-name="baseui.BreadcrumbEllipsis">
+    <span
+      data-slot="breadcrumb-ellipsis"
+      role="presentation"
+      aria-hidden="true"
+      t-att-class="classNames"
+      t-att-style="props.style"
+    >
+      <t t-if="hasCustomContent" t-slot="default"/>
+      <Icon t-else="" name="'ellipsis'" className="'baseui-breadcrumb-ellipsis-icon'"/>
+      <span class="visually-hidden">More</span>
+    </span>
+  </t>
+  <t t-name="BreadcrumbEllipsis" t-call="baseui.BreadcrumbEllipsis"/>
+<t t-name="baseui.bubble"><div b-ui="bubble"><t t-esc="props.content"/></div></t>
+  <t t-name="baseui.Bubble">
+    <div t-att-class="classNames" t-att-data-side="side" t-att-style="props.style" role="listitem"><t t-slot="default"/></div>
+  </t>
+  <t t-name="Bubble" t-call="baseui.Bubble"/>
+<t t-name="baseui.Button">
+    <a
+      t-if="props.href"
+      t-att-class="classNames"
+      t-att-href="props.href"
+      data-slot="button"
+      t-att-id="props.id"
+      t-att-title="props.title"
+      t-att-aria-label="ariaLabel"
+      t-att-aria-pressed="ariaPressed"
+      t-att-aria-invalid="ariaInvalid"
+      t-att-aria-disabled="props.disabled ? 'true' : undefined"
+      t-att-data-icon-only="isIconOnly ? 'true' : undefined"
+      t-att-data-icon="props.icon ? 'inline-' + iconPosition : undefined"
+      t-att-style="props.style"
+      t-on-click="onClick"
+    >
+      <Icon t-if="props.icon &amp;&amp; iconPosition !== 'end'" name="props.icon"/>
+      <span t-if="props.label" t-esc="props.label"/>
+      <t t-else="" t-slot="default"/>
+      <Icon t-if="props.icon &amp;&amp; iconPosition === 'end'" name="props.icon"/>
+    </a>
+    <button
+      t-else=""
+      t-att-class="classNames"
+      t-att-type="props.type || 'button'"
+      data-slot="button"
+      t-att-disabled="props.disabled"
+      t-att-id="props.id"
+      t-att-title="props.title"
+      t-att-aria-label="ariaLabel"
+      t-att-aria-pressed="ariaPressed"
+      t-att-aria-invalid="ariaInvalid"
+      t-att-data-icon-only="isIconOnly ? 'true' : undefined"
+      t-att-data-icon="props.icon ? 'inline-' + iconPosition : undefined"
+      t-att-style="props.style"
+      t-on-click="onClick"
+    >
+      <Icon t-if="props.icon &amp;&amp; iconPosition !== 'end'" name="props.icon"/>
+      <span t-if="props.label" t-esc="props.label"/>
+      <t t-else="" t-slot="default"/>
+      <Icon t-if="props.icon &amp;&amp; iconPosition === 'end'" name="props.icon"/>
+    </button>
+  </t>
+  <t t-name="Button" t-call="baseui.Button"/>
+<t t-name="baseui.button-group">
+    <div b-ui="button-group"><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.ButtonGroup">
+    <div
+      t-att-class="classNames"
+      t-att-aria-label="ariaLabel"
+      t-att-aria-labelledby="ariaLabelledby"
+      t-att-style="props.style"
+      role="group"
+    ><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.ButtonGroupSeparator">
+    <span
+      t-att-class="classNames"
+      t-att-data-orientation="orientation"
+      t-att-style="props.style"
+      role="separator"
+    ></span>
+  </t>
+  <t t-name="baseui.ButtonGroupText">
+    <span t-att-class="classNames" t-att-style="props.style"><t t-slot="default"/></span>
+  </t>
+  <t t-name="ButtonGroup" t-call="baseui.ButtonGroup"/>
+  <t t-name="ButtonGroupSeparator" t-call="baseui.ButtonGroupSeparator"/>
+  <t t-name="ButtonGroupText" t-call="baseui.ButtonGroupText"/>
+<t t-name="baseui.calendar">
+    <div class="baseui-calendar"/>
+  </t>
+  <t t-name="baseui.Calendar">
+    <div t-att-class="'baseui-calendar' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <div class="baseui-calendar__header"><t t-esc="headerLabel"/></div>
+      <div class="baseui-calendar__weekdays">
+        <span t-foreach="weekdays" t-as="weekday" t-key="weekday" t-esc="weekday"/>
+      </div>
+      <div class="baseui-calendar__grid">
+        <t t-foreach="days" t-as="cell" t-key="cell_index">
+          <span t-if="!cell"/>
+          <button
+            t-else=""
+            type="button"
+            t-att-aria-pressed="cell.selected ? 'true' : 'false'"
+            t-on-click="() => this.onSelect(cell.value)"
+          >
+            <t t-esc="cell.day"/>
+          </button>
+        </t>
+      </div>
+    </div>
+  </t>
+  <t t-name="Calendar" t-call="baseui.Calendar"/>
+<t t-name="baseui.Card">
+    <div t-tag="tag" t-att-class="'card baseui-card' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="Card" t-call="baseui.Card"/>
+
+  <t t-name="baseui.CardHeader">
+    <div t-att-class="'card-header' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="CardHeader" t-call="baseui.CardHeader"/>
+
+  <t t-name="baseui.CardBody">
+    <div t-att-class="'card-body' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="CardBody" t-call="baseui.CardBody"/>
+
+  <t t-name="baseui.CardFooter">
+    <div t-att-class="'card-footer' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="CardFooter" t-call="baseui.CardFooter"/>
+
+  <t t-name="baseui.CardTitle">
+    <h3 t-att-class="'card-title' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <t t-slot="default"/>
+    </h3>
+  </t>
+  <t t-name="CardTitle" t-call="baseui.CardTitle"/>
+
+  <t t-name="baseui.CardDescription">
+    <p t-att-class="'card-text text-body-secondary' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <t t-slot="default"/>
+    </p>
+  </t>
+  <t t-name="CardDescription" t-call="baseui.CardDescription"/>
+<t t-name="baseui.carousel">
+    <div class="baseui-carousel"/>
+  </t>
+  <t t-name="baseui.Carousel">
+    <div t-ref="root" t-att-class="'baseui-carousel carousel slide' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <div class="carousel-inner">
+        <t t-slot="default"/>
+      </div>
+    </div>
+  </t>
+  <t t-name="Carousel" t-call="baseui.Carousel"/>
+  <t t-name="baseui.CarouselSlide">
+    <div t-ref="root" t-att-class="'baseui-carousel-slide carousel-item' + (initialActive ? ' active' : '')" t-att-style="props.style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="CarouselSlide" t-call="baseui.CarouselSlide"/>
+  <t t-name="baseui.CarouselPrevious">
+    <button type="button" class="baseui-carousel-prev" t-att-style="props.style" t-on-click="onClick"><t t-slot="default"/></button>
+  </t>
+  <t t-name="CarouselPrevious" t-call="baseui.CarouselPrevious"/>
+  <t t-name="baseui.CarouselNext">
+    <button type="button" class="baseui-carousel-next" t-att-style="props.style" t-on-click="onClick"><t t-slot="default"/></button>
+  </t>
+  <t t-name="CarouselNext" t-call="baseui.CarouselNext"/>
+<t t-name="baseui.chart">
+    <div class="baseui-chart"/>
+  </t>
+  <t t-name="baseui.Chart">
+    <div
+      b-ui="chart"
+      t-att-b-att-variant="props.variant"
+      t-att-b-att-type="props.type"
+      t-att-class="classNames"
+      t-att-style="props.style"
+    ><t t-slot="default"/></div>
+  </t>
+  <t t-name="Chart" t-call="baseui.Chart"/>
+<t t-name="baseui.checkbox">
+    <label b-ui="checkbox"><input type="checkbox"/><t t-slot="default"/></label>
+  </t>
+  <t t-name="baseui.Checkbox">
+    <label t-att-class="'form-check baseui-check ' + (props.className || '')" t-att-style="props.style">
+      <input
+        type="checkbox"
+        class="form-check-input"
+        t-att-checked="props.checked"
+        t-att-disabled="props.disabled"
+        t-att-id="props.id"
+        t-on-change="onChange"
+      />
+      <t t-slot="default"/>
+    </label>
+  </t>
+  <t t-name="Checkbox" t-call="baseui.Checkbox"/>
+<t t-name="baseui.ClipboardButton">
+    <button
+      t-att-class="classNames"
+      type="button"
+      t-att-style="props.style"
+      t-att-disabled="props.disabled"
+      t-att-aria-label="ariaLabel"
+      t-att-data-icon-only="isIconOnly ? 'true' : undefined"
+      t-att-data-copied="state.copied ? 'true' : undefined"
+      t-on-click="onClick"
+    >
+      <Icon name="iconName"/>
+      <t t-if="label" t-esc="label"/>
+      <t t-else="" t-slot="default"/>
+    </button>
+  </t>
+  <t t-name="ClipboardButton" t-call="baseui.ClipboardButton"/>
+<t t-name="baseui.collapsible">
+    <div b-ui="collapsible"><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.Collapsible">
+    <div t-att-class="'baseui-collapsible' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="Collapsible" t-call="baseui.Collapsible"/>
+  <t t-name="baseui.CollapsibleTrigger">
+    <button type="button" class="baseui-collapsible-trigger" t-att-style="props.style" t-att-aria-expanded="env.collapsible.open ? 'true' : 'false'" t-on-click="onClick">
+      <t t-slot="default"/>
+    </button>
+  </t>
+  <t t-name="CollapsibleTrigger" t-call="baseui.CollapsibleTrigger"/>
+  <t t-name="baseui.CollapsibleContent">
+    <div t-ref="root" t-att-class="'collapse baseui-collapsible-content' + (initialOpen ? ' show' : '')" t-att-style="props.style" t-att-aria-hidden="open ? undefined : 'true'">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="CollapsibleContent" t-call="baseui.CollapsibleContent"/>
+<t t-name="baseui.combobox">
+    <div class="baseui-combobox"/>
+  </t>
+  <t t-name="baseui.Combobox">
+    <div t-att-class="'baseui-combobox' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" t-ref="root">
+      <input
+        class="form-control"
+        role="combobox"
+        t-att-id="props.id"
+        t-att-aria-expanded="disclosure.open ? 'true' : 'false'"
+        t-att-placeholder="props.placeholder"
+        t-att-value="state.query"
+        t-on-input="onInput"
+        t-on-focus="onFocus"
+      />
+      <div t-if="disclosure.open" class="baseui-combobox-list" role="listbox">
+        <div
+          t-foreach="filteredOptions"
+          t-as="option"
+          t-key="option.value"
+          role="option"
+          class="baseui-combobox-option"
+          t-on-click="() => this.choose(option)"
+        >
+          <t t-esc="option.label"/>
+        </div>
+      </div>
+    </div>
+  </t>
+  <t t-name="Combobox" t-call="baseui.Combobox"/>
+<t t-name="baseui.command">
+    <div b-ui="command" class="baseui-command"/>
+  </t>
+  <t t-name="baseui.Command">
+    <div t-att-class="'baseui-command' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" role="dialog">
+      <input class="form-control" t-att-placeholder="props.placeholder" t-on-input="onInput"/>
+      <div class="baseui-command-list">
+        <div
+          t-foreach="filteredItems"
+          t-as="item"
+          t-key="item.value"
+          class="baseui-command-item"
+          t-on-click="() => this.select(item)"
+        >
+          <t t-esc="item.label"/>
+        </div>
+      </div>
+    </div>
+  </t>
+  <t t-name="Command" t-call="baseui.Command"/>
+<t t-name="baseui.context-menu">
+    <div class="baseui-context-menu"/>
+  </t>
+  <t t-name="baseui.ContextMenu">
+    <t t-slot="default"/>
+  </t>
+  <t t-name="ContextMenu" t-call="baseui.ContextMenu"/>
+  <t t-name="baseui.ContextMenuTrigger">
+    <div class="baseui-context-menu-trigger" t-on-contextmenu="onContextMenu">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="ContextMenuTrigger" t-call="baseui.ContextMenuTrigger"/>
+  <t t-name="baseui.ContextMenuContent">
+    <div t-if="open" class="baseui-context-menu-content" role="menu" t-att-style="style" t-ref="root">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="ContextMenuContent" t-call="baseui.ContextMenuContent"/>
+  <t t-name="baseui.ContextMenuItem">
+    <div class="baseui-context-menu-item" role="menuitem" tabindex="0" t-on-click="onClick">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="ContextMenuItem" t-call="baseui.ContextMenuItem"/>
+<t t-name="baseui.data-table">
+    <div class="baseui-data-table"/>
+  </t>
+  <t t-name="baseui.DataTable.Table">
+    <div class="baseui-data-table__viewport" t-att-style="viewportStyle">
+      <table class="table baseui-data-table__table">
+        <thead>
+          <tr>
+            <th t-if="hasSelection" class="baseui-data-table__selection-cell">
+              <input
+                type="checkbox"
+                class="form-check-input"
+                aria-label="Select all rows"
+                t-att-checked="pageRows.length &amp;&amp; pageRows.every((row, index) => this.isSelected(row, index))"
+                t-on-change="(event) => this.toggleAllVisible(event.target.checked)"
+              />
+            </th>
+            <th
+              t-foreach="visibleColumns"
+              t-as="column"
+              t-key="column.key"
+              t-att-class="column.align === 'right' ? 'text-end' : column.align === 'center' ? 'text-center' : ''"
+              t-att-b-att-sort="state.sortKey === column.key ? (state.sortDir === 1 ? 'asc' : 'desc') : undefined"
+            >
+              <button
+                t-if="isColumnSortable(column)"
+                type="button"
+                class="baseui-data-table__header-button"
+                t-on-click="() => this.sortBy(column.key)"
+              >
+                <span><t t-esc="columnLabel(column)"/></span>
+                <span class="baseui-data-table__sort-icon" t-att-data-icon="sortIcon(column.key)" aria-hidden="true"></span>
+              </button>
+              <t t-else="" t-esc="columnLabel(column)"/>
+            </th>
+            <th t-if="rowActions.length" class="baseui-data-table__actions-cell"><span class="visually-hidden">Actions</span></th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr t-if="!pageRows.length">
+            <td t-att-colspan="visibleColumns.length + (hasSelection ? 1 : 0) + (rowActions.length ? 1 : 0)" class="baseui-data-table__empty">
+              <t t-esc="emptyLabel"/>
+            </td>
+          </tr>
+          <tr
+            t-foreach="pageRows"
+            t-as="row"
+            t-key="rowKey(row, row_index)"
+            t-att-data-state="isSelected(row, row_index) ? 'selected' : undefined"
+          >
+            <td t-if="hasSelection" class="baseui-data-table__selection-cell">
+              <input
+                type="checkbox"
+                class="form-check-input"
+                aria-label="Select row"
+                t-att-checked="isSelected(row, row_index)"
+                t-on-change="(event) => this.toggleRow(row, row_index, event.target.checked)"
+              />
+            </td>
+            <td
+              t-foreach="visibleColumns"
+              t-as="column"
+              t-key="column.key"
+              t-att-class="column.align === 'right' ? 'text-end' : column.align === 'center' ? 'text-center' : ''"
+            >
+              <t t-if="column.component">
+                <t t-component="column.component" t-props="cellComponentProps(row, column)"/>
+              </t>
+              <span t-else="" t-att-class="column.format === 'currency' ? 'baseui-data-table__money' : ''"><t t-esc="cellValue(row, column)"/></span>
+            </td>
+            <td t-if="rowActions.length" class="baseui-data-table__actions-cell">
+              <div class="baseui-data-table__actions">
+                <Button variant="'ghost'" size="'icon'" icon="'ellipsis'" aria-label="'Open menu'" onClick="(event) => this.toggleRowActions(row, row_index, event)"/>
+              </div>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+  </t>
+  <t t-name="baseui.DataTable">
+    <div t-att-class="classNames" t-att-style="props.style" data-slot="data-table">
+      <div class="baseui-data-table__toolbar" t-if="hasSearch || hasColumnToggle || hasToolbarActions">
+        <input
+          t-if="hasSearch"
+          type="search"
+          class="form-control baseui-data-table__search"
+          t-att-placeholder="filterPlaceholder"
+          t-att-value="state.query"
+          t-on-input="onSearchInput"
+        />
+        <div t-if="hasColumnToggle || hasToolbarActions" class="baseui-data-table__toolbar-end">
+          <t t-if="hasToolbarActions" t-slot="toolbarActions"/>
+          <div t-if="hasColumnToggle" class="baseui-data-table__columns">
+            <Button variant="'outline'" label="'Columns'" icon="'chevron-down'" iconPosition="'end'" aria-label="'Toggle columns'" onClick="() => this.toggleColumnsMenu()"/>
+            <div t-if="state.columnsOpen" class="baseui-data-table__columns-menu" role="menu" data-state="open">
+              <label
+                t-foreach="columns.filter((column) => column.hideable !== false)"
+                t-as="column"
+                t-key="column.key"
+                class="baseui-data-table__columns-item"
+              >
+                <input
+                  type="checkbox"
+                  class="form-check-input"
+                  t-att-checked="!state.hiddenColumns.includes(column.key)"
+                  t-on-change="() => this.toggleColumn(column.key)"
+                />
+                <span><t t-esc="columnLabel(column)"/></span>
+              </label>
+            </div>
+          </div>
+        </div>
+      </div>
+      <t t-call="baseui.DataTable.Table"/>
+      <t t-call="baseui.DataTable.Cards"/>
+      <div class="baseui-data-table__pagination" t-if="hasPagination">
+        <div class="baseui-data-table__selection-summary">
+          <t t-esc="selectionLabel"/>
+        </div>
+        <div class="baseui-data-table__pager">
+          <div t-if="pageSizeOptions.length" class="baseui-data-table__page-size">
+            <span>Rows per page</span>
+            <select class="form-select form-select-sm" t-on-change="(event) => this.setPageSize(event.target.value)">
+              <option t-foreach="pageSizeOptions" t-as="option" t-key="option" t-att-value="optionValue(option)" t-att-selected="option === state.pageSize"><t t-esc="option"/></option>
+            </select>
+          </div>
+          <div class="baseui-data-table__page-label"><t t-esc="pageLabel"/></div>
+          <Button variant="'outline'" size="'sm'" label="'Previous'" aria-label="'Go to previous page'" disabled="!canPreviousPage" onClick="() => this.setPage(state.page - 1)"/>
+          <Button variant="'outline'" size="'sm'" label="'Next'" aria-label="'Go to next page'" disabled="!canNextPage" onClick="() => this.setPage(state.page + 1)"/>
+        </div>
+      </div>
+      <div t-if="openRowAction" t-portal="'body'" class="baseui-data-table__actions-menu" role="menu" data-state="open" t-att-style="state.actionMenuStyle" t-ref="actionsMenu">
+        <button
+          t-foreach="rowActions"
+          t-as="action"
+          t-key="action.label"
+          type="button"
+          class="baseui-data-table__actions-item"
+          role="menuitem"
+          t-on-click="() => this.onAction(action, openRowAction.row, openRowAction.index)"
+        >
+          <t t-esc="action.label"/>
+        </button>
+      </div>
+    </div>
+  </t>
+  <t t-name="DataTable" t-call="baseui.DataTable"/>
+<t t-name="baseui.DataTable.Cards">
+    <div class="baseui-data-table__cards">
+      <div t-if="!pageRows.length" class="baseui-data-table__empty-card">
+        <t t-esc="emptyLabel"/>
+      </div>
+      <div
+        t-foreach="pageRows"
+        t-as="row"
+        t-key="rowKey(row, row_index)"
+        class="baseui-data-table__card"
+        t-att-data-state="isSelected(row, row_index) ? 'selected' : undefined"
+      >
+        <div class="baseui-data-table__card-header" t-if="hasSelection || rowActions.length">
+          <input
+            t-if="hasSelection"
+            type="checkbox"
+            class="form-check-input"
+            aria-label="Select row"
+            t-att-checked="isSelected(row, row_index)"
+            t-on-change="(event) => this.toggleRow(row, row_index, event.target.checked)"
+          />
+          <div t-if="rowActions.length" class="baseui-data-table__actions">
+            <Button variant="'ghost'" size="'icon'" icon="'ellipsis'" aria-label="'Open menu'" onClick="(event) => this.toggleRowActions(row, row_index, event)"/>
+          </div>
+        </div>
+        <div class="baseui-data-table__card-field" t-foreach="visibleColumns" t-as="column" t-key="column.key">
+          <span class="baseui-data-table__card-label"><t t-esc="columnLabel(column)"/></span>
+          <span class="baseui-data-table__card-value">
+            <t t-if="column.component">
+              <t t-component="column.component" t-props="cellComponentProps(row, column)"/>
+            </t>
+            <span t-else="" t-att-class="column.format === 'currency' ? 'baseui-data-table__money' : ''"><t t-esc="cellValue(row, column)"/></span>
+          </span>
+        </div>
+      </div>
+    </div>
+  </t>
+<t t-name="baseui.date-picker">
+    <input class="form-control" type="date"/>
+  </t>
+  <t t-name="baseui.DatePicker">
+    <input
+      type="date"
+      t-att-class="classNames"
+      t-att-style="props.style"
+      t-att-value="props.value"
+      t-att-disabled="props.disabled"
+      t-on-input="onInput"
+    />
+  </t>
+  <t t-name="DatePicker" t-call="baseui.DatePicker"/>
+<t t-name="baseui.Dialog">
+    <div data-slot="dialog" t-att-style="props.style">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="Dialog" t-call="baseui.Dialog"/>
+
+  <t t-name="baseui.DialogTrigger">
+    <span class="baseui-dialog-trigger" data-slot="dialog-trigger" t-att-style="props.style" t-on-click="onClick">
+      <t t-slot="default"/>
+    </span>
+  </t>
+  <t t-name="DialogTrigger" t-call="baseui.DialogTrigger"/>
+
+  <t t-name="baseui.DialogContent">
+    <div t-ref="root" class="modal fade baseui-dialog-backdrop" data-slot="dialog-overlay" tabindex="-1" aria-hidden="true" t-att-style="props.style">
+      <div class="modal-dialog modal-dialog-centered">
+        <div t-att-class="'modal-content baseui-dialog-panel' + (props.className ? ' ' + props.className : '')" data-slot="dialog-content">
+          <t t-slot="default"/>
+          <button t-if="showCloseButton" type="button" class="btn baseui-button btn-light btn-icon-sm baseui-dialog-close baseui-dialog-close-control" data-slot="dialog-close" aria-label="Close" data-bs-dismiss="modal">
+            <Icon name="'x'"/>
+            <span class="visually-hidden">Close</span>
+          </button>
+        </div>
+      </div>
+    </div>
+  </t>
+  <t t-name="DialogContent" t-call="baseui.DialogContent"/>
+
+  <t t-name="baseui.DialogHeader">
+    <div t-att-class="'baseui-dialog-header' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" data-slot="dialog-header">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="DialogHeader" t-call="baseui.DialogHeader"/>
+
+  <t t-name="baseui.DialogFooter">
+    <div t-att-class="'baseui-dialog-footer' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" data-slot="dialog-footer">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="DialogFooter" t-call="baseui.DialogFooter"/>
+
+  <t t-name="baseui.DialogTitle">
+    <h2 t-att-class="'baseui-dialog-title' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" data-slot="dialog-title">
+      <t t-slot="default"/>
+    </h2>
+  </t>
+  <t t-name="DialogTitle" t-call="baseui.DialogTitle"/>
+
+  <t t-name="baseui.DialogDescription">
+    <p t-att-class="'baseui-dialog-description' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" data-slot="dialog-description">
+      <t t-slot="default"/>
+    </p>
+  </t>
+  <t t-name="DialogDescription" t-call="baseui.DialogDescription"/>
+
+  <t t-name="baseui.DialogClose">
+    <button type="button" t-att-class="'btn baseui-button btn-outline-secondary baseui-dialog-close' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" data-slot="dialog-close" data-bs-dismiss="modal">
+      <t t-slot="default"/>
+    </button>
+  </t>
+  <t t-name="DialogClose" t-call="baseui.DialogClose"/>
+<t t-name="baseui.direction"><div b-ui="direction"><t t-esc="props.content"/></div></t>
+  <t t-name="baseui.Direction">
+    <div t-att-class="'baseui-direction' + (props.className ? ' ' + props.className : '')" t-att-dir="dir" t-att-style="props.style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="Direction" t-call="baseui.Direction"/>
+<t t-name="baseui.drawer"><div b-ui="drawer"><div b-drawer-panel=""><t t-esc="props.content"/></div></div></t>
+  <t t-name="baseui.Drawer"><t t-slot="default"/></t>
+  <t t-name="Drawer" t-call="baseui.Drawer"/>
+  <t t-name="baseui.DrawerTrigger">
+    <button type="button" class="btn baseui-button btn-outline-secondary baseui-drawer-trigger" t-att-style="props.style" t-on-click="onClick"><t t-slot="default"/></button>
+  </t>
+  <t t-name="DrawerTrigger" t-call="baseui.DrawerTrigger"/>
+  <t t-name="baseui.DrawerContent">
+    <div t-ref="root" class="offcanvas offcanvas-bottom baseui-drawer-overlay" tabindex="-1" t-att-style="props.style">
+      <div class="baseui-drawer-panel">
+        <t t-slot="default"/>
+      </div>
+    </div>
+  </t>
+  <t t-name="DrawerContent" t-call="baseui.DrawerContent"/>
+  <t t-name="baseui.DrawerHeader"><div class="baseui-drawer-header" t-att-style="props.style"><t t-slot="default"/></div></t>
+  <t t-name="DrawerHeader" t-call="baseui.DrawerHeader"/>
+  <t t-name="baseui.DrawerFooter"><div class="baseui-drawer-footer" t-att-style="props.style"><t t-slot="default"/></div></t>
+  <t t-name="DrawerFooter" t-call="baseui.DrawerFooter"/>
+  <t t-name="baseui.DrawerTitle"><h2 class="baseui-drawer-title" t-att-style="props.style"><t t-slot="default"/></h2></t>
+  <t t-name="DrawerTitle" t-call="baseui.DrawerTitle"/>
+  <t t-name="baseui.DrawerDescription"><p class="baseui-drawer-description" t-att-style="props.style"><t t-slot="default"/></p></t>
+  <t t-name="DrawerDescription" t-call="baseui.DrawerDescription"/>
+  <t t-name="baseui.DrawerClose">
+    <button type="button" class="btn baseui-button btn-outline-secondary baseui-drawer-close" t-att-style="props.style" data-bs-dismiss="offcanvas"><t t-slot="default"/></button>
+  </t>
+  <t t-name="DrawerClose" t-call="baseui.DrawerClose"/>
+<t t-name="baseui.dropdown-menu">
+    <div b-ui="dropdown-menu">
+      <button b-dropdown-trigger="" type="button"><t t-esc="props.label"/></button>
+      <div b-dropdown-menu=""><t t-slot="default"/></div>
+    </div>
+  </t>
+  <t t-name="baseui.DropdownMenu">
+    <div data-slot="dropdown-menu" t-att-class="'baseui-dropdown-menu dropdown' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" t-ref="root">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="DropdownMenu" t-call="baseui.DropdownMenu"/>
+  <t t-name="baseui.DropdownMenuTrigger">
+    <button t-ref="root" type="button" data-slot="dropdown-menu-trigger" t-att-class="classNames" t-att-style="props.style" aria-haspopup="menu" t-att-aria-expanded="env.dropdownMenu.open ? 'true' : 'false'" t-on-click="onClick">
+      <t t-slot="default"/>
+    </button>
+  </t>
+  <t t-name="DropdownMenuTrigger" t-call="baseui.DropdownMenuTrigger"/>
+  <t t-name="baseui.DropdownMenuContent">
+    <div data-slot="dropdown-menu-content" t-att-class="classNames" t-att-style="props.style" role="menu" t-att-data-state="open ? 'open' : 'closed'" data-side="bottom" tabindex="-1">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="DropdownMenuContent" t-call="baseui.DropdownMenuContent"/>
+  <t t-name="baseui.DropdownMenuGroup">
+    <div data-slot="dropdown-menu-group" role="group" t-att-class="props.className" t-att-style="props.style">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="DropdownMenuGroup" t-call="baseui.DropdownMenuGroup"/>
+  <t t-name="baseui.DropdownMenuLabel">
+    <div data-slot="dropdown-menu-label" t-att-data-inset="props.inset ? '' : undefined" t-att-class="'baseui-dropdown-menu-label' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="DropdownMenuLabel" t-call="baseui.DropdownMenuLabel"/>
+  <t t-name="baseui.DropdownMenuItem">
+    <div data-slot="dropdown-menu-item" t-att-data-inset="props.inset ? '' : undefined" t-att-data-variant="variant" t-att-aria-disabled="props.disabled ? 'true' : undefined" t-att-class="'baseui-dropdown-menu-item' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" role="menuitem" tabindex="0" t-on-click="onClick">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="DropdownMenuItem" t-call="baseui.DropdownMenuItem"/>
+  <t t-name="baseui.DropdownMenuCheckboxItem">
+    <div data-slot="dropdown-menu-checkbox-item" t-att-data-inset="props.inset ? '' : undefined" t-att-data-checked="props.checked ? '' : undefined" t-att-aria-checked="props.checked ? 'true' : 'false'" t-att-aria-disabled="props.disabled ? 'true' : undefined" t-att-class="'baseui-dropdown-menu-checkbox-item' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" role="menuitemcheckbox" tabindex="0" t-on-click="onClick">
+      <span data-slot="dropdown-menu-checkbox-item-indicator" class="baseui-dropdown-menu-item-indicator">
+        <Icon t-if="props.checked" name="'check'"/>
+      </span>
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="DropdownMenuCheckboxItem" t-call="baseui.DropdownMenuCheckboxItem"/>
+  <t t-name="baseui.DropdownMenuRadioGroup">
+    <div data-slot="dropdown-menu-radio-group" role="group" t-att-class="props.className" t-att-style="props.style">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="DropdownMenuRadioGroup" t-call="baseui.DropdownMenuRadioGroup"/>
+  <t t-name="baseui.DropdownMenuRadioItem">
+    <div data-slot="dropdown-menu-radio-item" t-att-data-inset="props.inset ? '' : undefined" t-att-data-checked="checked ? '' : undefined" t-att-aria-checked="checked ? 'true' : 'false'" t-att-aria-disabled="props.disabled ? 'true' : undefined" t-att-class="'baseui-dropdown-menu-radio-item' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" role="menuitemradio" tabindex="0" t-on-click="onClick">
+      <span data-slot="dropdown-menu-radio-item-indicator" class="baseui-dropdown-menu-item-indicator">
+        <Icon t-if="checked" name="'check'"/>
+      </span>
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="DropdownMenuRadioItem" t-call="baseui.DropdownMenuRadioItem"/>
+  <t t-name="baseui.DropdownMenuSeparator">
+    <div data-slot="dropdown-menu-separator" class="baseui-dropdown-menu-separator" t-att-style="props.style" role="separator"/>
+  </t>
+  <t t-name="DropdownMenuSeparator" t-call="baseui.DropdownMenuSeparator"/>
+  <t t-name="baseui.DropdownMenuShortcut">
+    <span data-slot="dropdown-menu-shortcut" t-att-class="'baseui-dropdown-menu-shortcut' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <t t-slot="default"/>
+    </span>
+  </t>
+  <t t-name="DropdownMenuShortcut" t-call="baseui.DropdownMenuShortcut"/>
+  <t t-name="baseui.DropdownMenuSub">
+    <div data-slot="dropdown-menu-sub" class="baseui-dropdown-menu-sub" t-att-style="props.style" t-ref="root" t-on-mouseleave="env.dropdownSubClose">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="DropdownMenuSub" t-call="baseui.DropdownMenuSub"/>
+  <t t-name="baseui.DropdownMenuSubTrigger">
+    <div data-slot="dropdown-menu-sub-trigger" t-att-data-inset="props.inset ? '' : undefined" t-att-data-state="env.dropdownSub.open ? 'open' : 'closed'" t-att-aria-expanded="env.dropdownSub.open ? 'true' : 'false'" t-att-aria-disabled="props.disabled ? 'true' : undefined" t-att-class="'baseui-dropdown-menu-sub-trigger' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" role="menuitem" tabindex="0" aria-haspopup="menu" t-on-mouseenter="onMouseEnter" t-on-focus="onMouseEnter" t-on-click="onClick">
+      <t t-slot="default"/>
+      <Icon name="'chevron-right'" className="'baseui-dropdown-menu-sub-trigger-icon'"/>
+    </div>
+  </t>
+  <t t-name="DropdownMenuSubTrigger" t-call="baseui.DropdownMenuSubTrigger"/>
+  <t t-name="baseui.DropdownMenuSubContent">
+    <div t-if="open" data-slot="dropdown-menu-sub-content" t-att-class="'baseui-dropdown-menu-sub-content' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" role="menu" data-state="open" data-side="right" tabindex="-1">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="DropdownMenuSubContent" t-call="baseui.DropdownMenuSubContent"/>
+<t t-name="baseui.empty">
+    <div b-ui="empty"><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.Empty">
+    <div t-att-class="classNames" t-att-style="props.style" role="status"><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.EmptyHeader">
+    <div t-att-class="'baseui-empty-header' + (props.className ? ' ' + props.className : '')" t-att-style="props.style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.EmptyMedia">
+    <div t-att-class="classNames" t-att-data-variant="variant" t-att-style="props.style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.EmptyTitle">
+    <div t-att-class="'baseui-empty-title' + (props.className ? ' ' + props.className : '')" t-att-style="props.style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.EmptyDescription">
+    <div t-att-class="'baseui-empty-description' + (props.className ? ' ' + props.className : '')" t-att-style="props.style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.EmptyContent">
+    <div t-att-class="'baseui-empty-content' + (props.className ? ' ' + props.className : '')" t-att-style="props.style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="Empty" t-call="baseui.Empty"/>
+  <t t-name="EmptyHeader" t-call="baseui.EmptyHeader"/>
+  <t t-name="EmptyMedia" t-call="baseui.EmptyMedia"/>
+  <t t-name="EmptyTitle" t-call="baseui.EmptyTitle"/>
+  <t t-name="EmptyDescription" t-call="baseui.EmptyDescription"/>
+  <t t-name="EmptyContent" t-call="baseui.EmptyContent"/>
+<t t-name="baseui.field">
+    <div b-ui="field" class="baseui-field" role="group"><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.FieldSet">
+    <fieldset t-att-class="classNames" t-att-style="props.style" data-slot="field-set">
+      <t t-slot="default"/>
+    </fieldset>
+  </t>
+  <t t-name="FieldSet" t-call="baseui.FieldSet"/>
+
+  <t t-name="baseui.FieldLegend">
+    <legend t-att-class="classNames" t-att-style="props.style" data-slot="field-legend" t-att-data-variant="variant">
+      <t t-slot="default"/>
+    </legend>
+  </t>
+  <t t-name="FieldLegend" t-call="baseui.FieldLegend"/>
+
+  <t t-name="baseui.FieldGroup">
+    <div t-att-class="classNames" t-att-style="props.style" data-slot="field-group">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="FieldGroup" t-call="baseui.FieldGroup"/>
+
+  <t t-name="baseui.Field">
+    <div
+      role="group"
+      data-slot="field"
+      t-att-data-orientation="orientation"
+      t-att-data-invalid="props.invalid ? 'true' : undefined"
+      t-att-class="classNames"
+      t-att-style="props.style"
+    >
+      <label t-if="props.label" class="baseui-field-label" data-slot="field-label">
+        <t t-esc="props.label"/>
+      </label>
+      <t t-slot="default"/>
+      <div t-if="props.error" role="alert" class="baseui-field-error" data-slot="field-error">
+        <t t-esc="props.error"/>
+      </div>
+    </div>
+  </t>
+  <t t-name="Field" t-call="baseui.Field"/>
+
+  <t t-name="baseui.FieldContent">
+    <div t-att-class="classNames" t-att-style="props.style" data-slot="field-content">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="FieldContent" t-call="baseui.FieldContent"/>
+
+  <t t-name="baseui.FieldLabel">
+    <label t-att-class="classNames" t-att-style="props.style" t-att-for="props.for" data-slot="field-label">
+      <t t-slot="default"/>
+    </label>
+  </t>
+  <t t-name="FieldLabel" t-call="baseui.FieldLabel"/>
+
+  <t t-name="baseui.FieldTitle">
+    <div t-att-class="classNames" t-att-style="props.style" data-slot="field-label">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="FieldTitle" t-call="baseui.FieldTitle"/>
+
+  <t t-name="baseui.FieldDescription">
+    <p t-att-class="classNames" t-att-style="props.style" data-slot="field-description">
+      <t t-slot="default"/>
+    </p>
+  </t>
+  <t t-name="FieldDescription" t-call="baseui.FieldDescription"/>
+
+  <t t-name="baseui.FieldSeparator">
+    <div t-att-class="classNames" t-att-style="props.style" data-slot="field-separator" t-att-data-content="hasContent ? 'true' : 'false'">
+      <span class="baseui-field-separator-line" aria-hidden="true"></span>
+      <span t-if="hasContent" class="baseui-field-separator-content" data-slot="field-separator-content">
+        <t t-slot="default"/>
+      </span>
+    </div>
+  </t>
+  <t t-name="FieldSeparator" t-call="baseui.FieldSeparator"/>
+
+  <t t-name="baseui.FieldError">
+    <div role="alert" t-att-class="classNames" t-att-style="props.style" data-slot="field-error">
+      <t t-if="props.message" t-esc="props.message"/>
+      <t t-else="" t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="FieldError" t-call="baseui.FieldError"/>
+<t t-name="baseui.Form">
+    <form t-att-class="classNames" t-att-style="props.style" data-slot="form" novalidate="novalidate" t-on-submit="submit">
+      <div class="baseui-form-header">
+        <h3 class="baseui-form-title">Bug Report</h3>
+        <p class="baseui-form-description">Help us improve by reporting bugs you encounter.</p>
+      </div>
+
+      <FieldGroup className="'baseui-form-fields'">
+        <Field invalid="titleInvalid">
+          <FieldLabel for="'baseui-form-title'">Bug Title</FieldLabel>
+          <input
+            id="baseui-form-title"
+            name="title"
+            class="form-control baseui-form-control"
+            type="text"
+            t-att-placeholder="titlePlaceholder"
+            t-model="state.title"
+            autocomplete="off"
+            t-att-aria-invalid="titleInvalid ? 'true' : undefined"
+          />
+          <FieldError t-if="titleInvalid" message="errors.title"/>
+        </Field>
+
+        <Field invalid="descriptionInvalid">
+          <FieldLabel for="'baseui-form-description'">Description</FieldLabel>
+          <div class="baseui-form-input-group" data-slot="input-group" role="group">
+            <textarea
+              id="baseui-form-description"
+              name="description"
+              class="form-control baseui-form-textarea"
+              rows="6"
+              t-att-placeholder="descriptionPlaceholder"
+              t-att-maxlength="maxDescriptionLength"
+              t-model="state.description"
+              t-att-aria-invalid="descriptionInvalid ? 'true' : undefined"
+            ></textarea>
+            <div class="baseui-form-counter" data-slot="input-group-addon" data-align="block-end">
+              <span class="baseui-form-counter-text">
+                <t t-esc="descriptionLength"/>/<t t-esc="maxDescriptionLength"/> characters
+              </span>
+            </div>
+          </div>
+          <FieldDescription>Include steps to reproduce, expected behavior, and what actually happened.</FieldDescription>
+          <FieldError t-if="descriptionInvalid" message="errors.description"/>
+        </Field>
+      </FieldGroup>
+
+      <Field orientation="'horizontal'" className="'baseui-form-actions'">
+        <Button type="'button'" variant="'outline'" onClick="() => this.reset()">Reset</Button>
+        <Button type="'submit'">Submit</Button>
+      </Field>
+    </form>
+  </t>
+  <t t-name="Form" t-call="baseui.Form"/>
+<t t-name="baseui.hover-card"><span b-ui="hover-card"><t t-esc="props.content"/></span></t>
+  <t t-name="baseui.HoverCard">
+    <span
+      t-att-class="'baseui-hover-card' + (props.className ? ' ' + props.className : '')"
+      t-att-style="props.style"
+      t-on-mouseenter="() => this.open()"
+      t-on-mouseleave="() => this.close()"
+      t-on-focusin="() => this.open()"
+      t-on-focusout="() => this.close()"
+      t-on-keydown="onKeyDown"
+    >
+      <t t-slot="default"/>
+    </span>
+  </t>
+  <t t-name="HoverCard" t-call="baseui.HoverCard"/>
+  <t t-name="baseui.HoverCardTrigger">
+    <span class="baseui-hover-card-trigger" t-att-style="props.style" aria-haspopup="dialog"><t t-slot="default"/></span>
+  </t>
+  <t t-name="HoverCardTrigger" t-call="baseui.HoverCardTrigger"/>
+  <t t-name="baseui.HoverCardContent">
+    <span t-if="open" class="baseui-hover-card-content" t-att-style="props.style" role="dialog"><t t-slot="default"/></span>
+  </t>
+  <t t-name="HoverCardContent" t-call="baseui.HoverCardContent"/>
+<t t-name="baseui.Icon">
+    <span
+      t-att-b-icon="name"
+      t-att-class="classNames"
+      t-att-style="style"
+      t-att-title="props.title"
+      t-att-role="props.label ? 'img' : undefined"
+      t-att-aria-label="props.label || undefined"
+      t-att-aria-hidden="props.label ? undefined : 'true'"
+    ></span>
+  </t>
+  <t t-name="Icon" t-call="baseui.Icon"/>
+<t t-name="baseui.Input">
+    <input
+      t-att-class="classNames"
+      t-att-style="props.style"
+      t-att-type="props.type || 'text'"
+      t-att-placeholder="props.placeholder"
+      t-att-value="props.value"
+      t-att-disabled="props.disabled"
+      t-att-readonly="props.readonly"
+      t-att-id="props.id"
+      t-att-list="props.list"
+      t-att-autocomplete="props.autocomplete"
+      t-att-aria-label="ariaLabel"
+      t-att-min="props.min"
+      t-att-max="props.max"
+      t-att-step="props.step"
+      t-on-input="onInput"
+      t-on-change="onChange"
+    />
+  </t>
+  <t t-name="Input" t-call="baseui.Input"/>
+<t t-name="baseui.input-group"><div b-ui="input-group"><t t-esc="props.content"/></div></t>
+  <t t-name="baseui.InputGroup">
+    <div t-att-class="classNames" t-att-style="props.style" data-slot="input-group" role="group"><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.InputGroupAddon">
+    <div
+      t-att-class="classNames"
+      t-att-style="props.style"
+      t-att-data-align="align"
+      data-slot="input-group-addon"
+      role="group"
+      t-on-click="onClick"
+    ><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.InputGroupButton">
+    <button
+      t-att-class="classNames"
+      t-att-style="props.style"
+      t-att-type="props.type || 'button'"
+      t-att-disabled="props.disabled"
+      t-att-data-size="size"
+      t-att-aria-label="ariaLabel"
+      data-slot="input-group-button"
+      t-on-click="onClick"
+    ><t t-if="props.label" t-esc="props.label"/><t t-else="" t-slot="default"/></button>
+  </t>
+  <t t-name="baseui.InputGroupText">
+    <span t-att-class="classNames" t-att-style="props.style" data-slot="input-group-text"><t t-slot="default"/></span>
+  </t>
+  <t t-name="baseui.InputGroupInput">
+    <input
+      t-att-id="props.id"
+      t-att-name="props.name"
+      t-att-autocomplete="props.autocomplete"
+      t-att-class="classNames"
+      t-att-style="props.style"
+      t-att-type="props.type || 'text'"
+      t-att-placeholder="props.placeholder"
+      t-att-value="props.value"
+      t-att-disabled="props.disabled"
+      t-att-readonly="props.readonly"
+      t-att-aria-invalid="props.invalid ? 'true' : undefined"
+      data-slot="input-group-control"
+      t-on-input="onInput"
+      t-on-change="onChange"
+    />
+  </t>
+  <t t-name="baseui.InputGroupTextarea">
+    <textarea
+      t-att-class="classNames"
+      t-att-style="props.style"
+      t-att-placeholder="props.placeholder"
+      t-att-rows="props.rows"
+      t-att-disabled="props.disabled"
+      t-att-readonly="props.readonly"
+      t-att-value="props.value"
+      t-att-aria-invalid="props.invalid ? 'true' : undefined"
+      data-slot="input-group-control"
+      t-on-input="onInput"
+      t-on-change="onChange"
+    ></textarea>
+  </t>
+  <t t-name="InputGroup" t-call="baseui.InputGroup"/>
+  <t t-name="InputGroupAddon" t-call="baseui.InputGroupAddon"/>
+  <t t-name="InputGroupButton" t-call="baseui.InputGroupButton"/>
+  <t t-name="InputGroupText" t-call="baseui.InputGroupText"/>
+  <t t-name="InputGroupInput" t-call="baseui.InputGroupInput"/>
+  <t t-name="InputGroupTextarea" t-call="baseui.InputGroupTextarea"/>
+<t t-name="baseui.input-otp">
+    <div class="baseui-input-otp"/>
+  </t>
+  <t t-name="baseui.InputOtp">
+    <div t-att-class="classNames" t-att-style="props.style" t-ref="root" t-on-paste="onPaste">
+      <input
+        t-foreach="boxes"
+        t-as="box"
+        t-key="box.index"
+        class="form-control"
+        inputmode="numeric"
+        maxlength="1"
+        t-att-value="box.value"
+        t-att-disabled="props.disabled"
+        t-on-input="(ev) => this.onInput(box.index, ev)"
+      />
+    </div>
+  </t>
+  <t t-name="InputOtp" t-call="baseui.InputOtp"/>
+<t t-name="baseui.item"><div b-ui="item"><t t-esc="props.content"/></div></t>
+  <t t-name="baseui.Item">
+    <div t-att-class="classNames" t-att-data-variant="variant" t-att-style="props.style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="Item" t-call="baseui.Item"/>
+<t t-name="baseui.kbd"><kbd b-ui="kbd"><t t-esc="props.content"/></kbd></t>
+  <t t-name="baseui.Kbd"><kbd t-att-class="classNames" t-att-style="props.style"><t t-slot="default"/></kbd></t>
+  <t t-name="Kbd" t-call="baseui.Kbd"/>
+<t t-name="baseui.label">
+    <label b-ui="label"><t t-slot="default"/></label>
+  </t>
+  <t t-name="baseui.Label">
+    <label t-att-class="classNames" t-att-for="props.for" t-att-data-state="state" t-att-style="props.style">
+      <t t-slot="default"/>
+    </label>
+  </t>
+  <t t-name="Label" t-call="baseui.Label"/>
+<t t-name="baseui.marker"><span b-ui="marker"><t t-esc="props.content"/></span></t>
+  <t t-name="baseui.Marker"><span t-att-class="classNames" t-att-data-variant="variant" t-att-style="props.style"><t t-slot="default"/></span></t>
+  <t t-name="Marker" t-call="baseui.Marker"/>
+<t t-name="baseui.markdown">
+    <div class="baseui-markdown"/>
+  </t>
+  <t t-name="baseui.Markdown">
+    <div t-ref="root" t-att-class="classNames" t-att-style="props.style" data-slot="markdown" t-att-data-status="state.status">
+      <div t-if="state.status === 'loading'" class="baseui-markdown-loading" role="status">Loading…</div>
+      <div t-elif="state.status === 'error'" class="baseui-markdown-error" role="alert">
+        <t t-esc="state.error"/>
+      </div>
+      <div
+        t-elif="props.editable"
+        t-ref="editor"
+        class="baseui-markdown-editor"
+        data-slot="markdown-editor"
+        role="group"
+        t-att-aria-label="editorLabel"
+      />
+      <t t-else="">
+        <div t-if="hasFrontmatterMeta" class="baseui-markdown-meta">
+          <div t-if="state.frontmatter.authors and state.frontmatter.authors.length" class="baseui-markdown-meta-authors">
+            By <t t-esc="state.frontmatter.authors.join(', ')"/>
+          </div>
+          <div t-if="state.frontmatter.tags and state.frontmatter.tags.length" class="baseui-markdown-meta-tags">
+            <Badge t-foreach="state.frontmatter.tags" t-as="tag" t-key="tag" variant="'secondary'" pill="true"><t t-esc="tag"/></Badge>
+          </div>
+        </div>
+        <div t-out="state.html"/>
+      </t>
+    </div>
+  </t>
+  <t t-name="Markdown" t-call="baseui.Markdown"/>
+
+  <t t-name="baseui.MarkdownTree">
+    <div t-att-class="'baseui-markdown-tree' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" data-slot="markdown-tree">
+      <div t-if="state.status === 'loading'" class="baseui-markdown-tree-loading" role="status">Loading…</div>
+      <div t-elif="state.status === 'error'" class="baseui-markdown-tree-error" role="alert">
+        <t t-esc="state.error"/>
+      </div>
+      <SidebarGroup t-else="">
+        <SidebarMenu>
+          <t t-foreach="state.tree.children || []" t-as="child" t-key="child.path || child.name">
+            <MarkdownTreeNode node="child" activePath="props.activePath" onSelect="props.onSelect"/>
+          </t>
+        </SidebarMenu>
+      </SidebarGroup>
+    </div>
+  </t>
+  <t t-name="MarkdownTree" t-call="baseui.MarkdownTree"/>
+
+  <t t-name="baseui.MarkdownTreeNode">
+    <t t-if="props.node.type === 'file'">
+      <t t-if="props.nested">
+        <DropdownMenuItem onClick="() => this.select(props.node.path)">
+          <t t-esc="label"/>
+        </DropdownMenuItem>
+      </t>
+      <t t-else="">
+        <SidebarMenuItem>
+          <SidebarMenuButton icon="'file-text'" active="props.activePath === props.node.path" onClick="() => this.select(props.node.path)">
+            <t t-esc="label"/>
+          </SidebarMenuButton>
+        </SidebarMenuItem>
+      </t>
+    </t>
+    <t t-elif="hasSubfolders">
+      <t t-if="props.nested">
+        <DropdownMenuSub>
+          <DropdownMenuSubTrigger><t t-esc="label"/></DropdownMenuSubTrigger>
+          <DropdownMenuSubContent>
+            <t t-foreach="props.node.children" t-as="child" t-key="child.path || child.name">
+              <MarkdownTreeNode node="child" activePath="props.activePath" onSelect="props.onSelect" nested="true"/>
+            </t>
+          </DropdownMenuSubContent>
+        </DropdownMenuSub>
+      </t>
+      <t t-else="">
+        <SidebarMenuItem>
+          <DropdownMenu>
+            <DropdownMenuTrigger className="'baseui-sidebar-menu-button baseui-markdown-tree-folder-trigger'"><Icon name="'folder'" className="'baseui-sidebar-menu-icon'"/><span class="baseui-sidebar-menu-label"><t t-esc="label"/></span><Icon name="'chevron-right'" className="'baseui-markdown-tree-folder-trigger-icon'"/></DropdownMenuTrigger>
+            <DropdownMenuContent>
+              <t t-foreach="props.node.children" t-as="child" t-key="child.path || child.name">
+                <MarkdownTreeNode node="child" activePath="props.activePath" onSelect="props.onSelect" nested="true"/>
+              </t>
+            </DropdownMenuContent>
+          </DropdownMenu>
+        </SidebarMenuItem>
+      </t>
+    </t>
+    <t t-else="">
+      <t t-if="props.nested">
+        <DropdownMenuSub>
+          <DropdownMenuSubTrigger><t t-esc="label"/></DropdownMenuSubTrigger>
+          <DropdownMenuSubContent>
+            <t t-foreach="props.node.children" t-as="child" t-key="child.path || child.name">
+              <MarkdownTreeNode node="child" activePath="props.activePath" onSelect="props.onSelect" nested="true"/>
+            </t>
+          </DropdownMenuSubContent>
+        </DropdownMenuSub>
+      </t>
+      <t t-else="">
+        <div class="baseui-markdown-tree-group">
+          <SidebarGroupLabel><t t-esc="label"/></SidebarGroupLabel>
+          <SidebarMenu>
+            <t t-foreach="props.node.children" t-as="child" t-key="child.path || child.name">
+              <MarkdownTreeNode node="child" activePath="props.activePath" onSelect="props.onSelect"/>
+            </t>
+          </SidebarMenu>
+        </div>
+      </t>
+    </t>
+  </t>
+  <t t-name="MarkdownTreeNode" t-call="baseui.MarkdownTreeNode"/>
+<t t-name="baseui.message">
+    <article class="baseui-message"/>
+  </t>
+  <t t-name="baseui.Message">
+    <article t-att-class="classNames" t-att-data-side="side" role="listitem" t-att-style="props.style">
+      <t t-slot="default"/>
+    </article>
+  </t>
+  <t t-name="Message" t-call="baseui.Message"/>
+<t t-name="baseui.message-scroller">
+    <div class="baseui-message-scroller"/>
+  </t>
+  <t t-name="baseui.MessageScroller">
+    <div t-att-class="'baseui-message-scroller' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" t-ref="root">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="MessageScroller" t-call="baseui.MessageScroller"/>
+<t t-name="baseui.menubar"><nav b-ui="menubar"><t t-esc="props.content"/></nav></t>
+  <t t-name="baseui.Menubar"><nav t-att-class="classNames" role="menubar" t-att-style="props.style"><t t-slot="default"/></nav></t>
+  <t t-name="Menubar" t-call="baseui.Menubar"/>
+<t t-name="baseui.native-select">
+    <select b-ui="native-select"><t t-slot="default"/></select>
+  </t>
+  <t t-name="baseui.NativeSelect">
+    <select t-att-class="classNames" t-att-disabled="props.disabled" t-att-value="props.value"
+            t-att-aria-label="ariaLabel" t-att-id="props.id" t-att-style="props.style" t-on-change="onChange">
+      <t t-slot="default"/>
+    </select>
+  </t>
+  <t t-name="NativeSelect" t-call="baseui.NativeSelect"/>
+<t t-name="baseui.navigation-menu">
+    <nav b-ui="navigation-menu"><t t-slot="default"/></nav>
+  </t>
+  <t t-name="baseui.NavigationMenu">
+    <nav
+      t-att-class="'baseui-navigation-menu' + (props.className ? ' ' + props.className : '')"
+      role="menubar"
+      t-ref="root"
+      t-att-style="props.style"
+      t-on-keydown="onKeyDown"
+    >
+      <t t-slot="default"/>
+    </nav>
+  </t>
+  <t t-name="NavigationMenu" t-call="baseui.NavigationMenu"/>
+  <t t-name="baseui.NavigationMenuItem">
+    <a t-att-href="props.href || '#'" role="menuitem" t-att-class="props.className" t-att-style="props.style">
+      <t t-slot="default"/>
+    </a>
+  </t>
+  <t t-name="NavigationMenuItem" t-call="baseui.NavigationMenuItem"/>
+<t t-name="baseui.pagination">
+    <nav b-ui="pagination" aria-label="Pagination"><ul><t t-slot="default"/></ul></nav>
+  </t>
+  <t t-name="baseui.Pagination">
+    <nav t-att-class="classNames" aria-label="Pagination" t-att-style="props.style"><ul class="pagination"><t t-slot="default"/></ul></nav>
+  </t>
+  <t t-name="Pagination" t-call="baseui.Pagination"/>
+  <t t-name="baseui.PaginationItem">
+    <li t-att-class="classNames" t-att-style="props.style">
+      <a href="#" class="page-link" t-att-aria-current="props.current ? 'page' : undefined" t-on-click.prevent="onClick">
+        <t t-slot="default"/>
+      </a>
+    </li>
+  </t>
+  <t t-name="PaginationItem" t-call="baseui.PaginationItem"/>
+<t t-name="baseui.popover">
+    <span b-ui="popover">
+      <button b-popover-trigger="" type="button"><t t-esc="props.label"/></button>
+      <span b-popover-content=""><t t-slot="default"/></span>
+    </span>
+  </t>
+  <t t-name="baseui.Popover">
+    <span t-att-class="'baseui-popover' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <t t-slot="default"/>
+    </span>
+  </t>
+  <t t-name="Popover" t-call="baseui.Popover"/>
+  <t t-name="baseui.PopoverTrigger">
+    <button t-ref="root" type="button" class="btn baseui-button btn-outline-secondary baseui-popover-trigger" aria-haspopup="dialog" t-att-aria-expanded="env.popover.open ? 'true' : 'false'" t-att-style="props.style" t-on-click="onClick">
+      <t t-slot="default"/>
+    </button>
+  </t>
+  <t t-name="PopoverTrigger" t-call="baseui.PopoverTrigger"/>
+  <!-- Rendered but never shown: Owl keeps this reactive so PopoverTrigger
+       can read its innerHTML as the bootstrap.Popover content string (see
+       popover.component.js). Bootstrap renders the actual visible popup
+       itself, appended to document.body. -->
+  <t t-name="baseui.PopoverContent">
+    <span t-ref="buffer" class="baseui-popover-content" t-att-style="style" aria-hidden="true">
+      <t t-if="props.content" t-esc="props.content"/>
+      <t t-else="" t-slot="default"/>
+    </span>
+  </t>
+  <t t-name="PopoverContent" t-call="baseui.PopoverContent"/>
+<t t-name="baseui.progress"><div b-ui="progress"></div></t>
+  <t t-name="baseui.Progress">
+    <div
+      t-att-class="classNames"
+      role="progressbar"
+      aria-valuemin="0"
+      t-att-aria-valuemax="max"
+      t-att-aria-valuenow="value"
+      t-att-style="style"
+    >
+      <span class="baseui-progress-indicator"></span>
+    </div>
+  </t>
+  <t t-name="Progress" t-call="baseui.Progress"/>
+<t t-name="baseui.pwa">
+    <div b-ui="pwa" hidden="hidden">
+      <div b-pwa-panel="">
+        <t t-slot="default"/>
+      </div>
+    </div>
+  </t>
+  <t t-name="baseui.Pwa"><t t-slot="default"/></t>
+  <t t-name="Pwa" t-call="baseui.Pwa"/>
+  <t t-name="baseui.PwaTrigger">
+    <button type="button" class="btn baseui-button btn-primary baseui-pwa-trigger" t-att-style="props.style" t-on-click="onClick"><t t-slot="default"/></button>
+  </t>
+  <t t-name="PwaTrigger" t-call="baseui.PwaTrigger"/>
+  <t t-name="baseui.PwaContent">
+    <div
+      t-if="open"
+      class="baseui-pwa-overlay"
+      t-ref="root"
+      t-att-style="props.style"
+      t-on-keydown="onKeyDown"
+      t-on-click="onBackdropClick"
+    >
+      <div class="baseui-pwa-panel" role="dialog" aria-modal="true">
+        <t t-slot="default"/>
+      </div>
+    </div>
+  </t>
+  <t t-name="PwaContent" t-call="baseui.PwaContent"/>
+  <t t-name="baseui.PwaHeader"><div class="baseui-pwa-header" t-att-style="props.style"><t t-slot="default"/></div></t>
+  <t t-name="PwaHeader" t-call="baseui.PwaHeader"/>
+  <t t-name="baseui.PwaTitle"><h2 class="baseui-pwa-title" t-att-style="props.style"><t t-slot="default"/></h2></t>
+  <t t-name="PwaTitle" t-call="baseui.PwaTitle"/>
+  <t t-name="baseui.PwaDescription"><p class="baseui-pwa-description" t-att-style="props.style"><t t-slot="default"/></p></t>
+  <t t-name="PwaDescription" t-call="baseui.PwaDescription"/>
+  <t t-name="baseui.PwaBody"><div class="baseui-pwa-body" t-att-style="props.style"><t t-slot="default"/></div></t>
+  <t t-name="PwaBody" t-call="baseui.PwaBody"/>
+  <t t-name="baseui.PwaSteps">
+    <ol class="baseui-pwa-steps" t-att-style="props.style">
+      <t t-foreach="steps" t-as="step" t-key="step_index">
+        <li>
+          <span class="baseui-pwa-step-index" t-esc="step_index + 1"/>
+          <span t-esc="step"/>
+        </li>
+      </t>
+    </ol>
+  </t>
+  <t t-name="PwaSteps" t-call="baseui.PwaSteps"/>
+  <t t-name="baseui.PwaFooter"><div class="baseui-pwa-footer" t-att-style="props.style"><t t-slot="default"/></div></t>
+  <t t-name="PwaFooter" t-call="baseui.PwaFooter"/>
+  <t t-name="baseui.PwaClose">
+    <button type="button" class="btn baseui-button btn-outline-secondary baseui-pwa-close" t-att-style="props.style" t-on-click="onClick"><t t-slot="default"/></button>
+  </t>
+  <t t-name="PwaClose" t-call="baseui.PwaClose"/>
+<t t-name="baseui.questionnaire">
+    <form class="baseui-questionnaire"/>
+  </t>
+  <t t-name="baseui.Questionnaire">
+    <form t-att-class="'baseui-questionnaire' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" t-on-submit.prevent="">
+      <t t-slot="default"/>
+    </form>
+  </t>
+  <t t-name="Questionnaire" t-call="baseui.Questionnaire"/>
+  <t t-name="baseui.QuestionnaireStep">
+    <div t-if="active" class="baseui-questionnaire-step" t-att-style="props.style"><t t-slot="default"/></div>
+  </t>
+  <t t-name="QuestionnaireStep" t-call="baseui.QuestionnaireStep"/>
+  <t t-name="baseui.QuestionnairePrevious">
+    <button type="button" class="baseui-questionnaire-prev" t-att-style="props.style" t-att-disabled="disabled" t-on-click="onClick">
+      <t t-slot="default"/>
+    </button>
+  </t>
+  <t t-name="QuestionnairePrevious" t-call="baseui.QuestionnairePrevious"/>
+  <t t-name="baseui.QuestionnaireNext">
+    <button type="button" class="baseui-questionnaire-next" t-att-style="props.style" t-on-click="onClick">
+      <t t-slot="default"/>
+    </button>
+  </t>
+  <t t-name="QuestionnaireNext" t-call="baseui.QuestionnaireNext"/>
+<t t-name="baseui.radio-group">
+    <label b-ui="radio-group"><input type="radio"/><t t-slot="default"/></label>
+  </t>
+  <t t-name="baseui.RadioGroup">
+    <div t-att-class="classNames" t-att-style="props.style" role="radiogroup"><t t-slot="default"/></div>
+  </t>
+  <t t-name="RadioGroup" t-call="baseui.RadioGroup"/>
+  <t t-name="baseui.RadioGroupItem">
+    <label t-att-class="'form-check baseui-check ' + (props.className || '')" t-att-style="props.style">
+      <input
+        type="radio"
+        class="form-check-input"
+        t-att-name="env.radioGroupName()"
+        t-att-checked="checked"
+        t-att-disabled="disabled"
+        t-on-change="onChange"
+      />
+      <t t-slot="default"/>
+    </label>
+  </t>
+  <t t-name="RadioGroupItem" t-call="baseui.RadioGroupItem"/>
+<t t-name="baseui.resizable">
+    <div class="baseui-resizable"/>
+  </t>
+  <t t-name="baseui.Resizable">
+    <div t-att-class="'baseui-resizable' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <div class="baseui-resizable-panel" t-ref="panel" t-att-style="panelStyle">
+        <t t-slot="default"/>
+      </div>
+      <div class="baseui-resizable-handle" t-on-pointerdown="onPointerDown"></div>
+    </div>
+  </t>
+  <t t-name="Resizable" t-call="baseui.Resizable"/>
+<t t-name="baseui.scroll-area">
+    <div class="baseui-scroll-area"/>
+  </t>
+  <t t-name="baseui.ScrollArea">
+    <div t-att-class="classNames" t-att-style="props.style" role="region" tabindex="0"><t t-slot="default"/></div>
+  </t>
+  <t t-name="ScrollArea" t-call="baseui.ScrollArea"/>
+<t t-name="baseui.separator">
+    <hr b-ui="separator"/>
+  </t>
+  <t t-name="baseui.Separator">
+    <hr t-att-class="classNames" t-att-style="props.style" role="separator" t-att-aria-orientation="vertical ? 'vertical' : 'horizontal'"/>
+  </t>
+  <t t-name="Separator" t-call="baseui.Separator"/>
+<t t-name="baseui.select"><div b-ui="select"><t t-esc="props.content"/></div></t>
+  <t t-name="baseui.Select">
+    <div t-att-class="classNames" t-att-style="props.style" t-ref="root"><t t-slot="default"/></div>
+  </t>
+  <t t-name="Select" t-call="baseui.Select"/>
+  <t t-name="baseui.SelectTrigger">
+    <button
+      type="button"
+      class="baseui-select-trigger"
+      aria-haspopup="listbox"
+      t-att-aria-expanded="env.select.open ? 'true' : 'false'"
+      t-att-style="props.style"
+      t-on-click="onClick"
+    >
+      <t t-slot="default"/>
+    </button>
+  </t>
+  <t t-name="SelectTrigger" t-call="baseui.SelectTrigger"/>
+  <t t-name="baseui.SelectContent">
+    <div t-if="open" class="baseui-select-content" t-att-style="props.style" role="listbox">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="SelectContent" t-call="baseui.SelectContent"/>
+  <t t-name="baseui.SelectItem">
+    <div
+      class="baseui-select-item"
+      role="option"
+      t-att-aria-selected="selected ? 'true' : 'false'"
+      t-att-style="props.style"
+      t-on-click="onClick"
+    >
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="SelectItem" t-call="baseui.SelectItem"/>
+<t t-name="baseui.shell">
+    <div b-ui="shell"><t t-slot="default"/></div>
+  </t>
+
+  <t t-name="baseui.Shell">
+    <div t-att-class="'baseui-shell' + (props.className ? ' ' + props.className : '')"
+         t-att-style="props.style"
+         t-att-b-att-collapsed="state.collapsed ? 'true' : 'false'">
+      <Sidebar open="props.open" defaultOpen="props.defaultOpen" onOpenChange="props.onOpenChange">
+        <t t-slot="default"/>
+      </Sidebar>
+
+      <t t-if="props.toast">
+        <Toast open="!!props.toast" variant="props.toast.variant or 'info'"
+               delay="props.toast.persistent ? 0 : (props.toast.delay or 4000)"
+               className="'baseui-shell-toast' + (props.toast.className ? ' ' + props.toast.className : '')"
+               onOpenChange="(open) => !open and this.dismissToast()">
+          <div t-esc="props.toast.message"/>
+          <t t-if="props.toast.actionLabel">
+            <Button variant="'outline'" size="'sm'" className="'ms-2'"
+                    label="props.toast.actionLabel" onClick="() => this.runToastAction()"/>
+          </t>
+        </Toast>
+      </t>
+
+      <t t-if="props.notificationPage">
+        <t t-component="props.notificationPage"/>
+      </t>
+
+      <t t-if="props.pwa">
+        <t t-component="props.pwa"/>
+      </t>
+    </div>
+  </t>
+  <t t-name="Shell" t-call="baseui.Shell"/>
+
+  <t t-name="baseui.ShellSidebar">
+    <SidebarContent className="props.className" style="props.style">
+      <t t-slot="default"/>
+    </SidebarContent>
+  </t>
+  <t t-name="ShellSidebar" t-call="baseui.ShellSidebar"/>
+
+  <t t-name="baseui.ShellSidebarHeader">
+    <div t-att-class="'baseui-shell-sidebar-header' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="ShellSidebarHeader" t-call="baseui.ShellSidebarHeader"/>
+
+  <t t-name="baseui.ShellNav">
+    <nav t-att-class="'baseui-shell-nav' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <t t-slot="default"/>
+    </nav>
+  </t>
+  <t t-name="ShellNav" t-call="baseui.ShellNav"/>
+
+  <t t-name="baseui.ShellMain">
+    <div t-att-class="'baseui-shell-main' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="ShellMain" t-call="baseui.ShellMain"/>
+
+  <t t-name="baseui.ShellHeader">
+    <header t-att-class="'baseui-shell-header' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <t t-slot="default"/>
+    </header>
+  </t>
+  <t t-name="ShellHeader" t-call="baseui.ShellHeader"/>
+
+  <t t-name="baseui.ShellContent">
+    <main t-att-class="'baseui-shell-content' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <t t-if="props.loading">
+        <div class="baseui-shell-content-skeleton" aria-busy="true" aria-live="polite">
+          <Skeleton className="'baseui-shell-content-skeleton-bar baseui-shell-content-skeleton-title'"/>
+          <Skeleton className="'baseui-shell-content-skeleton-bar'"/>
+          <Skeleton className="'baseui-shell-content-skeleton-bar'"/>
+          <Skeleton className="'baseui-shell-content-skeleton-bar baseui-shell-content-skeleton-short'"/>
+        </div>
+      </t>
+      <t t-else="">
+        <t t-slot="default"/>
+      </t>
+    </main>
+  </t>
+  <t t-name="ShellContent" t-call="baseui.ShellContent"/>
+
+  <t t-name="baseui.ShellUserMenu">
+    <div t-if="authState" t-att-class="'baseui-shell-user' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <t t-slot="default">
+        <span class="baseui-shell-user-name" t-esc="authState.username"/>
+        <button type="button" class="btn baseui-button btn-outline-secondary btn-sm" t-on-click="logout">Logout</button>
+      </t>
+    </div>
+  </t>
+  <t t-name="ShellUserMenu" t-call="baseui.ShellUserMenu"/>
+<t t-name="baseui.skeleton">
+    <span b-ui="skeleton"></span>
+  </t>
+  <t t-name="baseui.Skeleton">
+    <span t-att-class="classNames" t-att-style="props.style" aria-hidden="true"></span>
+  </t>
+  <t t-name="Skeleton" t-call="baseui.Skeleton"/>
+<t t-name="baseui.sheet">
+    <div b-ui="sheet">
+      <aside b-sheet-panel="">
+        <t t-slot="default"/>
+      </aside>
+    </div>
+  </t>
+  <t t-name="baseui.Sheet"><t t-slot="default"/></t>
+  <t t-name="Sheet" t-call="baseui.Sheet"/>
+  <t t-name="baseui.SheetTrigger">
+    <button type="button" class="btn baseui-button btn-outline-secondary baseui-sheet-trigger" t-att-style="props.style" t-on-click="onClick"><t t-slot="default"/></button>
+  </t>
+  <t t-name="SheetTrigger" t-call="baseui.SheetTrigger"/>
+  <t t-name="baseui.SheetContent">
+    <div t-ref="root" t-att-class="'offcanvas ' + placementClass + ' baseui-sheet-overlay'" t-att-style="props.style" tabindex="-1">
+      <aside class="baseui-sheet-panel">
+        <t t-slot="default"/>
+      </aside>
+    </div>
+  </t>
+  <t t-name="SheetContent" t-call="baseui.SheetContent"/>
+  <t t-name="baseui.SheetHeader"><div class="baseui-sheet-header" t-att-style="props.style"><t t-slot="default"/></div></t>
+  <t t-name="SheetHeader" t-call="baseui.SheetHeader"/>
+  <t t-name="baseui.SheetFooter"><div class="baseui-sheet-footer" t-att-style="props.style"><t t-slot="default"/></div></t>
+  <t t-name="SheetFooter" t-call="baseui.SheetFooter"/>
+  <t t-name="baseui.SheetTitle"><h2 class="baseui-sheet-title" t-att-style="props.style"><t t-slot="default"/></h2></t>
+  <t t-name="SheetTitle" t-call="baseui.SheetTitle"/>
+  <t t-name="baseui.SheetDescription"><p class="baseui-sheet-description" t-att-style="props.style"><t t-slot="default"/></p></t>
+  <t t-name="SheetDescription" t-call="baseui.SheetDescription"/>
+  <t t-name="baseui.SheetClose">
+    <button type="button" class="btn baseui-button btn-outline-secondary baseui-sheet-close" t-att-style="props.style" data-bs-dismiss="offcanvas"><t t-slot="default"/></button>
+  </t>
+  <t t-name="SheetClose" t-call="baseui.SheetClose"/>
+<t t-name="baseui.sidebar">
+    <aside b-ui="sidebar"><t t-slot="default"/></aside>
+  </t>
+  <t t-name="baseui.Sidebar">
+    <div t-att-class="classNames"
+         t-att-style="props.style"
+         data-slot="sidebar-wrapper"
+         t-att-data-state="sidebarState"
+         t-att-data-collapsible="collapsible"
+         t-att-data-variant="variant"
+         t-att-data-side="side"
+         t-on-keydown="onKeyDown">
+      <div t-if="state.open" class="baseui-sidebar-backdrop" data-slot="sidebar-backdrop" t-on-click="() => this.setOpen(false)"></div>
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="Sidebar" t-call="baseui.Sidebar"/>
+  <t t-name="SidebarProvider" t-call="baseui.Sidebar"/>
+  <t t-name="baseui.SidebarContent">
+    <aside t-att-class="'baseui-sidebar' + (open ? ' is-open' : '') + (props.className ? ' ' + props.className : '')"
+           t-att-style="props.style"
+           data-sidebar="sidebar"
+           data-slot="sidebar"
+           t-att-data-state="open ? 'expanded' : 'collapsed'">
+      <t t-slot="default"/>
+    </aside>
+  </t>
+  <t t-name="SidebarContent" t-call="baseui.SidebarContent"/>
+  <t t-name="baseui.SidebarHeader">
+    <div t-att-class="'baseui-sidebar-header' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" data-sidebar="header" data-slot="sidebar-header">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="SidebarHeader" t-call="baseui.SidebarHeader"/>
+  <t t-name="baseui.SidebarFooter">
+    <div t-att-class="'baseui-sidebar-footer' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" data-sidebar="footer" data-slot="sidebar-footer">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="SidebarFooter" t-call="baseui.SidebarFooter"/>
+  <t t-name="baseui.SidebarInset">
+    <main t-att-class="'baseui-sidebar-inset' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" data-slot="sidebar-inset">
+      <t t-slot="default"/>
+    </main>
+  </t>
+  <t t-name="SidebarInset" t-call="baseui.SidebarInset"/>
+  <t t-name="baseui.SidebarRail">
+    <button type="button"
+            t-att-class="'baseui-sidebar-rail' + (props.className ? ' ' + props.className : '')"
+            t-att-style="props.style"
+            data-sidebar="rail"
+            data-slot="sidebar-rail"
+            aria-label="Toggle Sidebar"
+            title="Toggle Sidebar"
+            tabindex="-1"
+            t-on-click="onClick"/>
+  </t>
+  <t t-name="SidebarRail" t-call="baseui.SidebarRail"/>
+  <t t-name="baseui.SidebarInput">
+    <input t-att-class="'baseui-sidebar-input' + (props.className ? ' ' + props.className : '')"
+           t-att-style="props.style"
+           data-sidebar="input"
+           data-slot="sidebar-input"
+           t-att-type="props.type || 'text'"
+           t-att-placeholder="props.placeholder"
+           t-att-value="props.value"/>
+  </t>
+  <t t-name="SidebarInput" t-call="baseui.SidebarInput"/>
+  <t t-name="baseui.SidebarSeparator">
+    <div t-att-class="'baseui-sidebar-separator' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" data-sidebar="separator" data-slot="sidebar-separator"/>
+  </t>
+  <t t-name="SidebarSeparator" t-call="baseui.SidebarSeparator"/>
+  <t t-name="baseui.SidebarClose">
+    <button type="button"
+            t-att-class="'baseui-sidebar-close' + (props.className ? ' ' + props.className : '')"
+            t-att-style="props.style"
+            data-sidebar="close"
+            data-slot="sidebar-close"
+            aria-label="props.label || 'Close Sidebar'"
+            t-on-click="onClick">
+      <Icon name="props.icon || 'x'" className="'baseui-sidebar-close-icon'"/>
+      <span t-if="props.label"><t t-esc="props.label"/></span>
+      <span t-else="" class="visually-hidden">Close Sidebar</span>
+      <t t-slot="default"/>
+    </button>
+  </t>
+  <t t-name="SidebarClose" t-call="baseui.SidebarClose"/>
+  <t t-name="baseui.SidebarGroup">
+    <div t-att-class="'baseui-sidebar-group' + (props.muted ? ' is-muted' : '') + (props.className ? ' ' + props.className : '')" t-att-style="props.style" data-sidebar="group" data-slot="sidebar-group">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="SidebarGroup" t-call="baseui.SidebarGroup"/>
+  <t t-name="baseui.SidebarGroupLabel">
+    <a t-if="props.href" t-att-href="props.href" t-att-class="'baseui-sidebar-group-label' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" data-sidebar="group-label" data-slot="sidebar-group-label">
+      <t t-slot="default"/>
+    </a>
+    <div t-else="" t-att-class="'baseui-sidebar-group-label' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" data-sidebar="group-label" data-slot="sidebar-group-label">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="SidebarGroupLabel" t-call="baseui.SidebarGroupLabel"/>
+  <t t-name="baseui.SidebarGroupAction">
+    <button type="button"
+            t-att-class="'baseui-sidebar-group-action' + (props.className ? ' ' + props.className : '')"
+            t-att-style="props.style"
+            data-sidebar="group-action"
+            data-slot="sidebar-group-action"
+            t-att-aria-label="ariaLabel"
+            t-on-click="onClick">
+      <Icon t-if="props.icon" name="props.icon"/>
+      <t t-slot="default"/>
+    </button>
+  </t>
+  <t t-name="SidebarGroupAction" t-call="baseui.SidebarGroupAction"/>
+  <t t-name="baseui.SidebarGroupContent">
+    <div t-att-class="'baseui-sidebar-group-content' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" data-sidebar="group-content" data-slot="sidebar-group-content">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="SidebarGroupContent" t-call="baseui.SidebarGroupContent"/>
+  <t t-name="baseui.SidebarGroupCollapsible">
+    <div t-att-class="'baseui-sidebar-group' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <button type="button"
+              t-att-class="'baseui-sidebar-group-trigger'"
+              data-sidebar="group-label"
+              data-slot="sidebar-group-label"
+              t-att-aria-expanded="open ? 'true' : 'false'"
+              t-on-click="toggle">
+        <t t-esc="props.label"/>
+        <Icon name="'chevron-down'" className="'baseui-sidebar-group-chevron' + (open ? ' is-open' : '')"/>
+      </button>
+      <div t-if="open" class="baseui-sidebar-group-content">
+        <t t-slot="default"/>
+      </div>
+    </div>
+  </t>
+  <t t-name="SidebarGroupCollapsible" t-call="baseui.SidebarGroupCollapsible"/>
+  <t t-name="baseui.SidebarMenu">
+    <ul t-att-class="'baseui-sidebar-menu' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" data-sidebar="menu" data-slot="sidebar-menu">
+      <t t-slot="default"/>
+    </ul>
+  </t>
+  <t t-name="SidebarMenu" t-call="baseui.SidebarMenu"/>
+  <t t-name="baseui.SidebarMenuItem">
+    <li t-att-class="'baseui-sidebar-menu-item' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" data-sidebar="menu-item" data-slot="sidebar-menu-item">
+      <t t-slot="default"/>
+    </li>
+  </t>
+  <t t-name="SidebarMenuItem" t-call="baseui.SidebarMenuItem"/>
+  <t t-name="baseui.SidebarMenuButton">
+    <a t-if="props.href"
+       t-att-href="props.href"
+       t-att-class="classNames"
+       t-att-style="props.style"
+       data-sidebar="menu-button"
+       data-slot="sidebar-menu-button"
+       t-att-data-active="isActive ? 'true' : undefined"
+       t-att-data-size="props.size || 'default'"
+       t-att-aria-current="isActive ? 'page' : undefined"
+       t-att-aria-disabled="props.disabled ? 'true' : undefined"
+       t-on-click="onClick">
+      <Icon t-if="props.icon" name="props.icon" className="'baseui-sidebar-menu-icon'"/>
+      <span class="baseui-sidebar-menu-label"><t t-slot="default"/></span>
+    </a>
+    <button t-else=""
+            type="button"
+            t-att-class="classNames"
+            t-att-style="props.style"
+            data-sidebar="menu-button"
+            data-slot="sidebar-menu-button"
+            t-att-data-active="isActive ? 'true' : undefined"
+            t-att-data-size="props.size || 'default'"
+            t-att-aria-current="isActive ? 'page' : undefined"
+            t-att-disabled="props.disabled"
+            t-on-click="onClick">
+      <Icon t-if="props.icon" name="props.icon" className="'baseui-sidebar-menu-icon'"/>
+      <span class="baseui-sidebar-menu-label"><t t-slot="default"/></span>
+    </button>
+  </t>
+  <t t-name="SidebarMenuButton" t-call="baseui.SidebarMenuButton"/>
+  <t t-name="baseui.SidebarMenuAction">
+    <button type="button"
+            t-att-class="'baseui-sidebar-menu-action' + (props.showOnHover ? ' show-on-hover' : '') + (props.className ? ' ' + props.className : '')"
+            t-att-style="props.style"
+            data-sidebar="menu-action"
+            data-slot="sidebar-menu-action"
+            t-att-aria-label="ariaLabel"
+            t-on-click="onClick">
+      <Icon t-if="props.icon" name="props.icon"/>
+      <t t-slot="default"/>
+    </button>
+  </t>
+  <t t-name="SidebarMenuAction" t-call="baseui.SidebarMenuAction"/>
+  <t t-name="baseui.SidebarMenuSub">
+    <ul t-att-class="'baseui-sidebar-menu-sub' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" data-sidebar="menu-sub" data-slot="sidebar-menu-sub">
+      <t t-slot="default"/>
+    </ul>
+  </t>
+  <t t-name="SidebarMenuSub" t-call="baseui.SidebarMenuSub"/>
+  <t t-name="baseui.SidebarMenuBadge">
+    <div t-att-class="'baseui-sidebar-menu-badge' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" data-sidebar="menu-badge" data-slot="sidebar-menu-badge">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="SidebarMenuBadge" t-call="baseui.SidebarMenuBadge"/>
+  <t t-name="baseui.SidebarMenuSkeleton">
+    <div t-att-class="'baseui-sidebar-menu-skeleton' + (props.className ? ' ' + props.className : '')" t-att-style="style" data-sidebar="menu-skeleton" data-slot="sidebar-menu-skeleton">
+      <span t-if="props.showIcon" class="baseui-sidebar-menu-skeleton-icon" data-sidebar="menu-skeleton-icon"></span>
+      <span class="baseui-sidebar-menu-skeleton-text" data-sidebar="menu-skeleton-text"></span>
+    </div>
+  </t>
+  <t t-name="SidebarMenuSkeleton" t-call="baseui.SidebarMenuSkeleton"/>
+  <t t-name="baseui.SidebarMenuSubItem">
+    <li t-att-class="'baseui-sidebar-menu-sub-item' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" data-sidebar="menu-sub-item" data-slot="sidebar-menu-sub-item">
+      <t t-slot="default"/>
+    </li>
+  </t>
+  <t t-name="SidebarMenuSubItem" t-call="baseui.SidebarMenuSubItem"/>
+  <t t-name="baseui.SidebarMenuSubButton">
+    <a t-if="props.href" t-att-href="props.href" t-att-class="classNames" t-att-style="props.style" data-sidebar="menu-sub-button" data-slot="sidebar-menu-sub-button" t-att-data-active="(props.active || props.isActive) ? 'true' : undefined" t-on-click="onClick">
+      <t t-slot="default"/>
+    </a>
+    <button t-else="" type="button" t-att-class="classNames" t-att-style="props.style" data-sidebar="menu-sub-button" data-slot="sidebar-menu-sub-button" t-att-data-active="(props.active || props.isActive) ? 'true' : undefined" t-on-click="onClick">
+      <t t-slot="default"/>
+    </button>
+  </t>
+  <t t-name="SidebarMenuSubButton" t-call="baseui.SidebarMenuSubButton"/>
+<t t-name="baseui.SidebarTrigger">
+    <button type="button"
+            t-att-class="'baseui-sidebar-trigger' + (props.className ? ' ' + props.className : '')"
+            t-att-style="props.style"
+            data-sidebar="trigger"
+            data-slot="sidebar-trigger"
+            aria-label="Toggle Sidebar"
+            t-on-click="onClick">
+      <Icon name="props.icon || 'panel-left'" className="'baseui-sidebar-trigger-icon'"/>
+      <span t-if="props.label"><t t-esc="props.label"/></span>
+      <span t-else="" class="visually-hidden">Toggle Sidebar</span>
+      <t t-slot="default"/>
+    </button>
+  </t>
+  <t t-name="SidebarTrigger" t-call="baseui.SidebarTrigger"/>
+<t t-name="baseui.slider"><input b-ui="slider" type="range"/></t>
+  <t t-name="baseui.Slider">
+    <input
+      type="range"
+      t-att-class="classNames"
+      t-att-min="props.min"
+      t-att-max="props.max"
+      t-att-step="props.step"
+      t-att-value="props.value"
+      t-att-disabled="props.disabled"
+      t-att-style="props.style"
+      t-on-input="onInput"
+    />
+  </t>
+  <t t-name="Slider" t-call="baseui.Slider"/>
+<t t-name="baseui.spinner">
+    <span b-ui="spinner"></span>
+  </t>
+  <t t-name="baseui.Spinner">
+    <span t-att-class="classNames" t-att-style="props.style" role="status">
+      <span class="visually-hidden" t-esc="label"/>
+    </span>
+  </t>
+  <t t-name="Spinner" t-call="baseui.Spinner"/>
+<t t-name="baseui.switch">
+    <label b-ui="switch"><input type="checkbox" role="switch"/><t t-slot="default"/></label>
+  </t>
+  <t t-name="baseui.Switch">
+    <label t-att-class="'form-check form-switch baseui-switch ' + (props.className || '')" t-att-style="props.style">
+      <input
+        type="checkbox"
+        role="switch"
+        class="form-check-input"
+        t-att-checked="props.checked"
+        t-att-disabled="props.disabled"
+        t-on-change="onChange"
+      />
+      <t t-slot="default"/>
+    </label>
+  </t>
+  <t t-name="Switch" t-call="baseui.Switch"/>
+<t t-name="baseui.table">
+    <table b-ui="table"><t t-slot="default"/></table>
+  </t>
+  <t t-name="baseui.Table">
+    <div t-if="props.responsive" class="table-responsive" t-att-style="props.style"><table t-att-class="classNames"><t t-slot="default"/></table></div>
+    <table t-else="" t-att-class="classNames" t-att-style="props.style"><t t-slot="default"/></table>
+  </t>
+  <t t-name="Table" t-call="baseui.Table"/>
+<t t-name="baseui.Tabs">
+    <div t-att-class="'baseui-tabs' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="Tabs" t-call="baseui.Tabs"/>
+
+  <t t-name="baseui.TabsList">
+    <div t-ref="list" role="tablist" t-att-class="'nav nav-tabs' + (props.className ? ' ' + props.className : '')" t-att-style="props.style" t-on-keydown="onKeyDown">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="TabsList" t-call="baseui.TabsList"/>
+
+  <t t-name="baseui.TabTrigger">
+    <button t-ref="root" type="button" role="tab" t-att-class="'rounded-0 rounded-top-1 ' + classNames" t-att-style="props.style" t-att-data-bs-target="'#' + panelId" t-att-aria-selected="isActive ? 'true' : 'false'" t-att-tabindex="isActive ? 0 : -1" t-att-disabled="props.disabled" t-on-click="onClick">
+      <t t-slot="default"/>
+    </button>
+  </t>
+  <t t-name="TabTrigger" t-call="baseui.TabTrigger"/>
+
+  <t t-name="baseui.TabsContainer">
+    <div t-att-class="'tab-content baseui-tabs-contents' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="TabsContainer" t-call="baseui.TabsContainer"/>
+
+  <t t-name="baseui.TabContent">
+    <div t-att-id="panelId" role="tabpanel" t-att-class="'tab-pane fade baseui-tabs-panel' + (initialActive ? ' show active' : '') + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <Card className="'baseui-tabs-panel-card rounded-0 '" style="'border-end-start-radius: 8px !important; border-end-end-radius: 4px !important;'">
+        <CardBody>
+          <t t-slot="default"/>
+        </CardBody>
+      </Card>
+    </div>
+  </t>
+  <t t-name="TabContent" t-call="baseui.TabContent"/>
+<t t-name="baseui.textarea">
+    <textarea b-ui="textarea"></textarea>
+  </t>
+  <t t-name="baseui.Textarea">
+    <textarea
+      t-att-class="classNames"
+      t-att-style="props.style"
+      t-att-placeholder="props.placeholder"
+      t-att-rows="props.rows"
+      t-att-disabled="props.disabled"
+      t-att-readonly="props.readonly"
+      t-att-value="props.value"
+      t-att-id="props.id"
+      t-on-input="onInput"
+      t-on-change="onChange"
+    ></textarea>
+  </t>
+  <t t-name="Textarea" t-call="baseui.Textarea"/>
+<t t-name="baseui.text-editor">
+    <div class="baseui-text-editor"/>
+  </t>
+  <t t-name="baseui.TextEditor">
+    <div t-att-class="classNames" t-att-style="props.style" data-slot="text-editor" t-att-data-status="state.status">
+      <div t-if="state.status === 'loading'" class="baseui-text-editor-loading" role="status">Loading…</div>
+      <div t-elif="state.status === 'error'" class="baseui-text-editor-error" role="alert">
+        <t t-esc="state.error"/>
+      </div>
+      <div
+        t-else=""
+        t-ref="editor"
+        class="baseui-text-editor-shell"
+        data-slot="text-editor-shell"
+        role="group"
+        t-att-aria-label="editorLabel"
+      />
+    </div>
+  </t>
+  <t t-name="TextEditor" t-call="baseui.TextEditor"/>
+<t t-name="baseui.ThemeButton">
+    <button
+      t-att-class="classNames"
+      t-att-style="props.style"
+      type="button"
+      b-theme-button=""
+      t-att-aria-label="label"
+      t-att-title="label"
+      t-att-aria-pressed="pressed"
+      t-on-click="onClick"
+    >
+      <Icon name="iconName" base-url="baseUrl"/>
+      <span class="visually-hidden" b-theme-button-label="" t-esc="label"/>
+    </button>
+  </t>
+  <t t-name="ThemeButton" t-call="baseui.ThemeButton"/>
+<t t-name="baseui.toast">
+    <div b-ui="toast"><t t-slot="default"/></div>
+  </t>
+  <t t-name="baseui.Toast">
+    <div t-ref="root" t-att-class="classNames" t-att-style="props.style" t-att-role="role">
+      <t t-slot="default"/>
+      <button type="button" class="btn baseui-button btn-light btn-icon-sm baseui-toast-close" data-bs-dismiss="toast" aria-label="Close">x</button>
+    </div>
+  </t>
+  <t t-name="Toast" t-call="baseui.Toast"/>
+<t t-name="baseui.tooltip">
+    <span b-ui="tooltip">
+      <span b-tooltip-trigger=""><t t-slot="trigger"/></span>
+      <span b-tooltip-content=""><t t-slot="default"/></span>
+    </span>
+  </t>
+  <t t-name="baseui.Tooltip">
+    <span t-att-class="'baseui-tooltip' + (props.className ? ' ' + props.className : '')" t-att-style="props.style">
+      <span t-ref="trigger" class="baseui-tooltip-trigger">
+        <t t-slot="trigger"/>
+      </span>
+      <!-- Rendered but never shown: Owl keeps this reactive so the component
+           can read its innerHTML as the bootstrap.Tooltip title/content
+           string (see tooltip.component.js). Bootstrap renders the actual
+           visible popup itself, appended to document.body. -->
+      <span t-ref="buffer" style="display:none" aria-hidden="true">
+        <t t-if="props.content" t-esc="props.content"/>
+        <t t-else="" t-slot="default"/>
+      </span>
+    </span>
+  </t>
+  <t t-name="Tooltip" t-call="baseui.Tooltip"/>
+<t t-name="baseui.toggle">
+    <button type="button"><t t-out="props.label"/></button>
+  </t>
+  <t t-name="baseui.Toggle">
+    <button type="button" t-att-class="classNames" t-att-style="props.style" t-att-aria-pressed="pressed ? 'true' : 'false'" t-on-click="onClick">
+      <t t-slot="default"/>
+    </button>
+  </t>
+  <t t-name="Toggle" t-call="baseui.Toggle"/>
+<t t-name="baseui.toggle-group">
+    <div class="btn-group" role="group"/>
+  </t>
+  <t t-name="baseui.ToggleGroup">
+    <div
+      t-att-class="'btn-group baseui-toggle-group' + (props.className ? ' ' + props.className : '')"
+      t-att-style="props.style"
+      t-att-role="props.multiple ? 'group' : 'radiogroup'"
+    >
+      <t t-slot="default"/>
+    </div>
+  </t>
+  <t t-name="ToggleGroup" t-call="baseui.ToggleGroup"/>
+  <t t-name="baseui.ToggleGroupItem">
+    <button
+      type="button"
+      class="btn btn-outline-secondary"
+      t-att-style="props.style"
+      t-att-aria-pressed="pressed ? 'true' : 'false'"
+      t-on-click="onClick"
+    >
+      <t t-slot="default"/>
+    </button>
+  </t>
+  <t t-name="ToggleGroupItem" t-call="baseui.ToggleGroupItem"/>
+<t t-name="baseui.typography">
+    <p b-ui="typography"><t t-slot="default"/></p>
+  </t>
+  <t t-name="baseui.Typography">
+    <p t-att-class="classNames" t-att-style="props.style"><t t-slot="default"/></p>
+  </t>
+  <t t-name="Typography" t-call="baseui.Typography"/>
+</templates>