ingred-ui 14.4.0 → 14.5.0

package/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2020-present, CARTA HOLDINGS, Inc.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/components/Calendar/Calendar/Calendar.d.ts

@@ -0,0 +1,56 @@
+import dayjs, { Dayjs } from "dayjs";
+import React from "react";
+import { Action } from "../internal/Actions";
+export type CalendarProps = React.HTMLAttributes<HTMLDivElement> & {
+    /**
+     * 日付
+     * @default dayjs()
+     */
+    date: Dayjs;
+    /**
+     * カレンダーの左に表示するアクション
+     */
+    actions?: Action[];
+    /**
+     * 閉じるボタンを押したときの振る舞い
+     * この関数が渡されてないときは、閉じるボタンが表示されない
+     */
+    onClickCloseButton?: () => void;
+    /**
+     * 選択可能なカレンダーの領域を制限する
+     * true が返る場合は、選択不可となる
+     * @default () => false
+     */
+    isOutsideRange?: (date: Dayjs) => boolean;
+    /**
+     * 日付が変更されたときに呼ばれる関数
+     */
+    onDateChange: (value: Dayjs) => void;
+};
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    /**
+     * 日付
+     * @default dayjs()
+     */
+    date: dayjs.Dayjs;
+    /**
+     * カレンダーの左に表示するアクション
+     */
+    actions?: Action[] | undefined;
+    /**
+     * 閉じるボタンを押したときの振る舞い
+     * この関数が渡されてないときは、閉じるボタンが表示されない
+     */
+    onClickCloseButton?: (() => void) | undefined;
+    /**
+     * 選択可能なカレンダーの領域を制限する
+     * true が返る場合は、選択不可となる
+     * @default () => false
+     */
+    isOutsideRange?: ((date: dayjs.Dayjs) => boolean) | undefined;
+    /**
+     * 日付が変更されたときに呼ばれる関数
+     */
+    onDateChange: (value: dayjs.Dayjs) => void;
+} & React.RefAttributes<HTMLDivElement>>>;
+export default _default;

package/dist/components/Calendar/Calendar/Calendar.stories.d.ts

@@ -0,0 +1,18 @@
+import React from "react";
+import { StoryObj } from "@storybook/react";
+import { CalendarProps } from "./Calendar";
+import dayjs from "dayjs";
+declare const _default: {
+    title: string;
+    components: React.MemoExoticComponent<React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+        date: dayjs.Dayjs;
+        actions?: import("../internal/Actions").Action[] | undefined;
+        onClickCloseButton?: (() => void) | undefined;
+        isOutsideRange?: ((date: dayjs.Dayjs) => boolean) | undefined;
+        onDateChange: (value: dayjs.Dayjs) => void;
+    } & React.RefAttributes<HTMLDivElement>>>;
+};
+export default _default;
+export declare const Default: StoryObj<CalendarProps>;
+export declare const WithActions: StoryObj<CalendarProps>;
+export declare const IsOutsideRange: StoryObj<CalendarProps>;

package/dist/components/Calendar/Calendar/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./Calendar";

package/dist/components/Calendar/Calendar/internal/Day/Day.d.ts

@@ -0,0 +1,11 @@
+import { Dayjs } from "dayjs";
+import { FC, ReactNode } from "react";
+type Props = {
+    selected: boolean;
+    selectable: boolean;
+    value: Dayjs;
+    onClickDate?: (newDate: Dayjs) => void;
+    children: ReactNode;
+};
+export declare const Day: FC<Props>;
+export {};

package/dist/components/Calendar/Calendar/internal/Day/index.d.ts

@@ -0,0 +1 @@
+export { Day } from "./Day";

package/dist/components/Calendar/Calendar/internal/Day/styled.d.ts

@@ -0,0 +1,6 @@
+export declare const DayContainer: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, {
+    selected?: boolean | undefined;
+}, never>;
+export declare const DisableDayContainer: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, {
+    selected?: boolean | undefined;
+}, never>;

package/dist/components/Calendar/CalendarRange/CalendarRange.d.ts

