@kanso-labs/react-native-kanso-ui 0.9.0 → 0.11.0

package/dist/components/icon-button/index.js

@@ -2,12 +2,14 @@ import { IconStyleContext } from "../../glyphs/icon-style.js";
 import { useTheme } from "../../theme/scope.js";
 import { composeStyles, themedStyles } from "../../theme/styles.js";
 import { hitSlop, usePressFeedback } from "../../press/index.js";
-import { AnimatedPressable, HEIGHTS, OUTLINE_WIDTHS, PRESSED_CORNERS, buttonStyles, toggleState, useButtonAction, useCorner, useSlotTrigger } from "../../button/index.js";
+import { AnimatedPressable, HEIGHTS, OUTLINE_WIDTHS, PRESSED_CORNERS, buttonStyles, pressThen, toggleState, useButtonAction, useCorner, useSlotTrigger } from "../../button/index.js";
+import { ButtonGroupItemContext, groupCornersOf, groupPressHandlers, groupSelectionOf, groupStyles, groupWidthThen, useGroupShift } from "../../button/group.js";
 import { palettesOf } from "../../button/palettes.js";
 import { BUSY, PendingContent, PendingRing, usePending } from "../../button/pending.js";
 import { c } from "react/compiler-runtime";
 import { StyleSheet } from "react-native";
