import { _ as _applyDecoratedDescriptor, a as _initializerDefineProperty, b as _defineProperty } from '../../../_rollupPluginBabelHelpers-9wjJaosZ.js';
import { setComponentTemplate } from '@ember/component';
import { precompileTemplate } from '@ember/template-compilation';
import Component from '@glimmer/component';
import { tracked } from '@glimmer/tracking';
import { on } from '@ember/modifier';
import { action } from '@ember/object';
import dateMath from '@elastic/datemath';
import pick from 'ember-composable-helpers/helpers/pick';
import EuiFieldNumber from '../../eui-field-number.js';
import EuiFieldText from '../../eui-field-text.js';
import EuiFlexGroup from '../../eui-flex-group.js';
import EuiFlexItem from '../../eui-flex-item.js';
import EuiForm from '../../eui-form.js';
import EuiFormLabel from '../../eui-form-label.js';
import EuiFormRow from '../../eui-form-row.js';
import EuiPopoverFooter from '../../eui-popover-footer.js';
import EuiSelect from '../../eui-select.js';
import EuiSpacer from '../../eui-spacer.js';
import EuiSwitch from '../../eui-switch.js';
import { parseRelativeParts, INVALID_DATE, toRelativeStringFromParts } from '../utils/index.js';

var _class, _descriptor, _descriptor2, _descriptor3;
let RelativeTab = setComponentTemplate(precompileTemplate(`
    <EuiForm class="euiDatePopoverContent__padded">
      <EuiFlexGroup @gutterSize="s" @responsive={{false}}>
        <EuiFlexItem>
          <EuiFormRow>
            <EuiFieldNumber
              @compressed={{true}}
              @value={{this.count}}
              @min="0"
              {{on "input" this.onCountChange}}
            />
          </EuiFormRow>
        </EuiFlexItem>
        <EuiFlexItem>
          <EuiSelect
            @compressed={{true}}
            @value={{this.unit}}
            @options={{@timeOptions.relativeOptions}}
            {{on "change" (pick "target.value" this.onUnitChange)}}
          />
        </EuiFlexItem>
      </EuiFlexGroup>
      <EuiSpacer @size="s" />
      <EuiFieldText
        @compressed={{true}}
        @value={{this.formattedValue}}
        @readOnly={{true}}
      >
        <:prepend>
          <EuiFormLabel>{{@labelPrefix}}</EuiFormLabel>
        </:prepend>
      </EuiFieldText>
    </EuiForm>
    <EuiPopoverFooter @paddingSize="s">
      <EuiSwitch
        @label={{this.roundingLabel}}
        @checked={{this.round}}
        @onChange={{pick "target.checked" this.onRoundChange}}
      />
    </EuiPopoverFooter>
  `, {
  strictMode: true,
  scope: () => ({
    EuiForm,
    EuiFlexGroup,
    EuiFlexItem,
    EuiFormRow,
    EuiFieldNumber,
    on,
    EuiSelect,
    pick,
    EuiSpacer,
    EuiFieldText,
    EuiFormLabel,
    EuiPopoverFooter,
    EuiSwitch
  })
}), (_class = class RelativeTab extends Component {
  constructor(owner, args) {
    super(owner, args);
    _initializerDefineProperty(this, "count", _descriptor, this);
    _initializerDefineProperty(this, "unit", _descriptor2, this);
    _initializerDefineProperty(this, "round", _descriptor3, this);
    _defineProperty(this, "roundUnit", void 0);
    const parsed = parseRelativeParts(this.args.value);
    if (parsed) {
      this.count = parsed.count;
      this.unit = parsed.unit;
      this.round = parsed.round;
      this.roundUnit = parsed.roundUnit;
    }
  }
  get formattedValue() {
    const invalidDate = this.args.value === INVALID_DATE;
    const invalidValue = this.count === undefined || this.count < 0;
    const isInvalid = invalidValue || invalidDate;
    const parsedValue = dateMath.parse(this.args.value, {
      roundUp: this.args.roundUp
    });
    const invalid = isInvalid || !parsedValue || !parsedValue.isValid();
    return invalid ? '' : parsedValue.locale(this.args.locale || 'en').format(this.args.dateFormat);
  }
  get roundingLabel() {
    //@ts-expect-error
    return this.args.timeOptions.relativeRoundingLabels[this.unit[0]];
  }
  onCountChange(e) {
    const sanitizedValue = parseInt(e.target.value, 10);
    this.count = isNaN(sanitizedValue) ? undefined : sanitizedValue;
    this.handleChange();
  }
  onUnitChange(unit) {
    this.unit = unit;
    this.handleChange();
  }
  onRoundChange(checked) {
    this.round = checked;
    this.handleChange();
  }
  handleChange(e) {
    if (this.count === undefined || this.count < 0) {
      return;
    }
    const date = toRelativeStringFromParts({
      count: this.count,
      round: this.round,
      roundUnit: this.roundUnit,
      unit: this.unit
    });
    this.args.onChange(date, e);
  }
}, (_descriptor = _applyDecoratedDescriptor(_class.prototype, "count", [tracked], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: null
}), _descriptor2 = _applyDecoratedDescriptor(_class.prototype, "unit", [tracked], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: function () {
    return 'm';
  }
}), _descriptor3 = _applyDecoratedDescriptor(_class.prototype, "round", [tracked], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: function () {
    return false;
  }
}), _applyDecoratedDescriptor(_class.prototype, "onCountChange", [action], Object.getOwnPropertyDescriptor(_class.prototype, "onCountChange"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "onUnitChange", [action], Object.getOwnPropertyDescriptor(_class.prototype, "onUnitChange"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "onRoundChange", [action], Object.getOwnPropertyDescriptor(_class.prototype, "onRoundChange"), _class.prototype)), _class));

export { RelativeTab as default };
//# sourceMappingURL=relative-tab.js.map
