@pacem/pacem-ui 2.0.0-goldbach → 2.0.0-hadamard

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 (54) hide show
  1. package/dist/browser/pacem-ui.js +228 -145
  2. package/dist/browser/pacem-ui.js.map +1 -1
  3. package/dist/browser/pacem-ui.min.js +2 -2
  4. package/dist/bundle/pacem-ui.min.mjs +71 -71
  5. package/dist/bundle/pacem-ui.mjs +282 -226
  6. package/dist/bundle/pacem-ui.mjs.map +4 -4
  7. package/dist/docs/pacem-ui.json +171 -149
  8. package/dist/esm/adapter.js +1 -1
  9. package/dist/esm/anchor.js +1 -1
  10. package/dist/esm/balloon.js +94 -28
  11. package/dist/esm/binder.js +1 -1
  12. package/dist/esm/blade.js +1 -1
  13. package/dist/esm/bottom-sheet.js +1 -1
  14. package/dist/esm/button.js +4 -5
  15. package/dist/esm/buttonset.js +1 -1
  16. package/dist/esm/calendar.js +1 -1
  17. package/dist/esm/collapse.js +1 -1
  18. package/dist/esm/dialog-abstractions.js +17 -5
  19. package/dist/esm/dialog.js +1 -1
  20. package/dist/esm/divider.js +1 -1
  21. package/dist/esm/icon.js +1 -1
  22. package/dist/esm/image.js +1 -1
  23. package/dist/esm/index-components-ui.js +1 -1
  24. package/dist/esm/index-components.js +1 -1
  25. package/dist/esm/index-iife.js +1 -1
  26. package/dist/esm/index.js +1 -1
  27. package/dist/esm/infinite-scroller.js +1 -1
  28. package/dist/esm/iterative.js +1 -1
  29. package/dist/esm/lightbox-abstractions.js +1 -1
  30. package/dist/esm/lightbox.js +1 -1
  31. package/dist/esm/loader.js +1 -1
  32. package/dist/esm/markdown-svc.js +1 -1
  33. package/dist/esm/markdown.js +1 -1
  34. package/dist/esm/marquee.js +1 -1
  35. package/dist/esm/media-query.js +1 -1
  36. package/dist/esm/menu.js +1 -1
  37. package/dist/esm/pager.js +1 -1
  38. package/dist/esm/picture.js +1 -1
  39. package/dist/esm/progressbar.js +1 -1
  40. package/dist/esm/sidebar.js +1 -1
  41. package/dist/esm/slideshow.js +1 -1
  42. package/dist/esm/social-twitter.js +1 -1
  43. package/dist/esm/sticky-header.js +1 -1
  44. package/dist/esm/tabs.js +1 -1
  45. package/dist/esm/ticker.js +5 -2
  46. package/dist/esm/toast.js +1 -1
  47. package/dist/esm/toc.js +1 -1
  48. package/dist/esm/tuner.js +1 -1
  49. package/dist/esm/types.js +1 -1
  50. package/dist/esm/vibration.js +1 -1
  51. package/dist/esm/view.js +1 -1
  52. package/dist/esm/window.js +1 -1
  53. package/package.json +1 -1
  54. package/typings/index.d.ts +47 -10
@@ -503,6 +503,33 @@
503
503
  "endIndex": 0
504
504
  }
505
505
  },
