@ckeditor/ckeditor5-ui 41.4.2 → 42.0.0-alpha.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.
Files changed (48) hide show
  1. package/README.md +7 -1
  2. package/ckeditor5-metadata.json +1 -1
  3. package/dist/index.js +10016 -8366
  4. package/dist/index.js.map +1 -1
  5. package/dist/types/colorselector/documentcolorcollection.d.ts +1 -1
  6. package/dist/types/dialog/dialogview.d.ts +1 -1
  7. package/dist/types/editorui/accessibilityhelp/accessibilityhelp.d.ts +1 -1
  8. package/dist/types/editorui/editorui.d.ts +1 -1
  9. package/dist/types/editorui/poweredby.d.ts +1 -1
  10. package/dist/types/focuscycler.d.ts +1 -1
  11. package/dist/types/menubar/utils.d.ts +3 -1
  12. package/dist/types/model.d.ts +1 -1
  13. package/dist/types/panel/balloon/balloonpanelview.d.ts +27 -27
  14. package/dist/types/template.d.ts +1 -1
  15. package/dist/types/tooltipmanager.d.ts +1 -1
  16. package/dist/types/view.d.ts +1 -1
  17. package/package.json +3 -3
  18. package/src/colorselector/colorgridsfragmentview.js +2 -3
  19. package/src/colorselector/documentcolorcollection.d.ts +1 -1
  20. package/src/colorselector/documentcolorcollection.js +1 -1
  21. package/src/dialog/dialogview.d.ts +1 -1
  22. package/src/dialog/dialogview.js +2 -2
  23. package/src/editorui/accessibilityhelp/accessibilityhelp.d.ts +1 -1
  24. package/src/editorui/accessibilityhelp/accessibilityhelp.js +3 -1
  25. package/src/editorui/editorui.d.ts +1 -1
  26. package/src/editorui/editorui.js +1 -1
  27. package/src/editorui/poweredby.d.ts +1 -1
  28. package/src/editorui/poweredby.js +1 -1
  29. package/src/focuscycler.d.ts +1 -1
  30. package/src/focuscycler.js +1 -1
  31. package/src/menubar/utils.d.ts +3 -1
  32. package/src/menubar/utils.js +6 -2
  33. package/src/model.d.ts +1 -1
  34. package/src/model.js +1 -1
  35. package/src/panel/balloon/balloonpanelview.d.ts +27 -27
  36. package/src/panel/balloon/balloonpanelview.js +268 -269
  37. package/src/panel/balloon/contextualballoon.js +1 -1
  38. package/src/panel/sticky/stickypanelview.js +1 -1
  39. package/src/template.d.ts +1 -1
  40. package/src/template.js +1 -1
  41. package/src/toolbar/balloon/balloontoolbar.js +3 -3
  42. package/src/toolbar/block/blockbuttonview.js +1 -1
  43. package/src/toolbar/block/blocktoolbar.js +1 -1
  44. package/src/toolbar/toolbarview.js +2 -2
  45. package/src/tooltipmanager.d.ts +1 -1
  46. package/src/tooltipmanager.js +19 -7
  47. package/src/view.d.ts +1 -1
  48. package/src/view.js +1 -1
@@ -9,8 +9,7 @@ import View from '../../view.js';
9
9
  import { getOptimalPosition, global, isRange, toUnit } from '@ckeditor/ckeditor5-utils';
10
10
  import { isElement } from 'lodash-es';
11
11
  import '../../../theme/components/panel/balloonpanel.css';
12
- const toPx = toUnit('px');
13
- const defaultLimiterElement = global.document.body;
12
+ const toPx = /* #__PURE__ */ toUnit('px');
14
13
  // A static balloon panel positioning function that moves the balloon far off the viewport.
15
14
  // It is used as a fallback when there is no way to position the balloon using provided
16
15
  // positioning functions (see: `getOptimalPosition()`), for instance, when the target the
@@ -166,7 +165,7 @@ class BalloonPanelView extends View {
166
165
  defaultPositions.northArrowSouthEast,
167
166
  defaultPositions.viewportStickyNorth
168
167
  ],
169
- limiter: defaultLimiterElement,
168
+ limiter: global.document.body,
170
169
  fitInViewport: true
171
170
  }, options);
172
171
  const optimalPosition = BalloonPanelView._getOptimalPosition(positionOptions) || POSITION_OFF_SCREEN;
