@kanso-labs/kanso-ui 0.40.5 → 0.40.6

package/dist/button/hooks.js

@@ -2,6 +2,7 @@ import { refCallback } from "../render/ref.js";
 import { ariaAttributesOf } from "../render/aria.js";
 import { useRipple } from "../hooks/useRipple.js";
 import { c } from "react/compiler-runtime";
+import { useState } from "react";
 import { ButtonContext, useSlottedContext } from "react-aria-components";
 //#region src/button/hooks.ts
 /**
@@ -75,7 +76,42 @@ function useButtonBase(input, isPending) {
 	} else t5 = $[18];
 	return t5;
 }
+/**
+* A toggle's state, for a button that is a toggle on its own rather than in
+* a selecting group: the call site's `isSelected` where it holds the state,
+* otherwise the button's own, starting from `defaultSelected`. `toggle` is
+* what a press calls, and reports the new state through `onChange` either
+* way. Called whether or not the button is a toggle, so that becoming one
+* changes no hook order.
+*/
+function useSelection(t0) {
+	const $ = c(6);
+	const { defaultSelected, isSelected, onChange } = t0;
+	const [own, setOwn] = useState(defaultSelected ?? false);
+	const selected = isSelected ?? own;
+	let t1;
+	if ($[0] !== onChange || $[1] !== selected) {
+		t1 = () => {
+			setOwn(!selected);
+			onChange?.(!selected);
+		};
+		$[0] = onChange;
+		$[1] = selected;
+		$[2] = t1;
+	} else t1 = $[2];
+	let t2;
+	if ($[3] !== selected || $[4] !== t1) {
+		t2 = {
+			selected,
+			toggle: t1
+		};
+		$[3] = selected;
+		$[4] = t1;
+		$[5] = t2;
+	} else t2 = $[5];
+	return t2;
+}
 //#endregion
-export { useButtonBase };
+export { useButtonBase, useSelection };
 
 //# sourceMappingURL=hooks.js.map

package/dist/button/hooks.js.map