506
+ {
507
+ "kind": "Variable",
508
+ "canonicalReference": "@pacem/pacem-ui!Components.UI.AVAILABLE_HEIGHT_VAR:var",
509
+ "docComment": "/**\n * CSS custom property a balloon publishes on itself when placed: the room left (px) on its side of the target, within the viewport, so that its contents can fit (e.g. `max-height: var(--pacem-balloon-available-height)` on a scrolling list). Updated whenever the balloon repositions (scroll, resize, when tracking).\n */\n",
510
+ "excerptTokens": [
511
+ {
512
+ "kind": "Content",
513
+ "text": "AVAILABLE_HEIGHT_VAR = "
514
+ },
515
+ {
516
+ "kind": "Content",
517
+ "text": "\"--pacem-balloon-available-height\""
518
+ }
519
+ ],
520
+ "fileUrlPath": "dist/types/balloon.d.ts",
521
+ "initializerTokenRange": {
522
+ "startIndex": 1,
523
+ "endIndex": 2
524
+ },
525
+ "isReadonly": true,
526
+ "releaseTag": "Public",
527
+ "name": "AVAILABLE_HEIGHT_VAR",
528
+ "variableTypeTokenRange": {
529
+ "startIndex": 0,
530
+ "endIndex": 0
531
+ }
532
+ },
506
533
  {
507
534
  "kind": "Enum",
508
535
  "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonAlignment:enum",
@@ -709,7 +736,7 @@
709
736
  {
710
737
  "kind": "Reference",
711
738
  "text": "BalloonPosition",
712
- "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonPosition:enum"
739
+ "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonPosition:type"
713
740
  },
714
741
  {
715
742
  "kind": "Content",
@@ -740,7 +767,16 @@
740
767
  },
741
768
  {
742
769
  "kind": "Content",
743
- "text": ";\n autoAdjust?: boolean;\n}"
770
+ "text": ";\n autoAdjust?: boolean;\n prefer?: "
771
+ },
772
+ {
773
+ "kind": "Reference",
774
+ "text": "BalloonPlacement",
775
+ "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonPlacement:type"
776
+ },
777
+ {
778
+ "kind": "Content",
779
+ "text": ";\n}"
744
780
  },
745
781
  {
746
782
  "kind": "Content",
@@ -752,7 +788,74 @@
752
788
  "name": "BalloonOptions",
753
789
  "typeTokenRange": {
754
790
  "startIndex": 1,
755
- "endIndex": 12
791
+ "endIndex": 14
792
+ }
793
+ },
794
+ {
795
+ "kind": "TypeAlias",
796
+ "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonPlacement:type",
797
+ "docComment": "/**\n * A side of `target` a {@link PacemBalloonElement} can sit on.\n */\n",
798
+ "excerptTokens": [
799
+ {
800
+ "kind": "Content",
801
+ "text": "export declare type BalloonPlacement = "
802
+ },
803
+ {
804
+ "kind": "Content",
805
+ "text": "typeof "
806
+ },
807
+ {
808
+ "kind": "Reference",
809
+ "text": "BalloonPlacement",
810
+ "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonPlacement:var"
811
+ },
812
+ {
813
+ "kind": "Content",
814
+ "text": "[keyof typeof "
815
+ },
816
+ {
817
+ "kind": "Reference",
818
+ "text": "BalloonPlacement",
819
+ "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonPlacement:var"
820
+ },
821
+ {
822
+ "kind": "Content",
823
+ "text": "]"
824
+ },
825
+ {
826
+ "kind": "Content",
827
+ "text": ";"
828
+ }
829
+ ],
830
+ "fileUrlPath": "dist/types/balloon.d.ts",
831
+ "releaseTag": "Public",
832
+ "name": "BalloonPlacement",
833
+ "typeTokenRange": {
834
+ "startIndex": 1,
835
+ "endIndex": 6
836
+ }
837
+ },
838
+ {
839
+ "kind": "Variable",
840
+ "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonPlacement:var",
841
+ "docComment": "/**\n * A side of `target` a {@link PacemBalloonElement} can sit on.\n */\n",
842
+ "excerptTokens": [
843
+ {
844
+ "kind": "Content",
845
+ "text": "BalloonPlacement: "
846
+ },
847
+ {
848
+ "kind": "Content",
849
+ "text": "{\n readonly Top: 'top';\n readonly Left: 'left';\n readonly Bottom: 'bottom';\n readonly Right: 'right';\n}"
850
+ }
851
+ ],
852
+ "fileUrlPath": "dist/types/balloon.d.ts",
853
+ "isReadonly": true,
854
+ "releaseTag": "Public",
855
+ "name": "BalloonPlacement",
856
+ "variableTypeTokenRange": {
857
+ "startIndex": 1,
858
+ "endIndex": 2
756
859
  }
757
860
  },
758
861
  {
@@ -810,168 +913,71 @@
810
913
  }
811
914
  },
