Skip to content

Commit 7e5d437

Browse files
metonymmetonym
authored
fix(number-input)!: remove unused iconDescription prop (#2354)
The `iconDescription` prop was never properly functional, as it only acted as a fallback when `translateWithId` returned empty strings.
1 parent a261264 commit 7e5d437

File tree

6 files changed

+12
-45
lines changed

6 files changed

+12
-45
lines changed

‎COMPONENT_INDEX.md‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2516,7 +2516,6 @@ export type NumberInputTranslationId = "increment" | "decrement";
25162516
| allowDecimal | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to preserve decimal input formatting.<br />When enabled, uses type="text" with inputmode="decimal" instead of type="number"<br />@example <br />`svelte<br />&lt;NumberInput allowDecimal={true} value="1.0" /&gt;<br />&lt;NumberInput allowDecimal={true} value="2.00" /&gt;<br />` |
25172517
| disabled | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to disable the input |
25182518
| hideSteppers | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to hide the input stepper buttons |
2519-
| iconDescription | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the ARIA label for the increment icons |
25202519
| invalid | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to indicate an invalid state |
25212520
| invalidText | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the invalid state text |
25222521
| warn | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to indicate a warning state |

‎docs/src/COMPONENT_API.json‎

Lines changed: 0 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -9889,18 +9889,6 @@
98899889
"constant": false,
98909890
"reactive": false
98919891
},
9892-
{
9893-
"name": "iconDescription",
9894-
"kind": "let",
9895-
"description": "Specify the ARIA label for the increment icons",
9896-
"type": "string",
9897-
"value": "\"\"",
9898-
"isFunction": false,
9899-
"isFunctionDeclaration": false,
9900-
"isRequired": false,
9901-
"constant": false,
9902-
"reactive": false
9903-
},
99049892
{
99059893
"name": "invalid",
99069894
"kind": "let",

‎src/NumberInput/NumberInput.svelte‎

Lines changed: 4 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -60,9 +60,6 @@
6060
/** Set to `true` to hide the input stepper buttons */
6161
export let hideSteppers = false;
6262
63-
/** Specify the ARIA label for the increment icons */
64-
export let iconDescription = "";
65-
6663
/** Set to `true` to indicate an invalid state */
6764
export let invalid = false;
6865
@@ -328,8 +325,8 @@
328325
<button
329326
type="button"
330327
tabindex="-1"
331-
title={decrementLabel || iconDescription}
332-
aria-label={decrementLabel || iconDescription}
328+
title={decrementLabel}
329+
aria-label={decrementLabel}
333330
class:bx--number__control-btn={true}
334331
class:down-icon={true}
335332
on:click={() => {
@@ -343,8 +340,8 @@
343340
<button
344341
type="button"
345342
tabindex="-1"
346-
title={incrementLabel || iconDescription}
347-
aria-label={incrementLabel || iconDescription}
343+
title={incrementLabel}
344+
aria-label={incrementLabel}
348345
class:bx--number__control-btn={true}
349346
class:up-icon={true}
350347
on:click={() => {

‎tests/NumberInput/NumberInput.test.svelte‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,6 @@
1313
export let allowDecimal = false;
1414
export let disabled = false;
1515
export let hideSteppers = false;
16-
export let iconDescription = "";
1716
export let invalid = false;
1817
export let invalidText = "";
1918
export let warn = false;
@@ -41,7 +40,6 @@
4140
{allowDecimal}
4241
{disabled}
4342
{hideSteppers}
44-
{iconDescription}
4543
{invalid}
4644
{invalidText}
4745
{warn}

‎tests/NumberInput/NumberInput.test.ts‎

Lines changed: 8 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -134,18 +134,6 @@ describe("NumberInput", () => {
134134
).not.toBeInTheDocument();
135135
});
136136

137-
// TODO(bug): The icon descriptions are not being applied.
138-
it.skip("should handle custom icon descriptions", () => {
139-
render(NumberInput, {
140-
props: { iconDescription: "Custom description" },
141-
});
142-
143-
const buttons = screen.getAllByRole("button");
144-
for (const button of buttons) {
145-
expect(button).toHaveAttribute("title", "Custom description");
146-
}
147-
});
148-
149137
it("should handle custom slots", () => {
150138
render(NumberInputCustom);
151139

@@ -316,16 +304,19 @@ describe("NumberInput", () => {
316304
).toBeInTheDocument();
317305
});
318306

319-
it("should use iconDescription as fallback for button labels", () => {
307+
it("should use translateWithId to customize button labels", () => {
320308
render(NumberInput, {
321309
props: {
322-
translateWithId: () => "",
323-
iconDescription: "Adjust value",
310+
translateWithId: (id: string) => {
311+
if (id === "increment") return "Plus";
312+
if (id === "decrement") return "Minus";
313+
return id;
314+
},
324315
},
325316
});
326317

327-
const buttons = screen.getAllByRole("button", { name: "Adjust value" });
328-
expect(buttons).toHaveLength(2); // Both increment and decrement buttons
318+
expect(screen.getByRole("button", { name: "Plus" })).toBeInTheDocument();
319+
expect(screen.getByRole("button", { name: "Minus" })).toBeInTheDocument();
329320
});
330321

331322
it("should have translationIds constant", () => {

‎types/NumberInput/NumberInput.svelte.d.ts‎

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -79,12 +79,6 @@ type $Props = {
7979
*/
8080
hideSteppers?: boolean;
8181

82-
/**
83-
* Specify the ARIA label for the increment icons
84-
* @default ""
85-
*/
86-
iconDescription?: string;
87-
8882
/**
8983
* Set to `true` to indicate an invalid state
9084
* @default false

0 commit comments

Comments
 (0)