@primer/primitives 7.17.0-rc.61b28bca → 7.17.0-rc.8ff6ed39

package/src/transformers/colorToRgbaFloat.test.ts

@@ -1,168 +0,0 @@
-import {getMockToken} from '../test-utilities'
-import {colorToRgbaFloat} from './colorToRgbaFloat'
-import {rgbaFloatToHex} from './utilities/rgbaFloatToHex'
-
-describe('Transformer: colorToRgbaFloat', () => {
-  it('transforms `hex3`, `hex6`, and `hex8` tokens to rgb float value', () => {
-    const input = [getMockToken({value: '#123'}), getMockToken({value: '#343434'}), getMockToken({value: '#34343466'})]
-    const expectedOutput = [
-      {
-        r: 0.06666666666666667,
-        g: 0.13333333333333333,
-        b: 0.2,
-        a: 1,
-      },
-      {
-        r: 0.20392156862745098,
-        g: 0.20392156862745098,
-        b: 0.20392156862745098,
-        a: 1,
-      },
-      {
-        r: 0.20392156862745098,
-        g: 0.20392156862745098,
-        b: 0.20392156862745098,
-        a: 0.4,
-      },
-    ]
-    expect(input.map(item => colorToRgbaFloat.transformer(item, {}))).toStrictEqual(expectedOutput)
-  })
-
-  it('transforms `rgb` and `rgba` to rgb float value', () => {
-    const input = [getMockToken({value: 'rgb(100,200,255)'}), getMockToken({value: 'rgba(100,200,255, .4)'})]
-    const expectedOutput = [
-      {
-        r: 0.39215686274509803,
-        g: 0.7843137254901961,
-        b: 1,
-        a: 1,
-      },
-      {
-        r: 0.39215686274509803,
-        g: 0.7843137254901961,
-        b: 1,
-        a: 0.4,
-      },
-    ]
-    expect(input.map(item => colorToRgbaFloat.transformer(item, {}))).toStrictEqual(expectedOutput)
-  })
-
-  it('transforms `color` tokens including alpha value', () => {
-    expect(
-      [
-        getMockToken({value: '#343434', alpha: 0.4}),
-        getMockToken({value: '#34343466', alpha: 0.9}),
-        getMockToken({value: 'rgb(100,200,255)', alpha: 0.4}),
-        getMockToken({value: 'rgba(100,200,255,0.8)', alpha: 0.4}),
-      ].map(item => colorToRgbaFloat.transformer(item, {})),
-    ).toStrictEqual([
-      {
-        r: 0.20392156862745098,
-        g: 0.20392156862745098,
-        b: 0.20392156862745098,
-        a: 0.4,
-      },
-      {
-        r: 0.20392156862745098,
-        g: 0.20392156862745098,
-        b: 0.20392156862745098,
-        a: 0.9,
-      },
-      {
-        r: 0.39215686274509803,
-        g: 0.7843137254901961,
-        b: 1,
-        a: 0.4,
-      },
-      {
-        r: 0.39215686274509803,
-        g: 0.7843137254901961,
-        b: 1,
-        a: 0.4,
-      },
-    ])
-  })
-
-  it('transforms `color` tokens including mix', () => {
-    expect(
-      [
-        getMockToken({name: 'Mix of reds', value: '#a40e26', mix: {color: '#660018', weight: 0.4}}),
-        getMockToken({value: '#34343466', mix: {color: '#000000'}}),
-        getMockToken({value: 'rgb(100,200,255)', mix: {weight: 0.5}}),
-        getMockToken({value: 'rgba(100,200,255,0.8)', mix: {color: undefined, weight: undefined}}),
-      ].map(item => colorToRgbaFloat.transformer(item, {})),
-    ).toStrictEqual([
-      {
-        b: 0.12549019607843137,
-        g: 0.03137254901960784,
-        r: 0.5450980392156862,
-        a: 1,
-      },
-      {
-        r: 0.20392156862745098,
-        g: 0.20392156862745098,
-        b: 0.20392156862745098,
-        a: 0.4,
-      },
-      {
-        r: 0.39215686274509803,
-        g: 0.7843137254901961,
-        b: 1,
-        a: 1,
-      },
-      {
-        r: 0.39215686274509803,
-        g: 0.7843137254901961,
-        b: 1,
-        a: 0.8,
-      },
-    ])
-
-    expect(
-      [
-        getMockToken({name: 'Mix of reds', value: '#a40e26', mix: {color: '#660018', weight: 0.4}}),
-        getMockToken({value: '#34343466', mix: {color: '#000000'}}),
-        getMockToken({value: 'rgb(100,200,255)', mix: {weight: 0.5}}),
-        getMockToken({value: 'rgba(100,200,255,0.8)', mix: {color: undefined, weight: undefined}}),
-      ]
-        .map(item => colorToRgbaFloat.transformer(item, {}))
-        .map(item => rgbaFloatToHex(item)),
-    ).toStrictEqual(['#8b0820', '#34343466', '#64c8ff', '#64c8ffcc'])
-  })
-
-  it('it forwards `rgb float` values', () => {
-    const input = [
-      getMockToken({
-        value: {
-          r: 0.39215686274509803,
-          g: 0.7843137254901961,
-          b: 1,
-          a: 1,
-        },
-      }),
-      getMockToken({
-        value: {
-          r: 0.39215686274509803,
-          g: 0.7843137254901961,
-          b: 1,
-          a: 0.4,
-        },
-      }),
-    ]
-    const expectedOutput = [
-      {
-        r: 0.39215686274509803,
-        g: 0.7843137254901961,
-        b: 1,
-        a: 1,
-      },
-      {
-        r: 0.39215686274509803,
-        g: 0.7843137254901961,
-        b: 1,
-        a: 0.4,
-      },
-    ]
-    expect(input.map(item => colorToRgbaFloat.transformer(item, {}))).toStrictEqual(expectedOutput)
-  })
-})

