@searchcraft/vue-sdk 0.9.7 → 0.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +1034 -1807
- package/dist/index.es.js +2720 -3339
- package/dist/index.es.js.map +1 -1
- package/dist/index.umd.js +7 -17
- package/dist/index.umd.js.map +1 -1
- package/package.json +5 -5
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,143 @@
|
|
|
1
1
|
// Generated by dts-bundle-generator v9.5.1
|
|
2
2
|
|
|
3
|
+
import { HTMLStencilElement, JSXBase } from '@stencil/core/internal';
|
|
4
|
+
|
|
5
|
+
declare enum LogLevel {
|
|
6
|
+
DEBUG = 0,
|
|
7
|
+
INFO = 1,
|
|
8
|
+
WARN = 2,
|
|
9
|
+
ERROR = 3
|
|
10
|
+
}
|
|
11
|
+
export interface SDKDebuggerOptions {
|
|
12
|
+
logLevel: LogLevel;
|
|
13
|
+
logFormatter?: (level: LogLevel, message: string) => string;
|
|
14
|
+
}
|
|
15
|
+
declare class Logger {
|
|
16
|
+
private logLevel;
|
|
17
|
+
private logFormatter;
|
|
18
|
+
constructor(options: SDKDebuggerOptions);
|
|
19
|
+
private defaultFormatter;
|
|
20
|
+
debug(message: string): void;
|
|
21
|
+
info(message: string): void;
|
|
22
|
+
warn(message: string): void;
|
|
23
|
+
error(message: string): void;
|
|
24
|
+
log(level: LogLevel, message: string): void;
|
|
25
|
+
}
|
|
26
|
+
/**
|
|
27
|
+
* A data type representing an index field value, along with properties
|
|
28
|
+
* describing how to format and display the index field value.
|
|
29
|
+
*/
|
|
30
|
+
export type SearchResultFieldName = {
|
|
31
|
+
/**
|
|
32
|
+
* The index field name.
|
|
33
|
+
*/
|
|
34
|
+
fieldName: string;
|
|
35
|
+
/**
|
|
36
|
+
* The data type to treat this index field as.
|
|
37
|
+
*/
|
|
38
|
+
dataType: "text" | "date" | "number";
|
|
39
|
+
/**
|
|
40
|
+
* The locale to use when formatting dataType: `number`
|
|
41
|
+
*/
|
|
42
|
+
numberFormatLocale?: string;
|
|
43
|
+
/**
|
|
44
|
+
* If it's a number, the number format to apply.
|
|
45
|
+
* reference: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat
|
|
46
|
+
*/
|
|
47
|
+
numberFormatOptions?: Intl.NumberFormatOptions;
|
|
48
|
+
/**
|
|
49
|
+
* A scale factor to apply to a `number` value.
|
|
50
|
+
*/
|
|
51
|
+
numberScale?: number;
|
|
52
|
+
/**
|
|
53
|
+
* TODO: Implement DateFormatOptions, for date formatting
|
|
54
|
+
*/
|
|
55
|
+
dateFormatOptions?: unknown;
|
|
56
|
+
};
|
|
57
|
+
/**
|
|
58
|
+
* A data type representing the mapping of index fields, for the purpose of rendering them
|
|
59
|
+
* in search result item.
|
|
60
|
+
*/
|
|
61
|
+
export type SearchResultMapping = {
|
|
62
|
+
/**
|
|
63
|
+
* The fields to map to.
|
|
64
|
+
*/
|
|
65
|
+
fieldNames: SearchResultFieldName[];
|
|
66
|
+
/**
|
|
67
|
+
* The delimiter used to join them.
|
|
68
|
+
*/
|
|
69
|
+
delimiter?: string;
|
|
70
|
+
};
|
|
71
|
+
export type PopoverResultMappings = {
|
|
72
|
+
title?: SearchResultMapping;
|
|
73
|
+
subtitle?: SearchResultMapping;
|
|
74
|
+
imageSource?: SearchResultMapping;
|
|
75
|
+
imageAlt?: SearchResultMapping;
|
|
76
|
+
href?: SearchResultMapping;
|
|
77
|
+
};
|
|
78
|
+
export interface FilterItem {
|
|
79
|
+
type: "facets" | "dateRange" | "numericRange" | "exactMatchToggle" | "mostRecentToggle";
|
|
80
|
+
label: string;
|
|
81
|
+
options: object | null;
|
|
82
|
+
}
|
|
83
|
+
export interface FacetsFilterItem extends FilterItem {
|
|
84
|
+
fieldName: string;
|
|
85
|
+
type: "facets";
|
|
86
|
+
options: {
|
|
87
|
+
showSublevel: boolean;
|
|
88
|
+
};
|
|
89
|
+
}
|
|
90
|
+
export interface NumericFilterItem extends FilterItem {
|
|
91
|
+
fieldName: string;
|
|
92
|
+
type: "numericRange";
|
|
93
|
+
options: {
|
|
94
|
+
min: number;
|
|
95
|
+
max: number;
|
|
96
|
+
granularity: number;
|
|
97
|
+
};
|
|
98
|
+
}
|
|
99
|
+
export interface DateRangeFilterItem extends FilterItem {
|
|
100
|
+
fieldName: string;
|
|
101
|
+
type: "dateRange";
|
|
102
|
+
options: {
|
|
103
|
+
minDate: Date;
|
|
104
|
+
maxDate: Date;
|
|
105
|
+
granularity: "year" | "month" | "day" | "hour";
|
|
106
|
+
};
|
|
107
|
+
}
|
|
108
|
+
export interface ExactMatchToggleFilterItem extends FilterItem {
|
|
109
|
+
type: "exactMatchToggle";
|
|
110
|
+
options: {
|
|
111
|
+
subLabel?: string;
|
|
112
|
+
};
|
|
113
|
+
}
|
|
114
|
+
export interface MostRecentToggleFilterItem extends FilterItem {
|
|
115
|
+
type: "mostRecentToggle";
|
|
116
|
+
options: {
|
|
117
|
+
subLabel?: string;
|
|
118
|
+
};
|
|
119
|
+
}
|
|
120
|
+
export type TemplateHtml = (strings: TemplateStringsArray, ...values: (string | number | undefined)[]) => string;
|
|
121
|
+
export type SearchResultTemplate<T> = (data: T, index: number, utils: {
|
|
122
|
+
html: TemplateHtml;
|
|
123
|
+
}) => string;
|
|
124
|
+
export type SearchResultTemplateData = any;
|
|
125
|
+
export type ResultsInfoTemplate = (data: {
|
|
126
|
+
range: [
|
|
127
|
+
number,
|
|
128
|
+
number
|
|
129
|
+
];
|
|
130
|
+
count: number;
|
|
131
|
+
responseTime: string;
|
|
132
|
+
}, utils: {
|
|
133
|
+
html: TemplateHtml;
|
|
134
|
+
}) => string;
|
|
135
|
+
export type CustomAdTemplate = (data: {
|
|
136
|
+
adContainerId: string;
|
|
137
|
+
searchTerm: string;
|
|
138
|
+
}, utils: {
|
|
139
|
+
html: TemplateHtml;
|
|
140
|
+
}) => string;
|
|
3
141
|
/**
|
|
4
142
|
* The SearchcraftConfig object is used to initialize Searchcraft in your application.
|
|
5
143
|
*/
|
|
@@ -67,7 +205,7 @@ export interface SearchcraftConfig {
|
|
|
67
205
|
/**
|
|
68
206
|
* A callback function responsible for rendering the custom ad containers.
|
|
69
207
|
*/
|
|
70
|
-
customAdTemplate?:
|
|
208
|
+
customAdTemplate?: CustomAdTemplate;
|
|
71
209
|
/**
|
|
72
210
|
* The placement id to use for Nativo ads.
|
|
73
211
|
*/
|
|
@@ -105,11 +243,6 @@ export interface SearchcraftSDKInfo {
|
|
|
105
243
|
sdkName: string;
|
|
106
244
|
sdkVersion: string;
|
|
107
245
|
}
|
|
108
|
-
export interface CustomAdTemplateRenderData {
|
|
109
|
-
adContainerId: string;
|
|
110
|
-
searchTerm: string;
|
|
111
|
-
}
|
|
112
|
-
export type CustomAdTemplateRenderFunction = (data: CustomAdTemplateRenderData) => string;
|
|
113
246
|
export interface AdClientResponseItem {
|
|
114
247
|
id: string;
|
|
115
248
|
adSource: SearchcraftAdSource;
|
|
@@ -304,109 +437,6 @@ export type UnsubscribeFunction = () => void;
|
|
|
304
437
|
export interface SubscriptionEvent {
|
|
305
438
|
name: SubscriptionEventName;
|
|
306
439
|
}
|
|
307
|
-
/**
|
|
308
|
-
* A data type representing an index field value, along with properties
|
|
309
|
-
* describing how to format and display the index field value.
|
|
310
|
-
*/
|
|
311
|
-
export type SearchResultFieldName = {
|
|
312
|
-
/**
|
|
313
|
-
* The index field name.
|
|
314
|
-
*/
|
|
315
|
-
fieldName: string;
|
|
316
|
-
/**
|
|
317
|
-
* The data type to treat this index field as.
|
|
318
|
-
*/
|
|
319
|
-
dataType: "text" | "date" | "number";
|
|
320
|
-
/**
|
|
321
|
-
* The locale to use when formatting dataType: `number`
|
|
322
|
-
*/
|
|
323
|
-
numberFormatLocale?: string;
|
|
324
|
-
/**
|
|
325
|
-
* If it's a number, the number format to apply.
|
|
326
|
-
* reference: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat
|
|
327
|
-
*/
|
|
328
|
-
numberFormatOptions?: Intl.NumberFormatOptions;
|
|
329
|
-
/**
|
|
330
|
-
* A scale factor to apply to a `number` value.
|
|
331
|
-
*/
|
|
332
|
-
numberScale?: number;
|
|
333
|
-
/**
|
|
334
|
-
* TODO: Implement DateFormatOptions, for date formatting
|
|
335
|
-
*/
|
|
336
|
-
dateFormatOptions?: unknown;
|
|
337
|
-
};
|
|
338
|
-
/**
|
|
339
|
-
* A data type representing the mapping of index fields, for the purpose of rendering them
|
|
340
|
-
* in search result item.
|
|
341
|
-
*/
|
|
342
|
-
export type SearchResultMapping = {
|
|
343
|
-
/**
|
|
344
|
-
* The fields to map to.
|
|
345
|
-
*/
|
|
346
|
-
fieldNames: SearchResultFieldName[];
|
|
347
|
-
/**
|
|
348
|
-
* The delimiter used to join them.
|
|
349
|
-
*/
|
|
350
|
-
delimiter?: string;
|
|
351
|
-
};
|
|
352
|
-
export type SearchResultMappings = {
|
|
353
|
-
body?: SearchResultMapping;
|
|
354
|
-
buttonHref?: SearchResultMapping;
|
|
355
|
-
containerHref?: SearchResultMapping;
|
|
356
|
-
footer?: SearchResultMapping;
|
|
357
|
-
imageSource?: SearchResultMapping;
|
|
358
|
-
subtitle?: SearchResultMapping;
|
|
359
|
-
title?: SearchResultMapping;
|
|
360
|
-
};
|
|
361
|
-
export type PopoverResultMappings = {
|
|
362
|
-
title?: SearchResultMapping;
|
|
363
|
-
subtitle?: SearchResultMapping;
|
|
364
|
-
imageSource?: SearchResultMapping;
|
|
365
|
-
imageAlt?: SearchResultMapping;
|
|
366
|
-
href?: SearchResultMapping;
|
|
367
|
-
};
|
|
368
|
-
export interface FilterItem {
|
|
369
|
-
type: "facets" | "dateRange" | "numericRange" | "exactMatchToggle" | "mostRecentToggle";
|
|
370
|
-
label: string;
|
|
371
|
-
options: object | null;
|
|
372
|
-
}
|
|
373
|
-
export interface FacetsFilterItem extends FilterItem {
|
|
374
|
-
fieldName: string;
|
|
375
|
-
type: "facets";
|
|
376
|
-
options: {
|
|
377
|
-
showSublevel: boolean;
|
|
378
|
-
};
|
|
379
|
-
}
|
|
380
|
-
export interface NumericFilterItem extends FilterItem {
|
|
381
|
-
fieldName: string;
|
|
382
|
-
type: "numericRange";
|
|
383
|
-
options: {
|
|
384
|
-
min: number;
|
|
385
|
-
max: number;
|
|
386
|
-
granularity: number;
|
|
387
|
-
};
|
|
388
|
-
}
|
|
389
|
-
export interface DateRangeFilterItem extends FilterItem {
|
|
390
|
-
fieldName: string;
|
|
391
|
-
type: "dateRange";
|
|
392
|
-
options: {
|
|
393
|
-
minDate: Date;
|
|
394
|
-
maxDate: Date;
|
|
395
|
-
granularity: "year" | "month" | "day" | "hour";
|
|
396
|
-
};
|
|
397
|
-
}
|
|
398
|
-
export interface ExactMatchToggleFilterItem extends FilterItem {
|
|
399
|
-
type: "exactMatchToggle";
|
|
400
|
-
options: {
|
|
401
|
-
subLabel?: string;
|
|
402
|
-
};
|
|
403
|
-
}
|
|
404
|
-
export interface MostRecentToggleFilterItem extends FilterItem {
|
|
405
|
-
type: "mostRecentToggle";
|
|
406
|
-
options: {
|
|
407
|
-
subLabel?: string;
|
|
408
|
-
};
|
|
409
|
-
}
|
|
410
440
|
declare class AdClient {
|
|
411
441
|
config: SearchcraftConfig;
|
|
412
442
|
constructor(config: SearchcraftConfig);
|
|
@@ -467,7 +497,10 @@ declare class SearchClient {
|
|
|
467
497
|
*/
|
|
468
498
|
getSearchResponse: (searchParams: SearchParams) => Promise<SearchcraftResponse>;
|
|
469
499
|
}
|
|
470
|
-
|
|
500
|
+
/**
|
|
501
|
+
* Javascript Class providing the functionality to interact with the Searchcraft BE
|
|
502
|
+
*/
|
|
503
|
+
export declare class SearchcraftCore {
|
|
471
504
|
config: SearchcraftConfig;
|
|
472
505
|
measureClient: MeasureClient | undefined;
|
|
473
506
|
searchClient: SearchClient | undefined;
|
|
@@ -511,1097 +544,58 @@ declare class SearchcraftCore {
|
|
|
511
544
|
*/
|
|
512
545
|
getItems: (searchParams: SearchParams, itemsCallback: (response: SearchcraftResponse, items: SearchClientResponseItem[]) => void, adCallback: (adClientResponseItems: AdClientResponseItem[]) => void) => void;
|
|
513
546
|
}
|
|
514
|
-
|
|
515
|
-
|
|
547
|
+
/**
|
|
548
|
+
* Callable functions made available by the SearchcraftStore.
|
|
549
|
+
*/
|
|
550
|
+
export interface SearchcraftStateFunctions {
|
|
551
|
+
addFacetPathsForIndexField: (data: FacetPathsForIndexField) => void;
|
|
552
|
+
addRangeValueForIndexField: (data: RangeValueForIndexField) => void;
|
|
553
|
+
getSearchcraftInstance: () => SearchcraftCore | undefined;
|
|
554
|
+
initialize: (searchcraft: unknown, debug?: boolean) => void;
|
|
555
|
+
removeFacetPathsForIndexField: (fieldName: string) => void;
|
|
556
|
+
removeRangeValueForIndexField: (fieldName: string) => void;
|
|
557
|
+
resetFacetPaths: () => void;
|
|
558
|
+
search: () => Promise<void>;
|
|
559
|
+
setPopoverVisibility: (isVisible: boolean) => void;
|
|
560
|
+
setSearchClientResponseItems: (results: SearchClientResponseItem[]) => void;
|
|
561
|
+
setSearchResultsPage: (page: number) => void;
|
|
562
|
+
setSearchResultsPerPage: (perPage: number) => void;
|
|
563
|
+
setSearchTerm: (searchTerm: string) => void;
|
|
564
|
+
setSearchMode: (mode: "fuzzy" | "exact") => void;
|
|
565
|
+
setSortType: (type: "asc" | "desc") => void;
|
|
516
566
|
}
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
caption: JSXBase.HTMLAttributes<HTMLTableCaptionElement>;
|
|
538
|
-
cite: JSXBase.HTMLAttributes;
|
|
539
|
-
code: JSXBase.HTMLAttributes;
|
|
540
|
-
col: JSXBase.ColHTMLAttributes<HTMLTableColElement>;
|
|
541
|
-
colgroup: JSXBase.ColgroupHTMLAttributes<HTMLTableColElement>;
|
|
542
|
-
data: JSXBase.HTMLAttributes<HTMLDataElement>;
|
|
543
|
-
datalist: JSXBase.HTMLAttributes<HTMLDataListElement>;
|
|
544
|
-
dd: JSXBase.HTMLAttributes;
|
|
545
|
-
del: JSXBase.DelHTMLAttributes<HTMLModElement>;
|
|
546
|
-
details: JSXBase.DetailsHTMLAttributes<HTMLElement>;
|
|
547
|
-
dfn: JSXBase.HTMLAttributes;
|
|
548
|
-
dialog: JSXBase.DialogHTMLAttributes<HTMLDialogElement>;
|
|
549
|
-
div: JSXBase.HTMLAttributes<HTMLDivElement>;
|
|
550
|
-
dl: JSXBase.HTMLAttributes<HTMLDListElement>;
|
|
551
|
-
dt: JSXBase.HTMLAttributes;
|
|
552
|
-
em: JSXBase.HTMLAttributes;
|
|
553
|
-
embed: JSXBase.EmbedHTMLAttributes<HTMLEmbedElement>;
|
|
554
|
-
fieldset: JSXBase.FieldsetHTMLAttributes<HTMLFieldSetElement>;
|
|
555
|
-
figcaption: JSXBase.HTMLAttributes;
|
|
556
|
-
figure: JSXBase.HTMLAttributes;
|
|
557
|
-
footer: JSXBase.HTMLAttributes;
|
|
558
|
-
form: JSXBase.FormHTMLAttributes<HTMLFormElement>;
|
|
559
|
-
h1: JSXBase.HTMLAttributes<HTMLHeadingElement>;
|
|
560
|
-
h2: JSXBase.HTMLAttributes<HTMLHeadingElement>;
|
|
561
|
-
h3: JSXBase.HTMLAttributes<HTMLHeadingElement>;
|
|
562
|
-
h4: JSXBase.HTMLAttributes<HTMLHeadingElement>;
|
|
563
|
-
h5: JSXBase.HTMLAttributes<HTMLHeadingElement>;
|
|
564
|
-
h6: JSXBase.HTMLAttributes<HTMLHeadingElement>;
|
|
565
|
-
head: JSXBase.HTMLAttributes<HTMLHeadElement>;
|
|
566
|
-
header: JSXBase.HTMLAttributes;
|
|
567
|
-
hgroup: JSXBase.HTMLAttributes;
|
|
568
|
-
hr: JSXBase.HTMLAttributes<HTMLHRElement>;
|
|
569
|
-
html: JSXBase.HTMLAttributes<HTMLHtmlElement>;
|
|
570
|
-
i: JSXBase.HTMLAttributes;
|
|
571
|
-
iframe: JSXBase.IframeHTMLAttributes<HTMLIFrameElement>;
|
|
572
|
-
img: JSXBase.ImgHTMLAttributes<HTMLImageElement>;
|
|
573
|
-
input: JSXBase.InputHTMLAttributes<HTMLInputElement>;
|
|
574
|
-
ins: JSXBase.InsHTMLAttributes<HTMLModElement>;
|
|
575
|
-
kbd: JSXBase.HTMLAttributes;
|
|
576
|
-
keygen: JSXBase.KeygenHTMLAttributes<HTMLElement>;
|
|
577
|
-
label: JSXBase.LabelHTMLAttributes<HTMLLabelElement>;
|
|
578
|
-
legend: JSXBase.HTMLAttributes<HTMLLegendElement>;
|
|
579
|
-
li: JSXBase.LiHTMLAttributes<HTMLLIElement>;
|
|
580
|
-
link: JSXBase.LinkHTMLAttributes<HTMLLinkElement>;
|
|
581
|
-
main: JSXBase.HTMLAttributes;
|
|
582
|
-
map: JSXBase.MapHTMLAttributes<HTMLMapElement>;
|
|
583
|
-
mark: JSXBase.HTMLAttributes;
|
|
584
|
-
menu: JSXBase.MenuHTMLAttributes<HTMLMenuElement>;
|
|
585
|
-
menuitem: JSXBase.HTMLAttributes;
|
|
586
|
-
meta: JSXBase.MetaHTMLAttributes<HTMLMetaElement>;
|
|
587
|
-
meter: JSXBase.MeterHTMLAttributes<HTMLMeterElement>;
|
|
588
|
-
nav: JSXBase.HTMLAttributes;
|
|
589
|
-
noscript: JSXBase.HTMLAttributes;
|
|
590
|
-
object: JSXBase.ObjectHTMLAttributes<HTMLObjectElement>;
|
|
591
|
-
ol: JSXBase.OlHTMLAttributes<HTMLOListElement>;
|
|
592
|
-
optgroup: JSXBase.OptgroupHTMLAttributes<HTMLOptGroupElement>;
|
|
593
|
-
option: JSXBase.OptionHTMLAttributes<HTMLOptionElement>;
|
|
594
|
-
output: JSXBase.OutputHTMLAttributes<HTMLOutputElement>;
|
|
595
|
-
p: JSXBase.HTMLAttributes<HTMLParagraphElement>;
|
|
596
|
-
param: JSXBase.ParamHTMLAttributes<HTMLParamElement>;
|
|
597
|
-
picture: JSXBase.HTMLAttributes<HTMLPictureElement>;
|
|
598
|
-
pre: JSXBase.HTMLAttributes<HTMLPreElement>;
|
|
599
|
-
progress: JSXBase.ProgressHTMLAttributes<HTMLProgressElement>;
|
|
600
|
-
q: JSXBase.QuoteHTMLAttributes<HTMLQuoteElement>;
|
|
601
|
-
rp: JSXBase.HTMLAttributes;
|
|
602
|
-
rt: JSXBase.HTMLAttributes;
|
|
603
|
-
ruby: JSXBase.HTMLAttributes;
|
|
604
|
-
s: JSXBase.HTMLAttributes;
|
|
605
|
-
samp: JSXBase.HTMLAttributes;
|
|
606
|
-
script: JSXBase.ScriptHTMLAttributes<HTMLScriptElement>;
|
|
607
|
-
section: JSXBase.HTMLAttributes;
|
|
608
|
-
select: JSXBase.SelectHTMLAttributes<HTMLSelectElement>;
|
|
609
|
-
small: JSXBase.HTMLAttributes;
|
|
610
|
-
source: JSXBase.SourceHTMLAttributes<HTMLSourceElement>;
|
|
611
|
-
span: JSXBase.HTMLAttributes<HTMLSpanElement>;
|
|
612
|
-
strong: JSXBase.HTMLAttributes;
|
|
613
|
-
style: JSXBase.StyleHTMLAttributes<HTMLStyleElement>;
|
|
614
|
-
sub: JSXBase.HTMLAttributes;
|
|
615
|
-
summary: JSXBase.HTMLAttributes;
|
|
616
|
-
sup: JSXBase.HTMLAttributes;
|
|
617
|
-
table: JSXBase.TableHTMLAttributes<HTMLTableElement>;
|
|
618
|
-
tbody: JSXBase.HTMLAttributes<HTMLTableSectionElement>;
|
|
619
|
-
td: JSXBase.TdHTMLAttributes<HTMLTableDataCellElement>;
|
|
620
|
-
textarea: JSXBase.TextareaHTMLAttributes<HTMLTextAreaElement>;
|
|
621
|
-
tfoot: JSXBase.HTMLAttributes<HTMLTableSectionElement>;
|
|
622
|
-
th: JSXBase.ThHTMLAttributes<HTMLTableHeaderCellElement>;
|
|
623
|
-
thead: JSXBase.HTMLAttributes<HTMLTableSectionElement>;
|
|
624
|
-
time: JSXBase.TimeHTMLAttributes<HTMLTimeElement>;
|
|
625
|
-
title: JSXBase.HTMLAttributes<HTMLTitleElement>;
|
|
626
|
-
tr: JSXBase.HTMLAttributes<HTMLTableRowElement>;
|
|
627
|
-
track: JSXBase.TrackHTMLAttributes<HTMLTrackElement>;
|
|
628
|
-
u: JSXBase.HTMLAttributes;
|
|
629
|
-
ul: JSXBase.HTMLAttributes<HTMLUListElement>;
|
|
630
|
-
var: JSXBase.HTMLAttributes;
|
|
631
|
-
video: JSXBase.VideoHTMLAttributes<HTMLVideoElement>;
|
|
632
|
-
wbr: JSXBase.HTMLAttributes;
|
|
633
|
-
animate: JSXBase.SVGAttributes;
|
|
634
|
-
circle: JSXBase.SVGAttributes;
|
|
635
|
-
clipPath: JSXBase.SVGAttributes;
|
|
636
|
-
defs: JSXBase.SVGAttributes;
|
|
637
|
-
desc: JSXBase.SVGAttributes;
|
|
638
|
-
ellipse: JSXBase.SVGAttributes;
|
|
639
|
-
feBlend: JSXBase.SVGAttributes;
|
|
640
|
-
feColorMatrix: JSXBase.SVGAttributes;
|
|
641
|
-
feComponentTransfer: JSXBase.SVGAttributes;
|
|
642
|
-
feComposite: JSXBase.SVGAttributes;
|
|
643
|
-
feConvolveMatrix: JSXBase.SVGAttributes;
|
|
644
|
-
feDiffuseLighting: JSXBase.SVGAttributes;
|
|
645
|
-
feDisplacementMap: JSXBase.SVGAttributes;
|
|
646
|
-
feDistantLight: JSXBase.SVGAttributes;
|
|
647
|
-
feDropShadow: JSXBase.SVGAttributes;
|
|
648
|
-
feFlood: JSXBase.SVGAttributes;
|
|
649
|
-
feFuncA: JSXBase.SVGAttributes;
|
|
650
|
-
feFuncB: JSXBase.SVGAttributes;
|
|
651
|
-
feFuncG: JSXBase.SVGAttributes;
|
|
652
|
-
feFuncR: JSXBase.SVGAttributes;
|
|
653
|
-
feGaussianBlur: JSXBase.SVGAttributes;
|
|
654
|
-
feImage: JSXBase.SVGAttributes;
|
|
655
|
-
feMerge: JSXBase.SVGAttributes;
|
|
656
|
-
feMergeNode: JSXBase.SVGAttributes;
|
|
657
|
-
feMorphology: JSXBase.SVGAttributes;
|
|
658
|
-
feOffset: JSXBase.SVGAttributes;
|
|
659
|
-
fePointLight: JSXBase.SVGAttributes;
|
|
660
|
-
feSpecularLighting: JSXBase.SVGAttributes;
|
|
661
|
-
feSpotLight: JSXBase.SVGAttributes;
|
|
662
|
-
feTile: JSXBase.SVGAttributes;
|
|
663
|
-
feTurbulence: JSXBase.SVGAttributes;
|
|
664
|
-
filter: JSXBase.SVGAttributes;
|
|
665
|
-
foreignObject: JSXBase.SVGAttributes;
|
|
666
|
-
g: JSXBase.SVGAttributes;
|
|
667
|
-
image: JSXBase.SVGAttributes;
|
|
668
|
-
line: JSXBase.SVGAttributes;
|
|
669
|
-
linearGradient: JSXBase.SVGAttributes;
|
|
670
|
-
marker: JSXBase.SVGAttributes;
|
|
671
|
-
mask: JSXBase.SVGAttributes;
|
|
672
|
-
metadata: JSXBase.SVGAttributes;
|
|
673
|
-
path: JSXBase.SVGAttributes;
|
|
674
|
-
pattern: JSXBase.SVGAttributes;
|
|
675
|
-
polygon: JSXBase.SVGAttributes;
|
|
676
|
-
polyline: JSXBase.SVGAttributes;
|
|
677
|
-
radialGradient: JSXBase.SVGAttributes;
|
|
678
|
-
rect: JSXBase.SVGAttributes;
|
|
679
|
-
stop: JSXBase.SVGAttributes;
|
|
680
|
-
svg: JSXBase.SVGAttributes;
|
|
681
|
-
switch: JSXBase.SVGAttributes;
|
|
682
|
-
symbol: JSXBase.SVGAttributes;
|
|
683
|
-
text: JSXBase.SVGAttributes;
|
|
684
|
-
textPath: JSXBase.SVGAttributes;
|
|
685
|
-
tspan: JSXBase.SVGAttributes;
|
|
686
|
-
use: JSXBase.SVGAttributes;
|
|
687
|
-
view: JSXBase.SVGAttributes;
|
|
688
|
-
}
|
|
689
|
-
interface SlotAttributes extends JSXAttributes {
|
|
690
|
-
name?: string;
|
|
691
|
-
slot?: string;
|
|
692
|
-
onSlotchange?: (event: Event) => void;
|
|
693
|
-
}
|
|
694
|
-
interface AnchorHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
695
|
-
download?: any;
|
|
696
|
-
href?: string;
|
|
697
|
-
hrefLang?: string;
|
|
698
|
-
hreflang?: string;
|
|
699
|
-
media?: string;
|
|
700
|
-
ping?: string;
|
|
701
|
-
rel?: string;
|
|
702
|
-
target?: string;
|
|
703
|
-
referrerPolicy?: ReferrerPolicy;
|
|
704
|
-
}
|
|
705
|
-
interface AudioHTMLAttributes<T> extends MediaHTMLAttributes<T> {
|
|
706
|
-
}
|
|
707
|
-
interface AreaHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
708
|
-
alt?: string;
|
|
709
|
-
coords?: string;
|
|
710
|
-
download?: any;
|
|
711
|
-
href?: string;
|
|
712
|
-
hrefLang?: string;
|
|
713
|
-
hreflang?: string;
|
|
714
|
-
media?: string;
|
|
715
|
-
rel?: string;
|
|
716
|
-
shape?: string;
|
|
717
|
-
target?: string;
|
|
718
|
-
}
|
|
719
|
-
interface BaseHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
720
|
-
href?: string;
|
|
721
|
-
target?: string;
|
|
722
|
-
}
|
|
723
|
-
interface BlockquoteHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
724
|
-
cite?: string;
|
|
725
|
-
}
|
|
726
|
-
interface ButtonHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
727
|
-
disabled?: boolean;
|
|
728
|
-
form?: string;
|
|
729
|
-
formAction?: string;
|
|
730
|
-
formaction?: string;
|
|
731
|
-
formEncType?: string;
|
|
732
|
-
formenctype?: string;
|
|
733
|
-
formMethod?: string;
|
|
734
|
-
formmethod?: string;
|
|
735
|
-
formNoValidate?: boolean;
|
|
736
|
-
formnovalidate?: boolean;
|
|
737
|
-
formTarget?: string;
|
|
738
|
-
formtarget?: string;
|
|
739
|
-
name?: string;
|
|
740
|
-
type?: string;
|
|
741
|
-
value?: string | string[] | number;
|
|
742
|
-
popoverTargetAction?: string;
|
|
743
|
-
popoverTargetElement?: Element | null;
|
|
744
|
-
popoverTarget?: string;
|
|
745
|
-
}
|
|
746
|
-
interface CanvasHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
747
|
-
height?: number | string;
|
|
748
|
-
width?: number | string;
|
|
749
|
-
}
|
|
750
|
-
interface ColHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
751
|
-
span?: number;
|
|
752
|
-
}
|
|
753
|
-
interface ColgroupHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
754
|
-
span?: number;
|
|
755
|
-
}
|
|
756
|
-
interface DetailsHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
757
|
-
open?: boolean;
|
|
758
|
-
onToggle?: (event: Event) => void;
|
|
759
|
-
}
|
|
760
|
-
interface DelHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
761
|
-
cite?: string;
|
|
762
|
-
dateTime?: string;
|
|
763
|
-
datetime?: string;
|
|
764
|
-
}
|
|
765
|
-
interface DialogHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
766
|
-
onCancel?: (event: Event) => void;
|
|
767
|
-
onClose?: (event: Event) => void;
|
|
768
|
-
open?: boolean;
|
|
769
|
-
returnValue?: string;
|
|
770
|
-
}
|
|
771
|
-
interface EmbedHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
772
|
-
height?: number | string;
|
|
773
|
-
src?: string;
|
|
774
|
-
type?: string;
|
|
775
|
-
width?: number | string;
|
|
776
|
-
}
|
|
777
|
-
interface FieldsetHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
778
|
-
disabled?: boolean;
|
|
779
|
-
form?: string;
|
|
780
|
-
name?: string;
|
|
781
|
-
}
|
|
782
|
-
interface FormHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
783
|
-
acceptCharset?: string;
|
|
784
|
-
acceptcharset?: string;
|
|
785
|
-
action?: string;
|
|
786
|
-
autoComplete?: string;
|
|
787
|
-
autocomplete?: string;
|
|
788
|
-
encType?: string;
|
|
789
|
-
enctype?: string;
|
|
790
|
-
method?: string;
|
|
791
|
-
name?: string;
|
|
792
|
-
noValidate?: boolean;
|
|
793
|
-
novalidate?: boolean | string;
|
|
794
|
-
target?: string;
|
|
795
|
-
}
|
|
796
|
-
interface HtmlHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
797
|
-
manifest?: string;
|
|
798
|
-
}
|
|
799
|
-
interface IframeHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
800
|
-
allow?: string;
|
|
801
|
-
allowFullScreen?: boolean;
|
|
802
|
-
allowfullScreen?: string | boolean;
|
|
803
|
-
allowTransparency?: boolean;
|
|
804
|
-
allowtransparency?: string | boolean;
|
|
805
|
-
frameBorder?: number | string;
|
|
806
|
-
frameborder?: number | string;
|
|
807
|
-
importance?: "low" | "auto" | "high";
|
|
808
|
-
height?: number | string;
|
|
809
|
-
loading?: "lazy" | "auto" | "eager";
|
|
810
|
-
marginHeight?: number;
|
|
811
|
-
marginheight?: string | number;
|
|
812
|
-
marginWidth?: number;
|
|
813
|
-
marginwidth?: string | number;
|
|
814
|
-
name?: string;
|
|
815
|
-
referrerPolicy?: ReferrerPolicy;
|
|
816
|
-
sandbox?: string;
|
|
817
|
-
scrolling?: string;
|
|
818
|
-
seamless?: boolean;
|
|
819
|
-
src?: string;
|
|
820
|
-
srcDoc?: string;
|
|
821
|
-
srcdoc?: string;
|
|
822
|
-
width?: number | string;
|
|
823
|
-
}
|
|
824
|
-
interface ImgHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
825
|
-
alt?: string;
|
|
826
|
-
crossOrigin?: string;
|
|
827
|
-
crossorigin?: string;
|
|
828
|
-
decoding?: "async" | "auto" | "sync";
|
|
829
|
-
importance?: "low" | "auto" | "high";
|
|
830
|
-
height?: number | string;
|
|
831
|
-
loading?: "lazy" | "auto" | "eager";
|
|
832
|
-
sizes?: string;
|
|
833
|
-
src?: string;
|
|
834
|
-
srcSet?: string;
|
|
835
|
-
srcset?: string;
|
|
836
|
-
useMap?: string;
|
|
837
|
-
usemap?: string;
|
|
838
|
-
width?: number | string;
|
|
839
|
-
}
|
|
840
|
-
interface InsHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
841
|
-
cite?: string;
|
|
842
|
-
dateTime?: string;
|
|
843
|
-
datetime?: string;
|
|
844
|
-
}
|
|
845
|
-
interface InputHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
846
|
-
accept?: string;
|
|
847
|
-
allowdirs?: boolean;
|
|
848
|
-
alt?: string;
|
|
849
|
-
autoCapitalize?: string;
|
|
850
|
-
autocapitalize?: string;
|
|
851
|
-
autoComplete?: string;
|
|
852
|
-
autocomplete?: string;
|
|
853
|
-
capture?: string;
|
|
854
|
-
checked?: boolean;
|
|
855
|
-
crossOrigin?: string;
|
|
856
|
-
crossorigin?: string;
|
|
857
|
-
defaultChecked?: boolean;
|
|
858
|
-
defaultValue?: string;
|
|
859
|
-
dirName?: string;
|
|
860
|
-
disabled?: boolean;
|
|
861
|
-
files?: any;
|
|
862
|
-
form?: string;
|
|
863
|
-
formAction?: string;
|
|
864
|
-
formaction?: string;
|
|
865
|
-
formEncType?: string;
|
|
866
|
-
formenctype?: string;
|
|
867
|
-
formMethod?: string;
|
|
868
|
-
formmethod?: string;
|
|
869
|
-
formNoValidate?: boolean;
|
|
870
|
-
formnovalidate?: boolean;
|
|
871
|
-
formTarget?: string;
|
|
872
|
-
formtarget?: string;
|
|
873
|
-
height?: number | string;
|
|
874
|
-
indeterminate?: boolean;
|
|
875
|
-
list?: string;
|
|
876
|
-
max?: number | string;
|
|
877
|
-
maxLength?: number;
|
|
878
|
-
maxlength?: number | string;
|
|
879
|
-
min?: number | string;
|
|
880
|
-
minLength?: number;
|
|
881
|
-
minlength?: number | string;
|
|
882
|
-
multiple?: boolean;
|
|
883
|
-
name?: string;
|
|
884
|
-
onSelect?: (event: Event) => void;
|
|
885
|
-
onselect?: (event: Event) => void;
|
|
886
|
-
pattern?: string;
|
|
887
|
-
placeholder?: string;
|
|
888
|
-
readOnly?: boolean;
|
|
889
|
-
readonly?: boolean | string;
|
|
890
|
-
required?: boolean;
|
|
891
|
-
selectionStart?: number | string;
|
|
892
|
-
selectionEnd?: number | string;
|
|
893
|
-
selectionDirection?: string;
|
|
894
|
-
size?: number;
|
|
895
|
-
src?: string;
|
|
896
|
-
step?: number | string;
|
|
897
|
-
type?: string;
|
|
898
|
-
value?: string | string[] | number;
|
|
899
|
-
valueAsDate?: any;
|
|
900
|
-
valueAsNumber?: any;
|
|
901
|
-
webkitdirectory?: boolean;
|
|
902
|
-
webkitEntries?: any;
|
|
903
|
-
width?: number | string;
|
|
904
|
-
popoverTargetAction?: string;
|
|
905
|
-
popoverTargetElement?: Element | null;
|
|
906
|
-
popoverTarget?: string;
|
|
907
|
-
}
|
|
908
|
-
interface KeygenHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
909
|
-
challenge?: string;
|
|
910
|
-
disabled?: boolean;
|
|
911
|
-
form?: string;
|
|
912
|
-
keyType?: string;
|
|
913
|
-
keytype?: string;
|
|
914
|
-
keyParams?: string;
|
|
915
|
-
keyparams?: string;
|
|
916
|
-
name?: string;
|
|
917
|
-
}
|
|
918
|
-
interface LabelHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
919
|
-
form?: string;
|
|
920
|
-
htmlFor?: string;
|
|
921
|
-
}
|
|
922
|
-
interface LiHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
923
|
-
value?: string | string[] | number;
|
|
924
|
-
}
|
|
925
|
-
interface LinkHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
926
|
-
as?: string;
|
|
927
|
-
href?: string;
|
|
928
|
-
hrefLang?: string;
|
|
929
|
-
hreflang?: string;
|
|
930
|
-
importance?: "low" | "auto" | "high";
|
|
931
|
-
integrity?: string;
|
|
932
|
-
media?: string;
|
|
933
|
-
rel?: string;
|
|
934
|
-
sizes?: string;
|
|
935
|
-
type?: string;
|
|
936
|
-
}
|
|
937
|
-
interface MapHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
938
|
-
name?: string;
|
|
939
|
-
}
|
|
940
|
-
interface MenuHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
941
|
-
type?: string;
|
|
942
|
-
}
|
|
943
|
-
interface MediaHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
944
|
-
autoPlay?: boolean;
|
|
945
|
-
autoplay?: boolean | string;
|
|
946
|
-
controls?: boolean;
|
|
947
|
-
controlslist?: "nodownload" | "nofullscreen" | "noremoteplayback";
|
|
948
|
-
controlsList?: "nodownload" | "nofullscreen" | "noremoteplayback";
|
|
949
|
-
crossOrigin?: string;
|
|
950
|
-
crossorigin?: string;
|
|
951
|
-
loop?: boolean;
|
|
952
|
-
mediaGroup?: string;
|
|
953
|
-
mediagroup?: string;
|
|
954
|
-
muted?: boolean;
|
|
955
|
-
preload?: string;
|
|
956
|
-
src?: string;
|
|
957
|
-
onAbort?: (event: Event) => void;
|
|
958
|
-
onCanPlay?: (event: Event) => void;
|
|
959
|
-
onCanPlayThrough?: (event: Event) => void;
|
|
960
|
-
onDurationChange?: (event: Event) => void;
|
|
961
|
-
onEmptied?: (event: Event) => void;
|
|
962
|
-
onEnded?: (event: Event) => void;
|
|
963
|
-
onError?: (event: Event) => void;
|
|
964
|
-
onInterruptBegin?: (event: Event) => void;
|
|
965
|
-
onInterruptEnd?: (event: Event) => void;
|
|
966
|
-
onLoadedData?: (event: Event) => void;
|
|
967
|
-
onLoadedMetaData?: (event: Event) => void;
|
|
968
|
-
onLoadStart?: (event: Event) => void;
|
|
969
|
-
onMozAudioAvailable?: (event: Event) => void;
|
|
970
|
-
onPause?: (event: Event) => void;
|
|
971
|
-
onPlay?: (event: Event) => void;
|
|
972
|
-
onPlaying?: (event: Event) => void;
|
|
973
|
-
onProgress?: (event: Event) => void;
|
|
974
|
-
onRateChange?: (event: Event) => void;
|
|
975
|
-
onSeeked?: (event: Event) => void;
|
|
976
|
-
onSeeking?: (event: Event) => void;
|
|
977
|
-
onStalled?: (event: Event) => void;
|
|
978
|
-
onSuspend?: (event: Event) => void;
|
|
979
|
-
onTimeUpdate?: (event: Event) => void;
|
|
980
|
-
onVolumeChange?: (event: Event) => void;
|
|
981
|
-
onWaiting?: (event: Event) => void;
|
|
982
|
-
}
|
|
983
|
-
interface MetaHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
984
|
-
charSet?: string;
|
|
985
|
-
charset?: string;
|
|
986
|
-
content?: string;
|
|
987
|
-
httpEquiv?: string;
|
|
988
|
-
httpequiv?: string;
|
|
989
|
-
name?: string;
|
|
990
|
-
}
|
|
991
|
-
interface MeterHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
992
|
-
form?: string;
|
|
993
|
-
high?: number;
|
|
994
|
-
low?: number;
|
|
995
|
-
max?: number | string;
|
|
996
|
-
min?: number | string;
|
|
997
|
-
optimum?: number;
|
|
998
|
-
value?: string | string[] | number;
|
|
999
|
-
}
|
|
1000
|
-
interface QuoteHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
1001
|
-
cite?: string;
|
|
1002
|
-
}
|
|
1003
|
-
interface ObjectHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
1004
|
-
classID?: string;
|
|
1005
|
-
classid?: string;
|
|
1006
|
-
data?: string;
|
|
1007
|
-
form?: string;
|
|
1008
|
-
height?: number | string;
|
|
1009
|
-
name?: string;
|
|
1010
|
-
type?: string;
|
|
1011
|
-
useMap?: string;
|
|
1012
|
-
usemap?: string;
|
|
1013
|
-
width?: number | string;
|
|
1014
|
-
wmode?: string;
|
|
1015
|
-
}
|
|
1016
|
-
interface OlHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
1017
|
-
reversed?: boolean;
|
|
1018
|
-
start?: number;
|
|
1019
|
-
}
|
|
1020
|
-
interface OptgroupHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
1021
|
-
disabled?: boolean;
|
|
1022
|
-
label?: string;
|
|
1023
|
-
}
|
|
1024
|
-
interface OptionHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
1025
|
-
disabled?: boolean;
|
|
1026
|
-
label?: string;
|
|
1027
|
-
selected?: boolean;
|
|
1028
|
-
value?: string | string[] | number;
|
|
1029
|
-
}
|
|
1030
|
-
interface OutputHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
1031
|
-
form?: string;
|
|
1032
|
-
htmlFor?: string;
|
|
1033
|
-
name?: string;
|
|
1034
|
-
}
|
|
1035
|
-
interface ParamHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
1036
|
-
name?: string;
|
|
1037
|
-
value?: string | string[] | number;
|
|
1038
|
-
}
|
|
1039
|
-
interface ProgressHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
1040
|
-
max?: number | string;
|
|
1041
|
-
value?: string | string[] | number;
|
|
1042
|
-
}
|
|
1043
|
-
interface ScriptHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
1044
|
-
async?: boolean;
|
|
1045
|
-
charSet?: string;
|
|
1046
|
-
charset?: string;
|
|
1047
|
-
crossOrigin?: string;
|
|
1048
|
-
crossorigin?: string;
|
|
1049
|
-
defer?: boolean;
|
|
1050
|
-
importance?: "low" | "auto" | "high";
|
|
1051
|
-
integrity?: string;
|
|
1052
|
-
nonce?: string;
|
|
1053
|
-
src?: string;
|
|
1054
|
-
type?: string;
|
|
1055
|
-
}
|
|
1056
|
-
interface SelectHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
1057
|
-
disabled?: boolean;
|
|
1058
|
-
form?: string;
|
|
1059
|
-
multiple?: boolean;
|
|
1060
|
-
name?: string;
|
|
1061
|
-
required?: boolean;
|
|
1062
|
-
size?: number;
|
|
1063
|
-
autoComplete?: string;
|
|
1064
|
-
autocomplete?: string;
|
|
1065
|
-
}
|
|
1066
|
-
interface SourceHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
1067
|
-
height?: number;
|
|
1068
|
-
media?: string;
|
|
1069
|
-
sizes?: string;
|
|
1070
|
-
src?: string;
|
|
1071
|
-
srcSet?: string;
|
|
1072
|
-
type?: string;
|
|
1073
|
-
width?: number;
|
|
1074
|
-
}
|
|
1075
|
-
interface StyleHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
1076
|
-
media?: string;
|
|
1077
|
-
nonce?: string;
|
|
1078
|
-
scoped?: boolean;
|
|
1079
|
-
type?: string;
|
|
1080
|
-
}
|
|
1081
|
-
interface TableHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
1082
|
-
cellPadding?: number | string;
|
|
1083
|
-
cellpadding?: number | string;
|
|
1084
|
-
cellSpacing?: number | string;
|
|
1085
|
-
cellspacing?: number | string;
|
|
1086
|
-
summary?: string;
|
|
1087
|
-
}
|
|
1088
|
-
interface TextareaHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
1089
|
-
autoComplete?: string;
|
|
1090
|
-
autocomplete?: string;
|
|
1091
|
-
cols?: number;
|
|
1092
|
-
disabled?: boolean;
|
|
1093
|
-
form?: string;
|
|
1094
|
-
maxLength?: number;
|
|
1095
|
-
maxlength?: number | string;
|
|
1096
|
-
minLength?: number;
|
|
1097
|
-
minlength?: number | string;
|
|
1098
|
-
name?: string;
|
|
1099
|
-
onSelect?: (event: Event) => void;
|
|
1100
|
-
onselect?: (event: Event) => void;
|
|
1101
|
-
placeholder?: string;
|
|
1102
|
-
readOnly?: boolean;
|
|
1103
|
-
readonly?: boolean | string;
|
|
1104
|
-
required?: boolean;
|
|
1105
|
-
rows?: number;
|
|
1106
|
-
value?: string | string[] | number;
|
|
1107
|
-
wrap?: string;
|
|
1108
|
-
}
|
|
1109
|
-
interface TdHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
1110
|
-
colSpan?: number;
|
|
1111
|
-
headers?: string;
|
|
1112
|
-
rowSpan?: number;
|
|
1113
|
-
}
|
|
1114
|
-
interface ThHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
1115
|
-
abbr?: string;
|
|
1116
|
-
colSpan?: number;
|
|
1117
|
-
headers?: string;
|
|
1118
|
-
rowSpan?: number;
|
|
1119
|
-
rowspan?: number | string;
|
|
1120
|
-
scope?: string;
|
|
1121
|
-
}
|
|
1122
|
-
interface TimeHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
1123
|
-
dateTime?: string;
|
|
1124
|
-
}
|
|
1125
|
-
interface TrackHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
1126
|
-
default?: boolean;
|
|
1127
|
-
kind?: string;
|
|
1128
|
-
label?: string;
|
|
1129
|
-
src?: string;
|
|
1130
|
-
srcLang?: string;
|
|
1131
|
-
srclang?: string;
|
|
1132
|
-
}
|
|
1133
|
-
interface VideoHTMLAttributes<T> extends MediaHTMLAttributes<T> {
|
|
1134
|
-
height?: number | string;
|
|
1135
|
-
playsInline?: boolean;
|
|
1136
|
-
playsinline?: boolean | string;
|
|
1137
|
-
poster?: string;
|
|
1138
|
-
width?: number | string;
|
|
1139
|
-
}
|
|
1140
|
-
interface HTMLAttributes<T = HTMLElement> extends DOMAttributes<T> {
|
|
1141
|
-
innerHTML?: string;
|
|
1142
|
-
accessKey?: string;
|
|
1143
|
-
autoFocus?: boolean;
|
|
1144
|
-
autofocus?: boolean | string;
|
|
1145
|
-
class?: string | {
|
|
1146
|
-
[className: string]: boolean;
|
|
1147
|
-
};
|
|
1148
|
-
contentEditable?: boolean | string;
|
|
1149
|
-
contenteditable?: boolean | string;
|
|
1150
|
-
contextMenu?: string;
|
|
1151
|
-
contextmenu?: string;
|
|
1152
|
-
dir?: string;
|
|
1153
|
-
draggable?: boolean;
|
|
1154
|
-
hidden?: boolean;
|
|
1155
|
-
id?: string;
|
|
1156
|
-
inert?: boolean;
|
|
1157
|
-
lang?: string;
|
|
1158
|
-
spellcheck?: "true" | "false" | any;
|
|
1159
|
-
style?: {
|
|
1160
|
-
[key: string]: string | undefined;
|
|
1161
|
-
};
|
|
1162
|
-
tabIndex?: number;
|
|
1163
|
-
tabindex?: number | string;
|
|
1164
|
-
title?: string;
|
|
1165
|
-
popover?: string | null;
|
|
1166
|
-
inputMode?: string;
|
|
1167
|
-
inputmode?: string;
|
|
1168
|
-
enterKeyHint?: string;
|
|
1169
|
-
enterkeyhint?: string;
|
|
1170
|
-
is?: string;
|
|
1171
|
-
radioGroup?: string;
|
|
1172
|
-
radiogroup?: string;
|
|
1173
|
-
role?: string;
|
|
1174
|
-
about?: string;
|
|
1175
|
-
datatype?: string;
|
|
1176
|
-
inlist?: any;
|
|
1177
|
-
prefix?: string;
|
|
1178
|
-
property?: string;
|
|
1179
|
-
resource?: string;
|
|
1180
|
-
typeof?: string;
|
|
1181
|
-
vocab?: string;
|
|
1182
|
-
autoCapitalize?: string;
|
|
1183
|
-
autocapitalize?: string;
|
|
1184
|
-
autoCorrect?: string;
|
|
1185
|
-
autocorrect?: string;
|
|
1186
|
-
autoSave?: string;
|
|
1187
|
-
autosave?: string;
|
|
1188
|
-
color?: string;
|
|
1189
|
-
itemProp?: string;
|
|
1190
|
-
itemprop?: string;
|
|
1191
|
-
itemScope?: boolean;
|
|
1192
|
-
itemscope?: boolean;
|
|
1193
|
-
itemType?: string;
|
|
1194
|
-
itemtype?: string;
|
|
1195
|
-
itemID?: string;
|
|
1196
|
-
itemid?: string;
|
|
1197
|
-
itemRef?: string;
|
|
1198
|
-
itemref?: string;
|
|
1199
|
-
results?: number;
|
|
1200
|
-
security?: string;
|
|
1201
|
-
unselectable?: boolean;
|
|
1202
|
-
}
|
|
1203
|
-
interface SVGAttributes<T = SVGElement> extends DOMAttributes<T> {
|
|
1204
|
-
class?: string | {
|
|
1205
|
-
[className: string]: boolean;
|
|
1206
|
-
};
|
|
1207
|
-
color?: string;
|
|
1208
|
-
height?: number | string;
|
|
1209
|
-
id?: string;
|
|
1210
|
-
lang?: string;
|
|
1211
|
-
max?: number | string;
|
|
1212
|
-
media?: string;
|
|
1213
|
-
method?: string;
|
|
1214
|
-
min?: number | string;
|
|
1215
|
-
name?: string;
|
|
1216
|
-
style?: {
|
|
1217
|
-
[key: string]: string | undefined;
|
|
1218
|
-
};
|
|
1219
|
-
target?: string;
|
|
1220
|
-
type?: string;
|
|
1221
|
-
width?: number | string;
|
|
1222
|
-
role?: string;
|
|
1223
|
-
tabindex?: number;
|
|
1224
|
-
"accent-height"?: number | string;
|
|
1225
|
-
accumulate?: "none" | "sum";
|
|
1226
|
-
additive?: "replace" | "sum";
|
|
1227
|
-
"alignment-baseline"?: "auto" | "baseline" | "before-edge" | "text-before-edge" | "middle" | "central" | "after-edge" | "text-after-edge" | "ideographic" | "alphabetic" | "hanging" | "mathematical" | "inherit";
|
|
1228
|
-
allowReorder?: "no" | "yes";
|
|
1229
|
-
alphabetic?: number | string;
|
|
1230
|
-
amplitude?: number | string;
|
|
1231
|
-
"arabic-form"?: "initial" | "medial" | "terminal" | "isolated";
|
|
1232
|
-
ascent?: number | string;
|
|
1233
|
-
attributeName?: string;
|
|
1234
|
-
attributeType?: string;
|
|
1235
|
-
autoReverse?: number | string;
|
|
1236
|
-
azimuth?: number | string;
|
|
1237
|
-
baseFrequency?: number | string;
|
|
1238
|
-
"baseline-shift"?: number | string;
|
|
1239
|
-
baseProfile?: number | string;
|
|
1240
|
-
bbox?: number | string;
|
|
1241
|
-
begin?: number | string;
|
|
1242
|
-
bias?: number | string;
|
|
1243
|
-
by?: number | string;
|
|
1244
|
-
calcMode?: number | string;
|
|
1245
|
-
"cap-height"?: number | string;
|
|
1246
|
-
clip?: number | string;
|
|
1247
|
-
"clip-path"?: string;
|
|
1248
|
-
clipPathUnits?: number | string;
|
|
1249
|
-
"clip-rule"?: number | string;
|
|
1250
|
-
"color-interpolation"?: number | string;
|
|
1251
|
-
"color-interpolation-filters"?: "auto" | "sRGB" | "linearRGB";
|
|
1252
|
-
"color-profile"?: number | string;
|
|
1253
|
-
"color-rendering"?: number | string;
|
|
1254
|
-
contentScriptType?: number | string;
|
|
1255
|
-
contentStyleType?: number | string;
|
|
1256
|
-
cursor?: number | string;
|
|
1257
|
-
cx?: number | string;
|
|
1258
|
-
cy?: number | string;
|
|
1259
|
-
d?: string;
|
|
1260
|
-
decelerate?: number | string;
|
|
1261
|
-
descent?: number | string;
|
|
1262
|
-
diffuseConstant?: number | string;
|
|
1263
|
-
direction?: number | string;
|
|
1264
|
-
display?: number | string;
|
|
1265
|
-
divisor?: number | string;
|
|
1266
|
-
"dominant-baseline"?: number | string;
|
|
1267
|
-
dur?: number | string;
|
|
1268
|
-
dx?: number | string;
|
|
1269
|
-
dy?: number | string;
|
|
1270
|
-
"edge-mode"?: number | string;
|
|
1271
|
-
elevation?: number | string;
|
|
1272
|
-
"enable-background"?: number | string;
|
|
1273
|
-
end?: number | string;
|
|
1274
|
-
exponent?: number | string;
|
|
1275
|
-
externalResourcesRequired?: number | string;
|
|
1276
|
-
fill?: string;
|
|
1277
|
-
"fill-opacity"?: number | string;
|
|
1278
|
-
"fill-rule"?: "nonzero" | "evenodd" | "inherit";
|
|
1279
|
-
filter?: string;
|
|
1280
|
-
filterRes?: number | string;
|
|
1281
|
-
filterUnits?: number | string;
|
|
1282
|
-
"flood-color"?: number | string;
|
|
1283
|
-
"flood-opacity"?: number | string;
|
|
1284
|
-
focusable?: number | string;
|
|
1285
|
-
"font-family"?: string;
|
|
1286
|
-
"font-size"?: number | string;
|
|
1287
|
-
"font-size-adjust"?: number | string;
|
|
1288
|
-
"font-stretch"?: number | string;
|
|
1289
|
-
"font-style"?: number | string;
|
|
1290
|
-
"font-variant"?: number | string;
|
|
1291
|
-
"font-weight"?: number | string;
|
|
1292
|
-
format?: number | string;
|
|
1293
|
-
from?: number | string;
|
|
1294
|
-
fx?: number | string;
|
|
1295
|
-
fy?: number | string;
|
|
1296
|
-
g1?: number | string;
|
|
1297
|
-
g2?: number | string;
|
|
1298
|
-
"glyph-name"?: number | string;
|
|
1299
|
-
"glyph-orientation-horizontal"?: number | string;
|
|
1300
|
-
"glyph-orientation-vertical"?: number | string;
|
|
1301
|
-
glyphRef?: number | string;
|
|
1302
|
-
gradientTransform?: string;
|
|
1303
|
-
gradientUnits?: string;
|
|
1304
|
-
hanging?: number | string;
|
|
1305
|
-
"horiz-adv-x"?: number | string;
|
|
1306
|
-
"horiz-origin-x"?: number | string;
|
|
1307
|
-
href?: string;
|
|
1308
|
-
ideographic?: number | string;
|
|
1309
|
-
"image-rendering"?: number | string;
|
|
1310
|
-
in2?: number | string;
|
|
1311
|
-
in?: string;
|
|
1312
|
-
intercept?: number | string;
|
|
1313
|
-
k1?: number | string;
|
|
1314
|
-
k2?: number | string;
|
|
1315
|
-
k3?: number | string;
|
|
1316
|
-
k4?: number | string;
|
|
1317
|
-
k?: number | string;
|
|
1318
|
-
kernelMatrix?: number | string;
|
|
1319
|
-
kernelUnitLength?: number | string;
|
|
1320
|
-
kerning?: number | string;
|
|
1321
|
-
keyPoints?: number | string;
|
|
1322
|
-
keySplines?: number | string;
|
|
1323
|
-
keyTimes?: number | string;
|
|
1324
|
-
lengthAdjust?: number | string;
|
|
1325
|
-
"letter-spacing"?: number | string;
|
|
1326
|
-
"lighting-color"?: number | string;
|
|
1327
|
-
limitingConeAngle?: number | string;
|
|
1328
|
-
local?: number | string;
|
|
1329
|
-
"marker-end"?: string;
|
|
1330
|
-
markerHeight?: number | string;
|
|
1331
|
-
"marker-mid"?: string;
|
|
1332
|
-
"marker-start"?: string;
|
|
1333
|
-
markerUnits?: number | string;
|
|
1334
|
-
markerWidth?: number | string;
|
|
1335
|
-
mask?: string;
|
|
1336
|
-
maskContentUnits?: number | string;
|
|
1337
|
-
maskUnits?: number | string;
|
|
1338
|
-
mathematical?: number | string;
|
|
1339
|
-
mode?: number | string;
|
|
1340
|
-
numOctaves?: number | string;
|
|
1341
|
-
offset?: number | string;
|
|
1342
|
-
opacity?: number | string;
|
|
1343
|
-
operator?: number | string;
|
|
1344
|
-
order?: number | string;
|
|
1345
|
-
orient?: number | string;
|
|
1346
|
-
orientation?: number | string;
|
|
1347
|
-
origin?: number | string;
|
|
1348
|
-
overflow?: number | string;
|
|
1349
|
-
"overline-position"?: number | string;
|
|
1350
|
-
"overline-thickness"?: number | string;
|
|
1351
|
-
"paint-order"?: number | string;
|
|
1352
|
-
panose1?: number | string;
|
|
1353
|
-
pathLength?: number | string;
|
|
1354
|
-
patternContentUnits?: string;
|
|
1355
|
-
patternTransform?: number | string;
|
|
1356
|
-
patternUnits?: string;
|
|
1357
|
-
"pointer-events"?: number | string;
|
|
1358
|
-
points?: string;
|
|
1359
|
-
pointsAtX?: number | string;
|
|
1360
|
-
pointsAtY?: number | string;
|
|
1361
|
-
pointsAtZ?: number | string;
|
|
1362
|
-
preserveAlpha?: number | string;
|
|
1363
|
-
preserveAspectRatio?: string;
|
|
1364
|
-
primitiveUnits?: number | string;
|
|
1365
|
-
r?: number | string;
|
|
1366
|
-
radius?: number | string;
|
|
1367
|
-
refX?: number | string;
|
|
1368
|
-
refY?: number | string;
|
|
1369
|
-
"rendering-intent"?: number | string;
|
|
1370
|
-
repeatCount?: number | string;
|
|
1371
|
-
repeatDur?: number | string;
|
|
1372
|
-
requiredextensions?: number | string;
|
|
1373
|
-
requiredFeatures?: number | string;
|
|
1374
|
-
restart?: number | string;
|
|
1375
|
-
result?: string;
|
|
1376
|
-
rotate?: number | string;
|
|
1377
|
-
rx?: number | string;
|
|
1378
|
-
ry?: number | string;
|
|
1379
|
-
scale?: number | string;
|
|
1380
|
-
seed?: number | string;
|
|
1381
|
-
"shape-rendering"?: number | string;
|
|
1382
|
-
slope?: number | string;
|
|
1383
|
-
spacing?: number | string;
|
|
1384
|
-
specularConstant?: number | string;
|
|
1385
|
-
specularExponent?: number | string;
|
|
1386
|
-
speed?: number | string;
|
|
1387
|
-
spreadMethod?: string;
|
|
1388
|
-
startOffset?: number | string;
|
|
1389
|
-
stdDeviation?: number | string;
|
|
1390
|
-
stemh?: number | string;
|
|
1391
|
-
stemv?: number | string;
|
|
1392
|
-
stitchTiles?: number | string;
|
|
1393
|
-
"stop-color"?: string;
|
|
1394
|
-
"stop-opacity"?: number | string;
|
|
1395
|
-
"strikethrough-position"?: number | string;
|
|
1396
|
-
"strikethrough-thickness"?: number | string;
|
|
1397
|
-
string?: number | string;
|
|
1398
|
-
stroke?: string;
|
|
1399
|
-
"stroke-dasharray"?: string | number;
|
|
1400
|
-
"stroke-dashoffset"?: string | number;
|
|
1401
|
-
"stroke-linecap"?: "butt" | "round" | "square" | "inherit";
|
|
1402
|
-
"stroke-linejoin"?: "miter" | "round" | "bevel" | "inherit";
|
|
1403
|
-
"stroke-miterlimit"?: string;
|
|
1404
|
-
"stroke-opacity"?: number | string;
|
|
1405
|
-
"stroke-width"?: number | string;
|
|
1406
|
-
surfaceScale?: number | string;
|
|
1407
|
-
systemLanguage?: number | string;
|
|
1408
|
-
tableValues?: number | string;
|
|
1409
|
-
targetX?: number | string;
|
|
1410
|
-
targetY?: number | string;
|
|
1411
|
-
"text-anchor"?: string;
|
|
1412
|
-
"text-decoration"?: number | string;
|
|
1413
|
-
textLength?: number | string;
|
|
1414
|
-
"text-rendering"?: number | string;
|
|
1415
|
-
to?: number | string;
|
|
1416
|
-
transform?: string;
|
|
1417
|
-
u1?: number | string;
|
|
1418
|
-
u2?: number | string;
|
|
1419
|
-
"underline-position"?: number | string;
|
|
1420
|
-
"underline-thickness"?: number | string;
|
|
1421
|
-
unicode?: number | string;
|
|
1422
|
-
"unicode-bidi"?: number | string;
|
|
1423
|
-
"unicode-range"?: number | string;
|
|
1424
|
-
"units-per-em"?: number | string;
|
|
1425
|
-
"v-alphabetic"?: number | string;
|
|
1426
|
-
values?: string;
|
|
1427
|
-
"vector-effect"?: number | string;
|
|
1428
|
-
version?: string;
|
|
1429
|
-
"vert-adv-y"?: number | string;
|
|
1430
|
-
"vert-origin-x"?: number | string;
|
|
1431
|
-
"vert-origin-y"?: number | string;
|
|
1432
|
-
"v-hanging"?: number | string;
|
|
1433
|
-
"v-ideographic"?: number | string;
|
|
1434
|
-
viewBox?: string;
|
|
1435
|
-
viewTarget?: number | string;
|
|
1436
|
-
visibility?: number | string;
|
|
1437
|
-
"v-mathematical"?: number | string;
|
|
1438
|
-
widths?: number | string;
|
|
1439
|
-
"word-spacing"?: number | string;
|
|
1440
|
-
"writing-mode"?: number | string;
|
|
1441
|
-
x1?: number | string;
|
|
1442
|
-
x2?: number | string;
|
|
1443
|
-
x?: number | string;
|
|
1444
|
-
"x-channel-selector"?: string;
|
|
1445
|
-
"x-height"?: number | string;
|
|
1446
|
-
xlinkActuate?: string;
|
|
1447
|
-
xlinkArcrole?: string;
|
|
1448
|
-
xlinkHref?: string;
|
|
1449
|
-
xlinkRole?: string;
|
|
1450
|
-
xlinkShow?: string;
|
|
1451
|
-
xlinkTitle?: string;
|
|
1452
|
-
xlinkType?: string;
|
|
1453
|
-
xmlBase?: string;
|
|
1454
|
-
xmlLang?: string;
|
|
1455
|
-
xmlns?: string;
|
|
1456
|
-
xmlSpace?: string;
|
|
1457
|
-
y1?: number | string;
|
|
1458
|
-
y2?: number | string;
|
|
1459
|
-
y?: number | string;
|
|
1460
|
-
yChannelSelector?: string;
|
|
1461
|
-
z?: number | string;
|
|
1462
|
-
zoomAndPan?: string;
|
|
1463
|
-
}
|
|
1464
|
-
interface DOMAttributes<T> extends JSXAttributes<T> {
|
|
1465
|
-
slot?: string;
|
|
1466
|
-
part?: string;
|
|
1467
|
-
exportparts?: string;
|
|
1468
|
-
onCopy?: (event: ClipboardEvent) => void;
|
|
1469
|
-
onCopyCapture?: (event: ClipboardEvent) => void;
|
|
1470
|
-
onCut?: (event: ClipboardEvent) => void;
|
|
1471
|
-
onCutCapture?: (event: ClipboardEvent) => void;
|
|
1472
|
-
onPaste?: (event: ClipboardEvent) => void;
|
|
1473
|
-
onPasteCapture?: (event: ClipboardEvent) => void;
|
|
1474
|
-
onCompositionend?: (event: CompositionEvent) => void;
|
|
1475
|
-
onCompositionendCapture?: (event: CompositionEvent) => void;
|
|
1476
|
-
onCompositionstart?: (event: CompositionEvent) => void;
|
|
1477
|
-
onCompositionstartCapture?: (event: CompositionEvent) => void;
|
|
1478
|
-
onCompositionupdate?: (event: CompositionEvent) => void;
|
|
1479
|
-
onCompositionupdateCapture?: (event: CompositionEvent) => void;
|
|
1480
|
-
onFocus?: (event: FocusEvent) => void;
|
|
1481
|
-
onFocusCapture?: (event: FocusEvent) => void;
|
|
1482
|
-
onFocusin?: (event: FocusEvent) => void;
|
|
1483
|
-
onFocusinCapture?: (event: FocusEvent) => void;
|
|
1484
|
-
onFocusout?: (event: FocusEvent) => void;
|
|
1485
|
-
onFocusoutCapture?: (event: FocusEvent) => void;
|
|
1486
|
-
onBlur?: (event: FocusEvent) => void;
|
|
1487
|
-
onBlurCapture?: (event: FocusEvent) => void;
|
|
1488
|
-
onChange?: (event: Event) => void;
|
|
1489
|
-
onChangeCapture?: (event: Event) => void;
|
|
1490
|
-
onInput?: (event: InputEvent) => void;
|
|
1491
|
-
onInputCapture?: (event: InputEvent) => void;
|
|
1492
|
-
onReset?: (event: Event) => void;
|
|
1493
|
-
onResetCapture?: (event: Event) => void;
|
|
1494
|
-
onSubmit?: (event: Event) => void;
|
|
1495
|
-
onSubmitCapture?: (event: Event) => void;
|
|
1496
|
-
onInvalid?: (event: Event) => void;
|
|
1497
|
-
onInvalidCapture?: (event: Event) => void;
|
|
1498
|
-
onBeforeToggle?: (event: Event) => void;
|
|
1499
|
-
onBeforeToggleCapture?: (event: Event) => void;
|
|
1500
|
-
onToggle?: (event: Event) => void;
|
|
1501
|
-
onToggleCapture?: (event: Event) => void;
|
|
1502
|
-
onLoad?: (event: Event) => void;
|
|
1503
|
-
onLoadCapture?: (event: Event) => void;
|
|
1504
|
-
onError?: (event: Event) => void;
|
|
1505
|
-
onErrorCapture?: (event: Event) => void;
|
|
1506
|
-
onKeyDown?: (event: KeyboardEvent) => void;
|
|
1507
|
-
onKeyDownCapture?: (event: KeyboardEvent) => void;
|
|
1508
|
-
onKeyPress?: (event: KeyboardEvent) => void;
|
|
1509
|
-
onKeyPressCapture?: (event: KeyboardEvent) => void;
|
|
1510
|
-
onKeyUp?: (event: KeyboardEvent) => void;
|
|
1511
|
-
onKeyUpCapture?: (event: KeyboardEvent) => void;
|
|
1512
|
-
onAuxClick?: (event: MouseEvent) => void;
|
|
1513
|
-
onClick?: (event: MouseEvent) => void;
|
|
1514
|
-
onClickCapture?: (event: MouseEvent) => void;
|
|
1515
|
-
onContextMenu?: (event: MouseEvent) => void;
|
|
1516
|
-
onContextMenuCapture?: (event: MouseEvent) => void;
|
|
1517
|
-
onDblClick?: (event: MouseEvent) => void;
|
|
1518
|
-
onDblClickCapture?: (event: MouseEvent) => void;
|
|
1519
|
-
onDrag?: (event: DragEvent) => void;
|
|
1520
|
-
onDragCapture?: (event: DragEvent) => void;
|
|
1521
|
-
onDragEnd?: (event: DragEvent) => void;
|
|
1522
|
-
onDragEndCapture?: (event: DragEvent) => void;
|
|
1523
|
-
onDragEnter?: (event: DragEvent) => void;
|
|
1524
|
-
onDragEnterCapture?: (event: DragEvent) => void;
|
|
1525
|
-
onDragExit?: (event: DragEvent) => void;
|
|
1526
|
-
onDragExitCapture?: (event: DragEvent) => void;
|
|
1527
|
-
onDragLeave?: (event: DragEvent) => void;
|
|
1528
|
-
onDragLeaveCapture?: (event: DragEvent) => void;
|
|
1529
|
-
onDragOver?: (event: DragEvent) => void;
|
|
1530
|
-
onDragOverCapture?: (event: DragEvent) => void;
|
|
1531
|
-
onDragStart?: (event: DragEvent) => void;
|
|
1532
|
-
onDragStartCapture?: (event: DragEvent) => void;
|
|
1533
|
-
onDrop?: (event: DragEvent) => void;
|
|
1534
|
-
onDropCapture?: (event: DragEvent) => void;
|
|
1535
|
-
onMouseDown?: (event: MouseEvent) => void;
|
|
1536
|
-
onMouseDownCapture?: (event: MouseEvent) => void;
|
|
1537
|
-
onMouseEnter?: (event: MouseEvent) => void;
|
|
1538
|
-
onMouseLeave?: (event: MouseEvent) => void;
|
|
1539
|
-
onMouseMove?: (event: MouseEvent) => void;
|
|
1540
|
-
onMouseMoveCapture?: (event: MouseEvent) => void;
|
|
1541
|
-
onMouseOut?: (event: MouseEvent) => void;
|
|
1542
|
-
onMouseOutCapture?: (event: MouseEvent) => void;
|
|
1543
|
-
onMouseOver?: (event: MouseEvent) => void;
|
|
1544
|
-
onMouseOverCapture?: (event: MouseEvent) => void;
|
|
1545
|
-
onMouseUp?: (event: MouseEvent) => void;
|
|
1546
|
-
onMouseUpCapture?: (event: MouseEvent) => void;
|
|
1547
|
-
onTouchCancel?: (event: TouchEvent) => void;
|
|
1548
|
-
onTouchCancelCapture?: (event: TouchEvent) => void;
|
|
1549
|
-
onTouchEnd?: (event: TouchEvent) => void;
|
|
1550
|
-
onTouchEndCapture?: (event: TouchEvent) => void;
|
|
1551
|
-
onTouchMove?: (event: TouchEvent) => void;
|
|
1552
|
-
onTouchMoveCapture?: (event: TouchEvent) => void;
|
|
1553
|
-
onTouchStart?: (event: TouchEvent) => void;
|
|
1554
|
-
onTouchStartCapture?: (event: TouchEvent) => void;
|
|
1555
|
-
onPointerDown?: (event: PointerEvent) => void;
|
|
1556
|
-
onPointerDownCapture?: (event: PointerEvent) => void;
|
|
1557
|
-
onPointerMove?: (event: PointerEvent) => void;
|
|
1558
|
-
onPointerMoveCapture?: (event: PointerEvent) => void;
|
|
1559
|
-
onPointerUp?: (event: PointerEvent) => void;
|
|
1560
|
-
onPointerUpCapture?: (event: PointerEvent) => void;
|
|
1561
|
-
onPointerCancel?: (event: PointerEvent) => void;
|
|
1562
|
-
onPointerCancelCapture?: (event: PointerEvent) => void;
|
|
1563
|
-
onPointerEnter?: (event: PointerEvent) => void;
|
|
1564
|
-
onPointerEnterCapture?: (event: PointerEvent) => void;
|
|
1565
|
-
onPointerLeave?: (event: PointerEvent) => void;
|
|
1566
|
-
onPointerLeaveCapture?: (event: PointerEvent) => void;
|
|
1567
|
-
onPointerOver?: (event: PointerEvent) => void;
|
|
1568
|
-
onPointerOverCapture?: (event: PointerEvent) => void;
|
|
1569
|
-
onPointerOut?: (event: PointerEvent) => void;
|
|
1570
|
-
onPointerOutCapture?: (event: PointerEvent) => void;
|
|
1571
|
-
onGotPointerCapture?: (event: PointerEvent) => void;
|
|
1572
|
-
onGotPointerCaptureCapture?: (event: PointerEvent) => void;
|
|
1573
|
-
onLostPointerCapture?: (event: PointerEvent) => void;
|
|
1574
|
-
onLostPointerCaptureCapture?: (event: PointerEvent) => void;
|
|
1575
|
-
onScroll?: (event: UIEvent) => void;
|
|
1576
|
-
onScrollCapture?: (event: UIEvent) => void;
|
|
1577
|
-
onWheel?: (event: WheelEvent) => void;
|
|
1578
|
-
onWheelCapture?: (event: WheelEvent) => void;
|
|
1579
|
-
onAnimationStart?: (event: AnimationEvent) => void;
|
|
1580
|
-
onAnimationStartCapture?: (event: AnimationEvent) => void;
|
|
1581
|
-
onAnimationEnd?: (event: AnimationEvent) => void;
|
|
1582
|
-
onAnimationEndCapture?: (event: AnimationEvent) => void;
|
|
1583
|
-
onAnimationIteration?: (event: AnimationEvent) => void;
|
|
1584
|
-
onAnimationIterationCapture?: (event: AnimationEvent) => void;
|
|
1585
|
-
onTransitionCancel?: (event: TransitionEvent) => void;
|
|
1586
|
-
onTransitionCancelCapture?: (event: TransitionEvent) => void;
|
|
1587
|
-
onTransitionEnd?: (event: TransitionEvent) => void;
|
|
1588
|
-
onTransitionEndCapture?: (event: TransitionEvent) => void;
|
|
1589
|
-
onTransitionRun?: (event: TransitionEvent) => void;
|
|
1590
|
-
onTransitionRunCapture?: (event: TransitionEvent) => void;
|
|
1591
|
-
onTransitionStart?: (event: TransitionEvent) => void;
|
|
1592
|
-
onTransitionStartCapture?: (event: TransitionEvent) => void;
|
|
1593
|
-
}
|
|
567
|
+
/**
|
|
568
|
+
* Values stored in SearchcraftStore.
|
|
569
|
+
*/
|
|
570
|
+
export interface SearchcraftStateValues {
|
|
571
|
+
adClientResponseItems: AdClientResponseItem[];
|
|
572
|
+
core: SearchcraftCore | undefined;
|
|
573
|
+
logger: Logger | undefined;
|
|
574
|
+
facetPathsForIndexFields: Record<string, FacetPathsForIndexField>;
|
|
575
|
+
isPopoverVisible: boolean;
|
|
576
|
+
isSearchInProgress: boolean;
|
|
577
|
+
rangeValueForIndexFields: Record<string, RangeValueForIndexField>;
|
|
578
|
+
searchMode: "fuzzy" | "exact";
|
|
579
|
+
searchClientResponseItems: SearchClientResponseItem[];
|
|
580
|
+
searchResponseTimeTaken: number | undefined;
|
|
581
|
+
searchResponseFacetPrime: FacetPrime | undefined;
|
|
582
|
+
searchResultsCount: number;
|
|
583
|
+
searchResultsPage: number;
|
|
584
|
+
searchResultsPerPage: number;
|
|
585
|
+
searchTerm: string;
|
|
586
|
+
sortType: "asc" | "desc";
|
|
1594
587
|
}
|
|
1595
|
-
export interface
|
|
1596
|
-
key?: string | number;
|
|
1597
|
-
ref?: (elm?: T) => void;
|
|
588
|
+
export interface SearchcraftState extends SearchcraftStateFunctions, SearchcraftStateValues {
|
|
1598
589
|
}
|
|
590
|
+
export declare const searchcraftStore: import("zustand").StoreApi<SearchcraftState>;
|
|
591
|
+
export declare function parseCustomStyles(styles: string | Record<string, string>): Record<string, string>;
|
|
592
|
+
export declare function serializeStyles(styles: Record<string, Record<string, string>>): string;
|
|
1599
593
|
export type SearchcraftSelectOption = {
|
|
1600
594
|
label: string;
|
|
1601
595
|
value: string | number;
|
|
1602
596
|
selected?: boolean;
|
|
1603
597
|
};
|
|
1604
|
-
|
|
598
|
+
export namespace Components {
|
|
1605
599
|
/**
|
|
1606
600
|
* An inline ad meant to be rendered in a list of search results.
|
|
1607
601
|
*/
|
|
@@ -1611,108 +605,8 @@ declare namespace Components {
|
|
|
1611
605
|
"adSource": SearchcraftAdSource;
|
|
1612
606
|
}
|
|
1613
607
|
/**
|
|
1614
|
-
* This web component
|
|
1615
|
-
* Once a query is submitted, the component formats and presents the result.
|
|
1616
|
-
* It is consumed within the `searchcraft-base-search-results` component.
|
|
1617
|
-
*/
|
|
1618
|
-
interface SearchcraftBaseSearchResult {
|
|
1619
|
-
/**
|
|
1620
|
-
* The relationship between the current document and the link for the button rendered when containerHref is not present.
|
|
1621
|
-
*/
|
|
1622
|
-
"buttonRel"?: "noreferrer" | "noopener" | "nofollow";
|
|
1623
|
-
/**
|
|
1624
|
-
* Where to open the link for the button rendered when containerHref is not present.
|
|
1625
|
-
*/
|
|
1626
|
-
"buttonTarget": "_blank" | "_self" | "_top" | "_parent";
|
|
1627
|
-
/**
|
|
1628
|
-
* The relationship between the current document and the link for the containing element.
|
|
1629
|
-
*/
|
|
1630
|
-
"containerRel"?: "noreferrer" | "noopener" | "nofollow";
|
|
1631
|
-
/**
|
|
1632
|
-
* Where to open the link for the containing element.
|
|
1633
|
-
*/
|
|
1634
|
-
"containerTarget": "_blank" | "_self" | "_top" | "_parent";
|
|
1635
|
-
/**
|
|
1636
|
-
* A custom styles object.
|
|
1637
|
-
*/
|
|
1638
|
-
"customStyles"?: string;
|
|
1639
|
-
/**
|
|
1640
|
-
* The position in the document. Used with the "document_clicked" measure event.
|
|
1641
|
-
*/
|
|
1642
|
-
"documentPosition": number;
|
|
1643
|
-
/**
|
|
1644
|
-
* The placement of the image.
|
|
1645
|
-
*/
|
|
1646
|
-
"imagePlacement": "left" | "right";
|
|
1647
|
-
"item"?: SearchClientResponseItem;
|
|
1648
|
-
"searchResultMappings"?: SearchResultMappings;
|
|
1649
|
-
}
|
|
1650
|
-
/**
|
|
1651
|
-
* This web component is responsible for displaying the results of a search query.
|
|
1652
|
-
* Once a query is submitted, the component formats and presents an ordered list of the results.
|
|
1653
|
-
* ## Usage
|
|
1654
|
-
* ```html
|
|
1655
|
-
* <!-- index.html -->
|
|
1656
|
-
* <searchcraft-base-search-results
|
|
1657
|
-
* ad-interval="4"
|
|
1658
|
-
* place-ad-at-start="false"
|
|
1659
|
-
* result-image-placement="right"
|
|
1660
|
-
* />
|
|
1661
|
-
* ```
|
|
1662
|
-
* ```js
|
|
1663
|
-
* // index.js
|
|
1664
|
-
* const baseSearchResults = document.querySelector('searchcraft-base-search-results');
|
|
1665
|
-
* baseSearchResults.searchResultMappings = containerHref: {
|
|
1666
|
-
* fieldNames: [
|
|
1667
|
-
* {
|
|
1668
|
-
* fieldName: 'canonical_link',
|
|
1669
|
-
* dataType: 'text',
|
|
1670
|
-
* },
|
|
1671
|
-
* ],
|
|
1672
|
-
* };
|
|
1673
|
-
* baseSearchResults.addEventListener('noResults', () => {
|
|
1674
|
-
* console.log('No search results found');
|
|
1675
|
-
* });
|
|
1676
|
-
* ```
|
|
1677
|
-
*/
|
|
1678
|
-
interface SearchcraftBaseSearchResults {
|
|
1679
|
-
/**
|
|
1680
|
-
* The label for the button rendered when containerHref is not present for each result.
|
|
1681
|
-
*/
|
|
1682
|
-
"buttonLabel"?: string;
|
|
1683
|
-
/**
|
|
1684
|
-
* The relationship between the current document and the link for the button rendered when containerHref is not present for each result.
|
|
1685
|
-
*/
|
|
1686
|
-
"buttonRel"?: "noreferrer" | "noopener" | "nofollow";
|
|
1687
|
-
/**
|
|
1688
|
-
* Where to open the link for the button rendered when containerHref is not present for each result.
|
|
1689
|
-
*/
|
|
1690
|
-
"buttonTarget": "_blank" | "_self" | "_top" | "_parent";
|
|
1691
|
-
/**
|
|
1692
|
-
* The relationship between the current document and the link for the containing element for each result.
|
|
1693
|
-
*/
|
|
1694
|
-
"containerRel"?: "noreferrer" | "noopener" | "nofollow";
|
|
1695
|
-
/**
|
|
1696
|
-
* Where to open the link for the containing element for each result.
|
|
1697
|
-
*/
|
|
1698
|
-
"containerTarget": "_blank" | "_self" | "_top" | "_parent";
|
|
1699
|
-
/**
|
|
1700
|
-
* A custom styles object.
|
|
1701
|
-
*/
|
|
1702
|
-
"customStylesForResults"?: string | Record<string, Record<string, string>>;
|
|
1703
|
-
/**
|
|
1704
|
-
* The placement of the image for each result.
|
|
1705
|
-
*/
|
|
1706
|
-
"resultImagePlacement": "left" | "right";
|
|
1707
|
-
/**
|
|
1708
|
-
* Formats the content rendered for each result.
|
|
1709
|
-
*/
|
|
1710
|
-
"searchResultMappings"?: SearchResultMappings;
|
|
1711
|
-
}
|
|
1712
|
-
/**
|
|
1713
|
-
* This web component represents a button to be consumed within the `search-input-form` component.
|
|
608
|
+
* This web component represents a button.
|
|
1714
609
|
* It provides a clear, interactive way for users to submit search queries or trigger actions in a search interface.
|
|
1715
|
-
* It is consumed within the `searchcraft-input-form` component.
|
|
1716
610
|
*/
|
|
1717
611
|
interface SearchcraftButton {
|
|
1718
612
|
/**
|
|
@@ -1746,23 +640,18 @@ declare namespace Components {
|
|
|
1746
640
|
}
|
|
1747
641
|
/**
|
|
1748
642
|
* This web component is designed to display a user-friendly error message when a search query fails, providing clear feedback to users and enhancing their experience when an issue arises during the search process.
|
|
1749
|
-
*
|
|
1750
|
-
*
|
|
1751
|
-
*
|
|
1752
|
-
*
|
|
643
|
+
* @js-example ```html
|
|
644
|
+
* <searchcraft-error-message>
|
|
645
|
+
* No search results found for query
|
|
646
|
+
* </searchcraft-error-message>
|
|
1753
647
|
* ```
|
|
1754
648
|
*/
|
|
1755
649
|
interface SearchcraftErrorMessage {
|
|
1756
|
-
/**
|
|
1757
|
-
* The error message.
|
|
1758
|
-
*/
|
|
1759
|
-
"errorMessage"?: string;
|
|
1760
650
|
}
|
|
1761
651
|
/**
|
|
1762
652
|
* This web component is designed to display facets in a search interface, allowing users to refine their search results by applying filters based on various attributes.
|
|
1763
653
|
* It is consumed within the `searchcraft-filter-panel`.
|
|
1764
|
-
*
|
|
1765
|
-
* ```html
|
|
654
|
+
* @js-example ```html
|
|
1766
655
|
* <!-- index.html -->
|
|
1767
656
|
* <searchcraft-facet-list field-name="title" />
|
|
1768
657
|
* ```
|
|
@@ -1782,11 +671,29 @@ declare namespace Components {
|
|
|
1782
671
|
}
|
|
1783
672
|
/**
|
|
1784
673
|
* This web component represents a series of filters that allows users to refine and control their search queries by applying various filter criteria.
|
|
1785
|
-
*
|
|
1786
|
-
*
|
|
674
|
+
* @import ```jsx
|
|
675
|
+
* // react
|
|
676
|
+
* import { SearchcraftFilterPanel } from "@searchcraft/react-sdk";
|
|
677
|
+
* // vue
|
|
678
|
+
* import { SearchcraftFilterPanel } from "@searchcraft/vue-sdk";
|
|
679
|
+
* ```
|
|
680
|
+
* @js-example ```html
|
|
1787
681
|
* <!-- index.html -->
|
|
1788
682
|
* <searchcraft-filter-panel />
|
|
1789
683
|
* ```
|
|
684
|
+
* ```js
|
|
685
|
+
* // index.js
|
|
686
|
+
* const filterPanel = document.querySelector('searchcraft-filter-panel');
|
|
687
|
+
* if (filterPanel) {
|
|
688
|
+
* filterPanel.items = [];
|
|
689
|
+
* }
|
|
690
|
+
* ```
|
|
691
|
+
* @react-example ```jsx
|
|
692
|
+
* <SearchcraftFilterPanel items={[]} />
|
|
693
|
+
* ```
|
|
694
|
+
* @vue-example ```jsx
|
|
695
|
+
* <SearchcraftFilterPanel :items="[]" />
|
|
696
|
+
* ```
|
|
1790
697
|
*/
|
|
1791
698
|
interface SearchcraftFilterPanel {
|
|
1792
699
|
/**
|
|
@@ -1797,21 +704,27 @@ declare namespace Components {
|
|
|
1797
704
|
/**
|
|
1798
705
|
* This web component provides a user-friendly interface for querying an indexed dataset, enabling users to easily search large collections of data.
|
|
1799
706
|
* It abstracts the complexities of index-based searching, making it accessible to users of all technical levels.
|
|
1800
|
-
*
|
|
1801
|
-
*
|
|
1802
|
-
*
|
|
1803
|
-
*
|
|
707
|
+
* @import ```jsx
|
|
708
|
+
* // react
|
|
709
|
+
* import { SearchcraftInputForm } from "@searchcraft/react-sdk";
|
|
710
|
+
* // vue
|
|
711
|
+
* import { SearchcraftInputForm } from "@searchcraft/vue-sdk";
|
|
1804
712
|
* ```
|
|
1805
|
-
* ```
|
|
1806
|
-
*
|
|
1807
|
-
*
|
|
713
|
+
* @js-example ```html
|
|
714
|
+
* <searchcraft-input-form auto-search />
|
|
715
|
+
* ```
|
|
716
|
+
* @react-example ```jsx
|
|
717
|
+
* <SearchcraftInputForm autoSearch />
|
|
718
|
+
* ```
|
|
719
|
+
* @vue-example ```jsx
|
|
720
|
+
* <SearchcraftInputForm autoSearch />
|
|
1808
721
|
* ```
|
|
1809
722
|
*/
|
|
1810
723
|
interface SearchcraftInputForm {
|
|
1811
724
|
/**
|
|
1812
725
|
* Whether or not to automatically submit the search term when the input changes.
|
|
1813
726
|
*/
|
|
1814
|
-
"autoSearch"
|
|
727
|
+
"autoSearch"?: boolean;
|
|
1815
728
|
/**
|
|
1816
729
|
* The label for the submit button.
|
|
1817
730
|
*/
|
|
@@ -1819,12 +732,8 @@ declare namespace Components {
|
|
|
1819
732
|
/**
|
|
1820
733
|
* Where to place the search button.
|
|
1821
734
|
*/
|
|
1822
|
-
"buttonPlacement"
|
|
735
|
+
"buttonPlacement"?: "left" | "right" | "none";
|
|
1823
736
|
"core"?: SearchcraftCore;
|
|
1824
|
-
/**
|
|
1825
|
-
* A custom styles object to be applied to the input element.
|
|
1826
|
-
*/
|
|
1827
|
-
"customStyles": string | Record<string, string>;
|
|
1828
737
|
/**
|
|
1829
738
|
* The label rendered above the input.
|
|
1830
739
|
*/
|
|
@@ -1832,13 +741,11 @@ declare namespace Components {
|
|
|
1832
741
|
/**
|
|
1833
742
|
* The input element's placeholder value.
|
|
1834
743
|
*/
|
|
1835
|
-
"placeholderValue"
|
|
744
|
+
"placeholderValue"?: string;
|
|
1836
745
|
}
|
|
1837
746
|
/**
|
|
1838
747
|
* This web component serves as the input label for the searchcraft-input-form component.
|
|
1839
|
-
*
|
|
1840
|
-
* ```html
|
|
1841
|
-
* <!-- index.html -->
|
|
748
|
+
* @js-example ```html
|
|
1842
749
|
* <searchcraft-input-label label="Search" />
|
|
1843
750
|
* ```
|
|
1844
751
|
*/
|
|
@@ -1850,63 +757,92 @@ declare namespace Components {
|
|
|
1850
757
|
"label": string;
|
|
1851
758
|
}
|
|
1852
759
|
/**
|
|
1853
|
-
* This web component is designed to facilitate pagination of search results.
|
|
1854
|
-
*
|
|
1855
|
-
*
|
|
1856
|
-
*
|
|
1857
|
-
*
|
|
760
|
+
* This web component is designed to facilitate pagination of search results. Once a query is submitted, calculates the number for pages.
|
|
761
|
+
* @import ```jsx
|
|
762
|
+
* // react
|
|
763
|
+
* import { SearchcraftPagination } from "@searchcraft/react-sdk";
|
|
764
|
+
* // vue
|
|
765
|
+
* import { SearchcraftPagination } from "@searchcraft/vue-sdk";
|
|
766
|
+
* ```
|
|
767
|
+
* @js-example ```html
|
|
1858
768
|
* <searchcraft-pagination />
|
|
1859
769
|
* ```
|
|
770
|
+
* @react-example ```jsx
|
|
771
|
+
* <SearchcraftPagination />
|
|
772
|
+
* ```
|
|
773
|
+
* @vue-example ```jsx
|
|
774
|
+
* <SearchcraftPagination />
|
|
775
|
+
* ```
|
|
1860
776
|
*/
|
|
1861
777
|
interface SearchcraftPagination {
|
|
1862
|
-
/**
|
|
1863
|
-
* The custom styles object.
|
|
1864
|
-
*/
|
|
1865
|
-
"customStyles"?: string;
|
|
1866
778
|
}
|
|
1867
779
|
/**
|
|
1868
780
|
* Renders a button which, when clicked, turns on popover visibility.
|
|
781
|
+
* @import ```jsx
|
|
782
|
+
* // react
|
|
783
|
+
* import { SearchcraftPopoverButton } from "@searchcraft/react-sdk";
|
|
784
|
+
* // vue
|
|
785
|
+
* import { SearchcraftPopoverButton } from "@searchcraft/vue-sdk";
|
|
786
|
+
* ```
|
|
787
|
+
* @js-example ```html
|
|
788
|
+
* <searchcraft-popover-button>
|
|
789
|
+
* Open popover
|
|
790
|
+
* </searchcraft-popover-button>
|
|
791
|
+
* ```
|
|
792
|
+
* @react-example ```jsx
|
|
793
|
+
* <SearchcraftPopoverButton>
|
|
794
|
+
* Open popover
|
|
795
|
+
* </SearchcraftPopoverButton>
|
|
796
|
+
* ```
|
|
797
|
+
* @vue-example ```jsx
|
|
798
|
+
* <SearchcraftPopoverButton>
|
|
799
|
+
* Open popover
|
|
800
|
+
* </SearchcraftPopoverButton>
|
|
801
|
+
* ```
|
|
1869
802
|
*/
|
|
1870
803
|
interface SearchcraftPopoverButton {
|
|
1871
804
|
}
|
|
1872
805
|
/**
|
|
1873
806
|
* This web component is designed to display search results in a popover container that dynamically appears when the user interacts with a search input field, or when a popover-button is pressed.
|
|
1874
|
-
*
|
|
1875
|
-
*
|
|
807
|
+
* @import ```jsx
|
|
808
|
+
* // react
|
|
809
|
+
* import { SearchcraftPopoverForm } from "@searchcraft/react-sdk";
|
|
810
|
+
* // vue
|
|
811
|
+
* import { SearchcraftPopoverForm } from "@searchcraft/vue-sdk";
|
|
812
|
+
* ```
|
|
813
|
+
* @js-example ```html
|
|
1876
814
|
* <!-- index.html -->
|
|
1877
|
-
* <searchcraft-popover-form type="
|
|
815
|
+
* <searchcraft-popover-form type="inline" />
|
|
1878
816
|
* ```
|
|
1879
817
|
* ```js
|
|
1880
818
|
* // index.js
|
|
1881
819
|
* const popoverForm = document.querySelector('searchcraft-popover-form');
|
|
1882
|
-
* popoverForm.popoverResultMappings = {
|
|
1883
|
-
*
|
|
1884
|
-
*
|
|
1885
|
-
*
|
|
1886
|
-
*
|
|
1887
|
-
*
|
|
1888
|
-
*
|
|
1889
|
-
* ],
|
|
1890
|
-
* };
|
|
820
|
+
* popoverForm.popoverResultMappings = {};
|
|
821
|
+
* ```
|
|
822
|
+
* @react-example ```jsx
|
|
823
|
+
* <SearchcraftPopoverForm type="inline" popoverResultMappings={[]} />
|
|
824
|
+
* ```
|
|
825
|
+
* @vue-example ```jsx
|
|
826
|
+
* <SearchcraftPopoverForm type="inline" :popoverResultMappings="[]"" />
|
|
1891
827
|
* ```
|
|
1892
828
|
*/
|
|
1893
829
|
interface SearchcraftPopoverForm {
|
|
1894
830
|
/**
|
|
1895
831
|
* The hotkey that activates the popover.
|
|
1896
832
|
*/
|
|
1897
|
-
"hotkey"
|
|
833
|
+
"hotkey"?: string;
|
|
1898
834
|
/**
|
|
1899
835
|
* The hotkey modifier that activates the popover. Used together with the `hotkey` prop.
|
|
1900
836
|
*/
|
|
1901
|
-
"hotkeyModifier"
|
|
837
|
+
"hotkeyModifier"?: "ctrl" | "meta" | "alt" | "option";
|
|
1902
838
|
/**
|
|
1903
839
|
* Formats the content rendered for each result.
|
|
1904
840
|
*/
|
|
1905
841
|
"popoverResultMappings"?: PopoverResultMappings;
|
|
1906
842
|
/**
|
|
1907
|
-
* The type of popover form to render.
|
|
843
|
+
* The type of popover form to render. - `inline` - Renders inline with the rest of the content on the page. The search results pop over the page content. - `fullscreen` - Renders in fullscreen view. Used together with the `searchcraft-popover-button` component. - `modal` - Renders in a modal view. Used together with the `searchcraft-popover-button` component.
|
|
1908
844
|
*/
|
|
1909
|
-
"type"
|
|
845
|
+
"type"?: "inline" | "fullscreen" | "modal";
|
|
1910
846
|
}
|
|
1911
847
|
/**
|
|
1912
848
|
* A single list item rendered in a searchcraft-popover-list-view.
|
|
@@ -1922,9 +858,7 @@ declare namespace Components {
|
|
|
1922
858
|
/**
|
|
1923
859
|
* This web component is designed to display a list of results within a popover interface.
|
|
1924
860
|
* It is consumed within the `searchcraft-popover-form` component.
|
|
1925
|
-
*
|
|
1926
|
-
* ```html
|
|
1927
|
-
* <!-- index.html -->
|
|
861
|
+
* @js-example ```html
|
|
1928
862
|
* <searchcraft-popover-list-view />
|
|
1929
863
|
* ```
|
|
1930
864
|
*/
|
|
@@ -1943,44 +877,128 @@ declare namespace Components {
|
|
|
1943
877
|
}
|
|
1944
878
|
/**
|
|
1945
879
|
* This web component is designed to display the number of results returned from a search query.
|
|
1946
|
-
*
|
|
1947
|
-
*
|
|
880
|
+
* @import ```jsx
|
|
881
|
+
* // react
|
|
882
|
+
* import { SearchcraftResultsInfo } from "@searchcraft/react-sdk";
|
|
883
|
+
* // vue
|
|
884
|
+
* import { SearchcraftResultsInfo } from "@searchcraft/vue-sdk";
|
|
885
|
+
* ```
|
|
886
|
+
* @js-example ```html
|
|
1948
887
|
* <!-- index.html -->
|
|
1949
|
-
* <script>
|
|
1950
|
-
* const resultsInfo = document.querySelector('searchcraft-results-info');
|
|
1951
|
-
* resultsInfo.customFormatter = (range, count, responseTime) =>
|
|
1952
|
-
* `${range[0]}-${range[1]} of ${count} results in ${responseTime}ms`;
|
|
1953
|
-
* </script>
|
|
1954
888
|
* <searchcraft-results-info />
|
|
1955
889
|
* ```
|
|
890
|
+
* ```js
|
|
891
|
+
* // index.js
|
|
892
|
+
* const resultsInfo = document.querySelector('searchcraft-results-info');
|
|
893
|
+
* resultsInfo.template = (info, { html }) => html`
|
|
894
|
+
* ${info.range[0]}-${info.range[1]} of ${info.count} results in ${info.responseTime}ms
|
|
895
|
+
* `;
|
|
896
|
+
* ```
|
|
897
|
+
* @react-example ```jsx
|
|
898
|
+
* <SearchcraftResultsInfo
|
|
899
|
+
* template={(info, { html }) => html`
|
|
900
|
+
* ${info.range[0]}-${info.range[1]} of ${info.count} results in ${info.responseTime}ms
|
|
901
|
+
* `}
|
|
902
|
+
* />
|
|
903
|
+
* @vue-example ```jsx
|
|
904
|
+
* <SearchcraftResultsInfo
|
|
905
|
+
* :template={(info, { html }) => html`
|
|
906
|
+
* ${info.range[0]}-${info.range[1]} of ${info.count} results in ${info.responseTime}ms
|
|
907
|
+
* `}
|
|
908
|
+
* />
|
|
1956
909
|
*/
|
|
1957
910
|
interface SearchcraftResultsInfo {
|
|
1958
911
|
/**
|
|
1959
|
-
*
|
|
1960
|
-
* @example ```ts resultsInfo.
|
|
912
|
+
* A callback function responsible for rendering the results info.
|
|
913
|
+
* @example ```ts resultsInfo.template = html` ${range[0]}-${range[1]} of ${count} results in ${responseTime}ms `; ```
|
|
1961
914
|
*/
|
|
1962
|
-
"
|
|
1963
|
-
|
|
1964
|
-
|
|
1965
|
-
|
|
915
|
+
"template"?: ResultsInfoTemplate;
|
|
916
|
+
}
|
|
917
|
+
/**
|
|
918
|
+
* This web component is designed to display detailed information for a single search result. Once a query is submitted, the component formats and presents the result.
|
|
919
|
+
*/
|
|
920
|
+
interface SearchcraftSearchResult {
|
|
921
|
+
/**
|
|
922
|
+
* The position in the document. Used with the "document_clicked" measure event.
|
|
923
|
+
*/
|
|
924
|
+
"documentPosition": number;
|
|
925
|
+
/**
|
|
926
|
+
* The index.
|
|
927
|
+
*/
|
|
928
|
+
"index": number;
|
|
929
|
+
"item"?: SearchClientResponseItem;
|
|
930
|
+
/**
|
|
931
|
+
* A callback function responsible for rendering a result.
|
|
932
|
+
*/
|
|
933
|
+
"template"?: SearchResultTemplate<SearchResultTemplateData>;
|
|
934
|
+
}
|
|
935
|
+
/**
|
|
936
|
+
* This web component is responsible for displaying the results of a search query. Once a query is submitted, the component formats and presents an ordered list of the results.
|
|
937
|
+
* @import ```jsx
|
|
938
|
+
* // react
|
|
939
|
+
* import { SearchcraftSearchResults } from "@searchcraft/react-sdk";
|
|
940
|
+
* // vue
|
|
941
|
+
* import { SearchcraftSearchResults } from "@searchcraft/vue-sdk";
|
|
942
|
+
* ```
|
|
943
|
+
* @js-example ```html
|
|
944
|
+
* <!-- index.html -->
|
|
945
|
+
* <searchcraft-search-results
|
|
946
|
+
* ad-interval="4"
|
|
947
|
+
* place-ad-at-start="true"
|
|
948
|
+
* />
|
|
949
|
+
* ```
|
|
950
|
+
* ```js
|
|
951
|
+
* // index.js
|
|
952
|
+
* const searchResults = document.querySelector('searchcraft-search-results');
|
|
953
|
+
* searchResults.template = (item, index, { html }) => html`
|
|
954
|
+
* <h2>${item.title}</h2>
|
|
955
|
+
* `;
|
|
956
|
+
* ```
|
|
957
|
+
* @react-example ```jsx
|
|
958
|
+
* <SearchcraftSearchResults
|
|
959
|
+
* adInterval={4}
|
|
960
|
+
* placeAdAtState={true}
|
|
961
|
+
* template={(item, index, { html }) => html`
|
|
962
|
+
* <h2>${item.title}</h2>
|
|
963
|
+
* `}
|
|
964
|
+
* />
|
|
965
|
+
* ```
|
|
966
|
+
* @vue-example ```jsx
|
|
967
|
+
* <SearchcraftSearchResults
|
|
968
|
+
* adInterval={4}
|
|
969
|
+
* placeAdAtState={true}
|
|
970
|
+
* :template={(item, index, { html }) => html`
|
|
971
|
+
* <h2>${item.title}</h2>
|
|
972
|
+
* `}
|
|
973
|
+
* />
|
|
974
|
+
* ```
|
|
975
|
+
*/
|
|
976
|
+
interface SearchcraftSearchResults {
|
|
1966
977
|
/**
|
|
1967
|
-
*
|
|
978
|
+
* A callback function responsible for rendering a result. Passed to `searchcraft-search-result`.
|
|
1968
979
|
*/
|
|
1969
|
-
"
|
|
980
|
+
"template"?: SearchResultTemplate<SearchResultTemplateData>;
|
|
1970
981
|
}
|
|
1971
982
|
/**
|
|
1972
983
|
* This web component is designed to choose the number of search results displayed.
|
|
1973
|
-
*
|
|
1974
|
-
*
|
|
984
|
+
* @import ```jsx
|
|
985
|
+
* // react
|
|
986
|
+
* import { SearchcraftSearchResultsPerPage } from "@searchcraft/react-sdk";
|
|
987
|
+
* // vue
|
|
988
|
+
* import { SearchcraftSearchResultsPerPage } from "@searchcraft/vue-sdk";
|
|
989
|
+
* ```
|
|
990
|
+
* @js-example ```html
|
|
1975
991
|
* <!-- index.html -->
|
|
1976
992
|
* <searchcraft-search-results-per-page increment="20" />
|
|
1977
993
|
* ```
|
|
994
|
+
* @react-example ```jsx
|
|
995
|
+
* <SearchcraftSearchResultsPerPage increment={20} />
|
|
996
|
+
* ```
|
|
997
|
+
* @vue-example ```jsx
|
|
998
|
+
* <SearchcraftSearchResultsPerPage increment="20" />
|
|
999
|
+
* ```
|
|
1978
1000
|
*/
|
|
1979
1001
|
interface SearchcraftSearchResultsPerPage {
|
|
1980
|
-
/**
|
|
1981
|
-
* The custom styles object.
|
|
1982
|
-
*/
|
|
1983
|
-
"customStyles"?: string;
|
|
1984
1002
|
/**
|
|
1985
1003
|
* The amount the options will increase (e.g. 20 = [20, 40, 60, 80, 100]). The base value is defined by the `searchResultsPerPage` option in the configuration.
|
|
1986
1004
|
*/
|
|
@@ -1988,8 +1006,7 @@ declare namespace Components {
|
|
|
1988
1006
|
}
|
|
1989
1007
|
/**
|
|
1990
1008
|
* This web component is designed to allow users to select between a group of options.
|
|
1991
|
-
*
|
|
1992
|
-
* ```html
|
|
1009
|
+
* @js-example ```html
|
|
1993
1010
|
* <!-- index.html -->
|
|
1994
1011
|
* <searchcraft-select
|
|
1995
1012
|
* inputId="searchcraft-select"
|
|
@@ -2003,10 +1020,6 @@ declare namespace Components {
|
|
|
2003
1020
|
* The caption displayed below the select input.
|
|
2004
1021
|
*/
|
|
2005
1022
|
"caption"?: string;
|
|
2006
|
-
/**
|
|
2007
|
-
* A custom styles object.
|
|
2008
|
-
*/
|
|
2009
|
-
"customStyles"?: string;
|
|
2010
1023
|
/**
|
|
2011
1024
|
* Whether the select input is disabled.
|
|
2012
1025
|
*/
|
|
@@ -2033,9 +1046,7 @@ declare namespace Components {
|
|
|
2033
1046
|
"options": SearchcraftSelectOption[] | string;
|
|
2034
1047
|
}
|
|
2035
1048
|
/**
|
|
2036
|
-
* This web component is designed to allow users to select a value from a range defined by a minimum and maximum value.
|
|
2037
|
-
* The component renders a slider interface, which can be used to visually choose a value between two boundaries.
|
|
2038
|
-
* It is consumed by the `searchcraft-filter-panel` component.
|
|
1049
|
+
* This web component is designed to allow users to select a value from a range defined by a minimum and maximum value. The component renders a slider interface, which can be used to visually choose a value between two boundaries.
|
|
2039
1050
|
*/
|
|
2040
1051
|
interface SearchcraftSlider {
|
|
2041
1052
|
/**
|
|
@@ -2056,27 +1067,27 @@ declare namespace Components {
|
|
|
2056
1067
|
"min": number;
|
|
2057
1068
|
}
|
|
2058
1069
|
/**
|
|
2059
|
-
* This web component adds Searchcraft's built-in css theme to your page
|
|
2060
|
-
*
|
|
2061
|
-
*
|
|
2062
|
-
*
|
|
2063
|
-
*
|
|
2064
|
-
*
|
|
1070
|
+
* This web component adds Searchcraft's built-in css theme to your page. It does not render anything visible, its only function is to manage the css styles on the page.'
|
|
1071
|
+
* @import ```jsx
|
|
1072
|
+
* // react
|
|
1073
|
+
* import { SearchcraftTheme } from "@searchcraft/react-sdk";
|
|
1074
|
+
* // vue
|
|
1075
|
+
* import { SearchcraftTheme } from "@searchcraft/vue-sdk";
|
|
1076
|
+
* ```
|
|
1077
|
+
* @js-example ```html
|
|
1078
|
+
* <searchcraft-theme />
|
|
1079
|
+
* ```
|
|
1080
|
+
* @react-example ```jsx
|
|
1081
|
+
* <SearchcraftTheme />
|
|
1082
|
+
* ```
|
|
1083
|
+
* @vue-example ```jsx
|
|
1084
|
+
* <SearchcraftTheme />
|
|
2065
1085
|
* ```
|
|
2066
1086
|
*/
|
|
2067
1087
|
interface SearchcraftTheme {
|
|
2068
|
-
/**
|
|
2069
|
-
* The custom theme configuration object.
|
|
2070
|
-
*/
|
|
2071
|
-
"customTheme"?: string;
|
|
2072
|
-
/**
|
|
2073
|
-
* The name of the theme.
|
|
2074
|
-
*/
|
|
2075
|
-
"theme"?: string;
|
|
2076
1088
|
}
|
|
2077
1089
|
/**
|
|
2078
1090
|
* This web component simulates a light switch functionality, providing a simple and intuitive toggle between two states—on and off.
|
|
2079
|
-
* It is consumed within the `searchcraft-filter-panel` component.
|
|
2080
1091
|
*/
|
|
2081
1092
|
interface SearchcraftToggleButton {
|
|
2082
1093
|
/**
|
|
@@ -2120,61 +1131,15 @@ declare global {
|
|
|
2120
1131
|
interface HTMLSearchcraftAdElement extends Components.SearchcraftAd, HTMLStencilElement {
|
|
2121
1132
|
}
|
|
2122
1133
|
var HTMLSearchcraftAdElement: {
|
|
2123
|
-
prototype: HTMLSearchcraftAdElement;
|
|
2124
|
-
new (): HTMLSearchcraftAdElement;
|
|
2125
|
-
};
|
|
2126
|
-
/**
|
|
2127
|
-
* This web component is designed to display detailed information for a single search result.
|
|
2128
|
-
* Once a query is submitted, the component formats and presents the result.
|
|
2129
|
-
* It is consumed within the `searchcraft-base-search-results` component.
|
|
2130
|
-
*/
|
|
2131
|
-
interface HTMLSearchcraftBaseSearchResultElement extends Components.SearchcraftBaseSearchResult, HTMLStencilElement {
|
|
2132
|
-
}
|
|
2133
|
-
var HTMLSearchcraftBaseSearchResultElement: {
|
|
2134
|
-
prototype: HTMLSearchcraftBaseSearchResultElement;
|
|
2135
|
-
new (): HTMLSearchcraftBaseSearchResultElement;
|
|
2136
|
-
};
|
|
2137
|
-
/**
|
|
2138
|
-
* This web component is responsible for displaying the results of a search query.
|
|
2139
|
-
* Once a query is submitted, the component formats and presents an ordered list of the results.
|
|
2140
|
-
* ## Usage
|
|
2141
|
-
* ```html
|
|
2142
|
-
* <!-- index.html -->
|
|
2143
|
-
* <searchcraft-base-search-results
|
|
2144
|
-
* ad-interval="4"
|
|
2145
|
-
* place-ad-at-start="false"
|
|
2146
|
-
* result-image-placement="right"
|
|
2147
|
-
* />
|
|
2148
|
-
* ```
|
|
2149
|
-
* ```js
|
|
2150
|
-
* // index.js
|
|
2151
|
-
* const baseSearchResults = document.querySelector('searchcraft-base-search-results');
|
|
2152
|
-
* baseSearchResults.searchResultMappings = containerHref: {
|
|
2153
|
-
* fieldNames: [
|
|
2154
|
-
* {
|
|
2155
|
-
* fieldName: 'canonical_link',
|
|
2156
|
-
* dataType: 'text',
|
|
2157
|
-
* },
|
|
2158
|
-
* ],
|
|
2159
|
-
* };
|
|
2160
|
-
* baseSearchResults.addEventListener('noResults', () => {
|
|
2161
|
-
* console.log('No search results found');
|
|
2162
|
-
* });
|
|
2163
|
-
* ```
|
|
2164
|
-
*/
|
|
2165
|
-
interface HTMLSearchcraftBaseSearchResultsElement extends Components.SearchcraftBaseSearchResults, HTMLStencilElement {
|
|
2166
|
-
}
|
|
2167
|
-
var HTMLSearchcraftBaseSearchResultsElement: {
|
|
2168
|
-
prototype: HTMLSearchcraftBaseSearchResultsElement;
|
|
2169
|
-
new (): HTMLSearchcraftBaseSearchResultsElement;
|
|
1134
|
+
prototype: HTMLSearchcraftAdElement;
|
|
1135
|
+
new (): HTMLSearchcraftAdElement;
|
|
2170
1136
|
};
|
|
2171
1137
|
interface HTMLSearchcraftButtonElementEventMap {
|
|
2172
1138
|
"buttonClick": void;
|
|
2173
1139
|
}
|
|
2174
1140
|
/**
|
|
2175
|
-
* This web component represents a button
|
|
1141
|
+
* This web component represents a button.
|
|
2176
1142
|
* It provides a clear, interactive way for users to submit search queries or trigger actions in a search interface.
|
|
2177
|
-
* It is consumed within the `searchcraft-input-form` component.
|
|
2178
1143
|
*/
|
|
2179
1144
|
interface HTMLSearchcraftButtonElement extends Components.SearchcraftButton, HTMLStencilElement {
|
|
2180
1145
|
addEventListener<K extends keyof HTMLSearchcraftButtonElementEventMap>(type: K, listener: (this: HTMLSearchcraftButtonElement, ev: SearchcraftButtonCustomEvent<HTMLSearchcraftButtonElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
|
|
@@ -2192,10 +1157,10 @@ declare global {
|
|
|
2192
1157
|
};
|
|
2193
1158
|
/**
|
|
2194
1159
|
* This web component is designed to display a user-friendly error message when a search query fails, providing clear feedback to users and enhancing their experience when an issue arises during the search process.
|
|
2195
|
-
*
|
|
2196
|
-
*
|
|
2197
|
-
*
|
|
2198
|
-
*
|
|
1160
|
+
* @js-example ```html
|
|
1161
|
+
* <searchcraft-error-message>
|
|
1162
|
+
* No search results found for query
|
|
1163
|
+
* </searchcraft-error-message>
|
|
2199
1164
|
* ```
|
|
2200
1165
|
*/
|
|
2201
1166
|
interface HTMLSearchcraftErrorMessageElement extends Components.SearchcraftErrorMessage, HTMLStencilElement {
|
|
@@ -2212,8 +1177,7 @@ declare global {
|
|
|
2212
1177
|
/**
|
|
2213
1178
|
* This web component is designed to display facets in a search interface, allowing users to refine their search results by applying filters based on various attributes.
|
|
2214
1179
|
* It is consumed within the `searchcraft-filter-panel`.
|
|
2215
|
-
*
|
|
2216
|
-
* ```html
|
|
1180
|
+
* @js-example ```html
|
|
2217
1181
|
* <!-- index.html -->
|
|
2218
1182
|
* <searchcraft-facet-list field-name="title" />
|
|
2219
1183
|
* ```
|
|
@@ -2241,11 +1205,29 @@ declare global {
|
|
|
2241
1205
|
};
|
|
2242
1206
|
/**
|
|
2243
1207
|
* This web component represents a series of filters that allows users to refine and control their search queries by applying various filter criteria.
|
|
2244
|
-
*
|
|
2245
|
-
*
|
|
1208
|
+
* @import ```jsx
|
|
1209
|
+
* // react
|
|
1210
|
+
* import { SearchcraftFilterPanel } from "@searchcraft/react-sdk";
|
|
1211
|
+
* // vue
|
|
1212
|
+
* import { SearchcraftFilterPanel } from "@searchcraft/vue-sdk";
|
|
1213
|
+
* ```
|
|
1214
|
+
* @js-example ```html
|
|
2246
1215
|
* <!-- index.html -->
|
|
2247
1216
|
* <searchcraft-filter-panel />
|
|
2248
1217
|
* ```
|
|
1218
|
+
* ```js
|
|
1219
|
+
* // index.js
|
|
1220
|
+
* const filterPanel = document.querySelector('searchcraft-filter-panel');
|
|
1221
|
+
* if (filterPanel) {
|
|
1222
|
+
* filterPanel.items = [];
|
|
1223
|
+
* }
|
|
1224
|
+
* ```
|
|
1225
|
+
* @react-example ```jsx
|
|
1226
|
+
* <SearchcraftFilterPanel items={[]} />
|
|
1227
|
+
* ```
|
|
1228
|
+
* @vue-example ```jsx
|
|
1229
|
+
* <SearchcraftFilterPanel :items="[]" />
|
|
1230
|
+
* ```
|
|
2249
1231
|
*/
|
|
2250
1232
|
interface HTMLSearchcraftFilterPanelElement extends Components.SearchcraftFilterPanel, HTMLStencilElement {
|
|
2251
1233
|
}
|
|
@@ -2261,14 +1243,20 @@ declare global {
|
|
|
2261
1243
|
/**
|
|
2262
1244
|
* This web component provides a user-friendly interface for querying an indexed dataset, enabling users to easily search large collections of data.
|
|
2263
1245
|
* It abstracts the complexities of index-based searching, making it accessible to users of all technical levels.
|
|
2264
|
-
*
|
|
2265
|
-
*
|
|
2266
|
-
*
|
|
2267
|
-
*
|
|
1246
|
+
* @import ```jsx
|
|
1247
|
+
* // react
|
|
1248
|
+
* import { SearchcraftInputForm } from "@searchcraft/react-sdk";
|
|
1249
|
+
* // vue
|
|
1250
|
+
* import { SearchcraftInputForm } from "@searchcraft/vue-sdk";
|
|
2268
1251
|
* ```
|
|
2269
|
-
* ```
|
|
2270
|
-
*
|
|
2271
|
-
*
|
|
1252
|
+
* @js-example ```html
|
|
1253
|
+
* <searchcraft-input-form auto-search />
|
|
1254
|
+
* ```
|
|
1255
|
+
* @react-example ```jsx
|
|
1256
|
+
* <SearchcraftInputForm autoSearch />
|
|
1257
|
+
* ```
|
|
1258
|
+
* @vue-example ```jsx
|
|
1259
|
+
* <SearchcraftInputForm autoSearch />
|
|
2272
1260
|
* ```
|
|
2273
1261
|
*/
|
|
2274
1262
|
interface HTMLSearchcraftInputFormElement extends Components.SearchcraftInputForm, HTMLStencilElement {
|
|
@@ -2287,9 +1275,7 @@ declare global {
|
|
|
2287
1275
|
};
|
|
2288
1276
|
/**
|
|
2289
1277
|
* This web component serves as the input label for the searchcraft-input-form component.
|
|
2290
|
-
*
|
|
2291
|
-
* ```html
|
|
2292
|
-
* <!-- index.html -->
|
|
1278
|
+
* @js-example ```html
|
|
2293
1279
|
* <searchcraft-input-label label="Search" />
|
|
2294
1280
|
* ```
|
|
2295
1281
|
*/
|
|
@@ -2300,13 +1286,22 @@ declare global {
|
|
|
2300
1286
|
new (): HTMLSearchcraftInputLabelElement;
|
|
2301
1287
|
};
|
|
2302
1288
|
/**
|
|
2303
|
-
* This web component is designed to facilitate pagination of search results.
|
|
2304
|
-
*
|
|
2305
|
-
*
|
|
2306
|
-
*
|
|
2307
|
-
*
|
|
1289
|
+
* This web component is designed to facilitate pagination of search results. Once a query is submitted, calculates the number for pages.
|
|
1290
|
+
* @import ```jsx
|
|
1291
|
+
* // react
|
|
1292
|
+
* import { SearchcraftPagination } from "@searchcraft/react-sdk";
|
|
1293
|
+
* // vue
|
|
1294
|
+
* import { SearchcraftPagination } from "@searchcraft/vue-sdk";
|
|
1295
|
+
* ```
|
|
1296
|
+
* @js-example ```html
|
|
2308
1297
|
* <searchcraft-pagination />
|
|
2309
1298
|
* ```
|
|
1299
|
+
* @react-example ```jsx
|
|
1300
|
+
* <SearchcraftPagination />
|
|
1301
|
+
* ```
|
|
1302
|
+
* @vue-example ```jsx
|
|
1303
|
+
* <SearchcraftPagination />
|
|
1304
|
+
* ```
|
|
2310
1305
|
*/
|
|
2311
1306
|
interface HTMLSearchcraftPaginationElement extends Components.SearchcraftPagination, HTMLStencilElement {
|
|
2312
1307
|
}
|
|
@@ -2316,6 +1311,27 @@ declare global {
|
|
|
2316
1311
|
};
|
|
2317
1312
|
/**
|
|
2318
1313
|
* Renders a button which, when clicked, turns on popover visibility.
|
|
1314
|
+
* @import ```jsx
|
|
1315
|
+
* // react
|
|
1316
|
+
* import { SearchcraftPopoverButton } from "@searchcraft/react-sdk";
|
|
1317
|
+
* // vue
|
|
1318
|
+
* import { SearchcraftPopoverButton } from "@searchcraft/vue-sdk";
|
|
1319
|
+
* ```
|
|
1320
|
+
* @js-example ```html
|
|
1321
|
+
* <searchcraft-popover-button>
|
|
1322
|
+
* Open popover
|
|
1323
|
+
* </searchcraft-popover-button>
|
|
1324
|
+
* ```
|
|
1325
|
+
* @react-example ```jsx
|
|
1326
|
+
* <SearchcraftPopoverButton>
|
|
1327
|
+
* Open popover
|
|
1328
|
+
* </SearchcraftPopoverButton>
|
|
1329
|
+
* ```
|
|
1330
|
+
* @vue-example ```jsx
|
|
1331
|
+
* <SearchcraftPopoverButton>
|
|
1332
|
+
* Open popover
|
|
1333
|
+
* </SearchcraftPopoverButton>
|
|
1334
|
+
* ```
|
|
2319
1335
|
*/
|
|
2320
1336
|
interface HTMLSearchcraftPopoverButtonElement extends Components.SearchcraftPopoverButton, HTMLStencilElement {
|
|
2321
1337
|
}
|
|
@@ -2325,23 +1341,26 @@ declare global {
|
|
|
2325
1341
|
};
|
|
2326
1342
|
/**
|
|
2327
1343
|
* This web component is designed to display search results in a popover container that dynamically appears when the user interacts with a search input field, or when a popover-button is pressed.
|
|
2328
|
-
*
|
|
2329
|
-
*
|
|
1344
|
+
* @import ```jsx
|
|
1345
|
+
* // react
|
|
1346
|
+
* import { SearchcraftPopoverForm } from "@searchcraft/react-sdk";
|
|
1347
|
+
* // vue
|
|
1348
|
+
* import { SearchcraftPopoverForm } from "@searchcraft/vue-sdk";
|
|
1349
|
+
* ```
|
|
1350
|
+
* @js-example ```html
|
|
2330
1351
|
* <!-- index.html -->
|
|
2331
|
-
* <searchcraft-popover-form type="
|
|
1352
|
+
* <searchcraft-popover-form type="inline" />
|
|
2332
1353
|
* ```
|
|
2333
1354
|
* ```js
|
|
2334
1355
|
* // index.js
|
|
2335
1356
|
* const popoverForm = document.querySelector('searchcraft-popover-form');
|
|
2336
|
-
* popoverForm.popoverResultMappings = {
|
|
2337
|
-
*
|
|
2338
|
-
*
|
|
2339
|
-
*
|
|
2340
|
-
*
|
|
2341
|
-
*
|
|
2342
|
-
*
|
|
2343
|
-
* ],
|
|
2344
|
-
* };
|
|
1357
|
+
* popoverForm.popoverResultMappings = {};
|
|
1358
|
+
* ```
|
|
1359
|
+
* @react-example ```jsx
|
|
1360
|
+
* <SearchcraftPopoverForm type="inline" popoverResultMappings={[]} />
|
|
1361
|
+
* ```
|
|
1362
|
+
* @vue-example ```jsx
|
|
1363
|
+
* <SearchcraftPopoverForm type="inline" :popoverResultMappings="[]"" />
|
|
2345
1364
|
* ```
|
|
2346
1365
|
*/
|
|
2347
1366
|
interface HTMLSearchcraftPopoverFormElement extends Components.SearchcraftPopoverForm, HTMLStencilElement {
|
|
@@ -2362,9 +1381,7 @@ declare global {
|
|
|
2362
1381
|
/**
|
|
2363
1382
|
* This web component is designed to display a list of results within a popover interface.
|
|
2364
1383
|
* It is consumed within the `searchcraft-popover-form` component.
|
|
2365
|
-
*
|
|
2366
|
-
* ```html
|
|
2367
|
-
* <!-- index.html -->
|
|
1384
|
+
* @js-example ```html
|
|
2368
1385
|
* <searchcraft-popover-list-view />
|
|
2369
1386
|
* ```
|
|
2370
1387
|
*/
|
|
@@ -2376,16 +1393,35 @@ declare global {
|
|
|
2376
1393
|
};
|
|
2377
1394
|
/**
|
|
2378
1395
|
* This web component is designed to display the number of results returned from a search query.
|
|
2379
|
-
*
|
|
2380
|
-
*
|
|
1396
|
+
* @import ```jsx
|
|
1397
|
+
* // react
|
|
1398
|
+
* import { SearchcraftResultsInfo } from "@searchcraft/react-sdk";
|
|
1399
|
+
* // vue
|
|
1400
|
+
* import { SearchcraftResultsInfo } from "@searchcraft/vue-sdk";
|
|
1401
|
+
* ```
|
|
1402
|
+
* @js-example ```html
|
|
2381
1403
|
* <!-- index.html -->
|
|
2382
|
-
* <script>
|
|
2383
|
-
* const resultsInfo = document.querySelector('searchcraft-results-info');
|
|
2384
|
-
* resultsInfo.customFormatter = (range, count, responseTime) =>
|
|
2385
|
-
* `${range[0]}-${range[1]} of ${count} results in ${responseTime}ms`;
|
|
2386
|
-
* </script>
|
|
2387
1404
|
* <searchcraft-results-info />
|
|
2388
1405
|
* ```
|
|
1406
|
+
* ```js
|
|
1407
|
+
* // index.js
|
|
1408
|
+
* const resultsInfo = document.querySelector('searchcraft-results-info');
|
|
1409
|
+
* resultsInfo.template = (info, { html }) => html`
|
|
1410
|
+
* ${info.range[0]}-${info.range[1]} of ${info.count} results in ${info.responseTime}ms
|
|
1411
|
+
* `;
|
|
1412
|
+
* ```
|
|
1413
|
+
* @react-example ```jsx
|
|
1414
|
+
* <SearchcraftResultsInfo
|
|
1415
|
+
* template={(info, { html }) => html`
|
|
1416
|
+
* ${info.range[0]}-${info.range[1]} of ${info.count} results in ${info.responseTime}ms
|
|
1417
|
+
* `}
|
|
1418
|
+
* />
|
|
1419
|
+
* @vue-example ```jsx
|
|
1420
|
+
* <SearchcraftResultsInfo
|
|
1421
|
+
* :template={(info, { html }) => html`
|
|
1422
|
+
* ${info.range[0]}-${info.range[1]} of ${info.count} results in ${info.responseTime}ms
|
|
1423
|
+
* `}
|
|
1424
|
+
* />
|
|
2389
1425
|
*/
|
|
2390
1426
|
interface HTMLSearchcraftResultsInfoElement extends Components.SearchcraftResultsInfo, HTMLStencilElement {
|
|
2391
1427
|
}
|
|
@@ -2393,13 +1429,80 @@ declare global {
|
|
|
2393
1429
|
prototype: HTMLSearchcraftResultsInfoElement;
|
|
2394
1430
|
new (): HTMLSearchcraftResultsInfoElement;
|
|
2395
1431
|
};
|
|
1432
|
+
/**
|
|
1433
|
+
* This web component is designed to display detailed information for a single search result. Once a query is submitted, the component formats and presents the result.
|
|
1434
|
+
*/
|
|
1435
|
+
interface HTMLSearchcraftSearchResultElement extends Components.SearchcraftSearchResult, HTMLStencilElement {
|
|
1436
|
+
}
|
|
1437
|
+
var HTMLSearchcraftSearchResultElement: {
|
|
1438
|
+
prototype: HTMLSearchcraftSearchResultElement;
|
|
1439
|
+
new (): HTMLSearchcraftSearchResultElement;
|
|
1440
|
+
};
|
|
1441
|
+
/**
|
|
1442
|
+
* This web component is responsible for displaying the results of a search query. Once a query is submitted, the component formats and presents an ordered list of the results.
|
|
1443
|
+
* @import ```jsx
|
|
1444
|
+
* // react
|
|
1445
|
+
* import { SearchcraftSearchResults } from "@searchcraft/react-sdk";
|
|
1446
|
+
* // vue
|
|
1447
|
+
* import { SearchcraftSearchResults } from "@searchcraft/vue-sdk";
|
|
1448
|
+
* ```
|
|
1449
|
+
* @js-example ```html
|
|
1450
|
+
* <!-- index.html -->
|
|
1451
|
+
* <searchcraft-search-results
|
|
1452
|
+
* ad-interval="4"
|
|
1453
|
+
* place-ad-at-start="true"
|
|
1454
|
+
* />
|
|
1455
|
+
* ```
|
|
1456
|
+
* ```js
|
|
1457
|
+
* // index.js
|
|
1458
|
+
* const searchResults = document.querySelector('searchcraft-search-results');
|
|
1459
|
+
* searchResults.template = (item, index, { html }) => html`
|
|
1460
|
+
* <h2>${item.title}</h2>
|
|
1461
|
+
* `;
|
|
1462
|
+
* ```
|
|
1463
|
+
* @react-example ```jsx
|
|
1464
|
+
* <SearchcraftSearchResults
|
|
1465
|
+
* adInterval={4}
|
|
1466
|
+
* placeAdAtState={true}
|
|
1467
|
+
* template={(item, index, { html }) => html`
|
|
1468
|
+
* <h2>${item.title}</h2>
|
|
1469
|
+
* `}
|
|
1470
|
+
* />
|
|
1471
|
+
* ```
|
|
1472
|
+
* @vue-example ```jsx
|
|
1473
|
+
* <SearchcraftSearchResults
|
|
1474
|
+
* adInterval={4}
|
|
1475
|
+
* placeAdAtState={true}
|
|
1476
|
+
* :template={(item, index, { html }) => html`
|
|
1477
|
+
* <h2>${item.title}</h2>
|
|
1478
|
+
* `}
|
|
1479
|
+
* />
|
|
1480
|
+
* ```
|
|
1481
|
+
*/
|
|
1482
|
+
interface HTMLSearchcraftSearchResultsElement extends Components.SearchcraftSearchResults, HTMLStencilElement {
|
|
1483
|
+
}
|
|
1484
|
+
var HTMLSearchcraftSearchResultsElement: {
|
|
1485
|
+
prototype: HTMLSearchcraftSearchResultsElement;
|
|
1486
|
+
new (): HTMLSearchcraftSearchResultsElement;
|
|
1487
|
+
};
|
|
2396
1488
|
/**
|
|
2397
1489
|
* This web component is designed to choose the number of search results displayed.
|
|
2398
|
-
*
|
|
2399
|
-
*
|
|
1490
|
+
* @import ```jsx
|
|
1491
|
+
* // react
|
|
1492
|
+
* import { SearchcraftSearchResultsPerPage } from "@searchcraft/react-sdk";
|
|
1493
|
+
* // vue
|
|
1494
|
+
* import { SearchcraftSearchResultsPerPage } from "@searchcraft/vue-sdk";
|
|
1495
|
+
* ```
|
|
1496
|
+
* @js-example ```html
|
|
2400
1497
|
* <!-- index.html -->
|
|
2401
1498
|
* <searchcraft-search-results-per-page increment="20" />
|
|
2402
1499
|
* ```
|
|
1500
|
+
* @react-example ```jsx
|
|
1501
|
+
* <SearchcraftSearchResultsPerPage increment={20} />
|
|
1502
|
+
* ```
|
|
1503
|
+
* @vue-example ```jsx
|
|
1504
|
+
* <SearchcraftSearchResultsPerPage increment="20" />
|
|
1505
|
+
* ```
|
|
2403
1506
|
*/
|
|
2404
1507
|
interface HTMLSearchcraftSearchResultsPerPageElement extends Components.SearchcraftSearchResultsPerPage, HTMLStencilElement {
|
|
2405
1508
|
}
|
|
@@ -2412,8 +1515,7 @@ declare global {
|
|
|
2412
1515
|
}
|
|
2413
1516
|
/**
|
|
2414
1517
|
* This web component is designed to allow users to select between a group of options.
|
|
2415
|
-
*
|
|
2416
|
-
* ```html
|
|
1518
|
+
* @js-example ```html
|
|
2417
1519
|
* <!-- index.html -->
|
|
2418
1520
|
* <searchcraft-select
|
|
2419
1521
|
* inputId="searchcraft-select"
|
|
@@ -2440,9 +1542,7 @@ declare global {
|
|
|
2440
1542
|
"rangeChanged": any;
|
|
2441
1543
|
}
|
|
2442
1544
|
/**
|
|
2443
|
-
* This web component is designed to allow users to select a value from a range defined by a minimum and maximum value.
|
|
2444
|
-
* The component renders a slider interface, which can be used to visually choose a value between two boundaries.
|
|
2445
|
-
* It is consumed by the `searchcraft-filter-panel` component.
|
|
1545
|
+
* This web component is designed to allow users to select a value from a range defined by a minimum and maximum value. The component renders a slider interface, which can be used to visually choose a value between two boundaries.
|
|
2446
1546
|
*/
|
|
2447
1547
|
interface HTMLSearchcraftSliderElement extends Components.SearchcraftSlider, HTMLStencilElement {
|
|
2448
1548
|
addEventListener<K extends keyof HTMLSearchcraftSliderElementEventMap>(type: K, listener: (this: HTMLSearchcraftSliderElement, ev: SearchcraftSliderCustomEvent<HTMLSearchcraftSliderElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
|
|
@@ -2459,12 +1559,21 @@ declare global {
|
|
|
2459
1559
|
new (): HTMLSearchcraftSliderElement;
|
|
2460
1560
|
};
|
|
2461
1561
|
/**
|
|
2462
|
-
* This web component adds Searchcraft's built-in css theme to your page
|
|
2463
|
-
*
|
|
2464
|
-
*
|
|
2465
|
-
*
|
|
2466
|
-
*
|
|
2467
|
-
*
|
|
1562
|
+
* This web component adds Searchcraft's built-in css theme to your page. It does not render anything visible, its only function is to manage the css styles on the page.'
|
|
1563
|
+
* @import ```jsx
|
|
1564
|
+
* // react
|
|
1565
|
+
* import { SearchcraftTheme } from "@searchcraft/react-sdk";
|
|
1566
|
+
* // vue
|
|
1567
|
+
* import { SearchcraftTheme } from "@searchcraft/vue-sdk";
|
|
1568
|
+
* ```
|
|
1569
|
+
* @js-example ```html
|
|
1570
|
+
* <searchcraft-theme />
|
|
1571
|
+
* ```
|
|
1572
|
+
* @react-example ```jsx
|
|
1573
|
+
* <SearchcraftTheme />
|
|
1574
|
+
* ```
|
|
1575
|
+
* @vue-example ```jsx
|
|
1576
|
+
* <SearchcraftTheme />
|
|
2468
1577
|
* ```
|
|
2469
1578
|
*/
|
|
2470
1579
|
interface HTMLSearchcraftThemeElement extends Components.SearchcraftTheme, HTMLStencilElement {
|
|
@@ -2478,7 +1587,6 @@ declare global {
|
|
|
2478
1587
|
}
|
|
2479
1588
|
/**
|
|
2480
1589
|
* This web component simulates a light switch functionality, providing a simple and intuitive toggle between two states—on and off.
|
|
2481
|
-
* It is consumed within the `searchcraft-filter-panel` component.
|
|
2482
1590
|
*/
|
|
2483
1591
|
interface HTMLSearchcraftToggleButtonElement extends Components.SearchcraftToggleButton, HTMLStencilElement {
|
|
2484
1592
|
addEventListener<K extends keyof HTMLSearchcraftToggleButtonElementEventMap>(type: K, listener: (this: HTMLSearchcraftToggleButtonElement, ev: SearchcraftToggleButtonCustomEvent<HTMLSearchcraftToggleButtonElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
|
|
@@ -2496,8 +1604,6 @@ declare global {
|
|
|
2496
1604
|
};
|
|
2497
1605
|
interface HTMLElementTagNameMap {
|
|
2498
1606
|
"searchcraft-ad": HTMLSearchcraftAdElement;
|
|
2499
|
-
"searchcraft-base-search-result": HTMLSearchcraftBaseSearchResultElement;
|
|
2500
|
-
"searchcraft-base-search-results": HTMLSearchcraftBaseSearchResultsElement;
|
|
2501
1607
|
"searchcraft-button": HTMLSearchcraftButtonElement;
|
|
2502
1608
|
"searchcraft-error-message": HTMLSearchcraftErrorMessageElement;
|
|
2503
1609
|
"searchcraft-facet-list": HTMLSearchcraftFacetListElement;
|
|
@@ -2510,6 +1616,8 @@ declare global {
|
|
|
2510
1616
|
"searchcraft-popover-list-item": HTMLSearchcraftPopoverListItemElement;
|
|
2511
1617
|
"searchcraft-popover-list-view": HTMLSearchcraftPopoverListViewElement;
|
|
2512
1618
|
"searchcraft-results-info": HTMLSearchcraftResultsInfoElement;
|
|
1619
|
+
"searchcraft-search-result": HTMLSearchcraftSearchResultElement;
|
|
1620
|
+
"searchcraft-search-results": HTMLSearchcraftSearchResultsElement;
|
|
2513
1621
|
"searchcraft-search-results-per-page": HTMLSearchcraftSearchResultsPerPageElement;
|
|
2514
1622
|
"searchcraft-select": HTMLSearchcraftSelectElement;
|
|
2515
1623
|
"searchcraft-slider": HTMLSearchcraftSliderElement;
|
|
@@ -2527,108 +1635,8 @@ declare namespace LocalJSX {
|
|
|
2527
1635
|
"adSource"?: SearchcraftAdSource;
|
|
2528
1636
|
}
|
|
2529
1637
|
/**
|
|
2530
|
-
* This web component
|
|
2531
|
-
* Once a query is submitted, the component formats and presents the result.
|
|
2532
|
-
* It is consumed within the `searchcraft-base-search-results` component.
|
|
2533
|
-
*/
|
|
2534
|
-
interface SearchcraftBaseSearchResult {
|
|
2535
|
-
/**
|
|
2536
|
-
* The relationship between the current document and the link for the button rendered when containerHref is not present.
|
|
2537
|
-
*/
|
|
2538
|
-
"buttonRel"?: "noreferrer" | "noopener" | "nofollow";
|
|
2539
|
-
/**
|
|
2540
|
-
* Where to open the link for the button rendered when containerHref is not present.
|
|
2541
|
-
*/
|
|
2542
|
-
"buttonTarget"?: "_blank" | "_self" | "_top" | "_parent";
|
|
2543
|
-
/**
|
|
2544
|
-
* The relationship between the current document and the link for the containing element.
|
|
2545
|
-
*/
|
|
2546
|
-
"containerRel"?: "noreferrer" | "noopener" | "nofollow";
|
|
2547
|
-
/**
|
|
2548
|
-
* Where to open the link for the containing element.
|
|
2549
|
-
*/
|
|
2550
|
-
"containerTarget"?: "_blank" | "_self" | "_top" | "_parent";
|
|
2551
|
-
/**
|
|
2552
|
-
* A custom styles object.
|
|
2553
|
-
*/
|
|
2554
|
-
"customStyles"?: string;
|
|
2555
|
-
/**
|
|
2556
|
-
* The position in the document. Used with the "document_clicked" measure event.
|
|
2557
|
-
*/
|
|
2558
|
-
"documentPosition"?: number;
|
|
2559
|
-
/**
|
|
2560
|
-
* The placement of the image.
|
|
2561
|
-
*/
|
|
2562
|
-
"imagePlacement"?: "left" | "right";
|
|
2563
|
-
"item"?: SearchClientResponseItem;
|
|
2564
|
-
"searchResultMappings"?: SearchResultMappings;
|
|
2565
|
-
}
|
|
2566
|
-
/**
|
|
2567
|
-
* This web component is responsible for displaying the results of a search query.
|
|
2568
|
-
* Once a query is submitted, the component formats and presents an ordered list of the results.
|
|
2569
|
-
* ## Usage
|
|
2570
|
-
* ```html
|
|
2571
|
-
* <!-- index.html -->
|
|
2572
|
-
* <searchcraft-base-search-results
|
|
2573
|
-
* ad-interval="4"
|
|
2574
|
-
* place-ad-at-start="false"
|
|
2575
|
-
* result-image-placement="right"
|
|
2576
|
-
* />
|
|
2577
|
-
* ```
|
|
2578
|
-
* ```js
|
|
2579
|
-
* // index.js
|
|
2580
|
-
* const baseSearchResults = document.querySelector('searchcraft-base-search-results');
|
|
2581
|
-
* baseSearchResults.searchResultMappings = containerHref: {
|
|
2582
|
-
* fieldNames: [
|
|
2583
|
-
* {
|
|
2584
|
-
* fieldName: 'canonical_link',
|
|
2585
|
-
* dataType: 'text',
|
|
2586
|
-
* },
|
|
2587
|
-
* ],
|
|
2588
|
-
* };
|
|
2589
|
-
* baseSearchResults.addEventListener('noResults', () => {
|
|
2590
|
-
* console.log('No search results found');
|
|
2591
|
-
* });
|
|
2592
|
-
* ```
|
|
2593
|
-
*/
|
|
2594
|
-
interface SearchcraftBaseSearchResults {
|
|
2595
|
-
/**
|
|
2596
|
-
* The label for the button rendered when containerHref is not present for each result.
|
|
2597
|
-
*/
|
|
2598
|
-
"buttonLabel"?: string;
|
|
2599
|
-
/**
|
|
2600
|
-
* The relationship between the current document and the link for the button rendered when containerHref is not present for each result.
|
|
2601
|
-
*/
|
|
2602
|
-
"buttonRel"?: "noreferrer" | "noopener" | "nofollow";
|
|
2603
|
-
/**
|
|
2604
|
-
* Where to open the link for the button rendered when containerHref is not present for each result.
|
|
2605
|
-
*/
|
|
2606
|
-
"buttonTarget"?: "_blank" | "_self" | "_top" | "_parent";
|
|
2607
|
-
/**
|
|
2608
|
-
* The relationship between the current document and the link for the containing element for each result.
|
|
2609
|
-
*/
|
|
2610
|
-
"containerRel"?: "noreferrer" | "noopener" | "nofollow";
|
|
2611
|
-
/**
|
|
2612
|
-
* Where to open the link for the containing element for each result.
|
|
2613
|
-
*/
|
|
2614
|
-
"containerTarget"?: "_blank" | "_self" | "_top" | "_parent";
|
|
2615
|
-
/**
|
|
2616
|
-
* A custom styles object.
|
|
2617
|
-
*/
|
|
2618
|
-
"customStylesForResults"?: string | Record<string, Record<string, string>>;
|
|
2619
|
-
/**
|
|
2620
|
-
* The placement of the image for each result.
|
|
2621
|
-
*/
|
|
2622
|
-
"resultImagePlacement"?: "left" | "right";
|
|
2623
|
-
/**
|
|
2624
|
-
* Formats the content rendered for each result.
|
|
2625
|
-
*/
|
|
2626
|
-
"searchResultMappings"?: SearchResultMappings;
|
|
2627
|
-
}
|
|
2628
|
-
/**
|
|
2629
|
-
* This web component represents a button to be consumed within the `search-input-form` component.
|
|
1638
|
+
* This web component represents a button.
|
|
2630
1639
|
* It provides a clear, interactive way for users to submit search queries or trigger actions in a search interface.
|
|
2631
|
-
* It is consumed within the `searchcraft-input-form` component.
|
|
2632
1640
|
*/
|
|
2633
1641
|
interface SearchcraftButton {
|
|
2634
1642
|
/**
|
|
@@ -2666,23 +1674,18 @@ declare namespace LocalJSX {
|
|
|
2666
1674
|
}
|
|
2667
1675
|
/**
|
|
2668
1676
|
* This web component is designed to display a user-friendly error message when a search query fails, providing clear feedback to users and enhancing their experience when an issue arises during the search process.
|
|
2669
|
-
*
|
|
2670
|
-
*
|
|
2671
|
-
*
|
|
2672
|
-
*
|
|
1677
|
+
* @js-example ```html
|
|
1678
|
+
* <searchcraft-error-message>
|
|
1679
|
+
* No search results found for query
|
|
1680
|
+
* </searchcraft-error-message>
|
|
2673
1681
|
* ```
|
|
2674
1682
|
*/
|
|
2675
1683
|
interface SearchcraftErrorMessage {
|
|
2676
|
-
/**
|
|
2677
|
-
* The error message.
|
|
2678
|
-
*/
|
|
2679
|
-
"errorMessage"?: string;
|
|
2680
1684
|
}
|
|
2681
1685
|
/**
|
|
2682
1686
|
* This web component is designed to display facets in a search interface, allowing users to refine their search results by applying filters based on various attributes.
|
|
2683
1687
|
* It is consumed within the `searchcraft-filter-panel`.
|
|
2684
|
-
*
|
|
2685
|
-
* ```html
|
|
1688
|
+
* @js-example ```html
|
|
2686
1689
|
* <!-- index.html -->
|
|
2687
1690
|
* <searchcraft-facet-list field-name="title" />
|
|
2688
1691
|
* ```
|
|
@@ -2708,11 +1711,29 @@ declare namespace LocalJSX {
|
|
|
2708
1711
|
}
|
|
2709
1712
|
/**
|
|
2710
1713
|
* This web component represents a series of filters that allows users to refine and control their search queries by applying various filter criteria.
|
|
2711
|
-
*
|
|
2712
|
-
*
|
|
1714
|
+
* @import ```jsx
|
|
1715
|
+
* // react
|
|
1716
|
+
* import { SearchcraftFilterPanel } from "@searchcraft/react-sdk";
|
|
1717
|
+
* // vue
|
|
1718
|
+
* import { SearchcraftFilterPanel } from "@searchcraft/vue-sdk";
|
|
1719
|
+
* ```
|
|
1720
|
+
* @js-example ```html
|
|
2713
1721
|
* <!-- index.html -->
|
|
2714
1722
|
* <searchcraft-filter-panel />
|
|
2715
1723
|
* ```
|
|
1724
|
+
* ```js
|
|
1725
|
+
* // index.js
|
|
1726
|
+
* const filterPanel = document.querySelector('searchcraft-filter-panel');
|
|
1727
|
+
* if (filterPanel) {
|
|
1728
|
+
* filterPanel.items = [];
|
|
1729
|
+
* }
|
|
1730
|
+
* ```
|
|
1731
|
+
* @react-example ```jsx
|
|
1732
|
+
* <SearchcraftFilterPanel items={[]} />
|
|
1733
|
+
* ```
|
|
1734
|
+
* @vue-example ```jsx
|
|
1735
|
+
* <SearchcraftFilterPanel :items="[]" />
|
|
1736
|
+
* ```
|
|
2716
1737
|
*/
|
|
2717
1738
|
interface SearchcraftFilterPanel {
|
|
2718
1739
|
/**
|
|
@@ -2723,14 +1744,20 @@ declare namespace LocalJSX {
|
|
|
2723
1744
|
/**
|
|
2724
1745
|
* This web component provides a user-friendly interface for querying an indexed dataset, enabling users to easily search large collections of data.
|
|
2725
1746
|
* It abstracts the complexities of index-based searching, making it accessible to users of all technical levels.
|
|
2726
|
-
*
|
|
2727
|
-
*
|
|
2728
|
-
*
|
|
2729
|
-
*
|
|
1747
|
+
* @import ```jsx
|
|
1748
|
+
* // react
|
|
1749
|
+
* import { SearchcraftInputForm } from "@searchcraft/react-sdk";
|
|
1750
|
+
* // vue
|
|
1751
|
+
* import { SearchcraftInputForm } from "@searchcraft/vue-sdk";
|
|
2730
1752
|
* ```
|
|
2731
|
-
* ```
|
|
2732
|
-
*
|
|
2733
|
-
*
|
|
1753
|
+
* @js-example ```html
|
|
1754
|
+
* <searchcraft-input-form auto-search />
|
|
1755
|
+
* ```
|
|
1756
|
+
* @react-example ```jsx
|
|
1757
|
+
* <SearchcraftInputForm autoSearch />
|
|
1758
|
+
* ```
|
|
1759
|
+
* @vue-example ```jsx
|
|
1760
|
+
* <SearchcraftInputForm autoSearch />
|
|
2734
1761
|
* ```
|
|
2735
1762
|
*/
|
|
2736
1763
|
interface SearchcraftInputForm {
|
|
@@ -2747,10 +1774,6 @@ declare namespace LocalJSX {
|
|
|
2747
1774
|
*/
|
|
2748
1775
|
"buttonPlacement"?: "left" | "right" | "none";
|
|
2749
1776
|
"core"?: SearchcraftCore;
|
|
2750
|
-
/**
|
|
2751
|
-
* A custom styles object to be applied to the input element.
|
|
2752
|
-
*/
|
|
2753
|
-
"customStyles"?: string | Record<string, string>;
|
|
2754
1777
|
/**
|
|
2755
1778
|
* The label rendered above the input.
|
|
2756
1779
|
*/
|
|
@@ -2774,9 +1797,7 @@ declare namespace LocalJSX {
|
|
|
2774
1797
|
}
|
|
2775
1798
|
/**
|
|
2776
1799
|
* This web component serves as the input label for the searchcraft-input-form component.
|
|
2777
|
-
*
|
|
2778
|
-
* ```html
|
|
2779
|
-
* <!-- index.html -->
|
|
1800
|
+
* @js-example ```html
|
|
2780
1801
|
* <searchcraft-input-label label="Search" />
|
|
2781
1802
|
* ```
|
|
2782
1803
|
*/
|
|
@@ -2788,44 +1809,73 @@ declare namespace LocalJSX {
|
|
|
2788
1809
|
"label"?: string;
|
|
2789
1810
|
}
|
|
2790
1811
|
/**
|
|
2791
|
-
* This web component is designed to facilitate pagination of search results.
|
|
2792
|
-
*
|
|
2793
|
-
*
|
|
2794
|
-
*
|
|
2795
|
-
*
|
|
1812
|
+
* This web component is designed to facilitate pagination of search results. Once a query is submitted, calculates the number for pages.
|
|
1813
|
+
* @import ```jsx
|
|
1814
|
+
* // react
|
|
1815
|
+
* import { SearchcraftPagination } from "@searchcraft/react-sdk";
|
|
1816
|
+
* // vue
|
|
1817
|
+
* import { SearchcraftPagination } from "@searchcraft/vue-sdk";
|
|
1818
|
+
* ```
|
|
1819
|
+
* @js-example ```html
|
|
2796
1820
|
* <searchcraft-pagination />
|
|
2797
1821
|
* ```
|
|
1822
|
+
* @react-example ```jsx
|
|
1823
|
+
* <SearchcraftPagination />
|
|
1824
|
+
* ```
|
|
1825
|
+
* @vue-example ```jsx
|
|
1826
|
+
* <SearchcraftPagination />
|
|
1827
|
+
* ```
|
|
2798
1828
|
*/
|
|
2799
1829
|
interface SearchcraftPagination {
|
|
2800
|
-
/**
|
|
2801
|
-
* The custom styles object.
|
|
2802
|
-
*/
|
|
2803
|
-
"customStyles"?: string;
|
|
2804
1830
|
}
|
|
2805
1831
|
/**
|
|
2806
1832
|
* Renders a button which, when clicked, turns on popover visibility.
|
|
1833
|
+
* @import ```jsx
|
|
1834
|
+
* // react
|
|
1835
|
+
* import { SearchcraftPopoverButton } from "@searchcraft/react-sdk";
|
|
1836
|
+
* // vue
|
|
1837
|
+
* import { SearchcraftPopoverButton } from "@searchcraft/vue-sdk";
|
|
1838
|
+
* ```
|
|
1839
|
+
* @js-example ```html
|
|
1840
|
+
* <searchcraft-popover-button>
|
|
1841
|
+
* Open popover
|
|
1842
|
+
* </searchcraft-popover-button>
|
|
1843
|
+
* ```
|
|
1844
|
+
* @react-example ```jsx
|
|
1845
|
+
* <SearchcraftPopoverButton>
|
|
1846
|
+
* Open popover
|
|
1847
|
+
* </SearchcraftPopoverButton>
|
|
1848
|
+
* ```
|
|
1849
|
+
* @vue-example ```jsx
|
|
1850
|
+
* <SearchcraftPopoverButton>
|
|
1851
|
+
* Open popover
|
|
1852
|
+
* </SearchcraftPopoverButton>
|
|
1853
|
+
* ```
|
|
2807
1854
|
*/
|
|
2808
1855
|
interface SearchcraftPopoverButton {
|
|
2809
1856
|
}
|
|
2810
1857
|
/**
|
|
2811
1858
|
* This web component is designed to display search results in a popover container that dynamically appears when the user interacts with a search input field, or when a popover-button is pressed.
|
|
2812
|
-
*
|
|
2813
|
-
*
|
|
1859
|
+
* @import ```jsx
|
|
1860
|
+
* // react
|
|
1861
|
+
* import { SearchcraftPopoverForm } from "@searchcraft/react-sdk";
|
|
1862
|
+
* // vue
|
|
1863
|
+
* import { SearchcraftPopoverForm } from "@searchcraft/vue-sdk";
|
|
1864
|
+
* ```
|
|
1865
|
+
* @js-example ```html
|
|
2814
1866
|
* <!-- index.html -->
|
|
2815
|
-
* <searchcraft-popover-form type="
|
|
1867
|
+
* <searchcraft-popover-form type="inline" />
|
|
2816
1868
|
* ```
|
|
2817
1869
|
* ```js
|
|
2818
1870
|
* // index.js
|
|
2819
1871
|
* const popoverForm = document.querySelector('searchcraft-popover-form');
|
|
2820
|
-
* popoverForm.popoverResultMappings = {
|
|
2821
|
-
*
|
|
2822
|
-
*
|
|
2823
|
-
*
|
|
2824
|
-
*
|
|
2825
|
-
*
|
|
2826
|
-
*
|
|
2827
|
-
* ],
|
|
2828
|
-
* };
|
|
1872
|
+
* popoverForm.popoverResultMappings = {};
|
|
1873
|
+
* ```
|
|
1874
|
+
* @react-example ```jsx
|
|
1875
|
+
* <SearchcraftPopoverForm type="inline" popoverResultMappings={[]} />
|
|
1876
|
+
* ```
|
|
1877
|
+
* @vue-example ```jsx
|
|
1878
|
+
* <SearchcraftPopoverForm type="inline" :popoverResultMappings="[]"" />
|
|
2829
1879
|
* ```
|
|
2830
1880
|
*/
|
|
2831
1881
|
interface SearchcraftPopoverForm {
|
|
@@ -2842,7 +1892,7 @@ declare namespace LocalJSX {
|
|
|
2842
1892
|
*/
|
|
2843
1893
|
"popoverResultMappings"?: PopoverResultMappings;
|
|
2844
1894
|
/**
|
|
2845
|
-
* The type of popover form to render.
|
|
1895
|
+
* The type of popover form to render. - `inline` - Renders inline with the rest of the content on the page. The search results pop over the page content. - `fullscreen` - Renders in fullscreen view. Used together with the `searchcraft-popover-button` component. - `modal` - Renders in a modal view. Used together with the `searchcraft-popover-button` component.
|
|
2846
1896
|
*/
|
|
2847
1897
|
"type"?: "inline" | "fullscreen" | "modal";
|
|
2848
1898
|
}
|
|
@@ -2860,9 +1910,7 @@ declare namespace LocalJSX {
|
|
|
2860
1910
|
/**
|
|
2861
1911
|
* This web component is designed to display a list of results within a popover interface.
|
|
2862
1912
|
* It is consumed within the `searchcraft-popover-form` component.
|
|
2863
|
-
*
|
|
2864
|
-
* ```html
|
|
2865
|
-
* <!-- index.html -->
|
|
1913
|
+
* @js-example ```html
|
|
2866
1914
|
* <searchcraft-popover-list-view />
|
|
2867
1915
|
* ```
|
|
2868
1916
|
*/
|
|
@@ -2881,44 +1929,128 @@ declare namespace LocalJSX {
|
|
|
2881
1929
|
}
|
|
2882
1930
|
/**
|
|
2883
1931
|
* This web component is designed to display the number of results returned from a search query.
|
|
2884
|
-
*
|
|
2885
|
-
*
|
|
1932
|
+
* @import ```jsx
|
|
1933
|
+
* // react
|
|
1934
|
+
* import { SearchcraftResultsInfo } from "@searchcraft/react-sdk";
|
|
1935
|
+
* // vue
|
|
1936
|
+
* import { SearchcraftResultsInfo } from "@searchcraft/vue-sdk";
|
|
1937
|
+
* ```
|
|
1938
|
+
* @js-example ```html
|
|
2886
1939
|
* <!-- index.html -->
|
|
2887
|
-
* <script>
|
|
2888
|
-
* const resultsInfo = document.querySelector('searchcraft-results-info');
|
|
2889
|
-
* resultsInfo.customFormatter = (range, count, responseTime) =>
|
|
2890
|
-
* `${range[0]}-${range[1]} of ${count} results in ${responseTime}ms`;
|
|
2891
|
-
* </script>
|
|
2892
1940
|
* <searchcraft-results-info />
|
|
2893
1941
|
* ```
|
|
1942
|
+
* ```js
|
|
1943
|
+
* // index.js
|
|
1944
|
+
* const resultsInfo = document.querySelector('searchcraft-results-info');
|
|
1945
|
+
* resultsInfo.template = (info, { html }) => html`
|
|
1946
|
+
* ${info.range[0]}-${info.range[1]} of ${info.count} results in ${info.responseTime}ms
|
|
1947
|
+
* `;
|
|
1948
|
+
* ```
|
|
1949
|
+
* @react-example ```jsx
|
|
1950
|
+
* <SearchcraftResultsInfo
|
|
1951
|
+
* template={(info, { html }) => html`
|
|
1952
|
+
* ${info.range[0]}-${info.range[1]} of ${info.count} results in ${info.responseTime}ms
|
|
1953
|
+
* `}
|
|
1954
|
+
* />
|
|
1955
|
+
* @vue-example ```jsx
|
|
1956
|
+
* <SearchcraftResultsInfo
|
|
1957
|
+
* :template={(info, { html }) => html`
|
|
1958
|
+
* ${info.range[0]}-${info.range[1]} of ${info.count} results in ${info.responseTime}ms
|
|
1959
|
+
* `}
|
|
1960
|
+
* />
|
|
2894
1961
|
*/
|
|
2895
1962
|
interface SearchcraftResultsInfo {
|
|
2896
1963
|
/**
|
|
2897
|
-
*
|
|
2898
|
-
* @example ```ts resultsInfo.
|
|
1964
|
+
* A callback function responsible for rendering the results info.
|
|
1965
|
+
* @example ```ts resultsInfo.template = html` ${range[0]}-${range[1]} of ${count} results in ${responseTime}ms `; ```
|
|
1966
|
+
*/
|
|
1967
|
+
"template"?: ResultsInfoTemplate;
|
|
1968
|
+
}
|
|
1969
|
+
/**
|
|
1970
|
+
* This web component is designed to display detailed information for a single search result. Once a query is submitted, the component formats and presents the result.
|
|
1971
|
+
*/
|
|
1972
|
+
interface SearchcraftSearchResult {
|
|
1973
|
+
/**
|
|
1974
|
+
* The position in the document. Used with the "document_clicked" measure event.
|
|
1975
|
+
*/
|
|
1976
|
+
"documentPosition"?: number;
|
|
1977
|
+
/**
|
|
1978
|
+
* The index.
|
|
1979
|
+
*/
|
|
1980
|
+
"index": number;
|
|
1981
|
+
"item"?: SearchClientResponseItem;
|
|
1982
|
+
/**
|
|
1983
|
+
* A callback function responsible for rendering a result.
|
|
2899
1984
|
*/
|
|
2900
|
-
"
|
|
2901
|
-
|
|
2902
|
-
|
|
2903
|
-
|
|
1985
|
+
"template"?: SearchResultTemplate<SearchResultTemplateData>;
|
|
1986
|
+
}
|
|
1987
|
+
/**
|
|
1988
|
+
* This web component is responsible for displaying the results of a search query. Once a query is submitted, the component formats and presents an ordered list of the results.
|
|
1989
|
+
* @import ```jsx
|
|
1990
|
+
* // react
|
|
1991
|
+
* import { SearchcraftSearchResults } from "@searchcraft/react-sdk";
|
|
1992
|
+
* // vue
|
|
1993
|
+
* import { SearchcraftSearchResults } from "@searchcraft/vue-sdk";
|
|
1994
|
+
* ```
|
|
1995
|
+
* @js-example ```html
|
|
1996
|
+
* <!-- index.html -->
|
|
1997
|
+
* <searchcraft-search-results
|
|
1998
|
+
* ad-interval="4"
|
|
1999
|
+
* place-ad-at-start="true"
|
|
2000
|
+
* />
|
|
2001
|
+
* ```
|
|
2002
|
+
* ```js
|
|
2003
|
+
* // index.js
|
|
2004
|
+
* const searchResults = document.querySelector('searchcraft-search-results');
|
|
2005
|
+
* searchResults.template = (item, index, { html }) => html`
|
|
2006
|
+
* <h2>${item.title}</h2>
|
|
2007
|
+
* `;
|
|
2008
|
+
* ```
|
|
2009
|
+
* @react-example ```jsx
|
|
2010
|
+
* <SearchcraftSearchResults
|
|
2011
|
+
* adInterval={4}
|
|
2012
|
+
* placeAdAtState={true}
|
|
2013
|
+
* template={(item, index, { html }) => html`
|
|
2014
|
+
* <h2>${item.title}</h2>
|
|
2015
|
+
* `}
|
|
2016
|
+
* />
|
|
2017
|
+
* ```
|
|
2018
|
+
* @vue-example ```jsx
|
|
2019
|
+
* <SearchcraftSearchResults
|
|
2020
|
+
* adInterval={4}
|
|
2021
|
+
* placeAdAtState={true}
|
|
2022
|
+
* :template={(item, index, { html }) => html`
|
|
2023
|
+
* <h2>${item.title}</h2>
|
|
2024
|
+
* `}
|
|
2025
|
+
* />
|
|
2026
|
+
* ```
|
|
2027
|
+
*/
|
|
2028
|
+
interface SearchcraftSearchResults {
|
|
2904
2029
|
/**
|
|
2905
|
-
*
|
|
2030
|
+
* A callback function responsible for rendering a result. Passed to `searchcraft-search-result`.
|
|
2906
2031
|
*/
|
|
2907
|
-
"
|
|
2032
|
+
"template"?: SearchResultTemplate<SearchResultTemplateData>;
|
|
2908
2033
|
}
|
|
2909
2034
|
/**
|
|
2910
2035
|
* This web component is designed to choose the number of search results displayed.
|
|
2911
|
-
*
|
|
2912
|
-
*
|
|
2036
|
+
* @import ```jsx
|
|
2037
|
+
* // react
|
|
2038
|
+
* import { SearchcraftSearchResultsPerPage } from "@searchcraft/react-sdk";
|
|
2039
|
+
* // vue
|
|
2040
|
+
* import { SearchcraftSearchResultsPerPage } from "@searchcraft/vue-sdk";
|
|
2041
|
+
* ```
|
|
2042
|
+
* @js-example ```html
|
|
2913
2043
|
* <!-- index.html -->
|
|
2914
2044
|
* <searchcraft-search-results-per-page increment="20" />
|
|
2915
2045
|
* ```
|
|
2046
|
+
* @react-example ```jsx
|
|
2047
|
+
* <SearchcraftSearchResultsPerPage increment={20} />
|
|
2048
|
+
* ```
|
|
2049
|
+
* @vue-example ```jsx
|
|
2050
|
+
* <SearchcraftSearchResultsPerPage increment="20" />
|
|
2051
|
+
* ```
|
|
2916
2052
|
*/
|
|
2917
2053
|
interface SearchcraftSearchResultsPerPage {
|
|
2918
|
-
/**
|
|
2919
|
-
* The custom styles object.
|
|
2920
|
-
*/
|
|
2921
|
-
"customStyles"?: string;
|
|
2922
2054
|
/**
|
|
2923
2055
|
* The amount the options will increase (e.g. 20 = [20, 40, 60, 80, 100]). The base value is defined by the `searchResultsPerPage` option in the configuration.
|
|
2924
2056
|
*/
|
|
@@ -2926,8 +2058,7 @@ declare namespace LocalJSX {
|
|
|
2926
2058
|
}
|
|
2927
2059
|
/**
|
|
2928
2060
|
* This web component is designed to allow users to select between a group of options.
|
|
2929
|
-
*
|
|
2930
|
-
* ```html
|
|
2061
|
+
* @js-example ```html
|
|
2931
2062
|
* <!-- index.html -->
|
|
2932
2063
|
* <searchcraft-select
|
|
2933
2064
|
* inputId="searchcraft-select"
|
|
@@ -2941,10 +2072,6 @@ declare namespace LocalJSX {
|
|
|
2941
2072
|
* The caption displayed below the select input.
|
|
2942
2073
|
*/
|
|
2943
2074
|
"caption"?: string;
|
|
2944
|
-
/**
|
|
2945
|
-
* A custom styles object.
|
|
2946
|
-
*/
|
|
2947
|
-
"customStyles"?: string;
|
|
2948
2075
|
/**
|
|
2949
2076
|
* Whether the select input is disabled.
|
|
2950
2077
|
*/
|
|
@@ -2975,9 +2102,7 @@ declare namespace LocalJSX {
|
|
|
2975
2102
|
"options"?: SearchcraftSelectOption[] | string;
|
|
2976
2103
|
}
|
|
2977
2104
|
/**
|
|
2978
|
-
* This web component is designed to allow users to select a value from a range defined by a minimum and maximum value.
|
|
2979
|
-
* The component renders a slider interface, which can be used to visually choose a value between two boundaries.
|
|
2980
|
-
* It is consumed by the `searchcraft-filter-panel` component.
|
|
2105
|
+
* This web component is designed to allow users to select a value from a range defined by a minimum and maximum value. The component renders a slider interface, which can be used to visually choose a value between two boundaries.
|
|
2981
2106
|
*/
|
|
2982
2107
|
interface SearchcraftSlider {
|
|
2983
2108
|
/**
|
|
@@ -3002,27 +2127,27 @@ declare namespace LocalJSX {
|
|
|
3002
2127
|
"onRangeChanged"?: (event: SearchcraftSliderCustomEvent<any>) => void;
|
|
3003
2128
|
}
|
|
3004
2129
|
/**
|
|
3005
|
-
* This web component adds Searchcraft's built-in css theme to your page
|
|
3006
|
-
*
|
|
3007
|
-
*
|
|
3008
|
-
*
|
|
3009
|
-
*
|
|
3010
|
-
*
|
|
2130
|
+
* This web component adds Searchcraft's built-in css theme to your page. It does not render anything visible, its only function is to manage the css styles on the page.'
|
|
2131
|
+
* @import ```jsx
|
|
2132
|
+
* // react
|
|
2133
|
+
* import { SearchcraftTheme } from "@searchcraft/react-sdk";
|
|
2134
|
+
* // vue
|
|
2135
|
+
* import { SearchcraftTheme } from "@searchcraft/vue-sdk";
|
|
2136
|
+
* ```
|
|
2137
|
+
* @js-example ```html
|
|
2138
|
+
* <searchcraft-theme />
|
|
2139
|
+
* ```
|
|
2140
|
+
* @react-example ```jsx
|
|
2141
|
+
* <SearchcraftTheme />
|
|
2142
|
+
* ```
|
|
2143
|
+
* @vue-example ```jsx
|
|
2144
|
+
* <SearchcraftTheme />
|
|
3011
2145
|
* ```
|
|
3012
2146
|
*/
|
|
3013
2147
|
interface SearchcraftTheme {
|
|
3014
|
-
/**
|
|
3015
|
-
* The custom theme configuration object.
|
|
3016
|
-
*/
|
|
3017
|
-
"customTheme"?: string;
|
|
3018
|
-
/**
|
|
3019
|
-
* The name of the theme.
|
|
3020
|
-
*/
|
|
3021
|
-
"theme"?: string;
|
|
3022
2148
|
}
|
|
3023
2149
|
/**
|
|
3024
2150
|
* This web component simulates a light switch functionality, providing a simple and intuitive toggle between two states—on and off.
|
|
3025
|
-
* It is consumed within the `searchcraft-filter-panel` component.
|
|
3026
2151
|
*/
|
|
3027
2152
|
interface SearchcraftToggleButton {
|
|
3028
2153
|
/**
|
|
@@ -3040,8 +2165,6 @@ declare namespace LocalJSX {
|
|
|
3040
2165
|
}
|
|
3041
2166
|
interface IntrinsicElements {
|
|
3042
2167
|
"searchcraft-ad": SearchcraftAd;
|
|
3043
|
-
"searchcraft-base-search-result": SearchcraftBaseSearchResult;
|
|
3044
|
-
"searchcraft-base-search-results": SearchcraftBaseSearchResults;
|
|
3045
2168
|
"searchcraft-button": SearchcraftButton;
|
|
3046
2169
|
"searchcraft-error-message": SearchcraftErrorMessage;
|
|
3047
2170
|
"searchcraft-facet-list": SearchcraftFacetList;
|
|
@@ -3054,6 +2177,8 @@ declare namespace LocalJSX {
|
|
|
3054
2177
|
"searchcraft-popover-list-item": SearchcraftPopoverListItem;
|
|
3055
2178
|
"searchcraft-popover-list-view": SearchcraftPopoverListView;
|
|
3056
2179
|
"searchcraft-results-info": SearchcraftResultsInfo;
|
|
2180
|
+
"searchcraft-search-result": SearchcraftSearchResult;
|
|
2181
|
+
"searchcraft-search-results": SearchcraftSearchResults;
|
|
3057
2182
|
"searchcraft-search-results-per-page": SearchcraftSearchResultsPerPage;
|
|
3058
2183
|
"searchcraft-select": SearchcraftSelect;
|
|
3059
2184
|
"searchcraft-slider": SearchcraftSlider;
|
|
@@ -3069,60 +2194,23 @@ declare module "@stencil/core" {
|
|
|
3069
2194
|
*/
|
|
3070
2195
|
"searchcraft-ad": LocalJSX.SearchcraftAd & JSXBase.HTMLAttributes<HTMLSearchcraftAdElement>;
|
|
3071
2196
|
/**
|
|
3072
|
-
* This web component
|
|
3073
|
-
* Once a query is submitted, the component formats and presents the result.
|
|
3074
|
-
* It is consumed within the `searchcraft-base-search-results` component.
|
|
3075
|
-
*/
|
|
3076
|
-
"searchcraft-base-search-result": LocalJSX.SearchcraftBaseSearchResult & JSXBase.HTMLAttributes<HTMLSearchcraftBaseSearchResultElement>;
|
|
3077
|
-
/**
|
|
3078
|
-
* This web component is responsible for displaying the results of a search query.
|
|
3079
|
-
* Once a query is submitted, the component formats and presents an ordered list of the results.
|
|
3080
|
-
* ## Usage
|
|
3081
|
-
* ```html
|
|
3082
|
-
* <!-- index.html -->
|
|
3083
|
-
* <searchcraft-base-search-results
|
|
3084
|
-
* ad-interval="4"
|
|
3085
|
-
* place-ad-at-start="false"
|
|
3086
|
-
* result-image-placement="right"
|
|
3087
|
-
* />
|
|
3088
|
-
* ```
|
|
3089
|
-
* ```js
|
|
3090
|
-
* // index.js
|
|
3091
|
-
* const baseSearchResults = document.querySelector('searchcraft-base-search-results');
|
|
3092
|
-
* baseSearchResults.searchResultMappings = containerHref: {
|
|
3093
|
-
* fieldNames: [
|
|
3094
|
-
* {
|
|
3095
|
-
* fieldName: 'canonical_link',
|
|
3096
|
-
* dataType: 'text',
|
|
3097
|
-
* },
|
|
3098
|
-
* ],
|
|
3099
|
-
* };
|
|
3100
|
-
* baseSearchResults.addEventListener('noResults', () => {
|
|
3101
|
-
* console.log('No search results found');
|
|
3102
|
-
* });
|
|
3103
|
-
* ```
|
|
3104
|
-
*/
|
|
3105
|
-
"searchcraft-base-search-results": LocalJSX.SearchcraftBaseSearchResults & JSXBase.HTMLAttributes<HTMLSearchcraftBaseSearchResultsElement>;
|
|
3106
|
-
/**
|
|
3107
|
-
* This web component represents a button to be consumed within the `search-input-form` component.
|
|
2197
|
+
* This web component represents a button.
|
|
3108
2198
|
* It provides a clear, interactive way for users to submit search queries or trigger actions in a search interface.
|
|
3109
|
-
* It is consumed within the `searchcraft-input-form` component.
|
|
3110
2199
|
*/
|
|
3111
2200
|
"searchcraft-button": LocalJSX.SearchcraftButton & JSXBase.HTMLAttributes<HTMLSearchcraftButtonElement>;
|
|
3112
2201
|
/**
|
|
3113
2202
|
* This web component is designed to display a user-friendly error message when a search query fails, providing clear feedback to users and enhancing their experience when an issue arises during the search process.
|
|
3114
|
-
*
|
|
3115
|
-
*
|
|
3116
|
-
*
|
|
3117
|
-
*
|
|
2203
|
+
* @js-example ```html
|
|
2204
|
+
* <searchcraft-error-message>
|
|
2205
|
+
* No search results found for query
|
|
2206
|
+
* </searchcraft-error-message>
|
|
3118
2207
|
* ```
|
|
3119
2208
|
*/
|
|
3120
2209
|
"searchcraft-error-message": LocalJSX.SearchcraftErrorMessage & JSXBase.HTMLAttributes<HTMLSearchcraftErrorMessageElement>;
|
|
3121
2210
|
/**
|
|
3122
2211
|
* This web component is designed to display facets in a search interface, allowing users to refine their search results by applying filters based on various attributes.
|
|
3123
2212
|
* It is consumed within the `searchcraft-filter-panel`.
|
|
3124
|
-
*
|
|
3125
|
-
* ```html
|
|
2213
|
+
* @js-example ```html
|
|
3126
2214
|
* <!-- index.html -->
|
|
3127
2215
|
* <searchcraft-facet-list field-name="title" />
|
|
3128
2216
|
* ```
|
|
@@ -3137,69 +2225,124 @@ declare module "@stencil/core" {
|
|
|
3137
2225
|
"searchcraft-facet-list": LocalJSX.SearchcraftFacetList & JSXBase.HTMLAttributes<HTMLSearchcraftFacetListElement>;
|
|
3138
2226
|
/**
|
|
3139
2227
|
* This web component represents a series of filters that allows users to refine and control their search queries by applying various filter criteria.
|
|
3140
|
-
*
|
|
3141
|
-
*
|
|
2228
|
+
* @import ```jsx
|
|
2229
|
+
* // react
|
|
2230
|
+
* import { SearchcraftFilterPanel } from "@searchcraft/react-sdk";
|
|
2231
|
+
* // vue
|
|
2232
|
+
* import { SearchcraftFilterPanel } from "@searchcraft/vue-sdk";
|
|
2233
|
+
* ```
|
|
2234
|
+
* @js-example ```html
|
|
3142
2235
|
* <!-- index.html -->
|
|
3143
2236
|
* <searchcraft-filter-panel />
|
|
3144
2237
|
* ```
|
|
2238
|
+
* ```js
|
|
2239
|
+
* // index.js
|
|
2240
|
+
* const filterPanel = document.querySelector('searchcraft-filter-panel');
|
|
2241
|
+
* if (filterPanel) {
|
|
2242
|
+
* filterPanel.items = [];
|
|
2243
|
+
* }
|
|
2244
|
+
* ```
|
|
2245
|
+
* @react-example ```jsx
|
|
2246
|
+
* <SearchcraftFilterPanel items={[]} />
|
|
2247
|
+
* ```
|
|
2248
|
+
* @vue-example ```jsx
|
|
2249
|
+
* <SearchcraftFilterPanel :items="[]" />
|
|
2250
|
+
* ```
|
|
3145
2251
|
*/
|
|
3146
2252
|
"searchcraft-filter-panel": LocalJSX.SearchcraftFilterPanel & JSXBase.HTMLAttributes<HTMLSearchcraftFilterPanelElement>;
|
|
3147
2253
|
/**
|
|
3148
2254
|
* This web component provides a user-friendly interface for querying an indexed dataset, enabling users to easily search large collections of data.
|
|
3149
2255
|
* It abstracts the complexities of index-based searching, making it accessible to users of all technical levels.
|
|
3150
|
-
*
|
|
3151
|
-
*
|
|
3152
|
-
*
|
|
3153
|
-
*
|
|
2256
|
+
* @import ```jsx
|
|
2257
|
+
* // react
|
|
2258
|
+
* import { SearchcraftInputForm } from "@searchcraft/react-sdk";
|
|
2259
|
+
* // vue
|
|
2260
|
+
* import { SearchcraftInputForm } from "@searchcraft/vue-sdk";
|
|
3154
2261
|
* ```
|
|
3155
|
-
* ```
|
|
3156
|
-
*
|
|
3157
|
-
*
|
|
2262
|
+
* @js-example ```html
|
|
2263
|
+
* <searchcraft-input-form auto-search />
|
|
2264
|
+
* ```
|
|
2265
|
+
* @react-example ```jsx
|
|
2266
|
+
* <SearchcraftInputForm autoSearch />
|
|
2267
|
+
* ```
|
|
2268
|
+
* @vue-example ```jsx
|
|
2269
|
+
* <SearchcraftInputForm autoSearch />
|
|
3158
2270
|
* ```
|
|
3159
2271
|
*/
|
|
3160
2272
|
"searchcraft-input-form": LocalJSX.SearchcraftInputForm & JSXBase.HTMLAttributes<HTMLSearchcraftInputFormElement>;
|
|
3161
2273
|
/**
|
|
3162
2274
|
* This web component serves as the input label for the searchcraft-input-form component.
|
|
3163
|
-
*
|
|
3164
|
-
* ```html
|
|
3165
|
-
* <!-- index.html -->
|
|
2275
|
+
* @js-example ```html
|
|
3166
2276
|
* <searchcraft-input-label label="Search" />
|
|
3167
2277
|
* ```
|
|
3168
2278
|
*/
|
|
3169
2279
|
"searchcraft-input-label": LocalJSX.SearchcraftInputLabel & JSXBase.HTMLAttributes<HTMLSearchcraftInputLabelElement>;
|
|
3170
2280
|
/**
|
|
3171
|
-
* This web component is designed to facilitate pagination of search results.
|
|
3172
|
-
*
|
|
3173
|
-
*
|
|
3174
|
-
*
|
|
3175
|
-
*
|
|
2281
|
+
* This web component is designed to facilitate pagination of search results. Once a query is submitted, calculates the number for pages.
|
|
2282
|
+
* @import ```jsx
|
|
2283
|
+
* // react
|
|
2284
|
+
* import { SearchcraftPagination } from "@searchcraft/react-sdk";
|
|
2285
|
+
* // vue
|
|
2286
|
+
* import { SearchcraftPagination } from "@searchcraft/vue-sdk";
|
|
2287
|
+
* ```
|
|
2288
|
+
* @js-example ```html
|
|
3176
2289
|
* <searchcraft-pagination />
|
|
3177
2290
|
* ```
|
|
2291
|
+
* @react-example ```jsx
|
|
2292
|
+
* <SearchcraftPagination />
|
|
2293
|
+
* ```
|
|
2294
|
+
* @vue-example ```jsx
|
|
2295
|
+
* <SearchcraftPagination />
|
|
2296
|
+
* ```
|
|
3178
2297
|
*/
|
|
3179
2298
|
"searchcraft-pagination": LocalJSX.SearchcraftPagination & JSXBase.HTMLAttributes<HTMLSearchcraftPaginationElement>;
|
|
3180
2299
|
/**
|
|
3181
2300
|
* Renders a button which, when clicked, turns on popover visibility.
|
|
2301
|
+
* @import ```jsx
|
|
2302
|
+
* // react
|
|
2303
|
+
* import { SearchcraftPopoverButton } from "@searchcraft/react-sdk";
|
|
2304
|
+
* // vue
|
|
2305
|
+
* import { SearchcraftPopoverButton } from "@searchcraft/vue-sdk";
|
|
2306
|
+
* ```
|
|
2307
|
+
* @js-example ```html
|
|
2308
|
+
* <searchcraft-popover-button>
|
|
2309
|
+
* Open popover
|
|
2310
|
+
* </searchcraft-popover-button>
|
|
2311
|
+
* ```
|
|
2312
|
+
* @react-example ```jsx
|
|
2313
|
+
* <SearchcraftPopoverButton>
|
|
2314
|
+
* Open popover
|
|
2315
|
+
* </SearchcraftPopoverButton>
|
|
2316
|
+
* ```
|
|
2317
|
+
* @vue-example ```jsx
|
|
2318
|
+
* <SearchcraftPopoverButton>
|
|
2319
|
+
* Open popover
|
|
2320
|
+
* </SearchcraftPopoverButton>
|
|
2321
|
+
* ```
|
|
3182
2322
|
*/
|
|
3183
2323
|
"searchcraft-popover-button": LocalJSX.SearchcraftPopoverButton & JSXBase.HTMLAttributes<HTMLSearchcraftPopoverButtonElement>;
|
|
3184
2324
|
/**
|
|
3185
2325
|
* This web component is designed to display search results in a popover container that dynamically appears when the user interacts with a search input field, or when a popover-button is pressed.
|
|
3186
|
-
*
|
|
3187
|
-
*
|
|
2326
|
+
* @import ```jsx
|
|
2327
|
+
* // react
|
|
2328
|
+
* import { SearchcraftPopoverForm } from "@searchcraft/react-sdk";
|
|
2329
|
+
* // vue
|
|
2330
|
+
* import { SearchcraftPopoverForm } from "@searchcraft/vue-sdk";
|
|
2331
|
+
* ```
|
|
2332
|
+
* @js-example ```html
|
|
3188
2333
|
* <!-- index.html -->
|
|
3189
|
-
* <searchcraft-popover-form type="
|
|
2334
|
+
* <searchcraft-popover-form type="inline" />
|
|
3190
2335
|
* ```
|
|
3191
2336
|
* ```js
|
|
3192
2337
|
* // index.js
|
|
3193
2338
|
* const popoverForm = document.querySelector('searchcraft-popover-form');
|
|
3194
|
-
* popoverForm.popoverResultMappings = {
|
|
3195
|
-
*
|
|
3196
|
-
*
|
|
3197
|
-
*
|
|
3198
|
-
*
|
|
3199
|
-
*
|
|
3200
|
-
*
|
|
3201
|
-
* ],
|
|
3202
|
-
* };
|
|
2339
|
+
* popoverForm.popoverResultMappings = {};
|
|
2340
|
+
* ```
|
|
2341
|
+
* @react-example ```jsx
|
|
2342
|
+
* <SearchcraftPopoverForm type="inline" popoverResultMappings={[]} />
|
|
2343
|
+
* ```
|
|
2344
|
+
* @vue-example ```jsx
|
|
2345
|
+
* <SearchcraftPopoverForm type="inline" :popoverResultMappings="[]"" />
|
|
3203
2346
|
* ```
|
|
3204
2347
|
*/
|
|
3205
2348
|
"searchcraft-popover-form": LocalJSX.SearchcraftPopoverForm & JSXBase.HTMLAttributes<HTMLSearchcraftPopoverFormElement>;
|
|
@@ -3210,40 +2353,113 @@ declare module "@stencil/core" {
|
|
|
3210
2353
|
/**
|
|
3211
2354
|
* This web component is designed to display a list of results within a popover interface.
|
|
3212
2355
|
* It is consumed within the `searchcraft-popover-form` component.
|
|
3213
|
-
*
|
|
3214
|
-
* ```html
|
|
3215
|
-
* <!-- index.html -->
|
|
2356
|
+
* @js-example ```html
|
|
3216
2357
|
* <searchcraft-popover-list-view />
|
|
3217
2358
|
* ```
|
|
3218
2359
|
*/
|
|
3219
2360
|
"searchcraft-popover-list-view": LocalJSX.SearchcraftPopoverListView & JSXBase.HTMLAttributes<HTMLSearchcraftPopoverListViewElement>;
|
|
3220
2361
|
/**
|
|
3221
2362
|
* This web component is designed to display the number of results returned from a search query.
|
|
3222
|
-
*
|
|
3223
|
-
*
|
|
2363
|
+
* @import ```jsx
|
|
2364
|
+
* // react
|
|
2365
|
+
* import { SearchcraftResultsInfo } from "@searchcraft/react-sdk";
|
|
2366
|
+
* // vue
|
|
2367
|
+
* import { SearchcraftResultsInfo } from "@searchcraft/vue-sdk";
|
|
2368
|
+
* ```
|
|
2369
|
+
* @js-example ```html
|
|
3224
2370
|
* <!-- index.html -->
|
|
3225
|
-
* <script>
|
|
3226
|
-
* const resultsInfo = document.querySelector('searchcraft-results-info');
|
|
3227
|
-
* resultsInfo.customFormatter = (range, count, responseTime) =>
|
|
3228
|
-
* `${range[0]}-${range[1]} of ${count} results in ${responseTime}ms`;
|
|
3229
|
-
* </script>
|
|
3230
2371
|
* <searchcraft-results-info />
|
|
3231
2372
|
* ```
|
|
2373
|
+
* ```js
|
|
2374
|
+
* // index.js
|
|
2375
|
+
* const resultsInfo = document.querySelector('searchcraft-results-info');
|
|
2376
|
+
* resultsInfo.template = (info, { html }) => html`
|
|
2377
|
+
* ${info.range[0]}-${info.range[1]} of ${info.count} results in ${info.responseTime}ms
|
|
2378
|
+
* `;
|
|
2379
|
+
* ```
|
|
2380
|
+
* @react-example ```jsx
|
|
2381
|
+
* <SearchcraftResultsInfo
|
|
2382
|
+
* template={(info, { html }) => html`
|
|
2383
|
+
* ${info.range[0]}-${info.range[1]} of ${info.count} results in ${info.responseTime}ms
|
|
2384
|
+
* `}
|
|
2385
|
+
* />
|
|
2386
|
+
* @vue-example ```jsx
|
|
2387
|
+
* <SearchcraftResultsInfo
|
|
2388
|
+
* :template={(info, { html }) => html`
|
|
2389
|
+
* ${info.range[0]}-${info.range[1]} of ${info.count} results in ${info.responseTime}ms
|
|
2390
|
+
* `}
|
|
2391
|
+
* />
|
|
3232
2392
|
*/
|
|
3233
2393
|
"searchcraft-results-info": LocalJSX.SearchcraftResultsInfo & JSXBase.HTMLAttributes<HTMLSearchcraftResultsInfoElement>;
|
|
2394
|
+
/**
|
|
2395
|
+
* This web component is designed to display detailed information for a single search result. Once a query is submitted, the component formats and presents the result.
|
|
2396
|
+
*/
|
|
2397
|
+
"searchcraft-search-result": LocalJSX.SearchcraftSearchResult & JSXBase.HTMLAttributes<HTMLSearchcraftSearchResultElement>;
|
|
2398
|
+
/**
|
|
2399
|
+
* This web component is responsible for displaying the results of a search query. Once a query is submitted, the component formats and presents an ordered list of the results.
|
|
2400
|
+
* @import ```jsx
|
|
2401
|
+
* // react
|
|
2402
|
+
* import { SearchcraftSearchResults } from "@searchcraft/react-sdk";
|
|
2403
|
+
* // vue
|
|
2404
|
+
* import { SearchcraftSearchResults } from "@searchcraft/vue-sdk";
|
|
2405
|
+
* ```
|
|
2406
|
+
* @js-example ```html
|
|
2407
|
+
* <!-- index.html -->
|
|
2408
|
+
* <searchcraft-search-results
|
|
2409
|
+
* ad-interval="4"
|
|
2410
|
+
* place-ad-at-start="true"
|
|
2411
|
+
* />
|
|
2412
|
+
* ```
|
|
2413
|
+
* ```js
|
|
2414
|
+
* // index.js
|
|
2415
|
+
* const searchResults = document.querySelector('searchcraft-search-results');
|
|
2416
|
+
* searchResults.template = (item, index, { html }) => html`
|
|
2417
|
+
* <h2>${item.title}</h2>
|
|
2418
|
+
* `;
|
|
2419
|
+
* ```
|
|
2420
|
+
* @react-example ```jsx
|
|
2421
|
+
* <SearchcraftSearchResults
|
|
2422
|
+
* adInterval={4}
|
|
2423
|
+
* placeAdAtState={true}
|
|
2424
|
+
* template={(item, index, { html }) => html`
|
|
2425
|
+
* <h2>${item.title}</h2>
|
|
2426
|
+
* `}
|
|
2427
|
+
* />
|
|
2428
|
+
* ```
|
|
2429
|
+
* @vue-example ```jsx
|
|
2430
|
+
* <SearchcraftSearchResults
|
|
2431
|
+
* adInterval={4}
|
|
2432
|
+
* placeAdAtState={true}
|
|
2433
|
+
* :template={(item, index, { html }) => html`
|
|
2434
|
+
* <h2>${item.title}</h2>
|
|
2435
|
+
* `}
|
|
2436
|
+
* />
|
|
2437
|
+
* ```
|
|
2438
|
+
*/
|
|
2439
|
+
"searchcraft-search-results": LocalJSX.SearchcraftSearchResults & JSXBase.HTMLAttributes<HTMLSearchcraftSearchResultsElement>;
|
|
3234
2440
|
/**
|
|
3235
2441
|
* This web component is designed to choose the number of search results displayed.
|
|
3236
|
-
*
|
|
3237
|
-
*
|
|
2442
|
+
* @import ```jsx
|
|
2443
|
+
* // react
|
|
2444
|
+
* import { SearchcraftSearchResultsPerPage } from "@searchcraft/react-sdk";
|
|
2445
|
+
* // vue
|
|
2446
|
+
* import { SearchcraftSearchResultsPerPage } from "@searchcraft/vue-sdk";
|
|
2447
|
+
* ```
|
|
2448
|
+
* @js-example ```html
|
|
3238
2449
|
* <!-- index.html -->
|
|
3239
2450
|
* <searchcraft-search-results-per-page increment="20" />
|
|
3240
2451
|
* ```
|
|
2452
|
+
* @react-example ```jsx
|
|
2453
|
+
* <SearchcraftSearchResultsPerPage increment={20} />
|
|
2454
|
+
* ```
|
|
2455
|
+
* @vue-example ```jsx
|
|
2456
|
+
* <SearchcraftSearchResultsPerPage increment="20" />
|
|
2457
|
+
* ```
|
|
3241
2458
|
*/
|
|
3242
2459
|
"searchcraft-search-results-per-page": LocalJSX.SearchcraftSearchResultsPerPage & JSXBase.HTMLAttributes<HTMLSearchcraftSearchResultsPerPageElement>;
|
|
3243
2460
|
/**
|
|
3244
2461
|
* This web component is designed to allow users to select between a group of options.
|
|
3245
|
-
*
|
|
3246
|
-
* ```html
|
|
2462
|
+
* @js-example ```html
|
|
3247
2463
|
* <!-- index.html -->
|
|
3248
2464
|
* <searchcraft-select
|
|
3249
2465
|
* inputId="searchcraft-select"
|
|
@@ -3254,33 +2470,40 @@ declare module "@stencil/core" {
|
|
|
3254
2470
|
*/
|
|
3255
2471
|
"searchcraft-select": LocalJSX.SearchcraftSelect & JSXBase.HTMLAttributes<HTMLSearchcraftSelectElement>;
|
|
3256
2472
|
/**
|
|
3257
|
-
* This web component is designed to allow users to select a value from a range defined by a minimum and maximum value.
|
|
3258
|
-
* The component renders a slider interface, which can be used to visually choose a value between two boundaries.
|
|
3259
|
-
* It is consumed by the `searchcraft-filter-panel` component.
|
|
2473
|
+
* This web component is designed to allow users to select a value from a range defined by a minimum and maximum value. The component renders a slider interface, which can be used to visually choose a value between two boundaries.
|
|
3260
2474
|
*/
|
|
3261
2475
|
"searchcraft-slider": LocalJSX.SearchcraftSlider & JSXBase.HTMLAttributes<HTMLSearchcraftSliderElement>;
|
|
3262
2476
|
/**
|
|
3263
|
-
* This web component adds Searchcraft's built-in css theme to your page
|
|
3264
|
-
*
|
|
3265
|
-
*
|
|
3266
|
-
*
|
|
3267
|
-
*
|
|
3268
|
-
*
|
|
2477
|
+
* This web component adds Searchcraft's built-in css theme to your page. It does not render anything visible, its only function is to manage the css styles on the page.'
|
|
2478
|
+
* @import ```jsx
|
|
2479
|
+
* // react
|
|
2480
|
+
* import { SearchcraftTheme } from "@searchcraft/react-sdk";
|
|
2481
|
+
* // vue
|
|
2482
|
+
* import { SearchcraftTheme } from "@searchcraft/vue-sdk";
|
|
2483
|
+
* ```
|
|
2484
|
+
* @js-example ```html
|
|
2485
|
+
* <searchcraft-theme />
|
|
2486
|
+
* ```
|
|
2487
|
+
* @react-example ```jsx
|
|
2488
|
+
* <SearchcraftTheme />
|
|
2489
|
+
* ```
|
|
2490
|
+
* @vue-example ```jsx
|
|
2491
|
+
* <SearchcraftTheme />
|
|
3269
2492
|
* ```
|
|
3270
2493
|
*/
|
|
3271
2494
|
"searchcraft-theme": LocalJSX.SearchcraftTheme & JSXBase.HTMLAttributes<HTMLSearchcraftThemeElement>;
|
|
3272
2495
|
/**
|
|
3273
2496
|
* This web component simulates a light switch functionality, providing a simple and intuitive toggle between two states—on and off.
|
|
3274
|
-
* It is consumed within the `searchcraft-filter-panel` component.
|
|
3275
2497
|
*/
|
|
3276
2498
|
"searchcraft-toggle-button": LocalJSX.SearchcraftToggleButton & JSXBase.HTMLAttributes<HTMLSearchcraftToggleButtonElement>;
|
|
3277
2499
|
}
|
|
3278
2500
|
}
|
|
3279
2501
|
}
|
|
2502
|
+
export declare const defineCustomElements: () => void;
|
|
3280
2503
|
/**
|
|
3281
|
-
* The Props Used by the `
|
|
2504
|
+
* The Props Used by the `SearchcraftSearchResults` Component.
|
|
3282
2505
|
*/
|
|
3283
|
-
export interface
|
|
2506
|
+
export interface SearchcraftSearchResultsProps extends Components.SearchcraftSearchResults {
|
|
3284
2507
|
}
|
|
3285
2508
|
/**
|
|
3286
2509
|
* A component that renders a list of search results with customizable styles, layout, and link behavior.
|
|
@@ -3288,7 +2511,7 @@ export interface SearchcraftBaseSearchResultsProps extends Components.Searchcraf
|
|
|
3288
2511
|
* @example
|
|
3289
2512
|
* ```vue
|
|
3290
2513
|
* <script setup>
|
|
3291
|
-
* import
|
|
2514
|
+
* import SearchcraftSearchResults from '@searchcraft/vue-sdk';
|
|
3292
2515
|
* import searchResultMappings from './searchResultMappings';
|
|
3293
2516
|
*
|
|
3294
2517
|
* const handleNoResults = () => {
|
|
@@ -3297,7 +2520,7 @@ export interface SearchcraftBaseSearchResultsProps extends Components.Searchcraf
|
|
|
3297
2520
|
* </script>
|
|
3298
2521
|
*
|
|
3299
2522
|
* <template>
|
|
3300
|
-
* <
|
|
2523
|
+
* <SearchcraftSearchResults
|
|
3301
2524
|
* :searchResultMappings="searchResultMappings"
|
|
3302
2525
|
* resultImagePlacement="left"
|
|
3303
2526
|
* buttonLabel="View More"
|
|
@@ -3310,7 +2533,7 @@ export interface SearchcraftBaseSearchResultsProps extends Components.Searchcraf
|
|
|
3310
2533
|
* </template>
|
|
3311
2534
|
* ```
|
|
3312
2535
|
*/
|
|
3313
|
-
export declare const
|
|
2536
|
+
export declare const SearchcraftSearchResults: import("vue").DefineSetupFnComponent<LocalJSX.SearchcraftSearchResults & import("@stencil/vue-output-target/runtime").InputProps<string | number | boolean>, {}, {}, LocalJSX.SearchcraftSearchResults & import("@stencil/vue-output-target/runtime").InputProps<string | number | boolean>, import("vue").PublicProps>;
|
|
3314
2537
|
/**
|
|
3315
2538
|
* The props used by the SearchcraftFilterPanel.
|
|
3316
2539
|
*/
|
|
@@ -3464,7 +2687,7 @@ export interface SearchcraftThemeProps extends Components.SearchcraftTheme {
|
|
|
3464
2687
|
* </script>
|
|
3465
2688
|
*
|
|
3466
2689
|
* <template>
|
|
3467
|
-
* <SearchcraftTheme
|
|
2690
|
+
* <SearchcraftTheme />
|
|
3468
2691
|
* </template>
|
|
3469
2692
|
* ```
|
|
3470
2693
|
*/
|
|
@@ -3517,4 +2740,8 @@ export declare class Searchcraft extends SearchcraftCore {
|
|
|
3517
2740
|
constructor(config: SearchcraftConfig);
|
|
3518
2741
|
}
|
|
3519
2742
|
|
|
2743
|
+
export {
|
|
2744
|
+
LocalJSX as JSX,
|
|
2745
|
+
};
|
|
2746
|
+
|
|
3520
2747
|
export {};
|