luxen-ui 0.2.1 → 0.4.0

package/dist/skills/luxen-ui/references/dialog.md

@@ -345,6 +345,74 @@ Add `autofocus` to any focusable element inside the dialog to focus it automatic
 </l-dialog>
 ```
 
+### Without header
+
+Add `without-header` to drop the header row entirely (title and close slot). Useful for confirmation prompts where the body already carries the heading. Provide an accessible heading inside the body and rely on `Escape` or a footer action to close.
+
+```html
+<button
+  type="button"
+  class="l-button"
+  command="--show"
+  commandfor="dialog-without-header"
+>
+  Delete account
+</button>
+
+<l-dialog
+  id="dialog-without-header"
+  without-header
+>
+  <div class="grid justify-items-center gap-3 pb-2 text-center">
+    <span
+      class="flex size-12 items-center justify-center rounded-full bg-red-100 text-red-700 dark:bg-red-950 dark:text-red-300"
+    >
+      <svg
+        class="size-6"
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke="currentColor"
+        stroke-width="2"
+        stroke-linecap="round"
+        stroke-linejoin="round"
+        aria-hidden="true"
+      >
+        <path d="M12 9v4" />
+        <path d="M12 17h.01" />
+        <path
+          d="M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"
+        />
+      </svg>
+    </span>
+    <h2 class="text-lg font-semibold">Delete your account?</h2>
+    <p class="text-sm">
+      This action is permanent and cannot be undone. All your data, including projects and billing
+      history, will be erased.
+    </p>
+  </div>
+  <menu slot="footer">
+    <button
+      autofocus
+      type="button"
+      class="l-button"
+      command="--hide"
+      commandfor="dialog-without-header"
+    >
+      Cancel
+    </button>
+    <button
+      type="button"
+      class="l-button"
+      data-variant="destructive"
+      command="--hide"
+      commandfor="dialog-without-header"
+    >
+      Delete account
+    </button>
+  </menu>
+</l-dialog>
+```
+
 ## Accessibility
 
 ### Criteria
@@ -392,6 +460,14 @@ import 'luxen-ui/dialog';
 
 Open and close the dialog by toggling its `open` property, or via the [Invoker Commands API](https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API) from any light-DOM button. Custom commands must start with `--`.
 
+>
+> The Invoker Commands API is [✓ Baseline Newly Available (since 2025-12-12)](https://web-platform-dx.github.io/web-features-explorer/features/invoker-commands/). For older browser versions, load the [`invokers-polyfill`](https://npmx.dev/package/invokers-polyfill) once at app startup:
+> 
+> ```js
+> import 'invokers-polyfill';
+> ```
+> 
+
 <ApiTable :data="[
   { Command: '--show', Description: 'Sets `open = true`' },
   { Command: '--hide', Description: 'Sets `open = false`' },

package/dist/skills/luxen-ui/references/drawer.md

@@ -357,6 +357,14 @@ import 'luxen-ui/drawer';
 
 Open and close the drawer by toggling its `open` property, or via the [Invoker Commands API](https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API) from any light-DOM button. Custom commands must start with `--`.
 
+>
+> The Invoker Commands API is [✓ Baseline Newly Available (since 2025-12-12)](https://web-platform-dx.github.io/web-features-explorer/features/invoker-commands/). For older browser versions, load the [`invokers-polyfill`](https://npmx.dev/package/invokers-polyfill) once at app startup:
+> 
+> ```js
+> import 'invokers-polyfill';
+> ```
+> 
+
 <ApiTable :data="[
   { Command: '--show', Description: 'Sets `open = true`' },
   { Command: '--hide', Description: 'Sets `open = false`' },

package/dist/skills/luxen-ui/references/select.md

@@ -95,6 +95,6 @@ Selects are used to pick a single option from a dropdown list. Commonly used in
 ### CSS custom properties
 
 <ApiTable :data="[
-  { Name: '--radius', Description: 'Border radius (default: 4px)' },
+  { Name: '--border-radius', Description: 'Border radius (default: 4px)' },
   { Name: '--border-color', Description: 'Border color (adapts to light/dark)' },
 ]" />

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "luxen-ui",
-  "version": "0.2.1",
+  "version": "0.4.0",
   "description": "Modern web components and CSS-first UI library built with Lit. Framework-agnostic, customizable prefix, design tokens.",
   "keywords": [
     "custom-elements",