package/src/transformers/dimensionToPixelUnitless.test.ts

@@ -1,93 +0,0 @@
-import {getMockToken} from '../test-utilities'
-import {dimensionToPixelUnitless} from './dimensionToPixelUnitless'
-
-describe('Transformer: dimensionToPixelUnitless', () => {
-  it('transforms pixel string tokens', () => {
-    const input = [
-      getMockToken({
-        value: '16px',
-      }),
-    ]
-    const expectedOutput = [16]
-    expect(input.map(item => dimensionToPixelUnitless.transformer(item, {}))).toStrictEqual(expectedOutput)
-  })
-
-  it('does not transforms number or number string', () => {
-    const input = [
-      getMockToken({
-        value: '16',
-      }),
-      getMockToken({
-        value: 16,
-      }),
-    ]
-    const expectedOutput = ['16', 16]
-    expect(input.map(item => dimensionToPixelUnitless.transformer(item, {}))).toStrictEqual(expectedOutput)
-  })
-
-  it('transforms rem', () => {
-    const input = [
-      getMockToken({
-        value: '1rem',
-      }),
-    ]
-    const expectedOutput = [16]
-    expect(input.map(item => dimensionToPixelUnitless.transformer(item, {}))).toStrictEqual(expectedOutput)
-  })
-
-  it('transforms rem with custom basePxFontSize', () => {
-    const input = [
-      getMockToken({
-        value: '2rem',
-      }),
-    ]
-    const expectedOutput = [20]
-    expect(input.map(item => dimensionToPixelUnitless.transformer(item, {basePxFontSize: 10}))).toStrictEqual(
-      expectedOutput,
-    )
-  })
-
-  it('does not transforms em', () => {
-    const input = [
-      getMockToken({
-        value: '1em',
-      }),
-    ]
-    const expectedOutput = ['1em']
-    expect(input.map(item => dimensionToPixelUnitless.transformer(item, {}))).toStrictEqual(expectedOutput)
-  })
-
-  it('transforms 0 to 0', () => {
-    const input = [
-      getMockToken({
-        value: '0rem',
-      }),
-      getMockToken({
-        value: '0px',
-      }),
-      getMockToken({
-        value: '0',
-      }),
-    ]
-    const expectedOutput = [0, 0, 0]
-    expect(input.map(item => dimensionToPixelUnitless.transformer(item, {}))).toStrictEqual(expectedOutput)
-  })
-
-  it('throws on invalid tokens', () => {
-    const input = [
-      getMockToken({
-        value: 'rem',
-      }),
-      getMockToken({
-        value: '',
-      }),
-      getMockToken({
-        value: undefined,
-      }),
-      getMockToken({
-        value: null,
-      }),
-    ]
-    expect(() => input.map(item => dimensionToPixelUnitless.transformer(item, {}))).toThrow()
-  })
-})

package/src/transformers/dimensionToRem.test.ts

