@muibook/components 1.5.0 → 1.6.0

package/dist/esm/components/mui-accordion/block/index.js

@@ -1,18 +1,18 @@
 import "../../mui-icons/down-chevron/index.js";
 import "../../mui-heading/index.js";
-class s extends HTMLElement {
+class c extends HTMLElement {
   constructor() {
     super(), this.summaryEl = null, this.detailEl = null, this.chevronEl = null, this.attachShadow({ mode: "open" }), this.accordionId = `accordion-detail-${Math.random().toString(36).substring(2, 9)}`;
   }
   connectedCallback() {
-    var o, a;
+    var o, r;
     if (customElements.get("mui-icon-right-chevron") || console.warn(
       "mui-accordion-block requires <mui-icon-right-chevron> to be defined. Please ensure it is imported and registered."
     ), customElements.get("mui-heading") || console.warn(
       "[mui-accordion-block] Warning: <mui-heading> is not registered. Please import it to ensure proper functionality."
     ), !this.shadowRoot) return;
-    const i = this.getAttribute("heading") || "Heading...", e = this.getAttribute("size") || "medium", r = this.getAttribute("level") || "3";
-    let n = (
+    const i = this.getAttribute("heading") || "Heading...", e = this.getAttribute("size") || "medium", s = this.getAttribute("level") || "3", a = this.getAttribute("detail-space"), n = a ? `detail-space-${a}` : "";
+    let d = (
       /*html*/
       `
     <style>
@@ -94,6 +94,10 @@ class s extends HTMLElement {
         padding: var(--space-600);
       }
 
+      .detail-space-none {
+        padding: 0;
+      }
+
       :host([first-child]) .accordion-summary {
         border-top: none;
       }
@@ -129,25 +133,25 @@ class s extends HTMLElement {
       aria-expanded="false"
       aria-controls="${this.accordionId}"
     >
-      <mui-heading size="6" level="${r}">${i}</mui-heading>
+      <mui-heading size="6" level="${s}">${i}</mui-heading>
       <div class="icon">
         <mui-icon-down-chevron size="x-small"></mui-icon-down-chevron>
       </div>
     </div>
 
     <div id="${this.accordionId}" class="accordion-detail">
-      <div class="accordion-detail-inner size-${e}-detail" inert>
+      <div class="accordion-detail-inner size-${e}-detail ${n}" inert>
         <slot name="detail">Insert Content</slot>
       </div>
     </div>
     
     `
     );
-    if (this.shadowRoot.innerHTML = n, this.summaryEl = this.shadowRoot.querySelector(".accordion-summary"), this.detailEl = this.shadowRoot.querySelector(".accordion-detail"), this.chevronEl = this.shadowRoot.querySelector("mui-icon-down-chevron"), !this.summaryEl || !this.detailEl || !this.chevronEl) {
+    if (this.shadowRoot.innerHTML = d, this.summaryEl = this.shadowRoot.querySelector(".accordion-summary"), this.detailEl = this.shadowRoot.querySelector(".accordion-detail"), this.chevronEl = this.shadowRoot.querySelector("mui-icon-down-chevron"), !this.summaryEl || !this.detailEl || !this.chevronEl) {
       console.error("Accordion elements not found");
       return;
     }
-    (o = this.summaryEl) == null || o.addEventListener("click", () => this.toggleAccordion()), (a = this.summaryEl) == null || a.addEventListener("keydown", (t) => {
+    (o = this.summaryEl) == null || o.addEventListener("click", () => this.toggleAccordion()), (r = this.summaryEl) == null || r.addEventListener("keydown", (t) => {
       (t.key === "Enter" || t.key === " ") && (t.preventDefault(), this.toggleAccordion());
     });
   }
@@ -165,4 +169,4 @@ class s extends HTMLElement {
     this.setOpen(!1);
   }
 }
-customElements.define("mui-accordion-block", s);
+customElements.define("mui-accordion-block", c);

package/dist/esm/components/mui-button/index.js

@@ -16,17 +16,19 @@ class v extends HTMLElement {
 
     :host {
       display: inline-block;
+      width: auto;
+      text-align: center;
     }
     button {
       vertical-align: baseline;
       border: none;
       cursor: pointer;
-      width: auto;
+      width: 100%;
       border-radius: var(--action-radius);
       padding: var(--action-padding);
       text-decoration: none;
       line-height: var(--action-line-height);
-      display: inline-block;
+      display: inherit;
       text-transform: none;
       overflow: visible;
       -webkit-appearance: button;
@@ -35,7 +37,8 @@ class v extends HTMLElement {
       font-weight: var(--action-font-weight);
       background: var(--action-primary-background);
       color: var(--action-primary-text-color);
-      border: var(--action-primary-stroke); 
+      border: var(--action-primary-stroke);
+      text-align: inherit;
     }
 
     // Turned back on for focus-visible

package/dist/esm/components/mui-link/index.js

@@ -16,7 +16,7 @@ class u extends HTMLElement {
       `
     <style>
 
-      :host { display: inline-flex; }
+      :host { display: inline-flex; width: auto; text-align: initial }
 
       a {
         color: var(--link-text-color-default);
@@ -27,6 +27,8 @@ class u extends HTMLElement {
         text-decoration: underline;
         text-underline-offset: var(--space-050);
         text-decoration-color: color-mix(in srgb, var(--text-color) 50%, transparent);
+        width: inherit;
+        display: inherit;
       }
 
       /* Turned back on for focus-visible */
@@ -65,11 +67,18 @@ class u extends HTMLElement {
       /* Button  
       ========================================= */
 
+      :host([variant="primary"]),
+      :host([variant="secondary"]),
+      :host([variant="tertiary"]),
+      :host([variant="attention"]) { display: inline-block; text-align: center; }
+
       :host([variant="primary"]) a,
       :host([variant="secondary"]) a,
       :host([variant="tertiary"]) a,
       :host([variant="attention"]) a {
-        display: inline-block;
+        display: inherit;
+        text-align: inherit;
+        width: 100%;
         text-decoration: none;
         padding: var(--space-200) var(--space-500);
         border-radius: var(--action-radius);
@@ -78,10 +87,7 @@ class u extends HTMLElement {
         line-height: var(--action-line-height);
       }
 
-      :host([variant="primary"]),
-      :host([variant="secondary"])
-      :host([variant="tertiary"]),
-      :host([variant="attention"]) { display: inline-block; }
+
 
       /* Button Primary 
       ========================================= */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@muibook/components",
-  "version": "1.5.0",
+  "version": "1.6.0",
   "type": "module",
   "description": "A library of MUI-based design system components.",
   "author": "Michael Trilford",