@leaflink/stash 50.12.0 → 50.12.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Accordion.js +14 -14
- package/dist/ActionsDropdown.js +2 -2
- package/dist/AddressSelect.js +2 -2
- package/dist/Alert.js +6 -6
- package/dist/AppNavigationItem.js +8 -8
- package/dist/AppSidebar.js +8 -8
- package/dist/AppTopbar.js +3 -3
- package/dist/Avatar.js +3 -3
- package/dist/Backdrop.js +2 -2
- package/dist/Badge.js +2 -2
- package/dist/Box.js +1 -1
- package/dist/{Box.vue_vue_type_script_setup_true_lang-DgJHq-09.js → Box.vue_vue_type_script_setup_true_lang-rFnvwLVY.js} +3 -3
- package/dist/{Box.vue_vue_type_script_setup_true_lang-DgJHq-09.js.map → Box.vue_vue_type_script_setup_true_lang-rFnvwLVY.js.map} +1 -1
- package/dist/Button.js +3 -3
- package/dist/ButtonGroup.js +4 -4
- package/dist/Card.js +7 -7
- package/dist/CardContent.js +2 -2
- package/dist/CardFooter.js +2 -2
- package/dist/CardHeader.js +4 -4
- package/dist/CardMedia.js +6 -6
- package/dist/Carousel.js +33 -33
- package/dist/Carousel.js.map +1 -1
- package/dist/Checkbox.js +7 -7
- package/dist/ChevronToggle.js +1 -1
- package/dist/{ChevronToggle.vue_vue_type_script_setup_true_lang-DuvluoTi.js → ChevronToggle.vue_vue_type_script_setup_true_lang-Ce_qOXfR.js} +3 -3
- package/dist/{ChevronToggle.vue_vue_type_script_setup_true_lang-DuvluoTi.js.map → ChevronToggle.vue_vue_type_script_setup_true_lang-Ce_qOXfR.js.map} +1 -1
- package/dist/Chip.js +7 -7
- package/dist/ConfirmationCodeInput.js +6 -6
- package/dist/ContextSwitcher.js +1 -1
- package/dist/Copy.js +1 -1
- package/dist/CurrencyInput.js +115 -111
- package/dist/CurrencyInput.js.map +1 -1
- package/dist/DataView.js +3 -3
- package/dist/DataView.keys-aSOnA4AD.js.map +1 -1
- package/dist/DataViewFilters.js +3 -3
- package/dist/DataViewSortButton.js +10 -10
- package/dist/DataViewToolbar.js +1 -1
- package/dist/DatePicker.js +1080 -1037
- package/dist/DatePicker.js.map +1 -1
- package/dist/DescriptionList.js +2 -2
- package/dist/DescriptionListDetail.js +2 -2
- package/dist/DescriptionListGroup.js +2 -2
- package/dist/DescriptionListTerm.js +3 -3
- package/dist/Dialog.js +1 -1
- package/dist/Divider.js +2 -2
- package/dist/Dropdown.js +9 -9
- package/dist/EmptyState.js +2 -2
- package/dist/Expand.js +1 -1
- package/dist/{Expand.vue_vue_type_script_setup_true_lang-D0fSAtHr.js → Expand.vue_vue_type_script_setup_true_lang-CiONJfAp.js} +5 -5
- package/dist/{Expand.vue_vue_type_script_setup_true_lang-D0fSAtHr.js.map → Expand.vue_vue_type_script_setup_true_lang-CiONJfAp.js.map} +1 -1
- package/dist/Field.js +1 -1
- package/dist/{Field.vue_vue_type_script_setup_true_lang-DEizIcDo.js → Field.vue_vue_type_script_setup_true_lang-DRaKs9Lm.js} +6 -6
- package/dist/{Field.vue_vue_type_script_setup_true_lang-DEizIcDo.js.map → Field.vue_vue_type_script_setup_true_lang-DRaKs9Lm.js.map} +1 -1
- package/dist/FileUpload.js +7 -7
- package/dist/FilterChip.js +1 -1
- package/dist/FilterDrawerItem.js +9 -9
- package/dist/FilterDropdown.js +1 -1
- package/dist/FilterSelect.js +4 -4
- package/dist/Filters.js +18 -18
- package/dist/HttpError.js +9 -9
- package/dist/Icon.js +2 -2
- package/dist/IconLabel.js +2 -2
- package/dist/Illustration.js +2 -2
- package/dist/{Illustration.vue_vue_type_script_setup_true_lang-CYddAFtS.js → Illustration.vue_vue_type_script_setup_true_lang-BBqgoJO8.js} +3 -3
- package/dist/{Illustration.vue_vue_type_script_setup_true_lang-CYddAFtS.js.map → Illustration.vue_vue_type_script_setup_true_lang-BBqgoJO8.js.map} +1 -1
- package/dist/Image.js +2 -2
- package/dist/{Image.vue_vue_type_script_setup_true_lang-YUNunj71.js → Image.vue_vue_type_script_setup_true_lang-D5u4av0_.js} +3 -3
- package/dist/{Image.vue_vue_type_script_setup_true_lang-YUNunj71.js.map → Image.vue_vue_type_script_setup_true_lang-D5u4av0_.js.map} +1 -1
- package/dist/InlineEdit.js +5 -5
- package/dist/Input.js +2 -2
- package/dist/InputOptions.js +2 -2
- package/dist/IntegrationIcon.js +2 -2
- package/dist/Label.js +1 -1
- package/dist/{Label.vue_vue_type_script_setup_true_lang-C4JKdqvC.js → Label.vue_vue_type_script_setup_true_lang-DPnNUfc6.js} +3 -3
- package/dist/{Label.vue_vue_type_script_setup_true_lang-C4JKdqvC.js.map → Label.vue_vue_type_script_setup_true_lang-DPnNUfc6.js.map} +1 -1
- package/dist/LicenseChip.js +2 -2
- package/dist/ListItem.js +1 -1
- package/dist/ListItemCell.js +2 -2
- package/dist/ListView.js +11 -11
- package/dist/Loading.js +2 -2
- package/dist/Logo.js +1 -1
- package/dist/{Logo.vue_vue_type_script_setup_true_lang-BfUU9J9O.js → Logo.vue_vue_type_script_setup_true_lang-Dz8c98sc.js} +4 -4
- package/dist/{Logo.vue_vue_type_script_setup_true_lang-BfUU9J9O.js.map → Logo.vue_vue_type_script_setup_true_lang-Dz8c98sc.js.map} +1 -1
- package/dist/Menu.js +2 -2
- package/dist/MenuItem.js +2 -2
- package/dist/Metric.js +5 -5
- package/dist/Modal.js +20 -20
- package/dist/Modals.js +6 -6
- package/dist/Module.js +3 -3
- package/dist/ModuleContent.js +3 -3
- package/dist/ModuleFooter.js +2 -2
- package/dist/ModuleHeader.js +2 -2
- package/dist/ModuleHeader.js.map +1 -1
- package/dist/ObfuscateText.js +7 -7
- package/dist/PageContent.js +3 -3
- package/dist/PageHeader.js +6 -6
- package/dist/PageNavigation.js +1 -1
- package/dist/Paginate.js +6 -6
- package/dist/PlaidLink.js +2 -2
- package/dist/QuickAction.js +2 -2
- package/dist/Radio.js +2 -2
- package/dist/RadioGroup.js +2 -2
- package/dist/RadioNew.js +1 -1
- package/dist/RangeInput.js +2 -2
- package/dist/SearchBar.js +3 -3
- package/dist/Select.js +2 -2
- package/dist/SelectStatus.js +7 -7
- package/dist/Skeleton.js +4 -4
- package/dist/Step.js +6 -6
- package/dist/Stepper.js +9 -9
- package/dist/Switch.js +7 -7
- package/dist/Tab.js +4 -4
- package/dist/TabPanel.js +2 -2
- package/dist/Table.js +1 -1
- package/dist/TableCell.js +5 -5
- package/dist/TableHeaderCell.js +2 -2
- package/dist/TableHeaderRow.js +4 -4
- package/dist/TableRow.js +4 -4
- package/dist/TableRow.js.map +1 -1
- package/dist/TableRow.vue.d.ts +12 -8
- package/dist/Tabs.js +2 -2
- package/dist/{Tabs.vue_vue_type_script_setup_true_lang-NZm1OrRT.js → Tabs.vue_vue_type_script_setup_true_lang-CmnBP4i1.js} +4 -4
- package/dist/{Tabs.vue_vue_type_script_setup_true_lang-NZm1OrRT.js.map → Tabs.vue_vue_type_script_setup_true_lang-CmnBP4i1.js.map} +1 -1
- package/dist/TextEditor.js +3313 -3291
- package/dist/TextEditor.js.map +1 -1
- package/dist/Textarea.js +3 -3
- package/dist/Thumbnail.js +7 -7
- package/dist/Thumbnail.js.map +1 -1
- package/dist/ThumbnailEmpty.js +3 -3
- package/dist/ThumbnailGroup.js +6 -6
- package/dist/ThumbnailGroup.js.map +1 -1
- package/dist/{ThumbnailGroup.keys-D6WL5xQ5.js → ThumbnailGroup.keys-EJ4qFNhx.js} +2 -2
- package/dist/{ThumbnailGroup.keys-D6WL5xQ5.js.map → ThumbnailGroup.keys-EJ4qFNhx.js.map} +1 -1
- package/dist/Timeline.js +2 -2
- package/dist/TimelineItem.js +3 -3
- package/dist/Toast.js +277 -280
- package/dist/Toast.js.map +1 -1
- package/dist/Toasts.js +1 -1
- package/dist/Tooltip.js +1 -1
- package/dist/components.css +1 -1
- package/dist/{formatDateTime-C8CYECpd.js → formatDateTime-Dz8bXV0R.js} +98 -12
- package/dist/{formatDateTime-C8CYECpd.js.map → formatDateTime-Dz8bXV0R.js.map} +1 -1
- package/dist/index.js +2 -2
- package/dist/searchFuzzy-DRasJ33G.js +409 -0
- package/dist/{searchFuzzy-DKooyZM8.js.map → searchFuzzy-DRasJ33G.js.map} +1 -1
- package/dist/storage.js +3 -3
- package/dist/{toTimeZone-CVE1ZmsS.js → toTimeZone-Coq1oPTt.js} +7 -9
- package/dist/{toTimeZone-CVE1ZmsS.js.map → toTimeZone-Coq1oPTt.js.map} +1 -1
- package/dist/useSearch.js +1 -1
- package/dist/utils/formatDateTime.js +2 -2
- package/dist/utils/searchFuzzy.js +1 -1
- package/dist/utils/toTimeZone.js +1 -1
- package/package.json +16 -16
- package/dist/searchFuzzy-DKooyZM8.js +0 -407
package/dist/TableRow.vue.d.ts
CHANGED
|
@@ -62,12 +62,18 @@ isSelected: boolean;
|
|
|
62
62
|
accentColor: "ice-700" | "purple-700" | "purple-500" | "purple-100" | "royal-700" | "royal-500" | "royal-100" | "blue-700" | "blue-500" | "blue-100" | "teal-700" | "teal-500" | "teal-100" | "green-700" | "green-500" | "green-100" | "seafoam-700" | "seafoam-500" | "seafoam-100" | "yellow-700" | "yellow-500" | "yellow-100" | "orange-700" | "orange-500" | "orange-100" | "red-700" | "red-500" | "red-100" | "ice-500" | "ice-200" | "ice-100" | "white" | "black";
|
|
63
63
|
hideExpansionDivider: boolean;
|
|
64
64
|
isSelectDisabled: boolean;
|
|
65
|
-
}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>, {
|
|
66
|
-
default
|
|
67
|
-
isRowExpanded
|
|
68
|
-
toggleExpand:
|
|
69
|
-
}):
|
|
70
|
-
expansion
|
|
65
|
+
}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>, Readonly<{
|
|
66
|
+
default(props: {
|
|
67
|
+
isRowExpanded?: boolean | undefined;
|
|
68
|
+
toggleExpand: (value?: boolean | undefined) => void;
|
|
69
|
+
}): unknown[];
|
|
70
|
+
expansion(): unknown[];
|
|
71
|
+
}> & {
|
|
72
|
+
default(props: {
|
|
73
|
+
isRowExpanded?: boolean | undefined;
|
|
74
|
+
toggleExpand: (value?: boolean | undefined) => void;
|
|
75
|
+
}): unknown[];
|
|
76
|
+
expansion(): unknown[];
|
|
71
77
|
}>;
|
|
72
78
|
export default _default;
|
|
73
79
|
|
|
@@ -123,6 +129,4 @@ export declare interface TableRowProps {
|
|
|
123
129
|
accentColor?: StashCommonColor;
|
|
124
130
|
}
|
|
125
131
|
|
|
126
|
-
declare function toggleExpand(value?: boolean): void;
|
|
127
|
-
|
|
128
132
|
export { }
|
package/dist/Tabs.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { _ as s } from "./Tabs.vue_vue_type_script_setup_true_lang-
|
|
2
|
-
import { T as c, a as f } from "./Tabs.vue_vue_type_script_setup_true_lang-
|
|
1
|
+
import { _ as s } from "./Tabs.vue_vue_type_script_setup_true_lang-CmnBP4i1.js";
|
|
2
|
+
import { T as c, a as f } from "./Tabs.vue_vue_type_script_setup_true_lang-CmnBP4i1.js";
|
|
3
3
|
import { _ as a } from "./_plugin-vue_export-helper-CHgC5LLL.js";
|
|
4
4
|
const t = {
|
|
5
5
|
"menu-tab": "_menu-tab_frbn6_2"
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { defineComponent as U, useCssModule as V, ref as s, computed as f, provide as q, onMounted as J, onUpdated as R, onDeactivated as F, onBeforeUnmount as H,
|
|
1
|
+
import { defineComponent as U, useCssModule as V, ref as s, computed as f, provide as q, onMounted as J, onUpdated as R, onDeactivated as F, onBeforeUnmount as H, createElementBlock as K, openBlock as k, createElementVNode as m, normalizeClass as I, normalizeStyle as W, renderSlot as A, createBlock as Y, createCommentVNode as Z, withCtx as N, unref as h, createTextVNode as G, createVNode as P, toDisplayString as Q } from "vue";
|
|
2
2
|
import X from "lodash-es/debounce";
|
|
3
3
|
import ee from "lodash-es/uniqueId";
|
|
4
4
|
import { DEBOUNCE as te } from "./constants.js";
|
|
@@ -130,7 +130,7 @@ const ie = {
|
|
|
130
130
|
type: "button",
|
|
131
131
|
onClick: (p) => j(C)
|
|
132
132
|
}, [
|
|
133
|
-
|
|
133
|
+
G(Q(h(oe)("ll.more")) + " ", 1),
|
|
134
134
|
P(ae, { name: "caret-down" })
|
|
135
135
|
], 10, ne)
|
|
136
136
|
]),
|
|
@@ -146,7 +146,7 @@ const ie = {
|
|
|
146
146
|
], 8, le)
|
|
147
147
|
]),
|
|
148
148
|
_: 3
|
|
149
|
-
}, 512)) :
|
|
149
|
+
}, 512)) : Z("", !0)
|
|
150
150
|
], 6)
|
|
151
151
|
]));
|
|
152
152
|
}
|
|
@@ -156,4 +156,4 @@ export {
|
|
|
156
156
|
fe as _,
|
|
157
157
|
M as a
|
|
158
158
|
};
|
|
159
|
-
//# sourceMappingURL=Tabs.vue_vue_type_script_setup_true_lang-
|
|
159
|
+
//# sourceMappingURL=Tabs.vue_vue_type_script_setup_true_lang-CmnBP4i1.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tabs.vue_vue_type_script_setup_true_lang-NZm1OrRT.js","sources":["../src/components/Tabs/keys.ts","../src/components/Tabs/models.ts","../src/components/Tabs/Tabs.vue"],"sourcesContent":["import { Injection } from '../../../types/utils';\nimport { TabsInjection } from './models';\n\nexport const TABS_INJECTION: Injection<TabsInjection> = Object.freeze({\n key: Symbol('TABS_INJECTION_KEY'),\n});\n","import { ComputedRef } from 'vue';\n\nexport enum TabVariant {\n Line = 'line',\n Enclosed = 'enclosed',\n}\n\nexport type TabVariants = `${TabVariant}`;\n\nexport interface TabsInjection {\n activeTab: ComputedRef<string>;\n variant: ComputedRef<TabVariants>;\n setActiveTab: (newTabValue: string) => void;\n}\n","<script lang=\"ts\">\n import { TabVariant, TabVariants } from './models';\n\n export * from './keys';\n export * from './models';\n\n export interface TabsProps {\n /**\n * The currently active tab value\n */\n activeTab: string;\n\n /**\n * Tabs variant\n */\n variant?: TabVariants;\n }\n</script>\n\n<script setup lang=\"ts\">\n import debounce from 'lodash-es/debounce';\n import uniqueId from 'lodash-es/uniqueId';\n import { computed, onBeforeUnmount, onDeactivated, onMounted, onUpdated, provide, Ref, ref, useCssModule } from 'vue';\n\n import { DEBOUNCE } from '../../constants';\n import { t } from '../../locale';\n import Dropdown from '../Dropdown/Dropdown.vue';\n import Icon from '../Icon/Icon.vue';\n import { TABS_INJECTION } from './keys';\n\n const emit = defineEmits<{\n (e: 'update:activeTab', newTabValue: TabsProps['activeTab']): void;\n }>();\n\n const props = withDefaults(defineProps<TabsProps>(), {\n variant: TabVariant.Line,\n });\n const classes = useCssModule();\n\n const tabListEl = ref();\n const moreDropdownMenuEl = ref();\n const observer: Ref<IntersectionObserver | undefined> = ref(undefined);\n const hasIntersectionObserver = 'IntersectionObserver' in window;\n const overflowIds = ref<Set<string>>(new Set());\n const moreDropdownWidth = ref(0);\n const moreDropdownEl = ref<InstanceType<typeof Dropdown>>();\n const moreMenuId = uniqueId('more-dropdown-menu-');\n const isMoreMenuOpen = ref(false);\n\n const currentActiveTab = computed({\n get() {\n return props.activeTab;\n },\n set(nv: TabsProps['activeTab']) {\n emit('update:activeTab', nv);\n },\n });\n\n function setActiveTab(newTabValue: TabsProps['activeTab']) {\n currentActiveTab.value = newTabValue;\n }\n\n provide(TABS_INJECTION.key, {\n activeTab: computed(() => currentActiveTab.value),\n variant: computed(() => props.variant),\n setActiveTab,\n });\n\n function initObserve() {\n if (!hasIntersectionObserver) {\n return;\n }\n\n if (!tabListEl.value) {\n return;\n }\n\n const tabs = Array.from(tabListEl.value?.children as HTMLLIElement[]);\n const options = {\n root: tabListEl.value,\n rootMargin: '0px',\n threshold: Array.from({ length: 100 }).map((v, i) => (i + 1) / 100),\n };\n\n observer.value = new IntersectionObserver((entries) => {\n entries.forEach((entry) => {\n const dataId = entry.target.getAttribute('id') as string;\n /**\n * Check for partial intersection.\n * Zooming out can result in ratio of approx 0.984\n * Anything higher will result in nav items disappearing\n */\n if (entry.intersectionRatio > 0.94) {\n // show tab, hide in dropdown\n if (overflowIds.value.has(dataId)) {\n overflowIds.value.delete(dataId);\n }\n } else {\n // hide tab, show in dropdown\n if (dataId && !overflowIds.value.has(dataId)) {\n overflowIds.value.add(dataId);\n }\n }\n });\n }, options);\n\n tabs.forEach((element) => {\n observer.value?.observe(element);\n if (overflowIds.value.has(element.getAttribute('id') as string)) {\n element.classList.add('tw-invisible');\n } else {\n element.classList.remove('tw-invisible');\n }\n });\n\n moreDropdownWidth.value = moreDropdownEl.value?.$el?.getBoundingClientRect().width || 0;\n\n if (!moreDropdownMenuEl.value) {\n return;\n }\n\n const dropdownList = Array.from(moreDropdownMenuEl.value.children as HTMLLIElement[]);\n dropdownList.forEach((element) => {\n const firstElementChild = element.firstElementChild as Element;\n firstElementChild.className = '';\n element.className = '';\n\n element.classList.add(\n classes['menu-tab'],\n 'tw-flex',\n 'tw-items-center',\n 'tw-justify-between',\n 'tw-rounded',\n 'tw-text-sm',\n 'tw-p-1.5',\n 'tw-text-left',\n 'tw-cursor-pointer',\n 'tw-text-ice-700',\n 'hover:!tw-bg-ice-200',\n 'aria-disabled:tw-text-ice-500',\n 'aria-disabled:tw-pointer-events-none',\n 'aria-disabled:hover:tw-text-ice-500',\n 'aria-disabled:hover:tw-bg-inherit',\n 'aria-disabled:hover:tw-cursor-default',\n 'aria-selected:tw-bg-blue-100',\n );\n\n element.querySelector('.stash-tabs__dropdown-selected-tab-icon')?.remove();\n\n if (element.getAttribute('id') === `tab-${currentActiveTab.value}`) {\n const span = document.createElement('span');\n span.className = 'stash-tabs__dropdown-selected-tab-icon';\n span.innerHTML = `<svg xmlns=\"http://www.w3.org/2000/svg\" class=\"tw-text-blue-500 tw-w-6 tw-h-6\" viewBox=\"0 0 24 24\" fill=\"none\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M20.707 6.854 9 18.561l-5.707-5.707 1.414-1.414L9 15.733 19.293 5.44l1.414 1.414Z\" clip-rule=\"evenodd\"/></svg>`;\n element.appendChild(span);\n }\n\n if (!overflowIds.value.has(element.getAttribute('id') as string)) {\n element.classList.add('tw-hidden');\n } else {\n element.classList.remove('tw-hidden');\n }\n\n element.removeEventListener('click', () => {});\n });\n }\n\n const debouncedInitObserve = debounce(initObserve, DEBOUNCE.FAST, { leading: true });\n\n function destroyObserver() {\n if (observer.value) {\n observer.value.disconnect();\n observer.value = undefined;\n }\n }\n\n onMounted(() => {\n initObserve();\n });\n\n onUpdated(() => {\n destroyObserver();\n debouncedInitObserve();\n });\n\n onDeactivated(() => {\n destroyObserver();\n });\n\n onBeforeUnmount(() => {\n destroyObserver();\n });\n\n function onMoreClick(toggleMoreDropdown) {\n toggleMoreDropdown();\n isMoreMenuOpen.value = !isMoreMenuOpen.value;\n }\n</script>\n\n<template>\n <div class=\"stash-tabs tw-relative\" role=\"tabList\" data-test=\"stash-tabs\">\n <ul\n ref=\"tabListEl\"\n :style=\"{\n width: `calc(100% - ${moreDropdownWidth}px)`,\n }\"\n class=\"stash-tabs-list tw-flex tw-items-end\"\n :class=\"{\n 'stash-tabs-list--line': variant === 'line',\n 'stash-tabs-list--enclosed': variant === 'enclosed',\n 'tw-gap-6': variant === 'line',\n }\"\n >\n <slot></slot>\n\n <Dropdown v-if=\"overflowIds.size\" ref=\"moreDropdownEl\" class=\"!tw-absolute tw-right-0 tw-top-0\">\n <template #toggle=\"{ toggle }\">\n <button\n aria-haspopup=\"menu\"\n :aria-controls=\"moreMenuId\"\n :aria-expanded=\"isMoreMenuOpen\"\n class=\"tw-flex tw-cursor-pointer tw-items-center tw-justify-center tw-border-solid tw-px-6 tw-py-1.5 tw-text-sm tw-font-medium tw-text-blue-500 hover:tw-text-blue-700\"\n :class=\"{ 'tw-border-t-4 tw-border-transparent': props.variant === 'enclosed' }\"\n type=\"button\"\n @click=\"onMoreClick(toggle)\"\n >\n {{ t('ll.more') }}\n <Icon name=\"caret-down\" />\n </button>\n </template>\n <template #default>\n <ul :id=\"moreMenuId\" ref=\"moreDropdownMenuEl\" class=\"tw-space-y-1.5 tw-px-1.5 tw-pb-1.5\" role=\"menu\">\n <slot></slot>\n </ul>\n </template>\n </Dropdown>\n </ul>\n </div>\n</template>\n\n<style module>\n .menu-tab > a {\n /* prevents the global link styles to overwrite the overflowed tab styles */\n &,\n &:hover,\n &:focus {\n color: inherit;\n }\n }\n</style>\n"],"names":["TABS_INJECTION","TabVariant","emit","__emit","props","__props","classes","useCssModule","tabListEl","ref","moreDropdownMenuEl","observer","hasIntersectionObserver","overflowIds","moreDropdownWidth","moreDropdownEl","moreMenuId","uniqueId","isMoreMenuOpen","currentActiveTab","computed","nv","setActiveTab","newTabValue","provide","initObserve","tabs","_a","options","v","i","entries","entry","dataId","element","_c","_b","firstElementChild","span","debouncedInitObserve","debounce","DEBOUNCE","destroyObserver","onMounted","onUpdated","onDeactivated","onBeforeUnmount","onMoreClick","toggleMoreDropdown"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Tabs.vue_vue_type_script_setup_true_lang-CmnBP4i1.js","sources":["../src/components/Tabs/keys.ts","../src/components/Tabs/models.ts","../src/components/Tabs/Tabs.vue"],"sourcesContent":["import { Injection } from '../../../types/utils';\nimport { TabsInjection } from './models';\n\nexport const TABS_INJECTION: Injection<TabsInjection> = Object.freeze({\n key: Symbol('TABS_INJECTION_KEY'),\n});\n","import { ComputedRef } from 'vue';\n\nexport enum TabVariant {\n Line = 'line',\n Enclosed = 'enclosed',\n}\n\nexport type TabVariants = `${TabVariant}`;\n\nexport interface TabsInjection {\n activeTab: ComputedRef<string>;\n variant: ComputedRef<TabVariants>;\n setActiveTab: (newTabValue: string) => void;\n}\n","<script lang=\"ts\">\n import { TabVariant, TabVariants } from './models';\n\n export * from './keys';\n export * from './models';\n\n export interface TabsProps {\n /**\n * The currently active tab value\n */\n activeTab: string;\n\n /**\n * Tabs variant\n */\n variant?: TabVariants;\n }\n</script>\n\n<script setup lang=\"ts\">\n import debounce from 'lodash-es/debounce';\n import uniqueId from 'lodash-es/uniqueId';\n import { computed, onBeforeUnmount, onDeactivated, onMounted, onUpdated, provide, Ref, ref, useCssModule } from 'vue';\n\n import { DEBOUNCE } from '../../constants';\n import { t } from '../../locale';\n import Dropdown from '../Dropdown/Dropdown.vue';\n import Icon from '../Icon/Icon.vue';\n import { TABS_INJECTION } from './keys';\n\n const emit = defineEmits<{\n (e: 'update:activeTab', newTabValue: TabsProps['activeTab']): void;\n }>();\n\n const props = withDefaults(defineProps<TabsProps>(), {\n variant: TabVariant.Line,\n });\n const classes = useCssModule();\n\n const tabListEl = ref();\n const moreDropdownMenuEl = ref();\n const observer: Ref<IntersectionObserver | undefined> = ref(undefined);\n const hasIntersectionObserver = 'IntersectionObserver' in window;\n const overflowIds = ref<Set<string>>(new Set());\n const moreDropdownWidth = ref(0);\n const moreDropdownEl = ref<InstanceType<typeof Dropdown>>();\n const moreMenuId = uniqueId('more-dropdown-menu-');\n const isMoreMenuOpen = ref(false);\n\n const currentActiveTab = computed({\n get() {\n return props.activeTab;\n },\n set(nv: TabsProps['activeTab']) {\n emit('update:activeTab', nv);\n },\n });\n\n function setActiveTab(newTabValue: TabsProps['activeTab']) {\n currentActiveTab.value = newTabValue;\n }\n\n provide(TABS_INJECTION.key, {\n activeTab: computed(() => currentActiveTab.value),\n variant: computed(() => props.variant),\n setActiveTab,\n });\n\n function initObserve() {\n if (!hasIntersectionObserver) {\n return;\n }\n\n if (!tabListEl.value) {\n return;\n }\n\n const tabs = Array.from(tabListEl.value?.children as HTMLLIElement[]);\n const options = {\n root: tabListEl.value,\n rootMargin: '0px',\n threshold: Array.from({ length: 100 }).map((v, i) => (i + 1) / 100),\n };\n\n observer.value = new IntersectionObserver((entries) => {\n entries.forEach((entry) => {\n const dataId = entry.target.getAttribute('id') as string;\n /**\n * Check for partial intersection.\n * Zooming out can result in ratio of approx 0.984\n * Anything higher will result in nav items disappearing\n */\n if (entry.intersectionRatio > 0.94) {\n // show tab, hide in dropdown\n if (overflowIds.value.has(dataId)) {\n overflowIds.value.delete(dataId);\n }\n } else {\n // hide tab, show in dropdown\n if (dataId && !overflowIds.value.has(dataId)) {\n overflowIds.value.add(dataId);\n }\n }\n });\n }, options);\n\n tabs.forEach((element) => {\n observer.value?.observe(element);\n if (overflowIds.value.has(element.getAttribute('id') as string)) {\n element.classList.add('tw-invisible');\n } else {\n element.classList.remove('tw-invisible');\n }\n });\n\n moreDropdownWidth.value = moreDropdownEl.value?.$el?.getBoundingClientRect().width || 0;\n\n if (!moreDropdownMenuEl.value) {\n return;\n }\n\n const dropdownList = Array.from(moreDropdownMenuEl.value.children as HTMLLIElement[]);\n dropdownList.forEach((element) => {\n const firstElementChild = element.firstElementChild as Element;\n firstElementChild.className = '';\n element.className = '';\n\n element.classList.add(\n classes['menu-tab'],\n 'tw-flex',\n 'tw-items-center',\n 'tw-justify-between',\n 'tw-rounded',\n 'tw-text-sm',\n 'tw-p-1.5',\n 'tw-text-left',\n 'tw-cursor-pointer',\n 'tw-text-ice-700',\n 'hover:!tw-bg-ice-200',\n 'aria-disabled:tw-text-ice-500',\n 'aria-disabled:tw-pointer-events-none',\n 'aria-disabled:hover:tw-text-ice-500',\n 'aria-disabled:hover:tw-bg-inherit',\n 'aria-disabled:hover:tw-cursor-default',\n 'aria-selected:tw-bg-blue-100',\n );\n\n element.querySelector('.stash-tabs__dropdown-selected-tab-icon')?.remove();\n\n if (element.getAttribute('id') === `tab-${currentActiveTab.value}`) {\n const span = document.createElement('span');\n span.className = 'stash-tabs__dropdown-selected-tab-icon';\n span.innerHTML = `<svg xmlns=\"http://www.w3.org/2000/svg\" class=\"tw-text-blue-500 tw-w-6 tw-h-6\" viewBox=\"0 0 24 24\" fill=\"none\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M20.707 6.854 9 18.561l-5.707-5.707 1.414-1.414L9 15.733 19.293 5.44l1.414 1.414Z\" clip-rule=\"evenodd\"/></svg>`;\n element.appendChild(span);\n }\n\n if (!overflowIds.value.has(element.getAttribute('id') as string)) {\n element.classList.add('tw-hidden');\n } else {\n element.classList.remove('tw-hidden');\n }\n\n element.removeEventListener('click', () => {});\n });\n }\n\n const debouncedInitObserve = debounce(initObserve, DEBOUNCE.FAST, { leading: true });\n\n function destroyObserver() {\n if (observer.value) {\n observer.value.disconnect();\n observer.value = undefined;\n }\n }\n\n onMounted(() => {\n initObserve();\n });\n\n onUpdated(() => {\n destroyObserver();\n debouncedInitObserve();\n });\n\n onDeactivated(() => {\n destroyObserver();\n });\n\n onBeforeUnmount(() => {\n destroyObserver();\n });\n\n function onMoreClick(toggleMoreDropdown) {\n toggleMoreDropdown();\n isMoreMenuOpen.value = !isMoreMenuOpen.value;\n }\n</script>\n\n<template>\n <div class=\"stash-tabs tw-relative\" role=\"tabList\" data-test=\"stash-tabs\">\n <ul\n ref=\"tabListEl\"\n :style=\"{\n width: `calc(100% - ${moreDropdownWidth}px)`,\n }\"\n class=\"stash-tabs-list tw-flex tw-items-end\"\n :class=\"{\n 'stash-tabs-list--line': variant === 'line',\n 'stash-tabs-list--enclosed': variant === 'enclosed',\n 'tw-gap-6': variant === 'line',\n }\"\n >\n <slot></slot>\n\n <Dropdown v-if=\"overflowIds.size\" ref=\"moreDropdownEl\" class=\"!tw-absolute tw-right-0 tw-top-0\">\n <template #toggle=\"{ toggle }\">\n <button\n aria-haspopup=\"menu\"\n :aria-controls=\"moreMenuId\"\n :aria-expanded=\"isMoreMenuOpen\"\n class=\"tw-flex tw-cursor-pointer tw-items-center tw-justify-center tw-border-solid tw-px-6 tw-py-1.5 tw-text-sm tw-font-medium tw-text-blue-500 hover:tw-text-blue-700\"\n :class=\"{ 'tw-border-t-4 tw-border-transparent': props.variant === 'enclosed' }\"\n type=\"button\"\n @click=\"onMoreClick(toggle)\"\n >\n {{ t('ll.more') }}\n <Icon name=\"caret-down\" />\n </button>\n </template>\n <template #default>\n <ul :id=\"moreMenuId\" ref=\"moreDropdownMenuEl\" class=\"tw-space-y-1.5 tw-px-1.5 tw-pb-1.5\" role=\"menu\">\n <slot></slot>\n </ul>\n </template>\n </Dropdown>\n </ul>\n </div>\n</template>\n\n<style module>\n .menu-tab > a {\n /* prevents the global link styles to overwrite the overflowed tab styles */\n &,\n &:hover,\n &:focus {\n color: inherit;\n }\n }\n</style>\n"],"names":["TABS_INJECTION","TabVariant","emit","__emit","props","__props","classes","useCssModule","tabListEl","ref","moreDropdownMenuEl","observer","hasIntersectionObserver","overflowIds","moreDropdownWidth","moreDropdownEl","moreMenuId","uniqueId","isMoreMenuOpen","currentActiveTab","computed","nv","setActiveTab","newTabValue","provide","initObserve","tabs","_a","options","v","i","entries","entry","dataId","element","_c","_b","firstElementChild","span","debouncedInitObserve","debounce","DEBOUNCE","destroyObserver","onMounted","onUpdated","onDeactivated","onBeforeUnmount","onMoreClick","toggleMoreDropdown"],"mappings":"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"}
|