1.0.111 • Published 7 months ago

cinnecta-ui-kit v1.0.111

Weekly downloads
-
License
MIT
Repository
-
Last release
7 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

7 months ago

1.0.79

7 months ago

1.0.78

7 months ago

1.0.101

7 months ago

1.0.100

7 months ago

1.0.107

7 months ago

1.0.106

7 months ago

1.0.109

7 months ago

1.0.108

7 months ago

1.0.103

7 months ago

1.0.102

7 months ago

1.0.105

7 months ago

1.0.104

7 months ago

1.0.80

7 months ago

1.0.84

7 months ago

1.0.83

7 months ago

1.0.82

7 months ago

1.0.81

7 months ago

1.0.88

7 months ago

1.0.87

7 months ago

1.0.86

7 months ago

1.0.85

7 months ago

1.0.89

7 months ago

1.0.110

7 months ago

1.0.111

7 months ago

1.0.91

7 months ago

1.0.90

7 months ago

1.0.94

7 months ago

1.0.93

7 months ago

1.0.99

7 months ago

1.0.98

7 months ago

1.0.97

7 months ago

1.0.96

7 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

8 months ago

1.0.37

8 months ago

1.0.36

8 months ago

1.0.35

8 months ago

1.0.34

8 months ago

1.0.33

8 months ago

1.0.32

8 months ago

1.0.31

8 months ago

1.0.30

8 months ago

1.0.29

8 months ago

1.0.28

8 months ago

1.0.27

8 months ago

1.0.26

8 months ago

1.0.25

8 months ago

1.0.24

8 months ago

1.0.23

8 months ago

1.0.22

8 months ago

1.0.21

8 months ago

1.0.20

8 months ago

1.0.19

8 months ago

1.0.18

8 months ago

1.0.17

8 months ago

1.0.16

8 months ago

1.0.15

8 months ago

1.0.14

8 months ago

1.0.13

8 months ago

1.0.12

8 months ago

1.0.11

8 months ago

1.0.10

8 months ago

1.0.9

8 months ago

1.0.7

8 months ago

1.0.6

8 months ago

1.0.5

8 months ago

1.0.4

8 months ago

1.0.3

8 months ago

1.0.2

8 months ago

1.0.1

8 months ago

1.0.0

8 months ago

0.0.47

8 months ago