From 0fae03099645bd9d3795709175640583b08dfc3d Mon Sep 17 00:00:00 2001
From: romanhotsiy <gotsijroman@gmail.com>
Date: Fri, 16 Oct 2020 17:41:35 +0300
Subject: [PATCH] feat: new extensions hook PropertyDetailsCell + wrap property
 name into span

---
 src/common-elements/fields-layout.ts | 2 ++
 src/components/Fields/Field.tsx      | 4 ++--
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/common-elements/fields-layout.ts b/src/common-elements/fields-layout.ts
index e6985f15..5b9a578f 100644
--- a/src/common-elements/fields-layout.ts
+++ b/src/common-elements/fields-layout.ts
@@ -98,6 +98,8 @@ export const PropertyDetailsCell = styled.td`
       border-left: none;
     }
   `}
+
+  ${extensionsHook('PropertyDetailsCell')};
 `;
 
 export const PropertyBullet = styled.span`
diff --git a/src/components/Fields/Field.tsx b/src/components/Fields/Field.tsx
index 53bedc77..3f18b225 100644
--- a/src/components/Fields/Field.tsx
+++ b/src/components/Fields/Field.tsx
@@ -64,7 +64,7 @@ export class Field extends React.Component<FieldProps> {
           onKeyPress={this.handleKeyPress}
           aria-label="expand properties"
         >
-          {name}
+          <span>{name}</span>
           <ShelfIcon direction={expanded ? 'down' : 'right'} />
         </button>
         {required && <RequiredLabel> required </RequiredLabel>}
@@ -72,7 +72,7 @@ export class Field extends React.Component<FieldProps> {
     ) : (
       <PropertyNameCell className={deprecated ? 'deprecated' : undefined} kind={kind} title={name}>
         <PropertyBullet />
-        {name}
+        <span>{name}</span>
         {required && <RequiredLabel> required </RequiredLabel>}
       </PropertyNameCell>
     );