43 files changed, 449 insertions, 256 deletions

diff --git a/doc/src/declarative/advtutorial.qdoc b/doc/src/declarative/advtutorial.qdoc
index 2d05850..8f95190 100644
--- a/doc/src/declarative/advtutorial.qdoc
+++ b/doc/src/declarative/advtutorial.qdoc
@@ -109,12 +109,16 @@ Notice the anchors for the \c Item, \c Button and \c Text elements are set using
 
 \section2 Adding \c Button and \c Block components
 
-The \c Button item in the code above is defined in a separate file named \c Button.qml.
+The \c Button item in the code above is defined in a separate component file named \c Button.qml.
 To create a functional button, we use the QML elements \l Text and \l MouseArea inside a \l Rectangle.
 Here is the \c Button.qml code:
 
 \snippet declarative/tutorials/samegame/samegame1/Button.qml 0
 
+This essentially defines a rectangle that contains text and can be clicked. The \l MouseArea
+has an \c onClicked() handler that is implemented to emit the \c clicked() signal of the
+\c container when the area is clicked.
+
 In Same Game, the screen is filled with small blocks when the game begins.
 Each block is just an item that contains an image. The block
 code is defined in a separate \c Block.qml file:
@@ -174,7 +178,7 @@ The \c createBlock() function creates a block from the \c Block.qml file
 and moves the new block to its position on the game canvas. This involves several steps:
 
 \list
-\o \l {createComponent(url file)}{createComponent()} is called to generate an element from \c Block.qml.
+\o \l {Qt.createComponent(url file)}{Qt.createComponent()} is called to generate an element from \c Block.qml.
    If the component is ready, we can call \c createObject() to create an instance of the \c Block item.
 \o If \c createObject() returned null (i.e. if there was an error while
    loading the object), print the error information.
@@ -226,14 +230,14 @@ until it is won or lost.
 To do this, we have added the following functions to \c samegame.js:
 
 \list
-\o function \c{handleClick(x,y)}
-\o function \c{floodFill(xIdx,yIdx,type)}
-\o function \c{shuffleDown()}
-\o function \c{victoryCheck()}
-\o function \c{floodMoveCheck(xIdx, yIdx, type)}
+\o \c{handleClick(x,y)}
+\o \c{floodFill(xIdx,yIdx,type)}
+\o \c{shuffleDown()}
+\o \c{victoryCheck()}
+\o \c{floodMoveCheck(xIdx, yIdx, type)}
 \endlist
 
-As this is a tutorial about QML, not game design, we will only discuss \c handleClick() and \c victoryCheck() below since they interface directly with the QML elements. Note that although the game logic here is written in JavaScript, it could have been written in C++ and then exposed to JavaScript. 
+As this is a tutorial about QML, not game design, we will only discuss \c handleClick() and \c victoryCheck() below since they interface directly with the QML elements. Note that although the game logic here is written in JavaScript, it could have been written in C++ and then exposed to QML. 
 
 \section3 Enabling mouse click interaction
 
@@ -269,6 +273,8 @@ And this is how it is used in the main \c samegame.qml file:
 
 \snippet declarative/tutorials/samegame/samegame3/samegame.qml 2
 
+We give the dialog a \l {Item::z}{z} value of 100 to ensure it is displayed on top of our other components. The default \c z value for an item is 0.
+
 
 \section3 A dash of color
 
@@ -383,15 +389,41 @@ The theme change here is produced simply by replacing the block images. This can
 
 Another feature we might want to add to the game is a method of storing and retrieving high scores.
 
-In \c samegame.qml we now pop up a dialog when the game is over and requests the player's name so it can be added to a High Scores table. The dialog is created using \c Dialog.qml:
+To do this, we will show a dialog when the game is over to request the player's name and add it to a High Scores table.
+This requires a few changes to \c Dialog.qml. In addition to a \c Text element, it now has a
+\c TextInput child item for receiving keyboard text input:
+
+\snippet declarative/tutorials/samegame/samegame4/content/Dialog.qml 0
+\dots 4
+\snippet declarative/tutorials/samegame/samegame4/content/Dialog.qml 2
+\dots 4
+\snippet declarative/tutorials/samegame/samegame4/content/Dialog.qml 3
+
+We'll also add a \c showWithInput() function. The text input will only be visible if this function
+is called instead of \c show(). When the dialog is closed, it emits a \c closed() signal, and
+other elements can retrieve the text entered by the user through an \c inputText property:
+
+\snippet declarative/tutorials/samegame/samegame4/content/Dialog.qml 0
+\snippet declarative/tutorials/samegame/samegame4/content/Dialog.qml 1
+\dots 4
+\snippet declarative/tutorials/samegame/samegame4/content/Dialog.qml 3
+
+Now the dialog can be used in \c samegame.qml:
 
 \snippet declarative/tutorials/samegame/samegame4/samegame.qml 0
 
-When the dialog is closed, we call the new \c saveHighScore() function in \c samegame.js, which stores the high score locally in an SQL database and also send the score to an online database if possible. 
+When the dialog emits the \c closed signal, we call the new \c saveHighScore() function in \c samegame.js, which stores the high score locally in an SQL database and also send the score to an online database if possible. 
 
+The \c nameInputDialog is activated in the \c victoryCheck() function in \c samegame.js:
+
+\snippet declarative/tutorials/samegame/samegame4/content/samegame.js 3
+\dots 4
+\snippet declarative/tutorials/samegame/samegame4/content/samegame.js 4
 
 \section3 Storing high scores offline
 
+Now we need to implement the functionality to actually save the High Scores table.
+
 Here is the \c saveHighScore() function in \c samegame.js:
 
 \snippet declarative/tutorials/samegame/samegame4/content/samegame.js 2
@@ -436,6 +468,6 @@ By following this tutorial you've seen how you can write a fully functional appl
 \endlist
 
 There is so much more to learn about QML that we haven't been able to cover in this tutorial. Check out all the
-demos and examples and the \l {Declarative UI (QML)}{documentation} to find out all the things you can do with QML!
+demos and examples and the \l {Declarative UI Using QML}{documentation} to find out all the things you can do with QML!
 
 */
diff --git a/doc/src/declarative/animation.qdoc b/doc/src/declarative/animation.qdoc
index 88aca1b..6e98949 100644
--- a/doc/src/declarative/animation.qdoc
+++ b/doc/src/declarative/animation.qdoc
@@ -73,9 +73,9 @@ Rectangle {
         y: 0
         SequentialAnimation on y {
             loops: Animation.Infinite
-            NumberAnimation { to: 200-img.height; easing.type: "OutBounce"; duration: 2000 }
+            NumberAnimation { to: 200-img.height; easing.type: Easing.OutBounce; duration: 2000 }
             PauseAnimation { duration: 1000 }
-            NumberAnimation { to: 0; easing.type: "OutQuad"; duration: 1000 }
+            NumberAnimation { to: 0; easing.type: Easing.OutQuad; duration: 1000 }
         }
     }
 }
