-
Notifications
You must be signed in to change notification settings - Fork 6
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Base setup for using react-uswds in the veda-ui (#1029)
**Related Ticket:** #1043 ### Description of Changes This is a base setup to start using react-uswds inside of the veda-ui ### Example usage To use the `Card` component from `react-uswds`, we can simply import it and use it as is from react-uswds, with the default styles applied. ### Notes & Questions About Changes _{Add additonal notes and outstanding questions here related to changes in this pull request}_ ### Validation / Testing _{Update with info on what can be manually validated in the Deploy Preview link for example "Validate style updates to selection modal do NOT affect cards"}_
- Loading branch information
Showing
11 changed files
with
1,822 additions
and
458 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,10 +1,11 @@ | ||
{ | ||
"extends": ["@parcel/config-default"], | ||
"bundler": "@parcel/bundler-experimental", | ||
"reporters": ["...", "@parcel/reporter-bundle-analyzer"], | ||
"resolvers": ["parcel-resolver-ignore", "parcel-resolver-veda", "@parcel/resolver-glob", "..."], | ||
"transformers": { | ||
"raw:*": ["@parcel/transformer-raw"], | ||
"*.mdx": ["parcel-transformer-mdx-frontmatter", "parcel-transformer-mdx"] | ||
"*.mdx": ["parcel-transformer-mdx-frontmatter", "parcel-transformer-mdx"], | ||
"*.css": ["@parcel/transformer-postcss"], | ||
"*.scss": ["@parcel/transformer-sass"] | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
{ | ||
"extends": ["./.parcelrc"], | ||
"resolvers": ["parcel-resolver-alias", "..."] | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,13 @@ | ||
const path = require('path'); | ||
const fs = require('fs-extra'); | ||
|
||
const CWD = process.cwd(); | ||
let uswdsPath = path.resolve(CWD, 'node_modules/@uswds/uswds/packages'); | ||
// If the build command is from one of the instances | ||
if (!fs.existsSync(uswdsPath)) uswdsPath = path.resolve(CWD,'.veda/ui', 'node_modules/@uswds/uswds/packages'); | ||
|
||
module.exports = { | ||
"includePaths": [ | ||
uswdsPath | ||
] | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
@use 'uswds-core' with ( | ||
$utilities-use-important: true, | ||
$theme-show-notifications: false | ||
); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
@forward 'uswds-theme'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,60 @@ | ||
// Resolver for resolving aliases in library building | ||
// Related issue in Parcel repo: https://github.com/parcel-bundler/parcel/issues/9519 | ||
|
||
const path = require('path'); | ||
const fs = require('fs-extra'); | ||
const { Resolver } = require('@parcel/plugin'); | ||
const { alias } = require('../package.json'); | ||
|
||
const aliases = Object.keys(alias).reduce((acc, key) => { | ||
const value = alias[key].replace('~', ''); | ||
acc[`${key}`] = `${value}`; | ||
return acc; | ||
}, {}); | ||
|
||
// Files with redundant extensions ex. $components/panel (components/panel.d.ts.ts) | ||
const fileExtensions = ['.js', '.ts', '.jsx', '.tsx']; | ||
// Index files with a trailing slash ex. $components/panel/ (components/panel/index.jsx) | ||
const indexFileExtensions = fileExtensions.map((e) => `index${e}`); | ||
// Index files without a trailing slash ex. $components/panel (components/panel/index.jsx) | ||
const pathIndexExtensions = fileExtensions.map((e) => `/index${e}`); | ||
|
||
function findMatchingFile(filePath) { | ||
const filePathParts = filePath.split('/'); | ||
const fileName = filePathParts[filePathParts.length - 1]; | ||
// Files ex. $components/panel.jsx or $components/panel.css | ||
if (fileName.includes('.')) { | ||
if (fs.existsSync(filePath)) return filePath; | ||
} | ||
|
||
for (const extension of [ | ||
...fileExtensions, | ||
...indexFileExtensions, | ||
...pathIndexExtensions | ||
]) { | ||
if (fs.existsSync(`${filePath}${extension}`)) | ||
return `${filePath}${extension}`; | ||
} | ||
|
||
return null; | ||
} | ||
|
||
module.exports = new Resolver({ | ||
async resolve({ specifier }) { | ||
let toReturn; | ||
for (let aliasKey in aliases) { | ||
if (specifier.startsWith(aliasKey)) { | ||
const replaced = specifier.replace(aliasKey, aliases[aliasKey]); | ||
const rPath = path.join(__dirname, '..', replaced); | ||
const fileP = findMatchingFile(rPath); | ||
toReturn = { | ||
filePath: fileP | ||
}; | ||
break; | ||
} | ||
} | ||
if (toReturn) return toReturn; | ||
// Let the next resolver in the pipeline handle this dependency | ||
else return null; | ||
} | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,8 @@ | ||
module.exports = { | ||
syntax: 'postcss-scss', | ||
parser: 'postcss-safe-parser', | ||
plugins: [ | ||
require('autoprefixer'), | ||
require('postcss-import'), | ||
] | ||
}; |
Oops, something went wrong.