@@ -0,0 +1,117 @@
+import dayjs, { Dayjs } from "dayjs";
+import { DateRange } from "../..";
+import React from "react";
+import { Action } from "../internal/Actions";
+import { ClickStateType } from "./constants";
+export type CalendarRangeProps = React.HTMLAttributes<HTMLDivElement> & {
+    /**
+     * 開始日
+     * @default dayjs()
+     */
+    startDate: Dayjs;
+    /**
+     * 終了日
+     * @default dayjs()
+     */
+    endDate: Dayjs;
+    /**
+     * カレンダーの左に表示するアクション
+     */
+    actions?: Action[];
+    /**
+     * 親コンポーネントで calendar を任意のタイミングで閉じたい場合に使用する
+     */
+    onClose?: (clickState: ClickStateType) => void;
+    /**
+     * 閉じるボタンを押したときの振る舞い
+     * この関数が渡されてないときは、閉じるボタンが表示されない
+     */
+    onClickCloseButton?: () => void;
+    /**
+     * 選択可能なカレンダーの領域を制限する
+     * true が返る場合は、選択不可となる
+     * @default () => false
+     */
+    isOutsideRange?: (date: Dayjs) => boolean;
+    /**
+     * 日付が変更されたときに呼ばれる関数
+     */
+    onDatesChange: (dates: DateRange) => void;
+};
+/**
+ * CalendarRange
+ * Scrollable calendar UI.
+ * Currently, one year from the currently selected date is displayed.
+ */
+export declare const CalendarRange: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    /**
+     * 開始日
+     * @default dayjs()
+     */
+    startDate: Dayjs;
+    /**
+     * 終了日
+     * @default dayjs()
+     */
+    endDate: Dayjs;
+    /**
+     * カレンダーの左に表示するアクション
+     */
+    actions?: Action[] | undefined;
+    /**
+     * 親コンポーネントで calendar を任意のタイミングで閉じたい場合に使用する
+     */
+    onClose?: ((clickState: ClickStateType) => void) | undefined;
+    /**
+     * 閉じるボタンを押したときの振る舞い
+     * この関数が渡されてないときは、閉じるボタンが表示されない
+     */
+    onClickCloseButton?: (() => void) | undefined;
+    /**
+     * 選択可能なカレンダーの領域を制限する
+     * true が返る場合は、選択不可となる
+     * @default () => false
+     */
+    isOutsideRange?: ((date: Dayjs) => boolean) | undefined;
+    /**
+     * 日付が変更されたときに呼ばれる関数
+     */
+    onDatesChange: (dates: DateRange) => void;
+} & React.RefAttributes<HTMLDivElement>>;
+export type { DateRange };
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    /**
+     * 開始日
+     * @default dayjs()
+     */
+    startDate: dayjs.Dayjs;
+    /**
+     * 終了日
+     * @default dayjs()
+     */
+    endDate: dayjs.Dayjs;
+    /**
+     * カレンダーの左に表示するアクション
+     */
+    actions?: Action[] | undefined;
+    /**
+     * 親コンポーネントで calendar を任意のタイミングで閉じたい場合に使用する
+     */
+    onClose?: ((clickState: ClickStateType) => void) | undefined;
+    /**
+     * 閉じるボタンを押したときの振る舞い
+     * この関数が渡されてないときは、閉じるボタンが表示されない
+     */
+    onClickCloseButton?: (() => void) | undefined;
+    /**
+     * 選択可能なカレンダーの領域を制限する
+     * true が返る場合は、選択不可となる
+     * @default () => false
+     */
+    isOutsideRange?: ((date: dayjs.Dayjs) => boolean) | undefined;
+    /**
+     * 日付が変更されたときに呼ばれる関数
+     */
+    onDatesChange: (dates: DateRange) => void;
+} & React.RefAttributes<HTMLDivElement>>>;
+export default _default;

package/dist/components/Calendar/CalendarRange/CalendarRange.stories.d.ts

