@devix-tecnologia/timeline-vue 1.1.0 → 1.1.2

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 (42) hide show
  1. package/README.md +50 -35
  2. package/dist/style.css +1 -1
  3. package/dist/timeline-vue.es.js +166 -176
  4. package/dist/types/components/timeline/moleculas/PerfilTimeline.vue.d.ts +0 -1
  5. package/dist/types/components/timeline/organismos/Timeline.vue.d.ts +1 -0
  6. package/package.json +2 -2
  7. package/src/assets/vue.svg +0 -1
  8. package/src/components/timeline/atomos/AvatarTimeline.stories.ts +0 -32
  9. package/src/components/timeline/atomos/AvatarTimeline.vue +0 -51
  10. package/src/components/timeline/atomos/BoxData.stories.ts +0 -41
  11. package/src/components/timeline/atomos/BoxData.vue +0 -57
  12. package/src/components/timeline/atomos/Destaque.stories.ts +0 -24
  13. package/src/components/timeline/atomos/Destaque.vue +0 -39
  14. package/src/components/timeline/atomos/Hora.stories.ts +0 -36
  15. package/src/components/timeline/atomos/Hora.vue +0 -50
  16. package/src/components/timeline/atomos/IconeCategoria.stories.ts +0 -60
  17. package/src/components/timeline/atomos/IconeCategoria.vue +0 -110
  18. package/src/components/timeline/atomos/IconeStatus.stories.ts +0 -38
  19. package/src/components/timeline/atomos/IconeStatus.vue +0 -73
  20. package/src/components/timeline/atomos/SubtituloEvento.stories.ts +0 -24
  21. package/src/components/timeline/atomos/SubtituloEvento.vue +0 -33
  22. package/src/components/timeline/atomos/TituloEvento.stories.ts +0 -24
  23. package/src/components/timeline/atomos/TituloEvento.vue +0 -32
  24. package/src/components/timeline/index.ts +0 -7
  25. package/src/components/timeline/moleculas/DescricaoEvento.stories.ts +0 -31
  26. package/src/components/timeline/moleculas/DescricaoEvento.vue +0 -59
  27. package/src/components/timeline/moleculas/EventoTimeline.stories.ts +0 -94
  28. package/src/components/timeline/moleculas/EventoTimeline.vue +0 -158
  29. package/src/components/timeline/moleculas/HoraEvento.stories.ts +0 -37
  30. package/src/components/timeline/moleculas/HoraEvento.vue +0 -74
  31. package/src/components/timeline/moleculas/PerfilTimeline.stories.ts +0 -40
  32. package/src/components/timeline/moleculas/PerfilTimeline.vue +0 -102
  33. package/src/components/timeline/moleculas/SeparadorPeriodo.stories.ts +0 -42
  34. package/src/components/timeline/moleculas/SeparadorPeriodo.vue +0 -100
  35. package/src/components/timeline/moleculas/Topo.vue +0 -38
  36. package/src/components/timeline/organismos/Timeline.mock.ts +0 -311
  37. package/src/components/timeline/organismos/Timeline.stories.ts +0 -48
  38. package/src/components/timeline/organismos/Timeline.vue +0 -212
  39. package/src/components/timeline/type.ts +0 -34
  40. package/src/global.css +0 -98
  41. package/src/index.ts +0 -16
  42. package/src/vite-env.d.ts +0 -1
