@henriquepetrelli/hp-design-system 1.1.12 → 1.1.14

package/dist/style.css

@@ -410,7 +410,7 @@ body {
 .button-tertiary__label[data-v-0401b00e] {
   display: block;
   color: inherit;
-}.button-icon[data-v-32ab443d] {
+}.button-icon[data-v-8cf8a123] {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -423,35 +423,74 @@ body {
   border: 0;
   cursor: pointer;
 }
-.button-icon--lg[data-v-32ab443d] {
+.button-icon--lg[data-v-8cf8a123] {
   width: 64px;
   height: 64px;
 }
-.button-icon--sm[data-v-32ab443d] {
+.button-icon--sm[data-v-8cf8a123] {
   width: 32px;
   height: 32px;
   font-size: 15px;
 }
-.button-icon--is-loading[data-v-32ab443d] {
+.button-icon--is-loading[data-v-8cf8a123] {
   cursor: default;
 }
-.button-icon[data-v-32ab443d]:not(:disabled):not(.button-icon--is-loading):focus-visible {
+.button-icon[data-v-8cf8a123]:not(:disabled):not(.button-icon--is-loading):focus-visible {
   outline: 2px solid var(--color-secondary);
   outline-offset: 2px;
 }
-.button-icon[data-v-32ab443d]:not(:disabled):not(.button-icon--is-loading):hover {
+.button-icon[data-v-8cf8a123]:not(:disabled):not(.button-icon--is-loading):hover {
   transform: scale(1.0175);
   opacity: 0.9;
 }
-.button-icon[style*="--background-color: transparent"][data-v-32ab443d]:not(:disabled):not(.button-icon--is-loading):hover {
+.button-icon[style*="--background-color: transparent"][data-v-8cf8a123]:not(:disabled):not(.button-icon--is-loading):hover {
   background-color: rgba(var(--icon-color), 0.1);
 }
-.button-icon[data-v-32ab443d]:not(:disabled):not(.button-icon--is-loading):active {
+.button-icon[data-v-8cf8a123]:not(:disabled):not(.button-icon--is-loading):active {
   transform: scale(0.985);
 }
-.button-icon--disabled[data-v-32ab443d], .button-icon[data-v-32ab443d]:not(.button-icon--is-loading):disabled {
+.button-icon--disabled[data-v-8cf8a123], .button-icon[data-v-8cf8a123]:not(.button-icon--is-loading):disabled {
   opacity: 0.5;
   cursor: default;
+}.button-letter[data-v-13b75270] {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 48px;
+  height: 48px;
+  border-radius: 50px;
+  font-size: 1rem;
+  font-weight: 600;
+  border: 0;
+  cursor: pointer;
+  background-color: var(--background-color);
+  transition: background-color 0.2s ease, transform 0.15s ease, opacity 0.15s ease;
+}
+.button-letter--lg[data-v-13b75270] {
+  width: 64px;
+  height: 64px;
+  font-size: 1.4rem;
+}
+.button-letter--sm[data-v-13b75270] {
+  width: 32px;
+  height: 32px;
+  font-size: 0.8rem;
+}
+.button-letter--is-loading[data-v-13b75270] {
+  cursor: default;
+}
+.button-letter[data-v-13b75270]:not(:disabled):not(.button-letter--is-loading):hover {
+  transform: scale(1.0175);
+}
+.button-letter[data-v-13b75270]:not(:disabled):not(.button-letter--is-loading):active {
+  transform: scale(0.985);
+}
+.button-letter[data-v-13b75270]:not(:disabled):not(.button-letter--is-loading):focus-visible {
+  outline: 2px solid var(--color-secondary);
+  outline-offset: 2px;
+}
+.button-letter--disabled[data-v-13b75270], .button-letter[data-v-13b75270]:disabled {
+  cursor: default;
 }.alert[data-v-10dcca72] {
   padding: 10px;
   width: 100%;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@henriquepetrelli/hp-design-system",
-  "version": "1.1.12",
+  "version": "1.1.14",
   "type": "module",
   "main": "./dist/hp-design-system.umd.js",
   "module": "./dist/hp-design-system.es.js",