+
+
+ {predefinedTips.map((tip) => (
+ {
+ setCustomTip(false)
+ onChange(tip)
+ }}
+ />
+ ))}
+ {
+ setCustomTip(true)
+ onChange(Math.max(0, Math.min(100, val)))
+ }}
+ type="number"
+ placeholder="Custom"
+ align="center"
+ pattern="[0-9]*"
+ min={0}
+ max={100}
+ step={1}
+ />
+
+
+ )
+}
+
+function TipButton({
+ value,
+ selected,
+ onClick,
+}: {
+ value: number
+ selected: boolean
+} & ButtonHTMLAttributes