@milaboratories/uikit 2.10.26 → 2.10.28

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 (80) hide show
  1. package/.turbo/turbo-build.log +40 -41
  2. package/.turbo/turbo-formatter$colon$check.log +2 -2
  3. package/.turbo/turbo-linter$colon$check.log +2 -2
  4. package/.turbo/turbo-types$colon$check.log +1 -1
  5. package/CHANGELOG.md +12 -0
  6. package/dist/components/DataTable/TableComponent.vue.js +16 -17
  7. package/dist/components/DataTable/TableComponent.vue.js.map +1 -1
  8. package/dist/components/PlAccordion/ExpandTransition.vue3.js +2 -2
  9. package/dist/components/PlAccordion/PlAccordionSection.vue2.js +2 -2
  10. package/dist/components/PlAutocomplete/PlAutocomplete.vue.js +33 -33
  11. package/dist/components/PlAutocompleteMulti/PlAutocompleteMulti.vue.js +17 -17
  12. package/dist/components/PlBtnGroup/PlBtnGroup.vue.js +17 -17
  13. package/dist/components/PlCheckboxGroup/PlCheckboxGroup.vue.js +12 -12
  14. package/dist/components/PlChip/PlChip.vue.js +8 -8
  15. package/dist/components/PlDropdown/PlDropdown.vue.js +27 -27
  16. package/dist/components/PlDropdownLegacy/PlDropdownLegacy.vue.js +39 -39
  17. package/dist/components/PlDropdownMulti/PlDropdownMulti.vue.js +20 -20
  18. package/dist/components/PlFileDialog/PlFileDialog.vue.d.ts +3 -1
  19. package/dist/components/PlFileDialog/PlFileDialog.vue.d.ts.map +1 -1
  20. package/dist/components/PlFileDialog/Remote.vue.d.ts +3 -1
  21. package/dist/components/PlFileDialog/Remote.vue.d.ts.map +1 -1
  22. package/dist/components/PlFileDialog/Remote.vue.js +80 -76
  23. package/dist/components/PlFileDialog/Remote.vue.js.map +1 -1
  24. package/dist/components/PlFileDialog/Shortcuts.vue.d.ts +4 -1
  25. package/dist/components/PlFileDialog/Shortcuts.vue.d.ts.map +1 -1
  26. package/dist/components/PlFileDialog/Shortcuts.vue2.js +18 -14
  27. package/dist/components/PlFileDialog/Shortcuts.vue2.js.map +1 -1
  28. package/dist/components/PlFileInput/PlFileInput.vue.js +17 -17
  29. package/dist/components/PlLogView/PlLogView.vue.js +22 -22
  30. package/dist/components/PlNumberField/PlNumberField.vue.js +8 -8
  31. package/dist/components/PlSearchField/PlSearchField.vue.d.ts +28 -4
  32. package/dist/components/PlSearchField/PlSearchField.vue.d.ts.map +1 -1
  33. package/dist/components/PlSearchField/PlSearchField.vue2.js +40 -30
  34. package/dist/components/PlSearchField/PlSearchField.vue2.js.map +1 -1
  35. package/dist/components/PlSlideModal/PlPureSlideModal.vue.js +3 -4
  36. package/dist/components/PlSlideModal/PlPureSlideModal.vue.js.map +1 -1
  37. package/dist/components/PlTabs/Tab.vue.d.ts +42 -12
  38. package/dist/components/PlTabs/Tab.vue.d.ts.map +1 -1
  39. package/dist/components/PlTabs/Tab.vue.js +6 -6
  40. package/dist/components/PlTextArea/PlTextArea.vue.js +22 -22
  41. package/dist/components/PlTextField/PlTextField.vue.js +14 -14
  42. package/dist/components/PlTooltip/PlTooltip.vue.d.ts +30 -3
  43. package/dist/components/PlTooltip/PlTooltip.vue.d.ts.map +1 -1
  44. package/dist/components/PlTooltip/PlTooltip.vue.js +7 -110
  45. package/dist/components/PlTooltip/PlTooltip.vue.js.map +1 -1
  46. package/dist/components/PlTooltip/PlTooltip.vue2.js +132 -2
  47. package/dist/components/PlTooltip/PlTooltip.vue2.js.map +1 -1
  48. package/dist/components/PlTooltip/PlTooltip.vue3.js +26 -0
  49. package/dist/components/PlTooltip/PlTooltip.vue3.js.map +1 -0
  50. package/dist/components/Slider.vue.d.ts +1 -1
  51. package/dist/components/Slider.vue.d.ts.map +1 -1
  52. package/dist/components/Slider.vue.js +21 -21
  53. package/dist/components/SliderRange.vue.d.ts +1 -1
  54. package/dist/components/SliderRange.vue.d.ts.map +1 -1
  55. package/dist/components/SliderRange.vue.js +31 -31
  56. package/dist/components/SliderRangeTriple.vue.d.ts +1 -1
  57. package/dist/components/SliderRangeTriple.vue.d.ts.map +1 -1
  58. package/dist/components/SliderRangeTriple.vue.js +23 -23
  59. package/dist/index.js +1 -1
  60. package/dist/utils/DoubleContour.vue2.js +23 -0
  61. package/dist/utils/DoubleContour.vue2.js.map +1 -0
  62. package/package.json +3 -3
  63. package/src/assets/base.scss +4 -1
  64. package/src/assets/mixins.scss +1 -2
  65. package/src/assets/utils.scss +1 -1
  66. package/src/components/PlFileDialog/Remote.vue +5 -3
  67. package/src/components/PlFileDialog/Shortcuts.vue +5 -1
  68. package/src/components/PlSearchField/PlSearchField.vue +22 -17
  69. package/src/components/PlTooltip/PlTooltip.vue +228 -33
  70. package/dist/components/PlTooltip/Beak.vue.d.ts +0 -3
  71. package/dist/components/PlTooltip/Beak.vue.d.ts.map +0 -1
  72. package/dist/components/PlTooltip/Beak.vue.js +0 -23
  73. package/dist/components/PlTooltip/Beak.vue.js.map +0 -1
  74. package/dist/components/PlTooltip/useTooltipPosition.d.ts +0 -12
  75. package/dist/components/PlTooltip/useTooltipPosition.d.ts.map +0 -1
  76. package/dist/components/PlTooltip/useTooltipPosition.js +0 -18
  77. package/dist/components/PlTooltip/useTooltipPosition.js.map +0 -1
  78. package/src/components/PlTooltip/Beak.vue +0 -12
  79. package/src/components/PlTooltip/pl-tooltip.scss +0 -117
  80. package/src/components/PlTooltip/useTooltipPosition.ts +0 -59
