Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

@thot/components

thotluna131MIT2.6.1

Libreria de componentes web

react, components

readme

Component Librery


It's a library of components that Storybook uses. Implementing the methodology of Desing tokens in Desing Sistem

Getting Started


To install it as a dependency of your project you must:

The prerequisite for using this package is having React installed. if you are using nextjs you should install next-transpile-modules and configure it

  1. install
npm install @thot/components o yarn add -D @thot/components
  1. Import from @thot/component/styles/styles.css in entry point. employment in Next Js would be in _app.js

    import '@thot/components/styles/styles.css'
  2. Import component and Use

import { Buttons } from '@thot/components'

<Buttons arialLabel='any' color='principal'>Button</Buttons>

Contributing


This library was made based on a series of videos made by Guillermo Rodas on YouTube [video list][https://www.youtube.com/watch?v=zfxP2VvP_Dw&list=PLKBvDYynKmlV91NjrOx11ZmKDlsxBeijc]. Several modifications were added.

License


Distributed under the MIT License. See LICENSE for more information.

Contact


Eladio Feijoo - @Eladiofeijoo - thotluna@gmail.com

Project Link: https://github.com/thotluna/components

changelog

2.6.1 (2021-04-21)

Bug Fixes

  • button: repair error with size of icon in button (6aaa614), closes #69

2.6.0 (2021-04-21)

Features

  • checkbox: create Checkbox component (3b266f7), closes #69
  • task: recreate Task component (ed2319f), closes #69

2.5.0 (2021-04-20)

Features

  • inputtask: create InputTask component (c3d69b0), closes #69
  • task: create Task Component (38460e5), closes #69

2.4.0 (2021-04-20)

Features

  • lineseparato: create LineSeparator component (6ce79e3), closes #68

2.3.0 (2021-04-20)

Features

  • avatar and avatarbar: create Avatar and AvatarBar Component (b97b741), closes #67
  • create avatar: created Avatar Component (2ddc912), closes #67

2.2.0 (2021-04-19)

Features

  • imagedragdrop: create ImageDragDrop component (51f7ab6), closes #64

2.1.0 (2021-04-17)

Features

  • select: create Selct component (26c8093), closes #63

2.0.3 (2021-04-16)

Bug Fixes

  • varius: repair size font, props paragraph, padding button (109c5a4), closes #26

2.0.2 (2021-04-16)

Bug Fixes

2.0.1 (2021-04-15)

Bug Fixes

  • paragraph: reimport styles an constant (78a6dd7), closes #26

2.0.0 (2021-04-14)

Bug Fixes

Features

  • atoms: redesigning the components from scratch (6f5bb7d), closes #26
  • button: change color (fb1f39a), closes #26
  • create input: create input (dffffaf), closes #26
  • menu: create menu (442405e), closes #26
  • snackbar: create snackbar (b898247)
  • toolbar: create Toolbar component (08877d0), closes #26

BREAKING CHANGES

  • atoms: Change all props from the components

1.10.3 (2021-04-11)

Bug Fixes

  • styles: error import styles.css (e16f9f8), closes #26

1.10.2 (2021-04-10)

Bug Fixes

  • css: change styles.css form styles.module.css (431f544), closes #28

1.10.1 (2021-04-10)

Bug Fixes

1.10.0 (2021-04-10)

Bug Fixes

Features

  • dark mode: create dark mode (0ccb031), closes #28
  • subtitle: change color system (e45ff50), closes #28

1.9.1 (2021-04-09)

Bug Fixes

  • button: repair icons button (a10e91a), closes #46

1.9.0 (2021-04-09)

Bug Fixes

  • remove heading and subheading (7cd1a95), closes #45
  • remplace header form title (634ef46), closes #45
  • avatarheader: remplace header from title and subtitle in AvatarHeader (b606474), closes #45
  • button: remplace header form title (ec46a52), closes #45
  • separatorline: remplace header form title (90e7d52), closes #45

Features

  • subtitle: add Subtite component (25317a8), closes #45
  • title: add title component (e306fcb), closes #45

1.8.0 (2021-04-08)

Features

1.7.0 (2021-04-07)

Features

  • loading: add Loading component (40de1bc), closes #43
  • picture: add Pitcture component (89bbf77), closes #43

1.6.1 (2021-04-06)

Bug Fixes

  • check: remplace buttom for input check (79c1316)

1.6.0 (2021-04-05)

Bug Fixes

  • separatorline: add isShowTitle (ac1a4c9), closes #35

Features

  • taskcounter: add TaskCounter component (01a6b67), closes #35
  • toggeldark: add ToggelDark component (169a3f2), closes #35
  • toogle: add Toogle component (7b515d3), closes #35

1.5.0 (2021-04-05)

Features

  • separatorline: create SeparatorLine component (3d79c53), closes #25

1.4.0 (2021-04-05)

Features

  • task: create Task component (da6092e), closes #25

1.3.0 (2021-04-03)

Features

  • card: create component Card (3704d27), closes #25

1.2.0 (2021-04-03)

Bug Fixes

  • css: error whit large line. the error prettier (0f147dc), closes #22
  • css: repair css (f5712f5), closes #22
  • snapshot test: repair Snapshot test (c42ee60), closes #23

Features

  • avatar header: create AvatarHeader component (625465f), closes #22
  • avatarheader: create AvatarHeader (5542453), closes #22
  • paragraph: create Paragraph (2a6eb7e), closes #22
  • paragraph: create Paragraph component (61fa4e6), closes #22
  • select: create Select component (3721593), closes #22
  • shapshot test: repair snapshot test (84f0279), closes #23
  • toolbar: add stories in Toolbar (0bb1329), closes #22
  • toolbar: create Toolbar component (e81ea9e), closes #22
  • toolbar: modify Toolbar component (1fc4213)

1.1.0 (2021-04-02)

Bug Fixes

  • builder-component: modify the script to create a constants file (b006e16), closes #19
  • icon: clear log (1c0e19d), closes #19
  • input: repair error css (db5d484), closes #19

Features

  • headings: create Headings component (8678149), closes #19
  • icon and button: create the component Icon and Button (75b3c8f), closes #19
  • index: add Input at index (772d3df), closes #19
  • input: create Input component (f431667), closes #19
  • input: create Input component (4eca3c5), closes #19
  • subheadings: create SubHeading component (5f1baad), closes #19

1.0.1 (2021-04-01)

Bug Fixes

  • yarn: modify version yarn (3a666f6)