@kiva/kv-components 8.12.0 → 8.12.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.
@@ -1,5 +1,5 @@
1
1
  import n from "@kiva/kv-tokens";
2
- const { colors: e } = n, i = e.gray[100], g = e.gray[300], o = [
2
+ const { colors: e } = n, i = e.gray[200], g = e.gray[300], o = [
3
3
  // Tier 1 — Bold primaries
4
4
  e["eco-green"][3],
5
5
  // #276A43
@@ -1 +1 @@
1
- .segment-circle[data-v-3e2d3156]{transition:stroke-dashoffset .5s ease-in-out}.skeleton-ring[data-v-3e2d3156]{transition:opacity .5s ease-in-out}.legend-dot[data-v-3e2d3156]{transition:background-color .5s ease-in-out}
1
+ .segment-circle[data-v-73c9f5f9]{transition:stroke-dashoffset .5s ease-in-out}.skeleton-ring[data-v-73c9f5f9]{opacity:1;transition:opacity .5s ease-in-out}.skeleton-ring--loading[data-v-73c9f5f9]{animation:skeleton-ring-pulse-73c9f5f9 1.4s ease-in-out infinite;transform-origin:center}.legend-dot[data-v-73c9f5f9]{transition:background-color .5s ease-in-out}@keyframes skeleton-ring-pulse-73c9f5f9{0%,to{opacity:.45}50%{opacity:1}}@media (prefers-reduced-motion: reduce){.skeleton-ring--loading[data-v-73c9f5f9]{animation:none}}
@@ -1,5 +1,5 @@
1
1
  import y from "./KvPieChartV22.js";
2
- import { resolveComponent as x, openBlock as l, createElementBlock as o, createElementVNode as r, normalizeClass as k, createCommentVNode as n, Fragment as d, renderList as c, normalizeStyle as a, toDisplayString as w, createBlock as _, withCtx as b } from "vue";
2
+ import { resolveComponent as x, openBlock as l, createElementBlock as o, createElementVNode as r, normalizeClass as k, createCommentVNode as n, Fragment as d, renderList as c, normalizeStyle as s, toDisplayString as w, createBlock as _, withCtx as b } from "vue";
3
3
  import "./KvPieChartV2.css";
4
4
  import u from "../_virtual/_plugin-vue_export-helper.js";
5
5
  const v = {
@@ -14,25 +14,25 @@ const v = {
14
14
  }, S = ["cx", "cy", "r", "stroke", "stroke-width"], L = ["cx", "cy", "r", "stroke", "stroke-width", "stroke-dasharray", "transform"], O = ["cx", "cy", "r", "stroke", "stroke-width", "stroke-dasharray", "transform"], V = {
15
15
  key: 0,
16
16
  class: "tw-flex tw-flex-wrap tw-justify-center tw-gap-0.5 tw-w-full tw-pt-0.5"
17
- }, W = { class: "tw-flex tw-gap-0.5 tw-items-center tw-min-w-0 tw-overflow-hidden" }, p = { class: "tw-font-medium tw-text-small tw-text-primary tw-whitespace-nowrap tw-truncate" }, B = { class: "tw-flex tw-gap-0.5 tw-items-center tw-shrink-0" }, I = { class: "tw-grid tw-grid-cols-2 tw-grid-flow-row tw-gap-0.5" }, E = { class: "tw-flex tw-gap-0.5 tw-items-center tw-shrink-0 tw-overflow-hidden" }, X = { class: "tw-font-medium tw-text-small tw-text-primary tw-whitespace-nowrap tw-truncate" }, Y = {
17
+ }, W = { class: "tw-flex tw-gap-0.5 tw-items-center tw-min-w-0 tw-overflow-hidden" }, B = { class: "tw-font-medium tw-text-small tw-text-primary tw-whitespace-nowrap tw-truncate" }, p = { class: "tw-flex tw-gap-0.5 tw-items-center tw-shrink-0" }, E = { class: "tw-grid tw-grid-cols-2 tw-grid-flow-row tw-gap-0.5" }, I = { class: "tw-flex tw-gap-0.5 tw-items-center tw-shrink-0 tw-overflow-hidden" }, X = { class: "tw-font-medium tw-text-small tw-text-primary tw-whitespace-nowrap tw-truncate" }, Y = {
18
18
  class: "tw-font-light tw-text-small tw-text-primary tw-text-right tw-shrink-0 tw-tabular-nums",
19
19
  style: { "min-width": "2.8ch" }
20
20
  };
21
- function G(N, s, i, t, M, R) {
21
+ function G(N, i, a, t, M, R) {
22
22
  var h, m;
23
23
  const f = x("kv-lightbox");
24
24
  return l(), o("figure", v, [
25
25
  r("div", C, [
26
26
  (l(), o("svg", D, [
27
- i.loading || !t.hasData ? (l(), o("circle", {
27
+ a.loading || !t.hasData ? (l(), o("circle", {
28
28
  key: 0,
29
29
  cx: t.CX,
30
30
  cy: t.CY,
31
31
  r: t.radius,
32
32
  stroke: t.LOADING_BG_COLOR,
33
- "stroke-width": i.strokeWidth,
33
+ "stroke-width": a.strokeWidth,
34
34
  fill: "none",
35
- class: k(["skeleton-ring tw-opacity-0", { "skeleton-ring--hidden": t.animatedIn }])
35
+ class: k(["skeleton-ring", { "skeleton-ring--loading": a.loading }])
36
36
  }, null, 10, S)) : n("", !0),
37
37
  (l(!0), o(d, null, c(t.visibleSegments, (e) => (l(), o("circle", {
38
38
  key: e.label,
@@ -40,12 +40,12 @@ function G(N, s, i, t, M, R) {
40
40
  cy: t.CY,
41
41
  r: t.radius,
42
42
  stroke: e.color,
43
- "stroke-width": i.strokeWidth,
43
+ "stroke-width": a.strokeWidth,
44
44
  fill: "none",
45
45
  "stroke-dasharray": `${e.dashLength} ${t.circumference * 2}`,
46
46
  transform: `rotate(${e.startDeg}, ${t.CX}, ${t.CY})`,
47
47
  class: "segment-circle",
48
- style: a({
48
+ style: s({
49
49
  strokeDashoffset: e.isVisible ? 0 : e.dashLength,
50
50
  transitionDelay: `${e.delay}ms`
51
51
  })
@@ -56,19 +56,19 @@ function G(N, s, i, t, M, R) {
56
56
  cy: t.CY,
57
57
  r: t.radius,
58
58
  stroke: t.OTHER_SEGMENT_BG_COLOR,
59
- "stroke-width": i.strokeWidth,
59
+ "stroke-width": a.strokeWidth,
60
60
  fill: "none",
61
61
  "stroke-dasharray": `${t.otherSegment.dashLength} ${t.circumference * 2}`,
62
62
  transform: `rotate(${t.otherSegment.startDeg}, ${t.CX}, ${t.CY})`,
63
63
  class: "segment-circle",
64
- style: a({
64
+ style: s({
65
65
  strokeDashoffset: t.otherSegment.isVisible ? 0 : t.otherSegment.dashLength,
66
66
  transitionDelay: `${t.otherSegment.delay}ms`
67
67
  })
68
68
  }, null, 12, O)) : n("", !0)
69
69
  ]))
70
70
  ]),
71
- t.hasData && !i.loading ? (l(), o("div", V, [
71
+ t.hasData && !a.loading ? (l(), o("div", V, [
72
72
  (l(!0), o(d, null, c(t.visibleSegments, (e, g) => (l(), o("div", {
73
73
  key: e.label,
74
74
  class: "tw-bg-gray-100 tw-flex tw-gap-0.5 tw-items-center tw-px-1 tw-py-0.5 tw-rounded-xs"
@@ -76,56 +76,56 @@ function G(N, s, i, t, M, R) {
76
76
  r("div", W, [
77
77
  r("span", {
78
78
  class: "tw-shrink-0 tw-w-1 tw-h-1 tw-rounded-full legend-dot",
79
- style: a({
79
+ style: s({
80
80
  backgroundColor: e.isVisible ? e.color : "#d1d5db",
81
81
  transitionDelay: `${e.delay}ms`
82
82
  })
83
83
  }, null, 4),
84
- r("span", p, w(e.label), 1)
84
+ r("span", B, w(e.label), 1)
85
85
  ]),
86
86
  r("span", {
87
87
  class: "tw-font-light tw-text-small tw-text-primary tw-text-right tw-shrink-0 tw-tabular-nums",
88
- style: a({ minWidth: t.valueMinWidth })
88
+ style: s({ minWidth: t.valueMinWidth })
89
89
  }, w(t.formatDisplayValue(g)), 5)
90
90
  ]))), 128)),
91
91
  t.otherItems.length > 0 ? (l(), o("button", {
92
92
  key: 0,
93
93
  class: "tw-bg-gray-100 tw-flex tw-gap-0.5 tw-items-center tw-px-1 tw-py-0.5 tw-rounded-xs tw-cursor-pointer tw-border-0 tw-text-left",
94
94
  type: "button",
95
- onClick: s[0] || (s[0] = (e) => t.showOtherLightbox = !0)
95
+ onClick: i[0] || (i[0] = (e) => t.showOtherLightbox = !0)
96
96
  }, [
97
- r("div", B, [
97
+ r("div", p, [
98
98
  r("span", {
99
99
  class: "tw-shrink-0 tw-w-1 tw-h-1 tw-rounded-full legend-dot",
100
- style: a({
100
+ style: s({
101
101
  backgroundColor: (h = t.otherSegment) != null && h.isVisible ? "#C4C4C4" : "#d1d5db",
102
102
  transitionDelay: `${((m = t.otherSegment) == null ? void 0 : m.delay) ?? 0}ms`
103
103
  })
104
104
  }, null, 4),
105
- s[2] || (s[2] = r("span", { class: "tw-font-medium tw-text-small tw-text-primary tw-whitespace-nowrap" }, " Other ", -1))
105
+ i[2] || (i[2] = r("span", { class: "tw-font-medium tw-text-small tw-text-primary tw-whitespace-nowrap" }, " Other ", -1))
106
106
  ]),
107
107
  r("span", {
108
108
  class: "tw-font-light tw-text-small tw-text-primary tw-text-right tw-shrink-0 tw-tabular-nums",
109
- style: a({ minWidth: t.valueMinWidth })
109
+ style: s({ minWidth: t.valueMinWidth })
110
110
  }, w(t.formatOtherDisplayValue()), 5)
111
111
  ])) : n("", !0)
112
112
  ])) : n("", !0),
113
- t.hasData && !i.loading ? (l(), _(f, {
113
+ t.hasData && !a.loading ? (l(), _(f, {
114
114
  key: 1,
115
115
  visible: t.showOtherLightbox,
116
116
  title: "Other",
117
- onLightboxClosed: s[1] || (s[1] = (e) => t.showOtherLightbox = !1)
117
+ onLightboxClosed: i[1] || (i[1] = (e) => t.showOtherLightbox = !1)
118
118
  }, {
119
119
  default: b(() => [
120
- r("div", I, [
120
+ r("div", E, [
121
121
  (l(!0), o(d, null, c(t.allItemsWithColors, (e) => (l(), o("div", {
122
122
  key: e.label,
123
123
  class: "tw-bg-gray-100 tw-flex tw-gap-0.5 tw-items-center tw-px-1 tw-py-0.5 tw-rounded-xs tw-justify-between tw-w-full"
124
124
  }, [
125
- r("div", E, [
125
+ r("div", I, [
126
126
  r("span", {
127
127
  class: "tw-shrink-0 tw-w-1 tw-h-1 tw-rounded-full",
128
- style: a({ backgroundColor: e.color })
128
+ style: s({ backgroundColor: e.color })
129
129
  }, null, 4),
130
130
  r("span", X, w(e.label), 1)
131
131
  ]),
@@ -137,7 +137,7 @@ function G(N, s, i, t, M, R) {
137
137
  }, 8, ["visible"])) : n("", !0)
138
138
  ]);
139
139
  }
140
- const A = /* @__PURE__ */ u(y, [["render", G], ["__scopeId", "data-v-3e2d3156"]]);
140
+ const A = /* @__PURE__ */ u(y, [["render", G], ["__scopeId", "data-v-73c9f5f9"]]);
141
141
  export {
142
142
  A as default
143
143
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kiva/kv-components",
3
- "version": "8.12.0",
3
+ "version": "8.12.1",
4
4
  "type": "module",
5
5
  "publishConfig": {
6
6
  "access": "public"
@@ -125,5 +125,5 @@
125
125
  "embla-carousel-fade",
126
126
  "popper.js"
127
127
  ],
128
- "gitHead": "395f5add0d2149a52dd1e07d7df2da2a321ab11a"
128
+ "gitHead": "e59ae2dea66fcfd4999501f2a72f483216950354"
129
129
  }