@@ -1 +1 @@
-{"version":3,"file":"hooks.js","names":["Ref","FocusableElement","ButtonContext","useSlottedContext","ButtonDOMProps","useRipple","ariaAttributesOf","refCallback","ButtonBaseInput","Pick","disableRipple","ref","HTMLAnchorElement","HTMLButtonElement","useButtonBase","input","isPending","$","_c","t0","isDisabled","onClick","onContextMenu","onKeyDown","onKeyUp","onPointerCancel","onPointerDown","onPointerLeave","onPointerUp","props","undefined","context","slot","disabled","t1","ripple","t2","t3","aria","t4","t5","element","_c"],"sources":["../../src/button/hooks.ts"],"sourcesContent":["import type { Ref } from 'react'\nimport type { FocusableElement } from 'react-aria-components'\n\nimport { ButtonContext, useSlottedContext } from 'react-aria-components'\n\nimport type { ButtonDOMProps } from '.'\n\nimport { useRipple } from '../hooks/useRipple'\nimport { ariaAttributesOf } from '../render/aria'\nimport { refCallback } from '../render/ref'\n\n// The hook half of `src/button`, apart from ./index.tsx so that file exports\n// components alone — which is what keeps fast refresh working for it, the\n// same arrangement `src/drag` uses.\n\n/** What {@link useButtonBase} takes off a button's props for itself. */\ntype ButtonBaseInput = Pick<\n  ButtonDOMProps,\n  | 'isDisabled'\n  | 'onClick'\n  | 'onContextMenu'\n  | 'onKeyDown'\n  | 'onKeyUp'\n  | 'onPointerCancel'\n  | 'onPointerDown'\n  | 'onPointerLeave'\n  | 'onPointerUp'\n  | 'slot'\n> & {\n  disableRipple?: boolean\n  ref?: Ref<HTMLAnchorElement | HTMLButtonElement>\n}\n\n/**\n * What a button does past React Aria, whichever of its elements it renders:\n * the disabled state a parent's context sets, the ripple, and the `aria-*`\n * props and keyboard handlers React Aria would drop or wrap. Hands back the\n * props it did not take, for the element.\n *\n * Shared by ButtonBase and by IconButton's toggle, which is React Aria's\n * `ToggleButton` rather than either element ButtonBase renders.\n */\nfunction useButtonBase<Props extends ButtonBaseInput>(\n  input: Props,\n  isPending: boolean,\n) {\n  const {\n    disableRipple = false,\n    isDisabled,\n    onClick,\n    onContextMenu,\n    onKeyDown,\n    onKeyUp,\n    onPointerCancel,\n    onPointerDown,\n    onPointerLeave,\n    onPointerUp,\n    ref,\n    ...props\n  } = input\n\n  // A parent's context may disable the button — React Aria's own fields\n  // disable the buttons they hold with them, a number field's stepper at the\n  // end of its range and a search field's clear button with the field — and\n  // React Aria takes a prop over its context, so a default of `false` here\n  // would keep the button enabled whatever the parent said. The call site's\n  // own prop still wins where it is given; the context is read for the\n  // ripple, which has to know before the render state does.\n  const context = useSlottedContext(ButtonContext, input.slot)\n  const disabled = isDisabled ?? context?.isDisabled ?? false\n\n  // The rest of the props (className/style, etc.) are handed back rather\n  // than given to the ripple: `className` and `style` there may be functions\n  // of render state, which the ripple's own handler-only merge doesn't need\n  // to know about. It is also why ButtonBase merges the styles through\n  // mergeStatefulStyles rather than the plain mergeStyles. The ripple is off\n  // while disabled: React Aria still forwards pointer events to a disabled\n  // element, and a press that changes nothing should not look like one.\n  //\n  // Off while pending for the same reason, and for a second one. React Aria\n  // nulls out the handlers it derived itself while pending — the click among\n  // them — but not the separate copy of the global pointer events that\n  // carries ours, so a press still reached the ripple and started it while\n  // the click that would have ended it never arrived. The ripple stayed at\n  // its pressed opacity until some later press completed a cycle of its own.\n  const ripple = useRipple<FocusableElement>(\n    !disableRipple && !disabled && !isPending,\n    {\n      onClick,\n      onContextMenu,\n      onPointerCancel,\n      onPointerDown,\n      onPointerLeave,\n      onPointerUp,\n    },\n  )\n\n  return {\n    disabled,\n    element: { aria: ariaAttributesOf(props), onKeyDown, onKeyUp },\n    props,\n    // The element is a button, a link or IconButton's toggle, so the ref is\n    // typed as a link or a button and handed to each as the callback all\n    // three accept — see src/render/ref.ts.\n    ref: refCallback(ref),\n    ripple,\n  }\n}\n\nexport { useButtonBase }\n"],"mappings":";;;;;;;;;;;;;;;AA0CA,SAAAc,cAAAC,OAAAC,WAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAIE,MAAA,EAAAR,eAAAS,IAAAC,YAAAC,SAAAC,eAAAC,WAAAC,SAAAC,iBAAAC,eAAAC,gBAAAC,aAAAjB,KAAA,GAAAkB,UAaId;CAZF,MAAAL,gBAAAS,OAAAW,KAAAA,IAAA,QAAAX;CAqBF,MAAAY,UAAgB5B,kBAAkBD,eAAea,MAAKiB,IAAK;CAC3D,MAAAC,WAAiBb,cAAcW,SAAOX,cAArB;CAA0C,IAAAc;CAAA,IAAAjB,EAAA,OAAAI,WAAAJ,EAAA,OAAAK,iBAAAL,EAAA,OAAAQ,mBAAAR,EAAA,OAAAS,iBAAAT,EAAA,OAAAU,kBAAAV,EAAA,OAAAW,aAAA;EAkBzDM,KAAA;GAAAb;GAAAC;GAAAG;GAAAC;GAAAC;GAAAC;EAOA;EAACX,EAAA,KAAAI;EAAAJ,EAAA,KAAAK;EAAAL,EAAA,KAAAQ;EAAAR,EAAA,KAAAS;EAAAT,EAAA,KAAAU;EAAAV,EAAA,KAAAW;EAAAX,EAAA,KAAAiB;CAAA,OAAAA,KAAAjB,EAAA;CATH,MAAAkB,SAAe9B,UACb,CAACK,iBAAD,CAAmBuB,YAAnB,CAAgCjB,WAChCkB,EAQF;CAImB,MAAAE,KAAA9B,iBAAiBuB,KAAK;CAAC,IAAAQ;CAAA,IAAApB,EAAA,OAAAM,aAAAN,EAAA,OAAAO,WAAAP,EAAA,OAAAmB,IAAA;EAA/BC,KAAA;GAAAC,MAAQF;GAAuBb;GAAAC;EAAqB;EAACP,EAAA,KAAAM;EAAAN,EAAA,KAAAO;EAAAP,EAAA,KAAAmB;EAAAnB,EAAA,MAAAoB;CAAA,OAAAA,KAAApB,EAAA;CAAA,IAAAsB;CAAA,IAAAtB,EAAA,QAAAN,KAAA;EAKzD4B,KAAAhC,YAAYI,GAAG;EAACM,EAAA,MAAAN;EAAAM,EAAA,MAAAsB;CAAA,OAAAA,KAAAtB,EAAA;CAAA,IAAAuB;CAAA,IAAAvB,EAAA,QAAAgB,YAAAhB,EAAA,QAAAY,SAAAZ,EAAA,QAAAkB,UAAAlB,EAAA,QAAAoB,MAAApB,EAAA,QAAAsB,IAAA;EAPhBC,KAAA;GAAAP;GAAAQ,SAEIJ;GAAqDR;GAAAlB,KAKzD4B;GAAgBJ;EAEvB;EAAClB,EAAA,MAAAgB;EAAAhB,EAAA,MAAAY;EAAAZ,EAAA,MAAAkB;EAAAlB,EAAA,MAAAoB;EAAApB,EAAA,MAAAsB;EAAAtB,EAAA,MAAAuB;CAAA,OAAAA,KAAAvB,EAAA;CAAA,OATMuB;AASN"}
+{"version":3,"file":"hooks.js","names":["Ref","FocusableElement","useState","ButtonContext","useSlottedContext","ButtonDOMProps","useRipple","ariaAttributesOf","refCallback","ButtonBaseInput","Pick","disableRipple","ref","HTMLAnchorElement","HTMLButtonElement","useButtonBase","input","isPending","$","_c","t0","isDisabled","onClick","onContextMenu","onKeyDown","onKeyUp","onPointerCancel","onPointerDown","onPointerLeave","onPointerUp","props","undefined","context","slot","disabled","t1","ripple","t2","t3","aria","t4","t5","element","useSelection","defaultSelected","isSelected","onChange","own","setOwn","selected","toggle","_c"],"sources":["../../src/button/hooks.ts"],"sourcesContent":["import type { Ref } from 'react'\nimport type { FocusableElement } from 'react-aria-components'\n\nimport { useState } from 'react'\nimport { ButtonContext, useSlottedContext } from 'react-aria-components'\n\nimport type { ButtonDOMProps } from '.'\n\nimport { useRipple } from '../hooks/useRipple'\nimport { ariaAttributesOf } from '../render/aria'\nimport { refCallback } from '../render/ref'\n\n// The hook half of `src/button`, apart from ./index.tsx so that file exports\n// components alone — which is what keeps fast refresh working for it, the\n// same arrangement `src/drag` uses.\n\n/** What {@link useButtonBase} takes off a button's props for itself. */\ntype ButtonBaseInput = Pick<\n  ButtonDOMProps,\n  | 'isDisabled'\n  | 'onClick'\n  | 'onContextMenu'\n  | 'onKeyDown'\n  | 'onKeyUp'\n  | 'onPointerCancel'\n  | 'onPointerDown'\n  | 'onPointerLeave'\n  | 'onPointerUp'\n  | 'slot'\n> & {\n  disableRipple?: boolean\n  ref?: Ref<HTMLAnchorElement | HTMLButtonElement>\n}\n\n/**\n * What a button does past React Aria, whichever of its elements it renders:\n * the disabled state a parent's context sets, the ripple, and the `aria-*`\n * props and keyboard handlers React Aria would drop or wrap. Hands back the\n * props it did not take, for the element.\n *\n * Shared by ButtonBase and by IconButton's toggle, which is React Aria's\n * `ToggleButton` rather than either element ButtonBase renders.\n */\nfunction useButtonBase<Props extends ButtonBaseInput>(\n  input: Props,\n  isPending: boolean,\n) {\n  const {\n    disableRipple = false,\n    isDisabled,\n    onClick,\n    onContextMenu,\n    onKeyDown,\n    onKeyUp,\n    onPointerCancel,\n    onPointerDown,\n    onPointerLeave,\n    onPointerUp,\n    ref,\n    ...props\n  } = input\n\n  // A parent's context may disable the button — React Aria's own fields\n  // disable the buttons they hold with them, a number field's stepper at the\n  // end of its range and a search field's clear button with the field — and\n  // React Aria takes a prop over its context, so a default of `false` here\n  // would keep the button enabled whatever the parent said. The call site's\n  // own prop still wins where it is given; the context is read for the\n  // ripple, which has to know before the render state does.\n  const context = useSlottedContext(ButtonContext, input.slot)\n  const disabled = isDisabled ?? context?.isDisabled ?? false\n\n  // The rest of the props (className/style, etc.) are handed back rather\n  // than given to the ripple: `className` and `style` there may be functions\n  // of render state, which the ripple's own handler-only merge doesn't need\n  // to know about. It is also why ButtonBase merges the styles through\n  // mergeStatefulStyles rather than the plain mergeStyles. The ripple is off\n  // while disabled: React Aria still forwards pointer events to a disabled\n  // element, and a press that changes nothing should not look like one.\n  //\n  // Off while pending for the same reason, and for a second one. React Aria\n  // nulls out the handlers it derived itself while pending — the click among\n  // them — but not the separate copy of the global pointer events that\n  // carries ours, so a press still reached the ripple and started it while\n  // the click that would have ended it never arrived. The ripple stayed at\n  // its pressed opacity until some later press completed a cycle of its own.\n  const ripple = useRipple<FocusableElement>(\n    !disableRipple && !disabled && !isPending,\n    {\n      onClick,\n      onContextMenu,\n      onPointerCancel,\n      onPointerDown,\n      onPointerLeave,\n      onPointerUp,\n    },\n  )\n\n  return {\n    disabled,\n    element: { aria: ariaAttributesOf(props), onKeyDown, onKeyUp },\n    props,\n    // The element is a button, a link or IconButton's toggle, so the ref is\n    // typed as a link or a button and handed to each as the callback all\n    // three accept — see src/render/ref.ts.\n    ref: refCallback(ref),\n    ripple,\n  }\n}\n\n/**\n * A toggle's state, for a button that is a toggle on its own rather than in\n * a selecting group: the call site's `isSelected` where it holds the state,\n * otherwise the button's own, starting from `defaultSelected`. `toggle` is\n * what a press calls, and reports the new state through `onChange` either\n * way. Called whether or not the button is a toggle, so that becoming one\n * changes no hook order.\n */\nfunction useSelection({\n  defaultSelected,\n  isSelected,\n  onChange,\n}: {\n  defaultSelected?: boolean | undefined\n  isSelected?: boolean | undefined\n  onChange?: ((isSelected: boolean) => void) | undefined\n}) {\n  const [own, setOwn] = useState(defaultSelected ?? false)\n  const selected = isSelected ?? own\n\n  return {\n    selected,\n    toggle: () => {\n      setOwn(!selected)\n      onChange?.(!selected)\n    },\n  }\n}\n\nexport { useButtonBase, useSelection }\n"],"mappings":";;;;;;;;;;;;;;;;AA2CA,SAAAe,cAAAC,OAAAC,WAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAIE,MAAA,EAAAR,eAAAS,IAAAC,YAAAC,SAAAC,eAAAC,WAAAC,SAAAC,iBAAAC,eAAAC,gBAAAC,aAAAjB,KAAA,GAAAkB,UAaId;CAZF,MAAAL,gBAAAS,OAAAW,KAAAA,IAAA,QAAAX;CAqBF,MAAAY,UAAgB5B,kBAAkBD,eAAea,MAAKiB,IAAK;CAC3D,MAAAC,WAAiBb,cAAcW,SAAOX,cAArB;CAA0C,IAAAc;CAAA,IAAAjB,EAAA,OAAAI,WAAAJ,EAAA,OAAAK,iBAAAL,EAAA,OAAAQ,mBAAAR,EAAA,OAAAS,iBAAAT,EAAA,OAAAU,kBAAAV,EAAA,OAAAW,aAAA;EAkBzDM,KAAA;GAAAb;GAAAC;GAAAG;GAAAC;GAAAC;GAAAC;EAOA;EAACX,EAAA,KAAAI;EAAAJ,EAAA,KAAAK;EAAAL,EAAA,KAAAQ;EAAAR,EAAA,KAAAS;EAAAT,EAAA,KAAAU;EAAAV,EAAA,KAAAW;EAAAX,EAAA,KAAAiB;CAAA,OAAAA,KAAAjB,EAAA;CATH,MAAAkB,SAAe9B,UACb,CAACK,iBAAD,CAAmBuB,YAAnB,CAAgCjB,WAChCkB,EAQF;CAImB,MAAAE,KAAA9B,iBAAiBuB,KAAK;CAAC,IAAAQ;CAAA,IAAApB,EAAA,OAAAM,aAAAN,EAAA,OAAAO,WAAAP,EAAA,OAAAmB,IAAA;EAA/BC,KAAA;GAAAC,MAAQF;GAAuBb;GAAAC;EAAqB;EAACP,EAAA,KAAAM;EAAAN,EAAA,KAAAO;EAAAP,EAAA,KAAAmB;EAAAnB,EAAA,MAAAoB;CAAA,OAAAA,KAAApB,EAAA;CAAA,IAAAsB;CAAA,IAAAtB,EAAA,QAAAN,KAAA;EAKzD4B,KAAAhC,YAAYI,GAAG;EAACM,EAAA,MAAAN;EAAAM,EAAA,MAAAsB;CAAA,OAAAA,KAAAtB,EAAA;CAAA,IAAAuB;CAAA,IAAAvB,EAAA,QAAAgB,YAAAhB,EAAA,QAAAY,SAAAZ,EAAA,QAAAkB,UAAAlB,EAAA,QAAAoB,MAAApB,EAAA,QAAAsB,IAAA;EAPhBC,KAAA;GAAAP;GAAAQ,SAEIJ;GAAqDR;GAAAlB,KAKzD4B;GAAgBJ;EAEvB;EAAClB,EAAA,MAAAgB;EAAAhB,EAAA,MAAAY;EAAAZ,EAAA,MAAAkB;EAAAlB,EAAA,MAAAoB;EAAApB,EAAA,MAAAsB;EAAAtB,EAAA,MAAAuB;CAAA,OAAAA,KAAAvB,EAAA;CAAA,OATMuB;AASN;;;;;;;;;AAWH,SAAAE,aAAAvB,IAAA;CAAA,MAAAF,IAAAC,EAAA,CAAA;CAAsB,MAAA,EAAAyB,iBAAAC,YAAAC,aAAA1B;CASpB,MAAA,CAAA2B,KAAAC,UAAsB9C,SAAS0C,mBAAA,KAAwB;CACvD,MAAAK,WAAiBJ,cAAAE;CAAiB,IAAAZ;CAAA,IAAAjB,EAAA,OAAA4B,YAAA5B,EAAA,OAAA+B,UAAA;EAIxBd,WAAA;GACNa,OAAO,CAACC,QAAQ;GAChBH,WAAW,CAACG,QAAQ;EAAC;EACtB/B,EAAA,KAAA4B;EAAA5B,EAAA,KAAA+B;EAAA/B,EAAA,KAAAiB;CAAA,OAAAA,KAAAjB,EAAA;CAAA,IAAAmB;CAAA,IAAAnB,EAAA,OAAA+B,YAAA/B,EAAA,OAAAiB,IAAA;EALIE,KAAA;GAAAY;GAAAC,QAEGf;EAIV;EAACjB,EAAA,KAAA+B;EAAA/B,EAAA,KAAAiB;EAAAjB,EAAA,KAAAmB;CAAA,OAAAA,KAAAnB,EAAA;CAAA,OANMmB;AAMN"}