812
915
  {
813
- "kind": "Enum",
814
- "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonPosition:enum",
916
+ "kind": "TypeAlias",
917
+ "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonPosition:type",
815
918
  "docComment": "/**\n * Side of `target` a {@link PacemBalloonElement} is anchored to (with automatic variants that pick the side with the most room).\n */\n",
816
919
  "excerptTokens": [
817
920
  {
818
921
  "kind": "Content",
819
- "text": "export declare enum BalloonPosition "
820
- }
821
- ],
822
- "fileUrlPath": "dist/types/balloon.d.ts",
823
- "releaseTag": "Public",
824
- "name": "BalloonPosition",
825
- "preserveMemberOrder": false,
826
- "members": [
922
+ "text": "export declare type BalloonPosition = "
923
+ },
827
924
  {
828
- "kind": "EnumMember",
829
- "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonPosition.Auto:member",
830
- "docComment": "",
831
- "excerptTokens": [
832
- {
833
- "kind": "Content",
834
- "text": "Auto = "
835
- },
836
- {
837
- "kind": "Content",
838
- "text": "\"auto\""
839
- }
840
- ],
841
- "initializerTokenRange": {
842
- "startIndex": 1,
843
- "endIndex": 2
844
- },
845
- "releaseTag": "Public",
846
- "name": "Auto"
925
+ "kind": "Content",
926
+ "text": "typeof "
847
927
  },
848
928
  {
849
- "kind": "EnumMember",
850
- "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonPosition.Bottom:member",
851
- "docComment": "",
852
- "excerptTokens": [
853
- {
854
- "kind": "Content",
855
- "text": "Bottom = "
856
- },
857
- {
858
- "kind": "Content",
859
- "text": "\"bottom\""
860
- }
861
- ],
862
- "initializerTokenRange": {
863
- "startIndex": 1,
864
- "endIndex": 2
865
- },
866
- "releaseTag": "Public",
867
- "name": "Bottom"
929
+ "kind": "Reference",
930
+ "text": "BalloonPosition",
931
+ "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonPosition:var"
868
932
  },
869
933
  {
870
- "kind": "EnumMember",
871
- "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonPosition.HorizontalAuto:member",
872
- "docComment": "",
873
- "excerptTokens": [
874
- {
875
- "kind": "Content",
876
- "text": "HorizontalAuto = "
877
- },
878
- {
879
- "kind": "Content",
880
- "text": "\"x\""
881
- }
882
- ],
883
- "initializerTokenRange": {
884
- "startIndex": 1,
885
- "endIndex": 2
886
- },
887
- "releaseTag": "Public",
888
- "name": "HorizontalAuto"
934
+ "kind": "Content",
935
+ "text": "[keyof typeof "
889
936
  },
890
937
  {
891
- "kind": "EnumMember",
892
- "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonPosition.Left:member",
893
- "docComment": "",
894
- "excerptTokens": [
895
- {
896
- "kind": "Content",
897
- "text": "Left = "
898
- },
899
- {
900
- "kind": "Content",
901
- "text": "\"left\""
902
- }
903
- ],
904
- "initializerTokenRange": {
905
- "startIndex": 1,
906
- "endIndex": 2
907
- },
908
- "releaseTag": "Public",
909
- "name": "Left"
938
+ "kind": "Reference",
939
+ "text": "BalloonPosition",
940
+ "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonPosition:var"
910
941
  },
911
942
  {
912
- "kind": "EnumMember",
913
- "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonPosition.Right:member",
914
- "docComment": "",
915
- "excerptTokens": [
916
- {
917
- "kind": "Content",
918
- "text": "Right = "
919
- },
920
- {
921
- "kind": "Content",
922
- "text": "\"right\""
923
- }
924
- ],
925
- "initializerTokenRange": {
926
- "startIndex": 1,
927
- "endIndex": 2
928
- },
929
- "releaseTag": "Public",
930
- "name": "Right"
943
+ "kind": "Content",
944
+ "text": "]"
931
945
  },
932
946
  {
933
- "kind": "EnumMember",
934
- "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonPosition.Top:member",
935
- "docComment": "",
936
- "excerptTokens": [
937
- {
938
- "kind": "Content",
939
- "text": "Top = "
940
- },
941
- {
942
- "kind": "Content",
943
- "text": "\"top\""
944
- }
945
- ],
946
- "initializerTokenRange": {
947
- "startIndex": 1,
948
- "endIndex": 2
949
- },
950
- "releaseTag": "Public",
951
- "name": "Top"
947
+ "kind": "Content",
948
+ "text": ";"
949
+ }
950
+ ],
951
+ "fileUrlPath": "dist/types/balloon.d.ts",
952
+ "releaseTag": "Public",
953
+ "name": "BalloonPosition",
954
+ "typeTokenRange": {
955
+ "startIndex": 1,
956
+ "endIndex": 6
957
+ }
958
+ },
959
+ {
960
+ "kind": "Variable",
961
+ "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonPosition:var",
962
+ "docComment": "/**\n * Side of `target` a {@link PacemBalloonElement} is anchored to (with automatic variants that pick the side with the most room).\n */\n",
963
+ "excerptTokens": [
964
+ {
965
+ "kind": "Content",
966
+ "text": "BalloonPosition: "
952
967
  },
953
968
  {
954
- "kind": "EnumMember",
955
- "canonicalReference": "@pacem/pacem-ui!Components.UI.BalloonPosition.VerticalAuto:member",
956
- "docComment": "",
957
- "excerptTokens": [
958
- {
959
- "kind": "Content",
960
- "text": "VerticalAuto = "
961
- },
962
- {
963
- "kind": "Content",
964
- "text": "\"y\""
965
- }
966
- ],
967
- "initializerTokenRange": {
968
- "startIndex": 1,
969
- "endIndex": 2
970
- },
971
- "releaseTag": "Public",
972
- "name": "VerticalAuto"
969
+ "kind": "Content",
970
+ "text": "{\n readonly Top: 'top';\n readonly Left: 'left';\n readonly Bottom: 'bottom';\n readonly Right: 'right';\n readonly Auto: 'auto';\n readonly HorizontalAuto: 'x';\n readonly VerticalAuto: 'y';\n}"
973
971
  }
974
- ]
972
+ ],
973
+ "fileUrlPath": "dist/types/balloon.d.ts",
974
+ "isReadonly": true,
975
+ "releaseTag": "Public",
976
+ "name": "BalloonPosition",
977
+ "variableTypeTokenRange": {
978
+ "startIndex": 1,
979
+ "endIndex": 2
980
+ }
975
981
  },
