@krizaka/ui 3.30.0 → 3.32.0

package/registry/examples/app-shell/basic.tsx

@@ -21,7 +21,7 @@ export default function AppShellBasic() {
         <AppShell.Item href="#earnings" icon={dot} label="Earnings" />
       </AppShell.Sidebar>
       <AppShell.Body>
-        <AppShell.Header title="Home" menuLabel="Open the menu" actions={<Button size="sm" variant="primary" shape="cut">Upload</Button>} />
+        <AppShell.Header title="Home" menuLabel="Open the menu" actions={<Button size="sm" variant="primary">Upload</Button>} />
         <AppShell.Main>
           <p className="text-sm text-fg-secondary">The screen's content.</p>
         </AppShell.Main>

package/registry/examples/app-shell/desktop.js

@@ -22,7 +22,7 @@ function AppShellDesktop() {
       /* @__PURE__ */ jsx(AppShell.Item, { href: "#logs", icon: dot, label: "Logs" })
     ] }),
     /* @__PURE__ */ jsxs(AppShell.Body, { children: [
-      /* @__PURE__ */ jsx(AppShell.Header, { title: "Models", menuLabel: "Open the menu", actions: /* @__PURE__ */ jsx(Button, { size: "sm", variant: "primary", shape: "cut", children: "Add a model" }) }),
+      /* @__PURE__ */ jsx(AppShell.Header, { title: "Models", menuLabel: "Open the menu", actions: /* @__PURE__ */ jsx(Button, { size: "sm", variant: "primary", children: "Add a model" }) }),
       /* @__PURE__ */ jsxs(AppShell.Main, { className: "space-y-4", children: [
         /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 rounded-lg border border-border-subtle bg-surface-1 p-4", children: [
           /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1 space-y-2", children: [

package/registry/examples/app-shell/desktop.tsx

@@ -20,7 +20,7 @@ export default function AppShellDesktop() {
         <AppShell.Item href="#logs" icon={dot} label="Logs" />
       </AppShell.Sidebar>
       <AppShell.Body>
-        <AppShell.Header title="Models" menuLabel="Open the menu" actions={<Button size="sm" variant="primary" shape="cut">Add a model</Button>} />
+        <AppShell.Header title="Models" menuLabel="Open the menu" actions={<Button size="sm" variant="primary">Add a model</Button>} />
         <AppShell.Main className="space-y-4">
           <div className="flex items-center justify-between gap-3 rounded-lg border border-border-subtle bg-surface-1 p-4">
             <div className="min-w-0 flex-1 space-y-2">

package/registry/examples/app-shell/orochia-studio.js

@@ -55,7 +55,7 @@ function AppShellOrochiaStudio() {
         {
           title: "Studio",
           menuLabel: "Open the menu",
-          actions: /* @__PURE__ */ jsx(Button, { size: "sm", variant: "primary", shape: "cut", children: "Upload a video" })
+          actions: /* @__PURE__ */ jsx(Button, { size: "sm", variant: "primary", children: "Upload a video" })
         }
       ),
       /* @__PURE__ */ jsx(AppShell.Main, { children: /* @__PURE__ */ jsxs(DashboardLayout, { headingAs: "h2", eyebrow: "This week", title: "Good morning, Elena", description: "Three sales since yesterday \u2014 your auction ends tonight.", children: [

package/registry/examples/app-shell/orochia-studio.tsx

@@ -59,7 +59,7 @@ export default function AppShellOrochiaStudio() {
           <AppShell.Header
             title="Studio"
             menuLabel="Open the menu"
-            actions={<Button size="sm" variant="primary" shape="cut">Upload a video</Button>}
+            actions={<Button size="sm" variant="primary">Upload a video</Button>}
           />
           <AppShell.Main>
             <DashboardLayout headingAs="h2" eyebrow="This week" title="Good morning, Elena" description="Three sales since yesterday — your auction ends tonight.">

package/registry/examples/argument-card/hover-quiet.js

@@ -10,7 +10,7 @@ var reasons = [
   { id: "telemetry", title: "Zero telemetry", hook: "Elsewhere, usage data is the price of the free tier." }
 ];
 function ArgumentCardHoverQuiet() {
-  return /* @__PURE__ */ jsx(CardGrid, { className: "w-full max-w-5xl", min: 260, reveal: false, hover: "quiet", children: reasons.map((r) => /* @__PURE__ */ jsx(ArgumentCard, { id: `quiet-${r.id}`, title: r.title, hook: { label: "The trap elsewhere", text: r.hook }, more: { href: `#${r.id}`, label: "Details" } }, r.id)) });
+  return /* @__PURE__ */ jsx(CardGrid, { className: "w-full max-w-5xl", min: 260, reveal: false, children: reasons.map((r) => /* @__PURE__ */ jsx(ArgumentCard, { id: `quiet-${r.id}`, title: r.title, hook: { label: "The trap elsewhere", text: r.hook }, more: { href: `#${r.id}`, label: "Details" } }, r.id)) });
 }
 export {
   ArgumentCardHoverQuiet as default

package/registry/examples/argument-card/hover-quiet.tsx

@@ -10,7 +10,7 @@ const reasons = [
 // The quiet hover on the reasons: no glow, a lift, a ring on focus. The grid is quiet, so every card is.
 export default function ArgumentCardHoverQuiet() {
   return (
-    <CardGrid className="w-full max-w-5xl" min={260} reveal={false} hover="quiet">
+    <CardGrid className="w-full max-w-5xl" min={260} reveal={false}>
       {reasons.map((r) => (
         <ArgumentCard key={r.id} id={`quiet-${r.id}`} title={r.title} hook={{ label: "The trap elsewhere", text: r.hook }} more={{ href: `#${r.id}`, label: "Details" }} />
       ))}

package/registry/examples/auth-layout/onboarding.js

@@ -43,8 +43,8 @@ function AuthLayoutOnboarding() {
             /* @__PURE__ */ jsx(Field.Hint, { id: "onboarding-iban-hint", children: "Checked before your first payout." })
           ] }),
           /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
-            /* @__PURE__ */ jsx(Button, { type: "button", variant: "secondary", size: "lg", shape: "cut", className: "flex-1", children: "Back" }),
-            /* @__PURE__ */ jsx(Button, { type: "submit", variant: "primary", size: "lg", shape: "cut", className: "flex-1", children: "Continue" })
+            /* @__PURE__ */ jsx(Button, { type: "button", variant: "secondary", size: "lg", className: "flex-1", children: "Back" }),
+            /* @__PURE__ */ jsx(Button, { type: "submit", variant: "primary", size: "lg", className: "flex-1", children: "Continue" })
           ] })
         ] })
       ]

package/registry/examples/auth-layout/onboarding.tsx

@@ -37,8 +37,8 @@ export default function AuthLayoutOnboarding() {
             <Field.Hint id="onboarding-iban-hint">Checked before your first payout.</Field.Hint>
           </Field.Root>
           <div className="flex gap-2">
-            <Button type="button" variant="secondary" size="lg" shape="cut" className="flex-1">Back</Button>
-            <Button type="submit" variant="primary" size="lg" shape="cut" className="flex-1">Continue</Button>
+            <Button type="button" variant="secondary" size="lg" className="flex-1">Back</Button>
+            <Button type="submit" variant="primary" size="lg" className="flex-1">Continue</Button>
           </div>
         </form>
       </AuthLayout>

package/registry/examples/auth-layout/sign-in.js

@@ -44,8 +44,8 @@ function AuthLayoutSignIn() {
           /* @__PURE__ */ jsx(Input, { id: "sign-in-password", type: "password", autoComplete: "current-password" }),
           /* @__PURE__ */ jsx(Field.Hint, { children: /* @__PURE__ */ jsx("a", { className: "text-fg-accent", href: "#reset", children: "Forgot it?" }) })
         ] }),
-        /* @__PURE__ */ jsx(Button, { type: "submit", variant: "primary", size: "lg", shape: "cut", shimmer: true, className: "w-full", children: "Sign in" }),
-        /* @__PURE__ */ jsx(Button, { type: "button", variant: "secondary", size: "lg", shape: "cut", className: "w-full", children: "Use a passkey" })
+        /* @__PURE__ */ jsx(Button, { type: "submit", variant: "primary", size: "lg", className: "w-full", children: "Sign in" }),
+        /* @__PURE__ */ jsx(Button, { type: "button", variant: "secondary", size: "lg", className: "w-full", children: "Use a passkey" })
       ] })
     }
   ) });