@@ -254,7 +253,7 @@ class BalloonPanelView extends View {
254
253
  _startPinning(options) {
255
254
  this.attachTo(options);
256
255
  const targetElement = getDomElement(options.target);
257
- const limiterElement = options.limiter ? getDomElement(options.limiter) : defaultLimiterElement;
256
+ const limiterElement = options.limiter ? getDomElement(options.limiter) : global.document.body;
258
257
  // Then we need to listen on scroll event of eny element in the document.
259
258
  this.listenTo(global.document, 'scroll', (evt, domEvt) => {
260
259
  const scrollTarget = domEvt.target;
@@ -280,6 +279,269 @@ class BalloonPanelView extends View {
280
279
  this.stopListening(global.document, 'scroll');
281
280
  this.stopListening(global.window, 'resize');
282
281
  }
282
+ /**
283
+ * Returns available {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView}
284
+ * {@link module:utils/dom/position~PositioningFunction positioning functions} adjusted by the specific offsets.
285
+ *
286
+ * @internal
287
+ * @param options Options to generate positions. If not specified, this helper will simply return
288
+ * {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView.defaultPositions}.
289
+ * @param options.sideOffset A custom side offset (in pixels) of each position. If
290
+ * not specified, {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView.arrowSideOffset the default value}
291
+ * will be used.
292
+ * @param options.heightOffset A custom height offset (in pixels) of each position. If
293
+ * not specified, {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView.arrowHeightOffset the default value}
294
+ * will be used.
295
+ * @param options.stickyVerticalOffset A custom offset (in pixels) of the `viewportStickyNorth` positioning function.
296
+ * If not specified, {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView.stickyVerticalOffset the default value}
297
+ * will be used.
298
+ * @param options.config Additional configuration of the balloon balloon panel view.
299
+ * Currently only {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView#withArrow} is supported. Learn more
300
+ * about {@link module:utils/dom/position~PositioningFunction positioning functions}.
301
+ */
302
+ static generatePositions(options = {}) {
303
+ const { sideOffset = BalloonPanelView.arrowSideOffset, heightOffset = BalloonPanelView.arrowHeightOffset, stickyVerticalOffset = BalloonPanelView.stickyVerticalOffset, config } = options;
304
+ return {
305
+ // ------- North west
306
+ northWestArrowSouthWest: (targetRect, balloonRect) => ({
307
+ top: getNorthTop(targetRect, balloonRect),
308
+ left: targetRect.left - sideOffset,
309
+ name: 'arrow_sw',
310
+ ...(config && { config })
311
+ }),
312
+ northWestArrowSouthMiddleWest: (targetRect, balloonRect) => ({
313
+ top: getNorthTop(targetRect, balloonRect),
314
+ left: targetRect.left - (balloonRect.width * .25) - sideOffset,
315
+ name: 'arrow_smw',
316
+ ...(config && { config })
317
+ }),
318
+ northWestArrowSouth: (targetRect, balloonRect) => ({
319
+ top: getNorthTop(targetRect, balloonRect),
320
+ left: targetRect.left - balloonRect.width / 2,
321
+ name: 'arrow_s',
322
+ ...(config && { config })
323
+ }),
324
+ northWestArrowSouthMiddleEast: (targetRect, balloonRect) => ({
325
+ top: getNorthTop(targetRect, balloonRect),
326
+ left: targetRect.left - (balloonRect.width * .75) + sideOffset,
327
+ name: 'arrow_sme',
328
+ ...(config && { config })
329
+ }),
330
+ northWestArrowSouthEast: (targetRect, balloonRect) => ({
331
+ top: getNorthTop(targetRect, balloonRect),
332
+ left: targetRect.left - balloonRect.width + sideOffset,
333
+ name: 'arrow_se',
334
+ ...(config && { config })
335
+ }),
336
+ // ------- North
337
+ northArrowSouthWest: (targetRect, balloonRect) => ({
338
+ top: getNorthTop(targetRect, balloonRect),
339
+ left: targetRect.left + targetRect.width / 2 - sideOffset,
340
+ name: 'arrow_sw',
341
+ ...(config && { config })
342
+ }),
343
+ northArrowSouthMiddleWest: (targetRect, balloonRect) => ({
344
+ top: getNorthTop(targetRect, balloonRect),
345
+ left: targetRect.left + targetRect.width / 2 - (balloonRect.width * .25) - sideOffset,
346
+ name: 'arrow_smw',
347
+ ...(config && { config })
348
+ }),
349
+ northArrowSouth: (targetRect, balloonRect) => ({
350
+ top: getNorthTop(targetRect, balloonRect),
351
+ left: targetRect.left + targetRect.width / 2 - balloonRect.width / 2,
352
+ name: 'arrow_s',
353
+ ...(config && { config })
354
+ }),
355
+ northArrowSouthMiddleEast: (targetRect, balloonRect) => ({
356
+ top: getNorthTop(targetRect, balloonRect),
357
+ left: targetRect.left + targetRect.width / 2 - (balloonRect.width * .75) + sideOffset,
358
+ name: 'arrow_sme',
359
+ ...(config && { config })
360
+ }),
361
+ northArrowSouthEast: (targetRect, balloonRect) => ({
362
+ top: getNorthTop(targetRect, balloonRect),
363
+ left: targetRect.left + targetRect.width / 2 - balloonRect.width + sideOffset,
364
+ name: 'arrow_se',
365
+ ...(config && { config })
366
+ }),
367
+ // ------- North east
368
+ northEastArrowSouthWest: (targetRect, balloonRect) => ({
369
+ top: getNorthTop(targetRect, balloonRect),
370
+ left: targetRect.right - sideOffset,
371
+ name: 'arrow_sw',
372
+ ...(config && { config })
373
+ }),
374
+ northEastArrowSouthMiddleWest: (targetRect, balloonRect) => ({
375
+ top: getNorthTop(targetRect, balloonRect),
376
+ left: targetRect.right - (balloonRect.width * .25) - sideOffset,
377
+ name: 'arrow_smw',
378
+ ...(config && { config })
379
+ }),
380
+ northEastArrowSouth: (targetRect, balloonRect) => ({
381
+ top: getNorthTop(targetRect, balloonRect),
382
+ left: targetRect.right - balloonRect.width / 2,
383
+ name: 'arrow_s',
384
+ ...(config && { config })
385
+ }),
386
+ northEastArrowSouthMiddleEast: (targetRect, balloonRect) => ({
387
+ top: getNorthTop(targetRect, balloonRect),
388
+ left: targetRect.right - (balloonRect.width * .75) + sideOffset,
389
+ name: 'arrow_sme',
390
+ ...(config && { config })
391
+ }),
392
+ northEastArrowSouthEast: (targetRect, balloonRect) => ({
393
+ top: getNorthTop(targetRect, balloonRect),
394
+ left: targetRect.right - balloonRect.width + sideOffset,
395
+ name: 'arrow_se',
396
+ ...(config && { config })
397
+ }),
398
+ // ------- South west
399
+ southWestArrowNorthWest: targetRect => ({
400
+ top: getSouthTop(targetRect),
401
+ left: targetRect.left - sideOffset,
402
+ name: 'arrow_nw',
403
+ ...(config && { config })
404
+ }),
405
+ southWestArrowNorthMiddleWest: (targetRect, balloonRect) => ({
406
+ top: getSouthTop(targetRect),
407
+ left: targetRect.left - (balloonRect.width * .25) - sideOffset,
408
+ name: 'arrow_nmw',
409
+ ...(config && { config })
410
+ }),
411
+ southWestArrowNorth: (targetRect, balloonRect) => ({
412
+ top: getSouthTop(targetRect),
413
+ left: targetRect.left - balloonRect.width / 2,
414
+ name: 'arrow_n',
415
+ ...(config && { config })
416
+ }),
417
+ southWestArrowNorthMiddleEast: (targetRect, balloonRect) => ({
418
+ top: getSouthTop(targetRect),
419
+ left: targetRect.left - (balloonRect.width * .75) + sideOffset,
420
+ name: 'arrow_nme',
421
+ ...(config && { config })
422
+ }),
423
+ southWestArrowNorthEast: (targetRect, balloonRect) => ({
424
+ top: getSouthTop(targetRect),
425
+ left: targetRect.left - balloonRect.width + sideOffset,
426
+ name: 'arrow_ne',
427
+ ...(config && { config })
428
+ }),
429
+ // ------- South
430
+ southArrowNorthWest: targetRect => ({
431
+ top: getSouthTop(targetRect),
432
+ left: targetRect.left + targetRect.width / 2 - sideOffset,
433
+ name: 'arrow_nw',
434
+ ...(config && { config })
435
+ }),
436
+ southArrowNorthMiddleWest: (targetRect, balloonRect) => ({
437
+ top: getSouthTop(targetRect),
438
+ left: targetRect.left + targetRect.width / 2 - (balloonRect.width * 0.25) - sideOffset,
439
+ name: 'arrow_nmw',
440
+ ...(config && { config })
441
+ }),
442
+ southArrowNorth: (targetRect, balloonRect) => ({
443
+ top: getSouthTop(targetRect),
444
+ left: targetRect.left + targetRect.width / 2 - balloonRect.width / 2,
445
+ name: 'arrow_n',
446
+ ...(config && { config })
447
+ }),
448
+ southArrowNorthMiddleEast: (targetRect, balloonRect) => ({
449
+ top: getSouthTop(targetRect),
450
+ left: targetRect.left + targetRect.width / 2 - (balloonRect.width * 0.75) + sideOffset,
451
+ name: 'arrow_nme',
452
+ ...(config && { config })
453
+ }),
454
+ southArrowNorthEast: (targetRect, balloonRect) => ({
455
+ top: getSouthTop(targetRect),
456
+ left: targetRect.left + targetRect.width / 2 - balloonRect.width + sideOffset,
457
+ name: 'arrow_ne',
458
+ ...(config && { config })
459
+ }),
460
+ // ------- South east
461
+ southEastArrowNorthWest: targetRect => ({
462
+ top: getSouthTop(targetRect),
463
+ left: targetRect.right - sideOffset,
464
+ name: 'arrow_nw',
465
+ ...(config && { config })
466
+ }),
467
+ southEastArrowNorthMiddleWest: (targetRect, balloonRect) => ({
468
+ top: getSouthTop(targetRect),
469
+ left: targetRect.right - (balloonRect.width * .25) - sideOffset,
470
+ name: 'arrow_nmw',
471
+ ...(config && { config })
472
+ }),
473
+ southEastArrowNorth: (targetRect, balloonRect) => ({
474
+ top: getSouthTop(targetRect),
475
+ left: targetRect.right - balloonRect.width / 2,
476
+ name: 'arrow_n',
477
+ ...(config && { config })
478
+ }),
479
+ southEastArrowNorthMiddleEast: (targetRect, balloonRect) => ({
480
+ top: getSouthTop(targetRect),
481
+ left: targetRect.right - (balloonRect.width * .75) + sideOffset,
482
+ name: 'arrow_nme',
483
+ ...(config && { config })
484
+ }),
485
+ southEastArrowNorthEast: (targetRect, balloonRect) => ({
486
+ top: getSouthTop(targetRect),
487
+ left: targetRect.right - balloonRect.width + sideOffset,
488
+ name: 'arrow_ne',
489
+ ...(config && { config })
490
+ }),
491
+ // ------- West
492
+ westArrowEast: (targetRect, balloonRect) => ({
493
+ top: targetRect.top + targetRect.height / 2 - balloonRect.height / 2,
494
+ left: targetRect.left - balloonRect.width - heightOffset,
495
+ name: 'arrow_e',
496
+ ...(config && { config })
497
+ }),
498
+ // ------- East
499
+ eastArrowWest: (targetRect, balloonRect) => ({
500
+ top: targetRect.top + targetRect.height / 2 - balloonRect.height / 2,
501
+ left: targetRect.right + heightOffset,
502
+ name: 'arrow_w',
503
+ ...(config && { config })
504
+ }),
505
+ // ------- Sticky
506
+ viewportStickyNorth: (targetRect, balloonRect, viewportRect, limiterRect) => {
507
+ const boundaryRect = limiterRect || viewportRect;
508
+ if (!targetRect.getIntersection(boundaryRect)) {
509
+ return null;
510
+ }
511
+ // Engage when the target top and bottom edges are close or off the boundary.
512
+ // By close, it means there's not enough space for the balloon arrow (offset).
513
+ if (boundaryRect.height - targetRect.height > stickyVerticalOffset) {
514
+ return null;
515
+ }
516
+ return {
517
+ top: boundaryRect.top + stickyVerticalOffset,
518
+ left: targetRect.left + targetRect.width / 2 - balloonRect.width / 2,
519
+ name: 'arrowless',
520
+ config: {
521
+ withArrow: false,
522
+ ...config
523
+ }
524
+ };
525
+ }
526
+ };
527
+ /**
528
+ * Returns the top coordinate for positions starting with `north*`.
529
+ *
530
+ * @param targetRect A rect of the target.
531
+ * @param balloonRect A rect of the balloon.
532
+ */
533
+ function getNorthTop(targetRect, balloonRect) {
534
+ return targetRect.top - balloonRect.height - heightOffset;
535
+ }
536
+ /**
537
+ * Returns the top coordinate for positions starting with `south*`.
538
+ *
539
+ * @param targetRect A rect of the target.
540
+ */
541
+ function getSouthTop(targetRect) {
542
+ return targetRect.bottom + heightOffset;
543
+ }
544
+ }
283
545
  }
284
546
  /**
285
547
  * A side offset of the arrow tip from the edge of the balloon. Controlled by CSS.
@@ -723,12 +985,12 @@ BalloonPanelView._getOptimalPosition = getOptimalPosition;
723
985
  * Positioning functions must be compatible with {@link module:utils/dom/position~DomPoint}.
724
986
  *
725
987
  * Default positioning functions with customized offsets can be generated using
726
- * {@link module:ui/panel/balloon/balloonpanelview~generatePositions}.
988
+ * {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView.generatePositions}.
727
989
  *
728
990
  * The name that the position function returns will be reflected in the balloon panel's class that
729
991
  * controls the placement of the "arrow". See {@link #position} to learn more.
730
992
  */
731
- BalloonPanelView.defaultPositions = generatePositions();
993
+ BalloonPanelView.defaultPositions = BalloonPanelView.generatePositions();
732
994
  export default BalloonPanelView;
733
995
  /**
734
996
  * Returns the DOM element for given object or null, if there is none,
@@ -746,266 +1008,3 @@ function getDomElement(object) {
746
1008
  }
747
1009
  return null;
748
1010
  }
749
- /**
750
- * Returns available {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView}
751
- * {@link module:utils/dom/position~PositioningFunction positioning functions} adjusted by the specific offsets.
752
- *
753
- * @internal
754
- * @param options Options to generate positions. If not specified, this helper will simply return
755
- * {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView.defaultPositions}.
756
- * @param options.sideOffset A custom side offset (in pixels) of each position. If
757
- * not specified, {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView.arrowSideOffset the default value}
758
- * will be used.
759
- * @param options.heightOffset A custom height offset (in pixels) of each position. If
760
- * not specified, {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView.arrowHeightOffset the default value}
761
- * will be used.
762
- * @param options.stickyVerticalOffset A custom offset (in pixels) of the `viewportStickyNorth` positioning function.
763
- * If not specified, {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView.stickyVerticalOffset the default value}
764
- * will be used.
765
- * @param options.config Additional configuration of the balloon balloon panel view.
766
- * Currently only {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView#withArrow} is supported. Learn more
767
- * about {@link module:utils/dom/position~PositioningFunction positioning functions}.
768
- */
769
- export function generatePositions(options = {}) {
770
- const { sideOffset = BalloonPanelView.arrowSideOffset, heightOffset = BalloonPanelView.arrowHeightOffset, stickyVerticalOffset = BalloonPanelView.stickyVerticalOffset, config } = options;
771
- return {
772
- // ------- North west
773
- northWestArrowSouthWest: (targetRect, balloonRect) => ({
774
- top: getNorthTop(targetRect, balloonRect),
775
- left: targetRect.left - sideOffset,
776
- name: 'arrow_sw',
777
- ...(config && { config })
778
- }),
779
- northWestArrowSouthMiddleWest: (targetRect, balloonRect) => ({
780
- top: getNorthTop(targetRect, balloonRect),
781
- left: targetRect.left - (balloonRect.width * .25) - sideOffset,
782
- name: 'arrow_smw',
783
- ...(config && { config })
784
- }),
785
- northWestArrowSouth: (targetRect, balloonRect) => ({
786
- top: getNorthTop(targetRect, balloonRect),
787
- left: targetRect.left - balloonRect.width / 2,
788
- name: 'arrow_s',
789
- ...(config && { config })
790
- }),
791
- northWestArrowSouthMiddleEast: (targetRect, balloonRect) => ({
792
- top: getNorthTop(targetRect, balloonRect),
793
- left: targetRect.left - (balloonRect.width * .75) + sideOffset,
794
- name: 'arrow_sme',
795
- ...(config && { config })
796
- }),
797
- northWestArrowSouthEast: (targetRect, balloonRect) => ({
798
- top: getNorthTop(targetRect, balloonRect),
799
- left: targetRect.left - balloonRect.width + sideOffset,
800
- name: 'arrow_se',
801
- ...(config && { config })
802
- }),
803
- // ------- North
804
- northArrowSouthWest: (targetRect, balloonRect) => ({
805
- top: getNorthTop(targetRect, balloonRect),
806
- left: targetRect.left + targetRect.width / 2 - sideOffset,
807
- name: 'arrow_sw',
808
- ...(config && { config })
809
- }),
810
- northArrowSouthMiddleWest: (targetRect, balloonRect) => ({
811
- top: getNorthTop(targetRect, balloonRect),
812
- left: targetRect.left + targetRect.width / 2 - (balloonRect.width * .25) - sideOffset,
813
- name: 'arrow_smw',
814
- ...(config && { config })
815
- }),
816
- northArrowSouth: (targetRect, balloonRect) => ({
817
- top: getNorthTop(targetRect, balloonRect),
818
- left: targetRect.left + targetRect.width / 2 - balloonRect.width / 2,
819
- name: 'arrow_s',
820
- ...(config && { config })
821
- }),
822
- northArrowSouthMiddleEast: (targetRect, balloonRect) => ({
823
- top: getNorthTop(targetRect, balloonRect),
824
- left: targetRect.left + targetRect.width / 2 - (balloonRect.width * .75) + sideOffset,
825
- name: 'arrow_sme',
826
- ...(config && { config })
827
- }),
828
- northArrowSouthEast: (targetRect, balloonRect) => ({
829
- top: getNorthTop(targetRect, balloonRect),
830
- left: targetRect.left + targetRect.width / 2 - balloonRect.width + sideOffset,
831
- name: 'arrow_se',
832
- ...(config && { config })
833
- }),
834
- // ------- North east
835
- northEastArrowSouthWest: (targetRect, balloonRect) => ({
836
- top: getNorthTop(targetRect, balloonRect),
837
- left: targetRect.right - sideOffset,
838
- name: 'arrow_sw',
839
- ...(config && { config })
840
- }),
841
- northEastArrowSouthMiddleWest: (targetRect, balloonRect) => ({
842
- top: getNorthTop(targetRect, balloonRect),
843
- left: targetRect.right - (balloonRect.width * .25) - sideOffset,
844
- name: 'arrow_smw',
845
- ...(config && { config })
846
- }),
847
- northEastArrowSouth: (targetRect, balloonRect) => ({
848
- top: getNorthTop(targetRect, balloonRect),
849
- left: targetRect.right - balloonRect.width / 2,
850
- name: 'arrow_s',
851
- ...(config && { config })
852
- }),
853
- northEastArrowSouthMiddleEast: (targetRect, balloonRect) => ({
854
- top: getNorthTop(targetRect, balloonRect),
855
- left: targetRect.right - (balloonRect.width * .75) + sideOffset,
856
- name: 'arrow_sme',
857
- ...(config && { config })
858
- }),
859
- northEastArrowSouthEast: (targetRect, balloonRect) => ({
860
- top: getNorthTop(targetRect, balloonRect),
861
- left: targetRect.right - balloonRect.width + sideOffset,
862
- name: 'arrow_se',
863
- ...(config && { config })
864
- }),
865
- // ------- South west
866
- southWestArrowNorthWest: targetRect => ({
867
- top: getSouthTop(targetRect),
868
- left: targetRect.left - sideOffset,
869
- name: 'arrow_nw',
870
- ...(config && { config })
871
- }),
872
- southWestArrowNorthMiddleWest: (targetRect, balloonRect) => ({
873
- top: getSouthTop(targetRect),
874
- left: targetRect.left - (balloonRect.width * .25) - sideOffset,
875
- name: 'arrow_nmw',
876
- ...(config && { config })
877
- }),
878
- southWestArrowNorth: (targetRect, balloonRect) => ({
879
- top: getSouthTop(targetRect),
880
- left: targetRect.left - balloonRect.width / 2,
881
- name: 'arrow_n',
882
- ...(config && { config })
883
- }),
884
- southWestArrowNorthMiddleEast: (targetRect, balloonRect) => ({
885
- top: getSouthTop(targetRect),
886
- left: targetRect.left - (balloonRect.width * .75) + sideOffset,
887
- name: 'arrow_nme',
888
- ...(config && { config })
889
- }),
890
- southWestArrowNorthEast: (targetRect, balloonRect) => ({
891
- top: getSouthTop(targetRect),
892
- left: targetRect.left - balloonRect.width + sideOffset,
893
- name: 'arrow_ne',
894
- ...(config && { config })
895
- }),
896
- // ------- South
897
- southArrowNorthWest: targetRect => ({
898
- top: getSouthTop(targetRect),
899
- left: targetRect.left + targetRect.width / 2 - sideOffset,
900
- name: 'arrow_nw',
901
- ...(config && { config })
902
- }),
903
- southArrowNorthMiddleWest: (targetRect, balloonRect) => ({
904
- top: getSouthTop(targetRect),
905
- left: targetRect.left + targetRect.width / 2 - (balloonRect.width * 0.25) - sideOffset,
906
- name: 'arrow_nmw',
907
- ...(config && { config })
908
- }),
909
- southArrowNorth: (targetRect, balloonRect) => ({
910
- top: getSouthTop(targetRect),
911
- left: targetRect.left + targetRect.width / 2 - balloonRect.width / 2,
912
- name: 'arrow_n',
913
- ...(config && { config })
914
- }),
915
- southArrowNorthMiddleEast: (targetRect, balloonRect) => ({
916
- top: getSouthTop(targetRect),
917
- left: targetRect.left + targetRect.width / 2 - (balloonRect.width * 0.75) + sideOffset,
918
- name: 'arrow_nme',
919
- ...(config && { config })
920
- }),
921
- southArrowNorthEast: (targetRect, balloonRect) => ({
922
- top: getSouthTop(targetRect),
923
- left: targetRect.left + targetRect.width / 2 - balloonRect.width + sideOffset,
924
- name: 'arrow_ne',
925
- ...(config && { config })
926
- }),
927
- // ------- South east
928
- southEastArrowNorthWest: targetRect => ({
929
- top: getSouthTop(targetRect),
930
- left: targetRect.right - sideOffset,
931
- name: 'arrow_nw',
932
- ...(config && { config })
933
- }),
934
- southEastArrowNorthMiddleWest: (targetRect, balloonRect) => ({
935
- top: getSouthTop(targetRect),
936
- left: targetRect.right - (balloonRect.width * .25) - sideOffset,
937
- name: 'arrow_nmw',
938
- ...(config && { config })
939
- }),
940
- southEastArrowNorth: (targetRect, balloonRect) => ({
941
- top: getSouthTop(targetRect),
942
- left: targetRect.right - balloonRect.width / 2,
943
- name: 'arrow_n',
944
- ...(config && { config })
945
- }),
946
- southEastArrowNorthMiddleEast: (targetRect, balloonRect) => ({
947
- top: getSouthTop(targetRect),
948
- left: targetRect.right - (balloonRect.width * .75) + sideOffset,
949
- name: 'arrow_nme',
950
- ...(config && { config })
951
- }),
952
- southEastArrowNorthEast: (targetRect, balloonRect) => ({
953
- top: getSouthTop(targetRect),
954
- left: targetRect.right - balloonRect.width + sideOffset,
955
- name: 'arrow_ne',
956
- ...(config && { config })
957
- }),
958
- // ------- West
959
- westArrowEast: (targetRect, balloonRect) => ({
960
- top: targetRect.top + targetRect.height / 2 - balloonRect.height / 2,
961
- left: targetRect.left - balloonRect.width - heightOffset,
962
- name: 'arrow_e',
963
- ...(config && { config })
964
- }),
965
- // ------- East
966
- eastArrowWest: (targetRect, balloonRect) => ({
967
- top: targetRect.top + targetRect.height / 2 - balloonRect.height / 2,
968
- left: targetRect.right + heightOffset,
969
- name: 'arrow_w',
970
- ...(config && { config })
971
- }),
972
- // ------- Sticky
973
- viewportStickyNorth: (targetRect, balloonRect, viewportRect, limiterRect) => {
974
- const boundaryRect = limiterRect || viewportRect;
975
- if (!targetRect.getIntersection(boundaryRect)) {
976
- return null;
977
- }
978
- // Engage when the target top and bottom edges are close or off the boundary.
979
- // By close, it means there's not enough space for the balloon arrow (offset).
980
- if (boundaryRect.height - targetRect.height > stickyVerticalOffset) {
981
- return null;
982
- }
983
- return {
984
- top: boundaryRect.top + stickyVerticalOffset,
985
- left: targetRect.left + targetRect.width / 2 - balloonRect.width / 2,
986
- name: 'arrowless',
987
- config: {
988
- withArrow: false,
989
- ...config
990
- }
991
- };
992
- }
993
- };
994
- /**
995
- * Returns the top coordinate for positions starting with `north*`.
996
- *
997
- * @param targetRect A rect of the target.
998
- * @param balloonRect A rect of the balloon.
999
- */
1000
- function getNorthTop(targetRect, balloonRect) {
1001
- return targetRect.top - balloonRect.height - heightOffset;
1002
- }
1003
- /**
1004
- * Returns the top coordinate for positions starting with `south*`.
1005
- *
1006
- * @param targetRect A rect of the target.
1007
- */
1008
- function getSouthTop(targetRect) {
1009
- return targetRect.bottom + heightOffset;
1010
- }
1011
- }
@@ -12,7 +12,7 @@ import { Plugin, icons } from '@ckeditor/ckeditor5-core';
12
12
  import { CKEditorError, FocusTracker, Rect, toUnit } from '@ckeditor/ckeditor5-utils';
13
13
  import '../../../theme/components/panel/balloonrotator.css';
14
14
  import '../../../theme/components/panel/fakepanel.css';
15
- const toPx = toUnit('px');
15
+ const toPx = /* #__PURE__ */ toUnit('px');
16
16
  /**
17
17
  * Provides the common contextual balloon for the editor.
18
18
  *
@@ -13,7 +13,7 @@ import { global, toUnit, Rect } from '@ckeditor/ckeditor5-utils';
13
13
  // @if CK_DEBUG_STICKYPANEL // diagonalStylesBlack
14
14
  // @if CK_DEBUG_STICKYPANEL // } = require( '@ckeditor/ckeditor5-utils/tests/_utils/rectdrawer' );
15
15
  import '../../../theme/components/panel/stickypanel.css';
16
- const toPx = toUnit('px');
16
+ const toPx = /* #__PURE__ */ toUnit('px');
17
17
  /**
18
18
  * The sticky panel view class.
19
19
  */
package/src/template.d.ts CHANGED
@@ -50,7 +50,7 @@ declare const Template_base: {
50
50
  * See {@link module:ui/template~TemplateDefinition} to know more about templates and complex
51
51
  * template definitions.
52
52
  */
53
- export default class Template extends Template_base {
53
+ export default class Template extends /* #__PURE__ */ Template_base {
54
54
  ns?: string;
55
55
  /**
56
56
  * The tag (`tagName`) of this template, e.g. `div`. It also indicates that the template
package/src/template.js CHANGED
@@ -49,7 +49,7 @@ const xhtmlNs = 'http://www.w3.org/1999/xhtml';
49
49
  * See {@link module:ui/template~TemplateDefinition} to know more about templates and complex
50
50
  * template definitions.
51
51
  */
52
- export default class Template extends EmitterMixin() {
52
+ export default class Template extends /* #__PURE__ */ EmitterMixin() {
53
53
  /**
54
54
  * Creates an instance of the {@link ~Template} class.
55
55
  *
@@ -7,12 +7,12 @@
7
7
  */
8
8
  import ContextualBalloon from '../../panel/balloon/contextualballoon.js';
9
9
  import ToolbarView from '../toolbarview.js';
10
- import BalloonPanelView, { generatePositions } from '../../panel/balloon/balloonpanelview.js';
10
+ import BalloonPanelView from '../../panel/balloon/balloonpanelview.js';
11
11
  import normalizeToolbarConfig from '../normalizetoolbarconfig.js';
12
12
  import { Plugin } from '@ckeditor/ckeditor5-core';
13
13
  import { FocusTracker, Rect, ResizeObserver, env, global, toUnit } from '@ckeditor/ckeditor5-utils';
14
14
  import { debounce } from 'lodash-es';
15
- const toPx = toUnit('px');
15
+ const toPx = /* #__PURE__ */ toUnit('px');
16
16
  /**
17
17
  * The contextual toolbar.
18
18
  *
@@ -251,7 +251,7 @@ export default class BalloonToolbar extends Plugin {
251
251
  _getBalloonPositions(isBackward) {
252
252
  const isSafariIniOS = env.isSafari && env.isiOS;
253
253
  // https://github.com/ckeditor/ckeditor5/issues/7707
254
- const positions = isSafariIniOS ? generatePositions({
254
+ const positions = isSafariIniOS ? BalloonPanelView.generatePositions({
255
255
  // 20px when zoomed out. Less then 20px when zoomed in; the "radius" of the native selection handle gets
256
256
  // smaller as the user zooms in. No less than the default v-offset, though.
257
257
  heightOffset: Math.max(BalloonPanelView.arrowHeightOffset, Math.round(20 / global.window.visualViewport.scale))
@@ -8,7 +8,7 @@
8
8
  import ButtonView from '../../button/buttonview.js';
9
9
  import { toUnit } from '@ckeditor/ckeditor5-utils';
10
10
  import '../../../theme/components/toolbar/blocktoolbar.css';
11
- const toPx = toUnit('px');
11
+ const toPx = /* #__PURE__ */ toUnit('px');
12
12
  /**
13
13
  * The block button view class.
14
14
  *
@@ -13,7 +13,7 @@ import BalloonPanelView from '../../panel/balloon/balloonpanelview.js';
13
13
  import ToolbarView, { NESTED_TOOLBAR_ICONS } from '../toolbarview.js';
14
14
  import clickOutsideHandler from '../../bindings/clickoutsidehandler.js';
15
15
  import normalizeToolbarConfig from '../normalizetoolbarconfig.js';
16
- const toPx = toUnit('px');
16
+ const toPx = /* #__PURE__ */ toUnit('px');
17
17
  /**
18
18
  * The block toolbar plugin.
19
19
  *