//! Pagination widget — a page-number navigator: `Prev`, a joined row of

//! page-number buttons, then `Next`. A near-clone of

//! [`crate::widgets::segmented::Segmented`] (a joined button bar whose clicked

//! item is derived from sibling position and whose active item is live-restyled

//! via `set_css_property`), specialised to page navigation.

//!

//! State is `{ current_page, total_pages }` (`current_page` is 1-based). Clicking

//! a page button selects it; clicking `Prev`/`Next` steps one page within

//! `[1, total_pages]`. Any change updates `current_page`, invokes the optional

//! `on_change(state)`, and live-restyles every button (the active page gets the

//! accent fill + white text; the others the neutral fill). `Prev`/`Next` show a

//! muted "disabled" text colour (style only) when `current_page` is at the

//! respective end; clicking a disabled end (or the already-current page) is a

//! no-op (returns `Update::DoNothing`, fires no callback).

//!

//! Index derivation: the children are `[Prev, page1 … pageN, Next]`, so page `p`

//! sits at sibling position `p`, `Prev` at position `0` and `Next` at the last

//! position. The handler reads the clicked node's position and the live child

//! count, so it stays correct regardless of `total_pages` drift.

//!

//! Key types: [`Pagination`], [`PaginationState`], [`PaginationOnChange`].

use std::vec::Vec;

use azul_core::{

    callbacks::{CoreCallbackData, Update},

    dom::{Dom, IdOrClass, IdOrClass::Class, IdOrClassVec, TabIndex},

    refany::RefAny,

};

use azul_css::dynamic_selector::{CssPropertyWithConditions, CssPropertyWithConditionsVec};

use azul_css::{

    props::{

        basic::{color::ColorU, StyleFontSize},

        layout::{LayoutDisplay, LayoutFlexDirection, LayoutAlignItems, LayoutAlignSelf, LayoutFlexGrow, LayoutJustifyContent, LayoutMinWidth, LayoutPaddingTop, LayoutPaddingBottom, LayoutPaddingLeft, LayoutPaddingRight},

        property::{CssProperty, *},

        style::{StyleBackgroundContent, StyleBackgroundContentVec, LayoutBorderTopWidth, LayoutBorderBottomWidth, LayoutBorderRightWidth, StyleBorderTopStyle, BorderStyle, StyleBorderBottomStyle, StyleBorderRightStyle, StyleBorderTopColor, StyleBorderBottomColor, StyleBorderRightColor, StyleCursor, StyleTextAlign, StyleUserSelect, StyleTextColor, LayoutBorderLeftWidth, StyleBorderLeftStyle, StyleBorderLeftColor, StyleBorderTopLeftRadius, StyleBorderBottomLeftRadius, StyleBorderTopRightRadius, StyleBorderBottomRightRadius},

    },

    impl_option_inner, AzString,

};

use crate::callbacks::{Callback, CallbackInfo};

static PAGINATION_CLASS: &[IdOrClass] =

    &[Class(AzString::from_const_str("__azul-native-pagination"))];

static PAGINATION_PAGE_CLASS: &[IdOrClass] =

    &[Class(AzString::from_const_str("__azul-native-pagination-page"))];

static PAGINATION_NAV_CLASS: &[IdOrClass] =

    &[Class(AzString::from_const_str("__azul-native-pagination-nav"))];

const PREV_LABEL: AzString = AzString::from_const_str("Prev");

const NEXT_LABEL: AzString = AzString::from_const_str("Next");

/// Callback function type invoked when the current page changes.

pub type PaginationOnChangeCallbackType =

    extern "C" fn(RefAny, CallbackInfo, PaginationState) -> Update;

impl_widget_callback!(

    PaginationOnChange,

    OptionPaginationOnChange,

    PaginationOnChangeCallback,

    PaginationOnChangeCallbackType

);

azul_core::impl_managed_callback! {

    wrapper:        PaginationOnChangeCallback,

    info_ty:        CallbackInfo,

    return_ty:      Update,

    default_ret:    Update::DoNothing,

    invoker_static: PAGINATION_ON_CHANGE_INVOKER,

    invoker_ty:     AzPaginationOnChangeCallbackInvoker,

    thunk_fn:       az_pagination_on_change_callback_thunk,

    setter_fn:      AzApp_setPaginationOnChangeCallbackInvoker,

    from_handle_fn: AzPaginationOnChangeCallback_createFromHostHandle,

    extra_args:     [ state: PaginationState ],

}

/// A `Prev` / page-numbers / `Next` page navigator with a change callback.

#[derive(Debug, Clone, PartialEq, Eq)]

#[repr(C)]

pub struct Pagination {

    pub pagination_state: PaginationStateWrapper,

    /// Style for the row container.

    pub container_style: CssPropertyWithConditionsVec,

}

#[derive(Debug, Default, Clone, PartialEq, Eq)]

#[repr(C)]

pub struct PaginationStateWrapper {

    /// The current page + total page count.

    pub inner: PaginationState,

    /// Optional: function to call when the current page changes.

    pub on_change: OptionPaginationOnChange,

}

/// State of a [`Pagination`]: the current (1-based) page and the total page count.