@@ -1,10 +1,10 @@
1
- import { defineComponent as E, useSlots as S, ref as v, computed as a, onMounted as $, createElementBlock as s, openBlock as o, createElementVNode as n, createCommentVNode as i, normalizeClass as C, withDirectives as N, createVNode as q, createBlock as g, unref as d, toDisplayString as c, withCtx as D, renderSlot as b, vModelText as M } from "vue";
1
+ import { defineComponent as E, useSlots as S, ref as v, computed as a, onMounted as C, createElementBlock as s, openBlock as o, createElementVNode as n, createCommentVNode as i, normalizeClass as N, withDirectives as $, createVNode as q, createBlock as g, unref as d, toDisplayString as c, withCtx as D, renderSlot as b, vModelText as M } from "vue";
2
2
  /* empty css */
3
- import j from "../PlTooltip/PlTooltip.vue.js";
4
- import H from "../../utils/DoubleContour.vue.js";
3
+ import P from "../PlTooltip/PlTooltip.vue.js";
4
+ import T from "../../utils/DoubleContour.vue.js";
5
5
  /* empty css */
6
- import { useLabelNotch as P } from "../../utils/useLabelNotch.js";
7
- import { useValidation as T } from "../../utils/useValidation.js";
6
+ import { useLabelNotch as j } from "../../utils/useLabelNotch.js";
7
+ import { useValidation as H } from "../../utils/useValidation.js";
8
8
  import { getErrorMessage as z } from "../../helpers/error.js";
9
9
  import A from "../PlSvg/PlSvg.vue.js";
10
10
  import I from "../../assets/images/required.svg.js";