package/dist/button/index.d.ts

@@ -2,10 +2,66 @@ import { DOMAttributes, ReactNode, RefAttributes } from "react";
 import { ButtonProps, ButtonRenderProps, ClassNameOrFunction, StyleOrFunction } from "react-aria-components";
 //#region src/button/index.d.ts
 type ButtonDOMProps = Omit<ButtonProps, 'children' | 'className' | 'style' | GlobalEventKey> & Pick<DOMAttributes<HTMLElement>, GlobalEventKey>;
+/**
+ * The three forms a button takes, of which a call site writes exactly one:
+ * a plain button, a link, or a toggle. Each names the props of the other two
+ * as `never`, so a combination the rendered form would ignore — a toggle
+ * given `href`, a link given `isPending` — is a compile error rather than a
+ * prop that silently does nothing.
+ */
+type ButtonForm = ButtonLinkForm | ButtonPressForm | ButtonToggleForm;
+type ButtonLinkForm = {
+  defaultSelected?: never;
+  /**
+   * Where the button leads. Given one, the button is rendered as a link —
+   * an `<a>`, announced as the link it is — with the same styles and ripple.
+   * A link is never a toggle and never pending, and `render`, `type` and the
+   * form props apply to the other two forms only.
+   */
+  href: string;
+  isPending?: never;
+  isSelected?: never;
+  onChange?: never;
+  pendingLabel?: never;
+  /** The link's `rel`. */
+  rel?: string;
+  /** The link's `target`. */
+  target?: string;
+};
+type ButtonPressForm = {
+  defaultSelected?: never;
+  href?: never;
+  isSelected?: never;
+  onChange?: never;
+  rel?: never;
+  target?: never;
+};
 type ButtonState = Pick<ButtonRenderProps, 'isDisabled' | 'isFocused' | 'isFocusVisible' | 'isHovered' | 'isPressed'> & {
   isSelected?: boolean;
 };
+type ButtonToggleForm = {
+  /**
+   * Whether a toggle starts selected, when it keeps its own state. Passing
+   * this, `isSelected` or `onChange` is what makes the button a toggle.
+   */
+  defaultSelected?: boolean;
+  href?: never;
+  /**
+   * Whether a toggle is selected, when the call site holds the state. Pass
+   * it with `onChange`; passing this, `defaultSelected` or `onChange` is what
+   * makes the button a toggle. A value still loading may be `undefined` for a
+   * while: the button stays the same element when it arrives.
+   */
+  isSelected?: boolean;
+  /**
+   * Called with the new state when a toggle is pressed. Passing this,
+   * `isSelected` or `defaultSelected` is what makes the button a toggle.
+   */
+  onChange?: (isSelected: boolean) => void;
+  rel?: never;
+  target?: never;
+};
 type GlobalEventKey = Exclude<keyof DOMAttributes<HTMLElement> & keyof ButtonProps, 'onBlur' | 'onClick' | 'onFocus'>;
 //#endregion
-export type { ButtonDOMProps, ButtonState };
+export type { ButtonDOMProps, ButtonForm, ButtonLinkForm, ButtonPressForm, ButtonState, ButtonToggleForm };
 //# sourceMappingURL=index.d.ts.map

package/dist/button/index.js

@@ -1,9 +1,9 @@
 import { props } from "../node_modules/@stylexjs/stylex/lib/es/stylex.js";
 import { mergeStatefulStyles } from "../styles/merge.js";
-import { buttonRenderer, linkRenderer, toggleButtonRenderer } from "../render/aria.js";
 import ProgressIndicator from "../components/progress-indicator/index.js";
-import { useToggleGroupDisabled } from "../hooks/useToggleGroupDisabled.js";
 import { useMessages } from "../i18n/index.js";
+import { buttonRenderer, linkRenderer, toggleButtonRenderer } from "../render/aria.js";
+import { useToggleGroupDisabled } from "../hooks/useToggleGroupDisabled.js";
 import { useButtonBase } from "./hooks.js";
 import { buttonBaseStyles } from "./styles.js";
 import { c } from "react/compiler-runtime";
