azul_layout/widgets/
tabs.rs

1use azul_core::{
2    callbacks::{CoreCallback, CoreCallbackData, Update},
3    dom::{Dom, DomVec, EventFilter, HoverEventFilter, IdOrClass, IdOrClass::Class, IdOrClassVec},
4    refany::RefAny,
5};
6use azul_css::{
7    dynamic_selector::{CssPropertyWithConditions, CssPropertyWithConditionsVec},
8    props::{
9        basic::*,
10        layout::*,
11        property::{CssProperty, *},
12        style::*,
13    },
14    *,
15};
16
17use crate::callbacks::{Callback, CallbackInfo};
18
19const STRING_16146701490593874959: AzString = AzString::from_const_str("sans-serif");
20const STYLE_BACKGROUND_CONTENT_8560341490937422656_ITEMS: &[StyleBackgroundContent] =
21    &[StyleBackgroundContent::LinearGradient(LinearGradient {
22        direction: Direction::FromTo(DirectionCorners {
23            dir_from: DirectionCorner::Top,
24            dir_to: DirectionCorner::Bottom,
25        }),
26        extend_mode: ExtendMode::Clamp,
27        stops: NormalizedLinearColorStopVec::from_const_slice(
28            LINEAR_COLOR_STOP_1400070954008106244_ITEMS,
29        ),
30    })];
31
32const STYLE_BACKGROUND_CONTENT_15534185073326444643_ITEMS: &[StyleBackgroundContent] =
33    &[StyleBackgroundContent::LinearGradient(LinearGradient {
34        direction: Direction::FromTo(DirectionCorners {
35            dir_from: DirectionCorner::Top,
36            dir_to: DirectionCorner::Bottom,
37        }),
38        extend_mode: ExtendMode::Clamp,
39        stops: NormalizedLinearColorStopVec::from_const_slice(
40            LINEAR_COLOR_STOP_16259001466875079747_ITEMS,
41        ),
42    })];
43const STYLE_BACKGROUND_CONTENT_16746671892555275291_ITEMS: &[StyleBackgroundContent] =
44    &[StyleBackgroundContent::Color(ColorU {
45        r: 255,
46        g: 255,
47        b: 255,
48        a: 255,
49    })];
50const STYLE_FONT_FAMILY_8122988506401935406_ITEMS: &[StyleFontFamily] =
51    &[StyleFontFamily::System(STRING_16146701490593874959)];
52const LINEAR_COLOR_STOP_1400070954008106244_ITEMS: &[NormalizedLinearColorStop] = &[
53    NormalizedLinearColorStop {
54        offset: PercentageValue::const_new(0),
55        color: ColorU {
56            r: 240,
57            g: 240,
58            b: 240,
59            a: 255,
60        },
61    },
62    NormalizedLinearColorStop {
63        offset: PercentageValue::const_new(100),
64        color: ColorU {
65            r: 229,
66            g: 229,
67            b: 229,
68            a: 255,
69        },
70    },
71];
72const LINEAR_COLOR_STOP_16259001466875079747_ITEMS: &[NormalizedLinearColorStop] = &[
73    NormalizedLinearColorStop {
74        offset: PercentageValue::const_new(0),
75        color: ColorU {
76            r: 236,
77            g: 244,
78            b: 252,
79            a: 255,
80        },
81    },
82    NormalizedLinearColorStop {
83        offset: PercentageValue::const_new(100),
84        color: ColorU {
85            r: 221,
86            g: 237,
87            b: 252,
88            a: 255,
89        },
90    },
91];
92
93const CSS_MATCH_13824480602841492081_PROPERTIES: &[CssPropertyWithConditions] = &[
94    // .__azul-native-tabs-header p.__azul-native-tabs-tab-not-active:hover
95    CssPropertyWithConditions::on_hover(CssProperty::BorderBottomWidth(
96        LayoutBorderBottomWidthValue::Exact(LayoutBorderBottomWidth {
97            inner: PixelValue::const_px(1),
98        }),
99    )),
100    CssPropertyWithConditions::on_hover(CssProperty::BorderLeftWidth(
101        LayoutBorderLeftWidthValue::Exact(LayoutBorderLeftWidth {
102            inner: PixelValue::const_px(1),
103        }),
104    )),
105    CssPropertyWithConditions::on_hover(CssProperty::BorderRightWidth(
106        LayoutBorderRightWidthValue::Exact(LayoutBorderRightWidth {
107            inner: PixelValue::const_px(1),
108        }),
109    )),
110    CssPropertyWithConditions::on_hover(CssProperty::BorderTopWidth(
111        LayoutBorderTopWidthValue::Exact(LayoutBorderTopWidth {
112            inner: PixelValue::const_px(1),
113        }),
114    )),
115    CssPropertyWithConditions::on_hover(CssProperty::BorderBottomStyle(
116        StyleBorderBottomStyleValue::Exact(StyleBorderBottomStyle {
117            inner: BorderStyle::Solid,
118        }),
119    )),
120    CssPropertyWithConditions::on_hover(CssProperty::BorderLeftStyle(
121        StyleBorderLeftStyleValue::Exact(StyleBorderLeftStyle {
122            inner: BorderStyle::Solid,
123        }),
124    )),
125    CssPropertyWithConditions::on_hover(CssProperty::BorderRightStyle(
126        StyleBorderRightStyleValue::Exact(StyleBorderRightStyle {
127            inner: BorderStyle::Solid,
128        }),
129    )),
130    CssPropertyWithConditions::on_hover(CssProperty::BorderTopStyle(
131        StyleBorderTopStyleValue::Exact(StyleBorderTopStyle {
132            inner: BorderStyle::Solid,
133        }),
134    )),
135    CssPropertyWithConditions::on_hover(CssProperty::BorderBottomColor(
136        StyleBorderBottomColorValue::Exact(StyleBorderBottomColor {
137            inner: ColorU {
138                r: 126,
139                g: 180,
140                b: 234,
141                a: 255,
142            },
143        }),
144    )),
145    CssPropertyWithConditions::on_hover(CssProperty::BorderLeftColor(
146        StyleBorderLeftColorValue::Exact(StyleBorderLeftColor {
147            inner: ColorU {
148                r: 126,
149                g: 180,
150                b: 234,
151                a: 255,
152            },
153        }),
154    )),
155    CssPropertyWithConditions::on_hover(CssProperty::BorderRightColor(
156        StyleBorderRightColorValue::Exact(StyleBorderRightColor {
157            inner: ColorU {
158                r: 126,
159                g: 180,
160                b: 234,
161                a: 255,
162            },
163        }),
164    )),
165    CssPropertyWithConditions::on_hover(CssProperty::BorderTopColor(
166        StyleBorderTopColorValue::Exact(StyleBorderTopColor {
167            inner: ColorU {
168                r: 126,
169                g: 180,
170                b: 234,
171                a: 255,
172            },
173        }),
174    )),
175    CssPropertyWithConditions::on_hover(CssProperty::BackgroundContent(
176        StyleBackgroundContentVecValue::Exact(StyleBackgroundContentVec::from_const_slice(
177            STYLE_BACKGROUND_CONTENT_15534185073326444643_ITEMS,
178        )),
179    )),
180    // .__azul-native-tabs-header p.__azul-native-tabs-tab-noleftborder
181    CssPropertyWithConditions::simple(CssProperty::BorderLeftWidth(
182        LayoutBorderLeftWidthValue::None,
183    )),
184    CssPropertyWithConditions::simple(CssProperty::BorderLeftStyle(
185        StyleBorderLeftStyleValue::None,
186    )),
187    CssPropertyWithConditions::simple(CssProperty::BorderLeftColor(
188        StyleBorderLeftColorValue::None,
189    )),
190    // .__azul-native-tabs-header p.__azul-native-tabs-tab-not-active
191    CssPropertyWithConditions::simple(CssProperty::PaddingRight(LayoutPaddingRightValue::Exact(
192        LayoutPaddingRight {
193            inner: PixelValue::const_px(5),
194        },
195    ))),
196    CssPropertyWithConditions::simple(CssProperty::PaddingLeft(LayoutPaddingLeftValue::Exact(
197        LayoutPaddingLeft {
198            inner: PixelValue::const_px(5),
199        },
200    ))),
201    CssPropertyWithConditions::simple(CssProperty::PaddingBottom(LayoutPaddingBottomValue::Exact(
202        LayoutPaddingBottom {
203            inner: PixelValue::const_px(1),
204        },
205    ))),
206    CssPropertyWithConditions::simple(CssProperty::PaddingTop(LayoutPaddingTopValue::Exact(
207        LayoutPaddingTop {
208            inner: PixelValue::const_px(1),
209        },
210    ))),
211    CssPropertyWithConditions::simple(CssProperty::MarginTop(LayoutMarginTopValue::Exact(
212        LayoutMarginTop {
213            inner: PixelValue::const_px(2),
214        },
215    ))),
216    // .__azul-native-tabs-header p
217    CssPropertyWithConditions::simple(CssProperty::TextAlign(StyleTextAlignValue::Exact(
218        StyleTextAlign::Center,
219    ))),
220    CssPropertyWithConditions::simple(CssProperty::Height(LayoutHeightValue::Exact(
221        LayoutHeight::Px(PixelValue::const_px(21)),
222    ))),
223    CssPropertyWithConditions::simple(CssProperty::BorderBottomWidth(
224        LayoutBorderBottomWidthValue::Exact(LayoutBorderBottomWidth {
225            inner: PixelValue::const_px(1),
226        }),
227    )),
228    CssPropertyWithConditions::simple(CssProperty::BorderLeftWidth(
229        LayoutBorderLeftWidthValue::Exact(LayoutBorderLeftWidth {
230            inner: PixelValue::const_px(1),
231        }),
232    )),
233    CssPropertyWithConditions::simple(CssProperty::BorderRightWidth(
234        LayoutBorderRightWidthValue::Exact(LayoutBorderRightWidth {
235            inner: PixelValue::const_px(1),
236        }),
237    )),
238    CssPropertyWithConditions::simple(CssProperty::BorderTopWidth(
239        LayoutBorderTopWidthValue::Exact(LayoutBorderTopWidth {
240            inner: PixelValue::const_px(1),
241        }),
242    )),
243    CssPropertyWithConditions::simple(CssProperty::BorderBottomStyle(
244        StyleBorderBottomStyleValue::Exact(StyleBorderBottomStyle {
245            inner: BorderStyle::Solid,
246        }),
247    )),
248    CssPropertyWithConditions::simple(CssProperty::BorderLeftStyle(
249        StyleBorderLeftStyleValue::Exact(StyleBorderLeftStyle {
250            inner: BorderStyle::Solid,
251        }),
252    )),
253    CssPropertyWithConditions::simple(CssProperty::BorderRightStyle(
254        StyleBorderRightStyleValue::Exact(StyleBorderRightStyle {
255            inner: BorderStyle::Solid,
256        }),
257    )),
258    CssPropertyWithConditions::simple(CssProperty::BorderTopStyle(
259        StyleBorderTopStyleValue::Exact(StyleBorderTopStyle {
260            inner: BorderStyle::Solid,
261        }),
262    )),
263    CssPropertyWithConditions::simple(CssProperty::BorderBottomColor(
264        StyleBorderBottomColorValue::Exact(StyleBorderBottomColor {
265            inner: ColorU {
266                r: 172,
267                g: 172,
268                b: 172,
269                a: 255,
270            },
271        }),
272    )),
273    CssPropertyWithConditions::simple(CssProperty::BorderLeftColor(
274        StyleBorderLeftColorValue::Exact(StyleBorderLeftColor {
275            inner: ColorU {
276                r: 172,
277                g: 172,
278                b: 172,
279                a: 255,
280            },
281        }),
282    )),
283    CssPropertyWithConditions::simple(CssProperty::BorderRightColor(
284        StyleBorderRightColorValue::Exact(StyleBorderRightColor {
285            inner: ColorU {
286                r: 172,
287                g: 172,
288                b: 172,
289                a: 255,
290            },
291        }),
292    )),
293    CssPropertyWithConditions::simple(CssProperty::BorderTopColor(
294        StyleBorderTopColorValue::Exact(StyleBorderTopColor {
295            inner: ColorU {
296                r: 172,
297                g: 172,
298                b: 172,
299                a: 255,
300            },
301        }),
302    )),
303    CssPropertyWithConditions::simple(CssProperty::BackgroundContent(
304        StyleBackgroundContentVecValue::Exact(StyleBackgroundContentVec::from_const_slice(
305            STYLE_BACKGROUND_CONTENT_8560341490937422656_ITEMS,
306        )),
307    )),
308    CssPropertyWithConditions::simple(CssProperty::AlignItems(LayoutAlignItemsValue::Exact(
309        LayoutAlignItems::Center,
310    ))),
311];
312const CSS_MATCH_13824480602841492081: CssPropertyWithConditionsVec =
313    CssPropertyWithConditionsVec::from_const_slice(CSS_MATCH_13824480602841492081_PROPERTIES);
314
315const CSS_MATCH_14575853790110873394_PROPERTIES: &[CssPropertyWithConditions] = &[
316    // .__azul-native-tabs-header p.__azul-native-tabs-tab-active
317    CssPropertyWithConditions::simple(CssProperty::PaddingRight(LayoutPaddingRightValue::Exact(
318        LayoutPaddingRight {
319            inner: PixelValue::const_px(7),
320        },
321    ))),
322    CssPropertyWithConditions::simple(CssProperty::PaddingLeft(LayoutPaddingLeftValue::Exact(
323        LayoutPaddingLeft {
324            inner: PixelValue::const_px(7),
325        },
326    ))),
327    CssPropertyWithConditions::simple(CssProperty::PaddingBottom(LayoutPaddingBottomValue::Exact(
328        LayoutPaddingBottom {
329            inner: PixelValue::const_px(3),
330        },
331    ))),
332    CssPropertyWithConditions::simple(CssProperty::PaddingTop(LayoutPaddingTopValue::Exact(
333        LayoutPaddingTop {
334            inner: PixelValue::const_px(3),
335        },
336    ))),
337    CssPropertyWithConditions::simple(CssProperty::Height(LayoutHeightValue::Exact(
338        LayoutHeight::Px(PixelValue::const_px(23)),
339    ))),
340    CssPropertyWithConditions::simple(CssProperty::BoxSizing(LayoutBoxSizingValue::Exact(
341        LayoutBoxSizing::ContentBox,
342    ))),
343    CssPropertyWithConditions::simple(CssProperty::BorderBottomWidth(
344        LayoutBorderBottomWidthValue::Exact(LayoutBorderBottomWidth {
345            inner: PixelValue::const_px(1),
346        }),
347    )),
348    CssPropertyWithConditions::simple(CssProperty::BorderBottomStyle(
349        StyleBorderBottomStyleValue::Exact(StyleBorderBottomStyle {
350            inner: BorderStyle::Solid,
351        }),
352    )),
353    CssPropertyWithConditions::simple(CssProperty::BorderBottomColor(
354        StyleBorderBottomColorValue::Exact(StyleBorderBottomColor {
355            inner: ColorU {
356                r: 255,
357                g: 255,
358                b: 255,
359                a: 255,
360            },
361        }),
362    )),
363    CssPropertyWithConditions::simple(CssProperty::BackgroundContent(
364        StyleBackgroundContentVecValue::Exact(StyleBackgroundContentVec::from_const_slice(
365            STYLE_BACKGROUND_CONTENT_16746671892555275291_ITEMS,
366        )),
367    )),
368    // .__azul-native-tabs-header p
369    CssPropertyWithConditions::simple(CssProperty::TextAlign(StyleTextAlignValue::Exact(
370        StyleTextAlign::Center,
371    ))),
372    CssPropertyWithConditions::simple(CssProperty::Height(LayoutHeightValue::Exact(
373        LayoutHeight::Px(PixelValue::const_px(21)),
374    ))),
375    CssPropertyWithConditions::simple(CssProperty::BorderBottomWidth(
376        LayoutBorderBottomWidthValue::Exact(LayoutBorderBottomWidth {
377            inner: PixelValue::const_px(1),
378        }),
379    )),
380    CssPropertyWithConditions::simple(CssProperty::BorderLeftWidth(
381        LayoutBorderLeftWidthValue::Exact(LayoutBorderLeftWidth {
382            inner: PixelValue::const_px(1),
383        }),
384    )),
385    CssPropertyWithConditions::simple(CssProperty::BorderRightWidth(
386        LayoutBorderRightWidthValue::Exact(LayoutBorderRightWidth {
387            inner: PixelValue::const_px(1),
388        }),
389    )),
390    CssPropertyWithConditions::simple(CssProperty::BorderTopWidth(
391        LayoutBorderTopWidthValue::Exact(LayoutBorderTopWidth {
392            inner: PixelValue::const_px(1),
393        }),
394    )),
395    CssPropertyWithConditions::simple(CssProperty::BorderBottomStyle(
396        StyleBorderBottomStyleValue::Exact(StyleBorderBottomStyle {
397            inner: BorderStyle::Solid,
398        }),
399    )),
400    CssPropertyWithConditions::simple(CssProperty::BorderLeftStyle(
401        StyleBorderLeftStyleValue::Exact(StyleBorderLeftStyle {
402            inner: BorderStyle::Solid,
403        }),
404    )),
405    CssPropertyWithConditions::simple(CssProperty::BorderRightStyle(
406        StyleBorderRightStyleValue::Exact(StyleBorderRightStyle {
407            inner: BorderStyle::Solid,
408        }),
409    )),
410    CssPropertyWithConditions::simple(CssProperty::BorderTopStyle(
411        StyleBorderTopStyleValue::Exact(StyleBorderTopStyle {
412            inner: BorderStyle::Solid,
413        }),
414    )),
415    CssPropertyWithConditions::simple(CssProperty::BorderBottomColor(
416        StyleBorderBottomColorValue::Exact(StyleBorderBottomColor {
417            inner: ColorU {
418                r: 172,
419                g: 172,
420                b: 172,
421                a: 255,
422            },
423        }),
424    )),
425    CssPropertyWithConditions::simple(CssProperty::BorderLeftColor(
426        StyleBorderLeftColorValue::Exact(StyleBorderLeftColor {
427            inner: ColorU {
428                r: 172,
429                g: 172,
430                b: 172,
431                a: 255,
432            },
433        }),
434    )),
435    CssPropertyWithConditions::simple(CssProperty::BorderRightColor(
436        StyleBorderRightColorValue::Exact(StyleBorderRightColor {
437            inner: ColorU {
438                r: 172,
439                g: 172,
440                b: 172,
441                a: 255,
442            },
443        }),
444    )),
445    CssPropertyWithConditions::simple(CssProperty::BorderTopColor(
446        StyleBorderTopColorValue::Exact(StyleBorderTopColor {
447            inner: ColorU {
448                r: 172,
449                g: 172,
450                b: 172,
451                a: 255,
452            },
453        }),
454    )),
455    CssPropertyWithConditions::simple(CssProperty::BackgroundContent(
456        StyleBackgroundContentVecValue::Exact(StyleBackgroundContentVec::from_const_slice(
457            STYLE_BACKGROUND_CONTENT_8560341490937422656_ITEMS,
458        )),
459    )),
460    CssPropertyWithConditions::simple(CssProperty::AlignItems(LayoutAlignItemsValue::Exact(
461        LayoutAlignItems::Center,
462    ))),
463];
464const CSS_MATCH_14575853790110873394: CssPropertyWithConditionsVec =
465    CssPropertyWithConditionsVec::from_const_slice(CSS_MATCH_14575853790110873394_PROPERTIES);
466
467const CSS_MATCH_17290739305197504468_PROPERTIES: &[CssPropertyWithConditions] = &[
468    // .__azul-native-tabs-header .__azul-native-tabs-before-tabs
469    CssPropertyWithConditions::simple(CssProperty::Width(LayoutWidthValue::Exact(
470        LayoutWidth::Px(PixelValue::const_px(2)),
471    ))),
472    CssPropertyWithConditions::simple(CssProperty::FlexGrow(LayoutFlexGrowValue::Exact(
473        LayoutFlexGrow {
474            inner: FloatValue::const_new(1),
475        },
476    ))),
477    CssPropertyWithConditions::simple(CssProperty::BorderBottomWidth(
478        LayoutBorderBottomWidthValue::Exact(LayoutBorderBottomWidth {
479            inner: PixelValue::const_px(1),
480        }),
481    )),
482    CssPropertyWithConditions::simple(CssProperty::BorderBottomStyle(
483        StyleBorderBottomStyleValue::Exact(StyleBorderBottomStyle {
484            inner: BorderStyle::Solid,
485        }),
486    )),
487    CssPropertyWithConditions::simple(CssProperty::BorderBottomColor(
488        StyleBorderBottomColorValue::Exact(StyleBorderBottomColor {
489            inner: ColorU {
490                r: 172,
491                g: 172,
492                b: 172,
493                a: 255,
494            },
495        }),
496    )),
497];
498const CSS_MATCH_17290739305197504468: CssPropertyWithConditionsVec =
499    CssPropertyWithConditionsVec::from_const_slice(CSS_MATCH_17290739305197504468_PROPERTIES);
500
501const CSS_MATCH_18014909903571752977_PROPERTIES: &[CssPropertyWithConditions] = &[
502    // .__azul-native-tabs-content
503    CssPropertyWithConditions::simple(CssProperty::PaddingRight(LayoutPaddingRightValue::Exact(
504        LayoutPaddingRight {
505            inner: PixelValue::const_px(5),
506        },
507    ))),
508    CssPropertyWithConditions::simple(CssProperty::PaddingLeft(LayoutPaddingLeftValue::Exact(
509        LayoutPaddingLeft {
510            inner: PixelValue::const_px(5),
511        },
512    ))),
513    CssPropertyWithConditions::simple(CssProperty::PaddingBottom(LayoutPaddingBottomValue::Exact(
514        LayoutPaddingBottom {
515            inner: PixelValue::const_px(5),
516        },
517    ))),
518    CssPropertyWithConditions::simple(CssProperty::PaddingTop(LayoutPaddingTopValue::Exact(
519        LayoutPaddingTop {
520            inner: PixelValue::const_px(5),
521        },
522    ))),
523    CssPropertyWithConditions::simple(CssProperty::FlexGrow(LayoutFlexGrowValue::Exact(
524        LayoutFlexGrow {
525            inner: FloatValue::const_new(1),
526        },
527    ))),
528    CssPropertyWithConditions::simple(CssProperty::BorderTopWidth(LayoutBorderTopWidthValue::None)),
529    CssPropertyWithConditions::simple(CssProperty::BorderTopStyle(StyleBorderTopStyleValue::None)),
530    CssPropertyWithConditions::simple(CssProperty::BorderTopColor(StyleBorderTopColorValue::None)),
531    CssPropertyWithConditions::simple(CssProperty::BorderBottomWidth(
532        LayoutBorderBottomWidthValue::Exact(LayoutBorderBottomWidth {
533            inner: PixelValue::const_px(1),
534        }),
535    )),
536    CssPropertyWithConditions::simple(CssProperty::BorderLeftWidth(
537        LayoutBorderLeftWidthValue::Exact(LayoutBorderLeftWidth {
538            inner: PixelValue::const_px(1),
539        }),
540    )),
541    CssPropertyWithConditions::simple(CssProperty::BorderRightWidth(
542        LayoutBorderRightWidthValue::Exact(LayoutBorderRightWidth {
543            inner: PixelValue::const_px(1),
544        }),
545    )),
546    CssPropertyWithConditions::simple(CssProperty::BorderTopWidth(
547        LayoutBorderTopWidthValue::Exact(LayoutBorderTopWidth {
548            inner: PixelValue::const_px(1),
549        }),
550    )),
551    CssPropertyWithConditions::simple(CssProperty::BorderBottomStyle(
552        StyleBorderBottomStyleValue::Exact(StyleBorderBottomStyle {
553            inner: BorderStyle::Solid,
554        }),
555    )),
556    CssPropertyWithConditions::simple(CssProperty::BorderLeftStyle(
557        StyleBorderLeftStyleValue::Exact(StyleBorderLeftStyle {
558            inner: BorderStyle::Solid,
559        }),
560    )),
561    CssPropertyWithConditions::simple(CssProperty::BorderRightStyle(
562        StyleBorderRightStyleValue::Exact(StyleBorderRightStyle {
563            inner: BorderStyle::Solid,
564        }),
565    )),
566    CssPropertyWithConditions::simple(CssProperty::BorderTopStyle(
567        StyleBorderTopStyleValue::Exact(StyleBorderTopStyle {
568            inner: BorderStyle::Solid,
569        }),
570    )),
571    CssPropertyWithConditions::simple(CssProperty::BorderBottomColor(
572        StyleBorderBottomColorValue::Exact(StyleBorderBottomColor {
573            inner: ColorU {
574                r: 172,
575                g: 172,
576                b: 172,
577                a: 255,
578            },
579        }),
580    )),
581    CssPropertyWithConditions::simple(CssProperty::BorderLeftColor(
582        StyleBorderLeftColorValue::Exact(StyleBorderLeftColor {
583            inner: ColorU {
584                r: 172,
585                g: 172,
586                b: 172,
587                a: 255,
588            },
589        }),
590    )),
591    CssPropertyWithConditions::simple(CssProperty::BorderRightColor(
592        StyleBorderRightColorValue::Exact(StyleBorderRightColor {
593            inner: ColorU {
594                r: 172,
595                g: 172,
596                b: 172,
597                a: 255,
598            },
599        }),
600    )),
601    CssPropertyWithConditions::simple(CssProperty::BorderTopColor(
602        StyleBorderTopColorValue::Exact(StyleBorderTopColor {
603            inner: ColorU {
604                r: 172,
605                g: 172,
606                b: 172,
607                a: 255,
608            },
609        }),
610    )),
611    CssPropertyWithConditions::simple(CssProperty::BackgroundContent(
612        StyleBackgroundContentVecValue::Exact(StyleBackgroundContentVec::from_const_slice(
613            STYLE_BACKGROUND_CONTENT_16746671892555275291_ITEMS,
614        )),
615    )),
616];
617const CSS_MATCH_18014909903571752977: CssPropertyWithConditionsVec =
618    CssPropertyWithConditionsVec::from_const_slice(CSS_MATCH_18014909903571752977_PROPERTIES);
619
620const CSS_MATCH_3088386549906605418_PROPERTIES: &[CssPropertyWithConditions] = &[
621    // .__azul-native-tabs-header .__azul-native-tabs-after-tabs
622    CssPropertyWithConditions::simple(CssProperty::FlexGrow(LayoutFlexGrowValue::Exact(
623        LayoutFlexGrow {
624            inner: FloatValue::const_new(1),
625        },
626    ))),
627    CssPropertyWithConditions::simple(CssProperty::BorderBottomWidth(
628        LayoutBorderBottomWidthValue::Exact(LayoutBorderBottomWidth {
629            inner: PixelValue::const_px(1),
630        }),
631    )),
632    CssPropertyWithConditions::simple(CssProperty::BorderBottomStyle(
633        StyleBorderBottomStyleValue::Exact(StyleBorderBottomStyle {
634            inner: BorderStyle::Solid,
635        }),
636    )),
637    CssPropertyWithConditions::simple(CssProperty::BorderBottomColor(
638        StyleBorderBottomColorValue::Exact(StyleBorderBottomColor {
639            inner: ColorU {
640                r: 172,
641                g: 172,
642                b: 172,
643                a: 255,
644            },
645        }),
646    )),
647];
648const CSS_MATCH_3088386549906605418: CssPropertyWithConditionsVec =
649    CssPropertyWithConditionsVec::from_const_slice(CSS_MATCH_3088386549906605418_PROPERTIES);
650
651const CSS_MATCH_4415083954137121609_PROPERTIES: &[CssPropertyWithConditions] = &[
652    // .__azul-native-tabs-header p.__azul-native-tabs-tab-not-active:hover
653    CssPropertyWithConditions::on_hover(CssProperty::BorderBottomWidth(
654        LayoutBorderBottomWidthValue::Exact(LayoutBorderBottomWidth {
655            inner: PixelValue::const_px(1),
656        }),
657    )),
658    CssPropertyWithConditions::on_hover(CssProperty::BorderLeftWidth(
659        LayoutBorderLeftWidthValue::Exact(LayoutBorderLeftWidth {
660            inner: PixelValue::const_px(1),
661        }),
662    )),
663    CssPropertyWithConditions::on_hover(CssProperty::BorderRightWidth(
664        LayoutBorderRightWidthValue::Exact(LayoutBorderRightWidth {
665            inner: PixelValue::const_px(1),
666        }),
667    )),
668    CssPropertyWithConditions::on_hover(CssProperty::BorderTopWidth(
669        LayoutBorderTopWidthValue::Exact(LayoutBorderTopWidth {
670            inner: PixelValue::const_px(1),
671        }),
672    )),
673    CssPropertyWithConditions::on_hover(CssProperty::BorderBottomStyle(
674        StyleBorderBottomStyleValue::Exact(StyleBorderBottomStyle {
675            inner: BorderStyle::Solid,
676        }),
677    )),
678    CssPropertyWithConditions::on_hover(CssProperty::BorderLeftStyle(
679        StyleBorderLeftStyleValue::Exact(StyleBorderLeftStyle {
680            inner: BorderStyle::Solid,
681        }),
682    )),
683    CssPropertyWithConditions::on_hover(CssProperty::BorderRightStyle(
684        StyleBorderRightStyleValue::Exact(StyleBorderRightStyle {
685            inner: BorderStyle::Solid,
686        }),
687    )),
688    CssPropertyWithConditions::on_hover(CssProperty::BorderTopStyle(
689        StyleBorderTopStyleValue::Exact(StyleBorderTopStyle {
690            inner: BorderStyle::Solid,
691        }),
692    )),
693    CssPropertyWithConditions::on_hover(CssProperty::BorderBottomColor(
694        StyleBorderBottomColorValue::Exact(StyleBorderBottomColor {
695            inner: ColorU {
696                r: 126,
697                g: 180,
698                b: 234,
699                a: 255,
700            },
701        }),
702    )),
703    CssPropertyWithConditions::on_hover(CssProperty::BorderLeftColor(
704        StyleBorderLeftColorValue::Exact(StyleBorderLeftColor {
705            inner: ColorU {
706                r: 126,
707                g: 180,
708                b: 234,
709                a: 255,
710            },
711        }),
712    )),
713    CssPropertyWithConditions::on_hover(CssProperty::BorderRightColor(
714        StyleBorderRightColorValue::Exact(StyleBorderRightColor {
715            inner: ColorU {
716                r: 126,
717                g: 180,
718                b: 234,
719                a: 255,
720            },
721        }),
722    )),
723    CssPropertyWithConditions::on_hover(CssProperty::BorderTopColor(
724        StyleBorderTopColorValue::Exact(StyleBorderTopColor {
725            inner: ColorU {
726                r: 126,
727                g: 180,
728                b: 234,
729                a: 255,
730            },
731        }),
732    )),
733    CssPropertyWithConditions::on_hover(CssProperty::BackgroundContent(
734        StyleBackgroundContentVecValue::Exact(StyleBackgroundContentVec::from_const_slice(
735            STYLE_BACKGROUND_CONTENT_15534185073326444643_ITEMS,
736        )),
737    )),
738    // .__azul-native-tabs-header p.__azul-native-tabs-tab-norightborder
739    CssPropertyWithConditions::simple(CssProperty::BorderRightWidth(
740        LayoutBorderRightWidthValue::None,
741    )),
742    CssPropertyWithConditions::simple(CssProperty::BorderRightStyle(
743        StyleBorderRightStyleValue::None,
744    )),
745    CssPropertyWithConditions::simple(CssProperty::BorderRightColor(
746        StyleBorderRightColorValue::None,
747    )),
748    // .__azul-native-tabs-header p.__azul-native-tabs-tab-not-active
749    CssPropertyWithConditions::simple(CssProperty::PaddingRight(LayoutPaddingRightValue::Exact(
750        LayoutPaddingRight {
751            inner: PixelValue::const_px(5),
752        },
753    ))),
754    CssPropertyWithConditions::simple(CssProperty::PaddingLeft(LayoutPaddingLeftValue::Exact(
755        LayoutPaddingLeft {
756            inner: PixelValue::const_px(5),
757        },
758    ))),
759    CssPropertyWithConditions::simple(CssProperty::PaddingBottom(LayoutPaddingBottomValue::Exact(
760        LayoutPaddingBottom {
761            inner: PixelValue::const_px(1),
762        },
763    ))),
764    CssPropertyWithConditions::simple(CssProperty::PaddingTop(LayoutPaddingTopValue::Exact(
765        LayoutPaddingTop {
766            inner: PixelValue::const_px(1),
767        },
768    ))),
769    CssPropertyWithConditions::simple(CssProperty::MarginTop(LayoutMarginTopValue::Exact(
770        LayoutMarginTop {
771            inner: PixelValue::const_px(2),
772        },
773    ))),
774    // .__azul-native-tabs-header p
775    CssPropertyWithConditions::simple(CssProperty::TextAlign(StyleTextAlignValue::Exact(
776        StyleTextAlign::Center,
777    ))),
778    CssPropertyWithConditions::simple(CssProperty::Height(LayoutHeightValue::Exact(
779        LayoutHeight::Px(PixelValue::const_px(21)),
780    ))),
781    CssPropertyWithConditions::simple(CssProperty::BorderBottomWidth(
782        LayoutBorderBottomWidthValue::Exact(LayoutBorderBottomWidth {
783            inner: PixelValue::const_px(1),
784        }),
785    )),
786    CssPropertyWithConditions::simple(CssProperty::BorderLeftWidth(
787        LayoutBorderLeftWidthValue::Exact(LayoutBorderLeftWidth {
788            inner: PixelValue::const_px(1),
789        }),
790    )),
791    CssPropertyWithConditions::simple(CssProperty::BorderRightWidth(
792        LayoutBorderRightWidthValue::Exact(LayoutBorderRightWidth {
793            inner: PixelValue::const_px(1),
794        }),
795    )),
796    CssPropertyWithConditions::simple(CssProperty::BorderTopWidth(
797        LayoutBorderTopWidthValue::Exact(LayoutBorderTopWidth {
798            inner: PixelValue::const_px(1),
799        }),
800    )),
801    CssPropertyWithConditions::simple(CssProperty::BorderBottomStyle(
802        StyleBorderBottomStyleValue::Exact(StyleBorderBottomStyle {
803            inner: BorderStyle::Solid,
804        }),
805    )),
806    CssPropertyWithConditions::simple(CssProperty::BorderLeftStyle(
807        StyleBorderLeftStyleValue::Exact(StyleBorderLeftStyle {
808            inner: BorderStyle::Solid,
809        }),
810    )),
811    CssPropertyWithConditions::simple(CssProperty::BorderRightStyle(
812        StyleBorderRightStyleValue::Exact(StyleBorderRightStyle {
813            inner: BorderStyle::Solid,
814        }),
815    )),
816    CssPropertyWithConditions::simple(CssProperty::BorderTopStyle(
817        StyleBorderTopStyleValue::Exact(StyleBorderTopStyle {
818            inner: BorderStyle::Solid,
819        }),
820    )),
821    CssPropertyWithConditions::simple(CssProperty::BorderBottomColor(
822        StyleBorderBottomColorValue::Exact(StyleBorderBottomColor {
823            inner: ColorU {
824                r: 172,
825                g: 172,
826                b: 172,
827                a: 255,
828            },
829        }),
830    )),
831    CssPropertyWithConditions::simple(CssProperty::BorderLeftColor(
832        StyleBorderLeftColorValue::Exact(StyleBorderLeftColor {
833            inner: ColorU {
834                r: 172,
835                g: 172,
836                b: 172,
837                a: 255,
838            },
839        }),
840    )),
841    CssPropertyWithConditions::simple(CssProperty::BorderRightColor(
842        StyleBorderRightColorValue::Exact(StyleBorderRightColor {
843            inner: ColorU {
844                r: 172,
845                g: 172,
846                b: 172,
847                a: 255,
848            },
849        }),
850    )),
851    CssPropertyWithConditions::simple(CssProperty::BorderTopColor(
852        StyleBorderTopColorValue::Exact(StyleBorderTopColor {
853            inner: ColorU {
854                r: 172,
855                g: 172,
856                b: 172,
857                a: 255,
858            },
859        }),
860    )),
861    CssPropertyWithConditions::simple(CssProperty::BackgroundContent(
862        StyleBackgroundContentVecValue::Exact(StyleBackgroundContentVec::from_const_slice(
863            STYLE_BACKGROUND_CONTENT_8560341490937422656_ITEMS,
864        )),
865    )),
866    CssPropertyWithConditions::simple(CssProperty::AlignItems(LayoutAlignItemsValue::Exact(
867        LayoutAlignItems::Center,
868    ))),
869];
870const CSS_MATCH_4415083954137121609: CssPropertyWithConditionsVec =
871    CssPropertyWithConditionsVec::from_const_slice(CSS_MATCH_4415083954137121609_PROPERTIES);
872
873const CSS_MATCH_4738503469417034630_PROPERTIES: &[CssPropertyWithConditions] = &[
874    // .__azul-native-tabs-container
875    CssPropertyWithConditions::simple(CssProperty::PaddingRight(LayoutPaddingRightValue::Exact(
876        LayoutPaddingRight {
877            inner: PixelValue::const_px(5),
878        },
879    ))),
880    CssPropertyWithConditions::simple(CssProperty::PaddingLeft(LayoutPaddingLeftValue::Exact(
881        LayoutPaddingLeft {
882            inner: PixelValue::const_px(5),
883        },
884    ))),
885    CssPropertyWithConditions::simple(CssProperty::PaddingBottom(LayoutPaddingBottomValue::Exact(
886        LayoutPaddingBottom {
887            inner: PixelValue::const_px(5),
888        },
889    ))),
890    CssPropertyWithConditions::simple(CssProperty::PaddingTop(LayoutPaddingTopValue::Exact(
891        LayoutPaddingTop {
892            inner: PixelValue::const_px(5),
893        },
894    ))),
895    CssPropertyWithConditions::simple(CssProperty::FlexGrow(LayoutFlexGrowValue::Exact(
896        LayoutFlexGrow {
897            inner: FloatValue::const_new(1),
898        },
899    ))),
900];
901const CSS_MATCH_4738503469417034630: CssPropertyWithConditionsVec =
902    CssPropertyWithConditionsVec::from_const_slice(CSS_MATCH_4738503469417034630_PROPERTIES);
903
904const CSS_MATCH_9988039989460234263_PROPERTIES: &[CssPropertyWithConditions] = &[
905    // .__azul-native-tabs-header
906    CssPropertyWithConditions::simple(CssProperty::FontSize(StyleFontSizeValue::Exact(
907        StyleFontSize {
908            inner: PixelValue::const_px(11),
909        },
910    ))),
911    CssPropertyWithConditions::simple(CssProperty::FontFamily(StyleFontFamilyVecValue::Exact(
912        StyleFontFamilyVec::from_const_slice(STYLE_FONT_FAMILY_8122988506401935406_ITEMS),
913    ))),
914    CssPropertyWithConditions::simple(CssProperty::FlexDirection(LayoutFlexDirectionValue::Exact(
915        LayoutFlexDirection::Row,
916    ))),
917];
918const CSS_MATCH_9988039989460234263: CssPropertyWithConditionsVec =
919    CssPropertyWithConditionsVec::from_const_slice(CSS_MATCH_9988039989460234263_PROPERTIES);
920
921// -- NO PADDING
922const CSS_MATCH_18014909903571752977_PROPERTIES_NO_PADDING: &[CssPropertyWithConditions] = &[
923    // .__azul-native-tabs-content
924    CssPropertyWithConditions::simple(CssProperty::FlexGrow(LayoutFlexGrowValue::Exact(
925        LayoutFlexGrow {
926            inner: FloatValue::const_new(1),
927        },
928    ))),
929    CssPropertyWithConditions::simple(CssProperty::BackgroundContent(
930        StyleBackgroundContentVecValue::Exact(StyleBackgroundContentVec::from_const_slice(
931            STYLE_BACKGROUND_CONTENT_16746671892555275291_ITEMS,
932        )),
933    )),
934];
935const CSS_MATCH_18014909903571752977_NO_PADDING: CssPropertyWithConditionsVec =
936    CssPropertyWithConditionsVec::from_const_slice(
937        CSS_MATCH_18014909903571752977_PROPERTIES_NO_PADDING,
938    );
939
940const CSS_MATCH_4738503469417034630_PROPERTIES_NO_PADDING: &[CssPropertyWithConditions] = &[
941    // .__azul-native-tabs-container
942    CssPropertyWithConditions::simple(CssProperty::FlexGrow(LayoutFlexGrowValue::Exact(
943        LayoutFlexGrow {
944            inner: FloatValue::const_new(1),
945        },
946    ))),
947];
948const CSS_MATCH_4738503469417034630_NO_PADDING: CssPropertyWithConditionsVec =
949    CssPropertyWithConditionsVec::from_const_slice(
950        CSS_MATCH_4738503469417034630_PROPERTIES_NO_PADDING,
951    );
952
953// -- REGULAR_INACTIVE_TAB
954
955const CSS_MATCH_11510695043643111367_PROPERTIES: &[CssPropertyWithConditions] = &[
956    // .__azul-native-tabs-header p.__azul-native-tabs-tab-not-active:hover
957    CssPropertyWithConditions::on_hover(CssProperty::BorderBottomWidth(
958        LayoutBorderBottomWidthValue::Exact(LayoutBorderBottomWidth {
959            inner: PixelValue::const_px(1),
960        }),
961    )),
962    CssPropertyWithConditions::on_hover(CssProperty::BorderLeftWidth(
963        LayoutBorderLeftWidthValue::Exact(LayoutBorderLeftWidth {
964            inner: PixelValue::const_px(1),
965        }),
966    )),
967    CssPropertyWithConditions::on_hover(CssProperty::BorderRightWidth(
968        LayoutBorderRightWidthValue::Exact(LayoutBorderRightWidth {
969            inner: PixelValue::const_px(1),
970        }),
971    )),
972    CssPropertyWithConditions::on_hover(CssProperty::BorderTopWidth(
973        LayoutBorderTopWidthValue::Exact(LayoutBorderTopWidth {
974            inner: PixelValue::const_px(1),
975        }),
976    )),
977    CssPropertyWithConditions::on_hover(CssProperty::BorderBottomStyle(
978        StyleBorderBottomStyleValue::Exact(StyleBorderBottomStyle {
979            inner: BorderStyle::Solid,
980        }),
981    )),
982    CssPropertyWithConditions::on_hover(CssProperty::BorderLeftStyle(
983        StyleBorderLeftStyleValue::Exact(StyleBorderLeftStyle {
984            inner: BorderStyle::Solid,
985        }),
986    )),
987    CssPropertyWithConditions::on_hover(CssProperty::BorderRightStyle(
988        StyleBorderRightStyleValue::Exact(StyleBorderRightStyle {
989            inner: BorderStyle::Solid,
990        }),
991    )),
992    CssPropertyWithConditions::on_hover(CssProperty::BorderTopStyle(
993        StyleBorderTopStyleValue::Exact(StyleBorderTopStyle {
994            inner: BorderStyle::Solid,
995        }),
996    )),
997    CssPropertyWithConditions::on_hover(CssProperty::BorderBottomColor(
998        StyleBorderBottomColorValue::Exact(StyleBorderBottomColor {
999            inner: ColorU {
1000                r: 126,
1001                g: 180,
1002                b: 234,
1003                a: 255,
1004            },
1005        }),
1006    )),
1007    CssPropertyWithConditions::on_hover(CssProperty::BorderLeftColor(
1008        StyleBorderLeftColorValue::Exact(StyleBorderLeftColor {
1009            inner: ColorU {
1010                r: 126,
1011                g: 180,
1012                b: 234,
1013                a: 255,
1014            },
1015        }),
1016    )),
1017    CssPropertyWithConditions::on_hover(CssProperty::BorderRightColor(
1018        StyleBorderRightColorValue::Exact(StyleBorderRightColor {
1019            inner: ColorU {
1020                r: 126,
1021                g: 180,
1022                b: 234,
1023                a: 255,
1024            },
1025        }),
1026    )),
1027    CssPropertyWithConditions::on_hover(CssProperty::BorderTopColor(
1028        StyleBorderTopColorValue::Exact(StyleBorderTopColor {
1029            inner: ColorU {
1030                r: 126,
1031                g: 180,
1032                b: 234,
1033                a: 255,
1034            },
1035        }),
1036    )),
1037    CssPropertyWithConditions::on_hover(CssProperty::BackgroundContent(
1038        StyleBackgroundContentVecValue::Exact(StyleBackgroundContentVec::from_const_slice(
1039            STYLE_BACKGROUND_CONTENT_15534185073326444643_ITEMS,
1040        )),
1041    )),
1042    // .__azul-native-tabs-header p.__azul-native-tabs-tab-not-active
1043    CssPropertyWithConditions::simple(CssProperty::PaddingRight(LayoutPaddingRightValue::Exact(
1044        LayoutPaddingRight {
1045            inner: PixelValue::const_px(5),
1046        },
1047    ))),
1048    CssPropertyWithConditions::simple(CssProperty::PaddingLeft(LayoutPaddingLeftValue::Exact(
1049        LayoutPaddingLeft {
1050            inner: PixelValue::const_px(5),
1051        },
1052    ))),
1053    CssPropertyWithConditions::simple(CssProperty::PaddingBottom(LayoutPaddingBottomValue::Exact(
1054        LayoutPaddingBottom {
1055            inner: PixelValue::const_px(1),
1056        },
1057    ))),
1058    CssPropertyWithConditions::simple(CssProperty::PaddingTop(LayoutPaddingTopValue::Exact(
1059        LayoutPaddingTop {
1060            inner: PixelValue::const_px(1),
1061        },
1062    ))),
1063    CssPropertyWithConditions::simple(CssProperty::MarginTop(LayoutMarginTopValue::Exact(
1064        LayoutMarginTop {
1065            inner: PixelValue::const_px(2),
1066        },
1067    ))),
1068    // .__azul-native-tabs-header p
1069    CssPropertyWithConditions::simple(CssProperty::TextAlign(StyleTextAlignValue::Exact(
1070        StyleTextAlign::Center,
1071    ))),
1072    CssPropertyWithConditions::simple(CssProperty::Height(LayoutHeightValue::Exact(
1073        LayoutHeight::Px(PixelValue::const_px(21)),
1074    ))),
1075    CssPropertyWithConditions::simple(CssProperty::BorderBottomWidth(
1076        LayoutBorderBottomWidthValue::Exact(LayoutBorderBottomWidth {
1077            inner: PixelValue::const_px(1),
1078        }),
1079    )),
1080    CssPropertyWithConditions::simple(CssProperty::BorderLeftWidth(
1081        LayoutBorderLeftWidthValue::Exact(LayoutBorderLeftWidth {
1082            inner: PixelValue::const_px(1),
1083        }),
1084    )),
1085    CssPropertyWithConditions::simple(CssProperty::BorderRightWidth(
1086        LayoutBorderRightWidthValue::Exact(LayoutBorderRightWidth {
1087            inner: PixelValue::const_px(1),
1088        }),
1089    )),
1090    CssPropertyWithConditions::simple(CssProperty::BorderTopWidth(
1091        LayoutBorderTopWidthValue::Exact(LayoutBorderTopWidth {
1092            inner: PixelValue::const_px(1),
1093        }),
1094    )),
1095    CssPropertyWithConditions::simple(CssProperty::BorderBottomStyle(
1096        StyleBorderBottomStyleValue::Exact(StyleBorderBottomStyle {
1097            inner: BorderStyle::Solid,
1098        }),
1099    )),
1100    CssPropertyWithConditions::simple(CssProperty::BorderLeftStyle(
1101        StyleBorderLeftStyleValue::Exact(StyleBorderLeftStyle {
1102            inner: BorderStyle::Solid,
1103        }),
1104    )),
1105    CssPropertyWithConditions::simple(CssProperty::BorderRightStyle(
1106        StyleBorderRightStyleValue::Exact(StyleBorderRightStyle {
1107            inner: BorderStyle::Solid,
1108        }),
1109    )),
1110    CssPropertyWithConditions::simple(CssProperty::BorderTopStyle(
1111        StyleBorderTopStyleValue::Exact(StyleBorderTopStyle {
1112            inner: BorderStyle::Solid,
1113        }),
1114    )),
1115    CssPropertyWithConditions::simple(CssProperty::BorderBottomColor(
1116        StyleBorderBottomColorValue::Exact(StyleBorderBottomColor {
1117            inner: ColorU {
1118                r: 172,
1119                g: 172,
1120                b: 172,
1121                a: 255,
1122            },
1123        }),
1124    )),
1125    CssPropertyWithConditions::simple(CssProperty::BorderLeftColor(
1126        StyleBorderLeftColorValue::Exact(StyleBorderLeftColor {
1127            inner: ColorU {
1128                r: 172,
1129                g: 172,
1130                b: 172,
1131                a: 255,
1132            },
1133        }),
1134    )),
1135    CssPropertyWithConditions::simple(CssProperty::BorderRightColor(
1136        StyleBorderRightColorValue::Exact(StyleBorderRightColor {
1137            inner: ColorU {
1138                r: 172,
1139                g: 172,
1140                b: 172,
1141                a: 255,
1142            },
1143        }),
1144    )),
1145    CssPropertyWithConditions::simple(CssProperty::BorderTopColor(
1146        StyleBorderTopColorValue::Exact(StyleBorderTopColor {
1147            inner: ColorU {
1148                r: 172,
1149                g: 172,
1150                b: 172,
1151                a: 255,
1152            },
1153        }),
1154    )),
1155    CssPropertyWithConditions::simple(CssProperty::BackgroundContent(
1156        StyleBackgroundContentVecValue::Exact(StyleBackgroundContentVec::from_const_slice(
1157            STYLE_BACKGROUND_CONTENT_8560341490937422656_ITEMS,
1158        )),
1159    )),
1160    CssPropertyWithConditions::simple(CssProperty::AlignItems(LayoutAlignItemsValue::Exact(
1161        LayoutAlignItems::Center,
1162    ))),
1163];
1164const CSS_MATCH_11510695043643111367: CssPropertyWithConditionsVec =
1165    CssPropertyWithConditionsVec::from_const_slice(CSS_MATCH_11510695043643111367_PROPERTIES);
1166
1167#[derive(Debug, Clone)]
1168#[repr(C)]
1169pub struct TabHeader {
1170    pub tabs: StringVec,
1171    pub active_tab: usize,
1172    pub on_click: OptionTabOnClick,
1173}
1174
1175impl Default for TabHeader {
1176    fn default() -> Self {
1177        Self {
1178            tabs: StringVec::from_const_slice(&[]),
1179            active_tab: 0,
1180            on_click: None.into(),
1181        }
1182    }
1183}
1184
1185#[derive(Debug, Clone, Copy, PartialEq, Eq)]
1186#[repr(C)]
1187pub struct TabHeaderState {
1188    pub active_tab: usize,
1189}
1190
1191pub type TabOnClickCallbackType = extern "C" fn(RefAny, CallbackInfo, TabHeaderState) -> Update;
1192impl_widget_callback!(
1193    TabOnClick,
1194    OptionTabOnClick,
1195    TabOnClickCallback,
1196    TabOnClickCallbackType
1197);
1198
1199impl TabHeader {
1200    pub fn create(tabs: StringVec) -> Self {
1201        Self {
1202            tabs,
1203            active_tab: 0,
1204            on_click: None.into(),
1205        }
1206    }
1207
1208    pub fn swap_with_default(&mut self) -> Self {
1209        let mut default = Self::default();
1210        core::mem::swap(&mut default, self);
1211        default
1212    }
1213
1214    pub fn set_active_tab(&mut self, active_tab: usize) {
1215        self.active_tab = active_tab;
1216    }
1217
1218    pub fn with_active_tab(mut self, active_tab: usize) -> Self {
1219        self.set_active_tab(active_tab);
1220        self
1221    }
1222
1223    pub fn set_on_click<C: Into<TabOnClickCallback>>(&mut self, refany: RefAny, on_click: C) {
1224        self.on_click = Some(TabOnClick {
1225            refany,
1226            callback: on_click.into(),
1227        })
1228        .into();
1229    }
1230
1231    pub fn with_on_click<C: Into<TabOnClickCallback>>(
1232        mut self,
1233        refany: RefAny,
1234        on_click: C,
1235    ) -> Self {
1236        self.set_on_click(refany, on_click);
1237        self
1238    }
1239
1240    pub fn dom(self) -> Dom {
1241        use azul_core::callbacks::CoreCallbackDataVec;
1242
1243        let on_click_is_some = self.on_click.is_some();
1244
1245        Dom::create_div()
1246            .with_css_props(CSS_MATCH_9988039989460234263)
1247            .with_ids_and_classes({
1248                const IDS_AND_CLASSES_6172459441955124689: &[IdOrClass] =
1249                    &[Class(AzString::from_const_str("__azul-native-tabs-header"))];
1250                IdOrClassVec::from_const_slice(IDS_AND_CLASSES_6172459441955124689)
1251            })
1252            .with_children({
1253                let mut tab_items = vec![Dom::create_div()
1254                    .with_css_props(CSS_MATCH_17290739305197504468)
1255                    .with_ids_and_classes({
1256                        const IDS_AND_CLASSES_8360971686689797550: &[IdOrClass] = &[Class(
1257                            AzString::from_const_str("__azul-native-tabs-before-tabs"),
1258                        )];
1259                        IdOrClassVec::from_const_slice(IDS_AND_CLASSES_8360971686689797550)
1260                    })];
1261
1262                let dataset = TabLocalDataset {
1263                    tab_idx: 0,
1264                    on_click: self.on_click,
1265                };
1266
1267                for (tab_idx, tab) in self.tabs.as_ref().iter().enumerate() {
1268                    let next_tab_is_active = self.active_tab == tab_idx.saturating_add(1);
1269                    let previous_tab_was_active = if self.active_tab == 0 {
1270                        false
1271                    } else {
1272                        self.active_tab == tab_idx.saturating_sub(1)
1273                    };
1274
1275                    let tab_is_active = self.active_tab == tab_idx;
1276
1277                    // classes for previous tab
1278                    const IDS_AND_CLASSES_5117007530891373979: &[IdOrClass] = &[
1279                        Class(AzString::from_const_str(
1280                            "__azul-native-tabs-tab-norightborder",
1281                        )),
1282                        Class(AzString::from_const_str(
1283                            "__azul-native-tabs-tab-not-active",
1284                        )),
1285                    ]; // CSS_MATCH_4415083954137121609
1286
1287                    // classes for current tab
1288                    const IDS_AND_CLASSES_15002865554973741556: &[IdOrClass] = &[Class(
1289                        AzString::from_const_str("__azul-native-tabs-tab-active"),
1290                    )];
1291
1292                    // classes for next tab
1293                    const IDS_AND_CLASSES_16877793354714897051: &[IdOrClass] = &[
1294                        Class(AzString::from_const_str(
1295                            "__azul-native-tabs-tab-noleftborder",
1296                        )),
1297                        Class(AzString::from_const_str(
1298                            "__azul-native-tabs-tab-not-active",
1299                        )),
1300                    ];
1301
1302                    // classes for default inactive tab
1303                    const IDS_AND_CLASSES_INACTIVE: &[IdOrClass] = &[Class(
1304                        AzString::from_const_str("__azul-native-tabs-tab-not-active"),
1305                    )];
1306
1307                    let (ids_and_classes, css_props) = if tab_is_active {
1308                        (
1309                            IDS_AND_CLASSES_15002865554973741556,
1310                            CSS_MATCH_14575853790110873394,
1311                        )
1312                    } else if next_tab_is_active {
1313                        // tab before the active tab
1314                        (
1315                            IDS_AND_CLASSES_5117007530891373979,
1316                            CSS_MATCH_4415083954137121609,
1317                        )
1318                    } else if previous_tab_was_active {
1319                        // tab after the active tab
1320                        (
1321                            IDS_AND_CLASSES_16877793354714897051,
1322                            CSS_MATCH_13824480602841492081,
1323                        )
1324                    } else {
1325                        // default inactive tab
1326                        (IDS_AND_CLASSES_INACTIVE, CSS_MATCH_11510695043643111367)
1327                    };
1328
1329                    let mut dataset = dataset.clone();
1330                    dataset.tab_idx = tab_idx;
1331                    let dataset = RefAny::new(dataset);
1332
1333                    tab_items.push(
1334                        Dom::create_text(tab.clone())
1335                            .with_callbacks(if on_click_is_some {
1336                                vec![CoreCallbackData {
1337                                    event: EventFilter::Hover(HoverEventFilter::MouseUp),
1338                                    callback: CoreCallback {
1339                                        cb: on_tab_click as usize,
1340                                        ctx: azul_core::refany::OptionRefAny::None,
1341                                    },
1342                                    refany: dataset.clone(),
1343                                }]
1344                                .into()
1345                            } else {
1346                                CoreCallbackDataVec::from_const_slice(&[])
1347                            })
1348                            .with_dataset(Some(dataset).into())
1349                            .with_css_props(css_props)
1350                            .with_ids_and_classes(IdOrClassVec::from_const_slice(ids_and_classes)),
1351                    );
1352                }
1353
1354                tab_items.push(
1355                    Dom::create_div()
1356                        .with_css_props(CSS_MATCH_3088386549906605418)
1357                        .with_ids_and_classes({
1358                            const IDS_AND_CLASSES_11001585590816277275: &[IdOrClass] = &[Class(
1359                                AzString::from_const_str("__azul-native-tabs-after-tabs"),
1360                            )];
1361                            IdOrClassVec::from_const_slice(IDS_AND_CLASSES_11001585590816277275)
1362                        }),
1363                );
1364
1365                tab_items.into()
1366            })
1367    }
1368}
1369
1370#[derive(Debug, Clone)]
1371#[repr(C)]
1372pub struct TabContent {
1373    pub content: Dom,
1374    pub has_padding: bool,
1375}
1376
1377impl Default for TabContent {
1378    fn default() -> Self {
1379        Self {
1380            content: Dom::create_div(),
1381            has_padding: true,
1382        }
1383    }
1384}
1385
1386impl TabContent {
1387    pub fn new(content: Dom) -> Self {
1388        Self {
1389            content,
1390            has_padding: true,
1391        }
1392    }
1393
1394    pub fn swap_with_default(&mut self) -> Self {
1395        let mut default = Self::default();
1396        core::mem::swap(&mut default, self);
1397        default
1398    }
1399
1400    pub fn with_padding(mut self, padding: bool) -> Self {
1401        self.set_padding(padding);
1402        self
1403    }
1404
1405    pub fn set_padding(&mut self, padding: bool) {
1406        self.has_padding = padding;
1407    }
1408
1409    pub fn dom(self) -> Dom {
1410        const IDS_AND_CLASSES_2989815829020816222: &[IdOrClass] = &[Class(
1411            AzString::from_const_str("__azul-native-tabs-content"),
1412        )];
1413
1414        let tab_content_css_style = if self.has_padding {
1415            CSS_MATCH_18014909903571752977
1416        } else {
1417            CSS_MATCH_18014909903571752977_NO_PADDING
1418        };
1419
1420        Dom::create_div()
1421            .with_css_props(tab_content_css_style)
1422            .with_children(DomVec::from_vec(vec![Dom::create_div()
1423                .with_ids_and_classes(IdOrClassVec::from_const_slice(
1424                    IDS_AND_CLASSES_2989815829020816222,
1425                ))
1426                .with_children(DomVec::from_vec(vec![self.content]))]))
1427    }
1428}
1429
1430#[derive(Clone)]
1431struct TabLocalDataset {
1432    tab_idx: usize,
1433    on_click: OptionTabOnClick,
1434}
1435
1436extern "C" fn on_tab_click(mut refany: RefAny, mut info: CallbackInfo) -> Update {
1437    fn select_new_tab_inner(mut refany: RefAny, info: &mut CallbackInfo) -> Option<()> {
1438        let mut tab_local_dataset = refany.downcast_mut::<TabLocalDataset>()?;
1439        let tab_idx = tab_local_dataset.tab_idx;
1440        let tab_header_state = TabHeaderState {
1441            active_tab: tab_idx,
1442        };
1443
1444        let _result = {
1445            // rustc doesn't understand the borrowing lifetime here
1446            let tab_local_dataset = &mut *tab_local_dataset;
1447            let onclick = &mut tab_local_dataset.on_click;
1448
1449            match onclick.as_mut() {
1450                Some(TabOnClick { callback, refany }) => {
1451                    (callback.cb)(refany.clone(), info.clone(), tab_header_state)
1452                }
1453                None => Update::DoNothing,
1454            }
1455        };
1456
1457        Some(())
1458    }
1459
1460    let _ = select_new_tab_inner(refany, &mut info);
1461
1462    Update::RefreshDom
1463}
azul_layout/widgets/tabs.rs

azul_layout/widgets/
tabs.rs
