fit-ui 2.10.13 → 2.11.0

package/dist/Resources/CKEditor/styles.js

@@ -1,137 +1,137 @@
-/**
- * Copyright (c) 2003-2022, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
-
-// This file contains style definitions that can be used by CKEditor plugins.
-//
-// The most common use for it is the "stylescombo" plugin which shows the Styles drop-down
-// list containing all styles in the editor toolbar. Other plugins, like
-// the "div" plugin, use a subset of the styles for their features.
-//
-// If you do not have plugins that depend on this file in your editor build, you can simply
-// ignore it. Otherwise it is strongly recommended to customize this file to match your
-// website requirements and design properly.
-//
-// For more information refer to: https://ckeditor.com/docs/ckeditor4/latest/guide/dev_styles.html#style-rules
-
-CKEDITOR.stylesSet.add( 'default', [
-	/* Block styles */
-
-	// These styles are already available in the "Format" drop-down list ("format" plugin),
-	// so they are not needed here by default. You may enable them to avoid
-	// placing the "Format" combo in the toolbar, maintaining the same features.
-	/*
-	{ name: 'Paragraph',		element: 'p' },
-	{ name: 'Heading 1',		element: 'h1' },
-	{ name: 'Heading 2',		element: 'h2' },
-	{ name: 'Heading 3',		element: 'h3' },
-	{ name: 'Heading 4',		element: 'h4' },
-	{ name: 'Heading 5',		element: 'h5' },
-	{ name: 'Heading 6',		element: 'h6' },
-	{ name: 'Preformatted Text',element: 'pre' },
-	{ name: 'Address',			element: 'address' },
-	*/
-
-	{ name: 'Italic Title',		element: 'h2', styles: { 'font-style': 'italic' } },
-	{ name: 'Subtitle',			element: 'h3', styles: { 'color': '#aaa', 'font-style': 'italic' } },
-	{
-		name: 'Special Container',
-		element: 'div',
-		styles: {
-			padding: '5px 10px',
-			background: '#eee',
-			border: '1px solid #ccc'
-		}
-	},
-
-	/* Inline styles */
-
-	// These are core styles available as toolbar buttons. You may opt enabling
-	// some of them in the Styles drop-down list, removing them from the toolbar.
-	// (This requires the "stylescombo" plugin.)
-	/*
-	{ name: 'Strong',			element: 'strong', overrides: 'b' },
-	{ name: 'Emphasis',			element: 'em'	, overrides: 'i' },
-	{ name: 'Underline',		element: 'u' },
-	{ name: 'Strikethrough',	element: 'strike' },
-	{ name: 'Subscript',		element: 'sub' },
-	{ name: 'Superscript',		element: 'sup' },
-	*/
-
-	{ name: 'Marker',			element: 'span', attributes: { 'class': 'marker' } },
-
-	{ name: 'Big',				element: 'big' },
-	{ name: 'Small',			element: 'small' },
-	{ name: 'Typewriter',		element: 'tt' },
-
-	{ name: 'Computer Code',	element: 'code' },
-	{ name: 'Keyboard Phrase',	element: 'kbd' },
-	{ name: 'Sample Text',		element: 'samp' },
-	{ name: 'Variable',			element: 'var' },
-
-	{ name: 'Deleted Text',		element: 'del' },
-	{ name: 'Inserted Text',	element: 'ins' },
-
-	{ name: 'Cited Work',		element: 'cite' },
-	{ name: 'Inline Quotation',	element: 'q' },
-
-	{ name: 'Language: RTL',	element: 'span', attributes: { 'dir': 'rtl' } },
-	{ name: 'Language: LTR',	element: 'span', attributes: { 'dir': 'ltr' } },
-
-	/* Object styles */
-
-	{
-		name: 'Styled Image (left)',
-		element: 'img',
-		attributes: { 'class': 'left' }
-	},
-
-	{
-		name: 'Styled Image (right)',
-		element: 'img',
-		attributes: { 'class': 'right' }
-	},
-
-	{
-		name: 'Compact Table',
-		element: 'table',
-		attributes: {
-			cellpadding: '5',
-			cellspacing: '0',
-			border: '1',
-			bordercolor: '#ccc'
-		},
-		styles: {
-			'border-collapse': 'collapse'
-		}
-	},
-
-	{ name: 'Borderless Table',		element: 'table',	styles: { 'border-style': 'hidden', 'background-color': '#E6E6FA' } },
-	{ name: 'Square Bulleted List',	element: 'ul',		styles: { 'list-style-type': 'square' } },
-
-	/* Widget styles */
-
-	{ name: 'Clean Image', type: 'widget', widget: 'image', attributes: { 'class': 'image-clean' } },
-	{ name: 'Grayscale Image', type: 'widget', widget: 'image', attributes: { 'class': 'image-grayscale' } },
-
-	{ name: 'Featured Snippet', type: 'widget', widget: 'codeSnippet', attributes: { 'class': 'code-featured' } },
-
-	{ name: 'Featured Formula', type: 'widget', widget: 'mathjax', attributes: { 'class': 'math-featured' } },
-
-	{ name: '240p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-240p' }, group: 'size' },
-	{ name: '360p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-360p' }, group: 'size' },
-	{ name: '480p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-480p' }, group: 'size' },
-	{ name: '720p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-720p' }, group: 'size' },
-	{ name: '1080p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-1080p' }, group: 'size' },
-
-	// Adding space after the style name is an intended workaround. For now, there
-	// is no option to create two styles with the same name for different widget types. See https://dev.ckeditor.com/ticket/16664.
-	{ name: '240p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-240p' }, group: 'size' },
-	{ name: '360p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-360p' }, group: 'size' },
-	{ name: '480p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-480p' }, group: 'size' },
-	{ name: '720p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-720p' }, group: 'size' },
-	{ name: '1080p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-1080p' }, group: 'size' }
-
-] );
-
+/**
+ * Copyright (c) 2003-2022, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+// This file contains style definitions that can be used by CKEditor plugins.
+//
+// The most common use for it is the "stylescombo" plugin which shows the Styles drop-down
+// list containing all styles in the editor toolbar. Other plugins, like
+// the "div" plugin, use a subset of the styles for their features.
+//
+// If you do not have plugins that depend on this file in your editor build, you can simply
+// ignore it. Otherwise it is strongly recommended to customize this file to match your
+// website requirements and design properly.
+//
+// For more information refer to: https://ckeditor.com/docs/ckeditor4/latest/guide/dev_styles.html#style-rules
+
+CKEDITOR.stylesSet.add( 'default', [
+	/* Block styles */
+
+	// These styles are already available in the "Format" drop-down list ("format" plugin),
+	// so they are not needed here by default. You may enable them to avoid
+	// placing the "Format" combo in the toolbar, maintaining the same features.
+	/*
+	{ name: 'Paragraph',		element: 'p' },
+	{ name: 'Heading 1',		element: 'h1' },
+	{ name: 'Heading 2',		element: 'h2' },
+	{ name: 'Heading 3',		element: 'h3' },
+	{ name: 'Heading 4',		element: 'h4' },
+	{ name: 'Heading 5',		element: 'h5' },
+	{ name: 'Heading 6',		element: 'h6' },
+	{ name: 'Preformatted Text',element: 'pre' },
+	{ name: 'Address',			element: 'address' },
+	*/
+
+	{ name: 'Italic Title',		element: 'h2', styles: { 'font-style': 'italic' } },
+	{ name: 'Subtitle',			element: 'h3', styles: { 'color': '#aaa', 'font-style': 'italic' } },
+	{
+		name: 'Special Container',
+		element: 'div',
+		styles: {
+			padding: '5px 10px',
+			background: '#eee',
+			border: '1px solid #ccc'
+		}
+	},
+
+	/* Inline styles */
+
+	// These are core styles available as toolbar buttons. You may opt enabling
+	// some of them in the Styles drop-down list, removing them from the toolbar.
+	// (This requires the "stylescombo" plugin.)
+	/*
+	{ name: 'Strong',			element: 'strong', overrides: 'b' },
+	{ name: 'Emphasis',			element: 'em'	, overrides: 'i' },
+	{ name: 'Underline',		element: 'u' },
+	{ name: 'Strikethrough',	element: 'strike' },
+	{ name: 'Subscript',		element: 'sub' },
+	{ name: 'Superscript',		element: 'sup' },
+	*/
+
+	{ name: 'Marker',			element: 'span', attributes: { 'class': 'marker' } },
+
+	{ name: 'Big',				element: 'big' },
+	{ name: 'Small',			element: 'small' },
+	{ name: 'Typewriter',		element: 'tt' },
+
+	{ name: 'Computer Code',	element: 'code' },
+	{ name: 'Keyboard Phrase',	element: 'kbd' },
+	{ name: 'Sample Text',		element: 'samp' },
+	{ name: 'Variable',			element: 'var' },
+
+	{ name: 'Deleted Text',		element: 'del' },
+	{ name: 'Inserted Text',	element: 'ins' },
+
+	{ name: 'Cited Work',		element: 'cite' },
+	{ name: 'Inline Quotation',	element: 'q' },
+
+	{ name: 'Language: RTL',	element: 'span', attributes: { 'dir': 'rtl' } },
+	{ name: 'Language: LTR',	element: 'span', attributes: { 'dir': 'ltr' } },
+
+	/* Object styles */
+
+	{
+		name: 'Styled Image (left)',
+		element: 'img',
+		attributes: { 'class': 'left' }
+	},
+
+	{
+		name: 'Styled Image (right)',
+		element: 'img',
+		attributes: { 'class': 'right' }
+	},
+
+	{
+		name: 'Compact Table',
+		element: 'table',
+		attributes: {
+			cellpadding: '5',
+			cellspacing: '0',
+			border: '1',
+			bordercolor: '#ccc'
+		},
+		styles: {
+			'border-collapse': 'collapse'
+		}
+	},
+
+	{ name: 'Borderless Table',		element: 'table',	styles: { 'border-style': 'hidden', 'background-color': '#E6E6FA' } },
+	{ name: 'Square Bulleted List',	element: 'ul',		styles: { 'list-style-type': 'square' } },
+
+	/* Widget styles */
+
+	{ name: 'Clean Image', type: 'widget', widget: 'image', attributes: { 'class': 'image-clean' } },
+	{ name: 'Grayscale Image', type: 'widget', widget: 'image', attributes: { 'class': 'image-grayscale' } },
+
+	{ name: 'Featured Snippet', type: 'widget', widget: 'codeSnippet', attributes: { 'class': 'code-featured' } },
+
+	{ name: 'Featured Formula', type: 'widget', widget: 'mathjax', attributes: { 'class': 'math-featured' } },
+
+	{ name: '240p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-240p' }, group: 'size' },
+	{ name: '360p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-360p' }, group: 'size' },
+	{ name: '480p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-480p' }, group: 'size' },
+	{ name: '720p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-720p' }, group: 'size' },
+	{ name: '1080p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-1080p' }, group: 'size' },
+
+	// Adding space after the style name is an intended workaround. For now, there
+	// is no option to create two styles with the same name for different widget types. See https://dev.ckeditor.com/ticket/16664.
+	{ name: '240p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-240p' }, group: 'size' },
+	{ name: '360p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-360p' }, group: 'size' },
+	{ name: '480p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-480p' }, group: 'size' },
+	{ name: '720p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-720p' }, group: 'size' },
+	{ name: '1080p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-1080p' }, group: 'size' }
+
+] );
+

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fit-ui",
-  "version": "2.10.13",
+  "version": "2.11.0",
   "title": "Fit.UI",
   "description": "Object Oriented framework for building rich User Interfaces",
   "main": "dist/Fit.UI.js",