package/registry/examples/auth-layout/sign-in.tsx

@@ -34,10 +34,10 @@ export default function AuthLayoutSignIn() {
             <Input id="sign-in-password" type="password" autoComplete="current-password" />
             <Field.Hint><a className="text-fg-accent" href="#reset">Forgot it?</a></Field.Hint>
           </Field.Root>
-          <Button type="submit" variant="primary" size="lg" shape="cut" shimmer className="w-full">
+          <Button type="submit" variant="primary" size="lg" className="w-full">
             Sign in
           </Button>
-          <Button type="button" variant="secondary" size="lg" shape="cut" className="w-full">
+          <Button type="button" variant="secondary" size="lg" className="w-full">
             Use a passkey
           </Button>
         </form>

package/registry/examples/auth-layout/verify.js

@@ -15,7 +15,7 @@ function AuthLayoutVerify() {
       /* @__PURE__ */ jsx(Field.Label, { htmlFor: "verify-code", children: "Code" }),
       /* @__PURE__ */ jsx(Input, { id: "verify-code", inputMode: "numeric", autoComplete: "one-time-code", maxLength: 6 })
     ] }),
-    /* @__PURE__ */ jsx(Button, { type: "submit", variant: "primary", size: "lg", shape: "cut", className: "w-full", children: "Verify" })
+    /* @__PURE__ */ jsx(Button, { type: "submit", variant: "primary", size: "lg", className: "w-full", children: "Verify" })
   ] }) });
 }
 export {

package/registry/examples/auth-layout/verify.tsx

@@ -12,7 +12,7 @@ export default function AuthLayoutVerify() {
           <Field.Label htmlFor="verify-code">Code</Field.Label>
           <Input id="verify-code" inputMode="numeric" autoComplete="one-time-code" maxLength={6} />
         </Field.Root>
-        <Button type="submit" variant="primary" size="lg" shape="cut" className="w-full">Verify</Button>
+        <Button type="submit" variant="primary" size="lg" className="w-full">Verify</Button>
       </form>
     </AuthLayout>
   );

package/registry/examples/button/signature.js

@@ -5,11 +5,11 @@ import { Button } from "@krizaka/ui/button";
 import { jsx, jsxs } from "react/jsx-runtime";
 function ButtonSignature() {
   return /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-3", children: [
-    /* @__PURE__ */ jsxs(Button, { variant: "gradient", size: "lg", shape: "cut", shimmer: true, magnetic: true, children: [
+    /* @__PURE__ */ jsxs(Button, { variant: "gradient", size: "lg", children: [
       "Start free",
       /* @__PURE__ */ jsx("svg", { "data-kz-icon": "ForwardIcon", viewBox: "0 0 24 24", className: "h-4 w-4", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx("path", { d: "M5 12h14M13 6l6 6-6 6" }) })
     ] }),
-    /* @__PURE__ */ jsx(Button, { variant: "outline", size: "lg", shape: "cut", children: "Talk to us" })
+    /* @__PURE__ */ jsx(Button, { variant: "outline", size: "lg", children: "Talk to us" })
   ] });
 }
 export {

package/registry/examples/button/signature.tsx

@@ -1,17 +1,17 @@
 import { Button } from "@krizaka/ui/button";
 
-// The one action a page is about: cut corners, the brand gradient, a sheen on hover, a lean toward the pointer
-// (`magnetic`, with MotionObserver mounted). The arrow of a signature icon leans forward on hover too.
+// The one action a page is about: the brand gradient beside a quiet outline. The arrow of a signature icon leans
+// forward on hover; the button itself never moves (krizaka-ui#393).
 export default function ButtonSignature() {
   return (
     <div className="flex flex-wrap items-center gap-3">
-      <Button variant="gradient" size="lg" shape="cut" shimmer magnetic>
+      <Button variant="gradient" size="lg">
         Start free
         <svg data-kz-icon="ForwardIcon" viewBox="0 0 24 24" className="h-4 w-4" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" aria-hidden>
           <path d="M5 12h14M13 6l6 6-6 6" />
         </svg>
       </Button>
-      <Button variant="outline" size="lg" shape="cut">
+      <Button variant="outline" size="lg">
         Talk to us
       </Button>
     </div>

package/registry/examples/card/interactive-link.tsx

@@ -1,6 +1,6 @@
 import { Card } from "@krizaka/ui/card";
 
-// `asChild` + `<a>`: the whole card is one link; `interactive` adds the spotlight and the lift.
+// `asChild` + `<a>`: the whole card is one link; `interactive` adds the quiet hover (a hairline and surface step).
 export default function CardInteractiveLink() {
   return (
     <Card.Root asChild interactive>

package/registry/examples/card-grid/hover-quiet.js

@@ -11,7 +11,7 @@ var shortcuts = [
   { id: "admin", logo: "orochia", title: "Orochia admin console", text: "Verification, moderation, payouts \u2014 behind four gates." }
 ];
 function CardGridHoverQuiet() {
-  return /* @__PURE__ */ jsx(CardGrid, { className: "w-full max-w-4xl", min: 260, reveal: false, hover: "quiet", children: shortcuts.map((s) => /* @__PURE__ */ jsx(LinkCard, { href: `#${s.id}`, icon: /* @__PURE__ */ jsx(ProductLogo, { id: s.logo, size: 24, animated: false }), title: s.title, description: s.text, cta: "Open" }, s.id)) });
+  return /* @__PURE__ */ jsx(CardGrid, { className: "w-full max-w-4xl", min: 260, reveal: false, children: shortcuts.map((s) => /* @__PURE__ */ jsx(LinkCard, { href: `#${s.id}`, icon: /* @__PURE__ */ jsx(ProductLogo, { id: s.logo, size: 24, animated: false }), title: s.title, description: s.text, cta: "Open" }, s.id)) });
 }
 export {
   CardGridHoverQuiet as default

package/registry/examples/card-grid/hover-quiet.tsx

@@ -11,7 +11,7 @@ const shortcuts = [
 // A whole grid quiet: `hover="quiet"` on the grid, the cards inherit it (a card can still say `hover="light"`).
 export default function CardGridHoverQuiet() {
   return (
-    <CardGrid className="w-full max-w-4xl" min={260} reveal={false} hover="quiet">
+    <CardGrid className="w-full max-w-4xl" min={260} reveal={false}>
       {shortcuts.map((s) => (
         <LinkCard key={s.id} href={`#${s.id}`} icon={<ProductLogo id={s.logo} size={24} animated={false} />} title={s.title} description={s.text} cta="Open" />
       ))}

package/registry/examples/component-page/button.js

@@ -16,8 +16,8 @@ function ComponentPageButton() {
       summary: "The action: six looks, three sizes, the Krizaka cut, and the whole life of an action built in.",
       facts: [{ label: "Web + Mobile", tone: "ok" }, { label: "Stable" }],
       preview: /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-center gap-3 p-8", children: [
-        /* @__PURE__ */ jsx(Button, { variant: "primary", shape: "cut", shimmer: true, children: "Publish" }),
-        /* @__PURE__ */ jsx(Button, { variant: "secondary", shape: "cut", children: "Save a draft" })
+        /* @__PURE__ */ jsx(Button, { variant: "primary", children: "Publish" }),
+        /* @__PURE__ */ jsx(Button, { variant: "secondary", children: "Save a draft" })
       ] }),
       install: { code: 'import { Button } from "@krizaka/ui/button";', language: "ts", copyLabel: "Copy", copiedLabel: "Copied" },
       sections: [

package/registry/examples/component-page/button.tsx

@@ -15,8 +15,8 @@ export default function ComponentPageButton() {
       facts={[{ label: "Web + Mobile", tone: "ok" }, { label: "Stable" }]}
       preview={
         <div className="flex flex-wrap items-center justify-center gap-3 p-8">
-          <Button variant="primary" shape="cut" shimmer>Publish</Button>
-          <Button variant="secondary" shape="cut">Save a draft</Button>
+          <Button variant="primary">Publish</Button>
+          <Button variant="secondary">Save a draft</Button>
         </div>
       }
       install={{ code: 'import { Button } from "@krizaka/ui/button";', language: "ts", copyLabel: "Copy", copiedLabel: "Copied" }}

package/registry/examples/contact-page/team.js

@@ -28,7 +28,7 @@ function ContactPageTeam() {
           /* @__PURE__ */ jsx(Field.Label, { htmlFor: "contact-message", children: "Message" }),
           /* @__PURE__ */ jsx(Textarea, { id: "contact-message", rows: 4 })
         ] }),
-        /* @__PURE__ */ jsx(Button, { type: "submit", variant: "primary", size: "lg", shape: "cut", shimmer: true, children: "Send" })
+        /* @__PURE__ */ jsx(Button, { type: "submit", variant: "primary", size: "lg", children: "Send" })
       ] }),
       next: { title: "What happens next", steps: [{ title: "We read it", text: "The same day, on working days." }, { title: "We answer", text: "Within two working days." }] }
     }

package/registry/examples/contact-page/team.tsx

@@ -29,7 +29,7 @@ export default function ContactPageTeam() {
             <Field.Label htmlFor="contact-message">Message</Field.Label>
             <Textarea id="contact-message" rows={4} />
           </Field.Root>
-          <Button type="submit" variant="primary" size="lg" shape="cut" shimmer>Send</Button>
+          <Button type="submit" variant="primary" size="lg">Send</Button>
         </form>
       }
       next={{ title: "What happens next", steps: [{ title: "We read it", text: "The same day, on working days." }, { title: "We answer", text: "Within two working days." }] }}

package/registry/examples/cover-hero/plain.js

@@ -5,7 +5,7 @@ import { Button } from "@krizaka/ui/button";
 import { CoverHero } from "@krizaka/ui/cover-hero";
 import { jsx } from "react/jsx-runtime";
 function CoverHeroPlain() {
-  return /* @__PURE__ */ jsx(CoverHero, { eyebrow: "Plateau \xB7 Montr\xE9al", title: "Atelier S\xE8ve", lead: "Ceramics classes for beginners, in small groups.", actions: /* @__PURE__ */ jsx(Button, { size: "lg", shape: "cut", variant: "primary", children: "Book a class" }) });
+  return /* @__PURE__ */ jsx(CoverHero, { eyebrow: "Plateau \xB7 Montr\xE9al", title: "Atelier S\xE8ve", lead: "Ceramics classes for beginners, in small groups.", actions: /* @__PURE__ */ jsx(Button, { size: "lg", variant: "primary", children: "Book a class" }) });
 }
 export {
   CoverHeroPlain as default

package/registry/examples/cover-hero/plain.tsx

@@ -3,5 +3,5 @@ import { CoverHero } from "@krizaka/ui/cover-hero";
 
 // Without a cover the hero wears the brand's colours: a new shop still opens on a designed screen.
 export default function CoverHeroPlain() {
-  return <CoverHero eyebrow="Plateau · Montréal" title="Atelier Sève" lead="Ceramics classes for beginners, in small groups." actions={<Button size="lg" shape="cut" variant="primary">Book a class</Button>} />;
+  return <CoverHero eyebrow="Plateau · Montréal" title="Atelier Sève" lead="Ceramics classes for beginners, in small groups." actions={<Button size="lg" variant="primary">Book a class</Button>} />;
 }

package/registry/examples/cover-hero/shop.js

@@ -18,7 +18,7 @@ function CoverHeroShop() {
         /* @__PURE__ */ jsx(Badge, { tone: "success", dot: true, size: "md", children: "Open now \xB7 closes at 5 pm" }),
         /* @__PURE__ */ jsx(Badge, { tone: "scrim", size: "md", children: "Saint-Henri" })
       ] }),
-      actions: /* @__PURE__ */ jsx(Button, { size: "lg", shape: "cut", variant: "primary", children: "Book a walk" })
+      actions: /* @__PURE__ */ jsx(Button, { size: "lg", variant: "primary", children: "Book a walk" })
     }
   );
 }

