Skip to content

Commit e3e741a

Browse files
bengotowbengotow
committed
Fix issues with new stricter aria- eslint rules
1 parent fda7d89 commit e3e741a

File tree

4 files changed

+44
-40
lines changed

4 files changed

+44
-40
lines changed

‎app/internal_packages/composer-signature/lib/signature-photo-picker.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -170,7 +170,7 @@ export default class SignaturePhotoPicker extends React.Component<
170170

171171
return (
172172
<div className="field photo-picker">
173-
<label>Picture</label>
173+
<label htmlFor="photoURL">Picture</label>
174174
<div style={{ display: 'flex' }}>
175175
{isUploadEnabled && (
176176
<div>

‎app/internal_packages/contacts/lib/ContactDetailEdit.tsx‎

Lines changed: 8 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -289,15 +289,14 @@ export class ContactDetailEdit extends React.Component<{
289289
</label>
290290
</div>
291291
<div className="contact-edit-field" style={{ flex: 0.7 }}>
292-
<label>
293-
Type
294-
<TypeaheadFreeInput
295-
placeholder="Label"
296-
suggestions={BaseTypes}
297-
value={item.type || ''}
298-
onChange={e => onChange({ type: e.currentTarget.value })}
299-
/>
300-
</label>
292+
<span aria-hidden="true" className="form-spacer" />
293+
<TypeaheadFreeInput
294+
aria-label="Type"
295+
placeholder="Label"
296+
suggestions={BaseTypes}
297+
value={item.type || ''}
298+
onChange={e => onChange({ type: e.currentTarget.value })}
299+
/>
301300
</div>
302301
</div>
303302
)}

‎app/internal_packages/contacts/lib/ContactDetailRead.tsx‎

Lines changed: 29 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -74,18 +74,18 @@ const ContactAttributes = ({
7474
<div className="contact-attributes-section">
7575
{data.nicknames.map((item, idx) => (
7676
<div className="contact-attribute" key={idx}>
77-
<label></label>
78-
<div>{`“${item.value}”`}</div>
77+
<span aria-hidden="true"></span>
78+
<div>{`”${item.value}”`}</div>
7979
</div>
8080
))}
8181
</div>
8282
)}
8383
{(data.title || data.company) && (
8484
<div className="contact-attributes-section">
8585
<div className="contact-attribute">
86-
<label>
86+
<span aria-hidden="true">
8787
<Icons.Briefcase />
88-
</label>
88+
</span>
8989
<div>{`${data.title ? `${data.title}, ` : ''}${data.company}`}</div>
9090
</div>
9191
</div>
@@ -94,9 +94,9 @@ const ContactAttributes = ({
9494
<div className="contact-attributes-section">
9595
{data.emailAddresses.map((item, idx) => (
9696
<div className="contact-attribute" key={idx}>
97-
<label>
97+
<span aria-hidden="true">
9898
<Icons.Envelope />
99-
</label>
99+
</span>
100100
<div>
101101
<a href={`mailto:${item.value}`} title="Send email...">
102102
{item.value}
@@ -111,9 +111,9 @@ const ContactAttributes = ({
111111
<div className="contact-attributes-section">
112112
{data.phoneNumbers.map((item, idx) => (
113113
<div className="contact-attribute" key={idx}>
114-
<label>
114+
<span aria-hidden="true">
115115
<Icons.Phone />
116-
</label>
116+
</span>
117117
<div>
118118
<a href={`tel:${item.value}`} title="Call...">
119119
{item.value}
@@ -128,9 +128,9 @@ const ContactAttributes = ({
128128
<div className="contact-attributes-section">
129129
{data.addresses.map((item, idx) => (
130130
<div className="contact-attribute" key={idx}>
131-
<label>
131+
<span aria-hidden="true">
132132
<Icons.Map />
133-
</label>
133+
</span>
134134
<div>
135135
<a href={`https://maps.google.com/?q=${encodeURIComponent(item.formattedValue)}`}>
136136
{item.formattedValue}
@@ -145,16 +145,23 @@ const ContactAttributes = ({
145145
<div className="contact-attributes-section">
146146
{data.birthdays.map((item, idx) => (
147147
<div className="contact-attribute" key={idx}>
148-
<label>
148+
<span aria-hidden="true">
149149
<Icons.Crown />
150-
</label>
150+
</span>
151151
<div>
152152
{item.date
153153
? item.date.year
154-
? new Date(item.date.year, item.date.month - 1, item.date.day).toLocaleDateString()
155-
: new Date(new Date().getFullYear(), item.date.month - 1, item.date.day).toLocaleDateString(undefined, { month: 'numeric', day: 'numeric' })
156-
: ''
157-
}
154+
? new Date(
155+
item.date.year,
156+
item.date.month - 1,
157+
item.date.day
158+
).toLocaleDateString()
159+
: new Date(
160+
new Date().getFullYear(),
161+
item.date.month - 1,
162+
item.date.day
163+
).toLocaleDateString(undefined, { month: 'numeric', day: 'numeric' })
164+
: ''}
158165
</div>
159166
</div>
160167
))}
@@ -164,9 +171,9 @@ const ContactAttributes = ({
164171
<div className="contact-attributes-section">
165172
{data.relations.map((item, idx) => (
166173
<div className="contact-attribute" key={idx}>
167-
<label>
174+
<span aria-hidden="true">
168175
<Icons.People />
169-
</label>
176+
</span>
170177
<div>
171178
{item.person}
172179
{item.type && <div className="type">{item.type}</div>}
@@ -179,9 +186,9 @@ const ContactAttributes = ({
179186
<div className="contact-attributes-section">
180187
{data.urls.map((item, idx) => (
181188
<div className="contact-attribute" key={idx}>
182-
<label>
189+
<span aria-hidden="true">
183190
<Icons.Link />
184-
</label>
191+
</span>
185192
<div>
186193
<a href={`${item.value}`} title="Visit website...">
187194
{item.value}
@@ -195,9 +202,9 @@ const ContactAttributes = ({
195202
{data.notes && (
196203
<div className="contact-attributes-section">
197204
<div className="contact-attribute">
198-
<label>
205+
<span aria-hidden="true">
199206
<Icons.Note />
200-
</label>
207+
</span>
201208
<div style={{ whiteSpace: 'pre-wrap' }}>{data.notes}</div>
202209
</div>
203210
</div>

‎app/src/components/composer-editor/grammar-check-plugins.tsx‎

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -142,20 +142,18 @@ function offsetToSlateRange(
142142
length: number
143143
): { startKey: string; startOffset: number; endKey: string; endOffset: number } | null {
144144
let charsSoFar = 0;
145-
let startKey: string | undefined;
146-
let startOffset: number | undefined;
145+
let start: { key: string; offset: number } | undefined;
147146

148147
for (const text of texts) {
149148
const textLength = text.text.length;
150149

151-
if (startKey === undefined && charsSoFar + textLength > offset) {
152-
startKey = text.key;
153-
startOffset = offset - charsSoFar;
150+
if (!start && charsSoFar + textLength > offset) {
151+
start = { key: text.key, offset: offset - charsSoFar };
154152
}
155-
if (startKey !== undefined && charsSoFar + textLength >= offset + length) {
153+
if (start && charsSoFar + textLength >= offset + length) {
156154
return {
157-
startKey,
158-
startOffset: startOffset!,
155+
startKey: start.key,
156+
startOffset: start.offset,
159157
endKey: text.key,
160158
endOffset: offset + length - charsSoFar,
161159
};

0 commit comments

Comments
 (0)