Skip to content

Commit

Permalink
fix: wrapperRef
Browse files Browse the repository at this point in the history
  • Loading branch information
faustoq committed Oct 11, 2024
1 parent be59847 commit bd1e0f7
Show file tree
Hide file tree
Showing 6 changed files with 13 additions and 13 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@
| `linksTarget` | `links-target` | | `string` | `'_blank'` |
| `sourceBaseURL` | `source-base-u-r-l` | | `string` | `''` |
| `sources` | `sources` | | `any` | `undefined` |
| `sourcesMap` | -- | | `{ title?: string; description?: string; path?: string; }` | `{ title: 'title', description: 'description', path: 'path', }` |
| `sourcesMap` | -- | | `{ title?: string; path?: string; description?: string; }` | `{ title: 'title', description: 'description', path: 'path', }` |


## Events
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
| `placeholder` | `placeholder` | | `string` | `'Ask me anything'` |
| `showClearChat` | `show-clear-chat` | | `boolean` | `true` |
| `sourceBaseUrl` | `source-base-url` | | `string` | `''` |
| `sourcesMap` | -- | | `{ title?: string; description?: string; path?: string; }` | `undefined` |
| `sourcesMap` | -- | | `{ title?: string; path?: string; description?: string; }` | `undefined` |
| `suggestions` | -- | | `string[]` | `undefined` |


Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
| Property | Attribute | Description | Type | Default |
| ------------- | --------- | ----------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| `class` | `class` | | `string` | `undefined` |
| `colorScheme` | -- | | `{ readonly [x: number]: string; small: () => string; [Symbol.iterator]: () => IterableIterator<string>; toString: () => string; charAt: (pos: number) => string; charCodeAt: (index: number) => number; concat: (...strings: string[]) => string; indexOf: (searchString: string, position?: number) => number; lastIndexOf: (searchString: string, position?: number) => number; localeCompare: { (that: string): number; (that: string, locales?: string \| string[], options?: CollatorOptions): number; (that: string, locales?: LocalesArgument, options?: CollatorOptions): number; }; match: { (regexp: string \| RegExp): RegExpMatchArray; (matcher: { [Symbol.match](string: string): RegExpMatchArray; }): RegExpMatchArray; }; replace: { (searchValue: string \| RegExp, replaceValue: string): string; (searchValue: string \| RegExp, replacer: (substring: string, ...args: any[]) => string): string; (searchValue: { [Symbol.replace](string: string, replaceValue: string): string; }, replaceValue: string): string; (searchValue: { [Symbol.replace](string: string, replacer: (substring: string, ...args: any[]) => string): string; }, replacer: (substring: string, ...args: any[]) => string): string; }; search: { (regexp: string \| RegExp): number; (searcher: { [Symbol.search](string: string): number; }): number; }; slice: (start?: number, end?: number) => string; split: { (separator: string \| RegExp, limit?: number): string[]; (splitter: { [Symbol.split](string: string, limit?: number): string[]; }, limit?: number): string[]; }; substring: (start: number, end?: number) => string; toLowerCase: () => string; toLocaleLowerCase: { (locales?: string \| string[]): string; (locales?: LocalesArgument): string; }; toUpperCase: () => string; toLocaleUpperCase: { (locales?: string \| string[]): string; (locales?: LocalesArgument): string; }; trim: () => string; readonly length: number; substr: (from: number, length?: number) => string; valueOf: () => string; codePointAt: (pos: number) => number; includes: (searchString: string, position?: number) => boolean; endsWith: (searchString: string, endPosition?: number) => boolean; normalize: { (form: "NFC" \| "NFD" \| "NFKC" \| "NFKD"): string; (form?: string): string; }; repeat: (count: number) => string; startsWith: (searchString: string, position?: number) => boolean; anchor: (name: string) => string; big: () => string; blink: () => string; bold: () => string; fixed: () => string; fontcolor: (color: string) => string; fontsize: { (size: number): string; (size: string): string; }; italics: () => string; link: (url: string) => string; strike: () => string; sub: () => string; sup: () => string; padStart: (maxLength: number, fillString?: string) => string; padEnd: (maxLength: number, fillString?: string) => string; trimEnd: () => string; trimStart: () => string; trimLeft: () => string; trimRight: () => string; matchAll: (regexp: RegExp) => IterableIterator<RegExpExecArray>; at: (index: number) => string; }` | `'light'` |
| `colorScheme` | -- | | `{ readonly [x: number]: string; [Symbol.iterator]: () => IterableIterator<string>; readonly length: number; toString: () => string; concat: (...strings: string[]) => string; slice: (start?: number, end?: number) => string; indexOf: (searchString: string, position?: number) => number; lastIndexOf: (searchString: string, position?: number) => number; includes: (searchString: string, position?: number) => boolean; at: (index: number) => string; big: () => string; link: (url: string) => string; small: () => string; sub: () => string; sup: () => string; replace: { (searchValue: string \| RegExp, replaceValue: string): string; (searchValue: string \| RegExp, replacer: (substring: string, ...args: any[]) => string): string; (searchValue: { [Symbol.replace](string: string, replaceValue: string): string; }, replaceValue: string): string; (searchValue: { [Symbol.replace](string: string, replacer: (substring: string, ...args: any[]) => string): string; }, replacer: (substring: string, ...args: any[]) => string): string; }; normalize: { (form: "NFC" \| "NFD" \| "NFKC" \| "NFKD"): string; (form?: string): string; }; charAt: (pos: number) => string; charCodeAt: (index: number) => number; localeCompare: { (that: string): number; (that: string, locales?: string \| string[], options?: CollatorOptions): number; (that: string, locales?: LocalesArgument, options?: CollatorOptions): number; }; match: { (regexp: string \| RegExp): RegExpMatchArray; (matcher: { [Symbol.match](string: string): RegExpMatchArray; }): RegExpMatchArray; }; search: { (regexp: string \| RegExp): number; (searcher: { [Symbol.search](string: string): number; }): number; }; split: { (separator: string \| RegExp, limit?: number): string[]; (splitter: { [Symbol.split](string: string, limit?: number): string[]; }, limit?: number): string[]; }; substring: (start: number, end?: number) => string; toLowerCase: () => string; toLocaleLowerCase: { (locales?: string \| string[]): string; (locales?: LocalesArgument): string; }; toUpperCase: () => string; toLocaleUpperCase: { (locales?: string \| string[]): string; (locales?: LocalesArgument): string; }; trim: () => string; substr: (from: number, length?: number) => string; codePointAt: (pos: number) => number; endsWith: (searchString: string, endPosition?: number) => boolean; repeat: (count: number) => string; startsWith: (searchString: string, position?: number) => boolean; anchor: (name: string) => string; blink: () => string; bold: () => string; fixed: () => string; fontcolor: (color: string) => string; fontsize: { (size: number): string; (size: string): string; }; italics: () => string; strike: () => string; padStart: (maxLength: number, fillString?: string) => string; padEnd: (maxLength: number, fillString?: string) => string; trimEnd: () => string; trimStart: () => string; trimLeft: () => string; trimRight: () => string; matchAll: (regexp: RegExp) => IterableIterator<RegExpExecArray>; valueOf: () => string; }` | `'light'` |