-import Animated from "react-native-reanimated";
+import Animated, { useSharedValue } from "react-native-reanimated";
+import { use } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/icon-button/index.tsx
 const DISABLED = {
@@ -88,11 +90,13 @@ const sizesOf = themedStyles(({ sizing }) => {
 * `style`, `ref` and `testID` land on the `Pressable`.
 */
 function IconButton(t0) {
-	const $ = c(91);
+	const $ = c(101);
+	let accessibilityHint;
 	let children;
 	let defaultSelected;
 	let delayLongPress;
 	let href;
+	let id;
 	let isSelected;
 	let onBlur;
 	let onChange;
@@ -105,6 +109,7 @@ function IconButton(t0) {
 	let onPressIn;
 	let onPressOut;
 	let ownHitSlop;
+	let ownSize;
 	let pendingLabel;
 	let props;
 	let ref;
@@ -114,139 +119,160 @@ function IconButton(t0) {
 	let t2;
 	let t3;
 	let t4;
-	let t5;
 	let type;
 	if ($[0] !== t0) {
-		({children, defaultSelected, delayLongPress, disableRipple: t1, hitSlop: ownHitSlop, href, isDisabled: t2, isPending: t3, isSelected, onBlur, onChange, onFocus, onHoverIn, onHoverOut, onLayout, onLongPress, onPress, onPressIn, onPressOut, pendingLabel, ref, size: t4, slot, style, type, variant: t5, ...props} = t0);
+		({accessibilityHint, children, defaultSelected, delayLongPress, disableRipple: t1, hitSlop: ownHitSlop, href, id, isDisabled: t2, isPending: t3, isSelected, onBlur, onChange, onFocus, onHoverIn, onHoverOut, onLayout, onLongPress, onPress, onPressIn, onPressOut, pendingLabel, ref, size: ownSize, slot, style, type, variant: t4, ...props} = t0);
 		$[0] = t0;
-		$[1] = children;
-		$[2] = defaultSelected;
-		$[3] = delayLongPress;
-		$[4] = href;
-		$[5] = isSelected;
-		$[6] = onBlur;
-		$[7] = onChange;
-		$[8] = onFocus;
-		$[9] = onHoverIn;
-		$[10] = onHoverOut;
-		$[11] = onLayout;
-		$[12] = onLongPress;
-		$[13] = onPress;
-		$[14] = onPressIn;
-		$[15] = onPressOut;
-		$[16] = ownHitSlop;
-		$[17] = pendingLabel;
-		$[18] = props;
-		$[19] = ref;
-		$[20] = slot;
-		$[21] = style;
-		$[22] = t1;
-		$[23] = t2;
-		$[24] = t3;
-		$[25] = t4;
-		$[26] = t5;
-		$[27] = type;
+		$[1] = accessibilityHint;
+		$[2] = children;
+		$[3] = defaultSelected;
+		$[4] = delayLongPress;
+		$[5] = href;
+		$[6] = id;
+		$[7] = isSelected;
+		$[8] = onBlur;
+		$[9] = onChange;
+		$[10] = onFocus;
+		$[11] = onHoverIn;
+		$[12] = onHoverOut;
+		$[13] = onLayout;
+		$[14] = onLongPress;
+		$[15] = onPress;
+		$[16] = onPressIn;
+		$[17] = onPressOut;
+		$[18] = ownHitSlop;
+		$[19] = ownSize;
+		$[20] = pendingLabel;
+		$[21] = props;
+		$[22] = ref;
+		$[23] = slot;
+		$[24] = style;
+		$[25] = t1;
+		$[26] = t2;
+		$[27] = t3;
+		$[28] = t4;
+		$[29] = type;
 	} else {
-		children = $[1];
-		defaultSelected = $[2];
-		delayLongPress = $[3];
-		href = $[4];
-		isSelected = $[5];
-		onBlur = $[6];
-		onChange = $[7];
-		onFocus = $[8];
-		onHoverIn = $[9];
-		onHoverOut = $[10];
-		onLayout = $[11];
-		onLongPress = $[12];
-		onPress = $[13];
-		onPressIn = $[14];
-		onPressOut = $[15];
-		ownHitSlop = $[16];
-		pendingLabel = $[17];
-		props = $[18];
-		ref = $[19];
-		slot = $[20];
-		style = $[21];
-		t1 = $[22];
-		t2 = $[23];
-		t3 = $[24];
-		t4 = $[25];
-		t5 = $[26];
-		type = $[27];
+		accessibilityHint = $[1];
+		children = $[2];
+		defaultSelected = $[3];
+		delayLongPress = $[4];
+		href = $[5];
+		id = $[6];
+		isSelected = $[7];
+		onBlur = $[8];
+		onChange = $[9];
+		onFocus = $[10];
+		onHoverIn = $[11];
+		onHoverOut = $[12];
+		onLayout = $[13];
+		onLongPress = $[14];
+		onPress = $[15];
+		onPressIn = $[16];
+		onPressOut = $[17];
+		ownHitSlop = $[18];
+		ownSize = $[19];
+		pendingLabel = $[20];
+		props = $[21];
+		ref = $[22];
+		slot = $[23];
+		style = $[24];
+		t1 = $[25];
+		t2 = $[26];
+		t3 = $[27];
+		t4 = $[28];
+		type = $[29];
 	}
 	const disableRipple = t1 === void 0 ? false : t1;
-	const isDisabled = t2 === void 0 ? false : t2;
+	const ownDisabled = t2 === void 0 ? false : t2;
 	const isPending = t3 === void 0 ? false : t3;
-	const size = t4 === void 0 ? "md" : t4;
-	const variant = t5 === void 0 ? "standard" : t5;
+	const variant = t4 === void 0 ? "standard" : t4;
 	const theme = useTheme();
+	const group = use(ButtonGroupItemContext);
+	const size = ownSize ?? group?.size ?? "md";
+	const isDisabled = ownDisabled || group?.isDisabled === true;
+	const membership = groupSelectionOf(group, id);
 	const pending = href === void 0 && isPending;
 	const ringLabel = usePending(pending, pendingLabel);
-	const isToggle = defaultSelected !== void 0 || isSelected !== void 0 || onChange !== void 0;
-	const t6 = slot ?? "default";
-	let t7;
-	if ($[28] !== defaultSelected || $[29] !== href || $[30] !== isSelected || $[31] !== isToggle || $[32] !== onChange || $[33] !== onPress || $[34] !== t6 || $[35] !== type) {
-		t7 = {
+	const isToggle = membership === void 0 && (defaultSelected !== void 0 || isSelected !== void 0 || onChange !== void 0);
+	const t5 = slot ?? "default";
+	let t6;
+	if ($[30] !== defaultSelected || $[31] !== href || $[32] !== isSelected || $[33] !== isToggle || $[34] !== onChange || $[35] !== onPress || $[36] !== t5 || $[37] !== type) {
+		t6 = {
 			defaultSelected,
 			href,
 			isSelected,
 			isToggle,
 			onChange,
 			onPress,
-			slot: t6,
+			slot: t5,
 			type
 		};
-		$[28] = defaultSelected;
-		$[29] = href;
-		$[30] = isSelected;
-		$[31] = isToggle;
-		$[32] = onChange;
-		$[33] = onPress;
-		$[34] = t6;
-		$[35] = type;
-		$[36] = t7;
-	} else t7 = $[36];
-	const action = useButtonAction(t7);
-	let t8;
-	if ($[37] !== delayLongPress || $[38] !== href || $[39] !== onHoverIn || $[40] !== onHoverOut || $[41] !== onLongPress || $[42] !== ref || $[43] !== slot) {
-		t8 = {
+		$[30] = defaultSelected;
+		$[31] = href;
+		$[32] = isSelected;
+		$[33] = isToggle;
+		$[34] = onChange;
+		$[35] = onPress;
+		$[36] = t5;
+		$[37] = type;
+		$[38] = t6;
+	} else t6 = $[38];
+	const action = useButtonAction(t6);
+	let t7;
+	if ($[39] !== accessibilityHint || $[40] !== delayLongPress || $[41] !== href || $[42] !== onHoverIn || $[43] !== onHoverOut || $[44] !== onLongPress || $[45] !== onPressIn || $[46] !== onPressOut || $[47] !== ref || $[48] !== slot) {
+		t7 = {
+			accessibilityHint,
 			delayLongPress,
 			href,
 			onHoverIn,
 			onHoverOut,
 			onLongPress,
+			onPressIn,
+			onPressOut,
 			ref,
 			slot
 		};
-		$[37] = delayLongPress;
-		$[38] = href;
-		$[39] = onHoverIn;
-		$[40] = onHoverOut;
-		$[41] = onLongPress;
-		$[42] = ref;
-		$[43] = slot;
-		$[44] = t8;
-	} else t8 = $[44];
-	const t9 = useSlotTrigger(t8);
+		$[39] = accessibilityHint;
+		$[40] = delayLongPress;
+		$[41] = href;
+		$[42] = onHoverIn;
+		$[43] = onHoverOut;
+		$[44] = onLongPress;
+		$[45] = onPressIn;
+		$[46] = onPressOut;
+		$[47] = ref;
+		$[48] = slot;
+		$[49] = t7;
+	} else t7 = $[49];
+	const t8 = useSlotTrigger(t7);
 	let hoverIn;
 	let hoverOut;
 	let longPress;
+	let pressIn;
+	let pressOut;
 	let triggerProps;
-	if ($[45] !== t9) {
-		({onHoverIn: hoverIn, onHoverOut: hoverOut, onLongPress: longPress, ...triggerProps} = t9);
-		$[45] = t9;
-		$[46] = hoverIn;
-		$[47] = hoverOut;
-		$[48] = longPress;
-		$[49] = triggerProps;
+	if ($[50] !== t8) {
+		({onHoverIn: hoverIn, onHoverOut: hoverOut, onLongPress: longPress, onPressIn: pressIn, onPressOut: pressOut, ...triggerProps} = t8);
+		$[50] = t8;
+		$[51] = hoverIn;
+		$[52] = hoverOut;
+		$[53] = longPress;
+		$[54] = pressIn;
+		$[55] = pressOut;
+		$[56] = triggerProps;
 	} else {
-		hoverIn = $[46];
-		hoverOut = $[47];
-		longPress = $[48];
-		triggerProps = $[49];
+		hoverIn = $[51];
+		hoverOut = $[52];
+		longPress = $[53];
+		pressIn = $[54];
+		pressOut = $[55];
+		triggerProps = $[56];
 	}
-	const colors = palettesOf(theme)[isDisabled ? DISABLED[variant] : isToggle ? TOGGLE_PALETTES[variant][action.selected ? "selected" : "unselected"] : variant];
+	const toggles = isToggle || membership !== void 0;
+	const selected = membership?.selected ?? action.selected;
+	const colors = palettesOf(theme)[isDisabled ? DISABLED[variant] : toggles ? TOGGLE_PALETTES[variant][selected ? "selected" : "unselected"] : variant];
+	const width = useSharedValue(0);
 	const feedback = usePressFeedback({
 		color: colors.content,
 		disabled: isDisabled,
@@ -255,93 +281,98 @@ function IconButton(t0) {
 		onFocus,
 		onHoverIn: hoverIn,
 		onHoverOut: hoverOut,
-		onPressIn,
-		onPressOut,
+		...groupPressHandlers(group, width, pressIn, pressOut),
 		pending
 	});
 	const { radii, sizing } = theme;
 	const edge = sizing[HEIGHTS[size]];
-	const shaped = useCorner(feedback.pressed || action.selected ? radii[PRESSED_CORNERS[size]] : radii.pill, onLayout);
+	const shaped = useCorner(groupCornersOf(group, feedback, selected) ?? (feedback.pressed || selected ? radii[PRESSED_CORNERS[size]] : radii.pill), groupWidthThen(group, width, onLayout));
+	const shift = useGroupShift(group, edge, "width");
+	const keepsTarget = group?.keepsTarget === true;
 	const T0 = AnimatedPressable;
-	const t10 = href === void 0 ? "button" : "link";
-	let t11;
-	if ($[50] !== action || $[51] !== isToggle) {
-		t11 = isToggle ? toggleState(action.selected) : void 0;
-		$[50] = action;
-		$[51] = isToggle;
-		$[52] = t11;
-	} else t11 = $[52];
+	const t9 = href === void 0 ? "button" : "link";
+	let t10;
+	if ($[57] !== action || $[58] !== isToggle) {
+		t10 = isToggle ? toggleState(action.selected) : void 0;
+		$[57] = action;
+		$[58] = isToggle;
+		$[59] = t10;
+	} else t10 = $[59];
+	const t11 = membership?.accessibility;
 	const t12 = pending ? BUSY : void 0;
 	const t13 = feedback.handlers;
 	let t14;
-	if ($[53] !== edge || $[54] !== ownHitSlop) {
-		t14 = ownHitSlop ?? hitSlop(edge, edge);
-		$[53] = edge;
-		$[54] = ownHitSlop;
-		$[55] = t14;
-	} else t14 = $[55];
+	if ($[60] !== edge || $[61] !== keepsTarget || $[62] !== ownHitSlop) {
+		t14 = ownHitSlop ?? hitSlop(edge, keepsTarget ? Math.max(edge, 48) : edge);
+		$[60] = edge;
+		$[61] = keepsTarget;
+		$[62] = ownHitSlop;
+		$[63] = t14;
+	} else t14 = $[63];
 	const t15 = shaped.onLayout;
 	const t16 = pending ? void 0 : longPress;
-	const t17 = pending ? void 0 : action.onPress;
-	const t18 = composeStyles(styles.base, sizesOf(theme)[size], variant === "outlined" ? outlineWidths[size] : void 0, colors.container, shaped.corner, feedback.ring, style);
+	const t17 = pending ? void 0 : membership === void 0 ? action.onPress : pressThen(action.onPress, membership.toggle);
+	const t18 = composeStyles(styles.base, sizesOf(theme)[size], variant === "outlined" ? outlineWidths[size] : void 0, colors.container, shaped.corner, shift, keepsTarget ? groupStyles.target : void 0, feedback.ring, style);
 	let t19;
-	if ($[56] !== shaped.corner) {
+	if ($[64] !== shaped.corner) {
 		t19 = composeStyles(buttonStyles.clip, shaped.corner);
-		$[56] = shaped.corner;
-		$[57] = t19;
-	} else t19 = $[57];
+		$[64] = shaped.corner;
+		$[65] = t19;
+	} else t19 = $[65];
 	let t20;
-	if ($[58] !== feedback.layer || $[59] !== t19) {
+	if ($[66] !== feedback.layer || $[67] !== t19) {
 		t20 = /* @__PURE__ */ jsx(Animated.View, {
 			style: t19,
 			children: feedback.layer
 		});
-		$[58] = feedback.layer;
-		$[59] = t19;
-		$[60] = t20;
-	} else t20 = $[60];
+		$[66] = feedback.layer;
+		$[67] = t19;
+		$[68] = t20;
+	} else t20 = $[68];
 	const T1 = PendingContent;
 	const T2 = IconStyleContext;
 	const t21 = iconStyleOf(colors.content, size);
 	let t22;
-	if ($[61] !== T2 || $[62] !== children || $[63] !== t21) {
+	if ($[69] !== T2 || $[70] !== children || $[71] !== t21) {
 		t22 = /* @__PURE__ */ jsx(T2, {
 			value: t21,
 			children
 		});
-		$[61] = T2;
-		$[62] = children;
-		$[63] = t21;
-		$[64] = t22;
-	} else t22 = $[64];
+		$[69] = T2;
+		$[70] = children;
+		$[71] = t21;
+		$[72] = t22;
+	} else t22 = $[72];
 	let t23;
-	if ($[65] !== T1 || $[66] !== pending || $[67] !== t22) {
+	if ($[73] !== T1 || $[74] !== pending || $[75] !== t22) {
 		t23 = /* @__PURE__ */ jsx(T1, {
 			isPending: pending,
 			children: t22
 		});
-		$[65] = T1;
-		$[66] = pending;
-		$[67] = t22;
-		$[68] = t23;
-	} else t23 = $[68];
+		$[73] = T1;
+		$[74] = pending;
+		$[75] = t22;
+		$[76] = t23;
+	} else t23 = $[76];
 	let t24;
-	if ($[69] !== colors || $[70] !== pending || $[71] !== ringLabel || $[72] !== size) {
+	if ($[77] !== colors || $[78] !== pending || $[79] !== ringLabel || $[80] !== size) {
 		t24 = pending ? /* @__PURE__ */ jsx(PendingRing, {
 			color: colors.content,
 			diameter: ICON_SIZES[size],
 			label: ringLabel
 		}) : null;
-		$[69] = colors;
-		$[70] = pending;
-		$[71] = ringLabel;
-		$[72] = size;
-		$[73] = t24;
-	} else t24 = $[73];
+		$[77] = colors;
+		$[78] = pending;
+		$[79] = ringLabel;
+		$[80] = size;
+		$[81] = t24;
+	} else t24 = $[81];
 	let t25;
-	if ($[74] !== T0 || $[75] !== feedback.handlers || $[76] !== isDisabled || $[77] !== props || $[78] !== shaped.onLayout || $[79] !== t10 || $[80] !== t11 || $[81] !== t12 || $[82] !== t14 || $[83] !== t16 || $[84] !== t17 || $[85] !== t18 || $[86] !== t20 || $[87] !== t23 || $[88] !== t24 || $[89] !== triggerProps) {
+	if ($[82] !== T0 || $[83] !== feedback.handlers || $[84] !== id || $[85] !== isDisabled || $[86] !== props || $[87] !== shaped.onLayout || $[88] !== t10 || $[89] !== t11 || $[90] !== t12 || $[91] !== t14 || $[92] !== t16 || $[93] !== t17 || $[94] !== t18 || $[95] !== t20 || $[96] !== t23 || $[97] !== t24 || $[98] !== t9 || $[99] !== triggerProps) {
 		t25 = /* @__PURE__ */ jsxs(T0, {
-			role: t10,
+			id,
+			role: t9,
+			...t10,
 			...t11,
 			...t12,
 			...props,
@@ -359,24 +390,26 @@ function IconButton(t0) {
 				t24
 			]
 		});
-		$[74] = T0;
-		$[75] = feedback.handlers;
-		$[76] = isDisabled;
-		$[77] = props;
-		$[78] = shaped.onLayout;
-		$[79] = t10;
-		$[80] = t11;
-		$[81] = t12;
-		$[82] = t14;
-		$[83] = t16;
-		$[84] = t17;
-		$[85] = t18;
-		$[86] = t20;
-		$[87] = t23;
-		$[88] = t24;
-		$[89] = triggerProps;
-		$[90] = t25;
-	} else t25 = $[90];
+		$[82] = T0;
+		$[83] = feedback.handlers;
+		$[84] = id;
+		$[85] = isDisabled;
+		$[86] = props;
+		$[87] = shaped.onLayout;
+		$[88] = t10;
+		$[89] = t11;
+		$[90] = t12;
+		$[91] = t14;
+		$[92] = t16;
+		$[93] = t17;
+		$[94] = t18;
+		$[95] = t20;
+		$[96] = t23;
+		$[97] = t24;
+		$[98] = t9;
+		$[99] = triggerProps;
+		$[100] = t25;
+	} else t25 = $[100];
 	return t25;
 }
 function iconStyleOf(color, size) {

package/dist/components/icon-button/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ComponentRef","ReactNode","Ref","PressableProps","StyleProp","View","ViewStyle","AnimatedStyle","StyleSheet","Animated","ButtonLinkForm","ButtonPressForm","ButtonToggleForm","PaletteName","IconStyle","AnimatedPressable","buttonStyles","HEIGHTS","OUTLINE_WIDTHS","PRESSED_CORNERS","toggleState","useButtonAction","useCorner","useSlotTrigger","palettesOf","BUSY","PendingContent","PendingRing","usePending","IconStyleContext","hitSlop","usePressFeedback","useTheme","composeStyles","themedStyles","IconButtonProps","Omit","children","disableRipple","isDisabled","ref","size","IconButtonSize","style","variant","IconButtonVariant","DISABLED","Readonly","Record","filled","outlined","standard","tonal","ICON_SIZES","lg","md","xl","xs","xxl","TOGGLE_PALETTES","selected","unselected","styles","create","base","alignItems","flexShrink","justifyContent","outlineWidths","borderWidth","sizesOf","sizing","square","edge","height","width","IconButton","t0","$","_c","defaultSelected","delayLongPress","href","isSelected","onBlur","onChange","onFocus","onHoverIn","onHoverOut","onLayout","onLongPress","onPress","onPressIn","onPressOut","ownHitSlop","pendingLabel","props","slot","t1","t2","t3","t4","t5","type","isPending","undefined","theme","pending","ringLabel","isToggle","t6","t7","action","t8","t9","hoverIn","hoverOut","longPress","triggerProps","colors","feedback","color","content","disabled","radii","shaped","pressed","pill","T0","t10","t11","t12","t13","handlers","t14","t15","t16","t17","t18","container","corner","ring","t19","clip","t20","layer","T1","T2","t21","iconStyleOf","t22","t23","t24","t25","_c"],"sources":["../../../src/components/icon-button/index.tsx"],"sourcesContent":["import type { ComponentRef, ReactNode, Ref } from 'react'\nimport type { PressableProps, StyleProp, View, ViewStyle } from 'react-native'\nimport type { AnimatedStyle } from 'react-native-reanimated'\n\nimport { StyleSheet } from 'react-native'\nimport Animated from 'react-native-reanimated'\n\nimport type {\n  ButtonLinkForm,\n  ButtonPressForm,\n  ButtonToggleForm,\n} from '../../button'\nimport type { PaletteName } from '../../button/palettes'\nimport type { IconStyle } from '../../glyphs/icon-style'\n\nimport {\n  AnimatedPressable,\n  buttonStyles,\n  HEIGHTS,\n  OUTLINE_WIDTHS,\n  PRESSED_CORNERS,\n  toggleState,\n  useButtonAction,\n  useCorner,\n  useSlotTrigger,\n} from '../../button'\nimport { palettesOf } from '../../button/palettes'\nimport {\n  BUSY,\n  PendingContent,\n  PendingRing,\n  usePending,\n} from '../../button/pending'\nimport { IconStyleContext } from '../../glyphs/icon-style'\nimport { hitSlop, usePressFeedback } from '../../press'\nimport { useTheme } from '../../theme/scope'\nimport { composeStyles, themedStyles } from '../../theme/styles'\n\n// The icon buttons spec page's four styles at its five sizes, as kanso-ui's\n// IconButton draws them: Button's chrome around a single icon. The pairs are\n// the page's: filled on primary, tonal on secondary container, outlined with\n// an outline-variant rule and an on-surface-variant icon, and standard,\n// transparent, with the same icon over whatever it sits on. Disabled is\n// Button's, on-surface at the two disabled opacities, and a standard button\n// takes the text button's colour since neither has a container.\n//\n// The sizes are the page's XS to XL at Button's five heights, so the two line\n// up in a row: a square of 32, 40, 56, 96 or 136dp holding an icon of 20, 24,\n// 24, 32 or 40dp. The two middle sizes share one icon, and the container\n// alone grows between them. The two smallest take presses over a 48dp target\n// through `hitSlop`, which is the page's floor for them.\n//\n// **A toggle is the same button reporting a state.** Given `isSelected`,\n// `defaultSelected` or `onChange` it takes the page's second pair of colour\n// roles for its variant: a filled toggle rests on surface container with an\n// on-surface-variant icon and takes primary once selected, a tonal one moves\n// from the secondary container pair to secondary, a standard one stays\n// transparent while its icon moves to primary, and an outlined one swaps its\n// rule for the inverse surface pair. So a selected filled toggle looks like a\n// plain filled button, and an unselected one does not.\n//\n// **A pending button keeps its place**, as Button's does: the icon is hidden\n// where it stands and an indeterminate ring is drawn over it, in the icon's\n// colour and at the icon's size, which is what web's `1em` reads there. The\n// button keeps its focus and its ring, reports itself busy and takes no\n// press until it clears, and src/button's pending.tsx says the change out\n// loud.\n//\n// **The corner morphs from a circle to a rounded square.** A press tightens\n// it to the size's pressed corner, 8dp for the two small sizes, 12dp at\n// `lg` and 16dp at the two large, and a selected toggle rests there, which is\n// the page's round-to-square morph. It eases as Button's does.\n//\n// The forms, the toggle's state, what a press does and the corner's ease are\n// src/button's, shared with Button.\n\ntype IconButtonProps = (ButtonLinkForm | ButtonPressForm | ButtonToggleForm) &\n  Omit<PressableProps, 'aria-label' | 'children' | 'disabled' | 'style'> & {\n    /**\n     * What the button does, in words. Required rather than optional: an icon\n     * on its own has no accessible name, so without this the control\n     * announces nothing at all.\n     */\n    readonly 'aria-label': string\n    /**\n     * The icon. The button hands it its colour and the page's icon size for\n     * the button's size through `useIconStyle()`.\n     */\n    readonly children?: ReactNode\n    /**\n     * Draws no press ripple. The state layer is unaffected.\n     * @default false\n     */\n    readonly disableRipple?: boolean\n    /**\n     * Draws the button disabled, and takes no presses.\n     * @default false\n     */\n    readonly isDisabled?: boolean\n    readonly ref?: Ref<ComponentRef<typeof View>>\n    /**\n     * Control size: `xs` 32dp, `md` 40dp, `lg` 56dp, `xl` 96dp, `xxl` 136dp,\n     * the icon buttons spec page's XS to XL, and the same heights `Button`\n     * uses, so the two line up beside each other in a row. The icon is 20dp,\n     * 24dp, 24dp, 32dp and 40dp in turn.\n     * @default 'md'\n     */\n    readonly size?: IconButtonSize\n    readonly style?: StyleProp<ViewStyle>\n    /**\n     * `standard` is transparent and tints what it sits on; `outlined` is\n     * transparent with a rule around it; `filled` and `tonal` carry a\n     * container of their own.\n     * @default 'standard'\n     */\n    readonly variant?: IconButtonVariant\n  }\n\ntype IconButtonSize = 'lg' | 'md' | 'xl' | 'xs' | 'xxl'\n\ntype IconButtonVariant = 'filled' | 'outlined' | 'standard' | 'tonal'\n\n// The disabled container each variant draws. Filled and tonal share the\n// page's one disabled container, and standard draws the text button's\n// colour, which is the icon alone.\nconst DISABLED: Readonly<Record<IconButtonVariant, PaletteName>> = {\n  filled: 'filledDisabled',\n  outlined: 'outlinedDisabled',\n  standard: 'textDisabled',\n  tonal: 'filledDisabled',\n}\n\n// The icon each size holds, from the page's size token sets. Literals, as on\n// web: they are icon sizes, which the theme has no scale for.\nconst ICON_SIZES: Readonly<Record<IconButtonSize, number>> = {\n  lg: 24,\n  md: 24,\n  xl: 32,\n  xs: 20,\n  xxl: 40,\n}\n\n// Which container a toggle draws, selected and not. An unselected outlined,\n// standard or tonal toggle is the plain button of that variant.\nconst TOGGLE_PALETTES: Readonly<\n  Record<\n    IconButtonVariant,\n    Readonly<Record<'selected' | 'unselected', PaletteName>>\n  >\n> = {\n  filled: { selected: 'filledToggleSelected', unselected: 'filledToggle' },\n  outlined: { selected: 'outlinedToggleSelected', unselected: 'outlined' },\n  standard: { selected: 'standardToggleSelected', unselected: 'standard' },\n  tonal: { selected: 'tonalToggleSelected', unselected: 'tonal' },\n}\n\nconst styles = StyleSheet.create({\n  // The icon sits in the middle of a square that a row never squeezes.\n  base: {\n    alignItems: 'center',\n    flexShrink: 0,\n    justifyContent: 'center',\n  },\n})\n\n// The outlined rule's width at each size, Button's.\nconst outlineWidths = StyleSheet.create({\n  lg: { borderWidth: OUTLINE_WIDTHS.lg },\n  md: { borderWidth: OUTLINE_WIDTHS.md },\n  xl: { borderWidth: OUTLINE_WIDTHS.xl },\n  xs: { borderWidth: OUTLINE_WIDTHS.xs },\n  xxl: { borderWidth: OUTLINE_WIDTHS.xxl },\n})\n\n// Square, so one control height sets both edges.\nconst sizesOf = themedStyles(({ sizing }) => {\n  function square(size: IconButtonSize): ViewStyle {\n    const edge = sizing[HEIGHTS[size]]\n\n    return { height: edge, width: edge }\n  }\n\n  return StyleSheet.create({\n    lg: square('lg'),\n    md: square('md'),\n    xl: square('xl'),\n    xs: square('xs'),\n    xxl: square('xxl'),\n  })\n})\n\n/**\n * A button that is an icon, at five control heights, with web's props and\n * values. Given `href` it is a link with the same appearance, and given\n * `isSelected`, `defaultSelected` or `onChange` it is a toggle, which reports\n * its state to a screen reader and draws the page's second pair of colour\n * roles for its variant. The three forms are exclusive, so a toggle given\n * `href` does not compile.\n *\n * ```tsx\n * <IconButton aria-label=\"Label\" defaultSelected variant=\"tonal\">\n *   <Icon />\n * </IconButton>\n * ```\n *\n * The two sizes under 48dp, `xs` and `md`, take presses over a 48dp target\n * through `hitSlop`, which a `hitSlop` of the call site's own replaces.\n * `style`, `ref` and `testID` land on the `Pressable`.\n */\nfunction IconButton({\n  children,\n  defaultSelected,\n  delayLongPress,\n  disableRipple = false,\n  hitSlop: ownHitSlop,\n  href,\n  isDisabled = false,\n  isPending = false,\n  isSelected,\n  onBlur,\n  onChange,\n  onFocus,\n  onHoverIn,\n  onHoverOut,\n  onLayout,\n  onLongPress,\n  onPress,\n  onPressIn,\n  onPressOut,\n  pendingLabel,\n  ref,\n  size = 'md',\n  slot,\n  style,\n  type,\n  variant = 'standard',\n  ...props\n}: IconButtonProps) {\n  const theme = useTheme()\n  // A link is never pending, as on web, where its props have no such state.\n  const pending = href === undefined && isPending\n  const ringLabel = usePending(pending, pendingLabel)\n\n  // The three props that make this a toggle, read as web reads them.\n  const isToggle =\n    defaultSelected !== undefined ||\n    isSelected !== undefined ||\n    onChange !== undefined\n  const action = useButtonAction({\n    defaultSelected,\n    href,\n    isSelected,\n    isToggle,\n    onChange,\n    onPress,\n    slot: slot ?? 'default',\n    type,\n  })\n  const {\n    onHoverIn: hoverIn,\n    onHoverOut: hoverOut,\n    onLongPress: longPress,\n    ...triggerProps\n  } = useSlotTrigger({\n    delayLongPress,\n    href,\n    onHoverIn,\n    onHoverOut,\n    onLongPress,\n    ref,\n    slot,\n  })\n  const colors =\n    palettesOf(theme)[\n      isDisabled\n        ? DISABLED[variant]\n        : isToggle\n          ? TOGGLE_PALETTES[variant][\n              action.selected ? 'selected' : 'unselected'\n            ]\n          : variant\n    ]\n\n  const feedback = usePressFeedback({\n    color: colors.content,\n    disabled: isDisabled,\n    disableRipple,\n    onBlur,\n    onFocus,\n    onHoverIn: hoverIn,\n    onHoverOut: hoverOut,\n    onPressIn,\n    onPressOut,\n    pending,\n  })\n\n  const { radii, sizing } = theme\n  const edge = sizing[HEIGHTS[size]]\n  const shaped = useCorner(\n    feedback.pressed || action.selected\n      ? radii[PRESSED_CORNERS[size]]\n      : radii.pill,\n    onLayout,\n  )\n\n  return (\n    <AnimatedPressable\n      role={href === undefined ? 'button' : 'link'}\n      {...(isToggle ? toggleState(action.selected) : undefined)}\n      {...(pending ? BUSY : undefined)}\n      {...props}\n      {...triggerProps}\n      {...feedback.handlers}\n      disabled={isDisabled}\n      hitSlop={ownHitSlop ?? hitSlop(edge, edge)}\n      onLayout={shaped.onLayout}\n      onLongPress={pending ? undefined : longPress}\n      onPress={pending ? undefined : action.onPress}\n      style={composeStyles<AnimatedStyle<ViewStyle>>(\n        styles.base,\n        sizesOf(theme)[size],\n        variant === 'outlined' ? outlineWidths[size] : undefined,\n        colors.container,\n        shaped.corner,\n        feedback.ring,\n        style,\n      )}\n    >\n      <Animated.View\n        style={composeStyles<AnimatedStyle<ViewStyle>>(\n          buttonStyles.clip,\n          shaped.corner,\n        )}\n      >\n        {feedback.layer}\n      </Animated.View>\n      <PendingContent isPending={pending}>\n        <IconStyleContext value={iconStyleOf(colors.content, size)}>\n          {children}\n        </IconStyleContext>\n      </PendingContent>\n      {pending ? (\n        <PendingRing\n          color={colors.content}\n          diameter={ICON_SIZES[size]}\n          label={ringLabel}\n        />\n      ) : null}\n    </AnimatedPressable>\n  )\n}\n\nfunction iconStyleOf(color: string, size: IconButtonSize): IconStyle {\n  return { color, size: ICON_SIZES[size] }\n}\n\nexport { IconButton }\nexport type { IconButtonProps, IconButtonSize, IconButtonVariant }\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["ComponentRef","ReactNode","Ref","PressableProps","StyleProp","View","ViewStyle","AnimatedStyle","use","StyleSheet","Animated","useSharedValue","ButtonLinkForm","ButtonPressForm","ButtonToggleForm","PaletteName","IconStyle","AnimatedPressable","buttonStyles","HEIGHTS","OUTLINE_WIDTHS","PRESSED_CORNERS","pressThen","toggleState","useButtonAction","useCorner","useSlotTrigger","ButtonGroupItemContext","groupCornersOf","groupPressHandlers","groupSelectionOf","groupStyles","groupWidthThen","useGroupShift","palettesOf","BUSY","PendingContent","PendingRing","usePending","IconStyleContext","hitSlop","TARGET_SIZE","usePressFeedback","useTheme","composeStyles","themedStyles","IconButtonProps","Omit","children","disableRipple","id","isDisabled","ref","size","IconButtonSize","style","variant","IconButtonVariant","DISABLED","Readonly","Record","filled","outlined","standard","tonal","ICON_SIZES","lg","md","xl","xs","xxl","TOGGLE_PALETTES","selected","unselected","styles","create","base","alignItems","flexShrink","justifyContent","outlineWidths","borderWidth","sizesOf","sizing","square","edge","height","width","IconButton","t0","$","_c","accessibilityHint","defaultSelected","delayLongPress","href","isSelected","onBlur","onChange","onFocus","onHoverIn","onHoverOut","onLayout","onLongPress","onPress","onPressIn","onPressOut","ownHitSlop","ownSize","pendingLabel","props","slot","t1","t2","t3","t4","type","isPending","undefined","ownDisabled","theme","group","membership","pending","ringLabel","isToggle","t5","t6","action","t7","t8","hoverIn","hoverOut","longPress","pressIn","pressOut","triggerProps","toggles","colors","feedback","color","content","disabled","radii","shaped","pressed","pill","shift","keepsTarget","T0","t9","t10","t11","accessibility","t12","t13","handlers","t14","Math","max","t15","t16","t17","toggle","t18","container","corner","target","ring","t19","clip","t20","layer","T1","T2","t21","iconStyleOf","t22","t23","t24","t25","_c"],"sources":["../../../src/components/icon-button/index.tsx"],"sourcesContent":["import type { ComponentRef, ReactNode, Ref } from 'react'\nimport type { PressableProps, StyleProp, View, ViewStyle } from 'react-native'\nimport type { AnimatedStyle } from 'react-native-reanimated'\n\nimport { use } from 'react'\nimport { StyleSheet } from 'react-native'\nimport Animated, { useSharedValue } from 'react-native-reanimated'\n\nimport type {\n  ButtonLinkForm,\n  ButtonPressForm,\n  ButtonToggleForm,\n} from '../../button'\nimport type { PaletteName } from '../../button/palettes'\nimport type { IconStyle } from '../../glyphs/icon-style'\n\nimport {\n  AnimatedPressable,\n  buttonStyles,\n  HEIGHTS,\n  OUTLINE_WIDTHS,\n  PRESSED_CORNERS,\n  pressThen,\n  toggleState,\n  useButtonAction,\n  useCorner,\n  useSlotTrigger,\n} from '../../button'\nimport {\n  ButtonGroupItemContext,\n  groupCornersOf,\n  groupPressHandlers,\n  groupSelectionOf,\n  groupStyles,\n  groupWidthThen,\n  useGroupShift,\n} from '../../button/group'\nimport { palettesOf } from '../../button/palettes'\nimport {\n  BUSY,\n  PendingContent,\n  PendingRing,\n  usePending,\n} from '../../button/pending'\nimport { IconStyleContext } from '../../glyphs/icon-style'\nimport { hitSlop, TARGET_SIZE, usePressFeedback } from '../../press'\nimport { useTheme } from '../../theme/scope'\nimport { composeStyles, themedStyles } from '../../theme/styles'\n\n// The icon buttons spec page's four styles at its five sizes, as kanso-ui's\n// IconButton draws them: Button's chrome around a single icon. The pairs are\n// the page's: filled on primary, tonal on secondary container, outlined with\n// an outline-variant rule and an on-surface-variant icon, and standard,\n// transparent, with the same icon over whatever it sits on. Disabled is\n// Button's, on-surface at the two disabled opacities, and a standard button\n// takes the text button's colour since neither has a container.\n//\n// The sizes are the page's XS to XL at Button's five heights, so the two line\n// up in a row: a square of 32, 40, 56, 96 or 136dp holding an icon of 20, 24,\n// 24, 32 or 40dp. The two middle sizes share one icon, and the container\n// alone grows between them. The two smallest take presses over a 48dp target\n// through `hitSlop`, which is the page's floor for them.\n//\n// **A toggle is the same button reporting a state.** Given `isSelected`,\n// `defaultSelected` or `onChange` it takes the page's second pair of colour\n// roles for its variant: a filled toggle rests on surface container with an\n// on-surface-variant icon and takes primary once selected, a tonal one moves\n// from the secondary container pair to secondary, a standard one stays\n// transparent while its icon moves to primary, and an outlined one swaps its\n// rule for the inverse surface pair. So a selected filled toggle looks like a\n// plain filled button, and an unselected one does not.\n//\n// **A pending button keeps its place**, as Button's does: the icon is hidden\n// where it stands and an indeterminate ring is drawn over it, in the icon's\n// colour and at the icon's size, which is what web's `1em` reads there. The\n// button keeps its focus and its ring, reports itself busy and takes no\n// press until it clears, and src/button's pending.tsx says the change out\n// loud.\n//\n// **The corner morphs from a circle to a rounded square.** A press tightens\n// it to the size's pressed corner, 8dp for the two small sizes, 12dp at\n// `lg` and 16dp at the two large, and a selected toggle rests there, which is\n// the page's round-to-square morph. It eases as Button's does.\n//\n// **A ButtonGroup around it hands it what the group decides**, as it does a\n// Button, through src/button's group.ts: its size, whether it is disabled, a\n// connected group's corners, and a standard group's widening while it or a\n// neighbour is pressed, which the button takes as width. In a group that\n// selects it is a toggle of the group's, by its `id`.\n//\n// The forms, the toggle's state, what a press does and the corner's ease are\n// src/button's, shared with Button.\n\ntype IconButtonProps = (ButtonLinkForm | ButtonPressForm | ButtonToggleForm) &\n  Omit<PressableProps, 'aria-label' | 'children' | 'disabled' | 'style'> & {\n    /**\n     * What the button does, in words. Required rather than optional: an icon\n     * on its own has no accessible name, so without this the control\n     * announces nothing at all.\n     */\n    readonly 'aria-label': string\n    /**\n     * The icon. The button hands it its colour and the page's icon size for\n     * the button's size through `useIconStyle()`.\n     */\n    readonly children?: ReactNode\n    /**\n     * Draws no press ripple. The state layer is unaffected.\n     * @default false\n     */\n    readonly disableRipple?: boolean\n    /** The key a ButtonGroup that selects reports the button by. */\n    readonly id?: string\n    /**\n     * Draws the button disabled, and takes no presses.\n     * @default false\n     */\n    readonly isDisabled?: boolean\n    readonly ref?: Ref<ComponentRef<typeof View>>\n    /**\n     * Control size: `xs` 32dp, `md` 40dp, `lg` 56dp, `xl` 96dp, `xxl` 136dp,\n     * the icon buttons spec page's XS to XL, and the same heights `Button`\n     * uses, so the two line up beside each other in a row. The icon is 20dp,\n     * 24dp, 24dp, 32dp and 40dp in turn.\n     * @default the size of the ButtonGroup around it, else 'md'\n     */\n    readonly size?: IconButtonSize\n    readonly style?: StyleProp<ViewStyle>\n    /**\n     * `standard` is transparent and tints what it sits on; `outlined` is\n     * transparent with a rule around it; `filled` and `tonal` carry a\n     * container of their own.\n     * @default 'standard'\n     */\n    readonly variant?: IconButtonVariant\n  }\n\ntype IconButtonSize = 'lg' | 'md' | 'xl' | 'xs' | 'xxl'\n\ntype IconButtonVariant = 'filled' | 'outlined' | 'standard' | 'tonal'\n\n// The disabled container each variant draws. Filled and tonal share the\n// page's one disabled container, and standard draws the text button's\n// colour, which is the icon alone.\nconst DISABLED: Readonly<Record<IconButtonVariant, PaletteName>> = {\n  filled: 'filledDisabled',\n  outlined: 'outlinedDisabled',\n  standard: 'textDisabled',\n  tonal: 'filledDisabled',\n}\n\n// The icon each size holds, from the page's size token sets. Literals, as on\n// web: they are icon sizes, which the theme has no scale for.\nconst ICON_SIZES: Readonly<Record<IconButtonSize, number>> = {\n  lg: 24,\n  md: 24,\n  xl: 32,\n  xs: 20,\n  xxl: 40,\n}\n\n// Which container a toggle draws, selected and not. An unselected outlined,\n// standard or tonal toggle is the plain button of that variant.\nconst TOGGLE_PALETTES: Readonly<\n  Record<\n    IconButtonVariant,\n    Readonly<Record<'selected' | 'unselected', PaletteName>>\n  >\n> = {\n  filled: { selected: 'filledToggleSelected', unselected: 'filledToggle' },\n  outlined: { selected: 'outlinedToggleSelected', unselected: 'outlined' },\n  standard: { selected: 'standardToggleSelected', unselected: 'standard' },\n  tonal: { selected: 'tonalToggleSelected', unselected: 'tonal' },\n}\n\nconst styles = StyleSheet.create({\n  // The icon sits in the middle of a square that a row never squeezes.\n  base: {\n    alignItems: 'center',\n    flexShrink: 0,\n    justifyContent: 'center',\n  },\n})\n\n// The outlined rule's width at each size, Button's.\nconst outlineWidths = StyleSheet.create({\n  lg: { borderWidth: OUTLINE_WIDTHS.lg },\n  md: { borderWidth: OUTLINE_WIDTHS.md },\n  xl: { borderWidth: OUTLINE_WIDTHS.xl },\n  xs: { borderWidth: OUTLINE_WIDTHS.xs },\n  xxl: { borderWidth: OUTLINE_WIDTHS.xxl },\n})\n\n// Square, so one control height sets both edges.\nconst sizesOf = themedStyles(({ sizing }) => {\n  function square(size: IconButtonSize): ViewStyle {\n    const edge = sizing[HEIGHTS[size]]\n\n    return { height: edge, width: edge }\n  }\n\n  return StyleSheet.create({\n    lg: square('lg'),\n    md: square('md'),\n    xl: square('xl'),\n    xs: square('xs'),\n    xxl: square('xxl'),\n  })\n})\n\n/**\n * A button that is an icon, at five control heights, with web's props and\n * values. Given `href` it is a link with the same appearance, and given\n * `isSelected`, `defaultSelected` or `onChange` it is a toggle, which reports\n * its state to a screen reader and draws the page's second pair of colour\n * roles for its variant. The three forms are exclusive, so a toggle given\n * `href` does not compile.\n *\n * ```tsx\n * <IconButton aria-label=\"Label\" defaultSelected variant=\"tonal\">\n *   <Icon />\n * </IconButton>\n * ```\n *\n * The two sizes under 48dp, `xs` and `md`, take presses over a 48dp target\n * through `hitSlop`, which a `hitSlop` of the call site's own replaces.\n * `style`, `ref` and `testID` land on the `Pressable`.\n */\nfunction IconButton({\n  accessibilityHint,\n  children,\n  defaultSelected,\n  delayLongPress,\n  disableRipple = false,\n  hitSlop: ownHitSlop,\n  href,\n  id,\n  isDisabled: ownDisabled = false,\n  isPending = false,\n  isSelected,\n  onBlur,\n  onChange,\n  onFocus,\n  onHoverIn,\n  onHoverOut,\n  onLayout,\n  onLongPress,\n  onPress,\n  onPressIn,\n  onPressOut,\n  pendingLabel,\n  ref,\n  size: ownSize,\n  slot,\n  style,\n  type,\n  variant = 'standard',\n  ...props\n}: IconButtonProps) {\n  const theme = useTheme()\n  // A ButtonGroup around the button hands it a size, which one named here\n  // still beats, and its part in the group; src/button's group.ts sets it out.\n  const group = use(ButtonGroupItemContext)\n  const size = ownSize ?? group?.size ?? 'md'\n  const isDisabled = ownDisabled || group?.isDisabled === true\n  const membership = groupSelectionOf(group, id)\n  // A link is never pending, as on web, where its props have no such state.\n  const pending = href === undefined && isPending\n  const ringLabel = usePending(pending, pendingLabel)\n\n  // The three props that make this a toggle, read as web reads them. A group\n  // that selects keeps the selection itself, so they mean nothing there.\n  const isToggle =\n    membership === undefined &&\n    (defaultSelected !== undefined ||\n      isSelected !== undefined ||\n      onChange !== undefined)\n  const action = useButtonAction({\n    defaultSelected,\n    href,\n    isSelected,\n    isToggle,\n    onChange,\n    onPress,\n    slot: slot ?? 'default',\n    type,\n  })\n  const {\n    onHoverIn: hoverIn,\n    onHoverOut: hoverOut,\n    onLongPress: longPress,\n    onPressIn: pressIn,\n    onPressOut: pressOut,\n    ...triggerProps\n  } = useSlotTrigger({\n    accessibilityHint,\n    delayLongPress,\n    href,\n    onHoverIn,\n    onHoverOut,\n    onLongPress,\n    onPressIn,\n    onPressOut,\n    ref,\n    slot,\n  })\n  const toggles = isToggle || membership !== undefined\n  const selected = membership?.selected ?? action.selected\n  const colors =\n    palettesOf(theme)[\n      isDisabled\n        ? DISABLED[variant]\n        : toggles\n          ? TOGGLE_PALETTES[variant][selected ? 'selected' : 'unselected']\n          : variant\n    ]\n\n  // The width a standard group widens the button from, recorded as it is\n  // laid out, before the press feedback that tells the group of a press.\n  const width = useSharedValue(0)\n  const feedback = usePressFeedback({\n    color: colors.content,\n    disabled: isDisabled,\n    disableRipple,\n    onBlur,\n    onFocus,\n    onHoverIn: hoverIn,\n    onHoverOut: hoverOut,\n    ...groupPressHandlers(group, width, pressIn, pressOut),\n    pending,\n  })\n\n  const { radii, sizing } = theme\n  const edge = sizing[HEIGHTS[size]]\n  const shaped = useCorner(\n    groupCornersOf(group, feedback, selected) ??\n      (feedback.pressed || selected\n        ? radii[PRESSED_CORNERS[size]]\n        : radii.pill),\n    groupWidthThen(group, width, onLayout),\n  )\n  const shift = useGroupShift(group, edge, 'width')\n  // A connected group's two smallest sizes are 48dp wide, which leaves the\n  // target nothing to add across.\n  const keepsTarget = group?.keepsTarget === true\n\n  return (\n    <AnimatedPressable\n      id={id}\n      role={href === undefined ? 'button' : 'link'}\n      {...(isToggle ? toggleState(action.selected) : undefined)}\n      {...membership?.accessibility}\n      {...(pending ? BUSY : undefined)}\n      {...props}\n      {...triggerProps}\n      {...feedback.handlers}\n      disabled={isDisabled}\n      hitSlop={\n        ownHitSlop ??\n        hitSlop(edge, keepsTarget ? Math.max(edge, TARGET_SIZE) : edge)\n      }\n      onLayout={shaped.onLayout}\n      onLongPress={pending ? undefined : longPress}\n      onPress={\n        pending\n          ? undefined\n          : membership === undefined\n            ? action.onPress\n            : pressThen(action.onPress, membership.toggle)\n      }\n      style={composeStyles<AnimatedStyle<ViewStyle>>(\n        styles.base,\n        sizesOf(theme)[size],\n        variant === 'outlined' ? outlineWidths[size] : undefined,\n        colors.container,\n        shaped.corner,\n        shift,\n        keepsTarget ? groupStyles.target : undefined,\n        feedback.ring,\n        style,\n      )}\n    >\n      <Animated.View\n        style={composeStyles<AnimatedStyle<ViewStyle>>(\n          buttonStyles.clip,\n          shaped.corner,\n        )}\n      >\n        {feedback.layer}\n      </Animated.View>\n      <PendingContent isPending={pending}>\n        <IconStyleContext value={iconStyleOf(colors.content, size)}>\n          {children}\n        </IconStyleContext>\n      </PendingContent>\n      {pending ? (\n        <PendingRing\n          color={colors.content}\n          diameter={ICON_SIZES[size]}\n          label={ringLabel}\n        />\n      ) : null}\n    </AnimatedPressable>\n  )\n}\n\nfunction iconStyleOf(color: string, size: IconButtonSize): IconStyle {\n  return { color, size: ICON_SIZES[size] }\n}\n\nexport { IconButton }\nexport type { IconButtonProps, IconButtonSize, IconButtonVariant }\n"],"mappings":"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"}