@jungherz-de/notionkit-elements 1.5.0 → 1.5.2

package/dist/components/nk-stat.js

@@ -1,4 +1,4 @@
-import { N as NkElement } from './shared/base-FHMDMonZ.js';
+import { N as NkElement } from './shared/base-AWFyTskN.js';
 
 // <nk-stat label="Active pages" value="128" delta="▲ 12 this week" trend="up"></nk-stat>
 // → <div class="nk-stat"><div class="s-label">…</div><div class="s-value">…</div><div class="s-delta up">…</div></div>

package/dist/components/nk-stats.js

@@ -1,4 +1,4 @@
-import { N as NkElement } from './shared/base-FHMDMonZ.js';
+import { N as NkElement } from './shared/base-AWFyTskN.js';
 
 // <nk-stats><nk-stat …></nk-stat>…</nk-stats>  →  <div class="nk-stats">
 class NkStats extends NkElement {

package/dist/components/nk-switch.js

@@ -1,4 +1,4 @@
-import { a as NkFormElement } from './shared/base-FHMDMonZ.js';
+import { a as NkFormElement } from './shared/base-AWFyTskN.js';
 
 // <nk-switch name="notify" checked></nk-switch>
 // → <button class="nk-switch" role="switch" aria-checked="true">

package/dist/components/nk-synced.js

@@ -1,4 +1,4 @@
-import { N as NkElement } from './shared/base-FHMDMonZ.js';
+import { N as NkElement } from './shared/base-AWFyTskN.js';
 
 // <nk-synced badge="⟳ 3 places">…</nk-synced>
 // → <div class="nk-synced"><span class="synced-badge">⟳ 3 places</span>…</div>

package/dist/components/nk-tab-bar-item.js

@@ -1,4 +1,4 @@
-import { N as NkElement } from './shared/base-FHMDMonZ.js';
+import { N as NkElement } from './shared/base-AWFyTskN.js';
 
 // <nk-tab-bar-item icon="📥" value="inbox" active>Inbox</nk-tab-bar-item>
 // → <button class="nk-tab-bar-item active" type="button">

package/dist/components/nk-tab-bar.js

@@ -1,4 +1,4 @@
-import { N as NkElement } from './shared/base-FHMDMonZ.js';
+import { N as NkElement } from './shared/base-AWFyTskN.js';
 
 // <nk-tab-bar value="inbox">
 //   <nk-tab-bar-item icon="🏠" value="home">Home</nk-tab-bar-item>

package/dist/components/nk-tab.js

@@ -1,4 +1,4 @@
-import { N as NkElement } from './shared/base-FHMDMonZ.js';
+import { N as NkElement } from './shared/base-AWFyTskN.js';
 
 // <nk-tab value="notes" active>📝 Notes</nk-tab>  →  <span class="nk-tab active" role="tab">
 class NkTab extends NkElement {

package/dist/components/nk-table-view.js

@@ -1,4 +1,4 @@
-import { N as NkElement } from './shared/base-FHMDMonZ.js';
+import { N as NkElement } from './shared/base-AWFyTskN.js';
 import { c as compareBy, r as renderPropertyCell } from './shared/property-cell-CtXQpUjQ.js';
 
 // <nk-table-view name="table" label="▦ Table" count new-row sortable wrap></nk-table-view>

package/dist/components/nk-tabs.js

@@ -1,4 +1,4 @@
-import { N as NkElement } from './shared/base-FHMDMonZ.js';
+import { N as NkElement } from './shared/base-AWFyTskN.js';
 
 // <nk-tabs value="notes">
 //   <nk-tab value="notes">📝 Notes</nk-tab>

package/dist/components/nk-tag.js

@@ -1,4 +1,4 @@
-import { N as NkElement } from './shared/base-FHMDMonZ.js';
+import { N as NkElement } from './shared/base-AWFyTskN.js';
 
 // <nk-tag color="blue">Text</nk-tag>  —  modifier class .blue becomes color="blue".
 // Notion's nine select colours; without `color` the stylesheet draws the grey tag.

package/dist/components/nk-template-btn.js

@@ -1,4 +1,4 @@
-import { N as NkElement } from './shared/base-FHMDMonZ.js';
+import { N as NkElement } from './shared/base-AWFyTskN.js';
 
 // <nk-template-btn icon="📅" value="week-plan">Insert week plan</nk-template-btn>
 // → <button class="nk-template-btn">📅 Insert week plan</button>

package/dist/components/nk-textarea.js

@@ -1,4 +1,4 @@
-import { a as NkFormElement } from './shared/base-FHMDMonZ.js';
+import { a as NkFormElement } from './shared/base-AWFyTskN.js';
 
 // <nk-textarea name="bio" rows="3" wide>Text</nk-textarea>  →  <textarea class="nk-textarea wide">
 // The initial value is the `value` attribute, or the element's text content.

package/dist/components/nk-theme-toggle.js

@@ -1,4 +1,4 @@
-import { N as NkElement, g as getCurrentTheme } from './shared/base-FHMDMonZ.js';
+import { N as NkElement, g as getCurrentTheme } from './shared/base-AWFyTskN.js';
 
 // <nk-theme-toggle slot="actions"></nk-theme-toggle>
 // → <button class="nk-topbar-btn nk-theme-toggle">🌙</button>

package/dist/components/nk-toast.js

@@ -1,8 +1,11 @@
-import { N as NkElement } from './shared/base-FHMDMonZ.js';
+import { N as NkElement } from './shared/base-AWFyTskN.js';
 
 // <nk-toast id="toast"></nk-toast>   …   toast.show('Saved');
 // → <div class="nk-toast show">✓ Saved</div>
 // One node, bottom-centred, auto-hides after `duration` ms (default 2200).
+// Above a tab bar at the bottom of the screen it rises 12px over the bar:
+// notionkit.css does that for class markup with :has(), which cannot see
+// into shadow roots, so the element measures the bar when it opens.
 class NkToast extends NkElement {
   static get observedAttributes() { return ['open', 'duration', 'icon']; }
 
@@ -16,12 +19,27 @@ class NkToast extends NkElement {
   }
 
   _sync() {
+    if (this.getBoolAttr('open')) this._lift();
     this._box.classList.toggle('show', this.getBoolAttr('open'));
     const icon = this.getAttribute('icon') ?? '✓';
     this._icon.textContent = icon;
     this._icon.style.display = icon ? '' : 'none';
   }
 
+  // A bar counts when it is rendered and ends near the bottom of the viewport –
+  // the app's own bar, fixed, sticky or floating. A tab bar shown as a preview
+  // somewhere in a page does not lift the toast.
+  _lift() {
+    const bars = [...document.querySelectorAll('.nk-tab-bar')];
+    for (const host of document.querySelectorAll('nk-tab-bar')) {
+      const bar = host.shadowRoot?.querySelector('.nk-tab-bar');
+      if (bar) bars.push(bar);
+    }
+    const rect = bars.map(b => b.getBoundingClientRect())
+      .find(r => r.height > 0 && r.top < innerHeight && r.bottom > innerHeight - 60);
+    this._box.style.bottom = rect ? `${Math.round(innerHeight - rect.top + 12)}px` : '';
+  }
+
   /** Shows `message` (or the slotted content when omitted) and hides it again after `duration`. */
   show(message, { duration } = {}) {
     if (message !== undefined) this._msg.textContent = message;

package/dist/components/nk-todo.js

@@ -1,4 +1,4 @@
-import { a as NkFormElement } from './shared/base-FHMDMonZ.js';
+import { a as NkFormElement } from './shared/base-AWFyTskN.js';
 
 // <nk-todo name="task" value="1" checked>Write the docs</nk-todo>
 // → <label class="nk-todo"><input type="checkbox"><span>Write the docs</span></label>

package/dist/components/nk-toggle.js

@@ -1,4 +1,4 @@
-import { N as NkElement } from './shared/base-FHMDMonZ.js';
+import { N as NkElement } from './shared/base-AWFyTskN.js';
 
 // <nk-toggle label="Details" open>Body…</nk-toggle>
 // → <details class="nk-toggle" open><summary>Details</summary><div class="toggle-body">…</div></details>

package/dist/components/nk-topbar.js

@@ -1,4 +1,4 @@
-import { N as NkElement } from './shared/base-FHMDMonZ.js';
+import { N as NkElement } from './shared/base-AWFyTskN.js';
 
 // <nk-topbar>
 //   <nk-breadcrumb>…</nk-breadcrumb>

package/dist/components/nk-tree-item.js

@@ -1,4 +1,4 @@
-import { N as NkElement } from './shared/base-FHMDMonZ.js';
+import { N as NkElement } from './shared/base-AWFyTskN.js';
 
 // <nk-tree-item icon="📊" value="overview" open>
 //   Project overview

package/dist/components/nk-tree.js

@@ -1,4 +1,4 @@
-import { N as NkElement } from './shared/base-FHMDMonZ.js';
+import { N as NkElement } from './shared/base-AWFyTskN.js';
 
 // <nk-tree>
 //   <nk-section-label addable>Favourites</nk-section-label>

package/dist/components/nk-workspace-switcher.js

@@ -1,4 +1,4 @@
-import { N as NkElement } from './shared/base-FHMDMonZ.js';
+import { N as NkElement } from './shared/base-AWFyTskN.js';
 
 // <nk-workspace-switcher slot="workspace" name="Acme" avatar="A">
 //   <nk-menu slot="menu">…</nk-menu>