open-index/open-npm huggingface dataset:
npm package: @josephrana11/design-system
Description: Sireto Design System Components
Author: sireto
Latest version: 0.0.1

# shadcn

A CLI for adding components to your project.

## Usage

Use the `init` command to initialize dependencies for a new project.

The `init` command installs dependencies, adds the `cn` util, configures `tailwind.config.js`, and CSS variables for the project.

```bash
npx shadcn init
```

## add

Use the `add` command to add components to your project.

The `add` command adds a component to your project and installs all required dependencies.

```bash
npx shadcn add [component]
```

### Example

```bash
npx shadcn add alert-dialog
```

You can also run the command without any arguments to view a list of all available components:

```bash
npx shadcn add
```

## Documentation

Visit https://ui.shadcn.com/docs/cli to view the documentation.

## License

Licensed under the [MIT license](https://github.com/shadcn/ui/blob/main/LICENSE.md).
npm package: @josephuspaye/explorer-file-ops-cli
Description: Copy, move, and delete files and folders using the File Explorer GUI from the command line
Author: Josephus Paye II
Latest version: 0.1.0

# explorer-file-ops-cli

> Copy, move, and delete files and folders using the File Explorer GUI from the command line

This project is part of [#CreateWeekly](https://twitter.com/JosephusPaye/status/1214853295023411200), my attempt to create something new publicly every week in 2020.

## Why

It's easy to copy, move, and delete files and folders using the default `cp`, `mv` and `rm` commands. But this module has a number of advantages over it:

- Shows progress in the familiar File Explorer progress interface
- You can pause and cancel the operation
- You can undo and redo the operation
- You will be prompted to authenticate or elevate to admin if access to the source or destination paths is restricted
- Items you delete go to the Recycle Bin by default

## Installation

```bash
npm install -g @josephuspaye/explorer-file-ops-cli
```

## Usage

### Copy files and folders (`ecp`)

```
  Description
    Copy files and folders using File Explorer's GUI

  Usage
    $ ecp [src...] [dest] [options]

  Options
    -f, --from       Specify one or more source paths
    -t, --to         Specify a target directory or one or more target paths
    -v, --version    Displays current version
    -h, --help       Displays this message

  Examples
    $ ecp C:\file.zip X:\file-new.zip
    $ ecp C:\file.zip C:\another-file.pdf X:\destination
    $ ecp --from C:\file.zip C:\another-file.pdf --to X:\file-new.zip X:\folder\another-file-new.pdf
```

### Move files and folders (`emv`)

```
  Description
    Move files and folders using File Explorer's GUI

  Usage
    $ emv [src...] [dest] [options]

  Options
    -f, --from       Specify one or more source paths
    -t, --to         Specify a target directory or one or more target paths
    -v, --version    Displays current version
    -h, --help       Displays this message

  Examples
    $ emv C:\file.zip X:\file-moved.zip
    $ emv C:\file.zip C:\another-file.pdf X:\destination
    $ emv --from C:\file.zip C:\another-file.pdf --to X:\file-moved.zip X:\folder\another-file-moved.pdf
```

### Delete files and folders (`erm`)

```
  Description
    Delete files and folders using File Explorer's GUI

  Usage
    $ erm [src...] [dest] [options]

  Options
    -v, --version    Displays current version
    -h, --help       Displays this message

  Examples
    $ erm C:\file.zip
    $ erm C:\file.zip X:\directory \\MediaShare\Processed
```

## Related

- [@josephuspaye/explorer-file-ops](https://github.com/JosephusPaye/explorer-file-ops) a version of this module for programmatic use

## Licence

[MIT](LICENCE)
npm package: @josephuspaye/launch-start-app
Description: Launch apps from the Start Menu retrieved by @josephuspaye/start-apps.
Author: Josephus Paye II
Latest version: 0.1.0

# launch-start-app

> Launch apps from the Start Menu retrieved by [@josephuspaye/start-apps](https://github.com/JosephusPaye/start-apps).

This project is part of [#CreateWeekly](https://twitter.com/JosephusPaye/status/1214853295023411200), my attempt to create something new publicly every week in 2020.

## Installation

```sh
npm install -g @josephuspaye/launch-start-app
```

## Examples

### Launch an app

The following program gets the first app from the Start Menu using [@josephuspaye/start-apps](https://github.com/JosephusPaye/start-apps) and launches it:

```js
import { getApps } from '@josephuspaye/start-apps';
import { launch } from '@josephuspaye/launch-start-app';

async function main() {
  const apps = await getApps();
  const launcherExitCode = await launch(apps[0]);
  console.log(launcherExitCode); // 0 on a successful launch
}

main();
```

### Launch a classic app as administrator

The following program finds Notepad using [@josephuspaye/start-apps](https://github.com/JosephusPaye/start-apps) and launches it as administrator:

```js
import { getApps } from '@josephuspaye/start-apps';
import { launch } from '@josephuspaye/launch-start-app';

async function main() {
  const apps = await getApps();
  const notepad = apps.find((app) => app.name === 'Notepad');

  if (notepad) {
    const launcherExitCode = await launch(notepad, { runAsAdmin: true });
    console.log(launcherExitCode); // 0 on a successful launch
  }
}

main();
```

## API

```ts
interface ClassicApp {
  type: 'classic';
  appUserModelId: string;
  targetPath: string;
  targetArguments: string;
  startMenuLink?: string;
  [others: string]: any;
}

interface StoreApp {
  type: 'store';
  appUserModelId: string;
  [others: string]: any;
}

/**
 * Launch the given store app. Returns a Promise that resolves with the
 * exit code of the launching process (not the app launched).
 */
function launch(app: StoreApp): Promise<number | null>;

/**
 * Launch the given classic app, optionally as an administrator. Returns a
 * Promise that resolves with the exit code of the launching process (not
 * the app launched).
 */
function launch(
  app: ClassicApp,
  options?: { runAsAdmin: boolean }
): Promise<number | null>;
```

## Licence

[MIT](LICENCE)
npm package: @josephuspaye/lookup-cli
Description: Look up definitions, synonyms, and related words from online sources on the command line.
Author: Josephus Paye II
Latest version: 0.2.0

# Lookup CLI

📖 Look up definitions, synonyms, and related words from online sources on the command line. The current available source is [WordWeb Online](https://wordwebonline.com).

This project is part of [#CreateWeekly](https://twitter.com/JosephusPaye/status/1214853295023411200), my attempt to create something new publicly every week in 2020.

## Installation

```bash
npm install -g @josephuspaye/lookup-cli
```

## Examples

### Look up definitions

The following command looks up definitions of the word "reticent":

```bash
lookup reticent
```

And yields the following output when ran:

<details>
<summary>View output</summary>

```
Looking up "reticent"...

Adjective: reticent

  1. Temperamentally disinclined to talk
     - untalkative

  2. Cool and formal in manner
     - restrained, unemotional

  3. Reluctant to draw attention to yourself
     - self-effacing, retiring

See also: taciturn, unassertive, undemonstrative
```
</details>

### Look up definitions with related words

When looking up definitions, you can choose to include related words in the following categories:

- `soundsLike`
- `derivedForms`
- `seeAlso`
- `partOf`
- `typeOf`
- `antonyms`
- `all` (include all related words)

The following commands finds definitions and `soundsLike`, `derivedForms`, `typeOf`, and `partOf` relations for the word "bee":

```bash
lookup bee -i soundsLike,derivedForms,typeOf,partOf
```

And yields the following output when ran:

<details>
<summary>View output</summary>

```
Looking up "bee"...

Noun: bee

  1. Any of numerous hairy-bodied insects including social and solitary species

  2. A social gathering to carry out some communal task or to hold competitions

Sounds like: be, B

Derived forms: bees

Type of: hymenopter, hymenopteran, hymenopteron, hymenopterous insect, social affair, social gathering

Part of: Apoidea, superfamily Apoidea
```
</details>

## Usage

```bash
lookup --help
```

```
Description
  Find definitions, synonyms, and related words for the given word.

Usage
  $ lookup <word> [options]

Options
  -i, --include    Include related words: one or more of `soundsLike`, `derivedForms`, `seeAlso`, `typeOf`, `partOf`, or `antonyms`, separated by a comma, or `all`  (default derivedForms,seeAlso,antonyms)
  -v, --version    Displays current version
  -h, --help       Displays this message

Examples
  $ lookup flag
  $ lookup flag -i derivedForms,seeAlso,antonyms
```

## Licence

[MIT](LICENCE)
npm package: @josephuspaye/open-private
Description: Open a URL in private mode in your default browser from the command line on Windows
Author: Josephus Paye II
Latest version: 0.1.0

# open-private

> Open a URL in private mode in your default browser from the command line on Windows

This project is part of [#CreateWeekly](https://twitter.com/JosephusPaye/status/1214853295023411200), my attempt to create something new publicly every week in 2020.

## Installation

```bash
npm install -g @josephuspaye/open-private
```

## Examples

### Open a URL in private mode

```sh
open-private https://example.com
```

**NOTE**: It's currently not possible to launch some browsers, like the original (pre-Chromium) Microsoft Edge, in private mode. When this is the case with your default browser, you will be prompted on whether to continue with a launch in normal mode or not.

### Open a URL in normal mode

```sh
open-private https://example.com -n
```

## Usage

```
  Description
    Open the given URL in private mode in your default browser

  Usage
    $ open-private <url> [options]

  Options
    -n, --nah        I've changed my mind, open the URL in the normal browser mode instead
    -v, --version    Displays current version
    -h, --help       Displays this message

  Examples
    $ open-private open-private https://example.com
    $ open-private open-private http://en.wikipedia.org -n
```

## Related

- [@josephuspaye/default-browser-win](https://github.com/JosephusPaye/default-browser-win) a version of this module for programmatic use

## Licence

[MIT](LICENCE)
npm package: @josephuspaye/stash-filestorage
Description: Simple file-based cache storage for @josephuspaye/stash
Author: Josephus Paye II
Latest version: 0.1.1

# stash-filestorage

![Tests](https://github.com/JosephusPaye/stash-filestorage/workflows/Tests/badge.svg)

🗃 Simple file-based cache storage for [@josephuspaye/stash](https://github.com/JosephusPaye/stash). This package provides a file storage backend for use in Node.js v10 or above.

This project is part of [#CreateWeekly](https://twitter.com/JosephusPaye/status/1214853295023411200), my attempt to create something new publicly every week in 2020.

## Installation

```
npm install @josephuspaye/stash-filestorage --save
```

## Usage

The following example shows how to use the file storage backend with Stash:

```js
import { Stash } from '@josephuspaye/stash';
import { FileStorage } from '@josephuspaye/stash-filestorage';

const stash = new Stash(
  new FileStorage({
    // Speeds up read operations by keeping a copy of the cache in memory
    // set to `false` to disable (not recommended)
    bufferInMemory: true,
    filePath: path.join(__dirname, 'cache.data'),
  })
);

// use `stash` as normal...
```

## API

### `FileStorage` class

A file-based storage backend for the cache.

Cache data is serialized using [devalue](https://github.com/Rich-Harris/devalue) and written to file for persistence, using Node's `fs` APIs. That means it correctly handles:

- cyclical references (`obj.self = obj`)
- repeated references (`[value, value]`)
- `undefined`, `Infinity`, `NaN`, `-0`
- regular expressions
- dates
- `Map` and `Set`

## Licence

[MIT](LICENCE)
npm package: @josephuspaye/timer
Description: A small and smooth (60-fps) countdown timer and stopwatch for Vue and vanilla JS
Author: Josephus Paye II
Latest version: 0.1.1

# Timer

A small and smooth (60-fps) countdown timer and stopwatch for Vue and vanilla JS.

## Demo

See <https://timerlib.netlify.app>.

## Documentation and usage

See [JosephusPaye/timer](https://github.com/JosephusPaye/timer#timer).
npm package: @josepmc/protractor
Description: Webdriver E2E test wrapper for Angular. - With decorators
Author: Josep Mateu Clemente
Latest version: 5.4.2-3

Protractor [![Build Status](https://travis-ci.org/angular/protractor.svg?branch=master)](https://travis-ci.org/angular/protractor) [![CircleCI Status](https://circleci.com/gh/angular/protractor.svg?style=shield)](https://circleci.com/gh/angular/protractor) [![Join the chat at https://gitter.im/angular/protractor](https://badges.gitter.im/angular/protractor.svg)](https://gitter.im/angular/protractor)
==========

[Protractor](http://angular.github.io/protractor) is an end-to-end test framework for [Angular](http://angular.io/) and [AngularJS](http://angularjs.org) applications. Protractor is a [Node.js](http://nodejs.org/) program built on top of [WebDriverJS](https://github.com/SeleniumHQ/selenium/wiki/WebDriverJs). Protractor runs tests against your application running in a real browser, interacting with it as a user would.

Compatibility
-------------

Protractor 5 is compatible with nodejs v6 and newer.

Protractor works with AngularJS versions greater than 1.0.6/1.1.4, and is compatible with Angular applications. Note that for Angular apps, the `binding` and `model` locators are not supported. We recommend using `by.css`.


Getting Started
---------------
See the [Protractor Website](http://www.protractortest.org) for most documentation.

To get set up and running quickly:
 - Work through the [Tutorial](http://www.protractortest.org/#/tutorial)
 - See the [API](http://www.protractortest.org/#/api)

Once you are familiar with the tutorial, you’re ready to move on. To modify your environment, see the Protractor Setup docs. To start writing tests, see the Protractor Tests docs.

To better understand how Protractor works with the Selenium WebDriver and Selenium Server see the reference materials.

This fork aims to add the following features to Protractor:

- Native applications support
- Multiple browser (concurrent) support. Start the test in one browser and end it in another.
- Caching support (WIP)

Getting Help
------------

Check the [Protractor FAQ](https://github.com/angular/protractor/blob/master/docs/faq.md) and read through the [Top 20 questions on StackOverflow](http://stackoverflow.com/questions/tagged/protractor?sort=votes&pageSize=20).

Please ask usage and debugging questions on [StackOverflow](http://stackoverflow.com/questions/tagged/protractor) (use the ["protractor"](http://stackoverflow.com/questions/ask?tags=protractor) tag), the [Gitter](https://gitter.im/angular/protractor) chat room, or in the [Angular discussion group](https://groups.google.com/forum/?fromgroups#!forum/angular). (Please do not ask support questions here on Github.)


For Contributors
----------------
See [DEVELOPER.md](https://github.com/angular/protractor/blob/master/DEVELOPER.md)
npm package: @josepot/ts-scale-codec
Description: A modular, composable, strongly typed and lightweight implementation of the [SCALE Codec](https://docs.substrate.io/v3/advanced/scale-codec/)
Author: Josep M Sobrepere
Latest version: 0.2.0

# ts-scale-codec

A modular, composable, strongly typed and lightweight implementation of the [SCALE Codec](https://docs.substrate.io/v3/advanced/scale-codec/)

## Installation

    npm install --save @josepot/ts-scale-codec

## Usage Example

```ts
import { Struct, U32, Vector, Str, Enum, Bool } from "@josepot/ts-scale-codec"
import { bufferToHex } from "./utils"

const [encoder, decoder] = Struct({
  id: U32,
  name: Str,
  friendIds: Vector(U32),
  event: Enum({
    one: Str,
    many: Vector(Str),
    allOrNothing: Bool,
  })
})

/*
Something very important is the types that are being inferred from this definition,
which both the encoder and the decoder will use. For instance, the input of the
encoder must be compatible with the following interface:

interface SomeData {
  id: number;
  name: string;
  friendIds: number[];
  event:
    | { tag: "one"; value: string; }
    | { tag: "many"; value: string[]; }
    | { tag: "allOrNothing"; value: boolean; };
}

Which, as you might expect, it's the same interface that's returned by the
decoder.
*/

const encodedData: ArrayBuffer = encoder({
  id: 100,
  name: "Some name",
  friendIds: [1, 2, 3],
  event: { tag: "allOrNothing" as const, value: true }
})

console.log(bufferToHex(encodedData))
// => 0x6400000024536f6d65206e616d650c0100000002000000030000000201

const decodedData = decoder(encodedData).value
// also possible:
// const decodedData = decoder("0x6400000024536f6d65206e616d650c0100000002000000030000000201").value

console.log(JSON.stringify(decodedData, null, 2))
// =>
//{
//  "id": 100,
//  "name": "Some name",
//  "friendIds": [
//    1,
//    2,
//    3
//  ],
//  "event": {
//    "tag": "allOrNothing",
//    "value": true
//  }
//}
```

## Custom definitions

In this library you won't find common definitions like `AccountId`. However,
since the definitions of this library are enhanceable and composable, it's
very easy to create new custom definitions. For instance, the implementation of
the `Str` Codec looks like this:

```ts
import { enhanceCodec, Vector, U8 } from "@/."

const fromStringToBytes = (value: string) =>
  value.split("").map((_, idx) => value.charCodeAt(idx))

const fromBytesToString = (bytes: number[]) => String.fromCharCode(...bytes)

export const Str = enhanceCodec(
  Vector(U8),
  fromStringToBytes,
  fromBytesToString,
)
```

Similarly, you could implement any other definitions are that based on other
definitions. For instance, a possible implementation of an `AccountId`
definition could be: 

```ts
import { enhanceCodec, Bytes } from "@josepot/ts-scale-codec"
import { decodeAddress, encodeAddress } from "@polkadot/util-crypto"

export const AccountId = enhanceCodec(
  Bytes(32),
  decodeAddress,
  encodeAddress,
)
```
npm package: @josepot/typed-json
Description: `JSON.stringify` and `JSON.parse` with better support for TS.
Author: Josep M Sobrepere
Latest version: 0.1.1

# typed-json

`JSON.stringify` and `JSON.parse` with better support for TS.

```ts
import { stringify, parse } from '@josepot/typed-json';


interface Data {
  foo: string;
  bar: number;
}

const data: Data = { foo: 'foo', bar: 10 };

const dataStr = stringify(data); // const dataStr: JsonString<Data>
const dataClone = parse(dataStr); // const dataClone: Data
```
npm package: @josercl/form-maker
Description: Form generator using vue 3
Author: Jose Carrero
Latest version: 1.4.3

# Form-Maker

<img src="https://badgen.net/gitlab/license/josercl/form-maker">
<a href="https://vuejs.org/" target="_blank"><img src="https://badgen.net/badge/vue/v3?color=green"></a>
<a href="https://www.npmjs.com/package/@josercl/form-maker" target="_blank"><img src="https://badgen.net/npm/v/@josercl/form-maker/?color=red&icon=npm&label"></a>
<a href="https://www.npmjs.com/package/@josercl/form-maker" target="_blank"><img src="https://badgen.net/npm/dt/@josercl/form-maker"></a>

<p>
<img src="https://badgen.net/gitlab/release/josercl/form-maker">
<img src="https://badgen.net/gitlab/last-commit/josercl/form-maker">
</p>

## Project setup
```shell
npm install @josercl/form-maker
```

## Usage

### main.js
```javascript
import FormMaker from '@josercl/form-maker';

createApp(App)
    .use(FormMaker)
    .mount('#app')
```

### App.vue
```vuejs
<script setup>
import { reactive } from 'vue'

const person = reactive({
  name: 'John Doe',
  age: 20,
  email: 'email@example.com',
})
</script>

<template>
  <form-maker v-model="person" />
</template>
```
npm package: @josercl/nbc
Description: Initialize a new Nuxt Backoffice project
Author: José Carrero
Latest version: 1.0.7

# @josercl/nbc

CLI tool to scaffold a new [Nuxt Backoffice](https://gitlab.com/josercl/nuxt-backoffice) project.

## Usage

### Interactive mode

```bash
npx @josercl/nbc
pnpm dlx @josercl/nbc
```

You will be prompted for:
- **Folder** — destination directory for the project
- **Git** — whether to initialize a new git repository
- **Dependencies** — whether to install dependencies
- **Package manager** — `npm`, `pnpm`

### Non-interactive mode

```bash
npx @josercl/nbc --folder my-project --git --deps
pnpm dlx @josercl/nbc --folder my-project --git --deps
```

#### Options

| Flag | Alias | Description |
|---|---|---|
| `--folder <name>` | `-f` | Destination folder |
| `--git` | | Initialize git repository |
| `--deps` | | Install dependencies |
| `--help` | | Show help |

## What it does

1. Clones the [nuxt-backoffice](https://gitlab.com/josercl/nuxt-backoffice) template
2. Copies `.env.example` to `.env`
3. Installs dependencies (optional)
4. Initializes a fresh git repository with a `pre-commit` lint hook (optional)

## Requirements

- Node.js >= 24
- Git

## License

[MIT](LICENSE)
npm package: @josercl/vue-admin
Description: ## Project setup ``` npm install ```
Latest version: 1.0.0-rc3

# vue-admin

## Project setup
```
npm install
```

### 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
```

### Customize configuration
See [Configuration Reference](https://cli.vuejs.org/config/).
npm package: @josercl/vue-admin-commands
Description: ## Project setup ``` npm install ```
Latest version: 1.1.1

# vue-admin

## Project setup
```
npm install
```

### 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
```

### Customize configuration
See [Configuration Reference](https://cli.vuejs.org/config/).
npm package: @joseronierison/ts-monads
Description: Typescripts Monads very similar to the Scala Monads
Author: José Roniérison
Latest version: 0.2.5

[![ts-monads](https://circleci.com/gh/joseronierison/ts-monads.svg?style=svg)](https://app.circleci.com/github/joseronierison/ts-monads/pipelines)

Type Script Monads

Inspired in the Scala Monads

### Installation

```shell script
  npm i @joseronierison/ts-monads
```

### Runnings tests locally

```shell script
  npm test
```

### Doc
Table of contents

- [Optional](https://github.com/joseronierison/ts-monads#option)

#### Option
```typescript
import { Optional, Option } from "@joseronierison/ts-monads/option";

const maybeTen: Optional<number> = Option.of(10);
const maybeTwo: Optional<number> = Option.of(2);
const maybeFive: Optional<number> = Option.of(5);

const optionalOperation = 
  maybeFive
    .map(five => five * 2)
    .flatMap(v => maybeTen.map(h => h * v))
    .flatMap(v => maybeTwo.map(h => v / h));

const noneValue = Option.none();

const noneOp = maybeTen.flatMap(g => noneValue.map(n => n * g));

console.log(optionalOperation.getOrElse(0)); // 50
console.log(noneOp.getOrElse(10)); // 10
```

#### Try
```typescript
import { Tryable, Try } from "@joseronierison/ts-monads/try";

const tryTen: Tryable<number> = Try.run(() => 10);
const tryFive: Tryable<number> = Try.run(() => 5);
const tryFailed: Tryable<number> = Try.run(() => { throw new Error("Something went wrong!") });

const riskOperation = 
  tryFive
    .map(five => five * 2)
    .flatMap(ten => tryTen.map(anotherTen => ten * anotherTen));

const failedOp = tryFailed.flatMap(g => tryTen.map(n => n * g));

console.log(riskOperation.getOrElse(0)); // 100
console.log(riskOperation.isSuccess()); // true

console.log(failedOp.getOrElse(10)); // 10
console.log(riskOperation.isFailure()); // true
console.log(riskOperation.getError()); // Error("Something went wrong!")
```

### Contributing
npm package: @joserosarioos/osui
Description: Design System
Latest version: 3.3.0

# @joserosarioos/osui

[![npm (scoped)](https://img.shields.io/npm/v/@joserosarioos/osui.svg)](https://www.npmjs.com/package/@joserosarioos/osui)
[![npm bundle size (minified)](https://img.shields.io/bundlephobia/min/@joserosarioos/osui.svg)](https://www.npmjs.com/package/@bamblehorse/osui)

Removes all spaces from a string.

## Install

```
$ npm install @joserosarioos/osui
```

## Usage
npm package: @josewmarinho/react-flip-clock
Description: Relógio flip animado com countdown e countup para React
Author: josewmarinho
Latest version: 1.0.0

# FlipClock

> ⏰ Um componente React com animação 3D para contagem regressiva (**countdown**) e contagem progressiva (**countup**).

<div align="center">
  <img src="./resources/newflipclock.gif" alt="flip clock demo" width="500" />
</div>

## Instalação

```bash
npm install --save @seupacote/flip-clock
```

ou

```bash
yarn add @seupacote/flip-clock
```

## Uso Básico

```tsx
import FlipClock from '@josewmarinho/flip-clock';
import '@josewmarinho/flip-clock/dist/index.css';

const App = () => (
  <FlipClock
    mode='up'
    from={new Date(2022, 4, 2, 23, 0, 0)}
    labels={['Anos', 'Meses', 'Dias', 'Horas', 'Minutos', 'Segundos']}
    digitBlockStyle={{
      width: 45,
      height: 65,
      fontSize: 32,
      borderRadius: 6,
      backgroundColor: '#ff007f',
      color: '#000000'
    }}
    dividerStyle={{ color: '#c2c2c2', height: 1 }}
    spacing={{ clock: 10, digitBlock: 4 }}
  >
    Tempo encerrado
  </FlipClock>
);
```

## Principais Propriedades

| Propriedade       | Tipo                                      | Descrição                                                        |
| ----------------- | ----------------------------------------- | ---------------------------------------------------------------- |
| `mode`            | `"up"` \| `"down"`                        | Define se a contagem será progressiva ou regressiva.             |
| `from` / `to`     | `Date` \| `string` \| `number`            | Data inicial (`from`) ou final (`to`) da contagem.               |
| `labels`          | `string[]`                                | Rótulos exibidos nos dígitos (ex: `['Dias', 'Horas', ...]`).     |
| `digitBlockStyle` | `React.CSSProperties`                     | Estilo dos blocos de dígitos (largura, altura, cor, fonte, etc). |
| `dividerStyle`    | `{ color?: string; height?: any }`        | Estilo da linha divisória entre os dígitos.                      |
| `spacing`         | `{ clock?: number; digitBlock?: number }` | Espaçamento entre elementos.                                     |
| `duration`        | `number`                                  | Duração da animação do flip (ex: `0.7`).                         |
| `children`        | `ReactNode`                               | Conteúdo a ser renderizado quando a contagem termina.            |

## Estilização via CSS

Você também pode personalizar o estilo globalmente usando variáveis CSS:

```css
.flip-clock {
  --fcc-background: black;
  --fcc-digit-color: white;
  --fcc-label-color: #ccc;
  --fcc-flip-duration: 0.6s;
  --fcc-digit-block-width: 45px;
  --fcc-digit-block-height: 65px;
  --fcc-digit-font-size: 32px;
}
```

## Licença

MIT © [josewmarinho](https://github.com/josewmarinho)