#[derive(Debug, Copy, Clone, PartialEq, Eq, Default)]

#[repr(C)]

pub struct PaginationState {

    /// The 1-based index of the current page.

    pub current_page: usize,

    /// The total number of pages.

    pub total_pages: usize,

}

// ---- colours (mirroring segmented's palette) ----

/// Page border colour (#ced4da).

const PAGE_BORDER_COLOR: ColorU = ColorU { r: 206, g: 212, b: 218, a: 255 };

/// Active-page background (#0d6efd, accent blue).

const ACCENT_BG_COLOR: ColorU = ColorU { r: 13, g: 110, b: 253, a: 255 };

/// Neutral (inactive) background (white).

const NEUTRAL_BG_COLOR: ColorU = ColorU { r: 255, g: 255, b: 255, a: 255 };

/// Active-page text colour (white).

const ACTIVE_TEXT: ColorU = ColorU { r: 255, g: 255, b: 255, a: 255 };

/// Neutral text colour (#212529, dark).

const NEUTRAL_TEXT: ColorU = ColorU { r: 33, g: 37, b: 41, a: 255 };

/// Disabled (Prev/Next at a bound) text colour (#adb5bd, muted grey).

const DISABLED_TEXT: ColorU = ColorU { r: 173, g: 181, b: 189, a: 255 };

const ACCENT_BG_ITEMS: &[StyleBackgroundContent] =

    &[StyleBackgroundContent::Color(ACCENT_BG_COLOR)];

const ACCENT_BG: StyleBackgroundContentVec =

    StyleBackgroundContentVec::from_const_slice(ACCENT_BG_ITEMS);

const NEUTRAL_BG_ITEMS: &[StyleBackgroundContent] =

    &[StyleBackgroundContent::Color(NEUTRAL_BG_COLOR)];

const NEUTRAL_BG: StyleBackgroundContentVec =

    StyleBackgroundContentVec::from_const_slice(NEUTRAL_BG_ITEMS);

const PAGE_RADIUS: isize = 6;

/// Row container: a horizontal flex row that hugs its content.

static PAGINATION_CONTAINER_STYLE: &[CssPropertyWithConditions] = &[

    CssPropertyWithConditions::simple(CssProperty::const_display(LayoutDisplay::Flex)),

    CssPropertyWithConditions::simple(CssProperty::const_flex_direction(LayoutFlexDirection::Row)),

    CssPropertyWithConditions::simple(CssProperty::const_align_items(LayoutAlignItems::Center)),

    CssPropertyWithConditions::simple(CssProperty::align_self(LayoutAlignSelf::Start)),

    CssPropertyWithConditions::simple(CssProperty::const_flex_grow(LayoutFlexGrow::const_new(0))),

];

/// Builds the style for one button. The active/disabled colours and the rounding

/// of the outer corners (only the first button — `Prev` — is rounded on the left,

/// only the last — `Next` — on the right) are position-dependent, so the style is

/// built at runtime (mirroring `segmented::build_segment_style`).

#[allow(clippy::too_many_lines)] // large but cohesive: single-purpose layout/render/parse routine (one branch per case)

#[allow(clippy::fn_params_excessive_bools)] // independent boolean render flags, not a state enum

    } else {

    };

        )),

        )),

            0,

        ))),

        // Keep single-digit page buttons from collapsing too narrow.

            36,

        ))),

        // padding: 6px 12px

            6,

        ))),

        )),

        )),

        )),

        // top/bottom/right borders (the left border is added only for the first

        // button, so adjacent buttons share a single 1px separator)

        )),

        )),

        )),

        )),

        )),

        )),

        )),

    ];

impl Pagination {

    /// Creates a pager for `total_pages` pages with `current_page` (1-based)

    /// selected. `current_page` is clamped into `[1, total_pages.max(1)]`.

    /// Sets the current (1-based) page, clamped into `[1, total_pages]`.

    #[inline]

    /// Builder-style setter for the current page.

    #[inline]

    #[inline]

    #[inline]

    #[inline]

        use azul_core::{

            callbacks::CoreCallback,

            dom::{EventFilter, HoverEventFilter},

            refany::OptionRefAny,

        };

        // One shared RefAny across every button's callback (RefAny::clone shares

        // the underlying state — same pattern as segmented/tabs/map).

                    )

        // Prev (first, left-rounded; disabled-look at page 1).

        // Page-number buttons 1..=total.

        // Next (last, right-rounded; disabled-look at the final page).

}

impl Default for Pagination {

}

/// Click handler shared by all buttons. Resolves the clicked button from its

/// sibling position (`Prev`=0, page `p`=`p`, `Next`=last), computes the new page

/// within bounds, and — only if it actually changed — updates the state, invokes

/// the user callback, and live-restyles every button.

    use azul_core::dom::DomNodeId;

    };

    // Collect the buttons in document order: [Prev, page1 … pageN, Next].

    // Page buttons occupy positions 1..=total; Prev=0, Next=n-1.

    };

        };

    };

        // Prev

        } else {

        }

        // Next

        } else {

        }

    } else {

        // A page-number button: its 1-based page equals its sibling position.

    };

        // Clicked the current page, or a disabled Prev/Next at a bound.

        };

            }

        }

    };

    // Live-restyle: active page gets the accent fill + light text; Prev/Next show

    // the muted disabled text at their bounds; everything else is neutral.

            // Prev

            // Next

        } else {

        };

    }