@@ -15,126 +15,174 @@ import { Button, Link, ToggleButton } from "react-aria-components";
 * `Button`, or its `Link` given `href`. See the header.
 */
 function ButtonBase(t0) {
-	const $ = c(43);
+	const $ = c(52);
 	let children;
 	let classes;
 	let href;
 	let input;
+	let isSelected;
 	let pendingLabel;
 	let rel;
 	let render;
 	let t1;
 	let target;
 	if ($[0] !== t0) {
-		({children, classes, href, isPending: t1, pendingLabel, rel, render, target, ...input} = t0);
+		({children, classes, href, isPending: t1, isSelected, pendingLabel, rel, render, target, ...input} = t0);
 		$[0] = t0;
 		$[1] = children;
 		$[2] = classes;
 		$[3] = href;
 		$[4] = input;
-		$[5] = pendingLabel;
-		$[6] = rel;
-		$[7] = render;
-		$[8] = t1;
-		$[9] = target;
+		$[5] = isSelected;
+		$[6] = pendingLabel;
+		$[7] = rel;
+		$[8] = render;
+		$[9] = t1;
+		$[10] = target;
 	} else {
 		children = $[1];
 		classes = $[2];
 		href = $[3];
 		input = $[4];
-		pendingLabel = $[5];
-		rel = $[6];
-		render = $[7];
-		t1 = $[8];
-		target = $[9];
+		isSelected = $[5];
+		pendingLabel = $[6];
+		rel = $[7];
+		render = $[8];
+		t1 = $[9];
+		target = $[10];
 	}
 	const isPending = t1 === void 0 ? false : t1;
 	const messages = useMessages();
-	const { disabled, element, props, ref, ripple } = useButtonBase(input, isPending);
+	const base = useButtonBase(input, isPending);
+	const { disabled, props, ref, ripple } = base;
 	let t2;
-	if ($[10] !== classes || $[11] !== props) {
+	if ($[11] !== classes || $[12] !== props) {
 		t2 = mergeStatefulStyles(classes, props);
-		$[10] = classes;
-		$[11] = props;
-		$[12] = t2;
-	} else t2 = $[12];
-	const styleProps = t2;
-	if (href !== void 0) {
-		let t3;
-		if ($[13] !== element) {
-			t3 = linkRenderer(element);
-			$[13] = element;
-			$[14] = t3;
-		} else t3 = $[14];
-		let t4;
-		if ($[15] !== children || $[16] !== disabled || $[17] !== href || $[18] !== props || $[19] !== ref || $[20] !== rel || $[21] !== ripple.handlers || $[22] !== ripple.surface || $[23] !== styleProps || $[24] !== t3 || $[25] !== target) {
-			t4 = /* @__PURE__ */ jsxs(Link, {
-				href,
-				isDisabled: disabled,
-				ref,
-				rel,
-				render: t3,
-				target,
-				...ripple.handlers,
-				...props,
-				...styleProps,
-				children: [children, ripple.surface]
-			});
-			$[15] = children;
-			$[16] = disabled;
-			$[17] = href;
-			$[18] = props;
-			$[19] = ref;
-			$[20] = rel;
-			$[21] = ripple.handlers;
-			$[22] = ripple.surface;
-			$[23] = styleProps;
-			$[24] = t3;
-			$[25] = target;
-			$[26] = t4;
-		} else t4 = $[26];
-		return t4;
-	}
+		$[11] = classes;
+		$[12] = props;
+		$[13] = t2;
+	} else t2 = $[13];
+	const merged = t2;
+	let T0;
+	let styleProps;
 	let t3;
-	if ($[27] !== element || $[28] !== render) {
-		t3 = buttonRenderer(element, render);
-		$[27] = element;
-		$[28] = render;
-		$[29] = t3;
-	} else t3 = $[29];
-	const t4 = ripple.handlers;
-	const t5 = pendingLabel ?? messages.loading;
+	let t4;
+	let t5;
 	let t6;
-	if ($[30] !== children || $[31] !== ripple.surface || $[32] !== t5) {
-		t6 = buttonContent(children, t5, ripple.surface);
-		$[30] = children;
-		$[31] = ripple.surface;
+	let t7;
+	if ($[14] !== base.element || $[15] !== children || $[16] !== disabled || $[17] !== href || $[18] !== isPending || $[19] !== isSelected || $[20] !== merged || $[21] !== props || $[22] !== ref || $[23] !== rel || $[24] !== render || $[25] !== ripple.handlers || $[26] !== ripple.surface || $[27] !== target) {
+		t7 = Symbol.for("react.early_return_sentinel");
+		bb0: {
+			const element = isSelected === void 0 ? base.element : {
+				...base.element,
+				aria: {
+					...base.element.aria,
+					"aria-pressed": isSelected
+				}
+			};
+			let t8;
+			if ($[35] !== isSelected || $[36] !== merged) {
+				t8 = isSelected === void 0 ? merged : {
+					className: (state) => merged.className({
+						...state,
+						isSelected
+					}),
+					style: (state_0) => merged.style({
+						...state_0,
+						isSelected
+					})
+				};
+				$[35] = isSelected;
+				$[36] = merged;
+				$[37] = t8;
+			} else t8 = $[37];
+			styleProps = t8;
+			if (href !== void 0) {
+				t7 = /* @__PURE__ */ jsxs(Link, {
+					href,
+					isDisabled: disabled,
+					ref,
+					rel,
+					render: linkRenderer(element),
+					target,
+					...ripple.handlers,
+					...props,
+					...styleProps,
+					children: [children, ripple.surface]
+				});
+				break bb0;
+			}
+			T0 = Button;
+			t3 = disabled;
+			t4 = isPending;
+			t5 = ref;
+			t6 = buttonRenderer(element, selectedRender(render, isSelected));
+		}
+		$[14] = base.element;
+		$[15] = children;
+		$[16] = disabled;
+		$[17] = href;
+		$[18] = isPending;
+		$[19] = isSelected;
+		$[20] = merged;
+		$[21] = props;
+		$[22] = ref;
+		$[23] = rel;
+		$[24] = render;
+		$[25] = ripple.handlers;
+		$[26] = ripple.surface;
+		$[27] = target;
+		$[28] = T0;
+		$[29] = styleProps;
+		$[30] = t3;
+		$[31] = t4;
 		$[32] = t5;
 		$[33] = t6;
-	} else t6 = $[33];
-	let t7;
-	if ($[34] !== disabled || $[35] !== isPending || $[36] !== props || $[37] !== ref || $[38] !== ripple.handlers || $[39] !== styleProps || $[40] !== t3 || $[41] !== t6) {
-		t7 = /* @__PURE__ */ jsx(Button, {
-			isDisabled: disabled,
-			isPending,
-			ref,
-			render: t3,
-			...t4,
+		$[34] = t7;
+	} else {
+		T0 = $[28];
+		styleProps = $[29];
+		t3 = $[30];
+		t4 = $[31];
+		t5 = $[32];
+		t6 = $[33];
+		t7 = $[34];
+	}
+	if (t7 !== Symbol.for("react.early_return_sentinel")) return t7;
+	const t8 = ripple.handlers;
+	const t9 = pendingLabel ?? messages.loading;
+	let t10;
+	if ($[38] !== children || $[39] !== ripple.surface || $[40] !== t9) {
+		t10 = buttonContent(children, t9, ripple.surface);
+		$[38] = children;
+		$[39] = ripple.surface;
+		$[40] = t9;
+		$[41] = t10;
+	} else t10 = $[41];
+	let t11;
+	if ($[42] !== T0 || $[43] !== props || $[44] !== ripple.handlers || $[45] !== styleProps || $[46] !== t10 || $[47] !== t3 || $[48] !== t4 || $[49] !== t5 || $[50] !== t6) {
+		t11 = /* @__PURE__ */ jsx(T0, {
+			isDisabled: t3,
+			isPending: t4,
+			ref: t5,
+			render: t6,
+			...t8,
 			...props,
 			...styleProps,
-			children: t6
+			children: t10
 		});
-		$[34] = disabled;
-		$[35] = isPending;
-		$[36] = props;
-		$[37] = ref;
-		$[38] = ripple.handlers;
-		$[39] = styleProps;
-		$[40] = t3;
-		$[41] = t6;
-		$[42] = t7;
-	} else t7 = $[42];
-	return t7;
+		$[42] = T0;
+		$[43] = props;
+		$[44] = ripple.handlers;
+		$[45] = styleProps;
+		$[46] = t10;
+		$[47] = t3;
+		$[48] = t4;
+		$[49] = t5;
+		$[50] = t6;
+		$[51] = t11;
+	} else t11 = $[51];
+	return t11;
 }
 function buttonContent(children, pendingLabel, surface) {
 	return (state) => /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -155,13 +203,22 @@ function buttonContent(children, pendingLabel, surface) {
 		surface
 	] });
 }
