Warning, /libraries/kirigami-addons/src/components/Banner.qml is written in an unsupported language. File is not indexed.
0001 // SPDX-FileCopyrightText: 2023 Carl Schwan <carl@carlschwan.eu>
0002 // SPDX-License-Identifier: LGPL-2.0-only OR LGPL-3.0-only OR LicenseRef-KDE-Accepted-GPL
0003
0004 import QtQuick 2.15
0005 import QtQuick.Controls 2.15 as QQC2
0006 import QtQuick.Templates 2.15 as T
0007 import QtQuick.Layouts 1.15
0008 import org.kde.kirigami 2.20 as Kirigami
0009
0010 /**
0011 * @brief An banner Item with support for informational, positive,
0012 * warning and error types, and with support for associated actions.
0013 *
0014 * Banner can be used to inform or interact with the user
0015 * without requiring the use of a dialog and are positionned in the footer
0016 * or header of a page. For inline content, see org::kde::kirigami::InlineMessage.
0017 *
0018 * The Banner is hidden by default.
0019 *
0020 * Optionally, actions can be added which are shown alongside an
0021 * optional close button on the right side of the Item. If more
0022 * actions are set than can fit, an overflow menu is provided.
0023 *
0024 * Example usage:
0025 * @code{.qml}
0026 * Banner {
0027 * type: Kirigami.MessageType.Error
0028 *
0029 * text: "My error message"
0030 *
0031 * actions: [
0032 * Kirigami.Action {
0033 * icon.name: "edit"
0034 * text: "Action text"
0035 * onTriggered: {
0036 * // do stuff
0037 * }
0038 * },
0039 * Kirigami.Action {
0040 * icon.name: "edit"
0041 * text: "Action text"
0042 * onTriggered: {
0043 * // do stuff
0044 * }
0045 * }
0046 * ]
0047 * }
0048 * @endcode
0049 * @since KirigamiAddons 0.10.0
0050 * @inherit QtQuick.Controls.Control
0051 */
0052 T.ToolBar {
0053 id: root
0054
0055 /**
0056 * @brief This signal is emitted when a link is hovered in the message text.
0057 * @param The hovered link.
0058 */
0059 signal linkHovered(string link)
0060
0061 /**
0062 * @brief This signal is emitted when a link is clicked or tapped in the message text.
0063 * @param The clicked or tapped link.
0064 */
0065 signal linkActivated(string link)
0066
0067 /**
0068 * @brief This property holds the link embedded in the message text that the user is hovering over.
0069 */
0070 readonly property alias hoveredLink: label.hoveredLink
0071
0072 /**
0073 * @brief This property holds the message type.
0074 *
0075 * The following values are allowed:
0076 * * ``Kirigami.MessageType.Information``
0077 * * ``Kirigami.MessageType.Positive``
0078 * * ``Kirigami.MessageType.Warning``
0079 * * ``Kirigami.MessageType.Error``
0080 *
0081 * default: ``Kirigami.MessageType.Information``
0082 *
0083 * @property Kirigami.MessageType type
0084 */
0085 property int type: Kirigami.MessageType.Information
0086
0087 /**
0088 * @brief This property holds the message title.
0089 */
0090 property string title
0091
0092 /**
0093 * @brief This property holds the message text.
0094 */
0095 property string text
0096
0097 /**
0098 * @brief This property holds whether the close button is displayed.
0099 *
0100 * default: ``false``
0101 */
0102 property bool showCloseButton: false
0103
0104 /**
0105 * This property holds the list of Kirigami Actions to show in the banner's
0106 * internal kirigami::ActionToolBar.
0107 *
0108 * Actions are added from left to right. If more actions
0109 * are set than can fit, an overflow menu is provided.
0110 */
0111 property list<Kirigami.Action> actions
0112
0113 padding: Kirigami.Units.smallSpacing
0114
0115 implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, contentWidth + leftPadding + rightPadding)
0116 implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, contentHeight + topPadding + bottomPadding)
0117
0118 visible: false
0119
0120 contentItem: GridLayout {
0121 columns: 3
0122 columnSpacing: Kirigami.Units.mediumSpacing
0123 rowSpacing: 0
0124
0125 Item {
0126 Layout.preferredWidth: closeButton.visible ? closeButton.implicitWidth : Kirigami.Units.iconSizes.medium
0127 Layout.preferredHeight: closeButton.visible ? closeButton.implicitWidth : Kirigami.Units.iconSizes.medium
0128 Layout.alignment: Qt.AlignTop
0129 Layout.rowSpan: 2
0130
0131 Kirigami.Icon {
0132 source: {
0133 switch (root.type) {
0134 case Kirigami.MessageType.Positive:
0135 return "emblem-positive";
0136 case Kirigami.MessageType.Warning:
0137 return "data-warning";
0138 case Kirigami.MessageType.Error:
0139 return "data-error";
0140 default:
0141 return "data-information";
0142 }
0143 }
0144
0145 anchors.centerIn: parent
0146 }
0147 }
0148
0149 Kirigami.Heading {
0150 id: heading
0151
0152 level: 2
0153 text: root.title
0154 visible: text.length > 0
0155
0156 Layout.row: visible ? 0 : 1
0157 Layout.column: 1
0158 }
0159
0160 Kirigami.SelectableLabel {
0161 id: label
0162
0163 color: Kirigami.Theme.textColor
0164 wrapMode: Text.WordWrap
0165
0166 text: root.text
0167
0168 verticalAlignment: Text.AlignVCenter
0169
0170 onLinkHovered: link => root.linkHovered(link)
0171 onLinkActivated: link => root.linkActivated(link)
0172
0173 Layout.fillWidth: true
0174 Layout.fillHeight: true
0175 Layout.minimumHeight: closeButton.visible ? closeButton.implicitWidth : Kirigami.Units.iconSizes.medium
0176 Layout.alignment: heading.text.length > 0 || label.lineCount > 1 ? Qt.AlignTop : Qt.AlignBaseline
0177
0178 Layout.row: heading.visible ? 1 : 0
0179 Layout.column: 1
0180 }
0181
0182 QQC2.ToolButton {
0183 id: closeButton
0184
0185 visible: root.showCloseButton
0186 text: i18ndc("kirigami-addons6", "@action:button", "Close")
0187
0188 icon.name: "dialog-close"
0189 display: QQC2.ToolButton.IconOnly
0190
0191 onClicked: root.visible = false
0192
0193 Layout.alignment: Qt.AlignTop
0194
0195 QQC2.ToolTip.visible: Kirigami.Settings.tabletMode ? closeButton.pressed : closeButton.hovered
0196 QQC2.ToolTip.delay: Kirigami.Units.toolTipDelay
0197 QQC2.ToolTip.text: text
0198
0199 Layout.rowSpan: 2
0200 Layout.column: 2
0201 }
0202
0203 Kirigami.ActionToolBar {
0204 id: actionsLayout
0205
0206 flat: false
0207 actions: root.actions
0208 visible: root.actions.length > 0
0209 alignment: Qt.AlignRight
0210
0211 Layout.column: 0
0212 Layout.columnSpan: 3
0213 Layout.row: 2
0214 }
0215 }
0216
0217 background: Item {
0218
0219 Rectangle {
0220 color: {
0221 switch (root.type) {
0222 case Kirigami.MessageType.Positive:
0223 return Kirigami.Theme.positiveBackgroundColor;
0224 case Kirigami.MessageType.Warning:
0225 return Kirigami.Theme.neutralBackgroundColor;
0226 case Kirigami.MessageType.Error:
0227 return Kirigami.Theme.negativeBackgroundColor;
0228 default:
0229 return Kirigami.Theme.activeBackgroundColor;
0230 }
0231 }
0232 anchors.fill: parent
0233 }
0234
0235 Rectangle {
0236 id: separator
0237
0238 height: 1
0239 color: {
0240 let separatorColor = Kirigami.ColorUtils.linearInterpolation(Kirigami.Theme.backgroundColor, Kirigami.Theme.textColor, Kirigami.Theme.frameContrast);
0241 let textColor = Kirigami.Theme.activeTextColor;
0242
0243 switch (root.type) {
0244 case Kirigami.MessageType.Positive:
0245 textColor = Kirigami.Theme.positiveTextColor;
0246 break;
0247 case Kirigami.MessageType.Warning:
0248 textColor = Kirigami.Theme.neutralTextColor;
0249 break;
0250 case Kirigami.MessageType.Error:
0251 textColor = Kirigami.Theme.negativeTextColor;
0252 break;
0253 }
0254
0255 return Qt.hsla(textColor.hslHue, textColor.hslSaturation, separatorColor.hslLightness, 1);
0256 }
0257
0258 anchors {
0259 left: parent.left
0260 right: parent.right
0261 top: root.position === QQC2.ToolBar.Header ? parent.bottom : undefined
0262 bottom: root.position === QQC2.ToolBar.Header ? undefined : parent.top
0263 }
0264 }
0265 }
0266 }