impl From<Pagination> for Dom {

}

#[cfg(test)]

#[allow(clippy::float_cmp, clippy::too_many_lines)]

mod autotest_generated {

    use std::{

        collections::{BTreeMap, HashMap},

        sync::{Arc, Mutex},

    };

    use azul_core::{

        dom::{DomId, DomNodeId, EventFilter, HoverEventFilter, NodeId, NodeType},

        geom::{LogicalRect, OptionLogicalPosition},

        gl::OptionGlContextPtr,

        hit_test::ScrollPosition,

        refany::OptionRefAny,

        resources::RendererResources,

        styled_dom::{NodeHierarchyItemId, StyledDom},

        window::{MonitorVec, RawWindowHandle},

    };

    use azul_css::{

        props::{

            basic::{length::SizeMetric, pixel::PixelValue},

            property::CssPropertyType,

        },

        system::SystemStyle,

    };

    use rust_fontconfig::FcFontCache;

    use super::*;

    #[cfg(feature = "icu")]

    use crate::icu::IcuLocalizerHandle;

    use crate::{

        callbacks::{CallbackChange, CallbackInfoRefData, ExternalSystemCallbacks},

        solver3::{display_list::DisplayList, layout_tree::LayoutTree},

        window::{DomLayoutResult, LayoutWindow},

        window_state::FullWindowState,

    };

    // ------------------------------------------------------------------

    // Helpers

    // ------------------------------------------------------------------

    /// The declared properties of a style vec, in declaration order.

    fn declared(v: &CssPropertyWithConditionsVec) -> Vec<CssProperty> {

        v.as_ref().iter().map(|p| p.property.clone()).collect()

    }

    /// The declared properties of a rendered node's inline style, in declaration

    /// order (`with_css_props` folds the vec into a `Css`; this reads it back).

    fn inline_props(node: &Dom) -> Vec<CssProperty> {

        node.root

            .style

            .iter_inline_properties()

            .map(|(p, _)| p.clone())

            .collect()

    }

    fn text_of(node: &Dom) -> Option<&str> {

        match node.root.get_node_type() {

            NodeType::Text(s) => Some(s.as_ref().as_str()),

            NodeType::P => match node.children.as_ref() {

                [only] => match only.root.get_node_type() {

                    NodeType::Text(s) => Some(s.as_ref().as_str()),

                    _ => None,

                },

                _ => None,

            },

            _ => None,

        }

    }

    fn classes(node: &Dom) -> Vec<String> {

        node.root

            .get_ids_and_classes()

            .as_ref()

            .iter()

            .filter_map(|c| match c {

                Class(s) => Some(s.as_str().to_string()),

                IdOrClass::Id(_) => None,

            })

            .collect()

    }

    /// The one text colour a button declares (asserting there is at most one — a

    /// second declaration would silently shadow the first at cascade time).

    fn text_color(props: &[CssProperty]) -> Option<ColorU> {

        let found: Vec<ColorU> = props

            .iter()

            .filter_map(|p| match p {

                CssProperty::TextColor(v) => v.get_property().map(|c| c.inner),

                _ => None,

            })

            .collect();

        assert!(found.len() <= 1, "a button must declare at most one text colour");

        found.first().copied()

    }

    /// The one flat background colour a button declares.

    fn background_color(props: &[CssProperty]) -> Option<ColorU> {

        let found: Vec<&StyleBackgroundContentVec> = props

            .iter()

            .filter_map(|p| match p {

                CssProperty::BackgroundContent(v) => v.get_property(),

                _ => None,

            })

            .collect();

        assert!(found.len() <= 1, "a button must declare at most one background");

        let bg: &StyleBackgroundContentVec = *found.first()?;

        assert_eq!(bg.as_ref().len(), 1, "a button must declare exactly one background layer");

        match &bg.as_ref()[0] {

            StyleBackgroundContent::Color(c) => Some(*c),

            other => panic!("pagination background is not a flat colour: {other:?}"),

        }

    }

    /// The `f32` of a `PixelValue`, asserting the length is an absolute `px`. An

    /// `em`/`%` slipping into the button chrome would resolve against the parent

    /// font/box instead of the intended fixed padding, border or radius.

    fn px(pv: &PixelValue) -> f32 {

        assert_eq!(

            pv.metric,

            SizeMetric::Px,

            "pagination geometry must be absolute px, got {:?}",

            pv.metric

        );

        pv.number.get()

    }

    /// Every length a style declares (min-width, paddings, border widths, font

    /// size, corner radii).

