docs(examples): set pointerEvents to "none" on select button

francoischalifour · francoischalifour · commit a935c1481309 · 2021-04-29T15:08:29.000+02:00
diff --git a/cypress/test-apps/js/app.tsx b/cypress/test-apps/js/app.tsx
@@ -147,6 +147,7 @@ function ProductItem({ hit, insights, components }: ProductItemProps) {
           className="aa-ItemActionButton aa-DesktopOnly aa-ActiveOnly"
           type="button"
           title="Select"
+          style={{ pointerEvents: 'none' }}
         >
           <svg viewBox="0 0 24 24" width="20" height="20" fill="currentColor">
             <path d="M18.984 6.984h2.016v6h-15.188l3.609 3.609-1.406 1.406-6-6 6-6 1.406 1.406-3.609 3.609h13.172v-4.031z" />
diff --git a/examples/github-repositories-custom-plugin/createGitHubReposPlugin.tsx b/examples/github-repositories-custom-plugin/createGitHubReposPlugin.tsx
@@ -130,6 +130,7 @@ export function createGitHubReposPlugin(
                           className="aa-ItemActionButton aa-DesktopOnly aa-ActiveOnly"
                           type="button"
                           title="Select"
+                          style={{ pointerEvents: 'none' }}
                         >
                           <svg
                             viewBox="0 0 24 24"
diff --git a/examples/playground/app.tsx b/examples/playground/app.tsx
@@ -284,9 +284,7 @@ function ProductItem({ hit, insights, components }: ProductItemProps) {
           type="button"
           title="Select"
           disabled={true}
-          style={{
-            pointerEvents: 'none',
-          }}
+          style={{ pointerEvents: 'none' }}
         >
           <svg viewBox="0 0 24 24" fill="currentColor">
             <path d="M18.984 6.984h2.016v6h-15.188l3.609 3.609-1.406 1.406-6-6 6-6 1.406 1.406-3.609 3.609h13.172v-4.031z" />
diff --git a/examples/query-suggestions-with-hits/app.tsx b/examples/query-suggestions-with-hits/app.tsx
@@ -148,6 +148,7 @@ function ProductItem({ hit, insights, components }: ProductItemProps) {
           className="aa-ItemActionButton aa-DesktopOnly aa-ActiveOnly"
           type="button"
           title="Select"
+          style={{ pointerEvents: 'none' }}
         >
           <svg viewBox="0 0 24 24" width="20" height="20" fill="currentColor">
             <path d="M18.984 6.984h2.016v6h-15.188l3.609 3.609-1.406 1.406-6-6 6-6 1.406 1.406-3.609 3.609h13.172v-4.031z" />
diff --git a/examples/react-renderer/src/Autocomplete.tsx b/examples/react-renderer/src/Autocomplete.tsx
@@ -192,6 +192,7 @@ export function Autocomplete(
                                   className="aa-ItemActionButton aa-DesktopOnly aa-ActiveOnly"
                                   type="button"
                                   title="Select"
+                                  style={{ pointerEvents: 'none' }}
                                 >
                                   <svg fill="currentColor" viewBox="0 0 24 24">
                                     <path d="M18.984 6.984h2.016v6h-15.188l3.609 3.609-1.406 1.406-6-6 6-6 1.406 1.406-3.609 3.609h13.172v-4.031z" />
diff --git a/examples/recently-viewed-items/app.tsx b/examples/recently-viewed-items/app.tsx
@@ -104,6 +104,7 @@ function AutocompleteProductItem({ hit, components }: ProductItemProps) {
           className="aa-ItemActionButton aa-DesktopOnly aa-ActiveOnly"
           type="button"
           title="Select"
+          style={{ pointerEvents: 'none' }}
         >
           <svg viewBox="0 0 24 24" width="20" height="20" fill="currentColor">
             <path d="M18.984 6.984h2.016v6h-15.188l3.609 3.609-1.406 1.406-6-6 6-6 1.406 1.406-3.609 3.609h13.172v-4.031z" />
diff --git a/packages/website/docs/sending-algolia-insights-events.md b/packages/website/docs/sending-algolia-insights-events.md
@@ -95,6 +95,7 @@ function ProductItem({ hit, components }) {
         className="aa-ItemActionButton aa-DesktopOnly aa-ActiveOnly"
         type="button"
         title="Select"
+        style={{ pointerEvents: 'none' }}
       >
         <svg fill="currentColor" viewBox="0 0 24 24" width="20" height="20">
           <path d="M18.984 6.984h2.016v6h-15.188l3.609 3.609-1.406 1.406-6-6 6-6 1.406 1.406-3.609 3.609h13.172v-4.031z"></path>
diff --git a/packages/website/src/components/AutocompleteProduct.tsx b/packages/website/src/components/AutocompleteProduct.tsx
@@ -39,6 +39,7 @@ export function AutocompleteProduct({
         className="aa-ItemActionButton aa-DesktopOnly aa-ActiveOnly"
         type="button"
         title="Select"
+        style={{ pointerEvents: 'none' }}
       >
         <svg fill="currentColor" viewBox="0 0 24 24" width="20" height="20">
           <path d="M18.984 6.984h2.016v6h-15.188l3.609 3.609-1.406 1.406-6-6 6-6 1.406 1.406-3.609 3.609h13.172v-4.031z"></path>
diff --git a/packages/website/src/components/productsPlugin.tsx b/packages/website/src/components/productsPlugin.tsx
@@ -96,6 +96,7 @@ function ProductItem({ hit, components }: ProductItemProps) {
           className="aa-ItemActionButton aa-DesktopOnly aa-ActiveOnly"
           type="button"
           title="Select"
+          style={{ pointerEvents: 'none' }}
         >
           <svg viewBox="0 0 24 24" width="20" height="20" fill="currentColor">
             <path d="M18.984 6.984h2.016v6h-15.188l3.609 3.609-1.406 1.406-6-6 6-6 1.406 1.406-3.609 3.609h13.172v-4.031z" />

Original file line number	Diff line number	Diff line change
`@@ -147,6 +147,7 @@ function ProductItem({ hit, insights, components }: ProductItemProps) {`
`147`	`147`	`className="aa-ItemActionButton aa-DesktopOnly aa-ActiveOnly"`
`148`	`148`	`type="button"`
`149`	`149`	`title="Select"`
	`150`	`+ style={{ pointerEvents: 'none' }}`
`150`	`151`	`>`
`151`	`152`	`<svg viewBox="0 0 24 24" width="20" height="20" fill="currentColor">`
`152`	`153`	`<path d="M18.984 6.984h2.016v6h-15.188l3.609 3.609-1.406 1.406-6-6 6-6 1.406 1.406-3.609 3.609h13.172v-4.031z" />`
Original file line number	Diff line number	Diff line change
`@@ -130,6 +130,7 @@ export function createGitHubReposPlugin(`
`130`	`130`	`className="aa-ItemActionButton aa-DesktopOnly aa-ActiveOnly"`
`131`	`131`	`type="button"`
`132`	`132`	`title="Select"`
	`133`	`+ style={{ pointerEvents: 'none' }}`
`133`	`134`	`>`
`134`	`135`	`<svg`
`135`	`136`	`viewBox="0 0 24 24"`
Original file line number	Diff line number	Diff line change
`@@ -148,6 +148,7 @@ function ProductItem({ hit, insights, components }: ProductItemProps) {`
`148`	`148`	`className="aa-ItemActionButton aa-DesktopOnly aa-ActiveOnly"`
`149`	`149`	`type="button"`
`150`	`150`	`title="Select"`
	`151`	`+ style={{ pointerEvents: 'none' }}`
`151`	`152`	`>`
`152`	`153`	`<svg viewBox="0 0 24 24" width="20" height="20" fill="currentColor">`
`153`	`154`	`<path d="M18.984 6.984h2.016v6h-15.188l3.609 3.609-1.406 1.406-6-6 6-6 1.406 1.406-3.609 3.609h13.172v-4.031z" />`
Original file line number	Diff line number	Diff line change
`@@ -192,6 +192,7 @@ export function Autocomplete(`
`192`	`192`	`className="aa-ItemActionButton aa-DesktopOnly aa-ActiveOnly"`
`193`	`193`	`type="button"`
`194`	`194`	`title="Select"`
	`195`	`+ style={{ pointerEvents: 'none' }}`
`195`	`196`	`>`
`196`	`197`	`<svg fill="currentColor" viewBox="0 0 24 24">`
`197`	`198`	`<path d="M18.984 6.984h2.016v6h-15.188l3.609 3.609-1.406 1.406-6-6 6-6 1.406 1.406-3.609 3.609h13.172v-4.031z" />`
Original file line number	Diff line number	Diff line change
`@@ -104,6 +104,7 @@ function AutocompleteProductItem({ hit, components }: ProductItemProps) {`
`104`	`104`	`className="aa-ItemActionButton aa-DesktopOnly aa-ActiveOnly"`
`105`	`105`	`type="button"`
`106`	`106`	`title="Select"`
	`107`	`+ style={{ pointerEvents: 'none' }}`
`107`	`108`	`>`
`108`	`109`	`<svg viewBox="0 0 24 24" width="20" height="20" fill="currentColor">`
`109`	`110`	`<path d="M18.984 6.984h2.016v6h-15.188l3.609 3.609-1.406 1.406-6-6 6-6 1.406 1.406-3.609 3.609h13.172v-4.031z" />`
Original file line number	Diff line number	Diff line change
`@@ -95,6 +95,7 @@ function ProductItem({ hit, components }) {`
`95`	`95`	`className="aa-ItemActionButton aa-DesktopOnly aa-ActiveOnly"`
`96`	`96`	`type="button"`
`97`	`97`	`title="Select"`
	`98`	`+ style={{ pointerEvents: 'none' }}`
`98`	`99`	`>`
`99`	`100`	`<svg fill="currentColor" viewBox="0 0 24 24" width="20" height="20">`
`100`	`101`	`<path d="M18.984 6.984h2.016v6h-15.188l3.609 3.609-1.406 1.406-6-6 6-6 1.406 1.406-3.609 3.609h13.172v-4.031z"></path>`
Original file line number	Diff line number	Diff line change
`@@ -39,6 +39,7 @@ export function AutocompleteProduct({`
`39`	`39`	`className="aa-ItemActionButton aa-DesktopOnly aa-ActiveOnly"`
`40`	`40`	`type="button"`
`41`	`41`	`title="Select"`
	`42`	`+ style={{ pointerEvents: 'none' }}`
`42`	`43`	`>`
`43`	`44`	`<svg fill="currentColor" viewBox="0 0 24 24" width="20" height="20">`
`44`	`45`	`<path d="M18.984 6.984h2.016v6h-15.188l3.609 3.609-1.406 1.406-6-6 6-6 1.406 1.406-3.609 3.609h13.172v-4.031z"></path>`
Original file line number	Diff line number	Diff line change
`@@ -96,6 +96,7 @@ function ProductItem({ hit, components }: ProductItemProps) {`
`96`	`96`	`className="aa-ItemActionButton aa-DesktopOnly aa-ActiveOnly"`
`97`	`97`	`type="button"`
`98`	`98`	`title="Select"`
	`99`	`+ style={{ pointerEvents: 'none' }}`
`99`	`100`	`>`
`100`	`101`	`<svg viewBox="0 0 24 24" width="20" height="20" fill="currentColor">`
`101`	`102`	`<path d="M18.984 6.984h2.016v6h-15.188l3.609 3.609-1.406 1.406-6-6 6-6 1.406 1.406-3.609 3.609h13.172v-4.031z" />`