open-index/open-npm huggingface dataset:
npm package: @schibstedspain/sui-spinner
Latest version: 1.1.2

# sui-spinner


## Description
A loader component that spins!

```jsx
<Spinner /> /* defaultProps = { size: 32, thickness: 1, color: '#fff' } */
<Spinner size={48} thickness={6} color={red} />
```

## Instalation
Clone this repository and run:
```
$ npm install
```

## Start working in development mode:
```
$ npm run dev
```
This command will build your `.sass`, `.jsx` and `.js` files and open a local development environment, with hot reloading. A browser window will be opened as well, showing the entry point of your documents folder for development purposes.

## To work in TDD mode:
```
$ npm run test:watch
```
## To run unit tests only once:
```
$ npm test
```
## To publish yours docs page:
```
$ npm run doc
```

That will publish in a gh-page for `docs` folder.
What is a component without a public demo, isn´t ?!

## Usage
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Non perspiciatis, quod eum perferendis, facere enim hic. Quibusdam deleniti, distinctio. Molestias error quibusdam quo similique, laborum iste libero dolorum saepe et.
npm package: @schibstedspain/sui-sticky-content
Description: Component wrapper to set position fixed or sticky to children node.
Latest version: 1.4.0

# StickyContent

> Just a wrapper to set a position "fixed" or position "sticky"  (relative until component is out of view when scrolling, and then fixed) to your component.

## Installation

```sh
$ npm install @schibstedspain/sui-sticky-content --save
```

## Usage

### Basic usage
```js
import StickyContent from '@schibstedspain/sui-sticky-content'

return (
  <div>
    <StickyContent
      sticky
      scrollingElement={document.body}
      position='top'>
      <span>Sticky content: when document.body.scrollTop is higher than components top position, this text will be fixed to top.</span>
    </StickyContent>

    <StickyContent
      fixed
      fullWidth
      position='bottom'>
      <span>Fixed content: position will be fixed to bottom</span>
    </StickyContent>
  </div>
)
```


> **Find full description and more examples in the [demo page](../demo).**
npm package: @schibstedspain/sui-studio
Description: Develop, maintain and publish your SUI components.
Author: Carlos Villuendas
Latest version: 4.26.0

# sui-studio
> Develop, maintain and publish your SUI components.


Sui Studio helps you to develop and document isolated UI components for your projects. It provides:

* Isolated development of components
* Unified development platform
* Productivity improvement focusing of component development experience
* Live Demos as a base of work (with auto-generated playgrounds)
* Components discovery catalog generated from live demos and markdown docs.

![](./assets/sui-studio-demo.gif)

## Installation

```sh
npm install sui-studio -g
```

## Getting Started

First install sui-studio:

```sh
npm i -g @schibstedspain/sui-studio
sui-studio init <project_name>
cd <project_name>
```

Once you're in the new project, you can execute `sui-studio start` in order to start the development browser and start working on your components.




## Common Workflow

### Creating a new component
#### 1) Create a component

```sh
$ sui-studio generate house window
```

#### 2) Install component dependencies

```sh
$ sui-studio run-all npm install
```

#### 3) Commit changes using the appropiate command

First of all, stage you changes for commit with ```git add``` or whatever you use.

DO NOT use ```git commit``` directly. Instead, use:

```sh
$ npm run co
```

Add the script to your package.json

```json
{
  "scripts": {
    "co": "sui-studio commit"
  }
}
```

It will prompt a question form. The way you answer to this question form affects the way the commit's comment is built. Comments will be used later, after merging to master in order to decide what kind of change (release) is going to be done (minor or major).

Then just push your changes using ```git push``` and merge them into master after review.

#### 4) Release

Select master branch. First, check that the release will be properly built by executing:
```
$ sui-studio check-release
```
If the output is the expected then run:
```
$ sui-studio release
```

## CLI

### `$ sui-studio link-all`

Executes internally `$ sui-mono link`, that links all components to each other.


### `$ sui-studio run-all`

Executes internally `$ sui-mono run`, that executed a command **in series** on each package folder.

### `$ sui-studio run-parallel`

Executes internally `$ sui-mono run-parallel`, that executed a command **in parallel** on each package folder.

# Conventions

## Naming
lowerCamelCase is the choice for directories and files.
```
components/house/mainWindow/...
```