@godxjp/ui 2.2.0 → 5.0.0

package/dist/components/composites.d.ts

@@ -0,0 +1,963 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as react from 'react';
+import { ReactNode, CSSProperties } from 'react';
+import { c as MiniMonthYMD, a as CalendarRef, e as SegmentedControlItem, C as CalendarEvent, T as TimeLocale, E as EventBlockVariant, P as PersonRef } from '../MiniMonth-YAmPGEpC.js';
+import { Table, ColumnPinningState, RowData } from '@tanstack/react-table';
+import { b as TableColumn, n as TableRowKey, e as TableDensity, q as TableSortState, g as TableExpandableConfig, t as TableTreeConfig, f as TableEditingConfig, k as TableGroupBy, w as TableViews, r as TableToolbar, T as TableBatchActionsConfig, i as TableFilterBar, h as TableFilter, l as TablePagination, d as TableColumnVisibility, v as TableViewSnapshot, u as TableViewItem, c as TableColumnPinningChange, j as TableFilterOption, s as TableToolbarConfig } from '../Table.types-BbsxoIYE.js';
+import { c as UseTableSelectionResult, a as UseTablePaginationResult, e as UseTableViewsResult } from '../useTableViews-D5NIAJ7h.js';
+import '../size-CQwNvOWd.js';
+import '../color-DO0qqUAb.js';
+
+type UploadStatus = "pending" | "uploading" | "success" | "error" | "removed";
+type UploadListType = "text" | "picture" | "picture-card";
+interface UploadFile {
+    /** Stable client-side identifier (used as React key). */
+    uid: string;
+    /** File name shown in the list. */
+    name: string;
+    /** Size in bytes. */
+    size: number;
+    /** MIME type. */
+    type: string;
+    /** Lifecycle phase. */
+    status: UploadStatus;
+    /** 0..100. */
+    percent: number;
+    /** Human-readable error from the upload transport. */
+    error?: string;
+    /** Final URL (or pre-existing URL for controlled mode). */
+    url?: string;
+    /** Local object URL used for thumbnails before upload completes. */
+    thumbUrl?: string;
+    /** The original `File` — only present until the upload resolves. */
+    originFile?: File;
+}
+interface UploadRequestParams {
+    file: File;
+    /** Push 0..100 progress to the list item. */
+    onProgress: (percent: number) => void;
+    /** Aborts when the user removes the item mid-upload. */
+    signal: AbortSignal;
+}
+/**
+ * Service supplies the transport. Resolve with `{ url }` to stamp
+ * the final URL on the list item; resolve with `void` to keep the
+ * client-side thumbUrl. Throw to surface an error.
+ */
+type UploadCustomRequest = (params: UploadRequestParams) => Promise<{
+    url?: string;
+} | void>;
+interface UploadLabels {
+    /** Default trigger CTA. */
+    dropHint: string;
+    /** Second-line hint under the dashed trigger. */
+    dropSubHint: string;
+    /** Picture-card "+ Upload". */
+    pictureCardHint: string;
+    /** Per-item remove button aria-label. */
+    remove: string;
+    /** Per-item retry button aria-label. */
+    retry: string;
+    /** Per-item preview button aria-label. */
+    preview: string;
+    /** Error: file type rejected. */
+    rejectedType: string;
+    /** Error: file too large (supports `{{mb}}` interpolation). */
+    rejectedTooLarge: string;
+    /** Error: too many files (supports `{{count}}` interpolation). */
+    rejectedTooMany: string;
+}
+interface UploadProps {
+    /** Allow selecting multiple files at once. */
+    multiple?: boolean;
+    /** MIME pattern passed to `<input accept=>`, e.g. `image/*`, `.pdf,.docx`. */
+    accept?: string;
+    /** Max bytes per file. Files larger are rejected before upload. */
+    maxSize?: number;
+    /** Max items in the list (ignored when `multiple=false`). */
+    maxCount?: number;
+    /** Hide the trigger + disable all actions. */
+    disabled?: boolean;
+    /** Visual variant of the file list. */
+    listType?: UploadListType;
+    /** Controlled mode — when supplied the composite never owns state. */
+    fileList?: UploadFile[];
+    /** Uncontrolled initial state. */
+    defaultFileList?: UploadFile[];
+    /** Synchronous or async gate run before queueing. Return false → skip. */
+    beforeUpload?: (file: File) => boolean | Promise<boolean>;
+    /** Service-supplied transport. */
+    customRequest: UploadCustomRequest;
+    /** Fires whenever the list mutates (controlled + uncontrolled). */
+    onChange?: (files: UploadFile[]) => void;
+    /** Fires before remove. Return false / reject to keep the item. */
+    onRemove?: (file: UploadFile) => boolean | Promise<boolean>;
+    /** Fires when the user taps the preview button. */
+    onPreview?: (file: UploadFile) => void;
+    /** Override label strings. */
+    labels?: Partial<UploadLabels>;
+    /** Map a thrown error to user copy. */
+    errorMapper?: (err: unknown) => string;
+    /** Replace the default dashed trigger area. */
+    trigger?: ReactNode;
+    /** Alias for `trigger` (composability with shadcn-style). */
+    children?: ReactNode;
+    /** Extra className on the outer wrapper. */
+    className?: string;
+}
+
+declare function Upload({ multiple, accept, maxSize, maxCount, disabled, listType, fileList, defaultFileList, beforeUpload, customRequest, onChange, onRemove, onPreview, labels: labelOverrides, errorMapper, trigger, children, className, }: UploadProps): react_jsx_runtime.JSX.Element;
+
+interface ImageUploadProps extends Omit<UploadProps, "listType" | "accept" | "customRequest"> {
+    /** MIME allowlist for images (default JPEG/PNG/WebP). */
+    allowedTypes?: string[];
+    /** Optional crop aspect — when set, every selected image runs through the cropper. */
+    aspect?: number;
+    /** Crop shape — `round` for avatars, `rect` for banners. Default `rect`. */
+    cropShape?: "round" | "rect";
+    /** Picture-card edge in px (default 96 — Ant's picture-card). */
+    thumbSize?: number;
+    /** Service transport — same shape as <Upload>'s customRequest. */
+    customRequest: UploadCustomRequest;
+    /** Localised cropper labels. */
+    cropLabels?: {
+        confirm: string;
+        cancel: string;
+        zoom: string;
+    };
+}
+declare function ImageUpload({ allowedTypes, aspect, cropShape, thumbSize: _thumbSize, customRequest, cropLabels: cropLabelOverrides, beforeUpload, ...rest }: ImageUploadProps): react_jsx_runtime.JSX.Element;
+
+interface AvatarUploaderLabels {
+    chooseImage: string;
+    upload: string;
+    cancel: string;
+    cancelUpload: string;
+    tryAgain: string;
+    uploadSuccess: string;
+    change: string;
+    rejectedType: string;
+    rejectedTooLarge: string;
+}
+interface AvatarUploadCallbackParams {
+    /** Selected source file (pre-crop). */
+    file: File;
+    /** Cropped image blob ready to ship. */
+    blob: Blob;
+    /** 0..100 progress callback. */
+    onProgress?: (pct: number) => void;
+    /** AbortController signal — fires when user cancels. */
+    signal: AbortSignal;
+}
+interface AvatarUploaderProps {
+    /** Required — service provides the actual upload + persistence. */
+    onUpload: (params: AvatarUploadCallbackParams) => Promise<void>;
+    /** Override file validation. Return `null` for OK, string for error message. */
+    validate?: (file: File) => string | null;
+    /** Allowed MIME types (default JPEG/PNG/WebP). */
+    allowedTypes?: string[];
+    /** Max file size in bytes (default 5 MiB). */
+    maxSize?: number;
+    /** Crop aspect ratio (default 1, square). */
+    aspect?: number;
+    /** Crop shape — "round" (default, fits avatar) or "rect". */
+    cropShape?: "round" | "rect";
+    /** Localised button + error strings. */
+    labels?: Partial<AvatarUploaderLabels>;
+    /** Map a thrown error to a user-friendly message. */
+    errorMapper?: (err: unknown) => string;
+    /** Hook fired on success after `onUpload` resolves. */
+    onSuccess?: () => void;
+    /** Hook fired when user picks cancel. */
+    onCancel?: () => void;
+    /** Render a custom "choose image" trigger instead of the default Button. */
+    trigger?: ReactNode;
+}
+declare function AvatarUploader({ onUpload, validate, allowedTypes, maxSize, aspect, cropShape, labels: labelOverrides, errorMapper, onSuccess, onCancel, trigger, }: AvatarUploaderProps): react_jsx_runtime.JSX.Element;
+
+interface MediaItem {
+    id: string;
+    filename: string;
+    contentType: string;
+    /** Signed view URL — fetchable directly as an <img src>. */
+    url: string;
+    thumbnailUrl?: string;
+    width?: number;
+    height?: number;
+    /** Size in bytes. */
+    size?: number;
+}
+
+type MediaUploadSize = "small" | "default" | "large";
+type MediaUploadShape = "square" | "circle" | "card";
+interface MediaUploadSingleProps {
+    /** Controlled — UUID OR full MediaItem; component fetches metadata if only id given. */
+    value?: string | MediaItem | null;
+    defaultValue?: string | MediaItem | null;
+    onValueChange?: (value: MediaItem | null) => void;
+    accept?: string;
+    /** Max file size in bytes. */
+    maxSize?: number;
+    disabled?: boolean;
+    /** Preview shape — square / circle / card. */
+    shape?: MediaUploadShape;
+    size?: MediaUploadSize;
+    className?: string;
+}
+declare function MediaUploadSingle({ value, defaultValue, onValueChange, accept, maxSize, disabled, shape, size, className, }: MediaUploadSingleProps): react_jsx_runtime.JSX.Element;
+interface MediaUploadMultipleProps {
+    value?: Array<string | MediaItem>;
+    defaultValue?: Array<string | MediaItem>;
+    onValueChange?: (value: MediaItem[]) => void;
+    accept?: string;
+    maxSize?: number;
+    maxCount?: number;
+    disabled?: boolean;
+    size?: MediaUploadSize;
+    className?: string;
+}
+declare function MediaUploadMultiple({ value, defaultValue, onValueChange, accept, maxSize, maxCount, disabled, size, className, }: MediaUploadMultipleProps): react_jsx_runtime.JSX.Element;
+interface MediaUploadAvatarProps {
+    value?: string | MediaItem | null;
+    defaultValue?: string | MediaItem | null;
+    onValueChange?: (value: MediaItem | null) => void;
+    /** Crop aspect ratio (default 1 = square). */
+    aspect?: number;
+    size?: MediaUploadSize;
+    disabled?: boolean;
+    className?: string;
+}
+declare function MediaUploadAvatar({ value, defaultValue, onValueChange, aspect, size, disabled, className, }: MediaUploadAvatarProps): react_jsx_runtime.JSX.Element;
+declare const MediaUpload: {
+    Single: typeof MediaUploadSingle;
+    Multiple: typeof MediaUploadMultiple;
+    Avatar: typeof MediaUploadAvatar;
+};
+
+/**
+ * LocaleInput — multilingual text field with a tab strip switcher.
+ *
+ * One field stores a value per locale. The base locale (first in the
+ * `locales` list, or `defaultLocale` if provided) is the fallback —
+ * when a translation is missing the base value is used at render time.
+ * Translation status is surfaced per-tab via a coloured dot:
+ *
+ *   - `filled` → success (green)
+ *   - `draft`  → warning (amber, e.g. stale relative to base)
+ *   - `empty`  → destructive (red, no translation yet)
+ *
+ * `statusByLocale` lets callers pass the dot state explicitly. If
+ * omitted, status is derived: empty string → `empty`, otherwise
+ * `filled`.
+ *
+ * @example
+ *   <LocaleInput
+ *     locales={["ja", "en", "vi"]}
+ *     baseLocale="ja"
+ *     values={{ ja: "特選 まぐろ握り 6貫盛り合わせ", en: "Tuna nigiri assortment (6 pcs)", vi: "" }}
+ *     onChange={(locale, value) => set(locale, value)}
+ *     placeholder="商品名"
+ *   />
+ *
+ * The visual contract maps to the canonical `.loc-tabs` + `.loc-panel`
+ * classes from the dxs-kintai design system (no service-specific
+ * locale lists baked into the source).
+ */
+type LocaleStatus = "filled" | "draft" | "empty";
+interface LocaleInputProps {
+    /** Ordered locale codes (BCP-47 or arbitrary string). First is base unless `baseLocale` is set. */
+    locales: string[];
+    /** Locale rendered initially. Defaults to the first locale. */
+    defaultLocale?: string;
+    /** Controlled active locale. Pair with `onLocaleChange`. */
+    activeLocale?: string;
+    /** Controlled active-locale change handler. */
+    onLocaleChange?: (locale: string) => void;
+    /** Fallback locale — labelled "(base)" in the tab. Defaults to `locales[0]`. */
+    baseLocale?: string;
+    /** Current values keyed by locale. */
+    values: Record<string, string>;
+    /** Fired when the user edits the value for the active locale. */
+    onChange?: (locale: string, value: string) => void;
+    /** Optional explicit status per locale dot. Derived from `values` when omitted. */
+    statusByLocale?: Record<string, LocaleStatus>;
+    /** Placeholder rendered in the input/textarea. */
+    placeholder?: string;
+    /** Render a `<textarea>` instead of `<input>`. */
+    multiline?: boolean;
+    /** Rows for the textarea (only when `multiline`). */
+    rows?: number;
+    /** Validation status applied to the visible input. */
+    status?: "default" | "error" | "warning";
+    /** Show a translation-progress meta string (e.g. "3 / 4 translated") in the tab strip. */
+    meta?: ReactNode;
+    /** Trailing tab-strip slot (e.g. an "+ Add locale" button). */
+    tabsExtra?: ReactNode;
+    /** Resolve a human label from a locale code; defaults to `locale.toUpperCase()`. */
+    resolveLocaleLabel?: (locale: string) => ReactNode;
+    /** Label shown next to the base locale tab. Defaults to "(base)". */
+    baseLabel?: ReactNode;
+    /** Max length for the input — surfaces a `.count` row when set. */
+    maxLength?: number;
+    /** Optional help text rendered under the active panel. */
+    help?: ReactNode;
+    /** Visual class for the help line (`info` | `warn` | `err` | `ok`). */
+    helpStatus?: "info" | "warn" | "err" | "ok";
+    /** Outer wrapper className. */
+    className?: string;
+    /** Outer wrapper style. */
+    style?: CSSProperties;
+    /** Input ID — useful when paired with a `<label htmlFor>`. */
+    id?: string;
+}
+declare const LocaleInput: react.ForwardRefExoticComponent<LocaleInputProps & react.RefAttributes<HTMLDivElement>>;
+/**
+ * LocaleRowInput — per-row locale form (canonical pattern ②).
+ *
+ * Renders every locale stacked vertically, each row showing the locale
+ * code + a translation-status dot on the left and the input on the
+ * right. Useful when reviewers want to see every translation at once.
+ */
+interface LocaleRowInputProps extends Omit<LocaleInputProps, "activeLocale" | "onLocaleChange" | "defaultLocale" | "tabsExtra" | "meta"> {
+    /** Per-locale row className. */
+    rowClassName?: string;
+}
+declare const LocaleRowInput: react.ForwardRefExoticComponent<LocaleRowInputProps & react.RefAttributes<HTMLDivElement>>;
+
+/**
+ * CalendarSidebar — left rail for the calendar screen:
+ *   1. "Create event" pill CTA
+ *   2. Mini-month with prev/next nav
+ *   3. People search field
+ *   4. Three grouped calendar lists (mine / org / shared)
+ *
+ * Generic: takes a flat list of `CalendarRef` and groups by `c.group`.
+ * Labels are caller-supplied so the sidebar is locale-agnostic.
+ */
+interface CalendarSidebarLabels {
+    createEvent: string;
+    searchPeople: string;
+    /** Section labels keyed by `CalendarRef.group`. */
+    sections: Record<string, string>;
+    /** Mini-month title (e.g. "5月 2026"). */
+    monthLabel: string;
+    /** Footer CTA label (e.g. "Add another calendar"). */
+    addCalendar?: string;
+}
+interface CalendarSidebarProps {
+    today: MiniMonthYMD;
+    selected: MiniMonthYMD;
+    /** Year + month for the mini-month grid. */
+    miniMonthYear: number;
+    miniMonthMonth: number;
+    calendars: CalendarRef[];
+    eventDots?: Record<string, boolean>;
+    labels: CalendarSidebarLabels;
+    /** Order of group keys to render. */
+    groupOrder?: string[];
+    onSelectDate?: (ymd: MiniMonthYMD) => void;
+    onToggleCalendar?: (id: string) => void;
+    onCreate?: () => void;
+    onPrevMonth?: () => void;
+    onNextMonth?: () => void;
+    onAddCalendar?: () => void;
+    /** Optional dow labels passed straight through to MiniMonth. */
+    miniMonthDows?: MiniMonthYMD extends infer _ ? readonly [string, string, string, string, string, string, string] : never;
+}
+declare function CalendarSidebar({ today, selected, miniMonthYear, miniMonthMonth, calendars, eventDots, labels, groupOrder, onSelectDate, onToggleCalendar, onCreate, onPrevMonth, onNextMonth, onAddCalendar, miniMonthDows, }: CalendarSidebarProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * CalendarTopbar — top rail for the calendar screen:
+ *   - product sticker + product name + tenant tag
+ *   - Today button + prev/next nav
+ *   - main title (date range / month / etc.)
+ *   - search field (cmd-K)
+ *   - bell + settings icon buttons
+ *   - view-switcher segmented control
+ *   - viewer avatar
+ *
+ * Generic — service identity strings are caller-supplied so the topbar
+ * stays product-agnostic.
+ */
+interface CalendarTopbarProps<V extends string = string> {
+    /** Sticker glyph (single character or short label). */
+    sticker: ReactNode;
+    productName: ReactNode;
+    /** Optional tenant chip (e.g. "Famgia"). */
+    tenant?: ReactNode;
+    titleMain: ReactNode;
+    titleSub?: ReactNode;
+    /** View-switcher options. */
+    views: SegmentedControlItem<V>[];
+    view: V;
+    onChangeView: (next: V) => void;
+    onToday?: () => void;
+    onPrev?: () => void;
+    onNext?: () => void;
+    todayLabel: string;
+    searchPlaceholder: string;
+    searchKbd?: string;
+    /** Viewer avatar — typically `<Avatar size={32}>` with initials. */
+    avatar?: ReactNode;
+    onSearchOpen?: () => void;
+    onNotificationsOpen?: () => void;
+    onSettingsOpen?: () => void;
+}
+declare function CalendarTopbar<V extends string = string>({ sticker, productName, tenant, titleMain, titleSub, views, view, onChangeView, onToday, onPrev, onNext, todayLabel, searchPlaceholder, searchKbd, avatar, onSearchOpen, onNotificationsOpen, onSettingsOpen, }: CalendarTopbarProps<V>): react_jsx_runtime.JSX.Element;
+
+/**
+ * WeekView — 7-column scrolling time grid with all-day band on top.
+ * Computes the Mon-Sun window around `selected` automatically; takes a
+ * flat list of `CalendarEvent` and filters them by visibility (`shown`)
+ * of their owning calendar.
+ *
+ * Service-agnostic: the consumer maps `event.type` + `event.status` to
+ * the EventBlock visual variant via `resolveVariant`.
+ */
+interface WeekViewYMD {
+    y: number;
+    m: number;
+    d: number;
+}
+interface WeekViewProps {
+    today: WeekViewYMD;
+    selected: WeekViewYMD;
+    events: CalendarEvent[];
+    calendars: CalendarRef[];
+    locale?: TimeLocale;
+    /** Currently selected event id (paints the accent ring). */
+    selectedEventId?: string | null;
+    onPickEvent?: (event: CalendarEvent) => void;
+    /** Override day-of-week labels. Defaults per locale. */
+    dowLabels?: readonly [string, string, string, string, string, string, string];
+    /** Map an event → EventBlock variant. Defaults: customer→solid, focus→focus, tentative→tentative, else tint. */
+    resolveVariant?: (event: CalendarEvent) => EventBlockVariant;
+    /** All-day label (defaults: locale-specific). */
+    allDayLabel?: string;
+    /** Timezone label (top-left corner). */
+    tzLabel?: string;
+    /** Now-line override (mostly for storybook determinism). */
+    nowOverride?: Date;
+}
+declare function WeekView({ today, selected, events, calendars, locale, selectedEventId, onPickEvent, dowLabels, resolveVariant, allDayLabel, tzLabel, nowOverride, }: WeekViewProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * MonthView — 6×7 month grid (Mon-first). Each cell shows up to 4
+ * events (overflow indicator below). All-day events render as solid
+ * color bars (`AllDayChip` size=month); timed events render as one-line
+ * `EventPill`s.
+ */
+interface MonthViewYMD {
+    y: number;
+    m: number;
+    d: number;
+}
+interface MonthViewProps {
+    today: MonthViewYMD;
+    selected: MonthViewYMD;
+    events: CalendarEvent[];
+    calendars: CalendarRef[];
+    locale?: TimeLocale;
+    onPickEvent?: (event: CalendarEvent) => void;
+    /** Max events shown per cell before overflow row. Default 4. */
+    maxEventsPerCell?: number;
+    /** Override day-of-week labels. */
+    dowLabels?: readonly [string, string, string, string, string, string, string];
+    /** Localise the "+N more" suffix. */
+    formatOverflow?: (n: number) => string;
+}
+declare function MonthView({ today, selected, events, calendars, locale, onPickEvent, maxEventsPerCell, dowLabels, formatOverflow, }: MonthViewProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * DayView — single-column time grid with a hero header showing the
+ * date number + day-of-week + Today badge + event count. All-day
+ * events render as pill chips across a strip beneath the hero.
+ */
+interface DayViewYMD {
+    y: number;
+    m: number;
+    d: number;
+}
+interface DayViewProps {
+    today: DayViewYMD;
+    selected: DayViewYMD;
+    events: CalendarEvent[];
+    calendars: CalendarRef[];
+    locale?: TimeLocale;
+    selectedEventId?: string | null;
+    onPickEvent?: (event: CalendarEvent) => void;
+    resolveVariant?: (event: CalendarEvent) => EventBlockVariant;
+    /** Override dow labels. */
+    dowLabels?: readonly [string, string, string, string, string, string, string];
+    /** "Today" badge text. */
+    todayLabel?: string;
+    /** Localise "(count) events" — receives count. */
+    formatEventCount?: (count: number) => string;
+    nowOverride?: Date;
+}
+declare function DayView({ today, selected, events, calendars, locale, selectedEventId, onPickEvent, resolveVariant, dowLabels, todayLabel, formatEventCount, nowOverride, }: DayViewProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * DayHeaderHero — page-header strip rendered above `DayView`: large
+ * day number + day-of-week + month/year + optional Today badge + event
+ * count summary. Visually distinct from the `DayHeaderPill` atom (which
+ * sits inside a week's column header).
+ */
+interface DayHeaderHeroProps {
+    day: number;
+    dow: string;
+    monthLabel: string;
+    isToday?: boolean;
+    todayLabel?: string;
+    eventCount?: number;
+    formatEventCount?: (n: number) => string;
+    className?: string;
+}
+declare function DayHeaderHero({ day, dow, monthLabel, isToday, todayLabel, eventCount, formatEventCount, className, }: DayHeaderHeroProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * AgendaView — date-grouped list of events for the next N days. Each
+ * group renders a 92px date gutter (dow + day number + month + NOW
+ * pill) | rail of event rows (time, title, location, avatar stack).
+ */
+interface AgendaViewYMD {
+    y: number;
+    m: number;
+    d: number;
+}
+interface AgendaViewProps {
+    today: AgendaViewYMD;
+    selected: AgendaViewYMD;
+    events: CalendarEvent[];
+    calendars: CalendarRef[];
+    /** People directory used to resolve attendee IDs to AvatarStack items. */
+    people: PersonRef[];
+    locale?: TimeLocale;
+    /** Number of days to render starting from the week's Monday. Default 14. */
+    days?: number;
+    onPickEvent?: (event: CalendarEvent) => void;
+    /** Localised "All day" label override. */
+    allDayLabel?: string;
+    todayBadge?: string;
+    dowLabels?: readonly [string, string, string, string, string, string, string];
+}
+declare function AgendaView({ today, selected, events, calendars, people, locale, days, onPickEvent, allDayLabel, todayBadge, dowLabels, }: AgendaViewProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * EventDetailPanel — 360px right-rail panel for an opened event.
+ *   Header  — color-dot + title + cal name + status + edit/delete/close
+ *   Body    — when / where / attendees / description / notifications rows
+ *   Footer  — RSVP 3-button row (Yes / Maybe / No)
+ *
+ * Generic: status labels + RSVP labels + "(you)" + section labels all
+ * caller-supplied so the panel stays locale-agnostic.
+ */
+interface EventDetailLabels {
+    joinMeeting?: string;
+    attendeesSummary: (count: number, accepted: number) => string;
+    addPerson: string;
+    rsvpQuestion: string;
+    rsvpYes: string;
+    rsvpMaybe: string;
+    rsvpNo: string;
+    selfLabel: string;
+    organizerLabel: string;
+    /** Date/time line for the When row, e.g. "Wed, May 20 · GMT+09". */
+    whenSubtitle: ReactNode;
+    /** "All day" / "Cả ngày" / "終日". */
+    allDay: string;
+    /** Status label per `event.status`. */
+    statusLabels: Record<string, string>;
+}
+interface EventDetailPanelProps {
+    event: CalendarEvent;
+    calendar?: CalendarRef;
+    people: PersonRef[];
+    labels: EventDetailLabels;
+    /** Description body content — JSX so callers can use markdown / lists. */
+    description?: ReactNode;
+    /** Notifications list. */
+    notifications?: ReactNode;
+    onClose?: () => void;
+    onEdit?: () => void;
+    onDelete?: () => void;
+    onRSVP?: (rsvp: "yes" | "maybe" | "no") => void;
+}
+declare function EventDetailPanel({ event, calendar, people, labels, description, notifications, onClose, onEdit, onDelete, onRSVP, }: EventDetailPanelProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * CreateEventDialog — 880×640 modal-shaped create form. Two-column
+ * layout: form on the left, options rail on the right (calendar
+ * picker, free/busy, notifications, guest permissions, helper card).
+ *
+ * Does NOT manage open/close — the consumer wraps the JSX in a Radix
+ * `Dialog` (or any portal). The visual shell + the form scaffolding is
+ * what this component owns.
+ */
+interface CreateEventTab {
+    id: string;
+    label: ReactNode;
+}
+interface CreateEventLabels {
+    /** Repeat-rule option list — caller-supplied so locale stays out of the SDK. */
+    repeatOptions: {
+        value: string;
+        label: string;
+    }[];
+    whenFromLabel: string;
+    whenToLabel: string;
+    allDay: string;
+    locationPlaceholder: string;
+    createMeet: string;
+    attendeesPlaceholder: string;
+    findATime: string;
+    attendeesSummary: ReactNode;
+    detailsButton: string;
+    cancel: string;
+    save: string;
+    /** Right-rail section labels. */
+    rail: {
+        saveTo: string;
+        showAs: string;
+        showAsBusy: string;
+        showAsFree: string;
+        notifications: string;
+        addNotification: string;
+        guestPermissions: string;
+        permissionEdit: string;
+        permissionInvite: string;
+        permissionGuestList: string;
+        helpTitle: string;
+        helpBody: (calendarName: string) => ReactNode;
+    };
+}
+interface CreateEventDialogProps {
+    /** Default form values. */
+    initialTitle?: string;
+    initialCalendarId: string;
+    /** Tab ids (e.g. event / task / focus / ooo). */
+    tabs: CreateEventTab[];
+    initialTab?: string;
+    /** Visible calendars to choose from (read-only ones filtered out). */
+    calendars: CalendarRef[];
+    /** Selected attendee list (chip array). */
+    attendees: PersonRef[];
+    /** When summary line (e.g. "Wed, May 20"). */
+    whenDate: ReactNode;
+    /** Start / end time strings. */
+    whenStart: string;
+    whenEnd: string;
+    labels: CreateEventLabels;
+    /** Notifications list — caller renders pills. */
+    notificationsList?: ReactNode;
+    /** Description default value. */
+    descriptionDefault?: string;
+    onRemoveAttendee?: (id: string) => void;
+    onChangeCalendar?: (id: string) => void;
+    onChangeTitle?: (next: string) => void;
+    onCancel?: () => void;
+    onSave?: () => void;
+}
+declare function CreateEventDialog({ initialTitle, initialCalendarId, tabs, initialTab, calendars, attendees, whenDate, whenStart, whenEnd, labels, notificationsList, descriptionDefault, onRemoveAttendee, onChangeCalendar, onChangeTitle, onCancel, onSave, }: CreateEventDialogProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * FindATimePanel — 1100×720 scheduling assistant. People rows on the
+ * left, time grid on the right with busy / tentative / free shading;
+ * "chosen-time" overlay tracks `selectedRange`. Footer: suggested-slot
+ * cards. Legend at the bottom.
+ *
+ * Generic: caller supplies the people directory + their per-slot
+ * availability arrays. Labels are caller-supplied for locale fit.
+ */
+interface FindATimeLabels {
+    title: string;
+    subtitle: ReactNode;
+    peopleCol: string;
+    peopleCount: (n: number) => string;
+    durationLabel: string;
+    expandHours: string;
+    apply: string;
+    /** "Suggestions — slots all attendees free". */
+    suggestionsLabel: string;
+    /** Legend texts. */
+    legendBusy: string;
+    legendTentative: string;
+    legendFree: string;
+    workingHours: string;
+}
+interface FindATimeSlotSuggestion {
+    id: string;
+    label: ReactNode;
+    meta: ReactNode;
+    best?: boolean;
+    /** Optional click → set selectedRange to this slot. */
+    range?: [number, number];
+}
+interface FindATimePanelProps {
+    people: PersonRef[];
+    /** Per-person availability: 0 = free, 1 = tentative, 2 = busy. */
+    availability: Record<string, ReadonlyArray<0 | 1 | 2>>;
+    /** Working-hour range (e.g. 9..18) — header label only; slot count comes from availability arrays. */
+    hours: number[];
+    selectedRange: [number, number] | null;
+    onChangeRange?: (range: [number, number] | null) => void;
+    suggestions: FindATimeSlotSuggestion[];
+    labels: FindATimeLabels;
+    onPrev?: () => void;
+    onNext?: () => void;
+    selfLabel?: string;
+}
+declare function FindATimePanel({ people, availability, hours, selectedRange, onChangeRange, suggestions, labels, onPrev, onNext, selfLabel, }: FindATimePanelProps): react_jsx_runtime.JSX.Element;
+
+type TableImportStep = "file" | "mapping" | "validate" | "apply";
+interface TableImportStepperLabels {
+    file?: ReactNode;
+    mapping?: ReactNode;
+    validate?: ReactNode;
+    apply?: ReactNode;
+}
+interface TableImportFileInfo {
+    /** Detected file name (display only). */
+    name: string;
+    /** Row count summary, e.g. `1,284 行`. */
+    rowSummary?: ReactNode;
+    /** Byte size summary, e.g. `132 KB`. */
+    sizeSummary?: ReactNode;
+    /** Detected encoding label (canon shows `SHIFT-JIS 検出`). */
+    encodingLabel?: ReactNode;
+    /** 0–1 progress fraction during validation. */
+    progress?: number;
+    /** Free-form left / right meta beneath the progress bar. */
+    progressLeftLabel?: ReactNode;
+    progressRightLabel?: ReactNode;
+    /** Whether to show the success file icon (vs the error one). */
+    status?: "ok" | "error";
+}
+interface TableImportErrorRow {
+    line: ReactNode;
+    message: ReactNode;
+    value: ReactNode;
+    severity?: "error" | "warning";
+}
+interface TableImportFlowProps {
+    title?: ReactNode;
+    /** Currently active step (one of the 4). */
+    currentStep: TableImportStep;
+    stepLabels?: TableImportStepperLabels;
+    file?: TableImportFileInfo;
+    errors?: TableImportErrorRow[];
+    /** Renders the actions row at the bottom of the card. */
+    actions?: ReactNode;
+    className?: string;
+}
+declare function TableImportFlow({ title, currentStep, stepLabels, file, errors, actions, className, }: TableImportFlowProps): react_jsx_runtime.JSX.Element;
+type TableExportFormat = "csv-utf8" | "csv-shift-jis" | "xlsx" | "pdf";
+type TableExportRange = "current-filter" | "selected" | "all";
+interface TableExportDialogProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    title?: ReactNode;
+    /** Selected output format. */
+    format: TableExportFormat;
+    onFormatChange: (format: TableExportFormat) => void;
+    /** Selected scope. */
+    range: TableExportRange;
+    onRangeChange: (range: TableExportRange) => void;
+    /** Whether to include hidden columns. */
+    includeHiddenColumns: boolean;
+    onIncludeHiddenColumnsChange: (next: boolean) => void;
+    /** Counts shown next to the range options. */
+    rangeCounts?: {
+        currentFilter?: number;
+        selected?: number;
+        all?: number;
+    };
+    /** Counts shown next to the columns options. */
+    columnCounts?: {
+        visible?: number;
+        total?: number;
+    };
+    /** Save callback. */
+    onExport: () => void;
+    /** Cancel callback. */
+    onCancel?: () => void;
+    exportLabel?: ReactNode;
+    cancelLabel?: ReactNode;
+    /** Optional copy overrides. */
+    labels?: {
+        format?: ReactNode;
+        range?: ReactNode;
+        columns?: ReactNode;
+        csvUtf8?: ReactNode;
+        csvShiftJis?: ReactNode;
+        xlsx?: ReactNode;
+        pdf?: ReactNode;
+        currentFilter?: (count?: number) => ReactNode;
+        selected?: (count?: number) => ReactNode;
+        all?: (count?: number) => ReactNode;
+        visibleOnly?: (count?: number) => ReactNode;
+        includeHidden?: (count?: number) => ReactNode;
+    };
+}
+declare function TableExportDialog({ open, onOpenChange, title, format, onFormatChange, range, onRangeChange, includeHiddenColumns, onIncludeHiddenColumnsChange, rangeCounts, columnCounts, onExport, onCancel, exportLabel, cancelLabel, labels, }: TableExportDialogProps): react_jsx_runtime.JSX.Element;
+
+interface UseDataTableOptions<TData> {
+    data: TData[];
+    columns: TableColumn<TData, unknown>[];
+    rowKey?: TableRowKey<TData>;
+    getRowId?: (row: TData, index: number) => string;
+    selection?: UseTableSelectionResult;
+    batchActions?: ReactNode | TableBatchActionsConfig<TData> | {
+        actions: TableBatchActionsConfig<TData>["actions"];
+        getCheckboxDisabled?: TableBatchActionsConfig<TData>["getCheckboxDisabled"];
+        selectedLabel?: TableBatchActionsConfig<TData>["selectedLabel"];
+        selectAllLabel?: TableBatchActionsConfig<TData>["selectAllLabel"];
+        clearLabel?: TableBatchActionsConfig<TData>["clearLabel"];
+    };
+    pagination?: UseTablePaginationResult;
+    total?: number;
+    pageSizeOptions?: number[];
+    showSizeChanger?: boolean;
+    showTotal?: (total: number, range: [number, number]) => ReactNode;
+    /** Direct pagination config — bypasses the `UseTablePaginationResult` slice. */
+    paginationConfig?: TablePagination;
+    views?: UseTableViewsResult;
+    onViewApply?: (view: TableViewItem) => void;
+    filters?: TableFilter[];
+    onFiltersChange?: (filters: TableFilter[]) => void;
+    filterBar?: TableFilterBar;
+    onResetFilters?: () => void;
+    sort?: TableSortState;
+    onSortChange?: (sort: TableSortState) => void;
+    resizable?: boolean;
+    columnVisibility?: TableColumnVisibility;
+    defaultColumnVisibility?: TableColumnVisibility;
+    onColumnVisibilityChange?: (columnVisibility: TableColumnVisibility) => void;
+    onColumnPinningChange?: TableColumnPinningChange;
+    toolbar?: TableToolbar;
+    expandable?: TableExpandableConfig<TData>;
+    tree?: TableTreeConfig<TData>;
+    editing?: TableEditingConfig<TData>;
+    groupBy?: TableGroupBy<TData>;
+    density?: TableDensity;
+    stickyHeader?: boolean;
+    rowClassName?: string | ((row: {
+        original: TData;
+    }) => string | undefined);
+    caption?: ReactNode;
+    footer?: ReactNode;
+    empty?: ReactNode;
+    tableKey?: string;
+    containerClassName?: string;
+    className?: string;
+}
+interface DataTableInstance<TData> {
+    /** Resolved props ready to spread on `<Table>` — already strips chrome. */
+    tableProps: {
+        columns: TableColumn<TData, unknown>[];
+        data: TData[];
+        rowKey?: TableRowKey<TData>;
+        getRowId?: (row: TData, index: number) => string;
+        density?: TableDensity;
+        stickyHeader?: boolean;
+        resizable?: boolean;
+        caption?: ReactNode;
+        footer?: ReactNode;
+        empty?: ReactNode;
+        containerClassName?: string;
+        className?: string;
+        rowClassName?: string | ((row: {
+            original: TData;
+        }) => string | undefined);
+        sort?: TableSortState;
+        onSortChange?: (sort: TableSortState) => void;
+        expandable?: TableExpandableConfig<TData>;
+        tree?: TableTreeConfig<TData>;
+        editing?: TableEditingConfig<TData>;
+        groupBy?: TableGroupBy<TData>;
+    };
+    /** TanStack instance built by the hook (Stage 4b — hoisted from the primitive). */
+    instance: Table<TData>;
+    /** Chrome config — consumed by `<DataTable>`'s renderers, not by the primitive. */
+    chromeProps: {
+        views: TableViews | undefined;
+        toolbar: TableToolbar | undefined;
+        batchActions: ReactNode | TableBatchActionsConfig<TData> | undefined;
+        filterBar: TableFilterBar | undefined;
+        filters: TableFilter[] | undefined;
+        onFiltersChange: ((filters: TableFilter[]) => void) | undefined;
+        onResetFilters: (() => void) | undefined;
+        pagination: TablePagination | undefined;
+        columnVisibility: TableColumnVisibility;
+        columnPinning: ColumnPinningState;
+        autoColumnPinning: ColumnPinningState;
+        setColumnPinning: (pinning: ColumnPinningState) => void;
+        setColumnVisibility: (visibility: TableColumnVisibility) => void;
+        currentViewSnapshot: TableViewSnapshot;
+        duplicateView: TableViewItem | undefined;
+        savedViews: TableViewItem[];
+        setSavedViews: (views: TableViewItem[]) => void;
+        saveViewDefaultName: (count: number) => string;
+    };
+    /** Slice references (so consumer hooks remain visible). */
+    selection: UseTableSelectionResult | undefined;
+    pagination: UseTablePaginationResult | undefined;
+    views: UseTableViewsResult | undefined;
+}
+/**
+ * useDataTable — composite-level state + TanStack instance builder.
+ *
+ * Stage 4b of the Table refactor (Plan §3). The TanStack instance and
+ * the chrome-related state (column visibility, column pinning, saved
+ * views) live here on the composite side; `<DataTable>` renders the
+ * chrome around the slim `<Table>` primitive.
+ */
+declare function useDataTable<TData>(options: UseDataTableOptions<TData>): DataTableInstance<TData>;
+
+/**
+ * Composite-only `ColumnMeta` extension. The `<Table>` primitive
+ * does not render filter UI or the column manager — these fields
+ * are consumed exclusively by `<DataTable>`'s chrome
+ * (`DataTableChrome` filter chip bar + `ColumnManagerSheet`).
+ *
+ * Augmentation merges with the primitive declaration in
+ * `data-display/Table.types.ts` whenever this module is in the
+ * TypeScript program (i.e. as soon as a consumer imports anything
+ * from `@godxjp/ui/components/composites`).
+ */
+declare module "@tanstack/react-table" {
+    interface ColumnMeta<TData extends RowData, TValue> {
+        filterable?: boolean;
+        filterLabel?: ReactNode;
+        filterOptions?: TableFilterOption[];
+        hideable?: boolean;
+    }
+}
+/** Replaceable regions of the composite's rendered tree. */
+interface DataTableSlots {
+    /** Override the toolbar entirely — replaces the default rendering. */
+    toolbar?: ReactNode;
+    /** Toolbar primary action (＋ 新規 / Create new). */
+    primaryAction?: TableToolbarConfig["primaryAction"];
+    /** Extra toolbar nodes appended after `primaryAction` / columns button. */
+    toolbarActions?: TableToolbarConfig["actions"];
+    /** Footer content rendered below the body (above pagination). */
+    footer?: ReactNode;
+    /** Empty-state override — replaces the default `<Empty>` primitive. */
+    emptyState?: ReactNode;
+}
+/** Composite `<DataTable>` prop surface. */
+interface DataTableProps<TData> {
+    /** Table instance from `useDataTable`. */
+    table: DataTableInstance<TData>;
+    /** Replaceable regions of the rendered tree. */
+    slots?: DataTableSlots;
+    /** Forwarded to the outer `<table>` className. */
+    className?: string;
+    /** Forwarded to the `.table-stack` wrapper className. */
+    containerClassName?: string;
+}
+
+declare function DataTable<TData>({ table, slots, className, containerClassName, }: DataTableProps<TData>): react_jsx_runtime.JSX.Element;
+
+export { AgendaView, type AgendaViewProps, type AgendaViewYMD, type AvatarUploadCallbackParams, AvatarUploader, type AvatarUploaderLabels, type AvatarUploaderProps, CalendarSidebar, type CalendarSidebarLabels, type CalendarSidebarProps, CalendarTopbar, type CalendarTopbarProps, CreateEventDialog, type CreateEventDialogProps, type CreateEventLabels, type CreateEventTab, DataTable, type DataTableInstance, type DataTableProps, type DataTableSlots, DayHeaderHero, type DayHeaderHeroProps, DayView, type DayViewProps, type DayViewYMD, type EventDetailLabels, EventDetailPanel, type EventDetailPanelProps, type FindATimeLabels, FindATimePanel, type FindATimePanelProps, type FindATimeSlotSuggestion, ImageUpload, type ImageUploadProps, LocaleInput, type LocaleInputProps, LocaleRowInput, type LocaleRowInputProps, type LocaleStatus, MediaUpload, MediaUploadAvatar, type MediaUploadAvatarProps, MediaUploadMultiple, type MediaUploadMultipleProps, type MediaUploadShape, MediaUploadSingle, type MediaUploadSingleProps, type MediaUploadSize, MonthView, type MonthViewProps, type MonthViewYMD, TableExportDialog, type TableExportDialogProps, type TableExportFormat, type TableExportRange, type TableImportErrorRow, type TableImportFileInfo, TableImportFlow, type TableImportFlowProps, type TableImportStep, type TableImportStepperLabels, Upload, type UploadCustomRequest, type UploadFile, type UploadLabels, type UploadListType, type UploadProps, type UploadRequestParams, type UploadStatus, type UseDataTableOptions, WeekView, type WeekViewProps, type WeekViewYMD, useDataTable };