diff --git a/.github/workflows/typos.yml b/.github/workflows/typos.yml new file mode 100644 index 00000000..34ad9c01 --- /dev/null +++ b/.github/workflows/typos.yml @@ -0,0 +1,15 @@ +name: Spell Check +on: + pull_request: + push: + branches: + - "main" +jobs: + typos: + name: Spell Check with Typos + runs-on: ubuntu-latest + steps: + - name: Checkout Actions Repository + uses: actions/checkout@v4 + - name: Check spelling + uses: crate-ci/typos@master \ No newline at end of file diff --git a/apps/docs/blog/2023-12-05-introducing-stylex.md b/apps/docs/blog/2023-12-05-introducing-stylex.md index b4a4ce84..b793e86c 100644 --- a/apps/docs/blog/2023-12-05-introducing-stylex.md +++ b/apps/docs/blog/2023-12-05-introducing-stylex.md @@ -120,7 +120,7 @@ extremely fast and the results are then memoized. ## The origins of StyleX -The previous Facebook website used something akin to CSS modules and sufferred +The previous Facebook website used something akin to CSS modules and suffered from various problems that inspired [the initial idea for CSS-in-JS](https://blog.vjeux.com/2014/javascript/react-css-in-js-nationjs.html). The average visitor to [facebook.com](https://www.facebook.com/) would download diff --git a/apps/docs/docs/api/configuration/eslint-plugin.mdx b/apps/docs/docs/api/configuration/eslint-plugin.mdx index 4fe481b5..c20fef0f 100644 --- a/apps/docs/docs/api/configuration/eslint-plugin.mdx +++ b/apps/docs/docs/api/configuration/eslint-plugin.mdx @@ -39,7 +39,7 @@ type Options = { }; type PropLimits = { - // The propery name as a string or a glob pattern + // The property name as a string or a glob pattern [propertyName: string]: { limit: // Disallow the property diff --git a/apps/docs/docs/api/types/StyleXStylesWithout.mdx b/apps/docs/docs/api/types/StyleXStylesWithout.mdx index d89aa15f..f0779c9e 100644 --- a/apps/docs/docs/api/types/StyleXStylesWithout.mdx +++ b/apps/docs/docs/api/types/StyleXStylesWithout.mdx @@ -17,7 +17,7 @@ import type {StyleXStylesWithout} from '@stylexjs/stylex'; type Props = { // ... style?: StyleXStylesWithout<{ - postion: unknown, + position: unknown, display: unknown, top: unknown, start: unknown, diff --git a/apps/docs/docs/learn/02-thinking-in-stylex.mdx b/apps/docs/docs/learn/02-thinking-in-stylex.mdx index d3e5850d..0366cf5e 100755 --- a/apps/docs/docs/learn/02-thinking-in-stylex.mdx +++ b/apps/docs/docs/learn/02-thinking-in-stylex.mdx @@ -378,7 +378,7 @@ styling rules for a project. When dealing with a large amount of CSS, lazy-loading CSS is a way to speed up the initial load time of a page. However, it comes at the cost of slower -update times, or the *Interation to Next Paint (INP)* metric. Lazy-loading +update times, or the *Interaction to Next Paint (INP)* metric. Lazy-loading any CSS on a page triggers a recalculation of styles for the entire page. StyleX is optimized for generating a single, highly optimized, CSS bundle that diff --git a/apps/docs/docs/learn/06-static-types.mdx b/apps/docs/docs/learn/06-static-types.mdx index 363c2307..db9d504e 100755 --- a/apps/docs/docs/learn/06-static-types.mdx +++ b/apps/docs/docs/learn/06-static-types.mdx @@ -199,7 +199,7 @@ import type {StyleXStylesWithout} from '@stylexjs/stylex'; import * as stylex from '@stylexjs/stylex'; type NoLayout = StyleXStylesWithout<{ - postion: unknown, + position: unknown, display: unknown, top: unknown, start: unknown, @@ -253,7 +253,7 @@ import type {StyleXStylesWithout} from '@stylexjs/stylex'; import * as stylex from '@stylexjs/stylex'; type NoLayout = StyleXStylesWithout<{ - postion: mixed, + position: mixed, display: mixed, top: mixed, start: mixed, diff --git a/apps/nextjs-example/app/globalTokens.stylex.ts b/apps/nextjs-example/app/globalTokens.stylex.ts index 64a8d0a6..9beb8a08 100644 --- a/apps/nextjs-example/app/globalTokens.stylex.ts +++ b/apps/nextjs-example/app/globalTokens.stylex.ts @@ -135,7 +135,7 @@ export const text = stylex.defineVars({ * However, when talking about spacing, it is the best practice to * use `px` because using `rems` here makes font-size behave like zoom. * - * Users that prefer larger text, don't neccessarily want larger spacing as well. + * Users that prefer larger text, don't necessarily want larger spacing as well. * */ diff --git a/packages/babel-plugin/README.md b/packages/babel-plugin/README.md index 5c730bcc..2050ef99 100644 --- a/packages/babel-plugin/README.md +++ b/packages/babel-plugin/README.md @@ -17,7 +17,7 @@ The StyleX Babel plugin does more than transform JavaScript (or Typescript) file An example of this can be seen in some of the tests, but the result of using Babel's `transform(...)` function returns an object contains at least two keys: 1. `code` which is the transformed JS code -2. `metadata` is an object of metatdata that the plugin may want to return as a side-effect. +2. `metadata` is an object of metadata that the plugin may want to return as a side-effect. e.g. diff --git a/packages/babel-plugin/__tests__/stylex-transform-call-test.js b/packages/babel-plugin/__tests__/stylex-transform-call-test.js index c6fdfe32..70ab9812 100644 --- a/packages/babel-plugin/__tests__/stylex-transform-call-test.js +++ b/packages/babel-plugin/__tests__/stylex-transform-call-test.js @@ -1252,7 +1252,7 @@ describe('@stylexjs/babel-plugin', () => { stylex.inject(".x1mkdm3x{grid-template-columns:minmax(0,1fr)}", 3000); export const styles = { sidebar: { - "UnkownFile__styles.sidebar": "UnkownFile__styles.sidebar", + "UnknownFile__styles.sidebar": "UnknownFile__styles.sidebar", boxSizing: "x9f619", gridArea: "x1yc5d2u", gridRow: null, @@ -1264,7 +1264,7 @@ describe('@stylexjs/babel-plugin', () => { $$css: true }, content: { - "UnkownFile__styles.content": "UnkownFile__styles.content", + "UnknownFile__styles.content": "UnknownFile__styles.content", gridArea: "x1fdo2jl", gridRow: null, gridRowStart: null, @@ -1275,14 +1275,14 @@ describe('@stylexjs/babel-plugin', () => { $$css: true }, root: { - "UnkownFile__styles.root": "UnkownFile__styles.root", + "UnknownFile__styles.root": "UnknownFile__styles.root", display: "xrvj5dj", gridTemplateRows: "x7k18q3", gridTemplateAreas: "x5gp9wm", $$css: true }, withSidebar: { - "UnkownFile__styles.withSidebar": "UnkownFile__styles.withSidebar", + "UnknownFile__styles.withSidebar": "UnknownFile__styles.withSidebar", gridTemplateColumns: "x1rkzygb", gridTemplateRows: "x7k18q3", gridTemplateAreas: "x17lh93j", @@ -1292,14 +1292,14 @@ describe('@stylexjs/babel-plugin', () => { $$css: true }, noSidebar: { - "UnkownFile__styles.noSidebar": "UnkownFile__styles.noSidebar", + "UnknownFile__styles.noSidebar": "UnknownFile__styles.noSidebar", gridTemplateColumns: "x1mkdm3x", $$css: true } }; ({ - 0: "UnkownFile__styles.root xrvj5dj UnkownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4", - 1: "UnkownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnkownFile__styles.noSidebar x1mkdm3x" + 0: "UnknownFile__styles.root xrvj5dj UnknownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4", + 1: "UnknownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnknownFile__styles.noSidebar x1mkdm3x" })[!!(sidebar == null) << 0];" `); }); @@ -1359,7 +1359,7 @@ describe('@stylexjs/babel-plugin', () => { stylex.inject(".x1mkdm3x{grid-template-columns:minmax(0,1fr)}", 3000); export const styles = { sidebar: { - "UnkownFile__styles.sidebar": "UnkownFile__styles.sidebar", + "UnknownFile__styles.sidebar": "UnknownFile__styles.sidebar", boxSizing: "x9f619", gridArea: "x1yc5d2u", gridRow: null, @@ -1371,7 +1371,7 @@ describe('@stylexjs/babel-plugin', () => { $$css: true }, content: { - "UnkownFile__styles.content": "UnkownFile__styles.content", + "UnknownFile__styles.content": "UnknownFile__styles.content", gridArea: "x1fdo2jl", gridRow: null, gridRowStart: null, @@ -1382,14 +1382,14 @@ describe('@stylexjs/babel-plugin', () => { $$css: true }, root: { - "UnkownFile__styles.root": "UnkownFile__styles.root", + "UnknownFile__styles.root": "UnknownFile__styles.root", display: "xrvj5dj", gridTemplateRows: "x7k18q3", gridTemplateAreas: "x5gp9wm", $$css: true }, withSidebar: { - "UnkownFile__styles.withSidebar": "UnkownFile__styles.withSidebar", + "UnknownFile__styles.withSidebar": "UnknownFile__styles.withSidebar", gridTemplateColumns: "x1rkzygb", gridTemplateRows: "x7k18q3", gridTemplateAreas: "x17lh93j", @@ -1399,7 +1399,7 @@ describe('@stylexjs/babel-plugin', () => { $$css: true }, noSidebar: { - "UnkownFile__styles.noSidebar": "UnkownFile__styles.noSidebar", + "UnknownFile__styles.noSidebar": "UnknownFile__styles.noSidebar", gridTemplateColumns: "x1mkdm3x", $$css: true } @@ -1464,14 +1464,14 @@ describe('@stylexjs/babel-plugin', () => { stylex.inject("@media (max-width: 640px){.x15nfgh4.x15nfgh4{grid-template-columns:100%}}", 3200); stylex.inject(".x1mkdm3x{grid-template-columns:minmax(0,1fr)}", 3000); const complex = { - 0: "UnkownFile__styles.root xrvj5dj UnkownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4", - 4: "UnkownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnkownFile__styles.noSidebar x1mkdm3x", - 2: "UnkownFile__styles.root xrvj5dj UnkownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4 UnkownFile__styles.sidebar x9f619 x1yc5d2u", - 6: "UnkownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnkownFile__styles.noSidebar x1mkdm3x UnkownFile__styles.sidebar x9f619 x1yc5d2u", - 1: "UnkownFile__styles.root xrvj5dj UnkownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4 UnkownFile__styles.content x1fdo2jl", - 5: "UnkownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnkownFile__styles.noSidebar x1mkdm3x UnkownFile__styles.content x1fdo2jl", - 3: "UnkownFile__styles.root xrvj5dj UnkownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4 UnkownFile__styles.sidebar x9f619 UnkownFile__styles.content x1fdo2jl", - 7: "UnkownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnkownFile__styles.noSidebar x1mkdm3x UnkownFile__styles.sidebar x9f619 UnkownFile__styles.content x1fdo2jl" + 0: "UnknownFile__styles.root xrvj5dj UnknownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4", + 4: "UnknownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnknownFile__styles.noSidebar x1mkdm3x", + 2: "UnknownFile__styles.root xrvj5dj UnknownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4 UnknownFile__styles.sidebar x9f619 x1yc5d2u", + 6: "UnknownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnknownFile__styles.noSidebar x1mkdm3x UnknownFile__styles.sidebar x9f619 x1yc5d2u", + 1: "UnknownFile__styles.root xrvj5dj UnknownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4 UnknownFile__styles.content x1fdo2jl", + 5: "UnknownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnknownFile__styles.noSidebar x1mkdm3x UnknownFile__styles.content x1fdo2jl", + 3: "UnknownFile__styles.root xrvj5dj UnknownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4 UnknownFile__styles.sidebar x9f619 UnknownFile__styles.content x1fdo2jl", + 7: "UnknownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnknownFile__styles.noSidebar x1mkdm3x UnknownFile__styles.sidebar x9f619 UnknownFile__styles.content x1fdo2jl" }[!!(sidebar == null && !isSidebar) << 2 | !!isSidebar << 1 | !!isContent << 0];" `); }); diff --git a/packages/babel-plugin/__tests__/stylex-transform-create-test.js b/packages/babel-plugin/__tests__/stylex-transform-create-test.js index f286a627..093694bd 100644 --- a/packages/babel-plugin/__tests__/stylex-transform-create-test.js +++ b/packages/babel-plugin/__tests__/stylex-transform-create-test.js @@ -82,7 +82,7 @@ describe('@stylexjs/babel-plugin', () => { `); }); - test('transforms style object with custom propety', () => { + test('transforms style object with custom property', () => { expect( transform(` import stylex from 'stylex'; @@ -98,7 +98,7 @@ describe('@stylexjs/babel-plugin', () => { `); }); - test('transforms style object with custom propety as value', () => { + test('transforms style object with custom property as value', () => { expect( transform(` import stylex from 'stylex'; @@ -288,7 +288,7 @@ describe('@stylexjs/babel-plugin', () => { }); // Legacy, short? - test('tranforms valid shorthands', () => { + test('transforms valid shorthands', () => { expect( transform(` import stylex from 'stylex'; diff --git a/packages/babel-plugin/__tests__/stylex-transform-create-vars-test.js b/packages/babel-plugin/__tests__/stylex-transform-create-vars-test.js index d5bb9cd7..d232f67b 100644 --- a/packages/babel-plugin/__tests__/stylex-transform-create-vars-test.js +++ b/packages/babel-plugin/__tests__/stylex-transform-create-vars-test.js @@ -396,7 +396,7 @@ describe('@stylexjs/babel-plugin', () => { `); }); - test('transforms variables objects with refrences to local variables', () => { + test('transforms variables objects with references to local variables', () => { expect( transform( ` @@ -434,7 +434,7 @@ describe('@stylexjs/babel-plugin', () => { `); }); - test('allows refrences to local variables with static values', () => { + test('allows references to local variables with static values', () => { expect( transform( ` diff --git a/packages/babel-plugin/__tests__/stylex-transform-override-vars-test.js b/packages/babel-plugin/__tests__/stylex-transform-override-vars-test.js index 9e6f064a..927e5ea7 100644 --- a/packages/babel-plugin/__tests__/stylex-transform-override-vars-test.js +++ b/packages/babel-plugin/__tests__/stylex-transform-override-vars-test.js @@ -84,7 +84,7 @@ describe('@stylexjs/babel-plugin', () => { }); `); }); - test('ouput of stylex.defineVars()', () => { + test('output of stylex.defineVars()', () => { expect(defineVarsOutput).toMatchInlineSnapshot(` "import stylex from 'stylex'; export const buttonTheme = { @@ -313,7 +313,7 @@ describe('@stylexjs/babel-plugin', () => { `); }); - test('transforms variables objects with refrences to local variables', () => { + test('transforms variables objects with references to local variables', () => { expect( transform( ` @@ -354,7 +354,7 @@ describe('@stylexjs/babel-plugin', () => { `); }); - test('allows refrences to local variables with static values', () => { + test('allows references to local variables with static values', () => { expect( transform( ` diff --git a/packages/babel-plugin/__tests__/stylex-transform-stylex-props-test.js b/packages/babel-plugin/__tests__/stylex-transform-stylex-props-test.js index 71cfba8c..dd1a4736 100644 --- a/packages/babel-plugin/__tests__/stylex-transform-stylex-props-test.js +++ b/packages/babel-plugin/__tests__/stylex-transform-stylex-props-test.js @@ -1223,7 +1223,7 @@ describe('@stylexjs/babel-plugin', () => { stylex.inject(".x1mkdm3x{grid-template-columns:minmax(0,1fr)}", 3000); export const styles = { sidebar: { - "UnkownFile__styles.sidebar": "UnkownFile__styles.sidebar", + "UnknownFile__styles.sidebar": "UnknownFile__styles.sidebar", boxSizing: "x9f619", gridArea: "x1yc5d2u", gridRow: null, @@ -1235,7 +1235,7 @@ describe('@stylexjs/babel-plugin', () => { $$css: true }, content: { - "UnkownFile__styles.content": "UnkownFile__styles.content", + "UnknownFile__styles.content": "UnknownFile__styles.content", gridArea: "x1fdo2jl", gridRow: null, gridRowStart: null, @@ -1246,14 +1246,14 @@ describe('@stylexjs/babel-plugin', () => { $$css: true }, root: { - "UnkownFile__styles.root": "UnkownFile__styles.root", + "UnknownFile__styles.root": "UnknownFile__styles.root", display: "xrvj5dj", gridTemplateRows: "x7k18q3", gridTemplateAreas: "x5gp9wm", $$css: true }, withSidebar: { - "UnkownFile__styles.withSidebar": "UnkownFile__styles.withSidebar", + "UnknownFile__styles.withSidebar": "UnknownFile__styles.withSidebar", gridTemplateColumns: "x1rkzygb", gridTemplateRows: "x7k18q3", gridTemplateAreas: "x17lh93j", @@ -1263,17 +1263,17 @@ describe('@stylexjs/babel-plugin', () => { $$css: true }, noSidebar: { - "UnkownFile__styles.noSidebar": "UnkownFile__styles.noSidebar", + "UnknownFile__styles.noSidebar": "UnknownFile__styles.noSidebar", gridTemplateColumns: "x1mkdm3x", $$css: true } }; ({ 0: { - className: "UnkownFile__styles.root xrvj5dj UnkownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4" + className: "UnknownFile__styles.root xrvj5dj UnknownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4" }, 1: { - className: "UnkownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnkownFile__styles.noSidebar x1mkdm3x" + className: "UnknownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnknownFile__styles.noSidebar x1mkdm3x" } })[!!(sidebar == null) << 0];" `); @@ -1336,28 +1336,28 @@ describe('@stylexjs/babel-plugin', () => { stylex.inject(".x1mkdm3x{grid-template-columns:minmax(0,1fr)}", 3000); const complex = { 0: { - className: "UnkownFile__styles.root xrvj5dj UnkownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4" + className: "UnknownFile__styles.root xrvj5dj UnknownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4" }, 4: { - className: "UnkownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnkownFile__styles.noSidebar x1mkdm3x" + className: "UnknownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnknownFile__styles.noSidebar x1mkdm3x" }, 2: { - className: "UnkownFile__styles.root xrvj5dj UnkownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4 UnkownFile__styles.sidebar x9f619 x1yc5d2u" + className: "UnknownFile__styles.root xrvj5dj UnknownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4 UnknownFile__styles.sidebar x9f619 x1yc5d2u" }, 6: { - className: "UnkownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnkownFile__styles.noSidebar x1mkdm3x UnkownFile__styles.sidebar x9f619 x1yc5d2u" + className: "UnknownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnknownFile__styles.noSidebar x1mkdm3x UnknownFile__styles.sidebar x9f619 x1yc5d2u" }, 1: { - className: "UnkownFile__styles.root xrvj5dj UnkownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4 UnkownFile__styles.content x1fdo2jl" + className: "UnknownFile__styles.root xrvj5dj UnknownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4 UnknownFile__styles.content x1fdo2jl" }, 5: { - className: "UnkownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnkownFile__styles.noSidebar x1mkdm3x UnkownFile__styles.content x1fdo2jl" + className: "UnknownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnknownFile__styles.noSidebar x1mkdm3x UnknownFile__styles.content x1fdo2jl" }, 3: { - className: "UnkownFile__styles.root xrvj5dj UnkownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4 UnkownFile__styles.sidebar x9f619 UnkownFile__styles.content x1fdo2jl" + className: "UnknownFile__styles.root xrvj5dj UnknownFile__styles.withSidebar x1rkzygb x7k18q3 x17lh93j xmr4b4k xesbpuc x15nfgh4 UnknownFile__styles.sidebar x9f619 UnknownFile__styles.content x1fdo2jl" }, 7: { - className: "UnkownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnkownFile__styles.noSidebar x1mkdm3x UnkownFile__styles.sidebar x9f619 UnkownFile__styles.content x1fdo2jl" + className: "UnknownFile__styles.root xrvj5dj x7k18q3 x5gp9wm UnknownFile__styles.noSidebar x1mkdm3x UnknownFile__styles.sidebar x9f619 UnknownFile__styles.content x1fdo2jl" } }[!!(sidebar == null && !isSidebar) << 2 | !!isSidebar << 1 | !!isContent << 0];" `); diff --git a/packages/babel-plugin/__tests__/stylex-transform-value-normalize-test.js b/packages/babel-plugin/__tests__/stylex-transform-value-normalize-test.js index 8c6a4438..0c21178f 100644 --- a/packages/babel-plugin/__tests__/stylex-transform-value-normalize-test.js +++ b/packages/babel-plugin/__tests__/stylex-transform-value-normalize-test.js @@ -108,7 +108,7 @@ describe('@stylexjs/babel-plugin', () => { `); }); - test('calc() preserves spaces aroung "+" and "-"', () => { + test('calc() preserves spaces around "+" and "-"', () => { expect( transform(` import stylex from 'stylex'; diff --git a/packages/babel-plugin/src/index.js b/packages/babel-plugin/src/index.js index 83119cc5..c6144443 100644 --- a/packages/babel-plugin/src/index.js +++ b/packages/babel-plugin/src/index.js @@ -165,7 +165,7 @@ function isExported(path: null | NodePath): boolean { * * @param rules An array of CSS rules that has been generated and collected from all JS files * in a project - * @returns A string that represets the final CSS file. + * @returns A string that represents the final CSS file. * * This function take an Array of CSS rules, de-duplicates them, sorts them priority and generates * a final CSS file. diff --git a/packages/babel-plugin/src/utils/dev-classname.js b/packages/babel-plugin/src/utils/dev-classname.js index 25ec1e17..3ffe9b0d 100644 --- a/packages/babel-plugin/src/utils/dev-classname.js +++ b/packages/babel-plugin/src/utils/dev-classname.js @@ -39,7 +39,7 @@ export function injectDevClassNames( const devClassName = namespaceToDevClassName( key, varName, - state.filename ?? 'UnkownFile', + state.filename ?? 'UnknownFile', ); result[key] = { [devClassName]: devClassName, @@ -59,7 +59,7 @@ export function convertToTestStyles( const devClassName = namespaceToDevClassName( key, varName, - state.filename ?? 'UnkownFile', + state.filename ?? 'UnknownFile', ); result[key] = { [devClassName]: devClassName, diff --git a/packages/dev-runtime/__tests__/stylex-transform-create-test.js b/packages/dev-runtime/__tests__/stylex-transform-create-test.js index c5e0992b..65063d0f 100644 --- a/packages/dev-runtime/__tests__/stylex-transform-create-test.js +++ b/packages/dev-runtime/__tests__/stylex-transform-create-test.js @@ -47,7 +47,7 @@ describe('Development Plugin Transformation', () => { `); }); - test('transforms style object with custom propety', () => { + test('transforms style object with custom property', () => { expect( stylex.create({ default: { @@ -64,7 +64,7 @@ describe('Development Plugin Transformation', () => { `); }); - test('transforms style object with custom propety as value', () => { + test('transforms style object with custom property as value', () => { expect( stylex.create({ default: { @@ -237,7 +237,7 @@ describe('Development Plugin Transformation', () => { }); // Legacy, short? - test('tranforms valid shorthands', () => { + test('transforms valid shorthands', () => { expect( stylex.create({ default: { @@ -678,7 +678,7 @@ describe('Development Plugin Transformation', () => { `); }); - test('transforms style object with custom propety', () => { + test('transforms style object with custom property', () => { const styles = stylex.create({ default: (bgColor) => ({ '--background-color': bgColor, diff --git a/packages/eslint-plugin/src/utils/getDistance.js b/packages/eslint-plugin/src/utils/getDistance.js index 7d2acd1e..789d3bd2 100644 --- a/packages/eslint-plugin/src/utils/getDistance.js +++ b/packages/eslint-plugin/src/utils/getDistance.js @@ -25,7 +25,7 @@ function getDistanceMin( : d1 + 1; } /* - * This a fork of Gustaf Andersson's levenshtein implmentation + * This a fork of Gustaf Andersson's levenshtein implementation * https://github.com/gustf/js-levenshtein * * Includes a naive bailout using max distance for stopping early diff --git a/packages/shared/README.md b/packages/shared/README.md index 379c9f49..aaca6d9a 100644 --- a/packages/shared/README.md +++ b/packages/shared/README.md @@ -29,7 +29,7 @@ The first step here is expanding all [shorthands](#shorthands) into their indivi **Step 2** -We hash each style `[key, value]` pair and generate a className and an associated CSS rule. Thie is done in the `convertToClassName(...)` function defined within [`convert-to-className.js`](#convert-to-classname-shared-package). (Explained below) +We hash each style `[key, value]` pair and generate a className and an associated CSS rule. This is done in the `convertToClassName(...)` function defined within [`convert-to-className.js`](#convert-to-classname-shared-package). (Explained below) **Step 3** diff --git a/packages/shared/__tests__/stylex-create-test.js b/packages/shared/__tests__/stylex-create-test.js index 29c6709d..ca2cbe7a 100644 --- a/packages/shared/__tests__/stylex-create-test.js +++ b/packages/shared/__tests__/stylex-create-test.js @@ -262,7 +262,7 @@ describe('stylex-create-test', () => { `); }); - test('transforms style object with custom propety as value', () => { + test('transforms style object with custom property as value', () => { expect( styleXCreate({ default: { @@ -415,7 +415,7 @@ describe('stylex-create-test', () => { `); }); - test('tranforms valid shorthands', () => { + test('transforms valid shorthands', () => { expect( styleXCreate({ default: { diff --git a/packages/shared/src/messages.js b/packages/shared/src/messages.js index cc142116..bd1e40c1 100644 --- a/packages/shared/src/messages.js +++ b/packages/shared/src/messages.js @@ -10,7 +10,7 @@ 'use strict'; // This file contains constants to be used within Error messages. -// The URLs within will eventually be replaced by links to the documenation website for Stylex. +// The URLs within will eventually be replaced by links to the documentation website for Stylex. export const ILLEGAL_ARGUMENT_LENGTH = 'stylex() should have 1 argument.'; export const NON_STATIC_VALUE = @@ -48,7 +48,7 @@ export const UNEXPECTED_ARGUMENT = export const EXPECTED_FUNCTION_CALL = 'Expected a simple function call but found something else.'; export const NO_PARENT_PATH = 'Unexpected AST node without a parent path.'; -export const ONLY_TOP_LEVEL_INLCUDES = +export const ONLY_TOP_LEVEL_INCLUDES = 'stylex.include() is only at the top level of a style definition object.'; export const DUPLICATE_CONDITIONAL = 'The same pseudo selector or at-rule cannot be used more than once.'; diff --git a/packages/shared/src/preprocess-rules/basic-validation.js b/packages/shared/src/preprocess-rules/basic-validation.js index 68675048..6695ae84 100644 --- a/packages/shared/src/preprocess-rules/basic-validation.js +++ b/packages/shared/src/preprocess-rules/basic-validation.js @@ -37,7 +37,7 @@ export function validateNamespace( if (conditions.length === 0) { continue; } - throw new Error(messages.ONLY_TOP_LEVEL_INLCUDES); + throw new Error(messages.ONLY_TOP_LEVEL_INCLUDES); } if (isPlainObject(val)) { if (key.startsWith('@') || key.startsWith(':')) { @@ -79,7 +79,7 @@ function validateConditionalStyles( continue; } if (v instanceof IncludedStyles) { - throw new Error(messages.ONLY_TOP_LEVEL_INLCUDES); + throw new Error(messages.ONLY_TOP_LEVEL_INCLUDES); } if (isPlainObject(v)) { validateConditionalStyles(v, [...conditions, key]); diff --git a/packages/shared/src/utils/normalizers/whitespace.js b/packages/shared/src/utils/normalizers/whitespace.js index a2ec221b..ab1e4752 100644 --- a/packages/shared/src/utils/normalizers/whitespace.js +++ b/packages/shared/src/utils/normalizers/whitespace.js @@ -11,7 +11,7 @@ /** * Use single spaces and remove spaces when not needed: around functions, - * commas. But preserve spece around + and - as they are required in calc() + * commas. But preserve space around + and - as they are required in calc() */ export default function normalizeWhitespace( diff --git a/packages/shared/src/utils/split-css-value.js b/packages/shared/src/utils/split-css-value.js index 844cb7d6..f7c731fe 100644 --- a/packages/shared/src/utils/split-css-value.js +++ b/packages/shared/src/utils/split-css-value.js @@ -23,7 +23,7 @@ function printNode(node: PostCSSValueASTNode): string { } } -// Using split(' ') Isn't enough bcause of values like calc. +// Using split(' ') Isn't enough because of values like calc. export default function splitValue( str: TStyleValue, ): $ReadOnlyArray { diff --git a/packages/stylex/README.md b/packages/stylex/README.md index 5dc18614..68525df0 100644 --- a/packages/stylex/README.md +++ b/packages/stylex/README.md @@ -205,7 +205,7 @@ To disallow specific style properties, use the `StyleXStylesWithout<>` type. type Props = { // ... style?: StyleXStylesWithout<{ - postion: unknown; + position: unknown; display: unknown; }>; }; @@ -253,7 +253,7 @@ the same CSS class_ rather than creating a new one. One of the benefits of this approach is that the generated CSS file grows _logarithmically_ as you add new styled components to your app. As more style declarations are added to components, they are more likely to already be in use -elsehwere in the app. As a result of this CSS optimization, the generated CSS +elsewhere in the app. As a result of this CSS optimization, the generated CSS style sheet for an app is usually small enough to be contained in a single file and used across routes, avoiding style recalculation and layout thrashing as users navigate through your app. diff --git a/typos.toml b/typos.toml new file mode 100644 index 00000000..8551b792 --- /dev/null +++ b/typos.toml @@ -0,0 +1,10 @@ +[files] +extend-exclude = [ + "*.snap", + "apps/rollup-example/lotsOfStyles.js", + "flow-typed/*", +] + +[default.extend-words] +# Ignore false-positives +stylex = "stylex"