976
982
  {
977
983
  "kind": "Enum",
@@ -9923,6 +9929,14 @@
9923
9929
  "kind": "Content",
9924
9930
  "text": "any"
9925
9931
  },
9932
+ {
9933
+ "kind": "Content",
9934
+ "text": ", rejectOnDeny?: "
9935
+ },
9936
+ {
9937
+ "kind": "Content",
9938
+ "text": "boolean"
9939
+ },
9926
9940
  {
9927
9941
  "kind": "Content",
9928
9942
  "text": "): "
@@ -9952,8 +9966,8 @@
9952
9966
  ],
9953
9967
  "isStatic": false,
9954
9968
  "returnTypeTokenRange": {
9955
- "startIndex": 3,
9956
- "endIndex": 7
9969
+ "startIndex": 5,
9970
+ "endIndex": 9
9957
9971
  },
9958
9972
  "releaseTag": "Public",
9959
9973
  "isProtected": false,
@@ -9966,6 +9980,14 @@
9966
9980
  "endIndex": 2
9967
9981
  },
9968
9982
  "isOptional": true
9983
+ },
9984
+ {
9985
+ "parameterName": "rejectOnDeny",
9986
+ "parameterTypeTokenRange": {
9987
+ "startIndex": 3,
9988
+ "endIndex": 4
9989
+ },
9990
+ "isOptional": true
9969
9991
  }
