Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[numeric-refactor-feedback-cleanup] Numeric Input Refector Feedback #2268

Merged
merged 5 commits into from
Feb 26, 2025

Conversation

SonicScrewdriver
Copy link
Contributor

@SonicScrewdriver SonicScrewdriver commented Feb 25, 2025

Summary:

This is a little PR that addresses some additional feedback points from the Numeric Input Refactor.

This includes:

  • Using useId() for generating ids in InputWithExamples
  • Removing underscores from InputWithExamples after it was converted to a functional component as part of the Numeric Input Refactor work.
  • Removing unnecessary constructors
  • Rename of getTooltipContent to renderTooltipContent
  • Moving RenderProps to top of file for numeric-input.class.tsx
  • Removing unnecessary data from test data
  • Updating test name in utils.test.ts
  • Simplifying types from NumericExampleStrings after they were moved into the util file.
  • Commenting the reason for the ariaLabel setting to undefined.
  • New tests in answer-types

Test plan:

  • Tests Pass
  • Manual testing in Storybook (Link to ZND here)

Copy link
Contributor

github-actions bot commented Feb 25, 2025

Size Change: -78 B (-0.01%)

Total Size: 872 kB

Filename Size Change
packages/perseus/dist/es/index.js 367 kB -78 B (-0.02%)
ℹ️ View Unchanged
Filename Size
packages/kas/dist/es/index.js 39.5 kB
packages/keypad-context/dist/es/index.js 760 B
packages/kmath/dist/es/index.js 11.1 kB
packages/math-input/dist/es/index.js 78.2 kB
packages/math-input/dist/es/strings.js 1.79 kB
packages/perseus-core/dist/es/index.js 29.8 kB
packages/perseus-editor/dist/es/index.js 276 kB
packages/perseus-linter/dist/es/index.js 22.8 kB
packages/perseus-score/dist/es/index.js 20.6 kB
packages/perseus/dist/es/strings.js 6.74 kB
packages/pure-markdown/dist/es/index.js 4.14 kB
packages/simple-markdown/dist/es/index.js 13.1 kB

compressed-size-action

Copy link
Contributor

github-actions bot commented Feb 25, 2025

npm Snapshot: Published

Good news!! We've packaged up the latest commit from this PR (f35dd10) and published it to npm. You
can install it using the tag PR2268.

Example:

pnpm add @khanacademy/perseus@PR2268

If you are working in Khan Academy's webapp, you can run:

./dev/tools/bump_perseus_version.sh -t PR2268


const getUniqueId = () => {
return `input-with-examples-${id}`;
};
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Does this need to be a function, now that it's simpler? Could we just have the following up around line 63:

const id = useId();
const ariaId = `aria-for-${id}`;

@@ -113,7 +113,7 @@ class TextInput extends React.Component<Props> {
id={this.id}
value={formattedValue}
type="text"
aria-label={labelText || undefined}
aria-label={labelText}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think the undefined was there so that there is no aria-label attribute when labelText is blank. Otherwise, we end up with aria-label="".

…we don't want the empty string to get set. Also some test data cleanup
@SonicScrewdriver SonicScrewdriver merged commit 9d01457 into main Feb 26, 2025
8 checks passed
@SonicScrewdriver SonicScrewdriver deleted the numeric-refactor-feedback-cleanup branch February 26, 2025 01:21
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants