From bc783b59f68dee7581d1ab0636710993562b3987 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Elodie=20Labb=C3=A9?= <elodie.labbe@upfluence.com>
Date: Wed, 7 Oct 2026 16:16:41 +0200
Subject: [PATCH 1/3] add tests for common cell renderers

---
 .../hyper-table/cell-renderers/link-test.ts   | 44 +++++++++++++++++++
 .../cell-renderers/numeric-test.ts            | 43 ++++++++++++++++++
 .../hyper-table/cell-renderers/text-test.ts   | 43 ++++++++++++++++++
 3 files changed, 130 insertions(+)
 create mode 100644 tests/integration/components/hyper-table/cell-renderers/link-test.ts
 create mode 100644 tests/integration/components/hyper-table/cell-renderers/numeric-test.ts
 create mode 100644 tests/integration/components/hyper-table/cell-renderers/text-test.ts

diff --git a/tests/integration/components/hyper-table/cell-renderers/link-test.ts b/tests/integration/components/hyper-table/cell-renderers/link-test.ts
new file mode 100644
index 00000000..a201404a
--- /dev/null
+++ b/tests/integration/components/hyper-table/cell-renderers/link-test.ts
@@ -0,0 +1,44 @@
+import { A } from '@ember/array';
+import EmberObject from '@ember/object';
+import { render, type TestContext } from '@ember/test-helpers';
+
+import { hbs } from 'ember-cli-htmlbars';
+import { setupRenderingTest } from 'ember-qunit';
+import { module, test } from 'qunit';
+
+module('Integration | Component | hyper-table/cell-renderers/link', function (hooks) {
+  setupRenderingTest(hooks);
+
+  test('it renders a link value', async function (this: TestContext, assert) {
+    this.item = EmberObject.create({ website: 'https://example.com' });
+    this.column = EmberObject.create({ key: 'website', field: EmberObject.create({}) });
+    this.manager = EmberObject.create({ editStatus: A([]) });
+
+    await render(
+      hbs`<HyperTable::CellRenderers::Link
+        @item={{this.item}}
+        @column={{this.column}}
+        @manager={{this.manager}}
+      />`
+    );
+
+    assert.dom('a.link__value').hasAttribute('href', 'https://example.com');
+    assert.dom('a.link__value').hasText('https://example.com');
+  });
+
+  test('it renders a default when the value is empty', async function (this: TestContext, assert) {
+    this.item = EmberObject.create({ website: null });
+    this.column = EmberObject.create({ key: 'website', field: EmberObject.create({}) });
+    this.manager = EmberObject.create({ editStatus: A([]) });
+
+    await render(
+      hbs`<HyperTable::CellRenderers::Link
+        @item={{this.item}}
+        @column={{this.column}}
+        @manager={{this.manager}}
+      />`
+    );
+
+    assert.dom().hasText('—');
+  });
+});
diff --git a/tests/integration/components/hyper-table/cell-renderers/numeric-test.ts b/tests/integration/components/hyper-table/cell-renderers/numeric-test.ts
new file mode 100644
index 00000000..0fbd9ef4
--- /dev/null
+++ b/tests/integration/components/hyper-table/cell-renderers/numeric-test.ts
@@ -0,0 +1,43 @@
+import { A } from '@ember/array';
+import EmberObject from '@ember/object';
+import { render, type TestContext } from '@ember/test-helpers';
+
+import { hbs } from 'ember-cli-htmlbars';
+import { setupRenderingTest } from 'ember-qunit';
+import { module, test } from 'qunit';
+
+module('Integration | Component | hyper-table/cell-renderers/numeric', function (hooks) {
+  setupRenderingTest(hooks);
+
+  test('it renders a value', async function (this: TestContext, assert) {
+    this.item = EmberObject.create({ total: 123 });
+    this.column = EmberObject.create({ key: 'total', field: EmberObject.create({}), upsertable: false });
+    this.manager = EmberObject.create({ editStatus: A([]) });
+
+    await render(
+      hbs`<HyperTable::CellRenderers::Numeric
+        @item={{this.item}}
+        @column={{this.column}}
+        @manager={{this.manager}}
+      />`
+    );
+
+    assert.dom('.text-value').hasText('123');
+  });
+
+  test('it renders a default when the value is empty', async function (this: TestContext, assert) {
+    this.item = EmberObject.create({ total: null });
+    this.column = EmberObject.create({ key: 'total', field: EmberObject.create({}), upsertable: false });
+    this.manager = EmberObject.create({ editStatus: A([]) });
+
+    await render(
+      hbs`<HyperTable::CellRenderers::Numeric
+        @item={{this.item}}
+        @column={{this.column}}
+        @manager={{this.manager}}
+      />`
+    );
+
+    assert.dom().hasText('—');
+  });
+});
diff --git a/tests/integration/components/hyper-table/cell-renderers/text-test.ts b/tests/integration/components/hyper-table/cell-renderers/text-test.ts
new file mode 100644
index 00000000..6bb902b1
--- /dev/null
+++ b/tests/integration/components/hyper-table/cell-renderers/text-test.ts
@@ -0,0 +1,43 @@
+import { A } from '@ember/array';
+import EmberObject from '@ember/object';
+import { render, type TestContext } from '@ember/test-helpers';
+
+import { hbs } from 'ember-cli-htmlbars';
+import { setupRenderingTest } from 'ember-qunit';
+import { module, test } from 'qunit';
+
+module('Integration | Component | hyper-table/cell-renderers/text', function (hooks) {
+  setupRenderingTest(hooks);
+
+  test('it renders a value', async function (this: TestContext, assert) {
+    this.item = EmberObject.create({ name: 'FooBar' });
+    this.column = EmberObject.create({ key: 'name', field: EmberObject.create({}), upsertable: false });
+    this.manager = EmberObject.create({ editStatus: A([]) });
+
+    await render(
+      hbs`<HyperTable::CellRenderers::Text
+        @item={{this.item}}
+        @column={{this.column}}
+        @manager={{this.manager}}
+      />`
+    );
+
+    assert.dom('.text-value').hasText('FooBar');
+  });
+
+  test('it renders a default when the value is empty', async function (this: TestContext, assert) {
+    this.item = EmberObject.create({ name: null });
+    this.column = EmberObject.create({ key: 'name', field: EmberObject.create({}), upsertable: false });
+    this.manager = EmberObject.create({ editStatus: A([]) });
+
+    await render(
+      hbs`<HyperTable::CellRenderers::Text
+        @item={{this.item}}
+        @column={{this.column}}
+        @manager={{this.manager}}
+      />`
+    );
+
+    assert.dom().hasText('—');
+  });
+});

