@wix/editor-react-types 1.0.1 → 1.0.14

package/src/image.ts

@@ -7,23 +7,39 @@ type Crop = Point & {
     height: number
 }
 
+/**
+ * An image from Wix Media.
+ *
+ * @example
+ * ```tsx
+ * import type { Image } from '@wix/editor-react-types';
+ *
+ * interface MyComponentProps {
+ *   image?: Image;
+ * }
+ *
+ * const MyComponent = ({ image }: MyComponentProps) => (
+ *   <img src={image?.url} alt={image?.alt} />
+ * );
+ * ```
+ */
 export type Image = {
-    // The image URI.
+    /** The image URI. */
     uri?: string
-    // The image resolved URL.
+    /** The image URL. */
     url: string
-    // The image name.
+    /** The image file name. */
     name?: string
-    // The image height.
+    /** The image height in pixels. */
     height?: number
-    // The image width.
+    /** The image width in pixels. */
     width?: number
-    // Whether the image is animated.
+    /** Whether the image is animated (e.g. GIF). */
     animated?: boolean
-    // The image crop.
+    /** The crop region applied to the image. */
     crop?: Crop
-    // The image quality.
+    /** The image quality, as a percentage from 0 to 100. */
     quality?: number
-    // The image alt text.
+    /** The image alt text for accessibility. */
     alt?: string
 }

package/src/index.ts

@@ -3,8 +3,8 @@ export type { Image } from './image'
 export type { Video, VideoSource, AdaptiveVideoSource, VideoSourceType } from './video'
 export type { VectorArt } from './vectorArt'
 export type { A11y } from './a11y'