    fn pixel_values(props: &[CssProperty]) -> Vec<PixelValue> {

        props

            .iter()

            .filter_map(|p| match p {

                CssProperty::MinWidth(v) => v.get_property().map(|x| x.inner),

                CssProperty::PaddingTop(v) => v.get_property().map(|x| x.inner),

                CssProperty::PaddingBottom(v) => v.get_property().map(|x| x.inner),

                CssProperty::PaddingLeft(v) => v.get_property().map(|x| x.inner),

                CssProperty::PaddingRight(v) => v.get_property().map(|x| x.inner),

                CssProperty::BorderTopWidth(v) => v.get_property().map(|x| x.inner),

                CssProperty::BorderBottomWidth(v) => v.get_property().map(|x| x.inner),

                CssProperty::BorderLeftWidth(v) => v.get_property().map(|x| x.inner),

                CssProperty::BorderRightWidth(v) => v.get_property().map(|x| x.inner),

                CssProperty::FontSize(v) => v.get_property().map(|x| x.inner),

                CssProperty::BorderTopLeftRadius(v) => v.get_property().map(|x| x.inner),

                CssProperty::BorderBottomLeftRadius(v) => v.get_property().map(|x| x.inner),

                CssProperty::BorderTopRightRadius(v) => v.get_property().map(|x| x.inner),

                CssProperty::BorderBottomRightRadius(v) => v.get_property().map(|x| x.inner),

                _ => None,

            })

            .collect()

    }

    /// The four corner radii a style declares, as `(top-left, bottom-left,

    /// top-right, bottom-right)`; `None` where the corner is left square.

    fn radii(props: &[CssProperty]) -> (Option<f32>, Option<f32>, Option<f32>, Option<f32>) {

        let find = |f: &dyn Fn(&CssProperty) -> Option<f32>| props.iter().find_map(f);

        (

            find(&|p| match p {

                CssProperty::BorderTopLeftRadius(v) => v.get_property().map(|r| px(&r.inner)),

                _ => None,

            }),

            find(&|p| match p {

                CssProperty::BorderBottomLeftRadius(v) => v.get_property().map(|r| px(&r.inner)),

                _ => None,

            }),

            find(&|p| match p {

                CssProperty::BorderTopRightRadius(v) => v.get_property().map(|r| px(&r.inner)),

                _ => None,

            }),

            find(&|p| match p {

                CssProperty::BorderBottomRightRadius(v) => v.get_property().map(|r| px(&r.inner)),

                _ => None,

            }),

        )

    }

    /// Whether the style declares a *left* border on all three of width/style/colour

    /// — the "I am the first button in the joined bar" marker.

    fn has_left_border(props: &[CssProperty]) -> (bool, bool, bool) {

        (

            props.iter().any(|p| matches!(p, CssProperty::BorderLeftWidth(_))),

            props.iter().any(|p| matches!(p, CssProperty::BorderLeftStyle(_))),

            props.iter().any(|p| matches!(p, CssProperty::BorderLeftColor(_))),

        )

    }

    /// Every `(active, disabled, is_first, is_last)` the builder can be handed.

    fn all_flag_combinations() -> Vec<(bool, bool, bool, bool)> {

        let mut out = Vec::with_capacity(16);

        for a in [false, true] {

            for d in [false, true] {

                for f in [false, true] {

                    for l in [false, true] {

                        out.push((a, d, f, l));

                    }

                }

            }

        }

        out

    }

    /// A `RefAny` payload recording every state a user `on_change` observes.

    struct ChangeLog {

        seen: Vec<PaginationState>,

    }

    extern "C" fn record_change(

        mut data: RefAny,

        _: CallbackInfo,

        state: PaginationState,

    ) -> Update {

        if let Some(mut log) = data.downcast_mut::<ChangeLog>() {

            log.seen.push(state);

        }

        Update::RefreshDom

    }

    extern "C" fn change_do_nothing(_: RefAny, _: CallbackInfo, _: PaginationState) -> Update {

        Update::DoNothing

    }

    extern "C" fn change_refresh_all(_: RefAny, _: CallbackInfo, _: PaginationState) -> Update {

        Update::RefreshDomAllWindows

    }

    /// Forces the `fn`-item -> `fn`-pointer coercion the `Into` bound needs.

    fn cb(f: PaginationOnChangeCallbackType) -> PaginationOnChangeCallback {

        f.into()

    }

    fn logged(data: &mut RefAny) -> Vec<PaginationState> {

        data.downcast_ref::<ChangeLog>()

            .expect("payload must still be a ChangeLog")

            .seen

            .clone()

    }

    fn current_page_of(data: &mut RefAny) -> usize {

        data.downcast_ref::<PaginationStateWrapper>()

            .expect("payload must still be a PaginationStateWrapper")

            .inner

            .current_page

    }

    /// The shared state `RefAny` carried by button `i`'s click callback.

    fn button_state(dom: &Dom, i: usize) -> RefAny {

        dom.children.as_ref()[i]

            .root

            .get_callbacks()

            .as_ref()

            .first()

            .expect("every pagination button carries a click callback")

            .refany

            .clone()

    }

    /// Flattened node ids. Every button is a `<p>` wrapping one bare text node,

    /// so depth-first pre-order lays them out as

    /// `0 root / 1 Prev <p> / 2 Prev text / 3 page1 <p> / 4 page1 text / …`.

    /// The callbacks sit on the `<p>`s.

    const PREV_NODE: usize = 1;

    /// Flattened node id of page `p` (1-based).

