@adia-ai/web-components 0.8.43 → 0.8.44

package/patterns/marketing-engagement/marketing-engagement.examples.html

@@ -100,11 +100,11 @@
         <section>
           <col-ui gap="3">
             <field-ui label="Your referral link">
-              <input-ui name="referral_url" value="adia.ai/r/kim-A4F92" readonly icon-trailing="copy"></input-ui>
+              <input-ui name="referral_url" value="adia.ai/r/kim-A4F92" readonly suffix="copy"></input-ui>
             </field-ui>
             <row-ui gap="2">
-              <button-ui text="Copy link" variant="primary" icon-leading="copy"></button-ui>
-              <button-ui text="Email" variant="ghost" icon-leading="envelope"></button-ui>
+              <button-ui text="Copy link" variant="primary" icon="copy"></button-ui>
+              <button-ui text="Email" variant="ghost" icon="envelope"></button-ui>
               <button-ui text="X" variant="ghost"></button-ui>
               <button-ui text="LinkedIn" variant="ghost"></button-ui>
             </row-ui>
@@ -265,7 +265,7 @@
         </section>
         <footer divider>
           <button-ui slot="action" text="Keep going" variant="ghost"></button-ui>
-          <button-ui slot="action" text="Share" variant="primary" icon-leading="share-network"></button-ui>
+          <button-ui slot="action" text="Share" variant="primary" icon="share-network"></button-ui>
         </footer>
       </card-ui>
     </div>

package/patterns/notifications-bell-and-digest/notifications-bell-and-digest.examples.html

@@ -138,7 +138,7 @@
         <header>
           <span slot="heading" variant="section">Weekly digest preview</span>
           <text-ui slot="description" color="subtle">This is what your Monday morning email will contain</text-ui>
-          <button-ui slot="action" text="Send test" variant="ghost" size="sm" icon-leading="paper-plane-tilt"></button-ui>
+          <button-ui slot="action" text="Send test" variant="ghost" size="sm" icon="paper-plane-tilt"></button-ui>
         </header>
         <section>
           <col-ui gap="4">

package/patterns/permissions-matrix/permissions-matrix.examples.html

@@ -30,7 +30,7 @@
         <header>
           <span slot="heading" variant="section">Permissions</span>
           <text-ui slot="description" color="subtle">Changes save automatically</text-ui>
-          <button-ui slot="action" text="Add custom role" variant="ghost" size="sm" icon-leading="plus"></button-ui>
+          <button-ui slot="action" text="Add custom role" variant="ghost" size="sm" icon="plus"></button-ui>
         </header>
         <section bleed>
           <table-ui frameless id="pat-perm-matrix"></table-ui>

package/patterns/permissions-sharing/permissions-sharing.examples.html

@@ -59,7 +59,7 @@
           <col-ui gap="3">
             <row-ui gap="2" align="center">
               <input-ui readonly value="https://acme.app/d/8421-revenue-q2" style="flex: 1;"></input-ui>
-              <button-ui text="Copy" variant="primary" icon-leading="copy"></button-ui>
+              <button-ui text="Copy" variant="primary" icon="copy"></button-ui>
             </row-ui>
             <row-ui gap="3" align="center">
               <field-ui label="Expires" inline>
@@ -88,7 +88,7 @@
           </col-ui>
         </section>
         <footer divider>
-          <button-ui slot="action" text="Revoke link" variant="ghost" color="danger" size="sm" icon-leading="x"></button-ui>
+          <button-ui slot="action" text="Revoke link" variant="ghost" color="danger" size="sm" icon="x"></button-ui>
         </footer>
       </card-ui>
     </div>

package/patterns/profile-public-and-verification/profile-public-and-verification.examples.html

@@ -38,13 +38,13 @@
               <col-ui gap="1" grow>
                 <row-ui gap="2" align="center">
                   <text-ui strong size="lg">Kim Granlund</text-ui>
-                  <tag-ui variant="primary" icon-leading="seal-check">Verified</tag-ui>
+                  <tag-ui variant="primary">Verified</tag-ui>
                 </row-ui>
                 <text-ui color="subtle">Founder · AdiaUI · Reykjavík, IS</text-ui>
                 <text-ui>Building the AdiaUI web-components library and the A2UI generative-UI runtime. Previously at Construct, before that at Modular.</text-ui>
                 <row-ui gap="2" style="margin-top: 0.5rem;">
                   <button-ui text="Follow" variant="primary" size="sm"></button-ui>
-                  <button-ui text="Message" variant="ghost" size="sm" icon-leading="chat-circle"></button-ui>
+                  <button-ui text="Message" variant="ghost" size="sm" icon="chat-circle"></button-ui>
                   <button-ui icon="dots-three" variant="ghost" size="sm" aria-label="More"></button-ui>
                 </row-ui>
               </col-ui>
