microsoft / microsoft/polyfills
Export a TypeScript type for the focusgroup attribute
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 8
- Forks
- 4
- Avg merge
- 2d 1h
- Merged PRs (30d)
- 2
Description
Proposal
Please export a TypeScript type for the focusgroup attribute so consumers can opt into type safety in their own global or framework-specific typings without the polyfill needing to provide React, JSX, or other framework integrations.
For example:
import type { FocusgroupAttribute } from "@microsoft/focusgroup-polyfill";
Consumers could then use the type in their own declarations, such as React’s HTMLAttributes augmentation:
declare module "react" {
interface HTMLAttributes<T> {
focusgroup?: FocusgroupAttribute;
}
}
Suggested implementation
export type FocusgroupBehavior =
| "toolbar"
| "menubar"
| "tablist"
| "radiogroup"
| "listbox"
| "menu"
| "grid"
| "feed";
type Axis = "inline" | "block";
type Wrap = "wrap" | "nowrap";
type Memory = "nomemory";
export type FocusgroupAttribute =
| FocusgroupBehavior
| `${FocusgroupBehavior} ${Axis}`
| `${FocusgroupBehavior} ${Wrap}`
| `${FocusgroupBehavior} ${Memory}`
| `${FocusgroupBehavior} ${Axis} ${Wrap}`
| `${FocusgroupBehavior} ${Axis} ${Memory}`
| `${FocusgroupBehavior} ${Wrap} ${Memory}`
| `${FocusgroupBehavior} ${Axis} ${Wrap} ${Memory}`;
Suggested scope
- Export a
FocusgroupAttributetype from the package’s main entry point. - Include the supported behavior tokens and modifiers, including the Focusgroup V2 tokens where applicable.
- Keep framework-specific integrations out of scope; consumers can apply the type to React, Vue, custom JSX typings, or other environments themselves.
- Document whether the type uses a canonical token order or supports all valid token orderings.
This would provide a lightweight, framework-agnostic typing surface for applications using the polyfill.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start at the package’s main entry point and inspect how public exports and TypeScript declarations are organized. Add the framework-agnostic FocusgroupAttribute type with the supported behavior tokens and modifiers, export it from the main entry point, and document the token-ordering choice; no specific test file is mentioned.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- frontend, web-dev
- Issue type
- Feature
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 72/100