@leaflink/stash 50.12.0 → 50.12.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 (155) hide show
  1. package/dist/Accordion.js +14 -14
  2. package/dist/ActionsDropdown.js +2 -2
  3. package/dist/AddressSelect.js +2 -2
  4. package/dist/Alert.js +6 -6
  5. package/dist/AppNavigationItem.js +8 -8
  6. package/dist/AppSidebar.js +8 -8
  7. package/dist/AppTopbar.js +3 -3
  8. package/dist/Avatar.js +3 -3
  9. package/dist/Backdrop.js +2 -2
  10. package/dist/Badge.js +2 -2
  11. package/dist/Box.js +1 -1
  12. package/dist/{Box.vue_vue_type_script_setup_true_lang-DgJHq-09.js → Box.vue_vue_type_script_setup_true_lang-rFnvwLVY.js} +3 -3
  13. package/dist/{Box.vue_vue_type_script_setup_true_lang-DgJHq-09.js.map → Box.vue_vue_type_script_setup_true_lang-rFnvwLVY.js.map} +1 -1
  14. package/dist/Button.js +3 -3
  15. package/dist/ButtonGroup.js +4 -4
  16. package/dist/Card.js +7 -7
  17. package/dist/CardContent.js +2 -2
  18. package/dist/CardFooter.js +2 -2
  19. package/dist/CardHeader.js +4 -4
  20. package/dist/CardMedia.js +6 -6
  21. package/dist/Carousel.js +33 -33
  22. package/dist/Carousel.js.map +1 -1
  23. package/dist/Checkbox.js +7 -7
  24. package/dist/ChevronToggle.js +1 -1
  25. package/dist/{ChevronToggle.vue_vue_type_script_setup_true_lang-DuvluoTi.js → ChevronToggle.vue_vue_type_script_setup_true_lang-Ce_qOXfR.js} +3 -3
  26. package/dist/{ChevronToggle.vue_vue_type_script_setup_true_lang-DuvluoTi.js.map → ChevronToggle.vue_vue_type_script_setup_true_lang-Ce_qOXfR.js.map} +1 -1
  27. package/dist/Chip.js +7 -7
  28. package/dist/ConfirmationCodeInput.js +6 -6
  29. package/dist/ContextSwitcher.js +1 -1
  30. package/dist/Copy.js +1 -1
  31. package/dist/CurrencyInput.js +115 -111
  32. package/dist/CurrencyInput.js.map +1 -1
  33. package/dist/DataView.js +3 -3
  34. package/dist/DataView.keys-aSOnA4AD.js.map +1 -1
  35. package/dist/DataViewFilters.js +3 -3
  36. package/dist/DataViewSortButton.js +10 -10
  37. package/dist/DataViewToolbar.js +1 -1
  38. package/dist/DatePicker.js +1080 -1037
  39. package/dist/DatePicker.js.map +1 -1
  40. package/dist/DescriptionList.js +2 -2
  41. package/dist/DescriptionListDetail.js +2 -2
  42. package/dist/DescriptionListGroup.js +2 -2
  43. package/dist/DescriptionListTerm.js +3 -3
  44. package/dist/Dialog.js +1 -1
  45. package/dist/Divider.js +2 -2
  46. package/dist/Dropdown.js +9 -9
  47. package/dist/EmptyState.js +2 -2
  48. package/dist/Expand.js +1 -1
  49. package/dist/{Expand.vue_vue_type_script_setup_true_lang-D0fSAtHr.js → Expand.vue_vue_type_script_setup_true_lang-CiONJfAp.js} +5 -5
  50. package/dist/{Expand.vue_vue_type_script_setup_true_lang-D0fSAtHr.js.map → Expand.vue_vue_type_script_setup_true_lang-CiONJfAp.js.map} +1 -1
  51. package/dist/Field.js +1 -1
  52. package/dist/{Field.vue_vue_type_script_setup_true_lang-DEizIcDo.js → Field.vue_vue_type_script_setup_true_lang-DRaKs9Lm.js} +6 -6
  53. package/dist/{Field.vue_vue_type_script_setup_true_lang-DEizIcDo.js.map → Field.vue_vue_type_script_setup_true_lang-DRaKs9Lm.js.map} +1 -1
  54. package/dist/FileUpload.js +7 -7
  55. package/dist/FilterChip.js +1 -1
  56. package/dist/FilterDrawerItem.js +9 -9
  57. package/dist/FilterDropdown.js +1 -1
  58. package/dist/FilterSelect.js +4 -4
  59. package/dist/Filters.js +18 -18
  60. package/dist/HttpError.js +9 -9
  61. package/dist/Icon.js +2 -2
  62. package/dist/IconLabel.js +2 -2
  63. package/dist/Illustration.js +2 -2
  64. package/dist/{Illustration.vue_vue_type_script_setup_true_lang-CYddAFtS.js → Illustration.vue_vue_type_script_setup_true_lang-BBqgoJO8.js} +3 -3
  65. package/dist/{Illustration.vue_vue_type_script_setup_true_lang-CYddAFtS.js.map → Illustration.vue_vue_type_script_setup_true_lang-BBqgoJO8.js.map} +1 -1
  66. package/dist/Image.js +2 -2
  67. package/dist/{Image.vue_vue_type_script_setup_true_lang-YUNunj71.js → Image.vue_vue_type_script_setup_true_lang-D5u4av0_.js} +3 -3
  68. package/dist/{Image.vue_vue_type_script_setup_true_lang-YUNunj71.js.map → Image.vue_vue_type_script_setup_true_lang-D5u4av0_.js.map} +1 -1
  69. package/dist/InlineEdit.js +5 -5
  70. package/dist/Input.js +2 -2
  71. package/dist/InputOptions.js +2 -2
  72. package/dist/IntegrationIcon.js +2 -2
  73. package/dist/Label.js +1 -1
  74. package/dist/{Label.vue_vue_type_script_setup_true_lang-C4JKdqvC.js → Label.vue_vue_type_script_setup_true_lang-DPnNUfc6.js} +3 -3
  75. package/dist/{Label.vue_vue_type_script_setup_true_lang-C4JKdqvC.js.map → Label.vue_vue_type_script_setup_true_lang-DPnNUfc6.js.map} +1 -1
  76. package/dist/LicenseChip.js +2 -2
  77. package/dist/ListItem.js +1 -1
  78. package/dist/ListItemCell.js +2 -2
  79. package/dist/ListView.js +11 -11
  80. package/dist/Loading.js +2 -2
  81. package/dist/Logo.js +1 -1
  82. package/dist/{Logo.vue_vue_type_script_setup_true_lang-BfUU9J9O.js → Logo.vue_vue_type_script_setup_true_lang-Dz8c98sc.js} +4 -4
  83. package/dist/{Logo.vue_vue_type_script_setup_true_lang-BfUU9J9O.js.map → Logo.vue_vue_type_script_setup_true_lang-Dz8c98sc.js.map} +1 -1
  84. package/dist/Menu.js +2 -2
  85. package/dist/MenuItem.js +2 -2
  86. package/dist/Metric.js +5 -5
  87. package/dist/Modal.js +20 -20
  88. package/dist/Modals.js +6 -6
  89. package/dist/Module.js +3 -3
  90. package/dist/ModuleContent.js +3 -3
  91. package/dist/ModuleFooter.js +2 -2
  92. package/dist/ModuleHeader.js +2 -2
  93. package/dist/ModuleHeader.js.map +1 -1
  94. package/dist/ObfuscateText.js +7 -7
  95. package/dist/PageContent.js +3 -3
  96. package/dist/PageHeader.js +6 -6
  97. package/dist/PageNavigation.js +1 -1
  98. package/dist/Paginate.js +6 -6
  99. package/dist/PlaidLink.js +2 -2
  100. package/dist/QuickAction.js +2 -2
  101. package/dist/Radio.js +2 -2
  102. package/dist/RadioGroup.js +2 -2
  103. package/dist/RadioNew.js +1 -1
  104. package/dist/RangeInput.js +2 -2
  105. package/dist/SearchBar.js +3 -3
  106. package/dist/Select.js +4 -4
  107. package/dist/Select.js.map +1 -1
  108. package/dist/SelectStatus.js +7 -7
  109. package/dist/Skeleton.js +4 -4
  110. package/dist/Step.js +6 -6
  111. package/dist/Stepper.js +9 -9
  112. package/dist/Switch.js +7 -7
  113. package/dist/Tab.js +4 -4
  114. package/dist/TabPanel.js +2 -2
  115. package/dist/Table.js +1 -1
  116. package/dist/TableCell.js +5 -5
  117. package/dist/TableHeaderCell.js +2 -2
  118. package/dist/TableHeaderRow.js +4 -4
  119. package/dist/TableRow.js +4 -4
  120. package/dist/TableRow.js.map +1 -1
  121. package/dist/TableRow.vue.d.ts +12 -8
  122. package/dist/Tabs.js +2 -2
  123. package/dist/{Tabs.vue_vue_type_script_setup_true_lang-NZm1OrRT.js → Tabs.vue_vue_type_script_setup_true_lang-CmnBP4i1.js} +4 -4
  124. package/dist/{Tabs.vue_vue_type_script_setup_true_lang-NZm1OrRT.js.map → Tabs.vue_vue_type_script_setup_true_lang-CmnBP4i1.js.map} +1 -1
  125. package/dist/TextEditor.js +3313 -3291
  126. package/dist/TextEditor.js.map +1 -1
  127. package/dist/Textarea.js +3 -3
  128. package/dist/Thumbnail.js +7 -7
  129. package/dist/Thumbnail.js.map +1 -1
  130. package/dist/ThumbnailEmpty.js +3 -3
  131. package/dist/ThumbnailGroup.js +6 -6
  132. package/dist/ThumbnailGroup.js.map +1 -1
  133. package/dist/{ThumbnailGroup.keys-D6WL5xQ5.js → ThumbnailGroup.keys-EJ4qFNhx.js} +2 -2
  134. package/dist/{ThumbnailGroup.keys-D6WL5xQ5.js.map → ThumbnailGroup.keys-EJ4qFNhx.js.map} +1 -1
  135. package/dist/Timeline.js +2 -2
  136. package/dist/TimelineItem.js +3 -3
  137. package/dist/Toast.js +277 -280
  138. package/dist/Toast.js.map +1 -1
  139. package/dist/Toasts.js +1 -1
  140. package/dist/Tooltip.js +1 -1
  141. package/dist/components.css +1 -1
  142. package/dist/{formatDateTime-C8CYECpd.js → formatDateTime-Dz8bXV0R.js} +98 -12
  143. package/dist/{formatDateTime-C8CYECpd.js.map → formatDateTime-Dz8bXV0R.js.map} +1 -1
  144. package/dist/index.js +2 -2
  145. package/dist/searchFuzzy-DRasJ33G.js +409 -0
  146. package/dist/{searchFuzzy-DKooyZM8.js.map → searchFuzzy-DRasJ33G.js.map} +1 -1
  147. package/dist/storage.js +3 -3
  148. package/dist/{toTimeZone-CVE1ZmsS.js → toTimeZone-Coq1oPTt.js} +7 -9
  149. package/dist/{toTimeZone-CVE1ZmsS.js.map → toTimeZone-Coq1oPTt.js.map} +1 -1
  150. package/dist/useSearch.js +1 -1
  151. package/dist/utils/formatDateTime.js +2 -2
  152. package/dist/utils/searchFuzzy.js +1 -1
  153. package/dist/utils/toTimeZone.js +1 -1
  154. package/package.json +16 -16
  155. package/dist/searchFuzzy-DKooyZM8.js +0 -407