package/registry/examples/cover-hero/shop.tsx

@@ -14,7 +14,7 @@ export default function CoverHeroShop() {
       title="Pattes de Saint-Henri"
       lead="Neighbourhood dog walks, with a photo and a note after each one."
       facts={<><Badge tone="success" dot size="md">Open now · closes at 5 pm</Badge><Badge tone="scrim" size="md">Saint-Henri</Badge></>}
-      actions={<Button size="lg" shape="cut" variant="primary">Book a walk</Button>}
+      actions={<Button size="lg" variant="primary">Book a walk</Button>}
     />
   );
 }

package/registry/examples/dashboard-layout/orazaka-eric.js

@@ -25,8 +25,8 @@ function DashboardLayoutOrazakaEric() {
       title: "Good morning, Eric",
       description: "Nothing left your server this week: 1,284 requests, all answered locally.",
       actions: /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(Button, { size: "sm", variant: "secondary", shape: "cut", children: "Add a pack" }),
-        /* @__PURE__ */ jsx(Button, { size: "sm", variant: "primary", shape: "cut", children: "New job" })
+        /* @__PURE__ */ jsx(Button, { size: "sm", variant: "secondary", children: "Add a pack" }),
+        /* @__PURE__ */ jsx(Button, { size: "sm", variant: "primary", children: "New job" })
       ] }),
       toolbar: /* @__PURE__ */ jsxs(Chip.Group, { type: "single", label: "Period", defaultValue: "7d", required: true, children: [
         /* @__PURE__ */ jsx(Chip, { value: "today", children: "Today" }),

package/registry/examples/dashboard-layout/orazaka-eric.tsx

@@ -27,8 +27,8 @@ export default function DashboardLayoutOrazakaEric() {
         description="Nothing left your server this week: 1,284 requests, all answered locally."
         actions={
           <>
-            <Button size="sm" variant="secondary" shape="cut">Add a pack</Button>
-            <Button size="sm" variant="primary" shape="cut">New job</Button>
+            <Button size="sm" variant="secondary">Add a pack</Button>
+            <Button size="sm" variant="primary">New job</Button>
           </>
         }
         toolbar={

package/registry/examples/detail-layout/checkout.js

@@ -20,7 +20,7 @@ function DetailLayoutCheckout() {
       meta: "She keeps 90 %. Paid out every Monday.",
       aside: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 rounded-xl border border-border-default bg-surface-1 p-4", children: [
         /* @__PURE__ */ jsx(Stat, { label: "You pay", value: `\u20AC${amount}`, hint: "no fee added on top" }),
-        /* @__PURE__ */ jsx(Button, { variant: "primary", shape: "cut", className: "w-full", children: `Tip \u20AC${amount}` })
+        /* @__PURE__ */ jsx(Button, { variant: "primary", className: "w-full", children: `Tip \u20AC${amount}` })
       ] }),
       children: /* @__PURE__ */ jsxs("form", { className: "flex max-w-lg flex-col gap-5", onSubmit: (e) => e.preventDefault(), children: [
         /* @__PURE__ */ jsx(Chip.Group, { type: "single", label: "Amount", value: amount, onValueChange: (v) => v && setAmount(v), required: true, children: AMOUNTS.map((a) => /* @__PURE__ */ jsx(Chip, { value: String(a), children: `\u20AC${a}` }, a)) }),

package/registry/examples/detail-layout/checkout.tsx

@@ -23,7 +23,7 @@ export default function DetailLayoutCheckout() {
         aside={
           <div className="flex flex-col gap-4 rounded-xl border border-border-default bg-surface-1 p-4">
             <Stat label="You pay" value={`€${amount}`} hint="no fee added on top" />
-            <Button variant="primary" shape="cut" className="w-full">{`Tip €${amount}`}</Button>
+            <Button variant="primary" className="w-full">{`Tip €${amount}`}</Button>
           </div>
         }
       >

package/registry/examples/detail-layout/job.js

@@ -15,7 +15,7 @@ function DetailLayoutJob() {
       title: "Podcast transcript",
       status: /* @__PURE__ */ jsx(Badge, { tone: "accent", dot: true, children: "Running" }),
       meta: "Whisper large \xB7 started 5 min ago",
-      actions: /* @__PURE__ */ jsx(Button, { size: "sm", variant: "danger", shape: "cut", children: "Cancel" }),
+      actions: /* @__PURE__ */ jsx(Button, { size: "sm", variant: "danger", children: "Cancel" }),
       children: /* @__PURE__ */ jsx("p", { className: "text-sm text-fg-secondary", children: "The transcript appears here as it is written." })
     }
   );

package/registry/examples/detail-layout/job.tsx

@@ -12,7 +12,7 @@ export default function DetailLayoutJob() {
       title="Podcast transcript"
       status={<Badge tone="accent" dot>Running</Badge>}
       meta="Whisper large · started 5 min ago"
-      actions={<Button size="sm" variant="danger" shape="cut">Cancel</Button>}
+      actions={<Button size="sm" variant="danger">Cancel</Button>}
     >
       <p className="text-sm text-fg-secondary">The transcript appears here as it is written.</p>
     </DetailLayout>

package/registry/examples/detail-layout/video.js

@@ -19,8 +19,8 @@ function DetailLayoutVideo() {
       status: /* @__PURE__ */ jsx(Badge, { tone: "success", dot: true, children: "Published" }),
       meta: /* @__PURE__ */ jsx(Facts, { items: [{ label: "12:48" }, { label: "Unlock \u20AC4.99" }, { label: "18+ checked", tone: "ok" }] }),
       actions: /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(Button, { size: "sm", variant: "secondary", shape: "cut", children: "Edit" }),
-        /* @__PURE__ */ jsx(Button, { size: "sm", variant: "primary", shape: "cut", children: "Share" })
+        /* @__PURE__ */ jsx(Button, { size: "sm", variant: "secondary", children: "Edit" }),
+        /* @__PURE__ */ jsx(Button, { size: "sm", variant: "primary", children: "Share" })
       ] }),
       tabs: /* @__PURE__ */ jsxs(Tabs.List, { "aria-label": "Video", children: [
         /* @__PURE__ */ jsx(Tabs.Trigger, { value: "overview", children: "Overview" }),

package/registry/examples/detail-layout/video.tsx

@@ -23,8 +23,8 @@ export default function DetailLayoutVideo() {
           meta={<Facts items={[{ label: "12:48" }, { label: "Unlock €4.99" }, { label: "18+ checked", tone: "ok" }]} />}
           actions={
             <>
-              <Button size="sm" variant="secondary" shape="cut">Edit</Button>
-              <Button size="sm" variant="primary" shape="cut">Share</Button>
+              <Button size="sm" variant="secondary">Edit</Button>
+              <Button size="sm" variant="primary">Share</Button>
             </>
           }
           tabs={

package/registry/examples/docs-hub-page/krizaka.js

@@ -20,7 +20,7 @@ function DocsHubPageKrizaka() {
       eyebrow: "Documentation",
       title: "Build with Krizaka",
       lead: "Every building block the products are made of, documented from its source.",
-      search: /* @__PURE__ */ jsxs(Button, { variant: "secondary", size: "lg", shape: "cut", className: "w-full justify-between text-fg-secondary", children: [
+      search: /* @__PURE__ */ jsxs(Button, { variant: "secondary", size: "lg", className: "w-full justify-between text-fg-secondary", children: [
         "Search the documentation ",
         /* @__PURE__ */ jsx(Kbd, { children: "\u2318K" })
       ] }),

package/registry/examples/docs-hub-page/krizaka.tsx

@@ -21,7 +21,7 @@ export default function DocsHubPageKrizaka() {
       title="Build with Krizaka"
       lead="Every building block the products are made of, documented from its source."
       search={
-        <Button variant="secondary" size="lg" shape="cut" className="w-full justify-between text-fg-secondary">
+        <Button variant="secondary" size="lg" className="w-full justify-between text-fg-secondary">
           Search the documentation <Kbd>⌘K</Kbd>
         </Button>
       }

package/registry/examples/empty-state/library.js

@@ -15,7 +15,7 @@ function EmptyStateLibrary() {
         icon: /* @__PURE__ */ jsx(Mascot, { bird: "flamingo", mood: "empty", size: 96 }),
         title: "Nothing here yet",
         description: "Your videos, once published, wait here with their sales. The first one takes about ten minutes.",
-        action: /* @__PURE__ */ jsx(Button, { variant: "primary", shape: "cut", children: "Publish a first video" })
+        action: /* @__PURE__ */ jsx(Button, { variant: "primary", children: "Publish a first video" })
       }
     )
   ] });

package/registry/examples/empty-state/library.tsx

@@ -13,7 +13,7 @@ export default function EmptyStateLibrary() {
         icon={<Mascot bird="flamingo" mood="empty" size={96} />}
         title="Nothing here yet"
         description="Your videos, once published, wait here with their sales. The first one takes about ten minutes."
-        action={<Button variant="primary" shape="cut">Publish a first video</Button>}
+        action={<Button variant="primary">Publish a first video</Button>}
       />
     </Page>
   );