@leaflink/stash 42.4.4 → 42.5.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/README.md +27 -3
- package/dist/ActionsDropdown.js +15 -20
- package/dist/ActionsDropdown.js.map +1 -1
- package/dist/AddressSelect.js +34 -45
- package/dist/AddressSelect.js.map +1 -1
- package/dist/Alert.js +58 -57
- package/dist/Alert.js.map +1 -1
- package/dist/AppNavigationItem.js +4 -6
- package/dist/AppNavigationItem.js.map +1 -1
- package/dist/AppTopbar.js +13 -15
- package/dist/AppTopbar.js.map +1 -1
- package/dist/ButtonGroup.js +12 -14
- package/dist/ButtonGroup.js.map +1 -1
- package/dist/CardMedia.js +9 -11
- package/dist/CardMedia.js.map +1 -1
- package/dist/Carousel.js +41 -44
- package/dist/Carousel.js.map +1 -1
- package/dist/Checkbox.js +9 -11
- package/dist/Checkbox.js.map +1 -1
- package/dist/ChevronToggle.js +2 -4
- package/dist/ChevronToggle.js.map +1 -1
- package/dist/Chip.js +4 -6
- package/dist/Chip.js.map +1 -1
- package/dist/ContextSwitcher.js +12 -17
- package/dist/ContextSwitcher.js.map +1 -1
- package/dist/Copy.js +19 -24
- package/dist/Copy.js.map +1 -1
- package/dist/CurrencyInput.js +8 -13
- package/dist/CurrencyInput.js.map +1 -1
- package/dist/DataView.js +48 -59
- package/dist/DataView.js.map +1 -1
- package/dist/DataViewFilters.js +87 -97
- package/dist/DataViewFilters.js.map +1 -1
- package/dist/DataViewSortButton.js +14 -18
- package/dist/DataViewSortButton.js.map +1 -1
- package/dist/DataViewToolbar.js +12 -14
- package/dist/DataViewToolbar.js.map +1 -1
- package/dist/DatePicker.js +2624 -2581
- package/dist/DatePicker.js.map +1 -1
- package/dist/DatePicker.vue.d.ts +19 -0
- package/dist/Dialog.js +6 -9
- package/dist/Dialog.js.map +1 -1
- package/dist/Dropdown.js +15 -20
- package/dist/Dropdown.js.map +1 -1
- package/dist/EmptyState.js +10 -13
- package/dist/EmptyState.js.map +1 -1
- package/dist/Field.js +3 -6
- package/dist/Field.js.map +1 -1
- package/dist/{Field.vue_vue_type_script_setup_true_lang-c864abd3.js → Field.vue_vue_type_script_setup_true_lang-475832fe.js} +2 -2
- package/dist/{Field.vue_vue_type_script_setup_true_lang-c864abd3.js.map → Field.vue_vue_type_script_setup_true_lang-475832fe.js.map} +1 -1
- package/dist/FileUpload.js +27 -30
- package/dist/FileUpload.js.map +1 -1
- package/dist/FilterChip.js +10 -13
- package/dist/FilterChip.js.map +1 -1
- package/dist/FilterDrawerItem.js +5 -8
- package/dist/FilterDrawerItem.js.map +1 -1
- package/dist/FilterDropdown.js +73 -88
- package/dist/FilterDropdown.js.map +1 -1
- package/dist/FilterSelect.js +15 -18
- package/dist/FilterSelect.js.map +1 -1
- package/dist/Filters.js +67 -78
- package/dist/Filters.js.map +1 -1
- package/dist/HttpError.js +4 -7
- package/dist/HttpError.js.map +1 -1
- package/dist/Icon.js +236 -14
- package/dist/Icon.js.map +1 -1
- package/dist/Icon.vue.d.ts +2 -2
- package/dist/Icon.vue_used_vue_type_style_index_0_lang.module-eb359559.js +11 -0
- package/dist/Icon.vue_used_vue_type_style_index_0_lang.module-eb359559.js.map +1 -0
- package/dist/IconLabel.js +4 -6
- package/dist/IconLabel.js.map +1 -1
- package/dist/Illustration.js +6 -8
- package/dist/Illustration.js.map +1 -1
- package/dist/Image.js +39 -49
- package/dist/Image.js.map +1 -1
- package/dist/InlineEdit.js +10 -12
- package/dist/InlineEdit.js.map +1 -1
- package/dist/Input.js +50 -55
- package/dist/Input.js.map +1 -1
- package/dist/InputOptions.js +20 -29
- package/dist/InputOptions.js.map +1 -1
- package/dist/Label.js +1 -4
- package/dist/Label.js.map +1 -1
- package/dist/LicenseChip.js +7 -9
- package/dist/LicenseChip.js.map +1 -1
- package/dist/ListItem.js +11 -13
- package/dist/ListItem.js.map +1 -1
- package/dist/ListView.js +47 -58
- package/dist/ListView.js.map +1 -1
- package/dist/Metric.js +43 -45
- package/dist/Metric.js.map +1 -1
- package/dist/Metric.vue.d.ts +24 -15
- package/dist/Modal.js +16 -19
- package/dist/Modal.js.map +1 -1
- package/dist/Modals.js +16 -26
- package/dist/Modals.js.map +1 -1
- package/dist/ModalsPlugin.js +12 -22
- package/dist/ModalsPlugin.js.map +1 -1
- package/dist/ObfuscateText.js +7 -9
- package/dist/ObfuscateText.js.map +1 -1
- package/dist/PageNavigation.js +25 -29
- package/dist/PageNavigation.js.map +1 -1
- package/dist/Paginate.js +29 -31
- package/dist/Paginate.js.map +1 -1
- package/dist/QuickAction.js +13 -15
- package/dist/QuickAction.js.map +1 -1
- package/dist/RadioGroup.js +86 -89
- package/dist/RadioGroup.js.map +1 -1
- package/dist/SearchBar.js +18 -20
- package/dist/SearchBar.js.map +1 -1
- package/dist/Select.js +13 -23
- package/dist/Select.js.map +1 -1
- package/dist/SelectStatus.js +26 -36
- package/dist/SelectStatus.js.map +1 -1
- package/dist/Step.js +19 -21
- package/dist/Step.js.map +1 -1
- package/dist/Switch.js +8 -10
- package/dist/Switch.js.map +1 -1
- package/dist/Tab.js +25 -30
- package/dist/Tab.js.map +1 -1
- package/dist/Table.js +19 -21
- package/dist/Table.js.map +1 -1
- package/dist/TableCell.js +21 -22
- package/dist/TableCell.js.map +1 -1
- package/dist/TableHeaderCell.js +4 -4
- package/dist/TableHeaderRow.js +7 -9
- package/dist/TableHeaderRow.js.map +1 -1
- package/dist/TableRow.js +22 -24
- package/dist/TableRow.js.map +1 -1
- package/dist/Tabs.js +11 -16
- package/dist/Tabs.js.map +1 -1
- package/dist/{Tabs.vue_vue_type_script_setup_true_lang-ba383fda.js → Tabs.vue_vue_type_script_setup_true_lang-aca4f8b8.js} +3 -3
- package/dist/{Tabs.vue_vue_type_script_setup_true_lang-ba383fda.js.map → Tabs.vue_vue_type_script_setup_true_lang-aca4f8b8.js.map} +1 -1
- package/dist/Textarea.js +10 -13
- package/dist/Textarea.js.map +1 -1
- package/dist/Toast.js +8 -10
- package/dist/Toast.js.map +1 -1
- package/dist/Toasts.js +14 -25
- package/dist/Toasts.js.map +1 -1
- package/dist/ToastsPlugin.js +14 -25
- package/dist/ToastsPlugin.js.map +1 -1
- package/dist/components.css +1 -1
- package/dist/index.js +53 -62
- package/dist/index.js.map +1 -1
- package/dist/locale.js +12 -15
- package/dist/locale.js.map +1 -1
- package/dist/{searchFuzzy-13c124f8.js → searchFuzzy-74a7de1c.js} +2 -2
- package/dist/{searchFuzzy-13c124f8.js.map → searchFuzzy-74a7de1c.js.map} +1 -1
- package/dist/storage.js +6 -11
- package/dist/storage.js.map +1 -1
- package/dist/tooltip.js +21 -26
- package/dist/tooltip.js.map +1 -1
- package/dist/useGoogleMaps.js +91 -226
- package/dist/useGoogleMaps.js.map +1 -1
- package/dist/useModals.js +21 -31
- package/dist/useModals.js.map +1 -1
- package/dist/useSearch.js +17 -22
- package/dist/useSearch.js.map +1 -1
- package/dist/useToasts.js +25 -36
- package/dist/useToasts.js.map +1 -1
- package/dist/useValidation.js +79 -108
- package/dist/useValidation.js.map +1 -1
- package/dist/utils/calculateElementOverflow.js +9 -14
- package/dist/utils/calculateElementOverflow.js.map +1 -1
- package/dist/utils/createQueryString.js +9 -15
- package/dist/utils/createQueryString.js.map +1 -1
- package/dist/utils/helpers.js +46 -59
- package/dist/utils/helpers.js.map +1 -1
- package/dist/utils/i18n.js +17 -20
- package/dist/utils/i18n.js.map +1 -1
- package/dist/utils/searchFuzzy.js +7 -12
- package/dist/utils/searchFuzzy.js.map +1 -1
- package/dist/utils/storage.js +10 -15
- package/dist/utils/storage.js.map +1 -1
- package/dist/viewable.js +26 -34
- package/dist/viewable.js.map +1 -1
- package/package.json +4 -6
- package/dist/Icon.vue_used_vue_type_style_index_0_lang.module-d2507af3.js +0 -243
- package/dist/Icon.vue_used_vue_type_style_index_0_lang.module-d2507af3.js.map +0 -1
- package/dist/_MapCache-65811284.js +0 -188
- package/dist/_MapCache-65811284.js.map +0 -1
- package/dist/_Uint8Array-06e4d083.js +0 -66
- package/dist/_Uint8Array-06e4d083.js.map +0 -1
- package/dist/_baseAssignValue-dd1499b4.js +0 -22
- package/dist/_baseAssignValue-dd1499b4.js.map +0 -1
- package/dist/_baseIsEqual-d594c87f.js +0 -171
- package/dist/_baseIsEqual-d594c87f.js.map +0 -1
- package/dist/_createCompounder-ae01a723.js +0 -245
- package/dist/_createCompounder-ae01a723.js.map +0 -1
- package/dist/_getAllKeys-5e735d41.js +0 -44
- package/dist/_getAllKeys-5e735d41.js.map +0 -1
- package/dist/_getPrototype-3e6fccd6.js +0 -7
- package/dist/_getPrototype-3e6fccd6.js.map +0 -1
- package/dist/_getTag-4db47fa6.js +0 -47
- package/dist/_getTag-4db47fa6.js.map +0 -1
- package/dist/_initCloneObject-161353b9.js +0 -88
- package/dist/_initCloneObject-161353b9.js.map +0 -1
- package/dist/_overArg-6d920d99.js +0 -9
- package/dist/_overArg-6d920d99.js.map +0 -1
- package/dist/capitalize-667d9f60.js +0 -42
- package/dist/capitalize-667d9f60.js.map +0 -1
- package/dist/cloneDeep-5bc375b0.js +0 -146
- package/dist/cloneDeep-5bc375b0.js.map +0 -1
- package/dist/debounce-6aca1ca9.js +0 -86
- package/dist/debounce-6aca1ca9.js.map +0 -1
- package/dist/get-27d90892.js +0 -66
- package/dist/get-27d90892.js.map +0 -1
- package/dist/identity-452d03fd.js +0 -20
- package/dist/identity-452d03fd.js.map +0 -1
- package/dist/isArrayLike-09233e52.js +0 -61
- package/dist/isArrayLike-09233e52.js.map +0 -1
- package/dist/isEmpty-2fbad344.js +0 -23
- package/dist/isEmpty-2fbad344.js.map +0 -1
- package/dist/isEqual-fca467fb.js +0 -8
- package/dist/isEqual-fca467fb.js.map +0 -1
- package/dist/isObjectLike-54341556.js +0 -39
- package/dist/isObjectLike-54341556.js.map +0 -1
- package/dist/isPlainObject-55c7f916.js +0 -16
- package/dist/isPlainObject-55c7f916.js.map +0 -1
- package/dist/merge-b14fad9d.js +0 -124
- package/dist/merge-b14fad9d.js.map +0 -1
- package/dist/toString-7d5bf363.js +0 -29
- package/dist/toString-7d5bf363.js.map +0 -1
- package/dist/uniqueId-847efe53.js +0 -10
- package/dist/uniqueId-847efe53.js.map +0 -1
package/dist/FilterSelect.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FilterSelect.js","sources":["../src/components/FilterSelect/FilterSelect.vue"],"sourcesContent":["<script lang=\"ts\">\n export * from './FilterSelect.types';\n</script>\n\n<script lang=\"ts\" setup>\n import { computed } from 'vue';\n\n import { t } from '../../locale';\n import Field from '../Field/Field.vue';\n import FilterChip from '../FilterChip/FilterChip.vue';\n import { FilterSelectModelValue, FilterSelectOption } from './FilterSelect.types';\n\n export interface FilterSelectProps {\n /**\n * The name attribute for the `<input>` elements. It is also used as a unique field to differentiate FilterSelect instances.\n */\n name: string;\n\n label: string;\n\n options: FilterSelectOption[];\n\n modelValue: FilterSelectModelValue;\n\n /**\n * When true, this prop adds an \"All\" option for selecting all options.\n */\n canSelectAll?: boolean;\n }\n\n const props = withDefaults(defineProps<FilterSelectProps>(), {\n canSelectAll: false,\n });\n\n const emit =\n defineEmits<{\n (e: 'update:modelValue', value: FilterSelectModelValue): void;\n }>();\n\n /**\n * @see: https://vuejs.org/guide/components/v-model.html#component-v-model\n */\n const selected = computed({\n get() {\n return props.modelValue;\n },\n set(value) {\n emit('update:modelValue', value);\n },\n });\n\n const isAllSelected = computed({\n get() {\n return props.options.length === props.modelValue.length;\n },\n set(isChecked) {\n emit('update:modelValue', isChecked ? props.options.map((option) => option.value) : []);\n },\n });\n\n function getOptionId(option: FilterSelectOption) {\n return `${props.name}--${option.value}`;\n }\n\n function isOptionSelected(option: FilterSelectOption) {\n return props.modelValue.includes(option.value);\n }\n\n function onEnter(enteredValue: FilterSelectOption['value']) {\n const newSelected = selected.value.filter((value) => value !== enteredValue);\n\n if (newSelected.length === selected.value.length) {\n newSelected.push(enteredValue);\n }\n\n selected.value = newSelected;\n }\n\n function onEnterAll() {\n isAllSelected.value = !isAllSelected.value;\n }\n</script>\n\n<template>\n <Field class=\"stash-filter-select\" fieldset :label=\"props.label\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-1.5\">\n <div v-if=\"props.canSelectAll\" :key=\"`${props.name}--all`\">\n <input\n :id=\"`${props.name}--all`\"\n v-model=\"isAllSelected\"\n class=\"sr-only\"\n tabindex=\"-1\"\n type=\"checkbox\"\n value=\"all\"\n />\n <label :for=\"`${props.name}--all`\">\n <FilterChip :is-selected=\"isAllSelected\" tabindex=\"0\" @keypress.enter=\"onEnterAll\">\n {{ t('ll.all') }}\n </FilterChip>\n </label>\n </div>\n <div v-for=\"option in props.options\" :key=\"getOptionId(option)\">\n <input\n :id=\"getOptionId(option)\"\n v-model=\"selected\"\n class=\"sr-only\"\n tabindex=\"-1\"\n type=\"checkbox\"\n :value=\"option.value\"\n />\n <label :for=\"getOptionId(option)\">\n <FilterChip :is-selected=\"isOptionSelected(option)\" tabindex=\"0\" @keypress.enter=\"onEnter(option.value)\">\n {{ option.label }}\n </FilterChip>\n </label>\n </div>\n </div>\n </Field>\n</template>\n"],"names":["selected","computed","props","value","emit","isAllSelected","isChecked","option","getOptionId","isOptionSelected","onEnter","enteredValue","newSelected","onEnterAll"],"mappings":"
|
|
1
|
+
{"version":3,"file":"FilterSelect.js","sources":["../src/components/FilterSelect/FilterSelect.vue"],"sourcesContent":["<script lang=\"ts\">\n export * from './FilterSelect.types';\n</script>\n\n<script lang=\"ts\" setup>\n import { computed } from 'vue';\n\n import { t } from '../../locale';\n import Field from '../Field/Field.vue';\n import FilterChip from '../FilterChip/FilterChip.vue';\n import { FilterSelectModelValue, FilterSelectOption } from './FilterSelect.types';\n\n export interface FilterSelectProps {\n /**\n * The name attribute for the `<input>` elements. It is also used as a unique field to differentiate FilterSelect instances.\n */\n name: string;\n\n label: string;\n\n options: FilterSelectOption[];\n\n modelValue: FilterSelectModelValue;\n\n /**\n * When true, this prop adds an \"All\" option for selecting all options.\n */\n canSelectAll?: boolean;\n }\n\n const props = withDefaults(defineProps<FilterSelectProps>(), {\n canSelectAll: false,\n });\n\n const emit =\n defineEmits<{\n (e: 'update:modelValue', value: FilterSelectModelValue): void;\n }>();\n\n /**\n * @see: https://vuejs.org/guide/components/v-model.html#component-v-model\n */\n const selected = computed({\n get() {\n return props.modelValue;\n },\n set(value) {\n emit('update:modelValue', value);\n },\n });\n\n const isAllSelected = computed({\n get() {\n return props.options.length === props.modelValue.length;\n },\n set(isChecked) {\n emit('update:modelValue', isChecked ? props.options.map((option) => option.value) : []);\n },\n });\n\n function getOptionId(option: FilterSelectOption) {\n return `${props.name}--${option.value}`;\n }\n\n function isOptionSelected(option: FilterSelectOption) {\n return props.modelValue.includes(option.value);\n }\n\n function onEnter(enteredValue: FilterSelectOption['value']) {\n const newSelected = selected.value.filter((value) => value !== enteredValue);\n\n if (newSelected.length === selected.value.length) {\n newSelected.push(enteredValue);\n }\n\n selected.value = newSelected;\n }\n\n function onEnterAll() {\n isAllSelected.value = !isAllSelected.value;\n }\n</script>\n\n<template>\n <Field class=\"stash-filter-select\" fieldset :label=\"props.label\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-1.5\">\n <div v-if=\"props.canSelectAll\" :key=\"`${props.name}--all`\">\n <input\n :id=\"`${props.name}--all`\"\n v-model=\"isAllSelected\"\n class=\"sr-only\"\n tabindex=\"-1\"\n type=\"checkbox\"\n value=\"all\"\n />\n <label :for=\"`${props.name}--all`\">\n <FilterChip :is-selected=\"isAllSelected\" tabindex=\"0\" @keypress.enter=\"onEnterAll\">\n {{ t('ll.all') }}\n </FilterChip>\n </label>\n </div>\n <div v-for=\"option in props.options\" :key=\"getOptionId(option)\">\n <input\n :id=\"getOptionId(option)\"\n v-model=\"selected\"\n class=\"sr-only\"\n tabindex=\"-1\"\n type=\"checkbox\"\n :value=\"option.value\"\n />\n <label :for=\"getOptionId(option)\">\n <FilterChip :is-selected=\"isOptionSelected(option)\" tabindex=\"0\" @keypress.enter=\"onEnter(option.value)\">\n {{ option.label }}\n </FilterChip>\n </label>\n </div>\n </div>\n </Field>\n</template>\n"],"names":["selected","computed","props","value","emit","isAllSelected","isChecked","option","getOptionId","isOptionSelected","onEnter","enteredValue","newSelected","onEnterAll"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;iBA0CQA,IAAWC,EAAS;AAAA,MACxB,MAAM;AACJ,eAAOC,EAAM;AAAA,MACf;AAAA,MACA,IAAIC,GAAO;AACT,QAAAC,EAAK,qBAAqBD,CAAK;AAAA,MACjC;AAAA,IAAA,CACD,GAEKE,IAAgBJ,EAAS;AAAA,MAC7B,MAAM;AACJ,eAAOC,EAAM,QAAQ,WAAWA,EAAM,WAAW;AAAA,MACnD;AAAA,MACA,IAAII,GAAW;AACR,QAAAF,EAAA,qBAAqBE,IAAYJ,EAAM,QAAQ,IAAI,CAACK,MAAWA,EAAO,KAAK,IAAI,CAAE,CAAA;AAAA,MACxF;AAAA,IAAA,CACD;AAED,aAASC,EAAYD,GAA4B;AAC/C,aAAO,GAAGL,EAAM,IAAI,KAAKK,EAAO,KAAK;AAAA,IACvC;AAEA,aAASE,EAAiBF,GAA4B;AACpD,aAAOL,EAAM,WAAW,SAASK,EAAO,KAAK;AAAA,IAC/C;AAEA,aAASG,EAAQC,GAA2C;AAC1D,YAAMC,IAAcZ,EAAS,MAAM,OAAO,CAACG,MAAUA,MAAUQ,CAAY;AAE3E,MAAIC,EAAY,WAAWZ,EAAS,MAAM,UACxCY,EAAY,KAAKD,CAAY,GAG/BX,EAAS,QAAQY;AAAA,IACnB;AAEA,aAASC,IAAa;AACN,MAAAR,EAAA,QAAQ,CAACA,EAAc;AAAA,IACvC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/dist/Filters.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import { toRefs as W, ref as S, nextTick as Y, resolveComponent as y, openBlock as
|
|
1
|
+
import w from "lodash-es/cloneDeep";
|
|
2
|
+
import z from "lodash-es/merge";
|
|
3
|
+
import { toRefs as W, ref as S, nextTick as Y, resolveComponent as y, openBlock as c, createElementBlock as V, Fragment as j, renderList as q, normalizeClass as L, createBlock as f, mergeProps as g, resolveDynamicComponent as k, createSlots as J, withCtx as b, normalizeProps as O, guardReactiveProps as R, createElementVNode as v, createCommentVNode as U, createVNode as D, createTextVNode as A, toDisplayString as M } from "vue";
|
|
4
4
|
import K from "./useValidation.js";
|
|
5
5
|
import { LLLV_CHANGE_TRIGGERS as N } from "./constants.js";
|
|
6
6
|
import { t as H } from "./locale.js";
|
|
@@ -13,28 +13,17 @@ import $ from "./InputOptions.js";
|
|
|
13
13
|
import ee from "./Radio.js";
|
|
14
14
|
import te from "./Select.js";
|
|
15
15
|
import { _ as le } from "./_plugin-vue_export-helper-dad06003.js";
|
|
16
|
-
import "
|
|
17
|
-
import "
|
|
18
|
-
import "./isObjectLike-54341556.js";
|
|
19
|
-
import "./_MapCache-65811284.js";
|
|
20
|
-
import "./_initCloneObject-161353b9.js";
|
|
21
|
-
import "./_baseAssignValue-dd1499b4.js";
|
|
22
|
-
import "./_getPrototype-3e6fccd6.js";
|
|
23
|
-
import "./_overArg-6d920d99.js";
|
|
24
|
-
import "./_getAllKeys-5e735d41.js";
|
|
25
|
-
import "./_getTag-4db47fa6.js";
|
|
26
|
-
import "./identity-452d03fd.js";
|
|
27
|
-
import "./isPlainObject-55c7f916.js";
|
|
28
|
-
import "./debounce-6aca1ca9.js";
|
|
29
|
-
import "./toString-7d5bf363.js";
|
|
30
|
-
import "./get-27d90892.js";
|
|
16
|
+
import "lodash-es/debounce";
|
|
17
|
+
import "lodash-es/get";
|
|
31
18
|
import "./isDefined-2ce6cde4.js";
|
|
19
|
+
import "lodash-es/round";
|
|
32
20
|
import "./utils/storage.js";
|
|
33
21
|
import "./utils/helpers.js";
|
|
34
|
-
import "
|
|
35
|
-
import "
|
|
22
|
+
import "lodash-es/camelCase";
|
|
23
|
+
import "lodash-es/isFinite";
|
|
24
|
+
import "lodash-es/isPlainObject";
|
|
36
25
|
import "./Button.vue_used_vue_type_style_index_0_lang.module-b77978d6.js";
|
|
37
|
-
import "
|
|
26
|
+
import "lodash-es/uniqueId";
|
|
38
27
|
import "./Checkbox.vue_vue_type_style_index_0_scoped_0cd31c8f_lang-4ed993c7.js";
|
|
39
28
|
import "./utils/createValidDate.js";
|
|
40
29
|
import "./index-5e5945a9.js";
|
|
@@ -44,16 +33,16 @@ import "./utils/normalizeDate.js";
|
|
|
44
33
|
import "./toTimeZone-e6e9ab75.js";
|
|
45
34
|
import "./_commonjsHelpers-10dfc225.js";
|
|
46
35
|
import "./Icon.js";
|
|
47
|
-
import "./Icon.vue_used_vue_type_style_index_0_lang.module-d2507af3.js";
|
|
48
36
|
import "./index-79ce320f.js";
|
|
37
|
+
import "./Icon.vue_used_vue_type_style_index_0_lang.module-eb359559.js";
|
|
38
|
+
import "lodash-es/isNil";
|
|
49
39
|
import "./utils/i18n.js";
|
|
50
|
-
import "./Field.vue_vue_type_script_setup_true_lang-
|
|
40
|
+
import "./Field.vue_vue_type_script_setup_true_lang-475832fe.js";
|
|
51
41
|
import "./Label.vue_vue_type_script_setup_true_lang-1d29d98a.js";
|
|
52
|
-
import "
|
|
53
|
-
import "
|
|
54
|
-
import "./_baseIsEqual-d594c87f.js";
|
|
42
|
+
import "lodash-es/isEmpty";
|
|
43
|
+
import "lodash-es/isEqual";
|
|
55
44
|
import "./useSearch.js";
|
|
56
|
-
import "./searchFuzzy-
|
|
45
|
+
import "./searchFuzzy-74a7de1c.js";
|
|
57
46
|
import "./clickoutside.js";
|
|
58
47
|
import "./MenusPlugin-5e93f0a5.js";
|
|
59
48
|
import "./Chip.js";
|
|
@@ -105,18 +94,18 @@ const ie = {
|
|
|
105
94
|
},
|
|
106
95
|
emits: ["change", "submit", "reset"],
|
|
107
96
|
setup(l) {
|
|
108
|
-
const { validationSchema:
|
|
109
|
-
function
|
|
97
|
+
const { validationSchema: r } = W(l), o = r.value(), i = S({}), t = S();
|
|
98
|
+
function s() {
|
|
110
99
|
if ((o == null ? void 0 : o.toString()) !== "[object Object]")
|
|
111
100
|
return;
|
|
112
|
-
i.value = Object.keys(o).reduce((
|
|
113
|
-
const
|
|
114
|
-
t.value = K({ rules:
|
|
101
|
+
i.value = Object.keys(o).reduce((d, m) => (d[m] = void 0, d), {});
|
|
102
|
+
const p = Object.entries(o).reduce((d, [m, h]) => (d[m] = h.map((u) => u(i)), d), {});
|
|
103
|
+
t.value = K({ rules: p, values: i }), t.value.validate();
|
|
115
104
|
}
|
|
116
105
|
return {
|
|
117
106
|
validation: t,
|
|
118
107
|
validationValues: i,
|
|
119
|
-
initValidation:
|
|
108
|
+
initValidation: s
|
|
120
109
|
};
|
|
121
110
|
},
|
|
122
111
|
data() {
|
|
@@ -136,33 +125,33 @@ const ie = {
|
|
|
136
125
|
* @returns {IFilter}
|
|
137
126
|
*/
|
|
138
127
|
handler: function(l) {
|
|
139
|
-
const
|
|
128
|
+
const r = Object.keys(l).reduce((o, i) => {
|
|
140
129
|
const t = this.schema[i];
|
|
141
130
|
if (!t || !t.fieldToFilter)
|
|
142
131
|
return o;
|
|
143
|
-
const
|
|
144
|
-
if (
|
|
132
|
+
const s = l[i];
|
|
133
|
+
if (s === "" || s == null)
|
|
145
134
|
return o;
|
|
146
|
-
const
|
|
135
|
+
const p = t.attributes.trackBy || "id", d = typeof s == "object", m = typeof t.type == "object", h = m && t.attributes.multiple || !m && t.type.includes("ll-select") && (t.attributes.multiple || !t.attributes.single), u = h ? (
|
|
147
136
|
// local storage might have item stored as an object from the old Select
|
|
148
|
-
(Array.isArray(
|
|
149
|
-
) :
|
|
150
|
-
return e && (
|
|
137
|
+
(Array.isArray(s) ? s : [s]).map((a) => a[p])
|
|
138
|
+
) : d ? [s[p]] : [s], e = t.groupedWith;
|
|
139
|
+
return e && (u[0] = {
|
|
151
140
|
index: e,
|
|
152
141
|
value: l[e]
|
|
153
|
-
},
|
|
142
|
+
}, u.push({
|
|
154
143
|
index: Number(i),
|
|
155
144
|
value: l[i]
|
|
156
|
-
})),
|
|
145
|
+
})), u.length && (o[t.fieldToFilter] = {
|
|
157
146
|
// don't add to `filters` if no filterBy
|
|
158
|
-
filterBy:
|
|
147
|
+
filterBy: u,
|
|
159
148
|
filterType: t.type,
|
|
160
149
|
// Informs the applied filter count
|
|
161
150
|
isMultiple: h,
|
|
162
151
|
..."fn" in t && { customFilter: t.fn }
|
|
163
152
|
}), o;
|
|
164
153
|
}, {});
|
|
165
|
-
this.filters =
|
|
154
|
+
this.filters = r, this.$emit("change", r);
|
|
166
155
|
},
|
|
167
156
|
deep: !0,
|
|
168
157
|
immediate: !0
|
|
@@ -201,7 +190,7 @@ const ie = {
|
|
|
201
190
|
* Returns pre-defined filter values to become the default values
|
|
202
191
|
*/
|
|
203
192
|
getDefaultFilterValues() {
|
|
204
|
-
return this.schema.reduce((l,
|
|
193
|
+
return this.schema.reduce((l, r, o) => (r.type === "ll-checkbox" ? l[o] = r.attributes.checked || !1 : Object.prototype.hasOwnProperty.call(r.attributes, "modelValue") && (l[o] = r.attributes.modelValue), l), {});
|
|
205
194
|
},
|
|
206
195
|
/**
|
|
207
196
|
* Intended for external use, when filter values need to be set for the user
|
|
@@ -211,26 +200,26 @@ const ie = {
|
|
|
211
200
|
},
|
|
212
201
|
updateValidationValues() {
|
|
213
202
|
const l = Object.keys(this.validationSchema());
|
|
214
|
-
this.schema.forEach((
|
|
215
|
-
const i =
|
|
203
|
+
this.schema.forEach((r, o) => {
|
|
204
|
+
const i = r.fieldToFilter;
|
|
216
205
|
if (l.includes(i)) {
|
|
217
|
-
const
|
|
218
|
-
this.validationValues[i] =
|
|
206
|
+
const s = this.filters[i], p = s ? s.isMultiple ? s.filterBy : s.filterBy[0] : this.filterValues[o];
|
|
207
|
+
this.validationValues[i] = p;
|
|
219
208
|
}
|
|
220
209
|
});
|
|
221
210
|
},
|
|
222
211
|
/**
|
|
223
212
|
* Change handler for filter fields
|
|
224
213
|
*/
|
|
225
|
-
onChange(l,
|
|
214
|
+
onChange(l, r, o) {
|
|
226
215
|
var i;
|
|
227
|
-
(i = l.on) != null && i.change && l.on.change(
|
|
216
|
+
(i = l.on) != null && i.change && l.on.change(r, o);
|
|
228
217
|
},
|
|
229
218
|
/**
|
|
230
219
|
* Select input event handler for filter fields
|
|
231
220
|
*/
|
|
232
|
-
onSelectInput(l,
|
|
233
|
-
l === void 0 ? delete this.filterValues[o] : this.filterValues[o] = l, this.onChange(
|
|
221
|
+
onSelectInput(l, r, o) {
|
|
222
|
+
l === void 0 ? delete this.filterValues[o] : this.filterValues[o] = l, this.onChange(r, this.filterValues, o);
|
|
234
223
|
},
|
|
235
224
|
/**
|
|
236
225
|
* Get filter values from local storage.
|
|
@@ -247,57 +236,57 @@ const ie = {
|
|
|
247
236
|
G.set("filter-values", w(l));
|
|
248
237
|
}
|
|
249
238
|
}
|
|
250
|
-
},
|
|
251
|
-
function
|
|
252
|
-
var
|
|
253
|
-
const
|
|
254
|
-
return
|
|
255
|
-
(
|
|
239
|
+
}, se = { class: "ll-grid ll-grid-cols-4 md:ll-grid-cols-12" }, re = ["data-test"], ae = ["innerHTML"], ne = ["innerHTML"];
|
|
240
|
+
function ce(l, r, o, i, t, s) {
|
|
241
|
+
var u;
|
|
242
|
+
const p = y("ll-select"), d = y("ll-checkbox"), m = y("ll-radio"), h = y("ll-button");
|
|
243
|
+
return c(), V("div", se, [
|
|
244
|
+
(c(!0), V(j, null, q(o.schema, (e, a) => {
|
|
256
245
|
var _, F, T, C, x, P, B, E;
|
|
257
|
-
return
|
|
258
|
-
e.hidden ? U("", !0) : (
|
|
246
|
+
return c(), V(j, null, [
|
|
247
|
+
e.hidden ? U("", !0) : (c(), V("div", {
|
|
259
248
|
key: `${a} ${t.forceRenderCount}`,
|
|
260
249
|
class: L(["field-wrapper col-span-4 md:col-span-3", { "hidden-sm-only": !e.type, "flex align-bottom": e.type === "ll-checkbox" }]),
|
|
261
250
|
"data-test": `filter|${e.fieldToFilter}`
|
|
262
251
|
}, [
|
|
263
|
-
e.type === "ll-select" ? (
|
|
252
|
+
e.type === "ll-select" ? (c(), f(p, g({ key: 0 }, e.attributes, {
|
|
264
253
|
error: ((_ = i.validation) == null ? void 0 : _.fields[e.fieldToFilter]) && ((F = i.validation) == null ? void 0 : F.getError(e.fieldToFilter)),
|
|
265
254
|
label: e.label,
|
|
266
255
|
"model-value": t.filterValues[a],
|
|
267
|
-
"onUpdate:modelValue": (n) =>
|
|
268
|
-
}), null, 16, ["error", "label", "model-value", "onUpdate:modelValue"])) : e.type === "ll-checkbox" ? (
|
|
256
|
+
"onUpdate:modelValue": (n) => s.onSelectInput(n, e, a)
|
|
257
|
+
}), null, 16, ["error", "label", "model-value", "onUpdate:modelValue"])) : e.type === "ll-checkbox" ? (c(), f(d, g({
|
|
269
258
|
key: 1,
|
|
270
259
|
checked: t.filterValues[a],
|
|
271
260
|
"onUpdate:checked": (n) => t.filterValues[a] = n
|
|
272
261
|
}, e.attributes, {
|
|
273
262
|
"error-text": ((T = i.validation) == null ? void 0 : T.fields[e.fieldToFilter]) && ((C = i.validation) == null ? void 0 : C.getError(e.fieldToFilter)),
|
|
274
263
|
label: e.label,
|
|
275
|
-
"onUpdate:checked": (n) =>
|
|
276
|
-
}), null, 16, ["checked", "onUpdate:checked", "error-text", "label"])) : e.type === "ll-radio" ? (
|
|
264
|
+
"onUpdate:checked": (n) => s.onChange(e, t.filterValues, a)
|
|
265
|
+
}), null, 16, ["checked", "onUpdate:checked", "error-text", "label"])) : e.type === "ll-radio" ? (c(), f(m, g({
|
|
277
266
|
key: 2,
|
|
278
267
|
checked: t.filterValues[a],
|
|
279
268
|
"onUpdate:checked": (n) => t.filterValues[a] = n
|
|
280
269
|
}, e.attributes, {
|
|
281
270
|
"error-text": ((x = i.validation) == null ? void 0 : x.fields[e.fieldToFilter]) && ((P = i.validation) == null ? void 0 : P.getError(e.fieldToFilter)),
|
|
282
271
|
label: e.label,
|
|
283
|
-
"onUpdate:checked": (n) =>
|
|
284
|
-
}), null, 16, ["checked", "onUpdate:checked", "error-text", "label"])) : e.type ? (
|
|
272
|
+
"onUpdate:checked": (n) => s.onChange(e, t.filterValues, a)
|
|
273
|
+
}), null, 16, ["checked", "onUpdate:checked", "error-text", "label"])) : e.type ? (c(), f(k(e.type), g({ key: 3 }, e.attributes, {
|
|
285
274
|
modelValue: t.filterValues[a],
|
|
286
|
-
"onUpdate:modelValue": [(n) => t.filterValues[a] = n, (n) =>
|
|
275
|
+
"onUpdate:modelValue": [(n) => t.filterValues[a] = n, (n) => s.onChange(e, t.filterValues, a)],
|
|
287
276
|
"error-text": ((B = i.validation) == null ? void 0 : B.fields[e.fieldToFilter]) && ((E = i.validation) == null ? void 0 : E.getError(e.fieldToFilter)),
|
|
288
277
|
label: e.label
|
|
289
278
|
}), J({ _: 2 }, [
|
|
290
279
|
e.slots && e.slots.selected ? {
|
|
291
280
|
name: "selected",
|
|
292
281
|
fn: b(({ option: n }) => [
|
|
293
|
-
(
|
|
282
|
+
(c(), f(k(e.slots.selected), O(R(n.props)), null, 16))
|
|
294
283
|
]),
|
|
295
284
|
key: "0"
|
|
296
285
|
} : void 0,
|
|
297
286
|
e.slots && e.slots.option ? {
|
|
298
287
|
name: "option",
|
|
299
288
|
fn: b(({ option: n }) => [
|
|
300
|
-
(
|
|
289
|
+
(c(), f(k(e.slots.option), O(R(n.props)), null, 16))
|
|
301
290
|
]),
|
|
302
291
|
key: "1"
|
|
303
292
|
} : void 0,
|
|
@@ -320,7 +309,7 @@ function pe(l, s, o, i, t, r) {
|
|
|
320
309
|
key: "3"
|
|
321
310
|
} : void 0
|
|
322
311
|
]), 1040, ["modelValue", "onUpdate:modelValue", "error-text", "label"])) : U("", !0)
|
|
323
|
-
], 10,
|
|
312
|
+
], 10, re))
|
|
324
313
|
], 64);
|
|
325
314
|
}), 256)),
|
|
326
315
|
v("div", {
|
|
@@ -330,7 +319,7 @@ function pe(l, s, o, i, t, r) {
|
|
|
330
319
|
secondary: "",
|
|
331
320
|
"data-test": "button|reset-filters",
|
|
332
321
|
disabled: o.disableClear,
|
|
333
|
-
onClick:
|
|
322
|
+
onClick: s.resetFilters
|
|
334
323
|
}, {
|
|
335
324
|
default: b(() => [
|
|
336
325
|
A(M(t.clearText), 1)
|
|
@@ -340,8 +329,8 @@ function pe(l, s, o, i, t, r) {
|
|
|
340
329
|
D(h, {
|
|
341
330
|
primary: "",
|
|
342
331
|
"data-test": "button|apply-filters",
|
|
343
|
-
disabled: o.disableApply || ((
|
|
344
|
-
onClick:
|
|
332
|
+
disabled: o.disableApply || ((u = i.validation) == null ? void 0 : u.hasErrors),
|
|
333
|
+
onClick: s.applyFilters
|
|
345
334
|
}, {
|
|
346
335
|
default: b(() => [
|
|
347
336
|
A(M(t.applyText), 1)
|
|
@@ -351,10 +340,10 @@ function pe(l, s, o, i, t, r) {
|
|
|
351
340
|
], 2)
|
|
352
341
|
]);
|
|
353
342
|
}
|
|
354
|
-
const
|
|
343
|
+
const de = {
|
|
355
344
|
$style: ie
|
|
356
|
-
},
|
|
345
|
+
}, at = /* @__PURE__ */ le(oe, [["render", ce], ["__cssModules", de]]);
|
|
357
346
|
export {
|
|
358
|
-
|
|
347
|
+
at as default
|
|
359
348
|
};
|
|
360
349
|
//# sourceMappingURL=Filters.js.map
|
package/dist/Filters.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Filters.js","sources":["../src/components/Filters/Filters.vue"],"sourcesContent":["<script>\n import cloneDeep from 'lodash-es/cloneDeep';\n import merge from 'lodash-es/merge';\n import { nextTick, ref, toRefs } from 'vue';\n\n import useValidation from '../../composables/useValidation/useValidation';\n import { LLLV_CHANGE_TRIGGERS } from '../../constants';\n import { t } from '../../locale';\n import { persistentStorage } from '../../storage';\n import Button from '../Button/Button.vue';\n import Checkbox from '../Checkbox/Checkbox.vue';\n import DatePicker from '../DatePicker/DatePicker.vue';\n import Input from '../Input/Input.vue';\n import InputOptions from '../InputOptions/InputOptions.vue';\n import Radio from '../Radio/Radio.vue';\n import Select from '../Select/Select.vue';\n\n export default {\n name: 'll-filters',\n\n components: {\n 'll-button': Button,\n 'll-checkbox': Checkbox,\n 'll-input': Input,\n 'll-input-options': InputOptions,\n 'll-radio': Radio,\n 'll-select': Select,\n DatePicker,\n },\n\n props: {\n /**\n * Whether to disable the Apply button\n */\n disableApply: Boolean,\n /**\n * Whether to disable the Clear button\n */\n disableClear: Boolean,\n /**\n * Whether to disable the sticky filters\n * If disabled, a default pre-selected value(s) can be added to\n * the filter component's attributes\n */\n disablePersistency: Boolean,\n /**\n * Filters schema\n */\n schema: {\n type: Array,\n default: () => [],\n },\n /**\n * Validation schema function that returns an object\n */\n validationSchema: {\n type: Function,\n default: () => () => undefined,\n },\n },\n\n emits: ['change', 'submit', 'reset'],\n\n setup(props) {\n const { validationSchema: getValidationSchema } = toRefs(props);\n const validationSchema = getValidationSchema.value();\n const validationValues = ref({});\n\n // Without ref, `this.validation` will always evaluate to its initial value of `undefined` due to lack of reactivity.\n const validation = ref();\n\n function initValidation() {\n if (validationSchema?.toString() !== '[object Object]') {\n return;\n }\n\n validationValues.value = Object.keys(validationSchema).reduce((values, fieldName) => {\n values[fieldName] = undefined;\n\n return values;\n }, {});\n\n const validationRules = Object.entries(validationSchema).reduce((rules, [fieldName, fieldRules]) => {\n rules[fieldName] = fieldRules.map((fieldRule) => {\n return fieldRule(validationValues);\n });\n\n return rules;\n }, {});\n\n validation.value = useValidation({ rules: validationRules, values: validationValues });\n validation.value.validate();\n }\n\n return {\n validation,\n validationValues,\n initValidation,\n };\n },\n\n data() {\n return {\n applyText: t('ll.apply'),\n clearText: t('ll.clear'),\n filters: {},\n filterValues: {},\n forceRenderCount: 0,\n };\n },\n\n watch: {\n filterValues: {\n /**\n * Maps filters to a partcular object structure:\n * @param {IFilterSchemaItem} newFilterValues all selected filters\n * @returns {IFilter}\n */\n handler: function (newFilterValues) {\n const filters = Object.keys(newFilterValues).reduce((acc, i) => {\n const schema = this.schema[i];\n\n if (!schema || !schema.fieldToFilter) {\n return acc;\n }\n\n const item = newFilterValues[i];\n\n // Ignore empty string or undefined/null filter values\n if (item === '' || item == null) {\n return acc;\n }\n\n const trackBy = schema.attributes.trackBy || 'id';\n const isObject = typeof item === 'object';\n const isCustomFilterComponent = typeof schema.type === 'object';\n // TODO: remove handling of schema.attributes.multiple when we remove the vue-multiselect version of Select\n const isMultiple =\n (isCustomFilterComponent && schema.attributes.multiple) ||\n (!isCustomFilterComponent &&\n schema.type.includes('ll-select') &&\n (schema.attributes.multiple || !schema.attributes.single));\n const filterBy = isMultiple\n ? // local storage might have item stored as an object from the old Select\n (Array.isArray(item) ? item : [item]).map((v) => v[trackBy])\n : isObject\n ? [item[trackBy]]\n : [item];\n\n const groupedWith = schema.groupedWith;\n\n if (groupedWith) {\n filterBy[0] = {\n index: groupedWith,\n value: newFilterValues[groupedWith],\n };\n filterBy.push({\n index: Number(i),\n value: newFilterValues[i],\n });\n }\n\n filterBy.length &&\n (acc[schema.fieldToFilter] = {\n // don't add to `filters` if no filterBy\n filterBy,\n filterType: schema.type, // Informs the applied filter count\n isMultiple,\n ...('fn' in schema && { customFilter: schema.fn }),\n });\n\n return acc;\n }, {});\n\n this.filters = filters;\n this.$emit('change', filters);\n },\n\n deep: true,\n immediate: true,\n },\n\n filters() {\n if (this.validation) {\n this.updateValidationValues();\n }\n },\n },\n\n async created() {\n // initFilterValues updates the filterValues so using await nextTick() forces the code\n // after it to wait until nextTick is done, at which point the filterValues will\n // be done initializing. Otherwise, applyFilters sometimes applies the wrong\n // filters because filterValues is not done updating.\n this.initFilterValues();\n await nextTick();\n this.initValidation();\n this.applyFilters({ trigger: LLLV_CHANGE_TRIGGERS.LOAD });\n },\n\n methods: {\n initFilterValues() {\n if (this.disablePersistency) {\n this.filterValues = this.getDefaultFilterValues();\n\n return;\n }\n\n this.filterValues = this.getPersistentFilterValues() || this.getDefaultFilterValues();\n },\n\n /**\n * Apply the selected filters and save them to localStorage.\n * ListView calls this method using a ref to Filters.\n * The trigger option is used in ListView.\n * @param {object} [options] - optional parameters\n * @param {string} [options.trigger] - the action that triggered this function call\n */\n async applyFilters({ trigger = LLLV_CHANGE_TRIGGERS.APPLY } = {}) {\n if (this.validation) {\n await this.validation.validate();\n\n if (this.validation.hasErrors) {\n return;\n }\n }\n\n if (!this.disablePersistency) {\n this.persistFilterValues(this.filterValues);\n }\n\n this.$emit('submit', { trigger });\n },\n\n resetFilters() {\n this.filterValues = this.getDefaultFilterValues();\n\n this.forceRenderCount++;\n\n if (!this.disablePersistency) {\n this.persistFilterValues(this.filterValues);\n }\n\n // Emit after filters are updated\n this.$nextTick(() => {\n this.$emit('reset');\n });\n },\n\n /**\n * Returns pre-defined filter values to become the default values\n */\n getDefaultFilterValues() {\n return this.schema.reduce((acc, item, filterIndex) => {\n if (item.type === 'll-checkbox') {\n acc[filterIndex] = item.attributes.checked || false;\n } else if (Object.prototype.hasOwnProperty.call(item.attributes, 'modelValue')) {\n acc[filterIndex] = item.attributes.modelValue;\n }\n\n return acc;\n }, {});\n },\n\n /**\n * Intended for external use, when filter values need to be set for the user\n */\n setFilterValues(newValues) {\n this.filterValues = merge({}, this.filterValues, newValues);\n this.forceRenderCount++;\n },\n\n updateValidationValues() {\n const validatable = Object.keys(this.validationSchema());\n\n this.schema.forEach((fieldSchema, filterIndex) => {\n const fieldToFilter = fieldSchema.fieldToFilter;\n const validate = validatable.includes(fieldToFilter);\n\n if (validate) {\n const filter = this.filters[fieldToFilter];\n\n /**\n * Get all validatable fields.\n * Use parsed value of filters that are set,\n * otherwise fall back to `filterValue` value if not set.\n */\n const filterValue = filter\n ? filter.isMultiple\n ? filter.filterBy\n : filter.filterBy[0]\n : this.filterValues[filterIndex];\n\n this.validationValues[fieldToFilter] = filterValue;\n }\n });\n },\n\n /**\n * Change handler for filter fields\n */\n onChange(filter, filterValues, filterIndex) {\n if (filter.on?.change) {\n // Maps to `on.change` handlers in the filter schema.\n filter.on.change(filterValues, filterIndex);\n }\n },\n\n /**\n * Select input event handler for filter fields\n */\n onSelectInput(newValue, filter, filterIndex) {\n if (newValue === undefined) {\n delete this.filterValues[filterIndex]; // prevent undefined filterValues which cause an empty result list\n } else {\n this.filterValues[filterIndex] = newValue;\n }\n\n this.onChange(filter, this.filterValues, filterIndex);\n },\n\n /**\n * Get filter values from local storage.\n * @returns {any}\n */\n getPersistentFilterValues() {\n return persistentStorage.get('filter-values');\n },\n\n /**\n * Clone new filterValues to remove reactivity, and save them to localStorage.\n * @param {object} newValues - the filterValues to be persisted in localStorage\n */\n persistFilterValues(newValues) {\n persistentStorage.set('filter-values', cloneDeep(newValues));\n },\n },\n };\n</script>\n\n<template>\n <div class=\"ll-grid ll-grid-cols-4 md:ll-grid-cols-12\">\n <template v-for=\"(filter, filterIndex) in schema\">\n <div\n v-if=\"!filter.hidden\"\n :key=\"`${filterIndex} ${forceRenderCount}`\"\n class=\"field-wrapper col-span-4 md:col-span-3\"\n :class=\"{ 'hidden-sm-only': !filter.type, 'flex align-bottom': filter.type === 'll-checkbox' }\"\n :data-test=\"`filter|${filter.fieldToFilter}`\"\n >\n <!-- Filter component -->\n <ll-select\n v-if=\"filter.type === 'll-select'\"\n v-bind=\"filter.attributes\"\n :error=\"validation?.fields[filter.fieldToFilter] && validation?.getError(filter.fieldToFilter)\"\n :label=\"filter.label\"\n :model-value=\"filterValues[filterIndex]\"\n @update:model-value=\"(newValue) => onSelectInput(newValue, filter, filterIndex)\"\n />\n <ll-checkbox\n v-else-if=\"filter.type === 'll-checkbox'\"\n v-model:checked=\"filterValues[filterIndex]\"\n v-bind=\"filter.attributes\"\n :error-text=\"validation?.fields[filter.fieldToFilter] && validation?.getError(filter.fieldToFilter)\"\n :label=\"filter.label\"\n @update:checked=\"onChange(filter, filterValues, filterIndex)\"\n />\n <ll-radio\n v-else-if=\"filter.type === 'll-radio'\"\n v-model:checked=\"filterValues[filterIndex]\"\n v-bind=\"filter.attributes\"\n :error-text=\"validation?.fields[filter.fieldToFilter] && validation?.getError(filter.fieldToFilter)\"\n :label=\"filter.label\"\n @update:checked=\"onChange(filter, filterValues, filterIndex)\"\n />\n <component\n v-bind=\"filter.attributes\"\n :is=\"filter.type\"\n v-else-if=\"filter.type\"\n v-model=\"filterValues[filterIndex]\"\n :error-text=\"validation?.fields[filter.fieldToFilter] && validation?.getError(filter.fieldToFilter)\"\n :label=\"filter.label\"\n @update:model-value=\"onChange(filter, filterValues, filterIndex)\"\n >\n <template v-if=\"filter.slots && filter.slots.selected\" #selected=\"{ option }\">\n <component :is=\"filter.slots.selected\" v-bind=\"option.props\" />\n </template>\n <template v-if=\"filter.slots && filter.slots.option\" #option=\"{ option }\">\n <component :is=\"filter.slots.option\" v-bind=\"option.props\" />\n </template>\n <template v-if=\"filter.slots && filter.slots.prepend\" #prepend>\n <span v-html=\"filter.slots.prepend\"></span>\n </template>\n <template v-if=\"filter.slots && filter.slots.append\" #append>\n <span v-html=\"filter.slots.append\"></span>\n </template>\n </component>\n </div>\n </template>\n <div\n class=\"flex align-right align-bottom button-grid col-span-4 md:col-span-12\"\n :class=\"$style['filter-button-group']\"\n >\n <ll-button secondary data-test=\"button|reset-filters\" :disabled=\"disableClear\" @click=\"resetFilters\">\n {{ clearText }}\n </ll-button>\n <ll-button\n primary\n data-test=\"button|apply-filters\"\n :disabled=\"disableApply || validation?.hasErrors\"\n @click=\"applyFilters\"\n >\n {{ applyText }}\n </ll-button>\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" module>\n .filter-button-group {\n @include breakpoint('sm-only') {\n display: flex;\n flex-direction: column-reverse;\n }\n\n button {\n @include breakpoint('sm-only') {\n width: 100% !important;\n }\n\n &:nth-child(2) {\n @include breakpoint('sm-only') {\n margin-bottom: space(2);\n }\n }\n }\n }\n</style>\n"],"names":["_sfc_main","Button","Checkbox","Input","InputOptions","Radio","Select","DatePicker","props","getValidationSchema","toRefs","validationSchema","validationValues","ref","validation","initValidation","values","fieldName","validationRules","rules","fieldRules","fieldRule","useValidation","t","newFilterValues","filters","acc","schema","item","trackBy","isObject","isCustomFilterComponent","isMultiple","filterBy","v","groupedWith","nextTick","LLLV_CHANGE_TRIGGERS","trigger","filterIndex","newValues","merge","validatable","fieldSchema","fieldToFilter","filter","filterValue","filterValues","_a","newValue","persistentStorage","cloneDeep","_hoisted_1","_openBlock","_createElementBlock","_Fragment","_renderList","$props","$data","_normalizeClass","_createBlock","_component_ll_select","_mergeProps","$setup","_b","$options","_component_ll_checkbox","$event","_c","_d","_component_ll_radio","_e","_f","_resolveDynamicComponent","_g","_h","_withCtx","option","_normalizeProps","_guardReactiveProps","_createElementVNode","_ctx","_createVNode","_component_ll_button"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Filters.js","sources":["../src/components/Filters/Filters.vue"],"sourcesContent":["<script>\n import cloneDeep from 'lodash-es/cloneDeep';\n import merge from 'lodash-es/merge';\n import { nextTick, ref, toRefs } from 'vue';\n\n import useValidation from '../../composables/useValidation/useValidation';\n import { LLLV_CHANGE_TRIGGERS } from '../../constants';\n import { t } from '../../locale';\n import { persistentStorage } from '../../storage';\n import Button from '../Button/Button.vue';\n import Checkbox from '../Checkbox/Checkbox.vue';\n import DatePicker from '../DatePicker/DatePicker.vue';\n import Input from '../Input/Input.vue';\n import InputOptions from '../InputOptions/InputOptions.vue';\n import Radio from '../Radio/Radio.vue';\n import Select from '../Select/Select.vue';\n\n export default {\n name: 'll-filters',\n\n components: {\n 'll-button': Button,\n 'll-checkbox': Checkbox,\n 'll-input': Input,\n 'll-input-options': InputOptions,\n 'll-radio': Radio,\n 'll-select': Select,\n DatePicker,\n },\n\n props: {\n /**\n * Whether to disable the Apply button\n */\n disableApply: Boolean,\n /**\n * Whether to disable the Clear button\n */\n disableClear: Boolean,\n /**\n * Whether to disable the sticky filters\n * If disabled, a default pre-selected value(s) can be added to\n * the filter component's attributes\n */\n disablePersistency: Boolean,\n /**\n * Filters schema\n */\n schema: {\n type: Array,\n default: () => [],\n },\n /**\n * Validation schema function that returns an object\n */\n validationSchema: {\n type: Function,\n default: () => () => undefined,\n },\n },\n\n emits: ['change', 'submit', 'reset'],\n\n setup(props) {\n const { validationSchema: getValidationSchema } = toRefs(props);\n const validationSchema = getValidationSchema.value();\n const validationValues = ref({});\n\n // Without ref, `this.validation` will always evaluate to its initial value of `undefined` due to lack of reactivity.\n const validation = ref();\n\n function initValidation() {\n if (validationSchema?.toString() !== '[object Object]') {\n return;\n }\n\n validationValues.value = Object.keys(validationSchema).reduce((values, fieldName) => {\n values[fieldName] = undefined;\n\n return values;\n }, {});\n\n const validationRules = Object.entries(validationSchema).reduce((rules, [fieldName, fieldRules]) => {\n rules[fieldName] = fieldRules.map((fieldRule) => {\n return fieldRule(validationValues);\n });\n\n return rules;\n }, {});\n\n validation.value = useValidation({ rules: validationRules, values: validationValues });\n validation.value.validate();\n }\n\n return {\n validation,\n validationValues,\n initValidation,\n };\n },\n\n data() {\n return {\n applyText: t('ll.apply'),\n clearText: t('ll.clear'),\n filters: {},\n filterValues: {},\n forceRenderCount: 0,\n };\n },\n\n watch: {\n filterValues: {\n /**\n * Maps filters to a partcular object structure:\n * @param {IFilterSchemaItem} newFilterValues all selected filters\n * @returns {IFilter}\n */\n handler: function (newFilterValues) {\n const filters = Object.keys(newFilterValues).reduce((acc, i) => {\n const schema = this.schema[i];\n\n if (!schema || !schema.fieldToFilter) {\n return acc;\n }\n\n const item = newFilterValues[i];\n\n // Ignore empty string or undefined/null filter values\n if (item === '' || item == null) {\n return acc;\n }\n\n const trackBy = schema.attributes.trackBy || 'id';\n const isObject = typeof item === 'object';\n const isCustomFilterComponent = typeof schema.type === 'object';\n // TODO: remove handling of schema.attributes.multiple when we remove the vue-multiselect version of Select\n const isMultiple =\n (isCustomFilterComponent && schema.attributes.multiple) ||\n (!isCustomFilterComponent &&\n schema.type.includes('ll-select') &&\n (schema.attributes.multiple || !schema.attributes.single));\n const filterBy = isMultiple\n ? // local storage might have item stored as an object from the old Select\n (Array.isArray(item) ? item : [item]).map((v) => v[trackBy])\n : isObject\n ? [item[trackBy]]\n : [item];\n\n const groupedWith = schema.groupedWith;\n\n if (groupedWith) {\n filterBy[0] = {\n index: groupedWith,\n value: newFilterValues[groupedWith],\n };\n filterBy.push({\n index: Number(i),\n value: newFilterValues[i],\n });\n }\n\n filterBy.length &&\n (acc[schema.fieldToFilter] = {\n // don't add to `filters` if no filterBy\n filterBy,\n filterType: schema.type, // Informs the applied filter count\n isMultiple,\n ...('fn' in schema && { customFilter: schema.fn }),\n });\n\n return acc;\n }, {});\n\n this.filters = filters;\n this.$emit('change', filters);\n },\n\n deep: true,\n immediate: true,\n },\n\n filters() {\n if (this.validation) {\n this.updateValidationValues();\n }\n },\n },\n\n async created() {\n // initFilterValues updates the filterValues so using await nextTick() forces the code\n // after it to wait until nextTick is done, at which point the filterValues will\n // be done initializing. Otherwise, applyFilters sometimes applies the wrong\n // filters because filterValues is not done updating.\n this.initFilterValues();\n await nextTick();\n this.initValidation();\n this.applyFilters({ trigger: LLLV_CHANGE_TRIGGERS.LOAD });\n },\n\n methods: {\n initFilterValues() {\n if (this.disablePersistency) {\n this.filterValues = this.getDefaultFilterValues();\n\n return;\n }\n\n this.filterValues = this.getPersistentFilterValues() || this.getDefaultFilterValues();\n },\n\n /**\n * Apply the selected filters and save them to localStorage.\n * ListView calls this method using a ref to Filters.\n * The trigger option is used in ListView.\n * @param {object} [options] - optional parameters\n * @param {string} [options.trigger] - the action that triggered this function call\n */\n async applyFilters({ trigger = LLLV_CHANGE_TRIGGERS.APPLY } = {}) {\n if (this.validation) {\n await this.validation.validate();\n\n if (this.validation.hasErrors) {\n return;\n }\n }\n\n if (!this.disablePersistency) {\n this.persistFilterValues(this.filterValues);\n }\n\n this.$emit('submit', { trigger });\n },\n\n resetFilters() {\n this.filterValues = this.getDefaultFilterValues();\n\n this.forceRenderCount++;\n\n if (!this.disablePersistency) {\n this.persistFilterValues(this.filterValues);\n }\n\n // Emit after filters are updated\n this.$nextTick(() => {\n this.$emit('reset');\n });\n },\n\n /**\n * Returns pre-defined filter values to become the default values\n */\n getDefaultFilterValues() {\n return this.schema.reduce((acc, item, filterIndex) => {\n if (item.type === 'll-checkbox') {\n acc[filterIndex] = item.attributes.checked || false;\n } else if (Object.prototype.hasOwnProperty.call(item.attributes, 'modelValue')) {\n acc[filterIndex] = item.attributes.modelValue;\n }\n\n return acc;\n }, {});\n },\n\n /**\n * Intended for external use, when filter values need to be set for the user\n */\n setFilterValues(newValues) {\n this.filterValues = merge({}, this.filterValues, newValues);\n this.forceRenderCount++;\n },\n\n updateValidationValues() {\n const validatable = Object.keys(this.validationSchema());\n\n this.schema.forEach((fieldSchema, filterIndex) => {\n const fieldToFilter = fieldSchema.fieldToFilter;\n const validate = validatable.includes(fieldToFilter);\n\n if (validate) {\n const filter = this.filters[fieldToFilter];\n\n /**\n * Get all validatable fields.\n * Use parsed value of filters that are set,\n * otherwise fall back to `filterValue` value if not set.\n */\n const filterValue = filter\n ? filter.isMultiple\n ? filter.filterBy\n : filter.filterBy[0]\n : this.filterValues[filterIndex];\n\n this.validationValues[fieldToFilter] = filterValue;\n }\n });\n },\n\n /**\n * Change handler for filter fields\n */\n onChange(filter, filterValues, filterIndex) {\n if (filter.on?.change) {\n // Maps to `on.change` handlers in the filter schema.\n filter.on.change(filterValues, filterIndex);\n }\n },\n\n /**\n * Select input event handler for filter fields\n */\n onSelectInput(newValue, filter, filterIndex) {\n if (newValue === undefined) {\n delete this.filterValues[filterIndex]; // prevent undefined filterValues which cause an empty result list\n } else {\n this.filterValues[filterIndex] = newValue;\n }\n\n this.onChange(filter, this.filterValues, filterIndex);\n },\n\n /**\n * Get filter values from local storage.\n * @returns {any}\n */\n getPersistentFilterValues() {\n return persistentStorage.get('filter-values');\n },\n\n /**\n * Clone new filterValues to remove reactivity, and save them to localStorage.\n * @param {object} newValues - the filterValues to be persisted in localStorage\n */\n persistFilterValues(newValues) {\n persistentStorage.set('filter-values', cloneDeep(newValues));\n },\n },\n };\n</script>\n\n<template>\n <div class=\"ll-grid ll-grid-cols-4 md:ll-grid-cols-12\">\n <template v-for=\"(filter, filterIndex) in schema\">\n <div\n v-if=\"!filter.hidden\"\n :key=\"`${filterIndex} ${forceRenderCount}`\"\n class=\"field-wrapper col-span-4 md:col-span-3\"\n :class=\"{ 'hidden-sm-only': !filter.type, 'flex align-bottom': filter.type === 'll-checkbox' }\"\n :data-test=\"`filter|${filter.fieldToFilter}`\"\n >\n <!-- Filter component -->\n <ll-select\n v-if=\"filter.type === 'll-select'\"\n v-bind=\"filter.attributes\"\n :error=\"validation?.fields[filter.fieldToFilter] && validation?.getError(filter.fieldToFilter)\"\n :label=\"filter.label\"\n :model-value=\"filterValues[filterIndex]\"\n @update:model-value=\"(newValue) => onSelectInput(newValue, filter, filterIndex)\"\n />\n <ll-checkbox\n v-else-if=\"filter.type === 'll-checkbox'\"\n v-model:checked=\"filterValues[filterIndex]\"\n v-bind=\"filter.attributes\"\n :error-text=\"validation?.fields[filter.fieldToFilter] && validation?.getError(filter.fieldToFilter)\"\n :label=\"filter.label\"\n @update:checked=\"onChange(filter, filterValues, filterIndex)\"\n />\n <ll-radio\n v-else-if=\"filter.type === 'll-radio'\"\n v-model:checked=\"filterValues[filterIndex]\"\n v-bind=\"filter.attributes\"\n :error-text=\"validation?.fields[filter.fieldToFilter] && validation?.getError(filter.fieldToFilter)\"\n :label=\"filter.label\"\n @update:checked=\"onChange(filter, filterValues, filterIndex)\"\n />\n <component\n v-bind=\"filter.attributes\"\n :is=\"filter.type\"\n v-else-if=\"filter.type\"\n v-model=\"filterValues[filterIndex]\"\n :error-text=\"validation?.fields[filter.fieldToFilter] && validation?.getError(filter.fieldToFilter)\"\n :label=\"filter.label\"\n @update:model-value=\"onChange(filter, filterValues, filterIndex)\"\n >\n <template v-if=\"filter.slots && filter.slots.selected\" #selected=\"{ option }\">\n <component :is=\"filter.slots.selected\" v-bind=\"option.props\" />\n </template>\n <template v-if=\"filter.slots && filter.slots.option\" #option=\"{ option }\">\n <component :is=\"filter.slots.option\" v-bind=\"option.props\" />\n </template>\n <template v-if=\"filter.slots && filter.slots.prepend\" #prepend>\n <span v-html=\"filter.slots.prepend\"></span>\n </template>\n <template v-if=\"filter.slots && filter.slots.append\" #append>\n <span v-html=\"filter.slots.append\"></span>\n </template>\n </component>\n </div>\n </template>\n <div\n class=\"flex align-right align-bottom button-grid col-span-4 md:col-span-12\"\n :class=\"$style['filter-button-group']\"\n >\n <ll-button secondary data-test=\"button|reset-filters\" :disabled=\"disableClear\" @click=\"resetFilters\">\n {{ clearText }}\n </ll-button>\n <ll-button\n primary\n data-test=\"button|apply-filters\"\n :disabled=\"disableApply || validation?.hasErrors\"\n @click=\"applyFilters\"\n >\n {{ applyText }}\n </ll-button>\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" module>\n .filter-button-group {\n @include breakpoint('sm-only') {\n display: flex;\n flex-direction: column-reverse;\n }\n\n button {\n @include breakpoint('sm-only') {\n width: 100% !important;\n }\n\n &:nth-child(2) {\n @include breakpoint('sm-only') {\n margin-bottom: space(2);\n }\n }\n }\n }\n</style>\n"],"names":["_sfc_main","Button","Checkbox","Input","InputOptions","Radio","Select","DatePicker","props","getValidationSchema","toRefs","validationSchema","validationValues","ref","validation","initValidation","values","fieldName","validationRules","rules","fieldRules","fieldRule","useValidation","t","newFilterValues","filters","acc","schema","item","trackBy","isObject","isCustomFilterComponent","isMultiple","filterBy","v","groupedWith","nextTick","LLLV_CHANGE_TRIGGERS","trigger","filterIndex","newValues","merge","validatable","fieldSchema","fieldToFilter","filter","filterValue","filterValues","_a","newValue","persistentStorage","cloneDeep","_hoisted_1","_openBlock","_createElementBlock","_Fragment","_renderList","$props","$data","_normalizeClass","_createBlock","_component_ll_select","_mergeProps","$setup","_b","$options","_component_ll_checkbox","$event","_c","_d","_component_ll_radio","_e","_f","_resolveDynamicComponent","_g","_h","_withCtx","option","_normalizeProps","_guardReactiveProps","_createElementVNode","_ctx","_createVNode","_component_ll_button"],"mappings":"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"}
|
package/dist/HttpError.js
CHANGED
|
@@ -3,12 +3,9 @@ import { t } from "./locale.js";
|
|
|
3
3
|
import H from "./Button.js";
|
|
4
4
|
import N, { IllustrationType as X, VignetteName as I } from "./Illustration.js";
|
|
5
5
|
import { _ as $ } from "./_plugin-vue_export-helper-dad06003.js";
|
|
6
|
-
import "
|
|
7
|
-
import "./isObjectLike-54341556.js";
|
|
8
|
-
import "./toString-7d5bf363.js";
|
|
9
|
-
import "./_MapCache-65811284.js";
|
|
6
|
+
import "lodash-es/get";
|
|
10
7
|
import "./Button.vue_used_vue_type_style_index_0_lang.module-b77978d6.js";
|
|
11
|
-
import "
|
|
8
|
+
import "lodash-es/uniqueId";
|
|
12
9
|
import "./index-79ce320f.js";
|
|
13
10
|
const z = {
|
|
14
11
|
viewBox: "0 0 139 24",
|
|
@@ -150,8 +147,8 @@ const P = { render: D }, j = { class: "heading-jumbo !tw-text-white tw-m-0 tw-mb
|
|
|
150
147
|
logo: tt
|
|
151
148
|
}, et = {
|
|
152
149
|
$style: ot
|
|
153
|
-
},
|
|
150
|
+
}, ut = /* @__PURE__ */ $(J, [["__cssModules", et]]);
|
|
154
151
|
export {
|
|
155
|
-
|
|
152
|
+
ut as default
|
|
156
153
|
};
|
|
157
154
|
//# sourceMappingURL=HttpError.js.map
|
package/dist/HttpError.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HttpError.js","sources":["../assets/logos/leaflink-white-logo-full.svg?component","../src/components/HttpError/HttpError.vue"],"sourcesContent":["import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock, createStaticVNode as _createStaticVNode } from \"vue\"\n\nconst _hoisted_1 = {\n viewBox: \"0 0 139 24\",\n fill: \"none\",\n xmlns: \"http://www.w3.org/2000/svg\"\n}\nconst _hoisted_2 = /*#__PURE__*/_createStaticVNode(\"<g clip-path=\\\"url(#a)\\\" fill=\\\"#fff\\\"><path d=\\\"M35.265.248h3.883V23.82h-3.883V.248ZM57.586 17.127H45.493c.433 2.143 2.11 3.231 4.422 3.231 1.708 0 3.316-.66 4.254-1.912l2.58 1.945c-1.44 2.242-4.188 3.429-7.036 3.429-4.689 0-8.24-3.231-8.24-8.045 0-4.912 3.752-8.012 8.207-8.012 4.49 0 8.007 3.068 8.007 7.88-.005.496-.038.991-.1 1.483ZM53.8 14.456c-.234-2.11-1.876-3.33-4.053-3.33-2.11 0-3.785.99-4.254 3.33H53.8ZM76.628 8.093V23.82H72.74v-2.407c-1.071 1.648-3.282 2.407-5.196 2.407-4.12 0-7.709-3.132-7.709-8.045 0-4.944 3.552-8.012 7.672-8.012 1.977 0 4.158.758 5.226 2.374V8.09l3.894.002Zm-3.953 7.65c0-2.705-2.278-4.419-4.522-4.419-2.412 0-4.389 1.846-4.389 4.418s1.977 4.484 4.389 4.484c2.378 0 4.522-1.78 4.522-4.484ZM83.997 7.071v1.352h3.484v3.069h-3.484V23.82h-3.882V7.269c0-4.418 2.14-7.089 6.495-7.089h1.843l-1.072 3.56c-2.647 0-3.418 1.452-3.384 3.331ZM91.182.25h3.886v23.57h-3.886V.25ZM97.993 2.983c0-1.352 1.172-2.34 2.546-2.34 1.407 0 2.512.988 2.512 2.34 0 1.319-1.105 2.34-2.512 2.34-1.37 0-2.546-1.021-2.546-2.34Zm.606 5.44h3.886V23.82h-3.886V8.423ZM120.934 15.183v8.637h-3.885v-8.276c0-2.44-1.508-3.692-3.25-3.692-1.776 0-3.984.956-3.984 3.92v8.045h-3.891V8.423h3.886v2.44c.803-1.913 3.249-2.77 4.857-2.77 4.023 0 6.267 2.604 6.267 7.09ZM134.073 23.82l-6.098-6.99v6.99h-3.885V.248h3.885v13.087l4.489-4.912h5.059l-6.365 6.726 7.838 8.67h-4.923ZM7.219 19.014v-4.518L0 23.813h4.195l3.092-3.99a4.958 4.958 0 0 1-.068-.81ZM14.74 22.429a3.8 3.8 0 0 1-2.657-1.095 3.68 3.68 0 0 1-1.097-2.621c0-.03.01-11.764.01-13.665.003-1.747 1.502-3.333 3.442-3.333.87 0 1.706.323 2.343.906A4.876 4.876 0 0 0 14.408.589a4.971 4.971 0 0 0-3.139-.193 4.902 4.902 0 0 0-2.61 1.726 4.771 4.771 0 0 0-1.007 2.932v13.943c0 2.521 2.11 4.802 4.9 4.802a4.905 4.905 0 0 0 2.834-.887c.345-.238.658-.517.932-.831a3.755 3.755 0 0 1-1.578.348Z\\\"></path><path d=\\\"M18.023 19.003v-4.517l-4.23 5.428c-.219.282-.53.481-.883.562-.351.082-.72.04-1.044-.117.265.46.641.848 1.094 1.132a3.338 3.338 0 0 0 3.073.248c.494-.207.929-.53 1.267-.941l.788-1.008a4.672 4.672 0 0 1-.065-.787ZM25.55 22.429a3.8 3.8 0 0 1-2.657-1.094 3.679 3.679 0 0 1-1.096-2.622l.01-13.665c0-1.745 1.5-3.33 3.441-3.33.868.001 1.703.325 2.338.907A4.875 4.875 0 0 0 25.216.594 4.971 4.971 0 0 0 22.077.4a4.902 4.902 0 0 0-2.61 1.724 4.77 4.77 0 0 0-1.01 2.93v13.943c0 2.521 2.111 4.802 4.9 4.802a4.904 4.904 0 0 0 2.835-.887c.345-.238.658-.517.932-.831a3.758 3.758 0 0 1-1.574.348Z\\\"></path><path d=\\\"m26.12 17.93-1.523 1.983c-.219.282-.53.48-.881.562-.352.081-.72.04-1.044-.116.266.46.642.848 1.095 1.132a3.339 3.339 0 0 0 3.073.248c.494-.207.929-.53 1.268-.941l.67-.864-2.657-2.004ZM25.243 2.169c-.547 0-1.084.147-1.553.425a2.99 2.99 0 0 0-1.11 1.151 1.58 1.58 0 0 1 1.973.31 1.52 1.52 0 0 1 .044 1.965L22.23 9.077v5.4l5.02-6.46a4.711 4.711 0 0 0 1.01-2.92 2.943 2.943 0 0 0-.897-2.074 3.038 3.038 0 0 0-2.119-.854ZM14.438 2.169a3.055 3.055 0 0 0-1.551.426 2.99 2.99 0 0 0-1.108 1.15 1.58 1.58 0 0 1 1.97.312 1.52 1.52 0 0 1 .044 1.963l-2.368 3.057v5.4l5.019-6.46a4.713 4.713 0 0 0 1.008-2.92 2.943 2.943 0 0 0-.897-2.073 3.038 3.038 0 0 0-2.117-.855Z\\\"></path></g><defs><clipPath id=\\\"a\\\"><path fill=\\\"#fff\\\" transform=\\\"translate(0 .18)\\\" d=\\\"M0 0h139v23.64H0z\\\"></path></clipPath></defs>\", 2)\nconst _hoisted_4 = [\n _hoisted_2\n]\n\nexport function render(_ctx, _cache) {\n return (_openBlock(), _createElementBlock(\"svg\", _hoisted_1, _hoisted_4))\n}\nexport default { render: render }","<script setup lang=\"ts\">\n import { computed, useCssModule, useSlots } from 'vue';\n\n import LeafLinkLogo from '../../../assets/logos/leaflink-white-logo-full.svg?component';\n import { t } from '../../locale';\n import Button from '../Button/Button.vue';\n import { IllustrationType, VignetteName } from '../Illustration/Illustration.models';\n import Illustration from '../Illustration/Illustration.vue';\n\n type ErrorCodes = 401 | 403 | 404 | 405 | 500 | 502 | 503 | 504;\n const errors: Record<ErrorCodes, { title: string; description: string }> = {\n 401: {\n title: t('ll.httpError.401.title'),\n description: t('ll.httpError.401.description'),\n },\n 403: {\n title: t('ll.httpError.403.title'),\n description: t('ll.httpError.403.description'),\n },\n 404: {\n title: t('ll.httpError.404.title'),\n description: t('ll.httpError.404.description'),\n },\n 405: {\n title: t('ll.httpError.405.title'),\n description: t('ll.httpError.405.description'),\n },\n 500: {\n title: t('ll.httpError.50X.title'),\n description: t('ll.httpError.50X.description'),\n },\n 502: {\n title: t('ll.httpError.50X.title'),\n description: t('ll.httpError.50X.description'),\n },\n 503: {\n title: t('ll.httpError.50X.title'),\n description: t('ll.httpError.50X.description'),\n },\n 504: {\n title: t('ll.httpError.504.title'),\n description: t('ll.httpError.504.description'),\n },\n };\n\n export interface HttpErrorProps {\n /**\n * A description of what possibly happened.\n */\n description?: string;\n\n /**\n * The error code.\n */\n errorCode: keyof typeof errors | `${keyof typeof errors}`;\n\n /**\n * By default, the logout button is visible unless content is provided to the `actions` slot or\n * this prop is `true`.\n */\n hideLogoutButton?: boolean;\n\n /**\n * A callback that will be called when the user clicks the logout button. If not provided,\n * a `logout` event will be emitted.\n */\n onLogout?: () => void;\n\n /**\n * A link to redirect the user to see if a hard refresh fixes the issue.\n */\n retryLink?: string;\n\n /**\n * The error title.\n */\n title?: string;\n }\n\n const props = withDefaults(defineProps<HttpErrorProps>(), {\n description: '',\n errorCode: '404',\n onLogout: undefined,\n hideLogoutButton: false,\n retryLink: undefined,\n title: '',\n });\n\n const classes = useCssModule();\n const slots = useSlots();\n\n const errorCodeStr = computed(() => props.errorCode.toString());\n const errorCodeInt = computed(() => parseInt(errorCodeStr.value, 10));\n const defaultInfoByErrorCode = computed(() => errors[errorCodeInt.value] || errors['500']);\n const errorTitle = computed(() => props.title || defaultInfoByErrorCode.value.title);\n const errorDescription = computed(() => props.description || defaultInfoByErrorCode.value.description);\n\n const showLogoutButton = computed(() => !props.hideLogoutButton && props.onLogout);\n const computedRetryLink = computed(() => props.retryLink || '/');\n</script>\n\n<template>\n <div class=\"stash-http-error tw-min-h-screen tw-px-6 tw-py-12\" :class=\"classes.root\" data-test=\"stash-http-error\">\n <div :class=\"classes.wrapper\">\n <router-link to=\"/\" class=\"tw-mb-8\" :class=\"classes.logo\">\n <LeafLinkLogo width=\"192\" height=\"33\" />\n </router-link>\n\n <div class=\"tw-mb-8 tw-gap-6\" :class=\"classes.content\">\n <div class=\"tw-order-2 lg:tw-order-1\" :class=\"classes.content__text\">\n <h1 class=\"heading-jumbo !tw-text-white tw-m-0 tw-mb-3\">\n {{ errorTitle }}\n </h1>\n <h2 class=\"tw-text-white tw-mb-8\">Error Code: {{ props.errorCode }}</h2>\n <p v-if=\"!props.hideLogoutButton\" class=\"tw-text-white tw-mb-4\">\n {{ errorDescription }} You can <a :href=\"computedRetryLink\" class=\"link\">try again</a> or reach out to\n <a href=\"mailto:support@leaflink.com\" class=\"link\">support@leaflink.com</a> for assistance.\n </p>\n </div>\n <div class=\"tw-order-1 lg:tw-order-2\" :class=\"classes.illustration\">\n <Illustration :size=\"300\" :type=\"IllustrationType.Vignette\" :name=\"VignetteName.SearchStorefront\" />\n </div>\n </div>\n\n <div v-if=\"slots.actions || showLogoutButton\" class=\"tw-flex tw-items-start tw-gap-6\">\n <slot name=\"actions\">\n <Button tertiary @click=\"props.onLogout\">Logout</Button>\n </slot>\n </div>\n </div>\n </div>\n</template>\n\n<style module>\n .root {\n background-color: theme('colors.purple.DEFAULT');\n display: flex;\n height: 100%;\n justify-content: center;\n align-items: center;\n max-width: 100vw;\n }\n\n .wrapper {\n max-width: 100%;\n width: 56rem;\n }\n\n .content {\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n\n .illustration {\n /* width and height similar to figma. */\n width: 300px;\n height: 193px;\n }\n\n @media screen and (width < 1024px) {\n .content {\n flex-wrap: wrap;\n gap: 0;\n }\n\n .illustration {\n margin-bottom: 30px;\n }\n }\n\n @media screen and (width >= 1024px) {\n .content__text {\n max-width: 50vw;\n }\n }\n\n .illustration svg {\n /*\n * We cannot use the same sizes from figma because the illustration would be smaller\n * and it would break alignment. The specified height in figma is 193px but the\n * illustration is 300px, so, (300 - 193) / 2 ~= 53, which keeps it aligned.\n */\n margin-top: -53px;\n }\n\n .logo {\n /* width and height similar to figma. */\n width: 192px;\n height: 33px;\n display: block;\n }\n</style>\n"],"names":["_hoisted_1","_hoisted_2","_createStaticVNode","_hoisted_4","render","_ctx","_cache","_openBlock","_createElementBlock","LeafLinkLogo","errors","classes","useCssModule","slots","useSlots","errorCodeStr","computed","props","errorCodeInt","defaultInfoByErrorCode","errorTitle","errorDescription","showLogoutButton","computedRetryLink"],"mappings":";;;;;;;;;;;;AAEA,MAAMA,IAAa;AAAA,EACjB,SAAS;AAAA,EACT,MAAM;AAAA,EACN,OAAO;AACT,GACMC,IAA0BC,gBAAAA,EAAmB,0pGAA4qG,CAAC,GAC1tGC,IAAa;AAAA,EACjBF;AACF;AAEO,SAASG,EAAOC,GAAMC,GAAQ;AACnC,SAAQC,EAAY,GAAEC,EAAoB,OAAOR,GAAYG,CAAU;AACzE;AACA,MAAeM,IAAA,EAAE,QAAQL,EAAM;;;;;;;;;;;;;;;;;;;;iBCLvBM,IAAqE;AAAA,MACzE,KAAK;AAAA,QACH,OAAO,EAAE,wBAAwB;AAAA,QACjC,aAAa,EAAE,8BAA8B;AAAA,MAC/C;AAAA,MACA,KAAK;AAAA,QACH,OAAO,EAAE,wBAAwB;AAAA,QACjC,aAAa,EAAE,8BAA8B;AAAA,MAC/C;AAAA,MACA,KAAK;AAAA,QACH,OAAO,EAAE,wBAAwB;AAAA,QACjC,aAAa,EAAE,8BAA8B;AAAA,MAC/C;AAAA,MACA,KAAK;AAAA,QACH,OAAO,EAAE,wBAAwB;AAAA,QACjC,aAAa,EAAE,8BAA8B;AAAA,MAC/C;AAAA,MACA,KAAK;AAAA,QACH,OAAO,EAAE,wBAAwB;AAAA,QACjC,aAAa,EAAE,8BAA8B;AAAA,MAC/C;AAAA,MACA,KAAK;AAAA,QACH,OAAO,EAAE,wBAAwB;AAAA,QACjC,aAAa,EAAE,8BAA8B;AAAA,MAC/C;AAAA,MACA,KAAK;AAAA,QACH,OAAO,EAAE,wBAAwB;AAAA,QACjC,aAAa,EAAE,8BAA8B;AAAA,MAC/C;AAAA,MACA,KAAK;AAAA,QACH,OAAO,EAAE,wBAAwB;AAAA,QACjC,aAAa,EAAE,8BAA8B;AAAA,MAC/C;AAAA,IAAA,GA8CIC,IAAUC,KACVC,IAAQC,KAERC,IAAeC,EAAS,MAAMC,EAAM,UAAU,UAAU,GACxDC,IAAeF,EAAS,MAAM,SAASD,EAAa,OAAO,EAAE,CAAC,GAC9DI,IAAyBH,EAAS,MAAMN,EAAOQ,EAAa,KAAK,KAAKR,EAAO,GAAK,CAAC,GACnFU,IAAaJ,EAAS,MAAMC,EAAM,SAASE,EAAuB,MAAM,KAAK,GAC7EE,IAAmBL,EAAS,MAAMC,EAAM,eAAeE,EAAuB,MAAM,WAAW,GAE/FG,IAAmBN,EAAS,MAAM,CAACC,EAAM,oBAAoBA,EAAM,QAAQ,GAC3EM,IAAoBP,EAAS,MAAMC,EAAM,aAAa,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
1
|
+
{"version":3,"file":"HttpError.js","sources":["../assets/logos/leaflink-white-logo-full.svg?component","../src/components/HttpError/HttpError.vue"],"sourcesContent":["import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock, createStaticVNode as _createStaticVNode } from \"vue\"\n\nconst _hoisted_1 = {\n viewBox: \"0 0 139 24\",\n fill: \"none\",\n xmlns: \"http://www.w3.org/2000/svg\"\n}\nconst _hoisted_2 = /*#__PURE__*/_createStaticVNode(\"<g clip-path=\\\"url(#a)\\\" fill=\\\"#fff\\\"><path d=\\\"M35.265.248h3.883V23.82h-3.883V.248ZM57.586 17.127H45.493c.433 2.143 2.11 3.231 4.422 3.231 1.708 0 3.316-.66 4.254-1.912l2.58 1.945c-1.44 2.242-4.188 3.429-7.036 3.429-4.689 0-8.24-3.231-8.24-8.045 0-4.912 3.752-8.012 8.207-8.012 4.49 0 8.007 3.068 8.007 7.88-.005.496-.038.991-.1 1.483ZM53.8 14.456c-.234-2.11-1.876-3.33-4.053-3.33-2.11 0-3.785.99-4.254 3.33H53.8ZM76.628 8.093V23.82H72.74v-2.407c-1.071 1.648-3.282 2.407-5.196 2.407-4.12 0-7.709-3.132-7.709-8.045 0-4.944 3.552-8.012 7.672-8.012 1.977 0 4.158.758 5.226 2.374V8.09l3.894.002Zm-3.953 7.65c0-2.705-2.278-4.419-4.522-4.419-2.412 0-4.389 1.846-4.389 4.418s1.977 4.484 4.389 4.484c2.378 0 4.522-1.78 4.522-4.484ZM83.997 7.071v1.352h3.484v3.069h-3.484V23.82h-3.882V7.269c0-4.418 2.14-7.089 6.495-7.089h1.843l-1.072 3.56c-2.647 0-3.418 1.452-3.384 3.331ZM91.182.25h3.886v23.57h-3.886V.25ZM97.993 2.983c0-1.352 1.172-2.34 2.546-2.34 1.407 0 2.512.988 2.512 2.34 0 1.319-1.105 2.34-2.512 2.34-1.37 0-2.546-1.021-2.546-2.34Zm.606 5.44h3.886V23.82h-3.886V8.423ZM120.934 15.183v8.637h-3.885v-8.276c0-2.44-1.508-3.692-3.25-3.692-1.776 0-3.984.956-3.984 3.92v8.045h-3.891V8.423h3.886v2.44c.803-1.913 3.249-2.77 4.857-2.77 4.023 0 6.267 2.604 6.267 7.09ZM134.073 23.82l-6.098-6.99v6.99h-3.885V.248h3.885v13.087l4.489-4.912h5.059l-6.365 6.726 7.838 8.67h-4.923ZM7.219 19.014v-4.518L0 23.813h4.195l3.092-3.99a4.958 4.958 0 0 1-.068-.81ZM14.74 22.429a3.8 3.8 0 0 1-2.657-1.095 3.68 3.68 0 0 1-1.097-2.621c0-.03.01-11.764.01-13.665.003-1.747 1.502-3.333 3.442-3.333.87 0 1.706.323 2.343.906A4.876 4.876 0 0 0 14.408.589a4.971 4.971 0 0 0-3.139-.193 4.902 4.902 0 0 0-2.61 1.726 4.771 4.771 0 0 0-1.007 2.932v13.943c0 2.521 2.11 4.802 4.9 4.802a4.905 4.905 0 0 0 2.834-.887c.345-.238.658-.517.932-.831a3.755 3.755 0 0 1-1.578.348Z\\\"></path><path d=\\\"M18.023 19.003v-4.517l-4.23 5.428c-.219.282-.53.481-.883.562-.351.082-.72.04-1.044-.117.265.46.641.848 1.094 1.132a3.338 3.338 0 0 0 3.073.248c.494-.207.929-.53 1.267-.941l.788-1.008a4.672 4.672 0 0 1-.065-.787ZM25.55 22.429a3.8 3.8 0 0 1-2.657-1.094 3.679 3.679 0 0 1-1.096-2.622l.01-13.665c0-1.745 1.5-3.33 3.441-3.33.868.001 1.703.325 2.338.907A4.875 4.875 0 0 0 25.216.594 4.971 4.971 0 0 0 22.077.4a4.902 4.902 0 0 0-2.61 1.724 4.77 4.77 0 0 0-1.01 2.93v13.943c0 2.521 2.111 4.802 4.9 4.802a4.904 4.904 0 0 0 2.835-.887c.345-.238.658-.517.932-.831a3.758 3.758 0 0 1-1.574.348Z\\\"></path><path d=\\\"m26.12 17.93-1.523 1.983c-.219.282-.53.48-.881.562-.352.081-.72.04-1.044-.116.266.46.642.848 1.095 1.132a3.339 3.339 0 0 0 3.073.248c.494-.207.929-.53 1.268-.941l.67-.864-2.657-2.004ZM25.243 2.169c-.547 0-1.084.147-1.553.425a2.99 2.99 0 0 0-1.11 1.151 1.58 1.58 0 0 1 1.973.31 1.52 1.52 0 0 1 .044 1.965L22.23 9.077v5.4l5.02-6.46a4.711 4.711 0 0 0 1.01-2.92 2.943 2.943 0 0 0-.897-2.074 3.038 3.038 0 0 0-2.119-.854ZM14.438 2.169a3.055 3.055 0 0 0-1.551.426 2.99 2.99 0 0 0-1.108 1.15 1.58 1.58 0 0 1 1.97.312 1.52 1.52 0 0 1 .044 1.963l-2.368 3.057v5.4l5.019-6.46a4.713 4.713 0 0 0 1.008-2.92 2.943 2.943 0 0 0-.897-2.073 3.038 3.038 0 0 0-2.117-.855Z\\\"></path></g><defs><clipPath id=\\\"a\\\"><path fill=\\\"#fff\\\" transform=\\\"translate(0 .18)\\\" d=\\\"M0 0h139v23.64H0z\\\"></path></clipPath></defs>\", 2)\nconst _hoisted_4 = [\n _hoisted_2\n]\n\nexport function render(_ctx, _cache) {\n return (_openBlock(), _createElementBlock(\"svg\", _hoisted_1, _hoisted_4))\n}\nexport default { render: render }","<script setup lang=\"ts\">\n import { computed, useCssModule, useSlots } from 'vue';\n\n import LeafLinkLogo from '../../../assets/logos/leaflink-white-logo-full.svg?component';\n import { t } from '../../locale';\n import Button from '../Button/Button.vue';\n import { IllustrationType, VignetteName } from '../Illustration/Illustration.models';\n import Illustration from '../Illustration/Illustration.vue';\n\n type ErrorCodes = 401 | 403 | 404 | 405 | 500 | 502 | 503 | 504;\n const errors: Record<ErrorCodes, { title: string; description: string }> = {\n 401: {\n title: t('ll.httpError.401.title'),\n description: t('ll.httpError.401.description'),\n },\n 403: {\n title: t('ll.httpError.403.title'),\n description: t('ll.httpError.403.description'),\n },\n 404: {\n title: t('ll.httpError.404.title'),\n description: t('ll.httpError.404.description'),\n },\n 405: {\n title: t('ll.httpError.405.title'),\n description: t('ll.httpError.405.description'),\n },\n 500: {\n title: t('ll.httpError.50X.title'),\n description: t('ll.httpError.50X.description'),\n },\n 502: {\n title: t('ll.httpError.50X.title'),\n description: t('ll.httpError.50X.description'),\n },\n 503: {\n title: t('ll.httpError.50X.title'),\n description: t('ll.httpError.50X.description'),\n },\n 504: {\n title: t('ll.httpError.504.title'),\n description: t('ll.httpError.504.description'),\n },\n };\n\n export interface HttpErrorProps {\n /**\n * A description of what possibly happened.\n */\n description?: string;\n\n /**\n * The error code.\n */\n errorCode: keyof typeof errors | `${keyof typeof errors}`;\n\n /**\n * By default, the logout button is visible unless content is provided to the `actions` slot or\n * this prop is `true`.\n */\n hideLogoutButton?: boolean;\n\n /**\n * A callback that will be called when the user clicks the logout button. If not provided,\n * a `logout` event will be emitted.\n */\n onLogout?: () => void;\n\n /**\n * A link to redirect the user to see if a hard refresh fixes the issue.\n */\n retryLink?: string;\n\n /**\n * The error title.\n */\n title?: string;\n }\n\n const props = withDefaults(defineProps<HttpErrorProps>(), {\n description: '',\n errorCode: '404',\n onLogout: undefined,\n hideLogoutButton: false,\n retryLink: undefined,\n title: '',\n });\n\n const classes = useCssModule();\n const slots = useSlots();\n\n const errorCodeStr = computed(() => props.errorCode.toString());\n const errorCodeInt = computed(() => parseInt(errorCodeStr.value, 10));\n const defaultInfoByErrorCode = computed(() => errors[errorCodeInt.value] || errors['500']);\n const errorTitle = computed(() => props.title || defaultInfoByErrorCode.value.title);\n const errorDescription = computed(() => props.description || defaultInfoByErrorCode.value.description);\n\n const showLogoutButton = computed(() => !props.hideLogoutButton && props.onLogout);\n const computedRetryLink = computed(() => props.retryLink || '/');\n</script>\n\n<template>\n <div class=\"stash-http-error tw-min-h-screen tw-px-6 tw-py-12\" :class=\"classes.root\" data-test=\"stash-http-error\">\n <div :class=\"classes.wrapper\">\n <router-link to=\"/\" class=\"tw-mb-8\" :class=\"classes.logo\">\n <LeafLinkLogo width=\"192\" height=\"33\" />\n </router-link>\n\n <div class=\"tw-mb-8 tw-gap-6\" :class=\"classes.content\">\n <div class=\"tw-order-2 lg:tw-order-1\" :class=\"classes.content__text\">\n <h1 class=\"heading-jumbo !tw-text-white tw-m-0 tw-mb-3\">\n {{ errorTitle }}\n </h1>\n <h2 class=\"tw-text-white tw-mb-8\">Error Code: {{ props.errorCode }}</h2>\n <p v-if=\"!props.hideLogoutButton\" class=\"tw-text-white tw-mb-4\">\n {{ errorDescription }} You can <a :href=\"computedRetryLink\" class=\"link\">try again</a> or reach out to\n <a href=\"mailto:support@leaflink.com\" class=\"link\">support@leaflink.com</a> for assistance.\n </p>\n </div>\n <div class=\"tw-order-1 lg:tw-order-2\" :class=\"classes.illustration\">\n <Illustration :size=\"300\" :type=\"IllustrationType.Vignette\" :name=\"VignetteName.SearchStorefront\" />\n </div>\n </div>\n\n <div v-if=\"slots.actions || showLogoutButton\" class=\"tw-flex tw-items-start tw-gap-6\">\n <slot name=\"actions\">\n <Button tertiary @click=\"props.onLogout\">Logout</Button>\n </slot>\n </div>\n </div>\n </div>\n</template>\n\n<style module>\n .root {\n background-color: theme('colors.purple.DEFAULT');\n display: flex;\n height: 100%;\n justify-content: center;\n align-items: center;\n max-width: 100vw;\n }\n\n .wrapper {\n max-width: 100%;\n width: 56rem;\n }\n\n .content {\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n\n .illustration {\n /* width and height similar to figma. */\n width: 300px;\n height: 193px;\n }\n\n @media screen and (width < 1024px) {\n .content {\n flex-wrap: wrap;\n gap: 0;\n }\n\n .illustration {\n margin-bottom: 30px;\n }\n }\n\n @media screen and (width >= 1024px) {\n .content__text {\n max-width: 50vw;\n }\n }\n\n .illustration svg {\n /*\n * We cannot use the same sizes from figma because the illustration would be smaller\n * and it would break alignment. The specified height in figma is 193px but the\n * illustration is 300px, so, (300 - 193) / 2 ~= 53, which keeps it aligned.\n */\n margin-top: -53px;\n }\n\n .logo {\n /* width and height similar to figma. */\n width: 192px;\n height: 33px;\n display: block;\n }\n</style>\n"],"names":["_hoisted_1","_hoisted_2","_createStaticVNode","_hoisted_4","render","_ctx","_cache","_openBlock","_createElementBlock","LeafLinkLogo","errors","classes","useCssModule","slots","useSlots","errorCodeStr","computed","props","errorCodeInt","defaultInfoByErrorCode","errorTitle","errorDescription","showLogoutButton","computedRetryLink"],"mappings":";;;;;;;;;AAEA,MAAMA,IAAa;AAAA,EACjB,SAAS;AAAA,EACT,MAAM;AAAA,EACN,OAAO;AACT,GACMC,IAA0BC,gBAAAA,EAAmB,0pGAA4qG,CAAC,GAC1tGC,IAAa;AAAA,EACjBF;AACF;AAEO,SAASG,EAAOC,GAAMC,GAAQ;AACnC,SAAQC,EAAY,GAAEC,EAAoB,OAAOR,GAAYG,CAAU;AACzE;AACA,MAAeM,IAAA,EAAE,QAAQL,EAAM;;;;;;;;;;;;;;;;;;;;iBCLvBM,IAAqE;AAAA,MACzE,KAAK;AAAA,QACH,OAAO,EAAE,wBAAwB;AAAA,QACjC,aAAa,EAAE,8BAA8B;AAAA,MAC/C;AAAA,MACA,KAAK;AAAA,QACH,OAAO,EAAE,wBAAwB;AAAA,QACjC,aAAa,EAAE,8BAA8B;AAAA,MAC/C;AAAA,MACA,KAAK;AAAA,QACH,OAAO,EAAE,wBAAwB;AAAA,QACjC,aAAa,EAAE,8BAA8B;AAAA,MAC/C;AAAA,MACA,KAAK;AAAA,QACH,OAAO,EAAE,wBAAwB;AAAA,QACjC,aAAa,EAAE,8BAA8B;AAAA,MAC/C;AAAA,MACA,KAAK;AAAA,QACH,OAAO,EAAE,wBAAwB;AAAA,QACjC,aAAa,EAAE,8BAA8B;AAAA,MAC/C;AAAA,MACA,KAAK;AAAA,QACH,OAAO,EAAE,wBAAwB;AAAA,QACjC,aAAa,EAAE,8BAA8B;AAAA,MAC/C;AAAA,MACA,KAAK;AAAA,QACH,OAAO,EAAE,wBAAwB;AAAA,QACjC,aAAa,EAAE,8BAA8B;AAAA,MAC/C;AAAA,MACA,KAAK;AAAA,QACH,OAAO,EAAE,wBAAwB;AAAA,QACjC,aAAa,EAAE,8BAA8B;AAAA,MAC/C;AAAA,IAAA,GA8CIC,IAAUC,KACVC,IAAQC,KAERC,IAAeC,EAAS,MAAMC,EAAM,UAAU,UAAU,GACxDC,IAAeF,EAAS,MAAM,SAASD,EAAa,OAAO,EAAE,CAAC,GAC9DI,IAAyBH,EAAS,MAAMN,EAAOQ,EAAa,KAAK,KAAKR,EAAO,GAAK,CAAC,GACnFU,IAAaJ,EAAS,MAAMC,EAAM,SAASE,EAAuB,MAAM,KAAK,GAC7EE,IAAmBL,EAAS,MAAMC,EAAM,eAAeE,EAAuB,MAAM,WAAW,GAE/FG,IAAmBN,EAAS,MAAM,CAACC,EAAM,oBAAoBA,EAAM,QAAQ,GAC3EM,IAAoBP,EAAS,MAAMC,EAAM,aAAa,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|