package/dist/Switch.js CHANGED
@@ -1,4 +1,4 @@
1
- import { defineComponent as v, useAttrs as g, useSlots as y, useCssModule as C, computed as o, openBlock as i, createElementBlock as d, normalizeClass as s, unref as a, createElementVNode as c, mergeProps as S, withDirectives as A, vModelCheckbox as V, toDisplayString as u, createCommentVNode as _, renderSlot as B, createTextVNode as M } from "vue";
1
+ import { defineComponent as v, useAttrs as g, useSlots as y, useCssModule as C, computed as o, createElementBlock as i, openBlock as d, unref as a, normalizeClass as s, createElementVNode as c, createCommentVNode as u, mergeProps as S, withDirectives as A, vModelCheckbox as V, toDisplayString as _, renderSlot as B, createTextVNode as M } from "vue";
2
2
  import T from "@leaflink/snitch";
3
3
  import E from "lodash-es/uniqueId";
4
4
  import { _ as N } from "./_plugin-vue_export-helper-CHgC5LLL.js";
@@ -31,7 +31,7 @@ const D = ["data-test"], I = ["for"], $ = ["id", "disabled", "name", "value"], q
31
31
  m("update:checked", e);
32
32
  }
33
33
  }), r = o(() => t.id || E("switch-"));
34
- return (e, w) => (i(), d("div", {
34
+ return (e, w) => (d(), i("div", {
35
35
  class: s(["stash-switch", a(l).class]),
36
36
  "data-test": a(l)["data-test"] || "stash-switch"
37
37
  }, [
@@ -77,7 +77,7 @@ const D = ["data-test"], I = ["for"], $ = ["id", "disabled", "name", "value"], q
77
77
  }, null, 8, $), [
78
78
  [V, h.value]
79
79
  ]),
80
- t.label ? (i(), d("span", {
80
+ t.label ? (d(), i("span", {
81
81
  key: 0,
82
82
  class: s([{
83
83
  "tw-text-ice-900": t.checked && !t.disabled,
@@ -87,17 +87,17 @@ const D = ["data-test"], I = ["for"], $ = ["id", "disabled", "name", "value"], q
87
87
  "stash-switch__label-text--disabled tw-text-ice-500": t.disabled
88
88
  }, "stash-switch__label-text tw-relative tw-top-px tw-ml-1.5"]),
89
89
  "data-test": "stash-switch|label-text"
90
- }, u(t.label), 3)) : _("", !0)
90
+ }, _(t.label), 3)) : u("", !0)
91
91
  ], 16, I),
92
- t.hintText || a(f).hint ? (i(), d("span", {
92
+ t.hintText || a(f).hint ? (d(), i("span", {
93
93
  key: 0,
94
94
  class: s(["stash-switch__hint tw-ml-[40px] tw-mt-1.5 tw-block tw-whitespace-pre-line tw-text-xs", { "stash-switch__hint--disabled tw-text-ice-500": t.disabled }]),
95
95
  "data-test": "stash-switch|hint"
96
96
  }, [
97
97
  B(e.$slots, "hint", {}, () => [
98
- M(u(t.hintText), 1)
98
+ M(_(t.hintText), 1)
99
99
  ])
100
- ], 2)) : _("", !0)
100
+ ], 2)) : u("", !0)
101
101
  ], 10, D));
102
102
  }