@@ -19,7 +19,7 @@ const L = { class: "ui-text-area__envelope" }, R = {
19
19
  class: "ui-text-area__helper"
20
20
  }, K = {
21
21
  name: "PlTextArea"
22
- }, le = /* @__PURE__ */ E({
22
+ }, re = /* @__PURE__ */ E({
23
23
  ...K,
24
24
  props: {
25
25
  modelValue: {},
@@ -37,31 +37,31 @@ const L = { class: "ui-text-area__envelope" }, R = {
37
37
  },
38
38
  emits: ["update:modelValue"],
39
39
  setup(t, { emit: k }) {
40
- const x = S(), _ = k, r = t, m = v(), p = v(), u = a({
40
+ const x = S(), V = k, l = t, m = v(), p = v(), u = a({
41
41
  get() {
42
- return r.modelValue ?? "";
42
+ return l.modelValue ?? "";
43
43
  },
44
44
  set(e) {
45
- _("update:modelValue", e);
45
+ V("update:modelValue", e);
46
46
  }
47
- }), V = a(() => !!r.modelValue), w = T(u, r.rules || []);
48
- P(m);
47
+ }), _ = a(() => !!l.modelValue), w = H(u, l.rules || []);
48
+ j(m);
49
49
  const h = a(() => {
50
- const e = [], l = z(r.error);
51
- return l && e.push(l), e.push(...w.value.errors), e;
50
+ const e = [], r = z(l.error);
51
+ return r && e.push(r), e.push(...w.value.errors), e;
52
52
  }), f = a(() => h.value.length > 0), y = () => {
53
- if (!r.autogrow)
53
+ if (!l.autogrow)
54
54
  return;
55
55
  const e = p.value;
56
56
  e && (e.style.height = "auto", e.style.height = `${e.scrollHeight}px`);
57
57
  };
58
- return $(() => {
58
+ return C(() => {
59
59
  y();
60
- }), (e, l) => (o(), s("div", L, [
60
+ }), (e, r) => (o(), s("div", L, [
61
61
  n("div", {
62
62
  ref_key: "root",
63
63
  ref: m,
64
- class: C(["ui-text-area", { error: f.value, disabled: t.disabled, dashed: t.dashed, nonEmpty: V.value }])
64
+ class: N(["ui-text-area", { error: f.value, disabled: t.disabled, dashed: t.dashed, nonEmpty: _.value }])
65
65
  }, [
66
66
  t.label ? (o(), s("label", R, [
67
67
  t.required ? (o(), g(d(A), {
@@ -69,7 +69,7 @@ const L = { class: "ui-text-area__envelope" }, R = {
69
69
  uri: d(I)
70
70
  }, null, 8, ["uri"])) : i("", !0),
71
71
  n("span", null, c(t.label), 1),
72
- d(x).tooltip ? (o(), g(d(j), {
72
+ d(x).tooltip ? (o(), g(d(P), {
73
73
  key: 1,
74
74
  class: "info",
75
75
  position: "top"
@@ -80,10 +80,10 @@ const L = { class: "ui-text-area__envelope" }, R = {
80
80
  _: 3
81
81
  })) : i("", !0)
82
82
  ], 512)) : i("", !0),
83
- N(n("textarea", {
83
+ $(n("textarea", {
84
84
  ref_key: "input",
85
85
  ref: p,
86
- "onUpdate:modelValue": l[0] || (l[0] = (B) => u.value = B),
86
+ "onUpdate:modelValue": r[0] || (r[0] = (B) => u.value = B),
87
87
  readonly: t.readonly,
88
88
  rows: t.rows,
89
89
  disabled: t.disabled,
@@ -96,13 +96,13 @@ const L = { class: "ui-text-area__envelope" }, R = {
96
96
  n("div", F, [
97
97
  b(e.$slots, "append")
98
98
  ]),
99
- q(H, { class: "ui-text-area__contour" })
99
+ q(T, { class: "ui-text-area__contour" })
100
100
  ], 2),
101
101
  f.value ? (o(), s("div", G, c(h.value.join(" ")), 1)) : t.helper ? (o(), s("div", J, c(t.helper), 1)) : i("", !0)
102
102
  ]));
103
103
  }
104
104
  });
105
105
  export {
106
- le as default
106
+ re as default
107
107
  };
108
108
  //# sourceMappingURL=PlTextArea.vue.js.map
@@ -1,4 +1,4 @@
1
- import { defineComponent as I, mergeModels as N, useSlots as $, useModel as O, ref as h, reactive as T, computed as i, createElementBlock as d, openBlock as a, createElementVNode as p, createCommentVNode as n, normalizeClass as j, withDirectives as z, createVNode as L, createBlock as f, unref as c, toDisplayString as m, withCtx as U, renderSlot as E, vModelDynamic as A, withModifiers as V } from "vue";
1
+ import { defineComponent as I, mergeModels as N, useSlots as T, useModel as $, ref as h, reactive as O, computed as i, createElementBlock as d, openBlock as a, createElementVNode as p, createCommentVNode as n, normalizeClass as j, withDirectives as z, createVNode as L, createBlock as f, unref as c, toDisplayString as v, withCtx as U, renderSlot as E, vModelDynamic as A, withModifiers as V } from "vue";
2
2
  import G from "../../assets/images/required.svg.js";
3
3
  import { getErrorMessage as H } from "../../helpers/error.js";
4
4
  import J from "../../utils/DoubleContour.vue.js";
@@ -48,9 +48,9 @@ const ee = { class: "pl-text-field__envelope" }, le = {
48
48
  }),
49
49
  emits: ["update:modelValue"],
50
50
  setup(l) {
51
- const _ = $(), o = O(l, "modelValue"), e = l, y = h(void 0), b = h(), u = h(!1), s = T({
51
+ const P = T(), o = $(l, "modelValue"), e = l, y = h(void 0), b = h(), u = h(!1), s = O({
52
52
  cached: void 0
53
- }), v = i({
53
+ }), m = i({
54
54
  get() {
55
55
  return s.cached ? s.cached.value : o.value === void 0 || o.value === null ? "" : String(o.value);
56
56
  },
@@ -67,12 +67,12 @@ const ee = { class: "pl-text-field__envelope" }, le = {
67
67
  else
68
68
  o.value = t;
69
69
  }
70
- }), C = i(() => e.type && e.type === "password" ? u.value ? "text" : e.type : "text"), M = i(() => u.value ? "view-show" : "view-hide"), P = () => {
70
+ }), C = i(() => e.type && e.type === "password" ? u.value ? "text" : e.type : "text"), M = i(() => u.value ? "view-show" : "view-hide"), S = () => {
71
71
  e.clearable && (s.cached = void 0, o.value = e.clearable === !0 ? "" : e.clearable());
72
- }, k = Q(v, e.rules || []), S = i(() => e.clearable ? e.clearable === !0 ? o.value === "" : o.value === e.clearable() : o.value === ""), g = i(() => !S.value), x = i(() => {
72
+ }, k = Q(m, e.rules || []), B = i(() => e.clearable ? e.clearable === !0 ? o.value === "" : o.value === e.clearable() : o.value === ""), g = i(() => !B.value), x = i(() => {
73
73
  const t = [], r = H(e.error);
74
74
  return r && t.push(r), s.cached && t.push(s.cached.error), k.value.isValid || t.push(...k.value.errors), t;
75
- }), w = i(() => x.value.length > 0), B = i(
75
+ }), w = i(() => x.value.length > 0), _ = i(
76
76
  () => e.clearable && g.value && e.type !== "password" && !e.disabled
77
77
  ), F = () => u.value = !u.value, R = () => {
78
78
  s.cached = void 0;
@@ -96,8 +96,8 @@ const ee = { class: "pl-text-field__envelope" }, le = {
96
96
  key: 0,
97
97
  uri: c(G)
98
98
  }, null, 8, ["uri"])) : n("", !0),
99
- p("span", null, m(l.label), 1),
100
- c(_).tooltip ? (a(), f(c(Z), {
99
+ p("span", null, v(l.label), 1),
100
+ c(P).tooltip ? (a(), f(c(Z), {
101
101
  key: 1,
102
102
  class: "info",
103
103
  position: "top"
@@ -108,28 +108,28 @@ const ee = { class: "pl-text-field__envelope" }, le = {
108
108
  _: 3
109
109
  })) : n("", !0)
110
110
  ], 512)) : n("", !0),
111
- l.prefix ? (a(), d("div", te, m(l.prefix), 1)) : n("", !0),
111
+ l.prefix ? (a(), d("div", te, v(l.prefix), 1)) : n("", !0),
112
112
  z(p("input", {
113
113
  ref_key: "inputRef",
114
114
  ref: b,
115
- "onUpdate:modelValue": r[0] || (r[0] = (D) => v.value = D),
115
+ "onUpdate:modelValue": r[0] || (r[0] = (D) => m.value = D),
116
116
  disabled: l.disabled,
117
117
  placeholder: l.placeholder || "...",
118
118
  type: C.value,
119
119
  spellcheck: "false",
120
120
  onFocusout: R
121
121
  }, null, 40, oe), [
122
- [A, v.value]
122
+ [A, m.value]
123
123
  ]),
124
124
  p("div", {
125
125
  class: "pl-text-field__append",
126
126
  onClick: q
127
127
  }, [
128
- B.value ? (a(), f(c(W), {
128
+ _.value ? (a(), f(c(W), {
129
129
  key: 0,
130
130
  class: "pl-text-field__clearable",
131
131
  name: "delete-clear",
132
- onClick: V(P, ["stop"])
132
+ onClick: V(S, ["stop"])
133
133
  })) : n("", !0),
134
134
  l.type === "password" ? (a(), f(c(X), {
135
135
  key: 1,
@@ -144,7 +144,7 @@ const ee = { class: "pl-text-field__envelope" }, le = {
144
144
  "group-position": l.groupPosition
145
145
  }, null, 8, ["group-position"])
146
146
  ], 2),
147
- w.value ? (a(), d("div", re, m(x.value.join(" ")), 1)) : l.helper ? (a(), d("div", ae, m(l.helper), 1)) : n("", !0)
147
+ w.value ? (a(), d("div", re, v(x.value.join(" ")), 1)) : l.helper ? (a(), d("div", ae, v(l.helper), 1)) : n("", !0)
148
148
  ]));
149
149
  }
150
150
  });
@@ -11,7 +11,7 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<{
11
11
  /**
12
12
  * Tooltip position
13
13
  */
14
- position?: "top-left" | "left" | "right" | "top" | "southwest";
14
+ position?: "top" | "left" | "bottom" | "right" | "top-left";
15
15
  /**
16
16
  * external prop to hide tooltips
17
17
  */
@@ -20,6 +20,10 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<{
20
20
  * The gap in pixels between the tooltip and the target element
21
21
  */
22
22
  gap?: number;
23
+ /**
24
+ * The minimum offset in pixels from the edge of the screen to the tooltip
25
+ */
26
+ offsetToTheEdge?: number;
23
27
  /**
24
28
  * base html element for tooltip
25
29
  */
@@ -28,6 +32,14 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<{
28
32
  * Max width (css value) of the tooltip container (default is 300px)
29
33
  */
30
34
  maxWidth?: string;
35
+ /**
36
+ * The container to insert the tooltip to (body by default)
37
+ */
38
+ container?: "body" | HTMLElement;
39
+ /**
40
+ * Whether the tooltip is shown on hover (default is true); otherwise, it is shown when hide is set to false
41
+ */
42
+ hoverable?: boolean;
31
43
  }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
32
44
  "tooltip:close": (...args: any[]) => void;
33
45
  }, string, import('vue').PublicProps, Readonly<{
@@ -42,7 +54,7 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<{
42
54
  /**
43
55
  * Tooltip position
44
56
  */
45
- position?: "top-left" | "left" | "right" | "top" | "southwest";
57
+ position?: "top" | "left" | "bottom" | "right" | "top-left";
46
58
  /**
47
59
  * external prop to hide tooltips
48
60
  */
@@ -51,6 +63,10 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<{
51
63
  * The gap in pixels between the tooltip and the target element
52
64
  */
53
65
  gap?: number;
66
+ /**
67
+ * The minimum offset in pixels from the edge of the screen to the tooltip
68
+ */
69
+ offsetToTheEdge?: number;
54
70
  /**
55
71
  * base html element for tooltip
56
72
  */
@@ -59,15 +75,26 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<{
59
75
  * Max width (css value) of the tooltip container (default is 300px)
60
76
  */
61
77
  maxWidth?: string;
78
+ /**
79
+ * The container to insert the tooltip to (body by default)
80
+ */
81
+ container?: "body" | HTMLElement;
82
+ /**
83
+ * Whether the tooltip is shown on hover (default is true); otherwise, it is shown when hide is set to false
84
+ */
85
+ hoverable?: boolean;
62
86
  }> & Readonly<{
63
87
  "onTooltip:close"?: ((...args: any[]) => any) | undefined;
64
88
  }>, {
65
89
  gap: number;
90
+ container: "body" | HTMLElement;
66
91
  openDelay: number;
67
92
  closeDelay: number;
68
- position: "top-left" | "left" | "right" | "top" | "southwest";
93
+ position: "top" | "left" | "bottom" | "right" | "top-left";
94
+ offsetToTheEdge: number;
69
95
  element: "div" | "span" | "a" | "p" | "h1" | "h2" | "h3";
70
96
  maxWidth: string;
97
+ hoverable: boolean;
71
98
  }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
72
99
  rootRef: unknown;
73
100
  tooltip: HTMLDivElement;
@@ -1 +1 @@
1
- {"version":3,"file":"PlTooltip.vue.d.ts","sourceRoot":"","sources":["../../../src/components/PlTooltip/PlTooltip.vue"],"names":[],"mappings":"AAuLA,OAAO,mBAAmB,CAAC;AAS3B,kCAAkC;;IAO9B;;OAEG;gBACS,MAAM;IAClB;;OAEG;iBACU,MAAM;IACnB;;OAEG;eACQ,UAAU,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,WAAW;IAC9D;;OAEG;WACI,OAAO;IACd;;OAEG;UACG,MAAM;IACZ;;OAEG;cACO,KAAK,GAAG,MAAM,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI;IACzD;;OAEG;eACQ,MAAM;;;;IA3BjB;;OAEG;gBACS,MAAM;IAClB;;OAEG;iBACU,MAAM;IACnB;;OAEG;eACQ,UAAU,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,WAAW;IAC9D;;OAEG;WACI,OAAO;IACd;;OAEG;UACG,MAAM;IACZ;;OAEG;cACO,KAAK,GAAG,MAAM,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI;IACzD;;OAEG;eACQ,MAAM;;;;SARX,MAAM;eAhBA,MAAM;gBAIL,MAAM;cAIR,UAAU,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,WAAW;aAYpD,KAAK,GAAG,MAAM,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI;cAI9C,MAAM;;;;;qBA4MS,GAAG;qBACH,GAAG;;AA9OjC,wBAmSK;AAcL,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
1
+ {"version":3,"file":"PlTooltip.vue.d.ts","sourceRoot":"","sources":["../../../src/components/PlTooltip/PlTooltip.vue"],"names":[],"mappings":"AAiYA,kCAAkC;;IAO9B;;OAEG;gBACS,MAAM;IAClB;;OAEG;iBACU,MAAM;IACnB;;OAEG;eACQ,KAAK,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU;IAC3D;;OAEG;WACI,OAAO;IACd;;OAEG;UACG,MAAM;IAEZ;;OAEG;sBACe,MAAM;IACxB;;OAEG;cACO,KAAK,GAAG,MAAM,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI;IACzD;;OAEG;eACQ,MAAM;IACjB;;OAEG;gBACS,MAAM,GAAG,WAAW;IAChC;;OAEG;gBACS,OAAO;;;;IAxCnB;;OAEG;gBACS,MAAM;IAClB;;OAEG;iBACU,MAAM;IACnB;;OAEG;eACQ,KAAK,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU;IAC3D;;OAEG;WACI,OAAO;IACd;;OAEG;UACG,MAAM;IAEZ;;OAEG;sBACe,MAAM;IACxB;;OAEG;cACO,KAAK,GAAG,MAAM,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI;IACzD;;OAEG;eACQ,MAAM;IACjB;;OAEG;gBACS,MAAM,GAAG,WAAW;IAChC;;OAEG;gBACS,OAAO;;;;SArBb,MAAM;eAiBA,MAAM,GAAG,WAAW;eAjCpB,MAAM;gBAIL,MAAM;cAIR,KAAK,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU;qBAazC,MAAM;aAId,KAAK,GAAG,MAAM,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI;cAI9C,MAAM;eAQL,OAAO;;;;;qBAgOO,GAAG;qBACH,GAAG;;AA/QjC,wBAkUK;AAgEL,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
@@ -1,113 +1,10 @@
1
- import { defineComponent as $, reactive as b, watch as u, ref as y, toRef as x, computed as N, onUnmounted as P, createBlock as v, openBlock as p, resolveDynamicComponent as R, mergeProps as V, withCtx as k, renderSlot as h, createCommentVNode as w, Teleport as g, createVNode as C, Transition as j, createElementBlock as z, withModifiers as A, normalizeStyle as T, unref as W, createElementVNode as M, normalizeClass as q } from "vue";
2
- /* empty css */
3
- import { useTooltipPosition as F } from "./useTooltipPosition.js";
4
- import { throttle as K, delay as L, timeout as U } from "../../helpers/utils.js";
5
- import { useClickOutside as G } from "../../composition/useClickOutside.js";
6
- import H from "./Beak.vue.js";
7
- import { tMap as m } from "./global.js";
8
- const I = {
9
- name: "PlTooltip"
10
- }, te = /* @__PURE__ */ $({
11
- ...I,
12
- props: {
13
- openDelay: { default: 100 },
14
- closeDelay: { default: 1e3 },
15
- position: { default: "top" },
16
- hide: { type: Boolean },
17
- gap: { default: 8 },
18
- element: { default: "div" },
19
- maxWidth: { default: "300px" }
20
- },
21
- emits: ["tooltip:close"],
22
- setup(i, { emit: B }) {
23
- const D = B, s = Symbol(), t = i, e = b({
24
- open: !1,
25
- over: !1,
26
- tooltipOpen: !1,
27
- key: Symbol()
28
- });
29
- m.set(s, () => l()), u(
30
- () => e.open,
31
- (o) => {
32
- requestAnimationFrame(() => {
33
- e.tooltipOpen = o;
34
- });
35
- }
36
- );
37
- let f = () => {
38
- };
39
- const O = K(() => window.dispatchEvent(new CustomEvent("adjust")), 1e3), S = () => {
40
- e.open = !0;
41
- for (const [o, n] of m.entries())
42
- o !== s && n();
43
- }, l = () => {
44
- e.open = !1, D("tooltip:close");
45
- }, r = async () => {
46
- t.hide || (O(), e.over = !0, f(), await L(t.openDelay ?? 100), e.over && S());
47
- }, c = () => {
48
- e.over = !1, f = U(() => {
49
- e.over || l();
50
- }, t.closeDelay);
51
- };
52
- u(
53
- () => t.hide,
54
- (o) => {
55
- o && l();
56
- }
57
- );
58
- const a = y(), d = y(), E = F(a, x(t));
59
- G([a, d], () => l());
60
- const _ = N(() => ({
61
- "--pl-tooltip-max-width": t.maxWidth
62
- }));
63
- return P(() => {
64
- m.delete(s);
65
- }), (o, n) => (p(), v(R(i.element), V(o.$attrs, {
66
- ref_key: "rootRef",
67
- ref: a,
68
- onClick: r,
69
- onMouseover: r,
70
- onMouseleave: c
71
- }), {
72
- default: k(() => [
73
- h(o.$slots, "default"),
74
- o.$slots.tooltip && e.open ? (p(), v(g, {
75
- key: 0,
76
- to: "body"
77
- }, [
78
- C(j, { name: "tooltip-transition" }, {
79
- default: k(() => [
80
- e.tooltipOpen ? (p(), z("div", {
81
- key: 0,
82
- class: "pl-tooltip__container",
83
- style: T(W(E)),
84
- onClick: n[0] || (n[0] = A(() => {
85
- }, ["stop"]))
86
- }, [
87
- M("div", {
88
- ref_key: "tooltip",
89
- ref: d,
90
- class: q(["pl-tooltip", i.position]),
91
- style: T(_.value),
92
- onMouseover: r,
93
- onMouseleave: c
94
- }, [
95
- M("div", null, [
96
- h(o.$slots, "tooltip")
97
- ]),
98
- C(H)
99
- ], 38)
100
- ], 4)) : w("", !0)
101
- ]),
102
- _: 3
103
- })
104
- ])) : w("", !0)
105
- ]),
106
- _: 3
107
- }, 16));
108
- }
109
- });
1
+ import o from "./PlTooltip.vue2.js";
2
+ import s from "./PlTooltip.vue3.js";
3
+ import t from "../../_virtual/_plugin-vue_export-helper.js";
4
+ const r = {
5
+ $style: s
6
+ }, c = /* @__PURE__ */ t(o, [["__cssModules", r]]);
110
7
  export {
111
- te as default
8
+ c as default
112
9
  };
113
10
  //# sourceMappingURL=PlTooltip.vue.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"PlTooltip.vue.js","sources":["../../../src/components/PlTooltip/PlTooltip.vue"],"sourcesContent":["<script lang=\"ts\">\n/** Simple tooltip on mouseover */\nexport default {\n name: \"PlTooltip\",\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport \"./pl-tooltip.scss\";\nimport { computed, onUnmounted, reactive, ref, toRef, watch } from \"vue\";\nimport { useTooltipPosition } from \"./useTooltipPosition\";\nimport * as utils from \"../../helpers/utils\";\nimport { useClickOutside } from \"../../composition/useClickOutside\";\nimport Beak from \"./Beak.vue\";\nimport { tMap } from \"./global\";\n\nconst emit = defineEmits([\"tooltip:close\"]);\n\nconst tKey = Symbol();\n\nconst props = withDefaults(\n defineProps<{\n /**\n * delay in milliseconds before the tooltip opens\n */\n openDelay?: number;\n /**\n * delay in milliseconds before the tooltip disappears\n */\n closeDelay?: number;\n /**\n * Tooltip position\n */\n position?: \"top-left\" | \"left\" | \"right\" | \"top\" | \"southwest\";\n /**\n * external prop to hide tooltips\n */\n hide?: boolean;\n /**\n * The gap in pixels between the tooltip and the target element\n */\n gap?: number;\n /**\n * base html element for tooltip\n */\n element?: \"div\" | \"span\" | \"a\" | \"p\" | \"h1\" | \"h2\" | \"h3\";\n /**\n * Max width (css value) of the tooltip container (default is 300px)\n */\n maxWidth?: string;\n }>(),\n {\n openDelay: 100,\n closeDelay: 1000,\n gap: 8,\n position: \"top\",\n element: \"div\",\n maxWidth: \"300px\",\n },\n);\n\nconst data = reactive({\n open: false,\n over: false,\n tooltipOpen: false,\n key: Symbol(),\n});\n\ntMap.set(tKey, () => closeTooltip());\n\n// Hook to avoid the need to immediately teleport into the body (better performance)\nwatch(\n () => data.open,\n (v) => {\n requestAnimationFrame(() => {\n data.tooltipOpen = v;\n });\n },\n);\n\nlet clearTimeout = () => {};\n\nconst dispatchAdjust = utils.throttle(() => window.dispatchEvent(new CustomEvent(\"adjust\")), 1000);\n\nconst showTooltip = () => {\n data.open = true;\n\n for (const [k, f] of tMap.entries()) {\n if (k !== tKey) {\n f();\n }\n }\n};\n\nconst closeTooltip = () => {\n data.open = false;\n emit(\"tooltip:close\");\n};\n\nconst onOver = async () => {\n if (props.hide) {\n return;\n }\n\n dispatchAdjust();\n\n data.over = true;\n\n clearTimeout();\n\n await utils.delay(props.openDelay ?? 100);\n\n if (data.over) {\n showTooltip();\n }\n};\n\nconst onLeave = () => {\n data.over = false;\n clearTimeout = utils.timeout(() => {\n if (!data.over) {\n closeTooltip();\n }\n }, props.closeDelay);\n};\n\nwatch(\n () => props.hide,\n (hide) => {\n if (hide) {\n closeTooltip();\n }\n },\n);\n\nconst rootRef = ref<HTMLElement | undefined>();\nconst tooltip = ref<HTMLElement | undefined>();\n\nconst style = useTooltipPosition(rootRef, toRef(props));\n\nuseClickOutside([rootRef, tooltip], () => closeTooltip());\n\nconst tooltipStyle = computed(() => ({\n \"--pl-tooltip-max-width\": props.maxWidth,\n}));\n\nonUnmounted(() => {\n tMap.delete(tKey);\n});\n</script>\n\n<template>\n <component\n :is=\"element\"\n v-bind=\"$attrs\"\n ref=\"rootRef\"\n @click=\"onOver\"\n @mouseover=\"onOver\"\n @mouseleave=\"onLeave\"\n >\n <slot />\n <Teleport v-if=\"$slots['tooltip'] && data.open\" to=\"body\">\n <Transition name=\"tooltip-transition\">\n <div v-if=\"data.tooltipOpen\" class=\"pl-tooltip__container\" :style=\"style\" @click.stop>\n <div\n ref=\"tooltip\"\n class=\"pl-tooltip\"\n :style=\"tooltipStyle\"\n :class=\"position\"\n @mouseover=\"onOver\"\n @mouseleave=\"onLeave\"\n >\n <!-- should be one line -->\n <div><slot name=\"tooltip\" /></div>\n <Beak />\n </div>\n </div>\n </Transition>\n </Teleport>\n </component>\n</template>\n"],"names":["__default__","emit","__emit","tKey","props","__props","data","reactive","tMap","closeTooltip","watch","v","clearTimeout","dispatchAdjust","utils.throttle","showTooltip","k","f","onOver","utils.delay","onLeave","utils.timeout","hide","rootRef","ref","tooltip","style","useTooltipPosition","toRef","useClickOutside","tooltipStyle","computed","onUnmounted","_openBlock","_createBlock","_resolveDynamicComponent","_mergeProps","$attrs","_renderSlot","_ctx","$slots","_Teleport","_createVNode","_Transition","_createElementBlock","_unref","_createElementVNode","_normalizeClass","Beak"],"mappings":"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"}
1
+ {"version":3,"file":"PlTooltip.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
@@ -1,5 +1,135 @@
1
- import f from "./PlTooltip.vue.js";
1
+ import { defineComponent as B, useCssVars as w, reactive as D, watch as h, ref as T, onUnmounted as N, createBlock as $, openBlock as k, resolveDynamicComponent as O, mergeProps as E, withCtx as C, renderSlot as b, createVNode as S, Transition as V, createCommentVNode as W, Teleport as q, createElementVNode as i, normalizeStyle as z, normalizeClass as a, withModifiers as A } from "vue";
2
+ import { uniqueId as L } from "@milaboratories/helpers";
3
+ import { tMap as f } from "./global.js";
4
+ import { delay as P, timeout as R } from "../../helpers/utils.js";
5
+ import { useClickOutside as F } from "../../composition/useClickOutside.js";
6
+ const I = {
7
+ name: "PlTooltip"
8
+ }, J = /* @__PURE__ */ B({
9
+ ...I,
10
+ props: {
11
+ openDelay: { default: 100 },
12
+ closeDelay: { default: 1e3 },
13
+ position: { default: "top" },
14
+ hide: { type: Boolean },
15
+ gap: { default: 8 },
16
+ offsetToTheEdge: { default: 8 },
17
+ element: { default: "div" },
18
+ maxWidth: { default: "300px" },
19
+ container: { default: "body" },
20
+ hoverable: { type: Boolean, default: !0 }
21
+ },
22
+ emits: ["tooltip:close"],
23
+ setup(l, { emit: g }) {
24
+ w((e) => ({
25
+ v0ef0814d: v
26
+ }));
27
+ const M = g, r = Symbol(), o = l, t = D({
28
+ open: !1,
29
+ over: !1,
30
+ tooltipOpen: !1,
31
+ key: Symbol()
32
+ });
33
+ f.set(r, () => s()), h(
34
+ () => t.open,
35
+ (e) => {
36
+ requestAnimationFrame(() => {
37
+ t.tooltipOpen = e;
38
+ });
39
+ }
40
+ );
41
+ let d = () => {
42
+ };
43
+ const m = () => {
44
+ t.open = !0;
45
+ for (const [e, n] of f.entries())
46
+ e !== r && n();
47
+ }, s = () => {
48
+ t.open = !1, M("tooltip:close");
49
+ }, p = async () => {
50
+ o.hide || !o.hoverable || (t.over = !0, d(), await P(o.openDelay ?? 100), t.over && m());
51
+ }, u = () => {
52
+ o.hoverable && (t.over = !1, d = R(() => {
53
+ t.over || s();
54
+ }, o.closeDelay));
55
+ };
56
+ h(
57
+ () => o.hide,
58
+ (e) => {
59
+ e ? s() : o.hoverable || m();
60
+ }
61
+ );
62
+ const c = T(), y = T();
63
+ F([c, y], () => s()), N(() => {
64
+ f.delete(r);
65
+ });
66
+ const v = `--anchor-${L()}`;
67
+ return (e, n) => (k(), $(O(l.element), E({
68
+ class: e.$style.plTooltipAnchorWrapper
69
+ }, e.$attrs, {
70
+ ref_key: "rootRef",
71
+ ref: c,
72
+ onClick: p,
73
+ onMouseover: p,
74
+ onMouseleave: u
75
+ }), {
76
+ default: C(() => [
77
+ b(e.$slots, "default"),
78
+ S(V, { name: "pl-tooltip-fade" }, {
79
+ default: C(() => [
80
+ e.$slots.tooltip && t.tooltipOpen ? (k(), $(q, {
81
+ key: 0,
82
+ to: l.container
83
+ }, [
84
+ i("div", {
85
+ class: a([
86
+ e.$style.plTooltipContainer,
87
+ {
88
+ [e.$style.top]: o.position === "top",
89
+ [e.$style.bottom]: o.position === "bottom",
90
+ [e.$style.left]: o.position === "left",
91
+ [e.$style.right]: o.position === "right",
92
+ [e.$style.topLeft]: o.position === "top-left"
93
+ }
94
+ ]),
95
+ style: z({
96
+ "--anchorName": v,
97
+ "--gap": l.gap + "px",
98
+ "--offsetToTheEdge": l.offsetToTheEdge + "px",
99
+ "--plTooltipMaxWidth": l.maxWidth
100
+ })
101
+ }, [
102
+ i("div", {
103
+ class: a(e.$style.plTooltipBox),
104
+ onClick: n[0] || (n[0] = A(() => {
105
+ }, ["stop"]))
106
+ }, [
107
+ i("div", {
108
+ ref_key: "tooltip",
109
+ ref: y,
110
+ class: a([e.$style.plTooltipContent, l.position]),
111
+ onMouseover: p,
112
+ onMouseleave: u
113
+ }, [
114
+ i("div", null, [
115
+ b(e.$slots, "tooltip")
116
+ ])
117
+ ], 34)
118
+ ], 2),
119
+ i("div", {
120
+ class: a(e.$style.plTooltipBeak)
121
+ }, null, 2)
122
+ ], 6)
123
+ ], 8, ["to"])) : W("", !0)
124
+ ]),
125
+ _: 3
126
+ })
127
+ ]),
128
+ _: 3
129
+ }, 16, ["class"]));
130
+ }
131
+ });
2
132
  export {
3
- f as default
133
+ J as default
4
134
  };
5
135
  //# sourceMappingURL=PlTooltip.vue2.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"PlTooltip.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
1
+ {"version":3,"file":"PlTooltip.vue2.js","sources":["../../../src/components/PlTooltip/PlTooltip.vue"],"sourcesContent":["<script lang=\"ts\">\n/** Simple tooltip on mouseover */\nexport default {\n name: \"PlTooltip\",\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport { uniqueId } from \"@milaboratories/helpers\";\nimport { onUnmounted, reactive, ref, watch } from \"vue\";\nimport { tMap } from \"./global\";\nimport * as utils from \"../../helpers/utils\";\nimport { useClickOutside } from \"../../composition/useClickOutside\";\n\nconst emit = defineEmits([\"tooltip:close\"]);\n\nconst tKey = Symbol();\n\nconst props = withDefaults(\n defineProps<{\n /**\n * delay in milliseconds before the tooltip opens\n */\n openDelay?: number;\n /**\n * delay in milliseconds before the tooltip disappears\n */\n closeDelay?: number;\n /**\n * Tooltip position\n */\n position?: \"top\" | \"left\" | \"bottom\" | \"right\" | \"top-left\";\n /**\n * external prop to hide tooltips\n */\n hide?: boolean;\n /**\n * The gap in pixels between the tooltip and the target element\n */\n gap?: number;\n\n /**\n * The minimum offset in pixels from the edge of the screen to the tooltip\n */\n offsetToTheEdge?: number;\n /**\n * base html element for tooltip\n */\n element?: \"div\" | \"span\" | \"a\" | \"p\" | \"h1\" | \"h2\" | \"h3\";\n /**\n * Max width (css value) of the tooltip container (default is 300px)\n */\n maxWidth?: string;\n /**\n * The container to insert the tooltip to (body by default)\n */\n container?: \"body\" | HTMLElement;\n /**\n * Whether the tooltip is shown on hover (default is true); otherwise, it is shown when hide is set to false\n */\n hoverable?: boolean;\n }>(),\n {\n openDelay: 100,\n closeDelay: 1000,\n gap: 8,\n offsetToTheEdge: 8,\n position: \"top\",\n element: \"div\",\n maxWidth: \"300px\",\n container: \"body\",\n hoverable: true,\n },\n);\n\nconst data = reactive({\n open: false,\n over: false,\n tooltipOpen: false,\n key: Symbol(),\n});\n\ntMap.set(tKey, () => closeTooltip());\n\n// Hook to avoid the need to immediately teleport into the body (better performance)\nwatch(\n () => data.open,\n (v) => {\n requestAnimationFrame(() => {\n data.tooltipOpen = v;\n });\n },\n);\n\nlet clearTimeout = () => {};\n\nconst showTooltip = () => {\n data.open = true;\n\n for (const [k, f] of tMap.entries()) {\n if (k !== tKey) {\n f();\n }\n }\n};\n\nconst closeTooltip = () => {\n data.open = false;\n emit(\"tooltip:close\");\n};\n\nconst onOver = async () => {\n if (props.hide || !props.hoverable) {\n return;\n }\n\n data.over = true;\n\n clearTimeout();\n\n await utils.delay(props.openDelay ?? 100);\n\n if (data.over) {\n showTooltip();\n }\n};\n\nconst onLeave = () => {\n if (!props.hoverable) {\n return;\n }\n\n data.over = false;\n clearTimeout = utils.timeout(() => {\n if (!data.over) {\n closeTooltip();\n }\n }, props.closeDelay);\n};\n\nwatch(\n () => props.hide,\n (hide) => {\n if (hide) {\n closeTooltip();\n } else if (!props.hoverable) {\n showTooltip();\n }\n },\n);\n\nconst rootRef = ref<HTMLElement | undefined>();\nconst tooltip = ref<HTMLElement | undefined>();\n\nuseClickOutside([rootRef, tooltip], () => closeTooltip());\n\nonUnmounted(() => {\n tMap.delete(tKey);\n});\nconst anchorName = `--anchor-${uniqueId()}`;\n</script>\n\n<template>\n <component\n :class=\"$style.plTooltipAnchorWrapper\"\n :is=\"element\"\n v-bind=\"$attrs\"\n ref=\"rootRef\"\n @click=\"onOver\"\n @mouseover=\"onOver\"\n @mouseleave=\"onLeave\"\n >\n <!-- anchor element here -->\n <slot />\n <Transition name=\"pl-tooltip-fade\">\n <Teleport v-if=\"$slots['tooltip'] && data.tooltipOpen\" :to=\"container\">\n <div\n :class=\"[\n $style.plTooltipContainer,\n {\n [$style.top]: props.position === 'top',\n [$style.bottom]: props.position === 'bottom',\n [$style.left]: props.position === 'left',\n [$style.right]: props.position === 'right',\n [$style.topLeft]: props.position === 'top-left',\n },\n ]\"\n :style=\"{\n '--anchorName': anchorName,\n '--gap': gap + 'px',\n '--offsetToTheEdge': offsetToTheEdge + 'px',\n '--plTooltipMaxWidth': maxWidth,\n }\"\n >\n <div :class=\"$style.plTooltipBox\" @click.stop>\n <div\n ref=\"tooltip\"\n :class=\"[$style.plTooltipContent, position]\"\n @mouseover=\"onOver\"\n @mouseleave=\"onLeave\"\n >\n <!-- should be one line -->\n <div><slot name=\"tooltip\" /></div>\n </div>\n </div>\n <div :class=\"$style.plTooltipBeak\" />\n </div>\n </Teleport>\n </Transition>\n </component>\n</template>\n\n<style module>\n.plTooltipAnchorWrapper {\n display: inline-block;\n}\n/* just to set anchor-name for the anchor */\n.plTooltipAnchorWrapper > :first-child {\n --anchorName: v-bind(\"anchorName\");\n anchor-name: var(--anchorName);\n}\n\n.plTooltipAnchorWrapper:global(.info) {\n --anchorName: v-bind(\"anchorName\");\n anchor-name: var(--anchorName);\n}\n\n.plTooltipContainer {\n --plTooltipMaxWidth: 300px;\n --gap: 8px;\n --tailWidth: 8px;\n --tailHeight: calc(var(--gap) + 2px);\n\n --tailClipTop: polygon(\n 0 0,\n 100% 0,\n 100% calc(100% - var(--gap)),\n 50% calc(100% - 3px),\n 0 calc(100% - var(--gap))\n );\n --tailClipBottom: polygon(0 100%, 100% 100%, 100% var(--gap), 50% 3px, 0 var(--gap));\n --tailClipLeft: polygon(0 0, 0 100%, 2px 100%, calc(100% - 3px) 50%, 2px 0);\n --tailClipRight: polygon(100% 0, 100% 100%, calc(100% - 2px) 100%, 3px 50%, calc(100% - 2px) 0);\n\n z-index: var(--z-tooltip);\n}\n\n.plTooltipContent {\n display: inline-block;\n padding: 8px 12px 9px 12px;\n background: var(--tooltip-bg);\n border-radius: 6px;\n width: max-content;\n word-break: normal;\n max-width: var(--plTooltipMaxWidth);\n color: #fff;\n}\n\n.plTooltipBox {\n position: absolute;\n position-anchor: var(--anchorName);\n z-index: 1;\n}\n\n.plTooltipBeak {\n position: absolute;\n position-anchor: var(--anchorName);\n z-index: 0;\n background: var(--tooltip-bg);\n width: var(--tailWidth);\n height: var(--tailHeight);\n}\n\n/* top */\n.plTooltipContainer.top .plTooltipBox {\n position-area: top;\n bottom: var(--gap);\n left: var(--offsetToTheEdge);\n right: var(--offsetToTheEdge);\n}\n.plTooltipContainer.top .plTooltipBeak {\n position-area: top;\n bottom: 0;\n left: calc(anchor(var(--anchorName) center) - var(--tailWidth) / 2);\n clip-path: var(--tailClipTop);\n}\n\n/* bottom */\n.plTooltipContainer.bottom .plTooltipBox {\n position-area: bottom;\n top: var(--gap);\n left: var(--offsetToTheEdge);\n right: var(--offsetToTheEdge);\n}\n.plTooltipContainer.bottom .plTooltipBeak {\n position-area: bottom;\n top: 0;\n left: calc(anchor(var(--anchorName) center) - var(--tailWidth) / 2);\n clip-path: var(--tailClipBottom);\n}\n\n/* left */\n.plTooltipContainer.left .plTooltipBox {\n position-area: left;\n right: var(--gap);\n top: var(--offsetToTheEdge);\n bottom: var(--offsetToTheEdge);\n}\n\n.plTooltipContainer.left .plTooltipBeak {\n position-area: left;\n right: 0;\n top: calc(anchor(var(--anchorName) center) - var(--tailWidth) / 2);\n width: var(--tailHeight);\n height: var(--tailWidth);\n clip-path: var(--tailClipLeft);\n}\n\n/* right */\n.plTooltipContainer.right .plTooltipBox {\n position-area: right;\n left: var(--gap);\n top: var(--offsetToTheEdge);\n bottom: var(--offsetToTheEdge);\n}\n\n.plTooltipContainer.right .plTooltipBeak {\n position-area: right;\n left: 0;\n top: calc(anchor(var(--anchorName) center) - var(--tailWidth) / 2);\n width: var(--tailHeight);\n height: var(--tailWidth);\n clip-path: var(--tailClipRight);\n}\n\n/* top left */\n.plTooltipContainer.topLeft .plTooltipBox {\n position-area: top;\n bottom: var(--gap);\n left: anchor(var(--anchorName) left);\n}\n.plTooltipContainer.topLeft .plTooltipBeak {\n position-area: top;\n bottom: 0;\n left: calc(anchor(var(--anchorName) center) - var(--tailWidth) / 2);\n clip-path: var(--tailClipTop);\n}\n\n:global(.pl-tooltip-fade-leave-active),\n:global(.pl-tooltip-fade-enter-active) {\n z-index: var(--z-tooltip);\n transition: opacity 0.2s ease-in-out;\n}\n:global(.pl-tooltip-fade-enter-from),\n:global(.pl-tooltip-fade-leave-to) {\n opacity: 0;\n}\n\n.plTooltipContent a {\n color: var(--tooltip-link-color);\n}\n\n.plTooltipContent p {\n margin-bottom: 8px;\n}\n\n.plTooltipContent ul,\n.plTooltipContent li {\n margin-left: 6px;\n padding-left: 6px;\n}\n\n.plTooltipContent li {\n margin-bottom: 4px;\n}\n</style>\n"],"names":["__default__","emit","__emit","tKey","props","__props","data","reactive","tMap","closeTooltip","watch","v","clearTimeout","showTooltip","k","f","onOver","utils.delay","onLeave","utils.timeout","hide","rootRef","ref","tooltip","useClickOutside","onUnmounted","anchorName","uniqueId","_createBlock","_resolveDynamicComponent","_mergeProps","$style","$attrs","_renderSlot","_ctx","_createVNode","_Transition","$slots","_Teleport","_createElementVNode","_normalizeClass","_normalizeStyle"],"mappings":"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"}
@@ -0,0 +1,26 @@
1
+ const t = "_plTooltipAnchorWrapper_ttgyk_2", o = "_plTooltipContainer_ttgyk_16", p = "_plTooltipContent_ttgyk_36", l = "_plTooltipBox_ttgyk_47", _ = "_plTooltipBeak_ttgyk_53", n = "_top_ttgyk_63", e = "_bottom_ttgyk_77", i = "_left_ttgyk_91", r = "_right_ttgyk_108", T = "_topLeft_ttgyk_125", c = {
2
+ plTooltipAnchorWrapper: t,
3
+ plTooltipContainer: o,
4
+ plTooltipContent: p,
5
+ plTooltipBox: l,
6
+ plTooltipBeak: _,
7
+ top: n,
8
+ bottom: e,
9
+ left: i,
10
+ right: r,
11
+ topLeft: T
12
+ };
13
+ export {
14
+ e as bottom,
15
+ c as default,
16
+ i as left,
17
+ t as plTooltipAnchorWrapper,
18
+ _ as plTooltipBeak,
19
+ l as plTooltipBox,
20
+ o as plTooltipContainer,
21
+ p as plTooltipContent,
22
+ r as right,
23
+ n as top,
24
+ T as topLeft
25
+ };
26
+ //# sourceMappingURL=PlTooltip.vue3.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"PlTooltip.vue3.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}
@@ -31,8 +31,8 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
31
31
  }>, {
32
32
  label: string;
33
33
  error: undefined;
34
- disabled: boolean;
35
34
  mode: SliderMode;
35
+ disabled: boolean;
36
36
  min: number;
37
37
  step: number;
38
38
  helper: string;
@@ -1 +1 @@
1
- {"version":3,"file":"Slider.vue.d.ts","sourceRoot":"","sources":["../../src/components/Slider.vue"],"names":[],"mappings":"AAwNA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAQ3C,KAAK,WAAW,GAAG;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAsIJ,iBAAS,cAAc;WAkIT,OAAO,IAA6B;;yBAZrB,GAAG;;;;;;;EAiB/B;AAqBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;WA1ST,MAAM;;cAMH,OAAO;UAHX,UAAU;SANX,MAAM;UAEL,MAAM;YAEJ,MAAM;aAGL,MAAM;iBACF,OAAO;;;;kBA+SvB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
1
+ {"version":3,"file":"Slider.vue.d.ts","sourceRoot":"","sources":["../../src/components/Slider.vue"],"names":[],"mappings":"AAwNA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAQ3C,KAAK,WAAW,GAAG;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAsIJ,iBAAS,cAAc;WAkIT,OAAO,IAA6B;;yBAZrB,GAAG;;;;;;;EAiB/B;AAqBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;WA1ST,MAAM;;UAGP,UAAU;cAGN,OAAO;SATZ,MAAM;UAEL,MAAM;YAEJ,MAAM;aAGL,MAAM;iBACF,OAAO;;;;kBA+SvB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}