@@ -0,0 +1,20 @@
+import React from "react";
+import { StoryObj } from "@storybook/react";
+import { CalendarRangeProps } from "./CalendarRange";
+import dayjs from "dayjs";
+declare const _default: {
+    title: string;
+    components: React.MemoExoticComponent<React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+        startDate: dayjs.Dayjs;
+        endDate: dayjs.Dayjs;
+        actions?: import("../internal/Actions").Action[] | undefined;
+        onClose?: ((clickState: import("./constants").ClickStateType) => void) | undefined;
+        onClickCloseButton?: (() => void) | undefined;
+        isOutsideRange?: ((date: dayjs.Dayjs) => boolean) | undefined;
+        onDatesChange: (dates: import("./CalendarRange").DateRange) => void;
+    } & React.RefAttributes<HTMLDivElement>>>;
+};
+export default _default;
+export declare const Default: StoryObj<CalendarRangeProps>;
+export declare const WithActions: StoryObj<CalendarRangeProps>;
+export declare const IsOutsideRange: StoryObj<CalendarRangeProps>;

package/dist/components/Calendar/CalendarRange/constants.d.ts

@@ -0,0 +1,12 @@
+export declare const DayState: {
+    readonly NONE: "none";
+    readonly START: "start";
+    readonly END: "end";
+    readonly BETWEEN: "between";
+};
+export type DayStateType = (typeof DayState)[keyof typeof DayState];
+export declare const ClickState: {
+    readonly START: "start";
+    readonly END: "end";
+};
+export type ClickStateType = (typeof ClickState)[keyof typeof ClickState];

package/dist/components/Calendar/CalendarRange/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./CalendarRange";
+export type { CalendarRangeProps, DateRange } from "./CalendarRange";

package/dist/components/Calendar/CalendarRange/internal/Day/Day.d.ts

@@ -0,0 +1,12 @@
+import { Dayjs } from "dayjs";
+import { FC, ReactNode } from "react";
+import { DayStateType } from "../../constants";
+type Props = {
+    state: DayStateType;
+    value: Dayjs;
+    selectable: boolean;
+    onClickDate?: (value: Dayjs) => void;
+    children: ReactNode;
+};
+export declare const Day: FC<Props>;
+export {};

package/dist/components/Calendar/CalendarRange/internal/Day/index.d.ts

@@ -0,0 +1 @@
+export { Day } from "./Day";

package/dist/components/Calendar/CalendarRange/internal/Day/styled.d.ts

@@ -0,0 +1,5 @@
+export declare const DayStyle: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, {}, never>;
+export declare const DayStart: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, {}, never>;
+export declare const DayEnd: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, {}, never>;
+export declare const DayBetween: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, {}, never>;
+export declare const DisableDayContainer: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, {}, never>;

package/dist/components/Calendar/CalendarRange/utils.d.ts

@@ -0,0 +1,2 @@
+import { Dayjs } from "dayjs";
+export declare const getDayState: (startDate: Dayjs | null, endDate: Dayjs | null, month: Dayjs, day: number) => "none" | "end" | "start" | "between";

package/dist/components/Calendar/constants.d.ts

@@ -0,0 +1,9 @@
+export declare const HEIGHT = "400px";
+export declare const weekList: {
+    en: string[];
+    ja: string[];
+};
+export declare const monthList: {
+    en: string[];
+    ja: string[];
+};

package/dist/components/Calendar/hooks/__tests__/useScroll.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/Calendar/hooks/constants.d.ts

@@ -0,0 +1 @@
+export declare const MONTH_SIZE = 4;

package/dist/components/Calendar/hooks/useScroll.d.ts

@@ -0,0 +1,13 @@
+import { Dayjs } from "dayjs";
+export declare const getNextMonthList: (date: Dayjs) => Dayjs[];
+export declare const getPrevMonthList: (date: Dayjs) => Dayjs[];
+/**
+ * @memo カレンダーを選択中の月にするときに、アニメーション等があるといいかもしれない
+ *
+ * @param date 選択中の日付
+ * @param ref カレンダーの親要素のref、IntersectionObserverのrootに使う
+ * @return monthList 表示する月のリスト
+ */
+export declare const useScroll: (date: Dayjs, ref: React.RefObject<HTMLDivElement>) => {
+    monthList: Dayjs[];
+};

package/dist/components/Calendar/index.d.ts

@@ -0,0 +1,3 @@
+import Calendar from "./Calendar";
+import CalendarRange from "./CalendarRange";
+export { Calendar, CalendarRange };

