/// <reference types="react" />
import { ButtonAppearanceType, DropdownContent } from '@c-fo/vibes';
import { ApiSearchParams } from '../../templates/IndexPage/types';
import { IndexPageRenderCustomModalType } from '../../templates/IndexPage/types/customModal';
import { MessageContentType } from '../../types';
export type IndexHeaderOperationType<P extends ApiSearchParams> = {
    mainActions?: {
        type?: 'selectable';
        /**
         * ラベル
         */
        label: string;
        /**
         * 項目選択時の処理
         */
        onClick?: (props: {
            /**
             * @deprecated onClick 関数内で独自にリソースを再取得する関数を呼び出してください。
             * IndexResourceContainerを利用している場合は、 children の props にある refetchResources を利用してください。
             */
            refetchResources?: () => Promise<void>;
            /**
             * @deprecated IndexPageContainer の onChangeSearchParams をもとにして、プロダクト側で状態を参照できないか検討してください
             */
            searchQuery?: P;
            /**
             * @deprecated プロダクト側で状態管理を行う方法を検討してください
             */
            setSearchQuery?: (params: Partial<P>) => void;
        }) => void;
        /**
         * 項目選択時の遷移先URL
         */
        url?: string;
        /**
         * 項目選択時の遷移を別タブで行う
         * urlと合わせて指定する
         */
        targetBlank?: boolean;
        /**
         * クライアントルーティングをしている場合（SPAな遷移をする場合）に指定します
         * default: true
         */
        selfWindowNavigation?: boolean;
        /**
         * 項目を非活性にします
         */
        disabled?: boolean;
        /**
         * メニューを選択したときにカスタムモーダルを表示する場合に指定します
         * @deprecated カスタムモーダルの表示制御は、 onClick プロパティをきっかけに、プロダクト側で行なってください
         */
        renderCustomModal?: IndexPageRenderCustomModalType;
        /**
         * ボタンの見た目を指定します
         */
        appearance?: ButtonAppearanceType;
        /**
         * 動作に危険性が伴う場合に指定します
         */
        danger?: boolean;
        /**
         * アイコンとして表示するコンポーネントを指定します
         */
        IconComponent?: React.ComponentType;
    }[];
    subActions?: ({
        type?: 'selectable';
        /**
         * ラベル
         */
        label: string;
        /**
         * 項目選択時の処理
         */
        onClick?: (props: {
            /**
             * @deprecated onClick 関数内で独自にリソースを再取得する関数を呼び出してください。
             * IndexResourceContainerを利用している場合は、 children の props にある refetchResources を利用してください。
             */
            refetchResources?: () => Promise<void>;
            /**
             * @deprecated IndexPageContainer の onChangeSearchParams をもとにして、プロダクト側で状態を参照できないか検討してください
             */
            searchQuery?: P;
            /**
             * @deprecated プロダクト側で状態管理を行う方法を検討してください
             */
            setSearchQuery?: (params: Partial<P>) => void;
        }) => void;
        /**
         * 項目選択時の遷移先URL
         */
        url?: string;
        /**
         * 項目選択時の遷移を別タブで行う
         * urlと合わせて指定する
         */
        targetBlank?: boolean;
        /**
         * クライアントルーティングをしている場合（SPAな遷移をする場合）に指定します
         * default: true
         */
        selfWindowNavigation?: boolean;
        /**
         * 項目を非活性にします
         */
        disabled?: boolean;
        /**
         * メニューを選択したときにカスタムモーダルを表示する場合に指定します
         * @deprecated カスタムモーダルの表示制御は、 onClick プロパティをきっかけに、プロダクト側で行なってください
         */
        renderCustomModal?: IndexPageRenderCustomModalType;
    } | {
        /**
         * 項目間の区切り線を表示します
         */
        type: 'rule';
    })[];
};
type ScopeSelectorDropdownContent<T> = T extends {
    type: 'selectable';
} ? Omit<T, 'onClick'> : T;
export type IndexHeaderAreaScopeSelectorDropdownType<P extends ApiSearchParams> = {
    type: 'dropdown';
    label: string;
    dropdownContents: ({
        onClick?: (props: {
            /**
             * @deprecated onClick 関数内で独自にリソースを再取得する関数を呼び出してください。
             * IndexResourceContainerを利用している場合は、 children の props にある refetchResources を利用してください。
             */
            refetchResources: () => Promise<void>;
            /**
             * @deprecated IndexPageContainer の onChangeSearchParams をもとにして、プロダクト側で状態を参照できないか検討してください
             */
            searchQuery: P;
            /**
             * @deprecated プロダクト側で状態管理を行う方法を検討してください
             */
            setSearchQuery: (params: Partial<P>) => void;
        }) => void;
    } & ScopeSelectorDropdownContent<DropdownContent>)[];
};
export type IndexHeaderAreaScopeSelectorPeriodType = {
    /**
     * 特定の日付だけを選択可能なカレンダーパターンを利用する
     */
    type: 'period';
    /**
     * 日付の表示
     * 'monthly': 月単位で固定
     * 'daily': 日単位で固定
     * 'both': 月日単位をユーザーが切り替え可能（初期値は月単位）
     */
    displayMode?: 'monthly' | 'daily' | 'both';
    /**
     * 選択年月日のプリセット一覧
     * 日付は yyyy/MM もしくは yyyy/MM/dd 形式で指定してください
     */
    shortcuts?: {
        key: string;
        label: string;
        date: string;
    }[];
    /**
     * 設定可能な日付の最小値
     * 日付は yyyy/MM もしくは yyyy/MM/dd 形式で指定してください
     */
    minDate?: string;
    /**
     * 設定可能な日付の最大値
     * 日付は yyyy/MM もしくは yyyy/MM/dd 形式で指定してください
     */
    maxDate?: string;
    /**
     * 日次の場合に反映されるクエリパラメーター
     * default: 'selected_date'
     * パラメーターの値は以下のフォーマットになります
     * ?selected_date=yyyy_MM_dd or yyyy_MM
     *
     * URLSearchParamsの制御を無効化する場合は、ListControlAreaコンポーネントの disableQueryManipulation を true に設定してください
     */
    queryKey?: string;
    /**
     * ショートカットの選択時に反映されるクエリパラメーター
     * default: period_shortcut
     *
     * URLSearchParamsの制御を無効化する場合は、ListControlAreaコンポーネントの disableQueryManipulation を true に設定してください
     */
    shortcutQueryKey?: string;
    /**
     * 表示モードの切り替えに反映されるクエリパラメーター
     * displayMode: 'both' の場合のみ、startQueryKey/endQueryKeyに加えて、現在の表示モードをURLに反映します
     * URLクエリパラメーターの値は必ず 'monthly' or 'daily' になります
     * default: 'period_mode'
     *
     * URLSearchParamsの制御を無効化する場合は、ListControlAreaコンポーネントの disableQueryManipulation を true に設定してください
     */
    displayModeQueryKey?: string;
    /**
     * クエリパラメーターの値が未設定の場合のデフォルト値
     * 日付は yyyy/MM もしくは yyyy/MM/dd 形式で指定してください
     * default: 今日の日付をyyyy/MM/dd 形式で指定したもの（例：2025/03/06）
     */
    defaultValue?: string;
};
export type IndexHeaderAreaScopeSelectorPeriodRangeType = {
    /**
     * 日付を期間で選択可能なカレンダーパターンを利用する
     */
    type: 'periodRange';
    /**
     * 日付の表示
     * 'monthly': 月単位で固定
     * 'daily': 日単位で固定
     * 'both': 月日単位をユーザーが切り替え可能（初期値は月単位）
     */
    displayMode?: 'monthly' | 'daily' | 'both';
    /**
     * 選択年月日のプリセット一覧
     * 日付は yyyy/MM もしくは yyyy/MM/dd 形式で指定してください
     */
    shortcuts?: {
        key: string;
        label: string;
        date: {
            start: string;
            end?: string;
        } | {
            start?: string;
            end: string;
        };
    }[];
    /**
     * 設定可能な日付の最小値
     * 日付は yyyy/MM もしくは yyyy/MM/dd 形式で指定してください
     */
    minDate?: string;
    /**
     * 設定可能な日付の最大値
     * 日付は yyyy/MM もしくは yyyy/MM/dd 形式で指定してください
     */
    maxDate?: string;
    /**
     * 日次の場合に反映される開始日のクエリパラメーター
     * default: 'start_date'
     * パラメーターの値は以下のフォーマットになります
     * ?start_date=yyyy_MM_dd or yyyy_MM
     *
     * URLSearchParamsの制御を無効化する場合は、ListControlAreaコンポーネントの disableQueryManipulation を true に設定してください
     */
    startQueryKey?: string;
    /**
     * 日次の場合に反映される終了日のクエリパラメーター
     * default: 'end_month'
     * パラメーターの値は以下のフォーマットになります
     * ?end_date=yyyy_MM_dd or yyyy_MM
     *
     * URLSearchParamsの制御を無効化する場合は、ListControlAreaコンポーネントの disableQueryManipulation を true に設定してください
     */
    endQueryKey?: string;
    /**
     * ショートカットの選択時に反映されるクエリパラメーター
     * default: period_shortcut
     *
     * URLSearchParamsの制御を無効化する場合は、ListControlAreaコンポーネントの disableQueryManipulation を true に設定してください
     */
    shortcutQueryKey?: string;
    /**
     * 表示モードの切り替えに反映されるクエリパラメーター
     * displayMode: 'both' の場合のみ、startQueryKey/endQueryKeyに加えて、現在の表示モードをURLに反映します
     * URLクエリパラメーターの値は必ず 'monthly' or 'daily' になります
     * default: 'display_mode'
     *
     * URLSearchParamsの制御を無効化する場合は、ListControlAreaコンポーネントの disableQueryManipulation を true に設定してください
     */
    displayModeQueryKey?: string;
    /**
     * クエリパラメーターの値が未設定の場合のデフォルト値
     * 日付は yyyy/MM もしくは yyyy/MM/dd 形式で指定してください
     * default: 今日の日付をyyyy/MM/dd 形式で指定したもの（例：2025/03/06）
     */
    defaultValue?: {
        start: string;
        end?: string;
    } | {
        start?: string;
        end: string;
    };
};
/**
 * @template P - API検索パラメータの型
 */
