<?xml version="1.0"?>
<templates xml:space="preserve">

    <t t-name="hr.VersionsTimeline" t-inherit="web.StatusBarField" t-inherit-mode="primary">
        <div t-ref="root" position="after">
            <div class="o_arrow_button_wrapper">
                <button
                    t-ref="datetime-picker-target-version"
                    title="New Employee Record"
                    t-on-click="onClickDateTimePickerBtn"
                    class="btn btn-primary">
                    <i class="fa fa-plus"/>
                </button>
            </div>
        </div>

        <button t-ref="after" position="replace">
            <div class="o_arrow_button_wrapper">
                <button
                    t-ref="after"
                    type="button"
                    class="btn btn-secondary dropdown-toggle o_arrow_button o_first"
                    t-att-disabled="props.isDisabled"
                    aria-label="More..."
                >
                    ...
                </button>
            </div>
        </button>

        <button t-ref="before" position="replace">
            <div class="o_arrow_button_wrapper">
                <button
                    t-ref="before"
                    type="button"
                    class="btn btn-secondary dropdown-toggle o_arrow_button o_last"
                    t-att-disabled="props.isDisabled"
                    aria-label="More..."
                >
                    ...
                </button>
            </div>
        </button>

        <t t-foreach="items.inline" position="replace">
            <t t-foreach="items.inline" t-as="item" t-key="item.value">
                <div class="o_arrow_button_wrapper"
                        t-att-data-tooltip="item.toolTip">
                    <button
                        type="button"
                        class="btn btn-secondary o_arrow_button"
                        t-att-class="{
                            o_first: item_first,
                            o_arrow_button_current: item.isSelected,
                            o_last: item_last,
                        }"
                        t-att-disabled="props.isDisabled || item.isSelected"
                        role="radio"
                        t-att-aria-checked="item.isSelected.toString()"
                        t-att-aria-current="item.isSelected and 'step'"
                        t-att-data-value="item.value"
                        t-esc="item.label"
                        t-on-click="() => this.selectItem(item)"/>
                    <div
                        t-if="displayContractLines"
                        t-att-class="{
                            o_first: item_first,
                            o_last: item_last,
                            o_purple_line: item.isInContract and item.isCurrentContract,
                        }"/>
                </div>
            </t>
        </t>
    </t>
</templates>
