<Overlay @onLoad={{this.onLoad}} @isOpen={{@isOpen}} @position="right" @noBackdrop={{true}} @fullHeight={{true}} @isResizable={{true}} @isMaximizable={{true}} @isMinimizable={{true}} @width="600px" as |overlay|>
    <Overlay::Header @overlay={{overlay}} @title={{t "fleet-ops.component.settings-window.title"}} @onPressCancel={{@onPressCancel}}>
        <Button @icon="save" @type="primary" @text={{if (media 'isMobile') "" (t "fleet-ops.component.settings-window.save") }} @onClick={{this.saveSettings}} @isLoading={{this.isSaving}} @disabled={{or this.isLoading this.isSaving}} />
    </Overlay::Header>

    <Overlay::Body>
        <div class="px-5 py-4">
            <InputGroup @name={{t "fleet-ops.component.settings-window.name"}} @type="number" @value={{this.company.options.fleetops.adhoc_distance}} @wrapperClass="mb-0" @helpText={{t "fleet-ops.component.settings-window.name-text"}} />
            <div class="mt-2 px-3 py-1 rounded-lg border border-blue-600 bg-blue-100 flex items-center">
                <FaIcon @icon="triangle-exclamation" class="text-blue-900 mr-1.5" />
                <span class="text-blue-900 text-xs">{{t "fleet-ops.component.settings-window.message"}}</span>
            </div>
        </div>
    </Overlay::Body>
</Overlay>