Doc: Create a separate topic for Properties view

And place it under Design Views.

Restructure the Specifying Component Properties topic to start with
common component properties through setting colors to developer
properties.

Task-number: QDS-3771
Change-Id: I5cdfa12217fd61efac8eedad3efdd4486ef9593e
Reviewed-by: Leena Miettinen <riitta-leena.miettinen@qt.io>

doc/qtcreator/src/qtcreator-toc.qdoc

@@ -96,6 +96,7 @@
                         \li \l{Form Editor}
                         \li \l{Library}
                         \li \l{Navigator}
+                        \li \l{Properties}
                     \endlist
                 \li \l {Creating UIs}
                     \list
@@ -110,7 +111,7 @@
                             \li \l{Creating Buttons}
                             \li \l{Creating Scalable Buttons and Borders}
                         \endlist
-                        \li \l{Specifying Item Properties}
+                        \li \l{Specifying Component Properties}
                         \li \l{Positioning Items}
                         \li \l{Using Custom Fonts}
                         \li \l{Annotating Designs}

doc/qtcreator/src/qtquick/creator-only/qtquick-app-tutorial.qdoc

@@ -196,7 +196,7 @@
     \list
         \li \l{Creating Components}
         \li \l{Navigator}
-        \li \l{Specifying Item Properties}
+        \li \l{Specifying Component Properties}
     \endlist
 
     Next, we will make the image move between the rectangles when users click

doc/qtcreator/src/qtquick/library/qtquick-shapes.qdoc

@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2020 The Qt Company Ltd.
+** Copyright (C) 2021 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the Qt Creator documentation.
@@ -54,7 +54,7 @@
     {Item} type. Even though it has no visual appearance itself (similarly
     to a mouse area, for example), it defines all the properties that are
     common across visual types, such as position, size, and visibility. For
-    more information, see \l{Specifying Basic Item Properties}.
+    more information, see \l{Specifying Basic Component Properties}.
 
     In addition, each type has a set of properties that specify its visual
     appearance and behavior. You can modify the property values to set fill

doc/qtcreator/src/qtquick/qtquick-components.qdoc

@@ -80,7 +80,7 @@
         \li Select components in \uicontrol Navigator to edit the
             values of their properties in \uicontrol Properties.
             \image qmldesigner-properties-view.png "Properties view"
-            For more information, see \l {Specifying Item Properties}.
+            For more information, see \l {Specifying Component Properties}.
         \li To change the appearance and behavior of your components in ways
             that are not supported out of the box, you can define custom
             properties for your components in the \uicontrol Connections view,

doc/qtcreator/src/qtquick/qtquick-connection-editor-properties.qdoc

@@ -83,7 +83,7 @@
     \image qtquick-custom-properties.png "Custom properties in Properties view"
 
     For more information about setting property values in the
-    \uicontrol Properties view, see \l{Specifying Item Properties}.
+    \uicontrol Properties view, see \l{Specifying Component Properties}.
 
     For an example of using custom properties in an application, see
     \l{Creating a Mobile Application}.

doc/qtcreator/src/qtquick/qtquick-properties-view.qdoc