package/dist/components/Calendar/internal/Actions/Actions.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { Action } from "./styled";
+export type Action = {
+    text: string;
+    onClick: () => void;
+};
+export declare const Actions: React.MemoExoticComponent<({ actions }: {
+    actions?: Action[] | undefined;
+}) => JSX.Element | null>;

package/dist/components/Calendar/internal/Actions/index.d.ts

@@ -0,0 +1,2 @@
+export { Actions } from "./Actions";
+export type { Action } from "./Actions";

package/dist/components/Calendar/internal/Actions/styled.d.ts

@@ -0,0 +1,4 @@
+export declare const Action: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, {
+    clicked: boolean;
+}, never>;
+export declare const ActionsContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;

package/dist/components/Calendar/styled.d.ts

@@ -0,0 +1,7 @@
+export declare const Container: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const ScrollContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const DatePickerContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, import("..").FlexProps, never>;
+export declare const CalendarContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, import("..").FlexProps, never>;
+export declare const DayStyle: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
+export declare const CalendarMonth: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const IconContainer: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, {}, never>;

package/dist/components/DataTable/DataTable.stories.d.ts

@@ -34,13 +34,13 @@ declare const _default: {
     };
 };
 export default _default;
-export declare const Overview: StoryObj<DataTableProps<typeof data[number], "id">>;
-export declare const WithVerticalLine: StoryObj<DataTableProps<typeof data[number], "id">>;
-export declare const WithPagination: StoryObj<DataTableProps<typeof data[number], "id">>;
-export declare const WithStickyHeader: StoryObj<DataTableProps<typeof data[number], "id">>;
-export declare const WithTabs: StoryObj<DataTableProps<typeof data[number], "id">>;
-export declare const WithSearch: StoryObj<DataTableProps<typeof data[number], "id">>;
-export declare const SelectableRows: StoryObj<DataTableProps<typeof data[number], "id">>;
-export declare const SelectableRow: StoryObj<DataTableProps<typeof data[number], "id">>;
-export declare const CustomCell: StoryObj<DataTableProps<typeof data[number], "id">>;
-export declare const WithEmptyTable: StoryObj<DataTableProps<typeof data[number], "id">>;
+export declare const Overview: StoryObj<DataTableProps<(typeof data)[number], "id">>;
+export declare const WithVerticalLine: StoryObj<DataTableProps<(typeof data)[number], "id">>;
+export declare const WithPagination: StoryObj<DataTableProps<(typeof data)[number], "id">>;
+export declare const WithStickyHeader: StoryObj<DataTableProps<(typeof data)[number], "id">>;
+export declare const WithTabs: StoryObj<DataTableProps<(typeof data)[number], "id">>;
+export declare const WithSearch: StoryObj<DataTableProps<(typeof data)[number], "id">>;
+export declare const SelectableRows: StoryObj<DataTableProps<(typeof data)[number], "id">>;
+export declare const SelectableRow: StoryObj<DataTableProps<(typeof data)[number], "id">>;
+export declare const CustomCell: StoryObj<DataTableProps<(typeof data)[number], "id">>;
+export declare const WithEmptyTable: StoryObj<DataTableProps<(typeof data)[number], "id">>;

package/dist/components/DateField/DateField/DateField.d.ts

@@ -0,0 +1,33 @@
+import React from "react";
+import { Dayjs } from "dayjs";
+export type DateFieldProps = {
+    /**
+     * 日付
+     * @default dayjs()
+     */
+    date: Dayjs;
+    /**
+     * 指定したい format
+     * @default YYYY-MM-DD
+     */
+    format?: string;
+    /**
+     * エラーメッセージのテキスト
+     */
+    errorText?: string;
+    /**
+     * 入力を無効にする
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * 日付が変更されたときに呼ばれる関数
+     */
+    onDateChange?: (date: Dayjs) => void;
+    /**
+     * カレンダーアイコンをクリックした時に呼ばれる関数
+     */
+    onClick: () => void;
+};
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<DateFieldProps & React.RefAttributes<HTMLInputElement>>>;
+export default _default;

