update types

src/ebay-segmented-buttons/__tests__/index.stories.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { Meta, StoryObj } from '@storybook/react'
 import { action } from '@storybook/addon-actions'
-import { EbaySegmentedButtons, SegmentedButtonsProps, EbaySegmentedButton as Button } from '..'
+import { EbaySegmentedButtons, EbaySegmentedButton as Button } from '..'
 import { EbayIcon } from '../../ebay-icon'
 
 export default {
@@ -31,7 +31,7 @@ export default {
     }
 } as Meta<typeof EbaySegmentedButtons>
 
-export const Default: StoryObj<SegmentedButtonsProps> = {
+export const Default: StoryObj<typeof EbaySegmentedButtons> = {
     render: args => (
         <EbaySegmentedButtons onChange={action('change')} {...args}>
             <Button selected value="quarter1">Q1</Button>
@@ -42,7 +42,7 @@ export const Default: StoryObj<SegmentedButtonsProps> = {
     )
 }
 
-export const WithIcons: StoryObj<SegmentedButtonsProps> = {
+export const WithIcons: StoryObj<typeof EbaySegmentedButtons> = {
     render: args => (
         <EbaySegmentedButtons onChange={action('change')} {...args}>
             <Button selected><EbayIcon name="fullView24"/> Desktop</Button>

src/ebay-segmented-buttons/button.tsx

@@ -7,7 +7,8 @@ import { SegmentedButtonProps } from './types'
 const SegmentedButton: FC<SegmentedButtonProps> = ({
     selected,
     children,
-    onClick
+    onClick,
+    ...rest
 }) => {
     const icon = findComponent(children, EbayIcon)
 
@@ -28,6 +29,7 @@ const SegmentedButton: FC<SegmentedButtonProps> = ({
                 className={classNames('segmented-buttons__button')}
                 aria-current={selected || undefined}
                 onClick={onClick}
+                {...rest}
             >
                 {icon ? iconWithText() : children}
             </button>

src/ebay-segmented-buttons/index.ts

@@ -1,3 +1,3 @@
 export { default as EbaySegmentedButtons } from './segmented-buttons'
 export { default as EbaySegmentedButton } from './button'
-export { SegmentedButtonsProps, SegmentedButtonProps } from './types'
+export type { SegmentedButtonsProps, SegmentedButtonProps, SegmentedButtonSize } from './types'

src/ebay-segmented-buttons/segmented-buttons.tsx

@@ -16,7 +16,7 @@ const EbaySegmentedButtons: FC<SegmentedButtonsProps> = ({
         buttons.findIndex(button => button.props.selected) || 0
     )
 
-    const handleClick = (e: React.MouseEvent<HTMLButtonElement>, index: number, value: string) => {
+    const handleClick = (e, index: number, value: string) => {
         setSelectedIndex(index)
         onChange(e, { index, value })
     }

src/ebay-segmented-buttons/types.ts

@@ -1,14 +1,15 @@
 import { ComponentProps } from 'react'
-import { EbayMouseEventHandler } from '../common/event-utils/types'
+import { EbayChangeEventHandler, EbayMouseEventHandler } from '../common/event-utils/types'
 
-export interface SegmentedButtonProps extends Omit<ComponentProps<'button'>, 'onClick'> {
+export type SegmentedButtonProps = Omit<ComponentProps<'button'>, 'onClick'> & {
     value?: string;
     selected?: boolean;
     onClick?: EbayMouseEventHandler<HTMLButtonElement>;
 }
 
-export interface SegmentedButtonsProps extends Omit<ComponentProps<'div'>, 'onChange'> {
-    buttons?: SegmentedButtonProps[];
-    size?: 'large' | 'regular';
-    onChange?: EbayMouseEventHandler<HTMLButtonElement, { index: number, value?: string }>;
+export type SegmentedButtonSize = 'large' | 'regular'
+
+export type SegmentedButtonsProps = Omit<ComponentProps<'div'>, 'onChange'> & {
+    size?: SegmentedButtonSize;
+    onChange?: EbayChangeEventHandler<HTMLButtonElement, { index: number, value?: string }>;
 }