| 1 | // Copyright © SixtyFPS GmbH <info@slint.dev> |
| 2 | // SPDX-License-Identifier: MIT |
| 3 | |
| 4 | import { Palette, VerticalBox } from "std-widgets.slint" ; |
| 5 | import { UsecasesPalette } from "styling.slint" ; |
| 6 | |
| 7 | export component StateContainer inherits Rectangle { |
| 8 | callback clicked <=> touch-area.clicked; |
| 9 | |
| 10 | in property <bool> checked; |
| 11 | |
| 12 | background: Palette.alternate-background; |
| 13 | border-radius: 8px; |
| 14 | |
| 15 | touch-area := TouchArea {} |
| 16 | |
| 17 | state-layer := Rectangle { |
| 18 | border-radius: root.border-radius; |
| 19 | |
| 20 | states [ |
| 21 | pressed when touch-area.pressed : { |
| 22 | state-layer.background: UsecasesPalette.state-pressed; |
| 23 | } |
| 24 | hover when touch-area.has-hover : { |
| 25 | state-layer.background: UsecasesPalette.state-hover; |
| 26 | } |
| 27 | checked when root.checked : { |
| 28 | state-layer.background: UsecasesPalette.state-selected; |
| 29 | } |
| 30 | ] |
| 31 | } |
| 32 | |
| 33 | @children |
| 34 | } |
| 35 | |
| 36 | export component Container inherits Rectangle { |
| 37 | background: Palette.alternate-background; |
| 38 | border-radius: 8px; |
| 39 | border-width: 1px; |
| 40 | |
| 41 | VerticalBox { |
| 42 | @children |
| 43 | } |
| 44 | } |
| 45 | |