@@ -136,7 +136,7 @@ transitions: [
     Transition {
         NumberAnimation {
             properties: "x,y"
-            easing.type: "OutBounce"
+            easing.type: Easing.OutBounce
             duration: 200
         }
     }
@@ -157,7 +157,7 @@ Transition {
     SequentialAnimation {
         NumberAnimation {
             duration: 1000
-            easing.type: "OutBounce"
+            easing.type: Easing.OutBounce
             // animate myItem's x and y if they have changed in the state
             target: myItem
             properties: "x,y"
@@ -199,7 +199,7 @@ Transition {
         ParallelAnimation {
             NumberAnimation {
                 duration: 1000
-                easing.type: "OutBounce"
+                easing.type: Easing.OutBounce
                 targets: box1
                 properties: "x,y"
             }
@@ -227,7 +227,7 @@ Rectangle {
     id: redRect
     color: "red"
     width: 100; height: 100
-    Behavior on x { NumberAnimation { duration: 300; easing.type: "InOutQuad" } }
+    Behavior on x { NumberAnimation { duration: 300; easing.type: Easing.InOutQuad } }
 }
 \endqml
 
diff --git a/doc/src/declarative/basictypes.qdoc b/doc/src/declarative/basictypes.qdoc
index 6901947..8db1c35 100644
--- a/doc/src/declarative/basictypes.qdoc
+++ b/doc/src/declarative/basictypes.qdoc
@@ -43,9 +43,12 @@
   \page qdeclarativebasictypes.html
   \title QML Basic Types
 
-  QML uses a set of property types, which are primitive within QML.
-  These basic types are referenced throughout the documentation of the
-  QML elements. Almost all of them are exactly what you would expect.
+  QML has a set of primitive types, as listed below, that are used throughout
+  the \l {QML Elements}.
+
+  The simpler types in this list can also be used for defining a new
+  \c property in a component. See \l{Extending types from QML} for the
+  list of types that can be used for custom properties.
 
   \annotatedlist qmlbasictypes
 */
diff --git a/doc/src/declarative/codingconventions.qdoc b/doc/src/declarative/codingconventions.qdoc
index 7ca206b..d0f873d 100644
--- a/doc/src/declarative/codingconventions.qdoc
+++ b/doc/src/declarative/codingconventions.qdoc
@@ -57,7 +57,7 @@ Through our documentation and examples, QML objects are always structured in the
 \o id
 \o property declarations
 \o signal declarations
-\o javascript functions
+\o JavaScript functions
 \o object properties
 \o child objects
 \o states
@@ -102,7 +102,7 @@ we will write this:
 \snippet doc/src/snippets/declarative/codingconventions/lists.qml 1
 
 
-\section1 Javascript code
+\section1 JavaScript code
 
 If the script is a single expression, we recommend writing it inline:
 
@@ -116,7 +116,7 @@ If the script is more than a couple of lines long or can be used by different ob
 
 \snippet doc/src/snippets/declarative/codingconventions/javascript.qml 2
 
-For long scripts, we will put the functions in their own javascript file and import it like this:
+For long scripts, we will put the functions in their own JavaScript file and import it like this:
 
 \snippet doc/src/snippets/declarative/codingconventions/javascript-imports.qml 0
 
diff --git a/doc/src/declarative/dynamicobjects.qdoc b/doc/src/declarative/dynamicobjects.qdoc
index 4cb5198..2688ee5 100644
--- a/doc/src/declarative/dynamicobjects.qdoc
+++ b/doc/src/declarative/dynamicobjects.qdoc
@@ -43,84 +43,68 @@
 \page qdeclarativedynamicobjects.html
 \title Dynamic Object Management
 
-QML has some support for dynamically loading and managing QML objects from
-within Javascript blocks. It is preferable to use the existing QML elements for
-dynamic object management wherever possible; these are \l{Loader}, 
-\l{Repeater}, \l{ListView}, \l{GridView} and \l{PathView}. It is also possible 
-to dynamically create and manage objects from C++, and this is preferable for 
-hybrid QML/C++ applications - see \l{Using QML in C++ Applications}.
-Dynamically creating and managing objects from 
-within Javascript blocks is intended for when none of the existing QML elements 
-fit the needs of your application, and you do not desire for your application 
-to involve C++ code.
+QML provides a number of ways to dynamically create and manage QML objects. 
+The \l{Loader}, \l{Repeater}, \l{ListView}, \l{GridView} and \l{PathView} elements
+all support dynamic object management.  Objects can also be created and managed 
+from C++, and this is the preferred method for hybrid QML/C++ applications
+(see \l{Using QML in C++ Applications}).
+
+QML also supports the dynamic creation of objects from within JavaScript
+code. This is useful if the existing QML elements do not fit the needs of your
+application, and there are no C++ components involved.
+
 
 \section1 Creating Objects Dynamically
-There are two ways of creating objects dynamically. You can either create
-a component which instantiates items, or create an item from a string of QML.
-Creating a component is better for the situation where you have a predefined
-item which you want to manage dynamic instances of, and creating an item from
-a string of QML is intended for when the QML itself is generated at runtime.
+There are two ways to create objects dynamically from JavaScript. You can either call 
+\l {Qt.createComponent(url file)}{Qt.createComponent()} to create
+a component which instantiates items, or use \l{Qt.createQmlObject(string qml, object parent, string filepath)}{Qt.createQmlObject()}
+to create an item from a string of QML.
+Creating a component is better if you have a predefined
+item, and you want to create dynamic instances of that item; creating an item from
+a string of QML is useful when the item QML itself is generated at runtime.
 
 If you have a component specified in a QML file, you can dynamically load it with
-the \l {createComponent(url file)}{createComponent()} function on the \l{QML Global Object}. 
+the \l {Qt.createComponent(url file)}{Qt.createComponent()} function on the \l{QML Global Object}. 
 This function takes the URL of the QML file as its only argument and returns
 a component object which can be used to create and load that QML file.
 
-Once you have a component you can use its \c createObject() method to create an instance of
-the component. Example QML script is below. Remember that QML files that might be loaded
-    over the network cannot be expected to be ready immediately.
-    \code
-        var component;
-        var sprite;
-        function finishCreation() {
-            if(component.isReady()) {
-                sprite = component.createObject();
-                if(sprite == 0) {
-                    // Error Handling
-                } else {
-                    sprite.parent = page;
-                    sprite.x = 200;
-                    //...
-                }
-            } else if(component.isError()) {
-                // Error Handling
-            }
-        }
-
-        component = createComponent("Sprite.qml");
-        if(component.isReady()) {
-            finishCreation();
-        } else {
-            component.statusChanged.connect(finishCreation);
-        }
-    \endcode
-
-    If you are certain the files will be local, you could simplify to
-
-    \code
-        component = createComponent("Sprite.qml");
-        sprite = component.createObject();
-        if(sprite == 0) {
-            // Error Handling
-            console.log(component.errorsString());
-        } else {
-            sprite.parent = page;
-            sprite.x = 200;
-            //...
-        }
-    \endcode
-
-After creating the item, remember to set its parent to an item within the scene.
-Otherwise your dynamically created item will not appear in the scene. When using files with relative paths, the path should
-be relative to the file where \c createComponent() is executed.
-
-If the QML does not exist until runtime, you can create a QML item from
-a string of QML using the \l{createQmlObject(string qml, object parent, string filepath)}{createQmlObject()} function, as in the following example:
-
-    \code
-    newObject = createQmlObject('import Qt 4.7; Rectangle { color: "red"; width: 20; height: 20 }',
-        targetItem, "dynamicSnippet1");
-    \endcode
+Once you have a component you can use its \l {Component::createObject()}{createObject()} method to create an instance of
+the component. This function takes exactly one argument, which is the parent for the new item. Since graphical items will
+not appear on the scene without a parent, it is recommended that you set the parent this way. However, if you wish to set
+the parent later you can safely pass null to this function.
+
+Here is an example. Here is a \c Sprite.qml, which defines a simple QML component:
+
+\quotefile doc/src/snippets/declarative/Sprite.qml
+
+Our main application file, \c main.qml, imports a \c componentCreation.js JavaScript file
+that will create \c Sprite objects:
+
+\quotefile doc/src/snippets/declarative/createComponent.qml
+
+Here is \c componentCreation.js. Remember that QML files that might be loaded
+over the network cannot be expected to be ready immediately:
+
+\snippet doc/src/snippets/declarative/componentCreation.js 0
+\codeline
+\snippet doc/src/snippets/declarative/componentCreation.js 1
+
+If you are certain the files will be local, you could simplify to:
+
+\snippet doc/src/snippets/declarative/componentCreation.js 2
+
+Notice that once a \c Sprite object is created, its parent is set to \c appWindow (defined
+in \c main.qml). After creating an item, you must set its parent to an item within the scene.
+Otherwise your dynamically created item will not appear in the scene.
+
+When using files with relative paths, the path should
+be relative to the file where \l {Qt.createComponent(url file)}{Qt.createComponent()} is executed.
+
+If the QML component does not exist until runtime, you can create a QML item from
+a string of QML using the \l{Qt.createQmlObject(string qml, object parent, string filepath)}{Qt.createQmlObject()} function, as in the following example:
+
+\snippet doc/src/snippets/declarative/createQmlObject.qml 0
+
 The first argument is the string of QML to create. Just like in a new file, you will need to
 import any types you wish to use. For importing files with relative paths, the path should
 be relative to the file where the item in the second argument is defined. Remember to set the parent after
@@ -130,47 +114,44 @@ item, which is used for error reporting.
 
 \section1 Maintaining Dynamically Created Objects
 
-Dynamically created objects may be used the same as other objects, however they
-will not have an id in QML.
+When managing dynamically created items, you must ensure the creation context
+outlives the created item. Otherwise, if the creation context is destroyed first,
+the bindings in the dynamic item will no longer work.
+
+The actual creation context depends on how an item is created:
+
+\list
+\o If \l {Qt.createComponent(url file)}{Qt.createComponent()} is used, the creation context
+   is the QDeclarativeContext in which this method is called
+\o If \l{Qt.createQmlObject(string qml, object parent, string filepath)}{Qt.createQmlObject()}
+   if called, it is the context of the item used as the second argument to this method
+\o If a \c {Component{}} item is defined and \l {Component::createObject()}{createObject()}
+   is called on that item, it is the context in which the \c Component is defined
+\endlist
+
+Also, note that while dynamically created objects may be used the same as other objects, they
+do not have an id in QML.
 
-A restriction which you need to manage with dynamically created items,
-is that the creation context must outlive the
-created item. The creation context is the QDeclarativeContext in which \c createComponent()
-was called, or the context in which the Component element, or the item used as the
-second argument to \c createQmlObject(), was specified. If the creation
-context is destroyed before the dynamic item is, then bindings in the dynamic item will
-fail to work.
 
 \section1 Deleting Objects Dynamically
-You should generally avoid dynamically deleting objects that you did not
-dynamically create. In many UIs, it is sufficient to set the opacity to 0 or
-to move the item off of the edge of the screen. If you have lots of dynamically
-created items however, deleting them when they are no longer used will provide
-a worthwhile performance benefit. Note that you should never manually delete
-items which were dynamically created by QML Elements such as \l{Loader}.
-
-To manually delete a QML item, call its destroy method. This method has one
-argument, which is an approximate delay in ms and which defaults to zero. This
-allows you to wait until the completion of an animation or transition. An example:
-
-\code
-    Component {
-        id: fadesOut
-        Rectangle{
-            id: rect
-            width: 40; height: 40;
-            NumberAnimation on opacity { from:1; to:0; duration: 1000 }
-            Component.onCompleted: rect.destroy(1000);
-        }
-    }
-    function createFadesOut(parentItem)
-    {
-        var object = fadesOut.createObject();
-        object.parent = parentItem;
-    }
-\endcode
-In the above example, the dynamically created rectangle calls destroy as soon as it's created,
- but delays long enough for its fade out animation to play.
 
+In many user interfaces, it is sufficient to set an item's opacity to 0 or
+to move the item off the screen instead of deleting the item. If you have
+lots of dynamically created items, however, you may receive a worthwhile
+performance benefit if unused items are deleted.
+
+Note that you should never manually delete items that were dynamically created
+by QML elements (such as \l Loader). Also, you should generally avoid deleting
+items that you did not dynamically create yourself.
+
+Items can be deleted using the \c destroy() method. This method has an optional
+argument (which defaults to 0) that specifies the approximate delay in milliseconds
+before the object is to be destroyed. This allows you to wait until the completion of
+an animation or transition. An example:
+
+\snippet doc/src/snippets/declarative/dynamicObjects.qml 0
+
+Here, \c Rectangle objects are destroyed one second after they are created, which is long
+enough for the \c NumberAnimation to be played before the object is destroyed.
 */
 
diff --git a/doc/src/declarative/elements.qdoc b/doc/src/declarative/elements.qdoc
index 79fe909..574a187 100644
--- a/doc/src/declarative/elements.qdoc
+++ b/doc/src/declarative/elements.qdoc
@@ -120,11 +120,22 @@ The following table lists the QML elements provided by the \l {QtDeclarative}{Qt
 \list
 \o \l Item
 \o \l Rectangle
+    \list
+    \o \l Gradient
+        \list
+        \o \l GradientStop
+        \endlist
+    \endlist
 \o \l Image
 \o \l BorderImage
 \o \l AnimatedImage
 \o \l Text
 \o \l TextInput
+    \list
+    \o \l IntValidator
+    \o \l DoubleValidator
+    \o \l RegExpValidator
+    \endlist
 \o \l TextEdit
 \endlist
 
@@ -142,6 +153,7 @@ The following table lists the QML elements provided by the \l {QtDeclarative}{Qt
 \o \l Loader
 \o \l Repeater
 \o \l SystemPalette
+\o \l FontLoader
 \o \l LayoutItem
 \endlist
 
diff --git a/doc/src/declarative/globalobject.qdoc b/doc/src/declarative/globalobject.qdoc
index 57eaae7..bc9830a 100644
--- a/doc/src/declarative/globalobject.qdoc
+++ b/doc/src/declarative/globalobject.qdoc
@@ -166,10 +166,33 @@ If no format is specified the locale's short format is used. Alternatively, you
 \section2 Functions
 The Qt object also contains the following miscellaneous functions which expose Qt functionality for use in QML.
 
-\section3 Qt.lighter(color baseColor)
-This function returns a color 50% lighter than \c baseColor. See QColor::lighter() for further details.
-\section3 Qt.darker(color baseColor)
-This function returns a color 50% darker than \c baseColor. See QColor::darker() for further details.
+\section3 Qt.lighter(color baseColor, real factor)
+This function returns a color lighter than \c baseColor by the \c factor provided.
+
+If the factor is greater than 1.0, this functions returns a lighter color.
+Setting factor to 1.5 returns a color that is 50% brighter. If the factor is less than 1.0,
+the return color is darker, but we recommend using the Qt.darker() function for this purpose.
+If the factor is 0 or negative, the return value is unspecified.
+
+The function converts the current RGB color to HSV, multiplies the value (V) component
+by factor and converts the color back to RGB.
+
+If \c factor is not supplied, returns a color 50% lighter than \c baseColor (factor 1.5).
+
+\section3 Qt.darker(color baseColor, real factor)
+This function returns a color darker than \c baseColor by the \c factor provided.
+
+If the factor is greater than 1.0, this function returns a darker color.
+Setting factor to 3.0 returns a color that has one-third the brightness.
+If the factor is less than 1.0, the return color is lighter, but we recommend using
+the Qt.lighter() function for this purpose. If the factor is 0 or negative, the return
+value is unspecified.
+
+The function converts the current RGB color to HSV, divides the value (V) component
+by factor and converts the color back to RGB.
+
+If \c factor is not supplied, returns a color 50% darker than \c baseColor (factor 2.0).
+
 \section3 Qt.tint(color baseColor, color tintColor)
     This function allows tinting one color with another.
 
@@ -203,6 +226,9 @@ This function causes the QML engine to emit the quit signal, which in
 This function returns \c url resolved relative to the URL of the
 caller.
 
+\section3 Qt.fontFamilies()
+This function returns a list of the font families available to the application.
+
 \section3 Qt.isQtObject(object)
 Returns true if \c object is a valid reference to a Qt or QML object, otherwise false.
 
@@ -211,87 +237,61 @@ The following functions on the global object allow you to dynamically create QML
 items from files or strings. See \l{Dynamic Object Management} for an overview
 of their use.
 
-\section2 createComponent(url file)
-    This function takes the URL of a QML file as its only argument. It returns
-    a component object which can be used to create and load that QML file.
-
-    Example QML script is below. Remember that QML files that might be loaded
-    over the network cannot be expected to be ready immediately.
-    \code
-        var component;
-        var sprite;
-        function finishCreation(){
-            if(component.isReady()){
-                sprite = component.createObject();
-                if(sprite == null){
-                    // Error Handling
-                }else{
-                    sprite.parent = page;
-                    sprite.x = 200;
-                    //...
-                }
-            }else if(component.isError()){
-                // Error Handling
-            }
-        }
-
-        component = createComponent("Sprite.qml");
-        if(component.isReady()){
-            finishCreation();
-        }else{
-            component.statusChanged.connect(finishCreation);
-        }
-    \endcode
-
-    If you are certain the files will be local, you could simplify to
-
-    \code
-        component = createComponent("Sprite.qml");
-        sprite = component.createObject();
-        if(sprite == null){
-            // Error Handling
-            console.log(component.errorsString());
-        }else{
-            sprite.parent = page;
-            sprite.x = 200;
-            //...
-        }
-    \endcode
-
-    The methods and properties of the Component element are defined in its own
-    page, but when using it dynamically only two methods are usually used.
-    Component.createObject() returns the created object or null if there is an error.
-    If there is an error, Component.errorsString() describes what the error was.
-
-    If you want to just create an arbitrary string of QML, instead of
-    loading a QML file, consider the createQmlObject() function.
-
-\section2 createQmlObject(string qml, object parent, string filepath)
-    Creates a new object from the specified string of QML. It requires a
-    second argument, which is the id of an existing QML object to use as
-    the new object's parent. If a third argument is provided, this is used
-    for error reporting as the filepath that the QML came from.
-
-    Example (where targetItem is the id of an existing QML item):
-    \code
-    newObject = createQmlObject('import Qt 4.7; Rectangle {color: "red"; width: 20; height: 20}',
-        targetItem, "dynamicSnippet1");
-    \endcode
-
-    This function is intended for use inside QML only. It is intended to behave
-    similarly to eval, but for creating QML elements.
-
-    Returns the created object, or null if there is an error. In the case of an
-    error, a QtScript Error object is thrown. This object has the additional property,
-    qmlErrors, which is an array of all the errors encountered when trying to execute the
-    QML. Each object in the array has the members: lineNumber, columnNumber, fileName and message.
-
-    Note that this function returns immediately, and therefore may not work if
-    the QML loads new components. If you are trying to load a new component,
-    for example from a QML file, consider the createComponent() function
-    instead. 'New components' refers to external QML files that have not yet
-    been loaded, and so it is safe to use createQmlObject to load built-in
-    components.
+
+\section2 Qt.createComponent(url file)
+
+This function takes the URL of a QML file as its only argument. It returns
+a component object which can be used to create and load that QML file.
+
+Here is an example. Remember that QML files that might be loaded
+over the network cannot be expected to be ready immediately.
+
+\snippet doc/src/snippets/declarative/componentCreation.js 0
+\codeline
+\snippet doc/src/snippets/declarative/componentCreation.js 1
+
+If you are certain the files will be local, you could simplify to:
+
+\snippet doc/src/snippets/declarative/componentCreation.js 2
+
+The methods and properties of the Component element are defined in its own
+page, but when using it dynamically only two methods are usually used.
+\c Component.createObject() returns the created object or \c null if there is an error.
+If there is an error, \l {Component::errorsString()}{Component.errorsString()} describes
+the error that occurred. Note that createObject() takes exactly one argument, which is set
+to the parent of the created object. Graphical objects without a parent will not appear
+on the scene, but if you do not wish to parent the item at this point you can safely pass
+in null.
+
+If you want to just create an arbitrary string of QML, instead of
+loading a QML file, consider the \l{Qt.createQmlObject(string qml, object parent, string filepath)}{Qt.createQmlObject()} function.
+
+
+\section2 Qt.createQmlObject(string qml, object parent, string filepath)
+
+Creates a new object from the specified string of QML. It requires a
+second argument, which is the id of an existing QML object to use as
+the new object's parent. If a third argument is provided, this is used
+for error reporting as the filepath that the QML came from.
+
+Example (where \c targetItem is the id of an existing QML item):
+
+\snippet doc/src/snippets/declarative/createQmlObject.qml 0
+
+This function is intended for use inside QML only. It is intended to behave
+similarly to eval, but for creating QML elements.
+
+Returns the created object, \c or null if there is an error. In the case of an
+error, a QtScript Error object is thrown. This object has the additional property,
+qmlErrors, which is an array of all the errors encountered when trying to execute the
+QML. Each object in the array has the members \c lineNumber, \c columnNumber, \c fileName and \c message.
+
+Note that this function returns immediately, and therefore may not work if
+the QML loads new components. If you are trying to load a new component,
+for example from a QML file, consider the \l{Qt.createComponent(url file)}{Qt.createComponent()} function
+instead. 'New components' refers to external QML files that have not yet
+been loaded, and so it is safe to use \c Qt.createQmlObject() to load built-in
+components.
 
 \section1 XMLHttpRequest
 
diff --git a/doc/src/declarative/integrating.qdoc b/doc/src/declarative/integrating.qdoc
index 0051f09..1c07f8e 100644
--- a/doc/src/declarative/integrating.qdoc
+++ b/doc/src/declarative/integrating.qdoc
@@ -118,34 +118,34 @@ Here is an example. Suppose you have two classes, \c RedSquare and \c BlueCircle
 that both inherit from QGraphicsWidget:
 
 \c [graphicswidgets/redsquare.h]
-\snippet doc/src/declarative/snippets/integrating/graphicswidgets/redsquare.h 0
+\snippet doc/src/snippets/declarative/graphicswidgets/redsquare.h 0
 
 \c [graphicswidgets/bluecircle.h]
-\snippet doc/src/declarative/snippets/integrating/graphicswidgets/bluecircle.h 0
+\snippet doc/src/snippets/declarative/graphicswidgets/bluecircle.h 0
 
 Then, create a plugin by subclassing QDeclarativeExtensionPlugin, and register the
 types by calling qmlRegisterType(). Also export the plugin with Q_EXPORT_PLUGIN2.
 
 \c [graphicswidgets/shapesplugin.cpp]
-\snippet doc/src/declarative/snippets/integrating/graphicswidgets/shapesplugin.cpp 0
+\snippet doc/src/snippets/declarative/graphicswidgets/shapesplugin.cpp 0
 
 Now write a project file that creates the plugin:
 
 \c [graphicswidgets/graphicswidgets.pro]
-\quotefile doc/src/declarative/snippets/integrating/graphicswidgets/graphicswidgets.pro
+\quotefile doc/src/snippets/declarative/graphicswidgets/graphicswidgets.pro
 
 And add a \c qmldir file that includes the \c graphicswidgets plugin from the \c lib
 subdirectory (as defined in the project file):
 
 \c [graphicswidgets/qmldir]
-\quotefile doc/src/declarative/snippets/integrating/graphicswidgets/qmldir
+\quotefile doc/src/snippets/declarative/graphicswidgets/qmldir
 
 Now, we can write a QML file that uses the \c RedSquare and \c BlueCircle widgets.
 (As an example, we can also create \c QGraphicsWidget items if we import the \c Qt.widgets
 module.)
 
 \c [main.qml]
-\quotefile doc/src/declarative/snippets/integrating/graphicswidgets/main.qml
+\quotefile doc/src/snippets/declarative/graphicswidgets/main.qml
 
 Here is a screenshot of the result:
 
diff --git a/doc/src/declarative/qdeclarativemodels.qdoc b/doc/src/declarative/qdeclarativemodels.qdoc
index 91acb3c..9b706a1 100644
--- a/doc/src/declarative/qdeclarativemodels.qdoc
+++ b/doc/src/declarative/qdeclarativemodels.qdoc
@@ -283,7 +283,9 @@ QDeclarativeContext *ctxt = view.rootContext();
 ctxt->setContextProperty("myModel", QVariant::fromValue(dataList));
 \endcode
 
-The properties of the object may then be accessed in the delegate:
+The QObject* is available as the \c modelData property.  As a convenience,
+the properties of the object are also made available directly in the
+delegate's context:
 
 \code
 ListView {
@@ -295,13 +297,18 @@ ListView {
        Rectangle {
             height: 25
             width: 100
-            color: model.color
+            color: model.modelData.color
             Text { text: name }
        }
    }
 }
 \endcode
 
+Note the use of the fully qualified access to the \c color property.  
+The properties of the object are not replicated in the \c model
+object, since they are easily available via the modelData
+object.
+
 Note: There is no way for the view to know that the contents of a QList
 have changed.  If the QList is changed, it will be necessary to reset
 the model by calling QDeclarativeContext::setContextProperty() again.
diff --git a/doc/src/declarative/qmlruntime.qdoc b/doc/src/declarative/qmlruntime.qdoc
index a724c7d..23c5c32 100644
--- a/doc/src/declarative/qmlruntime.qdoc
+++ b/doc/src/declarative/qmlruntime.qdoc
@@ -112,6 +112,23 @@
 
     When run with the \c -help option, qml shows available options.
 
+    \section2 Translations
+
+    When the runtime loads an initial QML file, it will install a translation file from
+    a "i18n" subdirectory relative to that initial QML file. The actual translation file
+    loaded will be according to the system locale and have the form
+    "qml_<language>.qm", where <language> is a two-letter ISO 639 language,
+    such as "qml_fr.qm", optionally followed by an underscore and an uppercase two-letter ISO 3166 country
+    code, such as "qml_fr_FR.qm" or "qml_fr_CA.qm".
+
+    Such files can be created using \l{Qt Linguist}.
+
+    See \l{scripting.html#internationalization} for information about how to make
+    the JavaScript in QML files use translatable strings.
+
+    Additionally, the QML runtime will load translation files specified on the
+    command line via the \c -translation option.
+
     \section2 Dummy Data
 
     The secondary use of the qml runtime is to allow QML files to be viewed with
diff --git a/doc/src/declarative/qtbinding.qdoc b/doc/src/declarative/qtbinding.qdoc
index d024ff2..7d696d7 100644
--- a/doc/src/declarative/qtbinding.qdoc
+++ b/doc/src/declarative/qtbinding.qdoc
@@ -97,17 +97,17 @@ The following example shows how to expose a background color to a QML file throu
 \row
 \o
 \c {// main.cpp}
-\snippet doc/src/declarative/snippets/qtbinding/contextproperties/main.cpp 0
+\snippet doc/src/snippets/declarative/qtbinding/contextproperties/main.cpp 0
 
 \o
 \c {// main.qml}
-\snippet doc/src/declarative/snippets/qtbinding/contextproperties/main.qml 0
+\snippet doc/src/snippets/declarative/qtbinding/contextproperties/main.qml 0
 
 \endtable
 
 Or, if you want \c main.cpp to create the component without showing it in a QDeclarativeView, you could create an instance of QDeclarativeContext using QDeclarativeEngine::rootContext() instead:
 
-\snippet doc/src/declarative/snippets/qtbinding/contextproperties/main.cpp 1
+\snippet doc/src/snippets/declarative/qtbinding/contextproperties/main.cpp 1
 
 Context properties work just like normal properties in QML bindings - if the \c backgroundColor
 context property in this example was changed to red, the component object instances would
@@ -135,15 +135,15 @@ allow QML to set values.
 The following example creates a \c CustomPalette object, and sets it as the \c palette context
 property.
 
-\snippet doc/src/declarative/snippets/qtbinding/custompalette/custompalette.h 0
+\snippet doc/src/snippets/declarative/qtbinding/custompalette/custompalette.h 0
 
-\snippet doc/src/declarative/snippets/qtbinding/custompalette/main.cpp 0
+\snippet doc/src/snippets/declarative/qtbinding/custompalette/main.cpp 0
 
 The QML that follows references the palette object, and its properties, to set the appropriate
 background and text colors.  When the window is clicked, the palette's text color is changed, and
 the window text will update accordingly.
 
-\snippet doc/src/declarative/snippets/qtbinding/custompalette/main.qml 0
+\snippet doc/src/snippets/declarative/qtbinding/custompalette/main.qml 0
 
 To detect when a C++ property value - in this case the \c CustomPalette's \c text property - 
 changes, the property must have a corresponding NOTIFY signal.  The NOTIFY signal specifies a signal
@@ -185,12 +185,12 @@ This example toggles the "Stopwatch" object on/off when the MouseArea is clicked
 \row
 \o
 \c {// main.cpp}
-\snippet doc/src/declarative/snippets/qtbinding/stopwatch/stopwatch.h 0
-\snippet doc/src/declarative/snippets/qtbinding/stopwatch/main.cpp 0
+\snippet doc/src/snippets/declarative/qtbinding/stopwatch/stopwatch.h 0
+\snippet doc/src/snippets/declarative/qtbinding/stopwatch/main.cpp 0
 
 \o
 \c {// main.qml}
-\snippet doc/src/declarative/snippets/qtbinding/stopwatch/main.qml 0
+\snippet doc/src/snippets/declarative/qtbinding/stopwatch/main.qml 0
 
 \endtable
 
@@ -258,16 +258,16 @@ QML content can be loaded from \l {The Qt Resource System} using the \e qrc: URL
 For example:
 
 \c [project/example.qrc]
-\quotefile doc/src/declarative/snippets/qtbinding/resources/example.qrc 
+\quotefile doc/src/snippets/declarative/qtbinding/resources/example.qrc 
 
 \c [project/project.pro]
-\quotefile doc/src/declarative/snippets/qtbinding/resources/resources.pro 
+\quotefile doc/src/snippets/declarative/qtbinding/resources/resources.pro 
 
 \c [project/main.cpp]
-\snippet doc/src/declarative/snippets/qtbinding/resources/main.cpp 0
+\snippet doc/src/snippets/declarative/qtbinding/resources/main.cpp 0
 
 \c [project/main.qml]
-\snippet doc/src/declarative/snippets/qtbinding/resources/main.qml 0
+\snippet doc/src/snippets/declarative/qtbinding/resources/main.qml 0
 
 */
 
diff --git a/doc/src/declarative/tutorial.qdoc b/doc/src/declarative/tutorial.qdoc
index 1a93d05..75c0f851 100644
--- a/doc/src/declarative/tutorial.qdoc
+++ b/doc/src/declarative/tutorial.qdoc
@@ -57,10 +57,10 @@ The tutorial's source code is located in the $QTDIR/examples/declarative/tutoria
 
 Tutorial chapters:
 
-\list
-\o \l {QML Tutorial 1 - Basic Types}
-\o \l {QML Tutorial 2 - QML Component}
-\o \l {QML Tutorial 3 - States and Transitions}
+\list 1
+\o \l {QML Tutorial 1 - Basic Types}{Basic Types}
+\o \l {QML Tutorial 2 - QML Components}{QML Components}
+\o \l {QML Tutorial 3 - States and Transitions}{States and Transitions}
 \endlist
 
 */
@@ -86,7 +86,7 @@ Here is the QML code for the application:
 \section2 Import
 
 First, we need to import the types that we need for this example. Most QML files will import the built-in QML
-types (like \l{Rectangle}, \l{Image}, ...) that come with Qt with:
+types (like \l{Rectangle}, \l{Image}, ...) that come with Qt, using:
 
 \snippet examples/declarative/tutorials/helloworld/tutorial1.qml 3
 
@@ -95,7 +95,7 @@ types (like \l{Rectangle}, \l{Image}, ...) that come with Qt with:
 \snippet examples/declarative/tutorials/helloworld/tutorial1.qml 1
 
 We declare a root element of type \l{Rectangle}. It is one of the basic building blocks you can use to create an application in QML.
-We give it an \c{id} to be able to refer to it later. In this case, we call it \e page.
+We give it an \c{id} to be able to refer to it later. In this case, we call it "page".
 We also set the \c width, \c height and \c color properties.
 The \l{Rectangle} element contains many other properties (such as \c x and \c y), but these are left at their default values.
 
@@ -103,15 +103,16 @@ The \l{Rectangle} element contains many other properties (such as \c x and \c y)
 
 \snippet examples/declarative/tutorials/helloworld/tutorial1.qml 2
 
-We add a \l Text element as a child of our root element that will display the text 'Hello world!'.
+We add a \l Text element as a child of the root Rectangle element that displays the text 'Hello world!'.
 
 The \c y property is used to position the text vertically at 30 pixels from the top of its parent.
 
-The \c font.pointSize and \c font.bold properties are related to fonts and use the \l{dot properties}{dot notation}.
-
 The \c anchors.horizontalCenter property refers to the horizontal center of an element.
 In this case, we specify that our text element should be horizontally centered in the \e page element (see \l{anchor-layout}{Anchor-based Layout}).
 
+The \c font.pointSize and \c font.bold properties are related to fonts and use the \l{dot properties}{dot notation}.
+
+
 \section2 Viewing the example
 
 To view what you have created, run the \l{Qt Declarative UI Runtime}{qml} tool (located in the \c bin directory) with your filename as the first argument.
@@ -124,7 +125,7 @@ bin/qml $QTDIR/examples/declarative/tutorials/helloworld/tutorial1.qml
 
 /*!
 \page qml-tutorial2.html
-\title QML Tutorial 2 - QML Component
+\title QML Tutorial 2 - QML Components
 \contentspage QML Tutorial
 \previouspage QML Tutorial 1 - Basic Types
 \nextpage QML Tutorial 3 - States and Transitions
@@ -134,10 +135,10 @@ This chapter adds a color picker to change the color of the text.
 \image declarative-tutorial2.png
 
 Our color picker is made of six cells with different colors.
-To avoid writing the same code multiple times, we first create a new \c Cell component.
+To avoid writing the same code multiple times for each cell, we create a new \c Cell component.
 A component provides a way of defining a new type that we can re-use in other QML files.
-A QML component is like a black-box and interacts with the outside world through properties, signals and slots and is generally
-defined in its own QML file (for more details, see \l {Defining new Components}).
+A QML component is like a black-box and interacts with the outside world through properties, signals and functions and is generally
+defined in its own QML file. (For more details, see \l {Defining new Components}).
 The component's filename must always start with a capital letter.
 
 Here is the QML code for \c Cell.qml:
@@ -157,7 +158,7 @@ An \l Item is the most basic visual element in QML and is often used as a contai
 
 We declare a \c cellColor property. This property is accessible from  \e outside our component, this allows us
 to instantiate the cells with different colors.
-This property is just an alias to an existing property - the color of the rectangle that compose the cell (see \l{intro-properties}{Properties}).
+This property is just an alias to an existing property - the color of the rectangle that compose the cell (see \l{Adding new properties}).
 
 \snippet examples/declarative/tutorials/helloworld/Cell.qml 5
 
diff --git a/doc/src/snippets/declarative/Sprite.qml b/doc/src/snippets/declarative/Sprite.qml
new file mode 100644
index 0000000..6670703
--- /dev/null
+++ b/doc/src/snippets/declarative/Sprite.qml
@@ -0,0 +1,3 @@
+import Qt 4.7
+
+Rectangle { width: 80; height: 50; color: "red" }
diff --git a/doc/src/snippets/declarative/componentCreation.js b/doc/src/snippets/declarative/componentCreation.js
new file mode 100644
index 0000000..f6fb379
--- /dev/null
+++ b/doc/src/snippets/declarative/componentCreation.js
@@ -0,0 +1,47 @@
+//![0]
+var component;
+var sprite;
+
+function finishCreation() {
+    if (component.status == Component.Ready) {
+        sprite = component.createObject(appWindow);
+        if (sprite == null) {
+            // Error Handling
+        } else {
+            sprite.x = 100;
+            sprite.y = 100;
+            // ...
+        }
+    } else if (component.status == Component.Error) {
+        // Error Handling
+        console.log("Error loading component:", component.errorsString());
+    }
+}
+//![0]
+
+function createSpriteObjects() {
+
+//![1]
+component = Qt.createComponent("Sprite.qml");
+if (component.status == Component.Ready)
+    finishCreation();
+else
+    component.statusChanged.connect(finishCreation);
+//![1]
+
+//![2]
+component = Qt.createComponent("Sprite.qml");
+sprite = component.createObject(appWindow);
+
+if (sprite == null) {
+    // Error Handling
+    console.log("Error loading component:", component.errorsString());
+} else {
+    sprite.x = 100;
+    sprite.y = 100;
+    // ...
+}
+//![2]
+
+}
+
diff --git a/doc/src/snippets/declarative/createComponent.qml b/doc/src/snippets/declarative/createComponent.qml
new file mode 100644
index 0000000..c4a1617
--- /dev/null
+++ b/doc/src/snippets/declarative/createComponent.qml
@@ -0,0 +1,9 @@
+import Qt 4.7
+import "componentCreation.js" as MyModule
+
+Rectangle {
+    id: appWindow
+    width: 300; height: 300
+
+    Component.onCompleted: MyModule.createSpriteObjects();
+}
diff --git a/doc/src/snippets/declarative/createQmlObject.qml b/doc/src/snippets/declarative/createQmlObject.qml
new file mode 100644
index 0000000..6b331c4
--- /dev/null
+++ b/doc/src/snippets/declarative/createQmlObject.qml
@@ -0,0 +1,18 @@
+import Qt 4.7
+
+Rectangle {
+    id: targetItem
+    property QtObject newObject
+
+    width: 100
+    height: 100
+    
+    function createIt() {
+//![0]
+newObject = Qt.createQmlObject('import Qt 4.7; Rectangle {color: "red"; width: 20; height: 20}',
+    targetItem, "dynamicSnippet1");
+//![0]
+    }
+
+    Component.onCompleted: createIt()
+}
diff --git a/doc/src/snippets/declarative/drag.qml b/doc/src/snippets/declarative/drag.qml
index 9465efb..79469e3 100644
--- a/doc/src/snippets/declarative/drag.qml
+++ b/doc/src/snippets/declarative/drag.qml
@@ -9,7 +9,7 @@ Rectangle {
         MouseArea {
             anchors.fill: parent
             drag.target: pic
-            drag.axis: "XAxis"
+            drag.axis: Drag.XAxis
             drag.minimumX: 0
             drag.maximumX: blurtest.width-pic.width
         }
diff --git a/doc/src/snippets/declarative/dynamicObjects.qml b/doc/src/snippets/declarative/dynamicObjects.qml
new file mode 100644
index 0000000..6a8c927
--- /dev/null
+++ b/doc/src/snippets/declarative/dynamicObjects.qml
@@ -0,0 +1,29 @@
+import Qt 4.7
+
+//![0]
+Rectangle {
+    id: rootItem
+    width: 300
+    height: 300
+
+    Component {
+        id: rectComponent
+
+        Rectangle {
+            id: rect
+            width: 40; height: 40;
+            color: "red"
+
+            NumberAnimation on opacity { from: 1; to: 0; duration: 1000 }
+
+            Component.onCompleted: rect.destroy(1000);
+        }
+    }
+
+    function createRectangle() {
+        var object = rectComponent.createObject(rootItem);
+    } 
+
+    Component.onCompleted: createRectangle()
+}
+//![0]
diff --git a/doc/src/snippets/declarative/flickableScrollbar.qml b/doc/src/snippets/declarative/flickableScrollbar.qml
new file mode 100644
index 0000000..147751a
--- /dev/null
+++ b/doc/src/snippets/declarative/flickableScrollbar.qml
@@ -0,0 +1,26 @@
+import Qt 4.7
+
+//![0]
+Rectangle {
+    width: 200; height: 200
+
+    Flickable {
+        id: flickable
+//![0]
+        anchors.fill: parent
+        contentWidth: image.width; contentHeight: image.height
+
+        Image { id: image; source: "pics/qt.png" }
+//![1]
+    }
+
+    Rectangle {
+        id: scrollbar
+        anchors.right: flickable.right
+        y: flickable.visibleArea.yPosition * flickable.height
+        width: 10
+        height: flickable.visibleArea.heightRatio * flickable.height
+        color: "black"
+    }
+}
+//![1]
diff --git a/doc/src/declarative/snippets/integrating/graphicswidgets/bluecircle.h b/doc/src/snippets/declarative/graphicswidgets/bluecircle.h
index 73d66b7..73d66b7 100644
--- a/doc/src/declarative/snippets/integrating/graphicswidgets/bluecircle.h
+++ b/doc/src/snippets/declarative/graphicswidgets/bluecircle.h
diff --git a/doc/src/declarative/snippets/integrating/graphicswidgets/graphicswidgets.pro b/doc/src/snippets/declarative/graphicswidgets/graphicswidgets.pro
index 21c8a37..21c8a37 100644
--- a/doc/src/declarative/snippets/integrating/graphicswidgets/graphicswidgets.pro
+++ b/doc/src/snippets/declarative/graphicswidgets/graphicswidgets.pro
diff --git a/doc/src/declarative/snippets/integrating/graphicswidgets/main.qml b/doc/src/snippets/declarative/graphicswidgets/main.qml
index ffcf79d..ffcf79d 100644
--- a/doc/src/declarative/snippets/integrating/graphicswidgets/main.qml
+++ b/doc/src/snippets/declarative/graphicswidgets/main.qml
diff --git a/doc/src/declarative/snippets/integrating/graphicswidgets/qmldir b/doc/src/snippets/declarative/graphicswidgets/qmldir
index f94dad2..f94dad2 100644
--- a/doc/src/declarative/snippets/integrating/graphicswidgets/qmldir
+++ b/doc/src/snippets/declarative/graphicswidgets/qmldir
diff --git a/doc/src/declarative/snippets/integrating/graphicswidgets/redsquare.h b/doc/src/snippets/declarative/graphicswidgets/redsquare.h
index 3050662..3050662 100644
--- a/doc/src/declarative/snippets/integrating/graphicswidgets/redsquare.h
+++ b/doc/src/snippets/declarative/graphicswidgets/redsquare.h
diff --git a/doc/src/declarative/snippets/integrating/graphicswidgets/shapesplugin.cpp b/doc/src/snippets/declarative/graphicswidgets/shapesplugin.cpp
index 4c18ef3..4c18ef3 100644
--- a/doc/src/declarative/snippets/integrating/graphicswidgets/shapesplugin.cpp
+++ b/doc/src/snippets/declarative/graphicswidgets/shapesplugin.cpp
diff --git a/doc/src/snippets/declarative/mouseregion.qml b/doc/src/snippets/declarative/mouseregion.qml
index a464069..683770b 100644
--- a/doc/src/snippets/declarative/mouseregion.qml
+++ b/doc/src/snippets/declarative/mouseregion.qml
@@ -3,13 +3,21 @@ import Qt 4.7
 Rectangle { width: 200; height: 100
 Row {
 //! [0]
-Rectangle { width: 100; height: 100; color: "green"
-    MouseArea { anchors.fill: parent; onClicked: { parent.color = 'red' } }
+Rectangle { 
+    width: 100; height: 100
+    color: "green"
+
+    MouseArea { 
+        anchors.fill: parent
+        onClicked: { parent.color = 'red' }
+    }
 }
 //! [0]
 //! [1]
 Rectangle {
-    width: 100; height: 100; color: "green"
+    width: 100; height: 100
+    color: "green"
+
     MouseArea {
         anchors.fill: parent
         acceptedButtons: Qt.LeftButton | Qt.RightButton
diff --git a/doc/src/declarative/snippets/qtbinding/contextproperties/contextproperties.pro b/doc/src/snippets/declarative/qtbinding/contextproperties/contextproperties.pro
index 68eeaf2..68eeaf2 100644
--- a/doc/src/declarative/snippets/qtbinding/contextproperties/contextproperties.pro
+++ b/doc/src/snippets/declarative/qtbinding/contextproperties/contextproperties.pro
diff --git a/doc/src/declarative/snippets/qtbinding/contextproperties/main.cpp b/doc/src/snippets/declarative/qtbinding/contextproperties/main.cpp
index 4073a6c..4073a6c 100644
--- a/doc/src/declarative/snippets/qtbinding/contextproperties/main.cpp
+++ b/doc/src/snippets/declarative/qtbinding/contextproperties/main.cpp
diff --git a/doc/src/declarative/snippets/qtbinding/contextproperties/main.qml b/doc/src/snippets/declarative/qtbinding/contextproperties/main.qml
index 1053f73..1053f73 100644
--- a/doc/src/declarative/snippets/qtbinding/contextproperties/main.qml
+++ b/doc/src/snippets/declarative/qtbinding/contextproperties/main.qml
diff --git a/doc/src/declarative/snippets/qtbinding/custompalette/custompalette.h b/doc/src/snippets/declarative/qtbinding/custompalette/custompalette.h
index d0d253a..d0d253a 100644
--- a/doc/src/declarative/snippets/qtbinding/custompalette/custompalette.h
+++ b/doc/src/snippets/declarative/qtbinding/custompalette/custompalette.h
diff --git a/doc/src/declarative/snippets/qtbinding/custompalette/custompalette.pro b/doc/src/snippets/declarative/qtbinding/custompalette/custompalette.pro
index e6af0d0..e6af0d0 100644
--- a/doc/src/declarative/snippets/qtbinding/custompalette/custompalette.pro
+++ b/doc/src/snippets/declarative/qtbinding/custompalette/custompalette.pro
diff --git a/doc/src/declarative/snippets/qtbinding/custompalette/main.cpp b/doc/src/snippets/declarative/qtbinding/custompalette/main.cpp
index dc651f6..dc651f6 100644
--- a/doc/src/declarative/snippets/qtbinding/custompalette/main.cpp
+++ b/doc/src/snippets/declarative/qtbinding/custompalette/main.cpp
diff --git a/doc/src/declarative/snippets/qtbinding/custompalette/main.qml b/doc/src/snippets/declarative/qtbinding/custompalette/main.qml
index f1a3b4f..f1a3b4f 100644
--- a/doc/src/declarative/snippets/qtbinding/custompalette/main.qml
+++ b/doc/src/snippets/declarative/qtbinding/custompalette/main.qml
diff --git a/doc/src/declarative/snippets/qtbinding/resources/example.qrc b/doc/src/snippets/declarative/qtbinding/resources/example.qrc
index 5e49415..5e49415 100644
--- a/doc/src/declarative/snippets/qtbinding/resources/example.qrc
+++ b/doc/src/snippets/declarative/qtbinding/resources/example.qrc
diff --git a/doc/src/declarative/snippets/qtbinding/resources/images/background.png b/doc/src/snippets/declarative/qtbinding/resources/images/background.png
index e69de29..e69de29 100644
--- a/doc/src/declarative/snippets/qtbinding/resources/images/background.png
+++ b/doc/src/snippets/declarative/qtbinding/resources/images/background.png
diff --git a/doc/src/declarative/snippets/qtbinding/resources/main.cpp b/doc/src/snippets/declarative/qtbinding/resources/main.cpp
index 5459b9e..5459b9e 100644
--- a/doc/src/declarative/snippets/qtbinding/resources/main.cpp
+++ b/doc/src/snippets/declarative/qtbinding/resources/main.cpp
diff --git a/doc/src/declarative/snippets/qtbinding/resources/main.qml b/doc/src/snippets/declarative/qtbinding/resources/main.qml
index dfe923f..dfe923f 100644
--- a/doc/src/declarative/snippets/qtbinding/resources/main.qml
+++ b/doc/src/snippets/declarative/qtbinding/resources/main.qml
diff --git a/doc/src/declarative/snippets/qtbinding/resources/resources.pro b/doc/src/snippets/declarative/qtbinding/resources/resources.pro
index cc01ee1..cc01ee1 100644
--- a/doc/src/declarative/snippets/qtbinding/resources/resources.pro
+++ b/doc/src/snippets/declarative/qtbinding/resources/resources.pro
diff --git a/doc/src/declarative/snippets/qtbinding/stopwatch/main.cpp b/doc/src/snippets/declarative/qtbinding/stopwatch/main.cpp
index 537a288..537a288 100644
--- a/doc/src/declarative/snippets/qtbinding/stopwatch/main.cpp
+++ b/doc/src/snippets/declarative/qtbinding/stopwatch/main.cpp
diff --git a/doc/src/declarative/snippets/qtbinding/stopwatch/main.qml b/doc/src/snippets/declarative/qtbinding/stopwatch/main.qml
index 2efa542..2efa542 100644
--- a/doc/src/declarative/snippets/qtbinding/stopwatch/main.qml
+++ b/doc/src/snippets/declarative/qtbinding/stopwatch/main.qml
diff --git a/doc/src/declarative/snippets/qtbinding/stopwatch/stopwatch.cpp b/doc/src/snippets/declarative/qtbinding/stopwatch/stopwatch.cpp
index 4954a5f..4954a5f 100644
--- a/doc/src/declarative/snippets/qtbinding/stopwatch/stopwatch.cpp
+++ b/doc/src/snippets/declarative/qtbinding/stopwatch/stopwatch.cpp
diff --git a/doc/src/declarative/snippets/qtbinding/stopwatch/stopwatch.h b/doc/src/snippets/declarative/qtbinding/stopwatch/stopwatch.h
index 8d17121..8d17121 100644
--- a/doc/src/declarative/snippets/qtbinding/stopwatch/stopwatch.h
+++ b/doc/src/snippets/declarative/qtbinding/stopwatch/stopwatch.h
diff --git a/doc/src/declarative/snippets/qtbinding/stopwatch/stopwatch.pro b/doc/src/snippets/declarative/qtbinding/stopwatch/stopwatch.pro
index d803e6a..d803e6a 100644
--- a/doc/src/declarative/snippets/qtbinding/stopwatch/stopwatch.pro
+++ b/doc/src/snippets/declarative/qtbinding/stopwatch/stopwatch.pro