@@ -1,81 +0,0 @@
-import {getMockToken} from '../test-utilities'
-import {dimensionToRem} from './dimensionToRem'
-
-describe('Transformer: dimensionToRem', () => {
-  it('transforms pixel string tokens to rem', () => {
-    const input = [
-      getMockToken({
-        value: '16px',
-      }),
-    ]
-    const expectedOutput = ['1rem']
-    expect(input.map(item => dimensionToRem.transformer(item, {}))).toStrictEqual(expectedOutput)
-  })
-
-  it('transforms number to rem', () => {
-    const input = [
-      getMockToken({
-        value: '16',
-      }),
-      getMockToken({
-        value: 16,
-      }),
-    ]
-    const expectedOutput = ['1rem', '1rem']
-    expect(input.map(item => dimensionToRem.transformer(item, {}))).toStrictEqual(expectedOutput)
-  })
-
-  it('transforms rem to rem', () => {
-    const input = [
-      getMockToken({
-        value: '1rem',
-      }),
-    ]
-    const expectedOutput = ['1rem']
-    expect(input.map(item => dimensionToRem.transformer(item, {}))).toStrictEqual(expectedOutput)
-  })
-
-  it('does not transforms em to rem', () => {
-    const input = [
-      getMockToken({
-        value: '1em',
-      }),
-    ]
-    const expectedOutput = ['1em']
-    expect(input.map(item => dimensionToRem.transformer(item, {}))).toStrictEqual(expectedOutput)
-  })
-
-  it('transforms 0 to 0', () => {
-    const input = [
-      getMockToken({
-        value: '0rem',
-      }),
-      getMockToken({
-        value: '0px',
-      }),
-      getMockToken({
-        value: '0',
-      }),
-    ]
-    const expectedOutput = ['0', '0', '0']
-    expect(input.map(item => dimensionToRem.transformer(item, {}))).toStrictEqual(expectedOutput)
-  })
-
-  it('throws on invalid tokens', () => {
-    const input = [
-      getMockToken({
-        value: 'rem',
-      }),
-      getMockToken({
-        value: '',
-      }),
-      getMockToken({
-        value: undefined,
-      }),
-      getMockToken({
-        value: null,
-      }),
-    ]
-    expect(() => input.map(item => dimensionToRem.transformer(item, {}))).toThrow()
-  })
-})

package/src/transformers/durationToCss.test.ts

@@ -1,56 +0,0 @@
-import {getMockToken} from '../test-utilities'
-import {durationToCss} from './durationToCss'
-
-describe('Transformer: durationToCss', () => {
-  it('transforms `duration` token to css duration', () => {
-    const input = getMockToken({
-      value: '100ms',
-    })
-
-    const expectedOutput = '100ms'
-    expect(durationToCss.transformer(input, {})).toStrictEqual(expectedOutput)
-  })
-
-  it('transforms `ms` to `s`', () => {
-    const input = getMockToken({
-      value: '1252ms',
-    })
-
-    const expectedOutput = '1.252s'
-    expect(durationToCss.transformer(input, {})).toStrictEqual(expectedOutput)
-  })
-
-  it('throws an error when unit is missing or invalid', () => {
-    // missing unit
-    expect(() =>
-      durationToCss.transformer(
-        getMockToken({
-          value: '1000',
-        }),
-        {},
-      ),
-    ).toThrowError()
-
-    // only ms unit is supported
-    expect(() =>
-      durationToCss.transformer(
-        getMockToken({
-          value: '1s',
-        }),
-        {},
-      ),
-    ).toThrowError()
-  })
-
-  it('throws an error when value is number', () => {
-    // missing unit
-    expect(() =>
-      durationToCss.transformer(
-        getMockToken({
-          value: 1000,
-        }),
-        {},
-      ),
-    ).toThrowError()
-  })
-})

package/src/transformers/fontFamilyToCss.test.ts