@@ -1,5 +1,5 @@
1
- import { defineComponent as d, reactive as C, computed as y, openBlock as n, createElementBlock as c, createElementVNode as T, normalizeClass as q, normalizeStyle as A, toDisplayString as v, resolveComponent as p, createVNode as g, ref as I, createBlock as b, createCommentVNode as P, onMounted as M, onUnmounted as O, Fragment as w, renderList as B } from "vue";
2
- const F = d({
1
+ import { defineComponent as d, reactive as C, computed as y, openBlock as a, createElementBlock as i, createElementVNode as T, normalizeClass as q, normalizeStyle as z, toDisplayString as v, resolveComponent as _, createVNode as f, ref as j, createBlock as b, createCommentVNode as E, Fragment as B, renderList as H } from "vue";
2
+ const M = d({
3
3
  name: "categoria",
4
4
  props: {
5
5
  iconeCategoria: {
@@ -37,24 +37,24 @@ const F = d({
37
37
  };
38
38
  }
39
39
  });
40
- const _ = (e, t) => {
41
- const a = e.__vccOpts || e;
42
- for (const [r, i] of t)
43
- a[r] = i;
44
- return a;
45
- }, H = { class: "areaCategoria" }, L = ["alt"], N = { class: "material-symbols-outlined" };
46
- function R(e, t, a, r, i, u) {
47
- return n(), c("div", H, [
40
+ const p = (e, t) => {
41
+ const r = e.__vccOpts || e;
42
+ for (const [s, l] of t)
43
+ r[s] = l;
44
+ return r;
45
+ }, O = { class: "areaCategoria" }, N = ["alt"], L = { class: "material-symbols-outlined" };
46
+ function R(e, t, r, s, l, u) {
47
+ return a(), i("div", O, [
48
48
  T("div", {
49
49
  class: q(["iconeCategoria", e.classes]),
50
- style: A(e.style),
50
+ style: z(e.style),
51
51
  alt: e.categoria
52
52
  }, [
53
- T("span", N, v(e.iconeCategoria), 1)
54
- ], 14, L)
53
+ T("span", L, v(e.iconeCategoria), 1)
54
+ ], 14, N)
55
55
  ]);
56
56
  }
57
- const V = /* @__PURE__ */ _(F, [["render", R], ["__scopeId", "data-v-01127706"]]), Y = d({
57
+ const F = /* @__PURE__ */ p(M, [["render", R], ["__scopeId", "data-v-01127706"]]), w = d({
58
58
  name: "status",
59
59
  props: {
60
60
  status: {
@@ -71,12 +71,12 @@ const V = /* @__PURE__ */ _(F, [["render", R], ["__scopeId", "data-v-01127706"]]
71
71
  };
72
72
  }
73
73
  });
74
- function J(e, t, a, r, i, u) {
75
- return n(), c("div", {
74
+ function V(e, t, r, s, l, u) {
75
+ return a(), i("div", {
76
76
  class: q([e.classes, "iconeStatus"])
77
77
  }, null, 2);
78
78
  }
79
- const U = /* @__PURE__ */ _(Y, [["render", J], ["__scopeId", "data-v-22a8820e"]]), G = d({
79
+ const J = /* @__PURE__ */ p(w, [["render", V], ["__scopeId", "data-v-22a8820e"]]), Y = d({
80
80
  props: {
81
81
  subtitulo: {
82
82
  required: !0,
@@ -88,11 +88,11 @@ const U = /* @__PURE__ */ _(Y, [["render", J], ["__scopeId", "data-v-22a8820e"]]
88
88
  return {};
89
89
  }
90
90
  });
91
- const K = { class: "subtitulo" };
92
- function Q(e, t, a, r, i, u) {
93
- return n(), c("h4", K, v(e.subtitulo), 1);
91
+ const G = { class: "subtitulo" };
92
+ function K(e, t, r, s, l, u) {
93
+ return a(), i("h4", G, v(e.subtitulo), 1);
94
94
  }
95
- const W = /* @__PURE__ */ _(G, [["render", Q], ["__scopeId", "data-v-f5319628"]]), X = d({
95
+ const Q = /* @__PURE__ */ p(Y, [["render", K], ["__scopeId", "data-v-f5319628"]]), U = d({
96
96
  props: {
97
97
  titulo: {
98
98
  required: !0,
@@ -104,11 +104,11 @@ const W = /* @__PURE__ */ _(G, [["render", Q], ["__scopeId", "data-v-f5319628"]]
104
104
  return {};
105
105
  }
106
106
  });
107
- const Z = { class: "titulo" };
108
- function x(e, t, a, r, i, u) {
109
- return n(), c("h3", Z, v(e.titulo), 1);
107
+ const W = { class: "titulo" };
108
+ function X(e, t, r, s, l, u) {
109
+ return a(), i("h3", W, v(e.titulo), 1);
110
110
  }
111
- const ee = /* @__PURE__ */ _(X, [["render", x], ["__scopeId", "data-v-fce23b0e"]]), te = d({
111
+ const Z = /* @__PURE__ */ p(U, [["render", X], ["__scopeId", "data-v-fce23b0e"]]), x = d({
112
112
  props: {
113
113
  titulo: {
114
114
  required: !0,
@@ -119,29 +119,29 @@ const ee = /* @__PURE__ */ _(X, [["render", x], ["__scopeId", "data-v-fce23b0e"]
119
119
  type: String
120
120
  }
121
121
  },
122
- components: { TituloEvento: ee, SubtituloEvento: W },
122
+ components: { TituloEvento: Z, SubtituloEvento: Q },
123
123
  setup() {
124
124
  return {};
125
125
  }
126
126
  });
127
- const oe = {
127
+ const ee = {
128
128
  key: 0,
129
129
  class: "descricaoEvento"
130
- }, ae = {
130
+ }, te = {
131
131
  key: 1,
132
132
  class: "descricaoEvento",
133
133
  style: { "padding-top": "3.3rem" }
134
134
  };
135
- function ne(e, t, a, r, i, u) {
136
- const l = p("TituloEvento"), S = p("SubtituloEvento");
137
- return e.subtitulo ? (n(), c("div", oe, [
138
- g(l, { titulo: e.titulo }, null, 8, ["titulo"]),
139
- g(S, { subtitulo: e.subtitulo }, null, 8, ["subtitulo"])
140
- ])) : (n(), c("div", ae, [
141
- g(l, { titulo: e.titulo }, null, 8, ["titulo"])
135
+ function oe(e, t, r, s, l, u) {
136
+ const c = _("TituloEvento"), S = _("SubtituloEvento");
137
+ return e.subtitulo ? (a(), i("div", ee, [
138
+ f(c, { titulo: e.titulo }, null, 8, ["titulo"]),
139
+ f(S, { subtitulo: e.subtitulo }, null, 8, ["subtitulo"])
140
+ ])) : (a(), i("div", te, [
141
+ f(c, { titulo: e.titulo }, null, 8, ["titulo"])
142
142
  ]));
143
143
  }
144
- const re = /* @__PURE__ */ _(te, [["render", ne], ["__scopeId", "data-v-bb6e1ced"]]), se = d({
144
+ const ae = /* @__PURE__ */ p(x, [["render", oe], ["__scopeId", "data-v-bb6e1ced"]]), re = d({
145
145
  name: "hora",
146
146
  props: {
147
147
  hora: {
@@ -154,7 +154,7 @@ const re = /* @__PURE__ */ _(te, [["render", ne], ["__scopeId", "data-v-bb6e1ced
154
154
  },
155
155
  components: {},
156
156
  setup(e) {
157
- const t = I(e.aparencia);
157
+ const t = j(e.aparencia);
158
158
  return {
159
159
  classes: y(() => ({
160
160
  [`hora-${t || ""}`]: !0
@@ -162,12 +162,12 @@ const re = /* @__PURE__ */ _(te, [["render", ne], ["__scopeId", "data-v-bb6e1ced
162
162
  };
163
163
  }
164
164
  });
165
- function ie(e, t, a, r, i, u) {
166
- return n(), c("div", {
165
+ function ne(e, t, r, s, l, u) {
166
+ return a(), i("div", {
167
167
  class: q(["hora", e.classes])
168
168
  }, v(e.hora.getHours()) + ":" + v(e.hora.getMinutes().toString().padStart(2, "0")), 3);
169
169
  }
170
- const le = /* @__PURE__ */ _(se, [["render", ie], ["__scopeId", "data-v-071a9ea4"]]), ce = d({
170
+ const se = /* @__PURE__ */ p(re, [["render", ne], ["__scopeId", "data-v-071a9ea4"]]), ie = d({
171
171
  props: {
172
172
  horaPrevista: {
173
173
  type: Date,
@@ -181,27 +181,27 @@ const le = /* @__PURE__ */ _(se, [["render", ie], ["__scopeId", "data-v-071a9ea4
181
181
  // type: String,
182
182
  // },
183
183
  },
184
- components: { Hora: le },
184
+ components: { Hora: se },
185
185
  setup() {
186
186
  return {};
187
187
  }
188
188
  });
189
- const ue = { class: "areaHora" }, de = { class: "horaEvento" };
190
- function _e(e, t, a, r, i, u) {
191
- const l = p("Hora");
192
- return n(), c("div", ue, [
193
- T("div", de, [
194
- e.horaRealizada ? (n(), b(l, {
189
+ const le = { class: "areaHora" }, ce = { class: "horaEvento" };
190
+ function ue(e, t, r, s, l, u) {
191
+ const c = _("Hora");
192
+ return a(), i("div", le, [
193
+ T("div", ce, [
194
+ e.horaRealizada ? (a(), b(c, {
195
195
  key: 0,
196
196
  class: "horaRealizada texto-grande",
197
197
  hora: e.horaRealizada,
198
198
  style: { "padding-top": "0.3rem" }
199
- }, null, 8, ["hora"])) : P("", !0),
200
- e.horaRealizada ? (n(), b(l, {
199
+ }, null, 8, ["hora"])) : E("", !0),
200
+ e.horaRealizada ? (a(), b(c, {
201
201
  key: 1,
202
202
  class: "horaPlanejada texto-pequeno",
203
203
  hora: e.horaPrevista
204
- }, null, 8, ["hora"])) : (n(), b(l, {
204
+ }, null, 8, ["hora"])) : (a(), b(c, {
205
205
  key: 2,
206
206
  class: "horaRealizada texto-grande",
207
207
  hora: e.horaPrevista,
@@ -210,7 +210,7 @@ function _e(e, t, a, r, i, u) {
210
210
  ])
211
211
  ]);
212
212
  }
213
- const pe = /* @__PURE__ */ _(ce, [["render", _e], ["__scopeId", "data-v-04f44efd"]]), me = d({
213
+ const de = /* @__PURE__ */ p(ie, [["render", ue], ["__scopeId", "data-v-04f44efd"]]), pe = d({
214
214
  name: "destaque",
215
215
  props: {
216
216
  destaque: {
@@ -222,11 +222,11 @@ const pe = /* @__PURE__ */ _(ce, [["render", _e], ["__scopeId", "data-v-04f44efd
222
222
  return {};
223
223
  }
224
224
  });
225
- const ve = { class: "destaqueEvento texto-pequeno" };
226
- function fe(e, t, a, r, i, u) {
227
- return n(), c("div", ve, v(e.destaque), 1);
225
+ const _e = { class: "destaqueEvento texto-pequeno" };
226
+ function me(e, t, r, s, l, u) {
227
+ return a(), i("div", _e, v(e.destaque), 1);
228
228
  }
229
- const ge = /* @__PURE__ */ _(me, [["render", fe], ["__scopeId", "data-v-b0b0beb7"]]), ye = d({
229
+ const ve = /* @__PURE__ */ p(pe, [["render", me], ["__scopeId", "data-v-b0b0beb7"]]), ge = d({
230
230
  props: {
231
231
  status: {
232
232
  required: !0,
@@ -270,11 +270,11 @@ const ge = /* @__PURE__ */ _(me, [["render", fe], ["__scopeId", "data-v-b0b0beb7
270
270
  }
271
271
  },
272
272
  components: {
273
- IconeStatus: U,
274
- IconeCategoria: V,
275
- HoraEvento: pe,
276
- DescricaoEvento: re,
277
- Destaque: ge
273
+ IconeStatus: J,
274
+ IconeCategoria: F,
275
+ HoraEvento: de,
276
+ DescricaoEvento: ae,
277
+ Destaque: ve
278
278
  },
279
279
  setup(e) {
280
280
  return {
@@ -288,30 +288,30 @@ const ge = /* @__PURE__ */ _(me, [["render", fe], ["__scopeId", "data-v-b0b0beb7
288
288
  };
289
289
  }
290
290
  });
291
- const $e = ["onclick"];
292
- function he(e, t, a, r, i, u) {
293
- const l = p("IconeStatus"), S = p("HoraEvento"), E = p("IconeCategoria"), o = p("DescricaoEvento"), s = p("Destaque");
294
- return n(), c("article", {
291
+ const fe = ["onclick"];
292
+ function ye(e, t, r, s, l, u) {
293
+ const c = _("IconeStatus"), S = _("HoraEvento"), P = _("IconeCategoria"), o = _("DescricaoEvento"), n = _("Destaque");
294
+ return a(), i("article", {
295
295
  class: q(["eventoTimeline", [e.status, "criticidade-" + e.criticidade, e.eventoSelecionado, e.clicavel]]),
296
296
  onclick: e.aoCLicar
297
297
  }, [
298
- g(l, { status: e.status }, null, 8, ["status"]),
299
- g(S, {
298
+ f(c, { status: e.status }, null, 8, ["status"]),
299
+ f(S, {
300
300
  horaPrevista: e.previsto,
301
301
  horaRealizada: e.realizado
302
302
  }, null, 8, ["horaPrevista", "horaRealizada"]),
303
- g(E, {
303
+ f(P, {
304
304
  iconeCategoria: e.categoria.icone,
305
305
  categoria: e.categoria.nome
306
306
  }, null, 8, ["iconeCategoria", "categoria"]),
307
- g(o, {
307
+ f(o, {
308
308
  titulo: e.titulo,
309
309
  subtitulo: e.subtitulo
310
310
  }, null, 8, ["titulo", "subtitulo"]),
311
- g(s, { destaque: e.destaque }, null, 8, ["destaque"])
312
- ], 10, $e);
311
+ f(n, { destaque: e.destaque }, null, 8, ["destaque"])
312
+ ], 10, fe);
313
313
  }
314
- const be = /* @__PURE__ */ _(ye, [["render", he], ["__scopeId", "data-v-1d1f6a39"]]), Se = d({
314
+ const $e = /* @__PURE__ */ p(ge, [["render", ye]]), he = d({
315
315
  name: "BoxData",
316
316
  props: {
317
317
  dataNumero: {
@@ -331,12 +331,12 @@ const be = /* @__PURE__ */ _(ye, [["render", he], ["__scopeId", "data-v-1d1f6a39
331
331
  };
332
332
  }
333
333
  });
334
- function Te(e, t, a, r, i, u) {
335
- return n(), c("h3", {
334
+ function be(e, t, r, s, l, u) {
335
+ return a(), i("h3", {
336
336
  class: q(["boxData padrao", e.classes])
337
337
  }, v(e.dataNumero), 3);
338
338
  }
339
- const qe = /* @__PURE__ */ _(Se, [["render", Te], ["__scopeId", "data-v-5e2b8273"]]), Ee = d({
339
+ const Se = /* @__PURE__ */ p(he, [["render", be], ["__scopeId", "data-v-5e2b8273"]]), Te = d({
340
340
  name: "SeparadorPeriodo",
341
341
  props: {
342
342
  dataSeparador: {
@@ -347,18 +347,18 @@ const qe = /* @__PURE__ */ _(Se, [["render", Te], ["__scopeId", "data-v-5e2b8273
347
347
  type: String
348
348
  }
349
349
  },
350
- components: { BoxData: qe },
350
+ components: { BoxData: Se },
351
351
  setup(e) {
352
352
  const t = new Array(12);
353
- return t[0] = "Janeiro", t[1] = "Fevereiro", t[2] = "Março", t[3] = "Abril", t[4] = "Maio", t[5] = "Junho", t[6] = "Julho", t[7] = "Agosto", t[8] = "Setembro", t[9] = "Outubro", t[10] = "Novembro", t[11] = "Dezembro", { mesCorrente: (r) => t[r] };
353
+ return t[0] = "Janeiro", t[1] = "Fevereiro", t[2] = "Março", t[3] = "Abril", t[4] = "Maio", t[5] = "Junho", t[6] = "Julho", t[7] = "Agosto", t[8] = "Setembro", t[9] = "Outubro", t[10] = "Novembro", t[11] = "Dezembro", { mesCorrente: (s) => t[s] };
354
354
  }
355
355
  });
356
- const Pe = { class: "separadorPeriodo" }, Ce = { class: "areaData" };
357
- function ke(e, t, a, r, i, u) {
358
- const l = p("BoxData");
359
- return n(), c("div", Pe, [
360
- T("div", Ce, [
361
- g(l, {
356
+ const qe = { class: "separadorPeriodo" }, Pe = { class: "areaData" };
357
+ function Ee(e, t, r, s, l, u) {
358
+ const c = _("BoxData");
359
+ return a(), i("div", qe, [
360
+ T("div", Pe, [
361
+ f(c, {
362
362
  dataNumero: e.dataSeparador.getDate(),
363
363
  aparencia: e.aparencia
364
364
  }, null, 8, ["dataNumero", "aparencia"])
@@ -368,7 +368,7 @@ function ke(e, t, a, r, i, u) {
368
368
  }, v(e.mesCorrente(e.dataSeparador.getMonth())) + " de " + v(e.dataSeparador.getFullYear()), 3)
369
369
  ]);
370
370
  }
371
- const De = /* @__PURE__ */ _(Ee, [["render", ke], ["__scopeId", "data-v-de9ead2d"]]), Ie = d({
371
+ const Ce = /* @__PURE__ */ p(Te, [["render", Ee]]), ke = d({
372
372
  props: {
373
373
  imagem: {
374
374
  type: String
@@ -381,20 +381,20 @@ const De = /* @__PURE__ */ _(Ee, [["render", ke], ["__scopeId", "data-v-de9ead2d
381
381
  return {};
382
382
  }
383
383
  });
384
- const ze = { class: "avatar" }, Ae = ["src"], je = {
384
+ const De = { class: "avatar" }, Ie = ["src"], ze = {
385
385
  key: 1,
386
386
  class: "material-symbols-outlined"
387
387
  };
388
- function Me(e, t, a, r, i, u) {
389
- return n(), c("div", ze, [
390
- e.imagem ? (n(), c("img", {
388
+ function Ae(e, t, r, s, l, u) {
389
+ return a(), i("div", De, [
390
+ e.imagem ? (a(), i("img", {
391
391
  key: 0,
392
392
  src: e.imagem
393
- }, null, 8, Ae)) : e.icone ? (n(), c("span", je, v(e.icone), 1)) : P("", !0)
393
+ }, null, 8, Ie)) : e.icone ? (a(), i("span", ze, v(e.icone), 1)) : E("", !0)
394
394
  ]);
395
395
  }
396
- const Oe = /* @__PURE__ */ _(Ie, [["render", Me], ["__scopeId", "data-v-a913d26b"]]), we = d({
397
- components: { AvatarTimeline: Oe },
396
+ const je = /* @__PURE__ */ p(ke, [["render", Ae], ["__scopeId", "data-v-a913d26b"]]), Be = d({
397
+ components: { AvatarTimeline: je },
398
398
  props: {
399
399
  imagemPerfil: {
400
400
  type: String
@@ -411,44 +411,32 @@ const Oe = /* @__PURE__ */ _(Ie, [["render", Me], ["__scopeId", "data-v-a913d26b
411
411
  }
412
412
  },
413
413
  setup(e) {
414
- e = C(e);
415
- const t = y(() => ({
416
- backgroundColor: e.backgroundColor
417
- })), a = I(null), r = I(!1), i = () => {
418
- if (a.value) {
419
- const u = window.pageYOffset || document.documentElement.scrollTop, l = a.value.offsetTop;
420
- r.value = u > l;
421
- }
422
- };
423
- return M(() => {
424
- window.addEventListener("scroll", i);
425
- }), O(() => {
426
- window.removeEventListener("scroll", i);
427
- }), {
428
- style: t,
429
- isFixed: r
414
+ return e = C(e), {
415
+ style: y(() => ({
416
+ backgroundColor: e.backgroundColor
417
+ }))
430
418
  };
431
419
  }
432
420
  });
433
- const Be = { class: "nome" };
434
- function Fe(e, t, a, r, i, u) {
435
- const l = p("AvatarTimeline");
436
- return n(), c("section", {
437
- class: q(["perfilTimeline", { fixed: e.isFixed }]),
438
- ref: "elementoFixo",
439
- style: A(e.style)
421
+ const He = { class: "nome" };
422
+ function Me(e, t, r, s, l, u) {
423
+ const c = _("AvatarTimeline");
424
+ return a(), i("section", {
425
+ class: "perfilTimeline",
426
+ style: z(e.style)
440
427
  }, [
441
- e.imagemPerfil ? (n(), b(l, {
428
+ e.imagemPerfil ? (a(), b(c, {
442
429
  key: 0,
443
430
  imagem: e.imagemPerfil
444
- }, null, 8, ["imagem"])) : e.iconePerfil ? (n(), b(l, {
431
+ }, null, 8, ["imagem"])) : e.iconePerfil ? (a(), b(c, {
445
432
  key: 1,
446
433
  icone: e.iconePerfil
447
- }, null, 8, ["icone"])) : P("", !0),
448
- T("h2", Be, v(e.nomePerfil), 1)
449
- ], 6);
434
+ }, null, 8, ["icone"])) : E("", !0),
435
+ T("h2", He, v(e.nomePerfil), 1)
436
+ ], 4);
450
437
  }
451
- const He = /* @__PURE__ */ _(we, [["render", Fe], ["__scopeId", "data-v-804ffe54"]]), Le = d({
438
+ const Oe = /* @__PURE__ */ p(Be, [["render", Me]]);
439
+ const Ne = d({
452
440
  props: {
453
441
  perfilTimeline: {
454
442
  required: !0,
@@ -460,104 +448,106 @@ const He = /* @__PURE__ */ _(we, [["render", Fe], ["__scopeId", "data-v-804ffe54
460
448
  }
461
449
  },
462
450
  components: {
463
- PerfilTimeline: He,
464
- SeparadorPeriodo: De,
465
- EventoTimeline: be
451
+ PerfilTimeline: Oe,
452
+ SeparadorPeriodo: Ce,
453
+ EventoTimeline: $e
466
454
  },
467
455
  setup(e) {
468
456
  const t = C(
469
457
  e.eventosTimeline
470
458
  );
471
- let a = C(t);
472
- function r() {
473
- a = t;
474
- const o = l(a);
475
- a.map((s) => (o[0].id === s.id ? (s.atual = !0, s.scroll = !0, E()) : (s.atual = !1, s.scroll = !1), {
476
- evento: s
459
+ let r = C(t);
460
+ function s() {
461
+ r = t;
462
+ const o = c(r);
463
+ r.map((n) => (o[0].id === n.id ? (n.atual = !0, n.scroll = !0, P()) : (n.atual = !1, n.scroll = !1), {
464
+ evento: n
477
465
  }));
478
466
  }
479
- const i = () => {
480
- setInterval(r, 6e4);
481
- }, u = (o, s) => {
482
- const m = o.getDay() === s.getDay(), $ = o.getMonth() === s.getMonth(), f = o.getFullYear() === s.getFullYear();
483
- return m && $ && f;
484
- }, l = (o) => {
467
+ const l = () => {
468
+ setInterval(s, 6e4);
469
+ }, u = (o, n) => {
470
+ const m = o.getDay() === n.getDay(), $ = o.getMonth() === n.getMonth(), g = o.getFullYear() === n.getFullYear();
471
+ return m && $ && g;
472
+ }, c = (o) => {
485
473
  if (o) {
486
- const s = Date.now();
474
+ const n = Date.now();
487
475
  let m = null, $ = [];
488
- for (const f of o) {
489
- const h = f.data.getTime();
490
- if (f.status === "planejado" || f.status === "atrasado") {
491
- const k = Math.abs(s - f.data.getTime());
492
- if (m === null || k < m && h <= s)
476
+ for (const g of o) {
477
+ const h = g.data.getTime();
478
+ if (g.status === "planejado" || g.status === "atrasado") {
479
+ const k = Math.abs(n - g.data.getTime());
480
+ if (m === null || k < m && h <= n)
493
481
  m = k, $.length = 0;
494
482
  else if (k > m)
495
483
  continue;
496
- $.push(f);
484
+ $.push(g);
497
485
  }
498
486
  }
499
487
  return $;
500
488
  } else
501
489
  return [];
502
490
  }, S = y(() => {
503
- i();
504
- const o = a.sort(
505
- (s, m) => s.data.getTime() - m.data.getTime()
491
+ l();
492
+ const o = r.sort(
493
+ (n, m) => n.data.getTime() - m.data.getTime()
506
494
  );
507
495
  if (o) {
508
- let s = [], m = null, $ = 0, f;
496
+ let n = [], m = null, $ = 0, g;
509
497
  for (const h of o) {
510
498
  const k = /* @__PURE__ */ new Date(), D = h.data;
511
- f = h.status;
512
- const j = h.tolerancia * 60 * 1e3;
513
- f === "planejado" && D.getTime() + j < k.getTime() && (h.status = "atrasado"), (!m || !u(m, D)) && (m = D, s.push({
499
+ g = h.status;
500
+ const A = h.tolerancia * 60 * 1e3;
501
+ g === "planejado" && D.getTime() + A < k.getTime() && (h.status = "atrasado"), (!m || !u(m, D)) && (m = D, n.push({
514
502
  tipo: "dia",
515
503
  valor: h.data,
516
504
  key: ++$
517
- })), s.push({
505
+ })), n.push({
518
506
  tipo: "evento",
519
507
  valor: h,
520
508
  key: ++$
521
509
  });
522
510
  }
523
- return s;
511
+ return n;
524
512
  } else
525
513
  return [];
526
- }), E = () => {
514
+ }), P = () => {
527
515
  const o = document.querySelector(".atual");
528
516
  o == null || o.scrollIntoView({
529
517
  behavior: "smooth",
530
518
  block: "center"
531
519
  });
532
520
  };
533
- return r(), {
521
+ return s(), {
534
522
  eventosPorTipo: S,
535
- scrollParaItemAtual: E
523
+ scrollParaItemAtual: P
536
524
  };
537
525
  },
538
526
  mounted() {
539
527
  this.scrollParaItemAtual();
540
528
  }
541
529
  });
542
- const Ne = { class: "areaTimeline" }, Re = { class: "timeline" };
543
- function Ve(e, t, a, r, i, u) {
544
- const l = p("PerfilTimeline"), S = p("SeparadorPeriodo"), E = p("EventoTimeline");
545
- return n(), c("div", Ne, [
546
- e.perfilTimeline !== null ? (n(), b(l, {
530
+ const Le = { class: "areaTimeline" };
531
+ function Re(e, t, r, s, l, u) {
532
+ const c = _("PerfilTimeline"), S = _("SeparadorPeriodo"), P = _("EventoTimeline");
533
+ return a(), i("div", Le, [
534
+ e.perfilTimeline !== null ? (a(), b(c, {
547
535
  key: 0,
548
536
  nomePerfil: e.perfilTimeline.nome,
549
537
  imagemPerfil: e.perfilTimeline.imagem,
550
538
  iconePerfil: e.perfilTimeline.icone
551
- }, null, 8, ["nomePerfil", "imagemPerfil", "iconePerfil"])) : P("", !0),
552
- T("section", Re, [
553
- (n(!0), c(w, null, B(e.eventosPorTipo, (o) => (n(), c("div", {
539
+ }, null, 8, ["nomePerfil", "imagemPerfil", "iconePerfil"])) : E("", !0),
540
+ T("section", {
541
+ class: q(["timeline", { marginTop: e.perfilTimeline !== null }])
542
+ }, [
543
+ (a(!0), i(B, null, H(e.eventosPorTipo, (o) => (a(), i("div", {
554
544
  key: o.key
555
545
  }, [
556
- o.tipo === "dia" ? (n(), b(S, {
546
+ o.tipo === "dia" ? (a(), b(S, {
557
547
  key: 0,
558
548
  dataSeparador: o.valor
559
- }, null, 8, ["dataSeparador"])) : P("", !0),
560
- o.tipo === "evento" ? (n(), b(E, {
549
+ }, null, 8, ["dataSeparador"])) : E("", !0),
550
+ o.tipo === "evento" ? (a(), b(P, {
561
551
  key: 1,
562
552
  status: o.valor.status,
563
553
  criticidade: o.valor.criticidade,
@@ -569,26 +559,26 @@ function Ve(e, t, a, r, i, u) {
569
559
  destaque: o.valor.destaque,
570
560
  ehAtual: o.valor.atual,
571
561
  aoCLicar: o.valor.aoCLicar
572
- }, null, 8, ["status", "criticidade", "previsto", "realizado", "categoria", "titulo", "subtitulo", "destaque", "ehAtual", "aoCLicar"])) : P("", !0)
562
+ }, null, 8, ["status", "criticidade", "previsto", "realizado", "categoria", "titulo", "subtitulo", "destaque", "ehAtual", "aoCLicar"])) : E("", !0)
573
563
  ]))), 128))
574
- ])
564
+ ], 2)
575
565
  ]);
576
566
  }
577
- const Ye = /* @__PURE__ */ _(Le, [["render", Ve], ["__scopeId", "data-v-c833bd5f"]]), Je = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
567
+ const Fe = /* @__PURE__ */ p(Ne, [["render", Re]]), we = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
578
568
  __proto__: null
579
- }, Symbol.toStringTag, { value: "Module" })), z = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
569
+ }, Symbol.toStringTag, { value: "Module" })), I = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
580
570
  __proto__: null,
581
- Timeline: Ye,
582
- Tipos: Je
571
+ Timeline: Fe,
572
+ Tipos: we
583
573
  }, Symbol.toStringTag, { value: "Module" }));
584
- const Ge = {
574
+ const Je = {
585
575
  install(e, ...t) {
586
- for (const a in z)
587
- e.component(a, z[a]);
576
+ for (const r in I)
577
+ e.component(r, I[r]);
588
578
  }
589
579
  };
590
580
  export {
591
- Ye as Timeline,
592
- Je as Tipos,
593
- Ge as default
581
+ Fe as Timeline,
582
+ we as Tipos,
583
+ Je as default
594
584
  };
@@ -16,7 +16,6 @@ declare const _default: import("vue").DefineComponent<{
16
16
  style: import("vue").ComputedRef<{
17
17
  backgroundColor: string;
18
18
  }>;
19
- isFixed: import("vue").Ref<boolean>;
20
19
  }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
21
20
  imagemPerfil: {
22
21
  type: StringConstructor;
@@ -1,4 +1,5 @@
1
1
  import { Evento } from "../type";
2
+ import "material-symbols/outlined.css";
2
3
  type TipoEventoTimeline = {
3
4
  tipo: "dia";
4
5
  valor: Date;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@devix-tecnologia/timeline-vue",
3
3
  "private": false,
4
- "version": "1.1.0",
4
+ "version": "1.1.2",
5
5
  "scripts": {
6
6
  "dev": "vite",
7
7
  "build": "vue-tsc && vite build",
@@ -12,6 +12,7 @@
12
12
  },
13
13
  "dependencies": {
14
14
  "@fontsource/material-icons": "^4.5.4",
15
+ "material-symbols": "^0.5.5",
15
16
  "vue": "^3.0.0"
16
17
  },
17
18
  "devDependencies": {
@@ -36,7 +37,6 @@
36
37
  "vue-tsc": "^1.2.0"
37
38
  },
38
39
  "files": [
39
- "src",
40
40
  "dist"
41
41
  ],
42
42
  "types": "./dist/types/index.d.ts",
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path></svg>