@agrotools1/at-components 0.5.0 → 0.5.1-1

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 (59) hide show
  1. package/dist/Checkbox/Checkbox.vue.js +1 -1
  2. package/dist/DataTable/DataTable.d.ts +10 -0
  3. package/dist/DataTable/DataTable.vue.js +56 -50
  4. package/dist/DataTable/DataTable.vue2.js +31 -26
  5. package/dist/DataTable/index.d.ts +10 -0
  6. package/dist/Dropdown/Checklist/Dropdown.Checklist.d.ts +2 -0
  7. package/dist/Dropdown/Dropdown.core.d.ts +22 -3
  8. package/dist/Dropdown/Dropdown.core.vue.js +23 -20
  9. package/dist/Dropdown/Dropdown.core.vue2.js +62 -26
  10. package/dist/Dropdown/Dropdown.core.vue3.js +2 -2
  11. package/dist/Dropdown/Dropdown.types.d.ts +2 -0
  12. package/dist/Filter/components/Filter.types.d.ts +2 -0
  13. package/dist/Filter/components/Filter.vue.js +64 -62
  14. package/dist/Filter/components/Filter.vue2.js +57 -52
  15. package/dist/Input/Input.core.d.ts +9 -0
  16. package/dist/Input/Input.core.vue.js +25 -19
  17. package/dist/Input/Input.core.vue2.js +9 -5
  18. package/dist/Input/index.d.ts +9 -0
  19. package/dist/List/components/List.d.ts +18 -0
  20. package/dist/List/components/List.types.d.ts +2 -0
  21. package/dist/List/components/List.vue.js +33 -30
  22. package/dist/List/components/List.vue2.js +20 -12
  23. package/dist/Loading/Loading.d.ts +10 -0
  24. package/dist/Loading/Loading.vue.js +18 -0
  25. package/dist/Loading/Loading.vue2.js +11 -0
  26. package/dist/Loading/Loading.vue3.js +4 -0
  27. package/dist/Loading/index.d.ts +1 -0
  28. package/dist/Modal/Modal.vue2.js +5 -2
  29. package/dist/ProgressBar/ProgressBar.d.ts +2 -2
  30. package/dist/ProgressBar/ProgressBar.vue.js +4 -4
  31. package/dist/ProgressBar/ProgressBar.vue2.js +48 -38
  32. package/dist/Search/Search.d.ts +15 -7
  33. package/dist/Search/Search.vue.js +36 -25
  34. package/dist/Search/Search.vue2.js +21 -17
  35. package/dist/Select/Multiple/Select.multiple.d.ts +11 -0
  36. package/dist/Select/Multiple/Select.multiple.vue.js +10 -9
  37. package/dist/Select/Multiple/Select.multiple.vue2.js +7 -2
  38. package/dist/Select/Select.core.d.ts +11 -0
  39. package/dist/Select/Select.core.vue.js +8 -7
  40. package/dist/Select/Select.core.vue2.js +8 -3
  41. package/dist/Select/Single/Select.single.d.ts +11 -0
  42. package/dist/Select/Single/Select.single.vue.js +13 -12
  43. package/dist/Select/Single/Select.single.vue2.js +14 -9
  44. package/dist/Select/index.d.ts +22 -0
  45. package/dist/Skeleton/Skeleton.d.ts +25 -0
  46. package/dist/Skeleton/Skeleton.vue.js +16 -0
  47. package/dist/Skeleton/Skeleton.vue2.js +19 -0
  48. package/dist/Skeleton/index.d.ts +1 -22
  49. package/dist/Stepper/Stepper.vue.js +10 -10
  50. package/dist/TableConfig/TableConfig.d.ts +9 -0
  51. package/dist/TableConfig/TableConfig.vue.js +7 -6
  52. package/dist/TableConfig/TableConfig.vue2.js +10 -6
  53. package/dist/Tabs/Tabs.d.ts +13 -0
  54. package/dist/Tabs/Tabs.vue.js +21 -17
  55. package/dist/Tabs/Tabs.vue2.js +31 -22
  56. package/dist/index.d.ts +2 -0
  57. package/dist/index.js +50 -46
  58. package/dist/style.css +1 -1
  59. package/package.json +1 -1
@@ -32,7 +32,7 @@ function m(e, p, b, k, f, y) {
32
32
  }, null, 12, u)
33
33
  ], 64);
34
34
  }
35
- const $ = /* @__PURE__ */ n(r, [["render", m], ["__scopeId", "data-v-ee902d67"]]);
35
+ const $ = /* @__PURE__ */ n(r, [["render", m], ["__scopeId", "data-v-939d784f"]]);
36
36
  export {
37
37
  $ as default
38
38
  };
