@loja-integrada/admin-components 0.18.12 → 0.18.14

package/package.json

@@ -1,8 +1,12 @@
 {
   "name": "@loja-integrada/admin-components",
-  "version": "0.18.12",
+  "version": "0.18.14",
   "author": "Loja Integrada Front-End Team",
   "license": "MIT",
+  "repository": {
+    "url": "lojaintegrada/admin-components",
+    "directory": "styleguide"
+  },
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",
   "files": [

package/src/Icons/icons-path/Filter.tsx

@@ -0,0 +1,9 @@
+import React from 'react'
+
+export const Filter = () => (
+  <path
+    fillRule="evenodd"
+    clipRule="evenodd"
+    d="M15.5698 0H2.43384C0.145842 0 -0.844158 2.897 0.964842 4.298L5.70784 7.969C6.19784 8.348 6.48384 8.933 6.48384 9.552L6.47884 14.895C6.47884 15.653 6.90584 16.346 7.58484 16.685L9.92784 17.857C10.0898 17.937 10.2568 17.975 10.4198 17.975C10.9968 17.975 11.5198 17.511 11.5208 16.874L11.5248 9.55C11.5258 8.932 11.8118 8.349 12.2998 7.97L17.0398 4.297C18.8478 2.896 17.8568 0 15.5698 0ZM15.5698 1.5C16.1508 1.5 16.3588 1.926 16.4218 2.109C16.4838 2.292 16.5798 2.756 16.1208 3.111L11.3818 6.784C10.5198 7.452 10.0258 8.459 10.0248 9.549L10.0208 16.226L8.25584 15.343C8.08484 15.258 7.97884 15.086 7.97884 14.896L7.98384 9.553C7.98484 8.477 7.47684 7.441 6.62584 6.783L1.88284 3.112C1.42384 2.756 1.51984 2.292 1.58184 2.109C1.64484 1.926 1.85284 1.5 2.43384 1.5H15.5698Z"
+  />
+)

package/src/Icons/icons-path/WhatsApp.tsx

@@ -0,0 +1,9 @@
+import React from 'react'
+
+export const WhatsApp = () => (
+  <path
+    fillRule="evenodd"
+    clipRule="evenodd"
+    d="M1.68502 9.00599C1.68402 10.288 2.01902 11.539 2.65602 12.642L1.62402 16.412L5.48002 15.401C6.54202 15.98 7.73802 16.286 8.95602 16.286H8.95902C12.968 16.286 16.232 13.022 16.233 9.01199C16.234 7.06899 15.477 5.23999 14.105 3.86499C12.731 2.48999 10.904 1.73199 8.95902 1.73199C4.94902 1.73199 1.68602 4.99499 1.68502 9.00599ZM3.98102 12.452L3.83702 12.224C3.23202 11.262 2.91202 10.148 2.91202 9.00599C2.91402 5.67299 5.62702 2.96099 8.96102 2.96099C10.576 2.96099 12.093 3.59099 13.235 4.73299C14.377 5.87699 15.006 7.39499 15.005 9.01099C15.004 12.344 12.291 15.058 8.95902 15.058H8.95702C7.87102 15.057 6.80802 14.765 5.88002 14.215L5.65802 14.083L3.37002 14.684L3.98102 12.452ZM5.89902 5.87399C5.73202 6.05599 5.26202 6.49599 5.26202 7.39099C5.26202 8.28499 5.91402 9.14899 6.00502 9.27099C6.09602 9.39099 7.28602 11.227 9.11002 12.015C9.54402 12.202 9.88202 12.315 10.147 12.398C10.581 12.536 10.977 12.516 11.291 12.469C11.64 12.418 12.366 12.03 12.517 11.605C12.669 11.181 12.669 10.817 12.624 10.742C12.578 10.666 12.457 10.62 12.275 10.529C12.093 10.438 11.201 9.99799 11.033 9.93799C10.867 9.87699 10.745 9.84699 10.624 10.029C10.503 10.21 10.156 10.62 10.049 10.742C9.94302 10.862 9.83702 10.878 9.65502 10.787C9.47302 10.697 8.88702 10.504 8.19402 9.88499C7.65402 9.40199 7.28802 8.80699 7.18202 8.62599C7.07602 8.44399 7.17102 8.34599 7.26202 8.25499C7.34402 8.17299 7.44402 8.04199 7.53502 7.93599C7.62602 7.82999 7.65502 7.75299 7.71702 7.63299C7.77702 7.51099 7.74602 7.40499 7.70102 7.31399C7.65502 7.22299 7.29302 6.32899 7.14102 5.96499C7.01002 5.65199 6.87802 5.65299 6.77302 5.65399C6.75802 5.65399 6.74502 5.65399 6.73202 5.65299C6.62602 5.64799 6.50502 5.64699 6.38402 5.64699C6.26202 5.64699 6.06502 5.69299 5.89902 5.87399Z"
+  />
+)

package/src/Icons/icons-path/index.ts

@@ -30,6 +30,7 @@ import { Eye } from './Eye'
 import { ExclamationCircle } from './ExclamationCircle'
 import { ExclamationTriangle } from './ExclamationTriangle'
 import { ExternalLink } from './ExternalLink'
+import { Filter } from './Filter'
 import { HalfBack } from './HalfBack'
 import { Home } from './Home'
 import { Image } from './Image'
@@ -65,6 +66,7 @@ import { Lightbulb } from './Lightbulb'
 import { Camera } from './Camera'
 import { Nav } from './Nav'
 import { ShoppingCart } from './ShoppingCart'
+import { WhatsApp } from './WhatsApp'
 
 export const icons = {
   adjust: Adjust,
@@ -103,6 +105,7 @@ export const icons = {
   exclamationCircle: ExclamationCircle,
   exclamationTriangle: ExclamationTriangle,
   externalLink: ExternalLink,
+  filter: Filter,
   halfBack: HalfBack,
   home: Home,
   image: Image,
@@ -135,4 +138,5 @@ export const icons = {
   questionCircle: QuestionCircle,
   sync: Sync,
   user: User,
+  whatsapp: WhatsApp,
 }

package/src/Indicators/Badge/Badge.spec.tsx

@@ -5,6 +5,7 @@ import * as stories from "./Badge.stories"
 
 const { Default, Small, Expanded } = composeStories(stories)
 const badgeClass = '.badge'
+const badgeTextClass = '.badgeText'
 
 const specTitle = require('cypress-sonarqube-reporter/specTitle');
 describe(specTitle('Badge tests'), () => {
@@ -29,6 +30,10 @@ describe(specTitle('Badge tests'), () => {
     mount(<Default type="neutral" />)
     cy.get(badgeClass).should('have.class', 'bg-inverted-2')
 
+    mount(<Default type="neutralLight" />)
+    cy.get(badgeClass).should('have.class', 'bg-inverted-3')
+    cy.get(badgeTextClass).should('have.class', 'text-tertiary')
+
     mount(<Default type="primary" />)
     cy.get(badgeClass).should('have.class', 'bg-primary-dark')
 
@@ -40,5 +45,8 @@ describe(specTitle('Badge tests'), () => {
 
     mount(<Default type="danger" />)
     cy.get(badgeClass).should('have.class', 'bg-danger-dark')
+
+    mount(<Default type="focus" />)
+    cy.get(badgeClass).should('have.class', 'bg-focus')
   })
 })

package/src/Indicators/Badge/Badge.tsx

@@ -2,10 +2,12 @@ import React from 'react'
 
 const badgeTypes = {
   neutral: 'bg-inverted-2',
+  neutralLight: 'bg-inverted-3',
   primary: 'bg-primary-dark',
   danger: 'bg-danger-dark',
   success: 'bg-success-dark',
   warning: 'bg-warning-dark',
+  focus: 'bg-focus',
 }
 
 const badgeSizes = {
@@ -25,7 +27,13 @@ const BadgeComponent = ({
         badgeTypes[type]
       } ${badgeSizes[size]} ${expanded ? 'flex w-full' : 'inline-flex'}`}
     >
-      <span className={`tracking-4 font-semibold text-base-1`}>{text}</span>
+      <span
+        className={`badgeText tracking-4 font-semibold ${
+          type === 'neutralLight' ? 'text-tertiary' : 'text-base-1'
+        }`}
+      >
+        {text}
+      </span>
     </div>
   )
 }