package/dist/components/DateField/DateField/DateField.stories.d.ts

@@ -0,0 +1,13 @@
+import { StoryObj } from "@storybook/react";
+import { DateFieldProps } from "./DateField";
+import React from "react";
+declare const _default: {
+    title: string;
+    component: React.MemoExoticComponent<React.ForwardRefExoticComponent<DateFieldProps & React.RefAttributes<HTMLInputElement>>>;
+};
+export default _default;
+export declare const Example: StoryObj<DateFieldProps>;
+export declare const Custom: StoryObj<DateFieldProps>;
+export declare const Japanese: StoryObj<DateFieldProps>;
+export declare const Error: StoryObj<DateFieldProps>;
+export declare const Disable: StoryObj<DateFieldProps>;

package/dist/components/DateField/DateField/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./DateField";

package/dist/components/DateField/DateField/styled.d.ts

@@ -0,0 +1,5 @@
+export declare const InputContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
+    disabled: boolean;
+    error?: boolean | undefined;
+}, never>;
+export declare const CalendarIcon: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, {}, never>;

package/dist/components/DateField/DateRangeField/DateRangeField.d.ts

@@ -0,0 +1,33 @@
+import React from "react";
+import { DateRange } from "../..";
+export type DateRangeFieldProps = {
+    /**
+     * 日付
+     * @default { startDate: dayjs(), endDate: dayjs() }
+     */
+    date: DateRange;
+    /**
+     * 指定したい format
+     * @default YYYY-MM-DD
+     */
+    format?: string;
+    /**
+     * エラーメッセージのテキスト
+     */
+    errorText?: string;
+    /**
+     * 入力を無効にする
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * カレンダーアイコンをクリックした時に呼ばれる関数
+     */
+    onClickCalendarIcon?: () => void;
+    /**
+     * 日付が変更されたときに呼ばれる関数
+     */
+    onDatesChange?: (date: DateRange) => void;
+};
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<DateRangeFieldProps & React.RefAttributes<HTMLInputElement>>>;
+export default _default;

package/dist/components/DateField/DateRangeField/DateRangeField.stories.d.ts

@@ -0,0 +1,13 @@
+import { StoryObj } from "@storybook/react";
+import { DateRangeFieldProps } from "./DateRangeField";
+import React from "react";
+declare const _default: {
+    title: string;
+    component: React.MemoExoticComponent<React.ForwardRefExoticComponent<DateRangeFieldProps & React.RefAttributes<HTMLInputElement>>>;
+};
+export default _default;
+export declare const Example: StoryObj<DateRangeFieldProps>;
+export declare const Custom: StoryObj<DateRangeFieldProps>;
+export declare const Japanese: StoryObj<DateRangeFieldProps>;
+export declare const Error: StoryObj<DateRangeFieldProps>;
+export declare const Disable: StoryObj<DateRangeFieldProps>;

package/dist/components/DateField/DateRangeField/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./DateRangeField";

package/dist/components/DateField/DateRangeField/styled.d.ts

@@ -0,0 +1,5 @@
+export declare const InputContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
+    disabled: boolean;
+    error?: boolean | undefined;
+}, never>;
+export declare const CalendarIcon: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, {}, never>;

package/dist/components/DateField/__tests__/useDateField.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/DateField/__tests__/utils.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/DateField/constants.d.ts

@@ -0,0 +1,22 @@
+export declare const AllowedKeys: {
+    readonly Backspace: "Backspace";
+    readonly Delete: "Delete";
+    readonly ArrowLeft: "ArrowLeft";
+    readonly ArrowRight: "ArrowRight";
+    readonly ArrowUp: "ArrowUp";
+    readonly ArrowDown: "ArrowDown";
+    readonly Tab: "Tab";
+    readonly "0": "0";
+    readonly "1": "1";
+    readonly "2": "2";
+    readonly "3": "3";
+    readonly "4": "4";
+    readonly "5": "5";
+    readonly "6": "6";
+    readonly "7": "7";
+    readonly "8": "8";
+    readonly "9": "9";
+};
+export declare const numberKeys: string[];
+export declare const allowedKeys: ("0" | "1" | "4" | "2" | "3" | "5" | "7" | "6" | "Backspace" | "Delete" | "ArrowLeft" | "ArrowRight" | "ArrowUp" | "ArrowDown" | "Tab" | "8" | "9")[];
+export type AllowedKeys = (typeof AllowedKeys)[keyof typeof AllowedKeys];

