@leaflink/stash 50.11.0 → 50.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.
Files changed (204) hide show
  1. package/dist/Accordion.js +30 -31
  2. package/dist/Accordion.js.map +1 -1
  3. package/dist/Accordion.vue.d.ts +6 -1
  4. package/dist/ActionsDropdown.js +2 -2
  5. package/dist/AddressSelect.js +2 -2
  6. package/dist/Alert.js +6 -6
  7. package/dist/AppNavigationItem.js +8 -8
  8. package/dist/AppNavigationItem.vue.d.ts +5 -0
  9. package/dist/AppSidebar.js +9 -9
  10. package/dist/AppSidebar.js.map +1 -1
  11. package/dist/AppTopbar.js +3 -3
  12. package/dist/Avatar.js +3 -3
  13. package/dist/Backdrop.js +2 -2
  14. package/dist/Badge.js +2 -2
  15. package/dist/Box.js +1 -1
  16. 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
  17. 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
  18. package/dist/Button.js +3 -3
  19. package/dist/ButtonGroup.js +4 -4
  20. package/dist/Card.js +7 -7
  21. package/dist/CardContent.js +2 -2
  22. package/dist/CardFooter.js +2 -2
  23. package/dist/CardHeader.js +4 -4
  24. package/dist/CardMedia.js +6 -6
  25. package/dist/Carousel.js +33 -33
  26. package/dist/Carousel.js.map +1 -1
  27. package/dist/Checkbox.js +7 -7
  28. package/dist/ChevronToggle.js +1 -1
  29. 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
  30. 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
  31. package/dist/Chip.js +7 -7
  32. package/dist/ConfirmationCodeInput.js +6 -6
  33. package/dist/ContextSwitcher.js +1 -1
  34. package/dist/Copy.js +1 -1
  35. package/dist/CurrencyInput.js +115 -111
  36. package/dist/CurrencyInput.js.map +1 -1
  37. package/dist/DataView.js +102 -98
  38. package/dist/DataView.js.map +1 -1
  39. package/dist/{DataView.keys-C7eaZg2G.js → DataView.keys-aSOnA4AD.js} +2 -1
  40. package/dist/DataView.keys-aSOnA4AD.js.map +1 -0
  41. package/dist/DataView.vue.d.ts +11 -0
  42. package/dist/DataViewFilters.js +4 -4
  43. package/dist/DataViewSortButton.js +11 -11
  44. package/dist/DataViewToolbar.js +61 -60
  45. package/dist/DataViewToolbar.js.map +1 -1
  46. package/dist/DatePicker.js +1080 -1037
  47. package/dist/DatePicker.js.map +1 -1
  48. package/dist/DescriptionList.js +2 -2
  49. package/dist/DescriptionListDetail.js +2 -2
  50. package/dist/DescriptionListGroup.js +2 -2
  51. package/dist/DescriptionListTerm.js +3 -3
  52. package/dist/Dialog.js +1 -1
  53. package/dist/Divider.js +2 -2
  54. package/dist/Dropdown.js +19 -19
  55. package/dist/Dropdown.js.map +1 -1
  56. package/dist/EmptyState.js +2 -2
  57. package/dist/Expand.js +1 -1
  58. package/dist/{Expand.vue_vue_type_script_setup_true_lang-D0fSAtHr.js → Expand.vue_vue_type_script_setup_true_lang-CiONJfAp.js} +5 -5
  59. 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
  60. package/dist/Field.js +1 -1
  61. package/dist/{Field.vue_vue_type_script_setup_true_lang-DEizIcDo.js → Field.vue_vue_type_script_setup_true_lang-DRaKs9Lm.js} +6 -6
  62. package/dist/Field.vue_vue_type_script_setup_true_lang-DRaKs9Lm.js.map +1 -0
  63. package/dist/FileUpload.js +7 -7
  64. package/dist/FilterChip.js +1 -1
  65. package/dist/FilterDrawerItem.js +9 -9
  66. package/dist/FilterDropdown.js +2 -2
  67. package/dist/FilterSelect.js +4 -4
  68. package/dist/Filters.js +18 -18
  69. package/dist/Filters.js.map +1 -1
  70. package/dist/HttpError.js +9 -9
  71. package/dist/Icon.js +2 -2
  72. package/dist/Icon.js.map +1 -1
  73. package/dist/Icon.vue.d.ts +5 -0
  74. package/dist/IconLabel.js +2 -2
  75. package/dist/IconLabel.vue.d.ts +5 -0
  76. package/dist/Illustration.js +2 -2
  77. package/dist/{Illustration.vue_vue_type_script_setup_true_lang-CYddAFtS.js → Illustration.vue_vue_type_script_setup_true_lang-BBqgoJO8.js} +3 -3
  78. 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
  79. package/dist/Image.js +2 -2
  80. package/dist/{Image.vue_vue_type_script_setup_true_lang-YUNunj71.js → Image.vue_vue_type_script_setup_true_lang-D5u4av0_.js} +3 -3
  81. 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
  82. package/dist/InlineEdit.js +5 -5
  83. package/dist/InlineEdit.js.map +1 -1
  84. package/dist/Input.js +2 -2
  85. package/dist/InputOptions.js +2 -2
  86. package/dist/InputOptions.js.map +1 -1
  87. package/dist/IntegrationIcon.js +2 -2
  88. package/dist/Label.js +1 -1
  89. package/dist/{Label.vue_vue_type_script_setup_true_lang-C4JKdqvC.js → Label.vue_vue_type_script_setup_true_lang-DPnNUfc6.js} +3 -3
  90. 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
  91. package/dist/LicenseChip.js +2 -2
  92. package/dist/ListItem.js +1 -1
  93. package/dist/ListItemCell.js +2 -2
  94. package/dist/ListView.js +11 -11
  95. package/dist/ListView.js.map +1 -1
  96. package/dist/ListView.vue.d.ts +38 -13
  97. package/dist/Loading.js +2 -2
  98. package/dist/Logo.js +1 -1
  99. package/dist/{Logo.vue_vue_type_script_setup_true_lang-BfUU9J9O.js → Logo.vue_vue_type_script_setup_true_lang-Dz8c98sc.js} +4 -4
  100. 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
  101. package/dist/Menu.js +2 -2
  102. package/dist/MenuItem.js +2 -2
  103. package/dist/Metric.js +5 -5
  104. package/dist/Modal.js +20 -20
  105. package/dist/Modals.js +12 -12
  106. package/dist/Modals.js.map +1 -1
  107. package/dist/Module.js +3 -3
  108. package/dist/ModuleContent.js +3 -3
  109. package/dist/ModuleFooter.js +2 -2
  110. package/dist/ModuleHeader.js +2 -2
  111. package/dist/ModuleHeader.js.map +1 -1
  112. package/dist/ObfuscateText.js +7 -7
  113. package/dist/PageContent.js +3 -3
  114. package/dist/PageHeader.js +6 -6
  115. package/dist/PageNavigation.js +1 -1
  116. package/dist/Paginate.js +73 -55
  117. package/dist/Paginate.js.map +1 -1
  118. package/dist/Paginate.vue.d.ts +12 -1
  119. package/dist/PlaidLink.js +2 -2
  120. package/dist/QuickAction.js +2 -2
  121. package/dist/QuickAction.vue.d.ts +5 -0
  122. package/dist/Radio.js +2 -2
  123. package/dist/RadioGroup.js +2 -2
  124. package/dist/RadioNew.js +1 -1
  125. package/dist/RangeInput.js +2 -2
  126. package/dist/SearchBar.js +4 -4
  127. package/dist/SearchBar.js.map +1 -1
  128. package/dist/Select.js +7 -7
  129. package/dist/Select.js.map +1 -1
  130. package/dist/SelectStatus.js +19 -19
  131. package/dist/SelectStatus.js.map +1 -1
  132. package/dist/SelectStatus.vue.d.ts +5 -0
  133. package/dist/Skeleton.js +4 -4
  134. package/dist/Step.js +19 -19
  135. package/dist/Step.js.map +1 -1
  136. package/dist/Stepper.js +9 -9
  137. package/dist/Switch.js +7 -7
  138. package/dist/Tab.js +4 -4
  139. package/dist/TabPanel.js +2 -2
  140. package/dist/Table.js +6 -6
  141. package/dist/Table.js.map +1 -1
  142. package/dist/TableCell.js +7 -7
  143. package/dist/TableHeaderCell.js +4 -4
  144. package/dist/TableHeaderRow.js +5 -5
  145. package/dist/TableRow.js +5 -5
  146. package/dist/TableRow.js.map +1 -1
  147. package/dist/TableRow.vue.d.ts +12 -8
  148. package/dist/Tabs.js +2 -2
  149. package/dist/{Tabs.vue_vue_type_script_setup_true_lang-NZm1OrRT.js → Tabs.vue_vue_type_script_setup_true_lang-CmnBP4i1.js} +4 -4
  150. 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
  151. package/dist/TextEditor.js +3314 -3291
  152. package/dist/TextEditor.js.map +1 -1
  153. package/dist/TextEditor.vue.d.ts +5 -0
  154. package/dist/Textarea.js +3 -3
  155. package/dist/Textarea.js.map +1 -1
  156. package/dist/Thumbnail.js +7 -7
  157. package/dist/Thumbnail.js.map +1 -1
  158. package/dist/ThumbnailEmpty.js +3 -3
  159. package/dist/ThumbnailGroup.js +6 -6
  160. package/dist/ThumbnailGroup.js.map +1 -1
  161. package/dist/{ThumbnailGroup.keys-D6WL5xQ5.js → ThumbnailGroup.keys-EJ4qFNhx.js} +2 -2
  162. package/dist/{ThumbnailGroup.keys-D6WL5xQ5.js.map → ThumbnailGroup.keys-EJ4qFNhx.js.map} +1 -1
  163. package/dist/Timeline.js +2 -2
  164. package/dist/TimelineItem.js +3 -3
  165. package/dist/Toast.js +277 -280
  166. package/dist/Toast.js.map +1 -1
  167. package/dist/Toasts.js +1 -1
  168. package/dist/Tooltip.js +1 -1
  169. package/dist/components.css +1 -1
  170. package/dist/directives/autofocus.js +2 -2
  171. package/dist/directives/autofocus.js.map +1 -1
  172. package/dist/directives/sticky.js.map +1 -1
  173. package/dist/{formatDateTime-C8CYECpd.js → formatDateTime-Dz8bXV0R.js} +98 -12
  174. package/dist/{formatDateTime-C8CYECpd.js.map → formatDateTime-Dz8bXV0R.js.map} +1 -1
  175. package/dist/index.js +2 -2
  176. package/dist/index.js.map +1 -1
  177. package/dist/locale.js +3 -2
  178. package/dist/locale.js.map +1 -1
  179. package/dist/searchFuzzy-DRasJ33G.js +409 -0
  180. package/dist/{searchFuzzy-DKooyZM8.js.map → searchFuzzy-DRasJ33G.js.map} +1 -1
  181. package/dist/storage.js +3 -3
  182. package/dist/tailwind-base.js +0 -2
  183. package/dist/tailwind-base.js.map +1 -1
  184. package/dist/{toTimeZone-CVE1ZmsS.js → toTimeZone-Coq1oPTt.js} +7 -9
  185. package/dist/{toTimeZone-CVE1ZmsS.js.map → toTimeZone-Coq1oPTt.js.map} +1 -1
  186. package/dist/useModals.js.map +1 -1
  187. package/dist/usePaginationStats-d_q39naC.js +12 -0
  188. package/dist/usePaginationStats-d_q39naC.js.map +1 -0
  189. package/dist/useSearch.js +1 -1
  190. package/dist/useSelection.js +4 -1
  191. package/dist/useSelection.js.map +1 -1
  192. package/dist/useValidation.js +39 -36
  193. package/dist/useValidation.js.map +1 -1
  194. package/dist/utils/formatDateTime.js +2 -2
  195. package/dist/utils/helpers.js +29 -29
  196. package/dist/utils/helpers.js.map +1 -1
  197. package/dist/utils/searchFuzzy.js +1 -1
  198. package/dist/utils/toTimeZone.js +1 -1
  199. package/package.json +42 -20
  200. package/tailwind-base.ts +0 -2
  201. package/types/jsonApi.ts +8 -8
  202. package/dist/DataView.keys-C7eaZg2G.js.map +0 -1
  203. package/dist/Field.vue_vue_type_script_setup_true_lang-DEizIcDo.js.map +0 -1
  204. package/dist/searchFuzzy-DKooyZM8.js +0 -407
