@hashicorp/design-system-components/dist/components/hds/pagination/nav/number.js

Helios Design System Components

import Component from '@glimmer/component';
import { assert } from '@ember/debug';
import { on } from '@ember/modifier';
import HdsInteractive from '../../interactive/index.js';
import HdsTextBody from '../../text/body.js';
import HdsTHelper from '../../../../helpers/hds-t.js';
import { precompileTemplate } from '@ember/template-compilation';
import { setComponentTemplate } from '@ember/component';

/**
 * Copyright IBM Corp. 2021, 2025
 * SPDX-License-Identifier: MPL-2.0
 */
class HdsPaginationControlNumber extends Component {
  get page() {
    const {
      page
    } = this.args;
    assert('@page for "Pagination::Nav::Number" must have a valid value', page !== undefined);
    return page;
  }
  get classNames() {
    const classes = ['hds-pagination-nav__control', 'hds-pagination-nav__number'];
    if (this.args.isSelected) {
      classes.push(`hds-pagination-nav__number--is-selected`);
    }
    return classes.join(' ');
  }
  onClick = () => {
    const {
      onClick
    } = this.args;
    if (typeof onClick === 'function') {
      onClick(this.args.page);
    }
  };
  static {
    setComponentTemplate(precompileTemplate("<HdsInteractive class={{this.classNames}} @route={{@route}} @query={{@query}} @model={{@model}} @models={{@models}} @replace={{@replace}} {{on \"click\" this.onClick}} ...attributes aria-current={{if @isSelected \"page\" null}}>\n  <HdsTextBody @tag=\"span\" @size=\"100\" @weight=\"medium\">\n    <span class=\"sr-only\">{{hdsT \"hds.components.pagination.nav.number.screen-reader-label\" default=\"page\"}}</span>\n    {{this.page}}\n  </HdsTextBody>\n</HdsInteractive>", {
      strictMode: true,
      scope: () => ({
        HdsInteractive,
        on,
        HdsTextBody,
        hdsT: HdsTHelper
      })
    }), this);
  }
}

export { HdsPaginationControlNumber as default };
//# sourceMappingURL=number.js.map