Skip to content

Create FontWeightValue and font-weight-value/explicit model #205

@andrezero

Description

@andrezero

What

Add primitive FontWeight

Preserves string inputs "Extra Light" when set and valid

value: number;
named: () => string | undefined; // return the original value if it is a valid string input
toString: () => string;
| Weight | OT Name     | CSS Name  |
|--------|-------------|-----------|
| 100    | Thin        | -         |
| 200    | Extra Light | -         |
| 300    | Light       | -         |
| 400    | Normal      | normal    |
| 500    | Medium      | -         |
| 600    | Semi Bold   | -         |
| 700    | Bold        | bold      |
| 800    | Extra Bold  | -         |
| 900    | Black       | -         |

Expose the name mappings in 2 different constants, and a 3rd with all valid names

export const FONT_WEIGHTS_BY_NAME = {
    ...FONT_WEIGHTS_BY_CSS_NAME,
    ...FONT_WEIGHTS_BY_OT_NAME,
};

Helpers:

  • isValidFontWeightName(value: string) => boolean
  • fontWeightFromName(value: string) => number
  • fontWeightToOTName(value: number) => string | undefined

Add value FontWeightValue

export type FontWeightValueOptions = NumberValueOptions;

export type FontWeightValue = BaseValue<FontWeight> &
    AbstractNumericValue & {
        toString: ({ quantize: q }: FontWeightValueOptions = {}) => string;
    };

New decision type

export const DECISION_FONT_WEIGHT_VALUE = "font-weight-value";

export type FontWeightValueDecision = Decision<FontWeightValue>;
export type FontWeightValueExplicitInput = DecisionInput & {
    model: "font-weight-value/explicit";   
    params: {
        value: FontWeightInput;
        quantize?: number;
    };
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    Status

    Done

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions