bootstrap-native.d.ts 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598
  1. import { default as default_2 } from '@thednp/position-observer';
  2. import { MouseEvent as MouseEvent_2 } from '@thednp/shorty';
  3. import { PointerEvent as PointerEvent_2 } from '@thednp/shorty';
  4. import { TouchEvent as TouchEvent_2 } from '@thednp/shorty';
  5. /** Creates a new Alert instance. */
  6. export declare class Alert extends BaseComponent {
  7. static selector: string;
  8. static init: (element: Element) => Alert;
  9. static getInstance: (element: Element) => Alert | null;
  10. dismiss: HTMLElement | null;
  11. constructor(target: Element | string);
  12. /** Returns component name string. */
  13. get name(): string;
  14. /**
  15. * Public method that hides the `.alert` element from the user,
  16. * disposes the instance once animation is complete, then
  17. * removes the element from the DOM.
  18. */
  19. close: (e: PointerEvent_2<HTMLElement>) => void;
  20. /**
  21. * Toggle on / off the `click` event listener.
  22. *
  23. * @param add when `true`, event listener is added
  24. */
  25. _toggleEventListeners: (add?: boolean) => void;
  26. /** Remove the component from target element. */
  27. dispose(): void;
  28. }
  29. /** Returns a new `BaseComponent` instance. */
  30. declare class BaseComponent {
  31. element: Element;
  32. options?: BaseOptions;
  33. /**
  34. * @param target `Element` or selector string
  35. * @param config component instance options
  36. */
  37. constructor(target: Element | string, config?: BaseOptions);
  38. get version(): string;
  39. get name(): string;
  40. get defaults(): {};
  41. /** just to have something to extend from */
  42. _toggleEventListeners: () => void;
  43. /** Removes component from target element. */
  44. dispose(): void;
  45. }
  46. declare interface BaseOptions {
  47. [key: string]: unknown;
  48. }
  49. /** Creates a new `Button` instance. */
  50. export declare class Button extends BaseComponent {
  51. static selector: string;
  52. static init: (element: Element) => Button;
  53. static getInstance: (element: Element) => Button | null;
  54. isActive: boolean;
  55. element: HTMLElement;
  56. /**
  57. * @param target usually a `.btn` element
  58. */
  59. constructor(target: Element | string);
  60. /**
  61. * Returns component name string.
  62. */
  63. get name(): string;
  64. /**
  65. * Toggles the state of the target button.
  66. *
  67. * @param e usually `click` Event object
  68. */
  69. toggle: (e?: PointerEvent_2<HTMLElement>) => void;
  70. /**
  71. * Toggles on/off the `click` event listener.
  72. *
  73. * @param add when `true`, event listener is added
  74. */
  75. _toggleEventListeners: (add?: boolean) => void;
  76. /** Removes the `Button` component from the target element. */
  77. dispose(): void;
  78. }
  79. /** Creates a new `Carousel` instance. */
  80. export declare class Carousel extends BaseComponent {
  81. static selector: string;
  82. static init: (element: Element) => Carousel;
  83. static getInstance: (element: Element) => Carousel | null;
  84. element: HTMLElement;
  85. options: CarouselOptions;
  86. direction: "right" | "left";
  87. index: number;
  88. isTouch: boolean;
  89. slides: HTMLCollectionOf<HTMLElement>;
  90. controls: HTMLElement[];
  91. indicator: HTMLElement | null;
  92. indicators: HTMLElement[];
  93. /**
  94. * @param target mostly a `.carousel` element
  95. * @param config instance options
  96. */
  97. constructor(target: Element | string, config?: Partial<CarouselOptions>);
  98. /**
  99. * Returns component name string.
  100. */
  101. get name(): string;
  102. /**
  103. * Returns component default options.
  104. */
  105. get defaults(): CarouselOptions;
  106. /**
  107. * Check if instance is paused.
  108. */
  109. get isPaused(): boolean;
  110. /**
  111. * Check if instance is animating.
  112. */
  113. get isAnimating(): boolean;
  114. /** Slide automatically through items. */
  115. cycle(): void;
  116. /** Pause the automatic cycle. */
  117. pause(): void;
  118. /** Slide to the next item. */
  119. next(): void;
  120. /** Slide to the previous item. */
  121. prev(): void;
  122. /**
  123. * Jump to the item with the `idx` index.
  124. *
  125. * @param idx the index of the item to jump to
  126. */
  127. to(idx: number): void;
  128. /**
  129. * Toggles all event listeners for the `Carousel` instance.
  130. *
  131. * @param add when `TRUE` event listeners are added
  132. */
  133. _toggleEventListeners: (add?: boolean) => void;
  134. /** Remove `Carousel` component from target. */
  135. dispose(): void;
  136. }
  137. declare interface CarouselOptions extends BaseOptions {
  138. pause: boolean | "hover";
  139. keyboard: boolean;
  140. touch: boolean;
  141. interval: number | boolean;
  142. }
  143. /** Returns a new `Colapse` instance. */
  144. export declare class Collapse extends BaseComponent {
  145. static selector: string;
  146. static init: (element: Element) => Collapse;
  147. static getInstance: (element: Element) => Collapse | null;
  148. element: HTMLElement;
  149. options: CollapseOptions;
  150. parent: Element | null;
  151. triggers: Element[];
  152. /**
  153. * @param target and `Element` that matches the selector
  154. * @param config instance options
  155. */
  156. constructor(target: Element | string, config?: Partial<CollapseOptions>);
  157. /**
  158. * Returns component name string.
  159. */
  160. get name(): string;
  161. /**
  162. * Returns component default options.
  163. */
  164. get defaults(): {
  165. parent: null;
  166. };
  167. /** Hides the collapse. */
  168. hide(): void;
  169. /** Shows the collapse. */
  170. show(): void;
  171. /** Toggles the visibility of the collapse. */
  172. toggle(): void;
  173. /**
  174. * Toggles on/off the event listener(s) of the `Collapse` instance.
  175. *
  176. * @param add when `true`, the event listener is added
  177. */
  178. _toggleEventListeners: (add?: boolean) => void;
  179. /** Remove the `Collapse` component from the target `Element`. */
  180. dispose(): void;
  181. }
  182. declare interface CollapseOptions extends BaseOptions {
  183. parent: string | HTMLElement | null;
  184. }
  185. /** Returns a new Dropdown instance. */
  186. export declare class Dropdown extends BaseComponent {
  187. static selector: string;
  188. static init: (element: Element) => Dropdown;
  189. static getInstance: (element: Element) => Dropdown | null;
  190. element: HTMLElement;
  191. options: DropdownOptions;
  192. open: boolean;
  193. parentElement: HTMLElement;
  194. menu: HTMLElement;
  195. _observer: default_2;
  196. /**
  197. * @param target Element or string selector
  198. * @param config the instance options
  199. */
  200. constructor(target: Element | string, config?: Partial<DropdownOptions>);
  201. /**
  202. * Returns component name string.
  203. */
  204. get name(): string;
  205. /**
  206. * Returns component default options.
  207. */
  208. get defaults(): {
  209. offset: number;
  210. display: string;
  211. };
  212. /** Shows/hides the dropdown menu to the user. */
  213. toggle(): void;
  214. /** Shows the dropdown menu to the user. */
  215. show(): void;
  216. /** Hides the dropdown menu from the user. */
  217. hide(): void;
  218. /**
  219. * Toggles on/off the `click` event listener of the `Dropdown`.
  220. *
  221. * @param add when `true`, it will add the event listener
  222. */
  223. _toggleEventListeners: (add?: boolean) => void;
  224. /** Removes the `Dropdown` component from the target element. */
  225. dispose(): void;
  226. }
  227. declare interface DropdownOptions extends BaseOptions {
  228. offset: number;
  229. display: string | "dynamic" | "static";
  230. }
  231. /**
  232. * Initialize all BSN components for a target container.
  233. *
  234. * @param context parent `Node`
  235. */
  236. export declare const initCallback: (context?: ParentNode) => void;
  237. /** Returns a new `Modal` instance. */
  238. export declare class Modal extends BaseComponent {
  239. static selector: string;
  240. static init: (element: Element) => Modal;
  241. static getInstance: (element: Element) => Modal | null;
  242. element: HTMLElement;
  243. options: ModalOptions;
  244. modalDialog: HTMLElement;
  245. triggers: HTMLElement[];
  246. isStatic: boolean;
  247. hasFade: boolean;
  248. relatedTarget: EventTarget & HTMLElement | null;
  249. _observer: ResizeObserver;
  250. /**
  251. * @param target usually the `.modal` element
  252. * @param config instance options
  253. */
  254. constructor(target: Element | string, config?: Partial<ModalOptions>);
  255. /**
  256. * Returns component name string.
  257. */
  258. get name(): string;
  259. /**
  260. * Returns component default options.
  261. */
  262. get defaults(): {
  263. backdrop: boolean;
  264. keyboard: boolean;
  265. };
  266. /** Toggles the visibility of the modal. */
  267. toggle(): void;
  268. /** Shows the modal to the user. */
  269. show(): void;
  270. /** Hide the modal from the user. */
  271. hide(): void;
  272. /**
  273. * Updates the modal layout.
  274. */
  275. update: () => void;
  276. /**
  277. * Toggles on/off the `click` event listener of the `Modal` instance.
  278. *
  279. * @param add when `true`, event listener(s) is/are added
  280. */
  281. _toggleEventListeners: (add?: boolean) => void;
  282. /** Removes the `Modal` component from target element. */
  283. dispose(): void;
  284. }
  285. declare interface ModalOptions extends BaseOptions {
  286. backdrop: boolean | "static";
  287. keyboard: boolean;
  288. }
  289. /** Returns a new `Offcanvas` instance. */
  290. export declare class Offcanvas extends BaseComponent {
  291. static selector: string;
  292. static init: (element: Element) => Offcanvas;
  293. static getInstance: (element: Element) => Offcanvas | null;
  294. element: HTMLElement;
  295. options: OffcanvasOptions;
  296. triggers: HTMLElement[];
  297. relatedTarget: EventTarget & HTMLElement | undefined;
  298. /**
  299. * @param target usually an `.offcanvas` element
  300. * @param config instance options
  301. */
  302. constructor(target: Element | string, config?: Partial<OffcanvasOptions>);
  303. /**
  304. * Returns component name string.
  305. */
  306. get name(): string;
  307. /**
  308. * Returns component default options.
  309. */
  310. get defaults(): {
  311. backdrop: boolean;
  312. keyboard: boolean;
  313. scroll: boolean;
  314. };
  315. /** Shows or hides the offcanvas from the user. */
  316. toggle(): void;
  317. /** Shows the offcanvas to the user. */
  318. show(): void;
  319. /** Hides the offcanvas from the user. */
  320. hide(): void;
  321. /**
  322. * Toggles on/off the `click` event listeners.
  323. *
  324. * @param self the `Offcanvas` instance
  325. * @param add when *true*, listeners are added
  326. */
  327. _toggleEventListeners: (add?: boolean) => void;
  328. /** Removes the `Offcanvas` from the target element. */
  329. dispose(): void;
  330. }
  331. declare interface OffcanvasOptions extends BaseOptions {
  332. backdrop: boolean | "static";
  333. keyboard: boolean;
  334. }
  335. /** Returns a new `Popover` instance. */
  336. export declare class Popover extends Tooltip {
  337. static selector: string;
  338. static init: (element: Element) => Popover;
  339. static getInstance: (element: Element) => Popover | null;
  340. static styleTip: (self: Tooltip) => void;
  341. options: PopoverOptions;
  342. /**
  343. * @param target the target element
  344. * @param config the instance options
  345. */
  346. constructor(target: Element | string, config?: Partial<PopoverOptions>);
  347. /**
  348. * Returns component name string.
  349. */
  350. get name(): string;
  351. /**
  352. * Returns component default options.
  353. */
  354. get defaults(): PopoverOptions;
  355. show: () => void;
  356. }
  357. declare interface PopoverOptions extends TooltipOptions {
  358. title: string | HTMLElement;
  359. content: string | HTMLElement;
  360. btnClose: string | HTMLElement;
  361. dismissible: boolean;
  362. }
  363. /**
  364. * Remove all BSN components for a target container.
  365. *
  366. * @param context parent `Node`
  367. */
  368. export declare const removeDataAPI: (context?: ParentNode) => void;
  369. /** Returns a new `ScrollSpy` instance. */
  370. export declare class ScrollSpy extends BaseComponent {
  371. static selector: string;
  372. static init: (element: Element) => ScrollSpy;
  373. static getInstance: (element: Element) => ScrollSpy | null;
  374. element: HTMLElement;
  375. options: ScrollSpyOptions;
  376. target: HTMLElement;
  377. scrollTarget: HTMLElement;
  378. _itemsLength: number;
  379. _activeItem: HTMLElement | null;
  380. _observables: Map<HTMLElement, HTMLElement>;
  381. _observer: default_2;
  382. /**
  383. * @param target the target element
  384. * @param config the instance options
  385. */
  386. constructor(target: Element | string, config?: Partial<ScrollSpyOptions>);
  387. /**
  388. * Returns component name string.
  389. */
  390. get name(): string;
  391. /**
  392. * Returns component default options.
  393. */
  394. get defaults(): Partial<ScrollSpyOptions>;
  395. /** Updates all items. */
  396. refresh: () => void;
  397. /**
  398. * This method provides an event handle
  399. * for scrollspy
  400. * @param e the event listener object
  401. */
  402. _scrollTo: (e: MouseEvent_2<HTMLAnchorElement>) => void;
  403. /**
  404. * Toggles on/off the component observer.
  405. *
  406. * @param self the ScrollSpy instance
  407. * @param add when `true`, listener is added
  408. */
  409. _toggleEventListeners: (add?: boolean) => void;
  410. /** Removes `ScrollSpy` from the target element. */
  411. dispose(): void;
  412. }
  413. declare interface ScrollSpyOptions extends BaseOptions {
  414. offset: number;
  415. target: HTMLElement | string;
  416. threshold: number | number[];
  417. rootMargin: string;
  418. }
  419. /** Creates a new `Tab` instance. */
  420. export declare class Tab extends BaseComponent {
  421. static selector: string;
  422. static init: (element: Element) => Tab;
  423. static getInstance: (element: Element) => Tab | null;
  424. element: HTMLElement;
  425. nav: HTMLElement | null;
  426. content: HTMLElement | null;
  427. tabContent: HTMLElement | null;
  428. nextContent: HTMLElement | null;
  429. dropdown: HTMLElement | null;
  430. /** @param target the target element */
  431. constructor(target: Element | string);
  432. /**
  433. * Returns component name string.
  434. */
  435. get name(): string;
  436. /** Shows the tab to the user. */
  437. show(): void;
  438. /**
  439. * Toggles on/off the `click` event listener.
  440. *
  441. * @param add when `true`, event listener is added
  442. */
  443. _toggleEventListeners: (add?: boolean) => void;
  444. /** Removes the `Tab` component from the target element. */
  445. dispose(): void;
  446. }
  447. /** Creates a new `Toast` instance. */
  448. export declare class Toast extends BaseComponent {
  449. static selector: string;
  450. static init: (element: Element) => Toast;
  451. static getInstance: (element: Element) => Toast | null;
  452. element: HTMLElement;
  453. options: ToastOptions;
  454. dismiss: HTMLElement | null;
  455. triggers: HTMLElement[];
  456. relatedTarget: HTMLElement | null;
  457. /**
  458. * @param target the target `.toast` element
  459. * @param config the instance options
  460. */
  461. constructor(target: Element | string, config?: Partial<ToastOptions>);
  462. /**
  463. * Returns component name string.
  464. */
  465. get name(): string;
  466. /**
  467. * Returns component default options.
  468. */
  469. get defaults(): {
  470. animation: boolean;
  471. autohide: boolean;
  472. delay: number;
  473. };
  474. /**
  475. * Returns *true* when toast is visible.
  476. */
  477. get isShown(): boolean;
  478. /** Shows the toast. */
  479. show: () => void;
  480. /** Hides the toast. */
  481. hide: () => void;
  482. /**
  483. * Toggles on/off the `click` event listener.
  484. *
  485. * @param add when `true`, it will add the listener
  486. */
  487. _toggleEventListeners: (add?: boolean) => void;
  488. /** Removes the `Toast` component from the target element. */
  489. dispose(): void;
  490. }
  491. declare interface ToastOptions extends BaseOptions {
  492. animation: boolean;
  493. autohide: boolean;
  494. delay: number;
  495. }
  496. /** Creates a new `Tooltip` instance. */
  497. export declare class Tooltip extends BaseComponent {
  498. static selector: string;
  499. static init: (element: Element) => Tooltip;
  500. static getInstance: (element: Element) => Tooltip | null;
  501. static styleTip: (self: Tooltip) => void;
  502. element: Element & HTMLOrSVGElement;
  503. options: TooltipOptions;
  504. btn?: HTMLElement;
  505. tooltip: HTMLElement;
  506. container: HTMLElement;
  507. offsetParent: Element | Window;
  508. arrow: HTMLElement;
  509. enabled: boolean;
  510. id: string;
  511. _observer: default_2;
  512. /**
  513. * @param target the target element
  514. * @param config the instance options
  515. */
  516. constructor(target: Element | string, config?: Partial<TooltipOptions>);
  517. /**
  518. * Returns component name string.
  519. */
  520. get name(): string;
  521. /**
  522. * Returns component default options.
  523. */
  524. get defaults(): TooltipOptions;
  525. /** Handles the focus event on iOS. */
  526. handleFocus: () => void;
  527. /** Shows the tooltip. */
  528. handleShow: () => void;
  529. show(): void;
  530. /** Hides the tooltip. */
  531. handleHide: () => void;
  532. hide(): void;
  533. /** Updates the tooltip position. */
  534. update: () => void;
  535. /** Toggles the tooltip visibility. */
  536. toggle: () => void;
  537. /** Enables the tooltip. */
  538. enable(): void;
  539. /** Disables the tooltip. */
  540. disable(): void;
  541. /** Toggles the `disabled` property. */
  542. toggleEnabled(): void;
  543. /**
  544. * Handles the `touchstart` event listener for `Tooltip`
  545. *
  546. * @this {Tooltip}
  547. * @param {TouchEvent} e the `Event` object
  548. */
  549. handleTouch: ({ target }: TouchEvent_2) => void;
  550. /**
  551. * Toggles on/off the `Tooltip` event listeners.
  552. *
  553. * @param add when `true`, event listeners are added
  554. */
  555. _toggleEventListeners: (add?: boolean) => void;
  556. /** Removes the `Tooltip` from the target element. */
  557. dispose(): void;
  558. }
  559. declare interface TooltipOptions extends BaseOptions {
  560. template: string | HTMLElement;
  561. title: string | HTMLElement;
  562. customClass: string;
  563. trigger: string;
  564. placement: "top" | "bottom" | "left" | "right";
  565. sanitizeFn?: (str: string) => string;
  566. animation: boolean;
  567. delay: number;
  568. content: string | HTMLElement;
  569. dismissible: boolean;
  570. btnClose: string | HTMLElement;
  571. }
  572. export { }