## Dependencies
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
| `linksTarget` | `links-target` | | `string` | `undefined` |
| `placeholder` | `placeholder` | | `string` | `undefined` |
| `sourceBaseUrl` | `source-base-url` | | `string` | `undefined` |
| `sourcesMap` | -- | | `{ title?: string; description?: string; path?: string; }` | `undefined` |
| `sourcesMap` | -- | | `{ title?: string; path?: string; description?: string; }` | `undefined` |
| `suggestions` | -- | | `string[]` | `undefined` |


Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ export class SearchBox {
id: HTMLElement
}>

modalRef!: HTMLElement
wrapperRef!: HTMLElement

schemaQuery: MediaQueryList

Expand Down Expand Up @@ -82,7 +82,7 @@ export class SearchBox {

@Listen('modalStatusChanged')
modalStatusChangedHandler(event: CustomEvent<{ open: boolean; id: HTMLElement }>) {
if (event.detail.id === this.modalRef) {
if (event.detail.id === this.wrapperRef) {
if (!event.detail.open) {
globalContext.open = false
this.open = false
Expand Down Expand Up @@ -194,15 +194,15 @@ export class SearchBox {
event.stopPropagation()
event.preventDefault()

const focusableElements = this.modalRef?.querySelectorAll('[focus-on-arrow-nav]')
const focusableElements = this.wrapperRef?.querySelectorAll('[focus-on-arrow-nav]')

let focusableArray = Array.from(focusableElements) as HTMLElement[]
focusableArray = focusableArray.filter((element) => element.tabIndex !== -1)

const firstFocusableElement = focusableArray[0]
const lastFocusableElement = focusableArray[focusableArray.length - 1]

const focusedElement = this.modalRef.querySelector(':focus') as HTMLElement
const focusedElement = this.wrapperRef.querySelector(':focus') as HTMLElement
const focusedIndex = focusableArray.indexOf(focusedElement)

let nextFocusableElement: HTMLElement
Expand Down Expand Up @@ -307,7 +307,7 @@ export class SearchBox {
return (
<Fragment>
<orama-modal
ref={(el) => (this.modalRef = el)}
ref={(el) => (this.wrapperRef = el)}
open={globalContext.open}
class="modal"
mainTitle="Start your search"
Expand All @@ -323,7 +323,7 @@ export class SearchBox {
getEmbedLayout() {
return (
<Fragment>
<orama-embed ref={(el) => (this.modalRef = el)}>{this.getInnerContent()}</orama-embed>
<orama-embed ref={(el) => (this.wrapperRef = el)}>{this.getInnerContent()}</orama-embed>
{this.getOuterContent()}
</Fragment>
)
Expand Down
Loading

0 comments on commit bd1e0f7

Please sign in to comment.