feat: action prop in Item component

Will run after Item selected.

BREAKING CHANGE: Picker will no longer close by default after you
select a day item, you need to set `action="close"` in Item component

src/components/datepicker/item/Item.stories.tsx

@@ -0,0 +1,44 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { Item } from './Item';
+
+// More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction
+const meta = {
+ title: 'Datepicker/Item',
+ component: Item,
+ tags: ['autodocs'],
+ argTypes: {
+ as: {
+ table: {
+ defaultValue: {
+ summary: 'div',
+ },
+ },
+ },
+ },
+ parameters: {
+ showDatepicker: true,
+ },
+} satisfies Meta<typeof Item>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const DateItem = {
+ parameters: {
+ override: {
+ item: `{item}`,
+ },
+ },
+ args: {
+ item: {
+ type: 'day',
+ disabled: false,
+ isSelected: false,
+ isHeader: false,
+ isToday: false,
+ key: 0,
+ text: '1',
+ value: new Date(),
+ },
+ },
+} satisfies Story;

src/components/datepicker/item/Item.tsx

@@ -8,6 +8,7 @@ import {
 import { Props } from '../../../type';
 import { forwardRef, render } from '../../../utils/render';
 import { PickerContext } from '../picker/Picker';
+import { ButtonProps } from '..';
 
 const DEFAULT_TAG = 'button';
 
@@ -19,12 +20,14 @@ export type ItemProps<
  ElemenElementTag,
  DatepickerSlot,
  typeof itemDataAttribute,
- { item: DateItemType | HourItemType }
+ {
+ item: DateItemType | HourItemType;
+ } & Partial<Pick<ButtonProps, 'action'>>
 >;
 
 export const Item = forwardRef(
  <ElemenElementTag extends ElementType>(
- { item, ...props }: ItemProps<ElemenElementTag>,
+ { item, action, ...props }: ItemProps<ElemenElementTag>,
  ref: Ref<HTMLElement>,
  ) => {
  const { id } = useContext(PickerContext);
@@ -39,7 +42,7 @@ export const Item = forwardRef(
  : () => {
  dispatch({
  type: 'select',
- payload: { item, pickerId: id },
+ payload: { item, pickerId: id, action },
  });
  },
  };