+function selectedRender(render, isSelected) {
+	if (render === void 0 || isSelected === void 0) return render;
+	return (props, state) => {
+		return render(props, {
+			...state,
+			isSelected
+		});
+	};
+}
 /**
-* A toggle drawn with the classes a component hands it: React Aria's
-* `ToggleButton`, which reports its state through `aria-pressed`. It is never
-* a link and never pending — React Aria's toggle takes neither, and neither
-* means anything for a control whose whole job is to report which of two
-* states it is in — so `isPending` reaches it only to keep the ripple off,
-* as it does for the plain button.
+* A toggle in a selecting group, drawn with the classes a component hands
+* it: React Aria's `ToggleButton`, which is what takes part in the group's
+* selection and reports its state through `aria-pressed`. A toggle on its
+* own is ButtonBase given `isSelected` instead — see there. React Aria's
+* toggle takes no pending state, so `isPending` reaches it only to keep the
+* ripple off.
 */
 function ToggleButtonBase(t0) {
 	const $ = c(32);

package/dist/button/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["DOMAttributes","ReactNode","RefAttributes","ButtonRenderProps","ClassNameOrFunction","ButtonProps","RACButtonProps","ToggleButtonProps","RACToggleButtonProps","StyleOrFunction","stylex","Button","RACButton","Link","RACLink","ToggleButton","RACToggleButton","ProgressIndicator","useToggleGroupDisabled","useMessages","buttonRenderer","linkRenderer","toggleButtonRenderer","mergeStatefulStyles","useButtonBase","buttonBaseStyles","ButtonBaseProps","children","classes","state","ButtonState","ReturnType","props","className","disableRipple","href","pendingLabel","rel","style","target","ButtonDOMProps","HTMLAnchorElement","HTMLButtonElement","Omit","GlobalEventKey","Pick","HTMLElement","isSelected","Exclude","ToggleButtonBaseProps","defaultSelected","onChange","ButtonBase","t0","$","_c","input","render","t1","isPending","undefined","messages","disabled","element","ref","ripple","t2","styleProps","t3","t4","handlers","surface","t5","loading","t6","buttonContent","t7","label","labelPending","pending","ToggleButtonBase","disabledByGroup","id","isDisabled","toggleRender","toggleContent","_c","RACLink","RACButton","stylex.props","RACToggleButton"],"sources":["../../src/button/index.tsx"],"sourcesContent":["import type { DOMAttributes, ReactNode, RefAttributes } from 'react';\nimport type { ButtonRenderProps, ClassNameOrFunction, ButtonProps as RACButtonProps, ToggleButtonProps as RACToggleButtonProps, StyleOrFunction } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { Button as RACButton, Link as RACLink, ToggleButton as RACToggleButton } from 'react-aria-components';\nimport ProgressIndicator from '../components/progress-indicator';\nimport { useToggleGroupDisabled } from '../hooks/useToggleGroupDisabled';\nimport { useMessages } from '../i18n';\nimport { buttonRenderer, linkRenderer, toggleButtonRenderer } from '../render/aria';\nimport { mergeStatefulStyles } from '../styles/merge';\nimport { useButtonBase } from './hooks';\nimport { buttonBaseStyles } from './styles';\n\n// The press-button core Button and IconButton both render through. A button\n// is React Aria's `Button`, its `Link` once given `href`, or its\n// `ToggleButton` once it reports a state, and around each this adds what\n// React Aria leaves out: the ripple, the disabled state a parent's context\n// sets, the `aria-*` props and keyboard handlers it would drop or wrap, and\n// the ring drawn over the label while the button is pending. Each component\n// brings its own classes, as a function of the render state, and the call\n// site's `className` and `style` are merged over them.\n//\n// One module rather than a copy in each, since the copies had already drifted\n// once: IconButton read `ButtonContext` for a parent's disabled state and\n// Button did not. Not a component of the library's own and not exported from\n// the package; see `src/row` for the same arrangement around a list's row.\n\ntype ButtonBaseProps = {\n  children?: ReactNode;\n  /**\n   * The component's own classes, from the render state. The call site's\n   * `className` and `style` are merged over them.\n   */\n  classes: (state: ButtonState) => ReturnType<typeof stylex.props>;\n  className?: ClassNameOrFunction<ButtonState>;\n  disableRipple?: boolean;\n  href?: string;\n  pendingLabel?: string;\n  rel?: string;\n  style?: StyleOrFunction<ButtonState>;\n  target?: string;\n} & ButtonDOMProps & RefAttributes<HTMLAnchorElement | HTMLButtonElement>;\n\n// The props a button hands React Aria. React Aria types the global DOM events\n// — pointer, mouse, touch, wheel and the rest — against the element each\n// component renders, and a handler written for a <button> does not type-check\n// against an <a>. The keys are retyped against HTMLElement here so one set of\n// props serves both forms; the events React Aria defines itself (press,\n// focus, keyboard) keep its types, since it hands those its own event objects.\ntype ButtonDOMProps = Omit<RACButtonProps, 'children' | 'className' | 'style' | GlobalEventKey> & Pick<DOMAttributes<HTMLElement>, GlobalEventKey>;\n\n// The render state React Aria's three elements share. A className or style\n// function written against it serves the button, the link and the toggle\n// alike; `isPending` belongs to the button alone, and `isCurrent` to the\n// link, so neither is here. What the button draws while pending is decided\n// in `buttonContent`, which sees React Aria's own state rather than this one.\n//\n// `isSelected` is optional because only the toggle has one: React Aria hands\n// the button and the link a state without it and the toggle a state with\n// it, and a parameter type this wide accepts either.\ntype ButtonState = Pick<ButtonRenderProps, 'isDisabled' | 'isFocused' | 'isFocusVisible' | 'isHovered' | 'isPressed'> & {\n  isSelected?: boolean;\n};\ntype GlobalEventKey = Exclude<keyof DOMAttributes<HTMLElement> & keyof RACButtonProps, 'onBlur' | 'onClick' | 'onFocus'>;\ntype ToggleButtonBaseProps = {\n  children?: ReactNode;\n  /** As for ButtonBase, handed `isSelected` as well. */\n  classes: (state: ButtonState) => ReturnType<typeof stylex.props>;\n  className?: ClassNameOrFunction<ButtonState>;\n  defaultSelected?: boolean;\n  disableRipple?: boolean;\n  isSelected?: boolean;\n  onChange?: (isSelected: boolean) => void;\n  style?: StyleOrFunction<ButtonState>;\n} & ButtonDOMProps & RefAttributes<HTMLAnchorElement | HTMLButtonElement>;\n\n/**\n * A button drawn with the classes a component hands it: React Aria's\n * `Button`, or its `Link` given `href`. See the header.\n */\nfunction ButtonBase({\n  children,\n  classes,\n  href,\n  isPending = false,\n  pendingLabel,\n  rel,\n  render,\n  target,\n  ...input\n}: ButtonBaseProps) {\n  const messages = useMessages();\n  const {\n    disabled,\n    element,\n    props,\n    ref,\n    ripple\n  } = useButtonBase(input, isPending);\n  const styleProps = mergeStatefulStyles(classes, props);\n  if (href !== undefined) {\n    return <RACLink href={href} isDisabled={disabled} ref={ref} rel={rel} render={linkRenderer(element)} target={target} {...ripple.handlers} {...props} {...styleProps}>\n        {children}\n        {ripple.surface}\n      </RACLink>;\n  }\n  return <RACButton isDisabled={disabled} isPending={isPending} ref={ref} render={buttonRenderer(element, render)} {...ripple.handlers} {...props} {...styleProps}>\n      {buttonContent(children, pendingLabel ?? messages.loading, ripple.surface)}\n    </RACButton>;\n}\n\n// What the button draws: its label, hidden while the button is pending, with\n// the ring over it. The ring takes the button's own content colour rather\n// than the progress page's primary, which on a filled button is the fill\n// itself and so invisible. The label stays in the flow so the button keeps its\n// width, which is what stops a form jumping the moment it is submitted.\n// React Aria wants the progress bar in the accessibility tree as soon as the\n// button goes pending, so it is rendered from the render state rather than\n// after a delay.\n//\n// Built by a call rather than written inline at the prop, which is what\n// react-perf's no-new-function-as-prop is after; the React Compiler\n// memoises the result on its inputs.\nfunction buttonContent(children: ReactNode, pendingLabel: string, surface: ReactNode) {\n  return (state: ButtonRenderProps) => <>\n      <span {...stylex.props(buttonBaseStyles.label, state.isPending && buttonBaseStyles.labelPending)}>\n        {children}\n      </span>\n      {state.isPending ? <span {...stylex.props(buttonBaseStyles.pending)}>\n          <ProgressIndicator aria-label={pendingLabel} diameter=\"1em\" isIndeterminate tone=\"inherit\" variant=\"circular\" />\n        </span> : null}\n      {surface}\n    </>;\n}\n\n/**\n * A toggle drawn with the classes a component hands it: React Aria's\n * `ToggleButton`, which reports its state through `aria-pressed`. It is never\n * a link and never pending — React Aria's toggle takes neither, and neither\n * means anything for a control whose whole job is to report which of two\n * states it is in — so `isPending` reaches it only to keep the ripple off,\n * as it does for the plain button.\n */\nfunction ToggleButtonBase({\n  children,\n  classes,\n  defaultSelected,\n  isPending = false,\n  isSelected,\n  onChange,\n  render,\n  ...input\n}: ToggleButtonBaseProps) {\n  // A selecting ButtonGroup disables its toggles through React Aria's group\n  // state, which no prop here carries, so the ripple would stay on in a\n  // disabled group and answer a press with an animation. Handed on as the\n  // toggle's own `isDisabled`, which is what React Aria makes of it anyway.\n  const disabledByGroup = useToggleGroupDisabled(input.id);\n  const {\n    disabled,\n    element,\n    props,\n    ref,\n    ripple\n  } = useButtonBase(disabledByGroup ? {\n    ...input,\n    isDisabled: true\n  } : input, isPending);\n  return <RACToggleButton defaultSelected={defaultSelected} isDisabled={disabled} isSelected={isSelected} onChange={onChange} ref={ref} render={toggleButtonRenderer(element, toggleRender(render))} {...ripple.handlers} {...props} {...mergeStatefulStyles(classes, props)}>\n      {toggleContent(children, ripple.surface)}\n    </RACToggleButton>;\n}\n\n// What a toggle draws: its label and the ripple. No pending ring — see\n// ToggleButtonBase. Built by a call for the reason `buttonContent` is.\nfunction toggleContent(children: ReactNode, surface: ReactNode) {\n  return () => <>\n      {children}\n      {surface}\n    </>;\n}\n\n// A call site's `render` is written for React Aria's button, whose render\n// state says whether it is pending; a toggle's says nothing of it, and a\n// toggle never is. So the toggle hands that function its own state with\n// `isPending` filled in, which is what lets one `render` prop serve a button\n// whichever element it turns out to be.\nfunction toggleRender(render: RACButtonProps['render']): RACToggleButtonProps['render'] {\n  if (render === undefined) {\n    return undefined;\n  }\n  return (props, state) => render(props, {\n    ...state,\n    isPending: false\n  });\n}\nexport type { ButtonDOMProps, ButtonState };\nexport { ButtonBase, ToggleButtonBase };"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["DOMAttributes","ReactNode","RefAttributes","ButtonRenderProps","ClassNameOrFunction","ButtonProps","RACButtonProps","ToggleButtonProps","RACToggleButtonProps","StyleOrFunction","stylex","Button","RACButton","Link","RACLink","ToggleButton","RACToggleButton","ProgressIndicator","useToggleGroupDisabled","useMessages","buttonRenderer","linkRenderer","toggleButtonRenderer","mergeStatefulStyles","useButtonBase","buttonBaseStyles","ButtonBaseProps","children","classes","state","ButtonState","ReturnType","props","className","disableRipple","href","isSelected","pendingLabel","rel","style","target","ButtonDOMProps","HTMLAnchorElement","HTMLButtonElement","Omit","GlobalEventKey","Pick","HTMLElement","ButtonForm","ButtonLinkForm","ButtonPressForm","ButtonToggleForm","defaultSelected","isPending","onChange","Exclude","ToggleButtonBaseProps","ButtonBase","t0","$","_c","input","render","t1","undefined","messages","base","disabled","ref","ripple","t2","merged","T0","styleProps","t3","t4","t5","t6","t7","element","handlers","surface","Symbol","for","bb0","aria","t8","state_0","selectedRender","t9","loading","t10","buttonContent","t11","label","labelPending","pending","selected","ToggleButtonBase","disabledByGroup","id","isDisabled","toggleRender","toggleContent","_c","RACLink","RACButton","stylex.props","RACToggleButton"],"sources":["../../src/button/index.tsx"],"sourcesContent":["import type { DOMAttributes, ReactNode, RefAttributes } from 'react';\nimport type { ButtonRenderProps, ClassNameOrFunction, ButtonProps as RACButtonProps, ToggleButtonProps as RACToggleButtonProps, StyleOrFunction } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { Button as RACButton, Link as RACLink, ToggleButton as RACToggleButton } from 'react-aria-components';\nimport ProgressIndicator from '../components/progress-indicator';\nimport { useToggleGroupDisabled } from '../hooks/useToggleGroupDisabled';\nimport { useMessages } from '../i18n';\nimport { buttonRenderer, linkRenderer, toggleButtonRenderer } from '../render/aria';\nimport { mergeStatefulStyles } from '../styles/merge';\nimport { useButtonBase } from './hooks';\nimport { buttonBaseStyles } from './styles';\n\n// The press-button core Button and IconButton both render through. A button\n// is React Aria's `Button`, its `Link` once given `href`, or its\n// `ToggleButton` inside a selecting group, and around each this adds what\n// React Aria leaves out: the ripple, the disabled state a parent's context\n// sets, the `aria-*` props and keyboard handlers it would drop or wrap, and\n// the ring drawn over the label while the button is pending. Each component\n// brings its own classes, as a function of the render state, and the call\n// site's `className` and `style` are merged over them.\n//\n// One module rather than a copy in each, since the copies had already drifted\n// once: IconButton read `ButtonContext` for a parent's disabled state and\n// Button did not. Not a component of the library's own and not exported from\n// the package; see `src/row` for the same arrangement around a list's row.\n\ntype ButtonBaseProps = {\n  children?: ReactNode;\n  /**\n   * The component's own classes, from the render state. The call site's\n   * `className` and `style` are merged over them.\n   */\n  classes: (state: ButtonState) => ReturnType<typeof stylex.props>;\n  className?: ClassNameOrFunction<ButtonState>;\n  disableRipple?: boolean;\n  href?: string;\n  /**\n   * A toggle's state, for a button that reports one through `aria-pressed`.\n   * Left undefined, the button reports none. Handed to every function of the\n   * render state, so the classes can draw it.\n   */\n  isSelected?: boolean;\n  pendingLabel?: string;\n  rel?: string;\n  style?: StyleOrFunction<ButtonState>;\n  target?: string;\n} & ButtonDOMProps & RefAttributes<HTMLAnchorElement | HTMLButtonElement>;\n\n// The props a button hands React Aria. React Aria types the global DOM events\n// — pointer, mouse, touch, wheel and the rest — against the element each\n// component renders, and a handler written for a <button> does not type-check\n// against an <a>. The keys are retyped against HTMLElement here so one set of\n// props serves both forms; the events React Aria defines itself (press,\n// focus, keyboard) keep its types, since it hands those its own event objects.\ntype ButtonDOMProps = Omit<RACButtonProps, 'children' | 'className' | 'style' | GlobalEventKey> & Pick<DOMAttributes<HTMLElement>, GlobalEventKey>;\n\n/**\n * The three forms a button takes, of which a call site writes exactly one:\n * a plain button, a link, or a toggle. Each names the props of the other two\n * as `never`, so a combination the rendered form would ignore — a toggle\n * given `href`, a link given `isPending` — is a compile error rather than a\n * prop that silently does nothing.\n */\ntype ButtonForm = ButtonLinkForm | ButtonPressForm | ButtonToggleForm;\ntype ButtonLinkForm = {\n  defaultSelected?: never;\n  /**\n   * Where the button leads. Given one, the button is rendered as a link —\n   * an `<a>`, announced as the link it is — with the same styles and ripple.\n   * A link is never a toggle and never pending, and `render`, `type` and the\n   * form props apply to the other two forms only.\n   */\n  href: string;\n  isPending?: never;\n  isSelected?: never;\n  onChange?: never;\n  pendingLabel?: never;\n  /** The link's `rel`. */\n  rel?: string;\n  /** The link's `target`. */\n  target?: string;\n};\ntype ButtonPressForm = {\n  defaultSelected?: never;\n  href?: never;\n  isSelected?: never;\n  onChange?: never;\n  rel?: never;\n  target?: never;\n};\n\n// The render state React Aria's three elements share. A className or style\n// function written against it serves the button, the link and the toggle\n// alike; `isPending` belongs to the button alone, and `isCurrent` to the\n// link, so neither is here. What the button draws while pending is decided\n// in `buttonContent`, which sees React Aria's own state rather than this one.\n//\n// `isSelected` is optional because only the toggle has one: React Aria hands\n// the button and the link a state without it and the toggle a state with\n// it, and a parameter type this wide accepts either.\ntype ButtonState = Pick<ButtonRenderProps, 'isDisabled' | 'isFocused' | 'isFocusVisible' | 'isHovered' | 'isPressed'> & {\n  isSelected?: boolean;\n};\ntype ButtonToggleForm = {\n  /**\n   * Whether a toggle starts selected, when it keeps its own state. Passing\n   * this, `isSelected` or `onChange` is what makes the button a toggle.\n   */\n  defaultSelected?: boolean;\n  href?: never;\n  /**\n   * Whether a toggle is selected, when the call site holds the state. Pass\n   * it with `onChange`; passing this, `defaultSelected` or `onChange` is what\n   * makes the button a toggle. A value still loading may be `undefined` for a\n   * while: the button stays the same element when it arrives.\n   */\n  isSelected?: boolean;\n  /**\n   * Called with the new state when a toggle is pressed. Passing this,\n   * `isSelected` or `defaultSelected` is what makes the button a toggle.\n   */\n  onChange?: (isSelected: boolean) => void;\n  rel?: never;\n  target?: never;\n};\ntype GlobalEventKey = Exclude<keyof DOMAttributes<HTMLElement> & keyof RACButtonProps, 'onBlur' | 'onClick' | 'onFocus'>;\ntype ToggleButtonBaseProps = {\n  children?: ReactNode;\n  /** As for ButtonBase, handed `isSelected` as well. */\n  classes: (state: ButtonState) => ReturnType<typeof stylex.props>;\n  className?: ClassNameOrFunction<ButtonState>;\n  defaultSelected?: boolean;\n  disableRipple?: boolean;\n  isSelected?: boolean;\n  onChange?: (isSelected: boolean) => void;\n  style?: StyleOrFunction<ButtonState>;\n} & ButtonDOMProps & RefAttributes<HTMLAnchorElement | HTMLButtonElement>;\n\n/**\n * A button drawn with the classes a component hands it: React Aria's\n * `Button`, or its `Link` given `href`. See the header.\n */\nfunction ButtonBase({\n  children,\n  classes,\n  href,\n  isPending = false,\n  isSelected,\n  pendingLabel,\n  rel,\n  render,\n  target,\n  ...input\n}: ButtonBaseProps) {\n  const messages = useMessages();\n  const base = useButtonBase(input, isPending);\n  const {\n    disabled,\n    props,\n    ref,\n    ripple\n  } = base;\n  const merged = mergeStatefulStyles(classes, props);\n\n  // A toggle is still React Aria's `Button`, which knows nothing of a\n  // selected state, so the state goes onto the element as `aria-pressed` and\n  // into every function of the render state from here. Being the same\n  // component as the plain button is what keeps a button the same element\n  // when it becomes a toggle — `isSelected` arriving once its data loads.\n  const element = isSelected === undefined ? base.element : {\n    ...base.element,\n    aria: {\n      ...base.element.aria,\n      'aria-pressed': isSelected\n    }\n  };\n  const styleProps = isSelected === undefined ? merged : {\n    className: (state: Parameters<typeof merged.className>[0]) => merged.className({\n      ...state,\n      isSelected\n    }),\n    style: (state: Parameters<typeof merged.style>[0]) => merged.style({\n      ...state,\n      isSelected\n    })\n  };\n  if (href !== undefined) {\n    return <RACLink href={href} isDisabled={disabled} ref={ref} rel={rel} render={linkRenderer(element)} target={target} {...ripple.handlers} {...props} {...styleProps}>\n        {children}\n        {ripple.surface}\n      </RACLink>;\n  }\n  return <RACButton isDisabled={disabled} isPending={isPending} ref={ref} render={buttonRenderer(element, selectedRender(render, isSelected))} {...ripple.handlers} {...props} {...styleProps}>\n      {buttonContent(children, pendingLabel ?? messages.loading, ripple.surface)}\n    </RACButton>;\n}\n\n// What the button draws: its label, hidden while the button is pending, with\n// the ring over it. The ring takes the button's own content colour rather\n// than the progress page's primary, which on a filled button is the fill\n// itself and so invisible. The label stays in the flow so the button keeps its\n// width, which is what stops a form jumping the moment it is submitted.\n// React Aria wants the progress bar in the accessibility tree as soon as the\n// button goes pending, so it is rendered from the render state rather than\n// after a delay.\n//\n// Built by a call rather than written inline at the prop, which is what\n// react-perf's no-new-function-as-prop is after; the React Compiler\n// memoises the result on its inputs.\nfunction buttonContent(children: ReactNode, pendingLabel: string, surface: ReactNode) {\n  return (state: ButtonRenderProps) => <>\n      <span {...stylex.props(buttonBaseStyles.label, state.isPending && buttonBaseStyles.labelPending)}>\n        {children}\n      </span>\n      {state.isPending ? <span {...stylex.props(buttonBaseStyles.pending)}>\n          <ProgressIndicator aria-label={pendingLabel} diameter=\"1em\" isIndeterminate tone=\"inherit\" variant=\"circular\" />\n        </span> : null}\n      {surface}\n    </>;\n}\n\n// A toggle drawn through ButtonBase hands a call site's `render` the state of\n// React Aria's plain button, which has no `isSelected`; this fills it in.\nfunction selectedRender(render: RACButtonProps['render'], isSelected: boolean | undefined): RACButtonProps['render'] {\n  if (render === undefined || isSelected === undefined) {\n    return render;\n  }\n  // Through a binding rather than as a literal at the call: React Aria types\n  // the state as its plain button's, and a call site's `render` is written\n  // against ButtonState, which is that plus `isSelected`.\n  return (props, state) => {\n    const selected = {\n      ...state,\n      isSelected\n    };\n    return render(props, selected);\n  };\n}\n\n/**\n * A toggle in a selecting group, drawn with the classes a component hands\n * it: React Aria's `ToggleButton`, which is what takes part in the group's\n * selection and reports its state through `aria-pressed`. A toggle on its\n * own is ButtonBase given `isSelected` instead — see there. React Aria's\n * toggle takes no pending state, so `isPending` reaches it only to keep the\n * ripple off.\n */\nfunction ToggleButtonBase({\n  children,\n  classes,\n  defaultSelected,\n  isPending = false,\n  isSelected,\n  onChange,\n  render,\n  ...input\n}: ToggleButtonBaseProps) {\n  // A selecting ButtonGroup disables its toggles through React Aria's group\n  // state, which no prop here carries, so the ripple would stay on in a\n  // disabled group and answer a press with an animation. Handed on as the\n  // toggle's own `isDisabled`, which is what React Aria makes of it anyway.\n  const disabledByGroup = useToggleGroupDisabled(input.id);\n  const {\n    disabled,\n    element,\n    props,\n    ref,\n    ripple\n  } = useButtonBase(disabledByGroup ? {\n    ...input,\n    isDisabled: true\n  } : input, isPending);\n  return <RACToggleButton defaultSelected={defaultSelected} isDisabled={disabled} isSelected={isSelected} onChange={onChange} ref={ref} render={toggleButtonRenderer(element, toggleRender(render))} {...ripple.handlers} {...props} {...mergeStatefulStyles(classes, props)}>\n      {toggleContent(children, ripple.surface)}\n    </RACToggleButton>;\n}\n\n// What a toggle draws: its label and the ripple. No pending ring — see\n// ToggleButtonBase. Built by a call for the reason `buttonContent` is.\nfunction toggleContent(children: ReactNode, surface: ReactNode) {\n  return () => <>\n      {children}\n      {surface}\n    </>;\n}\n\n// A call site's `render` is written for React Aria's button, whose render\n// state says whether it is pending; a toggle's says nothing of it, and a\n// toggle never is. So the toggle hands that function its own state with\n// `isPending` filled in, which is what lets one `render` prop serve a button\n// whichever element it turns out to be.\nfunction toggleRender(render: RACButtonProps['render']): RACToggleButtonProps['render'] {\n  if (render === undefined) {\n    return undefined;\n  }\n  return (props, state) => render(props, {\n    ...state,\n    isPending: false\n  });\n}\nexport type { ButtonDOMProps, ButtonForm, ButtonLinkForm, ButtonPressForm, ButtonState, ButtonToggleForm };\nexport { ButtonBase, ToggleButtonBase };"],"mappings":";;;;;;;;;;;;;;;;AA8IA,SAAAyD,WAAAC,IAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAA,IAAAjC;CAAA,IAAAC;CAAA,IAAAO;CAAA,IAAA0B;CAAA,IAAAzB;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAwB;CAAA,IAAAC;CAAA,IAAAvB;CAAA,IAAAmB,EAAA,OAAAD,IAAA;EAAoB,CAAA,CAAA/B,UAAAC,SAAAO,MAAAkB,WAAAU,IAAA3B,YAAAC,cAAAC,KAAAwB,QAAAtB,QAAA,GAAAqB,SAAAH;EAWFC,EAAA,KAAAD;EAAAC,EAAA,KAAAhC;EAAAgC,EAAA,KAAA/B;EAAA+B,EAAA,KAAAxB;EAAAwB,EAAA,KAAAE;EAAAF,EAAA,KAAAvB;EAAAuB,EAAA,KAAAtB;EAAAsB,EAAA,KAAArB;EAAAqB,EAAA,KAAAG;EAAAH,EAAA,KAAAI;EAAAJ,EAAA,MAAAnB;CAAA,OAAA;EAAAb,WAAAgC,EAAA;EAAA/B,UAAA+B,EAAA;EAAAxB,OAAAwB,EAAA;EAAAE,QAAAF,EAAA;EAAAvB,aAAAuB,EAAA;EAAAtB,eAAAsB,EAAA;EAAArB,MAAAqB,EAAA;EAAAG,SAAAH,EAAA;EAAAI,KAAAJ,EAAA;EAAAnB,SAAAmB,EAAA;CAAA;CAPhB,MAAAN,YAAAU,OAAAC,KAAAA,IAAA,QAAAD;CAQA,MAAAE,WAAiB9C,YAAY;CAC7B,MAAA+C,OAAa1C,cAAcqC,OAAOR,SAAS;CAC3C,MAAA,EAAAc,UAAAnC,OAAAoC,KAAAC,WAKIH;CAAK,IAAAI;CAAA,IAAAX,EAAA,QAAA/B,WAAA+B,EAAA,QAAA3B,OAAA;EACMsC,KAAA/C,oBAAoBK,SAASI,KAAK;EAAC2B,EAAA,MAAA/B;EAAA+B,EAAA,MAAA3B;EAAA2B,EAAA,MAAAW;CAAA,OAAAA,KAAAX,EAAA;CAAlD,MAAAY,SAAeD;CAAoC,IAAAE;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAnB,EAAA,QAAAO,KAAAa,WAAApB,EAAA,QAAAhC,YAAAgC,EAAA,QAAAQ,YAAAR,EAAA,QAAAxB,QAAAwB,EAAA,QAAAN,aAAAM,EAAA,QAAAvB,cAAAuB,EAAA,QAAAY,UAAAZ,EAAA,QAAA3B,SAAA2B,EAAA,QAAAS,OAAAT,EAAA,QAAArB,OAAAqB,EAAA,QAAAG,UAAAH,EAAA,QAAAU,OAAAW,YAAArB,EAAA,QAAAU,OAAAY,WAAAtB,EAAA,QAAAnB,QAAA;EAyB1CsC,KAAAI,OAGKC,IAHL,6BAGI;EAACC,KAAA;GArBd,MAAAL,UAAgB3C,eAAe4B,KAAAA,IAAYE,KAAIa,UAA/B;IAAA,GACXb,KAAIa;IAAQM,MACT;KAAA,GACDnB,KAAIa,QAAQM;KAAK,gBACJjD;IAClB;GACF;GAAE,IAAAkD;GAAA,IAAA3B,EAAA,QAAAvB,cAAAuB,EAAA,QAAAY,QAAA;IACiBe,KAAAlD,eAAe4B,KAAAA,IAAfO,SAAA;KAAAtC,YACNJ,UAAmD0C,OAAMtC,UAAW;MAAA,GAC1EJ;MAAKO;KAEV,CAAC;KAACG,QACKgD,YAA+ChB,OAAMhC,MAAO;MAAA,GAC9DV;MAAKO;KAEV,CAAC;IACH;IAACuB,EAAA,MAAAvB;IAAAuB,EAAA,MAAAY;IAAAZ,EAAA,MAAA2B;GAAA,OAAAA,KAAA3B,EAAA;GATDc,aAAmBa;GAUnB,IAAInD,SAAS6B,KAAAA,GAAS;IACbc,KAAA,qBAAC2B,MAAD;KAAetE;KAAkBgC,YAAAA;KAAeC;KAAU9B;KAAa,QAAAjB,aAAa0D,OAAO;KAAWvC;KAAM,GAAM6B,OAAMW;KAAS,GAAMhD;KAAK,GAAMyC;KAAlJ,UAAA,CACF9C,UACA0C,OAAMY,OAFI;;IAAR,MAAAG;GAGK;GAENZ,KAAA5D;GAAsBuD,KAAAA;GAAqBd,KAAAA;GAAgBe,KAAAA;GAAaS,KAAAzD,eAAe2D,SAASS,eAAe1B,QAAQ1B,UAAU,CAAC;EAAC;EAAAuB,EAAA,MAAAO,KAAAa;EAAApB,EAAA,MAAAhC;EAAAgC,EAAA,MAAAQ;EAAAR,EAAA,MAAAxB;EAAAwB,EAAA,MAAAN;EAAAM,EAAA,MAAAvB;EAAAuB,EAAA,MAAAY;EAAAZ,EAAA,MAAA3B;EAAA2B,EAAA,MAAAS;EAAAT,EAAA,MAAArB;EAAAqB,EAAA,MAAAG;EAAAH,EAAA,MAAAU,OAAAW;EAAArB,EAAA,MAAAU,OAAAY;EAAAtB,EAAA,MAAAnB;EAAAmB,EAAA,MAAAa;EAAAb,EAAA,MAAAc;EAAAd,EAAA,MAAAe;EAAAf,EAAA,MAAAgB;EAAAhB,EAAA,MAAAiB;EAAAjB,EAAA,MAAAkB;EAAAlB,EAAA,MAAAmB;CAAA,OAAA;EAAAN,KAAAb,EAAA;EAAAc,aAAAd,EAAA;EAAAe,KAAAf,EAAA;EAAAgB,KAAAhB,EAAA;EAAAiB,KAAAjB,EAAA;EAAAkB,KAAAlB,EAAA;EAAAmB,KAAAnB,EAAA;CAAA;CAAA,IAAAmB,OAAAI,OAAAC,IAAA,6BAAA,GAAA,OAAAL;CAAM,MAAAQ,KAAAjB,OAAMW;CAC1H,MAAAS,KAAApD,gBAAgB4B,SAAQyB;CAAQ,IAAAC;CAAA,IAAAhC,EAAA,QAAAhC,YAAAgC,EAAA,QAAAU,OAAAY,WAAAtB,EAAA,QAAA8B,IAAA;EAAxDE,MAAAC,cAAcjE,UAAU8D,IAAkCpB,OAAMY,OAAQ;EAACtB,EAAA,MAAAhC;EAAAgC,EAAA,MAAAU,OAAAY;EAAAtB,EAAA,MAAA8B;EAAA9B,EAAA,MAAAgC;CAAA,OAAAA,MAAAhC,EAAA;CAAA,IAAAkC;CAAA,IAAAlC,EAAA,QAAAa,MAAAb,EAAA,QAAA3B,SAAA2B,EAAA,QAAAU,OAAAW,YAAArB,EAAA,QAAAc,cAAAd,EAAA,QAAAgC,OAAAhC,EAAA,QAAAe,MAAAf,EAAA,QAAAgB,MAAAhB,EAAA,QAAAiB,MAAAjB,EAAA,QAAAkB,IAAA;EADvEgB,MAAA,oBAAC,IAAD;GAAuB1B,YAAAA;GAAqBd,WAAAA;GAAgBe,KAAAA;GAAa,QAAAS;GAA2D,GAAMS;GAAe,GAAMtD;GAAK,GAAMyC;GAC5KkB,UAAAA;EADY,CAAA;EAEHhC,EAAA,MAAAa;EAAAb,EAAA,MAAA3B;EAAA2B,EAAA,MAAAU,OAAAW;EAAArB,EAAA,MAAAc;EAAAd,EAAA,MAAAgC;EAAAhC,EAAA,MAAAe;EAAAf,EAAA,MAAAgB;EAAAhB,EAAA,MAAAiB;EAAAjB,EAAA,MAAAkB;EAAAlB,EAAA,MAAAkC;CAAA,OAAAA,MAAAlC,EAAA;CAAA,OAFPkC;AAEO;AAehB,SAASD,cAAcjE,UAAqBU,cAAsB4C,SAAoB;CACpF,QAAQpD,UAA6B,qBAAA,UAAA,EAAA,UAAA;EACjC,oBAAC,QAAD;GAAM,GAAInB,MAAae,iBAAiBqE,OAAOjE,MAAMwB,aAAa5B,iBAAiBsE,YAAY;GAC5FpE;EACG,CAAA;EACLE,MAAMwB,YAAY,oBAAC,QAAD;GAAM,GAAI3C,MAAae,iBAAiBuE,OAAO;GAC9D,UAAA,oBAAC,mBAAD;IAAmB,cAAY3D;IAAc,UAAS;IAAM,iBAAA;IAAgB,MAAK;IAAU,SAAQ;GAAU,CAAA;EACzG,CAAA,IAAI;EACX4C;CACH,EAAA,CAAA;AACJ;AAIA,SAASO,eAAe1B,QAAkC1B,YAA2D;CACnH,IAAI0B,WAAWE,KAAAA,KAAa5B,eAAe4B,KAAAA,GACzC,OAAOF;CAKT,QAAQ9B,OAAOH,UAAU;EAKvB,OAAOiC,OAAO9B,OAAOiE;GAHnB,GAAGpE;GACHO;EAEmB6D,CAAQ;CAC/B;AACF;;;;;;;;;AAUA,SAAAC,iBAAAxC,IAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAA,IAAAjC;CAAA,IAAAC;CAAA,IAAAwB;CAAA,IAAAS;CAAA,IAAAzB;CAAA,IAAAkB;CAAA,IAAAQ;CAAA,IAAAC;CAAA,IAAAJ,EAAA,OAAAD,IAAA;EAA0B,CAAA,CAAA/B,UAAAC,SAAAwB,iBAAAC,WAAAU,IAAA3B,YAAAkB,UAAAQ,QAAA,GAAAD,SAAAH;EASFC,EAAA,KAAAD;EAAAC,EAAA,KAAAhC;EAAAgC,EAAA,KAAA/B;EAAA+B,EAAA,KAAAP;EAAAO,EAAA,KAAAE;EAAAF,EAAA,KAAAvB;EAAAuB,EAAA,KAAAL;EAAAK,EAAA,KAAAG;EAAAH,EAAA,KAAAI;CAAA,OAAA;EAAApC,WAAAgC,EAAA;EAAA/B,UAAA+B,EAAA;EAAAP,kBAAAO,EAAA;EAAAE,QAAAF,EAAA;EAAAvB,aAAAuB,EAAA;EAAAL,WAAAK,EAAA;EAAAG,SAAAH,EAAA;EAAAI,KAAAJ,EAAA;CAAA;CALtB,MAAAN,YAAAU,OAAAC,KAAAA,IAAA,QAAAD;CAUA,MAAAoC,kBAAwBjF,uBAAuB2C,MAAKuC,EAAG;CAAE,IAAA9B;CAAA,IAAAX,EAAA,OAAAwC,mBAAAxC,EAAA,QAAAE,OAAA;EAOvCS,KAAA6B,kBAAA;GAAA,GACbtC;GAAKwC,YACI;EACN,IAHUxC;EAGTF,EAAA,KAAAwC;EAAAxC,EAAA,MAAAE;EAAAF,EAAA,MAAAW;CAAA,OAAAA,KAAAX,EAAA;CATT,MAAA,EAAAQ,UAAAY,SAAA/C,OAAAoC,KAAAC,WAMI7C,cAAc8C,IAGPjB,SAAS;CAAE,IAAAqB;CAAA,IAAAf,EAAA,QAAAoB,WAAApB,EAAA,QAAAG,QAAA;EACwHY,KAAApD,qBAAqByD,SAASuB,aAAaxC,MAAM,CAAC;EAACH,EAAA,MAAAoB;EAAApB,EAAA,MAAAG;EAAAH,EAAA,MAAAe;CAAA,OAAAA,KAAAf,EAAA;CAAM,MAAAgB,KAAAN,OAAMW;CAAS,IAAAJ;CAAA,IAAAjB,EAAA,QAAA/B,WAAA+B,EAAA,QAAA3B,OAAA;EAAiB4C,KAAArD,oBAAoBK,SAASI,KAAK;EAAC2B,EAAA,MAAA/B;EAAA+B,EAAA,MAAA3B;EAAA2B,EAAA,MAAAiB;CAAA,OAAAA,KAAAjB,EAAA;CAAA,IAAAkB;CAAA,IAAAlB,EAAA,QAAAhC,YAAAgC,EAAA,QAAAU,OAAAY,SAAA;EACrQJ,KAAA0B,cAAc5E,UAAU0C,OAAMY,OAAQ;EAACtB,EAAA,MAAAhC;EAAAgC,EAAA,MAAAU,OAAAY;EAAAtB,EAAA,MAAAkB;CAAA,OAAAA,KAAAlB,EAAA;CAAA,IAAAmB;CAAA,IAAAnB,EAAA,QAAAP,mBAAAO,EAAA,QAAAQ,YAAAR,EAAA,QAAAvB,cAAAuB,EAAA,QAAAL,YAAAK,EAAA,QAAA3B,SAAA2B,EAAA,QAAAS,OAAAT,EAAA,QAAAU,OAAAW,YAAArB,EAAA,QAAAe,MAAAf,EAAA,QAAAiB,MAAAjB,EAAA,QAAAkB,IAAA;EADrCC,KAAA,oBAAC8B,cAAD;GAAkCxD;GAA6Be,YAAAA;GAAsB/B;GAAsBkB;GAAec;GAAa,QAAAM;GAAmD,GAAMC;GAAe,GAAM3C;GAAK,GAAM4C;GAClOC,UAAAA;EADkB,CAAA;EAEHlB,EAAA,MAAAP;EAAAO,EAAA,MAAAQ;EAAAR,EAAA,MAAAvB;EAAAuB,EAAA,MAAAL;EAAAK,EAAA,MAAA3B;EAAA2B,EAAA,MAAAS;EAAAT,EAAA,MAAAU,OAAAW;EAAArB,EAAA,MAAAe;EAAAf,EAAA,MAAAiB;EAAAjB,EAAA,MAAAkB;EAAAlB,EAAA,MAAAmB;CAAA,OAAAA,KAAAnB,EAAA;CAAA,OAFbmB;AAEa;AAKtB,SAASyB,cAAc5E,UAAqBsD,SAAoB;CAC9D,aAAa,qBAAA,UAAA,EAAA,UAAA,CACRtD,UACAsD,OACH,EAAA,CAAA;AACJ;AAOA,SAASqB,aAAaxC,QAAkE;CACtF,IAAIA,WAAWE,KAAAA,GACb;CAEF,QAAQhC,OAAOH,UAAUiC,OAAO9B,OAAO;EACrC,GAAGH;EACHwB,WAAW;CACb,CAAC;AACH"}

package/dist/button/toggle.js

@@ -0,0 +1,17 @@
+//#region src/button/toggle.ts
+/**
+* A toggle's press: the call site's own `onPress` first, then the change of
+* state, which is the order React Aria's own toggle reports them in. Built by
+* a call rather than written inline at the prop, which is what react-perf's
+* no-new-function-as-prop is after.
+*/
+function pressThen(onPress, then) {
+	return (...event) => {
+		onPress?.(...event);
+		then();
+	};
+}
+//#endregion
+export { pressThen };
+
+//# sourceMappingURL=toggle.js.map

package/dist/button/toggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toggle.js","names":["ButtonDOMProps","PressHandler","NonNullable","pressThen","onPress","then","event","Parameters"],"sources":["../../src/button/toggle.ts"],"sourcesContent":["import type { ButtonDOMProps } from '.'\n\ntype PressHandler = NonNullable<ButtonDOMProps['onPress']>\n\n/**\n * A toggle's press: the call site's own `onPress` first, then the change of\n * state, which is the order React Aria's own toggle reports them in. Built by\n * a call rather than written inline at the prop, which is what react-perf's\n * no-new-function-as-prop is after.\n */\nfunction pressThen(onPress: PressHandler | undefined, then: () => void) {\n  return (...event: Parameters<PressHandler>) => {\n    onPress?.(...event)\n    then()\n  }\n}\n\nexport { pressThen }\n"],"mappings":";;;;;;;AAUA,SAASG,UAAUC,SAAmCC,MAAkB;CACtE,QAAQ,GAAGC,UAAoC;EAC7CF,UAAU,GAAGE,KAAK;EAClBD,KAAK;CACP;AACF"}