@jirawatpyk/aura-react 5.78.0 → 5.79.0

package/README.md

@@ -186,6 +186,19 @@ DataTable with sort and page in the URL (4.17): `onStateChange={({ sort, page })
 - **Time zone**: `timeZone` on AuraProvider, DatePicker, DateRangePicker and Calendar decides "today" (the marker, `min`/`max="today"`, the first month shown); or pass `today` as an ISO date. `todayIn('Asia/Bangkok')` is exported from the root and `/server`.
 - **Toasts** queue past three instead of dropping: six in a row all show, in order, three at a time.
 
+## 5.79 — visual audit, set 3 (component by component)
+
+- **One disabled look for every Button variant:** a faint fill (`--aura-button-disabled-bg`: zinc-100 light, none in dark), a faint edge (`--aura-button-disabled-border` — the variant's own border, or 1px inside for primary and danger) and the tertiary label, at full opacity — primary, secondary, danger, creative and `aria-disabled` alike; a ghost button has neither fill nor edge. (5.30 gave filled buttons a grey fill that read as a To Do pill and faded outline ones.)
+- **ActionBar `look="edge"` in an AppShell on a desktop** starts after the sidebar (the rail width when collapsed; the right edge in RTL) and lines its contents up with the content's 32px padding (not with `contentPadding={false}`), instead of running under the sidebar. It reads the sidebar's width from `--aura-sidenav-width` / `--aura-sidenav-rail-width`: to change it, set the token on `.aura-shell` or `:root`, not on the nav — and a custom `nav` set them to its width. Outside an AppShell it keeps the screen's width; `edgeBelow` is unchanged (no sidebar there).
+- **A list box** (`<Select multiple>` or `size` > 1) shows its rows, as tall as they need, without the chevron.
+- **Combobox `multiple`:** a chip no longer shrinks to "V.."; it keeps its label and moves to the next line (a label wider than the field still ends in "…").
+- **Switch with an `icon`** (a locked, read-only switch): the lock sits 8px after the label, not at the row's far end. Its colours stay as 5.19 set them.
+- **Menu / DropdownMenu:** a menu whose items have no icon, check box or radio has no empty icon column; it opens on its trigger's left edge when ending on its right would cross the screen (LTR; positioning stays physical, as before); and it is lifted with `--aura-shadow-overlay`, as Popover and the list boxes.
+- **Small fixes:** FileUpload's hint names formats (PNG, JPEG, SVG, DOCX, XLSX), not "IMAGE/PNG"; an outline Badge has a quieter edge (its colour at 45%), so it doesn't read as a secondary Button; a date range is a violet-100 band in light (`--aura-calendar-range-bg`, the brand's 100 step in `createTheme`), visible on white; a disabled field's edge shows in dark (`--aura-input-disabled-border`, zinc-700).
+- **Thai:** a Calendar with a Thai locale carries `lang="th"` and its weekday row is 13px; two-line Thai SideNav labels get room between lines; Combobox options have fixed line heights, so Thai and English rows are spaced alike.
+- **PageHeader:** where `actionsFullWidthBelow` reaches wider than `actionsBarBelow`, every button in the row is `radius-md` between the two breakpoints (5.78 left the bar's buttons as pills there).
+- **Stories:** the ⋯ beside outline buttons in action rows is `variant="outline"` (keep it so in an action row); the launch page shows with its own styles.
+
 ## 5.78 — visual audit, set 2 (phones)
 
 - **Bottom strips on a phone follow one rule:** ActionBar's edge strip (`look="edge"`, `edgeBelow`) now lays out as PageHeader's bar (5.48) — the status on its own row at the top, the actions sharing the row under it (an IconButton keeps its square; labels too long to share take a row each, as PageHeader's) — and both strips are 16px from either side, the page's phone gutter (they were 16 and 12). `edgeBelow="md"` follows it up to 768px. A single label wider than the screen still overflows, as in PageHeader's strip — keep bar labels short.

package/dist/aura.bundle.js

@@ -1929,7 +1929,8 @@ window.Aura = (() => {
           top = r2.top - above - 4;
         } else maxHeight = below2;
       }
-      const left = Math.max(8, Math.min(r2.right - mw, window.innerWidth - mw - 8));
+      const endAligned = r2.right - mw;
+      const left = Math.max(8, Math.min(endAligned >= 8 ? endAligned : r2.left, window.innerWidth - mw - 8));
       setPos(function(p) {
         return p && p.top === top && p.left === left && p.maxHeight === maxHeight ? p : { top, left, maxHeight };
       });
@@ -2028,12 +2029,15 @@ window.Aura = (() => {
       });
       return out;
     }
+    const anyLead = items2.some(function(it) {
+      return !it.separator && (!!it.icon || it.type === "radio" || it.checked !== void 0);
+    });
     function renderItem(it, i) {
       if (it.separator) return /* @__PURE__ */ React9.createElement("div", { key: "s" + i, role: "separator", className: "aura-menu__sep" });
       const isRadio = it.type === "radio";
       const isCheck = !isRadio && it.checked !== void 0;
       const checkAtEnd = isCheck && !!it.icon && it.checkPlacement !== "start";
-      const lead = isRadio ? /* @__PURE__ */ React9.createElement("span", { className: cx("aura-menu__radio", it.checked && "is-on") }) : isCheck && !checkAtEnd ? /* @__PURE__ */ React9.createElement("span", { className: cx("aura-menu__check", it.checked && "is-on") }, it.checked ? /* @__PURE__ */ React9.createElement(Icon, { name: /* @__PURE__ */ React9.createElement(IconCheck, null), size: 12, strokeWidth: 3 }) : null) : it.icon ? /* @__PURE__ */ React9.createElement(Icon, { name: it.icon }) : /* @__PURE__ */ React9.createElement("span", { className: "aura-menu__blank" });
+      const lead = isRadio ? /* @__PURE__ */ React9.createElement("span", { className: cx("aura-menu__radio", it.checked && "is-on") }) : isCheck && !checkAtEnd ? /* @__PURE__ */ React9.createElement("span", { className: cx("aura-menu__check", it.checked && "is-on") }, it.checked ? /* @__PURE__ */ React9.createElement(Icon, { name: /* @__PURE__ */ React9.createElement(IconCheck, null), size: 12, strokeWidth: 3 }) : null) : it.icon ? /* @__PURE__ */ React9.createElement(Icon, { name: it.icon }) : anyLead ? /* @__PURE__ */ React9.createElement("span", { className: "aura-menu__blank" }) : null;
       const body = [
         /* @__PURE__ */ React9.createElement(React9.Fragment, { key: "l" }, lead),
         /* @__PURE__ */ React9.createElement("span", { key: "t", className: "aura-menu__label" }, it.label),
@@ -3444,7 +3448,7 @@ window.Aura = (() => {
           setFocus(addMonths(focusDate, 1));
         }
       }
-    )), /* @__PURE__ */ React18.createElement("table", { role: "grid", className: "aura-cal__grid", "aria-label": monthTitle }, /* @__PURE__ */ React18.createElement("thead", null, /* @__PURE__ */ React18.createElement("tr", null, weekdayNames.map(function(n3, i) {
+    )), /* @__PURE__ */ React18.createElement("table", { role: "grid", className: "aura-cal__grid", "aria-label": monthTitle, lang: th2 ? "th" : void 0 }, /* @__PURE__ */ React18.createElement("thead", null, /* @__PURE__ */ React18.createElement("tr", null, weekdayNames.map(function(n3, i) {
       return /* @__PURE__ */ React18.createElement("th", { key: i, scope: "col", abbr: n3.long }, /* @__PURE__ */ React18.createElement("span", { "aria-hidden": true }, n3.short));
     }))), /* @__PURE__ */ React18.createElement(
       "tbody",
@@ -10074,6 +10078,19 @@ window.Aura = (() => {
       a = a.trim();
       if (a === "image/*") return t.images;
       if (a === "application/pdf") return "PDF";
+      const known = {
+        "application/vnd.openxmlformats-officedocument.wordprocessingml.document": "DOCX",
+        "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": "XLSX",
+        "application/vnd.openxmlformats-officedocument.presentationml.presentation": "PPTX",
+        "application/msword": "DOC",
+        "application/vnd.ms-excel": "XLS",
+        "application/vnd.ms-powerpoint": "PPT",
+        "text/plain": "TXT"
+      };
+      if (known[a]) return known[a];
+      const slash = a.indexOf("/");
+      if (slash > 0 && a.slice(slash + 1) !== "*")
+        a = a.slice(slash + 1).replace(/^(?:vnd\.|x-)/, "").replace(/\+xml$/, "");
       return a.replace(/^\./, "").toUpperCase();
     }).filter(function(x, i, arr) {
       return arr.indexOf(x) === i;
@@ -10482,6 +10499,7 @@ window.Aura = (() => {
     L["accent-violet"] = L["fg-accent"];
     L["focus-ring"] = fit(b[700], lightGrounds.concat([b[50]]), 3, -1);
     L["bg-selected"] = b[50];
+    L["calendar-range-bg"] = b[100];
     L["status-progress-bg"] = b[100];
     L["status-progress-fg"] = fit(b[800], [b[100]], 4.5, -1);
     L["alert-info-bg"] = b[50];
@@ -10521,6 +10539,7 @@ window.Aura = (() => {
     D["control-checked-bg"] = fit(b[300], darkGrounds, 3, 1);
     D["control-checked-fg"] = onFill(D["control-checked-bg"]);
     D["nav-active-edge"] = D["control-checked-bg"];
+    D["calendar-range-bg"] = D["bg-selected"];
     const shadowLight = INK, shadowDark = D["accent-violet"];
     if (o.primary === "brand") {
       L["button-primary-bg"] = fit(b[600], [ZINC[0]], 4.5, -1);
@@ -10578,6 +10597,7 @@ window.Aura = (() => {
     check("dark", "chart-1", "chart-2 (lightness step)", 1.8, D["chart-1"], CHART_2);
     check("light", "fg-primary", "bg-selected", 4.5, INK, L["bg-selected"]);
     check("dark", "fg-primary", "bg-selected", 4.5, "#ffffff", D["bg-selected"]);
+    check("light", "fg-primary", "calendar-range-bg", 4.5, INK, L["calendar-range-bg"]);
     check("light", "status-progress-fg", "status-progress-bg", 4.5, L["status-progress-fg"], L["status-progress-bg"]);
     check("dark", "status-progress-fg", "status-progress-bg", 4.5, D["status-progress-fg"], D["status-progress-bg"]);
     check("light", "alert-info-fg", "alert-info-bg", 4.5, L["alert-info-fg"], L["alert-info-bg"]);

package/dist/cjs/index.cjs

@@ -1911,7 +1911,8 @@ var Menu = React9.forwardRef(function Menu2(props, ref) {
         top = r2.top - above - 4;
       } else maxHeight = below2;
     }
-    const left = Math.max(8, Math.min(r2.right - mw, window.innerWidth - mw - 8));
+    const endAligned = r2.right - mw;
+    const left = Math.max(8, Math.min(endAligned >= 8 ? endAligned : r2.left, window.innerWidth - mw - 8));
     setPos(function(p) {
       return p && p.top === top && p.left === left && p.maxHeight === maxHeight ? p : { top, left, maxHeight };
     });
@@ -2010,12 +2011,15 @@ var Menu = React9.forwardRef(function Menu2(props, ref) {
     });
     return out;
   }
+  const anyLead = items2.some(function(it) {
+    return !it.separator && (!!it.icon || it.type === "radio" || it.checked !== void 0);
+  });
   function renderItem(it, i) {
     if (it.separator) return /* @__PURE__ */ React9.createElement("div", { key: "s" + i, role: "separator", className: "aura-menu__sep" });
     const isRadio = it.type === "radio";
     const isCheck = !isRadio && it.checked !== void 0;
     const checkAtEnd = isCheck && !!it.icon && it.checkPlacement !== "start";
-    const lead = isRadio ? /* @__PURE__ */ React9.createElement("span", { className: cx("aura-menu__radio", it.checked && "is-on") }) : isCheck && !checkAtEnd ? /* @__PURE__ */ React9.createElement("span", { className: cx("aura-menu__check", it.checked && "is-on") }, it.checked ? /* @__PURE__ */ React9.createElement(Icon, { name: /* @__PURE__ */ React9.createElement(IconCheck, null), size: 12, strokeWidth: 3 }) : null) : it.icon ? /* @__PURE__ */ React9.createElement(Icon, { name: it.icon }) : /* @__PURE__ */ React9.createElement("span", { className: "aura-menu__blank" });
+    const lead = isRadio ? /* @__PURE__ */ React9.createElement("span", { className: cx("aura-menu__radio", it.checked && "is-on") }) : isCheck && !checkAtEnd ? /* @__PURE__ */ React9.createElement("span", { className: cx("aura-menu__check", it.checked && "is-on") }, it.checked ? /* @__PURE__ */ React9.createElement(Icon, { name: /* @__PURE__ */ React9.createElement(IconCheck, null), size: 12, strokeWidth: 3 }) : null) : it.icon ? /* @__PURE__ */ React9.createElement(Icon, { name: it.icon }) : anyLead ? /* @__PURE__ */ React9.createElement("span", { className: "aura-menu__blank" }) : null;
     const body = [
       /* @__PURE__ */ React9.createElement(React9.Fragment, { key: "l" }, lead),
       /* @__PURE__ */ React9.createElement("span", { key: "t", className: "aura-menu__label" }, it.label),
@@ -3426,7 +3430,7 @@ var Calendar = React18.forwardRef(function Calendar2(props, ref) {
         setFocus(addMonths(focusDate, 1));
       }
     }
-  )), /* @__PURE__ */ React18.createElement("table", { role: "grid", className: "aura-cal__grid", "aria-label": monthTitle }, /* @__PURE__ */ React18.createElement("thead", null, /* @__PURE__ */ React18.createElement("tr", null, weekdayNames.map(function(n3, i) {
+  )), /* @__PURE__ */ React18.createElement("table", { role: "grid", className: "aura-cal__grid", "aria-label": monthTitle, lang: th2 ? "th" : void 0 }, /* @__PURE__ */ React18.createElement("thead", null, /* @__PURE__ */ React18.createElement("tr", null, weekdayNames.map(function(n3, i) {
     return /* @__PURE__ */ React18.createElement("th", { key: i, scope: "col", abbr: n3.long }, /* @__PURE__ */ React18.createElement("span", { "aria-hidden": true }, n3.short));
   }))), /* @__PURE__ */ React18.createElement(
     "tbody",
@@ -10056,6 +10060,19 @@ function describeAccept(accept, t) {
     a = a.trim();
     if (a === "image/*") return t.images;
     if (a === "application/pdf") return "PDF";
+    const known = {
+      "application/vnd.openxmlformats-officedocument.wordprocessingml.document": "DOCX",
+      "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": "XLSX",
+      "application/vnd.openxmlformats-officedocument.presentationml.presentation": "PPTX",
+      "application/msword": "DOC",
+      "application/vnd.ms-excel": "XLS",
+      "application/vnd.ms-powerpoint": "PPT",
+      "text/plain": "TXT"
+    };
+    if (known[a]) return known[a];
+    const slash = a.indexOf("/");
+    if (slash > 0 && a.slice(slash + 1) !== "*")
+      a = a.slice(slash + 1).replace(/^(?:vnd\.|x-)/, "").replace(/\+xml$/, "");
     return a.replace(/^\./, "").toUpperCase();
   }).filter(function(x, i, arr) {
     return arr.indexOf(x) === i;
@@ -10464,6 +10481,7 @@ function createTheme(opts) {
   L["accent-violet"] = L["fg-accent"];
   L["focus-ring"] = fit(b[700], lightGrounds.concat([b[50]]), 3, -1);
   L["bg-selected"] = b[50];
+  L["calendar-range-bg"] = b[100];
   L["status-progress-bg"] = b[100];
   L["status-progress-fg"] = fit(b[800], [b[100]], 4.5, -1);
   L["alert-info-bg"] = b[50];
@@ -10503,6 +10521,7 @@ function createTheme(opts) {
   D["control-checked-bg"] = fit(b[300], darkGrounds, 3, 1);
   D["control-checked-fg"] = onFill(D["control-checked-bg"]);
   D["nav-active-edge"] = D["control-checked-bg"];
+  D["calendar-range-bg"] = D["bg-selected"];
   const shadowLight = INK, shadowDark = D["accent-violet"];
   if (o.primary === "brand") {
     L["button-primary-bg"] = fit(b[600], [ZINC[0]], 4.5, -1);
@@ -10560,6 +10579,7 @@ function createTheme(opts) {
   check("dark", "chart-1", "chart-2 (lightness step)", 1.8, D["chart-1"], CHART_2);
   check("light", "fg-primary", "bg-selected", 4.5, INK, L["bg-selected"]);
   check("dark", "fg-primary", "bg-selected", 4.5, "#ffffff", D["bg-selected"]);
+  check("light", "fg-primary", "calendar-range-bg", 4.5, INK, L["calendar-range-bg"]);
   check("light", "status-progress-fg", "status-progress-bg", 4.5, L["status-progress-fg"], L["status-progress-bg"]);
   check("dark", "status-progress-fg", "status-progress-bg", 4.5, D["status-progress-fg"], D["status-progress-bg"]);
   check("light", "alert-info-fg", "alert-info-bg", 4.5, L["alert-info-fg"], L["alert-info-bg"]);

package/dist/esm/DatePicker.js

@@ -226,7 +226,7 @@ const Calendar = React.forwardRef(function Calendar2(props, ref) {
         setFocus(addMonths(focusDate, 1));
       }
     }
-  )), /* @__PURE__ */ React.createElement("table", { role: "grid", className: "aura-cal__grid", "aria-label": monthTitle }, /* @__PURE__ */ React.createElement("thead", null, /* @__PURE__ */ React.createElement("tr", null, weekdayNames.map(function(n, i) {
+  )), /* @__PURE__ */ React.createElement("table", { role: "grid", className: "aura-cal__grid", "aria-label": monthTitle, lang: th ? "th" : void 0 }, /* @__PURE__ */ React.createElement("thead", null, /* @__PURE__ */ React.createElement("tr", null, weekdayNames.map(function(n, i) {
     return /* @__PURE__ */ React.createElement("th", { key: i, scope: "col", abbr: n.long }, /* @__PURE__ */ React.createElement("span", { "aria-hidden": true }, n.short));
   }))), /* @__PURE__ */ React.createElement(
     "tbody",

package/dist/esm/FileUpload.js

@@ -26,6 +26,19 @@ function describeAccept(accept, t) {
     a = a.trim();
     if (a === "image/*") return t.images;
     if (a === "application/pdf") return "PDF";
+    const known = {
+      "application/vnd.openxmlformats-officedocument.wordprocessingml.document": "DOCX",
+      "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": "XLSX",
+      "application/vnd.openxmlformats-officedocument.presentationml.presentation": "PPTX",
+      "application/msword": "DOC",
+      "application/vnd.ms-excel": "XLS",
+      "application/vnd.ms-powerpoint": "PPT",
+      "text/plain": "TXT"
+    };
+    if (known[a]) return known[a];
+    const slash = a.indexOf("/");
+    if (slash > 0 && a.slice(slash + 1) !== "*")
+      a = a.slice(slash + 1).replace(/^(?:vnd\.|x-)/, "").replace(/\+xml$/, "");
     return a.replace(/^\./, "").toUpperCase();
   }).filter(function(x, i, arr) {
     return arr.indexOf(x) === i;

package/dist/esm/Menu.js

@@ -61,7 +61,8 @@ const Menu = React.forwardRef(function Menu2(props, ref) {
         top = r.top - above - 4;
       } else maxHeight = below;
     }
-    const left = Math.max(8, Math.min(r.right - mw, window.innerWidth - mw - 8));
+    const endAligned = r.right - mw;
+    const left = Math.max(8, Math.min(endAligned >= 8 ? endAligned : r.left, window.innerWidth - mw - 8));
     setPos(function(p) {
       return p && p.top === top && p.left === left && p.maxHeight === maxHeight ? p : { top, left, maxHeight };
     });
@@ -160,12 +161,15 @@ const Menu = React.forwardRef(function Menu2(props, ref) {
     });
     return out;
   }
+  const anyLead = items.some(function(it) {
+    return !it.separator && (!!it.icon || it.type === "radio" || it.checked !== void 0);
+  });
   function renderItem(it, i) {
     if (it.separator) return /* @__PURE__ */ React.createElement("div", { key: "s" + i, role: "separator", className: "aura-menu__sep" });
     const isRadio = it.type === "radio";
     const isCheck = !isRadio && it.checked !== void 0;
     const checkAtEnd = isCheck && !!it.icon && it.checkPlacement !== "start";
-    const lead = isRadio ? /* @__PURE__ */ React.createElement("span", { className: cx("aura-menu__radio", it.checked && "is-on") }) : isCheck && !checkAtEnd ? /* @__PURE__ */ React.createElement("span", { className: cx("aura-menu__check", it.checked && "is-on") }, it.checked ? /* @__PURE__ */ React.createElement(Icon, { name: /* @__PURE__ */ React.createElement(IconCheck, null), size: 12, strokeWidth: 3 }) : null) : it.icon ? /* @__PURE__ */ React.createElement(Icon, { name: it.icon }) : /* @__PURE__ */ React.createElement("span", { className: "aura-menu__blank" });
+    const lead = isRadio ? /* @__PURE__ */ React.createElement("span", { className: cx("aura-menu__radio", it.checked && "is-on") }) : isCheck && !checkAtEnd ? /* @__PURE__ */ React.createElement("span", { className: cx("aura-menu__check", it.checked && "is-on") }, it.checked ? /* @__PURE__ */ React.createElement(Icon, { name: /* @__PURE__ */ React.createElement(IconCheck, null), size: 12, strokeWidth: 3 }) : null) : it.icon ? /* @__PURE__ */ React.createElement(Icon, { name: it.icon }) : anyLead ? /* @__PURE__ */ React.createElement("span", { className: "aura-menu__blank" }) : null;
     const body = [
       /* @__PURE__ */ React.createElement(React.Fragment, { key: "l" }, lead),
       /* @__PURE__ */ React.createElement("span", { key: "t", className: "aura-menu__label" }, it.label),

package/dist/esm/theme.js

@@ -131,6 +131,7 @@ function createTheme(opts) {
   L["accent-violet"] = L["fg-accent"];
   L["focus-ring"] = fit(b[700], lightGrounds.concat([b[50]]), 3, -1);
   L["bg-selected"] = b[50];
+  L["calendar-range-bg"] = b[100];
   L["status-progress-bg"] = b[100];
   L["status-progress-fg"] = fit(b[800], [b[100]], 4.5, -1);
   L["alert-info-bg"] = b[50];
@@ -170,6 +171,7 @@ function createTheme(opts) {
   D["control-checked-bg"] = fit(b[300], darkGrounds, 3, 1);
   D["control-checked-fg"] = onFill(D["control-checked-bg"]);
   D["nav-active-edge"] = D["control-checked-bg"];
+  D["calendar-range-bg"] = D["bg-selected"];
   const shadowLight = INK, shadowDark = D["accent-violet"];
   if (o.primary === "brand") {
     L["button-primary-bg"] = fit(b[600], [ZINC[0]], 4.5, -1);
@@ -227,6 +229,7 @@ function createTheme(opts) {
   check("dark", "chart-1", "chart-2 (lightness step)", 1.8, D["chart-1"], CHART_2);
   check("light", "fg-primary", "bg-selected", 4.5, INK, L["bg-selected"]);
   check("dark", "fg-primary", "bg-selected", 4.5, "#ffffff", D["bg-selected"]);
+  check("light", "fg-primary", "calendar-range-bg", 4.5, INK, L["calendar-range-bg"]);
   check("light", "status-progress-fg", "status-progress-bg", 4.5, L["status-progress-fg"], L["status-progress-bg"]);
   check("dark", "status-progress-fg", "status-progress-bg", 4.5, D["status-progress-fg"], D["status-progress-bg"]);
   check("light", "alert-info-fg", "alert-info-bg", 4.5, L["alert-info-fg"], L["alert-info-bg"]);

package/dist/server/index.cjs

@@ -780,6 +780,7 @@ function createTheme(opts) {
   L["accent-violet"] = L["fg-accent"];
   L["focus-ring"] = fit(b[700], lightGrounds.concat([b[50]]), 3, -1);
   L["bg-selected"] = b[50];
+  L["calendar-range-bg"] = b[100];
   L["status-progress-bg"] = b[100];
   L["status-progress-fg"] = fit(b[800], [b[100]], 4.5, -1);
   L["alert-info-bg"] = b[50];
@@ -819,6 +820,7 @@ function createTheme(opts) {
   D["control-checked-bg"] = fit(b[300], darkGrounds, 3, 1);
   D["control-checked-fg"] = onFill(D["control-checked-bg"]);
   D["nav-active-edge"] = D["control-checked-bg"];
+  D["calendar-range-bg"] = D["bg-selected"];
   const shadowLight = INK, shadowDark = D["accent-violet"];
   if (o.primary === "brand") {
     L["button-primary-bg"] = fit(b[600], [ZINC[0]], 4.5, -1);
@@ -876,6 +878,7 @@ function createTheme(opts) {
   check("dark", "chart-1", "chart-2 (lightness step)", 1.8, D["chart-1"], CHART_2);
   check("light", "fg-primary", "bg-selected", 4.5, INK, L["bg-selected"]);
   check("dark", "fg-primary", "bg-selected", 4.5, "#ffffff", D["bg-selected"]);
+  check("light", "fg-primary", "calendar-range-bg", 4.5, INK, L["calendar-range-bg"]);
   check("light", "status-progress-fg", "status-progress-bg", 4.5, L["status-progress-fg"], L["status-progress-bg"]);
   check("dark", "status-progress-fg", "status-progress-bg", 4.5, D["status-progress-fg"], D["status-progress-bg"]);
   check("light", "alert-info-fg", "alert-info-bg", 4.5, L["alert-info-fg"], L["alert-info-bg"]);

package/dist/server/index.js

@@ -713,6 +713,7 @@ function createTheme(opts) {
   L["accent-violet"] = L["fg-accent"];
   L["focus-ring"] = fit(b[700], lightGrounds.concat([b[50]]), 3, -1);
   L["bg-selected"] = b[50];
+  L["calendar-range-bg"] = b[100];
   L["status-progress-bg"] = b[100];
   L["status-progress-fg"] = fit(b[800], [b[100]], 4.5, -1);
   L["alert-info-bg"] = b[50];
@@ -752,6 +753,7 @@ function createTheme(opts) {
   D["control-checked-bg"] = fit(b[300], darkGrounds, 3, 1);
   D["control-checked-fg"] = onFill(D["control-checked-bg"]);
   D["nav-active-edge"] = D["control-checked-bg"];
+  D["calendar-range-bg"] = D["bg-selected"];
   const shadowLight = INK, shadowDark = D["accent-violet"];
   if (o.primary === "brand") {
     L["button-primary-bg"] = fit(b[600], [ZINC[0]], 4.5, -1);
@@ -809,6 +811,7 @@ function createTheme(opts) {
   check("dark", "chart-1", "chart-2 (lightness step)", 1.8, D["chart-1"], CHART_2);
   check("light", "fg-primary", "bg-selected", 4.5, INK, L["bg-selected"]);
   check("dark", "fg-primary", "bg-selected", 4.5, "#ffffff", D["bg-selected"]);
+  check("light", "fg-primary", "calendar-range-bg", 4.5, INK, L["calendar-range-bg"]);
   check("light", "status-progress-fg", "status-progress-bg", 4.5, L["status-progress-fg"], L["status-progress-bg"]);
   check("dark", "status-progress-fg", "status-progress-bg", 4.5, D["status-progress-fg"], D["status-progress-bg"]);
   check("light", "alert-info-fg", "alert-info-bg", 4.5, L["alert-info-fg"], L["alert-info-bg"]);

package/dist/styles.css

@@ -50,18 +50,28 @@ button.aura-btn--secondary[aria-disabled='true']:hover, button.aura-btn--ghost[a
 button.aura-btn--danger-secondary[aria-disabled='true']:hover { background: transparent; }
 button.aura-btn--danger[aria-disabled='true']:hover { background: var(--aura-button-danger-bg); }
 button.aura-btn--creative[aria-disabled='true']:hover { box-shadow: var(--aura-shadow-creative); transform: none; }
-/* 5.30: a disabled filled button (primary, danger, creative) is a quiet grey fill with muted text, not a faded copy of
- * itself — faded ink read as a separate grey button, faded red as pink. Outline and ghost buttons keep the fade. */
-.aura-btn:is(.aura-btn--primary, .aura-btn--danger, .aura-btn--creative):is(:disabled, [aria-disabled='true']:not(.is-loading)),
-.aura-btn:is(.aura-btn--primary, .aura-btn--danger, .aura-btn--creative):is(:disabled, [aria-disabled='true']:not(.is-loading)):hover {
-  opacity: 1; background: var(--aura-button-disabled-bg); color: var(--aura-button-disabled-fg); border-color: transparent; box-shadow: none;
-}
+/* 5.30: a disabled button is not a faded copy of itself (faded ink read as a separate grey button, faded red as pink).
+ * 5.79: one look for every variant — see below. */
+.aura-btn.aura-btn:is(:disabled, [aria-disabled='true']:not(.is-loading)),
+.aura-btn.aura-btn:is(:disabled, [aria-disabled='true']:not(.is-loading)):hover {
+  opacity: 1; background: var(--aura-button-disabled-bg); color: var(--aura-button-disabled-fg); border-color: var(--aura-button-disabled-border); box-shadow: none;
+}
+/* …a variant without a border of its own (primary, danger) draws the same edge inside, so none is edgeless */
+.aura-btn.aura-btn:is(.aura-btn--primary, .aura-btn--danger):is(:disabled, [aria-disabled='true']:not(.is-loading)),
+.aura-btn.aura-btn:is(.aura-btn--primary, .aura-btn--danger):is(:disabled, [aria-disabled='true']:not(.is-loading)):hover {
+  box-shadow: inset 0 0 0 1px var(--aura-button-disabled-border);
+}
+/* 5.79 (visual audit 6): one disabled look for every variant — a faint fill, a faint edge, the tertiary label — so a
+ * disabled primary doesn't read as a To Do pill and a disabled outline button isn't a crisp white one in dark. A ghost
+ * button stays without fill or edge. */
+.aura-btn.aura-btn.aura-btn--ghost:is(:disabled, [aria-disabled='true']:not(.is-loading)),
+.aura-btn.aura-btn.aura-btn--ghost:is(:disabled, [aria-disabled='true']:not(.is-loading)):hover { background: transparent; border-color: transparent; box-shadow: none; }
 /* Forced colours drop the fills: filled buttons get a 1px edge (as outline buttons have), and a disabled or gated one
  * (still focusable) shows GrayText and keeps the fade, without changing size. */
 @media (forced-colors: active) {
   .aura-btn:is(.aura-btn--primary, .aura-btn--danger) { border: 1px solid ButtonText; }
-  .aura-btn.aura-btn:is(:disabled, [aria-disabled='true']:not(.is-loading)),
-  .aura-btn.aura-btn.aura-btn:is(:disabled, [aria-disabled='true']:not(.is-loading)):hover { color: GrayText; border-color: GrayText; opacity: var(--aura-disabled-opacity); }
+  .aura-btn.aura-btn.aura-btn:is(:disabled, [aria-disabled='true']:not(.is-loading)),
+  .aura-btn.aura-btn.aura-btn:is(:disabled, [aria-disabled='true']:not(.is-loading)):hover { color: GrayText; border-color: GrayText; opacity: var(--aura-disabled-opacity); } /* 5.79: one class more, over the ghost rule */
 }
 .aura-btn.is-loading:active { transform: none; }
 
@@ -295,7 +305,7 @@ a.aura-table__sort { text-decoration: none; }
   position: fixed; z-index: var(--aura-z-menu); min-width: 200px; padding: var(--aura-space-1); overflow-y: auto; overscroll-behavior: contain;
   background: var(--aura-bg-surface); color: var(--aura-fg-primary);
   border: 1px solid var(--aura-border-default); border-radius: var(--aura-radius-md);
-  box-shadow: var(--aura-shadow-enterprise);
+  box-shadow: var(--aura-shadow-overlay); /* 5.79 (visual audit 18): lifted as Popover and the list boxes are; its light edge alone was faint */
   font-family: var(--font-sans); font-size: max(13px, .8125rem);
 }
 .aura-menu__item {
@@ -583,7 +593,7 @@ a.aura-icon-btn { text-decoration: none; }
  * Field). */
 .aura-field:not(.is-disabled) .aura-input:has(> .aura-input__control[aria-invalid="true"]:not(:disabled)),
 .aura-field:not(.is-disabled) .aura-textarea[aria-invalid="true"]:not(:disabled) { border-color: var(--aura-border-danger); }
-.aura-field.is-disabled .aura-input { background: var(--aura-bg-input-disabled); color: var(--aura-fg-secondary); border-color: var(--aura-border-default); }
+.aura-field.is-disabled .aura-input { background: var(--aura-bg-input-disabled); color: var(--aura-fg-secondary); border-color: var(--aura-input-disabled-border); }
 .aura-field.is-disabled .aura-input__control { cursor: not-allowed; }
 /* A read-only text field. Only an input: `:read-only` also matches any element that isn't editable — a
  * Select's trigger <button> — which painted every custom Select with the disabled ground (5.16.1, Chamber-OS 109). */
@@ -593,13 +603,18 @@ a.aura-icon-btn { text-decoration: none; }
 
 .aura-textarea { display: block; padding: 10px var(--aura-space-3); min-height: 96px; line-height: 1.6; resize: vertical; outline: none; }
 .aura-textarea:focus { outline: var(--aura-focus-ring-width) solid var(--aura-focus-ring); outline-offset: 1px; border-color: var(--aura-border-strong); }
-.aura-field.is-disabled .aura-textarea { background: var(--aura-bg-input-disabled); color: var(--aura-fg-secondary); border-color: var(--aura-border-default); }
+.aura-field.is-disabled .aura-textarea { background: var(--aura-bg-input-disabled); color: var(--aura-fg-secondary); border-color: var(--aura-input-disabled-border); }
 
 .aura-select .aura-input__control { padding-right: calc(var(--aura-space-3) + var(--aura-icon-sm) + var(--aura-space-2)); cursor: pointer; }
 .aura-select__chevron { position: absolute; right: var(--aura-space-3); color: var(--aura-fg-secondary); pointer-events: none; }
 .aura-select select:invalid, .aura-select select:has(option[value=""]:checked) { color: var(--aura-fg-tertiary); }
 /* 5.3: the field is a button over an invisible <select> (forms, refs, events); the list is AURA's, like Combobox. */
 .aura-select option { color: var(--aura-fg-primary); background: var(--aura-bg-input); }
+/* 5.79 (visual audit 15): a list box (multiple, or size > 1) shows its rows — as tall as they need, no chevron — instead
+ * of being squeezed into a one-line field with its third option cut in half. */
+.aura-select .aura-input__control:is([multiple], [size]:not([size='0'], [size='1'])) { height: auto; padding: var(--aura-space-1) var(--aura-space-2); overflow-y: auto; cursor: default; }
+.aura-select:has(> .aura-input__control:is([multiple], [size]:not([size='0'], [size='1']))) .aura-select__chevron { display: none; }
+.aura-select .aura-input__control:is([multiple], [size]:not([size='0'], [size='1'])) option { padding: var(--aura-space-1) var(--aura-space-2); border-radius: var(--aura-radius-xs); }
 .aura-select--custom { position: relative; }
 .aura-select__native { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; opacity: 0; pointer-events: none; appearance: none; }
 .aura-select__trigger { display: flex; align-items: center; text-align: start; background: none; border: 0; color: inherit; font: inherit; width: 100%; min-width: 0; }
@@ -659,7 +674,7 @@ a.aura-icon-btn { text-decoration: none; }
 /* 5.19 (Chamber-OS 113): a read-only switch keeps its colours (a locked "on" reads as on at full contrast) and stays
  * focusable; only the pointer says it won't change. The row's icon (a lock) sits at its end, like a field's icon. */
 .aura-switch-row.is-readonly, .aura-switch-row.is-readonly .aura-switch, .aura-switch-row.is-readonly .aura-choice__label { cursor: default; }
-.aura-switch-row__icon { flex: none; margin-inline-start: auto; margin-top: 2px; width: var(--aura-icon-sm); height: var(--aura-icon-sm); color: var(--aura-fg-secondary); }
+.aura-switch-row__icon { flex: none; margin-inline-start: calc(-1 * var(--aura-space-1)); margin-top: 2px; /* 5.79 (visual audit 17): beside the label it belongs to, 8px after it, not at the row's far end */  width: var(--aura-icon-sm); height: var(--aura-icon-sm); color: var(--aura-fg-secondary); }
 
 /* ---------- Alerts & toasts ---------- */
 .aura-alert {
@@ -1051,8 +1066,8 @@ a.aura-tab { text-decoration: none; }
 .aura-combo__option.is-selected { font-weight: 500; }
 .aura-combo__option.is-disabled { opacity: var(--aura-disabled-opacity); cursor: default; }
 .aura-combo__text { flex: 1; min-width: 0; display: flex; flex-direction: column; }
-.aura-combo__label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.aura-combo__desc { font-size: max(12px, .75rem); line-height: 1.5; color: var(--aura-fg-secondary); }
+.aura-combo__label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: max(20px, 1.25rem); }
+.aura-combo__desc { font-size: max(12px, .75rem); line-height: max(18px, 1.125rem); color: var(--aura-fg-secondary); } /* 5.79: fixed line heights, so a Thai row and an English row are spaced alike (normal follows each font) */
 /* Same specificity as `.aura-combo__option > .aura-icon` above and later in the file, so it wins by order (4.18). */
 .aura-combo__option > .aura-combo__check { color: var(--aura-fg-accent); }
 /* 5.16 (Chamber-OS 105): option groups under a heading. */
@@ -1095,9 +1110,9 @@ a.aura-tab { text-decoration: none; }
 .aura-cal__day.is-selected { background: var(--aura-control-checked-bg); color: var(--aura-control-checked-fg); box-shadow: none; }
 .aura-cal__day:disabled, .aura-cal__day[aria-disabled='true'] { opacity: var(--aura-disabled-opacity); cursor: not-allowed; background: transparent; text-decoration: line-through; }
 .aura-cal__day:focus-visible { outline: var(--aura-focus-ring-width) solid var(--aura-focus-ring); outline-offset: 1px; }
-.aura-cal__grid td.is-in-range { background: var(--aura-bg-selected); }
-.aura-cal__grid td.is-range-start { background: linear-gradient(to right, transparent 50%, var(--aura-bg-selected) 50%); }
-.aura-cal__grid td.is-range-end { background: linear-gradient(to left, transparent 50%, var(--aura-bg-selected) 50%); }
+.aura-cal__grid td.is-in-range { background: var(--aura-calendar-range-bg); } /* 5.79 (visual audit 19) */
+.aura-cal__grid td.is-range-start { background: linear-gradient(to right, transparent 50%, var(--aura-calendar-range-bg) 50%); }
+.aura-cal__grid td.is-range-end { background: linear-gradient(to left, transparent 50%, var(--aura-calendar-range-bg) 50%); }
 .aura-cal__grid td.is-range-start.is-range-end { background: none; }
 .aura-cal__years { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--aura-space-1); }
 .aura-cal__year {
@@ -1652,7 +1667,7 @@ a.aura-upload__name:focus-visible { outline: var(--aura-focus-ring-width) solid
 .aura-badge--success { background: var(--aura-alert-success-bg); color: var(--aura-alert-success-fg); }
 .aura-badge--warning { background: var(--aura-alert-warning-bg); color: var(--aura-alert-warning-fg); }
 .aura-badge--danger { background: var(--aura-alert-danger-bg); color: var(--aura-alert-danger-fg); }
-.aura-badge.is-outline { background: transparent; border-color: currentColor; }
+.aura-badge.is-outline { background: transparent; border-color: currentColor; border-color: color-mix(in srgb, currentColor 45%, transparent); } /* 5.79 (visual audit 19): a quieter edge, so an outline badge doesn't read as a secondary button */
 .aura-badge--neutral.is-outline { border-color: var(--aura-border-control); }
 .aura-badge.is-solid { background: var(--aura-button-primary-bg); color: var(--aura-button-primary-fg); }
 .aura-badge--danger.is-solid { background: var(--aura-status-blocked-solid-bg); color: var(--aura-status-blocked-solid-fg); }
@@ -1791,6 +1806,7 @@ a.aura-upload__name:focus-visible { outline: var(--aura-focus-ring-width) solid
 .aura-combo__chips { display: contents; }
 .aura-combo__chip {
   display: inline-flex; align-items: center; gap: 2px; max-width: 100%; height: 28px; box-sizing: border-box;
+  flex: none; /* 5.79 (visual audit 16): a chip keeps its label and goes to the next line, not shrunk to "V.." */
   padding: 0 2px 0 var(--aura-space-2); border-radius: var(--aura-radius-full);
   background: var(--aura-bg-selected); color: var(--aura-fg-primary); font-size: max(13px, .8125rem); font-weight: 500;
 }
@@ -2193,7 +2209,7 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
 .aura-filterselect__face:focus-visible { outline-style: solid; }
 /* Before hydration: the real <select>, invisible, over the face (16px so iOS doesn't zoom when it opens). */
 .aura-filterselect__native { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; opacity: 0; font-size: max(16px, 1rem); cursor: pointer; appearance: none; }
-.aura-filterselect.is-disabled .aura-filterselect__face { background: var(--aura-bg-input-disabled); color: var(--aura-fg-secondary); border-color: var(--aura-border-default); cursor: not-allowed; }
+.aura-filterselect.is-disabled .aura-filterselect__face { background: var(--aura-bg-input-disabled); color: var(--aura-fg-secondary); border-color: var(--aura-input-disabled-border); cursor: not-allowed; }
 .aura-filterselect.is-disabled .aura-filterselect__native { cursor: not-allowed; }
 /* 5.38 (Chamber-OS 140): touchHeight on FilterBar (its search and field-height controls) or on one FilterSelect —
  * 44px below 640px or on a coarse pointer (is-touch), or always. */
@@ -2393,6 +2409,25 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
   :root:has(.aura-actionbar--edge:not(.is-idle)) .aura-shell__content { padding-bottom: calc(var(--aura-space-6) + var(--aura-actionbar-space)); }
   :root:has(.aura-actionbar--edge:not(.is-idle)):not(:has(.aura-shell__content)) body { padding-bottom: var(--aura-actionbar-space); }
 }
+/* 5.79 (5.78 carry-over): where actionsFullWidthBelow reaches wider than actionsBarBelow, the bar isn't pinned between
+ * the two breakpoints and its buttons sit in the same full-width row — every button there is radius-md, not some. */
+@media (min-width: 640px) and (max-width: 767.98px) {
+  .aura-page-header--actions-full-below-md.aura-page-header--actions-bar-below-sm > .aura-page-header__actions .aura-btn:not(.aura-icon-btn) { border-radius: var(--aura-radius-md); }
+}
+@media (min-width: 640px) and (max-width: 1023.98px) {
+  .aura-page-header--actions-full-below-lg.aura-page-header--actions-bar-below-sm > .aura-page-header__actions .aura-btn:not(.aura-icon-btn) { border-radius: var(--aura-radius-md); }
+}
+@media (min-width: 768px) and (max-width: 1023.98px) {
+  .aura-page-header--actions-full-below-lg.aura-page-header--actions-bar-below-md > .aura-page-header__actions .aura-btn:not(.aura-icon-btn) { border-radius: var(--aura-radius-md); }
+}
+/* 5.79 (visual audit 10): in an AppShell on a desktop the edge strip starts where the content does — after the
+ * sidebar (its rail width when collapsed; the right edge in RTL) — and its contents line up with the content's 32px
+ * padding, instead of running under the sidebar. Outside an AppShell it keeps the screen's full width. */
+@media (min-width: 1024px) and (min-height: 30.00125rem) {
+  .aura-shell:has(> .aura-shell__nav) .aura-actionbar--edge:not(.is-idle) { inset-inline-start: var(--aura-sidenav-width); }
+  .aura-shell:has(> .aura-shell__nav .aura-nav--collapsed) .aura-actionbar--edge:not(.is-idle) { inset-inline-start: var(--aura-sidenav-rail-width); }
+  .aura-shell:not(:has(.aura-shell__content.is-flush)) .aura-actionbar--edge:not(.is-idle) > .aura-actionbar__inner { padding-inline: var(--aura-space-8); } /* not with contentPadding={false} */
+}
 /* 5.78 (visual audit 9): one rule for the bottom strips on a phone, as PageHeader's (5.48) — the status on its own row
  * at the top, the actions sharing the row under it (an IconButton keeps its square; labels too long to share take a row
  * each), 16px both sides as the page. edgeBelow="md" follows it up to 768px, as PageHeader's md strip. */
@@ -2753,6 +2788,10 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
  * 1.6 line, so a loading card (its bars follow 1lh) is as tall as one with Thai text. */
 .aura-field__label:lang(th), .aura-field__hint:lang(th), .aura-field__error:lang(th), .aura-field__addon:lang(th) { line-height: 1.6; }
 .aura-choice__desc:lang(th), .aura-check__desc:lang(th) { font-size: max(13px, .8125rem); line-height: 1.6; }
+/* 5.79 (visual audit, Thai): the calendar's weekday row in Thai (อา จ อ …) at 13px — 12px was the hardest text on the
+ * page to read; the grid carries lang="th" with a Thai locale. Two-line Thai nav labels get room between lines. */
+.aura-cal__grid:lang(th) th { font-size: max(13px, .8125rem); }
+.aura-nav__label:lang(th) { line-height: 1.5; }
 .aura-tbl__row > .aura-tbl__td[data-label]:lang(th)::before, .aura-table__td[data-label]:lang(th)::before { font-family: var(--font-sans); font-size: max(12px, .75rem); line-height: max(18px, 1.125rem); }
 .aura-table--stacked .aura-table__td[data-label]:lang(th) { line-height: 1.6; }
 

package/dist/styles.layer.css

@@ -52,18 +52,28 @@ button.aura-btn--secondary[aria-disabled='true']:hover, button.aura-btn--ghost[a
 button.aura-btn--danger-secondary[aria-disabled='true']:hover { background: transparent; }
 button.aura-btn--danger[aria-disabled='true']:hover { background: var(--aura-button-danger-bg); }
 button.aura-btn--creative[aria-disabled='true']:hover { box-shadow: var(--aura-shadow-creative); transform: none; }
-/* 5.30: a disabled filled button (primary, danger, creative) is a quiet grey fill with muted text, not a faded copy of
- * itself — faded ink read as a separate grey button, faded red as pink. Outline and ghost buttons keep the fade. */
-.aura-btn:is(.aura-btn--primary, .aura-btn--danger, .aura-btn--creative):is(:disabled, [aria-disabled='true']:not(.is-loading)),
-.aura-btn:is(.aura-btn--primary, .aura-btn--danger, .aura-btn--creative):is(:disabled, [aria-disabled='true']:not(.is-loading)):hover {
-  opacity: 1; background: var(--aura-button-disabled-bg); color: var(--aura-button-disabled-fg); border-color: transparent; box-shadow: none;
-}
+/* 5.30: a disabled button is not a faded copy of itself (faded ink read as a separate grey button, faded red as pink).
+ * 5.79: one look for every variant — see below. */
+.aura-btn.aura-btn:is(:disabled, [aria-disabled='true']:not(.is-loading)),
+.aura-btn.aura-btn:is(:disabled, [aria-disabled='true']:not(.is-loading)):hover {
+  opacity: 1; background: var(--aura-button-disabled-bg); color: var(--aura-button-disabled-fg); border-color: var(--aura-button-disabled-border); box-shadow: none;
+}
+/* …a variant without a border of its own (primary, danger) draws the same edge inside, so none is edgeless */
+.aura-btn.aura-btn:is(.aura-btn--primary, .aura-btn--danger):is(:disabled, [aria-disabled='true']:not(.is-loading)),
+.aura-btn.aura-btn:is(.aura-btn--primary, .aura-btn--danger):is(:disabled, [aria-disabled='true']:not(.is-loading)):hover {
+  box-shadow: inset 0 0 0 1px var(--aura-button-disabled-border);
+}
+/* 5.79 (visual audit 6): one disabled look for every variant — a faint fill, a faint edge, the tertiary label — so a
+ * disabled primary doesn't read as a To Do pill and a disabled outline button isn't a crisp white one in dark. A ghost
+ * button stays without fill or edge. */
+.aura-btn.aura-btn.aura-btn--ghost:is(:disabled, [aria-disabled='true']:not(.is-loading)),
+.aura-btn.aura-btn.aura-btn--ghost:is(:disabled, [aria-disabled='true']:not(.is-loading)):hover { background: transparent; border-color: transparent; box-shadow: none; }
 /* Forced colours drop the fills: filled buttons get a 1px edge (as outline buttons have), and a disabled or gated one
  * (still focusable) shows GrayText and keeps the fade, without changing size. */
 @media (forced-colors: active) {
   .aura-btn:is(.aura-btn--primary, .aura-btn--danger) { border: 1px solid ButtonText; }
-  .aura-btn.aura-btn:is(:disabled, [aria-disabled='true']:not(.is-loading)),
-  .aura-btn.aura-btn.aura-btn:is(:disabled, [aria-disabled='true']:not(.is-loading)):hover { color: GrayText; border-color: GrayText; opacity: var(--aura-disabled-opacity); }
+  .aura-btn.aura-btn.aura-btn:is(:disabled, [aria-disabled='true']:not(.is-loading)),
+  .aura-btn.aura-btn.aura-btn:is(:disabled, [aria-disabled='true']:not(.is-loading)):hover { color: GrayText; border-color: GrayText; opacity: var(--aura-disabled-opacity); } /* 5.79: one class more, over the ghost rule */
 }
 .aura-btn.is-loading:active { transform: none; }
 
@@ -297,7 +307,7 @@ a.aura-table__sort { text-decoration: none; }
   position: fixed; z-index: var(--aura-z-menu); min-width: 200px; padding: var(--aura-space-1); overflow-y: auto; overscroll-behavior: contain;
   background: var(--aura-bg-surface); color: var(--aura-fg-primary);
   border: 1px solid var(--aura-border-default); border-radius: var(--aura-radius-md);
-  box-shadow: var(--aura-shadow-enterprise);
+  box-shadow: var(--aura-shadow-overlay); /* 5.79 (visual audit 18): lifted as Popover and the list boxes are; its light edge alone was faint */
   font-family: var(--font-sans); font-size: max(13px, .8125rem);
 }
 .aura-menu__item {
@@ -585,7 +595,7 @@ a.aura-icon-btn { text-decoration: none; }
  * Field). */
 .aura-field:not(.is-disabled) .aura-input:has(> .aura-input__control[aria-invalid="true"]:not(:disabled)),
 .aura-field:not(.is-disabled) .aura-textarea[aria-invalid="true"]:not(:disabled) { border-color: var(--aura-border-danger); }
-.aura-field.is-disabled .aura-input { background: var(--aura-bg-input-disabled); color: var(--aura-fg-secondary); border-color: var(--aura-border-default); }
+.aura-field.is-disabled .aura-input { background: var(--aura-bg-input-disabled); color: var(--aura-fg-secondary); border-color: var(--aura-input-disabled-border); }
 .aura-field.is-disabled .aura-input__control { cursor: not-allowed; }
 /* A read-only text field. Only an input: `:read-only` also matches any element that isn't editable — a
  * Select's trigger <button> — which painted every custom Select with the disabled ground (5.16.1, Chamber-OS 109). */
@@ -595,13 +605,18 @@ a.aura-icon-btn { text-decoration: none; }
 
 .aura-textarea { display: block; padding: 10px var(--aura-space-3); min-height: 96px; line-height: 1.6; resize: vertical; outline: none; }
 .aura-textarea:focus { outline: var(--aura-focus-ring-width) solid var(--aura-focus-ring); outline-offset: 1px; border-color: var(--aura-border-strong); }
-.aura-field.is-disabled .aura-textarea { background: var(--aura-bg-input-disabled); color: var(--aura-fg-secondary); border-color: var(--aura-border-default); }
+.aura-field.is-disabled .aura-textarea { background: var(--aura-bg-input-disabled); color: var(--aura-fg-secondary); border-color: var(--aura-input-disabled-border); }
 
 .aura-select .aura-input__control { padding-right: calc(var(--aura-space-3) + var(--aura-icon-sm) + var(--aura-space-2)); cursor: pointer; }
 .aura-select__chevron { position: absolute; right: var(--aura-space-3); color: var(--aura-fg-secondary); pointer-events: none; }
 .aura-select select:invalid, .aura-select select:has(option[value=""]:checked) { color: var(--aura-fg-tertiary); }
 /* 5.3: the field is a button over an invisible <select> (forms, refs, events); the list is AURA's, like Combobox. */
 .aura-select option { color: var(--aura-fg-primary); background: var(--aura-bg-input); }
+/* 5.79 (visual audit 15): a list box (multiple, or size > 1) shows its rows — as tall as they need, no chevron — instead
+ * of being squeezed into a one-line field with its third option cut in half. */
+.aura-select .aura-input__control:is([multiple], [size]:not([size='0'], [size='1'])) { height: auto; padding: var(--aura-space-1) var(--aura-space-2); overflow-y: auto; cursor: default; }
+.aura-select:has(> .aura-input__control:is([multiple], [size]:not([size='0'], [size='1']))) .aura-select__chevron { display: none; }
+.aura-select .aura-input__control:is([multiple], [size]:not([size='0'], [size='1'])) option { padding: var(--aura-space-1) var(--aura-space-2); border-radius: var(--aura-radius-xs); }
 .aura-select--custom { position: relative; }
 .aura-select__native { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; opacity: 0; pointer-events: none; appearance: none; }
 .aura-select__trigger { display: flex; align-items: center; text-align: start; background: none; border: 0; color: inherit; font: inherit; width: 100%; min-width: 0; }
@@ -661,7 +676,7 @@ a.aura-icon-btn { text-decoration: none; }
 /* 5.19 (Chamber-OS 113): a read-only switch keeps its colours (a locked "on" reads as on at full contrast) and stays
  * focusable; only the pointer says it won't change. The row's icon (a lock) sits at its end, like a field's icon. */
 .aura-switch-row.is-readonly, .aura-switch-row.is-readonly .aura-switch, .aura-switch-row.is-readonly .aura-choice__label { cursor: default; }
-.aura-switch-row__icon { flex: none; margin-inline-start: auto; margin-top: 2px; width: var(--aura-icon-sm); height: var(--aura-icon-sm); color: var(--aura-fg-secondary); }
+.aura-switch-row__icon { flex: none; margin-inline-start: calc(-1 * var(--aura-space-1)); margin-top: 2px; /* 5.79 (visual audit 17): beside the label it belongs to, 8px after it, not at the row's far end */  width: var(--aura-icon-sm); height: var(--aura-icon-sm); color: var(--aura-fg-secondary); }
 
 /* ---------- Alerts & toasts ---------- */
 .aura-alert {
@@ -1053,8 +1068,8 @@ a.aura-tab { text-decoration: none; }
 .aura-combo__option.is-selected { font-weight: 500; }
 .aura-combo__option.is-disabled { opacity: var(--aura-disabled-opacity); cursor: default; }
 .aura-combo__text { flex: 1; min-width: 0; display: flex; flex-direction: column; }
-.aura-combo__label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.aura-combo__desc { font-size: max(12px, .75rem); line-height: 1.5; color: var(--aura-fg-secondary); }
+.aura-combo__label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: max(20px, 1.25rem); }
+.aura-combo__desc { font-size: max(12px, .75rem); line-height: max(18px, 1.125rem); color: var(--aura-fg-secondary); } /* 5.79: fixed line heights, so a Thai row and an English row are spaced alike (normal follows each font) */
 /* Same specificity as `.aura-combo__option > .aura-icon` above and later in the file, so it wins by order (4.18). */
 .aura-combo__option > .aura-combo__check { color: var(--aura-fg-accent); }
 /* 5.16 (Chamber-OS 105): option groups under a heading. */
@@ -1097,9 +1112,9 @@ a.aura-tab { text-decoration: none; }
 .aura-cal__day.is-selected { background: var(--aura-control-checked-bg); color: var(--aura-control-checked-fg); box-shadow: none; }
 .aura-cal__day:disabled, .aura-cal__day[aria-disabled='true'] { opacity: var(--aura-disabled-opacity); cursor: not-allowed; background: transparent; text-decoration: line-through; }
 .aura-cal__day:focus-visible { outline: var(--aura-focus-ring-width) solid var(--aura-focus-ring); outline-offset: 1px; }
-.aura-cal__grid td.is-in-range { background: var(--aura-bg-selected); }
-.aura-cal__grid td.is-range-start { background: linear-gradient(to right, transparent 50%, var(--aura-bg-selected) 50%); }
-.aura-cal__grid td.is-range-end { background: linear-gradient(to left, transparent 50%, var(--aura-bg-selected) 50%); }
+.aura-cal__grid td.is-in-range { background: var(--aura-calendar-range-bg); } /* 5.79 (visual audit 19) */
+.aura-cal__grid td.is-range-start { background: linear-gradient(to right, transparent 50%, var(--aura-calendar-range-bg) 50%); }
+.aura-cal__grid td.is-range-end { background: linear-gradient(to left, transparent 50%, var(--aura-calendar-range-bg) 50%); }
 .aura-cal__grid td.is-range-start.is-range-end { background: none; }
 .aura-cal__years { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--aura-space-1); }
 .aura-cal__year {
@@ -1654,7 +1669,7 @@ a.aura-upload__name:focus-visible { outline: var(--aura-focus-ring-width) solid
 .aura-badge--success { background: var(--aura-alert-success-bg); color: var(--aura-alert-success-fg); }
 .aura-badge--warning { background: var(--aura-alert-warning-bg); color: var(--aura-alert-warning-fg); }
 .aura-badge--danger { background: var(--aura-alert-danger-bg); color: var(--aura-alert-danger-fg); }
-.aura-badge.is-outline { background: transparent; border-color: currentColor; }
+.aura-badge.is-outline { background: transparent; border-color: currentColor; border-color: color-mix(in srgb, currentColor 45%, transparent); } /* 5.79 (visual audit 19): a quieter edge, so an outline badge doesn't read as a secondary button */
 .aura-badge--neutral.is-outline { border-color: var(--aura-border-control); }
 .aura-badge.is-solid { background: var(--aura-button-primary-bg); color: var(--aura-button-primary-fg); }
 .aura-badge--danger.is-solid { background: var(--aura-status-blocked-solid-bg); color: var(--aura-status-blocked-solid-fg); }
@@ -1793,6 +1808,7 @@ a.aura-upload__name:focus-visible { outline: var(--aura-focus-ring-width) solid
 .aura-combo__chips { display: contents; }
 .aura-combo__chip {
   display: inline-flex; align-items: center; gap: 2px; max-width: 100%; height: 28px; box-sizing: border-box;
+  flex: none; /* 5.79 (visual audit 16): a chip keeps its label and goes to the next line, not shrunk to "V.." */
   padding: 0 2px 0 var(--aura-space-2); border-radius: var(--aura-radius-full);
   background: var(--aura-bg-selected); color: var(--aura-fg-primary); font-size: max(13px, .8125rem); font-weight: 500;
 }
@@ -2195,7 +2211,7 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
 .aura-filterselect__face:focus-visible { outline-style: solid; }
 /* Before hydration: the real <select>, invisible, over the face (16px so iOS doesn't zoom when it opens). */
 .aura-filterselect__native { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; opacity: 0; font-size: max(16px, 1rem); cursor: pointer; appearance: none; }
-.aura-filterselect.is-disabled .aura-filterselect__face { background: var(--aura-bg-input-disabled); color: var(--aura-fg-secondary); border-color: var(--aura-border-default); cursor: not-allowed; }
+.aura-filterselect.is-disabled .aura-filterselect__face { background: var(--aura-bg-input-disabled); color: var(--aura-fg-secondary); border-color: var(--aura-input-disabled-border); cursor: not-allowed; }
 .aura-filterselect.is-disabled .aura-filterselect__native { cursor: not-allowed; }
 /* 5.38 (Chamber-OS 140): touchHeight on FilterBar (its search and field-height controls) or on one FilterSelect —
  * 44px below 640px or on a coarse pointer (is-touch), or always. */
@@ -2395,6 +2411,25 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
   :root:has(.aura-actionbar--edge:not(.is-idle)) .aura-shell__content { padding-bottom: calc(var(--aura-space-6) + var(--aura-actionbar-space)); }
   :root:has(.aura-actionbar--edge:not(.is-idle)):not(:has(.aura-shell__content)) body { padding-bottom: var(--aura-actionbar-space); }
 }
+/* 5.79 (5.78 carry-over): where actionsFullWidthBelow reaches wider than actionsBarBelow, the bar isn't pinned between
+ * the two breakpoints and its buttons sit in the same full-width row — every button there is radius-md, not some. */
+@media (min-width: 640px) and (max-width: 767.98px) {
+  .aura-page-header--actions-full-below-md.aura-page-header--actions-bar-below-sm > .aura-page-header__actions .aura-btn:not(.aura-icon-btn) { border-radius: var(--aura-radius-md); }
+}
+@media (min-width: 640px) and (max-width: 1023.98px) {
+  .aura-page-header--actions-full-below-lg.aura-page-header--actions-bar-below-sm > .aura-page-header__actions .aura-btn:not(.aura-icon-btn) { border-radius: var(--aura-radius-md); }
+}
+@media (min-width: 768px) and (max-width: 1023.98px) {
+  .aura-page-header--actions-full-below-lg.aura-page-header--actions-bar-below-md > .aura-page-header__actions .aura-btn:not(.aura-icon-btn) { border-radius: var(--aura-radius-md); }
+}
+/* 5.79 (visual audit 10): in an AppShell on a desktop the edge strip starts where the content does — after the
+ * sidebar (its rail width when collapsed; the right edge in RTL) — and its contents line up with the content's 32px
+ * padding, instead of running under the sidebar. Outside an AppShell it keeps the screen's full width. */
+@media (min-width: 1024px) and (min-height: 30.00125rem) {
+  .aura-shell:has(> .aura-shell__nav) .aura-actionbar--edge:not(.is-idle) { inset-inline-start: var(--aura-sidenav-width); }
+  .aura-shell:has(> .aura-shell__nav .aura-nav--collapsed) .aura-actionbar--edge:not(.is-idle) { inset-inline-start: var(--aura-sidenav-rail-width); }
+  .aura-shell:not(:has(.aura-shell__content.is-flush)) .aura-actionbar--edge:not(.is-idle) > .aura-actionbar__inner { padding-inline: var(--aura-space-8); } /* not with contentPadding={false} */
+}
 /* 5.78 (visual audit 9): one rule for the bottom strips on a phone, as PageHeader's (5.48) — the status on its own row
  * at the top, the actions sharing the row under it (an IconButton keeps its square; labels too long to share take a row
  * each), 16px both sides as the page. edgeBelow="md" follows it up to 768px, as PageHeader's md strip. */
@@ -2755,6 +2790,10 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
  * 1.6 line, so a loading card (its bars follow 1lh) is as tall as one with Thai text. */
 .aura-field__label:lang(th), .aura-field__hint:lang(th), .aura-field__error:lang(th), .aura-field__addon:lang(th) { line-height: 1.6; }
 .aura-choice__desc:lang(th), .aura-check__desc:lang(th) { font-size: max(13px, .8125rem); line-height: 1.6; }
+/* 5.79 (visual audit, Thai): the calendar's weekday row in Thai (อา จ อ …) at 13px — 12px was the hardest text on the
+ * page to read; the grid carries lang="th" with a Thai locale. Two-line Thai nav labels get room between lines. */
+.aura-cal__grid:lang(th) th { font-size: max(13px, .8125rem); }
+.aura-nav__label:lang(th) { line-height: 1.5; }
 .aura-tbl__row > .aura-tbl__td[data-label]:lang(th)::before, .aura-table__td[data-label]:lang(th)::before { font-family: var(--font-sans); font-size: max(12px, .75rem); line-height: max(18px, 1.125rem); }
 .aura-table--stacked .aura-table__td[data-label]:lang(th) { line-height: 1.6; }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jirawatpyk/aura-react",
-  "version": "5.78.0",
+  "version": "5.79.0",
   "description": "AURA Design System — React components (Enterprise Standard, Human Creative). Thai-first: Buddhist-era dates, Thai collation.",
   "license": "MIT",
   "type": "module",