@leaflink/stash 44.0.0-beta.4 → 44.0.0-beta.6

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 (54) hide show
  1. package/dist/ActionsDropdown.js +16 -16
  2. package/dist/ActionsDropdown.js.map +1 -1
  3. package/dist/AddressSelect.js +2 -2
  4. package/dist/Alert.js +7 -7
  5. package/dist/Alert.js.map +1 -1
  6. package/dist/AppNavigationItem.js +11 -11
  7. package/dist/AppNavigationItem.js.map +1 -1
  8. package/dist/CurrencyInput.js +2 -2
  9. package/dist/DataViewFilters.js +2 -2
  10. package/dist/DataViewSortButton.js +22 -22
  11. package/dist/DataViewSortButton.js.map +1 -1
  12. package/dist/DatePicker.js +3 -6
  13. package/dist/DatePicker.js.map +1 -1
  14. package/dist/DescriptionListTerm.js +7 -7
  15. package/dist/DescriptionListTerm.js.map +1 -1
  16. package/dist/Divider.js +8 -8
  17. package/dist/Divider.js.map +1 -1
  18. package/dist/Dropdown.js +15 -15
  19. package/dist/Dropdown.js.map +1 -1
  20. package/dist/Field.js +2 -2
  21. package/dist/{Field.vue_vue_type_script_setup_true_lang-42cf79d4.js → Field.vue_vue_type_script_setup_true_lang-4483019d.js} +2 -2
  22. package/dist/{Field.vue_vue_type_script_setup_true_lang-42cf79d4.js.map → Field.vue_vue_type_script_setup_true_lang-4483019d.js.map} +1 -1
  23. package/dist/FileUpload.js +35 -35
  24. package/dist/FileUpload.js.map +1 -1
  25. package/dist/FilterSelect.js +2 -2
  26. package/dist/Filters.js +28 -28
  27. package/dist/Filters.js.map +1 -1
  28. package/dist/IconLabel.js +5 -5
  29. package/dist/IconLabel.js.map +1 -1
  30. package/dist/InlineEdit.js +2 -2
  31. package/dist/Input.js +2 -2
  32. package/dist/InputOptions.js +2 -2
  33. package/dist/Label.js +1 -1
  34. package/dist/{Label.vue_vue_type_script_setup_true_lang-c5589919.js → Label.vue_vue_type_script_setup_true_lang-2de35913.js} +6 -6
  35. package/dist/{Label.vue_vue_type_script_setup_true_lang-c5589919.js.map → Label.vue_vue_type_script_setup_true_lang-2de35913.js.map} +1 -1
  36. package/dist/ListView.js +49 -49
  37. package/dist/ListView.js.map +1 -1
  38. package/dist/Modals.js +13 -13
  39. package/dist/Modals.js.map +1 -1
  40. package/dist/RadioGroup.js +44 -44
  41. package/dist/RadioGroup.js.map +1 -1
  42. package/dist/RadioNew.js +2 -2
  43. package/dist/SearchBar.js +2 -2
  44. package/dist/Select.js +6 -6
  45. package/dist/Select.js.map +1 -1
  46. package/dist/SelectStatus.js +2 -2
  47. package/dist/Textarea.js +2 -2
  48. package/dist/components.css +1 -1
  49. package/dist/constants.d.ts +7 -7
  50. package/dist/constants.js +21 -21
  51. package/dist/constants.js.map +1 -1
  52. package/dist/utils/helpers.js +37 -37
  53. package/dist/utils/helpers.js.map +1 -1
  54. package/package.json +1 -1
@@ -1,17 +1,17 @@
1
- import { defineComponent as a, inject as o, openBlock as i, createElementBlock as n, normalizeClass as c, unref as e, renderSlot as m, createCommentVNode as d } from "vue";
1
+ import { defineComponent as r, inject as a, openBlock as n, createElementBlock as i, normalizeClass as c, unref as e, renderSlot as m, createCommentVNode as d } from "vue";
2
2
  import { D as l } from "./DescriptionList.keys-c906ce05.js";
