WebAppManifest.d.ts

/** Image object for WebAppManifest */
declare interface WebAppManifestIcon {
	/** A string containing space-separated image dimensions. */
	sizes: string,
	/** The path to the image file. If src is a relative URL, the base URL will be the URL of the manifest. */
	src: string,
	/** A hint as to the media type of the image. The purpose of this member is to allow a user agent to quickly ignore images of media types it does not support. */
	type: string,
}

/** Application object for WebAppManifest */
declare interface WebAppManifestRelatedApplication {
	/** The platform on which the application can be found. E.G. `itunes`, `play` */
	platform ?: string,
	/** The URL at which the application can be found. */
	url ?: string,
	/** The ID used to represent the application on the specified platform. */
	id ?: string,
}

/**
 * Web App Manifest for Progressive Web Apps. Typings written using https://developer.mozilla.org/en-US/docs/Web/Manifest.
 * @author Benjamin Gwynn (http://xenxier.com)
 */
declare interface WebAppManifest {
	/** Defines the expected “background color” for the website. This value repeats what is already available in the site’s CSS, but can be used by browsers to draw the background color of a shortcut when the manifest is available before the stylesheet has loaded. This creates a smooth transition between launching the web application and loading the site's content. */
	"background_color" : string,

	/** Provides a general description of what the pinned website does. */
	"description" ?: string,

	/**
	 * Specifies the primary text direction for the name, short_name, and description members. Together with the lang member, it helps the correct display of right-to-left languages.
	 *
	 * It may be one of the following values: `ltr` (left-to-right) `rtl` (right-to-left) `auto` (hints to the browser to use the Unicode bidirectional algorithm to make a best guess about the text's direction.)
	 *
	 * Note: When the value is omitted, it defaults to auto.
	 */
	dir ?: "ltr" | "rtr" | "auto",

	/**
	 * Defines the developers’ preferred display mode for the website.
	 *
	 * `fullscreen`: All of the available display area is used and no user agent chrome is shown.
	 *
	 * `standalone`: The application will look and feel like a standalone application. This can include the application having a different window, its own icon in the application launcher, etc. In this mode, the user agent will exclude UI elements for controlling navigation, but can include other UI elements such as a status bar.
	 *
	 * `minimal-ui`: The application will look and feel like a standalone application, but will have a minimal set of UI elements for controlling navigation. The elements will vary by browser.
	 *
	 * `browser`: The application opens in a conventional browser tab or new window, depending on the browser and platform. This is the default.
	*/
	"display" : "fullscreen" | "standalone" | "minimal-ui" | "browser",

	/** Specifies an array of image files that can serve as application icons, depending on context. For example, they can be used to represent the web application amongst a list of other applications, or to integrate the web application with an OS's task switcher and/or system preferences. */
	"icons": WebAppManifestIcon[],

	/**
	 * Specifies the primary language for the values in the name and short_name members. This value is a string containing a single language tag.
	 * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/lang
	*/
	"lang" ?: string,

	/** Provides a human-readable name for the site when displayed to the user. For example, among a list of other applications or as a label for an icon. */
	"name": string,

	/** Defines the default orientation for all the website's top level browsing contexts. */
	"orientation" ?: "any" | "natural" | "landscape" | "landscape-primary" | "landscape-secondary" | "portrait" | "portrait-primary" | "portrait-secondary",

	/**
	 * Specifies a boolean value that hints for the user agent to indicate to the user that the specified native applications (in `related_applications`) are recommended over the website. This should only be used if the related native apps really do offer something that the website can't.
	 *
	 * Note: If omitted, the value defaults to `false`.
	 */
	"prefer_related_applications" ?: boolean

	/** An array of native applications that are installable by, or accessible to, the underlying platform — for example, a native Android application obtainable through the Google Play Store. Such applications are intended to be alternatives to the website that provides similar/equivalent functionality — like the native app version of the website. */
	"related_applications" ?: WebAppManifestRelatedApplication[],

	/**
	 * Defines the navigation scope of this website's context. This restricts what web pages can be viewed while the manifest is applied. If the user navigates outside the scope, it returns to a normal web page inside a browser tab/window.
	 *
	 * If the scope is a relative URL, the base URL will be the URL of the manifest.
	*/
	"scope": string,

	/** Provides a short human-readable name for the application. This is intended for when there is insufficient space to display the full name of the web application, like device homescreens. */
	"short_name": string,

	/** The URL that loads when a user launches the application (e.g. when added to home screen), typically the index. Note that this has to be a relative URL, relative to the manifest url. */
	"start_url": string,

	/** Defines the default theme color for an application. This sometimes affects how the OS displays the site (e.g., on Android's task switcher, the theme color surrounds the site). */
	"theme_color": string,
}