fix: make text non selectable if inside a button

callstack · Dec 8, 2020 · 0bd2cab · 0bd2cab
1 parent 8e22993
commit 0bd2cab
Show file tree

Hide file tree

Showing 19 changed files with 85 additions and 0 deletions.
diff --git a/src/components/BottomNavigation.tsx b/src/components/BottomNavigation.tsx
@@ -962,6 +962,7 @@ class BottomNavigation extends React.Component<Props, State> {
                               })
                             ) : (
                               <Text
+                                selectable={false}
                                 style={[
                                   styles.label,
                                   { color: activeTintColor },
@@ -986,6 +987,7 @@ class BottomNavigation extends React.Component<Props, State> {
                                 })
                               ) : (
                                 <Text
+                                  selectable={false}
                                   style={[
                                     styles.label,
                                     { color: inactiveTintColor },

diff --git a/src/components/Button.tsx b/src/components/Button.tsx
@@ -291,6 +291,7 @@ const Button = ({
             />
           ) : null}
           <Text
+            selectable={false}
             numberOfLines={1}
             style={[
               styles.label,

diff --git a/src/components/Chip.tsx b/src/components/Chip.tsx
@@ -288,6 +288,7 @@ const Chip = ({
             </View>
           ) : null}
           <Text
+            selectable={false}
             numberOfLines={1}
             style={[
               styles.text,

diff --git a/src/components/Drawer/DrawerItem.tsx b/src/components/Drawer/DrawerItem.tsx
@@ -102,6 +102,7 @@ const DrawerItem = ({
         <View style={styles.wrapper}>
           {icon ? <Icon source={icon} size={24} color={contentColor} /> : null}
           <Text
+            selectable={false}
             numberOfLines={1}
             style={[
               styles.label,

diff --git a/src/components/FAB/FAB.tsx b/src/components/FAB/FAB.tsx
@@ -229,6 +229,7 @@ const FAB = ({
           ) : null}
           {label ? (
             <Text
+              selectable={false}
               style={[
                 styles.label,
                 uppercase && styles.uppercaseLabel,

diff --git a/src/components/List/ListAccordion.tsx b/src/components/List/ListAccordion.tsx
@@ -187,6 +187,7 @@ const ListAccordion = ({
             : null}
           <View style={[styles.item, styles.content]}>
             <Text
+              selectable={false}
               numberOfLines={titleNumberOfLines}
               style={[
                 styles.title,
@@ -200,6 +201,7 @@ const ListAccordion = ({
             </Text>
             {description && (
               <Text
+                selectable={false}
                 numberOfLines={descriptionNumberOfLines}
                 style={[
                   styles.description,

diff --git a/src/components/List/ListItem.tsx b/src/components/List/ListItem.tsx
@@ -16,6 +16,7 @@ import type { $RemoveChildren, EllipsizeProp } from '../../types';
 type Description =
   | React.ReactNode
   | ((props: {
+      selectable: boolean;
       ellipsizeMode: EllipsizeProp | undefined;
       color: string;
       fontSize: number;
@@ -144,12 +145,14 @@ const ListItem = ({
   ) => {
     return typeof description === 'function' ? (
       description({
+        selectable: false,
         ellipsizeMode: descriptionEllipsizeMode,
         color: descriptionColor,
         fontSize: styles.description.fontSize,
       })
     ) : (
       <Text
+        selectable={false}
         numberOfLines={descriptionNumberOfLines}
         ellipsizeMode={descriptionEllipsizeMode}
         style={[
@@ -186,6 +189,7 @@ const ListItem = ({
           : null}
         <View style={[styles.item, styles.content]}>
           <Text
+            selectable={false}
             ellipsizeMode={titleEllipsizeMode}
             numberOfLines={titleNumberOfLines}
             style={[styles.title, { color: titleColor }, titleStyle]}

diff --git a/src/components/Menu/MenuItem.tsx b/src/components/Menu/MenuItem.tsx
@@ -126,6 +126,7 @@ class MenuItem extends React.Component<Props> {
             pointerEvents="none"
           >
             <Text
+              selectable={false}
               numberOfLines={1}
               style={[styles.title, { color: titleColor }, titleStyle]}
             >

diff --git a/src/components/__tests__/__snapshots__/Banner.test.js.snap b/src/components/__tests__/__snapshots__/Banner.test.js.snap
@@ -231,6 +231,7 @@ exports[`renders visible banner, with action buttons and with image 1`] = `
             >
               <Text
                 numberOfLines={1}
+                selectable={false}
                 style={
                   Array [
                     Object {
@@ -411,6 +412,7 @@ exports[`renders visible banner, with action buttons and without image 1`] = `
             >
               <Text
                 numberOfLines={1}
+                selectable={false}
                 style={
                   Array [
                     Object {
@@ -506,6 +508,7 @@ exports[`renders visible banner, with action buttons and without image 1`] = `
             >
               <Text
                 numberOfLines={1}
+                selectable={false}
                 style={
                   Array [
                     Object {

diff --git a/src/components/__tests__/__snapshots__/BottomNavigation.test.js.snap b/src/components/__tests__/__snapshots__/BottomNavigation.test.js.snap
@@ -3164,6 +3164,7 @@ exports[`renders custom icon and label with custom colors in non-shifting bottom
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {
@@ -3201,6 +3202,7 @@ exports[`renders custom icon and label with custom colors in non-shifting bottom
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {
@@ -3432,6 +3434,7 @@ exports[`renders custom icon and label with custom colors in non-shifting bottom
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {
@@ -3469,6 +3472,7 @@ exports[`renders custom icon and label with custom colors in non-shifting bottom
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {
@@ -3700,6 +3704,7 @@ exports[`renders custom icon and label with custom colors in non-shifting bottom
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {
@@ -3737,6 +3742,7 @@ exports[`renders custom icon and label with custom colors in non-shifting bottom
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {
@@ -4098,6 +4104,7 @@ exports[`renders custom icon and label with custom colors in shifting bottom nav
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {
@@ -4329,6 +4336,7 @@ exports[`renders custom icon and label with custom colors in shifting bottom nav
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {
@@ -4560,6 +4568,7 @@ exports[`renders custom icon and label with custom colors in shifting bottom nav
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {
@@ -4901,6 +4910,7 @@ exports[`renders non-shifting bottom navigation 1`] = `
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {
@@ -4938,6 +4948,7 @@ exports[`renders non-shifting bottom navigation 1`] = `
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {
@@ -5169,6 +5180,7 @@ exports[`renders non-shifting bottom navigation 1`] = `
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {
@@ -5206,6 +5218,7 @@ exports[`renders non-shifting bottom navigation 1`] = `
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {
@@ -5437,6 +5450,7 @@ exports[`renders non-shifting bottom navigation 1`] = `
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {
@@ -5474,6 +5488,7 @@ exports[`renders non-shifting bottom navigation 1`] = `
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {
@@ -5835,6 +5850,7 @@ exports[`renders shifting bottom navigation 1`] = `
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {
@@ -6066,6 +6082,7 @@ exports[`renders shifting bottom navigation 1`] = `
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {
@@ -6297,6 +6314,7 @@ exports[`renders shifting bottom navigation 1`] = `
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {
@@ -6528,6 +6546,7 @@ exports[`renders shifting bottom navigation 1`] = `
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {
@@ -6759,6 +6778,7 @@ exports[`renders shifting bottom navigation 1`] = `
                 }
               >
                 <Text
+                  selectable={false}
                   style={
                     Array [
                       Object {

diff --git a/src/components/__tests__/__snapshots__/Button.test.js.snap b/src/components/__tests__/__snapshots__/Button.test.js.snap
@@ -55,6 +55,7 @@ exports[`renders button with color 1`] = `
     >
       <Text
         numberOfLines={1}
+        selectable={false}
         style={
           Array [
             Object {
@@ -151,6 +152,7 @@ exports[`renders button with custom testID 1`] = `
     >
       <Text
         numberOfLines={1}
+        selectable={false}
         style={
           Array [
             Object {
@@ -290,6 +292,7 @@ exports[`renders button with icon 1`] = `
       </View>
       <Text
         numberOfLines={1}
+        selectable={false}
         style={
           Array [
             Object {
@@ -431,6 +434,7 @@ exports[`renders button with icon in reverse order 1`] = `
       </View>
       <Text
         numberOfLines={1}
+        selectable={false}
         style={
           Array [
             Object {
@@ -533,6 +537,7 @@ exports[`renders contained contained with mode 1`] = `
     >
       <Text
         numberOfLines={1}
+        selectable={false}
         style={
           Array [
             Object {
@@ -628,6 +633,7 @@ exports[`renders disabled button 1`] = `
     >
       <Text
         numberOfLines={1}
+        selectable={false}
         style={
           Array [
             Object {
@@ -908,6 +914,7 @@ exports[`renders loading button 1`] = `
       </View>
       <Text
         numberOfLines={1}
+        selectable={false}
         style={
           Array [
             Object {
@@ -1003,6 +1010,7 @@ exports[`renders outlined button with mode 1`] = `
     >
       <Text
         numberOfLines={1}
+        selectable={false}
         style={
           Array [
             Object {
@@ -1098,6 +1106,7 @@ exports[`renders text button by default 1`] = `
     >
       <Text
         numberOfLines={1}
+        selectable={false}
         style={
           Array [
             Object {
@@ -1193,6 +1202,7 @@ exports[`renders text button with mode 1`] = `
     >
       <Text
         numberOfLines={1}
+        selectable={false}
         style={
           Array [
             Object {