103
103
  }), z = "_control_8a1ic_2", P = "_active_8a1ic_5", U = {
package/dist/Tab.js CHANGED
@@ -1,7 +1,7 @@
1
- import { defineComponent as x, useCssModule as T, inject as y, computed as r, onMounted as k, nextTick as g, toRefs as c, openBlock as u, createElementBlock as C, normalizeClass as P, unref as a, withKeys as $, createBlock as B, resolveDynamicComponent as E, mergeProps as N, withCtx as b, createElementVNode as A, createVNode as I, renderSlot as j } from "vue";
1
+ import { defineComponent as x, useCssModule as T, inject as y, computed as r, onMounted as k, nextTick as g, toRefs as c, createElementBlock as C, openBlock as u, withKeys as P, normalizeClass as $, unref as a, createBlock as B, resolveDynamicComponent as E, mergeProps as N, withCtx as b, createElementVNode as A, createVNode as I, renderSlot as j } from "vue";
2
2
  import M from "@leaflink/snitch";
3
3
  import D from "./Badge.js";
4
- import { T as L } from "./Tabs.vue_vue_type_script_setup_true_lang-NZm1OrRT.js";
4
+ import { T as L } from "./Tabs.vue_vue_type_script_setup_true_lang-CmnBP4i1.js";
5
5
  import { _ as V } from "./_plugin-vue_export-helper-CHgC5LLL.js";
6
6
  const K = ["id", "aria-selected", "aria-controls", "aria-disabled"], O = { class: "tw-mt-0.5" }, S = /* @__PURE__ */ x({
7
7
  __name: "Tab",
@@ -35,7 +35,7 @@ const K = ["id", "aria-selected", "aria-controls", "aria-disabled"], O = { class
35
35
  "aria-selected": t.value,
36
36
  "aria-controls": n.value,
37
37
  "aria-disabled": e.disabled,
38
- class: P(["stash-tab", [
38
+ class: $(["stash-tab", [
39
39
  {
40
40
  "stash-tab--active is-active": t.value,
41
41
  "stash-tab--disabled": e.disabled,
@@ -44,7 +44,7 @@ const K = ["id", "aria-selected", "aria-controls", "aria-disabled"], O = { class
44
44
  }
45
45
  ]]),
46
46
  onClick: s[0] || (s[0] = (_) => d(e.value)),
47
- onKeypress: s[1] || (s[1] = $((_) => d(e.value), ["enter"]))
47
+ onKeypress: s[1] || (s[1] = P((_) => d(e.value), ["enter"]))
48
48
  }, [
49
49
  (u(), B(E(m.value), N(h.value, {
50
50
  to: e.to,
package/dist/TabPanel.js CHANGED
@@ -1,4 +1,4 @@
1
- import { defineComponent as s, openBlock as l, createBlock as n, resolveDynamicComponent as o, normalizeClass as r, withCtx as i, renderSlot as p } from "vue";
1
+ import { defineComponent as s, createBlock as l, openBlock as n, resolveDynamicComponent as o, normalizeClass as r, withCtx as i, renderSlot as p } from "vue";
2
2
  const b = /* @__PURE__ */ s({
3
3
  __name: "TabPanel",
4
4
  props: {
@@ -8,7 +8,7 @@ const b = /* @__PURE__ */ s({
8
8
  },
9
9
  setup(e) {
10
10
  const a = e;
11
- return (t, c) => (l(), n(o(a.is), {
11
+ return (t, c) => (n(), l(o(a.is), {
12
12
  id: `tabpanel-${a.tabValue}`,
13
13
  "data-test": "stash-tab-panel",
14
14
  class: r(["stash-tab-panel", { "tw-hidden": a.activeTab !== a.tabValue }]),
package/dist/Table.js CHANGED
@@ -1,4 +1,4 @@
1
- import { defineComponent as H, inject as g, computed as a, provide as N, watchEffect as L, openBlock as p, createElementBlock as I, normalizeClass as d, unref as f, normalizeStyle as A, createElementVNode as y, renderSlot as w, createBlock as k, withCtx as n, createVNode as i } from "vue";
1
+ import { defineComponent as H, inject as g, computed as a, provide as N, watchEffect as L, createElementBlock as I, openBlock as p, normalizeStyle as A, normalizeClass as d, unref as f, createElementVNode as y, renderSlot as w, createBlock as k, withCtx as n, createVNode as i } from "vue";
2
2
  import "lodash-es/cloneDeep";
3
3
  import { M as E } from "./Module.keys-CEsrW2f0.js";
4
4
  import "lodash-es/get";
package/dist/TableCell.js CHANGED
@@ -1,9 +1,9 @@
1
- import { defineComponent as _, useCssModule as p, inject as d, openBlock as a, createElementBlock as c, normalizeClass as u, unref as t, toDisplayString as f, createCommentVNode as y, renderSlot as b } from "vue";
1
+ import { defineComponent as _, useCssModule as p, inject as d, createElementBlock as a, openBlock as c, normalizeClass as u, unref as t, createCommentVNode as f, renderSlot as y, toDisplayString as b } from "vue";
2
2
  import "lodash-es/cloneDeep";
3
3
  import "lodash-es/get";
4
4
  import "lodash-es/uniqueId";
5
5
  import "./DataView.keys-aSOnA4AD.js";
6
- import "./Illustration.vue_vue_type_script_setup_true_lang-CYddAFtS.js";
6
+ import "./Illustration.vue_vue_type_script_setup_true_lang-BBqgoJO8.js";
7
7
  import "@leaflink/snitch";
8
8
  import { T as w } from "./Table.keys-LHQf6FEH.js";
9
9
  import { _ as x } from "./_plugin-vue_export-helper-CHgC5LLL.js";
@@ -21,7 +21,7 @@ const h = {
21
21
  if (!r)
22
22
  throw new Error("TableCell must be used within a Table component");
23
23
  const { density: e, hasActions: i, layout: s } = r;
24
- return (m, B) => (a(), c("td", {
24
+ return (m, B) => (c(), a("td", {
25
25
  class: u(["stash-table-cell", [
26
26
  t(o).root,
27
27
  t(o)[`layout--${t(s)}`],
@@ -38,8 +38,8 @@ const h = {
38
38
  ]]),
39
39
  "data-test": "stash-table-cell"
40
40
  }, [
41
- l.mobileHeader && t(s) === "stack" ? (a(), c("div", h, f(l.mobileHeader), 1)) : y("", !0),
42
- b(m.$slots, "default")
41
+ l.mobileHeader && t(s) === "stack" ? (c(), a("div", h, b(l.mobileHeader), 1)) : f("", !0),
42
+ y(m.$slots, "default")
43
43
  ], 2));
44
44
  }
45
45
  }), k = "_root_rmarx_2", T = {
@@ -1,9 +1,9 @@
1
- import { defineComponent as k, useCssModule as T, inject as p, computed as m, openBlock as r, createElementBlock as _, normalizeClass as s, unref as t, createElementVNode as x, renderSlot as E, createBlock as w, createCommentVNode as n } from "vue";
1
+ import { defineComponent as k, useCssModule as T, inject as p, computed as m, createElementBlock as _, openBlock as r, normalizeClass as s, unref as t, createElementVNode as x, renderSlot as E, createCommentVNode as n, createBlock as w } from "vue";
2
2
  import "lodash-es/cloneDeep";
3
3
  import "lodash-es/get";
4
4
  import f from "./Icon.js";
5
5
  import { D as b } from "./DataView.keys-aSOnA4AD.js";
6
- import "./Illustration.vue_vue_type_script_setup_true_lang-CYddAFtS.js";
6
+ import "./Illustration.vue_vue_type_script_setup_true_lang-BBqgoJO8.js";
7
7
  import "lodash-es/uniqueId";
8
8
  import "@leaflink/snitch";
9
9
  import { T as N } from "./Table.keys-LHQf6FEH.js";
@@ -1,10 +1,10 @@
1
- import { defineComponent as E, inject as p, ref as u, watchEffect as R, openBlock as s, createElementBlock as x, unref as e, createBlock as c, normalizeClass as r, withCtx as C, createCommentVNode as f, renderSlot as B } from "vue";
1
+ import { defineComponent as E, inject as p, ref as u, watchEffect as R, createElementBlock as x, openBlock as s, createBlock as c, createCommentVNode as f, renderSlot as C, unref as e, normalizeClass as r, withCtx as B } from "vue";
2
2
  import { t as S } from "./locale.js";
3
3
  import v from "./Checkbox.js";
4
4
  import { D as w } from "./DataView.keys-aSOnA4AD.js";
5
5
  import "lodash-es/cloneDeep";
6
6
  import "lodash-es/uniqueId";
7
- import "./Illustration.vue_vue_type_script_setup_true_lang-CYddAFtS.js";
7
+ import "./Illustration.vue_vue_type_script_setup_true_lang-BBqgoJO8.js";
8
8
  import { T as N } from "./Table.keys-LHQf6FEH.js";
9
9
  import h from "./TableHeaderCell.js";
10
10
  import { _ as g } from "./_plugin-vue_export-helper-CHgC5LLL.js";
@@ -35,7 +35,7 @@ const A = /* @__PURE__ */ E({
35
35
  key: 0,
36
36
  class: r(["stash-table-header-row__selection-cell tw-min-w-[48px]", o.$style["row-control-cell"]])
37
37
  }, {
38
- default: C(() => [
38
+ default: B(() => [
39
39
  (s(), c(v, {
40
40
  key: m.value,
41
41
  class: r(o.$style["row-selection-checkbox"]),
@@ -53,7 +53,7 @@ const A = /* @__PURE__ */ E({
53
53
  class: r(o.$style["row-control-cell"]),
54
54
  "data-test": "table-row-header-expansion-cell"
55
55
  }, null, 8, ["class"])) : f("", !0),
56
- B(o.$slots, "default")
56
+ C(o.$slots, "default")
57
57
  ], 512));
58
58
  }
59
59
  }), I = {
package/dist/TableRow.js CHANGED
@@ -1,12 +1,12 @@
1
- import { defineComponent as A, useAttrs as D, useCssModule as M, useSlots as V, inject as j, ref as P, computed as C, watch as q, openBlock as r, createElementBlock as x, Fragment as z, createElementVNode as F, mergeProps as J, unref as e, createBlock as k, normalizeClass as c, withCtx as _, createVNode as b, createCommentVNode as w, renderSlot as E } from "vue";
1
+ import { defineComponent as A, useAttrs as D, useCssModule as M, useSlots as V, inject as j, ref as P, computed as C, watch as q, createElementBlock as x, openBlock as r, Fragment as z, createElementVNode as F, createCommentVNode as w, mergeProps as J, unref as e, createBlock as k, renderSlot as E, normalizeClass as c, withCtx as _, createVNode as b } from "vue";
2
2
  import L from "lodash-es/uniqueId";
3
3
  import { t as m } from "./locale.js";
4
4
  import O from "./Checkbox.js";
5
- import { _ as U } from "./ChevronToggle.vue_vue_type_script_setup_true_lang-DuvluoTi.js";
6
- import { _ as G } from "./Expand.vue_vue_type_script_setup_true_lang-D0fSAtHr.js";
5
+ import { _ as U } from "./ChevronToggle.vue_vue_type_script_setup_true_lang-Ce_qOXfR.js";
6
+ import { _ as G } from "./Expand.vue_vue_type_script_setup_true_lang-CiONJfAp.js";
7
7
  import "lodash-es/cloneDeep";
8
8
  import "./DataView.keys-aSOnA4AD.js";
9
- import "./Illustration.vue_vue_type_script_setup_true_lang-CYddAFtS.js";
9
+ import "./Illustration.vue_vue_type_script_setup_true_lang-BBqgoJO8.js";
10
10
  import y from "./TableCell.js";
11
11
  import { T as H } from "./Table.keys-LHQf6FEH.js";
12
12
  import { _ as K } from "./_plugin-vue_export-helper-CHgC5LLL.js";
@@ -1 +1 @@
1
- {"version":3,"file":"TableRow.js","sources":["../src/components/TableRow/TableRow.vue"],"sourcesContent":["<script setup lang=\"ts\">\n import uniqueId from 'lodash-es/uniqueId';\n import { computed, inject, ref, useAttrs, useCssModule, useSlots, watch } from 'vue';\n\n import { StashCommonColor } from '../../../types/colors';\n import { t } from '../../locale';\n import Checkbox, { CheckboxProps } from '../Checkbox/Checkbox.vue';\n import ChevronToggle from '../ChevronToggle/ChevronToggle.vue';\n import Expand from '../Expand/Expand.vue';\n import { TABLE_INJECTION } from '../Table/Table.vue';\n import TableCell from '../TableCell/TableCell.vue';\n\n defineOptions({ inheritAttrs: false });\n\n export interface TableRowProps {\n hideExpansionDivider?: boolean;\n isExpanded?: boolean;\n isSelected?: boolean;\n isSelectDisabled?: boolean;\n /**\n * The accent color for the TableRow.\n */\n accentColor?: StashCommonColor;\n }\n\n const props = withDefaults(defineProps<TableRowProps>(), {\n /**\n * If true, hides the divider between the parent row and expansion row\n */\n hideExpansionDivider: false,\n isExpanded: false,\n isSelected: false,\n isSelectDisabled: false,\n accentColor: undefined,\n });\n\n const emit = defineEmits<{\n 'update:isSelected': [isChecked: CheckboxProps['checked']];\n 'update:isExpanded': [isExpanded: boolean];\n }>();\n\n const attrs = useAttrs();\n const classes = useCssModule();\n const slots = useSlots();\n\n const tableInjection = inject(TABLE_INJECTION.key);\n\n if (!tableInjection) {\n throw new Error('TableRow must be used within a Table component');\n }\n\n const { hasActions, hasCustomExpandToggle, isExpandable, isSelectable, layout } = tableInjection;\n\n const isRowExpanded = ref(props.isExpanded);\n const isRowExpandable = computed(() => isExpandable.value && !!slots.expansion);\n\n const childCellCount = computed(() => {\n let count = slots.default?.({ toggleExpand }).length ?? 0;\n\n if (isSelectable.value) {\n count += 1;\n }\n\n if (isRowExpandable.value && !hasCustomExpandToggle.value) {\n count += 1;\n }\n\n return count;\n });\n const rowId = uniqueId('table-row-');\n\n function toggleExpand(value?: boolean) {\n if (!isRowExpandable.value) {\n throw new Error('Cannot call `toggleExpand` on a non-expandable row. Provide an `expansion` slot.');\n }\n\n const isExpanded = typeof value === 'boolean' ? value : !isRowExpanded.value;\n\n isRowExpanded.value = isExpanded;\n emit('update:isExpanded', isExpanded);\n }\n\n watch(\n () => props.isExpanded,\n () => toggleExpand(props.isExpanded),\n );\n</script>\n\n<template>\n <tr\n class=\"stash-table-row\"\n :class=\"[\n classes.root,\n classes[`layout--${layout}`],\n {\n [classes['is-expandable']]: isRowExpandable,\n [classes['is-expanded']]: isRowExpanded,\n [classes['root--hidden-divider']]: hideExpansionDivider,\n 'tw-p-gutter': layout === 'stack',\n 'tw-mb-6 tw-shadow lg:tw-mb-0 lg:tw-shadow-none': layout === 'stack' && !isRowExpandable,\n 'tw-pt-[60px]': hasActions && layout === 'stack' && !isSelectable,\n 'stash-table-row--accent': props.accentColor,\n 'tw-relative': props.accentColor,\n },\n ]\"\n data-test=\"stash-table-row\"\n v-bind=\"attrs\"\n >\n <TableCell\n v-if=\"isSelectable\"\n is-control\n class=\"stash-table-row__selection-cell tw-min-w-[48px]\"\n :class=\"classes['row-control-cell']\"\n data-test=\"stash-table-row|selection-cell\"\n >\n <Checkbox\n :class=\"classes['row-selection-checkbox']\"\n :checked=\"props.isSelected\"\n :disabled=\"props.isSelectDisabled\"\n :title=\"t('ll.select.self')\"\n @update:checked=\"emit('update:isSelected', $event)\"\n />\n </TableCell>\n <TableCell\n v-if=\"isRowExpandable && !hasCustomExpandToggle\"\n class=\"stash-table-row__toggle-expansion-cell tw-px-0\"\n data-test=\"stash-table-row|custom-expansion-cell\"\n is-control\n :class=\"classes['row-control-cell']\"\n >\n <ChevronToggle\n :aria-controls=\"rowId\"\n :aria-label=\"isRowExpanded ? t('ll.table.collapseRow') : t('ll.table.expandRow')\"\n :direction=\"isRowExpanded ? 'up' : 'down'\"\n :is-expanded=\"isRowExpanded\"\n @click=\"toggleExpand\"\n />\n </TableCell>\n <!-- @slot default -->\n <slot :is-row-expanded=\"isRowExpanded\" :toggle-expand=\"toggleExpand\"></slot>\n <!-- Displays a 4px accent on the left of the table row -->\n <div\n v-if=\"props.accentColor\"\n data-test=\"stash-table-row|accent\"\n :class=\"{\n 'tw-absolute': props.accentColor,\n [`tw-bg-${props.accentColor}`]: props.accentColor,\n 'tw-block': props.accentColor,\n 'tw-h-full': props.accentColor,\n 'tw-w-1': props.accentColor,\n 'tw-top-0': props.accentColor,\n 'tw-left-0': props.accentColor,\n }\"\n ></div>\n </tr>\n <tr\n v-if=\"isRowExpandable\"\n class=\"stash-table-row stash-table-row--expandable\"\n :class=\"classes['row-expansion']\"\n data-test=\"stash-table-row|expansion-row\"\n >\n <Expand\n is=\"td\"\n :id=\"rowId\"\n class=\"tw-border-none tw-bg-white tw-px-3 tw-py-0\"\n data-test=\"stash-table-row|expansion-cell\"\n :class=\"classes['row-expansion-content']\"\n :colspan=\"childCellCount\"\n :is-expanded=\"isRowExpanded\"\n >\n <!-- @slot expansion, for expandable content -->\n <slot name=\"expansion\"></slot>\n </Expand>\n </tr>\n</template>\n\n<style module>\n .root {\n border: 0;\n }\n\n /**\n * Only takes effect when hideExpansionDivider is true, for a softer collapse transition as the bottom border re-appears\n */\n .is-expandable > td {\n border-bottom-color: var(--color-ice-200);\n transition: border-bottom-color 0.5s;\n }\n\n .root--hidden-divider.is-expanded > td {\n transition: border-bottom-color 0s;\n /**\n * Removes the grey cell background for 'control' cells at lower breakpoints, letting the white of the tr come through.\n */\n border-bottom-color: transparent;\n }\n\n .layout--scroll {\n border-radius: 0;\n box-shadow: none !important;\n margin: 0;\n }\n\n .layout--scroll:last-of-type {\n border: 0;\n }\n\n .layout--scroll:last-of-type td {\n border-bottom: none;\n }\n\n .layout--stack {\n align-items: stretch;\n background-color: var(--color-white);\n column-gap: var(--grid-gutter);\n display: grid;\n grid-template-columns: repeat(12, 1fr);\n position: relative;\n row-gap: var(--grid-gutter);\n }\n\n .layout--stack:not(.is-expanded) {\n border-radius: theme('borderRadius.DEFAULT');\n transition: border-radius 0.5s;\n }\n\n .layout--stack.is-expanded {\n border-top-left-radius: theme('borderRadius.DEFAULT');\n border-top-right-radius: theme('borderRadius.DEFAULT');\n }\n\n .row-selection-checkbox label {\n padding: 0;\n min-height: theme('spacing.6');\n vertical-align: middle;\n }\n\n .layout--stack .row-control-cell {\n display: flex;\n align-items: center;\n min-width: 0;\n }\n\n /* On mobile, display controls on their own row, pushing other cells below */\n .row-control-cell + :not(.row-control-cell) {\n grid-column-start: 1;\n }\n\n .row-expansion-content {\n box-shadow: inset 0 -1px 0 0 var(--color-ice-200);\n }\n\n .layout--stack + .row-expansion,\n .layout--stack + .row-expansion > .row-expansion-content {\n display: block;\n }\n\n .layout--stack + .row-expansion > .row-expansion-content {\n border-top: 1px solid var(--color-ice-200);\n border-bottom-left-radius: theme('borderRadius.DEFAULT');\n border-bottom-right-radius: theme('borderRadius.DEFAULT');\n margin-bottom: theme('spacing.6');\n }\n\n .layout--stack.root--hidden-divider + .row-expansion > .row-expansion-content {\n border-top: none;\n }\n\n /* On large screens, match the styles for layout-SCROLL */\n @media screen('lg') {\n .layout--stack {\n align-items: unset;\n background-color: unset;\n border: 0;\n border-bottom: 1px solid var(--color-ice-200);\n border-radius: 0;\n box-shadow: none;\n column-gap: unset;\n display: table-row;\n grid-template-columns: unset;\n row-gap: unset;\n }\n\n .layout--stack:last-of-type {\n border-bottom: 0;\n }\n\n .layout--stack .row-control-cell {\n display: table-cell;\n }\n\n .layout--stack + .row-expansion {\n display: table-row;\n }\n\n .layout--stack + .row-expansion > .row-expansion-content {\n border-top: unset;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n display: table-cell;\n margin-bottom: unset;\n }\n\n .row-control-cell + :not(.row-control-cell) {\n grid-column-start: unset;\n }\n }\n</style>\n"],"names":["props","__props","emit","__emit","attrs","useAttrs","classes","useCssModule","slots","useSlots","tableInjection","inject","TABLE_INJECTION","hasActions","hasCustomExpandToggle","isExpandable","isSelectable","layout","isRowExpanded","ref","isRowExpandable","computed","childCellCount","count","_a","toggleExpand","rowId","uniqueId","value","isExpanded","watch"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAyBE,UAAMA,IAAQC,GAWRC,IAAOC,GAKPC,IAAQC,EAAS,GACjBC,IAAUC,EAAa,GACvBC,IAAQC,EAAS,GAEjBC,IAAiBC,EAAOC,EAAgB,GAAG;AAEjD,QAAI,CAACF;AACG,YAAA,IAAI,MAAM,gDAAgD;AAGlE,UAAM,EAAE,YAAAG,GAAY,uBAAAC,GAAuB,cAAAC,GAAc,cAAAC,GAAc,QAAAC,MAAWP,GAE5EQ,IAAgBC,EAAInB,EAAM,UAAU,GACpCoB,IAAkBC,EAAS,MAAMN,EAAa,SAAS,CAAC,CAACP,EAAM,SAAS,GAExEc,IAAiBD,EAAS,MAAM;;AACpC,UAAIE,MAAQC,IAAAhB,EAAM,YAAN,gBAAAgB,EAAA,KAAAhB,GAAgB,EAAE,cAAAiB,EAAc,GAAE,WAAU;AAExD,aAAIT,EAAa,UACNO,KAAA,IAGPH,EAAgB,SAAS,CAACN,EAAsB,UACzCS,KAAA,IAGJA;AAAA,IAAA,CACR,GACKG,IAAQC,EAAS,YAAY;AAEnC,aAASF,EAAaG,GAAiB;AACjC,UAAA,CAACR,EAAgB;AACb,cAAA,IAAI,MAAM,kFAAkF;AAGpG,YAAMS,IAAa,OAAOD,KAAU,YAAYA,IAAQ,CAACV,EAAc;AAEvE,MAAAA,EAAc,QAAQW,GACtB3B,EAAK,qBAAqB2B,CAAU;AAAA,IAAA;AAGtC,WAAAC;AAAA,MACE,MAAM9B,EAAM;AAAA,MACZ,MAAMyB,EAAazB,EAAM,UAAU;AAAA,IACrC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"TableRow.js","sources":["../src/components/TableRow/TableRow.vue"],"sourcesContent":["<script setup lang=\"ts\">\n import uniqueId from 'lodash-es/uniqueId';\n import { computed, inject, ref, useAttrs, useCssModule, watch } from 'vue';\n\n import { StashCommonColor } from '../../../types/colors';\n import { t } from '../../locale';\n import Checkbox, { CheckboxProps } from '../Checkbox/Checkbox.vue';\n import ChevronToggle from '../ChevronToggle/ChevronToggle.vue';\n import Expand from '../Expand/Expand.vue';\n import { TABLE_INJECTION } from '../Table/Table.vue';\n import TableCell from '../TableCell/TableCell.vue';\n\n defineOptions({ inheritAttrs: false });\n\n export interface TableRowProps {\n hideExpansionDivider?: boolean;\n isExpanded?: boolean;\n isSelected?: boolean;\n isSelectDisabled?: boolean;\n /**\n * The accent color for the TableRow.\n */\n accentColor?: StashCommonColor;\n }\n\n const props = withDefaults(defineProps<TableRowProps>(), {\n /**\n * If true, hides the divider between the parent row and expansion row\n */\n hideExpansionDivider: false,\n isExpanded: false,\n isSelected: false,\n isSelectDisabled: false,\n accentColor: undefined,\n });\n\n const emit = defineEmits<{\n 'update:isSelected': [isChecked: CheckboxProps['checked']];\n 'update:isExpanded': [isExpanded: boolean];\n }>();\n\n const attrs = useAttrs();\n const classes = useCssModule();\n const slots = defineSlots<{\n default(props: { isRowExpanded?: boolean; toggleExpand: (value?: boolean) => void }): unknown[];\n expansion(): unknown[];\n }>();\n\n const tableInjection = inject(TABLE_INJECTION.key);\n\n if (!tableInjection) {\n throw new Error('TableRow must be used within a Table component');\n }\n\n const { hasActions, hasCustomExpandToggle, isExpandable, isSelectable, layout } = tableInjection;\n\n const isRowExpanded = ref(props.isExpanded);\n const isRowExpandable = computed(() => isExpandable.value && !!slots.expansion);\n\n const childCellCount = computed(() => {\n let count = slots.default?.({ toggleExpand }).length ?? 0;\n\n if (isSelectable.value) {\n count += 1;\n }\n\n if (isRowExpandable.value && !hasCustomExpandToggle.value) {\n count += 1;\n }\n\n return count;\n });\n const rowId = uniqueId('table-row-');\n\n function toggleExpand(value?: boolean) {\n if (!isRowExpandable.value) {\n throw new Error('Cannot call `toggleExpand` on a non-expandable row. Provide an `expansion` slot.');\n }\n\n const isExpanded = typeof value === 'boolean' ? value : !isRowExpanded.value;\n\n isRowExpanded.value = isExpanded;\n emit('update:isExpanded', isExpanded);\n }\n\n watch(\n () => props.isExpanded,\n () => toggleExpand(props.isExpanded),\n );\n</script>\n\n<template>\n <tr\n class=\"stash-table-row\"\n :class=\"[\n classes.root,\n classes[`layout--${layout}`],\n {\n [classes['is-expandable']]: isRowExpandable,\n [classes['is-expanded']]: isRowExpanded,\n [classes['root--hidden-divider']]: hideExpansionDivider,\n 'tw-p-gutter': layout === 'stack',\n 'tw-mb-6 tw-shadow lg:tw-mb-0 lg:tw-shadow-none': layout === 'stack' && !isRowExpandable,\n 'tw-pt-[60px]': hasActions && layout === 'stack' && !isSelectable,\n 'stash-table-row--accent': props.accentColor,\n 'tw-relative': props.accentColor,\n },\n ]\"\n data-test=\"stash-table-row\"\n v-bind=\"attrs\"\n >\n <TableCell\n v-if=\"isSelectable\"\n is-control\n class=\"stash-table-row__selection-cell tw-min-w-[48px]\"\n :class=\"classes['row-control-cell']\"\n data-test=\"stash-table-row|selection-cell\"\n >\n <Checkbox\n :class=\"classes['row-selection-checkbox']\"\n :checked=\"props.isSelected\"\n :disabled=\"props.isSelectDisabled\"\n :title=\"t('ll.select.self')\"\n @update:checked=\"emit('update:isSelected', $event)\"\n />\n </TableCell>\n <TableCell\n v-if=\"isRowExpandable && !hasCustomExpandToggle\"\n class=\"stash-table-row__toggle-expansion-cell tw-px-0\"\n data-test=\"stash-table-row|custom-expansion-cell\"\n is-control\n :class=\"classes['row-control-cell']\"\n >\n <ChevronToggle\n :aria-controls=\"rowId\"\n :aria-label=\"isRowExpanded ? t('ll.table.collapseRow') : t('ll.table.expandRow')\"\n :direction=\"isRowExpanded ? 'up' : 'down'\"\n :is-expanded=\"isRowExpanded\"\n @click=\"toggleExpand\"\n />\n </TableCell>\n <!-- @slot default -->\n <slot :is-row-expanded=\"isRowExpanded\" :toggle-expand=\"toggleExpand\"></slot>\n <!-- Displays a 4px accent on the left of the table row -->\n <div\n v-if=\"props.accentColor\"\n data-test=\"stash-table-row|accent\"\n :class=\"{\n 'tw-absolute': props.accentColor,\n [`tw-bg-${props.accentColor}`]: props.accentColor,\n 'tw-block': props.accentColor,\n 'tw-h-full': props.accentColor,\n 'tw-w-1': props.accentColor,\n 'tw-top-0': props.accentColor,\n 'tw-left-0': props.accentColor,\n }\"\n ></div>\n </tr>\n <tr\n v-if=\"isRowExpandable\"\n class=\"stash-table-row stash-table-row--expandable\"\n :class=\"classes['row-expansion']\"\n data-test=\"stash-table-row|expansion-row\"\n >\n <Expand\n is=\"td\"\n :id=\"rowId\"\n class=\"tw-border-none tw-bg-white tw-px-3 tw-py-0\"\n data-test=\"stash-table-row|expansion-cell\"\n :class=\"classes['row-expansion-content']\"\n :colspan=\"childCellCount\"\n :is-expanded=\"isRowExpanded\"\n >\n <!-- @slot expansion, for expandable content -->\n <slot name=\"expansion\"></slot>\n </Expand>\n </tr>\n</template>\n\n<style module>\n .root {\n border: 0;\n }\n\n /**\n * Only takes effect when hideExpansionDivider is true, for a softer collapse transition as the bottom border re-appears\n */\n .is-expandable > td {\n border-bottom-color: var(--color-ice-200);\n transition: border-bottom-color 0.5s;\n }\n\n .root--hidden-divider.is-expanded > td {\n transition: border-bottom-color 0s;\n /**\n * Removes the grey cell background for 'control' cells at lower breakpoints, letting the white of the tr come through.\n */\n border-bottom-color: transparent;\n }\n\n .layout--scroll {\n border-radius: 0;\n box-shadow: none !important;\n margin: 0;\n }\n\n .layout--scroll:last-of-type {\n border: 0;\n }\n\n .layout--scroll:last-of-type td {\n border-bottom: none;\n }\n\n .layout--stack {\n align-items: stretch;\n background-color: var(--color-white);\n column-gap: var(--grid-gutter);\n display: grid;\n grid-template-columns: repeat(12, 1fr);\n position: relative;\n row-gap: var(--grid-gutter);\n }\n\n .layout--stack:not(.is-expanded) {\n border-radius: theme('borderRadius.DEFAULT');\n transition: border-radius 0.5s;\n }\n\n .layout--stack.is-expanded {\n border-top-left-radius: theme('borderRadius.DEFAULT');\n border-top-right-radius: theme('borderRadius.DEFAULT');\n }\n\n .row-selection-checkbox label {\n padding: 0;\n min-height: theme('spacing.6');\n vertical-align: middle;\n }\n\n .layout--stack .row-control-cell {\n display: flex;\n align-items: center;\n min-width: 0;\n }\n\n /* On mobile, display controls on their own row, pushing other cells below */\n .row-control-cell + :not(.row-control-cell) {\n grid-column-start: 1;\n }\n\n .row-expansion-content {\n box-shadow: inset 0 -1px 0 0 var(--color-ice-200);\n }\n\n .layout--stack + .row-expansion,\n .layout--stack + .row-expansion > .row-expansion-content {\n display: block;\n }\n\n .layout--stack + .row-expansion > .row-expansion-content {\n border-top: 1px solid var(--color-ice-200);\n border-bottom-left-radius: theme('borderRadius.DEFAULT');\n border-bottom-right-radius: theme('borderRadius.DEFAULT');\n margin-bottom: theme('spacing.6');\n }\n\n .layout--stack.root--hidden-divider + .row-expansion > .row-expansion-content {\n border-top: none;\n }\n\n /* On large screens, match the styles for layout-SCROLL */\n @media screen('lg') {\n .layout--stack {\n align-items: unset;\n background-color: unset;\n border: 0;\n border-bottom: 1px solid var(--color-ice-200);\n border-radius: 0;\n box-shadow: none;\n column-gap: unset;\n display: table-row;\n grid-template-columns: unset;\n row-gap: unset;\n }\n\n .layout--stack:last-of-type {\n border-bottom: 0;\n }\n\n .layout--stack .row-control-cell {\n display: table-cell;\n }\n\n .layout--stack + .row-expansion {\n display: table-row;\n }\n\n .layout--stack + .row-expansion > .row-expansion-content {\n border-top: unset;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n display: table-cell;\n margin-bottom: unset;\n }\n\n .row-control-cell + :not(.row-control-cell) {\n grid-column-start: unset;\n }\n }\n</style>\n"],"names":["props","__props","emit","__emit","attrs","useAttrs","classes","useCssModule","slots","_useSlots","tableInjection","inject","TABLE_INJECTION","hasActions","hasCustomExpandToggle","isExpandable","isSelectable","layout","isRowExpanded","ref","isRowExpandable","computed","childCellCount","count","_a","toggleExpand","rowId","uniqueId","value","isExpanded","watch"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAyBE,UAAMA,IAAQC,GAWRC,IAAOC,GAKPC,IAAQC,EAAS,GACjBC,IAAUC,EAAa,GACvBC,IAAQC,EAGV,GAEEC,IAAiBC,EAAOC,EAAgB,GAAG;AAEjD,QAAI,CAACF;AACG,YAAA,IAAI,MAAM,gDAAgD;AAGlE,UAAM,EAAE,YAAAG,GAAY,uBAAAC,GAAuB,cAAAC,GAAc,cAAAC,GAAc,QAAAC,MAAWP,GAE5EQ,IAAgBC,EAAInB,EAAM,UAAU,GACpCoB,IAAkBC,EAAS,MAAMN,EAAa,SAAS,CAAC,CAACP,EAAM,SAAS,GAExEc,IAAiBD,EAAS,MAAM;;AACpC,UAAIE,MAAQC,IAAAhB,EAAM,YAAN,gBAAAgB,EAAA,KAAAhB,GAAgB,EAAE,cAAAiB,EAAc,GAAE,WAAU;AAExD,aAAIT,EAAa,UACNO,KAAA,IAGPH,EAAgB,SAAS,CAACN,EAAsB,UACzCS,KAAA,IAGJA;AAAA,IAAA,CACR,GACKG,IAAQC,EAAS,YAAY;AAEnC,aAASF,EAAaG,GAAiB;AACjC,UAAA,CAACR,EAAgB;AACb,cAAA,IAAI,MAAM,kFAAkF;AAGpG,YAAMS,IAAa,OAAOD,KAAU,YAAYA,IAAQ,CAACV,EAAc;AAEvE,MAAAA,EAAc,QAAQW,GACtB3B,EAAK,qBAAqB2B,CAAU;AAAA,IAAA;AAGtC,WAAAC;AAAA,MACE,MAAM9B,EAAM;AAAA,MACZ,MAAMyB,EAAazB,EAAM,UAAU;AAAA,IACrC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -62,12 +62,18 @@ isSelected: boolean;
62
62
  accentColor: "ice-700" | "purple-700" | "purple-500" | "purple-100" | "royal-700" | "royal-500" | "royal-100" | "blue-700" | "blue-500" | "blue-100" | "teal-700" | "teal-500" | "teal-100" | "green-700" | "green-500" | "green-100" | "seafoam-700" | "seafoam-500" | "seafoam-100" | "yellow-700" | "yellow-500" | "yellow-100" | "orange-700" | "orange-500" | "orange-100" | "red-700" | "red-500" | "red-100" | "ice-500" | "ice-200" | "ice-100" | "white" | "black";
63
63
  hideExpansionDivider: boolean;
64
64
  isSelectDisabled: boolean;
65
- }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>, {
66
- default?(_: {
67
- isRowExpanded: boolean;
68
- toggleExpand: typeof toggleExpand;
69
- }): any;
70
- expansion?(_: {}): any;
65
+ }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>, Readonly<{
66
+ default(props: {
67
+ isRowExpanded?: boolean | undefined;
68
+ toggleExpand: (value?: boolean | undefined) => void;
69
+ }): unknown[];
70
+ expansion(): unknown[];
71
+ }> & {
72
+ default(props: {
73
+ isRowExpanded?: boolean | undefined;
74
+ toggleExpand: (value?: boolean | undefined) => void;
75
+ }): unknown[];
76
+ expansion(): unknown[];
71
77
  }>;
72
78
  export default _default;
73
79
 
@@ -123,6 +129,4 @@ export declare interface TableRowProps {
123
129
  accentColor?: StashCommonColor;
124
130
  }
125
131
 
126
- declare function toggleExpand(value?: boolean): void;
127
-
128
132
  export { }
package/dist/Tabs.js CHANGED
@@ -1,5 +1,5 @@
1
- import { _ as s } from "./Tabs.vue_vue_type_script_setup_true_lang-NZm1OrRT.js";
2
- import { T as c, a as f } from "./Tabs.vue_vue_type_script_setup_true_lang-NZm1OrRT.js";
1
+ import { _ as s } from "./Tabs.vue_vue_type_script_setup_true_lang-CmnBP4i1.js";
2
+ import { T as c, a as f } from "./Tabs.vue_vue_type_script_setup_true_lang-CmnBP4i1.js";
3
3
  import { _ as a } from "./_plugin-vue_export-helper-CHgC5LLL.js";
4
4
  const t = {
5
5
  "menu-tab": "_menu-tab_frbn6_2"
@@ -1,4 +1,4 @@
1
- import { defineComponent as U, useCssModule as V, ref as s, computed as f, provide as q, onMounted as J, onUpdated as R, onDeactivated as F, onBeforeUnmount as H, openBlock as k, createElementBlock as K, createElementVNode as m, normalizeStyle as W, normalizeClass as I, renderSlot as A, createBlock as Y, withCtx as N, unref as h, createTextVNode as Z, toDisplayString as G, createVNode as P, createCommentVNode as Q } from "vue";
1
+ import { defineComponent as U, useCssModule as V, ref as s, computed as f, provide as q, onMounted as J, onUpdated as R, onDeactivated as F, onBeforeUnmount as H, createElementBlock as K, openBlock as k, createElementVNode as m, normalizeClass as I, normalizeStyle as W, renderSlot as A, createBlock as Y, createCommentVNode as Z, withCtx as N, unref as h, createTextVNode as G, createVNode as P, toDisplayString as Q } from "vue";
2
2
  import X from "lodash-es/debounce";
3
3
  import ee from "lodash-es/uniqueId";
4
4
  import { DEBOUNCE as te } from "./constants.js";
@@ -130,7 +130,7 @@ const ie = {
130
130
  type: "button",
131
131
  onClick: (p) => j(C)
132
132
  }, [
133
- Z(G(h(oe)("ll.more")) + " ", 1),
133
+ G(Q(h(oe)("ll.more")) + " ", 1),
134
134
  P(ae, { name: "caret-down" })
135
135
  ], 10, ne)
136
136
  ]),
@@ -146,7 +146,7 @@ const ie = {
146
146
  ], 8, le)
147
147
  ]),
148
148
  _: 3
149
- }, 512)) : Q("", !0)
149
+ }, 512)) : Z("", !0)
150
150
  ], 6)
151
151
  ]));
152
152
  }
@@ -156,4 +156,4 @@ export {
156
156
  fe as _,
157
157
  M as a
158
158
  };
159
- //# sourceMappingURL=Tabs.vue_vue_type_script_setup_true_lang-NZm1OrRT.js.map
159
+ //# sourceMappingURL=Tabs.vue_vue_type_script_setup_true_lang-CmnBP4i1.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.vue_vue_type_script_setup_true_lang-NZm1OrRT.js","sources":["../src/components/Tabs/keys.ts","../src/components/Tabs/models.ts","../src/components/Tabs/Tabs.vue"],"sourcesContent":["import { Injection } from '../../../types/utils';\nimport { TabsInjection } from './models';\n\nexport const TABS_INJECTION: Injection<TabsInjection> = Object.freeze({\n key: Symbol('TABS_INJECTION_KEY'),\n});\n","import { ComputedRef } from 'vue';\n\nexport enum TabVariant {\n Line = 'line',\n Enclosed = 'enclosed',\n}\n\nexport type TabVariants = `${TabVariant}`;\n\nexport interface TabsInjection {\n activeTab: ComputedRef<string>;\n variant: ComputedRef<TabVariants>;\n setActiveTab: (newTabValue: string) => void;\n}\n","<script lang=\"ts\">\n import { TabVariant, TabVariants } from './models';\n\n export * from './keys';\n export * from './models';\n\n export interface TabsProps {\n /**\n * The currently active tab value\n */\n activeTab: string;\n\n /**\n * Tabs variant\n */\n variant?: TabVariants;\n }\n</script>\n\n<script setup lang=\"ts\">\n import debounce from 'lodash-es/debounce';\n import uniqueId from 'lodash-es/uniqueId';\n import { computed, onBeforeUnmount, onDeactivated, onMounted, onUpdated, provide, Ref, ref, useCssModule } from 'vue';\n\n import { DEBOUNCE } from '../../constants';\n import { t } from '../../locale';\n import Dropdown from '../Dropdown/Dropdown.vue';\n import Icon from '../Icon/Icon.vue';\n import { TABS_INJECTION } from './keys';\n\n const emit = defineEmits<{\n (e: 'update:activeTab', newTabValue: TabsProps['activeTab']): void;\n }>();\n\n const props = withDefaults(defineProps<TabsProps>(), {\n variant: TabVariant.Line,\n });\n const classes = useCssModule();\n\n const tabListEl = ref();\n const moreDropdownMenuEl = ref();\n const observer: Ref<IntersectionObserver | undefined> = ref(undefined);\n const hasIntersectionObserver = 'IntersectionObserver' in window;\n const overflowIds = ref<Set<string>>(new Set());\n const moreDropdownWidth = ref(0);\n const moreDropdownEl = ref<InstanceType<typeof Dropdown>>();\n const moreMenuId = uniqueId('more-dropdown-menu-');\n const isMoreMenuOpen = ref(false);\n\n const currentActiveTab = computed({\n get() {\n return props.activeTab;\n },\n set(nv: TabsProps['activeTab']) {\n emit('update:activeTab', nv);\n },\n });\n\n function setActiveTab(newTabValue: TabsProps['activeTab']) {\n currentActiveTab.value = newTabValue;\n }\n\n provide(TABS_INJECTION.key, {\n activeTab: computed(() => currentActiveTab.value),\n variant: computed(() => props.variant),\n setActiveTab,\n });\n\n function initObserve() {\n if (!hasIntersectionObserver) {\n return;\n }\n\n if (!tabListEl.value) {\n return;\n }\n\n const tabs = Array.from(tabListEl.value?.children as HTMLLIElement[]);\n const options = {\n root: tabListEl.value,\n rootMargin: '0px',\n threshold: Array.from({ length: 100 }).map((v, i) => (i + 1) / 100),\n };\n\n observer.value = new IntersectionObserver((entries) => {\n entries.forEach((entry) => {\n const dataId = entry.target.getAttribute('id') as string;\n /**\n * Check for partial intersection.\n * Zooming out can result in ratio of approx 0.984\n * Anything higher will result in nav items disappearing\n */\n if (entry.intersectionRatio > 0.94) {\n // show tab, hide in dropdown\n if (overflowIds.value.has(dataId)) {\n overflowIds.value.delete(dataId);\n }\n } else {\n // hide tab, show in dropdown\n if (dataId && !overflowIds.value.has(dataId)) {\n overflowIds.value.add(dataId);\n }\n }\n });\n }, options);\n\n tabs.forEach((element) => {\n observer.value?.observe(element);\n if (overflowIds.value.has(element.getAttribute('id') as string)) {\n element.classList.add('tw-invisible');\n } else {\n element.classList.remove('tw-invisible');\n }\n });\n\n moreDropdownWidth.value = moreDropdownEl.value?.$el?.getBoundingClientRect().width || 0;\n\n if (!moreDropdownMenuEl.value) {\n return;\n }\n\n const dropdownList = Array.from(moreDropdownMenuEl.value.children as HTMLLIElement[]);\n dropdownList.forEach((element) => {\n const firstElementChild = element.firstElementChild as Element;\n firstElementChild.className = '';\n element.className = '';\n\n element.classList.add(\n classes['menu-tab'],\n 'tw-flex',\n 'tw-items-center',\n 'tw-justify-between',\n 'tw-rounded',\n 'tw-text-sm',\n 'tw-p-1.5',\n 'tw-text-left',\n 'tw-cursor-pointer',\n 'tw-text-ice-700',\n 'hover:!tw-bg-ice-200',\n 'aria-disabled:tw-text-ice-500',\n 'aria-disabled:tw-pointer-events-none',\n 'aria-disabled:hover:tw-text-ice-500',\n 'aria-disabled:hover:tw-bg-inherit',\n 'aria-disabled:hover:tw-cursor-default',\n 'aria-selected:tw-bg-blue-100',\n );\n\n element.querySelector('.stash-tabs__dropdown-selected-tab-icon')?.remove();\n\n if (element.getAttribute('id') === `tab-${currentActiveTab.value}`) {\n const span = document.createElement('span');\n span.className = 'stash-tabs__dropdown-selected-tab-icon';\n span.innerHTML = `<svg xmlns=\"http://www.w3.org/2000/svg\" class=\"tw-text-blue-500 tw-w-6 tw-h-6\" viewBox=\"0 0 24 24\" fill=\"none\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M20.707 6.854 9 18.561l-5.707-5.707 1.414-1.414L9 15.733 19.293 5.44l1.414 1.414Z\" clip-rule=\"evenodd\"/></svg>`;\n element.appendChild(span);\n }\n\n if (!overflowIds.value.has(element.getAttribute('id') as string)) {\n element.classList.add('tw-hidden');\n } else {\n element.classList.remove('tw-hidden');\n }\n\n element.removeEventListener('click', () => {});\n });\n }\n\n const debouncedInitObserve = debounce(initObserve, DEBOUNCE.FAST, { leading: true });\n\n function destroyObserver() {\n if (observer.value) {\n observer.value.disconnect();\n observer.value = undefined;\n }\n }\n\n onMounted(() => {\n initObserve();\n });\n\n onUpdated(() => {\n destroyObserver();\n debouncedInitObserve();\n });\n\n onDeactivated(() => {\n destroyObserver();\n });\n\n onBeforeUnmount(() => {\n destroyObserver();\n });\n\n function onMoreClick(toggleMoreDropdown) {\n toggleMoreDropdown();\n isMoreMenuOpen.value = !isMoreMenuOpen.value;\n }\n</script>\n\n<template>\n <div class=\"stash-tabs tw-relative\" role=\"tabList\" data-test=\"stash-tabs\">\n <ul\n ref=\"tabListEl\"\n :style=\"{\n width: `calc(100% - ${moreDropdownWidth}px)`,\n }\"\n class=\"stash-tabs-list tw-flex tw-items-end\"\n :class=\"{\n 'stash-tabs-list--line': variant === 'line',\n 'stash-tabs-list--enclosed': variant === 'enclosed',\n 'tw-gap-6': variant === 'line',\n }\"\n >\n <slot></slot>\n\n <Dropdown v-if=\"overflowIds.size\" ref=\"moreDropdownEl\" class=\"!tw-absolute tw-right-0 tw-top-0\">\n <template #toggle=\"{ toggle }\">\n <button\n aria-haspopup=\"menu\"\n :aria-controls=\"moreMenuId\"\n :aria-expanded=\"isMoreMenuOpen\"\n class=\"tw-flex tw-cursor-pointer tw-items-center tw-justify-center tw-border-solid tw-px-6 tw-py-1.5 tw-text-sm tw-font-medium tw-text-blue-500 hover:tw-text-blue-700\"\n :class=\"{ 'tw-border-t-4 tw-border-transparent': props.variant === 'enclosed' }\"\n type=\"button\"\n @click=\"onMoreClick(toggle)\"\n >\n {{ t('ll.more') }}\n <Icon name=\"caret-down\" />\n </button>\n </template>\n <template #default>\n <ul :id=\"moreMenuId\" ref=\"moreDropdownMenuEl\" class=\"tw-space-y-1.5 tw-px-1.5 tw-pb-1.5\" role=\"menu\">\n <slot></slot>\n </ul>\n </template>\n </Dropdown>\n </ul>\n </div>\n</template>\n\n<style module>\n .menu-tab > a {\n /* prevents the global link styles to overwrite the overflowed tab styles */\n &,\n &:hover,\n &:focus {\n color: inherit;\n }\n }\n</style>\n"],"names":["TABS_INJECTION","TabVariant","emit","__emit","props","__props","classes","useCssModule","tabListEl","ref","moreDropdownMenuEl","observer","hasIntersectionObserver","overflowIds","moreDropdownWidth","moreDropdownEl","moreMenuId","uniqueId","isMoreMenuOpen","currentActiveTab","computed","nv","setActiveTab","newTabValue","provide","initObserve","tabs","_a","options","v","i","entries","entry","dataId","element","_c","_b","firstElementChild","span","debouncedInitObserve","debounce","DEBOUNCE","destroyObserver","onMounted","onUpdated","onDeactivated","onBeforeUnmount","onMoreClick","toggleMoreDropdown"],"mappings":"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"}
1
+ {"version":3,"file":"Tabs.vue_vue_type_script_setup_true_lang-CmnBP4i1.js","sources":["../src/components/Tabs/keys.ts","../src/components/Tabs/models.ts","../src/components/Tabs/Tabs.vue"],"sourcesContent":["import { Injection } from '../../../types/utils';\nimport { TabsInjection } from './models';\n\nexport const TABS_INJECTION: Injection<TabsInjection> = Object.freeze({\n key: Symbol('TABS_INJECTION_KEY'),\n});\n","import { ComputedRef } from 'vue';\n\nexport enum TabVariant {\n Line = 'line',\n Enclosed = 'enclosed',\n}\n\nexport type TabVariants = `${TabVariant}`;\n\nexport interface TabsInjection {\n activeTab: ComputedRef<string>;\n variant: ComputedRef<TabVariants>;\n setActiveTab: (newTabValue: string) => void;\n}\n","<script lang=\"ts\">\n import { TabVariant, TabVariants } from './models';\n\n export * from './keys';\n export * from './models';\n\n export interface TabsProps {\n /**\n * The currently active tab value\n */\n activeTab: string;\n\n /**\n * Tabs variant\n */\n variant?: TabVariants;\n }\n</script>\n\n<script setup lang=\"ts\">\n import debounce from 'lodash-es/debounce';\n import uniqueId from 'lodash-es/uniqueId';\n import { computed, onBeforeUnmount, onDeactivated, onMounted, onUpdated, provide, Ref, ref, useCssModule } from 'vue';\n\n import { DEBOUNCE } from '../../constants';\n import { t } from '../../locale';\n import Dropdown from '../Dropdown/Dropdown.vue';\n import Icon from '../Icon/Icon.vue';\n import { TABS_INJECTION } from './keys';\n\n const emit = defineEmits<{\n (e: 'update:activeTab', newTabValue: TabsProps['activeTab']): void;\n }>();\n\n const props = withDefaults(defineProps<TabsProps>(), {\n variant: TabVariant.Line,\n });\n const classes = useCssModule();\n\n const tabListEl = ref();\n const moreDropdownMenuEl = ref();\n const observer: Ref<IntersectionObserver | undefined> = ref(undefined);\n const hasIntersectionObserver = 'IntersectionObserver' in window;\n const overflowIds = ref<Set<string>>(new Set());\n const moreDropdownWidth = ref(0);\n const moreDropdownEl = ref<InstanceType<typeof Dropdown>>();\n const moreMenuId = uniqueId('more-dropdown-menu-');\n const isMoreMenuOpen = ref(false);\n\n const currentActiveTab = computed({\n get() {\n return props.activeTab;\n },\n set(nv: TabsProps['activeTab']) {\n emit('update:activeTab', nv);\n },\n });\n\n function setActiveTab(newTabValue: TabsProps['activeTab']) {\n currentActiveTab.value = newTabValue;\n }\n\n provide(TABS_INJECTION.key, {\n activeTab: computed(() => currentActiveTab.value),\n variant: computed(() => props.variant),\n setActiveTab,\n });\n\n function initObserve() {\n if (!hasIntersectionObserver) {\n return;\n }\n\n if (!tabListEl.value) {\n return;\n }\n\n const tabs = Array.from(tabListEl.value?.children as HTMLLIElement[]);\n const options = {\n root: tabListEl.value,\n rootMargin: '0px',\n threshold: Array.from({ length: 100 }).map((v, i) => (i + 1) / 100),\n };\n\n observer.value = new IntersectionObserver((entries) => {\n entries.forEach((entry) => {\n const dataId = entry.target.getAttribute('id') as string;\n /**\n * Check for partial intersection.\n * Zooming out can result in ratio of approx 0.984\n * Anything higher will result in nav items disappearing\n */\n if (entry.intersectionRatio > 0.94) {\n // show tab, hide in dropdown\n if (overflowIds.value.has(dataId)) {\n overflowIds.value.delete(dataId);\n }\n } else {\n // hide tab, show in dropdown\n if (dataId && !overflowIds.value.has(dataId)) {\n overflowIds.value.add(dataId);\n }\n }\n });\n }, options);\n\n tabs.forEach((element) => {\n observer.value?.observe(element);\n if (overflowIds.value.has(element.getAttribute('id') as string)) {\n element.classList.add('tw-invisible');\n } else {\n element.classList.remove('tw-invisible');\n }\n });\n\n moreDropdownWidth.value = moreDropdownEl.value?.$el?.getBoundingClientRect().width || 0;\n\n if (!moreDropdownMenuEl.value) {\n return;\n }\n\n const dropdownList = Array.from(moreDropdownMenuEl.value.children as HTMLLIElement[]);\n dropdownList.forEach((element) => {\n const firstElementChild = element.firstElementChild as Element;\n firstElementChild.className = '';\n element.className = '';\n\n element.classList.add(\n classes['menu-tab'],\n 'tw-flex',\n 'tw-items-center',\n 'tw-justify-between',\n 'tw-rounded',\n 'tw-text-sm',\n 'tw-p-1.5',\n 'tw-text-left',\n 'tw-cursor-pointer',\n 'tw-text-ice-700',\n 'hover:!tw-bg-ice-200',\n 'aria-disabled:tw-text-ice-500',\n 'aria-disabled:tw-pointer-events-none',\n 'aria-disabled:hover:tw-text-ice-500',\n 'aria-disabled:hover:tw-bg-inherit',\n 'aria-disabled:hover:tw-cursor-default',\n 'aria-selected:tw-bg-blue-100',\n );\n\n element.querySelector('.stash-tabs__dropdown-selected-tab-icon')?.remove();\n\n if (element.getAttribute('id') === `tab-${currentActiveTab.value}`) {\n const span = document.createElement('span');\n span.className = 'stash-tabs__dropdown-selected-tab-icon';\n span.innerHTML = `<svg xmlns=\"http://www.w3.org/2000/svg\" class=\"tw-text-blue-500 tw-w-6 tw-h-6\" viewBox=\"0 0 24 24\" fill=\"none\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M20.707 6.854 9 18.561l-5.707-5.707 1.414-1.414L9 15.733 19.293 5.44l1.414 1.414Z\" clip-rule=\"evenodd\"/></svg>`;\n element.appendChild(span);\n }\n\n if (!overflowIds.value.has(element.getAttribute('id') as string)) {\n element.classList.add('tw-hidden');\n } else {\n element.classList.remove('tw-hidden');\n }\n\n element.removeEventListener('click', () => {});\n });\n }\n\n const debouncedInitObserve = debounce(initObserve, DEBOUNCE.FAST, { leading: true });\n\n function destroyObserver() {\n if (observer.value) {\n observer.value.disconnect();\n observer.value = undefined;\n }\n }\n\n onMounted(() => {\n initObserve();\n });\n\n onUpdated(() => {\n destroyObserver();\n debouncedInitObserve();\n });\n\n onDeactivated(() => {\n destroyObserver();\n });\n\n onBeforeUnmount(() => {\n destroyObserver();\n });\n\n function onMoreClick(toggleMoreDropdown) {\n toggleMoreDropdown();\n isMoreMenuOpen.value = !isMoreMenuOpen.value;\n }\n</script>\n\n<template>\n <div class=\"stash-tabs tw-relative\" role=\"tabList\" data-test=\"stash-tabs\">\n <ul\n ref=\"tabListEl\"\n :style=\"{\n width: `calc(100% - ${moreDropdownWidth}px)`,\n }\"\n class=\"stash-tabs-list tw-flex tw-items-end\"\n :class=\"{\n 'stash-tabs-list--line': variant === 'line',\n 'stash-tabs-list--enclosed': variant === 'enclosed',\n 'tw-gap-6': variant === 'line',\n }\"\n >\n <slot></slot>\n\n <Dropdown v-if=\"overflowIds.size\" ref=\"moreDropdownEl\" class=\"!tw-absolute tw-right-0 tw-top-0\">\n <template #toggle=\"{ toggle }\">\n <button\n aria-haspopup=\"menu\"\n :aria-controls=\"moreMenuId\"\n :aria-expanded=\"isMoreMenuOpen\"\n class=\"tw-flex tw-cursor-pointer tw-items-center tw-justify-center tw-border-solid tw-px-6 tw-py-1.5 tw-text-sm tw-font-medium tw-text-blue-500 hover:tw-text-blue-700\"\n :class=\"{ 'tw-border-t-4 tw-border-transparent': props.variant === 'enclosed' }\"\n type=\"button\"\n @click=\"onMoreClick(toggle)\"\n >\n {{ t('ll.more') }}\n <Icon name=\"caret-down\" />\n </button>\n </template>\n <template #default>\n <ul :id=\"moreMenuId\" ref=\"moreDropdownMenuEl\" class=\"tw-space-y-1.5 tw-px-1.5 tw-pb-1.5\" role=\"menu\">\n <slot></slot>\n </ul>\n </template>\n </Dropdown>\n </ul>\n </div>\n</template>\n\n<style module>\n .menu-tab > a {\n /* prevents the global link styles to overwrite the overflowed tab styles */\n &,\n &:hover,\n &:focus {\n color: inherit;\n }\n }\n</style>\n"],"names":["TABS_INJECTION","TabVariant","emit","__emit","props","__props","classes","useCssModule","tabListEl","ref","moreDropdownMenuEl","observer","hasIntersectionObserver","overflowIds","moreDropdownWidth","moreDropdownEl","moreMenuId","uniqueId","isMoreMenuOpen","currentActiveTab","computed","nv","setActiveTab","newTabValue","provide","initObserve","tabs","_a","options","v","i","entries","entry","dataId","element","_c","_b","firstElementChild","span","debouncedInitObserve","debounce","DEBOUNCE","destroyObserver","onMounted","onUpdated","onDeactivated","onBeforeUnmount","onMoreClick","toggleMoreDropdown"],"mappings":"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"}