@@ -40,7 +40,12 @@ declare const _default: import("vue").DefineComponent<{
40
40
  type: PropType<"center" | "left" | "right">;
41
41
  default: string;
42
42
  };
43
+ isLoading: {
44
+ type: PropType<boolean>;
45
+ default: boolean;
46
+ };
43
47
  }, {
48
+ reactiveIsLoading: import("vue").ComputedRef<boolean>;
44
49
  tableData: import("vue").Ref<{
45
50
  [key: string]: unknown;
46
51
  }[]>;
@@ -104,6 +109,10 @@ declare const _default: import("vue").DefineComponent<{
104
109
  type: PropType<"center" | "left" | "right">;
105
110
  default: string;
106
111
  };
112
+ isLoading: {
113
+ type: PropType<boolean>;
114
+ default: boolean;
115
+ };
107
116
  }>> & {
108
117
  "onUpdate:selected-items"?: ((items: any[]) => any) | undefined;
109
118
  "onUpdate:table-data"?: ((data: TableData) => any) | undefined;
@@ -123,5 +132,6 @@ declare const _default: import("vue").DefineComponent<{
123
132
  } | undefined;
124
133
  keyExtractor: (item: any) => string;
125
134
  columnsClasses: string[];
135
+ isLoading: boolean;
126
136
  }, {}>;
127
137
  export default _default;
@@ -1,95 +1,101 @@
1
- import P from "./DataTable.vue2.js";
2
- import { resolveComponent as c, openBlock as t, createElementBlock as o, Fragment as l, createElementVNode as r, mergeProps as v, createBlock as i, createCommentVNode as m, renderSlot as A, renderList as p, normalizeClass as g, withKeys as S, toDisplayString as f, resolveDynamicComponent as w, createVNode as $, pushScopeId as T, popScopeId as D } from "vue";
1
+ import C from "./DataTable.vue2.js";
2
+ import { resolveComponent as i, openBlock as a, createElementBlock as o, Fragment as n, createElementVNode as s, mergeProps as P, createBlock as r, createCommentVNode as p, renderSlot as S, renderList as h, normalizeClass as u, withKeys as A, toDisplayString as g, resolveDynamicComponent as b, createVNode as x, pushScopeId as $, popScopeId as T, createStaticVNode as D } from "vue";
3
3
  import "./DataTable.vue3.js";
4
4
  import E from "../_virtual/_plugin-vue_export-helper.js";
