@eclass/ui-kit 1.11.7 → 1.12.0

package/README.md

@@ -0,0 +1,57 @@
+[[_TOC_]]
+
+## Información
+
+Este repositorio es una librería de componentes que se pensó para unificar estilos en los desarrollos de Eclass
+
+La fuente de donde se basan los componentes se encuentran en este [**Sistema de diseño**](https://zeroheight.com/15698077d/p/48fae4-eclass-sistema-de-diseo)
+
+## Scripts
+
+Los componentes están al 100% en escritas en archivos `typescript`.
+
+Además deben ser testeadas en donde el enfoque del `testing` es asegurarse de que se muestre todo lo que se promete
+
+Por otra parte cada componente debe llevar su `storie` donde muestre todos los estados que puede tomar el componente
+
+```
+  npm run dev
+```
+
+Para trabajar de manera local
+
+```
+  npm run storybook
+```
+Levanta el entorno de `storybook`
+
+```
+  npm run test
+```
+
+Ejecuta los test con `jest`
+
+## Instalación
+
+Se debe instalar este repositorio más unas dependencias
+
+### npm
+
+```shell
+npm install @eclass/ui-kit @chakra-ui/react @emotion/react @emotion/styled framer-motion
+```
+
+### Implementación
+
+Ejemplo de implementación en código.
+
+```js
+import { ChakraProvider } from '@chakra-ui/react'
+import { theme } from '@eclass/ui-kit'
+
+const AppWrapper = () => (
+  <ChakraProvider theme={theme} resetCSS={false}>
+    <App />
+  </ChakraProvider>
+)
+```

package/dist/eclass-ui-kit.es.js

@@ -27172,7 +27172,7 @@ function BtnTertiary({
     m: m2,
     onClick,
     _hover: {
-      color: blue
+      color: `${blue}`
     },
     _focusVisible: {
       boxShadow: `inset 0 0 0 2px ${blue}, inset 0 0 0 4px ${white}`
@@ -27186,7 +27186,13 @@ function BtnTertiary({
     sx: {
       "&:hover": {
         "svg path": {
-          fill: blue
+          fill: `${blue}`
+        },
+        "@media (hover: none)": {
+          color: `${gray}`,
+          "svg path": {
+            fill: colorIcon
+          }
         }
       }
     },