1.13.1 • Published 9 months ago

@clarke-energia/foton-v2 v1.13.1

Weekly downloads
-
License
MIT
Repository
github
Last release
9 months ago

Foton-UI

Clarke's Design System implementation.

Architecture

This is the target architecture of the components folder, following the atomic design principle:

  • components
    • component-name
      • index.tsx
      • index.stories.tsx
      • atoms
        • atom-one.tsx
        • ...
      • molecules
        • molecule-one.tsx
        • ...

Obs.: remember to naming the folders and files with Kebab Case convention.

Installing the project locally

Run

yarn install

Running storybook

Run:

yarn storybook

Creating new components

  • Create component function
  • Create component .stories file
  • Export component in src/lib/index.ts

Integrating into an existing React project

Prerequisites

  • You need to have installed react, tailwindcss, heroicons , radix ui in your project.

Plugging into your tailwind.config.js

NOTE: Integrating this package into your tailwind configuration might override your previous setup

// tailwind.config.js
const { fotonPlugin } = require('@clarke-energia/foton').fotonTailwind

module.exports = [
  //...
  plugins: [require('@tailwindcss/forms'), fotonPlugin], // This is needed
  //...
]

You are good to go!

Tests

npx playwright install
yarn test-storybook
1.13.1

9 months ago

1.11.3

9 months ago

1.13.0

9 months ago

1.12.0

9 months ago

1.11.1

9 months ago

1.9.2

9 months ago

1.11.0

9 months ago

1.10.1

9 months ago

1.10.0

9 months ago

1.9.1

9 months ago

1.9.0

9 months ago

1.8.0

9 months ago

1.7.0

9 months ago

1.6.4

9 months ago

1.6.5

9 months ago

1.6.3

9 months ago

1.6.2

9 months ago

1.6.1

9 months ago

1.6.0

9 months ago

1.1.1

9 months ago

1.4.2

9 months ago

1.5.0

9 months ago

1.4.1

9 months ago

1.4.0

9 months ago

1.3.1

9 months ago

1.3.0

9 months ago

1.2.1

9 months ago

1.2.0

9 months ago