@@ -0,0 +1,163 @@
+/****************************************************************************
+**
+** Copyright (C) 2021 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the Qt Creator documentation.
+**
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU Free Documentation License Usage
+** Alternatively, this file may be used under the terms of the GNU Free
+** Documentation License version 1.3 as published by the Free Software
+** Foundation and appearing in the file included in the packaging of
+** this file. Please review the following information to ensure
+** the GNU Free Documentation License version 1.3 requirements
+** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
+**
+****************************************************************************/
+
+/*!
+    \page qtquick-properties-view.html
+    \previouspage qtquick-navigator.html
+    \nextpage creator-project-managing-workspaces.html
+
+    \title Properties
+
+    The \uicontrol Properties view displays all the properties of the selected
+    \l{glossary-component}{component}. The properties are grouped by type. The
+    top part of the view displays properties that are common to all components,
+    such as type name, ID, position, size, and visibility.
+
+    \image qtquick-item-properties-common.png "Basic component properties"
+
+    The bottom part of the view displays properties that have been defined for
+    the component type. For example, the following image displays the predefined
+    properties you can set for \l{basic-rectangle}{Rectangle} and \l Text
+    components.
+
+    \image qmldesigner-element-properties.png "Rectangle and Text properties"
+
+    \section1 Summary of Properties View Buttons
+
+    The following table lists the \uicontrol Properties view buttons:
+
+    \table
+    \header
+        \li Icon
+        \li Tooltip
+        \li Read More
+    \row
+        \li \inlineimage export_unchecked.png
+        \li Adds a property alias that you can use from outside of the
+            component for the root component. You can use a menu item
+            in the actions menu to add property aliases for property
+            values of child components.
+        \li \l{Adding Property Aliases}
+    \row
+        \li \inlineimage icons/action-icon.png
+        \li Opens a menu with actions for:
+            \list
+                \li Resetting property values to their default values
+                \li Setting property bindings
+                \li Creating property aliases
+                \li Inserting keyframes for timeline animations
+            \endlist
+        \li
+        \list
+                \li \l{Viewing Changes in Properties}
+                \li \l{Adding Bindings Between Properties}
+                \li \l{Adding Property Aliases}
+                \li \l{Setting Keyframe Values}
+        \endlist
+    \row
+        \li \inlineimage icons/action-icon-binding.png
+        \li Indicates that the value of the property is bound to the value
+            of another property. Opens the same menu as the action icon.
+        \li \l{Adding Bindings Between Properties}
+
+    \endtable
+
+    \section1 Viewing Changes in Properties
+
+    The default values of properties are displayed in white color, while the
+    values that you specify explicitly are highlighted with blue color. In
+    addition, property changes in \l{Adding States}{states} are highlighted
+    with blue.
+
+    This allows you to easily see which values are set in the component
+    file for this component instance and which values are default
+    characteristics of a component.
+
+    When editing states, you can easily see which values are explicitly set in
+    the current state and which values are derived from the base state.
+
+    The following images illustrate this. In the base state, the \uicontrol Size
+    (1) and \uicontrol Colors (2) values are explicitly set and highlighted.
+
+    \image qmldesigner-properties-explicit-base.png "Explicitly set properties"
+
+    In \uicontrol State1, only the color (1) is explicitly set and highlighted.
+
+    \image qmldesigner-properties-explicit-state1.png "Explicitly set properties"
+
+    Resetting a property sets it back to the default value and removes the value
+    from the component file.
+
+    \note As a result, all boolean values can be visualized in four different
+    ways.
+
+    For example, visibility can be visualized as follows:
+
+    \table
+        \row
+            \li \image qmldesigner-boolean-true.png
+            \li TRUE
+            \li The component is visible by default. The visibility might be
+                overridden by the visibility set in the base state.
+        \row
+            \li \image qmldesigner-boolean-true-blue.png
+            \li TRUE (highlighted)
+            \li The component is explicitly set to visible.
+        \row
+            \li \image qmldesigner-boolean-false.png
+            \li FALSE
+            \li The component is hidden by default. The visibility might be
+                overridden by the visibility set in the base state.
+        \row
+            \li \image qmldesigner-boolean-false-blue.png
+            \li FALSE (hightlighted)
+            \li The component is explicitly set to hidden.
+    \endtable
+
+    \section1 Multiselection
+
+    To modify the values of common properties of multiple components
+    simultaneously, select the components in \l Navigator or \l {Form Editor}:
+
+    \list
+        \li On Windows, press and hold \key Ctrl and \key Shift, and then click
+            the components to select them.
+        \li On \macos, press \key Shift to select a range of components or
+            \key Cmd to select multiple single components.
+    \endlist
+
+    You can \l{Locking Components}{lock other components} in
+    \uicontrol Navigator to make multiselection easier.
+
+    \section1 Getting Help for Properties
+
+    \list
+        \li For information about setting common component properties, see
+            \l{Specifying Component Properties}.
+        \li For more information on the properties available for a
+            component, press \key {F1} or see \l{Component Types}
+            and \l{Positioning Items}.
+    \endlist
+*/

doc/qtcreator/src/qtquick/qtquick-properties.qdoc

