@nxgt/material 3.96.2 → 3.98.0

package/dist/lib/components/ui/display/event-chip/event-chip-badges.d.ts

@@ -7,9 +7,10 @@ export type EventChipBadge = {
 /** The `badge` then the further `badges`: the one place that order is made. */
 export declare function eventChipBadges(badge?: EventChipBadge, badges?: EventChipBadge[]): EventChipBadge[];
 /** Every badge as a pill or a tone dot. */
-export declare function ChipBadges({ badges, tight, }: {
+export declare function ChipBadges({ badges, tight, inline, }: {
     badges: EventChipBadge[];
     tight: boolean;
+    inline?: boolean;
 }): import("react").JSX.Element;
 /**
  * The badges as a wrapping row of small pills, for a place with room (an

package/dist/lib/components/ui/display/event-chip/event-chip-content.d.ts

@@ -8,6 +8,8 @@ type ContentProps = {
     allDay: boolean;
     compact: boolean;
     tight: boolean;
+    /** The box is too short for title, time and a badge row: the badges join the time's line. */
+    short?: boolean;
     solid: boolean;
     /** Already merged by `eventChipBadges`. */
     badges?: EventChipBadge[];

package/dist/lib/components/ui/display/event-chip/event-chip.d.ts

@@ -27,6 +27,8 @@ export type EventChipProps = {
     compact?: boolean;
     /** The box is under 20px: no padding or line gap, the title clips inside it. */
     tight?: boolean;
+    /** The box is too short for title, time and a badge row: the badge joins the time's line. */
+    short?: boolean;
     /** `soft` (the default): a tint and a bar; `solid`: filled; `outline`: a border. */
     variant?: EventChipVariant;
     /** A small label (and tone) after the title; hidden but still named where the box is tiny. */
@@ -47,4 +49,4 @@ export type EventChipProps = {
  * is set from script (a CSS custom property), never as inline style in server
  * markup.
  */
-export declare function EventChip({ title, time, endTime, color: ownColor, tone, cancelled, allDay, compact, tight, variant, badge, badges, selected, disabled, continuesBefore, continuesAfter, onClick, className, style, }: EventChipProps): import("react").JSX.Element;
+export declare function EventChip({ title, time, endTime, color: ownColor, tone, cancelled, allDay, compact, tight, short, variant, badge, badges, selected, disabled, continuesBefore, continuesAfter, onClick, className, style, }: EventChipProps): import("react").JSX.Element;

package/dist/lib/components/ui/fields/currency-field/currency-field.d.ts

@@ -17,5 +17,13 @@ export type CurrencyFieldProps = Omit<TextFieldProps, 'type' | 'value' | 'defaul
      * (`CalculatorField`'s "Open calculator"). It keeps its own name and focus.
      */
     trailingAction?: ReactNode;
+    /**
+     * `value`, `defaultValue` and `onChange` are whole minor units (cents,
+     * centimes, yen) instead of major units: `1999` shows `19.99` in EUR.
+     * The decimals are the currency's own (EUR 2, XAF 0, KWD 3), or
+     * `fractionDigits` when given, as `formatAmount`'s `minorUnits` option.
+     * Off by default.
+     */
+    minorUnits?: boolean;
 };
-export declare function CurrencyField({ value, defaultValue, onChange, currency, fractionDigits, trailingAction, className, ...props }: CurrencyFieldProps): import("react").JSX.Element;
+export declare function CurrencyField({ value, defaultValue, onChange, currency, fractionDigits, trailingAction, minorUnits, className, ...props }: CurrencyFieldProps): import("react").JSX.Element;

package/dist/lib/components/ui/fields/currency-field/use-currency-amount.d.ts

@@ -4,12 +4,14 @@ type Options = {
     onChange?: (value: number | null) => void;
     currency: string;
     fractionDigits?: number;
+    /** `value`, `defaultValue` and `onChange` are whole minor units. */
+    minorUnits?: boolean;
 };
 /**
  * The text a currency field shows and the amount it holds, controlled or
  * not: `change` follows typing, `commit` formats the amount on blur.
  */
-export declare function useCurrencyAmount({ value, defaultValue, onChange, currency, fractionDigits, }: Options): {
+export declare function useCurrencyAmount({ value, defaultValue, onChange, currency, fractionDigits, minorUnits, }: Options): {
     draft: string;
     change: (raw: string) => void;
     commit: (raw: string) => void;

package/dist/lib/components/ui/fields/currency-field/use-minor-units.d.ts

@@ -0,0 +1,9 @@
+/**
+ * The two conversions between the amount a currency field holds (major
+ * units) and the one its props carry: identity, or whole minor units when
+ * `minorUnits` is set.
+ */
+export declare function useMinorUnits(minorUnits: boolean, currency: string, fractionDigits?: number): {
+    toMajor: (external: number | null | undefined) => number | null | undefined;
+    toExternal: (major: number | null) => number | null;
+};

package/dist/lib/components/ui/fields/repeatable-group/partials/repeatable-group-heading.d.ts

@@ -6,6 +6,18 @@ export declare function RepeatableGroupLabel({ id, children, }: {
 }): import("react").JSX.Element;
 /** An error about the whole group, under the rows; it describes the group. */
 export declare function RepeatableGroupError({ id, children, }: {
+    id: string;
+    children?: ReactNode;
+}): import("react").JSX.Element | null;
+/** Help text under the label; it describes the group. */
+export declare function RepeatableGroupDescription({ id, children, }: {
     id: string;
     children: ReactNode;
 }): import("react").JSX.Element;
+/** The label, then the description under it, each only when given. */
+export declare function RepeatableGroupHeading({ label, labelId, description, descriptionId, }: {
+    label?: ReactNode;
+    labelId: string;
+    description?: ReactNode;
+    descriptionId: string;
+}): import("react").JSX.Element;

package/dist/lib/components/ui/fields/repeatable-group/repeatable-group.d.ts

@@ -9,4 +9,4 @@ export type { RepeatableGroupProps, RepeatableGroupRowContext, } from './types.j
  * politely. For react-hook-form, `RepeatableGroupFormField` wires it to
  * `useFieldArray`.
  */
-export declare function RepeatableGroup<TItem>({ items, renderRow, getKey, label, rowLabel, addLabel, onAdd, onRemove, onMove, reorderable, min, removeAtMin, max, removable, removeDisabledReason, disabled, error, emptyTitle, emptyDescription, className, ref, ...props }: RepeatableGroupProps<TItem>): import("react").JSX.Element;
+export declare function RepeatableGroup<TItem>({ items, renderRow, getKey, label, description, rowLabel, addLabel, onAdd, onRemove, onMove, reorderable, min, removeAtMin, max, removable, removeDisabledReason, disabled, error, emptyTitle, emptyDescription, className, ref, 'aria-describedby': own, ...props }: RepeatableGroupProps<TItem>): import("react").JSX.Element;

package/dist/lib/components/ui/fields/repeatable-group/types.d.ts

@@ -19,6 +19,11 @@ export type RepeatableGroupProps<TItem> = Omit<ComponentProps<'div'>, 'children'
     getKey?: (item: TItem, index: number) => Key;
     /** The group's label, above the rows; it names the group and the list. */
     label?: ReactNode;
+    /**
+     * Help text under the label, like other fields' help text; the group's
+     * `aria-describedby` points at it, so it is announced with the group.
+     */
+    description?: ReactNode;
     /**
      * What one row is, lower case: it names the row's buttons ("Remove
      * period 2") and the announcements. Default "row", translated.

package/dist/lib/components/ui/fields/repeatable-group/use-repeatable-group-text.d.ts

@@ -0,0 +1,19 @@
+import { ReactNode } from 'react';
+/**
+ * The ids of the group's label, description and error, which of the three are
+ * given, and the group's `aria-describedby` (the caller's own ids, then the
+ * description's and the error's).
+ */
+export declare function useRepeatableGroupText(label: ReactNode, description: ReactNode, error: ReactNode, own?: string): {
+    named: boolean;
+    failed: boolean;
+    errorId: string;
+    /** The `RepeatableGroupHeading` props: what is not given stays undefined. */
+    heading: {
+        label: ReactNode;
+        labelId: string;
+        description: ReactNode;
+        descriptionId: string;
+    };
+    describedBy: string | undefined;
+};

package/dist/lib/components/ui/fields/textarea-field/textarea-field.d.ts

@@ -6,5 +6,7 @@ export type TextareaProps = {
     minRows?: number;
     maxRows?: number;
     showCount?: boolean;
+    /** Sets the theme's monospace font (`--font-mono`) for code-like plain text. */
+    monospace?: boolean;
 } & ComponentProps<'textarea'>;
-export declare function TextareaField({ error, helperText, label, className, placeholder, minRows, maxRows, showCount, maxLength, value, defaultValue, onChange, ...props }: TextareaProps): import("react").JSX.Element;
+export declare function TextareaField({ error, helperText, label, className, placeholder, minRows, maxRows, showCount, monospace, maxLength, value, defaultValue, onChange, ...props }: TextareaProps): import("react").JSX.Element;

package/dist/lib/components/ui/media/image-cropper/crop-image.d.ts

@@ -5,9 +5,22 @@ export declare function rotateSize(width: number, height: number, rotation: numb
     height: number;
 };
 export declare function createImage(url: string): Promise<HTMLImageElement>;
-export declare function cropImageToFile(imageSrc: string, pixelCrop: Area, options?: {
+/**
+ * The size to draw a crop at: its longest side capped at `outputSize` px,
+ * the ratio kept. Downscale only: a crop already small enough is unchanged.
+ */
+export declare function fitOutputSize(width: number, height: number, outputSize?: number): {
+    width: number;
+    height: number;
+};
+export type CropImageOptions = {
     rotation?: number;
+    /** Longest side of the file in px. Downscale only. Default: the crop's size. */
+    outputSize?: number;
+    /** Default `'image/jpeg'`. */
     mimeType?: string;
+    /** 0 to 1, for the lossy types. Default `0.92`. */
     quality?: number;
     fileName?: string;
-}): Promise<File>;
+};
+export declare function cropImageToFile(imageSrc: string, pixelCrop: Area, options?: CropImageOptions): Promise<File>;

package/dist/lib/components/ui/media/image-cropper/image-cropper.d.ts

@@ -1,14 +1,19 @@
 import { ButtonVariant } from '../../actions/button/button.js';
-import { ImageCropResult, ImageCropShape } from './types.js';
-export type ImageCropperProps = {
+import { ImageCropOutput, ImageCropResult, ImageCropShape } from './types.js';
+export type ImageCropperProps = ImageCropOutput & {
     src: string;
     aspect?: number;
     cropShape?: ImageCropShape;
     fileName?: string;
-    onCrop: (result: ImageCropResult) => void;
+    /**
+     * Receives the cropped file. May return a promise (an upload, say): Apply
+     * stays busy and Cancel disabled until it settles. A rejection keeps the
+     * crop, so the user can apply again; show your own error.
+     */
+    onCrop: (result: ImageCropResult) => void | Promise<void>;
     onCancel?: () => void;
     /** The Cancel button's variant. Default `'tonal'`; `'ghost'` restores the earlier look. */
     cancelVariant?: ButtonVariant;
     className?: string;
 };
-export declare function ImageCropper({ src, aspect: aspectProp, cropShape, fileName, onCrop, onCancel, cancelVariant, className, }: ImageCropperProps): import("react").JSX.Element;
+export declare function ImageCropper({ src, aspect: aspectProp, cropShape, fileName, outputSize, mimeType, quality, onCrop, onCancel, cancelVariant, className, }: ImageCropperProps): import("react").JSX.Element;

package/dist/lib/components/ui/media/image-cropper/index.d.ts

@@ -1,7 +1,8 @@
-export { cropImageToFile, getRadianAngle, rotateSize } from './crop-image.js';
+export type { CropImageOptions } from './crop-image.js';
+export { cropImageToFile, fitOutputSize, getRadianAngle, rotateSize, } from './crop-image.js';
 export type { ImageCropperProps } from './image-cropper.js';
 export { ImageCropper } from './image-cropper.js';
 export type { ImageCropperDialogProps } from './image-cropper-dialog.js';
 export { ImageCropperDialog } from './image-cropper-dialog.js';
-export type { ImageCropAspectId, ImageCropResult, ImageCropShape, } from './types.js';
+export type { ImageCropAspectId, ImageCropOutput, ImageCropResult, ImageCropShape, } from './types.js';
 export { IMAGE_CROP_ASPECTS } from './types.js';

package/dist/lib/components/ui/media/image-cropper/types.d.ts

@@ -4,6 +4,15 @@ export type ImageCropResult = {
     file: File;
     area: Area;
 };
+/** What the cropped file is made of, shared by the helper and the cropper. */
+export type ImageCropOutput = {
+    /** Longest side of the file in px (512, say). Downscale only. Default: the crop's own size. */
+    outputSize?: number;
+    /** Default `'image/jpeg'`. */
+    mimeType?: string;
+    /** 0 to 1, for the lossy types. Default `0.92`. */
+    quality?: number;
+};
 export declare const IMAGE_CROP_ASPECTS: readonly [{
     readonly id: "1:1";
     readonly label: "1:1";

package/dist/lib/components/ui/media/image-cropper/use-apply-crop.d.ts

@@ -0,0 +1,16 @@
+import { Area } from 'react-easy-crop';
+import { ImageCropOutput, ImageCropResult } from './types.js';
+type Options = ImageCropOutput & {
+    src: string;
+    area: Area | null;
+    rotation: number;
+    fileName?: string;
+    onCrop: (result: ImageCropResult) => void | Promise<void>;
+};
+/** The apply step: crops the image, hands it to `onCrop` and tracks saving. */
+export declare function useApplyCrop({ src, area, rotation, fileName, outputSize, mimeType, quality, onCrop, }: Options): {
+    apply: () => Promise<void>;
+    isSaving: boolean;
+    error: string | null;
+};
+export {};

package/dist/lib/components/ui/media/image-cropper/use-image-cropper.d.ts

@@ -1,16 +1,16 @@
 import { RefObject } from 'react';
 import { Area, Point } from 'react-easy-crop';
 import { CropSize } from './crop-resize-handles.js';
-import { ImageCropAspectId, ImageCropResult } from './types.js';
-type Options = {
+import { ImageCropAspectId, ImageCropOutput, ImageCropResult } from './types.js';
+type Options = ImageCropOutput & {
     src: string;
     aspect?: number;
     fileName?: string;
-    onCrop: (result: ImageCropResult) => void;
+    onCrop: (result: ImageCropResult) => void | Promise<void>;
     frameRef: RefObject<HTMLDivElement | null>;
 };
-/** The cropper's crop, zoom, rotation and aspect state, and the apply step. */
-export declare function useImageCropper({ src, aspect: aspectProp, fileName, onCrop, frameRef, }: Options): {
+/** The cropper's crop, zoom, rotation and aspect state, and the area to apply. */
+export declare function useImageCropper({ src, aspect: aspectProp, fileName, outputSize, mimeType, quality, onCrop, frameRef, }: Options): {
     crop: Point;
     setCrop: import('react').Dispatch<import('react').SetStateAction<Point>>;
     zoom: number;

package/dist/lib/components/ui/widgets/education/questions/partials/content-lang.d.ts

@@ -0,0 +1,14 @@
+import { ReactNode } from 'react';
+export declare const ContentLangProvider: import('react').Provider<string | undefined>;
+export declare function useContentLang(): string | undefined;
+/**
+ * Marks a content part (prompt, option, hint, explanation, reference, example)
+ * with the question's `contentLang`. Without one it renders its children as
+ * they are, so a card with no `contentLang` keeps its markup. The card's own
+ * strings never go through it.
+ */
+export declare function ContentLang({ children, block, }: {
+    children: ReactNode;
+    /** A `div` instead of a `span`, for block content. */
+    block?: boolean;
+}): import("react").JSX.Element;

package/dist/lib/components/ui/widgets/education/questions/partials/question-content.d.ts

@@ -1,3 +1,3 @@
 import { QuestionProps } from '../types.js';
 /** A question's fieldset: prompt, header, media, hint, the answer body and the feedback. */
-export declare function QuestionContent({ question, value, onValueChange, revealed: revealedProp, verdict, points, feedback, disabled, readOnly, busy, renderCode, promptId: promptIdProp, variant, density, showShortcuts, number, showFeedback: showFeedbackProp, preview, }: QuestionProps): import("react").JSX.Element;
+export declare function QuestionContent({ question, value, onValueChange, revealed: revealedProp, verdict, points, feedback, disabled, readOnly, busy, renderCode, promptId: promptIdProp, variant, density, showShortcuts, number, showFeedback: showFeedbackProp, preview, contentLang, }: QuestionProps): import("react").JSX.Element;

package/dist/lib/components/ui/widgets/education/questions/question-props.types.d.ts

@@ -0,0 +1,87 @@
+import { ReactNode } from 'react';
+import { Question, QuestionAnswer, QuestionPoints, QuestionVerdict } from './types.js';
+/**
+ * What `renderCode` gets to draw the code field of a `code` question. The
+ * editor must be named by the prompt (`label`, or `aria-labelledby={labelledBy}`)
+ * and honour `readOnly` and `disabled`.
+ */
+export type QuestionCodeField = {
+    value: string;
+    onChange: (value: string) => void;
+    /** The prompt's id: name the field with `aria-labelledby`. */
+    labelledBy: string;
+    /** The id of the `description` line, when there is one: add it to `aria-describedby`. */
+    describedBy?: string;
+    /** The prompt, as a text label for editors that take one. */
+    label: string;
+    language?: string;
+    maxLength?: number;
+    readOnly: boolean;
+    disabled: boolean;
+    /** The card's `contentLang`, for an editor that takes a `lang` (the starter code's language). */
+    lang?: string;
+};
+export type QuestionProps = {
+    question: Question;
+    value?: QuestionAnswer;
+    onValueChange?: (value: QuestionAnswer) => void;
+    revealed?: boolean;
+    /**
+     * The id of the prompt (the fieldset's legend text), so a wrapper can use
+     * `aria-labelledby`. Default: a generated id. The `description` line is
+     * `${promptId}-description`.
+     */
+    promptId?: string;
+    /**
+     * The verdict the server gave, shown as given (no comparison with
+     * `question.correct` in the browser). It reveals the card; `pending` is a
+     * free answer still waiting for a grader; `unanswered` is a question left
+     * blank (no value is shown, the points read 0). `question.correct` may still
+     * be passed to highlight the correct choices.
+     */
+    verdict?: QuestionVerdict;
+    /** Points earned, shown in the verdict banner (needs `verdict`). */
+    points?: QuestionPoints;
+    /** A grader's remark, shown in the verdict banner (needs `verdict`). */
+    feedback?: string;
+    disabled?: boolean;
+    /** The answer is shown but not editable (already submitted), without the revealed marks. Every kind honours it. */
+    readOnly?: boolean;
+    /** An answer is being saved: the field is locked like `readOnly` and `aria-busy`. Every kind honours it. */
+    busy?: boolean;
+    /**
+     * The code field of a `code` question, e.g. `@nxgt/material/code-editor`'s
+     * `CodeEditor` (kept out of this bundle: Monaco is heavy). Without it the
+     * field is a monospace textarea.
+     */
+    renderCode?: (field: QuestionCodeField) => ReactNode;
+    className?: string;
+    /** `card` (the default) is framed; `plain` sits inside another surface. */
+    variant?: 'card' | 'plain';
+    density?: 'comfortable' | 'compact';
+    /** Shows a key badge (1, 2, 3…) on each option. */
+    showShortcuts?: boolean;
+    /** The question's number, shown above the prompt ("Question 2"). */
+    number?: number;
+    /** The verdict banner once revealed: right or wrong, the correct answer. */
+    showFeedback?: boolean;
+    /**
+     * An author's preview: the card is read-only and shows the marks, the
+     * `question.correct` answer (the right options marked, the expected text or
+     * number filled in) and the `explanation`, with no verdict banner.
+     * `verdict` and `showFeedback` are always ignored in a preview; `value` is
+     * ignored when the question has a `correct`. An `open` or `code` question
+     * has none, so pass its reference answer as `value`. Never used for a
+     * learner's attempt.
+     */
+    preview?: boolean;
+    /**
+     * The language of the question's content (a BCP 47 tag, `en`): sets `lang`
+     * on the prompt, the options, the hints, the explanation, the option
+     * explanations, the references and the code examples and starter, so a
+     * screen reader announces them in their own language. The card's own
+     * strings (buttons, labels, notes) keep the page's language. Default: no
+     * `lang`, the content takes the page's.
+     */
+    contentLang?: string;
+};

package/dist/lib/components/ui/widgets/education/questions/question.d.ts

@@ -1,2 +1,2 @@
 import { QuestionProps } from './types.js';
-export declare function QuestionCard({ question, value, onValueChange, revealed, verdict, points, feedback, disabled, readOnly, busy, renderCode, promptId, className, variant, density, showShortcuts, number, showFeedback, preview, }: QuestionProps): import("react").JSX.Element;
+export declare function QuestionCard({ question, value, onValueChange, revealed, verdict, points, feedback, disabled, readOnly, busy, renderCode, promptId, className, variant, density, showShortcuts, number, showFeedback, preview, contentLang, }: QuestionProps): import("react").JSX.Element;

package/dist/lib/components/ui/widgets/education/questions/types.d.ts

@@ -109,77 +109,4 @@ export type Question = {
     /** `code`: the language of the code ("python"), given to `renderCode`. */
     language?: string;
 };
-/**
- * What `renderCode` gets to draw the code field of a `code` question. The
- * editor must be named by the prompt (`label`, or `aria-labelledby={labelledBy}`)
- * and honour `readOnly` and `disabled`.
- */
-export type QuestionCodeField = {
-    value: string;
-    onChange: (value: string) => void;
-    /** The prompt's id: name the field with `aria-labelledby`. */
-    labelledBy: string;
-    /** The id of the `description` line, when there is one: add it to `aria-describedby`. */
-    describedBy?: string;
-    /** The prompt, as a text label for editors that take one. */
-    label: string;
-    language?: string;
-    maxLength?: number;
-    readOnly: boolean;
-    disabled: boolean;
-};
-export type QuestionProps = {
-    question: Question;
-    value?: QuestionAnswer;
-    onValueChange?: (value: QuestionAnswer) => void;
-    revealed?: boolean;
-    /**
-     * The id of the prompt (the fieldset's legend text), so a wrapper can use
-     * `aria-labelledby`. Default: a generated id. The `description` line is
-     * `${promptId}-description`.
-     */
-    promptId?: string;
-    /**
-     * The verdict the server gave, shown as given (no comparison with
-     * `question.correct` in the browser). It reveals the card; `pending` is a
-     * free answer still waiting for a grader; `unanswered` is a question left
-     * blank (no value is shown, the points read 0). `question.correct` may still
-     * be passed to highlight the correct choices.
-     */
-    verdict?: QuestionVerdict;
-    /** Points earned, shown in the verdict banner (needs `verdict`). */
-    points?: QuestionPoints;
-    /** A grader's remark, shown in the verdict banner (needs `verdict`). */
-    feedback?: string;
-    disabled?: boolean;
-    /** The answer is shown but not editable (already submitted), without the revealed marks. Every kind honours it. */
-    readOnly?: boolean;
-    /** An answer is being saved: the field is locked like `readOnly` and `aria-busy`. Every kind honours it. */
-    busy?: boolean;
-    /**
-     * The code field of a `code` question, e.g. `@nxgt/material/code-editor`'s
-     * `CodeEditor` (kept out of this bundle: Monaco is heavy). Without it the
-     * field is a monospace textarea.
-     */
-    renderCode?: (field: QuestionCodeField) => ReactNode;
-    className?: string;
-    /** `card` (the default) is framed; `plain` sits inside another surface. */
-    variant?: 'card' | 'plain';
-    density?: 'comfortable' | 'compact';
-    /** Shows a key badge (1, 2, 3…) on each option. */
-    showShortcuts?: boolean;
-    /** The question's number, shown above the prompt ("Question 2"). */
-    number?: number;
-    /** The verdict banner once revealed: right or wrong, the correct answer. */
-    showFeedback?: boolean;
-    /**
-     * An author's preview: the card is read-only and shows the marks, the
-     * `question.correct` answer (the right options marked, the expected text or
-     * number filled in) and the `explanation`, with no verdict banner.
-     * `verdict` and `showFeedback` are always ignored in a preview; `value` is
-     * ignored when the question has a `correct`. An `open` or `code` question
-     * has none, so pass its reference answer as `value`. Never used for a
-     * learner's attempt.
-     */
-    preview?: boolean;
-};
+export type { QuestionCodeField, QuestionProps, } from './question-props.types.js';

package/dist/lib/components/ui/widgets/event-calendar/partials/calendar-event-chip.d.ts

@@ -1,9 +1,11 @@
 import { CalendarEvent } from '../types.js';
-export declare function CalendarEventChip({ event: drawn, compact, tight, className, continuesBefore, continuesAfter, appearance, }: {
+export declare function CalendarEventChip({ event: drawn, compact, tight, short, className, continuesBefore, continuesAfter, appearance, }: {
     event: CalendarEvent;
     compact?: boolean;
     /** The chip's box is under 20px tall (back-to-back short events). */
     tight?: boolean;
+    /** The box is under 60px: a badge joins the time's line instead of a row of its own. */
+    short?: boolean;
     className?: string;
     continuesBefore?: boolean;
     continuesAfter?: boolean;