@@ -1,4 +1,4 @@
1
- import { defineComponent as d, provide as n, openBlock as s, createElementBlock as i, normalizeClass as o, renderSlot as l } from "vue";
1
+ import { defineComponent as d, provide as n, createElementBlock as s, openBlock as i, normalizeClass as o, renderSlot as l } from "vue";
2
2
  import { D as r } from "./DescriptionList.keys-BHlHYV6b.js";
3
3
  var c = /* @__PURE__ */ ((e) => (e.Columns = "columns", e.Inline = "inline", e.Stacked = "stacked", e.SpaceBetween = "space-between", e))(c || {});
4
4
  const p = ["data-variant"], f = /* @__PURE__ */ d({
@@ -9,7 +9,7 @@ const p = ["data-variant"], f = /* @__PURE__ */ d({
9
9
  },
10
10
  setup(e) {
11
11
  const t = e;
12
- return n(r.key, { divide: t.divide, variant: t.variant }), (a, v) => (s(), i("dl", {
12
+ return n(r.key, { divide: t.divide, variant: t.variant }), (a, v) => (i(), s("dl", {
13
13
  "data-variant": t.variant,
14
14
  class: o(["stash-description-list tw-text-sm", {
15
15
  "tw-divide-y tw-divide-ice-200": t.divide
@@ -1,4 +1,4 @@
1
- import { defineComponent as a, inject as n, openBlock as o, createElementBlock as r, normalizeClass as c, unref as i, renderSlot as d } from "vue";
1
+ import { defineComponent as a, inject as n, createElementBlock as o, openBlock as r, unref as i, normalizeClass as c, renderSlot as d } from "vue";
2
2
  import { D as l } from "./DescriptionList.keys-BHlHYV6b.js";
3
3
  const p = ["data-variant"], h = /* @__PURE__ */ a({
4
4
  __name: "DescriptionListDetail",
@@ -7,7 +7,7 @@ const p = ["data-variant"], h = /* @__PURE__ */ a({
7
7
  if (!t)
8
8
  throw new Error("DescriptionListDetail must be used within a DescriptionList component.");
9
9
  const { variant: e } = t;
10
- return (s, _) => (o(), r("dd", {
10
+ return (s, _) => (r(), o("dd", {
11
11
  class: c(["stash-description-list-detail tw-flex-1 tw-text-ice-700", {
12
12
  "md:tw-text-right": i(e) === "space-between"
13
13
  }]),
@@ -1,4 +1,4 @@
1
- import { defineComponent as n, inject as o, openBlock as r, createElementBlock as p, normalizeClass as d, unref as t, renderSlot as c } from "vue";
1
+ import { defineComponent as n, inject as o, createElementBlock as r, openBlock as p, unref as t, normalizeClass as d, renderSlot as c } from "vue";
2
2
  import { D as l } from "./DescriptionList.keys-BHlHYV6b.js";
3
3
  const w = ["data-divide", "data-variant"], v = /* @__PURE__ */ n({
4
4
  __name: "DescriptionListGroup",
@@ -7,7 +7,7 @@ const w = ["data-divide", "data-variant"], v = /* @__PURE__ */ n({
7
7
  if (!s)
8
8
  throw new Error("DescriptionListDetail must be used within a DescriptionList component.");
9
9
  const { divide: i, variant: e } = s;
10
- return (a, u) => (r(), p("div", {
10
+ return (a, u) => (p(), r("div", {
11
11
  class: d(["stash-description-list-group", {
12
12
  "md:tw-flex md:tw-gap-x-6": t(e) === "columns" || t(e) === "space-between",
13
13
  "tw-justify-between": t(e) === "space-between",
@@ -1,4 +1,4 @@
1
- import { defineComponent as o, inject as r, openBlock as i, createElementBlock as n, normalizeClass as c, unref as e, renderSlot as d, createCommentVNode as m } from "vue";
1
+ import { defineComponent as o, inject as r, createElementBlock as i, openBlock as n, unref as e, normalizeClass as c, renderSlot as d, createCommentVNode as m } from "vue";
2
2
  import { D as l } from "./DescriptionList.keys-BHlHYV6b.js";
3
3
  const p = ["data-variant"], w = {
4
4
  key: 0,
@@ -10,7 +10,7 @@ const p = ["data-variant"], w = {
10
10
  if (!s)
11
11
  throw new Error("DescriptionListDetail must be used within a DescriptionList component.");
12
12
  const { variant: t } = s;
13
- return (a, u) => (i(), n("dt", {
13
+ return (a, u) => (n(), i("dt", {
14
14
  class: c(["stash-description-list-term tw-font-medium tw-text-ice-900", {
15
15
  "md:tw-max-w-40 md:tw-basis-2/5": e(t) === "columns",
16
16
  "tw-mr-1.5": e(t) === "inline",
@@ -21,7 +21,7 @@ const p = ["data-variant"], w = {
21
21
  "data-variant": e(t)
22
22
  }, [
23
23
  d(a.$slots, "default"),
24
- e(t) === "inline" ? (i(), n("span", w, ":")) : m("", !0)
24
+ e(t) === "inline" ? (n(), i("span", w, ":")) : m("", !0)
25
25
  ], 10, p));
26
26
  }
27
27
  });
package/dist/Dialog.js CHANGED
@@ -1,4 +1,4 @@
1
- import { defineComponent as A, useSlots as H, useAttrs as K, useCssModule as L, ref as T, computed as s, watchEffect as q, nextTick as F, openBlock as l, createBlock as f, Transition as P, withCtx as m, createElementBlock as _, mergeProps as Y, unref as e, withKeys as j, createElementVNode as a, normalizeClass as o, createCommentVNode as c, toDisplayString as p, renderSlot as G, createTextVNode as S, createVNode as J } from "vue";
1
+ import { defineComponent as A, useSlots as H, useAttrs as K, useCssModule as L, ref as T, computed as s, watchEffect as q, nextTick as F, createBlock as f, openBlock as l, Transition as P, withCtx as m, createElementBlock as _, createCommentVNode as c, mergeProps as Y, unref as e, withKeys as j, createElementVNode as a, normalizeClass as o, toDisplayString as p, renderSlot as G, createVNode as J, createTextVNode as S } from "vue";
2
2
  import y from "lodash-es/capitalize";
3
3
  import O from "lodash-es/uniqueId";
4
4
  import { S as B, b as g, a as I } from "./statusLevels-D8EgtE_L.js";
package/dist/Divider.js CHANGED
@@ -1,4 +1,4 @@
1
- import { openBlock as t, createElementBlock as s, normalizeClass as r, renderSlot as o } from "vue";
1
+ import { createElementBlock as t, openBlock as s, normalizeClass as r, renderSlot as o } from "vue";
2
2
  import { _ as a } from "./_plugin-vue_export-helper-CHgC5LLL.js";
3
3
  const c = "_separator_5w47w_2", l = {
4
4
  separator: c
@@ -6,7 +6,7 @@ const c = "_separator_5w47w_2", l = {
6
6
  name: "ll-divider"
7
7
  };
8
8
  function p(e, i, _, f, m, u) {
9
- return t(), s("div", {
9
+ return s(), t("div", {
10
10
  class: r(["tw-flex tw-items-center tw-text-center tw-uppercase", e.$style.separator]),
11
11
  role: "separator"
12
12
  }, [
package/dist/Dropdown.js CHANGED
@@ -1,5 +1,5 @@
1
- import { defineComponent as I, ref as r, useCssModule as q, watch as C, onMounted as K, onBeforeUnmount as R, computed as U, withDirectives as _, openBlock as m, createElementBlock as k, renderSlot as x, createElementVNode as E, normalizeClass as b, createTextVNode as V, toDisplayString as W, createVNode as S, createBlock as Y, Transition as F, withCtx as j, unref as M, normalizeStyle as G, vShow as H, nextTick as A } from "vue";
2
- import { KEY_CODES as d } from "./constants.js";
1
+ import { defineComponent as I, ref as r, useCssModule as q, watch as C, onMounted as K, onBeforeUnmount as R, computed as U, withDirectives as _, createElementBlock as k, openBlock as m, renderSlot as x, createVNode as E, createElementVNode as b, normalizeClass as S, createBlock as V, createTextVNode as W, toDisplayString as Y, Transition as F, withCtx as j, normalizeStyle as G, unref as M, vShow as H, nextTick as A } from "vue";
2
+ import { KEY_CODES as f } from "./constants.js";
3
3
  import J from "./directives/clickoutside.js";
4
4
  import Q from "./utils/calculateElementOverflow.js";
5
5
  import { getMountPoint as X } from "./utils/helpers.js";
@@ -22,7 +22,7 @@ const ee = ["aria-expanded"], te = {
22
22
  },
23
23
  emits: ["toggle", "dismiss"],
24
24
  setup(D, { expose: $, emit: L }) {
25
- const a = D, p = L, t = r(null), w = r(null), f = [], s = r(f), i = r(-1), l = r(!1), g = r({}), T = q();
25
+ const a = D, p = L, t = r(null), w = r(null), d = [], s = r(d), i = r(-1), l = r(!1), g = r({}), T = q();
26
26
  C(l, (e) => {
27
27
  e || (i.value = -1), p("toggle", e);
28
28
  }), C(i, (e, o) => {
@@ -33,7 +33,7 @@ const ee = ["aria-expanded"], te = {
33
33
  const c = X();
34
34
  t.value && c.appendChild(t.value);
35
35
  }
36
- (e = t.value) != null && e.querySelector(".stash-menu") ? s.value = ((o = t.value) == null ? void 0 : o.querySelectorAll(".stash-menu-item")) ?? f : s.value = ((n = t.value) == null ? void 0 : n.querySelectorAll(".dropdown__item")) ?? f, window.addEventListener("resize", () => u());
36
+ (e = t.value) != null && e.querySelector(".stash-menu") ? s.value = ((o = t.value) == null ? void 0 : o.querySelectorAll(".stash-menu-item")) ?? d : s.value = ((n = t.value) == null ? void 0 : n.querySelectorAll(".dropdown__item")) ?? d, window.addEventListener("resize", () => u());
37
37
  }), R(() => {
38
38
  var e, o;
39
39
  window.removeEventListener("resize", () => u()), (o = (e = t == null ? void 0 : t.value) == null ? void 0 : e.parentNode) == null || o.removeChild(t.value);
@@ -50,14 +50,14 @@ const ee = ["aria-expanded"], te = {
50
50
  l.value ? l.value = !1 : (l.value = !0, await z(), (e = t.value) == null || e.focus());
51
51
  }
52
52
  function N(e) {
53
- if (e.keyCode === d.ESCAPE)
53
+ if (e.keyCode === f.ESCAPE)
54
54
  u();
55
- else if (e.keyCode === d.DOWN && i.value < s.value.length - 1)
56
- l.value && i.value++;
57
- else if (e.keyCode === d.UP && i.value > -1)
58
- l.value && i.value--;
59
- else if (e.keyCode === d.ENTER && i.value !== -1)
60
- l.value && s[i.value].click();
55
+ else if (e.keyCode === f.DOWN && i.value < s.value.length - 1 && l.value)
56
+ i.value++;
57
+ else if (e.keyCode === f.UP && i.value > -1 && l.value)
58
+ i.value--;
59
+ else if (e.keyCode === f.ENTER && i.value !== -1 && l.value)
60
+ s[i.value].click();
61
61
  else
62
62
  return;
63
63
  e.preventDefault();
@@ -100,31 +100,31 @@ const ee = ["aria-expanded"], te = {
100
100
  isActive: l.value,
101
101
  toggle: v
102
102
  }, () => [
103
- E("button", {
103
+ b("button", {
104
104
  "data-test": "button|toggle",
105
105
  "aria-expanded": l.value,
106
- class: b([e.label ? "tw-min-w-auto tw-outline-none" : "tw-rounded tw-p-3"]),
106
+ class: S([e.label ? "tw-min-w-auto tw-outline-none" : "tw-rounded tw-p-3"]),
107
107
  onClick: v
108
108
  }, [
109
109
  e.label ? (m(), k("span", te, [
110
- V(W(e.label) + " ", 1),
111
- S(B, { name: "caret-down" })
112
- ])) : (m(), Y(B, {
110
+ W(Y(e.label) + " ", 1),
111
+ E(B, { name: "caret-down" })
112
+ ])) : (m(), V(B, {
113
113
  key: 1,
114
114
  name: "ellipsis"
115
115
  }))
116
116
  ], 10, ee)
117
117
  ]),
118
- S(F, {
118
+ E(F, {
119
119
  name: "fade",
120
120
  onAfterLeave: O
121
121
  }, {
122
122
  default: j(() => [
123
- _(E("div", {
123
+ _(b("div", {
124
124
  ref_key: "contentRef",
125
125
  ref: t,
126
126
  "data-test": "ll-dropdown-content",
127
- class: b([
127
+ class: S([
128
128
  M(T).content,
129
129
  e.contentClass,
130
130
  {
@@ -1 +1 @@
1
- {"version":3,"file":"Dropdown.js","sources":["../src/components/Dropdown/Dropdown.vue"],"sourcesContent":["<script setup lang=\"ts\">\n import { computed, nextTick, onBeforeUnmount, onMounted, ref, useCssModule, watch } from 'vue';\n\n import { KEY_CODES } from '../../constants';\n import vClickoutside from '../../directives/clickoutside/clickoutside';\n import calculateElementOverflow from '../../utils/calculateElementOverflow';\n import { getMountPoint } from '../../utils/helpers';\n import Icon from '../Icon/Icon.vue';\n\n export type DropdownOffset = {\n x?: number;\n y?: number;\n };\n\n export interface DropdownProps {\n /**\n * Used to position the dropdown relative to target\n * Options: left, right\n */\n align?: 'left' | 'right';\n /**\n * When passed, text with caret is displayed instead of default kebab menu.\n */\n label?: string;\n /**\n * If true, dropdown will remain open when clicking on its content. Otherwise, it'll close automatically on click.\n */\n closeManually?: boolean;\n /**\n * Used to horizontally and vertically offset the dropdown in pixels\n * Keep in mind, `x` value is relative to `align` value.\n */\n offset?: DropdownOffset;\n /**\n * If `reattach` is true, the contents will be mounted in the mount point container,\n * so as to circumvent clipping issues from a parent's overflow property.\n */\n reattach?: boolean;\n /**\n * Custom class to apply to the default dropdown content element\n */\n contentClass?: string | string[];\n /**\n * Removes content container's max width\n */\n fluidContent?: boolean;\n }\n\n type DropdownStyles = {\n left?: string;\n right?: string;\n top?: string;\n };\n\n defineOptions({\n name: 'll-dropdown',\n });\n\n const props = withDefaults(defineProps<DropdownProps>(), {\n align: 'right',\n label: '',\n closeManually: false,\n offset: () => ({}),\n reattach: true,\n contentClass: '',\n fluidContent: false,\n });\n\n const emit = defineEmits<{\n toggle: [isActive: boolean];\n dismiss: [];\n }>();\n\n const contentRef = ref<HTMLElement | null>(null);\n const dropdownRef = ref<HTMLDivElement | null>(null);\n\n const DEFAULT_ITEMS_LIST = [] as unknown as NodeListOf<Element>;\n\n const items = ref<NodeListOf<Element>>(DEFAULT_ITEMS_LIST);\n const itemIndex = ref(-1);\n const isActive = ref(false);\n\n const styles = ref<DropdownStyles>({});\n const classes = useCssModule();\n\n watch(isActive, (val) => {\n if (!val) {\n itemIndex.value = -1;\n }\n\n emit('toggle', val);\n });\n\n watch(itemIndex, (next, prev) => {\n next in items.value && items.value[next].classList.add('tw-bg-ice-200');\n prev in items.value && items.value[prev].classList.remove('tw-bg-ice-200');\n });\n\n onMounted(() => {\n if (props.reattach) {\n const target = getMountPoint();\n\n contentRef.value && target.appendChild(contentRef.value);\n }\n\n // if stash-menu exists, use it's items\n if (contentRef.value?.querySelector('.stash-menu')) {\n items.value = contentRef.value?.querySelectorAll('.stash-menu-item') ?? DEFAULT_ITEMS_LIST;\n } else {\n items.value = contentRef.value?.querySelectorAll('.dropdown__item') ?? DEFAULT_ITEMS_LIST;\n }\n\n // avoid calling dismiss with ResizeEvent because it's target is the Window element and it's not a valid Node element to be passed to dismiss\n window.addEventListener('resize', () => dismiss());\n });\n\n onBeforeUnmount(() => {\n window.removeEventListener('resize', () => dismiss());\n contentRef?.value?.parentNode?.removeChild(contentRef.value);\n });\n\n /**\n * Dismisses the Dropdown.\n */\n function dismiss(event?: Event) {\n if (\n props.closeManually &&\n (contentRef.value?.contains(event?.target as HTMLElement) || contentRef.value === event?.target)\n ) {\n return;\n }\n\n const wasOpen = isActive.value;\n\n isActive.value = false;\n\n if (wasOpen) {\n emit('dismiss');\n }\n }\n\n /**\n * Opens or closes the Dropdown. If opening, positions and focuses its content.\n */\n async function toggle() {\n if (isActive.value) {\n isActive.value = false;\n } else {\n isActive.value = true;\n await calculateOffset();\n contentRef.value?.focus();\n }\n }\n\n /**\n * Handles all user keyboard input on the Dropdown.\n * @param {KeyboardEvent} e The native keydown event.\n */\n function onKeyDown(e: KeyboardEvent) {\n if (e.keyCode === KEY_CODES.ESCAPE) {\n dismiss();\n } else if (e.keyCode === KEY_CODES.DOWN && itemIndex.value < items.value.length - 1) {\n isActive.value && itemIndex.value++;\n } else if (e.keyCode === KEY_CODES.UP && itemIndex.value > -1) {\n isActive.value && itemIndex.value--;\n } else if (e.keyCode === KEY_CODES.ENTER && itemIndex.value !== -1) {\n isActive.value && items[itemIndex.value].click();\n } else {\n return;\n }\n\n e.preventDefault(); // if keyDown did something / we didn't return\n }\n\n /**\n * Reset any page overflow offset\n */\n function resetOffset() {\n contentRef.value?.style.setProperty('--offset', '0');\n }\n\n /**\n * Calculate the position for the Dropdown content element,\n * relative to the viewport.\n * Repositions the dropdown content element (& arrow)\n * if it overflows the page (including gutter).\n */\n async function calculateOffset() {\n await nextTick();\n\n const toggleBCR = dropdownRef.value?.getBoundingClientRect() || ({} as DOMRect);\n const top = toggleBCR.top + toggleBCR.height;\n const offset = {\n x: 0,\n y: 0,\n ...props.offset,\n };\n\n if (props.reattach) {\n styles.value = {\n left: props.align === 'left' ? `${Math.round(toggleBCR.left) + offset.x}px` : undefined,\n right:\n props.align === 'right'\n ? `${document.documentElement.clientWidth - Math.round(toggleBCR.right) + offset.x}px`\n : undefined,\n top: `${window.scrollY + top + offset.y}px`,\n };\n await nextTick(); // wait for style updates to sync in the DOM\n }\n\n const overflow = calculateElementOverflow(contentRef?.value);\n\n if (overflow) {\n const direction = props.align === 'left' ? '-' : '';\n contentRef.value?.style.setProperty('--offset', `${direction}${overflow.value}`);\n }\n }\n\n defineExpose({\n isActive: computed(() => isActive.value),\n toggle,\n dismiss,\n });\n</script>\n\n<template>\n <div\n ref=\"dropdownRef\"\n v-clickoutside=\"dismiss\"\n class=\"tw-relative tw-inline-block\"\n data-test=\"ll-dropdown\"\n @keydown=\"onKeyDown\"\n >\n <!-- @slot Toggle component slot, receives `toggle` method to trigger Dropdown display -->\n <slot name=\"toggle\" :is-active=\"isActive\" :toggle=\"toggle\">\n <button\n data-test=\"button|toggle\"\n :aria-expanded=\"isActive\"\n :class=\"[label ? 'tw-min-w-auto tw-outline-none' : 'tw-rounded tw-p-3']\"\n @click=\"toggle\"\n >\n <span v-if=\"label\" class=\"tw-flex tw-items-center tw-font-medium tw-text-blue-500 hover:tw-text-blue-700\">\n {{ label }}\n <Icon name=\"caret-down\" />\n </span>\n <Icon v-else name=\"ellipsis\" />\n </button>\n </slot>\n\n <transition name=\"fade\" @after-leave=\"resetOffset\">\n <div\n v-show=\"isActive\"\n ref=\"contentRef\"\n data-test=\"ll-dropdown-content\"\n :class=\"[\n classes.content,\n contentClass,\n {\n 'tw-left-0 after:tw-left-6': props.align === 'left',\n 'tw-right-0': props.align === 'right',\n 'tw-max-w-[360px]': !props.fluidContent,\n },\n ]\"\n :style=\"styles\"\n >\n <!-- @slot Dropdown content slot. Receives `dismiss` method, to trigger manual close. You must call dismiss with parentheses. Receives `is-active` prop. -->\n <slot :dismiss=\"dismiss\" :is-active=\"isActive\"></slot>\n </div>\n </transition>\n </div>\n</template>\n\n<style module>\n .content {\n --offset: 0;\n\n @apply tw-shadow-2xl\n tw-bg-white\n tw-border\n tw-border-solid\n tw-border-blue-500\n tw-rounded\n tw-absolute\n tw-z-[301]\n tw-min-w-[200px];\n\n transform: translateX(calc(var(--offset) * 1px));\n }\n\n /**\n * TODO: these global styles should be componentized in https://leaflink.atlassian.net/browse/STASH-566\n */\n :global(.dropdown__list) {\n @apply tw-bg-white tw-list-none tw-m-1.5 tw-p-0;\n }\n\n :global(.dropdown__item) {\n @apply tw-block tw-mx-0 tw-mt-0 tw-mb-1.5 tw-w-full first:tw-mt-0 last:tw-mb-0;\n }\n\n :global(.dropdown__item) button {\n @apply tw-border-none tw-text-left tw-p-1.5;\n }\n\n :global(.dropdown__item) :where(a, button) {\n @apply tw-rounded\n tw-text-ice-700\n tw-block\n tw-py-[10px]\n tw-px-1.5\n tw-w-full\n disabled:tw-text-ice-500\n disabled:tw-cursor-default\n hover:tw-bg-ice-200\n hover:tw-text-ice-700\n hover:tw-no-underline\n tw-transition-all\n tw-duration-fast\n tw-ease-swing;\n }\n</style>\n"],"names":["props","__props","emit","__emit","contentRef","ref","dropdownRef","DEFAULT_ITEMS_LIST","items","itemIndex","isActive","styles","classes","useCssModule","watch","val","next","prev","onMounted","target","getMountPoint","_a","_b","_c","dismiss","onBeforeUnmount","event","wasOpen","toggle","calculateOffset","onKeyDown","KEY_CODES","resetOffset","nextTick","toggleBCR","top","offset","overflow","calculateElementOverflow","direction","__expose","computed"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AA0DE,UAAMA,IAAQC,GAURC,IAAOC,GAKPC,IAAaC,EAAwB,IAAI,GACzCC,IAAcD,EAA2B,IAAI,GAE7CE,IAAqB,CAAC,GAEtBC,IAAQH,EAAyBE,CAAkB,GACnDE,IAAYJ,EAAI,EAAE,GAClBK,IAAWL,EAAI,EAAK,GAEpBM,IAASN,EAAoB,EAAE,GAC/BO,IAAUC,EAAa;AAEvB,IAAAC,EAAAJ,GAAU,CAACK,MAAQ;AACvB,MAAKA,MACHN,EAAU,QAAQ,KAGpBP,EAAK,UAAUa,CAAG;AAAA,IAAA,CACnB,GAEKD,EAAAL,GAAW,CAACO,GAAMC,MAAS;AACvB,MAAAD,KAAAR,EAAM,SAASA,EAAM,MAAMQ,CAAI,EAAE,UAAU,IAAI,eAAe,GAC9DC,KAAAT,EAAM,SAASA,EAAM,MAAMS,CAAI,EAAE,UAAU,OAAO,eAAe;AAAA,IAAA,CAC1E,GAEDC,EAAU,MAAM;;AACd,UAAIlB,EAAM,UAAU;AAClB,cAAMmB,IAASC,EAAc;AAE7B,QAAAhB,EAAW,SAASe,EAAO,YAAYf,EAAW,KAAK;AAAA,MAAA;AAIzD,OAAIiB,IAAAjB,EAAW,UAAX,QAAAiB,EAAkB,cAAc,iBAClCb,EAAM,UAAQc,IAAAlB,EAAW,UAAX,gBAAAkB,EAAkB,iBAAiB,wBAAuBf,IAExEC,EAAM,UAAQe,IAAAnB,EAAW,UAAX,gBAAAmB,EAAkB,iBAAiB,uBAAsBhB,GAIzE,OAAO,iBAAiB,UAAU,MAAMiB,EAAA,CAAS;AAAA,IAAA,CAClD,GAEDC,EAAgB,MAAM;;AACpB,aAAO,oBAAoB,UAAU,MAAMD,EAAA,CAAS,IACpDF,KAAAD,IAAAjB,KAAA,gBAAAA,EAAY,UAAZ,gBAAAiB,EAAmB,eAAnB,QAAAC,EAA+B,YAAYlB,EAAW;AAAA,IAAK,CAC5D;AAKD,aAASoB,EAAQE,GAAe;;AAE5B,UAAA1B,EAAM,mBACLqB,IAAAjB,EAAW,UAAX,QAAAiB,EAAkB,SAASK,KAAA,gBAAAA,EAAO,WAA0BtB,EAAW,WAAUsB,KAAA,gBAAAA,EAAO;AAEzF;AAGF,YAAMC,IAAUjB,EAAS;AAEzB,MAAAA,EAAS,QAAQ,IAEbiB,KACFzB,EAAK,SAAS;AAAA,IAChB;AAMF,mBAAe0B,IAAS;;AACtB,MAAIlB,EAAS,QACXA,EAAS,QAAQ,MAEjBA,EAAS,QAAQ,IACjB,MAAMmB,EAAgB,IACtBR,IAAAjB,EAAW,UAAX,QAAAiB,EAAkB;AAAA,IACpB;AAOF,aAASS,EAAU,GAAkB;AAC/B,UAAA,EAAE,YAAYC,EAAU;AAClB,QAAAP,EAAA;AAAA,eACC,EAAE,YAAYO,EAAU,QAAQtB,EAAU,QAAQD,EAAM,MAAM,SAAS;AAChF,QAAAE,EAAS,SAASD,EAAU;AAAA,eACnB,EAAE,YAAYsB,EAAU,MAAMtB,EAAU,QAAQ;AACzD,QAAAC,EAAS,SAASD,EAAU;AAAA,eACnB,EAAE,YAAYsB,EAAU,SAAStB,EAAU,UAAU;AAC9D,QAAAC,EAAS,SAASF,EAAMC,EAAU,KAAK,EAAE,MAAM;AAAA;AAE/C;AAGF,QAAE,eAAe;AAAA,IAAA;AAMnB,aAASuB,IAAc;;AACrB,OAAAX,IAAAjB,EAAW,UAAX,QAAAiB,EAAkB,MAAM,YAAY,YAAY;AAAA,IAAG;AASrD,mBAAeQ,IAAkB;;AAC/B,YAAMI,EAAS;AAEf,YAAMC,MAAYb,IAAAf,EAAY,UAAZ,gBAAAe,EAAmB,4BAA4B,CAAC,GAC5Dc,IAAMD,EAAU,MAAMA,EAAU,QAChCE,IAAS;AAAA,QACb,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAGpC,EAAM;AAAA,MACX;AAEA,MAAIA,EAAM,aACRW,EAAO,QAAQ;AAAA,QACb,MAAMX,EAAM,UAAU,SAAS,GAAG,KAAK,MAAMkC,EAAU,IAAI,IAAIE,EAAO,CAAC,OAAO;AAAA,QAC9E,OACEpC,EAAM,UAAU,UACZ,GAAG,SAAS,gBAAgB,cAAc,KAAK,MAAMkC,EAAU,KAAK,IAAIE,EAAO,CAAC,OAChF;AAAA,QACN,KAAK,GAAG,OAAO,UAAUD,IAAMC,EAAO,CAAC;AAAA,MACzC,GACA,MAAMH,EAAS;AAGX,YAAAI,IAAWC,EAAyBlC,KAAA,gBAAAA,EAAY,KAAK;AAE3D,UAAIiC,GAAU;AACZ,cAAME,IAAYvC,EAAM,UAAU,SAAS,MAAM;AACtC,SAAAsB,IAAAlB,EAAA,UAAA,QAAAkB,EAAO,MAAM,YAAY,YAAY,GAAGiB,CAAS,GAAGF,EAAS,KAAK;AAAA,MAAE;AAAA,IACjF;AAGW,WAAAG,EAAA;AAAA,MACX,UAAUC,EAAS,MAAM/B,EAAS,KAAK;AAAA,MACvC,QAAAkB;AAAA,MACA,SAAAJ;AAAA,IAAA,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Dropdown.js","sources":["../src/components/Dropdown/Dropdown.vue"],"sourcesContent":["<script setup lang=\"ts\">\n import { computed, nextTick, onBeforeUnmount, onMounted, ref, useCssModule, watch } from 'vue';\n\n import { KEY_CODES } from '../../constants';\n import vClickoutside from '../../directives/clickoutside/clickoutside';\n import calculateElementOverflow from '../../utils/calculateElementOverflow';\n import { getMountPoint } from '../../utils/helpers';\n import Icon from '../Icon/Icon.vue';\n\n export type DropdownOffset = {\n x?: number;\n y?: number;\n };\n\n export interface DropdownProps {\n /**\n * Used to position the dropdown relative to target\n * Options: left, right\n */\n align?: 'left' | 'right';\n /**\n * When passed, text with caret is displayed instead of default kebab menu.\n */\n label?: string;\n /**\n * If true, dropdown will remain open when clicking on its content. Otherwise, it'll close automatically on click.\n */\n closeManually?: boolean;\n /**\n * Used to horizontally and vertically offset the dropdown in pixels\n * Keep in mind, `x` value is relative to `align` value.\n */\n offset?: DropdownOffset;\n /**\n * If `reattach` is true, the contents will be mounted in the mount point container,\n * so as to circumvent clipping issues from a parent's overflow property.\n */\n reattach?: boolean;\n /**\n * Custom class to apply to the default dropdown content element\n */\n contentClass?: string | string[];\n /**\n * Removes content container's max width\n */\n fluidContent?: boolean;\n }\n\n type DropdownStyles = {\n left?: string;\n right?: string;\n top?: string;\n };\n\n defineOptions({\n name: 'll-dropdown',\n });\n\n const props = withDefaults(defineProps<DropdownProps>(), {\n align: 'right',\n label: '',\n closeManually: false,\n offset: () => ({}),\n reattach: true,\n contentClass: '',\n fluidContent: false,\n });\n\n const emit = defineEmits<{\n toggle: [isActive: boolean];\n dismiss: [];\n }>();\n\n const contentRef = ref<HTMLElement | null>(null);\n const dropdownRef = ref<HTMLDivElement | null>(null);\n\n const DEFAULT_ITEMS_LIST = [] as unknown as NodeListOf<Element>;\n\n const items = ref<NodeListOf<Element>>(DEFAULT_ITEMS_LIST);\n const itemIndex = ref(-1);\n const isActive = ref(false);\n\n const styles = ref<DropdownStyles>({});\n const classes = useCssModule();\n\n watch(isActive, (val) => {\n if (!val) {\n itemIndex.value = -1;\n }\n\n emit('toggle', val);\n });\n\n watch(itemIndex, (next, prev) => {\n if (next in items.value) {\n items.value[next].classList.add('tw-bg-ice-200');\n }\n if (prev in items.value) {\n items.value[prev].classList.remove('tw-bg-ice-200');\n }\n });\n\n onMounted(() => {\n if (props.reattach) {\n const target = getMountPoint();\n\n if (contentRef.value) {\n target.appendChild(contentRef.value);\n }\n }\n\n // if stash-menu exists, use it's items\n if (contentRef.value?.querySelector('.stash-menu')) {\n items.value = contentRef.value?.querySelectorAll('.stash-menu-item') ?? DEFAULT_ITEMS_LIST;\n } else {\n items.value = contentRef.value?.querySelectorAll('.dropdown__item') ?? DEFAULT_ITEMS_LIST;\n }\n\n // avoid calling dismiss with ResizeEvent because it's target is the Window element and it's not a valid Node element to be passed to dismiss\n window.addEventListener('resize', () => dismiss());\n });\n\n onBeforeUnmount(() => {\n window.removeEventListener('resize', () => dismiss());\n contentRef?.value?.parentNode?.removeChild(contentRef.value);\n });\n\n /**\n * Dismisses the Dropdown.\n */\n function dismiss(event?: Event) {\n if (\n props.closeManually &&\n (contentRef.value?.contains(event?.target as HTMLElement) || contentRef.value === event?.target)\n ) {\n return;\n }\n\n const wasOpen = isActive.value;\n\n isActive.value = false;\n\n if (wasOpen) {\n emit('dismiss');\n }\n }\n\n /**\n * Opens or closes the Dropdown. If opening, positions and focuses its content.\n */\n async function toggle() {\n if (isActive.value) {\n isActive.value = false;\n } else {\n isActive.value = true;\n await calculateOffset();\n contentRef.value?.focus();\n }\n }\n\n /**\n * Handles all user keyboard input on the Dropdown.\n * @param {KeyboardEvent} e The native keydown event.\n */\n function onKeyDown(e: KeyboardEvent) {\n if (e.keyCode === KEY_CODES.ESCAPE) {\n dismiss();\n } else if (e.keyCode === KEY_CODES.DOWN && itemIndex.value < items.value.length - 1 && isActive.value) {\n itemIndex.value++;\n } else if (e.keyCode === KEY_CODES.UP && itemIndex.value > -1 && isActive.value) {\n itemIndex.value--;\n } else if (e.keyCode === KEY_CODES.ENTER && itemIndex.value !== -1 && isActive.value) {\n items[itemIndex.value].click();\n } else {\n return;\n }\n\n e.preventDefault(); // if keyDown did something / we didn't return\n }\n\n /**\n * Reset any page overflow offset\n */\n function resetOffset() {\n contentRef.value?.style.setProperty('--offset', '0');\n }\n\n /**\n * Calculate the position for the Dropdown content element,\n * relative to the viewport.\n * Repositions the dropdown content element (& arrow)\n * if it overflows the page (including gutter).\n */\n async function calculateOffset() {\n await nextTick();\n\n const toggleBCR = dropdownRef.value?.getBoundingClientRect() || ({} as DOMRect);\n const top = toggleBCR.top + toggleBCR.height;\n const offset = {\n x: 0,\n y: 0,\n ...props.offset,\n };\n\n if (props.reattach) {\n styles.value = {\n left: props.align === 'left' ? `${Math.round(toggleBCR.left) + offset.x}px` : undefined,\n right:\n props.align === 'right'\n ? `${document.documentElement.clientWidth - Math.round(toggleBCR.right) + offset.x}px`\n : undefined,\n top: `${window.scrollY + top + offset.y}px`,\n };\n await nextTick(); // wait for style updates to sync in the DOM\n }\n\n const overflow = calculateElementOverflow(contentRef?.value);\n\n if (overflow) {\n const direction = props.align === 'left' ? '-' : '';\n contentRef.value?.style.setProperty('--offset', `${direction}${overflow.value}`);\n }\n }\n\n defineExpose({\n isActive: computed(() => isActive.value),\n toggle,\n dismiss,\n });\n</script>\n\n<template>\n <div\n ref=\"dropdownRef\"\n v-clickoutside=\"dismiss\"\n class=\"tw-relative tw-inline-block\"\n data-test=\"ll-dropdown\"\n @keydown=\"onKeyDown\"\n >\n <!-- @slot Toggle component slot, receives `toggle` method to trigger Dropdown display -->\n <slot name=\"toggle\" :is-active=\"isActive\" :toggle=\"toggle\">\n <button\n data-test=\"button|toggle\"\n :aria-expanded=\"isActive\"\n :class=\"[label ? 'tw-min-w-auto tw-outline-none' : 'tw-rounded tw-p-3']\"\n @click=\"toggle\"\n >\n <span v-if=\"label\" class=\"tw-flex tw-items-center tw-font-medium tw-text-blue-500 hover:tw-text-blue-700\">\n {{ label }}\n <Icon name=\"caret-down\" />\n </span>\n <Icon v-else name=\"ellipsis\" />\n </button>\n </slot>\n\n <transition name=\"fade\" @after-leave=\"resetOffset\">\n <div\n v-show=\"isActive\"\n ref=\"contentRef\"\n data-test=\"ll-dropdown-content\"\n :class=\"[\n classes.content,\n contentClass,\n {\n 'tw-left-0 after:tw-left-6': props.align === 'left',\n 'tw-right-0': props.align === 'right',\n 'tw-max-w-[360px]': !props.fluidContent,\n },\n ]\"\n :style=\"styles\"\n >\n <!-- @slot Dropdown content slot. Receives `dismiss` method, to trigger manual close. You must call dismiss with parentheses. Receives `is-active` prop. -->\n <slot :dismiss=\"dismiss\" :is-active=\"isActive\"></slot>\n </div>\n </transition>\n </div>\n</template>\n\n<style module>\n .content {\n --offset: 0;\n\n @apply tw-shadow-2xl\n tw-bg-white\n tw-border\n tw-border-solid\n tw-border-blue-500\n tw-rounded\n tw-absolute\n tw-z-[301]\n tw-min-w-[200px];\n\n transform: translateX(calc(var(--offset) * 1px));\n }\n\n /**\n * TODO: these global styles should be componentized in https://leaflink.atlassian.net/browse/STASH-566\n */\n :global(.dropdown__list) {\n @apply tw-bg-white tw-list-none tw-m-1.5 tw-p-0;\n }\n\n :global(.dropdown__item) {\n @apply tw-block tw-mx-0 tw-mt-0 tw-mb-1.5 tw-w-full first:tw-mt-0 last:tw-mb-0;\n }\n\n :global(.dropdown__item) button {\n @apply tw-border-none tw-text-left tw-p-1.5;\n }\n\n :global(.dropdown__item) :where(a, button) {\n @apply tw-rounded\n tw-text-ice-700\n tw-block\n tw-py-[10px]\n tw-px-1.5\n tw-w-full\n disabled:tw-text-ice-500\n disabled:tw-cursor-default\n hover:tw-bg-ice-200\n hover:tw-text-ice-700\n hover:tw-no-underline\n tw-transition-all\n tw-duration-fast\n tw-ease-swing;\n }\n</style>\n"],"names":["props","__props","emit","__emit","contentRef","ref","dropdownRef","DEFAULT_ITEMS_LIST","items","itemIndex","isActive","styles","classes","useCssModule","watch","val","next","prev","onMounted","target","getMountPoint","_a","_b","_c","dismiss","onBeforeUnmount","event","wasOpen","toggle","calculateOffset","onKeyDown","KEY_CODES","resetOffset","nextTick","toggleBCR","top","offset","overflow","calculateElementOverflow","direction","__expose","computed"],"mappings":"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"}
@@ -1,6 +1,6 @@
1
- import { defineComponent as p, useCssModule as f, useSlots as _, openBlock as s, createElementBlock as o, createBlock as g, createCommentVNode as n, createElementVNode as u, renderSlot as a, toDisplayString as i, normalizeClass as m, unref as r, createTextVNode as y } from "vue";
1
+ import { defineComponent as p, useCssModule as f, useSlots as _, createElementBlock as o, openBlock as s, createBlock as g, createCommentVNode as n, createElementVNode as u, renderSlot as a, toDisplayString as i, normalizeClass as m, unref as r, createTextVNode as y } from "vue";
2
2
  import { t as w } from "./locale.js";
3
- import { _ as b } from "./Illustration.vue_vue_type_script_setup_true_lang-CYddAFtS.js";
3
+ import { _ as b } from "./Illustration.vue_vue_type_script_setup_true_lang-BBqgoJO8.js";
4
4
  import { _ as h } from "./_plugin-vue_export-helper-CHgC5LLL.js";
5
5
  const x = {
6
6
  key: "empty",
package/dist/Expand.js CHANGED
@@ -1,4 +1,4 @@
1
- import { _ as f } from "./Expand.vue_vue_type_script_setup_true_lang-D0fSAtHr.js";
1
+ import { _ as f } from "./Expand.vue_vue_type_script_setup_true_lang-CiONJfAp.js";
2
2
  export {
3
3
  f as default
4
4
  };
@@ -1,4 +1,4 @@
1
- import { defineComponent as c, ref as u, onMounted as x, openBlock as s, createBlock as m, resolveDynamicComponent as v, normalizeClass as E, withCtx as i, createVNode as g, Transition as k, createElementBlock as n, Fragment as w, renderSlot as d, createCommentVNode as C, withDirectives as B, vShow as N } from "vue";
1
+ import { defineComponent as c, ref as u, onMounted as x, createBlock as m, openBlock as s, resolveDynamicComponent as v, normalizeClass as E, withCtx as i, createVNode as g, Transition as k, createElementBlock as n, withDirectives as w, Fragment as C, createCommentVNode as B, renderSlot as d, vShow as N } from "vue";
2
2
  const z = /* @__PURE__ */ c({
3
3
  name: "ll-expand",
4
4
  __name: "Expand",
@@ -43,15 +43,15 @@ const z = /* @__PURE__ */ c({
43
43
  onLeave: y
44
44
  }, {
45
45
  default: i(() => [
46
- e.isLazy ? (s(), n(w, { key: 0 }, [
46
+ e.isLazy ? (s(), n(C, { key: 0 }, [
47
47
  e.isExpanded ? (s(), n("div", {
48
48
  key: 0,
49
49
  ref_key: "contentRef",
50
50
  ref: t
51
51
  }, [
52
52
  d(e.$slots, "default")
53
- ], 512)) : C("", !0)
54
- ], 64)) : B((s(), n("div", {
53
+ ], 512)) : B("", !0)
54
+ ], 64)) : w((s(), n("div", {
55
55
  key: 1,
56
56
  ref_key: "contentRef",
57
57
  ref: t
@@ -71,4 +71,4 @@ const z = /* @__PURE__ */ c({
71
71
  export {
72
72
  z as _
73
73
  };
74
- //# sourceMappingURL=Expand.vue_vue_type_script_setup_true_lang-D0fSAtHr.js.map
74
+ //# sourceMappingURL=Expand.vue_vue_type_script_setup_true_lang-CiONJfAp.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Expand.vue_vue_type_script_setup_true_lang-D0fSAtHr.js","sources":["../src/components/Expand/Expand.vue"],"sourcesContent":["<script setup lang=\"ts\">\n import { onMounted, ref } from 'vue';\n\n defineOptions({\n name: 'll-expand',\n });\n\n export type ExpandOuterElement = 'div' | 'td' | 'li';\n\n export interface ExpandProps {\n /**\n * The root element to use as the root element the expand transition gets applied to\n */\n is?: ExpandOuterElement;\n\n /**\n * Dictates whether the content is expanded or collapsed\n */\n isExpanded?: boolean;\n\n /**\n * Whether to only render content on expand\n */\n isLazy?: boolean;\n\n /**\n * The name of the transition to pass to the transition component\n * @see: https://vuejs.org/guide/built-ins/transition.html#css-based-transitions\n */\n transitionName?: string;\n }\n\n const props = withDefaults(defineProps<ExpandProps>(), {\n is: 'div',\n isExpanded: false,\n isLazy: false,\n transitionName: 'expand',\n });\n\n const emit = defineEmits<{\n (e: 'after-expand'): void;\n }>();\n\n const contentRef = ref<HTMLElement | null>(null);\n\n onMounted(() => {\n if (!props.isExpanded && contentRef.value) {\n contentRef.value.style.overflow = 'hidden';\n }\n });\n\n /**\n * Expands the element\n * @param {object} element - the element being expanded\n * @returns {void}\n */\n const onExpand = (element) => {\n // Trick to calculate the height of the hidden element\n element.style.visibility = 'hidden';\n element.style.height = 'auto';\n\n const height = element.offsetHeight;\n\n // Restore default styling\n element.style.visibility = '';\n element.style.display = '';\n\n // Set height on the element to zero\n element.style.height = 0;\n\n // Set expanded height after the other height change takes affect\n requestAnimationFrame(() => {\n element.style.height = `${height}px`;\n });\n };\n\n /**\n * Resores default styling after the expand animation is completed\n * @param {object} element - the element being expanded\n * @returns {void}\n */\n const afterExpand = (element) => {\n element.style.height = '';\n element.style.overflow = '';\n emit('after-expand');\n };\n\n /**\n * Collapses the element\n * @param {object} element - the element being expanded\n * @returns {void}\n */\n const onCollapse = (element) => {\n const height = element.offsetHeight;\n\n // Set height to the expanded height\n element.style.height = `${height}px`;\n element.style.overflow = 'hidden';\n\n // Set height to zero after the other height change takes affect\n requestAnimationFrame(() => {\n element.style.height = 0;\n });\n };\n</script>\n\n<template>\n <component\n :is=\"props.is\"\n class=\"stash-expand\"\n data-test=\"stash-expand\"\n :class=\"{\n 'stash-expand--expanded': isExpanded,\n 'stash-expand--collapsed': !isExpanded,\n }\"\n >\n <transition :name=\"transitionName\" @after-enter=\"afterExpand\" @enter=\"onExpand\" @leave=\"onCollapse\">\n <template v-if=\"isLazy\">\n <div v-if=\"isExpanded\" ref=\"contentRef\">\n <slot></slot>\n </div>\n </template>\n <template v-else>\n <div v-show=\"isExpanded\" ref=\"contentRef\">\n <slot></slot>\n </div>\n </template>\n </transition>\n </component>\n</template>\n"],"names":["props","__props","emit","__emit","contentRef","ref","onMounted","onExpand","element","height","afterExpand","onCollapse"],"mappings":";;;;;;;;;;;;AAgCE,UAAMA,IAAQC,GAORC,IAAOC,GAIPC,IAAaC,EAAwB,IAAI;AAE/C,IAAAC,EAAU,MAAM;AACd,MAAI,CAACN,EAAM,cAAcI,EAAW,UACvBA,EAAA,MAAM,MAAM,WAAW;AAAA,IACpC,CACD;AAOK,UAAAG,IAAW,CAACC,MAAY;AAE5B,MAAAA,EAAQ,MAAM,aAAa,UAC3BA,EAAQ,MAAM,SAAS;AAEvB,YAAMC,IAASD,EAAQ;AAGvB,MAAAA,EAAQ,MAAM,aAAa,IAC3BA,EAAQ,MAAM,UAAU,IAGxBA,EAAQ,MAAM,SAAS,GAGvB,sBAAsB,MAAM;AAClB,QAAAA,EAAA,MAAM,SAAS,GAAGC,CAAM;AAAA,MAAA,CACjC;AAAA,IACH,GAOMC,IAAc,CAACF,MAAY;AAC/B,MAAAA,EAAQ,MAAM,SAAS,IACvBA,EAAQ,MAAM,WAAW,IACzBN,EAAK,cAAc;AAAA,IACrB,GAOMS,IAAa,CAACH,MAAY;AAC9B,YAAMC,IAASD,EAAQ;AAGf,MAAAA,EAAA,MAAM,SAAS,GAAGC,CAAM,MAChCD,EAAQ,MAAM,WAAW,UAGzB,sBAAsB,MAAM;AAC1B,QAAAA,EAAQ,MAAM,SAAS;AAAA,MAAA,CACxB;AAAA,IACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Expand.vue_vue_type_script_setup_true_lang-CiONJfAp.js","sources":["../src/components/Expand/Expand.vue"],"sourcesContent":["<script setup lang=\"ts\">\n import { onMounted, ref } from 'vue';\n\n defineOptions({\n name: 'll-expand',\n });\n\n export type ExpandOuterElement = 'div' | 'td' | 'li';\n\n export interface ExpandProps {\n /**\n * The root element to use as the root element the expand transition gets applied to\n */\n is?: ExpandOuterElement;\n\n /**\n * Dictates whether the content is expanded or collapsed\n */\n isExpanded?: boolean;\n\n /**\n * Whether to only render content on expand\n */\n isLazy?: boolean;\n\n /**\n * The name of the transition to pass to the transition component\n * @see: https://vuejs.org/guide/built-ins/transition.html#css-based-transitions\n */\n transitionName?: string;\n }\n\n const props = withDefaults(defineProps<ExpandProps>(), {\n is: 'div',\n isExpanded: false,\n isLazy: false,\n transitionName: 'expand',\n });\n\n const emit = defineEmits<{\n (e: 'after-expand'): void;\n }>();\n\n const contentRef = ref<HTMLElement | null>(null);\n\n onMounted(() => {\n if (!props.isExpanded && contentRef.value) {\n contentRef.value.style.overflow = 'hidden';\n }\n });\n\n /**\n * Expands the element\n * @param {object} element - the element being expanded\n * @returns {void}\n */\n const onExpand = (element) => {\n // Trick to calculate the height of the hidden element\n element.style.visibility = 'hidden';\n element.style.height = 'auto';\n\n const height = element.offsetHeight;\n\n // Restore default styling\n element.style.visibility = '';\n element.style.display = '';\n\n // Set height on the element to zero\n element.style.height = 0;\n\n // Set expanded height after the other height change takes affect\n requestAnimationFrame(() => {\n element.style.height = `${height}px`;\n });\n };\n\n /**\n * Resores default styling after the expand animation is completed\n * @param {object} element - the element being expanded\n * @returns {void}\n */\n const afterExpand = (element) => {\n element.style.height = '';\n element.style.overflow = '';\n emit('after-expand');\n };\n\n /**\n * Collapses the element\n * @param {object} element - the element being expanded\n * @returns {void}\n */\n const onCollapse = (element) => {\n const height = element.offsetHeight;\n\n // Set height to the expanded height\n element.style.height = `${height}px`;\n element.style.overflow = 'hidden';\n\n // Set height to zero after the other height change takes affect\n requestAnimationFrame(() => {\n element.style.height = 0;\n });\n };\n</script>\n\n<template>\n <component\n :is=\"props.is\"\n class=\"stash-expand\"\n data-test=\"stash-expand\"\n :class=\"{\n 'stash-expand--expanded': isExpanded,\n 'stash-expand--collapsed': !isExpanded,\n }\"\n >\n <transition :name=\"transitionName\" @after-enter=\"afterExpand\" @enter=\"onExpand\" @leave=\"onCollapse\">\n <template v-if=\"isLazy\">\n <div v-if=\"isExpanded\" ref=\"contentRef\">\n <slot></slot>\n </div>\n </template>\n <template v-else>\n <div v-show=\"isExpanded\" ref=\"contentRef\">\n <slot></slot>\n </div>\n </template>\n </transition>\n </component>\n</template>\n"],"names":["props","__props","emit","__emit","contentRef","ref","onMounted","onExpand","element","height","afterExpand","onCollapse"],"mappings":";;;;;;;;;;;;AAgCE,UAAMA,IAAQC,GAORC,IAAOC,GAIPC,IAAaC,EAAwB,IAAI;AAE/C,IAAAC,EAAU,MAAM;AACd,MAAI,CAACN,EAAM,cAAcI,EAAW,UACvBA,EAAA,MAAM,MAAM,WAAW;AAAA,IACpC,CACD;AAOK,UAAAG,IAAW,CAACC,MAAY;AAE5B,MAAAA,EAAQ,MAAM,aAAa,UAC3BA,EAAQ,MAAM,SAAS;AAEvB,YAAMC,IAASD,EAAQ;AAGvB,MAAAA,EAAQ,MAAM,aAAa,IAC3BA,EAAQ,MAAM,UAAU,IAGxBA,EAAQ,MAAM,SAAS,GAGvB,sBAAsB,MAAM;AAClB,QAAAA,EAAA,MAAM,SAAS,GAAGC,CAAM;AAAA,MAAA,CACjC;AAAA,IACH,GAOMC,IAAc,CAACF,MAAY;AAC/B,MAAAA,EAAQ,MAAM,SAAS,IACvBA,EAAQ,MAAM,WAAW,IACzBN,EAAK,cAAc;AAAA,IACrB,GAOMS,IAAa,CAACH,MAAY;AAC9B,YAAMC,IAASD,EAAQ;AAGf,MAAAA,EAAA,MAAM,SAAS,GAAGC,CAAM,MAChCD,EAAQ,MAAM,WAAW,UAGzB,sBAAsB,MAAM;AAC1B,QAAAA,EAAQ,MAAM,SAAS;AAAA,MAAA,CACxB;AAAA,IACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/dist/Field.js CHANGED
@@ -1,4 +1,4 @@
1
- import { _ as f } from "./Field.vue_vue_type_script_setup_true_lang-DEizIcDo.js";
1
+ import { _ as f } from "./Field.vue_vue_type_script_setup_true_lang-DRaKs9Lm.js";
2
2
  export {
3
3
  f as default
4
4
  };
@@ -1,6 +1,6 @@
1
- import { defineComponent as B, useAttrs as I, useSlots as T, computed as t, openBlock as a, createBlock as c, resolveDynamicComponent as R, mergeProps as O, unref as i, withCtx as b, createTextVNode as k, toDisplayString as o, createCommentVNode as m, renderSlot as w, createElementBlock as r } from "vue";
1
+ import { defineComponent as B, useAttrs as I, useSlots as T, computed as t, createBlock as c, openBlock as a, resolveDynamicComponent as R, mergeProps as O, unref as i, withCtx as b, createCommentVNode as m, renderSlot as w, createElementBlock as o, createTextVNode as k, toDisplayString as r } from "vue";
2
2
  import n from "lodash-es/uniqueId";
3
- import { _ as q } from "./Label.vue_vue_type_script_setup_true_lang-C4JKdqvC.js";
3
+ import { _ as q } from "./Label.vue_vue_type_script_setup_true_lang-DPnNUfc6.js";
4
4
  const D = ["id"], E = {
5
5
  key: 2,
6
6
  class: "stash-field-hint tw-mt-1 tw-block tw-whitespace-pre-line tw-text-xs",
@@ -55,7 +55,7 @@ const D = ["id"], E = {
55
55
  disabled: e.isDisabled || e.disabled
56
56
  }, {
57
57
  default: b(() => [
58
- k(o(e.label), 1)
58
+ k(r(e.label), 1)
59
59
  ]),
60
60
  _: 1
61
61
  }, 8, ["id", "for", "has-error", "is-required", "show-optional", "legend", "disabled"])) : m("", !0),
@@ -69,12 +69,12 @@ const D = ["id"], E = {
69
69
  labelId: u.value,
70
70
  showOptionalInLabel: e.showOptionalInLabel
71
71
  }),
72
- e.errorText ? (a(), r("span", {
72
+ e.errorText ? (a(), o("span", {
73
73
  key: 1,
74
74
  id: h.value,
75
75
  class: "stash-field-error tw-mt-1 tw-block tw-whitespace-pre-line tw-text-xs tw-text-red-500",
76
76
  "data-test": "stash-field-error"
77
- }, o(e.errorText), 9, D)) : e.hintText && !e.isReadOnly ? (a(), r("span", E, o(e.hintText), 1)) : i(l).hint && !e.isReadOnly ? (a(), r("div", S, [
77
+ }, r(e.errorText), 9, D)) : e.hintText && !e.isReadOnly ? (a(), o("span", E, r(e.hintText), 1)) : i(l).hint && !e.isReadOnly ? (a(), o("div", S, [
78
78
  w(s.$slots, "hint")
79
79
  ])) : m("", !0)
80
80
  ]),
@@ -85,4 +85,4 @@ const D = ["id"], E = {
85
85
  export {
86
86
  L as _
87
87
  };
88
- //# sourceMappingURL=Field.vue_vue_type_script_setup_true_lang-DEizIcDo.js.map
88
+ //# sourceMappingURL=Field.vue_vue_type_script_setup_true_lang-DRaKs9Lm.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Field.vue_vue_type_script_setup_true_lang-DRaKs9Lm.js","sources":["../src/components/Field/Field.vue"],"sourcesContent":["<script lang=\"ts\">\n import { FieldProps } from './Field.types';\n\n export * from './Field.types';\n</script>\n\n<script setup lang=\"ts\">\n import uniqueId from 'lodash-es/uniqueId';\n import { computed, useAttrs, useSlots } from 'vue';\n\n import Label from '../Label/Label.vue';\n\n defineOptions({\n inheritAttrs: false,\n });\n\n const props = withDefaults(defineProps<FieldProps>(), {\n addBottomSpace: false,\n errorText: undefined,\n hintText: undefined,\n id: undefined,\n errorId: undefined,\n isRequired: false,\n label: undefined,\n showOptionalInLabel: false,\n fieldset: false,\n isDisabled: false,\n disabled: false,\n });\n const attrs = useAttrs();\n const slots = useSlots();\n const fieldId = computed(() => props.id || uniqueId('stash-field-'));\n const fieldErrorId = computed(() => props.errorId || uniqueId('stash-field-error-'));\n const labelId = computed(() => uniqueId('stash-field-label-'));\n const hasError = computed(() => !!props.errorText);\n const wrapperElement = computed(() => (props.fieldset ? 'fieldset' : 'div'));\n\n // Any attributes that are unique to form elements, you want to exclude from\n // being bound from the root element.\n const rootAttrs = computed(() => {\n const { placeholder, ...otherAttrs } = attrs;\n\n return otherAttrs;\n });\n</script>\n\n<template>\n <component\n :is=\"wrapperElement\"\n data-test=\"stash-field\"\n class=\"stash-field\"\n :class=\"[\n { 'tw-p-0': props.fieldset },\n { 'tw-mb-9': props.addBottomSpace && !props.errorText && !props.hintText && !slots.hint },\n { 'tw-mb-4': props.addBottomSpace && (props.errorText || props.hintText || slots.hint) },\n { 'stash-field--disabled': props.isDisabled || props.disabled },\n { 'stash-field--is-read-only': props.isReadOnly },\n { 'stash-field--is-required': props.isRequired },\n { 'stash-field--has-error': hasError },\n ]\"\n v-bind=\"rootAttrs\"\n >\n <Label\n v-if=\"props.label\"\n :id=\"labelId\"\n :for=\"fieldId\"\n :has-error=\"hasError\"\n :is-required=\"isRequired\"\n :show-optional=\"props.showOptionalInLabel\"\n :legend=\"props.fieldset\"\n :disabled=\"props.isDisabled || props.disabled\"\n >\n {{ props.label }}\n </Label>\n\n <!-- @slot for the form field; the Label can also be rendered here instead of using the label prop -->\n <slot\n :field-id=\"fieldId\"\n :field-error-id=\"fieldErrorId\"\n :has-error=\"hasError\"\n :is-required=\"isRequired\"\n :is-read-only=\"props.isReadOnly\"\n :disabled=\"props.isDisabled || props.disabled\"\n :label-id=\"labelId\"\n :show-optional-in-label=\"props.showOptionalInLabel\"\n ></slot>\n\n <span\n v-if=\"props.errorText\"\n :id=\"fieldErrorId\"\n class=\"stash-field-error tw-mt-1 tw-block tw-whitespace-pre-line tw-text-xs tw-text-red-500\"\n data-test=\"stash-field-error\"\n >\n {{ props.errorText }}\n </span>\n\n <span\n v-else-if=\"props.hintText && !props.isReadOnly\"\n class=\"stash-field-hint tw-mt-1 tw-block tw-whitespace-pre-line tw-text-xs\"\n data-test=\"stash-field-hint\"\n >\n {{ props.hintText }}\n </span>\n\n <div\n v-else-if=\"slots.hint && !props.isReadOnly\"\n class=\"stash-field-hint tw-mt-1 tw-whitespace-pre-line tw-text-xs\"\n data-test=\"stash-field-hint\"\n >\n <!-- @slot for displaying hint text below the field -->\n <slot name=\"hint\"></slot>\n </div>\n </component>\n</template>\n"],"names":["props","__props","attrs","useAttrs","slots","useSlots","fieldId","computed","uniqueId","fieldErrorId","labelId","hasError","wrapperElement","rootAttrs","placeholder","otherAttrs"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBE,UAAMA,IAAQC,GAaRC,IAAQC,EAAS,GACjBC,IAAQC,EAAS,GACjBC,IAAUC,EAAS,MAAMP,EAAM,MAAMQ,EAAS,cAAc,CAAC,GAC7DC,IAAeF,EAAS,MAAMP,EAAM,WAAWQ,EAAS,oBAAoB,CAAC,GAC7EE,IAAUH,EAAS,MAAMC,EAAS,oBAAoB,CAAC,GACvDG,IAAWJ,EAAS,MAAM,CAAC,CAACP,EAAM,SAAS,GAC3CY,IAAiBL,EAAS,MAAOP,EAAM,WAAW,aAAa,KAAM,GAIrEa,IAAYN,EAAS,MAAM;AAC/B,YAAM,EAAE,aAAAO,GAAa,GAAGC,EAAA,IAAeb;AAEhC,aAAAa;AAAA,IAAA,CACR;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,4 +1,4 @@
1
- import { defineComponent as q, useCssModule as K, ref as U, inject as Q, useAttrs as W, computed as w, openBlock as n, createElementBlock as r, normalizeClass as c, unref as l, createVNode as g, withModifiers as p, withCtx as I, renderSlot as S, createTextVNode as N, toDisplayString as u, createElementVNode as v, Fragment as k, createBlock as Z, createCommentVNode as R, renderList as ee, withDirectives as te, mergeProps as le, vShow as se } from "vue";
1
+ import { defineComponent as q, useCssModule as K, ref as U, inject as Q, useAttrs as W, computed as w, createElementBlock as r, openBlock as n, normalizeClass as c, unref as l, withDirectives as Z, createVNode as g, withModifiers as p, withCtx as I, renderSlot as S, createTextVNode as N, toDisplayString as u, createElementVNode as v, createCommentVNode as k, Fragment as R, createBlock as ee, renderList as te, mergeProps as le, vShow as se } from "vue";
2
2
  import ne from "@leaflink/snitch";
3
3
  import { I as oe } from "./index-D6bxWkZ1.js";
4
4
  import { t as f } from "./locale.js";
@@ -158,7 +158,7 @@ const re = { key: 0 }, de = { class: "tw-text-ice-900" }, ce = {
158
158
  v("div", {
159
159
  class: c(["tw-flex tw-flex-col tw-items-center tw-justify-center tw-text-center", [{ "tw-items-center md:tw-flex-row": e.size === l(h).Dense }]])
160
160
  }, [
161
- e.files.length ? (n(!0), r(k, { key: 1 }, ee(e.files, (s) => (n(), r("div", {
161
+ e.files.length ? (n(!0), r(R, { key: 1 }, te(e.files, (s) => (n(), r("div", {
162
162
  key: s.name
163
163
  }, [
164
164
  g(ae, { name: "file" }),
@@ -172,14 +172,14 @@ const re = { key: 0 }, de = { class: "tw-text-ice-900" }, ce = {
172
172
  ]),
173
173
  _: 2
174
174
  }, 1032, ["class", "onClick"])
175
- ]))), 128)) : (n(), r(k, { key: 0 }, [
176
- e.size !== l(h).Dense ? (n(), Z(l(oe), {
175
+ ]))), 128)) : (n(), r(R, { key: 0 }, [
176
+ e.size !== l(h).Dense ? (n(), ee(l(oe), {
177
177
  key: 0,
178
178
  src: Y.value,
179
179
  name: "file",
180
180
  width: "84",
181
181
  height: "96"
182
- }, null, 8, ["src"])) : R("", !0),
182
+ }, null, 8, ["src"])) : k("", !0),
183
183
  v("span", de, u(l(f)("ll.fileUpload.dragDropFileHere")), 1),
184
184
  v("span", {
185
185
  class: c(
@@ -204,9 +204,9 @@ const re = { key: 0 }, de = { class: "tw-text-ice-900" }, ce = {
204
204
  ], 2),
205
205
  e.$slots.hint && !e.files.length ? (n(), r("div", ce, [
206
206
  S(e.$slots, "hint")
207
- ])) : R("", !0)
207
+ ])) : k("", !0)
208
208
  ], 34)),
209
- te(v("input", le(X.value, {
209
+ Z(v("input", le(X.value, {
210
210
  ref_key: "fileUploadRef",
211
211
  ref: T,
212
212
  "data-test": "stash-file-upload|input",
@@ -1,4 +1,4 @@
1
- import { defineComponent as f, useCssModule as v, computed as h, openBlock as a, createBlock as w, normalizeClass as s, unref as t, withCtx as b, createElementVNode as C, renderSlot as k, createElementBlock as n, toDisplayString as y, createCommentVNode as i, createVNode as D } from "vue";
1
+ import { defineComponent as f, useCssModule as v, computed as h, createBlock as w, openBlock as a, normalizeClass as s, unref as t, withCtx as b, createElementVNode as C, renderSlot as k, createElementBlock as n, createCommentVNode as i, toDisplayString as y, createVNode as D } from "vue";
2
2
  import { t as c } from "./locale.js";
3
3
  import x from "./Chip.js";
4
4
  import B from "./Icon.js";
@@ -1,4 +1,4 @@
1
- import { defineComponent as C, useSlots as F, inject as k, computed as w, openBlock as e, createElementBlock as o, createBlock as a, resolveDynamicComponent as x, withCtx as p, createElementVNode as r, toDisplayString as n, createCommentVNode as l, normalizeClass as I, unref as c, createTextVNode as g, renderSlot as D } from "vue";
1
+ import { defineComponent as C, useSlots as F, inject as k, computed as w, createElementBlock as o, openBlock as e, createBlock as a, createCommentVNode as r, resolveDynamicComponent as x, withCtx as p, createElementVNode as l, toDisplayString as n, normalizeClass as I, unref as c, createTextVNode as g, renderSlot as D } from "vue";
2
2
  import { t as u } from "./locale.js";
3
3
  import E from "./Chip.js";
4
4
  import { D as S } from "./DataViewFilters.keys-BLu07FiP.js";
@@ -32,12 +32,12 @@ const T = { class: "stash-filter-drawer-item" }, A = { class: "tw-flex tw-items-
32
32
  onClick: m[0] || (m[0] = (j) => s.value ? void 0 : _("navigate"))
33
33
  }, {
34
34
  default: p(() => [
35
- r("div", A, [
36
- r("div", V, [
37
- r("h4", null, n(i.title), 1),
38
- i.description ? (e(), o("div", B, n(i.description), 1)) : l("", !0)
35
+ l("div", A, [
36
+ l("div", V, [
37
+ l("h4", null, n(i.title), 1),
38
+ i.description ? (e(), o("div", B, n(i.description), 1)) : r("", !0)
39
39
  ]),
40
- r("div", {
40
+ l("div", {
41
41
  class: I(["tw-inline-flex tw-items-center tw-gap-6", { "tw-mb-0.5 tw-mr-2": s.value }])
42
42
  }, [
43
43
  d.value ? (e(), a(E, {
@@ -52,8 +52,8 @@ const T = { class: "stash-filter-drawer-item" }, A = { class: "tw-flex tw-items-
52
52
  g(n(d.value), 1)
53
53
  ]),
54
54
  _: 1
55
- }, 8, ["aria-label", "title"])) : l("", !0),
56
- s.value ? l("", !0) : (e(), a(N, {
55
+ }, 8, ["aria-label", "title"])) : r("", !0),
56
+ s.value ? r("", !0) : (e(), a(N, {
57
57
  key: 1,
58
58
  name: "chevron-right",
59
59
  title: c(u)("ll.viewFilterGroup")
@@ -65,7 +65,7 @@ const T = { class: "stash-filter-drawer-item" }, A = { class: "tw-flex tw-items-
65
65
  })),
66
66
  s.value && h.default ? (e(), o("div", O, [
67
67
  D(y.$slots, "default")
68
- ])) : l("", !0)
68
+ ])) : r("", !0)
69
69
  ]));
70
70
  }
71
71
  });
@@ -1,10 +1,10 @@
1
- import { defineComponent as O, inject as b, ref as y, computed as R, openBlock as w, createBlock as k, withCtx as l, createVNode as f, unref as o, createTextVNode as p, toDisplayString as m, createElementVNode as d, renderSlot as W, Transition as j, createElementBlock as J, createCommentVNode as x } from "vue";
1
+ import { defineComponent as O, inject as b, ref as y, computed as R, createBlock as k, openBlock as w, withCtx as l, createElementVNode as d, createVNode as f, unref as o, renderSlot as W, Transition as j, createElementBlock as J, createCommentVNode as x, createTextVNode as p, toDisplayString as m } from "vue";
2
2
  import z from "lodash-es/throttle";
3
3
  import { t as C } from "./locale.js";
4
4
  import D from "./Button.js";
5
5
  import "lodash-es/cloneDeep";
6
6
  import "lodash-es/uniqueId";
7
- import { D as F } from "./DataView.keys-C7eaZg2G.js";
7
+ import { D as F } from "./DataView.keys-aSOnA4AD.js";
8
8
  import { D as G } from "./DataViewFilters.keys-BLu07FiP.js";
9
9
  import $ from "./Dropdown.js";
10
10
  import q from "./FilterChip.js";
@@ -1,6 +1,6 @@
1
- import { defineComponent as S, computed as m, openBlock as r, createBlock as $, mergeProps as C, withCtx as d, createElementVNode as s, createElementBlock as u, withDirectives as f, vModelCheckbox as v, createVNode as y, withKeys as h, createTextVNode as _, toDisplayString as x, unref as A, createCommentVNode as E, Fragment as K, renderList as N } from "vue";
1
+ import { defineComponent as S, computed as m, createBlock as $, openBlock as r, mergeProps as C, withCtx as d, createElementVNode as s, createElementBlock as u, createCommentVNode as A, withDirectives as f, vModelCheckbox as v, createVNode as y, withKeys as h, createTextVNode as _, toDisplayString as x, unref as E, Fragment as K, renderList as N } from "vue";
2
2
  import { t as O } from "./locale.js";
3
- import { _ as D } from "./Field.vue_vue_type_script_setup_true_lang-DEizIcDo.js";
3
+ import { _ as D } from "./Field.vue_vue_type_script_setup_true_lang-DRaKs9Lm.js";
4
4
  import b from "./FilterChip.js";
5
5
  const F = { class: "tw-flex tw-flex-wrap tw-gap-1.5" }, I = ["id"], T = ["for"], L = ["id", "value"], R = ["for"], j = /* @__PURE__ */ S({
6
6
  __name: "FilterSelect",
@@ -81,12 +81,12 @@ const F = { class: "tw-flex tw-flex-wrap tw-gap-1.5" }, I = ["id"], T = ["for"],
81
81
  onKeypress: h(k, ["enter"])
82
82
  }, {
83
83
  default: d(() => [
84
- _(x(A(O)("ll.all")), 1)
84
+ _(x(E(O)("ll.all")), 1)
85
85
  ]),
86
86
  _: 1
87
87
  }, 8, ["is-selected"])
88
88
  ], 8, T)
89
- ])) : E("", !0),
89
+ ])) : A("", !0),
90
90
  (r(!0), u(K, null, N(e.options, (l) => (r(), u("div", {
91
91
  key: i(l)
92
92
  }, [