@adea-ai/ui 0.137.0 → 0.138.0

package/dist/components/ui/alert-dialog/alert-dialog.d.ts

@@ -3,10 +3,11 @@ import type { ComponentProps } from 'solid-js';
 /**
  * AlertDialog.
  *
- * A dialog that cannot be dismissed by accident: Escape and a click on the scrim
- * do nothing, and the user must choose one of the actions. That is the whole
- * difference from Dialog, and it is why this exists as its own component rather
- * than a prop — a caller has to reach for it deliberately.
+ * A dialog that cannot be dismissed by accident: a click on the scrim does nothing,
+ * and the user must choose one of the actions. Escape is the keyboard's Cancel: it
+ * closes the dialog exactly as the cancel action does, so nothing is confirmed. That
+ * is the whole difference from Dialog, and it is why this exists as its own
+ * component rather than a prop — a caller has to reach for it deliberately.
  *
  * The consequence is a rule of use: this is for confirming a destructive or
  * irreversible step. Wrapping an ordinary form in an AlertDialog traps someone who

package/dist/components/ui/alert-dialog/alert-dialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/alert-dialog/alert-dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,IAAI,kBAAkB,EACjC,OAAO,IAAI,yBAAyB,EACrC,MAAM,4BAA4B,CAAA;AAEnC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAW9C;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,kCAE3E;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,kCAE1F;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,MAAM,CAAC,kCAExF;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,kCAY1F;AA2BD,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,yBAAyB,CAAC,kCAezF;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,kCAS7D;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,kCAS7D;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,KAAK,CAAC,kCAGtF;AAED,wBAAgB,sBAAsB,CACpC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,WAAW,CAAC,kCAS7D;AAsCD,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,WAAW,CAAC,kCAE7F;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,WAAW,CAAC,kCAE7F"}
+{"version":3,"file":"alert-dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/alert-dialog/alert-dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,IAAI,kBAAkB,EACjC,OAAO,IAAI,yBAAyB,EACrC,MAAM,4BAA4B,CAAA;AAEnC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAW9C;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,kCAE3E;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,kCAE1F;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,MAAM,CAAC,kCAExF;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,kCAY1F;AA+BD,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,yBAAyB,CAAC,kCAezF;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,kCAS7D;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,kCAS7D;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,KAAK,CAAC,kCAGtF;AAED,wBAAgB,sBAAsB,CACpC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,WAAW,CAAC,kCAS7D;AAsCD,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,WAAW,CAAC,kCAE7F;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,WAAW,CAAC,kCAE7F"}

package/dist/components/ui/alert-dialog/alert-dialog.js

@@ -11,10 +11,11 @@ var _tmpl$4 = /*#__PURE__*/ template(`<span class=contents>`);
 /**
 * AlertDialog.
 *
-* A dialog that cannot be dismissed by accident: Escape and a click on the scrim
-* do nothing, and the user must choose one of the actions. That is the whole
-* difference from Dialog, and it is why this exists as its own component rather
-* than a prop — a caller has to reach for it deliberately.
+* A dialog that cannot be dismissed by accident: a click on the scrim does nothing,
+* and the user must choose one of the actions. Escape is the keyboard's Cancel: it
+* closes the dialog exactly as the cancel action does, so nothing is confirmed. That
+* is the whole difference from Dialog, and it is why this exists as its own
+* component rather than a prop — a caller has to reach for it deliberately.
 *
 * The consequence is a rule of use: this is for confirming a destructive or
 * irreversible step. Wrapping an ordinary form in an AlertDialog traps someone who
@@ -42,22 +43,26 @@ function AlertDialogOverlay(props) {
 * The panel.
 *
 * Kobalte's `AlertDialog.Content` is `Dialog.Content` with `role="alertdialog"`
-* and nothing else — Escape and an outside click dismiss it exactly as they
-* dismiss a Dialog. That is a real gap in the primitive, so the blocking is
-* implemented here, and it is the whole difference between this component and a
-* Dialog:
+* and nothing else — an outside click dismisses it exactly as it dismisses a
+* Dialog. That is a real gap in the primitive, so the blocking is implemented
+* here, and it is the whole difference between this component and a Dialog:
 *
-*   - Escape is prevented, because a key that closes a confirmation is a key that
-*     makes "confirm" meaningless.
 *   - Pointer and focus interactions outside are prevented, including the scrim
-*     click, for the same reason.
+*     click, because a stray click that closes a confirmation is a click that
+*     makes "confirm" meaningless.
+*
+* Escape is deliberately left to the primitive. It can only ever cancel, never
+* confirm, so it is not an accident that matters; refusing it traps a keyboard
+* user who has changed their mind, and the WAI-ARIA alertdialog pattern says
+* Escape closes. It reports `onOpenChange(false)` and restores focus to the
+* trigger, which is what the cancel action does, and as the topmost layer it
+* closes only the confirmation, not a dialog underneath it.
 *
-* There is deliberately no prop to turn this off. A surface that can be escaped
+* There is deliberately no prop to turn the scrim blocking off. A surface that can be escaped
 * accidentally does not need to be an AlertDialog; it is a Dialog, and using this
 * one would be a claim about the flow that is not true.
 */
 var blockDismissal = {
-	onEscapeKeyDown: (event) => event.preventDefault(),
 	onPointerDownOutside: (event) => event.preventDefault(),
 	onFocusOutside: (event) => event.preventDefault(),
 	onInteractOutside: (event) => event.preventDefault()

package/dist/components/ui/alert-dialog/alert-dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog.js","names":["AlertDialog","KobalteAlertDialog","Content","KobalteAlertDialogContent","ComponentProps","createEffect","createSignal","splitProps","dialogSurface","overlayMotion","overlayPositioner","overlayScrim","overlayTitle","cn","props","_$createComponent","AlertDialogTrigger","Trigger","AlertDialogPortal","Portal","AlertDialogOverlay","Overlay","local","rest","_$mergeProps","class","blockDismissal","onEscapeKeyDown","event","KeyboardEvent","preventDefault","onPointerDownOutside","Event","onFocusOutside","onInteractOutside","const","AlertDialogContent","children","_el$","_tmpl$","_$className","_$insert","AlertDialogHeader","_el$2","_tmpl$2","_$spread","AlertDialogFooter","_el$3","_tmpl$3","AlertDialogTitle","Title","AlertDialogDescription","Description","AlertDialogChoice","CloseButton","wrapper","setWrapper","HTMLSpanElement","root","undefined","querySelector","removeAttribute","_el$4","_tmpl$4","_$use","AlertDialogAction","AlertDialogCancel","AlertDialog","_$createComponent","KobalteAlertDialog","_$mergeProps","KobalteAlertDialogContent"],"sources":["../../../../src/components/ui/alert-dialog/alert-dialog.tsx"],"sourcesContent":["import {\n  AlertDialog as KobalteAlertDialog,\n  Content as KobalteAlertDialogContent,\n} from '@kobalte/core/alert-dialog'\n// Use the alert-specific export rather than DialogRoot.Content, which other imports can replace.\nimport type { ComponentProps } from 'solid-js'\nimport { createEffect, createSignal, splitProps } from 'solid-js'\nimport {\n  dialogSurface,\n  overlayMotion,\n  overlayPositioner,\n  overlayScrim,\n  overlayTitle,\n} from '#lib/overlay'\nimport { cn } from '#lib/utils'\n\n/**\n * AlertDialog.\n *\n * A dialog that cannot be dismissed by accident: Escape and a click on the scrim\n * do nothing, and the user must choose one of the actions. That is the whole\n * difference from Dialog, and it is why this exists as its own component rather\n * than a prop — a caller has to reach for it deliberately.\n *\n * The consequence is a rule of use: this is for confirming a destructive or\n * irreversible step. Wrapping an ordinary form in an AlertDialog traps someone who\n * wants to back out.\n *\n * There is deliberately no close button in the corner. An X has no label, and the\n * point of this surface is that every exit is a named choice.\n */\nexport function AlertDialog(props: ComponentProps<typeof KobalteAlertDialog>) {\n  return <KobalteAlertDialog {...props} />\n}\n\nexport function AlertDialogTrigger(props: ComponentProps<typeof KobalteAlertDialog.Trigger>) {\n  return <KobalteAlertDialog.Trigger {...props} />\n}\n\nexport function AlertDialogPortal(props: ComponentProps<typeof KobalteAlertDialog.Portal>) {\n  return <KobalteAlertDialog.Portal {...props} />\n}\n\nexport function AlertDialogOverlay(props: ComponentProps<typeof KobalteAlertDialog.Overlay>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return (\n    <KobalteAlertDialog.Overlay\n      class={cn(\n        overlayScrim,\n        'data-expanded:animate-in data-expanded:fade-in-0 data-closed:animate-out data-closed:fade-out-0',\n        local.class\n      )}\n      {...rest}\n    />\n  )\n}\n\n/**\n * The panel.\n *\n * Kobalte's `AlertDialog.Content` is `Dialog.Content` with `role=\"alertdialog\"`\n * and nothing else — Escape and an outside click dismiss it exactly as they\n * dismiss a Dialog. That is a real gap in the primitive, so the blocking is\n * implemented here, and it is the whole difference between this component and a\n * Dialog:\n *\n *   - Escape is prevented, because a key that closes a confirmation is a key that\n *     makes \"confirm\" meaningless.\n *   - Pointer and focus interactions outside are prevented, including the scrim\n *     click, for the same reason.\n *\n * There is deliberately no prop to turn this off. A surface that can be escaped\n * accidentally does not need to be an AlertDialog; it is a Dialog, and using this\n * one would be a claim about the flow that is not true.\n */\nconst blockDismissal = {\n  onEscapeKeyDown: (event: KeyboardEvent) => event.preventDefault(),\n  onPointerDownOutside: (event: Event) => event.preventDefault(),\n  onFocusOutside: (event: Event) => event.preventDefault(),\n  onInteractOutside: (event: Event) => event.preventDefault(),\n} as const\n\nexport function AlertDialogContent(props: ComponentProps<typeof KobalteAlertDialogContent>) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <KobalteAlertDialog.Portal>\n      <AlertDialogOverlay />\n      <div class={overlayPositioner}>\n        <KobalteAlertDialogContent\n          {...blockDismissal}\n          class={cn(dialogSurface, overlayMotion, 'grid w-full max-w-md gap-4 p-5', local.class)}\n          {...rest}\n        />\n      </div>\n    </KobalteAlertDialog.Portal>\n  )\n}\n\nexport function AlertDialogHeader(props: ComponentProps<'div'>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return (\n    <div\n      data-slot=\"alert-dialog-header\"\n      class={cn('flex flex-col gap-1.5 text-start', local.class)}\n      {...rest}\n    />\n  )\n}\n\nexport function AlertDialogFooter(props: ComponentProps<'div'>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return (\n    <div\n      data-slot=\"alert-dialog-footer\"\n      class={cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', local.class)}\n      {...rest}\n    />\n  )\n}\n\nexport function AlertDialogTitle(props: ComponentProps<typeof KobalteAlertDialog.Title>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return <KobalteAlertDialog.Title class={cn(overlayTitle, local.class)} {...rest} />\n}\n\nexport function AlertDialogDescription(\n  props: ComponentProps<typeof KobalteAlertDialog.Description>\n) {\n  const [local, rest] = splitProps(props, ['class'])\n  return (\n    <KobalteAlertDialog.Description\n      class={cn('text-muted-foreground text-sm', local.class)}\n      {...rest}\n    />\n  )\n}\n\n/**\n * One of the dialog's two named choices.\n *\n * Kobalte labels its close button \"Dismiss\" by default, because a generic close\n * button is usually an icon with no text of its own. In an AlertDialog it is\n * something else: the named choices. An `aria-label` there *replaces* the visible\n * text, so a screen reader hears \"Dismiss\" twice and the user cannot tell the\n * destructive action from the safe one.\n *\n * The injected label is removed rather than overridden with an empty one. An empty\n * `aria-label` is not reliably ignored — some name computations treat its presence\n * as an explicit empty name, which leaves the button unnamed — so the attribute\n * has to go, and the visible text becomes the name. A caller whose button is an\n * icon passes its own `aria-label`, and that one is left alone.\n *\n * Applied through a layout-neutral wrapper because Kobalte keeps the `ref` for its\n * own dismissable layer and does not forward it. The wrapper is `display: contents`\n * so the button remains the flex item its parent lays out.\n */\nfunction AlertDialogChoice(props: ComponentProps<typeof KobalteAlertDialog.CloseButton>) {\n  const [local, rest] = splitProps(props, ['class', 'aria-label'])\n  const [wrapper, setWrapper] = createSignal<HTMLSpanElement>()\n\n  createEffect(() => {\n    const root = wrapper()\n    if (!root || local['aria-label'] !== undefined) return\n    root.querySelector('button')?.removeAttribute('aria-label')\n  })\n\n  return (\n    <span ref={setWrapper} class=\"contents\">\n      <KobalteAlertDialog.CloseButton class={cn(local.class)} {...rest} />\n    </span>\n  )\n}\n\nexport function AlertDialogAction(props: ComponentProps<typeof KobalteAlertDialog.CloseButton>) {\n  return <AlertDialogChoice {...props} />\n}\n\nexport function AlertDialogCancel(props: ComponentProps<typeof KobalteAlertDialog.CloseButton>) {\n  return <AlertDialogChoice {...props} />\n}\n"],"mappings":"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"}
+{"version":3,"file":"alert-dialog.js","names":["AlertDialog","KobalteAlertDialog","Content","KobalteAlertDialogContent","ComponentProps","createEffect","createSignal","splitProps","dialogSurface","overlayMotion","overlayPositioner","overlayScrim","overlayTitle","cn","props","_$createComponent","AlertDialogTrigger","Trigger","AlertDialogPortal","Portal","AlertDialogOverlay","Overlay","local","rest","_$mergeProps","class","blockDismissal","onPointerDownOutside","event","Event","preventDefault","onFocusOutside","onInteractOutside","const","AlertDialogContent","children","_el$","_tmpl$","_$className","_$insert","AlertDialogHeader","_el$2","_tmpl$2","_$spread","AlertDialogFooter","_el$3","_tmpl$3","AlertDialogTitle","Title","AlertDialogDescription","Description","AlertDialogChoice","CloseButton","wrapper","setWrapper","HTMLSpanElement","root","undefined","querySelector","removeAttribute","_el$4","_tmpl$4","_$use","AlertDialogAction","AlertDialogCancel","AlertDialog","_$createComponent","KobalteAlertDialog","_$mergeProps","KobalteAlertDialogContent"],"sources":["../../../../src/components/ui/alert-dialog/alert-dialog.tsx"],"sourcesContent":["import {\n  AlertDialog as KobalteAlertDialog,\n  Content as KobalteAlertDialogContent,\n} from '@kobalte/core/alert-dialog'\n// Use the alert-specific export rather than DialogRoot.Content, which other imports can replace.\nimport type { ComponentProps } from 'solid-js'\nimport { createEffect, createSignal, splitProps } from 'solid-js'\nimport {\n  dialogSurface,\n  overlayMotion,\n  overlayPositioner,\n  overlayScrim,\n  overlayTitle,\n} from '#lib/overlay'\nimport { cn } from '#lib/utils'\n\n/**\n * AlertDialog.\n *\n * A dialog that cannot be dismissed by accident: a click on the scrim does nothing,\n * and the user must choose one of the actions. Escape is the keyboard's Cancel: it\n * closes the dialog exactly as the cancel action does, so nothing is confirmed. That\n * is the whole difference from Dialog, and it is why this exists as its own\n * component rather than a prop — a caller has to reach for it deliberately.\n *\n * The consequence is a rule of use: this is for confirming a destructive or\n * irreversible step. Wrapping an ordinary form in an AlertDialog traps someone who\n * wants to back out.\n *\n * There is deliberately no close button in the corner. An X has no label, and the\n * point of this surface is that every exit is a named choice.\n */\nexport function AlertDialog(props: ComponentProps<typeof KobalteAlertDialog>) {\n  return <KobalteAlertDialog {...props} />\n}\n\nexport function AlertDialogTrigger(props: ComponentProps<typeof KobalteAlertDialog.Trigger>) {\n  return <KobalteAlertDialog.Trigger {...props} />\n}\n\nexport function AlertDialogPortal(props: ComponentProps<typeof KobalteAlertDialog.Portal>) {\n  return <KobalteAlertDialog.Portal {...props} />\n}\n\nexport function AlertDialogOverlay(props: ComponentProps<typeof KobalteAlertDialog.Overlay>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return (\n    <KobalteAlertDialog.Overlay\n      class={cn(\n        overlayScrim,\n        'data-expanded:animate-in data-expanded:fade-in-0 data-closed:animate-out data-closed:fade-out-0',\n        local.class\n      )}\n      {...rest}\n    />\n  )\n}\n\n/**\n * The panel.\n *\n * Kobalte's `AlertDialog.Content` is `Dialog.Content` with `role=\"alertdialog\"`\n * and nothing else — an outside click dismisses it exactly as it dismisses a\n * Dialog. That is a real gap in the primitive, so the blocking is implemented\n * here, and it is the whole difference between this component and a Dialog:\n *\n *   - Pointer and focus interactions outside are prevented, including the scrim\n *     click, because a stray click that closes a confirmation is a click that\n *     makes \"confirm\" meaningless.\n *\n * Escape is deliberately left to the primitive. It can only ever cancel, never\n * confirm, so it is not an accident that matters; refusing it traps a keyboard\n * user who has changed their mind, and the WAI-ARIA alertdialog pattern says\n * Escape closes. It reports `onOpenChange(false)` and restores focus to the\n * trigger, which is what the cancel action does, and as the topmost layer it\n * closes only the confirmation, not a dialog underneath it.\n *\n * There is deliberately no prop to turn the scrim blocking off. A surface that can be escaped\n * accidentally does not need to be an AlertDialog; it is a Dialog, and using this\n * one would be a claim about the flow that is not true.\n */\nconst blockDismissal = {\n  onPointerDownOutside: (event: Event) => event.preventDefault(),\n  onFocusOutside: (event: Event) => event.preventDefault(),\n  onInteractOutside: (event: Event) => event.preventDefault(),\n} as const\n\nexport function AlertDialogContent(props: ComponentProps<typeof KobalteAlertDialogContent>) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <KobalteAlertDialog.Portal>\n      <AlertDialogOverlay />\n      <div class={overlayPositioner}>\n        <KobalteAlertDialogContent\n          {...blockDismissal}\n          class={cn(dialogSurface, overlayMotion, 'grid w-full max-w-md gap-4 p-5', local.class)}\n          {...rest}\n        />\n      </div>\n    </KobalteAlertDialog.Portal>\n  )\n}\n\nexport function AlertDialogHeader(props: ComponentProps<'div'>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return (\n    <div\n      data-slot=\"alert-dialog-header\"\n      class={cn('flex flex-col gap-1.5 text-start', local.class)}\n      {...rest}\n    />\n  )\n}\n\nexport function AlertDialogFooter(props: ComponentProps<'div'>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return (\n    <div\n      data-slot=\"alert-dialog-footer\"\n      class={cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', local.class)}\n      {...rest}\n    />\n  )\n}\n\nexport function AlertDialogTitle(props: ComponentProps<typeof KobalteAlertDialog.Title>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return <KobalteAlertDialog.Title class={cn(overlayTitle, local.class)} {...rest} />\n}\n\nexport function AlertDialogDescription(\n  props: ComponentProps<typeof KobalteAlertDialog.Description>\n) {\n  const [local, rest] = splitProps(props, ['class'])\n  return (\n    <KobalteAlertDialog.Description\n      class={cn('text-muted-foreground text-sm', local.class)}\n      {...rest}\n    />\n  )\n}\n\n/**\n * One of the dialog's two named choices.\n *\n * Kobalte labels its close button \"Dismiss\" by default, because a generic close\n * button is usually an icon with no text of its own. In an AlertDialog it is\n * something else: the named choices. An `aria-label` there *replaces* the visible\n * text, so a screen reader hears \"Dismiss\" twice and the user cannot tell the\n * destructive action from the safe one.\n *\n * The injected label is removed rather than overridden with an empty one. An empty\n * `aria-label` is not reliably ignored — some name computations treat its presence\n * as an explicit empty name, which leaves the button unnamed — so the attribute\n * has to go, and the visible text becomes the name. A caller whose button is an\n * icon passes its own `aria-label`, and that one is left alone.\n *\n * Applied through a layout-neutral wrapper because Kobalte keeps the `ref` for its\n * own dismissable layer and does not forward it. The wrapper is `display: contents`\n * so the button remains the flex item its parent lays out.\n */\nfunction AlertDialogChoice(props: ComponentProps<typeof KobalteAlertDialog.CloseButton>) {\n  const [local, rest] = splitProps(props, ['class', 'aria-label'])\n  const [wrapper, setWrapper] = createSignal<HTMLSpanElement>()\n\n  createEffect(() => {\n    const root = wrapper()\n    if (!root || local['aria-label'] !== undefined) return\n    root.querySelector('button')?.removeAttribute('aria-label')\n  })\n\n  return (\n    <span ref={setWrapper} class=\"contents\">\n      <KobalteAlertDialog.CloseButton class={cn(local.class)} {...rest} />\n    </span>\n  )\n}\n\nexport function AlertDialogAction(props: ComponentProps<typeof KobalteAlertDialog.CloseButton>) {\n  return <AlertDialogChoice {...props} />\n}\n\nexport function AlertDialogCancel(props: ComponentProps<typeof KobalteAlertDialog.CloseButton>) {\n  return <AlertDialogChoice {...props} />\n}\n"],"mappings":"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"}

package/dist/r/src/components/ui/alert-dialog/alert-dialog.tsx

@@ -17,10 +17,11 @@ import { cn } from '../../../lib/utils'
 /**
  * AlertDialog.
  *
- * A dialog that cannot be dismissed by accident: Escape and a click on the scrim
- * do nothing, and the user must choose one of the actions. That is the whole
- * difference from Dialog, and it is why this exists as its own component rather
- * than a prop — a caller has to reach for it deliberately.
+ * A dialog that cannot be dismissed by accident: a click on the scrim does nothing,
+ * and the user must choose one of the actions. Escape is the keyboard's Cancel: it
+ * closes the dialog exactly as the cancel action does, so nothing is confirmed. That
+ * is the whole difference from Dialog, and it is why this exists as its own
+ * component rather than a prop — a caller has to reach for it deliberately.
  *
  * The consequence is a rule of use: this is for confirming a destructive or
  * irreversible step. Wrapping an ordinary form in an AlertDialog traps someone who
@@ -59,22 +60,26 @@ export function AlertDialogOverlay(props: ComponentProps<typeof KobalteAlertDial
  * The panel.
  *
  * Kobalte's `AlertDialog.Content` is `Dialog.Content` with `role="alertdialog"`
- * and nothing else — Escape and an outside click dismiss it exactly as they
- * dismiss a Dialog. That is a real gap in the primitive, so the blocking is
- * implemented here, and it is the whole difference between this component and a
- * Dialog:
+ * and nothing else — an outside click dismisses it exactly as it dismisses a
+ * Dialog. That is a real gap in the primitive, so the blocking is implemented
+ * here, and it is the whole difference between this component and a Dialog:
  *
- *   - Escape is prevented, because a key that closes a confirmation is a key that
- *     makes "confirm" meaningless.
  *   - Pointer and focus interactions outside are prevented, including the scrim
- *     click, for the same reason.
+ *     click, because a stray click that closes a confirmation is a click that
+ *     makes "confirm" meaningless.
+ *
+ * Escape is deliberately left to the primitive. It can only ever cancel, never
+ * confirm, so it is not an accident that matters; refusing it traps a keyboard
+ * user who has changed their mind, and the WAI-ARIA alertdialog pattern says
+ * Escape closes. It reports `onOpenChange(false)` and restores focus to the
+ * trigger, which is what the cancel action does, and as the topmost layer it
+ * closes only the confirmation, not a dialog underneath it.
  *
- * There is deliberately no prop to turn this off. A surface that can be escaped
+ * There is deliberately no prop to turn the scrim blocking off. A surface that can be escaped
  * accidentally does not need to be an AlertDialog; it is a Dialog, and using this
  * one would be a claim about the flow that is not true.
  */
 const blockDismissal = {
-  onEscapeKeyDown: (event: KeyboardEvent) => event.preventDefault(),
   onPointerDownOutside: (event: Event) => event.preventDefault(),
   onFocusOutside: (event: Event) => event.preventDefault(),
   onInteractOutside: (event: Event) => event.preventDefault(),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adea-ai/ui",
-  "version": "0.137.0",
+  "version": "0.138.0",
   "description": "The Adea design system: Kobalte-backed Solid components, semantic OKLCH tokens, and the app-shell layout primitives shared by Adea and Cortana.",
   "keywords": [
     "adea",

package/src/components/ui/alert-dialog/alert-dialog.tsx

@@ -17,10 +17,11 @@ import { cn } from '#lib/utils'
 /**
  * AlertDialog.
  *
- * A dialog that cannot be dismissed by accident: Escape and a click on the scrim
- * do nothing, and the user must choose one of the actions. That is the whole
- * difference from Dialog, and it is why this exists as its own component rather
- * than a prop — a caller has to reach for it deliberately.
+ * A dialog that cannot be dismissed by accident: a click on the scrim does nothing,
+ * and the user must choose one of the actions. Escape is the keyboard's Cancel: it
+ * closes the dialog exactly as the cancel action does, so nothing is confirmed. That
+ * is the whole difference from Dialog, and it is why this exists as its own
+ * component rather than a prop — a caller has to reach for it deliberately.
  *
  * The consequence is a rule of use: this is for confirming a destructive or
  * irreversible step. Wrapping an ordinary form in an AlertDialog traps someone who
@@ -59,22 +60,26 @@ export function AlertDialogOverlay(props: ComponentProps<typeof KobalteAlertDial
  * The panel.
  *
  * Kobalte's `AlertDialog.Content` is `Dialog.Content` with `role="alertdialog"`
- * and nothing else — Escape and an outside click dismiss it exactly as they
- * dismiss a Dialog. That is a real gap in the primitive, so the blocking is
- * implemented here, and it is the whole difference between this component and a
- * Dialog:
+ * and nothing else — an outside click dismisses it exactly as it dismisses a
+ * Dialog. That is a real gap in the primitive, so the blocking is implemented
+ * here, and it is the whole difference between this component and a Dialog:
  *
- *   - Escape is prevented, because a key that closes a confirmation is a key that
- *     makes "confirm" meaningless.
  *   - Pointer and focus interactions outside are prevented, including the scrim
- *     click, for the same reason.
+ *     click, because a stray click that closes a confirmation is a click that
+ *     makes "confirm" meaningless.
+ *
+ * Escape is deliberately left to the primitive. It can only ever cancel, never
+ * confirm, so it is not an accident that matters; refusing it traps a keyboard
+ * user who has changed their mind, and the WAI-ARIA alertdialog pattern says
+ * Escape closes. It reports `onOpenChange(false)` and restores focus to the
+ * trigger, which is what the cancel action does, and as the topmost layer it
+ * closes only the confirmation, not a dialog underneath it.
  *
- * There is deliberately no prop to turn this off. A surface that can be escaped
+ * There is deliberately no prop to turn the scrim blocking off. A surface that can be escaped
  * accidentally does not need to be an AlertDialog; it is a Dialog, and using this
  * one would be a claim about the flow that is not true.
  */
 const blockDismissal = {
-  onEscapeKeyDown: (event: KeyboardEvent) => event.preventDefault(),
   onPointerDownOutside: (event: Event) => event.preventDefault(),
   onFocusOutside: (event: Event) => event.preventDefault(),
   onInteractOutside: (event: Event) => event.preventDefault(),