1// Copyright © SixtyFPS GmbH <info@slint.dev>
2// SPDX-License-Identifier: GPL-3.0-only OR LicenseRef-Slint-Royalty-free-2.0 OR LicenseRef-Slint-Software-3.0
3
4import { VerticalBox } from "../common/layout.slint";
5import { Button } from "./button.slint";
6import { CosmicPalette, CosmicFontSettings, Icons } from "styling.slint";
7import { MenuBorder } from "./components.slint";
8import { StandardButton } from "../common/standardbutton.slint";
9
10import { Date, DatePickerBase } from "../common/datepicker_base.slint";
11export { Date }
12
13export component DatePickerPopup inherits PopupWindow {
14 in property <string> title: "Select date";
15 in property <Date> date <=> base.date;
16
17 callback canceled();
18 callback accepted(date: Date);
19
20 width: 360px;
21 height: 524px;
22 close-policy: PopupClosePolicy.no-auto-close;
23
24 background-layer := MenuBorder {
25 width: dialog.width;
26 height: dialog.height;
27 }
28
29 dialog := Dialog {
30 padding: 8px;
31
32 base := DatePickerBase {
33 title: root.title;
34 style: {
35 border-brush: CosmicPalette.border,
36 vertical-spacing: 8px,
37 horizontal-spacing: 4px,
38 calendar-style: {
39 spacing: 8px,
40 delegate-style: {
41 font-size: CosmicFontSettings.body-strong.font-size,
42 font-weight: CosmicFontSettings.body-strong.font-weight,
43 foreground: CosmicPalette.foreground,
44 state-brush: CosmicPalette.state,
45 background-selected: CosmicPalette.accent-background,
46 foreground-selected: CosmicPalette.accent-foreground,
47 state-brush-selected: CosmicPalette.state-secondary,
48 border-color-today: CosmicPalette.accent-background,
49 foreground-today: CosmicPalette.accent-background,
50 state-brush-today: CosmicPalette.state,
51 }
52 },
53 icon-button-style: {
54 foreground: CosmicPalette.foreground,
55 state-brush: CosmicPalette.state,
56 icon-size: 12px,
57 },
58 current-day-style: {
59 font-size: CosmicFontSettings.title.font-size,
60 font-weight: CosmicFontSettings.title.font-weight,
61 foreground: CosmicPalette.foreground,
62 },
63 title-style: {
64 font-size: CosmicFontSettings.body.font-size,
65 font-weight: CosmicFontSettings.body.font-weight,
66 foreground: CosmicPalette.foreground,
67 },
68 previous-icon: Icons.arrow-back,
69 next-icon: Icons.arrow-forward,
70 drop-down-icon: Icons.dropdown,
71 input-icon: Icons.edit,
72 calendar-icon: Icons.calendar,
73 selection-button-style: {
74 foreground: CosmicPalette.foreground,
75 state-brush: CosmicPalette.state,
76 icon-size: 8px,
77 font-size: CosmicFontSettings.body.font-size,
78 font-weight: CosmicFontSettings.body.font-weight
79 }
80 };
81 }
82
83 StandardButton {
84 kind: cancel;
85
86 clicked => {
87 root.close();
88 root.canceled();
89 }
90 }
91
92 StandardButton {
93 enabled: base.ok-enabled();
94 kind: ok;
95
96 clicked => {
97 root.close();
98 root.accepted(base.get-current-date());
99 }
100 }
101 }
102}
103