    const fn page_node(p: usize) -> usize {

        2 * p + 1

    }

    /// Flattened node id of the `Next` button for a `total`-page pager.

    const fn next_node(total: usize) -> usize {

        2 * total + 3

    }

    /// A `DomLayoutResult` with an *empty* layout tree: `on_page_click` only walks

    /// `styled_dom.node_hierarchy`, so no real layout (and no font) is needed.

    fn layout_result(styled_dom: StyledDom) -> DomLayoutResult {

        DomLayoutResult {

            styled_dom,

            layout_tree: LayoutTree {

                nodes: Vec::new(),

                warm: Vec::new(),

                cold: Vec::new(),

                root: 0,

                dom_to_layout: BTreeMap::new(),

                children_arena: Vec::new(),

                children_offsets: Vec::new(),

                subtree_needs_intrinsic: Vec::new(),

            },

            calculated_positions: Vec::new(),

            viewport: LogicalRect::zero(),

            display_list: Arc::new(DisplayList::default()),

            scroll_ids: HashMap::new(),

            scroll_id_to_node_id: HashMap::new(),

        }

    }

    /// Flattens `p.dom()` and hands back the shared state `RefAny` its buttons carry.

    fn flatten(p: Pagination) -> (StyledDom, RefAny) {

        let dom = p.dom();

        let state = button_state(&dom, 0);

        (StyledDom::create_from_dom(dom), state)

    }

    /// Invokes `on_page_click` against a `LayoutWindow` holding `styled` (or nothing

    /// at all, when `styled` is `None`), with flattened node `hit` as the hit node.

    /// Returns the `Update` plus every recorded `CallbackChange`.

    fn run_click(

        styled: Option<StyledDom>,

        hit: usize,

        data: RefAny,

    ) -> (Update, Vec<CallbackChange>) {

        let mut layout_window =

            LayoutWindow::new(FcFontCache::default()).expect("LayoutWindow::new failed");

        if let Some(sd) = styled {

            layout_window

                .layout_results

                .insert(DomId::ROOT_ID, layout_result(sd));

        }

        let renderer_resources = RendererResources::default();

        let previous_window_state: Option<FullWindowState> = None;

        let current_window_state = FullWindowState::default();

        let gl_context = OptionGlContextPtr::None;

        let scroll_states: BTreeMap<DomId, BTreeMap<NodeHierarchyItemId, ScrollPosition>> =

            BTreeMap::new();

        let window_handle = RawWindowHandle::Unsupported;

        let system_callbacks = ExternalSystemCallbacks::rust_internal();

        let ref_data = CallbackInfoRefData {

            layout_window: &layout_window,

            renderer_resources: &renderer_resources,

            previous_window_state: &previous_window_state,

            current_window_state: &current_window_state,

            gl_context: &gl_context,

            current_scroll_manager: &scroll_states,

            current_window_handle: &window_handle,

            system_callbacks: &system_callbacks,

            system_style: Arc::new(SystemStyle::default()),

            monitors: Arc::new(Mutex::new(MonitorVec::from_const_slice(&[]))),

            #[cfg(feature = "icu")]

            icu_localizer: IcuLocalizerHandle::default(),

            ctx: OptionRefAny::None,

        };

        let changes: Arc<Mutex<Vec<CallbackChange>>> = Arc::new(Mutex::new(Vec::new()));

        let info = CallbackInfo::new(

            &ref_data,

            &changes,

            DomNodeId {

                dom: DomId::ROOT_ID,

                node: NodeHierarchyItemId::from_crate_internal(Some(NodeId::new(hit))),

            },

            OptionLogicalPosition::None,

            OptionLogicalPosition::None,

        );

        let update = on_page_click(data, info);

        let recorded = core::mem::take(&mut *changes.lock().expect("change log poisoned"));

        (update, recorded)

    }

    /// Decodes a live-restyle transaction into `(node index, background, text)`

    /// triples — the handler pushes exactly one background and one colour write per

    /// button, in that order.

    fn restyle(changes: &[CallbackChange]) -> Vec<(usize, ColorU, ColorU)> {

        assert_eq!(

            changes.len() % 2,

            0,

            "a restyle pass writes background+colour in pairs"

        );

        let decode = |c: &CallbackChange| -> (usize, CssProperty) {

            match c {

                CallbackChange::ChangeNodeCssProperties {

                    dom_id,

                    node_id,

                    properties,

                } => {

                    assert_eq!(*dom_id, DomId::ROOT_ID, "restyle must stay in the root DOM");

                    assert_eq!(

                        properties.as_ref().len(),

                        1,

                        "set_css_property writes exactly one property per change"

                    );

                    (node_id.index(), properties.as_ref()[0].clone())

                }

                other => panic!("unexpected change pushed by on_page_click: {other:?}"),

            }

        };

        changes

            .chunks(2)

            .map(|pair| {

                let (bg_node, bg_prop) = decode(&pair[0]);

                let (fg_node, fg_prop) = decode(&pair[1]);

                assert_eq!(bg_node, fg_node, "both writes must target the same button");

                let bg = background_color(&[bg_prop])

                    .expect("the first write of each pair is the background");

                let fg =

                    text_color(&[fg_prop]).expect("the second write of each pair is the colour");

                (bg_node, bg, fg)

            })

            .collect()

    }

