import { html } from '@microsoft/fast-element';
import { mapStateToControlProps, rankWith } from '@jsonforms/core';
import { isOneOfNumber } from '../testers/isOneOfNumber';
import { NUMBER_CONTROL_RANK } from './RenderersRanks';
export const NumberControlRendererTemplate = html `
  <template>
    <control-wrapper
      :control=${(x) => x.control}
      :touched=${(x) => x.touched}
      ?submitted=${(x) => x.submitted}
    >
      <zero-text-field
        :value=${(x) => (x.control.data === undefined ? '' : x.control.data)}
        @change=${(x, c) => {
    const value = parseFloat(c.event.target.value);
    return x.control.handleChange(x.control.path, !isNaN(value) ? value : undefined);
}}
        placeholder=${(x) => x.control.label}
        id=${(x) => x.control.path}
        data-test-id=${(x) => x.control.path}
        ?required=${(x) => x.control.required}
        ?disabled=${(x) => !x.control.enabled}
        @blur=${(x) => x.onBlur()}
        style="width: 100%"
      ></zero-text-field>
    </control-wrapper>
  </template>
`;
export const NumberControlRendererEntry = {
    renderer: NumberControlRendererTemplate,
    tester: rankWith(NUMBER_CONTROL_RANK, isOneOfNumber),
    mapper: mapStateToControlProps,
};
//# sourceMappingURL=NumberControlRenderer.js.map