3
3
  const p = ["data-variant"], w = {
4
4
  key: 0,
5
5
  class: "hidden md:tw-inline"
6
- }, k = /* @__PURE__ */ a({
6
+ }, k = /* @__PURE__ */ r({
7
7
  __name: "DescriptionListTerm",
8
8
  setup(_) {
9
- const s = o(l.key);
9
+ const s = a(l.key);
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 (r, u) => (i(), n("dt", {
14
- class: c(["stash-description-list-term tw-text-medium tw-text-ice-900", {
13
+ return (o, u) => (n(), i("dt", {
14
+ class: c(["stash-description-list-term tw-font-medium tw-text-ice-900", {
15
15
  "md:tw-w-2/5 md:tw-max-w-[10.5rem]": e(t) === "columns",
16
16
  "tw-mr-1.5": e(t) === "inline",
17
17
  "tw-pb-1.5": e(t) === "stacked",
@@ -20,8 +20,8 @@ const p = ["data-variant"], w = {
20
20
  "data-test": "stash-description-list-term",
21
21
  "data-variant": e(t)
22
22
  }, [
23
- m(r.$slots, "default"),
24
- e(t) === "inline" ? (i(), n("span", w, ":")) : d("", !0)
23
+ m(o.$slots, "default"),
24
+ e(t) === "inline" ? (n(), i("span", w, ":")) : d("", !0)
25
25
  ], 10, p));
26
26
  }
27
27
  });
@@ -1 +1 @@
1
- {"version":3,"file":"DescriptionListTerm.js","sources":["../src/components/DescriptionListTerm/DescriptionListTerm.vue"],"sourcesContent":["<script setup lang=\"ts\">\n import { inject } from 'vue';\n\n import { DESCRIPTION_LIST_INJECTION } from '../DescriptionList/DescriptionList.keys';\n\n const descriptionListInjectedValues = inject(DESCRIPTION_LIST_INJECTION.key);\n if (!descriptionListInjectedValues) {\n throw new Error('DescriptionListDetail must be used within a DescriptionList component.');\n }\n const { variant } = descriptionListInjectedValues;\n</script>\n\n<template>\n <dt\n class=\"stash-description-list-term tw-text-medium tw-text-ice-900\"\n :class=\"{\n 'md:tw-w-2/5 md:tw-max-w-[10.5rem]': variant === 'columns',\n 'tw-mr-1.5': variant === 'inline',\n 'tw-pb-1.5': variant === 'stacked',\n 'tw-pb-1.5 md:tw-pb-0': variant !== 'stacked',\n }\"\n data-test=\"stash-description-list-term\"\n :data-variant=\"variant\"\n >\n <!-- @slot Default slot, for rendering a term -->\n <slot></slot><span v-if=\"variant === 'inline'\" class=\"hidden md:tw-inline\">:</span>\n </dt>\n</template>\n"],"names":["descriptionListInjectedValues","inject","DESCRIPTION_LIST_INJECTION","variant"],"mappings":";;;;;;;;AAKQ,UAAAA,IAAgCC,EAAOC,EAA2B,GAAG;AAC3E,QAAI,CAACF;AACG,YAAA,IAAI,MAAM,wEAAwE;AAEpF,UAAA,EAAE,SAAAG,EAAY,IAAAH;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"DescriptionListTerm.js","sources":["../src/components/DescriptionListTerm/DescriptionListTerm.vue"],"sourcesContent":["<script setup lang=\"ts\">\n import { inject } from 'vue';\n\n import { DESCRIPTION_LIST_INJECTION } from '../DescriptionList/DescriptionList.keys';\n\n const descriptionListInjectedValues = inject(DESCRIPTION_LIST_INJECTION.key);\n if (!descriptionListInjectedValues) {\n throw new Error('DescriptionListDetail must be used within a DescriptionList component.');\n }\n const { variant } = descriptionListInjectedValues;\n</script>\n\n<template>\n <dt\n class=\"stash-description-list-term tw-font-medium tw-text-ice-900\"\n :class=\"{\n 'md:tw-w-2/5 md:tw-max-w-[10.5rem]': variant === 'columns',\n 'tw-mr-1.5': variant === 'inline',\n 'tw-pb-1.5': variant === 'stacked',\n 'tw-pb-1.5 md:tw-pb-0': variant !== 'stacked',\n }\"\n data-test=\"stash-description-list-term\"\n :data-variant=\"variant\"\n >\n <!-- @slot Default slot, for rendering a term -->\n <slot></slot><span v-if=\"variant === 'inline'\" class=\"hidden md:tw-inline\">:</span>\n </dt>\n</template>\n"],"names":["descriptionListInjectedValues","inject","DESCRIPTION_LIST_INJECTION","variant"],"mappings":";;;;;;;;AAKQ,UAAAA,IAAgCC,EAAOC,EAA2B,GAAG;AAC3E,QAAI,CAACF;AACG,YAAA,IAAI,MAAM,wEAAwE;AAEpF,UAAA,EAAE,SAAAG,EAAY,IAAAH;;;;;;;;;;;;;;;;"}
package/dist/Divider.js CHANGED
@@ -1,21 +1,21 @@
1
- import { openBlock as s, createElementBlock as t, normalizeClass as r, renderSlot as o } from "vue";
1
+ import { openBlock as t, createElementBlock as s, normalizeClass as r, renderSlot as o } from "vue";
2
2
  import { _ as a } from "./_plugin-vue_export-helper-dad06003.js";
3
- const l = "_separator_1k1sz_2", n = {
4
- separator: l
5
- }, c = {
3
+ const c = "_separator_1k1sz_2", l = {
4
+ separator: c
5
+ }, n = {
6
6
  name: "ll-divider"
7
7
  };
8
8
  function p(e, i, _, f, m, u) {
9
- return s(), t("div", {
10
- class: r(["align-middle text-uppercase tw-flex tw-text-center", e.$style.separator]),
9
+ return t(), s("div", {
10
+ class: r(["text-uppercase tw-flex tw-items-center tw-text-center", e.$style.separator]),
11
11
  role: "separator"
12
12
  }, [
13
13
  o(e.$slots, "default")
14
14
  ], 2);
15
15
  }
16
16
  const d = {
17
- $style: n
18
- }, k = /* @__PURE__ */ a(c, [["render", p], ["__cssModules", d]]);
17
+ $style: l
18
+ }, k = /* @__PURE__ */ a(n, [["render", p], ["__cssModules", d]]);
19
19
  export {
20
20
  k as default
21
21
  };
@@ -1 +1 @@
1
- {"version":3,"file":"Divider.js","sources":["../src/components/Divider/Divider.vue"],"sourcesContent":["<script>\n export default {\n name: 'll-divider',\n };\n</script>\n\n<template>\n <div class=\"align-middle text-uppercase tw-flex tw-text-center\" :class=\"$style.separator\" role=\"separator\">\n <slot></slot>\n </div>\n</template>\n\n<style module>\n .separator::before,\n .separator::after {\n border-bottom: 1px solid var(--color-ice-200);\n content: '';\n flex: 1;\n }\n\n .separator:not(:empty)::before {\n margin-right: var(--ll-space-2);\n }\n\n .separator:not(:empty)::after {\n margin-left: var(--ll-space-2);\n }\n</style>\n"],"names":["_sfc_main","_createElementBlock","_normalizeClass","_ctx","_renderSlot"],"mappings":";;;;GACOA,IAAU;AAAA,EACb,MAAM;;;cAKRC,EAEM,OAAA;AAAA,IAFD,OAAMC,EAAA,CAAA,sDAA6DC,EAAA,OAAO,SAAS,CAAA;AAAA,IAAE,MAAK;AAAA;IAC7FC,EAAaD,EAAA,QAAA,SAAA;AAAA;;;;;"}
1
+ {"version":3,"file":"Divider.js","sources":["../src/components/Divider/Divider.vue"],"sourcesContent":["<script>\n export default {\n name: 'll-divider',\n };\n</script>\n\n<template>\n <div class=\"text-uppercase tw-flex tw-items-center tw-text-center\" :class=\"$style.separator\" role=\"separator\">\n <slot></slot>\n </div>\n</template>\n\n<style module>\n .separator::before,\n .separator::after {\n border-bottom: 1px solid var(--color-ice-200);\n content: '';\n flex: 1;\n }\n\n .separator:not(:empty)::before {\n margin-right: var(--ll-space-2);\n }\n\n .separator:not(:empty)::after {\n margin-left: var(--ll-space-2);\n }\n</style>\n"],"names":["_sfc_main","_createElementBlock","_normalizeClass","_ctx","_renderSlot"],"mappings":";;;;GACOA,IAAU;AAAA,EACb,MAAM;;;cAKRC,EAEM,OAAA;AAAA,IAFD,OAAMC,EAAA,CAAA,yDAAgEC,EAAA,OAAO,SAAS,CAAA;AAAA,IAAE,MAAK;AAAA;IAChGC,EAAaD,EAAA,QAAA,SAAA;AAAA;;;;;"}
package/dist/Dropdown.js CHANGED
@@ -1,5 +1,5 @@
1
- import { defineComponent as R, ref as u, useCssModule as z, watch as C, onMounted as I, onBeforeUnmount as q, computed as K, withDirectives as _, openBlock as v, createElementBlock as k, renderSlot as x, createElementVNode as E, normalizeClass as b, createTextVNode as U, toDisplayString as V, createVNode as S, createBlock as W, Transition as Y, withCtx as F, unref as M, normalizeStyle as j, vShow as G, nextTick as A } from "vue";
2
- import { KEY_CODES as d } from "./constants.js";
1
+ import { defineComponent as R, ref as u, useCssModule as z, watch as C, onMounted as I, onBeforeUnmount as q, computed as K, withDirectives as _, openBlock as v, createElementBlock as k, renderSlot as b, createElementVNode as x, normalizeClass as E, createTextVNode as U, toDisplayString as V, createVNode as S, createBlock as W, Transition as Y, withCtx as F, unref as M, normalizeStyle as j, vShow as G, nextTick as A } from "vue";
2
+ import { KEY_CODES as f } from "./constants.js";
3
3
  import H from "./clickoutside.js";
4
4
  import J from "./utils/calculateElementOverflow.js";
5
5
  import { getMountPoint as Q } from "./utils/helpers.js";
@@ -29,18 +29,18 @@ const Z = ["aria-expanded"], ee = {
29
29
  },
30
30
  emits: ["toggle", "dismiss"],
31
31
  setup(D, { expose: $, emit: p }) {
32
- const a = D, t = u(null), w = u(null), f = [], s = u(f), i = u(-1), o = u(!1), g = u({}), L = z();
32
+ const a = D, t = u(null), w = u(null), d = [], s = u(d), i = u(-1), o = u(!1), g = u({}), L = z();
33
33
  C(o, (e) => {
34
34
  e || (i.value = -1), p("toggle", e);
35
35
  }), C(i, (e, l) => {
36
- e in s.value && s.value[e].classList.add("is-highlighted"), l in s.value && s.value[l].classList.remove("is-highlighted");
36
+ e in s.value && s.value[e].classList.add("tw-bg-ice-200"), l in s.value && s.value[l].classList.remove("tw-bg-ice-200");
37
37
  }), I(() => {
38
38
  var e, l, n;
39
39
  if (a.reattach) {
40
40
  const c = Q();
41
41
  t.value && c.appendChild(t.value);
42
42
  }
43
- (e = t.value) != null && e.querySelector(".stash-menu") ? s.value = ((l = t.value) == null ? void 0 : l.querySelectorAll(".stash-menu-item")) ?? f : s.value = ((n = t.value) == null ? void 0 : n.querySelectorAll(".dropdown__item")) ?? f, window.addEventListener("resize", () => r());
43
+ (e = t.value) != null && e.querySelector(".stash-menu") ? s.value = ((l = t.value) == null ? void 0 : l.querySelectorAll(".stash-menu-item")) ?? d : s.value = ((n = t.value) == null ? void 0 : n.querySelectorAll(".dropdown__item")) ?? d, window.addEventListener("resize", () => r());
44
44
  }), q(() => {
45
45
  var e, l;
46
46
  window.removeEventListener("resize", () => r()), (l = (e = t.value) == null ? void 0 : e.parentNode) == null || l.removeChild(t.value);
@@ -57,13 +57,13 @@ const Z = ["aria-expanded"], ee = {
57
57
  o.value ? o.value = !1 : (o.value = !0, await O(), (e = t.value) == null || e.focus());
58
58
  }
59
59
  function T(e) {
60
- if (e.keyCode === d.ESCAPE)
60
+ if (e.keyCode === f.ESCAPE)
61
61
  r();
62
- else if (e.keyCode === d.DOWN && i.value < s.value.length - 1)
62
+ else if (e.keyCode === f.DOWN && i.value < s.value.length - 1)
63
63
  o.value && i.value++;
64
- else if (e.keyCode === d.UP && i.value > -1)
64
+ else if (e.keyCode === f.UP && i.value > -1)
65
65
  o.value && i.value--;
66
- else if (e.keyCode === d.ENTER && i.value !== -1)
66
+ else if (e.keyCode === f.ENTER && i.value !== -1)
67
67
  o.value && s[i.value].click();
68
68
  else
69
69
  return;
@@ -103,14 +103,14 @@ const Z = ["aria-expanded"], ee = {
103
103
  "data-test": "ll-dropdown",
104
104
  onKeydown: T
105
105
  }, [
106
- x(e.$slots, "toggle", {
106
+ b(e.$slots, "toggle", {
107
107
  isActive: o.value,
108
108
  toggle: m
109
109
  }, () => [
110
- E("button", {
110
+ x("button", {
111
111
  "data-test": "button|toggle",
112
112
  "aria-expanded": o.value,
113
- class: b([e.label ? "button--tertiary tw-min-w-auto tw-outline-none" : "button--icon button tw-rounded"]),
113
+ class: E([e.label ? "button--tertiary tw-min-w-auto tw-outline-none" : "button--icon button tw-rounded"]),
114
114
  onClick: m
115
115
  }, [
116
116
  e.label ? (v(), k("span", ee, [
@@ -127,11 +127,11 @@ const Z = ["aria-expanded"], ee = {
127
127
  onAfterLeave: N
128
128
  }, {
129
129
  default: F(() => [
130
- _(E("div", {
130
+ _(x("div", {
131
131
  ref_key: "contentRef",
132
132
  ref: t,
133
133
  "data-test": "ll-dropdown-content",
134
- class: b([
134
+ class: E([
135
135
  M(L).content,
136
136
  e.contentClass,
137
137
  {
@@ -142,7 +142,7 @@ const Z = ["aria-expanded"], ee = {
142
142
  ]),
143
143
  style: j(g.value)
144
144
  }, [
145
- x(e.$slots, "default", {
145
+ b(e.$slots, "default", {
146
146
  dismiss: r,
147
147
  isActive: o.value
148
148
  })
@@ -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 =\n 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('is-highlighted');\n prev in items.value && items.value[prev].classList.remove('is-highlighted');\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 ? 'button--tertiary tw-min-w-auto tw-outline-none' : 'button--icon button tw-rounded']\"\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\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-control\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":["contentRef","ref","dropdownRef","DEFAULT_ITEMS_LIST","items","itemIndex","isActive","styles","classes","useCssModule","watch","val","emit","next","prev","onMounted","props","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
+ {"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 =\n 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 ? 'button--tertiary tw-min-w-auto tw-outline-none' : 'button--icon button tw-rounded']\"\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\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-control\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":["contentRef","ref","dropdownRef","DEFAULT_ITEMS_LIST","items","itemIndex","isActive","styles","classes","useCssModule","watch","val","emit","next","prev","onMounted","props","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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"}
package/dist/Field.js CHANGED
@@ -1,7 +1,7 @@
1
- import { _ as o } from "./Field.vue_vue_type_script_setup_true_lang-42cf79d4.js";
1
+ import { _ as o } from "./Field.vue_vue_type_script_setup_true_lang-4483019d.js";
2
2
  import "vue";
3
3
  import "lodash-es/uniqueId";
4
- import "./Label.vue_vue_type_script_setup_true_lang-c5589919.js";
4
+ import "./Label.vue_vue_type_script_setup_true_lang-2de35913.js";
5
5
  import "./locale.js";
6
6
  import "lodash-es/get";
7
7
  export {
@@ -1,6 +1,6 @@
1
1
  import { defineComponent as x, useAttrs as k, useSlots as T, computed as a, openBlock as l, createBlock as m, resolveDynamicComponent as B, mergeProps as O, unref as f, withCtx as v, normalizeClass as R, createTextVNode as q, toDisplayString as p, createCommentVNode as s, createElementBlock as o, renderSlot as c } from "vue";
2
2
  import h from "lodash-es/uniqueId";
3
- import { _ as E } from "./Label.vue_vue_type_script_setup_true_lang-c5589919.js";
3
+ import { _ as E } from "./Label.vue_vue_type_script_setup_true_lang-2de35913.js";
4
4
  const L = ["aria-labelledby"], S = ["id"], C = {
5
5
  key: 4,
6
6
  class: "tw-mt-1 tw-block tw-whitespace-pre-line tw-text-xs",
@@ -93,4 +93,4 @@ const L = ["aria-labelledby"], S = ["id"], C = {
93
93
  export {
94
94
  z as _
95
95
  };
96
- //# sourceMappingURL=Field.vue_vue_type_script_setup_true_lang-42cf79d4.js.map
96
+ //# sourceMappingURL=Field.vue_vue_type_script_setup_true_lang-4483019d.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Field.vue_vue_type_script_setup_true_lang-42cf79d4.js","sources":["../src/components/Field/Field.vue"],"sourcesContent":["<script lang=\"ts\">\n export default {\n inheritAttrs: false,\n };\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 export interface FieldProps {\n /**\n * Adds spacing under the field that is consistent whether or not hint/error text is displayed.\n */\n addBottomSpace?: boolean;\n\n /**\n * Error text to display. Replaces `hintText` (if provided) & adds error styling.\n */\n errorText?: string;\n\n /**\n * Displays text below the input; hidden when the isReadOnly prop is truthy.\n */\n hintText?: string;\n\n /**\n * ID for the Label and Input; must be unique\n */\n id?: string;\n\n /**\n * ID for the error text element; useful for aria-errormessage\n */\n errorId?: string;\n\n /**\n * Whether it's a readonly field.\n */\n isReadOnly?: boolean;\n\n /**\n * Whether the field is required.\n */\n isRequired?: boolean;\n\n /**\n * Label to render above the input.\n */\n label?: string;\n\n /**\n * Show \"(optional)\" to the right of the label text\n */\n showOptionalInLabel?: boolean;\n\n /**\n * Indicates wheter the field is a fieldset or not\n */\n fieldset?: boolean;\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 });\n const attrs = useAttrs();\n const slots = useSlots();\n const fieldId = computed(() => props.id || uniqueId('field-'));\n const fieldErrorId = computed(() => props.errorId || uniqueId('field-error-'));\n const labelId = computed(() => uniqueId('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 v-bind=\"rootAttrs\"\n :is=\"wrapperElement\"\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 ]\"\n >\n <Label\n v-if=\"props.label\"\n :id=\"labelId\"\n :class=\"{ 'tw-mb-1.5': !!props.isReadOnly }\"\n :for=\"fieldId\"\n :has-error=\"hasError\"\n :is-required=\"isRequired\"\n :show-optional=\"props.showOptionalInLabel\"\n :legend=\"props.fieldset\"\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 <template v-if=\"props.isReadOnly\">\n <div :aria-labelledby=\"labelId\">\n <slot\n :field-id=\"fieldId\"\n :field-error-id=\"fieldErrorId\"\n :has-error=\"hasError\"\n :is-required=\"isRequired\"\n :label-id=\"labelId\"\n :show-optional-in-label=\"props.showOptionalInLabel\"\n ></slot>\n </div>\n </template>\n <template v-else>\n <slot\n :field-id=\"fieldId\"\n :field-error-id=\"fieldErrorId\"\n :has-error=\"hasError\"\n :is-required=\"isRequired\"\n :label-id=\"labelId\"\n :show-optional-in-label=\"props.showOptionalInLabel\"\n ></slot>\n </template>\n\n <span\n v-if=\"props.errorText\"\n :id=\"fieldErrorId\"\n class=\"tw-mt-1 tw-block tw-whitespace-pre-line tw-text-xs tw-text-red-500\"\n data-test=\"field-error\"\n >\n {{ props.errorText }}\n </span>\n\n <span v-else-if=\"props.hintText\" class=\"tw-mt-1 tw-block tw-whitespace-pre-line tw-text-xs\" data-test=\"field-hint\">\n <span v-if=\"!props.isReadOnly\">{{ props.hintText }}</span>\n </span>\n\n <div v-else-if=\"slots.hint\" class=\"tw-mt-1 tw-whitespace-pre-line tw-text-xs\" data-test=\"field-hint\">\n <!-- @slot for displaying hint text below the field -->\n <slot v-if=\"!props.isReadOnly\" name=\"hint\"></slot>\n </div>\n </component>\n</template>\n"],"names":["attrs","useAttrs","slots","useSlots","fieldId","computed","props","uniqueId","fieldErrorId","labelId","hasError","wrapperElement","rootAttrs","placeholder","otherAttrs"],"mappings":";;;;;;;;;;;OACiB;AAAA,EACb,cAAc;AAChB;;;;;;;;;;;;;;;;iBAwEMA,IAAQC,KACRC,IAAQC,KACRC,IAAUC,EAAS,MAAMC,EAAM,MAAMC,EAAS,QAAQ,CAAC,GACvDC,IAAeH,EAAS,MAAMC,EAAM,WAAWC,EAAS,cAAc,CAAC,GACvEE,IAAUJ,EAAS,MAAME,EAAS,cAAc,CAAC,GACjDG,IAAWL,EAAS,MAAM,CAAC,CAACC,EAAM,SAAS,GAC3CK,IAAiBN,EAAS,MAAOC,EAAM,WAAW,aAAa,KAAM,GAIrEM,IAAYP,EAAS,MAAM;AAC/B,YAAM,EAAE,aAAAQ,GAAa,GAAGC,EAAA,IAAed;AAEhC,aAAAc;AAAA,IAAA,CACR;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Field.vue_vue_type_script_setup_true_lang-4483019d.js","sources":["../src/components/Field/Field.vue"],"sourcesContent":["<script lang=\"ts\">\n export default {\n inheritAttrs: false,\n };\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 export interface FieldProps {\n /**\n * Adds spacing under the field that is consistent whether or not hint/error text is displayed.\n */\n addBottomSpace?: boolean;\n\n /**\n * Error text to display. Replaces `hintText` (if provided) & adds error styling.\n */\n errorText?: string;\n\n /**\n * Displays text below the input; hidden when the isReadOnly prop is truthy.\n */\n hintText?: string;\n\n /**\n * ID for the Label and Input; must be unique\n */\n id?: string;\n\n /**\n * ID for the error text element; useful for aria-errormessage\n */\n errorId?: string;\n\n /**\n * Whether it's a readonly field.\n */\n isReadOnly?: boolean;\n\n /**\n * Whether the field is required.\n */\n isRequired?: boolean;\n\n /**\n * Label to render above the input.\n */\n label?: string;\n\n /**\n * Show \"(optional)\" to the right of the label text\n */\n showOptionalInLabel?: boolean;\n\n /**\n * Indicates wheter the field is a fieldset or not\n */\n fieldset?: boolean;\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 });\n const attrs = useAttrs();\n const slots = useSlots();\n const fieldId = computed(() => props.id || uniqueId('field-'));\n const fieldErrorId = computed(() => props.errorId || uniqueId('field-error-'));\n const labelId = computed(() => uniqueId('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 v-bind=\"rootAttrs\"\n :is=\"wrapperElement\"\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 ]\"\n >\n <Label\n v-if=\"props.label\"\n :id=\"labelId\"\n :class=\"{ 'tw-mb-1.5': !!props.isReadOnly }\"\n :for=\"fieldId\"\n :has-error=\"hasError\"\n :is-required=\"isRequired\"\n :show-optional=\"props.showOptionalInLabel\"\n :legend=\"props.fieldset\"\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 <template v-if=\"props.isReadOnly\">\n <div :aria-labelledby=\"labelId\">\n <slot\n :field-id=\"fieldId\"\n :field-error-id=\"fieldErrorId\"\n :has-error=\"hasError\"\n :is-required=\"isRequired\"\n :label-id=\"labelId\"\n :show-optional-in-label=\"props.showOptionalInLabel\"\n ></slot>\n </div>\n </template>\n <template v-else>\n <slot\n :field-id=\"fieldId\"\n :field-error-id=\"fieldErrorId\"\n :has-error=\"hasError\"\n :is-required=\"isRequired\"\n :label-id=\"labelId\"\n :show-optional-in-label=\"props.showOptionalInLabel\"\n ></slot>\n </template>\n\n <span\n v-if=\"props.errorText\"\n :id=\"fieldErrorId\"\n class=\"tw-mt-1 tw-block tw-whitespace-pre-line tw-text-xs tw-text-red-500\"\n data-test=\"field-error\"\n >\n {{ props.errorText }}\n </span>\n\n <span v-else-if=\"props.hintText\" class=\"tw-mt-1 tw-block tw-whitespace-pre-line tw-text-xs\" data-test=\"field-hint\">\n <span v-if=\"!props.isReadOnly\">{{ props.hintText }}</span>\n </span>\n\n <div v-else-if=\"slots.hint\" class=\"tw-mt-1 tw-whitespace-pre-line tw-text-xs\" data-test=\"field-hint\">\n <!-- @slot for displaying hint text below the field -->\n <slot v-if=\"!props.isReadOnly\" name=\"hint\"></slot>\n </div>\n </component>\n</template>\n"],"names":["attrs","useAttrs","slots","useSlots","fieldId","computed","props","uniqueId","fieldErrorId","labelId","hasError","wrapperElement","rootAttrs","placeholder","otherAttrs"],"mappings":";;;;;;;;;;;OACiB;AAAA,EACb,cAAc;AAChB;;;;;;;;;;;;;;;;iBAwEMA,IAAQC,KACRC,IAAQC,KACRC,IAAUC,EAAS,MAAMC,EAAM,MAAMC,EAAS,QAAQ,CAAC,GACvDC,IAAeH,EAAS,MAAMC,EAAM,WAAWC,EAAS,cAAc,CAAC,GACvEE,IAAUJ,EAAS,MAAME,EAAS,cAAc,CAAC,GACjDG,IAAWL,EAAS,MAAM,CAAC,CAACC,EAAM,SAAS,GAC3CK,IAAiBN,EAAS,MAAOC,EAAM,WAAW,aAAa,KAAM,GAIrEM,IAAYP,EAAS,MAAM;AAC/B,YAAM,EAAE,aAAAQ,GAAa,GAAGC,EAAA,IAAed;AAEhC,aAAAc;AAAA,IAAA,CACR;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,8 +1,8 @@
1
- import { I } from "./index-79ce320f.js";
1
+ import { I as D } from "./index-79ce320f.js";
2
2
  import { t as u } from "./locale.js";
3
- import x from "./Button.js";
3
+ import I from "./Button.js";
4
4
  import F from "./Icon.js";
5
- import { resolveComponent as g, openBlock as r, createElementBlock as o, normalizeClass as d, createVNode as h, withModifiers as c, withCtx as T, createTextVNode as y, toDisplayString as p, createElementVNode as f, Fragment as v, createBlock as O, createCommentVNode as S, renderSlot as _, renderList as C, withDirectives as U, mergeProps as M, vShow as N } from "vue";
5
+ import { resolveComponent as g, openBlock as r, createElementBlock as o, normalizeClass as d, createVNode as h, withModifiers as c, withCtx as y, createTextVNode as T, toDisplayString as p, createElementVNode as f, Fragment as v, createBlock as O, createCommentVNode as S, renderSlot as w, renderList as C, withDirectives as U, mergeProps as M, vShow as N } from "vue";
6
6
  import { _ as P } from "./_plugin-vue_export-helper-dad06003.js";
7
7
  import "lodash-es/get";
8
8
  import "./Button.vue_used_vue_type_style_index_0_lang.module-b2ee90e6.js";
@@ -52,15 +52,15 @@ const A = "_button_oi2f6_201", L = {
52
52
  MIME_TYPES: ["application/vnd.ms-excel", "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"],
53
53
  ILLUSTRATION: "csv"
54
54
  }
55
- }), b = Object.freeze({
55
+ }), _ = Object.freeze({
56
56
  Dense: "dense",
57
57
  Standard: "standard"
58
58
  }), k = {
59
59
  name: "ll-file-upload",
60
60
  components: {
61
61
  "ll-icon": F,
62
- "ll-button": x,
63
- InlineSvg: I
62
+ "ll-button": I,
63
+ InlineSvg: D
64
64
  },
65
65
  inject: ["stashOptions"],
66
66
  inheritAttrs: !1,
@@ -97,13 +97,13 @@ const A = "_button_oi2f6_201", L = {
97
97
  size: {
98
98
  type: String,
99
99
  default: "standard",
100
- validator: (e) => Object.values(b).includes(e)
100
+ validator: (e) => Object.values(_).includes(e)
101
101
  }
102
102
  },
103
103
  emits: ["file-select", "file-delete", "file-error"],
104
104
  setup() {
105
105
  return {
106
- Sizes: b
106
+ Sizes: _
107
107
  };
108
108
  },
109
109
  data() {
@@ -202,11 +202,11 @@ const A = "_button_oi2f6_201", L = {
202
202
  if (e.type)
203
203
  return t(e.type);
204
204
  if (window.FileReader) {
205
- const a = new FileReader();
206
- a.onload = () => {
207
- const n = a.result.match(/[^:]\w+\/[\w-+\d.]+(?=;|,)/) ? a.result.match(/[^:]\w+\/[\w-+\d.]+(?=;|,)/)[0] : "";
208
- t(n);
209
- }, a.readAsDataURL(e);
205
+ const n = new FileReader();
206
+ n.onload = () => {
207
+ const a = n.result.match(/[^:]\w+\/[\w-+\d.]+(?=;|,)/) ? n.result.match(/[^:]\w+\/[\w-+\d.]+(?=;|,)/)[0] : "";
208
+ t(a);
209
+ }, n.readAsDataURL(e);
210
210
  } else
211
211
  i(new Error("Failed to read file."));
212
212
  });
@@ -215,64 +215,64 @@ const A = "_button_oi2f6_201", L = {
215
215
  return e.concat(t);
216
216
  }
217
217
  }
218
- }, z = ["data-test"], R = { key: 0 }, j = { class: "text-ice-900" }, X = {
218
+ }, j = ["data-test"], z = { key: 0 }, R = { class: "tw-text-ice-900" }, X = {
219
219
  key: 0,
220
- class: "text-small text-ice-700 tw-mt-6 tw-text-center"
220
+ class: "tw-mt-6 tw-text-center tw-text-xs tw-text-ice-700"
221
221
  }, Y = ["accept", "multiple"];
222
- function B(e, t, i, a, n, l) {
223
- const m = g("ll-button"), w = g("InlineSvg"), D = g("ll-icon");
222
+ function B(e, t, i, n, a, l) {
223
+ const m = g("ll-button"), b = g("InlineSvg"), x = g("ll-icon");
224
224
  return r(), o("div", {
225
225
  class: d(e.$attrs.class),
226
226
  "data-test": e.$attrs["data-test"]
227
227
  }, [
228
- i.buttonOnly ? (r(), o("div", R, [
228
+ i.buttonOnly ? (r(), o("div", z, [
229
229
  h(m, {
230
230
  secondary: "",
231
231
  type: "button",
232
232
  disabled: i.disabled || null,
233
233
  onClick: c(l.openFileDialog, ["stop", "prevent"])
234
234
  }, {
235
- default: T(() => [
236
- y(p(n.fileUploadUploadFileText), 1)
235
+ default: y(() => [
236
+ T(p(a.fileUploadUploadFileText), 1)
237
237
  ]),
238
238
  _: 1
239
239
  }, 8, ["disabled", "onClick"])
240
240
  ])) : (r(), o("div", {
241
241
  key: 1,
242
- class: d(["tw-rounded tw-p-6", [e.$style["file-dropbox"], n.isDraggingOver && e.$style["is-dragging"], i.disabled && e.$style["is-disabled"]]]),
242
+ class: d(["tw-rounded tw-p-6", [e.$style["file-dropbox"], a.isDraggingOver && e.$style["is-dragging"], i.disabled && e.$style["is-disabled"]]]),
243
243
  onDragover: t[0] || (t[0] = c((...s) => l.handleDragEnter && l.handleDragEnter(...s), ["prevent"])),
244
244
  onDrop: t[1] || (t[1] = c((...s) => l.handleDropFile && l.handleDropFile(...s), ["prevent"])),
245
245
  onDragleave: t[2] || (t[2] = c((...s) => l.handleDragLeave && l.handleDragLeave(...s), ["prevent"]))
246
246
  }, [
247
247
  f("div", {
248
- class: d(["tw-flex-column align-center align-middle tw-flex tw-text-center", [{ "md:flex-row tw-items-center": i.size === a.Sizes.Dense }]])
248
+ class: d(["tw-flex tw-flex-col tw-items-center tw-justify-center tw-text-center", [{ "md:flex-row tw-items-center": i.size === n.Sizes.Dense }]])
249
249
  }, [
250
250
  i.files.length ? (r(!0), o(v, { key: 1 }, C(i.files, (s) => (r(), o("div", {
251
251
  key: s.name
252
252
  }, [
253
- h(D, { name: "file" }),
253
+ h(x, { name: "file" }),
254
254
  f("span", null, p(s.name), 1),
255
255
  h(m, {
256
256
  class: d([e.$style["remove-button"], e.$style.button]),
257
257
  onClick: c((H) => l.handleFileDelete(s), ["stop", "prevent"])
258
258
  }, {
259
- default: T(() => [
260
- y(p(n.removeText), 1)
259
+ default: y(() => [
260
+ T(p(a.removeText), 1)
261
261
  ]),
262
262
  _: 2
263
263
  }, 1032, ["class", "onClick"])
264
264
  ]))), 128)) : (r(), o(v, { key: 0 }, [
265
- i.size !== a.Sizes.Dense ? (r(), O(w, {
265
+ i.size !== n.Sizes.Dense ? (r(), O(b, {
266
266
  key: 0,
267
267
  src: l.illustrationPath,
268
268
  name: "file",
269
269
  width: "84",
270
270
  height: "96"
271
271
  }, null, 8, ["src"])) : S("", !0),
272
- f("span", j, p(n.fileUploadDragDropFileHereText), 1),
272
+ f("span", R, p(a.fileUploadDragDropFileHereText), 1),
273
273
  f("span", {
274
- class: d(i.size === a.Sizes.Dense ? "md:ml-1 md:mr-2 md:my-0 my-1 text-ice-900" : "tw-mt-1.5 my-1")
275
- }, p(n.fileUploadOrText), 3),
274
+ class: d(i.size === n.Sizes.Dense ? "md:ml-1 md:mr-2 md:my-0 my-1 tw-text-ice-900" : "tw-mt-1.5 my-1")
275
+ }, p(a.fileUploadOrText), 3),
276
276
  h(m, {
277
277
  class: d(["tw-mt-1.5", e.$style["file-select-button"]]),
278
278
  secondary: "",
@@ -280,9 +280,9 @@ function B(e, t, i, a, n, l) {
280
280
  disabled: i.disabled,
281
281
  onClick: c(l.openFileDialog, ["stop", "prevent"])
282
282
  }, {
283
- default: T(() => [
284
- _(e.$slots, "submitText", {}, () => [
285
- y(p(n.fileUploadUploadFileText), 1)
283
+ default: y(() => [
284
+ w(e.$slots, "submitText", {}, () => [
285
+ T(p(a.fileUploadUploadFileText), 1)
286
286
  ])
287
287
  ]),
288
288
  _: 3
@@ -290,7 +290,7 @@ function B(e, t, i, a, n, l) {
290
290
  ], 64))
291
291
  ], 2),
292
292
  e.$slots.hint && !i.files.length ? (r(), o("div", X, [
293
- _(e.$slots, "hint")
293
+ w(e.$slots, "hint")
294
294
  ])) : S("", !0)
295
295
  ], 34)),
296
296
  U(f("input", M(l.inputAttrs, {
@@ -302,14 +302,14 @@ function B(e, t, i, a, n, l) {
302
302
  }), null, 16, Y), [
303
303
  [N, !1]
304
304
  ])
305
- ], 10, z);
305
+ ], 10, j);
306
306
  }
307
307
  const V = {
308
308
  $style: L
309
309
  }, le = /* @__PURE__ */ P(k, [["render", B], ["__cssModules", V]]);
310
310
  export {
311
311
  E as FILE_TYPES,
312
- b as Sizes,
312
+ _ as Sizes,
313
313
  le as default
314
314
  };
315
315
  //# sourceMappingURL=FileUpload.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"FileUpload.js","sources":["../src/components/FileUpload/FileUpload.vue"],"sourcesContent":["<script>\n import InlineSvg from 'vue-inline-svg';\n\n import { t } from '../../locale';\n import Button from '../Button/Button.vue';\n import Icon from '../Icon/Icon.vue';\n\n export const FILE_TYPES = Object.freeze({\n CSV: {\n ACCEPTS: ['text/csv'],\n EXTENSION: ['csv'],\n MIME_TYPES: ['text/csv', 'application/octet-stream', 'application/vnd.ms-excel'],\n ILLUSTRATION: 'csv',\n },\n PDF: {\n ACCEPTS: ['application/pdf'],\n EXTENSION: ['pdf'],\n MIME_TYPES: ['application/pdf'],\n ILLUSTRATION: 'pdf',\n },\n PNG: {\n ACCEPTS: ['image/png'],\n EXTENSION: ['png'],\n MIME_TYPES: ['image/png'],\n ILLUSTRATION: 'image',\n },\n JPEG: {\n ACCEPTS: ['image/jpeg'],\n EXTENSION: ['jpg', 'jpeg'],\n MIME_TYPES: ['image/jpeg'],\n ILLUSTRATION: 'image',\n },\n DOC: {\n ACCEPTS: ['application/msword', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'],\n EXTENSION: ['doc', 'docx'],\n MIME_TYPES: ['application/msword', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'],\n ILLUSTRATION: 'document',\n },\n XLS: {\n ACCEPTS: ['application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'],\n EXTENSION: ['xls', 'xlsx'],\n MIME_TYPES: ['application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'],\n ILLUSTRATION: 'csv',\n },\n });\n\n // TODO: convert to enum (typescript)\n export const Sizes = Object.freeze({\n Dense: 'dense',\n Standard: 'standard',\n });\n\n export default {\n name: 'll-file-upload',\n\n components: {\n 'll-icon': Icon,\n 'll-button': Button,\n InlineSvg,\n },\n\n inject: ['stashOptions'],\n\n inheritAttrs: false,\n\n props: {\n files: {\n type: Array,\n default: () => [],\n },\n\n /**\n * The file types accepted by the input\n */\n fileTypes: {\n type: Array,\n default: () => Object.keys(FILE_TYPES),\n },\n\n /**\n * Shows only an upload button\n */\n buttonOnly: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Disables the upload button\n */\n disabled: {\n type: Boolean,\n default: false,\n },\n\n /**\n * When using the drag and drop feature, hide the icon\n * and display everything on one line.\n */\n size: {\n type: String,\n default: 'standard',\n validator: (value) => Object.values(Sizes).includes(value),\n },\n },\n\n emits: ['file-select', 'file-delete', 'file-error'],\n\n setup() {\n return {\n Sizes,\n };\n },\n\n data() {\n return {\n isDraggingOver: false,\n removeText: t('ll.fileUpload.remove'),\n fileUploadUploadFileText: t('ll.fileUpload.uploadFile'),\n fileUploadDragDropFileHereText: t('ll.fileUpload.dragDropFileHere'),\n fileUploadOrText: t('ll.fileUpload.or'),\n };\n },\n\n computed: {\n inputAttrs() {\n const attrs = { ...this.$attrs };\n\n delete attrs['data-test'];\n delete attrs.class;\n delete attrs.type;\n delete attrs.accept;\n\n return attrs;\n },\n\n /**\n * @returns {Array} A list of accepted file types\n */\n acceptedMimeTypes() {\n return this.fileTypes.map((fileType) => this.fileMeta[fileType].MIME_TYPES).reduce(this.flattenArray);\n },\n\n /**\n * @returns {Array} A list of accepted file types\n */\n acceptedFileExtensions() {\n return this.fileTypes.map((fileType) => this.fileMeta[fileType].EXTENSION).reduce(this.flattenArray);\n },\n\n fileMeta() {\n return FILE_TYPES;\n },\n\n illustrationPath() {\n return `${this.stashOptions?.staticPath}/illustrations/FileUpload/${\n FILE_TYPES[this.fileTypes[0]].ILLUSTRATION\n }.svg`;\n },\n },\n\n methods: {\n openFileDialog() {\n if (this.$refs.fileUpload) {\n this.$refs.fileUpload.value = '';\n this.$refs.fileUpload.click();\n }\n },\n\n /**\n * Sets file(s) to selected file(s) from dialogue\n * @param {Object} event - file select event that contains file(s)\n * @returns {Array} An array of files\n */\n handleFileInput(event) {\n const files = [...event.target.files];\n\n this.$emit('file-select', { event, files });\n },\n\n handleDragEnter() {\n this.isDraggingOver = true;\n },\n\n handleDragLeave() {\n this.isDraggingOver = false;\n },\n\n /**\n * Sets file to dropped file if it is proper file type\n * @param {Object} event - file select event that contains file\n */\n async handleDropFile(event) {\n if (this.disabled) {\n return;\n }\n\n const files = [...event.dataTransfer.files];\n\n this.isDraggingOver = false;\n\n if (this.acceptedMimeTypes.length) {\n try {\n const mimeTypePromises = await Promise.all(files.map((file) => this.readMimeType(file)));\n const allCorrectMimeTypes = mimeTypePromises.every((mimeType) => this.acceptedMimeTypes.includes(mimeType));\n\n if (!allCorrectMimeTypes) {\n throw new Error('One or more files contains an unacceptable mime type.');\n }\n\n const allCorrectFileExtensions = files.every((file) => {\n const extension = file.name.split('.').pop();\n\n return this.acceptedFileExtensions.includes(extension);\n });\n\n if (!allCorrectFileExtensions) {\n throw new Error('One or more files contains an unacceptable extension.');\n }\n\n this.$emit('file-select', { event, files });\n } catch (error) {\n this.handleFileError(error);\n }\n } else {\n this.$emit('file-select', { event, files });\n }\n },\n\n handleFileError(error) {\n const message = this.t('ll.fileUpload.errors.incorrectFileType', {\n fileTypes: this.acceptedFileExtensions.join(', '),\n });\n\n if (this.$attrs['file-error']) {\n this.$emit('file-error', message);\n } else {\n this.$notify.warning(message);\n }\n\n throw error;\n },\n\n handleFileDelete(file) {\n this.$emit('file-delete', file);\n },\n\n /**\n * Check for the mime type on the uploaded File object\n * Otherwise load the file and attempt to read it\n * @param file The Uploaded File object\n */\n readMimeType(file) {\n return new Promise((resolve, reject) => {\n if (file.type) {\n return resolve(file.type);\n } else if (window.FileReader) {\n const fileReader = new FileReader();\n\n fileReader.onload = () => {\n const mimeType = fileReader.result.match(/[^:]\\w+\\/[\\w-+\\d.]+(?=;|,)/)\n ? fileReader.result.match(/[^:]\\w+\\/[\\w-+\\d.]+(?=;|,)/)[0]\n : '';\n\n resolve(mimeType);\n };\n\n fileReader.readAsDataURL(file);\n } else {\n reject(new Error('Failed to read file.'));\n }\n });\n },\n\n flattenArray(a, b) {\n return a.concat(b);\n },\n },\n };\n</script>\n\n<template>\n <div :class=\"$attrs.class\" :data-test=\"$attrs['data-test']\">\n <div v-if=\"buttonOnly\">\n <ll-button secondary type=\"button\" :disabled=\"disabled || null\" @click.stop.prevent=\"openFileDialog\">\n {{ fileUploadUploadFileText }}\n </ll-button>\n </div>\n <div\n v-else\n class=\"tw-rounded tw-p-6\"\n :class=\"[$style['file-dropbox'], isDraggingOver && $style['is-dragging'], disabled && $style['is-disabled']]\"\n @dragover.prevent=\"handleDragEnter\"\n @drop.prevent=\"handleDropFile\"\n @dragleave.prevent=\"handleDragLeave\"\n >\n <div\n class=\"tw-flex-column align-center align-middle tw-flex tw-text-center\"\n :class=\"[{ 'md:flex-row tw-items-center': size === Sizes.Dense }]\"\n >\n <template v-if=\"!files.length\">\n <InlineSvg v-if=\"size !== Sizes.Dense\" :src=\"illustrationPath\" name=\"file\" width=\"84\" height=\"96\" />\n <span class=\"text-ice-900\">\n {{ fileUploadDragDropFileHereText }}\n </span>\n <span :class=\"size === Sizes.Dense ? 'md:ml-1 md:mr-2 md:my-0 my-1 text-ice-900' : 'tw-mt-1.5 my-1'\">\n {{ fileUploadOrText }}\n </span>\n <ll-button\n class=\"tw-mt-1.5\"\n secondary\n type=\"button\"\n :class=\"$style['file-select-button']\"\n :disabled=\"disabled\"\n @click.stop.prevent=\"openFileDialog\"\n >\n <!-- @slot for custom submit text -->\n <slot name=\"submitText\">{{ fileUploadUploadFileText }}</slot>\n </ll-button>\n </template>\n <template v-else>\n <div v-for=\"file in files\" :key=\"file.name\">\n <ll-icon name=\"file\" />\n <span>{{ file.name }}</span>\n <ll-button\n :class=\"[$style['remove-button'], $style['button']]\"\n @click.stop.prevent=\"handleFileDelete(file)\"\n >\n {{ removeText }}\n </ll-button>\n </div>\n </template>\n </div>\n <div v-if=\"$slots.hint && !files.length\" class=\"text-small text-ice-700 tw-mt-6 tw-text-center\">\n <!-- @slot for displaying helpful text and/or links -->\n <slot name=\"hint\"></slot>\n </div>\n </div>\n <input\n v-show=\"false\"\n v-bind=\"inputAttrs\"\n ref=\"fileUpload\"\n type=\"file\"\n :accept=\"fileTypes.map((fileType) => fileMeta[fileType].ACCEPTS).reduce(flattenArray)\"\n :multiple=\"$attrs['multiple']\"\n @change=\"handleFileInput($event)\"\n />\n </div>\n</template>\n\n<style lang=\"scss\" module>\n .file-dropbox {\n background: var(--color-ice-200);\n background-image: url(\"data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='4' ry='4' stroke='%23C5C9D4FF' stroke-width='1' stroke-dasharray='5 %2c 5' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e\");\n background-repeat: no-repeat;\n border: border('thin');\n border-color: transparent;\n }\n\n .is-dragging {\n background-image: none;\n border-color: var(--color-ice-500);\n\n & > * {\n pointer-events: none;\n }\n }\n\n .is-disabled {\n cursor: no-drop;\n }\n\n // Constrain the upload icon for drag/drop to the required size\n .upload-icon {\n height: 98px;\n width: 84px;\n }\n\n .remove-button.button {\n background: transparent;\n border: none;\n color: var(--color-red-500);\n\n &:hover {\n background: transparent;\n border: none;\n }\n }\n</style>\n"],"names":["FILE_TYPES","Sizes","_sfc_main","Icon","Button","InlineSvg","value","t","attrs","fileType","_a","event","files","file","mimeType","extension","error","message","resolve","reject","fileReader","a","b","_hoisted_3","_createElementBlock","_normalizeClass","_ctx","$props","_hoisted_2","_createVNode","_component_ll_button","$options","$data","args","_createElementVNode","$setup","_Fragment","_renderList","_component_ll_icon","_toDisplayString","_withModifiers","$event","_createBlock","_component_InlineSvg","_renderSlot","_openBlock","_hoisted_4","_mergeProps","_cache"],"mappings":"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"}
1
+ {"version":3,"file":"FileUpload.js","sources":["../src/components/FileUpload/FileUpload.vue"],"sourcesContent":["<script>\n import InlineSvg from 'vue-inline-svg';\n\n import { t } from '../../locale';\n import Button from '../Button/Button.vue';\n import Icon from '../Icon/Icon.vue';\n\n export const FILE_TYPES = Object.freeze({\n CSV: {\n ACCEPTS: ['text/csv'],\n EXTENSION: ['csv'],\n MIME_TYPES: ['text/csv', 'application/octet-stream', 'application/vnd.ms-excel'],\n ILLUSTRATION: 'csv',\n },\n PDF: {\n ACCEPTS: ['application/pdf'],\n EXTENSION: ['pdf'],\n MIME_TYPES: ['application/pdf'],\n ILLUSTRATION: 'pdf',\n },\n PNG: {\n ACCEPTS: ['image/png'],\n EXTENSION: ['png'],\n MIME_TYPES: ['image/png'],\n ILLUSTRATION: 'image',\n },\n JPEG: {\n ACCEPTS: ['image/jpeg'],\n EXTENSION: ['jpg', 'jpeg'],\n MIME_TYPES: ['image/jpeg'],\n ILLUSTRATION: 'image',\n },\n DOC: {\n ACCEPTS: ['application/msword', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'],\n EXTENSION: ['doc', 'docx'],\n MIME_TYPES: ['application/msword', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'],\n ILLUSTRATION: 'document',\n },\n XLS: {\n ACCEPTS: ['application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'],\n EXTENSION: ['xls', 'xlsx'],\n MIME_TYPES: ['application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'],\n ILLUSTRATION: 'csv',\n },\n });\n\n // TODO: convert to enum (typescript)\n export const Sizes = Object.freeze({\n Dense: 'dense',\n Standard: 'standard',\n });\n\n export default {\n name: 'll-file-upload',\n\n components: {\n 'll-icon': Icon,\n 'll-button': Button,\n InlineSvg,\n },\n\n inject: ['stashOptions'],\n\n inheritAttrs: false,\n\n props: {\n files: {\n type: Array,\n default: () => [],\n },\n\n /**\n * The file types accepted by the input\n */\n fileTypes: {\n type: Array,\n default: () => Object.keys(FILE_TYPES),\n },\n\n /**\n * Shows only an upload button\n */\n buttonOnly: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Disables the upload button\n */\n disabled: {\n type: Boolean,\n default: false,\n },\n\n /**\n * When using the drag and drop feature, hide the icon\n * and display everything on one line.\n */\n size: {\n type: String,\n default: 'standard',\n validator: (value) => Object.values(Sizes).includes(value),\n },\n },\n\n emits: ['file-select', 'file-delete', 'file-error'],\n\n setup() {\n return {\n Sizes,\n };\n },\n\n data() {\n return {\n isDraggingOver: false,\n removeText: t('ll.fileUpload.remove'),\n fileUploadUploadFileText: t('ll.fileUpload.uploadFile'),\n fileUploadDragDropFileHereText: t('ll.fileUpload.dragDropFileHere'),\n fileUploadOrText: t('ll.fileUpload.or'),\n };\n },\n\n computed: {\n inputAttrs() {\n const attrs = { ...this.$attrs };\n\n delete attrs['data-test'];\n delete attrs.class;\n delete attrs.type;\n delete attrs.accept;\n\n return attrs;\n },\n\n /**\n * @returns {Array} A list of accepted file types\n */\n acceptedMimeTypes() {\n return this.fileTypes.map((fileType) => this.fileMeta[fileType].MIME_TYPES).reduce(this.flattenArray);\n },\n\n /**\n * @returns {Array} A list of accepted file types\n */\n acceptedFileExtensions() {\n return this.fileTypes.map((fileType) => this.fileMeta[fileType].EXTENSION).reduce(this.flattenArray);\n },\n\n fileMeta() {\n return FILE_TYPES;\n },\n\n illustrationPath() {\n return `${this.stashOptions?.staticPath}/illustrations/FileUpload/${\n FILE_TYPES[this.fileTypes[0]].ILLUSTRATION\n }.svg`;\n },\n },\n\n methods: {\n openFileDialog() {\n if (this.$refs.fileUpload) {\n this.$refs.fileUpload.value = '';\n this.$refs.fileUpload.click();\n }\n },\n\n /**\n * Sets file(s) to selected file(s) from dialogue\n * @param {Object} event - file select event that contains file(s)\n * @returns {Array} An array of files\n */\n handleFileInput(event) {\n const files = [...event.target.files];\n\n this.$emit('file-select', { event, files });\n },\n\n handleDragEnter() {\n this.isDraggingOver = true;\n },\n\n handleDragLeave() {\n this.isDraggingOver = false;\n },\n\n /**\n * Sets file to dropped file if it is proper file type\n * @param {Object} event - file select event that contains file\n */\n async handleDropFile(event) {\n if (this.disabled) {\n return;\n }\n\n const files = [...event.dataTransfer.files];\n\n this.isDraggingOver = false;\n\n if (this.acceptedMimeTypes.length) {\n try {\n const mimeTypePromises = await Promise.all(files.map((file) => this.readMimeType(file)));\n const allCorrectMimeTypes = mimeTypePromises.every((mimeType) => this.acceptedMimeTypes.includes(mimeType));\n\n if (!allCorrectMimeTypes) {\n throw new Error('One or more files contains an unacceptable mime type.');\n }\n\n const allCorrectFileExtensions = files.every((file) => {\n const extension = file.name.split('.').pop();\n\n return this.acceptedFileExtensions.includes(extension);\n });\n\n if (!allCorrectFileExtensions) {\n throw new Error('One or more files contains an unacceptable extension.');\n }\n\n this.$emit('file-select', { event, files });\n } catch (error) {\n this.handleFileError(error);\n }\n } else {\n this.$emit('file-select', { event, files });\n }\n },\n\n handleFileError(error) {\n const message = this.t('ll.fileUpload.errors.incorrectFileType', {\n fileTypes: this.acceptedFileExtensions.join(', '),\n });\n\n if (this.$attrs['file-error']) {\n this.$emit('file-error', message);\n } else {\n this.$notify.warning(message);\n }\n\n throw error;\n },\n\n handleFileDelete(file) {\n this.$emit('file-delete', file);\n },\n\n /**\n * Check for the mime type on the uploaded File object\n * Otherwise load the file and attempt to read it\n * @param file The Uploaded File object\n */\n readMimeType(file) {\n return new Promise((resolve, reject) => {\n if (file.type) {\n return resolve(file.type);\n } else if (window.FileReader) {\n const fileReader = new FileReader();\n\n fileReader.onload = () => {\n const mimeType = fileReader.result.match(/[^:]\\w+\\/[\\w-+\\d.]+(?=;|,)/)\n ? fileReader.result.match(/[^:]\\w+\\/[\\w-+\\d.]+(?=;|,)/)[0]\n : '';\n\n resolve(mimeType);\n };\n\n fileReader.readAsDataURL(file);\n } else {\n reject(new Error('Failed to read file.'));\n }\n });\n },\n\n flattenArray(a, b) {\n return a.concat(b);\n },\n },\n };\n</script>\n\n<template>\n <div :class=\"$attrs.class\" :data-test=\"$attrs['data-test']\">\n <div v-if=\"buttonOnly\">\n <ll-button secondary type=\"button\" :disabled=\"disabled || null\" @click.stop.prevent=\"openFileDialog\">\n {{ fileUploadUploadFileText }}\n </ll-button>\n </div>\n <div\n v-else\n class=\"tw-rounded tw-p-6\"\n :class=\"[$style['file-dropbox'], isDraggingOver && $style['is-dragging'], disabled && $style['is-disabled']]\"\n @dragover.prevent=\"handleDragEnter\"\n @drop.prevent=\"handleDropFile\"\n @dragleave.prevent=\"handleDragLeave\"\n >\n <div\n class=\"tw-flex tw-flex-col tw-items-center tw-justify-center tw-text-center\"\n :class=\"[{ 'md:flex-row tw-items-center': size === Sizes.Dense }]\"\n >\n <template v-if=\"!files.length\">\n <InlineSvg v-if=\"size !== Sizes.Dense\" :src=\"illustrationPath\" name=\"file\" width=\"84\" height=\"96\" />\n <span class=\"tw-text-ice-900\">\n {{ fileUploadDragDropFileHereText }}\n </span>\n <span :class=\"size === Sizes.Dense ? 'md:ml-1 md:mr-2 md:my-0 my-1 tw-text-ice-900' : 'tw-mt-1.5 my-1'\">\n {{ fileUploadOrText }}\n </span>\n <ll-button\n class=\"tw-mt-1.5\"\n secondary\n type=\"button\"\n :class=\"$style['file-select-button']\"\n :disabled=\"disabled\"\n @click.stop.prevent=\"openFileDialog\"\n >\n <!-- @slot for custom submit text -->\n <slot name=\"submitText\">{{ fileUploadUploadFileText }}</slot>\n </ll-button>\n </template>\n <template v-else>\n <div v-for=\"file in files\" :key=\"file.name\">\n <ll-icon name=\"file\" />\n <span>{{ file.name }}</span>\n <ll-button\n :class=\"[$style['remove-button'], $style['button']]\"\n @click.stop.prevent=\"handleFileDelete(file)\"\n >\n {{ removeText }}\n </ll-button>\n </div>\n </template>\n </div>\n <div v-if=\"$slots.hint && !files.length\" class=\"tw-mt-6 tw-text-center tw-text-xs tw-text-ice-700\">\n <!-- @slot for displaying helpful text and/or links -->\n <slot name=\"hint\"></slot>\n </div>\n </div>\n <input\n v-show=\"false\"\n v-bind=\"inputAttrs\"\n ref=\"fileUpload\"\n type=\"file\"\n :accept=\"fileTypes.map((fileType) => fileMeta[fileType].ACCEPTS).reduce(flattenArray)\"\n :multiple=\"$attrs['multiple']\"\n @change=\"handleFileInput($event)\"\n />\n </div>\n</template>\n\n<style lang=\"scss\" module>\n .file-dropbox {\n background: var(--color-ice-200);\n background-image: url(\"data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='4' ry='4' stroke='%23C5C9D4FF' stroke-width='1' stroke-dasharray='5 %2c 5' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e\");\n background-repeat: no-repeat;\n border: border('thin');\n border-color: transparent;\n }\n\n .is-dragging {\n background-image: none;\n border-color: var(--color-ice-500);\n\n & > * {\n pointer-events: none;\n }\n }\n\n .is-disabled {\n cursor: no-drop;\n }\n\n // Constrain the upload icon for drag/drop to the required size\n .upload-icon {\n height: 98px;\n width: 84px;\n }\n\n .remove-button.button {\n background: transparent;\n border: none;\n color: var(--color-red-500);\n\n &:hover {\n background: transparent;\n border: none;\n }\n }\n</style>\n"],"names":["FILE_TYPES","Sizes","_sfc_main","Icon","Button","InlineSvg","value","t","attrs","fileType","_a","event","files","file","mimeType","extension","error","message","resolve","reject","fileReader","a","b","_hoisted_3","_createElementBlock","_normalizeClass","_ctx","$props","_hoisted_2","_createVNode","_component_ll_button","$options","$data","args","_createElementVNode","$setup","_Fragment","_renderList","_component_ll_icon","_toDisplayString","_withModifiers","$event","_createBlock","_component_InlineSvg","_renderSlot","_openBlock","_hoisted_4","_mergeProps","_cache"],"mappings":"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"}
@@ -1,10 +1,10 @@
1
1
  import { defineComponent as S, computed as p, openBlock as r, createBlock as $, withCtx as u, createElementVNode as s, createElementBlock as d, withDirectives as f, vModelCheckbox as v, createVNode as _, withKeys as h, createTextVNode as b, toDisplayString as x, unref as C, createCommentVNode as K, Fragment as A, renderList as B } from "vue";
2
2
  import { t as E } from "./locale.js";
3
- import { _ as N } from "./Field.vue_vue_type_script_setup_true_lang-42cf79d4.js";
3
+ import { _ as N } from "./Field.vue_vue_type_script_setup_true_lang-4483019d.js";
4
4
  import y from "./FilterChip.js";
5
5
  import "lodash-es/get";
6
6
  import "lodash-es/uniqueId";
7
- import "./Label.vue_vue_type_script_setup_true_lang-c5589919.js";
7
+ import "./Label.vue_vue_type_script_setup_true_lang-2de35913.js";
8
8
  import "./Chip.js";
9
9
  import "./utils/colorScheme.js";
10
10
  import "./Icon.js";