@orangecheck/design 0.32.0 → 0.32.2

package/dist/chrome.mjs

@@ -535,7 +535,7 @@ var SECTIONS = [
 function CategoryChip({ category }) {
   if (category === "hub") return null;
   const label = category === "product" ? "product" : category === "protocol" ? "protocol" : "owner";
-  const tone = category === "product" ? "border-primary/25 bg-primary/10 text-primary" : category === "protocol" ? "border-muted-foreground/20 bg-muted/40 text-muted-foreground/85" : "border-warning/30 bg-warning/10 text-warning";
+  const tone = category === "product" ? "border-primary/25 bg-primary/10 text-primary" : category === "protocol" ? "border-muted-foreground/20 bg-muted/40 text-muted-foreground" : "border-warning/30 bg-warning/10 text-warning";
   return /* @__PURE__ */ jsx(
     "span",
     {
@@ -552,7 +552,7 @@ function SiteStateBadge({ state }) {
     "span",
     {
       "aria-label": `site lifecycle: ${state}`,
-      className: "text-muted-foreground/70 ml-1 hidden font-mono text-[9px] font-medium tracking-widest uppercase sm:inline-block",
+      className: "text-muted-foreground ml-1 hidden font-mono text-[9px] font-medium tracking-widest uppercase sm:inline-block",
       "data-oc-site-state": state,
       children: SITE_STATE_LABEL[state]
     }
@@ -561,7 +561,7 @@ function SiteStateBadge({ state }) {
 function MenuCategoryChip({ category }) {
   if (category === "hub") return null;
   const label = category === "product" ? "pro" : category === "protocol" ? "spec" : "own";
-  const tone = category === "product" ? "bg-primary/10 text-primary" : category === "protocol" ? "bg-muted/60 text-muted-foreground/80" : "bg-warning/15 text-warning";
+  const tone = category === "product" ? "bg-primary/10 text-primary" : category === "protocol" ? "bg-muted/60 text-muted-foreground" : "bg-warning/15 text-warning";
   return /* @__PURE__ */ jsx(
     "span",
     {
@@ -678,7 +678,7 @@ function OcLogoDropdown({
                     ChevronDown,
                     {
                       "aria-hidden": true,
-                      className: "text-muted-foreground/70 group-hover:text-foreground/80 h-3.5 w-3.5 shrink-0 transition-transform duration-200 " + (open ? "rotate-180" : "")
+                      className: "text-muted-foreground group-hover:text-foreground/80 h-3.5 w-3.5 shrink-0 transition-transform duration-200 " + (open ? "rotate-180" : "")
                     }
                   )
                 ]
@@ -693,7 +693,7 @@ function OcLogoDropdown({
             "aria-label": "go to " + homeHref + " (this site's home)",
             onClick: () => setOpen(false),
             tabIndex: open ? 0 : -1,
-            className: "hover:text-primary group/home -ml-1 hidden items-center gap-1 rounded-sm px-1.5 py-1 font-mono text-[9px] tracking-widest uppercase transition-all duration-200 sm:inline-flex " + (open ? "pointer-events-auto translate-x-0 text-muted-foreground/70 opacity-100 hover:bg-accent/30" : "pointer-events-none -translate-x-1 opacity-0"),
+            className: "hover:text-primary group/home -ml-1 hidden items-center gap-1 rounded-sm px-1.5 py-1 font-mono text-[9px] tracking-widest uppercase transition-all duration-200 sm:inline-flex " + (open ? "pointer-events-auto translate-x-0 text-muted-foreground opacity-100 hover:bg-accent/30" : "pointer-events-none -translate-x-1 opacity-0"),
             "data-oc-logo-dropdown-home-hint": "",
             children: [
               /* @__PURE__ */ jsx(
@@ -729,7 +729,7 @@ function OcLogoDropdown({
                     {
                       role: "separator",
                       "aria-hidden": true,
-                      className: "text-muted-foreground/60 px-4 pt-2.5 pb-1 font-mono text-[9px] font-medium tracking-widest uppercase " + (category === "hub" ? "" : "border-t mt-1"),
+                      className: "text-muted-foreground px-4 pt-2.5 pb-1 font-mono text-[9px] font-medium tracking-widest uppercase " + (category === "hub" ? "" : "border-t mt-1"),
                       children: label
                     }
                   ),
@@ -951,7 +951,7 @@ function CopyableDid({ did }) {
         /* @__PURE__ */ jsx(
           "span",
           {
-            className: "mt-px shrink-0 transition-colors " + (copied ? "text-primary" : "text-muted-foreground/50 group-hover/did:text-foreground/80"),
+            className: "mt-px shrink-0 transition-colors " + (copied ? "text-primary" : "text-muted-foreground group-hover/did:text-foreground/80"),
             "aria-hidden": true,
             children: copied ? /* @__PURE__ */ jsx(Check, { className: "size-3.5" }) : /* @__PURE__ */ jsx(Copy, { className: "size-3.5" })
           }
@@ -1026,10 +1026,10 @@ function PromoteRow({
             "data-oc-account-menu-promote-copy": kind,
             "data-copied": copied ? "" : void 0,
             className: "hover:bg-background/70 focus-visible:ring-ring/60 flex size-6 shrink-0 items-center justify-center rounded transition-colors focus-visible:ring-2 focus-visible:outline-none",
-            children: copied ? /* @__PURE__ */ jsx(Check, { className: "text-primary size-3.5" }) : /* @__PURE__ */ jsx(Copy, { className: "text-muted-foreground/50 size-3.5" })
+            children: copied ? /* @__PURE__ */ jsx(Check, { className: "text-primary size-3.5" }) : /* @__PURE__ */ jsx(Copy, { className: "text-muted-foreground size-3.5" })
           }
         ),
-        /* @__PURE__ */ jsx("span", { className: "text-muted-foreground/50 w-14 shrink-0 text-right text-[9px] tracking-widest uppercase", children: busy ? /* @__PURE__ */ jsx(Loader2, { className: "ml-auto size-3 animate-spin" }) : kindLabel }),
+        /* @__PURE__ */ jsx("span", { className: "text-muted-foreground w-14 shrink-0 text-right text-[9px] tracking-widest uppercase", children: busy ? /* @__PURE__ */ jsx(Loader2, { className: "ml-auto size-3 animate-spin" }) : kindLabel }),
         /* @__PURE__ */ jsx("span", { className: "sr-only", "aria-live": "polite", children: copied ? "Copied to clipboard" : "" })
       ]
     }
@@ -1086,7 +1086,7 @@ function IdentityPromoteSection({
     }
   };
   return /* @__PURE__ */ jsxs("div", { className: "border-border border-b p-1", "data-oc-account-menu-section": "show-as", children: [
-    /* @__PURE__ */ jsx("div", { className: "text-muted-foreground/60 px-3 pt-2 pb-1 font-mono text-[10px] tracking-widest uppercase", children: "\xA7 show as" }),
+    /* @__PURE__ */ jsx("div", { className: "text-muted-foreground px-3 pt-2 pb-1 font-mono text-[10px] tracking-widest uppercase", children: "\xA7 show as" }),
     options.map((opt) => /* @__PURE__ */ jsx(
       PromoteRow,
       {
@@ -1180,7 +1180,7 @@ function MobileMenu({
         "data-oc-account-mobile-popover": "",
         children: [
           links.length > 0 && /* @__PURE__ */ jsxs("div", { className: "border-b p-1", children: [
-            /* @__PURE__ */ jsx("div", { className: "text-muted-foreground/60 px-3 pt-2 pb-1 font-mono text-[10px] tracking-widest uppercase", children: "\xA7 navigate" }),
+            /* @__PURE__ */ jsx("div", { className: "text-muted-foreground px-3 pt-2 pb-1 font-mono text-[10px] tracking-widest uppercase", children: "\xA7 navigate" }),
             links.map(
               (l) => l.external ? /* @__PURE__ */ jsxs(
                 "a",
@@ -1194,7 +1194,7 @@ function MobileMenu({
                   children: [
                     /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", "aria-hidden": true, children: "\u2192" }),
                     /* @__PURE__ */ jsx("span", { className: "flex-1", children: l.label }),
-                    /* @__PURE__ */ jsx("span", { className: "text-muted-foreground/70 text-[10px]", "aria-hidden": true, children: "\u2197" })
+                    /* @__PURE__ */ jsx("span", { className: "text-muted-foreground text-[10px]", "aria-hidden": true, children: "\u2197" })
                   ]
                 },
                 l.href
@@ -1358,7 +1358,7 @@ function OcAccountMenuView({
                 tabPinned ? /* @__PURE__ */ jsxs(
                   "span",
                   {
-                    className: "text-muted-foreground/70 normal-case",
+                    className: "text-muted-foreground normal-case",
                     "data-oc-account-menu-tab-pin": "",
                     title: "This tab keeps this account even if you switch accounts in another tab",
                     children: [
@@ -1370,10 +1370,10 @@ function OcAccountMenuView({
               ] }),
               /* @__PURE__ */ jsx(CopyableDid, { did: account.didOc }),
               account.displayIdentity.kind !== "did" && account.displayIdentity.value ? /* @__PURE__ */ jsxs("div", { className: "mt-1 flex items-center gap-1.5 font-mono text-[10px] tracking-wide", children: [
-                /* @__PURE__ */ jsx("span", { className: "text-muted-foreground/50 uppercase", children: IDENTITY_KIND_LABEL[account.displayIdentity.kind] }),
+                /* @__PURE__ */ jsx("span", { className: "text-muted-foreground uppercase", children: IDENTITY_KIND_LABEL[account.displayIdentity.kind] }),
                 /* @__PURE__ */ jsx("span", { className: "text-foreground/75", children: obscureIdentity(account.displayIdentity.value) })
               ] }) : null,
-              displayName ? /* @__PURE__ */ jsx("div", { className: "text-muted-foreground/80 mt-1 font-mono text-[10px] tracking-wide", children: displayName }) : null
+              displayName ? /* @__PURE__ */ jsx("div", { className: "text-muted-foreground mt-1 font-mono text-[10px] tracking-wide", children: displayName }) : null
             ] }),
             /* @__PURE__ */ jsx(
               IdentityPromoteSection,
@@ -1414,7 +1414,7 @@ function OcAccountMenuView({
                   item.external ? /* @__PURE__ */ jsx(
                     "span",
                     {
-                      className: "text-muted-foreground/70 text-[10px]",
+                      className: "text-muted-foreground text-[10px]",
                       "aria-hidden": true,
                       children: "\u2197"
                     }
@@ -1463,7 +1463,7 @@ function OcAccountMenuView({
                     /* @__PURE__ */ jsx(
                       "span",
                       {
-                        className: "text-muted-foreground/70 text-[10px]",
+                        className: "text-muted-foreground text-[10px]",
                         "aria-hidden": true,
                         children: "\u2197"
                       }
@@ -1535,7 +1535,7 @@ function AccountsSection({
     }
   };
   return /* @__PURE__ */ jsxs("div", { className: "border-border border-b p-1", "data-oc-account-menu-section": "accounts", children: [
-    /* @__PURE__ */ jsx("div", { className: "text-muted-foreground/60 px-3 pt-2 pb-1 font-mono text-[10px] tracking-widest uppercase", children: "\xA7 accounts" }),
+    /* @__PURE__ */ jsx("div", { className: "text-muted-foreground px-3 pt-2 pb-1 font-mono text-[10px] tracking-widest uppercase", children: "\xA7 accounts" }),
     roster.map((peer) => /* @__PURE__ */ jsx(
       SwitchRow,
       {
@@ -1613,7 +1613,7 @@ function SwitchRow({
           }
         ),
         /* @__PURE__ */ jsx("span", { className: "text-foreground/90 min-w-0 flex-1 truncate", children: label }),
-        /* @__PURE__ */ jsx("span", { className: "text-muted-foreground/50 w-14 shrink-0 text-right text-[9px] tracking-widest uppercase", children: busy ? /* @__PURE__ */ jsx(Loader2, { className: "ml-auto size-3 animate-spin" }) : kindLabel })
+        /* @__PURE__ */ jsx("span", { className: "text-muted-foreground w-14 shrink-0 text-right text-[9px] tracking-widest uppercase", children: busy ? /* @__PURE__ */ jsx(Loader2, { className: "ml-auto size-3 animate-spin" }) : kindLabel })
       ]
     }
   );
@@ -1632,7 +1632,7 @@ function PopoverSection({
       className: cn("p-1", bordered && "border-border border-t", className),
       "data-oc-account-menu-section": label,
       children: [
-        /* @__PURE__ */ jsxs("div", { className: "text-muted-foreground/60 px-3 pt-2 pb-1 font-mono text-[10px] tracking-widest uppercase", children: [
+        /* @__PURE__ */ jsxs("div", { className: "text-muted-foreground px-3 pt-2 pb-1 font-mono text-[10px] tracking-widest uppercase", children: [
           "\xA7 ",
           label
         ] }),
@@ -1650,7 +1650,7 @@ function PopoverSection({
               children: [
                 /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", "aria-hidden": true, children: "\u2192" }),
                 /* @__PURE__ */ jsx("span", { className: "flex-1", children: item.label }),
-                /* @__PURE__ */ jsx("span", { className: "text-muted-foreground/70 text-[10px]", "aria-hidden": true, children: "\u2197" })
+                /* @__PURE__ */ jsx("span", { className: "text-muted-foreground text-[10px]", "aria-hidden": true, children: "\u2197" })
               ]
             },
             item.href
@@ -1685,16 +1685,16 @@ function BuildFooter({
   return /* @__PURE__ */ jsxs(
     "div",
     {
-      className: "text-muted-foreground/60 border-border border-t px-3 py-2 font-mono text-[9.5px] tracking-widest uppercase",
+      className: "text-muted-foreground border-border border-t px-3 py-2 font-mono text-[9.5px] tracking-widest uppercase",
       "data-oc-account-menu-build": "",
       children: [
         hostname,
         state && state !== "live" ? /* @__PURE__ */ jsxs(Fragment, { children: [
           " \xB7 ",
-          /* @__PURE__ */ jsx("span", { className: "text-muted-foreground/80", children: state })
+          /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: state })
         ] }) : null,
         " ",
-        /* @__PURE__ */ jsxs("span", { className: "text-muted-foreground/80", children: [
+        /* @__PURE__ */ jsxs("span", { className: "text-muted-foreground", children: [
           "v",
           build.version,
           showSha ? /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -1741,7 +1741,7 @@ function OcPrimaryNav({
             "span",
             {
               "aria-hidden": true,
-              className: "text-muted-foreground/60 ml-1 text-[9px]",
+              className: "text-muted-foreground ml-1 text-[9px]",
               children: "\u2197"
             }
           ) : null
@@ -1924,10 +1924,10 @@ function Sidebar({
               }
             ) : null
           ] }),
-          siteLabel ? /* @__PURE__ */ jsx("div", { className: "text-muted-foreground/70 mt-1 font-mono text-[10px] tracking-widest uppercase", children: siteLabel }) : null
+          siteLabel ? /* @__PURE__ */ jsx("div", { className: "text-muted-foreground mt-1 font-mono text-[10px] tracking-widest uppercase", children: siteLabel }) : null
         ] }),
         /* @__PURE__ */ jsxs("nav", { className: "flex-1 overflow-y-auto px-2 py-3", children: [
-          /* @__PURE__ */ jsx("div", { className: "text-muted-foreground/60 mb-1 px-3 font-mono text-[10px] tracking-widest uppercase", children: "\xA7 tools" }),
+          /* @__PURE__ */ jsx("div", { className: "text-muted-foreground mb-1 px-3 font-mono text-[10px] tracking-widest uppercase", children: "\xA7 tools" }),
           /* @__PURE__ */ jsx("ul", { className: "space-y-0.5", children: tools.map((tool) => {
             const isActive2 = tool.id === active;
             const innerCls = "flex items-baseline gap-2 rounded px-3 py-1.5 text-[12.5px] transition-colors " + (isActive2 ? "bg-primary/10 text-primary font-semibold" : "text-muted-foreground hover:text-foreground hover:bg-muted/30");
@@ -1935,19 +1935,19 @@ function Sidebar({
               tool.icon ? /* @__PURE__ */ jsx(
                 "span",
                 {
-                  className: "shrink-0 font-mono text-[11px] " + (isActive2 ? "text-primary" : "text-muted-foreground/70"),
+                  className: "shrink-0 font-mono text-[11px] " + (isActive2 ? "text-primary" : "text-muted-foreground"),
                   "aria-hidden": true,
                   children: tool.icon
                 }
               ) : null,
               /* @__PURE__ */ jsxs("span", { className: "flex-1 leading-tight", children: [
                 /* @__PURE__ */ jsx("span", { children: tool.label }),
-                tool.tagline ? /* @__PURE__ */ jsx("span", { className: "text-muted-foreground/60 mt-0.5 block font-mono text-[10px] tracking-wide normal-case", children: tool.tagline }) : null
+                tool.tagline ? /* @__PURE__ */ jsx("span", { className: "text-muted-foreground mt-0.5 block font-mono text-[10px] tracking-wide normal-case", children: tool.tagline }) : null
               ] }),
               tool.external ? /* @__PURE__ */ jsx(
                 "span",
                 {
-                  className: "text-muted-foreground/60 text-[10px]",
+                  className: "text-muted-foreground text-[10px]",
                   "aria-hidden": true,
                   children: "\u2197"
                 }
@@ -2002,14 +2002,14 @@ function OcDashboardHub({ tools, className }) {
             tool.external ? /* @__PURE__ */ jsx(
               "span",
               {
-                className: "text-muted-foreground/60 ml-auto text-xs",
+                className: "text-muted-foreground ml-auto text-xs",
                 "aria-hidden": true,
                 children: "\u2197"
               }
             ) : /* @__PURE__ */ jsx(
               "span",
               {
-                className: "text-muted-foreground/60 ml-auto text-xs",
+                className: "text-muted-foreground ml-auto text-xs",
                 "aria-hidden": true,
                 children: "\u2192"
               }
@@ -2077,7 +2077,7 @@ function LayoutSubHeader({
       /* @__PURE__ */ jsx("span", { className: "text-muted-foreground hidden tracking-widest whitespace-nowrap uppercase sm:inline", children: status }),
       /* @__PURE__ */ jsx("span", { className: "text-foreground truncate", children: product })
     ] }),
-    tags.length > 0 && /* @__PURE__ */ jsx("div", { className: "text-muted-foreground/55 hidden shrink-0 items-center gap-x-3 tracking-wider whitespace-nowrap uppercase sm:flex", children: tags.map((tag, i) => /* @__PURE__ */ jsx("span", { className: tag.hideBelow ? HIDE[tag.hideBelow] : void 0, children: tag.label }, i)) })
+    tags.length > 0 && /* @__PURE__ */ jsx("div", { className: "text-muted-foreground hidden shrink-0 items-center gap-x-3 tracking-wider whitespace-nowrap uppercase sm:flex", children: tags.map((tag, i) => /* @__PURE__ */ jsx("span", { className: tag.hideBelow ? HIDE[tag.hideBelow] : void 0, children: tag.label }, i)) })
   ] }) });
 }
 function OcAppBar({
@@ -2120,7 +2120,7 @@ var GRID = {
   4: "md:grid-cols-[1.2fr_1fr_1fr_1fr_1fr]",
   5: "md:grid-cols-[1.2fr_1fr_1fr_1fr_1fr_1fr]"
 };
-var LINK_CLS = "text-muted-foreground hover:text-foreground font-mono text-xs tracking-wide lowercase transition-colors";
+var LINK_CLS = "text-muted-foreground hover:text-foreground inline-flex min-h-11 min-w-11 items-center font-mono text-xs tracking-wide lowercase transition-colors md:min-h-0 md:min-w-0";
 function FooterLinkItem({ link }) {
   if (link.external) {
     return /* @__PURE__ */ jsxs("a", { href: link.href, target: "_blank", rel: "noreferrer", className: LINK_CLS, children: [
@@ -2137,7 +2137,7 @@ function FooterLinkItem({ link }) {
 function FooterColumnView({ column }) {
   return /* @__PURE__ */ jsxs("div", { children: [
     /* @__PURE__ */ jsx("div", { className: "label-mono text-primary mb-3", children: column.label }),
-    /* @__PURE__ */ jsx("ul", { className: "space-y-2", children: column.links.map((link) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(FooterLinkItem, { link }) }, `${column.label}:${link.href}`)) })
+    /* @__PURE__ */ jsx("ul", { className: "md:space-y-2", children: column.links.map((link) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(FooterLinkItem, { link }) }, `${column.label}:${link.href}`)) })
   ] });
 }
 function familyColumn(category, label) {
@@ -2198,12 +2198,12 @@ function OcFamilyFooter({
         year,
         " orangecheck \xB7 mit + cc-by-4.0"
       ] }) }),
-      /* @__PURE__ */ jsx("div", { className: "text-muted-foreground/80 flex flex-wrap items-center gap-x-4 gap-y-1", children: links.map((link) => /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsx("div", { className: "text-muted-foreground flex flex-wrap items-center gap-x-4 md:gap-y-1", children: links.map((link) => /* @__PURE__ */ jsx(
         "a",
         {
           href: link.href,
           ...link.external ? { target: "_blank", rel: "noreferrer" } : {},
-          className: "hover:text-foreground transition-colors",
+          className: "hover:text-foreground inline-flex min-h-11 items-center transition-colors md:min-h-0",
           children: link.label
         },
         link.label