-export type { Audio } from './audio'
-export type { BuilderAudio, AudioSource } from './builderAudio'
+export type { Audio, AudioSource } from './audio'
+export type { BuilderAudio } from './builderAudio'
 export type { MenuItems, MenuItem } from './menuItems'
 export type { Wix } from './wix'
 export type {

package/src/links.ts

@@ -1,10 +1,26 @@
 type LinkTarget = '_self' | '_blank'
 
+/**
+ * A link to a URL, used for navigation within components.
+ *
+ * @example
+ * ```tsx
+ * import type { Link } from '@wix/editor-react-types';
+ *
+ * interface MyComponentProps {
+ *   link?: Link;
+ * }
+ * ```
+ */
 export type Link = {
-    // The link URL.
+    /** The link URL. */
     href?: string
-    // Where this link should open, supports _self and _blank. _self means same page, _blank means new page.
+    /**
+     * Where this link should open.
+     * - `'_self'` — opens in the same page.
+     * - `'_blank'` — opens in a new tab.
+     */
     target?: LinkTarget
-    // The rel of link
-    rel?: string // LinkRel values separated by space
+    /** The `rel` attribute of the link. Accepts LinkRel values separated by a space. */
+    rel?: string
 }

package/src/menuItems.ts

@@ -1,15 +1,32 @@
 import type { ReactElement } from 'react'
 import type { Link } from './links'
 
+/**
+ * A single item in a menu, optionally containing nested sub-items.
+ */
 export type MenuItem = {
-    // Menu item ID.
+    /** A unique identifier for the menu item. */
     id: string
-    // Menu item label.
+    /** The display label shown to the user. */
     label: string
-    // Menu item link.
+    /** The navigation link for this menu item. */
     link?: Link
+    /** An optional container element rendered alongside the menu item. */
     container?: ReactElement
+    /** Nested child menu items, for building multi-level menus. */
     items?: Array<MenuItem>
 }
 
+/**
+ * A list of menu items.
+ *
+ * @example
+ * ```tsx
+ * import type { MenuItems } from '@wix/editor-react-types';
+ *
+ * interface MyComponentProps {
+ *   items?: MenuItems;
+ * }
+ * ```
+ */
 export type MenuItems = Array<MenuItem>

package/src/vectorArt.ts

@@ -1,14 +1,33 @@
+/**
+ * A vector art (SVG) asset from Wix Media.
+ *
+ * @example
+ * ```tsx
+ * import type { VectorArt } from '@wix/editor-react-types';
+ *
+ * interface MyComponentProps {
+ *   icon?: VectorArt;
+ * }
+ * ```
+ */
 export type VectorArt = {
-    // The SVG URI.
+    /** The SVG URI. */
     uri: string
-    // The SVG viewbox.
+    /** The SVG `viewBox` attribute value. */
     viewBox: string
-    // The SVG content box.
+    /** The SVG content box dimensions. */
     contentBox: string
-    // The SVG colors.
+    /** A map of color IDs to their resolved color values, for themeable SVGs. */
     colors: Record<string, string>
-    // The SVG content type.
+    /**
+     * The SVG content type, which determines how colors and theming are applied.
+     * - `'shape'` — a simple monochromatic shape.
+     * - `'color'` — a multi-color SVG.
+     * - `'tint'` — a single-color tintable SVG.
+     * - `'ugc'` — user-generated content.
+     * - `'textpath'` — text along a path.
+     */
     contentType: 'shape' | 'color' | 'tint' | 'ugc' | 'textpath'
-    // The SVG content.
+    /** The raw SVG markup. */
     svgContent: string
 }

package/src/video.ts

@@ -1,44 +1,60 @@
 import type { Image } from './image'
 
+/** A single video file format for a given quality level. */
 export type VideoSourceType = {
-    // The video format.
+    /** The video format. */
     format: 'mp4' | 'mp4-luminance'
-    // The video URI.
+    /** The video URI. */
     uri: string
-    // The video resolved URL.
+    /** The fully resolved video URL. */
     url: string
 }
 
+/** An adaptive streaming video source (HLS or DASH). */
 export type AdaptiveVideoSource = {
-    // The video format.
+    /** The adaptive streaming format. */
     format: 'hls' | 'dash'
-    // The video URI.
+    /** The video URI. */
     uri: string
-    // The video resolved URL.
+    /** The fully resolved video URL. */
     url: string
 }
 
+/** A set of video files for a specific quality level. */
 export type VideoSource = {
-    // The video quality.
+    /** The video quality level. */
     quality: '1080p' | '720p' | '480p' | '360p'
-    // The video width.
+    /** The video width in pixels at this quality level. */
     width: number
-    // The video height.
+    /** The video height in pixels at this quality level. */
     height: number
-    // The video types.
+    /** The available file types for this quality level. */
     types: Array<VideoSourceType>
 }
 
+/**
+ * A video from Wix Media, including all available sources and quality levels.
+ *
+ * @example
+ * ```tsx
+ * import type { Video } from '@wix/editor-react-types';
+ *
+ * interface MyComponentProps {
+ *   video?: Video;
+ * }
+ * ```
+ */
 export type Video = {
-    uri: string // original uri
-    // The video sources.
+    /** The original video URI. */
+    uri: string
+    /** All available quality-level sources for progressive playback. */
     sources: Array<VideoSource>
-    // The video adaptive sources.
+    /** Adaptive streaming sources (HLS/DASH) for streaming playback. */
     adaptiveSources: Array<AdaptiveVideoSource>
-    // Whether the video has audio.
+    /** Whether the video contains an audio track. */
     hasAudio: boolean
-    // The video frames per second.
+    /** The video frame rate in frames per second. */
     fps: number
-    // The video poster image.
+    /** A poster image to display before the video plays. */
     poster?: Image
 }

package/src/wix.ts

@@ -1,5 +1,33 @@
 type REMOVED = 'REMOVED'
+
+/**
+ * Wix framework props.
+ *
+ * @example
+ * ```tsx
+ * import type { Wix } from '@wix/editor-react-types';
+ *
+ * interface MyComponentProps {
+ *   className: string;
+ *   wix?: Wix;
+ * }
+ *
+ * const MyComponent = ({ className, wix }: MyComponentProps) => (
+ *   <div {...wix?.presetsWrapperProps}>
+ *     <div className={className}>...</div>
+ *   </div>
+ * );
+ * ```
+ */
 export interface Wix {
+    /**
+     * Tracks which removable elements have been removed by the Wix user.
+     * Keys are element keys (as defined in the manifest), values are `'REMOVED'`.
+     */
     elementsRemovalState: Record<string, REMOVED>
+    /**
+     * Props to spread onto the outermost wrapper element when using presets.
+     * Required for the preset picker to work correctly in the editor.
+     */
     presetsWrapperProps?: { className: string }
 }