@flytedan/flytebot-design-system 0.38.0 → 0.40.0

package/dist/index.d.cts

@@ -20,14 +20,14 @@ interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
     block?: boolean;
     as?: "button" | "a";
     /** When `disabled` (or `loading`), stay in the tab order instead of going natively
-     *  `disabled`: renders `aria-disabled="true"` rather than the `disabled` attribute,
-     *  keeps the `:focus-visible` ring, and swallows click/Enter/Space without ever
-     *  submitting a form. Use whenever a button's disabled state can flip while it holds
-     *  focus (e.g. a controlled panel re-seeding mid-edit) — a native `disabled` drops focus
-     *  to `<body>` the instant it applies, and nothing can intercept or redirect that.
-     *  Also makes `aria-disabled` always explicit ("true"/"false", never absent): since the
-     *  browser can no longer tell assistive tech this button's state from `disabled` itself,
-     *  the ARIA state has to say so on its own at every render, not only while disabled. */
+     *  `disabled`: renders `aria-disabled="true"` only while actually disabled/loading (never
+     *  the `disabled` attribute), keeps the `:focus-visible` ring, and swallows
+     *  click/Enter/Space — including never letting a click bubble to an ancestor's own
+     *  handler — without ever submitting a form. Use whenever a button's disabled state can
+     *  flip while it holds focus (e.g. a controlled panel re-seeding mid-edit) — a native
+     *  `disabled` drops focus to `<body>` the instant it applies, and nothing can intercept or
+     *  redirect that. Once enabled again, this behaves exactly like a plain button: no
+     *  `aria-disabled` attribute at all. */
     focusableWhenDisabled?: boolean;
 }
 declare function Button({ children, variant, size, icon, trailingIcon, arrow, loading, disabled, focusableWhenDisabled, block, as, className, onClick, onKeyDown, ...rest }: ButtonProps): React.JSX.Element;

package/dist/index.d.ts

@@ -20,14 +20,14 @@ interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
     block?: boolean;
     as?: "button" | "a";
     /** When `disabled` (or `loading`), stay in the tab order instead of going natively
-     *  `disabled`: renders `aria-disabled="true"` rather than the `disabled` attribute,
-     *  keeps the `:focus-visible` ring, and swallows click/Enter/Space without ever
-     *  submitting a form. Use whenever a button's disabled state can flip while it holds
-     *  focus (e.g. a controlled panel re-seeding mid-edit) — a native `disabled` drops focus
-     *  to `<body>` the instant it applies, and nothing can intercept or redirect that.
-     *  Also makes `aria-disabled` always explicit ("true"/"false", never absent): since the
-     *  browser can no longer tell assistive tech this button's state from `disabled` itself,
-     *  the ARIA state has to say so on its own at every render, not only while disabled. */
+     *  `disabled`: renders `aria-disabled="true"` only while actually disabled/loading (never
+     *  the `disabled` attribute), keeps the `:focus-visible` ring, and swallows
+     *  click/Enter/Space — including never letting a click bubble to an ancestor's own
+     *  handler — without ever submitting a form. Use whenever a button's disabled state can
+     *  flip while it holds focus (e.g. a controlled panel re-seeding mid-edit) — a native
+     *  `disabled` drops focus to `<body>` the instant it applies, and nothing can intercept or
+     *  redirect that. Once enabled again, this behaves exactly like a plain button: no
+     *  `aria-disabled` attribute at all. */
     focusableWhenDisabled?: boolean;
 }
 declare function Button({ children, variant, size, icon, trailingIcon, arrow, loading, disabled, focusableWhenDisabled, block, as, className, onClick, onKeyDown, ...rest }: ButtonProps): React.JSX.Element;

package/dist/index.js

@@ -8,9 +8,6 @@ var VARIANTS = {
   danger: "fd-btn-danger",
   link: "fd-btn-link"
 };
-function isActivationKey(key) {
-  return key === "Enter" || key === " ";
-}
 function Button({
   children,
   variant = "primary",
@@ -43,15 +40,13 @@ function Button({
     {
       className: cls,
       disabled: Tag2 === "button" ? (disabled || loading) && !focusableWhenDisabled : void 0,
-      "aria-disabled": focusableWhenDisabled ? String(disabled || loading) : disabled || loading ? "true" : void 0,
+      "aria-disabled": disabled || loading ? "true" : void 0,
       "aria-busy": loading ? "true" : void 0,
       onClick: inert ? (e) => {
         e.preventDefault();
+        e.stopPropagation();
       } : onClick,
-      onKeyDown: inert ? (e) => {
-        if (isActivationKey(e.key)) e.preventDefault();
-        onKeyDown?.(e);
-      } : onKeyDown,
+      onKeyDown,
       ...rest,
       children: [
         icon && !loading ? /* @__PURE__ */ jsx("i", { className: "ph ph-" + icon, "aria-hidden": "true" }) : null,