    // ==================================================================

    // build_button_style

    // ==================================================================

    #[test]

    fn build_button_style_never_panics_and_is_deterministic() {

        for (a, d, f, l) in all_flag_combinations() {

            let style = build_button_style(a, d, f, l);

            assert!(

                !style.as_ref().is_empty(),

                "({a},{d},{f},{l}) produced an empty style"

            );

            assert_eq!(

                declared(&style),

                declared(&build_button_style(a, d, f, l)),

                "({a},{d},{f},{l}) is not a pure function of its flags"

            );

        }

    }

    #[test]

    fn build_button_style_declares_every_property_at_most_once() {

        // A duplicate declaration would silently shadow the earlier one at cascade

        // time, making the widget's look depend on declaration order.

        for (a, d, f, l) in all_flag_combinations() {

            let props = declared(&build_button_style(a, d, f, l));

            let mut types: Vec<CssPropertyType> = props.iter().map(CssProperty::get_type).collect();

            let len = types.len();

            types.sort_unstable();

            types.dedup();

            assert_eq!(types.len(), len, "duplicate declaration for ({a},{d},{f},{l})");

        }

    }

    #[test]

    fn build_button_style_is_unconditional() {

        // Every declaration is `simple` — a stray `apply_if` would make the button

        // silently lose its fill under some pseudo-state.

        for (a, d, f, l) in all_flag_combinations() {

            for p in build_button_style(a, d, f, l).as_ref() {

                assert!(

                    p.apply_if.as_ref().is_empty(),

                    "({a},{d},{f},{l}) declared a conditional property: {:?}",

                    p.property

                );

            }

        }

    }

    #[test]

    fn build_button_style_active_wins_over_disabled_for_the_text_colour() {

        // `active` is checked first, so an active-*and*-disabled button reads as

        // active; only a non-active disabled button gets the muted grey.

        for (flags, expected) in [

            ((true, true), ACTIVE_TEXT),

            ((true, false), ACTIVE_TEXT),

            ((false, true), DISABLED_TEXT),

            ((false, false), NEUTRAL_TEXT),

        ] {

            let (a, d) = flags;

            let props = declared(&build_button_style(a, d, false, false));

            assert_eq!(

                text_color(&props),

                Some(expected),

                "active={a} disabled={d} picked the wrong text colour"

            );

        }

    }

    #[test]

    fn build_button_style_paints_the_accent_fill_only_when_active() {

        for (a, d, f, l) in all_flag_combinations() {

            let props = declared(&build_button_style(a, d, f, l));

            let expected = if a { ACCENT_BG_COLOR } else { NEUTRAL_BG_COLOR };

            assert_eq!(

                background_color(&props),

                Some(expected),

                "({a},{d},{f},{l}) has the wrong fill — `disabled` must not tint the background"

            );

        }

    }

    #[test]

    fn build_button_style_rounds_only_the_outer_corners() {

        for (a, d, f, l) in all_flag_combinations() {

            let props = declared(&build_button_style(a, d, f, l));

            let (tl, bl, tr, br) = radii(&props);

            let r = PAGE_RADIUS as f32;

            assert_eq!(tl, if f { Some(r) } else { None }, "top-left for is_first={f}");

            assert_eq!(bl, if f { Some(r) } else { None }, "bottom-left for is_first={f}");

            assert_eq!(tr, if l { Some(r) } else { None }, "top-right for is_last={l}");

            assert_eq!(br, if l { Some(r) } else { None }, "bottom-right for is_last={l}");

        }

    }

    #[test]

    fn build_button_style_gives_only_the_first_button_a_left_border() {

        // Adjacent buttons must share a single 1px separator: everyone draws a right

        // border, only the leftmost also draws a left one.

        for (a, d, f, l) in all_flag_combinations() {

            let props = declared(&build_button_style(a, d, f, l));

            assert_eq!(

                has_left_border(&props),

                (f, f, f),

                "left border must be present iff is_first ({a},{d},{f},{l})"

            );

            assert!(

                props.iter().any(|p| matches!(p, CssProperty::BorderRightWidth(_))),

                "every button draws its own right border"

            );

        }

    }

    #[test]

    fn build_button_style_property_count_is_purely_position_dependent() {

        // The colour flags must not add or drop declarations — only the position

        // flags do (left border + 2 radii for first, 2 radii for last).

        let base = build_button_style(false, false, false, false).as_ref().len();

        for (a, d) in [(false, false), (true, false), (false, true), (true, true)] {

            assert_eq!(

                build_button_style(a, d, false, false).as_ref().len(),

                base,

                "colour flags changed the declaration count"

            );

            assert_eq!(

                build_button_style(a, d, true, false).as_ref().len(),

                base + 5,

                "is_first must add exactly left width/style/colour + 2 radii"

            );

            assert_eq!(

                build_button_style(a, d, false, true).as_ref().len(),

                base + 2,

                "is_last must add exactly 2 radii"

            );

            assert_eq!(

                build_button_style(a, d, true, true).as_ref().len(),

                base + 7,

                "a single-button bar is first *and* last"

            );

        }

    }