@@ -1,71 +0,0 @@
-import {getMockToken} from '../test-utilities'
-import {fontFamilyToCss} from './fontFamilyToCss'
-
-describe('Transformer: fontFamilyToCss', () => {
-  it('transforms fontFamily string', () => {
-    const input = [
-      getMockToken({
-        value: 'Roboto, Noto Sans',
-      }),
-      getMockToken({
-        value: 'Roboto',
-      }),
-    ]
-    const expectedOutput = ['Roboto, Noto Sans', 'Roboto']
-    expect(input.map(item => fontFamilyToCss.transformer(item, {}))).toStrictEqual(expectedOutput)
-  })
-
-  it('transforms fontFamily array', () => {
-    const input = [
-      getMockToken({
-        value: ['Roboto', 'Noto Sans'],
-      }),
-      getMockToken({
-        value: ['Roboto'],
-      }),
-    ]
-    const expectedOutput = ["Roboto, 'Noto Sans'", 'Roboto']
-    expect(input.map(item => fontFamilyToCss.transformer(item, {}))).toStrictEqual(expectedOutput)
-  })
-
-  it('throws on invalid value', () => {
-    expect(() =>
-      fontFamilyToCss.transformer(
-        getMockToken({
-          value: {
-            fontFamily: 'Roboto',
-            fontSize: '42px',
-          },
-        }),
-        {},
-      ),
-    ).toThrowError()
-
-    expect(() =>
-      fontFamilyToCss.transformer(
-        getMockToken({
-          value: 42,
-        }),
-        {},
-      ),
-    ).toThrowError()
-
-    expect(() =>
-      fontFamilyToCss.transformer(
-        getMockToken({
-          value: undefined,
-        }),
-        {},
-      ),
-    ).toThrowError()
-
-    expect(() =>
-      fontFamilyToCss.transformer(
-        getMockToken({
-          value: [42, 'Roboto'],
-        }),
-        {},
-      ),
-    ).toThrowError()
-  })
-})

package/src/transformers/fontWeightToNumbers.test.ts

@@ -1,117 +0,0 @@
-import {getMockToken} from '../test-utilities'
-import {fontWeightToNumber} from './fontWeightToNumber'
-
-describe('Transformer: fontWeightToNumbers', () => {
-  it('keeps number if within range of 1-1000', () => {
-    const input = [
-      getMockToken({
-        value: 100,
-      }),
-      getMockToken({
-        value: 1000,
-      }),
-    ]
-    const expectedOutput = [100, 1000]
-    expect(input.map(item => fontWeightToNumber.transformer(item, {}))).toStrictEqual(expectedOutput)
-  })
-
-  it('transforms string of number to number', () => {
-    const input = getMockToken({
-      value: '100',
-    })
-    const expectedOutput = 100
-    expect(fontWeightToNumber.transformer(input, {})).toStrictEqual(expectedOutput)
-  })
-
-  it('transforms font strings to number', () => {
-    const testCases: [fontWeightNumber: number, fontWeightString: string][] = [
-      [100, 'thin'],
-      [100, 'hairline'],
-      [200, 'extra-light'],
-      [200, 'ultra-light'],
-      [300, 'light'],
-      [400, 'normal'],
-      [400, 'regular'],
-      [400, 'book'],
-      [500, 'medium'],
-      [600, 'semi-bold'],
-      [600, 'demi-bold'],
-      [700, 'bold'],
-      [800, 'extra-bold'],
-      [800, 'ultra-bold'],
-      [900, 'black'],
-      [900, 'heavy'],
-      [950, 'extra-black'],
-      [950, 'ultra-black'],
-    ]
-
-    for (const [fontWeightNumber, fontWeightString] of testCases) {
-      const input = getMockToken({
-        value: fontWeightString,
-      })
-      try {
-        expect(fontWeightToNumber.transformer(input, {})).toStrictEqual(fontWeightNumber)
-      } catch (e) {
-        throw new Error(`❌ Expects ${fontWeightString} to be transformed to ${fontWeightNumber}`)
-      }
-    }
-  })
-
-  it('throws on invalid value', () => {
-    expect(() =>
-      fontWeightToNumber.transformer(
-        getMockToken({
-          value: 1001,
-        }),
-        {},
-      ),
-    ).toThrowError()
-
-    expect(() =>
-      fontWeightToNumber.transformer(
-        getMockToken({
-          value: 0,
-        }),
-        {},
-      ),
-    ).toThrowError()
-
-    expect(() =>
-      fontWeightToNumber.transformer(
-        getMockToken({
-          value: undefined,
-        }),
-        {},
-      ),
-    ).toThrowError()
-
-    expect(() =>
-      fontWeightToNumber.transformer(
-        getMockToken({
-          value: 'Roboto',
-        }),
-        {},
-      ),
-    ).toThrowError()
-
-    expect(() =>
-      fontWeightToNumber.transformer(
-        getMockToken({
-          value: ['Roboto'],
-        }),
-        {},
-      ),
-    ).toThrowError()
-
-    expect(() =>
-      fontWeightToNumber.transformer(
-        getMockToken({
-          value: {
-            fontWeight: 300,
-          },
-        }),
-        {},
-      ),
-    ).toThrowError()
-  })
-})

