import templateOnly from '@ember/component/template-only';
import { setComponentTemplate } from '@ember/component';
import { precompileTemplate } from '@ember/template-compilation';
import classNames from '../../helpers/class-names.js';
import EuiIcon from '../eui-icon.js';

const EuiDatePickerRange = setComponentTemplate(precompileTemplate(`
    <div
      class={{classNames
        "euiDatePickerRange"
        (if @readOnly "euiDatePickerRange--readOnly")
        (if @fullWidth "euiDatePickerRange--fullWidth")
        (if @isInvalid "euiDatePickerRange--isInvalid")
        (if @disabled "euiDatePickerRange--isDisabled")
        @className
      }}
      ...attributes
    >
      {{yield to="startDateControl"}}

      <span class="euiDatePickerRange__delimeter">
        <EuiIcon
          @color={{if @isInvalid "danger" "subdued"}}
          @type={{if @isInvalid "warning" "sortRight"}}
        />
      </span>

      {{yield to="endDateControl"}}
    </div>
  `, {
  strictMode: true,
  scope: () => ({
    classNames,
    EuiIcon
  })
}), templateOnly("eui-date-picker-range", "EuiDatePickerRange"));

export { EuiDatePickerRange as default };
//# sourceMappingURL=eui-date-picker-range.js.map