    #[test]

    fn build_button_style_uses_only_absolute_px_lengths() {

        for (a, d, f, l) in all_flag_combinations() {

            let props = declared(&build_button_style(a, d, f, l));

            let lengths = pixel_values(&props);

            assert!(!lengths.is_empty(), "a button must declare some geometry");

            for pv in &lengths {

                let v = px(pv); // asserts SizeMetric::Px

                assert!(v.is_finite(), "non-finite length {v} in ({a},{d},{f},{l})");

                assert!(v >= 0.0, "negative length {v} in ({a},{d},{f},{l})");

            }

        }

    }

    #[test]

    fn button_palette_is_opaque_and_the_states_are_visually_distinct() {

        for (name, c) in [

            ("page border", PAGE_BORDER_COLOR),

            ("accent bg", ACCENT_BG_COLOR),

            ("neutral bg", NEUTRAL_BG_COLOR),

            ("active text", ACTIVE_TEXT),

            ("neutral text", NEUTRAL_TEXT),

            ("disabled text", DISABLED_TEXT),

        ] {

            assert_eq!(c.a, 255, "{name} must be fully opaque");

        }

        assert_ne!(ACCENT_BG_COLOR, NEUTRAL_BG_COLOR, "the active page must stand out");

        assert_ne!(ACTIVE_TEXT, NEUTRAL_TEXT, "active text must read on the accent fill");

        assert_ne!(NEUTRAL_TEXT, DISABLED_TEXT, "a disabled end must look disabled");

        // The active-page text sits on the accent fill and must not equal it.

        assert_ne!(ACTIVE_TEXT, ACCENT_BG_COLOR, "active text would be invisible");

        assert_ne!(NEUTRAL_TEXT, NEUTRAL_BG_COLOR, "neutral text would be invisible");

        assert_ne!(DISABLED_TEXT, NEUTRAL_BG_COLOR, "disabled text would be invisible");

    }

    // ==================================================================

    // Pagination::create

    // ==================================================================

    #[test]

    fn create_clamps_current_page_into_range() {

        for (cur, total, want_cur, want_total) in [

            // (input page, input total, expected page, expected total)

            (0usize, 0usize, 1usize, 1usize),

            (0, 1, 1, 1),

            (1, 0, 1, 1),

            (0, 5, 1, 5),

            (1, 5, 1, 5),

            (3, 5, 3, 5),

            (5, 5, 5, 5),

            (6, 5, 5, 5),

            (usize::MAX, 5, 5, 5),

            (usize::MAX, 1, 1, 1),

            (usize::MAX, 0, 1, 1),

            (5, usize::MAX, 5, usize::MAX),

            (0, usize::MAX, 1, usize::MAX),

            (usize::MAX, usize::MAX, usize::MAX, usize::MAX),

        ] {

            let p = Pagination::create(cur, total);

            assert_eq!(

                p.pagination_state.inner,

                PaginationState {

                    current_page: want_cur,

                    total_pages: want_total,

                },

                "create({cur}, {total})"

            );

        }

    }

    #[test]

    fn create_never_yields_a_zero_or_out_of_range_page() {

        // The 1-based invariant is what every consumer (dom(), the click handler,

        // the restyle pass) relies on; a 0 page would mean "no page is current".

        for total in [0usize, 1, 2, 3, 7, 64, 1024, usize::MAX - 1, usize::MAX] {

            for cur in [0usize, 1, 2, 63, 1023, usize::MAX - 1, usize::MAX] {

                let s = Pagination::create(cur, total).pagination_state.inner;

                assert!(s.total_pages >= 1, "create({cur}, {total}) left 0 pages");

                assert!(s.current_page >= 1, "create({cur}, {total}) produced page 0");

                assert!(

                    s.current_page <= s.total_pages,

                    "create({cur}, {total}) escaped the upper bound"

                );

                // Clamping must never *invent* a page: an in-range input survives.

                if cur >= 1 && cur <= total {

                    assert_eq!(s.current_page, cur, "an in-range page must pass through");

                }

            }

        }

    }

    #[test]

    fn create_installs_no_callback_and_the_shared_const_container_style() {

        let p = Pagination::create(2, 4);

        assert!(

            p.pagination_state.on_change.as_ref().is_none(),

            "create must not install a callback"

        );

        assert_eq!(

            p.container_style.as_ref(),

            PAGINATION_CONTAINER_STYLE,

            "create must reuse the const container style"

        );

    }

    #[test]

    fn default_equals_create_one_one() {

        assert_eq!(Pagination::default(), Pagination::create(1, 1));

        let s = Pagination::default().pagination_state.inner;

        assert_eq!(s.current_page, 1);

        assert_eq!(s.total_pages, 1);

    }

    // ==================================================================

    // Pagination::set_current_page / with_current_page

    // ==================================================================

    #[test]