@@ -178,7 +178,7 @@
         <header>
           <span slot="heading" variant="section">
             You're verified
-            <tag-ui variant="primary" icon-leading="seal-check">Verified</tag-ui>
+            <tag-ui variant="primary">Verified</tag-ui>
           </span>
         </header>
         <section>
@@ -205,7 +205,7 @@
           </alert-ui>
         </section>
         <footer divider>
-          <button-ui slot="action" text="Try again" variant="primary" icon-leading="arrow-counter-clockwise"></button-ui>
+          <button-ui slot="action" text="Try again" variant="primary" icon="arrow-counter-clockwise"></button-ui>
           <button-ui slot="action" text="Contact support" variant="ghost"></button-ui>
         </footer>
       </card-ui>

package/patterns/search-discovery/search-discovery.examples.html

@@ -169,7 +169,7 @@
           </list-ui>
         </section>
         <footer divider>
-          <button-ui slot="action" text="Clear all recents" variant="ghost" size="sm" icon-leading="trash"></button-ui>
+          <button-ui slot="action" text="Clear all recents" variant="ghost" size="sm" icon="trash"></button-ui>
         </footer>
       </card-ui>
     </div>
@@ -188,7 +188,7 @@
         <header>
           <span slot="heading" variant="section">Saved views</span>
           <text-ui slot="description" color="subtle">5 views · last edited 2 days ago</text-ui>
-          <button-ui slot="action" text="Save current view" variant="primary" size="sm" icon-leading="bookmark-simple"></button-ui>
+          <button-ui slot="action" text="Save current view" variant="primary" size="sm" icon="bookmark-simple"></button-ui>
         </header>
         <section bleed>
           <list-ui divider contained>

package/styles/type/roles.css

@@ -67,9 +67,17 @@
      ORIENT — tell the reader where they are
      ────────────────────────────────────── */
 
-  /* kicker — short label above a title (eyebrow/overline) */
-  --a-kicker-family: var(--a-font-family-ui);
-  --a-kicker-weight: var(--a-weight-semibold);
+  /* kicker — short label above a title (eyebrow/overline)
+     gh#1718: mono stack at regular (400) weight — operator-ruled
+     component-level change (was UI-sans / semibold). Applies wherever
+     the [variant="kicker"] global attribute grammar reads this token
+     (styles/type/roles.css's own @layer utilities block below) —
+     text-ui, menu-ui's group-header kicker styling, and any other
+     variant="kicker" consumer, since the L3 role token is the single
+     shared source of truth for this role (roles.css §"[variant]
+     attribute API"). */
+  --a-kicker-family: var(--a-font-family-code);
+  --a-kicker-weight: var(--a-weight-normal);
   --a-kicker-sm: 11px;
   --a-kicker-md: 12px;
   --a-kicker-lg: 13px;
@@ -81,9 +89,13 @@
   --a-kicker-mbs: 0;
   --a-kicker-mbe: 0.5em;
 
-  /* label — UI labels, form fields, badges, tabs */
-  --a-label-family: var(--a-font-family-ui);
-  --a-label-weight: var(--a-weight-medium);
+  /* label — UI labels, form fields, badges, tabs
+     gh#1718: mono stack at regular (400) weight — operator-ruled
+     component-level change (was UI-sans / medium). Shared L3 token —
+     see the kicker note above on why this reaches every
+     [variant="label"] consumer, not text-ui alone. */
+  --a-label-family: var(--a-font-family-code);
+  --a-label-weight: var(--a-weight-normal);
   --a-label-sm: 11px;
   --a-label-md: 12px;
   --a-label-lg: 13px;
@@ -131,9 +143,17 @@
      DIVIDE — break flow into chunks
      ────────────────────────────────────── */
 
-  /* section — h2/h3, major division within content */
-  --a-section-family: var(--a-font-family-heading);
-  --a-section-weight: var(--a-weight-semibold);
+  /* section — h2/h3, major division within content
+     gh#1718: mono stack like kicker, but at 500 weight — operator-ruled
+     component-level change (was heading-family / semibold). Shared L3
+     token — also reaches richtext-ui's h2 weight (richtext.css aliases
+     --richtext-h2-weight to this token) via the same single-source
+     design; nav/nav-item/nav-group's OWN [variant="section"] is
+     structural, not typographic, and is already excluded from this
+     token's global attribute rule (roles.css's [variant="section"]
+     utility, `:not(nav-ui, nav-item-ui, nav-group-ui)`). */
+  --a-section-family: var(--a-font-family-code);
+  --a-section-weight: var(--a-weight-medium);
   --a-section-sm: 16px;
   --a-section-md: 17px;
   --a-section-lg: 19px;