package/dist/components/DateField/index.d.ts

@@ -0,0 +1,3 @@
+import DateField from "./DateField";
+import DateRangeField from "./DateRangeField";
+export { DateField, DateRangeField };

package/dist/components/DateField/plugin/index.d.ts

@@ -0,0 +1,3 @@
+export declare function makeParser(format: any): (input: any) => {};
+declare const _default: (o: any, C: any, d: any) => void;
+export default _default;

package/dist/components/DateField/types.d.ts

@@ -0,0 +1,9 @@
+import { DateFieldProps } from "./DateField/DateField";
+export type UseDateFieldProps = Omit<DateFieldProps, "onClick">;
+export type Sections = {
+    start: number;
+    end: number;
+    value: string;
+    editable: boolean;
+    type?: "year" | "month" | "day";
+};

package/dist/components/DateField/useDateField.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="react" />
+import { Dayjs } from "dayjs";
+type Props = {
+    date: Dayjs | null;
+    format?: string;
+    onDateChange?: (date: Dayjs) => void;
+};
+/**
+ * 指定された format で日付を表示・操作するための hooks
+ * 左右キーでセクション移動、上下キーで選択中のセクションの値を増減する
+ * 直接キーボード入力することもできる
+ *
+ */
+export declare const useDateField: ({ date, format, onDateChange, }: Props) => {
+    ref: import("react").RefObject<HTMLInputElement>;
+    value: string | undefined;
+    onFocus: () => void;
+    onBlur: () => void;
+    onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void;
+    onMouseDown: () => void;
+    onPaste: (event: React.ClipboardEvent<HTMLInputElement>) => void;
+};
+export {};

package/dist/components/DateField/utils.d.ts

@@ -0,0 +1,26 @@
+type Sections = {
+    start: number;
+    end: number;
+    value: string;
+    editable: boolean;
+};
+/**
+ * 何らかのフォーマットで入ってくる日付を開始位置と終了位置と値を持つセクションに分割する
+ * useDateField で format された日付操作を汎用的に行うために必要なプロパティを返す
+ * 例) 2023-01-02 -> [
+ *   { start: 0, end: 3, value: "2023", editable: true },
+ *   { start: 4, end: 4, value: "-", editable: false },
+ *   { start: 5, end: 6, value: "01", editable: true },
+ *   { start: 7, end: 7, value: "-", editable: false },
+ *   { start: 8, end: 9, value: "02", editable: true }
+ * ]
+ *
+ * @param formattedDate 何らかのフォーマットで入ってくる日付
+ * @returns 開始位置と終了位置と値を持つセクション
+ */
+export declare const getSections: (formattedDate?: string | null) => Sections[];
+/**
+ * 開始位置と終了位置と値を持つセクションをフォーマットされた日付に変換する
+ */
+export declare const formatString: (sectionsWithCharacter: Sections[]) => string;
+export {};

package/dist/components/DatePicker/DatePicker.d.ts

@@ -10,7 +10,7 @@ export type DatePickerProps = Partial<Omit<SingleDatePickerShape, "date" | "onFo
     localeData?: InstanceLocaleDataReturn;
     error?: boolean;
 };
-declare const DatePicker: React.ForwardRefExoticComponent<Partial<Omit<SingleDatePickerShape, "date" | "onFocusChange" | "onDateChange" | "renderMonthText">> & Omit<RenderMonthProps, "renderMonthText"> & {
+declare const DatePicker: React.ForwardRefExoticComponent<Partial<Omit<SingleDatePickerShape, "date" | "onDateChange" | "onFocusChange" | "renderMonthText">> & Omit<RenderMonthProps, "renderMonthText"> & {
     date: dayjs.Dayjs | null;
     onDateChange: (date: dayjs.Dayjs | null) => void;
     renderMonthText?: ((month: dayjs.Dayjs) => React.ReactNode) | null | undefined;