flos
v0.0.4
Published
- [Structure](#structure) - [Preload global CSS](#preload-global-css) - [Publishing Type Package](#publishing-type-package) - [Contributing to the library](#contributing-to-the-library) - [Bootstrap a component](#bootstrap-a-component) - [
Downloads
14
Readme
Structure
- We keep stories inside the component folders
- File and foldernames all lowercase with dashes
Preload global CSS
<link rel="preload" href="https://flos.webplatform-dev-01.topdanmark.cloud/_next/static/css/f2afbcc0d6116825.css" as="style" />`} />
Make sure to update the chunk-id for the correct version of flos.
Latest version can be found in source code of https://flos.webplatform-dev-01.topdanmark.cloud
Publishing Type Package
- To build the project, execute the command
npm run build
. The@types
package includes all the required type definitions. - To update the versioning of your project, you can modify the
package.json
file. Once you have made the necessary changes, you can proceed to publish your project to the npm registry by running thenpm publish
command.
Contributing to the library
Bootstrap a component
Run npm run prepare:component
and finish the setup, and use those boilerplate as starting ground for the component.
Icons
We are using Font Awesome icons
You must update Type icon-shapes and include the file name of the SVG each time you add an additional SVG to Icon folder as an icon to be used. The file name will correspond to the options provided in the shape
prop of the <Icon />
component.
If, for instance, you inserted an SVG with the filename "cart.svg"
. you must include the "cart"
string as an option in Type icon-shapes.
Tips: To automate this process, you can execute the command
npm run prepare:icons
whenever you have added a new icon.
Testing with Icons
Since the Icon component dynamically loads SVG, you must specify 'act()' to flush out the async import; see example.