@@ -1,6 +1,6 @@
 /****************************************************************************
 **
-** Copyright (C) 2020 The Qt Company Ltd.
+** Copyright (C) 2021 The Qt Company Ltd.
 ** Contact: https://www.qt.io/licensing/
 **
 ** This file is part of the Qt Creator documentation.
@@ -28,109 +28,144 @@
     \previouspage quick-scalable-image.html
     \nextpage qtquick-positioning.html
 
-    \title Specifying Item Properties
+    \title Specifying Component Properties
 
-    The \uicontrol Properties view displays all the properties of the selected
+    The \l Properties view displays all the properties of the selected
-    item. The properties are grouped by type. The top part of the view displays
+    \l{glossary-component}{component}.
-    properties that are common to all QML types, such as type name, id,
-    position, size, and visibility.
 
-    \image qtquick-item-properties-common.png "Basic item properties"
+    \target basic-item
+    \section1 Specifying Basic Component Properties
 
-    The bottom part of the view displays properties that have been defined for
+    All components share a set of properties that you can specify in the
-    the QML type. For example, the following image displays the predefined
+    \uicontrol Properties view.
-    properties you can set for \uicontrol Rectangle and \uicontrol Text items.
 
-    \image qmldesigner-element-properties.png "Rectangle and Text properties"
+    \image qtquick-item-properties-common.png "Basic component properties"
 
-    To modify the values of common properties of multiple items simultaneously,
+    \section2 Type
-    select the items in the \uicontrol Navigator or on the canvas:
 
-    \list
+    When you create a component using a \l{Component Types}{preset component},
-        \li On Windows, press and hold \key Ctrl and \key Shift, and then click
+    it has all the properties of the preset you used. If you realize later that
-            the items to select them.
+    another preset component with another set of default properties would be
-        \li On \macos, press \key Shift to select a range of items or \key Cmd
+    more suitable for your purposes, you can change the component type by
-            to select multiple single items.
+    double-clicking the \uicontrol Type field and entering the name of
-    \endlist
+    another preset component in the field.
 
-    To return an item to its implicit position after moving it, select the
+    If you have specified values for properties that are not supported by the
-    \inlineimage qtcreator-reset-position-icon.png
+    new component type, \QC offers to remove them for you. If you'd rather do
-    (\uicontrol {Reset Position}) button on the toolbar. To return it to its
+    this yourself, you can select the \inlineimage icons/action-icon.png
-    implicit size, select \inlineimage qtcreator-reset-size-icon.png
+    (\uicontrol Actions) menu next to the property name, and then select
+    \uicontrol Reset to remove the property values before trying again.
+
+    \section2 ID
+
+    Each component and each instance of a component has an \e ID that uniquely
+    identifies it and enables other components' properties to be bound to it.
+    You can specify IDs for components in the \uicontrol ID field.
+
+    An ID must be unique, it must begin with a lower-case letter or an
+    underscore character, and it can contain only letters, numbers, and
+    underscore characters.
+
+    For more technical information about IDs, see \l{The id Attribute}.
+
+    The value of the \uicontrol {Custom ID} field specifies the name of an
+    \l{Annotating Designs}{annotation}.
+
+    \section2 Geometry
+
+    In the \uicontrol Position group, you can set the position of a component on
+    the x and y axis. The position of a component in the UI can be either
+    absolute or relative to other components. For more information, see
+    \l{Positioning Items}.
+
+    In the 2D space, the z position of a component determines its position in
+    relation to its sibling components in the component hierarchy. You can set
+    it in the \uicontrol Z field in the \uicontrol Advanced tab.
+
+    In the \uicontrol Size group, you can set the width and height of a
+    component. You can also use the resize cursor to \l{Resizing 2D Items}
+    {resize 2D components} in \uicontrol {Form Editor} or the scaling gizmo
+    to \l{Scaling Items}{scale 3D components} in \uicontrol {3D Editor}.
+    The values in the \uicontrol X and \uicontrol Y fields change accordingly.
+
+    The component size and position can also be managed automatically
+    when \l{Using Layouts}{using layouts}.
+
+    The width and height of the root component in a component file determine
+    the size of a component. The component size might also be zero (0,0)
+    if its final size is determined by property bindings. For more
+    information, see \l {Previewing Component Size}.
+
+    \section3 Resetting Component Position and Size
+
+    To return a component to its default position after moving it,
+    select the \inlineimage qtcreator-reset-position-icon.png
+    (\uicontrol {Reset Position}) button on the \l{Design Views}
+    {Design mode toolbar}. To return it to its default size, select
+    \inlineimage qtcreator-reset-size-icon.png
     (\uicontrol {Reset Size}) button.
 
-    To set the visibility of the item, select \uicontrol Edit >
+    \section2 Visibility
-    \uicontrol Visibility in the context menu.
 
-    For more information on the properties available for an item, press
+    You can use the properties in the \uicontrol Visibility group to show and
-    \key {F1}.
+    hide components.
 
-    \section1 Specifying Custom Properties
+    Deselect the \uicontrol {Is visible} check box to hide a component and all
+    its child components, unless they have explicitly been set to be visible.
+    This might have surprise effects when using property bindings. In such
+    cases, it may be better to use the \uicontrol Opacity property instead.
 
-    Each predefined QML type has a set of properties that you can extend by
+    If this property is disabled, the component will no longer receive
-    defining additional properties for your own QML components. For more
+    \l{Mouse Area}{mouse events} but will continue to receive key events
-    information, see \l{Specifying Dynamic Properties}.
+    and will retain the keyboard focus events, if it has been set by
+    selecting the \uicontrol Enabled check box in the \uicontrol Advanced tab.
 
-    The properties you add for a QML type are displayed in the
+    The visibility value is only affected by changes to this property or the
-    \uicontrol Properties view when you select a component
+    parent's visible property. It does not change, for example, if this
-    of that type in \uicontrol Navigator or \uicontrol {Form Editor}.
+    component moves off-screen, or if the opacity changes to 0.
 
-    \image qtquick-custom-properties.png "Custom properties in Properties view"
+    In the \uicontrol Opacity field, specify the opacity of a component as a
+    number between 0.0 (fully transparent) and 1.0 (fully opaque). The specified
+    opacity is also applied individually to child components, sometimes with
+    surprising effects.
 
-    \section1 Viewing Changes in Properties
+    Changing a component's opacity does not affect whether the component
+    receives user input events.
 
-    The default values of properties are displayed in white color, while the
+    You can \l{Creating Animations}{animate} the opacity value to make a
-    values that you specify explicitly are highlighted with blue color. In
+    component fade in and out.
-    addition, property changes in states are highlighted with blue.
 
-    This allows you to easily see which values are set in the UI form or QML
+    If the \uicontrol Clip check box is selected, the component and its children
-    file and which values are default characteristics of a QML type or a
+    are clipped to the bounding rectangle of the component.
-    component.
 
-    When editing states, you can easily see which values are explicitly set in
+    \section1 Managing 2D Transformations
-    the current state and which values are derived from the base state.
 
-    The following images illustrate this. In the base state, the \uicontrol Size
+    You can assign any number of transformations, such as rotation and scaling,
-    (1) and \uicontrol Colors (2) values are explicitly set and highlighted.
+    to a component in the \uicontrol Advanced tab of the \uicontrol Properties
+    view. Each transformation is applied in order, one at a time.
 
-    \image qmldesigner-properties-explicit-base.png "Explicitly set properties"
+    \image qtquick-item-properties-advanced.png "Advanced component properties"
 
-    In \uicontrol State1, only the color (1) is explicitly set and highlighted.
+    In the \uicontrol Origin field, select the origin point for scaling and
+    rotation.
 
-    \image qmldesigner-properties-explicit-state1.png "Explicitly set properties"
+    Set the scale factor in the \uicontrol Scale field. A value of less than
+    1.0 makes the component smaller, whereas a value greater than 1.0 makes
+    it larger. A negative value causes the component to be mirrored in
+    \uicontrol {Form Editor}.
 
-    Resetting a property sets it back to the default value and removes the value
+    In the \uicontrol Rotation field, specify the rotation of the component
-    from the UI form or QML file.
+    in degrees clockwise around the origin point.
 
-    \note As a result, all boolean values can be visualized in four different
+    Alternatively, you can move, resize, or rotate components by dragging them
-    ways.
+    in \l{Form Editor}.
 
-    For example, visibility can be visualized as follows:
+    For more information about transforming 3D components, see
-
+    \l{Managing 3D Transformations} and \l{Working in 3D Editor}.
-    \table
-        \row
-            \li \image qmldesigner-boolean-true.png
-            \li TRUE
-            \li The QML type is visible by default. The visibility might be
-                overridden by the visibility set in the base state.
-        \row
-            \li \image qmldesigner-boolean-true-blue.png
-            \li TRUE (highlighted)
-            \li The QML type is explicitly set to visible.
-        \row
-            \li \image qmldesigner-boolean-false.png
-            \li FALSE
-            \li The QML type is hidden by default. The visibility might be
-                overridden by the visibility set in the base state.
-        \row
-            \li \image qmldesigner-boolean-false-blue.png
-            \li FALSE (hightlighted)
-            \li The type is explicitly set to hidden.
-    \endtable
 
     \section1 Picking Colors
 
-    To specify the color of the selected item in the color picker view (1),
+    To specify the color of the selected component in the color picker view (1),
     select the color picker icon (2) in the \uicontrol Properties view.
 
     \image qtquick-designer-color-picker.png "Color Picker view"
@@ -138,7 +173,7 @@
     You can use either a solid color (3) or a gradient (4). You can select the
     gradient in the \uicontrol {Gradient Picker} (5).
 
-    The \uicontrol Original field displays the original color of the item,
+    The \uicontrol Original field displays the original color of the component,
     whereas the \uicontrol New field displays the current color. The
     \uicontrol Recent field displays the colors that you have last selected.
 
@@ -159,13 +194,13 @@
 
     Calculating gradients can be computationally expensive compared to the
     use of solid color fills or images. Consider using gradients only for
-    static items in a UI.
+    static components in a UI.
 
     \if defined(qtdesignstudio)
     \section2 Setting Gradient Properties
 
     Select the arrow below the gradient button to set gradient properties
-    for Studio Components.
+    for \l{Shapes}{Studio Components}.
 
     \image qtquick-designer-gradient-types.png "Gradients supported by Studio Components"
 
@@ -189,7 +224,7 @@
     \image qtquick-designer-gradient-properties-radial.png "Radial gradient properties"
 
     You can set the center and focal radius in the \uicontrol {Center radius}
-    and \uicontrol {Focal radius} fields. For simple radial gradients, set to
+    and \uicontrol {Focal radius} fields. For simple radial gradients, set
     the focal radius to 0.
 
     You can set the center and focal points in the \uicontrol CenterX,
@@ -210,7 +245,7 @@
     \section2 Selecting Web Gradients
 
     The \uicontrol {Gradient Picker} enables you to specify
-    \l{https://webgradients.com/}{WebGradients} for QML types
+    \l{https://webgradients.com/}{WebGradients} for components
     that support \l QGradient.
 
     To open the \uicontrol {Gradient Picker}, select the
@@ -218,7 +253,7 @@
 
     \image qtquick-designer-gradient-picker.png "Gradient Picker dialog"
 
-    To apply a gradient on the selected item, select \uicontrol Apply.
+    To apply a gradient on the selected component, select \uicontrol Apply.
 
     To save a gradient in the \uicontrol {User Presets} tab, select
     \uicontrol Save.
@@ -226,9 +261,9 @@
     By default, a linear gradient (4) is used, but you can select another
     supported gradient type in the \uicontrol Properties view.
 
-    \section1 Marking Text Items for Translation
+    \section1 Marking Text Components for Translation
 
-    To support translators, mark each text item that should be translated.
+    To support translators, mark each text component that should be translated.
     In the \uicontrol Properties view, \uicontrol Text field, select \uicontrol tr (1).
 
     \image qmldesigner-text-property-tr.png "Text properties"
@@ -257,126 +292,11 @@
     You can add other languages later by editing the project file.
     \endif
 
-    \target basic-item
-    \section1 Specifying Basic Item Properties
-
-    All QML types share a set of properties that you can specify in
-    \uicontrol Properties.
-
-    \image qtquick-item-properties-common.png "Basic item properties"
-
-    \section2 Type
-
-    When you create a component using a QML type, the component has all the
-    properties of the type you used. If you realize later that another QML
-    type with another set of predefined properties would be more suitable for
-    your purposes, you can change the component type by double-clicking the
-    \uicontrol Type field and entering the name of another QML type in the
-    field.
-
-    If you have specified values for properties that are not supported by
-    the new type, \QC offers to remove them for you. If you'd rather do
-    this yourself, you can select the \inlineimage icons/action-icon.png
-    (\uicontrol Actions) menu next to the property name, and then select
-    \uicontrol Reset to remove the property values before trying again.
-
-    \section2 Id
-
-    Each QML type and each instance of a QML type has an \e id that uniquely
-    identifies it and enables other items' properties to be bound to it.
-    You can specify ids for items in the \uicontrol Id field.
-
-    An id must be unique, it must begin with a lower-case letter or an
-    underscore character, and it can contain only letters, numbers, and
-    underscore characters.
-
-    For more information, see \l{The id Attribute}.
-
-    The value of the \uicontrol {Custom id} field specifies the name of an
-    \l{Annotating Designs}{annotation}.
-
-    \section2 Geometry
-
-    In the \uicontrol Position group, you can set the position of an item on
-    the x and y axis. The position of an item in the UI can be either absolute
-    or relative to other items. For more information, see
-    \l{Positioning Items}.
-
-    The z position of an item determines its position in relation to its
-    sibling items in the type hierarchy. You can set it in the \uicontrol Z
-    field in the \uicontrol Advanced tab.
-
-    In the \uicontrol Size group, you can set the width and height of
-    an item. You can also use the resize cursor to \l{Resizing 2D Items}
-    {resize 2D items} in \uicontrol {Form Editor} or the scaling gizmo
-    to \l{Scaling Items}{scale 3D items} in \uicontrol {3D Editor}. The
-    values in the \uicontrol X and \uicontrol Y fields change accordingly.
-
-    The item size and position can also be managed automatically
-    when \l{Using Layouts}{using layouts}.
-
-    The width and height of the root item in a QML file determine the
-    size of a component. The component size might also be zero (0,0)
-    if its final size is determined by property bindings. For more
-    information, see \l {Previewing Component Size}.
-
-    \section2 Visibility
-
-    You can use the properties in the \uicontrol Visibility group to show and
-    hide items.
-
-    Deselect the \uicontrol {Is visible} check box to hide an item and all its
-    child items, unless they have explicitly been set to be visible. This might
-    have surprise effects when using property bindings. In such cases, it may be
-    better to use the \uicontrol Opacity property instead.
-
-    If this property is disabled, the item will no longer receive mouse events,
-    but will continue to receive key events and will retain the keyboard focus
-    if it has been set by selecting the \uicontrol Enabled check box in the
-    \uicontrol Advanced tab.
-
-    The visibility value is only affected by changes to this property or the
-    parent's visible property. It does not change, for example, if this item
-    moves off-screen, or if the opacity changes to 0.
-
-    In the \uicontrol Opacity field, specify the opacity of an item as a number
-    between 0.0 (fully transparent) and 1.0 (fully opaque). The specified
-    opacity is also applied individually to child items, sometimes with
-    surprising effects.
-
-    Changing an item's opacity does not affect whether the item receives user
-    input events.
-
-    You can \l{Creating Animations}{animate} the opacity value to make items
-    fade in and out.
-
-    If the \uicontrol Clip check box is selected, the item and its children are
-    clipped to the bounding rectangle of the item.
-
-    \section1 Managing 2D Transformations
-
-    You can assign any number of transformations, such as rotation and scaling,
-    to an item in the \uicontrol Advanced tab of the \uicontrol Properties view.
-    Each transformation is applied in order, one at a time.
-
-    \image qtquick-item-properties-advanced.png "Advanced item properties"
-
-    In the \uicontrol Origin field, select the origin point for scaling and
-    rotation.
-
-    Set the scale factor in the \uicontrol Scale field. A value of less than
-    1.0 makes the component smaller, whereas a value greater than 1.0 makes
-    it larger. A negative value causes the component to be mirrored in
-    \uicontrol {Form Editor}.
-
-    In the \uicontrol Rotation field, specify the rotation of the component
-    in degrees clockwise around the origin point.
-
     \section1 Specifying Developer Properties
 
     In the \uicontrol Advanced tab of the \uicontrol Properties view, you can
-    manage the more advanced properties of QML types that are based on the
+    manage the more advanced properties of components that are based on the
-    \l Item type and are mostly used by application developers.
+    \l Item component and that are mostly used by application developers.
 
     Select the \uicontrol Smooth check box to activate smooth sampling. Smooth
     sampling is performed using linear interpolation, while non-smooth sampling
@@ -384,28 +304,28 @@
     impact on performance, it is activated by default.
 
     The value of the \uicontrol {Baseline offset} specifies the position of the
-    item's baseline in local coordinates. The baseline of a Text item is the
+    component's baseline in local coordinates. The baseline of a \l Text
-    imaginary line on which the text sits. Controls containing text usually set
+    component is the imaginary line on which the text sits. Controls containing
-    their baseline to the baseline of their text. For non-text items, a default
+    text usually set their baseline to the baseline of their text. For non-text
-    baseline offset of 0 is used.
+    components, a default baseline offset of 0 is used.
 
     \section2 Managing Mouse and Keyboard Events
 
-    Select the \uicontrol Enabled check box to allow the item to receive mouse
+    Select the \uicontrol Enabled check box to allow the component to receive
-    and keyboard events. The children of the item inherit this behavior, unless
+    mouse and keyboard events. The children of the component inherit this
-    you explicitly set this value for them.
+    behavior, unless you explicitly set this value for them.
 
-    You can enable the \uicontrol Focus check box to specify that the item has
+    You can enable the \uicontrol Focus check box to specify that the component
-    active focus and the \uicontrol {Active focus on tab} check box to add the
+    has active focus and the \uicontrol {Active focus on tab} check box to add
-    item to the \e {tab focus chain}. The tab focus chain traverses elements by
+    the component to the \e {tab focus chain}. The tab focus chain traverses
-    first visiting the parent, and then its children in the order they are
+    components by first visiting the parent, and then its children in the order
-    defined. Pressing \key Tab on an item in the tab focus chain moves
+    they are defined. Pressing \key Tab on a component in the tab focus chain
-    keyboard focus to the next item in the chain. Pressing back tab (usually,
+    moves keyboard focus to the next component in the chain. Pressing back tab
-    \key {Shift+Tab}) moves focus to the previous item.
+    (usually, \key {Shift+Tab}) moves focus to the previous component.
 
     \section2 Using Layers
 
-    Qt Quick 2 makes use of a dedicated scene graph that is then traversed and
+    Qt Quick makes use of a dedicated scene graph that is then traversed and
     rendered via a graphics API such as OpenGL ES, OpenGL, Vulkan, Metal, or
     Direct 3D. Using a scene graph for graphics rather than the traditional
     imperative painting systems, means that the scene to be rendered can be
@@ -414,8 +334,8 @@
     such as \l{Batching}{batch rendering} to minimize state changes and
     discarding obscured primitives.
 
-    For example, if a user-interface contains a list of ten items where each
+    For example, a UI might contain a list of ten items where
-    item has a background color, an icon and a text. Using the traditional
+    each item has a background color, an icon and a text. Using traditional
     drawing techniques, this would result in 30 draw calls and a similar
     amount of state changes. A scene graph, on the other hand, could reorganize
     the primitives to render such that all backgrounds are drawn in one call,
@@ -423,34 +343,34 @@
     to only 3. Batching and state change reduction like this can greatly
     improve performance on some hardware.
 
-    You need a basic understanding of how items are rendered in QML
+    You need a basic understanding of how components are rendered
     to be able to set layer properties. Rendering is described in
     \l {Qt Quick Scene Graph Default Renderer}.
 
     \image qtquick-item-properties-layer.png "Layer properties"
 
-    Items are normally rendered directly into the window they belong to.
+    Components are normally rendered directly into the window they belong to.
     However, by selecting the \uicontrol Enabled check box in the
-    \uicontrol Layer group, you can delegate the item and its entire subtree
+    \uicontrol Layer group, you can delegate the component and its entire subtree
     into an offscreen surface. Only the offscreen surface, a texture, will
     then be drawn into the window. For more information, see \l{Item Layers}.
 
-    When layering is enabled, you can use the item directly as a texture,
+    When layering is enabled, you can use the component directly as a texture,
-    in combination with the item you select in the \uicontrol Effect field.
+    in combination with the component you select in the \uicontrol Effect field.
-    Typically, this item should be a shader effect with a source texture
+    Typically, this component should be a shader effect with a source texture
     specified. You can use the effects in the \uicontrol Effects section
-    of \uicontrol Library that are based on the QML types in the
+    of \uicontrol Library that are based on the components in the
     \l {Qt Graphical Effects} module.
 
-    To enable the item to pass the layer's offscreen surface to the effect
+    To enable the component to pass the layer's offscreen surface to the effect
     correctly, the \uicontrol {Sampler name} field is set to the source
     property of the texture.
 
-    Note that when an item's layer is enabled, the scene graph will allocate
+    Note that when a component's layer is enabled, the scene graph will allocate
     memory in the GPU equal to width x height x 4. In memory constrained
-    configurations, large layers should be used with care. Also, an item
+    configurations, large layers should be used with care. Also, a component
     using a layer cannot be batched during rendering. This means that a
-    scene with many layered items may have performance problems.
+    scene with many layered components may have performance problems.
 
     By default, multisampling is enabled for the entire window if the scenegraph
     renderer is in use and the underlying graphics API supports it. By setting
@@ -471,17 +391,18 @@
     In the \uicontrol {Texture mirroring} field, specify whether the generated
     OpenGL texture should be mirrored by flipping it along the x or y axis.
     Custom mirroring can be useful if the generated texture is directly accessed
-    by custom shaders. If no effect is specified for the layered item, mirroring
+    by custom shaders. If no effect is specified for the layered component,
-    has no effect on the UI representation of the item.
+    mirroring has no effect on the UI representation of the component.
 
-    The item will use linear interpolation for scaling if the \uicontrol Smooth
+    The component will use linear interpolation for scaling if the
-    check box is selected. To use a mipmap for downsampling, select the
+    \uicontrol Smooth check box is selected. To use a mipmap for downsampling,
-    \uicontrol Mipmap check box. Mipmapping may improve the visual quality of
+    select the \uicontrol Mipmap check box. Mipmapping may improve the visual
-    downscaled items. For mipmapping of single Image items, select the
+    quality of downscaled components. For mipmapping of single Image components,
-    \uicontrol Mipmap check box in the image properties, instead.
+    select the \uicontrol Mipmap check box in the \l{Images}{image properties},
+    instead.
 
-    To use a texture with a size different from that of the item, specify the
+    To use a texture with a size different from that of the component, specify
-    width and height of the texture in the \uicontrol {Texture size} field.
+    the width and height of the texture in the \uicontrol {Texture size} field.
 
     The \uicontrol {Wrap mode} defines the OpenGL wrap modes associated with
     the texture. You can clamp the texture to edges or repeat it horizontally
@@ -490,11 +411,11 @@
 
     \section1 Editing Properties Inline
 
-    You can double-click objects on the canvas to edit their text, color,
+    You can double-click components in \l {Form Editor} to edit their
-    or source properties inline. Because you can specify several of these
+    text, color, or source properties inline. Because you can specify several
-    properties for some QML types, such as \l {text-edit}{Text Edit},
+    of these properties for some components, such as \l {text-edit}{Text Edit},
-    you can also right-click objects to open the inline editors from a
+    you can also right-click components to open the inline editors from the
-    context-menu.
+    context menu.
 
     \image qmldesigner-inline-editing.png
 */