From d026044b0ebf9408dabf891d22f3231d5bdd4936 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Elodie=20Labb=C3=A9?= <elodie.labbe@upfluence.com>
Date: Wed, 7 Oct 2026 16:21:22 +0200
Subject: [PATCH 2/3] =?UTF-8?q?fix=20curly=20{{input}}=C2=A0and=20implicit?=
 =?UTF-8?q?=20this?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/hyper-table/cell-renderers/link.hbs  |  2 +-
 .../hyper-table/cell-renderers/numeric.hbs          | 13 +++++++------
 .../components/hyper-table/cell-renderers/text.hbs  | 13 +++++++------
 3 files changed, 15 insertions(+), 13 deletions(-)

diff --git a/addon/components/hyper-table/cell-renderers/link.hbs b/addon/components/hyper-table/cell-renderers/link.hbs
index 5c7945a8..bf2f88c4 100644
--- a/addon/components/hyper-table/cell-renderers/link.hbs
+++ b/addon/components/hyper-table/cell-renderers/link.hbs
@@ -8,7 +8,7 @@
     class="upf-link--reset link__value"
     onclick="event.stopPropagation();"
   >
-    {{value}}
+    {{this.value}}
   </a>
 
   <OSS::Button
diff --git a/addon/components/hyper-table/cell-renderers/numeric.hbs b/addon/components/hyper-table/cell-renderers/numeric.hbs
index 29f825df..d49d3eaf 100644
--- a/addon/components/hyper-table/cell-renderers/numeric.hbs
+++ b/addon/components/hyper-table/cell-renderers/numeric.hbs
@@ -10,13 +10,14 @@
   <div class="editing-input">
     {{#if (and this.editStatus.status (not this.isSuccess))}}
       <div class={{if this.isError "is-invalid"}}>
-        {{input
-          type="number"
-          focus-out=(action "toggleEditing" this.editableValue)
-          insert-newline=(action "toggleEditing" this.editableValue)
-          value=this.value
+        <Input
+          @type="number"
+          @insert-newline={{action "toggleEditing" this.editableValue}}
+          @value={{this.value}}
+          aria-label={{or this.column.field.name "Value"}}
           class="editing-input__field form-control"
-        }}
+          {{on "focusout" (action "toggleEditing" this.editableValue)}}
+        />
       </div>
     {{else}}
       <div class="text-value" {{enable-tooltip title=(format-numeric this.value) placement="bottom"}}>
diff --git a/addon/components/hyper-table/cell-renderers/text.hbs b/addon/components/hyper-table/cell-renderers/text.hbs
index 35f77a8c..fb5cbe9b 100644
--- a/addon/components/hyper-table/cell-renderers/text.hbs
+++ b/addon/components/hyper-table/cell-renderers/text.hbs
@@ -11,13 +11,14 @@
 {{#if this.isUpsertable}}
   <div class="editing-input">
     <div class={{if this.isError "is-invalid"}}>
-      {{input
-        type="text"
-        value=this.editableValue
+      <Input
+        @type="text"
+        @value={{this.editableValue}}
+        aria-label={{or this.column.field.name "Value"}}
         class="editing-input__field form-control upf-input"
-        focus-out=(action "toggleEditing" this.editableValue)
-        insert-newline=(action "toggleEditing" this.editableValue)
-      }}
+        @insert-newline={{action "toggleEditing" this.editableValue}}
+        {{on "focusout" (action "toggleEditing" this.editableValue)}}
+      />
     </div>
     <div class="text-value" {{enable-tooltip title=this.editableValue placement="bottom"}}>
       {{this.editableValue}}

From 623c7b188b5db065de2ed28ad982642c71b70573 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Elodie=20Labb=C3=A9?= <elodie.labbe@upfluence.com>
Date: Wed, 7 Oct 2026 17:34:43 +0200
Subject: [PATCH 3/3] reorder Input args

---
 addon/components/hyper-table/cell-renderers/text.hbs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/addon/components/hyper-table/cell-renderers/text.hbs b/addon/components/hyper-table/cell-renderers/text.hbs
index fb5cbe9b..cfbebfbe 100644
--- a/addon/components/hyper-table/cell-renderers/text.hbs
+++ b/addon/components/hyper-table/cell-renderers/text.hbs
@@ -14,9 +14,9 @@
       <Input
         @type="text"
         @value={{this.editableValue}}
+        @insert-newline={{action "toggleEditing" this.editableValue}}
         aria-label={{or this.column.field.name "Value"}}
         class="editing-input__field form-control upf-input"
-        @insert-newline={{action "toggleEditing" this.editableValue}}
         {{on "focusout" (action "toggleEditing" this.editableValue)}}
       />
     </div>