    fn set_current_page_clamps_into_range() {

        for (input, want) in [

            (0usize, 1usize),

            (1, 1),

            (4, 4),

            (7, 7),

            (8, 7),

            (usize::MAX, 7),

            (usize::MAX - 1, 7),

        ] {

            let mut p = Pagination::create(1, 7);

            p.set_current_page(input);

            assert_eq!(

                p.pagination_state.inner.current_page, want,

                "set_current_page({input}) on a 7-page pager"

            );

            assert_eq!(

                p.pagination_state.inner.total_pages, 7,

                "set_current_page must not touch total_pages"

            );

        }

    }

    #[test]

    fn set_current_page_survives_a_hand_corrupted_zero_total() {

        // `total_pages` is a pub field, so it can be zeroed behind the constructor's

        // back. `clamp(1, 0)` would panic (min > max); the `.max(1)` guard is what

        // prevents that.

        let mut p = Pagination::create(1, 3);

        p.pagination_state.inner.total_pages = 0;

        for input in [0usize, 1, 5, usize::MAX] {

            p.set_current_page(input);

            assert_eq!(

                p.pagination_state.inner.current_page, 1,

                "a 0-page pager must collapse every page to 1"

            );

        }

        assert_eq!(

            p.pagination_state.inner.total_pages, 0,

            "the setter must not silently repair total_pages"

        );

    }

    #[test]

    fn set_current_page_is_idempotent_and_reversible() {

        let mut p = Pagination::create(1, 10);

        for page in [1usize, 10, 5, 5, 1, 10] {

            p.set_current_page(page);

            let once = p.pagination_state.inner.current_page;

            p.set_current_page(page);

            assert_eq!(p.pagination_state.inner.current_page, once, "not idempotent");

            assert_eq!(once, page);

        }

    }

    #[test]

    fn set_current_page_at_the_usize_max_total_does_not_overflow() {

        let mut p = Pagination::create(1, usize::MAX);

        p.set_current_page(usize::MAX);

        assert_eq!(p.pagination_state.inner.current_page, usize::MAX);

        p.set_current_page(0);

        assert_eq!(p.pagination_state.inner.current_page, 1);

    }

    #[test]

    fn with_current_page_matches_set_current_page_and_keeps_the_callback() {

        for input in [0usize, 1, 3, 9, usize::MAX] {

            let mut expected = Pagination::create(1, 6);

            expected.set_current_page(input);

            let got = Pagination::create(1, 6).with_current_page(input);

            assert_eq!(got, expected, "builder and setter must agree for {input}");

        }

        // The builder form must not drop an already-installed callback.

        let p = Pagination::create(1, 6)

            .with_on_change(RefAny::new(ChangeLog { seen: Vec::new() }), cb(record_change))

            .with_current_page(4);

        assert_eq!(p.pagination_state.inner.current_page, 4);

        assert!(

            p.pagination_state.on_change.as_ref().is_some(),

            "with_current_page must not disturb the callback"

        );

    }

    // ==================================================================

    // Pagination::swap_with_default

    // ==================================================================

    #[test]

    fn swap_with_default_returns_the_old_value_and_resets_self() {

        let mut p = Pagination::create(3, 9);

        let old = p.swap_with_default();

        assert_eq!(old.pagination_state.inner.current_page, 3);

        assert_eq!(old.pagination_state.inner.total_pages, 9);

        assert_eq!(p, Pagination::default(), "self must be left as a 1-of-1 pager");

    }

    #[test]

    fn swap_with_default_moves_the_callback_out_of_self() {

        let mut p = Pagination::create(1, 3)

            .with_on_change(RefAny::new(ChangeLog { seen: Vec::new() }), cb(record_change));

        let old = p.swap_with_default();

        assert!(

            old.pagination_state.on_change.as_ref().is_some(),

            "the callback must travel with the returned value"

        );

        assert!(

            p.pagination_state.on_change.as_ref().is_none(),

            "self must not keep a dangling reference to the moved-out callback"

        );

    }

    #[test]

    fn swap_with_default_is_stable_when_repeated() {

        let mut p = Pagination::create(2, 4);

        let _ = p.swap_with_default();

        for _ in 0..100 {

            let out = p.swap_with_default();

            assert_eq!(out, Pagination::default());

            assert_eq!(p, Pagination::default());

        }

    }

    #[test]

    fn swap_with_default_preserves_a_hand_corrupted_state_verbatim() {

        let mut p = Pagination::create(1, 4);

        p.pagination_state.inner.current_page = usize::MAX;

        p.pagination_state.inner.total_pages = 0;

        let old = p.swap_with_default();

        assert_eq!(

            old.pagination_state.inner,

            PaginationState {

                current_page: usize::MAX,

                total_pages: 0,

            },

            "the swap must move state out untouched (no clamping/rewriting)"

        );

        assert_eq!(p.pagination_state.inner.current_page, 1);

        assert_eq!(p.pagination_state.inner.total_pages, 1);

    }

    // ==================================================================

    // Pagination::set_on_change / with_on_change

    // ==================================================================

    #[test]

    fn with_on_change_installs_the_callback_and_touches_nothing_else() {

        let before = Pagination::create(2, 5);

        let after = Pagination::create(2, 5)

            .with_on_change(RefAny::new(ChangeLog { seen: Vec::new() }), cb(record_change));