package/types/index.d.ts

@@ -670,8 +670,10 @@ declare namespace Fit
 	{
 		// Functions defined by Fit.Browser
 		/**
-		* Returns name of browser. Possible values are: Chrome (which also covers modern versions of Opera and Edge),
-		Safari, Edge (version 12-18), MSIE (version 8-11), Firefox, Opera (version 1-12), Unknown.
+		* Returns name of browser useful for adjusting behaviour based on render engine.
+		Possible values are: Chrome (both WebKit and Blink based - also returned for modern versions of
+		Opera and Edge), Safari (also returned for Edge, Chrome, Opera, and Firefox on iOS), Edge (version 12-18),
+		MSIE (version 8-11), Firefox, Opera (version 1-12), and Unknown.
 		* @function GetBrowser
 		* @static
 		* @param {false} [returnAppId=false] - Set True to have app specific identifier returned.
@@ -679,14 +681,20 @@ declare namespace Fit
 		*/
 		public static GetBrowser(returnAppId?:false):"Edge" | "Chrome" | "Safari" | "MSIE" | "Firefox" | "Opera" | "Unknown";
 		/**
-		* Returns browser app identifer. Possible values are: Chrome, Safari, Edge (version 12-18), EdgeChromium (version 85+),
-		MSIE (version 8-11), Firefox, Opera (version 1-12), OperaChromium (version 15+), Unknown.
+		* Returns browser app name useful for adjusting behaviour based on actual
+		application, regardless of render engine and platform. Possible values are:
+		Chrome (both Webkit and Blink based), Safari, Edge (both legacy and modern),
+		MSIE (version 8-11), Firefox, Opera (both legacy and modern), and Unknown.
+		Be careful not to check against browser app name and app version alone.
+		For instance Opera 3 on a touch device is newer than Opera 60 on a Desktop
+		device, as they are two completely different browsers. Check whether the browser runs on
+		a tablet or phone using e.g. Fit.Browser.IsMobile(true) or Fit.Browser.GetInfo(true).IsMobile.
 		* @function GetBrowser
 		* @static
 		* @param {true} returnAppId - Set True to have app specific identifier returned.
-		* @returns "Edge" | "EdgeChromium" | "Chrome" | "Safari" | "MSIE" | "Firefox" | "Opera" | "OperaChromium" | "Unknown"
+		* @returns "Edge" | "Chrome" | "Safari" | "MSIE" | "Firefox" | "Opera" | "Unknown"
 		*/
-		public static GetBrowser(returnAppId:true):"Edge" | "EdgeChromium" | "Chrome" | "Safari" | "MSIE" | "Firefox" | "Opera" | "OperaChromium" | "Unknown";
+		public static GetBrowser(returnAppId:true):"Edge" | "Chrome" | "Safari" | "MSIE" | "Firefox" | "Opera" | "Unknown";
 		/**
 		* Get style value applied after stylesheets have been loaded.
 		An empty string or null may be returned if style has not been defined or does not exist.
@@ -824,6 +832,19 @@ declare namespace Fit
 		public static GetViewPortDimensions(includeScrollbars?:boolean):Fit.TypeDefs.Dimension;
 		/**
 		* Returns value indicating whether device is a mobile device or not.
+		Notice that some phones and tablets may identify as desktop devices,
+		in which case IsMobile(..) will return False. In this case consider
+		using Fit.Browser.IsTouchEnabled(), e.g. in combination with
+		Fit.Browser.GetBrowser(), or a check against the size of the viewport,
+		which will provide some indication as to whether device should be treated
+		as a mobile device or not. As an example, Safari on iPad identifies as
+		a Mac computer by default (it has "Request Desktop Website" enabled by default).
+		To always detect iPad and iPhone as a mobile device, no matter the configuration
+		of "Request Desktop Website"), simply use:
+		var isMobile = Fit.Browser.IsMobile(true) || (Fit.Browser.GetBrowser() === "Safari" && Fit.Browser.IsTouchEnabled())
+		We will not be able to distinguish between an iPhone and an iPad though, not even
+		by looking at the viewport size, since this approach is unreliable with high resolution
+		iPhones and support for split screen which affects the viewport size.
 		* @function IsMobile
 		* @static
 		* @param {boolean} [includeTablets=true] - Value indicating whether tablets are considered mobile devices or not.