fix(input): update label and text style to scale

PhillipsAuctionHouse · Nov 13, 2024 · 5985308 · 5985308
1 parent f154330
commit 5985308
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 3 deletions.
diff --git a/src/components/Input/_input.scss b/src/components/Input/_input.scss
@@ -14,8 +14,8 @@ $lg: #{$px}-input--lg;
   }
 
   &__label {
-    color: $pure-black;
-    font-size: 0.75rem;
+    @include text($body2);
+
     font-variation-settings: 'wght' 600;
     margin-bottom: 0.5rem;
     word-break: break-word;
@@ -26,10 +26,11 @@ $lg: #{$px}-input--lg;
   }
 
   &__input {
+    @include text($body2);
+
     accent-color: $soft-black;
     border: 1px solid $keyline-gray;
     border-radius: 0.1875rem;
-    font-size: 0.8125rem;
     font-variation-settings: 'wght' 600;
     margin-bottom: 0.25rem;
     padding: $padding-xsm;

diff --git a/src/patterns/DetailList/utils.test.tsx b/src/patterns/DetailList/utils.test.tsx
@@ -16,4 +16,8 @@ describe('getDetailKey', () => {
     const child = 'Not a valid element';
     expect(getDetailKey(child, 0)).toBe('detail-0');
   });
+  it('should return a key if passed directly', () => {
+    const child = <Detail {...props} key="custom-key" />;
+    expect(getDetailKey(child, 0)).toBe('custom-key');
+  });
 });
diff --git a/src/patterns/DetailList/utils.tsx b/src/patterns/DetailList/utils.tsx
@@ -3,6 +3,9 @@ import { DetailComponent, DetailProps } from '../../components/Detail';
 
 export const getDetailKey = (child: DetailComponent, index: number) => {
   if (isValidElement(child)) {
+    if (child.key) {
+      return child.key;
+    }
     const { label, value } = child.props as DetailProps;
     return `detail-${label}-${value}`;
   }