doc/qtcreator/src/qtquick/qtquick-transition-editor.qdocinc

@@ -31,7 +31,7 @@
     To make movement between states smooth, you can use
     \uicontrol {Transition Editor} to animate the changes between
     states. First, you need to \l{Creating States}{add states} in
-    the \uicontrol States view and \l{Specifying Item Properties}
+    the \uicontrol States view and \l{Specifying Component Properties}
     {edit some properties} that can be animated, such as colors or
     numbers, in the \uicontrol Properties view. For example, you
     can animate the changes in the position of an object.

doc/qtcreator/src/qtquick/qtquick-uis.qdoc

@@ -82,7 +82,7 @@
             You can manage the items in the current QML file and their
             relationships in the \uicontrol Navigator view.
 
-        \li \l {Specifying Item Properties}
+        \li \l {Specifying Component Properties}
 
             You can specify values for the properties of a component to change
             its appearance and behavior. All QML types have a set of predefined

doc/qtdesignstudio/src/qtbridge/qtbridge-figma-using.qdoc

@@ -124,8 +124,8 @@
             layer into. The component that is generated during import will be
             of this type. For example, if you drew a rectangle, you can export
             it as a \l Rectangle component. You can provide the
-            \l{QML Imports}{import statement} of the component set where the
+            \l{Learn Qt Quick - QML Types}{import statement} of the component
-            component is defined in the \uicontrol {Imports} field.
+            set where the component is defined in the \uicontrol {Imports} field.
     \row
         \li \uicontrol Properties
         \li Sets values of properties for the component. You can add properties