package/src/transformers/jsonDeprecated.test.ts

@@ -1,31 +0,0 @@
-import {getMockToken} from '../test-utilities'
-import {jsonDeprecated} from './jsonDeprecated'
-
-describe('Transformer: jsonDeprecated', () => {
-  it('Replaces token value with `null` if deprecated is set to `true`', () => {
-    const item = getMockToken({
-      value: 'tokenName',
-      deprecated: true,
-    })
-    const expectedOutput = null
-    expect(jsonDeprecated.transformer(item, {})).toStrictEqual(expectedOutput)
-  })
-
-  it('Replaces token value with deprecated value if deprecated is a `string`', () => {
-    const item = getMockToken({
-      value: 'tokenName',
-      deprecated: `token.pumpkin`,
-    })
-    const expectedOutput = 'token.pumpkin'
-    expect(jsonDeprecated.transformer(item, {})).toStrictEqual(expectedOutput)
-  })
-
-  it('Replaces token value with deprecated value if deprecated is a `string` and removes {}', () => {
-    const item = getMockToken({
-      value: 'tokenName',
-      deprecated: `{token.pumpkin}`,
-    })
-    const expectedOutput = 'token.pumpkin'
-    expect(jsonDeprecated.transformer(item, {})).toStrictEqual(expectedOutput)
-  })
-})

package/src/transformers/namePathToCamelCase.test.ts

@@ -1,74 +0,0 @@
-import {getMockToken} from '../test-utilities'
-import {namePathToCamelCase} from './namePathToCamelCase'
-
-describe('Transformer: namePathToCamelCase', () => {
-  it('converts path elements to dot.notation and ignores name proprty', () => {
-    const input = [
-      getMockToken({
-        name: 'tokenName',
-        path: ['path', 'to', 'token'],
-      }),
-      getMockToken({
-        name: 'tokenName',
-        path: ['PATH', 'tO', 'Token'],
-      }),
-      getMockToken({
-        name: 'tokenName',
-        path: ['path', 'toToken'],
-      }),
-      getMockToken({
-        name: 'tokenName',
-        path: ['pathtoToken'],
-      }),
-    ]
-    const expectedOutput = ['pathToToken', 'PATHTOToken', 'pathToToken', 'pathtoToken']
-
-    expect(input.map(item => namePathToCamelCase.transformer(item, {}))).toStrictEqual(expectedOutput)
-  })
-
-  it('replaces spaces, `-`, `_` and `+` within path elements and joins with camelCase, but does not change the rest of the word', () => {
-    const input = [
-      getMockToken({
-        name: 'tokenName',
-        path: ['start', 'path to token'],
-      }),
-      getMockToken({
-        name: 'tokenName',
-        path: ['start', 'PATH_tO-+Token'],
-      }),
-      getMockToken({
-        name: 'tokenName',
-        path: ['start', 'path+toToken'],
-      }),
-    ]
-    const expectedOutput = ['startPathToToken', 'startPATHTOToken', 'startPathToToken']
-    expect(input.map(item => namePathToCamelCase.transformer(item, {}))).toStrictEqual(expectedOutput)
-  })
-
-  it('removes `@`, so we can use it for the default hack', () => {
-    const input = [
-      getMockToken({
-        name: 'tokenName',
-        path: ['fgColor', 'accent', '@'],
-      }),
-      getMockToken({
-        name: 'tokenName',
-        path: ['fgColor', '@', 'muted'],
-      }),
-    ]
-    const expectedOutput = ['fgColorAccent', 'fgColorMuted']
-    expect(input.map(item => namePathToCamelCase.transformer(item, {}))).toStrictEqual(expectedOutput)
-  })
-
-  it('adds prefix to token name', () => {
-    const platform = {
-      prefix: 'PRIMER',
-    }
-    const input = getMockToken({
-      name: 'tokenName',
-      path: ['start', 'pathTo', 'token'],
-    })
-    const expectedOutput = 'PRIMERStartPathToToken'
-    expect(namePathToCamelCase.transformer(input, platform)).toStrictEqual(expectedOutput)
-  })
-})