1.0.111 • Published 6 months ago

cinnecta-ui-kit v1.0.111

Weekly downloads
-
License
MIT
Repository
-
Last release
6 months ago

LUIS (Lean User Interface System)

LUIS (Lean User Interface System) é um design system desenvolvido para fornecer uma biblioteca de componentes React.js flexí­vel e eficiente, garantindo consistência visual e facilidade de uso em diferentes projetos.

Instalação

Você pode instalar a biblioteca utilizando npm, yarn ou pnpm:

Usando npm

npm install cinnecta-ui-kit

Usando yarn

yarn add cinnecta-ui-kit

Usando pnpm

pnpm add cinnecta-ui-kit

Configuração

Para utilizar os componentes da biblioteca, adicione as seguintes configurações ao seu projeto:

  1. No seu arquivo global.css, importe os estilos do design system:
@layer reset, base, tokens, recipes, utilities;
@import url('cinnecta-ui-kit/styles.css');
  1. Importe e utilize um componente em seu projeto:
import { Button } from "cinnecta-ui-kit";

function App() {
  return (
    <Button style="gradient" spacing="noSpacing" fullWidth>
      Entrar
    </Button>
  );
}

Estilização e Extensibilidade

Se você deseja estender os estilos e criar novos componentes utilizando o Panda CSS, siga os passos abaixo:

  1. Instale o Panda CSS:
yarn add -D @pandacss/dev
  1. Inicialize o Panda CSS no projeto:
yarn panda init --postcss
  1. Adicione o seguinte script no package.json para gerar os estilos:
"scripts": {
  "prepare": "panda codegen"
}
  1. Configure o arquivo panda.config.ts para incluir os componentes da biblioteca:
import { defineConfig } from "@pandacss/dev";
import { auroraPreset } from "cinnecta-ui-kit";

export default defineConfig({
  preflight: true,
  jsxFramework: "react",
  presets: [auroraPreset],
  include: [
    "./src/components/**/*.{ts,tsx,js,jsx}",
    "./src/pages/**/*.{ts,tsx,js,jsx}",
    "./node_modules/cinnecta-ui-kit/dist/panda.buildinfo.json"
  ],
  outExtension: "js",
  outdir: "styled-system",
});

Documentação Adicional

Para mais detalhes sobre a configuração do Panda CSS em diferentes frameworks, consulte:

Com isso, seu projeto estará pronto para utilizar os componentes do LUIS com total flexibilidade e performance!

1.0.77

6 months ago

1.0.79

6 months ago

1.0.78

6 months ago

1.0.101

6 months ago

1.0.100

6 months ago

1.0.107

6 months ago

1.0.106

6 months ago

1.0.109

6 months ago

1.0.108

6 months ago

1.0.103

6 months ago

1.0.102

6 months ago

1.0.105

6 months ago

1.0.104

6 months ago

1.0.80

6 months ago

1.0.84

6 months ago

1.0.83

6 months ago

1.0.82

6 months ago

1.0.81

6 months ago

1.0.88

6 months ago

1.0.87

6 months ago

1.0.86

6 months ago

1.0.85

6 months ago

1.0.89

6 months ago

1.0.110

6 months ago

1.0.111

6 months ago

1.0.91

6 months ago

1.0.90

6 months ago

1.0.94

6 months ago

1.0.93

6 months ago

1.0.99

6 months ago

1.0.98

6 months ago

1.0.97

6 months ago

1.0.96

6 months ago

1.0.62

7 months ago

1.0.61

7 months ago

1.0.60

7 months ago

1.0.66

7 months ago

1.0.64

7 months ago

1.0.63

7 months ago

1.0.69

7 months ago

1.0.68

7 months ago

1.0.67

7 months ago

1.0.72

7 months ago

1.0.71

7 months ago

1.0.70

7 months ago

1.0.76

7 months ago

1.0.75

7 months ago

1.0.39

7 months ago

1.0.40

7 months ago

1.0.44

7 months ago

1.0.43

7 months ago

1.0.42

7 months ago

1.0.41

7 months ago

1.0.48

7 months ago

1.0.47

7 months ago

1.0.46

7 months ago

1.0.45

7 months ago

1.0.49

7 months ago

1.0.51

7 months ago

1.0.50

7 months ago

1.0.55

7 months ago

1.0.54

7 months ago

1.0.53

7 months ago

1.0.59

7 months ago

1.0.58

7 months ago

1.0.57

7 months ago

1.0.56

7 months ago

1.0.38

7 months ago

1.0.37

7 months ago

1.0.36

7 months ago

1.0.35

7 months ago

1.0.34

7 months ago

1.0.33

7 months ago

1.0.32

7 months ago

1.0.31

7 months ago

1.0.30

7 months ago

1.0.29

7 months ago

1.0.28

7 months ago

1.0.27

7 months ago

1.0.26

7 months ago

1.0.25

7 months ago

1.0.24

7 months ago

1.0.23

7 months ago

1.0.22

7 months ago

1.0.21

7 months ago

1.0.20

7 months ago

1.0.19

7 months ago

1.0.18

7 months ago

1.0.17

7 months ago

1.0.16

7 months ago

1.0.15

7 months ago

1.0.14

7 months ago

1.0.13

7 months ago

1.0.12

7 months ago

1.0.11

7 months ago

1.0.10

7 months ago

1.0.9

7 months ago

1.0.7

7 months ago

1.0.6

7 months ago

1.0.5

7 months ago

1.0.4

7 months ago

1.0.3

7 months ago

1.0.2

7 months ago

1.0.1

7 months ago

1.0.0

7 months ago

0.0.47

7 months ago