@useblu/ocean-core 1.136.0 → 1.137.1

package/CHANGELOG.md

@@ -3,6 +3,19 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.137.1](https://github.com/ocean-ds/ocean-web/compare/v1.137.0...v1.137.1) (2026-09-11)
+
+### Bug Fixes
+
+- **core:** MR-748 hover das famílias de lista compõe com o fundo do container ([#1254](https://github.com/ocean-ds/ocean-web/issues/1254)) ([516eef0](https://github.com/ocean-ds/ocean-web/commit/516eef02ed0f1a89b1536520c9f01ab33b779ac0))
+
+# [1.137.0](https://github.com/ocean-ds/ocean-web/compare/v1.136.0...v1.137.0) (2026-07-27)
+
+### Features
+
+- add Banner component ([#1251](https://github.com/ocean-ds/ocean-web/issues/1251)) ([a4dfe36](https://github.com/ocean-ds/ocean-web/commit/a4dfe36148b75521725c2b837943f7d9b607c390))
+- **list:** adiciona indicatorPosition nos componentes de lista ([#1253](https://github.com/ocean-ds/ocean-web/issues/1253)) ([e98be1d](https://github.com/ocean-ds/ocean-web/commit/e98be1d8b99faa3c1f3fe7d6d970e914bc8d979a))
+
 # [1.136.0](https://github.com/ocean-ds/ocean-web/compare/v1.135.3...v1.136.0) (2026-05-11)
 
 ### Features

package/ocean.css

@@ -2115,6 +2115,90 @@
   padding-top: 0;
 }
 
+.ods-banner {
+  border-radius: 8px;
+  font-family: "Nunito Sans";
+  overflow: hidden;
+  width: 100%;
+}
+.ods-banner--default {
+  background-color: #f3f5fe;
+}
+.ods-banner--warning {
+  background-color: #fff7f0;
+}
+.ods-banner--negative {
+  background-color: #fff1f4;
+}
+.ods-banner--emphasys {
+  background-color: #0025e0;
+}
+.ods-banner--emphasys .ods-banner__actions .ods-btn--tertiary {
+  color: white;
+}
+.ods-banner--emphasys .ods-typography__description {
+  color: #f3f5fe;
+}
+.ods-banner__image-wrapper--top {
+  line-height: 0;
+  width: 100%;
+}
+.ods-banner__image-wrapper--top .ods-banner__image {
+  display: block;
+  height: auto;
+  -o-object-fit: cover;
+     object-fit: cover;
+  width: 100%;
+}
+.ods-banner__image-wrapper--side {
+  flex-shrink: 0;
+  width: 82px;
+}
+.ods-banner__image-wrapper--side .ods-banner__image {
+  display: block;
+  height: 100%;
+  -o-object-fit: cover;
+     object-fit: cover;
+  width: 100%;
+}
+.ods-banner__body {
+  align-items: stretch;
+  display: flex;
+}
+.ods-banner__content {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  padding: 16px;
+}
+.ods-banner .ods-typography__heading4 {
+  font-weight: 700;
+  line-height: 1.24;
+}
+.ods-banner .ods-typography__description {
+  font-weight: 600;
+  margin-top: 4px;
+}
+.ods-banner .ods-btn--sm {
+  min-width: unset;
+}
+.ods-banner__actions {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 16px;
+  margin-top: 12px;
+}
+.ods-banner--large .ods-banner__body {
+  flex-direction: column;
+}
+.ods-banner--large .ods-banner__actions {
+  margin-top: 24px;
+}
+.ods-banner--small .ods-banner__body {
+  flex-direction: row;
+  flex-wrap: nowrap;
+}
+
 .ods-badge {
   display: flex;
   font-family: "Nunito Sans";
@@ -2663,6 +2747,8 @@
 }
 
 .ods-divider {
+  border-color: #e0e2ee;
+  mix-blend-mode: multiply;
   border: 0;
   border-top: 1px solid #e0e2ee;
   margin: 0;
@@ -3116,13 +3202,14 @@
 }
 
 .ods-list {
-  background: white;
   border: 1px solid #e0e2ee;
   border-radius: 8px;
   box-sizing: border-box;
   overflow: hidden;
 }
 .ods-list .ods-transaction-list-item:not(:last-of-type) {
+  border-color: #e0e2ee;
+  mix-blend-mode: multiply;
   border-bottom: 1px solid #e0e2ee;
 }
 .ods-list .ods-transaction-list-item__sub-itens .ods-transaction-list-item {
@@ -3133,6 +3220,8 @@
   border-radius: 0;
 }
 .ods-list .ods-card-list-item:not(:last-of-type) {
+  border-color: #e0e2ee;
+  mix-blend-mode: multiply;
   border-bottom: 1px solid #e0e2ee;
 }
 .ods-list .ods-list-container__content--card {
@@ -3140,6 +3229,8 @@
   border-radius: 0;
 }
 .ods-list .ods-list-container:not(:last-of-type) > .ods-list-container__content--card {
+  border-color: #e0e2ee;
+  mix-blend-mode: multiply;
   border-bottom: 1px solid #e0e2ee;
 }
 .ods-list .ods-list-container:last-of-type > .ods-list-container__content__divider {
@@ -3159,7 +3250,6 @@
 }
 
 .ods-transaction-list-item {
-  background-color: white;
   cursor: pointer;
   display: flex;
   flex-direction: column;
@@ -3167,9 +3257,11 @@
 }
 .ods-transaction-list-item:hover, .ods-transaction-list-item:focus {
   background-color: #f3f5fe;
+  mix-blend-mode: multiply;
 }
 .ods-transaction-list-item:active {
   background-color: #ced1e1;
+  mix-blend-mode: multiply;
 }
 .ods-transaction-list-item.ods-transaction-list-item--readonly {
   pointer-events: none;
@@ -3187,7 +3279,8 @@
   pointer-events: none;
 }
 .ods-transaction-list-item--isloading .ods-transaction-list-item__content:hover, .ods-transaction-list-item--isloading .ods-transaction-list-item__content:focus {
-  background-color: white;
+  background-color: transparent;
+  mix-blend-mode: normal;
 }
 .ods-transaction-list-item .ods-transaction-list-item__sub-itens .ods-transaction-list-item {
   background-color: transparent;
@@ -3763,7 +3856,6 @@
 .ods-text-list-item-selectable .ods-checkbox__root,
 .ods-text-list-item-selectable .ods-radio__root {
   align-items: center;
-  background-color: white;
   padding: 16px;
   width: 100%;
 }
@@ -3771,6 +3863,7 @@
 .ods-text-list-item-selectable .ods-radio__root:hover,
 .ods-text-list-item-selectable .ods-radio__root:focus {
   background-color: #f3f5fe;
+  mix-blend-mode: multiply;
   cursor: pointer;
 }
 .ods-text-list-item-selectable .ods-checkbox__label,
@@ -3793,7 +3886,6 @@
 .ods-text-list-item {
   align-items: center;
   align-items: flex-start;
-  background-color: white;
   display: flex;
   flex-direction: column;
   padding: 16px;
@@ -3812,6 +3904,7 @@
 }
 .ods-text-list-item--with-action:hover, .ods-text-list-item--with-action:focus {
   background-color: #f3f5fe;
+  mix-blend-mode: multiply;
   cursor: pointer;
 }
 .ods-text-list-item--selectable {
@@ -5410,6 +5503,7 @@
 }
 .ods-card-list-item:hover:not(.ods-card-list-item--disabled, .ods-card-list-item--loading) {
   background-color: #f3f5fe;
+  mix-blend-mode: multiply;
 }
 .ods-card-list-item--disabled {
   cursor: not-allowed;
@@ -6152,6 +6246,16 @@
   flex-direction: column;
   min-width: 0;
 }
+.ods-content-list__indicator {
+  align-self: flex-start;
+  display: flex;
+}
+.ods-content-list__indicator--above {
+  margin-bottom: 8px;
+}
+.ods-content-list__indicator--below {
+  margin-top: 8px;
+}
 .ods-content-list .ods-typography__paragraph {
   color: #393b47;
 }
@@ -6247,8 +6351,6 @@
 }
 .ods-list-container__content {
   overflow: hidden;
-  position: relative;
-  z-index: 1;
 }
 .ods-list-container__content--card {
   border: 1px solid #e0e2ee;
@@ -6258,8 +6360,12 @@
   border-color: #f5456e;
 }
 .ods-list-container__content__divider {
+  border-color: #e0e2ee;
+  mix-blend-mode: multiply;
   border-bottom: 1px solid #e0e2ee;
-  margin: 0 16px;
+  margin: -1px 16px 0;
+  pointer-events: none;
+  position: relative;
 }
 .ods-list-container__highlight {
   border-radius: 0 0 8px 8px;
@@ -6269,7 +6375,7 @@
 
 .ods-list-action {
   align-items: center;
-  background-color: white;
+  background-color: transparent;
   border: 0;
   cursor: pointer;
   display: flex;
@@ -6289,8 +6395,9 @@
   min-width: 0;
   transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);
 }
-.ods-list-action:hover:not(.ods-list-action--disabled):not(.ods-list-action--loading):not(.ods-list-action--swipe-open) {
+.ods-list-action:hover:not(.ods-list-action--disabled):not(.ods-list-action--loading):not(.ods-list-action--swipe-open), .ods-list-action:focus-visible:not(.ods-list-action--disabled):not(.ods-list-action--loading):not(.ods-list-action--swipe-open) {
   background-color: #f3f5fe;
+  mix-blend-mode: multiply;
 }
 .ods-list-action:focus-visible {
   outline: 2px solid #0025e0;
@@ -6298,6 +6405,7 @@
 }
 .ods-list-action:active:not(.ods-list-action--disabled):not(.ods-list-action--loading):not(.ods-list-action--swipe-open) {
   background-color: #ced1e1;
+  mix-blend-mode: multiply;
 }
 .ods-list-action__position {
   align-items: center;
@@ -6371,7 +6479,6 @@
 
 .ods-list-readonly {
   align-items: center;
-  background-color: white;
   box-sizing: border-box;
   display: flex;
   gap: 12px;
@@ -6415,7 +6522,6 @@
 
 .ods-list-settings {
   align-items: center;
-  background-color: white;
   box-sizing: border-box;
   display: flex;
   gap: 12px;
@@ -6462,7 +6568,6 @@
 }
 
 .ods-list-expandable {
-  background-color: white;
   display: flex;
   flex-direction: column;
   min-width: 0;
@@ -6475,8 +6580,12 @@
   opacity: 0.6;
 }
 .ods-list-expandable__divider {
+  border-color: #e0e2ee;
+  mix-blend-mode: multiply;
   border-bottom: 1px solid #e0e2ee;
-  margin: 0 16px;
+  margin: -1px 16px 0;
+  pointer-events: none;
+  position: relative;
 }
 .ods-list-expandable--transaction .ods-list-expandable__icon {
   color: #aaadc0;
@@ -6544,15 +6653,16 @@
   border: 0;
   cursor: pointer;
   display: flex;
-  gap: 12px;
+  gap: 8px;
   min-width: 0;
   padding: 16px 8px 16px 16px;
   text-align: left;
   transition: background-color 0.2s ease;
   width: 100%;
 }
-.ods-list-expandable__main:hover:not(.ods-list-expandable--loading .ods-list-expandable__main) {
+.ods-list-expandable__main:hover:not(.ods-list-expandable--loading .ods-list-expandable__main), .ods-list-expandable__main:focus-visible:not(.ods-list-expandable--loading .ods-list-expandable__main) {
   background-color: #f3f5fe;
+  mix-blend-mode: multiply;
 }
 .ods-list-expandable__main:focus-visible {
   outline: 2px solid #0025e0;
@@ -6629,9 +6739,11 @@
 }
 .ods-list-expandable--expanded .ods-list-expandable__main:hover {
   background-color: #f3f5fe;
+  mix-blend-mode: multiply;
 }
 .ods-list-expandable--show-hover .ods-list-expandable__main {
   background-color: #f3f5fe;
+  mix-blend-mode: multiply;
 }
 
 .ods-list-selectable__indicator {
@@ -6643,13 +6755,13 @@
 .ods-list-selectable .ods-checkbox__root,
 .ods-list-selectable .ods-radio__root {
   align-items: center;
-  background-color: white;
   padding: 16px;
 }
 .ods-list-selectable .ods-checkbox__root:hover, .ods-list-selectable .ods-checkbox__root:focus,
 .ods-list-selectable .ods-radio__root:hover,
 .ods-list-selectable .ods-radio__root:focus {
   background-color: #f3f5fe;
+  mix-blend-mode: multiply;
   cursor: pointer;
 }
 .ods-list-selectable .ods-checkbox__label,
@@ -6852,10 +6964,6 @@
     padding: 8px;
   }
 }
-.ods-internal-contextual-hero__list > div > button,
-.ods-internal-contextual-hero__list > div > div {
-  background-color: transparent;
-}
 .ods-internal-contextual-hero__list-item {
   display: flex;
   gap: 8px;