5
- const _ = (e) => (T("data-v-425a5a6f"), e = e(), D(), e), K = ["data-align-columns"], z = { role: "rowgroup" }, I = {
5
+ const w = (e) => ($("data-v-0da2b2f6"), e = e(), T(), e), I = ["data-align-columns"], K = { role: "rowgroup" }, z = {
6
6
  role: "row",
7
7
  class: "thead-row"
8
- }, B = {
8
+ }, N = {
9
9
  key: 1,
10
10
  role: "rowgroup"
11
- }, F = /* @__PURE__ */ _(() => /* @__PURE__ */ r("tr", { class: "empty-space" }, null, -1)), N = ["onmouseenter"], U = ["data-key", "onClick"], V = { class: "td-container" }, j = ["id", "value", "onKeydown"], H = { key: 1 }, L = {
11
+ }, V = /* @__PURE__ */ w(() => /* @__PURE__ */ s("tr", { class: "empty-space" }, null, -1)), B = ["onmouseenter"], F = ["data-key", "onClick"], U = { class: "td-container" }, L = ["id", "value", "onKeydown"], j = { key: 1 }, H = {
12
12
  key: 2,
13
13
  class: "item-as-array"
14
- }, O = { key: 0 }, q = /* @__PURE__ */ _(() => /* @__PURE__ */ r("tr", { class: "empty-space" }, null, -1)), G = {
14
+ }, O = { key: 0 }, q = /* @__PURE__ */ w(() => /* @__PURE__ */ s("tr", { class: "empty-space" }, null, -1)), G = {
15
15
  key: 0,
16
+ class: "d-flex flex-column gap-2 w-100"
17
+ }, J = /* @__PURE__ */ D('<div class="d-flex flex-row gap-2 w-100" data-v-0da2b2f6><div class="card-body placeholder-glow" data-v-0da2b2f6><span class="placeholder col-12 rounded" style="height:40px;" data-v-0da2b2f6></span></div><div class="card-body placeholder-glow" data-v-0da2b2f6><span class="placeholder col-12 rounded" style="height:40px;" data-v-0da2b2f6></span></div><div class="card-body placeholder-glow" data-v-0da2b2f6><span class="placeholder col-12 rounded" style="height:40px;" data-v-0da2b2f6></span></div></div><div class="d-flex flex-row gap-2 w-100" data-v-0da2b2f6><div class="card-body placeholder-glow" data-v-0da2b2f6><span class="placeholder col-12 rounded" style="height:40px;" data-v-0da2b2f6></span></div><div class="card-body placeholder-glow" data-v-0da2b2f6><span class="placeholder col-12 rounded" style="height:40px;" data-v-0da2b2f6></span></div><div class="card-body placeholder-glow" data-v-0da2b2f6><span class="placeholder col-12 rounded" style="height:40px;" data-v-0da2b2f6></span></div></div><div class="d-flex flex-row gap-2 w-100" data-v-0da2b2f6><div class="card-body placeholder-glow" data-v-0da2b2f6><span class="placeholder col-12 rounded" style="height:40px;" data-v-0da2b2f6></span></div><div class="card-body placeholder-glow" data-v-0da2b2f6><span class="placeholder col-12 rounded" style="height:40px;" data-v-0da2b2f6></span></div><div class="card-body placeholder-glow" data-v-0da2b2f6><span class="placeholder col-12 rounded" style="height:40px;" data-v-0da2b2f6></span></div></div>', 3), M = [
18
+ J
19
+ ], Q = {
20
+ key: 1,
16
21
  style: { display: "flex", "justify-content": "flex-end", "margin-top": "16px" }
17
22
  };
18
- function J(e, M, Q, R, W, X) {
19
- var u;
20
- const b = c("AtColumn"), k = c("AtText"), C = c("AtPaginator");
21
- return t(), o(l, null, [
22
- r("table", v(e.$attrs, {
23
+ function R(e, W, X, Y, Z, ee) {
24
+ var v;
25
+ const m = i("AtColumn"), _ = i("AtText"), k = i("AtPaginator");
26
+ return a(), o(n, null, [
27
+ s("table", P(e.$attrs, {
23
28
  role: "table",
24
29
  class: "table-content",
25
30
  "data-align-columns": e.alignColumns
26
31
  }), [
27
- r("thead", z, [
28
- r("tr", I, [
29
- e.withSelection ? (t(), i(b, {
32
+ s("thead", K, [
33
+ s("tr", z, [
34
+ e.withSelection ? (a(), r(m, {
30
35
  key: 0,
31
36
  field: "selection",
32
37
  label: "Selecione"
33
- })) : m("", !0),
34
- A(e.$slots, "default", {}, void 0, !0)
38
+ })) : p("", !0),
39
+ S(e.$slots, "default", {}, void 0, !0)
35
40
  ])
36
41
  ]),
37
- !e.value || !e.value.length ? (t(), i(k, {
42
+ !e.value || !e.value.length ? (a(), r(_, {
38
43
  key: 0,
39
44
  as: "h6"
40
- })) : (t(), o("tbody", B, [
41
- F,
42
- (t(!0), o(l, null, p(e.activeTableData, (d) => (t(), o("tr", {
43
- key: e.extractKey(d),
44
- class: g([...e.columnsClasses, "tbody-tr"]),
45
+ })) : (a(), o("tbody", N, [
46
+ V,
47
+ (a(!0), o(n, null, h(e.activeTableData, (c) => (a(), o("tr", {
48
+ key: e.extractKey(c),
49
+ class: u([...e.columnsClasses, "tbody-tr"]),
45
50
  role: "row",
46
51
  tabindex: "-1",
47
- onmouseenter: (a) => {
52
+ onmouseenter: (d) => {
48
53
  e.lastHoveredTr = {
49
- element: a.target,
50
- item: d
54
+ element: d.target,
55
+ item: c
51
56
  };
52
57
  }
53
58
  }, [
54
- (t(!0), o(l, null, p(e.getEntries(d), ([a, s]) => {
55
- var h, y;
56
- return t(), o("td", {
57
- key: a,
58
- "data-key": a,
59
+ (a(!0), o(n, null, h(e.getEntries(c), ([d, l]) => {
60
+ var f, y;
61
+ return a(), o("td", {
62
+ key: d,
63
+ "data-key": d,
59
64
  role: "cell",
60
- class: g(`tbody-row ${(h = e.withEditableFields) != null && h.includes(a) ? "with-focus" : ""} `),
65
+ class: u(`tbody-row ${(f = e.withEditableFields) != null && f.includes(d) ? "with-focus" : ""} `),
61
66
  "aria-selected": "false",
62
- onClick: (n) => e.handleTrClick(n, a)
67
+ onClick: (t) => e.handleTrClick(t, d)
63
68
  }, [
64
- r("div", V, [
65
- (y = e.withEditableFields) != null && y.includes(a) ? (t(), o("input", {
69
+ s("div", U, [
70
+ (y = e.withEditableFields) != null && y.includes(d) ? (a(), o("input", {
66
71
  key: 0,
67
- id: a,
72
+ id: d,
68
73
  placeholder: "",
69
- value: s,
70
- onKeydown: S((n) => e.updateOnKeyDown(n, a), ["enter"])
71
- }, null, 40, j)) : typeof s == "number" || typeof s == "string" ? (t(), o("span", H, f(s), 1)) : Array.isArray(s) ? (t(), o("div", L, [
72
- (t(!0), o(l, null, p(s, (n) => (t(), o("div", { key: n }, [
73
- typeof n == "number" || typeof n == "string" ? (t(), o("span", O, f(n), 1)) : (t(), i(w(typeof n == "function" ? n() : n), { key: 1 }))
74
+ value: l,
75
+ onKeydown: A((t) => e.updateOnKeyDown(t, d), ["enter"])
76
+ }, null, 40, L)) : typeof l == "number" || typeof l == "string" ? (a(), o("span", j, g(l), 1)) : Array.isArray(l) ? (a(), o("div", H, [
77
+ (a(!0), o(n, null, h(l, (t) => (a(), o("div", { key: t }, [
78
+ typeof t == "number" || typeof t == "string" ? (a(), o("span", O, g(t), 1)) : (a(), r(b(typeof t == "function" ? t() : t), { key: 1 }))
74
79
  ]))), 128))
75
- ])) : (t(), i(w(typeof s == "function" ? s() : s), { key: 3 }))
80
+ ])) : (a(), r(b(typeof l == "function" ? l() : l), { key: 3 }))
76
81
  ])
77
- ], 10, U);
82
+ ], 10, F);
78
83
  }), 128))
79
- ], 10, N))), 128)),
84
+ ], 10, B))), 128)),
80
85
  q
81
86
  ]))
82
- ], 16, K),
83
- e.withPaginator ? (t(), o("div", G, [
84
- $(C, {
87
+ ], 16, I),
88
+ e.reactiveIsLoading ? (a(), o("div", G, M)) : p("", !0),
89
+ e.withPaginator ? (a(), o("div", Q, [
90
+ x(k, {
85
91
  "page-size": e.withPaginator.pageSize,
86
92
  total: e.withPaginator.total,
87
- "onUpdate:activePage": (u = e.withPaginator) == null ? void 0 : u.onUpdatePage
93
+ "onUpdate:activePage": (v = e.withPaginator) == null ? void 0 : v.onUpdatePage
88
94
  }, null, 8, ["page-size", "total", "onUpdate:activePage"])
89
- ])) : m("", !0)
95
+ ])) : p("", !0)
90
96
  ], 64);
91
97
  }
92
- const te = /* @__PURE__ */ E(P, [["render", J], ["__scopeId", "data-v-425a5a6f"]]);
98
+ const le = /* @__PURE__ */ E(C, [["render", R], ["__scopeId", "data-v-0da2b2f6"]]);
93
99
  export {
94
- te as default
100
+ le as default
95
101
  };
@@ -1,6 +1,6 @@
1
- import { defineComponent as T, ref as m, reactive as k, provide as h, readonly as K, inject as j, watch as E, onMounted as x, watchEffect as b, h as O } from "vue";
2
- import q from "../Checkbox/Checkbox.vue.js";
3
- import F from "../Paginator/Paginator.vue.js";
1
+ import { defineComponent as T, ref as d, reactive as k, provide as h, readonly as K, inject as j, watch as E, onMounted as x, watchEffect as b, h as O, computed as q } from "vue";
2
+ import F from "../Checkbox/Checkbox.vue.js";
3
+ import L from "../Paginator/Paginator.vue.js";
4
4
  import { AtTipograph as P } from "../Tipograph/index.js";
5
5
  import V from "./Column/Column.vue.js";
6
6
  const H = T({
@@ -8,7 +8,7 @@ const H = T({
8
8
  components: {
9
9
  AtText: P.Title,
10
10
  AtColumn: V,
11
- AtPaginator: F
11
+ AtPaginator: L
12
12
  },
13
13
  inheritAttrs: !1,
14
14
  props: {
@@ -45,6 +45,10 @@ const H = T({
45
45
  alignColumns: {
46
46
  type: String,
47
47
  default: "left"
48
+ },
49
+ isLoading: {
50
+ type: Boolean,
51
+ default: !1
48
52
  }
49
53
  },
50
54
  emits: {
@@ -52,26 +56,26 @@ const H = T({
52
56
  "update:table-data": (e) => Array.isArray(e),
53
57
  "update:table-cell": (e) => typeof e == "object"
54
58
  },
55
- setup(e, d) {
56
- const u = m(e.value), p = m([...u.value]), f = m([]), c = m(
59
+ setup(e, m) {
60
+ const u = d(e.value), p = d([...u.value]), f = d([]), c = d(
57
61
  null
58
- ), s = k([]), y = (t) => {
59
- s.includes(t) || s.push(t);
62
+ ), r = k([]), y = (t) => {
63
+ r.includes(t) || r.push(t);
60
64
  };
61
65
  h("columns", {
62
- columns: K(s),
66
+ columns: K(r),
63
67
  updateColumn: y
64
68
  }), h("alignColumns", e.alignColumns), h("tableData", u);
65
69
  const w = j("columns", {
66
- columns: s,
70
+ columns: r,
67
71
  updateColumn: y
68
- }), C = (t) => Object.entries(t), r = (t) => {
72
+ }), g = (t) => Object.entries(t), s = (t) => {
69
73
  try {
70
74
  return e.keyExtractor(t);
71
75
  } catch (a) {
72
76
  console.warn("AtDataTable: Não foi possível extrair a key: ", a);
73
77
  }
74
- }, S = (t, a) => {
78
+ }, C = (t, a) => {
75
79
  var l;
76
80
  const o = t.target;
77
81
  if ((l = e.withEditableFields) != null && l.includes(a)) {
@@ -81,23 +85,23 @@ const H = T({
81
85
  }, v = (t) => {
82
86
  f.value = t;
83
87
  const a = [...e.value].filter((o) => {
84
- const l = r(o);
88
+ const l = s(o);
85
89
  return [...f.value].includes(l);
86
90
  });
87
91
  if (c.value) {
88
92
  const { element: o, item: l } = c.value, n = a.find(
89
- (i) => r(i) === r(l)
93
+ (i) => s(i) === s(l)
90
94
  );
91
95
  o.setAttribute("aria-selected", JSON.stringify(!!n));
92
96
  }
93
- d.emit("update:selected-items", Array.from(a));
94
- }, g = (t, a) => {
97
+ m.emit("update:selected-items", Array.from(a));
98
+ }, S = (t, a) => {
95
99
  var i;
96
100
  const o = t.target, { value: l } = o, n = (i = c.value) == null ? void 0 : i.item;
97
101
  n && (n[a] = l, u.value = u.value.map((A) => {
98
- const D = r(A), I = r(n);
102
+ const D = s(A), I = s(n);
99
103
  return D === I ? n : A;
100
- }), d.emit("update:table-data", u.value), d.emit("update:table-cell", {
104
+ }), m.emit("update:table-data", u.value), m.emit("update:table-cell", {
101
105
  field: a,
102
106
  value: l
103
107
  }));
@@ -111,15 +115,15 @@ const H = T({
111
115
  e.withDefaultSelectedItems && v([...e.withDefaultSelectedItems]);
112
116
  }), b(() => {
113
117
  e.withSelection ? u.value = [...e.value].map((t) => ({
114
- selection: () => O(q, {
118
+ selection: () => O(F, {
115
119
  modelValue: f.value,
116
120
  "onUpdate:modelValue": (a) => v(a),
117
- val: r(t)
121
+ val: s(t)
118
122
  }),
119
123
  ...t
120
124
  })) : u.value = [...e.value];
121
125
  }), b(() => {
122
- const t = [...s], a = [...u.value].map((o) => {
126
+ const t = [...r], a = [...u.value].map((o) => {
123
127
  const l = {}, n = Object.keys({ ...o });
124
128
  for (const i of t)
125
129
  n.includes(i) && (l[i] = o[i]);
@@ -127,17 +131,18 @@ const H = T({
127
131
  });
128
132
  p.value = a;
129
133
  }), {
134
+ reactiveIsLoading: q(() => e.isLoading),
130
135
  tableData: u,
131
136
  activeTableData: p,
132
137
  columns: w.columns,
133
138
  updateColumn: w.updateColumn,
134
139
  internalUpdateColumn: y,
135
- internalColumns: s,
140
+ internalColumns: r,
136
141
  lastHoveredTr: c,
137
- getEntries: C,
138
- extractKey: r,
139
- updateOnKeyDown: g,
140
- handleTrClick: S
142
+ getEntries: g,
143
+ extractKey: s,
144
+ updateOnKeyDown: S,
145
+ handleTrClick: C
141
146
  };
142
147
  }
143
148
  });
@@ -39,7 +39,12 @@ export declare const AtDataTable: {
39
39
  type: import("vue").PropType<"center" | "left" | "right">;
40
40
  default: string;
41
41
  };
42
+ isLoading: {
43
+ type: import("vue").PropType<boolean>;
44
+ default: boolean;
45
+ };
42
46
  }, {
47
+ reactiveIsLoading: import("vue").ComputedRef<boolean>;
43
48
  tableData: import("vue").Ref<{
44
49
  [key: string]: unknown;
45
50
  }[]>;
@@ -107,6 +112,10 @@ export declare const AtDataTable: {
107
112
  type: import("vue").PropType<"center" | "left" | "right">;
108
113
  default: string;
109
114
  };
115
+ isLoading: {
116
+ type: import("vue").PropType<boolean>;
117
+ default: boolean;
118
+ };
110
119
  }>> & {
111
120
  "onUpdate:selected-items"?: ((items: any[]) => any) | undefined;
112
121
  "onUpdate:table-data"?: ((data: {
@@ -128,6 +137,7 @@ export declare const AtDataTable: {
128
137
  } | undefined;
129
138
  keyExtractor: (item: any) => string;
130
139
  columnsClasses: string[];
140
+ isLoading: boolean;
131
141
  }, {}>;
132
142
  Column: import("vue").DefineComponent<{
133
143
  field: {
@@ -48,6 +48,7 @@ declare const _default: import("vue").DefineComponent<{
48
48
  identifier?: string | undefined;
49
49
  onClick?: ((item: DropdownListItem) => void) | undefined;
50
50
  }[];
51
+ identifier?: string | undefined;
51
52
  }[]>;
52
53
  listArray: import("vue").Ref<{
53
54
  value: boolean | string[];
@@ -98,6 +99,7 @@ declare const _default: import("vue").DefineComponent<{
98
99
  identifier?: string | undefined;
99
100
  onClick?: ((item: DropdownListItem) => void) | undefined;
100
101
  }[];
102
+ identifier?: string | undefined;
101
103
  }[]>;
102
104
  sortableList: import("vue").Ref<HTMLElement | null>;
103
105
  setAllCheckboxValues: (value: boolean) => void;
@@ -1,4 +1,4 @@
1
- import { type PropType } from "vue";
1
+ import type { CSSProperties, PropType } from "vue";
2
2
  declare const _default: import("vue").DefineComponent<{
3
3
  isOpen: {
4
4
  type: PropType<boolean>;
@@ -8,11 +8,20 @@ declare const _default: import("vue").DefineComponent<{
8
8
  type: PropType<"left" | "right">;
9
9
  default: string;
10
10
  };
11
+ fullSize: {
12
+ type: PropType<boolean | undefined>;
13
+ default: boolean;
14
+ };
15
+ id: {
16
+ type: PropType<string | undefined>;
17
+ default: string;
18
+ };
11
19
  }, {
12
20
  dialogIsOpen: import("vue").Ref<boolean>;
13
21
  getDialogClass: import("vue").ComputedRef<string[]>;
14
- dialogElem: import("vue").Ref<HTMLDivElement | null>;
15
- triggerElem: import("vue").Ref<HTMLDivElement | null>;
22
+ dialogElem: import("vue").Ref<HTMLDivElement | undefined>;
23
+ triggerElem: import("vue").Ref<HTMLDivElement | undefined>;
24
+ dialogStyle: import("vue").Ref<CSSProperties | undefined>;
16
25
  toggleDialog: () => void;
17
26
  openDialog: () => Promise<void>;
18
27
  closeDialog: () => Promise<void>;
@@ -25,10 +34,20 @@ declare const _default: import("vue").DefineComponent<{
25
34
  type: PropType<"left" | "right">;
26
35
  default: string;
27
36
  };
37
+ fullSize: {
38
+ type: PropType<boolean | undefined>;
39
+ default: boolean;
40
+ };
41
+ id: {
42
+ type: PropType<string | undefined>;
43
+ default: string;
44
+ };
28
45
  }>> & {
29
46
  "onUpdate:isOpen"?: ((...args: any[]) => any) | undefined;
30
47
  }, {
31
48
  isOpen: boolean;
49
+ id: string | undefined;
32
50
  position: "left" | "right";
51
+ fullSize: boolean | undefined;
33
52
  }, {}>;
34
53
  export default _default;
@@ -1,32 +1,35 @@
1
- import n from "./Dropdown.core.vue2.js";
2
- import { openBlock as r, createElementBlock as t, createElementVNode as i, normalizeClass as s, renderSlot as l, createCommentVNode as d } from "vue";
1
+ import d from "./Dropdown.core.vue2.js";
2
+ import { openBlock as o, createElementBlock as r, createElementVNode as i, normalizeClass as l, renderSlot as s, createCommentVNode as n, createBlock as g, Teleport as m, normalizeStyle as p } from "vue";
3
3
  import "./Dropdown.core.vue3.js";
4
- import g from "../_virtual/_plugin-vue_export-helper.js";
5
- const m = { class: "container-dialog" };
6
- function p(e, o, c, f, u, $) {
7
- return r(), t("section", m, [
4
+ import c from "../_virtual/_plugin-vue_export-helper.js";
5
+ const f = { class: "container-dialog" }, u = ["id"];
6
+ function $(e, t, k, v, y, C) {
7
+ return o(), r("section", f, [
8
8
  i("div", {
9
- class: s(e.getDialogClass)
9
+ class: l(e.getDialogClass)
10
10
  }, [
11
- e.$slots.trigger ? (r(), t("section", {
11
+ e.$slots.trigger ? (o(), r("section", {
12
12
  key: 0,
13
13
  id: "trigger",
14
14
  ref: "triggerElem",
15
- onClick: o[0] || (o[0] = (...a) => e.toggleDialog && e.toggleDialog(...a))
15
+ onClick: t[0] || (t[0] = (...a) => e.toggleDialog && e.toggleDialog(...a))
16
16
  }, [
17
- l(e.$slots, "trigger", {}, void 0, !0)
18
- ], 512)) : d("", !0),
19
- i("div", {
20
- id: "dialog",
21
- ref: "dialogElem",
22
- class: s({ isOpen: e.dialogIsOpen })
23
- }, [
24
- l(e.$slots, "default", {}, void 0, !0)
25
- ], 2)
17
+ s(e.$slots, "trigger", {}, void 0, !0)
18
+ ], 512)) : n("", !0),
19
+ (o(), g(m, { to: "body" }, [
20
+ i("div", {
21
+ id: e.id,
22
+ ref: "dialogElem",
23
+ class: l([{ isOpen: e.dialogIsOpen }, "dialog-content"]),
24
+ style: p(e.dialogStyle)
25
+ }, [
26
+ s(e.$slots, "default", {}, void 0, !0)
27
+ ], 14, u)
28
+ ]))
26
29
  ], 2)
27
30
  ]);
28
31
  }
29
- const E = /* @__PURE__ */ g(n, [["render", p], ["__scopeId", "data-v-078861b0"]]);
32
+ const _ = /* @__PURE__ */ c(d, [["render", $], ["__scopeId", "data-v-da5e1a91"]]);
30
33
  export {
31
- E as default
34
+ _ as default
32
35
  };
@@ -1,5 +1,5 @@
1
- import { defineComponent as v, ref as o, onMounted as h, computed as c } from "vue";
2
- const D = v({
1
+ import { defineComponent as Y, ref as t, watch as k, onMounted as E, computed as L } from "vue";
2
+ const b = Y({
3
3
  name: "AtDropdown",
4
4
  props: {
5
5
  isOpen: {
@@ -9,37 +9,73 @@ const D = v({
9
9
  position: {
10
10
  type: String,
11
11
  default: "left"
12
+ },
13
+ fullSize: {
14
+ type: Boolean,
15
+ default: !1
16
+ },
17
+ id: {
18
+ type: String,
19
+ default: ""
12
20
  }
13
21
  },
14
22
  emits: ["update:isOpen"],
15
- setup(e, { emit: i }) {
16
- const n = o(!1);
17
- n.value = e.isOpen;
18
- const s = o(), a = o(null), l = o(null), d = async () => i("update:isOpen", !0), u = async () => i("update:isOpen", !1), p = (t) => {
19
- var g, r;
20
- n.value && !((g = a.value) != null && g.contains(t.target)) && !((r = l.value) != null && r.contains(t.target)) && u();
21
- }, f = () => i("update:isOpen", !n.value);
22
- h(() => {
23
- var t;
24
- document.addEventListener("click", p), s.value = (t = document.getElementById("trigger")) == null ? void 0 : t.getBoundingClientRect().right;
23
+ setup(d, { emit: r }) {
24
+ const o = t(!1);
25
+ o.value = d.isOpen;
26
+ const l = t(), a = t(), n = t(), h = t(0), i = t(), p = t(), g = () => {
27
+ var x, O, w, m, C, D;
28
+ h.value = window.scrollY, i.value = (x = a.value) == null ? void 0 : x.getBoundingClientRect();
29
+ const e = (((O = i.value) == null ? void 0 : O.y) ?? 0) + (((w = i.value) == null ? void 0 : w.height) ?? 0) + 8 + h.value, v = {
30
+ left: () => {
31
+ var s, u, c;
32
+ n.value = {
33
+ x: ((s = i.value) == null ? void 0 : s.left) ?? 0,
34
+ y: e
35
+ }, p.value = {
36
+ top: `${((u = n.value) == null ? void 0 : u.y) || 0}px`,
37
+ left: `${((c = n.value) == null ? void 0 : c.x) || 0}px`
38
+ };
39
+ },
40
+ right: () => {
41
+ var s, u, c, S, W;
42
+ n.value = {
43
+ x: (((s = i.value) == null ? void 0 : s.left) ?? 0) - ((((u = l.value) == null ? void 0 : u.clientWidth) ?? 0) - (((c = a.value) == null ? void 0 : c.clientWidth) ?? 0)),
44
+ y: e
45
+ }, p.value = {
46
+ top: `${((S = n.value) == null ? void 0 : S.y) || 0}px`,
47
+ left: `${((W = n.value) == null ? void 0 : W.x) || 0}px`
48
+ };
49
+ }
50
+ }, f = window.innerWidth - (((m = i.value) == null ? void 0 : m.right) ?? 0) <= (((C = l.value) == null ? void 0 : C.offsetWidth) ?? 0) ? "right" : d.position;
51
+ v[f](), d.fullSize && (p.value.width = `${((D = a.value) == null ? void 0 : D.clientWidth) ?? 0}px`);
52
+ };
53
+ k(
54
+ () => d.isOpen,
55
+ (e) => {
56
+ o.value = e, e && g();
57
+ }
58
+ );
59
+ const $ = async () => r("update:isOpen", !0), y = async () => r("update:isOpen", !1), z = (e) => {
60
+ var v, f;
61
+ o.value && !((v = l == null ? void 0 : l.value) != null && v.contains(e.target)) && !((f = a.value) != null && f.contains(e.target)) && y();
62
+ }, B = () => r("update:isOpen", !o.value);
63
+ E(() => {
64
+ document.addEventListener("click", z), window.addEventListener("resize", g), g();
25
65
  });
26
- const m = c(() => e.position !== "right" && window.innerWidth - (s.value ?? 0) <= 216 ? "right" : e.position), O = c(() => ["dialog", m.value]);
66
+ const P = L(() => ["dialog"]);
27
67
  return {
28
- dialogIsOpen: n,
29
- getDialogClass: O,
30
- dialogElem: a,
31
- triggerElem: l,
32
- toggleDialog: f,
33
- openDialog: d,
34
- closeDialog: u
68
+ dialogIsOpen: o,
69
+ getDialogClass: P,
70
+ dialogElem: l,
71
+ triggerElem: a,
72
+ dialogStyle: p,
73
+ toggleDialog: B,
74
+ openDialog: $,
75
+ closeDialog: y
35
76
  };
36
- },
37
- watch: {
38
- isOpen(e) {
39
- this.dialogIsOpen = e;
40
- }
41
77
  }
42
78
  });
43
79
  export {
44
- D as default
80
+ b as default
45
81
  };
@@ -1,4 +1,4 @@
1
- const _ = "";
1
+ const e = "";
2
2
  export {
3
- _ as default
3
+ e as default
4
4
  };
@@ -14,4 +14,6 @@ export interface DropdownListItem {
14
14
  export interface DropdownCoreProps {
15
15
  isOpen: boolean;
16
16
  position: "right" | "left";
17
+ fullSize?: boolean;
18
+ id?: string;
17
19
  }
@@ -2,6 +2,7 @@ import type { DropdownListItem } from "../../Dropdown/Dropdown.types";
2
2
  export type DropdownList = {
3
3
  key: string;
4
4
  value: DropdownListItem[];
5
+ identifier?: string;
5
6
  };
6
7
  export type FilterOptions = {
7
8
  listItemSeparator?: string;
@@ -16,4 +17,5 @@ export type FilterOptions = {
16
17
  export interface DropdownConfigProps {
17
18
  dropDownList: DropdownListItem[] | DropdownList[];
18
19
  options?: FilterOptions;
20
+ id?: string;
19
21
  }