export type IndexHeaderAreaProps<P extends ApiSearchParams> = {
    /**
     * ページのタイトルを設定します
     * ヘッダー領域の左側に太字で表示されます
     * WARN: IndexPageTemplate における titleArea.label の値を設定してください
     */
    title?: string;
    /**
     * ページに関する説明文章を設定します
     * タイトルの横にヘルプアイコンとして表示され、クリックするとポップオーバーで説明が表示されます
     * 説明はMessageIconコンポーネントで表示されます
     */
    description?: MessageContentType[];
    /**
     * タイトルエリアに配置するメニュー（インポート・エクスポート・設定導線・ドメイン固有のアクション）を設定します
     * ヘッダー領域の右側に表示され、mainActionsは常に表示、subActionsはドロップダウンメニューとして表示されます
     * WARN: IndexPageTemplate での titleArea.operations と機能は同等ですが、型定義が変更されています
     */
    operations?: IndexHeaderOperationType<P>;
    /**
     * 一覧画面が何らかのサブ画面の位置付けを持っている場合に、前のページに戻るためのボタンを表示します
     * タイトルの左側に戻るアイコンとして表示されます
     * react-router等を用いて遷移する場合は selfWindowNavigation を設定してください
     */
    prevPage?: {
        /**
         * 戻り先のURL
         */
        url: string;
        /**
         * クライアントルーティングをしている場合（SPAな遷移をする場合）に指定します
         * default: false
         */
        selfWindowNavigation?: boolean;
    };
    /**
     * ページに表示するオブジェクトのスコープを選択するナビゲーション
     * タイトルの下に表示され、データの範囲や期間を選択するためのUIを提供します
     *
     * 以下の3種類から選択できます：
     * - dropdown: ドロップダウンメニューによるカテゴリやステータスなどの選択
     * - period: 単一の日付や月の選択
     * - periodRange: 開始日〜終了日の範囲指定
     *
     * @experimental type: 'dropdown' 以外の設定は、今後のアップデート時に破壊的変更が入る可能性があります
     */
    scopeSelector?: IndexHeaderAreaScopeSelectorDropdownType<P> | IndexHeaderAreaScopeSelectorPeriodType | IndexHeaderAreaScopeSelectorPeriodRangeType;
};
export {};