doc/qtdesignstudio/src/qtdesignstudio-toc.qdoc

@@ -61,6 +61,7 @@
                             \li \l{Form Editor}
                             \li \l{Library}
                             \li \l{Navigator}
+                            \li \l{Properties}
                         \endlist
                         \li \l{Managing Workspaces}
                         \li \l{Managing Sessions}
@@ -99,7 +100,7 @@
                     \li \l{Creating Buttons}
                     \li \l{Creating Scalable Buttons and Borders}
                 \endlist
-                \li \l{Specifying Item Properties}
+                \li \l{Specifying Component Properties}
                 \li \l{Positioning Items}
                 \li \l{Using Custom Fonts}
                 \li \l{Annotating Designs}

doc/qtdesignstudio/src/qtdesignstudio.qdoc

@@ -63,7 +63,7 @@
                 \list
                     \li \l{Designing Application Flows}
                     \li \l{Creating Components}
-                    \li \l{Specifying Item Properties}
+                    \li \l{Specifying Component Properties}
                     \li \l{Positioning Items}
                     \li \l{Annotating Designs}
                 \endlist

doc/qtdesignstudio/src/qtquick3d-editor/qtdesignstudio-3d-design-mode.qdoc

@@ -63,7 +63,7 @@
         \li \uicontrol {Properties} (5) organizes the properties of the
             selected item. You can change the properties also in \uicontrol
             {Text Editor}. For more information, see
-            \l {Specifying Item Properties}.
+            \l {Specifying Component Properties}.
         \li \uicontrol Connections (6) enables you to create connections
             between objects, signals, and object properties. For more
             information, see \l{Adding Connections}.