webmarker-js 0.4.0 → 0.5.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,72 @@
1
+ type Placement = "top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
2
+ type StyleFunction = (element: Element, index: number) => Partial<CSSStyleDeclaration>;
3
+ type StyleObject = Partial<CSSStyleDeclaration>;
4
+ interface MarkOptions {
5
+ /**
6
+ * A CSS selector to query the elements to be marked.
7
+ */
8
+ selector?: string;
9
+ /**
10
+ * Provide a function for generating labels.
11
+ * By default, labels are generated as numbers starting from 0.
12
+ */
13
+ getLabel?: (element: Element, index: number) => string;
14
+ /**
15
+ * Name for the attribute added to the marked elements to store the mark label.
16
+ *
17
+ * @default 'data-mark-label'
18
+ */
19
+ markAttribute?: string;
20
+ /**
21
+ * The placement of the mark relative to the element.
22
+ *
23
+ * @default 'top-start'
24
+ */
25
+ markPlacement?: Placement;
26
+ /**
27
+ * A CSS style to apply to the label element.
28
+ * You can also specify a function that returns a CSS style object.
29
+ */
30
+ markStyle?: StyleObject | StyleFunction;
31
+ /**
32
+ * A CSS style to apply to the bounding box element.
33
+ * You can also specify a function that returns a CSS style object.
34
+ * Bounding boxes are only shown if `showBoundingBoxes` is `true`.
35
+ */
36
+ boundingBoxStyle?: StyleObject | StyleFunction;
37
+ /**
38
+ * Whether or not to show bounding boxes around the elements.
39
+ *
40
+ * @default true
41
+ */
42
+ showBoundingBoxes?: boolean;
43
+ /**
44
+ * Provide a container element to query the elements to be marked.
45
+ * By default, the container element is `document.body`.
46
+ */
47
+ containerElement?: Element;
48
+ /**
49
+ * Only mark elements that are visible in the current viewport
50
+ *
51
+ * @default false
52
+ */
53
+ viewPortOnly?: boolean;
54
+ /**
55
+ * Additional class to apply to the mark elements.
56
+ */
57
+ markClass?: string;
58
+ /**
59
+ * Additional class to apply to the bounding box elements.
60
+ */
61
+ boundingBoxClass?: string;
62
+ }
63
+ interface MarkedElement {
64
+ element: Element;
65
+ markElement: HTMLElement;
66
+ boundingBoxElement?: HTMLElement;
67
+ }
68
+ declare function mark(options?: MarkOptions): Record<string, MarkedElement>;
69
+ declare function unmark(): void;
70
+ declare function isMarked(): boolean;
71
+ export { mark, unmark, isMarked };
72
+ export type { MarkOptions, MarkedElement, Placement };