npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

fsxa-ui

v4.2.0

Published

### About the FSXA

Downloads

50

Readme

FSXA-UI

About the FSXA

The FirstSpirit Experience Accelerator (FSXA) is the hybrid solution of a digital experience platform, combining a headless approach with enterprise capabilities. If you are interested in the FSXA check this Overview. You can order a demo online.

Project setup

FSXA-UI is really easy to get started with. Make sure to follow the guide below to get a better understanding about some of the decisions behind FSXA-UI and how to use it to kick-off your next project.

You can install FSXA-UI via Yarn or NPM.

# with npm
npm install fsxa-ui --save

# with yarn
yarn add fsxa-ui

Please make sure that the main CSS file is imported from the FSXA UI package.

// directly importing the css into your main component
import "fsxa-ui/dist/fsxa-ui.css";
/* using node-style package resolution in a CSS file */
@import "fsxa-ui/dist/fsxa-ui.css";
<!-- using plain html -->
<link
  href="path/to/node_modules/fsxa-ui/dist/fsxa-ui.css"
  rel="preload"
  as="style"
/>

Usage

Now you can use the components in your project. In the navigation you will find all available components with a detailed description of all properties and usage examples.

Here you can see how easy the Button component can be used.

import { Button } from "fsxa-ui";

<Button variant="animated" handleClick={handleClick}>
  This is my Button
</Button>

Please make sure that your component is registered correctly.

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Run your unit tests

npm run test:unit

Lints and fixes files

npm run lint

Customize configuration

See Configuration Reference.

Existing CSS-Variables:

  • --fsxa-text-highlight-color

Legal Notices

FSXA-UI is a product of Crownpeak Technology GmbH, Dortmund, Germany. The FSXA-UI is subject to the Apache-2.0 license.

Disclaimer

This document is provided for information purposes only. Crownpeak Technology may change the contents hereof without notice. This document is not warranted to be error-free, nor subject to any other warranties or conditions, whether expressed orally or implied in law, including implied warranties and conditions of merchantability or fitness for a particular purpose. Crownpeak Technology specifically disclaims any liability with respect to this document and no contractual obligations are formed either directly or indirectly by this document. The technologies, functionality, services, and processes described herein are subject to change without notice.