9970
9992
  ],
9971
9993
  "isOptional": false,
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * @pacem/pacem-ui v2.0.0-goldbach (https://js.pacem.it)
2
+ * @pacem/pacem-ui v2.0.0-hadamard (https://js.pacem.it)
3
3
  * Pacem (https://pacem.it)
4
4
  * Licensed under Apache-2.0
5
5
  */
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * @pacem/pacem-ui v2.0.0-goldbach (https://js.pacem.it)
2
+ * @pacem/pacem-ui v2.0.0-hadamard (https://js.pacem.it)
3
3
  * Pacem (https://pacem.it)
4
4
  * Licensed under Apache-2.0
5
5
  */
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * @pacem/pacem-ui v2.0.0-goldbach (https://js.pacem.it)
2
+ * @pacem/pacem-ui v2.0.0-hadamard (https://js.pacem.it)
3
3
  * Pacem (https://pacem.it)
4
4
  * Licensed under Apache-2.0
5
5
  */
@@ -35,17 +35,24 @@ export var BalloonAlignment;
35
35
  BalloonAlignment["End"] = "end";
36
36
  BalloonAlignment["Auto"] = "auto";
37
37
  })(BalloonAlignment || (BalloonAlignment = {}));
38
+ /** A side of `target` a {@link PacemBalloonElement} can sit on. */
39
+ export const BalloonPlacement = {
40
+ Top: 'top',
41
+ Left: 'left',
42
+ Bottom: 'bottom',
43
+ Right: 'right',
44
+ };
45
+ /** The automatic placements of a {@link PacemBalloonElement}: the side with the most room, on both axes or on one. */
46
+ const BalloonPlacementOption = {
47
+ Auto: 'auto',
48
+ HorizontalAuto: 'x',
49
+ VerticalAuto: 'y'
50
+ };
38
51
  /** Side of `target` a {@link PacemBalloonElement} is anchored to (with automatic variants that pick the side with the most room). */
39
- export var BalloonPosition;
40
- (function (BalloonPosition) {
41
- BalloonPosition["Top"] = "top";
42
- BalloonPosition["Left"] = "left";
43
- BalloonPosition["Bottom"] = "bottom";
44
- BalloonPosition["Right"] = "right";
45
- BalloonPosition["Auto"] = "auto";
46
- BalloonPosition["HorizontalAuto"] = "x";
47
- BalloonPosition["VerticalAuto"] = "y";
48
- })(BalloonPosition || (BalloonPosition = {}));
52
+ export const BalloonPosition = {
53
+ ...BalloonPlacement,
54
+ ...BalloonPlacementOption
55
+ };
49
56
  /** Whether a {@link PacemBalloonElement} sizes itself freely or matches its `target`'s size along the anchored axis. */
50
57
  export var BalloonSizing;
51
58
  (function (BalloonSizing) {
@@ -70,9 +77,20 @@ const BalloonConsts = {
70
77
  'track': true
71
78
  }
72
79
  };
80
+ /**
81
+ * CSS custom property a balloon publishes on itself when placed: the room left (px) on its side of the target, within
82
+ * the viewport, so that its contents can fit (e.g. `max-height: var(--pacem-balloon-available-height)` on a scrolling
83
+ * list). Updated whenever the balloon repositions (scroll, resize, when tracking).
84
+ */
85
+ export const AVAILABLE_HEIGHT_VAR = '--pacem-balloon-available-height';
86
+ /** Breathing room (px) kept between a balloon and the viewport's edge when computing {@link AVAILABLE_HEIGHT_VAR}. */
87
+ const AVAILABLE_HEIGHT_GUTTER = 8;
73
88
  const positioningStyles = 'balloon-right balloon-left balloon-bottom balloon-top balloon-start balloon-center balloon-end';
74
89
  const allStyles = PCSS + '-balloon ' + positioningStyles + ' balloon-out balloon-in balloon-on';
75
90
  /** Positions its content as a floating popup (menu or tooltip) anchored to a `target` element or point; see {@link BalloonOptions}. */
91
+ // (the content's `<p-resize>` is `display: block` inline: in the shadow root the theme's `pacem-resize { display: block }`
92
+ // does not apply, and an inline element never reports a resize, i.e. the balloon would not reposition when its content
93
+ // grows or shrinks, e.g. a filtered list above its target)
76
94
  let PacemBalloonElement = class PacemBalloonElement extends Components.PacemElement {
77
95
  constructor() {
78
96
  super(...arguments);
@@ -268,6 +286,32 @@ let PacemBalloonElement = class PacemBalloonElement extends Components.PacemElem
268
286
  this._adjust();
269
287
  }
270
288
  }
289
+ /**
290
+ * The side {@link BalloonOptions.prefer} asks for, when the balloon fits there (its natural size, on that side of the
291
+ * target, within the viewport); `null` otherwise, or when nothing is preferred.
292
+ * @param room The room around the target, per side.
293
+ */
294
+ _preferredSide(opts, room) {
295
+ const prefer = opts.prefer;
296
+ if (Utils.isNull(prefer) || !(prefer in room)) {
297
+ return null;
298
+ }
299
+ const isVertical = prefer === BalloonPlacement.Top || prefer === BalloonPlacement.Bottom;
300
+ const size = isVertical ? this.offsetHeight : this.offsetWidth;
301
+ const fits = size + AVAILABLE_HEIGHT_GUTTER <= room[prefer];
302
+ return fits ? prefer : null;
303
+ }
304
+ /** The room left on a side of the target (the whole viewport height for a side that is not above or below). */
305
+ _availableHeight(position, offsetTop, offsetBottom, viewportHeight) {
306
+ switch (position) {
307
+ case BalloonPosition.Top:
308
+ return Math.max(offsetTop - AVAILABLE_HEIGHT_GUTTER, 0);
309
+ case BalloonPosition.Bottom:
310
+ return Math.max(offsetBottom - AVAILABLE_HEIGHT_GUTTER, 0);
311
+ default:
312
+ return viewportHeight;
313
+ }
314
+ }
271
315
  _adjust() {
272
316
  const popup = this, el = popup.target;
273
317
  if (Utils.isNull(el)) {
@@ -277,24 +321,39 @@ let PacemBalloonElement = class PacemBalloonElement extends Components.PacemElem
277
321
  const vieportSize = Utils.windowSize;
278
322
  var opts = this._options;
279
323
  var chosenPosition = opts.position, chosenAlignment = opts.align;
324
+ // room around the target, in the viewport
325
+ const viewportHeight = vieportSize.height;
326
+ const viewportWidth = vieportSize.width;
327
+ const offsetLeft = coords.left - Utils.scrollLeft;
328
+ const offsetTop = coords.top - Utils.scrollTop;
329
+ const offsetBottom = viewportHeight - (offsetTop + coords.height);
330
+ const offsetRight = viewportWidth - (offsetLeft + coords.width);
331
+ // (the natural size, uncapped: see AVAILABLE_HEIGHT_VAR below)
332
+ popup.style.removeProperty(AVAILABLE_HEIGHT_VAR);
280
333
  if (chosenPosition != BalloonPosition.Top &&
281
334
  chosenPosition != BalloonPosition.Bottom && chosenPosition != BalloonPosition.Left && chosenPosition != BalloonPosition.Right) {
282
- let viewportHeight = vieportSize.height;
283
- let viewportWidth = vieportSize.width;
284
- const offsetLeft = coords.left - Utils.scrollLeft;
285
- const offsetTop = coords.top - Utils.scrollTop;
286
- const offsetBottom = viewportHeight - (offsetTop + coords.height);
287
- const offsetRight = viewportWidth - (offsetLeft + coords.width);
288
- switch (chosenPosition) {
289
- case BalloonPosition.HorizontalAuto:
290
- chosenPosition = offsetLeft > offsetRight ? BalloonPosition.Left : BalloonPosition.Right;
291
- break;
292
- default:
293
- // (!) exclude 'left' and 'right' also when position is simply set to 'auto'
294
- chosenPosition = offsetTop > offsetBottom ? BalloonPosition.Top : BalloonPosition.Bottom;
295
- break;
335
+ // an automatic position: the preferred side wins, whenever the balloon fits there (on either axis)...
336
+ const room = { top: offsetTop, bottom: offsetBottom, left: offsetLeft, right: offsetRight };
337
+ const preferred = this._preferredSide(opts, room);
338
+ if (!Utils.isNull(preferred)) {
339
+ chosenPosition = preferred;
340
+ }
341
+ else {
342
+ // ...otherwise the larger side
343
+ switch (chosenPosition) {
344
+ case BalloonPosition.HorizontalAuto:
345
+ chosenPosition = offsetLeft > offsetRight ? BalloonPosition.Left : BalloonPosition.Right;
346
+ break;
347
+ default:
348
+ // (!) exclude 'left' and 'right' also when position is simply set to 'auto'
349
+ chosenPosition = offsetTop > offsetBottom ? BalloonPosition.Top : BalloonPosition.Bottom;
350
+ break;
351
+ }
296
352
  }
297
353
  }
354
+ // the room left on the chosen side, for contents that must fit in the viewport (e.g. a scrolling list)
355
+ const availableHeight = this._availableHeight(chosenPosition, offsetTop, offsetBottom, viewportHeight);
356
+ popup.style.setProperty(AVAILABLE_HEIGHT_VAR, `${availableHeight}px`);
298
357
  if (opts.size === BalloonSizing.Match) {
299
358
  switch (chosenPosition) {
300
359
  case BalloonPosition.Bottom:
@@ -462,11 +521,14 @@ let PacemBalloonElement = class PacemBalloonElement extends Components.PacemElem
462
521
  this._timer = setTimeout(() => this.popup(), delay);
463
522
  return;
464
523
  }
465
- const popup = this, isVisible = Utils.isVisible(popup);
524
+ const popup = this, isVisible = Utils.isVisible(popup),
525
+ // (popping out: still visible, but leaving; popping up again cancels that)
526
+ isLeaving = Utils.hasClass(popup, 'balloon-out');
466
527
  this._adjustWatchers(true);
467
- if (isVisible || this.disabled) {
528
+ if ((isVisible && !isLeaving) || this.disabled) {
468
529
  return;
469
530
  }
531
+ Utils.removeClass(popup, 'balloon-out');
470
532
  // attach closured behavior to popup
471
533
  //if (!sameTrigger) {
472
534
  this._registerEvents(); // $popup.on('mouseenter', obj.methods.hover).on('mouseleave', obj.methods.out).data(vars.TRIGGER, obj);
@@ -508,6 +570,10 @@ let PacemBalloonElement = class PacemBalloonElement extends Components.PacemElem
508
570
  Utils.removeClass(popup, 'balloon-in balloon-on');
509
571
  Utils.addClass(popup, 'balloon-out');
510
572
  Utils.addAnimationEndCallback(popup, () => {
573
+ // (popped up again meanwhile: stays)
574
+ if (!Utils.hasClass(popup, 'balloon-out')) {
575
+ return;
576
+ }
511
577
  popup.style.visibility = 'hidden';
512
578
  this._visible = false;
513
579
  Utils.removeClass(popup, allStyles);
@@ -592,7 +658,7 @@ PacemBalloonElement = __decorate([
592
658
  shadow: true,
593
659
  template: `<${P}-resize target="{{ :host.target }}" disabled="true" watch-position="true" on-${Components.ResizeEventName}=":host._onLayoutChange($event)"></${P}-resize>
594
660
  <div class="${PCSS}-balloon-face"></div>
595
- <div class="${PCSS}-balloon"><${P}-resize on-${Components.ResizeEventName}=":host._onLayoutChange($event)" disabled="true" content><slot></slot></${P}-resize></div>
661
+ <div class="${PCSS}-balloon"><${P}-resize on-${Components.ResizeEventName}=":host._onLayoutChange($event)" disabled="true" content style="display: block"><slot></slot></${P}-resize></div>
596
662
  <div class="corner top-left" part="corner-topleft"></div><div class="corner bottom-left" part="corner-bottomleft"></div><div class="corner top-right" part="corner-topright"></div><div class="corner bottom-right" part="corner-bottomright"></div>`
597
663
  })
598
664
  ], PacemBalloonElement);
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * @pacem/pacem-ui v2.0.0-goldbach (https://js.pacem.it)
2
+ * @pacem/pacem-ui v2.0.0-hadamard (https://js.pacem.it)
3
3
  * Pacem (https://pacem.it)
4
4
  * Licensed under Apache-2.0
5
5
  */
package/dist/esm/blade.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * @pacem/pacem-ui v2.0.0-goldbach (https://js.pacem.it)
2
+ * @pacem/pacem-ui v2.0.0-hadamard (https://js.pacem.it)
3
3
  * Pacem (https://pacem.it)
4
4
  * Licensed under Apache-2.0
5
5
  */
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * @pacem/pacem-ui v2.0.0-goldbach (https://js.pacem.it)
2
+ * @pacem/pacem-ui v2.0.0-hadamard (https://js.pacem.it)
3
3
  * Pacem (https://pacem.it)
4
4
  * Licensed under Apache-2.0
5
5
  */
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * @pacem/pacem-ui v2.0.0-goldbach (https://js.pacem.it)
2
+ * @pacem/pacem-ui v2.0.0-hadamard (https://js.pacem.it)
3
3
  * Pacem (https://pacem.it)
4
4
  * Licensed under Apache-2.0
5
5
  */
@@ -10,7 +10,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
10
10
  return c > 3 && r && Object.defineProperty(target, key, r), r;
11
11
  };
12
12
  import { P, PCSS, CustomElement, Watch, Utils, PropertyConverters, Components, CommandEvent } from '@pacem/pacem-core';
13
- import { DialogButton } from './dialog-abstractions';
14
13
  //namespace Pacem.Components.UI {
15
14
  /** Clickable button element with optional icon, command dispatching (via {@link CommandEvent}) and an optional confirmation dialog gate. */
16
15
  let PacemButtonElement = class PacemButtonElement extends Components.PacemIterableElement {
@@ -78,9 +77,9 @@ let PacemButtonElement = class PacemButtonElement extends Components.PacemIterab
78
77
  }
79
78
  };
80
79
  if (!this.disabled && evt.type === 'click' && !Utils.isNull(this.confirmationDialog)) {
81
- this.confirmationDialog.open(this.confirmationMessage).then(r => {
82
- if (r.button === DialogButton.Yes || r.button === DialogButton.Ok)
83
- fn(evt);
80
+ this.confirmationDialog.open(this.confirmationMessage, true).then(r => {
81
+ //if (r.button === DialogButton.Yes || r.button === DialogButton.Ok)
82
+ fn(evt);
84
83
  });
85
84
  }
86
85
  else if (!(evt instanceof MouseEvent) || evt.button === 0) {
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * @pacem/pacem-ui v2.0.0-goldbach (https://js.pacem.it)
2
+ * @pacem/pacem-ui v2.0.0-hadamard (https://js.pacem.it)
3
3
  * Pacem (https://pacem.it)
4
4
  * Licensed under Apache-2.0
5
5
  */