@stealthscale/component-media 0.1.0

package/dist/index.d.ts

@@ -0,0 +1,700 @@
+import { ComponentProps, ReactElement, ReactNode } from "react";
+import * as avatar from "@zag-js/avatar";
+import * as carousel from "@zag-js/carousel";
+import { AutoplayStatusDetails, DragStatusDetails, ItemProps, PageChangeDetails, ProgressTextDetails, ProgressTextDetails as ProgressTextDetails$1, Props } from "@zag-js/carousel";
+import { ButtonProps } from "@stealthscale/component-actions";
+import * as imageCropper from "@zag-js/image-cropper";
+import { CropChangeDetails, CropData, FlipChangeDetails, FlipState, GetCroppedImageOptions, HandlePosition, HandlePosition as HandlePosition$1, RotationChangeDetails, ZoomChangeDetails, handles } from "@zag-js/image-cropper";
+//#region src/audio/audio.d.ts
+/**
+ * Renders the `audio` element with the recipe's class.
+ */
+declare const Drawn$13: import("@stealthscale/theme").StyledComponent<"audio", {}>;
+/**
+ * Describes the props of `Audio`: the props of an `audio` element.
+ */
+type AudioProps = ComponentProps<typeof Drawn$13>;
+/**
+ * Renders the element with the browser's controls unless the caller turns them off.
+ *
+ * @param props - The props of an `audio` element.
+ * @returns The `audio` element.
+ */
+export declare function Audio({ controls, ...rest }: AudioProps): ReactElement;
+//#endregion
+//#region src/avatar/badge.d.ts
+/**
+ * Renders the badge `span` with the badge recipe's variants.
+ */
+declare const Marked: import("@stealthscale/theme").StyledComponent<"span", {
+  readonly palette?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning";
+  readonly placement?: "bottom-end" | "bottom-start" | "top-end" | "top-start";
+  readonly variant?: "solid" | "subtle";
+}>;
+/**
+ * Describes the props of `Badge`: the label, the variants and the `span` props.
+ */
+interface BadgeProps extends Omit<ComponentProps<typeof Marked>, "id"> {
+  /**
+   * Meaning of the badge in words, such as `Online`, `3 unread messages` or `On holiday`.
+   */
+  readonly label?: string | undefined;
+}
+/**
+ * Renders the badge, named by `label` and describing the avatar around it.
+ *
+ * @param props - The label, the variants and the `span` element's props.
+ * @returns The `span` element.
+ */
+declare function Badge({ label, ...rest }: BadgeProps): ReactElement;
+//#endregion
+//#region src/avatar/fallback.d.ts
+/**
+ * Renders the fallback `span`.
+ */
+declare const Lettered: import("@stealthscale/theme").StyledComponent<"span", {}>;
+/**
+ * Describes the props of `Fallback`.
+ */
+type FallbackProps = ComponentProps<typeof Lettered>;
+/**
+ * Renders the children, or the initials of the root's name.
+ *
+ * @param props - The `span` element's props.
+ * @returns The `span` element, hidden once the picture loads.
+ */
+declare function Fallback({ children, ...rest }: FallbackProps): ReactElement;
+//#endregion
+//#region src/avatar/group.d.ts
+/**
+ * Renders the group `span`.
+ */
+declare const Grouped: import("@stealthscale/theme").StyledComponent<"span", {
+  readonly effect?: "glow" | "pulse";
+  readonly palette?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning";
+  readonly shape?: "circle" | "rounded" | "square";
+  readonly size?: "2xl" | "2xs" | "lg" | "md" | "sm" | "xl" | "xs";
+  readonly variant?: "outline" | "solid" | "subtle" | "surface";
+}>;
+/**
+ * Describes the props of `Group`: the variants its avatars default to and the `span` props.
+ */
+type GroupProps = ComponentProps<typeof Grouped>;
+/**
+ * Renders the row and provides its variants to the avatars in it.
+ *
+ * @param props - The variants and the `span` element's props.
+ * @returns The `span` element.
+ */
+declare function Group({ palette, shape, size, variant, ...rest }: GroupProps): ReactElement;
+//#endregion
+//#region src/avatar/image.d.ts
+/**
+ * Renders the picture `img`.
+ */
+declare const Pictured: import("@stealthscale/theme").StyledComponent<"img", {}>;
+/**
+ * Describes the props of `Image`.
+ */
+type ImageProps$1 = ComponentProps<typeof Pictured>;
+/**
+ * Renders the picture with the machine's load handlers merged under the caller's.
+ *
+ * @param props - The `img` element's props.
+ * @returns The `img` element, hidden until it loads.
+ */
+declare function Image$1({ alt, ...rest }: ImageProps$1): ReactElement;
+//#endregion
+//#region src/avatar/machine.d.ts
+/**
+ * Machine settings a caller passes to the root, `id` included, all optional.
+ */
+type AvatarOptions = Partial<avatar.Props>;
+//#endregion
+//#region src/avatar/root.d.ts
+/**
+ * Renders the root `span` and provides the variants to the image and the fallback.
+ */
+declare const Boxed: import("@stealthscale/theme").StyledComponent<"span", {
+  readonly effect?: "glow" | "pulse";
+  readonly palette?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning";
+  readonly shape?: "circle" | "rounded" | "square";
+  readonly size?: "2xl" | "2xs" | "lg" | "md" | "sm" | "xl" | "xs";
+  readonly variant?: "outline" | "solid" | "subtle" | "surface";
+}>;
+/**
+ * Describes the props of `Root`: the machine settings, the name and the styled `span` props.
+ */
+interface RootProps$2 extends AvatarOptions, Omit<ComponentProps<typeof Boxed>, "dir" | "id"> {
+  /**
+   * Name of the person or the thing: the initials in the fallback and the avatar's accessible
+   * name.
+   */
+  readonly name?: string | undefined;
+}
+/**
+ * Renders the box, named by `name` when one is passed.
+ *
+ * @param props - The machine settings, the name, the recipe's variants and the `span` props.
+ * @returns The `span` element, with the connected API in context.
+ */
+declare function Root$2(props: RootProps$2): ReactElement;
+declare namespace index_d_exports {
+  export { Badge, BadgeProps, Fallback, FallbackProps, Group, GroupProps, Image$1 as Image, ImageProps$1 as ImageProps, Root$2 as Root, RootProps$2 as RootProps };
+}
+//#endregion
+//#region src/carousel/autoplay-indicator.d.ts
+/**
+ * Describes the props of the glyph: one node per action.
+ */
+interface AutoplayIndicatorProps {
+  /**
+   * Glyph shown while the carousel rotates, the action a press takes.
+   */
+  readonly pause: ReactNode;
+  /**
+   * Glyph shown while the carousel does not rotate.
+   */
+  readonly play: ReactNode;
+}
+/**
+ * Renders the glyph of the rotation control's next action.
+ *
+ * @param props - The glyph of each action.
+ * @returns The glyph for the rotation's state.
+ */
+declare function AutoplayIndicator({ pause, play }: AutoplayIndicatorProps): ReactNode;
+//#endregion
+//#region src/carousel/autoplay-trigger.d.ts
+/**
+ * Describes the props of the rotation control: the names of its two actions and the props of a
+ * `Button`.
+ */
+interface AutoplayTriggerProps extends ButtonProps {
+  /**
+   * Name of the control while the carousel does not rotate, "Start slide rotation" unless the
+   * caller passes another.
+   */
+  readonly startLabel?: string | undefined;
+  /**
+   * Name of the control while the carousel rotates, "Stop slide rotation" unless the caller passes
+   * another.
+   */
+  readonly stopLabel?: string | undefined;
+}
+/**
+ * Renders the rotation control with the machine's props merged under the caller's.
+ *
+ * @param props - The names of the two actions and the props of a `Button`.
+ * @returns The `button` element.
+ */
+declare function AutoplayTrigger({ startLabel, stopLabel, ...rest }: AutoplayTriggerProps): ReactElement;
+//#endregion
+//#region src/carousel/control.d.ts
+/**
+ * Renders the `div` with the carousel's control class.
+ */
+declare const Drawn$12: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the control row: the props of a `div`.
+ */
+type ControlProps = ComponentProps<typeof Drawn$12>;
+/**
+ * Renders the control row with the machine's props merged under the caller's.
+ *
+ * @param props - The props of a `div`, the controls among its children.
+ * @returns The `div` element.
+ */
+declare function Control(props: ControlProps): ReactElement;
+//#endregion
+//#region src/carousel/indicator-group.d.ts
+/**
+ * Renders the `div` with the carousel's dot group class.
+ */
+declare const Drawn$11: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the dot group: the props of a `div`, the dots among its children.
+ */
+type IndicatorGroupProps = ComponentProps<typeof Drawn$11>;
+/**
+ * Renders the dot group with the machine's props merged under the caller's.
+ *
+ * @param props - The props of a `div`, the dots among its children.
+ * @returns The `div` element.
+ */
+declare function IndicatorGroup(props: IndicatorGroupProps): ReactElement;
+//#endregion
+//#region src/carousel/indicator.d.ts
+/**
+ * Renders the `button` with the carousel's dot class.
+ */
+declare const Drawn$10: import("@stealthscale/theme").StyledComponent<"button", {}>;
+/**
+ * Describes the props of a dot: its page, its name, whether it only shows the page, and the props
+ * of a `button`.
+ */
+interface IndicatorProps extends ComponentProps<typeof Drawn$10> {
+  /**
+   * Index of the page the dot moves to, from zero.
+   */
+  readonly index: number;
+  /**
+   * Accessible name of the dot, "Go to slide N" unless the caller passes another.
+   */
+  readonly label?: string | undefined;
+  /**
+   * Whether the dot only shows its page and a press does nothing.
+   */
+  readonly readOnly?: boolean | undefined;
+}
+/**
+ * Renders the dot with the machine's props merged under the caller's.
+ *
+ * @param props - The page, the name, the read-only flag and the props of a `button`.
+ * @returns The `button` element.
+ */
+declare function Indicator({ index, label, readOnly, ...rest }: IndicatorProps): ReactElement;
+//#endregion
+//#region src/carousel/indicators.d.ts
+/**
+ * Describes the props of the dots: the words that name a dot.
+ */
+interface IndicatorsProps {
+  /**
+   * Returns the accessible name of a dot from its page, counted from one. "Go to slide N" unless
+   * the caller passes another function.
+   */
+  readonly label?: ((page: number) => string) | undefined;
+}
+/**
+ * Renders the dots.
+ *
+ * @param props - The function that returns a dot's accessible name.
+ * @returns A dot per page, in order.
+ */
+declare function Indicators({ label }: IndicatorsProps): ReactElement;
+//#endregion
+//#region src/carousel/item-group.d.ts
+/**
+ * Renders the `div` with the carousel's scroller class.
+ */
+declare const Drawn$9: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the scroller: the props of a `div`, the slides among its children.
+ */
+type ItemGroupProps = ComponentProps<typeof Drawn$9>;
+/**
+ * Renders the scroller with the machine's props merged under the caller's.
+ *
+ * @param props - The props of a `div`, the slides among its children.
+ * @returns The `div` element.
+ */
+declare function ItemGroup(props: ItemGroupProps): ReactElement;
+//#endregion
+//#region src/carousel/item.d.ts
+/**
+ * Renders the `div` with the carousel's slide class.
+ */
+declare const Drawn$8: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of a slide: its index, where it snaps, and the props of a `div`.
+ */
+interface ItemProps$1 extends ComponentProps<typeof Drawn$8> {
+  /**
+   * Position of the slide among the slides, from zero.
+   */
+  readonly index: number;
+  /**
+   * Edge of the slide the scroller snaps to, `start` unless the caller passes another.
+   */
+  readonly snapAlign?: ItemProps["snapAlign"];
+}
+/**
+ * Renders the slide with the machine's props merged under the caller's.
+ *
+ * @param props - The index, the snap edge and the props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Item({ index, snapAlign, ...props }: ItemProps$1): ReactElement;
+//#endregion
+//#region src/carousel/next-trigger.d.ts
+/**
+ * Describes the props of the next trigger: its accessible name and the props of a `Button`.
+ */
+interface NextTriggerProps extends ButtonProps {
+  /**
+   * Accessible name of the trigger, "Next slide" unless the caller passes another.
+   */
+  readonly label?: string | undefined;
+}
+/**
+ * Renders the next trigger with the machine's props merged under the caller's.
+ *
+ * @param props - The trigger's name and the props of a `Button`.
+ * @returns The `button` element.
+ */
+declare function NextTrigger({ label, ...rest }: NextTriggerProps): ReactElement;
+//#endregion
+//#region src/carousel/prev-trigger.d.ts
+/**
+ * Describes the props of the previous trigger: its accessible name and the props of a `Button`.
+ */
+interface PrevTriggerProps extends ButtonProps {
+  /**
+   * Accessible name of the trigger, "Previous slide" unless the caller passes another.
+   */
+  readonly label?: string | undefined;
+}
+/**
+ * Renders the previous trigger with the machine's props merged under the caller's.
+ *
+ * @param props - The trigger's name and the props of a `Button`.
+ * @returns The `button` element.
+ */
+declare function PrevTrigger({ label, ...rest }: PrevTriggerProps): ReactElement;
+//#endregion
+//#region src/carousel/progress-text.d.ts
+/**
+ * Renders the `span` with the carousel's progress text class.
+ */
+declare const Drawn$7: import("@stealthscale/theme").StyledComponent<"span", {}>;
+/**
+ * Describes the props of the progress text: its words and the props of a `span` without children.
+ */
+interface ProgressTextProps extends Omit<ComponentProps<typeof Drawn$7>, "children"> {
+  /**
+   * Returns the text from the current page and the number of pages, both counted from one.
+   */
+  readonly text?: ((details: ProgressTextDetails) => string) | undefined;
+}
+/**
+ * Renders the progress text.
+ *
+ * @param props - The words and the props of a `span`.
+ * @returns The `span` element.
+ */
+declare function ProgressText({ text, ...rest }: ProgressTextProps): ReactElement;
+//#endregion
+//#region src/carousel/machine.d.ts
+/**
+ * Describes the machine settings the root passes to the machine.
+ *
+ * @remarks
+ *   `translations` is left out, because a component's words are props: each trigger, dot and slide
+ *   takes its own label. The root's props require `slideCount`.
+ */
+type CarouselOptions = Omit<Partial<carousel.Props>, "translations">;
+//#endregion
+//#region src/carousel/root.d.ts
+/**
+ * Renders the `div` that provides the recipe's variants.
+ */
+declare const Framed$1: import("@stealthscale/theme").StyledComponent<"div", {
+  readonly controls?: "outside" | "overlay";
+  readonly palette?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning";
+  readonly radius?: "l1" | "l2" | "l3";
+  readonly ratio?: import("@stealthscale/theme/authoring").Ratio;
+}>;
+/**
+ * Describes the props of the root: the machine's options with the number of slides, the recipe's
+ * variants and the props of a `div`.
+ *
+ * @remarks
+ *   The element's `dir`, `id`, `padding` and `page` are left out, because the machine takes all
+ *   four. `padding` and `page` are otherwise the CSS properties of those names.
+ */
+type RootProps$1 = CarouselOptions & Omit<ComponentProps<typeof Framed$1>, "dir" | "id" | "padding" | "page"> & Pick<Props, "slideCount">;
+/**
+ * Renders the root and provides the running machine, the rotation and the motion setting to the
+ * parts.
+ *
+ * @param props - The machine's options, the recipe's variants and the props of a `div`.
+ * @returns The `div` element inside the provider.
+ */
+declare function Root$1({ autoplay, controls, loop, spacing, ...props }: RootProps$1): ReactElement;
+declare namespace index_d_exports$1 {
+  export { AutoplayIndicator, AutoplayIndicatorProps, AutoplayStatusDetails, AutoplayTrigger, AutoplayTriggerProps, Control, ControlProps, DragStatusDetails, Indicator, IndicatorGroup, IndicatorGroupProps, IndicatorProps, Indicators, IndicatorsProps, Item, ItemGroup, ItemGroupProps, ItemProps$1 as ItemProps, NextTrigger, NextTriggerProps, PageChangeDetails, PrevTrigger, PrevTriggerProps, ProgressText, ProgressTextDetails$1 as ProgressTextDetails, ProgressTextProps, Root$1 as Root, RootProps$1 as RootProps };
+}
+//#endregion
+//#region src/iframe/iframe.d.ts
+/**
+ * Renders the `iframe` element with the recipe's class.
+ */
+declare const Drawn$6: import("@stealthscale/theme").StyledComponent<"iframe", {
+  readonly radius?: "l1" | "l2" | "l3";
+  readonly ratio?: import("@stealthscale/theme/authoring").Ratio;
+}>;
+/**
+ * Describes the props of `Iframe`: the props of an `iframe` element, with `title` required.
+ */
+interface IframeProps extends Omit<ComponentProps<typeof Drawn$6>, "title"> {
+  /**
+   * Accessible name of the frame: what it shows, such as "Preview of the March invoice email", for
+   * a reader who cannot see it.
+   */
+  readonly title: string;
+}
+/**
+ * Renders the frame with the sandbox, the referrer policy and the lazy loading it defaults to.
+ *
+ * @param props - The props of an `iframe` element, with `title` required.
+ * @returns The `iframe` element.
+ */
+export declare function Iframe({ loading, referrerPolicy, sandbox, ...rest }: IframeProps): ReactElement;
+//#endregion
+//#region src/image-cropper/grid.d.ts
+/**
+ * Renders the `div` with the image cropper's grid class.
+ */
+declare const Drawn$5: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the grid: its axis and the props of a `div`.
+ */
+interface GridProps extends ComponentProps<typeof Drawn$5> {
+  /**
+   * Axis the two lines run along.
+   */
+  readonly axis: "horizontal" | "vertical";
+}
+/**
+ * Renders the grid with the machine's grid props merged over the caller's.
+ *
+ * @param props - The axis and the props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Grid({ axis, ...props }: GridProps): ReactElement;
+//#endregion
+//#region src/image-cropper/handle.d.ts
+/**
+ * Renders the `div` with the image cropper's handle class.
+ */
+declare const Drawn$4: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of a handle: its position and the props of a `div`.
+ */
+interface HandleProps extends Omit<ComponentProps<typeof Drawn$4>, "position"> {
+  /**
+   * Edge or corner of the selection the handle resizes, as a compass point.
+   */
+  readonly position: HandlePosition;
+}
+/**
+ * Renders the handle with the machine's handle props merged over the caller's.
+ *
+ * @param props - The position and the props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Handle({ position, ...props }: HandleProps): ReactElement;
+//#endregion
+//#region src/image-cropper/image.d.ts
+/**
+ * Renders the `img` with the image cropper's image class.
+ */
+declare const Drawn$3: import("@stealthscale/theme").StyledComponent<"img", {}>;
+/**
+ * Describes the props of the picture: the props of an `img`.
+ */
+type ImageProps = ComponentProps<typeof Drawn$3>;
+/**
+ * Renders the picture with the machine's image props merged over the caller's.
+ *
+ * @param props - The props of an `img`, the source among them.
+ * @returns The `img` element.
+ */
+declare function Image(props: ImageProps): ReactElement;
+//#endregion
+//#region src/image-cropper/machine.d.ts
+/**
+ * Describes the api `useImageCropper` returns: the crop, the transforms, their setters, the export
+ * and a prop getter per part.
+ *
+ * @remarks
+ *   The type is the return type of `connect`, so it follows the installed machine version. That
+ *   type references `@zag-js/types`, so the package declares that package as a dependency.
+ */
+type ImageCropperApi = ReturnType<typeof imageCropper.connect>;
+/**
+ * Describes the machine settings a caller passes to `useImageCropper`, all optional.
+ */
+type ImageCropperOptions = Omit<Partial<imageCropper.Props>, "translations">;
+/**
+ * Starts the image cropper machine and returns its connected api.
+ *
+ * @param options - The machine settings. A generated id is used when `id` is absent.
+ * @returns The api the root provides to its parts.
+ */
+declare function useImageCropper(options?: ImageCropperOptions): ImageCropperApi;
+//#endregion
+//#region src/image-cropper/rounded.d.ts
+/**
+ * Rounds the crop the machine reports to whole pixels, as the words a screen reader hears use it.
+ */
+/**
+ * Describes a crop in the viewport's pixels.
+ */
+interface Crop {
+  /**
+   * Height of the crop.
+   */
+  readonly height: number;
+  /**
+   * Width of the crop.
+   */
+  readonly width: number;
+  /**
+   * Distance of the crop from the viewport's left edge.
+   */
+  readonly x: number;
+  /**
+   * Distance of the crop from the viewport's top edge.
+   */
+  readonly y: number;
+}
+//#endregion
+//#region src/image-cropper/root.d.ts
+/**
+ * Renders the `div` that provides the recipe's variants.
+ */
+declare const Framed: import("@stealthscale/theme").StyledComponent<"div", {
+  readonly radius?: "l1" | "l2" | "l3";
+}>;
+/**
+ * Describes what `description` receives: the crop in whole pixels, the zoom and the rotation.
+ */
+interface DescriptionDetails {
+  /**
+   * The crop in the viewport's pixels.
+   */
+  readonly crop: Crop;
+  /**
+   * Rotation of the picture in degrees.
+   */
+  readonly rotation: number;
+  /**
+   * Zoom factor of the picture.
+   */
+  readonly zoom: number;
+}
+/**
+ * Describes the props of the root: the api, the description's words, the recipe's variants and
+ * the props of a `div`.
+ */
+interface RootProps extends ComponentProps<typeof Framed> {
+  /**
+   * Api `useImageCropper` returns.
+   */
+  readonly cropper: ImageCropperApi;
+  /**
+   * Returns the description a screen reader hears once the picture has loaded. Defaults to the
+   * machine's English.
+   */
+  readonly description?: ((details: DescriptionDetails) => string) | undefined;
+  /**
+   * Description a screen reader hears while the picture loads. Defaults to the machine's English.
+   */
+  readonly loadingDescription?: string | undefined;
+}
+/**
+ * Renders the root with the machine's root props, and provides the api to the parts.
+ *
+ * @param props - The api, the description's words, the recipe's variants and the props of a
+ *   `div`.
+ * @returns The `div` element inside the api provider.
+ */
+declare function Root({ cropper, description, loadingDescription, ...props }: RootProps): ReactElement;
+//#endregion
+//#region src/image-cropper/selection.d.ts
+/**
+ * Renders the `div` with the image cropper's selection class.
+ */
+declare const Drawn$2: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the selection: the value text's words and the props of a `div`.
+ */
+interface SelectionProps extends ComponentProps<typeof Drawn$2> {
+  /**
+   * Returns the value text a screen reader hears from the crop in whole pixels. Defaults to the
+   * machine's English.
+   */
+  readonly valueText?: ((crop: Crop) => string) | undefined;
+}
+/**
+ * Renders the selection with the machine's selection props, the value text and the caller's props.
+ *
+ * @param props - The value text's words and the props of a `div`, the handles and grid among its
+ *   children.
+ * @returns The `div` element.
+ */
+declare function Selection({ valueText, ...props }: SelectionProps): ReactElement;
+//#endregion
+//#region src/image-cropper/viewport.d.ts
+/**
+ * Renders the `div` with the image cropper's viewport class.
+ */
+declare const Drawn$1: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the viewport: the props of a `div`.
+ */
+type ViewportProps = ComponentProps<typeof Drawn$1>;
+/**
+ * Renders the viewport with the machine's viewport props merged over the caller's.
+ *
+ * @param props - The props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Viewport(props: ViewportProps): ReactElement;
+declare namespace index_d_exports$2 {
+  export { Crop, CropChangeDetails, CropData, DescriptionDetails, FlipChangeDetails, FlipState, GetCroppedImageOptions, Grid, GridProps, Handle, HandlePosition$1 as HandlePosition, HandleProps, Image, ImageCropperApi, ImageCropperOptions, ImageProps, Root, RootProps, RotationChangeDetails, Selection, SelectionProps, Viewport, ViewportProps, ZoomChangeDetails, handles, useImageCropper };
+}
+//#endregion
+//#region src/video/context.d.ts
+/**
+ * Binds the video recipe to React.
+ *
+ * @remarks
+ *   The binding is a separate module from the recipe, because the theme compiler imports the recipe
+ *   at build time and must not load the React runtime.
+ */
+/**
+ * Creates the video recipe's `withContext` binding and its `PropsProvider`.
+ *
+ * @remarks
+ *   `PropsProvider` sets variants on every video below it. The package exports it as
+ *   `VideoPropsProvider`.
+ */
+declare const PropsProvider: import("react").Provider<import("@stealthscale/theme").DataAttrs & Partial<{
+  readonly fit?: "contain" | "cover";
+  readonly radius?: import("@stealthscale/theme/authoring").Corner;
+  readonly ratio?: import("@stealthscale/theme/authoring").Ratio;
+}>>, withContext: <Tag extends import("react").ElementType>(Component: Tag, options?: import("@stealthscale/theme").JsxFactoryOptions<import("@stealthscale/theme").ComponentProps<Tag> & Partial<{
+  readonly fit?: "contain" | "cover";
+  readonly radius?: import("@stealthscale/theme/authoring").Corner;
+  readonly ratio?: import("@stealthscale/theme/authoring").Ratio;
+}>> | undefined) => import("@stealthscale/theme").StyledComponent<Tag, {
+  readonly fit?: "contain" | "cover";
+  readonly radius?: import("@stealthscale/theme/authoring").Corner;
+  readonly ratio?: import("@stealthscale/theme/authoring").Ratio;
+}>;
+//#endregion
+//#region src/video/video.d.ts
+/**
+ * Renders a `video` element with the classes of the video recipe.
+ */
+declare const Drawn: import("@stealthscale/theme").StyledComponent<"video", {
+  readonly fit?: "contain" | "cover";
+  readonly radius?: import("@stealthscale/theme/authoring").Corner;
+  readonly ratio?: import("@stealthscale/theme/authoring").Ratio;
+}>;
+/**
+ * Describes the props of Video: the recipe's variants and the props of a `video` element.
+ */
+type VideoProps = ComponentProps<typeof Drawn>;
+/**
+ * Renders the video, starting it by itself only while the reader allows motion.
+ *
+ * @param props - The recipe's variants and the props of a `video` element.
+ * @returns The `video` element.
+ */
+export declare function Video({ autoPlay, controls, muted, playsInline, ...rest }: VideoProps): ReactElement;
+//#endregion
+export { type AudioProps, index_d_exports as Avatar, index_d_exports$1 as Carousel, type IframeProps, index_d_exports$2 as ImageCropper, type VideoProps, PropsProvider as VideoPropsProvider };