@leaflink/stash 48.15.1 → 48.16.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.
- package/assets/illustrations/FileUpload/csv.svg +1 -1
- package/assets/illustrations/FileUpload/document.svg +1 -17
- package/assets/illustrations/FileUpload/image.svg +1 -1
- package/assets/illustrations/FileUpload/pdf.svg +1 -1
- package/dist/Dropdown.js +17 -17
- package/dist/Dropdown.js.map +1 -1
- package/dist/Select.js +3 -3
- package/dist/Select.js.map +1 -1
- package/dist/components.css +1 -1
- package/dist/tailwind-base.js +4 -4
- package/dist/tailwind-base.js.map +1 -1
- package/package.json +1 -1
- package/tailwind-base.ts +4 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
<svg
|
|
1
|
+
<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 84 98"><g><path fill-rule="evenodd" clip-rule="evenodd" d="M57.473 4H12a4 4 0 0 0-4 4v74a4 4 0 0 0 4 4h60a4 4 0 0 0 4-4V22.527L57.473 4Z" fill="#fff"/><path fill-rule="evenodd" clip-rule="evenodd" d="M57.473 4 76 22.527H61.473a4 4 0 0 1-4-4V4Z" fill="#76797F"/><rect x="16" y="74" width="52" height="4" rx="1" fill="#76797F"/><rect x="16" y="59" width="52" height="4" rx="1" fill="#76797F"/><rect x="16" y="43" width="52" height="4" rx="1" fill="#76797F"/><rect x="64" y="44" width="4" height="34" rx="1" fill="#76797F"/><rect x="40" y="44" width="4" height="34" rx="1" fill="#76797F"/><rect x="16" y="43" width="4" height="35" rx="1" fill="#76797F"/></g></svg>
|
|
@@ -1,17 +1 @@
|
|
|
1
|
-
<svg
|
|
2
|
-
<g filter="url(#b)">
|
|
3
|
-
<path fill-rule="evenodd" clip-rule="evenodd" d="M57.473 4H12a4 4 0 0 0-4 4v74a4 4 0 0 0 4 4h60a4 4 0 0 0 4-4V22.527L57.473 4Z" fill="#fff"/><path fill-rule="evenodd" clip-rule="evenodd" d="M57.473 4 76 22.527H61.473a4 4 0 0 1-4-4V4Z" fill="#76797F"/><path d="M67 66H39a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h28a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1ZM67 56H39a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h28a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1ZM67 46H39a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h28a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1ZM67 36H39a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h28a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1ZM31 66H17a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1ZM31 56H17a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1ZM31 46H17a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1ZM31 36H17a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1Z" fill="#76797F"/>
|
|
4
|
-
</g>
|
|
5
|
-
<defs>
|
|
6
|
-
<filter id="b" x="0" y="0" width="84" height="98" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
|
7
|
-
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
|
8
|
-
<feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
|
9
|
-
<feOffset dy="4"/>
|
|
10
|
-
<feGaussianBlur stdDeviation="4"/>
|
|
11
|
-
<feComposite in2="hardAlpha" operator="out"/>
|
|
12
|
-
<feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.06 0"/>
|
|
13
|
-
<feBlend in2="BackgroundImageFix" result="effect1_dropShadow_7233_78481"/>
|
|
14
|
-
<feBlend in="SourceGraphic" in2="effect1_dropShadow_7233_78481" result="shape"/>
|
|
15
|
-
</filter>
|
|
16
|
-
</defs>
|
|
17
|
-
</svg>
|
|
1
|
+
<svg viewBox="0 0 84 98" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M57.473 4H12a4 4 0 0 0-4 4v74a4 4 0 0 0 4 4h60a4 4 0 0 0 4-4V22.527L57.473 4Z" fill="#fff"/><path fill-rule="evenodd" clip-rule="evenodd" d="M57.473 4 76 22.527H61.473a4 4 0 0 1-4-4V4Z" fill="#76797F"/><path d="M67 66H39a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h28a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1Zm0-10H39a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h28a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1Zm0-10H39a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h28a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1Zm0-10H39a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h28a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1ZM31 66H17a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1Zm0-10H17a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1Zm0-10H17a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1Zm0-10H17a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1Z" fill="#76797F"/></svg>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<svg
|
|
1
|
+
<svg viewBox="0 0 84 98" fill="none" xmlns="http://www.w3.org/2000/svg"><g fill-rule="evenodd" clip-rule="evenodd"><path d="M57.473 4H12a4 4 0 0 0-4 4v74a4 4 0 0 0 4 4h60a4 4 0 0 0 4-4V22.527L57.473 4Z" fill="#fff"/><path d="M25.667 35.667h32.666V59l-7-7-11.666 11.667-7-7-7 7v-28Zm-4.667 0A4.667 4.667 0 0 1 25.667 31h32.666A4.667 4.667 0 0 1 63 35.667v32.666A4.667 4.667 0 0 1 58.333 73H25.667A4.667 4.667 0 0 1 21 68.333V35.667Zm21 11.666a4.667 4.667 0 1 1-9.333 0 4.667 4.667 0 0 1 9.333 0ZM57.473 4 76 22.527H61.473a4 4 0 0 1-4-4V4Z" fill="#76797F"/></g></svg>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<svg
|
|
1
|
+
<svg viewBox="0 0 84 98" fill="none" xmlns="http://www.w3.org/2000/svg"><g><path fill-rule="evenodd" clip-rule="evenodd" d="M57.473 4H12a4 4 0 0 0-4 4v74a4 4 0 0 0 4 4h60a4 4 0 0 0 4-4V22.527L57.473 4Z" fill="#fff"/><path fill-rule="evenodd" clip-rule="evenodd" d="M57.473 4 76 22.527H61.473a4 4 0 0 1-4-4V4Z" fill="#76797F"/><path d="M49.405 54.608c-1.815-2.162-3.607-4.578-5.221-6.752a230.299 230.299 0 0 0-2.171-2.897l-.05-.065c.997-3.036 1.567-5.522 1.694-7.389.323-4.754-.173-7.817-1.517-9.361-.908-1.045-2.271-1.409-3.553-.947-.919.328-2.162 1.21-2.873 3.539-1.06 3.47-.546 9.618 2.466 14.702-1.344 3.763-3.218 8.085-5.287 12.201-3.94 1.477-7.082 3.418-9.336 5.774-2.946 3.073-4.143 6.124-3.286 8.368.527 1.39 1.748 2.219 3.264 2.219 1.055 0 2.196-.407 3.3-1.177 2.79-1.95 6.431-8.443 8.385-12.206 4.04-1.348 8.031-1.9 10.059-2.11.917-.094 1.828-.17 2.705-.222 3.55 4.006 6.452 6.119 9.127 6.646a8.228 8.228 0 0 0 1.602.162c2.18 0 3.98-.93 4.82-2.486.635-1.175.622-2.547-.035-3.764-1.484-2.747-5.962-4.258-12.61-4.258-.478 0-.972.007-1.483.024Zm-24.42 15.193c-.527.368-1.07.588-1.451.588a.57.57 0 0 1-.15-.016c-.067-.36.173-1.916 2.532-4.38 1.107-1.156 2.508-2.213 4.166-3.147-2.092 3.6-3.975 6.172-5.096 6.955Zm13.938-37.945c.246-.805.55-1.17.74-1.237.005 0 .01-.003.013-.004.183.22.963 1.482.614 6.632-.06.898-.265 2.033-.61 3.382-1.127-3.101-1.436-6.548-.757-8.772Zm6.03 23.06a54.063 54.063 0 0 0-7.584 1.337 117.753 117.753 0 0 0 3.195-7.46c.318.425.643.86.972 1.308 1.105 1.488 2.346 3.16 3.632 4.794l-.214.021Zm15.618 5.732c.05.092.05.13.036.154-.142.264-.783.68-1.9.68-.31 0-.643-.033-.985-.101-1.393-.276-3.018-1.305-4.954-3.14 5.255.268 7.378 1.622 7.803 2.407Z" fill="#76797F"/></g></svg>
|
package/dist/Dropdown.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { defineComponent as
|
|
1
|
+
import { defineComponent as P, ref as u, useCssModule as I, watch as C, onMounted as q, onBeforeUnmount as K, computed as R, withDirectives as _, openBlock as p, 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
2
|
import { KEY_CODES as d } from "./constants.js";
|
|
3
3
|
import H from "./clickoutside.js";
|
|
4
4
|
import J from "./utils/calculateElementOverflow.js";
|
|
@@ -15,7 +15,7 @@ import "./Icon.vue_used_vue_type_style_index_0_lang.module-eb359559.js";
|
|
|
15
15
|
const Z = ["aria-expanded"], ee = {
|
|
16
16
|
key: 0,
|
|
17
17
|
class: "tw-flex tw-items-center tw-font-medium tw-text-blue-500 hover:tw-text-blue-700"
|
|
18
|
-
}, te = /* @__PURE__ */
|
|
18
|
+
}, te = /* @__PURE__ */ P({
|
|
19
19
|
name: "ll-dropdown",
|
|
20
20
|
__name: "Dropdown",
|
|
21
21
|
props: {
|
|
@@ -28,13 +28,13 @@ const Z = ["aria-expanded"], ee = {
|
|
|
28
28
|
fluidContent: { type: Boolean, default: !1 }
|
|
29
29
|
},
|
|
30
30
|
emits: ["toggle", "dismiss"],
|
|
31
|
-
setup(D, { expose: $, emit:
|
|
32
|
-
const a = D, t = u(null), w = u(null), f = [], s = u(f), i = u(-1), l = u(!1), g = u({}), L =
|
|
31
|
+
setup(D, { expose: $, emit: v }) {
|
|
32
|
+
const a = D, t = u(null), w = u(null), f = [], s = u(f), i = u(-1), l = u(!1), g = u({}), L = I();
|
|
33
33
|
C(l, (e) => {
|
|
34
|
-
e || (i.value = -1),
|
|
34
|
+
e || (i.value = -1), v("toggle", e);
|
|
35
35
|
}), C(i, (e, o) => {
|
|
36
36
|
e in s.value && s.value[e].classList.add("tw-bg-ice-200"), o in s.value && s.value[o].classList.remove("tw-bg-ice-200");
|
|
37
|
-
}),
|
|
37
|
+
}), q(() => {
|
|
38
38
|
var e, o, n;
|
|
39
39
|
if (a.reattach) {
|
|
40
40
|
const c = Q();
|
|
@@ -50,9 +50,9 @@ const Z = ["aria-expanded"], ee = {
|
|
|
50
50
|
if (a.closeManually && ((n = t.value) != null && n.contains(e == null ? void 0 : e.target) || t.value === (e == null ? void 0 : e.target)))
|
|
51
51
|
return;
|
|
52
52
|
const o = l.value;
|
|
53
|
-
l.value = !1, o &&
|
|
53
|
+
l.value = !1, o && v("dismiss");
|
|
54
54
|
}
|
|
55
|
-
async function
|
|
55
|
+
async function m() {
|
|
56
56
|
var e;
|
|
57
57
|
l.value ? l.value = !1 : (l.value = !0, await O(), (e = t.value) == null || e.focus());
|
|
58
58
|
}
|
|
@@ -88,15 +88,15 @@ const Z = ["aria-expanded"], ee = {
|
|
|
88
88
|
}, await A());
|
|
89
89
|
const c = J(t == null ? void 0 : t.value);
|
|
90
90
|
if (c) {
|
|
91
|
-
const
|
|
92
|
-
(h = t.value) == null || h.style.setProperty("--offset", `${
|
|
91
|
+
const z = a.align === "left" ? "-" : "";
|
|
92
|
+
(h = t.value) == null || h.style.setProperty("--offset", `${z}${c.value}`);
|
|
93
93
|
}
|
|
94
94
|
}
|
|
95
95
|
return $({
|
|
96
96
|
isActive: R(() => l.value),
|
|
97
|
-
toggle:
|
|
97
|
+
toggle: m,
|
|
98
98
|
dismiss: r
|
|
99
|
-
}), (e, o) => _((
|
|
99
|
+
}), (e, o) => _((p(), k("div", {
|
|
100
100
|
ref_key: "dropdownRef",
|
|
101
101
|
ref: w,
|
|
102
102
|
class: "tw-relative tw-inline-block",
|
|
@@ -105,18 +105,18 @@ const Z = ["aria-expanded"], ee = {
|
|
|
105
105
|
}, [
|
|
106
106
|
x(e.$slots, "toggle", {
|
|
107
107
|
isActive: l.value,
|
|
108
|
-
toggle:
|
|
108
|
+
toggle: m
|
|
109
109
|
}, () => [
|
|
110
110
|
E("button", {
|
|
111
111
|
"data-test": "button|toggle",
|
|
112
112
|
"aria-expanded": l.value,
|
|
113
113
|
class: b([e.label ? "tw-min-w-auto tw-outline-none" : "tw-rounded tw-p-3"]),
|
|
114
|
-
onClick:
|
|
114
|
+
onClick: m
|
|
115
115
|
}, [
|
|
116
|
-
e.label ? (
|
|
116
|
+
e.label ? (p(), k("span", ee, [
|
|
117
117
|
U(V(e.label) + " ", 1),
|
|
118
118
|
S(B, { name: "caret-down" })
|
|
119
|
-
])) : (
|
|
119
|
+
])) : (p(), W(B, {
|
|
120
120
|
key: 1,
|
|
121
121
|
name: "ellipsis"
|
|
122
122
|
}))
|
|
@@ -156,7 +156,7 @@ const Z = ["aria-expanded"], ee = {
|
|
|
156
156
|
[M(H), r]
|
|
157
157
|
]);
|
|
158
158
|
}
|
|
159
|
-
}), le = "
|
|
159
|
+
}), le = "_content_zbxyu_2", oe = {
|
|
160
160
|
content: le
|
|
161
161
|
}, ae = {
|
|
162
162
|
$style: oe
|
package/dist/Dropdown.js.map
CHANGED
|
@@ -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('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\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":["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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBA0EQA,IAAaC,EAAwB,IAAI,GACzCC,IAAcD,EAA2B,IAAI,GAE7CE,IAAqB,CAAA,GAErBC,IAAQH,EAAyBE,CAAkB,GACnDE,IAAYJ,EAAI,EAAE,GAClBK,IAAWL,EAAI,EAAK,GAEpBM,IAASN,EAAoB,CAAA,CAAE,GAC/BO,IAAUC;AAEV,IAAAC,EAAAJ,GAAU,CAACK,MAAQ;AACvB,MAAKA,MACHN,EAAU,QAAQ,KAGpBO,EAAK,UAAUD,CAAG;AAAA,IAAA,CACnB,GAEKD,EAAAL,GAAW,CAACQ,GAAMC,MAAS;AACvB,MAAAD,KAAAT,EAAM,SAASA,EAAM,MAAMS,CAAI,EAAE,UAAU,IAAI,eAAe,GAC9DC,KAAAV,EAAM,SAASA,EAAM,MAAMU,CAAI,EAAE,UAAU,OAAO,eAAe;AAAA,IAAA,CAC1E,GAEDC,EAAU,MAAM;;AACd,UAAIC,EAAM,UAAU;AAClB,cAAMC,IAASC;AAEf,QAAAlB,EAAW,SAASiB,EAAO,YAAYjB,EAAW,KAAK;AAAA;AAIzD,OAAImB,IAAAnB,EAAW,UAAX,QAAAmB,EAAkB,cAAc,iBAClCf,EAAM,UAAQgB,IAAApB,EAAW,UAAX,gBAAAoB,EAAkB,iBAAiB,wBAAuBjB,IAExEC,EAAM,UAAQiB,IAAArB,EAAW,UAAX,gBAAAqB,EAAkB,iBAAiB,uBAAsBlB,GAIzE,OAAO,iBAAiB,UAAU,MAAMmB,EAAS,CAAA;AAAA,IAAA,CAClD,GAEDC,EAAgB,MAAM;;AACpB,aAAO,oBAAoB,UAAU,MAAMD,EAAS,CAAA,IACpDF,KAAAD,IAAAnB,KAAA,gBAAAA,EAAY,UAAZ,gBAAAmB,EAAmB,eAAnB,QAAAC,EAA+B,YAAYpB,EAAW;AAAA,IAAK,CAC5D;AAKD,aAASsB,EAAQE,GAAe;;AAE5B,UAAAR,EAAM,mBACLG,IAAAnB,EAAW,UAAX,QAAAmB,EAAkB,SAASK,KAAA,gBAAAA,EAAO,WAA0BxB,EAAW,WAAUwB,KAAA,gBAAAA,EAAO;AAEzF;AAGF,YAAMC,IAAUnB,EAAS;AAEzB,MAAAA,EAAS,QAAQ,IAEbmB,KACFb,EAAK,SAAS;AAAA,IAElB;AAKA,mBAAec,IAAS;;AACtB,MAAIpB,EAAS,QACXA,EAAS,QAAQ,MAEjBA,EAAS,QAAQ,IACjB,MAAMqB,EAAgB,IACtBR,IAAAnB,EAAW,UAAX,QAAAmB,EAAkB;AAAA,IAEtB;AAMA,aAASS,EAAU,GAAkB;AAC/B,UAAA,EAAE,YAAYC,EAAU;AAClB,QAAAP;eACC,EAAE,YAAYO,EAAU,QAAQxB,EAAU,QAAQD,EAAM,MAAM,SAAS;AAChF,QAAAE,EAAS,SAASD,EAAU;AAAA,eACnB,EAAE,YAAYwB,EAAU,MAAMxB,EAAU,QAAQ;AACzD,QAAAC,EAAS,SAASD,EAAU;AAAA,eACnB,EAAE,YAAYwB,EAAU,SAASxB,EAAU,UAAU;AAC9D,QAAAC,EAAS,SAASF,EAAMC,EAAU,KAAK,EAAE;;AAEzC;AAGF,QAAE,eAAe;AAAA,IACnB;AAKA,aAASyB,IAAc;;AACrB,OAAAX,IAAAnB,EAAW,UAAX,QAAAmB,EAAkB,MAAM,YAAY,YAAY;AAAA,IAClD;AAQA,mBAAeQ,IAAkB;;AAC/B,YAAMI,EAAS;AAEf,YAAMC,MAAYb,IAAAjB,EAAY,UAAZ,gBAAAiB,EAAmB,4BAA4B,CAAA,GAC3Dc,IAAMD,EAAU,MAAMA,EAAU,QAChCE,IAAS;AAAA,QACb,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAGlB,EAAM;AAAA,MAAA;AAGX,MAAIA,EAAM,aACRT,EAAO,QAAQ;AAAA,QACb,MAAMS,EAAM,UAAU,SAAS,GAAG,KAAK,MAAMgB,EAAU,IAAI,IAAIE,EAAO,QAAQ;AAAA,QAC9E,OACElB,EAAM,UAAU,UACZ,GAAG,SAAS,gBAAgB,cAAc,KAAK,MAAMgB,EAAU,KAAK,IAAIE,EAAO,QAC/E;AAAA,QACN,KAAK,GAAG,OAAO,UAAUD,IAAMC,EAAO;AAAA,MAAA,GAExC,MAAMH,EAAS;AAGX,YAAAI,IAAWC,EAAyBpC,KAAA,gBAAAA,EAAY,KAAK;AAE3D,UAAImC,GAAU;AACZ,cAAME,IAAYrB,EAAM,UAAU,SAAS,MAAM;AACjD,SAAAI,IAAApB,EAAW,UAAX,QAAAoB,EAAkB,MAAM,YAAY,YAAY,GAAGiB,IAAYF,EAAS;AAAA;AAAA,IAE5E;AAEa,WAAAG,EAAA;AAAA,MACX,UAAUC,EAAS,MAAMjC,EAAS,KAAK;AAAA,MACvC,QAAAoB;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 =\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 ? '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":["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/Select.js
CHANGED
|
@@ -1012,7 +1012,7 @@ function Fn(e, n, t) {
|
|
|
1012
1012
|
update: E
|
|
1013
1013
|
};
|
|
1014
1014
|
}
|
|
1015
|
-
const Mn = (e) => (It("data-v-
|
|
1015
|
+
const Mn = (e) => (It("data-v-9d4a4fe5"), e = e(), Vt(), e), Pn = ["id", "aria-errormessage", "aria-invalid", "disabled", "multiple", "name"], In = ["selected", "value"], Vn = /* @__PURE__ */ Mn(() => /* @__PURE__ */ j("option", { value: "" }, null, -1)), Nn = ["aria-controls", "aria-expanded", "aria-label", "aria-disabled", "onKeyup"], $n = ["id"], zn = ["onKeypress", "onMousedown"], Hn = {
|
|
1016
1016
|
key: 0,
|
|
1017
1017
|
class: "stash-select__total"
|
|
1018
1018
|
}, Wn = {
|
|
@@ -1373,7 +1373,7 @@ const Mn = (e) => (It("data-v-d85a8746"), e = e(), Vt(), e), Pn = ["id", "aria-e
|
|
|
1373
1373
|
ge(j("div", {
|
|
1374
1374
|
ref_key: "optionsWrapperRef",
|
|
1375
1375
|
ref: u,
|
|
1376
|
-
class: "stash-select__border-selector tw-w-full tw-shadow",
|
|
1376
|
+
class: "stash-select__border-selector tw-w-full tw-shadow-2xl",
|
|
1377
1377
|
style: Mt(q(C)),
|
|
1378
1378
|
onClick: v[3] || (v[3] = be(() => {
|
|
1379
1379
|
}, ["stop"]))
|
|
@@ -1457,7 +1457,7 @@ const Mn = (e) => (It("data-v-d85a8746"), e = e(), Vt(), e), Pn = ["id", "aria-e
|
|
|
1457
1457
|
]), 1032, ["id", "add-bottom-space", "class", "error-text", "hint-text", "label", "show-optional-in-label"]));
|
|
1458
1458
|
}
|
|
1459
1459
|
});
|
|
1460
|
-
const Eo = /* @__PURE__ */ Yt(Yn, [["__scopeId", "data-v-
|
|
1460
|
+
const Eo = /* @__PURE__ */ Yt(Yn, [["__scopeId", "data-v-9d4a4fe5"]]);
|
|
1461
1461
|
export {
|
|
1462
1462
|
Eo as default
|
|
1463
1463
|
};
|