@transferwise/components 0.0.0-experimental-d7dd655 → 0.0.0-experimental-2d87676

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@transferwise/components",
-  "version": "0.0.0-experimental-d7dd655",
+  "version": "0.0.0-experimental-2d87676",
   "description": "Neptune React components",
   "license": "Apache-2.0",
   "repository": {
@@ -85,8 +85,8 @@
     "storybook": "^10.2.0-alpha.13",
     "storybook-addon-tag-badges": "^3.0.4",
     "storybook-addon-test-codegen": "^3.0.1",
-    "@transferwise/less-config": "3.1.2",
     "@transferwise/neptune-css": "14.26.1",
+    "@transferwise/less-config": "3.1.2",
     "@wise/components-theming": "1.10.1",
     "@wise/wds-configs": "0.0.0"
   },

package/src/avatarLayout/AvatarLayout.story.tsx

@@ -286,8 +286,11 @@ export const EdgeInstances: Story = {
 };
 
 /**
- * Like [AvatarView](?path=/docs/content-avatarview--docs#sentiment-awareness), `AvatarLayout` is sentiment-aware and will automatically adjust its colours if wrapped inside the
+ * Like [AvatarView](?path=/docs/content-avatarview--docs#sentiment-awareness), `AvatarLayout` is sentiment-aware (note: not all features are supported) and will automatically adjust its colours if wrapped inside the
  * [SentimentSurface](?path=/docs/content-sentimentsurface--docs) component.
+ * 
+ * Features like: `interactive` are not supported.
+ * Also `AvatarLayout` isn't supported on `"elevated"` state of `SentimentSurface`.
  */
 export const SentimentAwareness: Story = {
   parameters: {
@@ -300,21 +303,19 @@ export const SentimentAwareness: Story = {
   render: (args) => (
     <>
       {(['success', 'warning', 'negative', 'neutral', 'proposition'] as const).map((sentiment) =>
-        (['base', 'elevated'] as const).map((emphasis) => (
-          <SentimentSurface
-            key={`${sentiment}-${emphasis}`}
-            sentiment={sentiment}
-            emphasis={emphasis}
-            className="p-a-1 d-flex"
-            style={{ gap: 'var(--size-16)' }}
-          >
-            <AvatarLayout avatars={[{ asset: <Freeze /> }, { asset: <Freeze /> }]} />
-            <AvatarLayout
-              orientation="diagonal"
-              avatars={[{ asset: <Freeze /> }, { asset: <Freeze /> }]}
-            />
-          </SentimentSurface>
-        )),
+        <SentimentSurface
+          key={`${sentiment}-base`}
+          sentiment={sentiment}
+          emphasis="base"
+          className="p-a-1 d-flex"
+          style={{ gap: 'var(--size-16)' }}
+        >
+          <AvatarLayout avatars={[{ asset: <Freeze /> }, { asset: <Freeze /> }]} />
+          <AvatarLayout
+            orientation="diagonal"
+            avatars={[{ asset: <Freeze /> }, { asset: <Freeze /> }]}
+          />
+        </SentimentSurface>
       )}
     </>
   ),

package/src/avatarView/AvatarView.story.tsx

@@ -438,8 +438,11 @@ export const Profiles: Story = {
 };
 
 /**
- * `AvatarView` is sentiment-aware and will automatically adjust its colours if wrapped inside the
+ * `AvatarView` is sentiment-aware (note: not all features are supported) and will automatically adjust its colours if wrapped inside the
  * [SentimentSurface](?path=/docs/content-sentimentsurface--docs) component.
+ * 
+ * Features like `online`, `notification`, `selected`, and `interactive` are not supported.
+ * Also `AvatarView` isn't supported on `"elevated"` state of `SentimentSurface`.
  */
 export const SentimentAwareness: Story = {
   parameters: {