@hashicorp/design-system-components/dist/components/hds/form/key-value-inputs/add-row-button.js

Helios Design System Components

import Component from '@glimmer/component';
import { on } from '@ember/modifier';
import { service } from '@ember/service';
import HdsButton from '../../button/index.js';
import { precompileTemplate } from '@ember/template-compilation';
import { setComponentTemplate } from '@ember/component';
import { g, i } from 'decorator-transforms/runtime';

/**
 * Copyright IBM Corp. 2021, 2025
 * SPDX-License-Identifier: MPL-2.0
 */
class HdsFormKeyValueInputsAddRowButton extends Component {
  static {
    g(this.prototype, "hdsIntl", [service]);
  }
  #hdsIntl = (i(this, "hdsIntl"), void 0);
  get ariaDescription() {
    return this.hdsIntl.t('hds.components.form.key-value-inputs.add-row-button.aria-description', {
      default: 'Adds a new row of one or more inputs at the end of the form field. Press shift tab to move focus back to the newly added row.'
    });
  }
  get text() {
    return this.args.text ?? this.hdsIntl.t('hds.components.form.key-value-inputs.add-row-button.text', {
      default: 'Add row'
    });
  }
  onClick = () => {
    const {
      onClick
    } = this.args;
    if (typeof onClick === 'function') {
      onClick();
    }
  };
  static {
    setComponentTemplate(precompileTemplate("<HdsButton @text={{this.text}} @size=\"medium\" @color=\"secondary\" @icon=\"plus\" @iconPosition=\"leading\" class=\"hds-form-key-value-inputs__add-row-button\" aria-description={{this.ariaDescription}} {{on \"click\" this.onClick}} ...attributes />", {
      strictMode: true,
      scope: () => ({
        HdsButton,
        on
      })
    }), this);
  }
}

export { HdsFormKeyValueInputsAddRowButton as default };
//# sourceMappingURL=add-row-button.js.map