@alacris/ui 0.8.0 → 0.8.2

package/README.md

@@ -47,9 +47,9 @@ The published package is plain ESM. Point an import map at a pinned CDN build of
 {
   "imports": {
     "@alacris/core": "https://cdn.jsdelivr.net/npm/@alacris/core@0.11.5/dist/alacris.js",
-    "@alacris/ui": "https://cdn.jsdelivr.net/npm/@alacris/ui@0.8.0/src/index.js",
-    "@alacris/ui/theme": "https://cdn.jsdelivr.net/npm/@alacris/ui@0.8.0/src/theme/index.js",
-    "@alacris/ui/components/": "https://cdn.jsdelivr.net/npm/@alacris/ui@0.8.0/src/components/"
+    "@alacris/ui": "https://cdn.jsdelivr.net/npm/@alacris/ui@0.8.2/src/index.js",
+    "@alacris/ui/theme": "https://cdn.jsdelivr.net/npm/@alacris/ui@0.8.2/src/theme/index.js",
+    "@alacris/ui/components/": "https://cdn.jsdelivr.net/npm/@alacris/ui@0.8.2/src/components/"
   }
 }
 </script>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alacris/ui",
-  "version": "0.8.0",
+  "version": "0.8.2",
   "description": "Themeable design system for Alacris — Material defaults, sixty-nine custom elements, ESM-only, no build step.",
   "type": "module",
   "exports": {

package/src/components/ui-drawer.js

@@ -104,7 +104,16 @@ const styles = css`
     border-start-start-radius: ${t.radius};
     border-end-start-radius: ${t.radius};
   }
-  .std .inner { padding: ${t.pad}; inline-size: ${t.width}; }
+  /* Fill the drawer's height and scroll when the content is taller (like the
+     modal surface), so slotted content can also size itself to 100%. */
+  .std .inner {
+    box-sizing: border-box;
+    padding: ${t.pad};
+    inline-size: ${t.width};
+    block-size: 100%;
+    overflow-y: auto;
+    overscroll-behavior: contain;
+  }
 `;
 
 define('ui-drawer', {

package/src/components/ui-search.js

@@ -283,11 +283,12 @@ define('ui-search', {
           <input part="input" ref=${(el) => (input = el)}
                  .value=${() => value() ?? ''}
                  placeholder=${ph}
+                 role="combobox"
                  aria-label=${() => label() || 'Search'}
                  aria-expanded=${() => String(open())}
                  aria-controls=${() => (showPanel() ? 'suggestions' : null)}
                  aria-autocomplete="list"
-                 aria-haspopup=${() => (isView() || slotted() ? 'true' : null)}
+                 aria-haspopup=${() => (isView() ? 'dialog' : slotted() ? 'listbox' : null)}
                  ?disabled=${disabled}
                  @input=${onInput} @change=${commit} @keydown=${onKeydown}
                  @focus=${onFocus}>