npm - @adyen/bento-vue2 - Versions diffs - 2.0.0 → 2.0.1 - Mend

@adyen/bento-vue2 2.0.0 → 2.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (52) hide show

package/dist/chunks/{header-with-views.HwbE278X.js.map → header-with-views.BqobE7IF.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"header-with-views.HwbE278X.js","sources":["../../../ui-assets/icons-16/dist/vue/download.vue","../../../ui-assets/icons-16/dist/vue/edit-2.vue","../../../ui-assets/icons-16/dist/vue/heart.vue","../../../ui-assets/icons-16/dist/vue/options-horizontal.vue","../../../ui-assets/icons-16/dist/vue/plus.vue","../../../ui-assets/icons-16/dist/vue/plus-multiple.vue","../../../ui-assets/icons-16/dist/vue/bag.vue","../../../ui-assets/icons-16/dist/vue/car.vue","../../../ui-assets/icons-16/dist/vue/cash-stack.vue","../../../ui-assets/icons-16/dist/vue/cloud.vue","../../../ui-assets/icons-16/dist/vue/diamond.vue","../../../ui-assets/icons-16/dist/vue/education.vue","../../../ui-assets/icons-16/dist/vue/emoticon-happy.vue","../../../ui-assets/icons-16/dist/vue/gambling.vue","../../../ui-assets/icons-16/dist/vue/gaming.vue","../../../ui-assets/icons-16/dist/vue/gift.vue","../../../ui-assets/icons-16/dist/vue/hand-rock.vue","../../../ui-assets/icons-16/dist/vue/hashtag.vue","../../../ui-assets/icons-16/dist/vue/hospitality.vue","../../../ui-assets/icons-16/dist/vue/hourglass.vue","../../../ui-assets/icons-16/dist/vue/leaf.vue","../../../ui-assets/icons-16/dist/vue/lightning.vue","../../../ui-assets/icons-16/dist/vue/lock.vue","../../../ui-assets/icons-16/dist/vue/news.vue","../../../ui-assets/icons-16/dist/vue/notification.vue","../../../ui-assets/icons-16/dist/vue/prize.vue","../../../ui-assets/icons-16/dist/vue/retail.vue","../../../ui-assets/icons-16/dist/vue/shopping-cart.vue","../../../ui-assets/icons-16/dist/vue/sleep.vue","../../../ui-assets/icons-16/dist/vue/stack.vue","../../../ui-assets/icons-16/dist/vue/star.vue","../../../ui-assets/icons-16/dist/vue/support.vue","../../../ui-assets/icons-16/dist/vue/target.vue","../../../ui-assets/icons-16/dist/vue/thumb-down.vue","../../../ui-assets/icons-16/dist/vue/thumb-up.vue","../../../ui-assets/icons-16/dist/vue/travel-bag.vue","../../../ui-assets/icons-16/dist/vue/warning-diamond.vue","../../../ui-assets/icons-16/dist/vue/world.vue","../../src/components/header-with-views/header-with-views.internal.types.ts","../../../ui-assets/icons-16/dist/vue/menu.vue","../../src/components/header-with-views/composables/use-edit-views/use-edit-views.ts","../../src/components/header-with-views/composables/use-drag-and-drop-views/use-drag-and-drop-views.ts","../../src/components/header-with-views/composables/use-responsive-views/use-responsive-views.ts","../../src/components/header-with-views/components/header-with-views-all-views/header-with-views-all-views.vue","../../../ui-assets/icons-16/dist/vue/circle-filled.vue","../../src/components/header-with-views/components/header-with-views-item-edit-form/header-with-views-edit-form.types.ts","../../src/components/header-with-views/components/header-with-views-item-edit-form/header-with-views-edit-form.vue","../../src/components/header-with-views/header-with-views.vue"],"sourcesContent":["\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M2.75 12C2.75 12.6904 3.30964 13.25 4 13.25H12C12.6904 13.25 13.25 12.6904 13.25 12V10.25H14.75V12C14.75 13.5188 13.5188 14.75 12 14.75H4C2.48122 14.75 1.25 13.5188 1.25 12V10.25H2.75V12Z\"/><path fill=\"#001222\" d=\"M8.75 9.18945L11 6.93945L12.0605 8L8 12.0605L3.93945 8L5 6.93945L7.25 9.18945V1.25H8.75V9.18945Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M6.75 2.75H4C3.30965 2.75 2.75002 3.30966 2.75 4V12C2.75 12.6904 3.30964 13.25 4 13.25H12C12.6904 13.25 13.25 12.6904 13.25 12V9.25H14.75V12C14.75 13.5188 13.5188 14.75 12 14.75H4C2.48122 14.75 1.25 13.5188 1.25 12V4C1.25002 2.48123 2.48123 1.25 4 1.25H6.75V2.75Z\"/><path fill=\"#001222\" d=\"M10.1367 2.13574C11.166 1.10695 12.8351 1.10677 13.8643 2.13574C14.8933 3.16488 14.8931 4.834 13.8643 5.86328L8.31152 11.416H4.58398V7.68945L10.1367 2.13574ZM12.8037 3.19629C12.3604 2.75311 11.6407 2.75328 11.1973 3.19629L6.08398 8.30957V9.91602H7.69043L12.8037 4.80273C13.2468 4.35924 13.247 3.63964 12.8037 3.19629Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M8 13.8501L7.65 13.6701C7.39 13.5301 1.25 10.2901 1.25 6.14015C1.25 5.50015 1.4 4.29015 2.4 3.33015C2.61 3.12015 3.73 2.14015 5.39 2.26015C6.41 2.33015 7.33 2.80015 8 3.53015C8.67 2.80015 9.6 2.33015 10.61 2.26015C12.27 2.14015 13.39 3.12015 13.6 3.32015C14.6 4.27015 14.75 5.49015 14.75 6.13015C14.75 10.2801 8.61 13.5301 8.35 13.6601L8 13.8401V13.8501ZM5.11 3.75015C4.16 3.75015 3.51 4.34015 3.43 4.41015C2.84 4.98015 2.75 5.73015 2.75 6.13015C2.75 8.64015 6.26 11.1601 8 12.1401C9.74 11.1501 13.25 8.64015 13.25 6.13015C13.25 5.73015 13.16 4.98015 12.57 4.41015C12.49 4.33015 11.77 3.67015 10.73 3.76015C9.84 3.82015 9.06 4.37015 8.69 5.19015L8.01 6.71015L7.33 5.19015C6.96 4.37015 6.18 3.82015 5.29 3.76015C5.23 3.76015 5.18 3.76015 5.12 3.76015L5.11 3.75015Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M12 8C12 7.60217 12.158 7.22064 12.4393 6.93934C12.7206 6.65803 13.1022 6.5 13.5 6.5C13.7967 6.5 14.0867 6.58797 14.3334 6.75279C14.58 6.91762 14.7723 7.15189 14.8858 7.42597C14.9993 7.70006 15.0291 8.00166 14.9712 8.29264C14.9133 8.58361 14.7704 8.85088 14.5607 9.06066C14.3509 9.27044 14.0836 9.4133 13.7926 9.47118C13.5017 9.52906 13.2001 9.49935 12.926 9.38582C12.6519 9.27229 12.4176 9.08003 12.2528 8.83335C12.088 8.58668 12 8.29667 12 8Z\"/><path fill=\"#001222\" d=\"M0.999999 8C0.999999 8.29667 1.08797 8.58668 1.25279 8.83335C1.41762 9.08003 1.65189 9.27229 1.92597 9.38582C2.20006 9.49935 2.50166 9.52906 2.79263 9.47118C3.08361 9.4133 3.35088 9.27044 3.56066 9.06066C3.77044 8.85088 3.9133 8.58361 3.97118 8.29264C4.02905 8.00166 3.99935 7.70006 3.88582 7.42597C3.77229 7.15189 3.58003 6.91762 3.33335 6.75279C3.08668 6.58797 2.79667 6.5 2.5 6.5C2.10217 6.5 1.72064 6.65803 1.43934 6.93934C1.15803 7.22064 0.999999 7.60217 0.999999 8Z\"/><path fill=\"#001222\" d=\"M6.75279 8.83335C6.58797 8.58668 6.5 8.29667 6.5 8C6.5 7.60217 6.65803 7.22064 6.93934 6.93934C7.22064 6.65803 7.60217 6.5 8 6.5C8.29667 6.5 8.58668 6.58797 8.83335 6.75279C9.08003 6.91762 9.27229 7.15189 9.38582 7.42597C9.49935 7.70006 9.52906 8.00166 9.47118 8.29264C9.4133 8.58361 9.27044 8.85088 9.06066 9.06066C8.85088 9.27044 8.58361 9.4133 8.29263 9.47118C8.00166 9.52906 7.70006 9.49935 7.42597 9.38582C7.15189 9.27229 6.91762 9.08003 6.75279 8.83335Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M8.75 7.25V2.25H7.25V7.25H2.25V8.75H7.25V13.75H8.75V8.75H13.75V7.25H8.75Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#001222\" :clip-path=\"'url(#uia-ui-assets/icons-16-plus_multiple__a' + uuid + ')'\"><path d=\"M10.75 9.25H12.75V10.75H10.75V12.75H9.25V10.75H7.25V9.25H9.25V7.25H10.75V9.25Z\"/><path fill-rule=\"evenodd\" d=\"M9 0.25C10.5188 0.25 11.75 1.48122 11.75 3V4.25H13C14.5188 4.25 15.75 5.48122 15.75 7V13C15.75 14.5188 14.5188 15.75 13 15.75H7C5.48122 15.75 4.25 14.5188 4.25 13V11.75H3C1.48122 11.75 0.25 10.5188 0.25 9V3C0.25 1.48122 1.48122 0.25 3 0.25H9ZM7 5.75C6.30964 5.75 5.75 6.30964 5.75 7V13C5.75 13.6904 6.30964 14.25 7 14.25H13C13.6904 14.25 14.25 13.6904 14.25 13V7C14.25 6.30964 13.6904 5.75 13 5.75H7ZM3 1.75C2.30964 1.75 1.75 2.30964 1.75 3V9C1.75 9.69036 2.30964 10.25 3 10.25H4.25V7C4.25 5.48122 5.48122 4.25 7 4.25H10.25V3C10.25 2.30964 9.69036 1.75 9 1.75H3Z\" clip-rule=\"evenodd\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-plus_multiple__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M5.25 4.25V3C5.25 1.48579 6.48579 0.25 8 0.25C9.51421 0.25 10.75 1.48579 10.75 3V4.25H12.6149L14.9149 15.75H1.08496L3.38496 4.25H5.25ZM6.75 3V4.25H9.25V3C9.25 2.31421 8.68579 1.75 8 1.75C7.31421 1.75 6.75 2.31421 6.75 3ZM4.61467 5.75L2.91467 14.25H8.38496L10.085 5.75H4.61467ZM9.91467 14.25H13.0851L11.4999 6.3238L9.91467 14.25Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#001222\" :clip-path=\"'url(#uia-ui-assets/icons-16-car__a' + uuid + ')'\"><path d=\"M5.75 10.25H3.25V8.75H5.75V10.25Z\"/><path d=\"M12.75 10.25H10.25V8.75H12.75V10.25Z\"/><path d=\"M10.3604 0.75C11.6685 0.750165 12.7941 1.67303 13.0547 2.96094L13.0557 2.96289L13.6143 5.75H15.75V7.25H14.8105L15.75 8.18945V15.25H11.25V13.25H4.75V15.25H0.25V8.18945L1.18945 7.25H0.25V5.75H2.38477L2.94434 2.96289L2.94531 2.95996C3.20547 1.68654 4.32777 0.750167 5.63965 0.75H10.3604ZM1.75 8.81055V13.75H3.25V11.75H12.75V13.75H14.25V8.81055L12.6895 7.25H3.31055L1.75 8.81055ZM5.63965 2.25C5.05195 2.25017 4.53498 2.67362 4.41504 3.25977L3.91504 5.75H12.085L11.585 3.25879L11.5576 3.14941C11.4004 2.6164 10.9146 2.25015 10.3604 2.25H5.63965Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-car__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#001222\" :clip-path=\"'url(#uia-ui-assets/icons-16-cash_stack__a' + uuid + ')'\"><path d=\"M8 2.25C6.48579 2.25 5.25 3.48579 5.25 5C5.25 6.51421 6.48579 7.75 8 7.75C9.51421 7.75 10.75 6.51421 10.75 5C10.75 3.48579 9.51421 2.25 8 2.25ZM6.75 5C6.75 4.31421 7.31421 3.75 8 3.75C8.68579 3.75 9.25 4.31421 9.25 5C9.25 5.68579 8.68579 6.25 8 6.25C7.31421 6.25 6.75 5.68579 6.75 5Z\"/><path d=\"M0.25 0.25H15.75V9.75H0.25V0.25ZM1.75 1.75V8.25H14.25V1.75H1.75Z\"/><path d=\"M15.75 12.75V11.25H0.25V12.75H15.75Z\"/><path d=\"M15.75 15.75V14.25H0.25V15.75H15.75Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-cash_stack__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M10.23 4.29004C9.3156 4.29004 8.51242 4.80018 8.09842 5.55918L7.71295 6.26587L7.03525 5.83145C6.76488 5.65813 6.44513 5.56004 6.1 5.56004C5.10421 5.56004 4.3 6.36425 4.3 7.36004V8.11004H3.55C2.55421 8.11004 1.75 8.91425 1.75 9.91004C1.75 10.9058 2.55421 11.71 3.55 11.71L12.45 11.71C13.4458 11.71 14.25 10.9058 14.25 9.91004V9.90004C14.25 9.12172 13.7547 8.45577 13.0664 8.21937L12.4036 7.99175L12.5858 7.31506C12.6366 7.12648 12.66 6.93285 12.66 6.72004C12.66 5.38272 11.5743 4.29004 10.23 4.29004ZM7.18175 4.24438C7.9021 3.35751 9.0015 2.79004 10.23 2.79004C12.4057 2.79004 14.16 4.55736 14.16 6.72004C14.16 6.83797 14.1552 6.95579 14.145 7.07378C15.113 7.64637 15.75 8.70715 15.75 9.90004V9.91004C15.75 11.7343 14.2742 13.21 12.45 13.21L3.55 13.21C1.72579 13.21 0.25 11.7343 0.25 9.91004C0.25 8.31898 1.37265 6.99297 2.86997 6.68001C3.18293 5.18269 4.50894 4.06004 6.1 4.06004C6.47667 4.06004 6.84115 4.12407 7.18175 4.24438Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-ui-assets/icons-16-diamond__a' + uuid + ')'\"><path fill=\"#001222\" d=\"M11.7637 1.03027C12.8053 1.03027 13.7578 1.61912 14.2236 2.55078L15.8818 5.86719L15.5918 6.24121L8 16.002L0.408203 6.24121L0.118164 5.86719L1.77637 2.55078C2.2422 1.61913 3.19471 1.03027 4.23633 1.03027H11.7637ZM6.11426 6.75L7.99902 12.4062L9.88477 6.75H6.11426ZM2.70508 6.75L5.90234 10.8604L4.53223 6.75H2.70508ZM11.4678 6.75L10.0967 10.8604L13.2939 6.75H11.4678ZM4.23633 2.53027C3.76286 2.53027 3.3299 2.7982 3.11816 3.22168L2.10352 5.25H4.42676L5.78613 2.53027H4.23633ZM6.10254 5.25H9.89648L8.53613 2.53027H7.46289L6.10254 5.25ZM11.5732 5.25H13.8965L12.8818 3.22168C12.6701 2.7982 12.2371 2.53027 11.7637 2.53027H10.2139L11.5732 5.25Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-diamond__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M16 6V11H14.5V6.93652L13.1104 7.80566V12C13.1102 13.5139 11.8742 14.7497 10.3604 14.75H5.62988C4.11584 14.7499 2.88007 13.514 2.87988 12V7.7998L0 6L8 1L16 6ZM4.37988 12C4.38008 12.6856 4.94427 13.2499 5.62988 13.25H10.3604C11.0458 13.2497 11.6102 12.6855 11.6104 12V8.74316L8 11L4.37988 8.7373V12ZM2.83008 6L8 9.23047L13.1699 6L8 2.76953L2.83008 6Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#001222\" :clip-path=\"'url(#uia-ui-assets/icons-16-emoticon_happy__a' + uuid + ')'\"><path d=\"M8 11.25C6.75421 11.25 5.75 10.2458 5.75 9H4.25C4.25 11.0742 5.92579 12.75 8 12.75C10.0742 12.75 11.75 11.0742 11.75 9H10.25C10.25 10.2458 9.24579 11.25 8 11.25Z\"/><path d=\"M5 6.75C4.58421 6.75 4.25 7.08421 4.25 7.5H2.75C2.75 6.25579 3.75579 5.25 5 5.25C6.24421 5.25 7.25 6.25579 7.25 7.5H5.75C5.75 7.08421 5.41579 6.75 5 6.75Z\"/><path d=\"M10.25 7.5C10.25 7.08421 10.5842 6.75 11 6.75C11.4158 6.75 11.75 7.08421 11.75 7.5H13.25C13.25 6.25579 12.2442 5.25 11 5.25C9.75579 5.25 8.75 6.25579 8.75 7.5H10.25Z\"/><path d=\"M8 0.25C3.71579 0.25 0.25 3.71579 0.25 8C0.25 12.2842 3.71579 15.75 8 15.75C12.2842 15.75 15.75 12.2842 15.75 8C15.75 3.71579 12.2842 0.25 8 0.25ZM1.75 8C1.75 4.54421 4.54421 1.75 8 1.75C11.4558 1.75 14.25 4.54421 14.25 8C14.25 11.4558 11.4558 14.25 8 14.25C4.54421 14.25 1.75 11.4558 1.75 8Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-emoticon_happy__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-ui-assets/icons-16-gambling__a' + uuid + ')'\"><path fill=\"#001222\" d=\"M7.25 0.285553C5.66909 0.436349 4.23359 1.05951 3.07538 2.01472L3.04992 1.98926L1.98926 3.04992L2.01472 3.07538C1.05951 4.23359 0.436349 5.66909 0.285553 7.25H0.25V8.75H0.285553C0.436346 10.3309 1.05949 11.7664 2.01468 12.9246L1.98926 12.95L3.04992 14.0106L3.07533 13.9852C4.23355 14.9405 5.66907 15.5636 7.25 15.7144V15.75H8.75V15.7144C10.331 15.5636 11.7665 14.9404 12.9248 13.9852L12.9502 14.0106L14.0109 12.95L13.9854 12.9245C14.9405 11.7663 15.5637 10.3308 15.7144 8.75H15.75V7.25H15.7144C15.5637 5.66913 14.9405 4.23366 13.9853 3.07546L14.0109 3.04992L12.9502 1.98926L12.9247 2.01479C11.7665 1.05954 10.3309 0.436353 8.75 0.285553V0.25H7.25V0.285553ZM12.9187 11.8578L11.1275 10.0666C11.3873 9.67434 11.5766 9.22909 11.6745 8.75H14.206C14.0676 9.91739 13.6097 10.9798 12.9187 11.8578ZM10.0668 11.1273L11.8581 12.9185C10.98 13.6097 9.91751 14.0676 8.75 14.206V11.6745C9.22921 11.5766 9.67456 11.3872 10.0668 11.1273ZM1.79405 7.25C1.93236 6.08255 2.3903 5.02006 3.0814 4.14206L4.87264 5.9333C4.61275 6.32555 4.4234 6.77085 4.32554 7.25H1.79405ZM4.14206 3.0814C5.02006 2.3903 6.08255 1.93236 7.25 1.79405V4.32554C6.77085 4.4234 6.32555 4.61275 5.9333 4.87264L4.14206 3.0814ZM14.206 7.25H11.6745C11.5766 6.77088 11.3873 6.32561 11.1274 5.93339L12.9187 4.14214C13.6097 5.02013 14.0676 6.08259 14.206 7.25ZM10.25 8C10.25 8.62119 9.99617 9.18317 9.58967 9.58967C9.18317 9.99617 8.62119 10.25 8 10.25C7.37881 10.25 6.81683 9.99617 6.41033 9.58967C6.00383 9.18317 5.75 8.62119 5.75 8C5.75 7.37881 6.00383 6.81683 6.41033 6.41033C6.81683 6.00383 7.37881 5.75 8 5.75C8.62119 5.75 9.18317 6.00383 9.58967 6.41033C9.99617 6.81683 10.25 7.37881 10.25 8ZM3.08136 11.8579C2.39028 10.9799 1.93236 9.91743 1.79405 8.75H4.32554C4.42339 9.22913 4.61273 9.67441 4.8726 10.0666L3.08136 11.8579ZM11.858 3.08147L10.0668 4.8727C9.67452 4.61278 9.22919 4.4234 8.75 4.32554V1.79405C9.91749 1.93236 10.98 2.39033 11.858 3.08147ZM7.25 14.206C6.08253 14.0676 5.02002 13.6097 4.14201 12.9186L5.93324 11.1273C6.3255 11.3872 6.77082 11.5766 7.25 11.6745V14.206Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-gambling__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M5.49968 5.25C6.74232 5.25 7.74968 6.25736 7.74968 7.5C7.74968 8.74264 6.74232 9.75 5.49968 9.75C4.25723 9.74978 3.24968 8.7425 3.24968 7.5C3.24968 6.2575 4.25723 5.25022 5.49968 5.25ZM5.49968 6.75C5.08565 6.75022 4.74968 7.08592 4.74968 7.5C4.74968 7.91408 5.08565 8.24978 5.49968 8.25C5.91389 8.25 6.24968 7.91421 6.24968 7.5C6.24968 7.08579 5.91389 6.75 5.49968 6.75Z\"/><path fill=\"#001222\" d=\"M10.9401 7.75C11.2201 7.27002 11.8302 7.09989 12.3102 7.37988C12.7901 7.65989 12.9602 8.27006 12.6803 8.75C12.4004 9.22992 11.7902 9.39993 11.3102 9.12012C10.8302 8.84012 10.6601 8.23 10.9401 7.75Z\"/><path fill=\"#001222\" d=\"M8.69987 7.37988C9.17985 7.1099 9.78997 7.27006 10.07 7.75C10.34 8.23 10.1799 8.85012 9.69987 9.12012C9.2199 9.38997 8.59972 9.22994 8.32975 8.75C8.05991 8.27006 8.22 7.64988 8.69987 7.37988Z\"/><path fill=\"#001222\" d=\"M10.4997 5C11.0497 5 11.4997 5.45 11.4997 6C11.4997 6.55 11.0497 7 10.4997 7C9.94986 6.99977 9.49968 6.54986 9.49968 6C9.49968 5.45014 9.94986 5.00023 10.4997 5Z\"/><path fill=\"#001222\" d=\"M8.74968 2.25H12.1598C13.5856 2.25017 14.7834 3.34511 14.8962 4.76758L15.5671 12.7666L15.5758 12.916C15.6251 14.4583 14.3889 15.7499 12.8298 15.75H12.4499C11.27 15.7499 10.2102 14.9957 9.83757 13.8652L9.46745 12.75H6.55143L6.18132 13.8633L6.18229 13.8643C5.80991 14.9951 4.74998 15.7498 3.56999 15.75H3.18913C1.58008 15.7496 0.314762 14.3738 0.451824 12.7666L1.12175 4.76758L1.12272 4.76562C1.24556 3.34623 2.41796 2.26124 3.83952 2.25098L7.24968 2.25V0.25H8.74968V2.25ZM3.85905 3.75C3.21015 3.7504 2.67349 4.24103 2.61686 4.89453L1.94694 12.8926C1.88439 13.6247 2.45905 14.2496 3.18913 14.25H3.56999C4.10954 14.2498 4.58991 13.9043 4.75749 13.3955L5.46745 11.25H10.5514L11.2614 13.3945C11.429 13.9034 11.9102 14.2499 12.4499 14.25H12.8298C13.5601 14.2499 14.1345 13.6258 14.0719 12.8936L13.402 4.89258V4.8877C13.3525 4.25272 12.8121 3.75017 12.1598 3.75H3.85905Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M10 0.25C11.5142 0.25 12.75 1.48579 12.75 3C12.75 3.45004 12.6385 3.87428 12.4453 4.25H14.75V8.75H13.75V13C13.75 14.5188 12.5188 15.75 11 15.75H5C3.48122 15.75 2.25 14.5188 2.25 13V8.75H1.25V4.25H3.55469C3.3615 3.87428 3.25 3.45004 3.25 3C3.25 1.48579 4.48579 0.25 6 0.25C6.78756 0.25 7.49778 0.586212 8 1.12012C8.50222 0.586212 9.21244 0.25 10 0.25ZM8.75 14.25H11C11.6904 14.25 12.25 13.6904 12.25 13V8.75H8.75V14.25ZM3.75 13C3.75 13.6904 4.30964 14.25 5 14.25H7.25V8.75H3.75V13ZM8.75 7.25H13.25V5.75H8.75V7.25ZM2.75 7.25H7.25V5.75H2.75V7.25ZM6 1.75C5.31421 1.75 4.75 2.31421 4.75 3C4.75 3.68579 5.31421 4.25 6 4.25H7.25V3C7.25 2.31421 6.68579 1.75 6 1.75ZM10 1.75C9.31421 1.75 8.75 2.31421 8.75 3V4.25H10C10.6858 4.25 11.25 3.68579 11.25 3C11.25 2.31421 10.6858 1.75 10 1.75Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M4.17969 0.25C5.29369 0.250066 6.19994 1.15557 6.2002 2.26953V3.50293C6.36912 3.45695 6.54617 3.42973 6.72949 3.42969C7.21332 3.42969 7.65762 3.60125 8.00586 3.88574C8.35205 3.60723 8.79147 3.44054 9.26953 3.44043C9.45359 3.44043 9.63122 3.46738 9.80078 3.51367C9.82025 2.41618 10.7182 1.53027 11.8203 1.53027C12.9342 1.53042 13.8396 2.4359 13.8398 3.5498V13C13.8397 14.5141 12.6039 15.7499 11.0898 15.75H4.91016C3.39602 15.75 2.16029 14.5141 2.16016 13V2.26953C2.16041 1.15569 3.06584 0.250254 4.17969 0.25ZM11.8203 3.03027C11.5347 3.03027 11.3001 3.26423 11.2998 3.5498V8.39062H11.29V8.64062C11.2897 9.75453 10.3835 10.6602 9.26953 10.6602C8.78871 10.66 8.3471 10.4903 8 10.209C7.65292 10.4905 7.21133 10.6601 6.73047 10.6602H4.70996V9.16016H6.73047C7.01602 9.15992 7.24993 8.92523 7.25 8.63965C7.24974 8.35422 7.0159 8.12035 6.73047 8.12012H4.17969C3.89427 8.12037 3.66041 8.35423 3.66016 8.63965V13C3.66029 13.6857 4.22445 14.25 4.91016 14.25H11.0898C11.7755 14.2499 12.3397 13.6856 12.3398 13V3.5498C12.3396 3.26432 12.1058 3.03043 11.8203 3.03027ZM9.26953 4.94043C8.98411 4.94069 8.75026 5.17454 8.75 5.45996V8.64062C8.75037 8.92594 8.98418 9.1599 9.26953 9.16016C9.55509 9.16016 9.78967 8.9261 9.79004 8.64062V5.45996C9.78978 5.17439 9.55516 4.94043 9.26953 4.94043ZM4.17969 1.75C3.89427 1.75026 3.66041 1.98411 3.66016 2.26953V6.68945C3.82606 6.64523 4.00001 6.62016 4.17969 6.62012H4.7002V2.26953C4.69994 1.984 4.46526 1.75007 4.17969 1.75ZM6.72949 4.92969C6.4442 4.92994 6.21042 5.16397 6.20996 5.44922V6.62012H6.73047C6.91019 6.62016 7.08406 6.64521 7.25 6.68945V5.44922C7.24954 5.16381 7.015 4.92969 6.72949 4.92969Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M7.62109 5.84961H9.0957L9.36035 4.25H10.8799L10.6152 5.84961H11.75V7.34961H10.3672L10.1523 8.65039H11.75V10.1504H9.9043L9.63965 11.75H8.12012L8.38477 10.1504H6.89844L6.62988 11.75H5.10938L5.37793 10.1504H4.25V8.65039H5.62988L5.84863 7.34961H4.25V5.84961H6.10156L6.37012 4.25H7.88965L7.62109 5.84961ZM7.15039 8.65039H8.63281L8.84766 7.34961H7.36914L7.15039 8.65039Z\"/><path fill=\"#001222\" d=\"M12 1.25C13.5188 1.25 14.75 2.48122 14.75 4V12C14.75 13.5188 13.5188 14.75 12 14.75H4C2.48122 14.75 1.25 13.5188 1.25 12V4C1.25 2.48122 2.48122 1.25 4 1.25H12ZM4 2.75C3.30964 2.75 2.75 3.30964 2.75 4V12C2.75 12.6904 3.30964 13.25 4 13.25H12C12.6904 13.25 13.25 12.6904 13.25 12V4C13.25 3.30964 12.6904 2.75 12 2.75H4Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M11 4.25C12.5188 4.25 13.75 5.48122 13.75 7V10.25H15.75V14.75H0.25V10.25H2.25V7C2.25 5.48122 3.48122 4.25 5 4.25H11ZM1.75 13.25H14.25V11.75H1.75V13.25ZM5 5.75C4.30964 5.75 3.75 6.30964 3.75 7V10.25H12.25V7C12.25 6.30964 11.6904 5.75 11 5.75H5Z\"/><path fill=\"#001222\" d=\"M10.75 2.75H5.25V1.25H10.75V2.75Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M13.75 1.75H12.75V6C12.75 6.78782 12.4131 7.49775 11.8789 8C12.4131 8.50225 12.75 9.21218 12.75 10V14.25H13.75V15.75H2.25V14.25H3.25V10C3.25 9.21244 3.58621 8.50222 4.12012 8C3.58621 7.49778 3.25 6.78756 3.25 6V1.75H2.25V0.25H13.75V1.75ZM4.75 12.75V14.25H11.25V12.75H4.75ZM4.75 6C4.75 6.68579 5.31421 7.25 6 7.25H6.75V8.75H6C5.31421 8.75 4.75 9.31421 4.75 10V11.25H11.25V10C11.25 9.31421 10.6858 8.75 10 8.75H9.25V7.25H10C10.6858 7.25 11.25 6.68579 11.25 6V1.75H4.75V6Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-ui-assets/icons-16-leaf__a' + uuid + ')'\"><path fill=\"#001222\" d=\"M15.75 8.16992C15.75 8.89401 15.4634 9.59536 14.9395 10.1094L13.1104 11.9404C12.5927 12.458 11.9031 12.75 11.1699 12.75H4.31055L1.53027 15.5303L0.469727 14.4697L3.25 11.6895V4.83008C3.25 4.106 3.53561 3.40366 4.05957 2.88965L5.88965 1.05957C6.40726 0.54198 7.09693 0.25 7.83008 0.25H15.75V8.16992ZM5.81055 11.25H11.1699C11.4967 11.25 11.8074 11.1222 12.0498 10.8799L13.8867 9.04297C13.975 8.957 14.0489 8.85806 14.1064 8.75H8.31055L5.81055 11.25ZM7.25 1.89551C7.14218 1.95356 7.04144 2.02888 6.9502 2.12012L5.11328 3.95703C4.88182 4.1824 4.75 4.49747 4.75 4.83008V10.1895L7.25 7.68945V1.89551ZM9.81055 7.25H14.25V2.81055L9.81055 7.25ZM8.75 6.18945L13.1895 1.75H8.75V6.18945Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-leaf__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M9.75 6.25V0.25H8.63L1.5 9.75H6.25V15.75H7.38L14.5 6.25H9.75ZM4.5 8.25L8.25 3.25V7.75H11.5L7.75 12.75V8.25H4.5Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M8.75 11.75H7.25V8.25H8.75V11.75Z\"/><path fill=\"#001222\" d=\"M8 1.25C9.51878 1.25 10.75 2.48122 10.75 4V5.25H11C12.5188 5.25 13.75 6.48122 13.75 8V12C13.75 13.5188 12.5188 14.75 11 14.75H5C3.48122 14.75 2.25 13.5188 2.25 12V8C2.25 6.48122 3.48122 5.25 5 5.25H5.25V4C5.25 2.48122 6.48122 1.25 8 1.25ZM5 6.75C4.30964 6.75 3.75 7.30964 3.75 8V12C3.75 12.6904 4.30964 13.25 5 13.25H11C11.6904 13.25 12.25 12.6904 12.25 12V8C12.25 7.30964 11.6904 6.75 11 6.75H5ZM8 2.75C7.30964 2.75 6.75 3.30964 6.75 4V5.25H9.25V4C9.25 3.30964 8.69036 2.75 8 2.75Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#001222\" :clip-path=\"'url(#uia-ui-assets/icons-16-news__a' + uuid + ')'\"><path d=\"M12.75 12.75H7.25V6.25H12.75V12.75ZM8.75 11.25H11.25V7.75H8.75V11.25Z\"/><path d=\"M10.75 4.75H7.25V3.25H10.75V4.75Z\"/><path d=\"M13 0.25C14.5188 0.25 15.75 1.48122 15.75 3V13C15.75 14.5188 14.5188 15.75 13 15.75H3.25V15.7363C3.16759 15.7438 3.08435 15.75 3 15.75C1.48122 15.75 0.25 14.5188 0.25 13V8C0.25 6.48122 1.48122 5.25 3 5.25H4.25V3C4.25 1.48122 5.48122 0.25 7 0.25H13ZM3 6.75C2.30964 6.75 1.75 7.30964 1.75 8V13C1.75 13.6904 2.30964 14.25 3 14.25C3.69036 14.25 4.25 13.6904 4.25 13V6.75H3ZM7 1.75C6.30964 1.75 5.75 2.30964 5.75 3V13C5.75 13.4506 5.63935 13.8747 5.44727 14.25H13C13.6904 14.25 14.25 13.6904 14.25 13V3C14.25 2.30964 13.6904 1.75 13 1.75H7Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-news__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\" transform=\"matrix(1 0 0 -1 0 16)\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M7.99047 0.25C6.85765 0.25 5.89704 0.935208 5.47759 1.9044C4.03119 2.68871 2.96599 4.13012 2.7463 5.87663L2.4163 8.50663L2.41589 8.51C2.32636 9.25062 1.98383 9.94416 1.45427 10.4656L1.23047 10.6859V13.75H5.35431C5.68227 14.9019 6.74559 15.75 8 15.75C9.25441 15.75 10.3177 14.9019 10.6457 13.75H14.7305V10.6893L14.5108 10.4697C14.0619 10.0208 13.7524 9.46107 13.6074 8.8473L13.2346 5.8764C13.0151 4.13169 11.9599 2.68854 10.5029 1.90326C10.0831 0.934672 9.12284 0.25 7.99047 0.25ZM13.2305 12.25H2.73047V11.2985C3.37295 10.5734 3.78718 9.66208 3.90483 8.69177L4.23463 6.06337C4.4008 4.74299 5.24843 3.65649 6.3979 3.11951L6.70638 2.97541L6.80095 2.64833C6.95173 2.12691 7.42704 1.75 7.99047 1.75C8.5539 1.75 9.02921 2.12691 9.17999 2.64833L9.27491 2.97662L9.58492 3.12039C10.7406 3.65634 11.5799 4.74095 11.7463 6.0636L11.9705 7.85H11.9451L12.0569 8.69805C12.1842 9.6635 12.5895 10.5649 13.2305 11.2958V12.25ZM7.00274 13.75H8.99726C8.76827 14.0529 8.40537 14.25 8 14.25C7.59463 14.25 7.23173 14.0529 7.00274 13.75Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-ui-assets/icons-16-prize__a' + uuid + ')'\"><path fill=\"#001222\" d=\"M12.75 3.25H15.75V6C15.75 7.51878 14.5188 8.75 13 8.75H12.75V9C12.75 10.5188 11.5188 11.75 10 11.75H8.75V14.25H12.75V15.75H3.25V14.25H7.25V11.75H6C4.48122 11.75 3.25 10.5188 3.25 9V8.75H3C1.48122 8.75 0.25 7.51878 0.25 6V3.25H3.25V0.25H12.75V3.25ZM4.75 9C4.75 9.69036 5.30964 10.25 6 10.25H10C10.6904 10.25 11.25 9.69036 11.25 9V1.75H4.75V9ZM1.75 6C1.75 6.69036 2.30964 7.25 3 7.25H3.25V4.75H1.75V6ZM12.75 7.25H13C13.6904 7.25 14.25 6.69036 14.25 6V4.75H12.75V7.25Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-prize__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M8 1.25C6.48579 1.25 5.25 2.48579 5.25 4H6.75C6.75 3.31421 7.31421 2.75 8 2.75C8.68579 2.75 9.25 3.31421 9.25 4C9.25 4.68579 8.68579 5.25 8 5.25H7.25V7.53638L2.68655 9.8181C1.79233 10.2592 1.25 11.1753 1.25 12.1499C1.25 13.5841 2.41579 14.7499 3.85 14.7499H12.15C13.5842 14.7499 14.75 13.5841 14.75 12.1499C14.75 11.1624 14.1872 10.2689 13.324 9.82338L8.75 7.53638V6.64569C9.90191 6.31773 10.75 5.25441 10.75 4C10.75 2.48579 9.51421 1.25 8 1.25ZM3.35114 11.1629L8 8.83843L12.6398 11.1583C13.0144 11.3534 13.25 11.7388 13.25 12.1499C13.25 12.7557 12.7558 13.2499 12.15 13.2499H3.85C3.24421 13.2499 2.75 12.7557 2.75 12.1499C2.75 11.7253 2.98674 11.3422 3.35114 11.1629Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M6.5 11.25C7.74421 11.25 8.75 12.2558 8.75 13.5C8.75 14.7442 7.74421 15.75 6.5 15.75C5.25579 15.75 4.25 14.7442 4.25 13.5C4.25 12.2558 5.25579 11.25 6.5 11.25ZM6.5 12.75C6.08421 12.75 5.75 13.0842 5.75 13.5C5.75 13.9158 6.08421 14.25 6.5 14.25C6.91579 14.25 7.25 13.9158 7.25 13.5C7.25 13.0842 6.91579 12.75 6.5 12.75Z\"/><path fill=\"#001222\" d=\"M12.5 11.25C13.7442 11.25 14.75 12.2558 14.75 13.5C14.75 14.7442 13.7442 15.75 12.5 15.75C11.2558 15.75 10.25 14.7442 10.25 13.5C10.25 12.2558 11.2558 11.25 12.5 11.25ZM12.5 12.75C12.0842 12.75 11.75 13.0842 11.75 13.5C11.75 13.9158 12.0842 14.25 12.5 14.25C12.9158 14.25 13.25 13.9158 13.25 13.5C13.25 13.0842 12.9158 12.75 12.5 12.75Z\"/><path fill=\"#001222\" d=\"M1.40039 0.25C2.6906 0.25018 3.80556 1.14319 4.08203 2.40723L4.26953 3.25H15.75V8C15.75 9.51421 14.5142 10.75 13 10.75H4.39844L2.61816 2.73242L2.61719 2.72949C2.49243 2.15562 1.98867 1.75018 1.40039 1.75H0.25V0.25H1.40039ZM5.60156 9.25H7.11426L6.36426 4.75H4.60254L5.60156 9.25ZM12.25 9.25H13C13.6858 9.25 14.25 8.68579 14.25 8V4.75H12.25V9.25ZM8.63574 9.25H10.75V4.75H7.88574L8.63574 9.25Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#001222\" :clip-path=\"'url(#uia-ui-assets/icons-16-sleep__a' + uuid + ')'\"><path d=\"M13.81 3.25L15.75 1.31V0.25H11.25V1.75H13.19L11.25 3.69V4.75H15.75V3.25H13.81Z\"/><path d=\"M9.86 9.25H11.69C11.73 9.5 11.75 9.74 11.75 10C11.75 11.14 11.42 12.25 10.78 13.2C10.15 14.14 9.25 14.88 8.2 15.31C7.5 15.6 6.75 15.75 6 15.75C5.63 15.75 5.25 15.71 4.88 15.64C3.76 15.42 2.74 14.87 1.93 14.07C1.13 13.26 0.58 12.24 0.36 11.12C0.14 10 0.25 8.85 0.69 7.8C1.12 6.74 1.86 5.85 2.81 5.22C3.75 4.58 4.86 4.25 6 4.25C6.25 4.25 6.5 4.27 6.75 4.31V6.14C6.61 6.22 6.49 6.33 6.37 6.45C6.1 6.73 5.91 7.08 5.81 7.45C5.72 7.83 5.72 8.23 5.82 8.6C5.93 8.98 6.13 9.32 6.4 9.6C6.68 9.87 7.02 10.07 7.4 10.17C7.77 10.28 8.17 10.28 8.55 10.19C8.92 10.09 9.27 9.9 9.55 9.63C9.67 9.51 9.78 9.39 9.86 9.25ZM7.63 13.93C8.41 13.6 9.07 13.06 9.53 12.36C9.79 11.97 9.99 11.55 10.1 11.11C9.74 11.35 9.34 11.53 8.92 11.64C8.29 11.8 7.63 11.79 7 11.62C6.37 11.45 5.8 11.12 5.34 10.66C4.88 10.2 4.55 9.63 4.38 9C4.21 8.38 4.2 7.71 4.36 7.08C4.47 6.66 4.65 6.26 4.89 5.9C4.45 6.02 4.03 6.21 3.64 6.47C2.94 6.93 2.4 7.59 2.07 8.37C1.75 9.15 1.67 10 1.83 10.83C2 11.66 2.4 12.41 2.99 13C3.59 13.6 4.34 14 5.17 14.17C6 14.33 6.85 14.25 7.63 13.93Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-sleep__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M6.99851 0.329277C7.60965 0.0237045 8.32485 0.0237045 8.936 0.329277L8.94763 0.335092L13.4899 2.80661C14.9132 3.5683 15.0156 5.45081 13.8121 6.36022C14.9426 7.15404 14.8998 8.80801 13.8648 9.65083C15.0545 10.501 14.8976 12.4276 13.573 13.1845L13.5662 13.1883L9.01459 15.665L9.00296 15.6708C8.39181 15.9763 7.67662 15.9763 7.06547 15.6708L7.05384 15.665L2.50223 13.1883L2.49544 13.1845C1.20854 12.4491 1.03328 10.6248 2.18975 9.74196C1.0278 8.92492 0.947607 7.14873 2.15756 6.33584C0.997812 5.42474 1.08812 3.5815 2.42848 2.81558L2.43527 2.81171L6.98688 0.335092L6.99851 0.329277ZM7.67888 1.66624L3.16715 4.12114C2.74814 4.36572 2.74509 4.95731 3.15799 5.20694L4.08079 5.66834L7.16483 7.34445L7.74797 7.66845C7.92526 7.75282 8.12695 7.75503 8.30552 7.67508L8.82242 7.35202L11.9204 5.66834L12.8431 5.20696C13.2441 4.96435 13.2605 4.38426 12.781 4.12853L12.7754 4.12558L8.25563 1.66624C8.07219 1.57805 7.86232 1.57805 7.67888 1.66624ZM7.73281 11.0237C7.90254 11.0878 8.08961 11.0801 8.25519 11.0006L11.9197 9.00179L12.8433 8.53998C13.2912 8.2708 13.2066 7.70823 12.865 7.53744L12.2815 7.2457L9.56162 8.72393L8.95041 9.06348L8.93584 9.07077C8.32469 9.37634 7.60949 9.37634 6.99835 9.07077L6.98377 9.06348L6.37257 8.72393L3.65264 7.2457L3.06917 7.53744C2.72758 7.70823 2.64303 8.2708 3.09087 8.53998L3.80065 8.89487L3.81599 8.88721L7.73281 11.0237ZM3.77974 10.5824L3.20296 10.8708C2.85902 11.0427 2.77566 11.6119 3.234 11.8788L7.74583 14.3338C7.92928 14.422 8.13915 14.422 8.3226 14.3338L12.8343 11.8789C13.049 11.7537 13.1599 11.5393 13.168 11.3144C13.1763 11.0868 13.0815 10.9295 12.9709 10.8568L12.416 10.5794L9.0816 12.3981L9.06963 12.4041C8.45848 12.7097 7.74328 12.7097 7.13214 12.4041L7.12016 12.3981L7.07964 12.376C7.05236 12.3637 7.02525 12.3509 6.99835 12.3374L6.98637 12.3315L3.77974 10.5824Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-ui-assets/icons-16-star__a' + uuid + ')'\"><path fill=\"#001222\" d=\"M7.99981 0.322998L10.4998 5.32304L15.4723 6.15178L11.8252 10.2041L13.1419 15.4004L8.00327 12.8397L2.97162 15.399L4.18057 10.2109L0.527344 6.15178L5.49979 5.32304L7.99981 0.322998ZM7.99981 3.6771L6.49983 6.67706L3.47227 7.18165L5.81904 9.78917L5.16379 12.6011L7.99635 11.1604L10.8848 12.5997L10.1744 9.79603L12.5273 7.18165L9.49979 6.67706L7.99981 3.6771Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-star__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-ui-assets/icons-16-support__a' + uuid + ')'\"><path fill=\"#001222\" d=\"M1.98926 3.04992L2.0153 3.07596C0.878906 4.45704 0.25 6.1961 0.25 8C0.25 9.80388 0.878891 11.5429 2.01525 12.924L1.98926 12.95L3.04992 14.0106L3.0759 13.9847C4.45699 15.1211 6.19607 15.75 8 15.75C9.80396 15.75 11.5431 15.1211 12.9242 13.9846L12.9502 14.0106L14.0109 12.95L13.9848 12.9239C15.1211 11.5429 15.75 9.80384 15.75 8C15.75 6.19613 15.1211 4.45711 13.9848 3.07604L14.0109 3.04992L12.9502 1.98926L12.9241 2.01536C11.543 0.878931 9.80394 0.25 8 0.25C6.1961 0.25 4.45704 0.878906 3.07596 2.0153L3.04992 1.98926L1.98926 3.04992ZM12.9179 11.857L11.0911 10.0302C11.423 9.52647 11.6301 8.94655 11.6895 8.33877C11.7716 7.49946 11.5672 6.65772 11.1107 5.95016L12.9179 4.14291C13.7765 5.23764 14.25 6.59441 14.25 8C14.25 9.40557 13.7765 10.7623 12.9179 11.857ZM10.031 11.0914L11.8573 12.9177C10.7625 13.7765 9.40568 14.25 8 14.25C6.59435 14.25 5.23753 13.7765 4.14278 12.9178L5.94737 11.1132C6.5494 11.5017 7.25334 11.7105 7.97579 11.7099C8.71206 11.7093 9.42572 11.4912 10.031 11.0914ZM1.75 8C1.75 6.59437 2.2235 5.23757 3.08217 4.14283L4.85612 5.91678C4.7921 6.01372 4.73242 6.11393 4.67735 6.21715C4.27061 6.97954 4.14082 7.85938 4.31009 8.70673C4.40771 9.19546 4.60134 9.65594 4.876 10.0632L3.08213 11.8571C2.22348 10.7624 1.75 9.4056 1.75 8ZM6.63778 6.18271C6.78433 6.07359 6.94467 5.98212 7.11574 5.91111C7.59328 5.71288 8.12479 5.68638 8.61968 5.83612C9.11457 5.98585 9.54224 6.30256 9.82979 6.73228C10.1173 7.16199 10.247 7.67812 10.1967 8.19272C10.1463 8.70731 9.91909 9.18853 9.55371 9.55437C9.13501 9.97359 8.56697 10.2094 7.97447 10.2099C7.45742 10.2104 6.9562 10.0315 6.55624 9.70383C6.15628 9.37616 5.88231 8.91993 5.78102 8.4129C5.67974 7.90587 5.7574 7.3794 6.00078 6.92321C6.05366 6.82409 6.11366 6.72962 6.18007 6.64042L6.63778 6.18271ZM4.14283 3.08217C5.23757 2.2235 6.59438 1.75 8 1.75C9.40566 1.75 10.7625 2.22352 11.8573 3.08224L10.0608 4.87873C9.75322 4.67132 9.41431 4.50939 9.05408 4.40039C8.227 4.15015 7.33875 4.19445 6.54067 4.52572C6.3216 4.61666 6.11304 4.72767 5.91732 4.85666L4.14283 3.08217Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-support__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M2.25 0.25H4.31066L5.70908 1.64842C6.42437 1.39051 7.19811 1.25 8 1.25C11.7242 1.25 14.75 4.27579 14.75 8C14.75 11.7242 11.7242 14.75 8 14.75C4.27579 14.75 1.25 11.7242 1.25 8C1.25 7.19811 1.39051 6.42437 1.64842 5.70908L0.25 4.31066V2.25H2.25V0.25ZM6.75 4.46261C7.14081 4.32489 7.5615 4.25 8 4.25C10.0742 4.25 11.75 5.92579 11.75 8C11.75 10.0742 10.0742 11.75 8 11.75C5.92579 11.75 4.25 10.0742 4.25 8C4.25 7.5615 4.32489 7.14081 4.46261 6.75H2.89933C2.8019 7.15004 2.75 7.56922 2.75 8C2.75 10.8958 5.10421 13.25 8 13.25C10.8958 13.25 13.25 10.8958 13.25 8C13.25 5.10421 10.8958 2.75 8 2.75C7.56922 2.75 7.15004 2.8019 6.75 2.89933V4.46261ZM5.96848 7.02914C5.82837 7.32282 5.75 7.65198 5.75 8C5.75 9.24579 6.75421 10.25 8 10.25C9.24579 10.25 10.25 9.24579 10.25 8C10.25 6.75421 9.24579 5.75 8 5.75C7.65198 5.75 7.32282 5.82837 7.02914 5.96848L9.06077 8.00011L8.00011 9.06077L5.96848 7.02914ZM3.75 1.81066V3.75H1.81066L3.31066 5.25H5.25V3.31066L3.75 1.81066Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M10.6797 1.25C11.783 1.25 12.7697 1.91156 13.207 2.90918L13.209 2.91406L14.3037 5.45996H14.3164L14.5107 5.91699C15.2793 7.72864 13.9505 9.74968 11.9805 9.75H10.1162L10.6045 10.9795L10.6055 10.9785C11.3359 12.7839 9.99885 14.75 8.05957 14.75H6.50293L6.31348 14.2793L4.81543 10.543C4.61821 10.0598 4.15918 9.75016 3.65039 9.75H1.25V1.25H10.6797ZM5.75 2.75V9.22754C5.93669 9.44832 6.09122 9.6999 6.2041 9.97656L6.20605 9.98047L7.51758 13.25H8.05957C8.94029 13.25 9.5444 12.3556 9.21484 11.541L9.21289 11.5371L7.9043 8.25H11.9805C12.8253 8.24969 13.4164 7.42163 13.1729 6.62891L13.1211 6.50586L11.833 3.51074C11.6302 3.04856 11.1763 2.75 10.6797 2.75H5.75ZM2.75 2.75V8.25H3.65039C3.85546 8.25003 4.05618 8.27304 4.25 8.31641V2.75H2.75Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M8.05957 1.25C9.99885 1.25 11.3359 3.21606 10.6055 5.02148L10.6045 5.02051L10.1162 6.25H11.9805C13.9505 6.25032 15.2793 8.27136 14.5107 10.083L14.3164 10.54H14.3037L13.209 13.0859L13.207 13.0908C12.7697 14.0884 11.783 14.75 10.6797 14.75H1.25V6.25H3.65039C4.15918 6.24984 4.61821 5.94021 4.81543 5.45703L6.31348 1.7207L6.50293 1.25H8.05957ZM6.20605 6.01953L6.2041 6.02344C6.09132 6.29986 5.93648 6.55084 5.75 6.77148V13.25H10.6797C11.1763 13.25 11.6302 12.9514 11.833 12.4893L13.1211 9.49414L13.1729 9.37109C13.4164 8.57837 12.8253 7.75031 11.9805 7.75H7.9043L9.21289 4.46289L9.21484 4.45898C9.5444 3.64441 8.94029 2.75 8.05957 2.75H7.51758L6.20605 6.01953ZM4.25 7.68262C4.05611 7.72602 3.85554 7.74997 3.65039 7.75H2.75V13.25H4.25V7.68262Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M10.75 4.25H12C13.5188 4.25 14.75 5.48122 14.75 7V12C14.75 13.5188 13.5188 14.75 12 14.75H4C2.48122 14.75 1.25 13.5188 1.25 12V7C1.25 5.48122 2.48122 4.25 4 4.25H5.25V1.25H10.75V4.25ZM11.75 13.25H12C12.6904 13.25 13.25 12.6904 13.25 12V7C13.25 6.30964 12.6904 5.75 12 5.75H11.75V13.25ZM5.75 13.25H10.25V5.75H5.75V13.25ZM4 5.75C3.30964 5.75 2.75 6.30964 2.75 7V12C2.75 12.6904 3.30964 13.25 4 13.25H4.25V5.75H4ZM6.75 4.25H9.25V2.75H6.75V4.25Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#001222\" :clip-path=\"'url(#uia-ui-assets/icons-16-warning_diamond__a' + uuid + ')'\"><path d=\"M8.00024 10.0005C8.55236 10.0007 9.00024 10.4483 9.00024 11.0005C8.99998 11.5524 8.5522 12.0003 8.00024 12.0005C7.44811 12.0005 7.00049 11.5525 7.00024 11.0005C7.00024 10.4482 7.44795 10.0005 8.00024 10.0005Z\"/><path d=\"M8.75024 8.42039H7.25024V4.25046H8.75024V8.42039Z\"/><path d=\"M6.05492 0.883276C7.12886 -0.190666 8.87063 -0.190666 9.94457 0.883276L15.1135 6.05222C16.1869 7.12613 16.1871 8.86708 15.1135 9.94089L9.94457 15.1098C8.87062 16.1837 7.12883 16.1838 6.05492 15.1098L0.886954 9.94089C-0.186957 8.86698 -0.186898 7.12617 0.886954 6.05222L6.05492 0.883276ZM8.88402 1.94382C8.39594 1.45574 7.60462 1.45588 7.11645 1.94382L1.9475 7.11277C1.45944 7.60093 1.45938 8.39222 1.9475 8.88035L7.11645 14.0493C7.60461 14.537 8.39601 14.5372 8.88402 14.0493L14.052 8.88035C14.5401 8.39219 14.5401 7.60092 14.052 7.11277L8.88402 1.94382Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-warning_diamond__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#001222\" :clip-path=\"'url(#uia-ui-assets/icons-16-world__a' + uuid + ')'\"><path d=\"M12.9004 7.3501C13.3146 7.3501 13.6504 7.01431 13.6504 6.6001C13.6504 6.18588 13.3146 5.8501 12.9004 5.8501C12.4862 5.8501 12.1504 6.18588 12.1504 6.6001C12.1504 7.01431 12.4862 7.3501 12.9004 7.3501Z\"/><path d=\"M13.6504 8.69995C13.6504 9.11416 13.3146 9.44995 12.9004 9.44995C12.4862 9.44995 12.1504 9.11416 12.1504 8.69995C12.1504 8.28574 12.4862 7.94995 12.9004 7.94995C13.3146 7.94995 13.6504 8.28574 13.6504 8.69995Z\"/><path d=\"M10.7998 5.94995C11.214 5.94995 11.5498 5.61416 11.5498 5.19995C11.5498 4.78574 11.214 4.44995 10.7998 4.44995C10.3856 4.44995 10.0498 4.78574 10.0498 5.19995C10.0498 5.61416 10.3856 5.94995 10.7998 5.94995Z\"/><path d=\"M11.5498 7.30005C11.5498 7.71426 11.214 8.05005 10.7998 8.05005C10.3856 8.05005 10.0498 7.71426 10.0498 7.30005C10.0498 6.88584 10.3856 6.55005 10.7998 6.55005C11.214 6.55005 11.5498 6.88584 11.5498 7.30005Z\"/><path d=\"M10.7998 10.1499C11.214 10.1499 11.5498 9.81412 11.5498 9.3999C11.5498 8.98569 11.214 8.6499 10.7998 8.6499C10.3856 8.6499 10.0498 8.98569 10.0498 9.3999C10.0498 9.81412 10.3856 10.1499 10.7998 10.1499Z\"/><path d=\"M11.5498 11.5C11.5498 11.9142 11.214 12.25 10.7998 12.25C10.3856 12.25 10.0498 11.9142 10.0498 11.5C10.0498 11.0858 10.3856 10.75 10.7998 10.75C11.214 10.75 11.5498 11.0858 11.5498 11.5Z\"/><path d=\"M8.7002 4.55005C9.11441 4.55005 9.4502 4.21426 9.4502 3.80005C9.4502 3.38584 9.11441 3.05005 8.7002 3.05005C8.28598 3.05005 7.9502 3.38584 7.9502 3.80005C7.9502 4.21426 8.28598 4.55005 8.7002 4.55005Z\"/><path d=\"M7.34961 7.30005C7.34961 7.71426 7.01382 8.05005 6.59961 8.05005C6.1854 8.05005 5.84961 7.71426 5.84961 7.30005C5.84961 6.88584 6.1854 6.55005 6.59961 6.55005C7.01382 6.55005 7.34961 6.88584 7.34961 7.30005Z\"/><path d=\"M8.7002 6.6499C9.11441 6.6499 9.4502 6.31412 9.4502 5.8999C9.4502 5.48569 9.11441 5.1499 8.7002 5.1499C8.28598 5.1499 7.9502 5.48569 7.9502 5.8999C7.9502 6.31412 8.28598 6.6499 8.7002 6.6499Z\"/><path d=\"M7.34961 5.19995C7.34961 5.61416 7.01382 5.94995 6.59961 5.94995C6.1854 5.94995 5.84961 5.61416 5.84961 5.19995C5.84961 4.78574 6.1854 4.44995 6.59961 4.44995C7.01382 4.44995 7.34961 4.78574 7.34961 5.19995Z\"/><path d=\"M8.7002 8.75C9.11441 8.75 9.4502 8.41421 9.4502 8C9.4502 7.58579 9.11441 7.25 8.7002 7.25C8.28598 7.25 7.9502 7.58579 7.9502 8C7.9502 8.41421 8.28598 8.75 8.7002 8.75Z\"/><path d=\"M5.25 3.80005C5.25 4.21426 4.91421 4.55005 4.5 4.55005C4.08579 4.55005 3.75 4.21426 3.75 3.80005C3.75 3.38584 4.08579 3.05005 4.5 3.05005C4.91421 3.05005 5.25 3.38584 5.25 3.80005Z\"/><path d=\"M9.51195 0.398918C8.0086 0.0998821 6.45033 0.253358 5.0342 0.839937C3.61808 1.42652 2.40769 2.41985 1.55611 3.69433C0.704529 4.96881 0.25 6.4672 0.25 8C0.25 10.0554 1.06652 12.0267 2.51992 13.4801C3.97333 14.9335 5.94457 15.75 8 15.75C9.53281 15.75 11.0312 15.2955 12.3057 14.4439C13.5801 13.5923 14.5735 12.3819 15.1601 10.9658C15.7466 9.54967 15.9001 7.99141 15.6011 6.48805C15.3021 4.9847 14.5639 3.60378 13.4801 2.51993C12.3962 1.43607 11.0153 0.697953 9.51195 0.398918ZM7.95322 1.75018C7.96139 1.84081 7.98602 1.92955 8.02626 2.01195C8.08507 2.13238 8.17507 2.23484 8.2869 2.30869C8.39873 2.38255 8.52831 2.42508 8.66215 2.43188C8.796 2.43868 8.92922 2.40949 9.04795 2.34735C9.16669 2.28521 9.26661 2.19239 9.33732 2.07854C9.36983 2.02619 9.39561 1.97028 9.41428 1.91212C9.856 2.01473 10.2833 2.16467 10.6893 2.35818C10.3275 2.41161 10.0498 2.72343 10.0498 3.1001C10.0498 3.51431 10.3856 3.8501 10.7998 3.8501C11.214 3.8501 11.5498 3.51431 11.5498 3.1001C11.5498 3.00058 11.5304 2.90559 11.4952 2.8187C11.8254 3.04143 12.1351 3.29626 12.4194 3.58059C12.4912 3.65234 12.561 3.72571 12.629 3.80061C12.3489 3.90937 12.1504 4.1815 12.1504 4.5C12.1504 4.91421 12.4862 5.25 12.9004 5.25C13.1304 5.25 13.3362 5.14645 13.4738 4.98342C13.7818 5.54229 14.0041 6.14805 14.1299 6.78069C14.3711 7.99307 14.2473 9.24974 13.7742 10.3918C13.7327 10.492 13.6887 10.591 13.6422 10.6886C13.5883 10.3272 13.2767 10.05 12.9004 10.05C12.4862 10.05 12.1504 10.3858 12.1504 10.8C12.1504 11.2143 12.4862 11.55 12.9004 11.55C12.9996 11.55 13.0942 11.5308 13.1809 11.4958C12.7294 12.165 12.1501 12.7438 11.4723 13.1967L11.4439 13.2156C11.3129 12.9967 11.0735 12.8501 10.7998 12.8501C10.3856 12.8501 10.0498 13.1859 10.0498 13.6001C10.0498 13.7008 10.0697 13.7969 10.1057 13.8846C9.43348 14.1251 8.72147 14.25 8 14.25C6.3424 14.25 4.75268 13.5915 3.58058 12.4194C2.40848 11.2473 1.75 9.65761 1.75 8C1.75 6.76387 2.11656 5.5555 2.80331 4.52769C3.49007 3.49988 4.46619 2.6988 5.60823 2.22576C6.35565 1.91617 7.15216 1.75618 7.95322 1.75018Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-world__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","import { type VueNodeElement } from '@/types/elements';\n\nimport BagIcon from '@adyen/ui-assets-icons-16/vue/bag';\nimport CarIcon from '@adyen/ui-assets-icons-16/vue/car';\nimport CashStackIcon from '@adyen/ui-assets-icons-16/vue/cash-stack';\nimport CloudIcon from '@adyen/ui-assets-icons-16/vue/cloud';\nimport DiamondIcon from '@adyen/ui-assets-icons-16/vue/diamond';\nimport EducationIcon from '@adyen/ui-assets-icons-16/vue/education';\nimport EmoticonHappyIcon from '@adyen/ui-assets-icons-16/vue/emoticon-happy';\nimport HotelIcon from '@adyen/ui-assets-icons-16/vue/gambling';\nimport GamingIcon from '@adyen/ui-assets-icons-16/vue/gaming';\nimport GiftIcon from '@adyen/ui-assets-icons-16/vue/gift';\nimport HandRockIcon from '@adyen/ui-assets-icons-16/vue/hand-rock';\nimport HashtagIcon from '@adyen/ui-assets-icons-16/vue/hashtag';\nimport HeartIcon from '@adyen/ui-assets-icons-16/vue/heart';\nimport HospitalityIcon from '@adyen/ui-assets-icons-16/vue/hospitality';\nimport HourglassIcon from '@adyen/ui-assets-icons-16/vue/hourglass';\nimport LeafIcon from '@adyen/ui-assets-icons-16/vue/leaf';\nimport LightningIcon from '@adyen/ui-assets-icons-16/vue/lightning';\nimport LockIcon from '@adyen/ui-assets-icons-16/vue/lock';\nimport NewsIcon from '@adyen/ui-assets-icons-16/vue/news';\nimport NotificationIcon from '@adyen/ui-assets-icons-16/vue/notification';\nimport PrizeIcon from '@adyen/ui-assets-icons-16/vue/prize';\nimport RetailIcon from '@adyen/ui-assets-icons-16/vue/retail';\nimport ShoppingCartIcon from '@adyen/ui-assets-icons-16/vue/shopping-cart';\nimport SleepIcon from '@adyen/ui-assets-icons-16/vue/sleep';\nimport StackIcon from '@adyen/ui-assets-icons-16/vue/stack';\nimport StarIcon from '@adyen/ui-assets-icons-16/vue/star';\nimport SupportIcon from '@adyen/ui-assets-icons-16/vue/support';\nimport TargetIcon from '@adyen/ui-assets-icons-16/vue/target';\nimport ThumbsDownIcon from '@adyen/ui-assets-icons-16/vue/thumb-down';\nimport ThumbsUpIcon from '@adyen/ui-assets-icons-16/vue/thumb-up';\nimport TravelBagIcon from '@adyen/ui-assets-icons-16/vue/travel-bag';\nimport WarningDiamondIcon from '@adyen/ui-assets-icons-16/vue/warning-diamond';\nimport WorldIcon from '@adyen/ui-assets-icons-16/vue/world';\n\nexport enum BentoHeaderWithViewsItemIconColorEnum {\n BLUE = 'blue',\n GREEN = 'green',\n ORANGE = 'orange',\n PRIMARY = 'primary',\n RED = 'red',\n YELLOW = 'yellow',\n}\n\nexport enum BentoHeaderWithViewsItemIconEnum {\n STACK = 'stack',\n LEAF = 'leaf',\n HAND_ROCK = 'hand-rock',\n CAR = 'car',\n EDUCATION = 'education',\n HOTEL = 'hotel',\n TRAVEL_BAG = 'travel-bag',\n LIGHTNING = 'lightning',\n NEWS = 'news',\n PRIZE = 'prize',\n LOCK = 'lock',\n BAG = 'bag',\n DIAMOND = 'diamond',\n TARGET = 'target',\n GIFT = 'gift',\n CASH_STACK = 'cash-stack',\n HASHTAG = 'hashtag',\n CLOUD = 'cloud',\n HOSPITALITY = 'hospitality',\n SHOPPING_CART = 'shopping-cart',\n SLEEP = 'sleep',\n NOTIFICATION = 'notification',\n THUMBS_UP = 'thumb-up',\n THUMBS_DOWN = 'thumb-down',\n STAR = 'star',\n WARNING_DIAMOND = 'warning-diamond',\n RETAIL = 'retail',\n EMOTICON_HAPPY = 'emoticon-happy',\n GAMING = 'gaming',\n SUPPORT = 'support',\n HEART = 'heart',\n HOURGLASS = 'hourglass',\n WORLD = 'world',\n}\n\nexport type BentoHeaderWithViewsItemIconColor = `${BentoHeaderWithViewsItemIconColorEnum}`;\nexport type BentoHeaderWithViewsItemIcon = `${BentoHeaderWithViewsItemIconEnum}`;\n\nexport interface BentoHeaderWithViewsItemAdditionalConfig {\n /*\n Label for an additional view setting (e.g. a checkbox or toggle).\n /\n label: string;\n\n /\n Boolean value indicating the state of the additional view setting (e.g., checked or toggled).\n /\n value: boolean;\n}\n\nexport interface BentoHeaderWithViewsItem {\n /\n Optional icon to display for the view item.\n /\n icon?: BentoHeaderWithViewsItemIcon;\n\n /\n Optional color of the icon for the view item.\n /\n iconColor?: BentoHeaderWithViewsItemIconColor;\n\n /\n Text label for the view item.\n /\n label: string;\n\n /\n Optional boolean indicating if this view item is the default or currently active view.\n /\n isDefault?: boolean;\n\n /\n Optional configuration for an additional view setting, such as a filter or option.\n /\n additionalViewSetting?: BentoHeaderWithViewsItemAdditionalConfig;\n\n /\n Optional boolean indicating if this view can be edited or deleted.\n /\n isFixed?: boolean;\n}\n\nexport interface BentoHeaderWithViewsItemUpdate {\n newViews: Array<BentoHeaderWithViewsItem>;\n oldViews: Array<BentoHeaderWithViewsItem>;\n targetViewLabel: BentoHeaderWithViewsItem['label'];\n}\n\nexport const BentoHeaderWithViewsItemIconElement: Record<BentoHeaderWithViewsItemIcon, VueNodeElement> = {\n [BentoHeaderWithViewsItemIconEnum.STACK]: StackIcon,\n [BentoHeaderWithViewsItemIconEnum.LEAF]: LeafIcon,\n [BentoHeaderWithViewsItemIconEnum.HAND_ROCK]: HandRockIcon,\n [BentoHeaderWithViewsItemIconEnum.CAR]: CarIcon,\n [BentoHeaderWithViewsItemIconEnum.EDUCATION]: EducationIcon,\n [BentoHeaderWithViewsItemIconEnum.HOTEL]: HotelIcon,\n [BentoHeaderWithViewsItemIconEnum.TRAVEL_BAG]: TravelBagIcon,\n [BentoHeaderWithViewsItemIconEnum.LIGHTNING]: LightningIcon,\n [BentoHeaderWithViewsItemIconEnum.NEWS]: NewsIcon,\n [BentoHeaderWithViewsItemIconEnum.PRIZE]: PrizeIcon,\n [BentoHeaderWithViewsItemIconEnum.LOCK]: LockIcon,\n [BentoHeaderWithViewsItemIconEnum.BAG]: BagIcon,\n [BentoHeaderWithViewsItemIconEnum.DIAMOND]: DiamondIcon,\n [BentoHeaderWithViewsItemIconEnum.TARGET]: TargetIcon,\n [BentoHeaderWithViewsItemIconEnum.GIFT]: GiftIcon,\n [BentoHeaderWithViewsItemIconEnum.CASH_STACK]: CashStackIcon,\n [BentoHeaderWithViewsItemIconEnum.HASHTAG]: HashtagIcon,\n [BentoHeaderWithViewsItemIconEnum.CLOUD]: CloudIcon,\n [BentoHeaderWithViewsItemIconEnum.HOSPITALITY]: HospitalityIcon,\n [BentoHeaderWithViewsItemIconEnum.SHOPPING_CART]: ShoppingCartIcon,\n [BentoHeaderWithViewsItemIconEnum.SLEEP]: SleepIcon,\n [BentoHeaderWithViewsItemIconEnum.NOTIFICATION]: NotificationIcon,\n [BentoHeaderWithViewsItemIconEnum.THUMBS_UP]: ThumbsUpIcon,\n [BentoHeaderWithViewsItemIconEnum.THUMBS_DOWN]: ThumbsDownIcon,\n [BentoHeaderWithViewsItemIconEnum.STAR]: StarIcon,\n [BentoHeaderWithViewsItemIconEnum.WARNING_DIAMOND]: WarningDiamondIcon,\n [BentoHeaderWithViewsItemIconEnum.RETAIL]: RetailIcon,\n [BentoHeaderWithViewsItemIconEnum.EMOTICON_HAPPY]: EmoticonHappyIcon,\n [BentoHeaderWithViewsItemIconEnum.GAMING]: GamingIcon,\n [BentoHeaderWithViewsItemIconEnum.SUPPORT]: SupportIcon,\n [BentoHeaderWithViewsItemIconEnum.HEART]: HeartIcon,\n [BentoHeaderWithViewsItemIconEnum.HOURGLASS]: HourglassIcon,\n [BentoHeaderWithViewsItemIconEnum.WORLD]: WorldIcon,\n};\n\nexport interface BentoHeaderWithViewsEmits {\n /\n Emitted when a new view is added to the list of views.\n /\n (e: 'add:view', value: BentoHeaderWithViewsItemUpdate): void;\n\n /\n Emitted when a view is deleted from the list of views.\n /\n (e: 'delete:view', value: BentoHeaderWithViewsItemUpdate): void;\n\n /\n Emitted when a view is duplicated.\n /\n (e: 'duplicate:view', value: BentoHeaderWithViewsItemUpdate): void;\n\n /\n Emitted when the user reorganizes the order of the views.\n * No `targetViewLabel` is emitted as the views are reordered as a whole.\n /\n (e: 'reorder:view', value: Omit<BentoHeaderWithViewsItemUpdate, 'targetViewLabel'>): void;\n\n /\n Emitted when the user requests to restore a previously saved or default view.\n /\n (e: 'restore:view', value: BentoHeaderWithViewsItem['label']): void;\n\n /\n Emitted when the user requests to save the current view.\n /\n (e: 'save:view', value: BentoHeaderWithViewsItem['label']): void;\n\n /\n Emitted when the user selects a different view from the available options.\n /\n (e: 'select:view', value: BentoHeaderWithViewsItem['label']): void;\n\n /\n Emitted when a property of a view is updated.\n /\n (e: 'update:view', value: BentoHeaderWithViewsItemUpdate): void;\n\n /\n Emitted when the user selects the prompt checkbox and closes the modal with a valid button action.\n * Only works when a string is pass into the `skipUnsavedChangesText` prop.\n /\n (e: 'update:skip-unsaved-changes', value: boolean): void;\n\n /\n Emitted when the active view index changes. Used for two-way binding with v-model:active-view-index.\n /\n (e: 'update:active-view-index', value: number \| null): void;\n}\n\nexport type BentoHeaderWithViewsItemErrors = {\n /\n Object where the keys correspond to the properties of `BentoHeaderWithViewsItem`,\n * and the values are strings representing any validation errors for that property.\n /\n [K in keyof BentoHeaderWithViewsItem]: string;\n};\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M1.25 2.58325H14.75V4.08325H1.25V2.58325Z\"/><path fill=\"#001222\" d=\"M1.25 7.25H14.75V8.75H1.25V7.25Z\"/><path fill=\"#001222\" d=\"M14.75 11.9167H1.25V13.4167H14.75V11.9167Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","import { useI18n } from '@/utils/ts/i18n';\nimport { computed, reactive, ref } from 'vue';\nimport {\n type BentoHeaderWithViewsItemErrors,\n BentoHeaderWithViewsItemIconColorEnum,\n BentoHeaderWithViewsItemIconEnum,\n} from '../../header-with-views.internal.types';\nimport {\n type BentoHeaderWithViewsItem,\n type BentoHeaderWithViewsItemAdditionalConfig,\n type BentoHeaderWithViewsItemUpdate,\n} from '../../header-with-views.types';\nimport messages from '../../messages.json';\n\ntype MessageSchema = (typeof messages)['en-US'];\n\ninterface UseEditViewsProps {\n additionalViewSetting: BentoHeaderWithViewsItemAdditionalConfig \| null;\n views: Array<BentoHeaderWithViewsItem>;\n}\n\n/\n Composable function to create, edit, update and delete (CRUD) configurations in views.\n \n @param options - Configuration object for the CRUD functionality.\n * @returns An object containing reactive state and handler functions for CRUD.\n /\nexport const useEditViews = (options: UseEditViewsProps) => {\n const views = ref<Array<BentoHeaderWithViewsItem>>(options.views);\n const errors = reactive<BentoHeaderWithViewsItemErrors>({ label: '' });\n\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n const computedViews = computed<Array<BentoHeaderWithViewsItem>>(() =>\n views.value.map(viewItem => ({\n ...viewItem,\n\n iconColor: viewItem.iconColor ?? BentoHeaderWithViewsItemIconColorEnum.PRIMARY,\n icon: viewItem.icon ?? BentoHeaderWithViewsItemIconEnum.STACK,\n label: viewItem.label,\n\n ...(viewItem.isDefault !== null ? { isDefault: viewItem.isDefault } : null),\n\n ...(options?.additionalViewSetting\n ? {\n additionalViewSetting: {\n label: options.additionalViewSetting.label,\n value: viewItem.additionalViewSetting?.value ?? options.additionalViewSetting.value,\n },\n }\n : []),\n }))\n );\n\n /\n Adds, updates, or deletes a view item based on the provided data and index.\n * If `index` is provided and `data` is `null`, the view at `index` is deleted.\n * If `index` is provided and `data` is an object, the view at `index` is updated with `data`.\n * If `index` is not provided, a new view is added using `data`.\n * @param data - The partial data for the view item to add or update, or `null` to delete.\n * @param index - The optional index of the view item to update or delete.\n /\n const updateView = (data: Partial<BentoHeaderWithViewsItem>, index?: number): BentoHeaderWithViewsItemUpdate => {\n let newViews = [...views.value];\n const oldViews = [...views.value];\n\n let targetViewLabel: BentoHeaderWithViewsItem['label'];\n\n if (newViews[index]) {\n if (!data) {\n // delete\n newViews.splice(index, 1);\n\n targetViewLabel = oldViews[index].label;\n } else {\n // there can only be one default view - remove default view from all other views\n if (data.isDefault) {\n newViews = newViews.map(view => (view.isDefault ? { ...view, isDefault: false } : view));\n }\n\n // update\n newViews[index] = {\n ...newViews[index],\n ...data,\n };\n\n targetViewLabel = newViews[index].label;\n }\n } else {\n // add\n newViews.push(data as BentoHeaderWithViewsItem);\n\n targetViewLabel = data.label;\n }\n\n views.value = [...newViews];\n\n return {\n newViews: views.value,\n oldViews,\n targetViewLabel,\n };\n };\n\n /\n Duplicates a view item at the given index, appending a numerical suffix to its label to ensure uniqueness.\n * @param index - The index of the view item to duplicate.\n /\n const duplicateView = (index: number): BentoHeaderWithViewsItemUpdate => {\n const toCopyLabel = computedViews.value[index].label;\n\n let copiedLabel = `(1) - ${toCopyLabel}`;\n let suffix = 1;\n\n while (computedViews.value.some(view => view.label === copiedLabel)) {\n suffix++;\n copiedLabel = `(${suffix}) - ${computedViews.value[index].label}`;\n }\n\n const newView = {\n ...computedViews.value[index],\n label: copiedLabel,\n };\n\n // for duplicates, our target is the view that users want to duplicate\n // instead of the duplicated label\n return {\n ...updateView(newView),\n targetViewLabel: toCopyLabel,\n };\n };\n\n /\n Replaces the current list of views with a new array of views.\n * @param newViews - The new array of `BentoHeaderWithViewsItem` to set as the current views.\n * @returns An object containing the `oldViews` (the state before the update) and `newViews` (the new state).\n /\n const setViews = (newViews: Array<BentoHeaderWithViewsItem>) => {\n const oldViews = views.value;\n\n views.value = newViews;\n\n return { oldViews, newViews };\n };\n\n /* Clears any validation errors related to the view label. /\n const clearError = () => {\n errors.label = '';\n };\n\n /\n Validates the provided label for a view item.\n * Sets an error message if the label is empty or if it already exists among other views (excluding the view at the given index).\n * @param value - The label string to validate.\n * @param index - The index of the view item being validated (used to exclude itself from uniqueness checks).\n /\n const validateLabel = (value: BentoHeaderWithViewsItem['label'], index: number) => {\n const labelIsRequired = value.trim().length === 0;\n const labelAlreadyExist = computedViews.value.some(\n (view, viewIndex) => view.label === value && index !== viewIndex\n );\n\n if (labelIsRequired) {\n errors.label = t('labelRequiredError');\n } else if (labelAlreadyExist) {\n errors.label = t('labelNoDuplicateError');\n } else {\n clearError();\n }\n };\n\n return {\n // read\n computedViews,\n errors,\n\n // modify\n clearError,\n duplicateView,\n setViews,\n updateView,\n\n // validations\n validateLabel,\n };\n};\n","import { useEventListener } from '@/directives/click-outside/useEventListener';\nimport { type Ref, ref } from 'vue';\nimport { type BentoHeaderWithViewsItem, type BentoHeaderWithViewsProps } from '../../header-with-views.types';\n\nexport enum UseDragAndDropViewsDirectionEnum {\n UP = 'up',\n DOWN = 'down',\n}\n\ninterface UseDragAndDropViewsProps {\n itemRefs: Ref<Array<HTMLElement>>;\n items: Ref<BentoHeaderWithViewsProps['views']>;\n onDrop: (value: Array<BentoHeaderWithViewsItem>) => void;\n}\n\n/\n Composable function for implementing drag and drop reordering of views.\n \n Requires HTML to have\n * - data-drag-trigger - interactive element that initializes the drag-and-drop\n * - data-drag-item - element that will be dragged\n \n @param options - Configuration object for the drag and drop functionality.\n * @returns An object containing reactive state and handler functions for drag and drop.\n /\nexport const useDragAndDropViews = (options: UseDragAndDropViewsProps) => {\n const { itemRefs, items, onDrop } = options;\n\n const animationFrameId = ref<number>(null);\n const draggedViewIndex = ref<number>(null); // track which view item is being dragged\n const dragMousePosition = ref<number>(0); // track the place where the drag started\n const dragKeyboardInitiated = ref<boolean>(false); // track if the drag has been initiated by keyboard\n const dragOffset = ref<number>(0); // track the height of the dragged item - all draggable items have the same height\n const draggingOverViewIndex = ref<number>(null); // track which view item is being hovered over after drag started\n const maxDragOffsetY = ref<number>(0); // track bottom-most draggable location\n const minDragOffsetY = ref<number>(0); // track top-most draggable location\n\n const menuItemsElementRects = ref<Array<Pick<DOMRect, 'top' \| 'bottom' \| 'height'>>>([]);\n\n /\n * Public functions\n /\n\n /\n Checks if a specific item is currently being dragged.\n * @param index The index of the item to check.\n * @returns `true` if the item at the given index is being dragged, `false` otherwise.\n /\n const isItemDragged = (index: number) => draggedViewIndex.value === index;\n\n /\n Initiates the drag operation. This function is called when a drag is started\n * either by a mouse click and drag or by a keyboard action. It sets up the\n * initial state for the drag operation, including the dragged item's index,\n * its dimensions, and the boundaries for movement.\n * @param index The index of the item that is being dragged.\n * @param event The MouseEvent or KeyboardEvent that triggered the drag start.\n /\n const handleDragStart = (index: number, event: MouseEvent \| KeyboardEvent) => {\n if (!(event.target as HTMLElement).closest('[data-drag-trigger]')) {\n // skip if the grab icon button isn't the target\n return;\n }\n\n draggedViewIndex.value = index;\n\n updateMenuItemsRects();\n\n // Store the initial offset of the mouse pointer within the dragged element\n const draggedElement = itemRefs.value[index];\n\n if (!draggedElement) {\n return;\n }\n\n if (typeof (event as MouseEvent).clientY === 'number') {\n // clientY only exist on MouseEvent\n\n dragMousePosition.value = (event as MouseEvent).clientY;\n } else if (typeof (event as KeyboardEvent).key === 'string') {\n // clientY only exist on KeyboardEvent\n\n dragKeyboardInitiated.value = true;\n }\n\n dragOffset.value = draggedElement.clientHeight;\n\n // since all the height of the items are the same,\n // how far the dragged item can go is determined by checking it's current index and multiplying it\n maxDragOffsetY.value = dragOffset.value (itemRefs.value.length - index - 1); // how far down the dragged item can go\n minDragOffsetY.value = -(dragOffset.value * index); // how far top the dragged item can go\n\n // ensure that the grab is shown even if user is outside of the popover\n document.documentElement.style.cursor = 'grabbing';\n document.documentElement.style.userSelect = 'none';\n };\n\n /*\n Toggles the keyboard-initiated drag state. If a drag is not active, it starts one.\n * If a drag is already active (initiated by keyboard), it finalizes the drag operation\n * by calling `handleDrop`. This function is typically bound to an \"Enter\" key press.\n * @param index The index of the item to toggle drag for.\n * @param event The KeyboardEvent that triggered the toggle.\n /\n const handleDragKeyboardToggle = (index: number, event: KeyboardEvent) => {\n if (!dragKeyboardInitiated.value) {\n draggingOverViewIndex.value = index;\n\n handleDragStart(index, event);\n\n return;\n }\n\n handleDrop();\n };\n\n /\n Handles keyboard-driven movement of a dragged item. This function is called\n * when arrow keys (up/down) are pressed during a keyboard-initiated drag.\n * It updates the `draggingOverViewIndex` and visually transforms the elements\n * to simulate movement.\n * @param direction The direction of movement ('up' or 'down').\n * @param event The KeyboardEvent that triggered the move.\n /\n const handleDragKeyboardMove = (direction: `${UseDragAndDropViewsDirectionEnum}`, event: KeyboardEvent) => {\n if (!dragKeyboardInitiated.value) {\n return;\n }\n\n // prevent scrolling\n event.preventDefault();\n\n // scenarios to cover:\n // 1. dragging an item to the bottom\n // 2. dragging an item to the bottom and back up\n // 3. dragging an item to the top\n // 4. dragging an item to the top and back down\n // 5. dragging an item in place\n\n const upperBound = itemRefs.value.length - 1;\n const lowerBound = 0;\n const isGoingDownwards = direction === UseDragAndDropViewsDirectionEnum.DOWN;\n const isGoingUpwards = direction === UseDragAndDropViewsDirectionEnum.UP;\n\n // covers case 5 - up or down is pressed when the item is at the extremes\n if (\n (isGoingUpwards && draggingOverViewIndex.value === lowerBound) \|\|\n (isGoingDownwards && draggingOverViewIndex.value === upperBound)\n ) {\n return;\n }\n\n let targetElementIndex = draggingOverViewIndex.value + 1;\n\n if (isGoingUpwards) {\n targetElementIndex = draggingOverViewIndex.value - 1;\n }\n\n const isTargetAfterDragged = draggedViewIndex.value < targetElementIndex;\n const isTargetBeforeDragged = draggedViewIndex.value > targetElementIndex;\n\n // Indicators for when case 2 and 4 occurs\n const isDirectionReversed =\n (isGoingDownwards && isTargetBeforeDragged) \|\|\n (isGoingUpwards && isTargetAfterDragged) \|\|\n // This doesn't typically need transformation, but in a \"reversed\" direction,\n // it may potentially need to pass through it's original position\n draggedViewIndex.value === targetElementIndex;\n\n if (targetElementIndex > upperBound \|\| targetElementIndex < lowerBound) {\n return;\n }\n\n const updateDraggedElementTransform = () => {\n const draggedElement = itemRefs.value[draggedViewIndex.value];\n const offset = clampTransform((draggingOverViewIndex.value - draggedViewIndex.value) dragOffset.value);\n\n draggedElement.style.transform = `translateY(${offset}px)`;\n };\n\n const updateTargetElementTransform = () => {\n const targetElement = itemRefs.value[draggingOverViewIndex.value];\n const targetElementOffset = isGoingDownwards ? -dragOffset.value : dragOffset.value;\n\n targetElement.style.transform = isDirectionReversed\n ? 'translateY(0px)'\n : `translateY(${targetElementOffset}px)`;\n };\n\n if (!isDirectionReversed) {\n // normal reorder - case 1, 3\n draggingOverViewIndex.value = targetElementIndex;\n updateDraggedElementTransform();\n updateTargetElementTransform();\n\n return;\n }\n\n // revert reorder - case 2, 4\n updateTargetElementTransform();\n draggingOverViewIndex.value = targetElementIndex;\n updateDraggedElementTransform();\n };\n\n /*\n Stops the drag operation and resets the UI and internal state.\n * This function is called when the drag is completed (e.g., mouse button released,\n * or keyboard drag finalized). It also cleans up any applied CSS transforms.\n * @param event Optional KeyboardEvent that triggered the drag stop.\n /\n const handleDragStop = (event?: KeyboardEvent) => {\n if (event && dragKeyboardInitiated.value) {\n event.stopPropagation();\n event.preventDefault();\n }\n\n animationFrameId.value = requestAnimationFrame(() => {\n itemRefs.value.forEach(menuItem => {\n const el = menuItem;\n\n el.style.transform = '';\n });\n\n animationFrameId.value = null;\n });\n\n // Reset drag pointer events\n draggingOverViewIndex.value = null;\n draggedViewIndex.value = null;\n\n // Reset drag UI\n document.documentElement.style.cursor = '';\n document.documentElement.style.userSelect = '';\n\n // Reset drag keyboard events\n dragKeyboardInitiated.value = null;\n };\n\n /\n * Private functions\n /\n\n const handleDragMove = (event: MouseEvent) => {\n // skip if drag and drop is initiated by keyboard\n if (draggedViewIndex.value === null \|\| animationFrameId.value \|\| dragKeyboardInitiated.value) {\n return;\n }\n\n animationFrameId.value = requestAnimationFrame(() => {\n const mousePosition = event.clientY;\n const overItemIndex = menuItemsElementRects.value.findIndex(\n (rect, index) =>\n (mousePosition >= rect.top && mousePosition <= rect.bottom) \|\|\n (mousePosition <= rect.top && index === 0) \|\|\n (mousePosition >= rect.bottom && index === menuItemsElementRects.value.length - 1)\n );\n\n if (overItemIndex !== -1 && overItemIndex !== draggingOverViewIndex.value) {\n draggingOverViewIndex.value = overItemIndex;\n }\n\n updateDragPosition(mousePosition);\n\n animationFrameId.value = null;\n });\n };\n\n const handleDrop = () => {\n if (draggedViewIndex.value === null) {\n return;\n }\n\n const draggedElement = itemRefs.value[draggedViewIndex.value];\n\n if (!draggedElement) {\n return;\n }\n\n // check if there are shifts\n // handle case where the item is dragged around but placed back into it's original position\n const isNotShifted = draggedViewIndex.value === draggingOverViewIndex.value;\n\n if (isNotShifted) {\n handleDragStop();\n\n return;\n }\n\n // re-order the menu items\n const draggedItem = items.value[draggedViewIndex.value];\n const newMenuItems = [...items.value];\n\n newMenuItems.splice(draggedViewIndex.value, 1);\n newMenuItems.splice(draggingOverViewIndex.value, 0, draggedItem);\n\n transferFocus();\n handleDragStop();\n\n onDrop(newMenuItems);\n };\n\n const updateDragPosition = (mousePosition: number) => {\n // 1. set the current \"dragged\" item's position so that it looks like it is dragged\n const draggedElement = itemRefs.value[draggedViewIndex.value];\n\n if (!draggedElement) {\n return;\n }\n\n draggedElement.style.transform = `translateY(${clampTransform(mousePosition - dragMousePosition.value)}px)`;\n\n const threshold = 0.25;\n const isGoingDownwards = draggedViewIndex.value < draggingOverViewIndex.value;\n const isGoingUpwards = draggedViewIndex.value > draggingOverViewIndex.value;\n\n // 2. loop through every item in the menu and transform them\n for (let i = 0; i < menuItemsElementRects.value.length; i++) {\n if (i === draggedViewIndex.value) {\n continue;\n }\n\n const targetElement = itemRefs.value[i];\n const targetElementRect = menuItemsElementRects.value[i];\n\n const distanceFromTop = mousePosition - targetElementRect.top;\n const percentFromTop = distanceFromTop / targetElementRect.height;\n\n // scenarios to cover when optimisation is needed:\n // 1. dragging an item to the bottom\n // 2. dragging an item to the bottom and without releasing, back up\n // 3. dragging an item to the top\n // 4. dragging an item to the top and without releasing, back down\n // 5. dragging an item in place\n if (percentFromTop >= threshold && isGoingDownwards) {\n // covers scenario 1\n\n if (i < draggedViewIndex.value) {\n // avoid transforming an untouched item\n continue;\n }\n\n targetElement.style.transform = `translateY(-${dragOffset.value}px)`;\n } else if (percentFromTop <= 1 - threshold && isGoingUpwards) {\n // covers scenario 3\n\n if (i > draggedViewIndex.value) {\n // avoid transforming an untouched item\n continue;\n }\n\n targetElement.style.transform = `translateY(${dragOffset.value}px)`;\n } else {\n // covers scenario 2, 4, 5\n\n targetElement.style.transform = 'translateY(0px)';\n }\n }\n };\n\n const transferFocus = () => {\n const activeElement = document.activeElement;\n\n if (!activeElement?.closest('[data-drag-item]')) {\n return;\n }\n\n // usually, HTML will blur the item after drag and drop\n // this is used to handle the edge case where users tab onto the grab icon and then switch to using the mouse\n (\n itemRefs.value[draggingOverViewIndex.value]?.querySelector('[data-drag-trigger]') satisfies HTMLElement\n )?.focus();\n };\n\n const clampTransform = (value: number) => {\n return Math.max(minDragOffsetY.value, Math.min(maxDragOffsetY.value, value));\n };\n\n // cache rects to prevent getBoundingClientRect() from being intrusive\n // needed to ensure that mouse outside of the popover still relocates the dragged item\n const updateMenuItemsRects = () => {\n menuItemsElementRects.value = itemRefs.value.map(itemEl => {\n const { top, bottom, height } = itemEl.getBoundingClientRect();\n\n return {\n top,\n bottom,\n height,\n };\n });\n };\n\n useEventListener(document, 'pointermove', handleDragMove);\n useEventListener(document, 'pointerup', handleDrop, { capture: true });\n useEventListener(document, 'keydown', (event: KeyboardEvent) => {\n if (event.key !== 'Tab' \|\| draggedViewIndex.value === null) {\n return;\n }\n\n // prevent user from clicking Tab while drag is initiated\n event.preventDefault();\n });\n useEventListener(document, 'pointerdown', () => {\n // stop drag if it was dragged by keyboard and user changes to use a mouse\n if (dragKeyboardInitiated.value) {\n handleDragStop();\n }\n });\n\n return {\n draggedViewIndex,\n draggingOverViewIndex,\n isItemDragged,\n handleDragKeyboardToggle,\n handleDragKeyboardMove,\n handleDragStart,\n handleDragStop,\n };\n};\n","import { useElementSize } from '@vueuse/core';\nimport { nextTick, type Ref, ref, watch } from 'vue';\n\ninterface UseResponsiveViewsProps {\n container: Ref<HTMLElement>;\n children: Ref<Array<HTMLElement>>;\n offset: Ref<HTMLElement>;\n activeViewIndex: Ref<number>;\n}\n\n/\n Composable function for dynamically adjusting the visibility of view elements\n * within a container to ensure the active view remains visible and the total\n * width of displayed views fits within the container's width.\n \n @param elements - Configuration object containing refs to the container,\n * view elements, an offset element, and the active view index.\n * @returns An object containing reactive state for the maximum number of\n * views that can be displayed.\n /\nexport const useResponsiveViews = (elements: UseResponsiveViewsProps) => {\n const { container, children, offset, activeViewIndex } = elements;\n\n const maxDisplayedViews = ref<number>(children.value.length);\n\n const { width } = useElementSize(container);\n\n // responsible for calculating the number of views to be shown\n // and to keep the active view shown in the bar\n watch(\n [width, activeViewIndex, children],\n async ([containerWidth, newActiveViewIndex, childrenEl], [, oldActiveViewIndex]) => {\n const numberOfChildren = childrenEl.length;\n\n if (numberOfChildren === 0) {\n return;\n }\n\n // include the any additional spacing or the side buttons\n let totalWidth = offset.value.offsetWidth;\n\n // reset the views to display all views\n maxDisplayedViews.value = numberOfChildren;\n\n // reset any active children\n // case: when user click on a new active view\n // avoid: resetting when only the width changed and the activeIndex stays the same\n const previousActiveChild = childrenEl[oldActiveViewIndex];\n\n if (previousActiveChild) {\n previousActiveChild.style.display = 'none';\n }\n\n // loop through all children and count how many children can fit in the viewport\n for (let index = 0; index < numberOfChildren; index++) {\n const child = childrenEl[index];\n\n // temporarily enabled it so that the width can be obtained\n // `display: none` = 0 width\n child.style.display = 'inline-flex';\n\n if (totalWidth + child.offsetWidth <= containerWidth) {\n totalWidth += child.offsetWidth;\n } else {\n maxDisplayedViews.value = index;\n\n // the algorithms performs a lookahead\n // if the next child, that was enabled previously, does not fit, hide it again\n\n child.style.display = 'none';\n\n break;\n }\n }\n\n // if the active view is already in the bar i.e. users can see, skip\n if (newActiveViewIndex < maxDisplayedViews.value \|\| newActiveViewIndex === null) {\n return;\n }\n\n await nextTick();\n\n // ensure that the active view is always shown in the bar as the last item\n // loops through the items that are shown in the bar, from the end, remove them if they no longer fit\n let index = maxDisplayedViews.value - 1;\n const activeChild = childrenEl[newActiveViewIndex];\n\n activeChild.style.display = 'inline-flex';\n totalWidth += activeChild.offsetWidth;\n\n // if even the active child doesn't fit in the viewport, don't show\n //\n // EDGE CASE: title + action buttons are extremely long\n if (index < 0 && totalWidth > containerWidth) {\n activeChild.style.display = 'none';\n\n return;\n }\n\n // CASE:\n // when the active view is LONGER than most items in the bar,\n // hide as many items as possible until active view fits\n //\n // CASE:\n // when the active view is SHORTER than most items in the bar,\n // show as many as possible until active view fits\n while (totalWidth > containerWidth && index >= 0) {\n const child = children.value[index];\n\n totalWidth -= child.offsetWidth;\n\n child.style.display = 'none';\n\n index--;\n }\n },\n { immediate: true }\n );\n\n // responsible to hide any views that are more than the decided numbers of views\n watch([maxDisplayedViews, () => children.value.length], ([newMaxDisplayedViews, numberOfChildren]) => {\n for (let index = newMaxDisplayedViews; index < numberOfChildren; index++) {\n const child = children.value[index];\n\n child.style.display = 'none';\n }\n });\n\n return {\n maxDisplayedViews,\n };\n};\n","<template>\n <div\n ref=\"allViewsRef\"\n class=\"b-header-with-views-all-views\"\n data-testid=\"header-with-views-all-views\"\n @keydown.esc.stop.prevent=\"closeMenu\"\n >\n <bento-toggle-button\n ref=\"allViewsMenuToggleRef\"\n aria-haspopup=\"true\"\n :aria-expanded=\"showMenu\"\n :aria-controls=\"showMenu ? menuPopoverId : null\"\n variant=\"tertiary\"\n :toggled=\"showMenu\"\n @click=\"toggleShowMenu\"\n >\n <template #iconLeft>\n <menu-icon :svg-title=\"t('toggleAllViews')\" />\n </template>\n </bento-toggle-button>\n\n <bento-popover\n v-if=\"allViewsMenuToggleRef\"\n :id=\"menuPopoverId\"\n ref=\"allViewsMenuPopoverRef\"\n class=\"b-header-with-views-all-views__popover\"\n :open=\"showMenu\"\n :target-element=\"allViewsMenuToggleRef\"\n :fixed-positioning=\"true\"\n :overflow-visible=\"true\"\n position=\"bottom-end\"\n without-space\n >\n <output\n v-if=\"draggedViewIndex !== null && draggingOverViewIndex !== null\"\n class=\"b-header-with-views-all-views__popover-status\"\n >\n {{\n t('movingDraggedToPosition', {\n dragged: menuItems[draggedViewIndex].label,\n draggingOver: menuItems[draggingOverViewIndex].label,\n })\n }}\n </output>\n\n <ul ref=\"menuRef\" class=\"b-header-with-views-all-views__popover-menu\">\n <li\n v-for=\"(item, index) in menuItems\"\n ref=\"menuItemRefs\"\n :key=\"index\"\n data-drag-item\n class=\"b-header-with-views-all-views__popover-menu-item\"\n :class=\"conditionalDraggableItemClass(index)\"\n @pointerdown=\"handleDragStart(index, $event)\"\n >\n <div class=\"b-header-with-views-all-views__popover-menu-item-content\">\n <bento-button\n data-drag-trigger\n class=\"b-header-with-views-all-views__popover-menu-item-button b-header-with-views-all-views__popover-menu-item-button-reorder\"\n variant=\"tertiary\"\n :aria-pressed=\"isItemDragged(index)\"\n @keydown.enter.native=\"handleDragKeyboardToggle(index, $event)\"\n @keydown.space.native=\"handleDragKeyboardToggle(index, $event)\"\n @keydown.down.native=\"handleDragKeyboardMove(UseDragAndDropViewsDirectionEnum.DOWN, $event)\"\n @keydown.up.native=\"handleDragKeyboardMove(UseDragAndDropViewsDirectionEnum.UP, $event)\"\n @keydown.esc.native=\"handleDragStop\"\n >\n <template #iconLeft>\n <grab-icon :svg-title=\"t('reorderView', { label: item.label })\" />\n </template>\n </bento-button>\n\n <bento-button\n data-view-select\n class=\"b-header-with-views-all-views__popover-menu-item-button b-header-with-views-all-views__popover-menu-item-button-select\"\n variant=\"tertiary\"\n @click=\"emit('select:view', index)\"\n >\n <template #iconLeft>\n <span\n class=\"b-header-with-views-all-views__popover-menu-item-button-icon\"\n :class=\"`b-header-with-views-all-views__popover-menu-item-button-icon--${item.iconColor}`\"\n aria-hidden=\"true\"\n >\n <component :is=\"BentoHeaderWithViewsItemIconElement[item.icon]\" />\n </span>\n </template>\n\n <bento-typography\n el=\"span\"\n variant=\"body\"\n class=\"b-header-with-views-all-views__popover-menu-item-button-text\"\n >\n {{ item.label }}\n </bento-typography>\n </bento-button>\n\n <bento-menu\n ref=\"editViewMenuRefs\"\n data-view-menu\n class=\"b-header-with-views-all-views__popover-menu-item-button\"\n :button=\"{\n variant: 'tertiary',\n condensed: true,\n 'aria-label': t('openViewOptions', { label: item.label }),\n }\"\n :close-on-click-outside-options=\"menuCloseOnClickOutsideOptions\"\n :data=\"menuItemsActions\"\n menu-position=\"right-start\"\n @open=\"emit('open:view-menu', index)\"\n @close=\"emit('close:view-menu', index)\"\n @keydown.tab.native.capture=\"closeViewMenuNatively(index)\"\n >\n <template #iconLeft>\n <options-horizontal-icon :aria-hidden=\"true\" />\n </template>\n </bento-menu>\n </div>\n </li>\n </ul>\n </bento-popover>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { BentoButton, BentoToggleButton } from '@/components/button';\n import { BentoHeaderWithViewsItemIconElement } from '@/components/header-with-views/header-with-views.internal.types';\n import { BentoMenu } from '@/components/menu';\n import { BentoPopover } from '@/components/popover';\n import { BentoTypography } from '@/components/typography';\n import { useClickOutside } from '@/composables';\n import { generateUid } from '@/utils/ts/generate-uid';\n import { useI18n } from '@/utils/ts/i18n';\n import GrabIcon from '@adyen/ui-assets-icons-16/vue/grab';\n import MenuIcon from '@adyen/ui-assets-icons-16/vue/menu';\n import OptionsHorizontalIcon from '@adyen/ui-assets-icons-16/vue/options-horizontal';\n import { nextTick, ref, toRef } from 'vue';\n import { useDragAndDropViews, UseDragAndDropViewsDirectionEnum } from '../../composables';\n import { type HeaderWithViewsAllViewsProps } from './header-with-views-all-views.types';\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n const props = defineProps({\n menuCloseOnClickOutsideOptions: null,\n menuItems: null,\n menuItemsActions: null\n});\n\n const emit = defineEmits([\"close:all-views\", \"close:view-menu\", \"open:all-views\", \"open:view-menu\", \"select:view\", \"reorder:view\"]);\n\n const showMenu = ref(false);\n const allViewsMenuToggleRef = ref(null);\n const allViewsMenuPopoverRef = ref(null);\n const allViewsRef = ref(null);\n const menuRef = ref(null);\n const menuItemRefs = ref<Array<HTMLElement>>(null);\n const editViewMenuRefs = ref(null);\n\n const menuPopoverId = generateUid('menu-popover');\n\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n useClickOutside(allViewsMenuPopoverRef, () => closeMenu(), {\n ignore: [allViewsMenuToggleRef, ...(props.menuCloseOnClickOutsideOptions?.ignore ?? [])],\n });\n\n const openMenu = () => {\n showMenu.value = true;\n\n emit('open:all-views');\n };\n\n const closeMenu = async () => {\n if (!showMenu.value) {\n return;\n }\n\n showMenu.value = false;\n\n emit('close:all-views');\n\n await nextTick();\n\n allViewsMenuToggleRef.value.$el.focus();\n };\n\n const toggleShowMenu = (e: MouseEvent) => {\n e.stopPropagation();\n\n if (!showMenu.value) {\n openMenu();\n } else {\n closeMenu();\n }\n };\n\n const {\n draggedViewIndex,\n draggingOverViewIndex,\n isItemDragged,\n handleDragKeyboardMove,\n handleDragKeyboardToggle,\n handleDragStart,\n handleDragStop,\n } = useDragAndDropViews({\n items: toRef(props, 'menuItems'),\n itemRefs: menuItemRefs,\n onDrop: value => emit('reorder:view', value),\n });\n\n const conditionalDraggableItemClass = (index: number) => ({\n ['b-header-with-views-all-views__popover-menu-item--dragging']: isItemDragged(index),\n });\n\n const closeViewMenuNatively = (index: number) => {\n // skip built-in refocus on the menu button when menu is closed\n // enables tab to flow as intended by HTML spec\n editViewMenuRefs.value[index].closeMenu(false);\n };\n</script>\n\n<script lang=\"ts\">\n /\n Internal component to handle the logic for the list of all views available.\n /\n export default {\n i18n: { messages },\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./header-with-views-all-views.scss\" />\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-ui-assets/icons-16-circle_filled__a' + uuid + ')'\"><path fill=\"#001222\" d=\"M8 0.25C3.71979 0.25 0.25 3.71979 0.25 8C0.25 12.2802 3.71979 15.75 8 15.75C12.2802 15.75 15.75 12.2802 15.75 8C15.75 3.71979 12.2802 0.25 8 0.25Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-circle_filled__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","import {\n type BentoHeaderWithViewsItemAdditionalConfig,\n type BentoHeaderWithViewsItemIcon,\n type BentoHeaderWithViewsItemIconColor,\n} from '../../header-with-views.types';\nimport { type BentoHeaderWithViewsItemErrors } from '../../header-with-views.internal.types';\n\ntype HeaderWithViewsEditFormContext = `${HeaderWithViewsEditFormContextEnum}`;\n\nexport enum HeaderWithViewsEditFormContextEnum {\n EDIT = 'edit',\n CREATE = 'create',\n}\n\nexport interface HeaderWithViewsEditFormProps {\n additionalFormItem?: BentoHeaderWithViewsItemAdditionalConfig;\n context?: HeaderWithViewsEditFormContext;\n disableCustomization?: boolean;\n errors?: BentoHeaderWithViewsItemErrors;\n icon?: BentoHeaderWithViewsItemIcon;\n iconColor?: BentoHeaderWithViewsItemIconColor;\n label?: string;\n}\n","<template>\n <form class=\"b-header-with-views-edit-form\">\n <field-label>{{ t('title') }}</field-label>\n\n <div class=\"b-header-with-views-edit-form__icon-choice-alert\" role=\"alert\">{{ computedAlert }}</div>\n\n <div class=\"b-header-with-views-edit-form__icon-selector\">\n <bento-toggle-button\n ref=\"iconSelectorButtonRef\"\n variant=\"secondary\"\n :aria-expanded=\"showIconSelectorPopover\"\n :aria-controls=\"showIconSelectorPopover ? iconPopoverId : null\"\n :disabled=\"props.disableCustomization\"\n :toggled=\"showIconSelectorPopover\"\n @click=\"showIconSelectorPopover = !showIconSelectorPopover\"\n >\n <template #iconLeft>\n <component\n :is=\"BentoHeaderWithViewsItemIconElement[iconValue]\"\n :class=\"conditionalIconClass\"\n :svg-title=\"t('viewIcons')\"\n />\n </template>\n </bento-toggle-button>\n\n <bento-popover\n v-if=\"iconSelectorButtonRef && !props.disableCustomization\"\n :id=\"iconPopoverId\"\n ref=\"iconPopoverRef\"\n class=\"b-header-with-views-edit-form__icon-selector-popover\"\n :target-element=\"iconSelectorButtonRef\"\n :open=\"showIconSelectorPopover\"\n :fallback-position=\"['bottom-end']\"\n :fixed-positioning=\"true\"\n :overflow-visible=\"true\"\n position=\"bottom-end\"\n @dismiss=\"showIconSelectorPopover = false\"\n @keydown.escape.native.capture.stop.prevent=\"showIconSelectorPopover = false\"\n >\n <div class=\"b-header-with-views-edit-form__icon-panel\">\n <div class=\"b-header-with-views-edit-form__icon-color-options\">\n <div\n v-for=\"(color, index) in iconColorOptions\"\n :key=\"index\"\n class=\"b-header-with-views-edit-form__icon-options-wrapper\"\n >\n <bento-button\n class=\"b-header-with-views-edit-form__icon-color-options-button\"\n :class=\"`b-header-with-views-edit-form__icon-color--${color}`\"\n :aria-selected=\"iconColorValue === color\"\n variant=\"tertiary\"\n @click=\"iconColorValue = color\"\n >\n <template #iconLeft>\n <circle-filled-icon\n :svg-title=\"t('selectIconColor', { color })\"\n ></circle-filled-icon>\n </template>\n </bento-button>\n </div>\n </div>\n\n <bento-divider />\n\n <div class=\"b-header-with-views-edit-form__icon-options\">\n <bento-button\n v-for=\"(icon, index) in iconOptions\"\n :key=\"index\"\n class=\"b-header-with-views-edit-form__icon-options-button\"\n :aria-selected=\"iconValue === icon\"\n variant=\"tertiary\"\n @click=\"iconValue = icon\"\n >\n <template #iconLeft>\n <component\n :is=\"BentoHeaderWithViewsItemIconElement[icon]\"\n :svg-title=\"t('selectIcon', { icon })\"\n />\n </template>\n </bento-button>\n </div>\n </div>\n </bento-popover>\n\n <bento-input-field\n ref=\"inputFieldRef\"\n class=\"b-header-with-views-edit-form__icon-selector-input\"\n :aria-label=\"t('viewLabel')\"\n :error-message=\"errors.label\"\n :model-value=\"labelValue\"\n @keydown.enter.prevent=\"handleKeydownEnter\"\n @update:model-value=\"handleInput\"\n @blur=\"emit('blur:label', labelValue)\"\n ></bento-input-field>\n </div>\n\n <bento-checkbox\n v-if=\"additionalFormItem\"\n :model-value=\"additionalFormItemValue\"\n class=\"b-header-with-views-edit-form__additional-config\"\n @update:model-value=\"handleAdditionalFormItemChange\"\n >\n {{ additionalFormItem.label }}\n </bento-checkbox>\n\n <bento-button-actions\n class=\"b-header-with-views-edit-form__actions\"\n :actions=\"computedActions\"\n layout=\"buttons-end\"\n />\n </form>\n</template>\n\n<script setup lang=\"ts\">\n import {\n BentoButton,\n BentoButtonActions,\n type BentoButtonActionsList,\n BentoToggleButton,\n } from '@/components/button';\n import { BentoCheckbox } from '@/components/checkbox';\n import { BentoDivider } from '@/components/divider';\n import { BentoInputField } from '@/components/input-field';\n import { BentoPopover } from '@/components/popover';\n import { useClickOutside } from '@/composables';\n import { generateUid } from '@/utils/ts/generate-uid';\n import { FieldLabel } from '@/internal';\n import { debounce } from '@/utils/ts/debounce';\n import { useI18n } from '@/utils/ts/i18n';\n import CircleFilledIcon from '@adyen/ui-assets-icons-16/vue/circle-filled';\n import { onKeyStroke } from '@vueuse/core';\n import { computed, nextTick, onMounted, ref, watch } from 'vue';\n import {\n BentoHeaderWithViewsItemIconColorEnum,\n BentoHeaderWithViewsItemIconElement,\n BentoHeaderWithViewsItemIconEnum,\n } from '../../header-with-views.internal.types';\n import { type BentoHeaderWithViewsItem } from '../../header-with-views.types';\n import {\n HeaderWithViewsEditFormContextEnum,\n type HeaderWithViewsEditFormProps,\n } from './header-with-views-edit-form.types';\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n const props = defineProps({\n additionalFormItem: { default: null },\n context: { default: HeaderWithViewsEditFormContextEnum.CREATE },\n disableCustomization: { type: Boolean, default: false },\n errors: { default: null },\n icon: { default: BentoHeaderWithViewsItemIconEnum.STACK },\n iconColor: { default: BentoHeaderWithViewsItemIconColorEnum.PRIMARY },\n label: { default: '' }\n});\n\n const emit = defineEmits([\"cancel\", \"update\", \"delete\", \"input:label\", \"blur:label\", \"keydown:enter\"]);\n\n // form inputs\n const labelValue = ref(props.label);\n const iconValue = ref(props.icon);\n const iconColorValue = ref(props.iconColor);\n const additionalFormItemValue = ref<boolean>(props.additionalFormItem?.value ?? false);\n const isFormDirty = ref(false);\n\n // refs\n const iconSelectorButtonRef = ref(null);\n const iconPopoverRef = ref(null);\n const inputFieldRef = ref(null);\n\n const iconPopoverId = generateUid('iconPopover');\n\n // view controls\n const showIconSelectorPopover = ref(false);\n\n const iconOptions = computed(() => Object.values(BentoHeaderWithViewsItemIconEnum));\n const iconColorOptions = computed(() => Object.values(BentoHeaderWithViewsItemIconColorEnum));\n const hasErrors = computed(() => Object.values(props.errors).some(error => error.length > 0));\n const computedAlert = computed(\n () => `${t('selected')}: ${iconValue.value} ${t('icon')}, ${t('color')} ${iconColorValue.value}`\n );\n\n const computedActions = computed<BentoButtonActionsList>(() => [\n ...(props.context === HeaderWithViewsEditFormContextEnum.EDIT\n ? // edit mode\n [\n {\n title: t('save'),\n type: 'submit',\n event: () => {\n if (hasErrors.value) {\n return;\n }\n\n updateView();\n },\n },\n ]\n : // create mode\n [\n {\n title: t('create'),\n type: 'submit',\n event: () => {\n if (!isFormDirty.value \|\| hasErrors.value) {\n return;\n }\n\n updateView();\n },\n },\n ]),\n {\n title: t('cancel'),\n event: resetView,\n },\n ]);\n\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n const computedFormValues = computed(() => ({\n iconColor: iconColorValue.value,\n icon: iconValue.value,\n label: labelValue.value,\n ...(props.additionalFormItem\n ? {\n additionalViewSetting: {\n label: props.additionalFormItem.label,\n value: additionalFormItemValue.value,\n },\n }\n : []),\n }));\n\n const conditionalIconClass = computed(() =>\n props.disableCustomization ? '' : `b-header-with-views-edit-form__icon-color--${iconColorValue.value}`\n );\n\n const hideIconSelectorPopover = () => {\n showIconSelectorPopover.value = false;\n };\n\n const updateView = () => {\n emit('update', computedFormValues.value);\n };\n\n const resetView = () => {\n iconValue.value = props.icon;\n iconColorValue.value = props.iconColor;\n labelValue.value = props.label;\n\n emit('cancel');\n };\n\n const handleInput = debounce((value: string) => {\n labelValue.value = value;\n\n isFormDirty.value = true;\n }, 200);\n\n const handleKeydownEnter = (event: KeyboardEvent) => {\n labelValue.value = (event.target as HTMLInputElement).value;\n isFormDirty.value = true;\n\n emit('keydown:enter', computedFormValues.value);\n };\n\n const handleAdditionalFormItemChange = (value: boolean) => {\n additionalFormItemValue.value = value;\n\n isFormDirty.value = true;\n };\n\n useClickOutside(iconPopoverRef, hideIconSelectorPopover, {\n ignore: [iconSelectorButtonRef],\n });\n\n onKeyStroke('Escape', hideIconSelectorPopover, {\n target: iconPopoverRef,\n eventName: 'keydown',\n });\n\n watch(labelValue, value => emit('input:label', value));\n\n onMounted(async () => {\n // force focus to start from the input field\n await nextTick();\n inputFieldRef.value.$refs.inputFieldElement.focus();\n });\n</script>\n\n<script lang=\"ts\">\n /\n Internal component to which presents a form for handling the logic of editing and creating a view.\n /\n export default {\n i18n: { messages },\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./header-with-views-edit-form.scss\" />\n","<template>\n <div ref=\"hostRef\" class=\"b-header-with-views\">\n <div class=\"b-header-with-views__container\" :class=\"conditionalContainerClass\">\n <div class=\"b-header-with-views__title\">\n <bento-typography el=\"h2\" variant=\"title\">{{ title }}</bento-typography>\n\n <info-icon-with-popover\n v-if=\"infoIconTooltipText \|\| hasSlot('infoIconTooltipContent')\"\n :popover-text=\"infoIconTooltipText\"\n class=\"b-header-with-views__title-icon\"\n >\n <template v-if=\"hasSlot('infoIconTooltipContent')\" #default>\n <slot name=\"infoIconTooltipContent\" />\n </template>\n </info-icon-with-popover>\n </div>\n\n <fieldset ref=\"viewsRef\" class=\"b-header-with-views__bar\" :aria-label=\"t('viewListLabel')\">\n <div\n v-for=\"(view, index) in computedViews\"\n :key=\"index\"\n ref=\"viewRefs\"\n class=\"b-header-with-views__bar-tab\"\n :class=\"isViewActive(index) ? 'b-header-with-views__bar-tab--active' : null\"\n >\n <bento-button\n class=\"b-header-with-views__bar-tab-button\"\n variant=\"tertiary-with-background\"\n :aria-current=\"currentActiveView === index ? 'true' : 'false'\"\n @click=\"handleViewSelect(index)\"\n @keydown.enter.native=\"handleViewSelect(index)\"\n @keydown.space.native=\"handleViewSelect(index)\"\n >\n <template #iconLeft>\n <span\n class=\"b-header-with-views__bar-tab-button-icon\"\n :class=\"`b-header-with-views__bar-tab-button-icon--${view.iconColor}`\"\n aria-hidden=\"true\"\n >\n <component :is=\"BentoHeaderWithViewsItemIconElement[view.icon]\" />\n </span>\n </template>\n\n <bento-typography\n el=\"span\"\n variant=\"body\"\n stronger\n class=\"b-header-with-views__bar-tab-button-text\"\n >\n {{ view.label }}\n </bento-typography>\n\n <template v-if=\"isViewUnsaved(index)\" #iconRight>\n <span class=\"b-header-with-views__bar-tab-button--unsaved\">\n <dot-icon :svg-title=\"t('withUnsavedChanges')\" />\n </span>\n </template>\n </bento-button>\n\n <bento-menu\n v-if=\"currentActiveView === index\"\n ref=\"editViewMenuRefs\"\n class=\"b-header-with-views__bar-tab-menu\"\n :button=\"{ variant: 'tertiary', 'aria-label': t('openViewOptions', { label: view.label }) }\"\n :data=\"getViewMenuData(index)\"\n :close-on-click-outside-options=\"{\n ignore: [`#${editViewPopoverId}`],\n }\"\n :menu-fixed-positioning=\"true\"\n @open=\"showViewMenuPopover(index)\"\n @close=\"hideViewMenuPopover()\"\n @keydown.tab.native.capture=\"handleTabEditViewPopover\"\n >\n <template #iconLeft>\n <options-horizontal-icon :aria-hidden=\"true\" />\n </template>\n </bento-menu>\n </div>\n\n <div ref=\"viewControlRef\" class=\"b-header-with-views__bar-control\">\n <!-- All views -->\n <header-with-views-all-views\n v-if=\"computedViews.length\"\n ref=\"viewControlAllViewsRef\"\n :menu-items=\"computedViews\"\n :menu-items-actions=\"getViewMenuData(activeViewMenuPopover)\"\n :menu-close-on-click-outside-options=\"{ ignore: [`#${editViewPopoverId}`] }\"\n @close:view-menu=\"hideViewMenuPopover()\"\n @close:all-views=\"showAllViewsPopover = false\"\n @open:all-views=\"showAllViewsPopover = true\"\n @open:view-menu=\"index => showViewMenuPopover(index)\"\n @reorder:view=\"views => handleReorder(views)\"\n @select:view=\"index => handleViewSelect(index)\"\n />\n\n <bento-toggle-button\n ref=\"createViewButtonRef\"\n :aria-expanded=\"showCreateViewPopover\"\n :aria-controls=\"showCreateViewPopover ? createViewPopoverId : null\"\n :toggled=\"showCreateViewPopover\"\n variant=\"tertiary\"\n @click=\"showCreateViewPopover = !showCreateViewPopover\"\n >\n <template #iconLeft>\n <plus-icon :svg-title=\"t('createView')\" :aria-hidden=\"computedViews.length === 0\" />\n </template>\n\n <template v-if=\"computedViews.length === 0\" #default>{{ t('createView') }}</template>\n </bento-toggle-button>\n </div>\n </fieldset>\n\n <title-details\n v-if=\"hasMetaSection\"\n class=\"b-header-with-views__meta-container\"\n :description=\"description\"\n :last-updated=\"lastUpdated\"\n :reload-button=\"reloadButton\"\n >\n <template v-if=\"hasSlot('description')\" #description><slot name=\"description\" /></template>\n </title-details>\n\n <button-actions-with-menu\n v-if=\"actions\"\n :actions=\"actions\"\n :actions-layout=\"isCompact ? 'buttons-start' : 'buttons-end'\"\n :displayed-actions=\"2\"\n :disable-responsive-behavior=\"true\"\n :hide-displayed-actions-breakpoint=\"STACKED_LAYOUT_BREAKPOINT\"\n class=\"b-header-with-views__actions\"\n />\n </div>\n\n <!-- Create view -->\n <bento-popover\n v-if=\"activeViewMenuPopover === null && createViewButtonRef\"\n :id=\"createViewPopoverId\"\n ref=\"createViewPopoverRef\"\n :dismissible=\"true\"\n :fixed-positioning=\"true\"\n :target-element=\"createViewButtonRef\"\n :title=\"t('createView')\"\n :open=\"showCreateViewPopover\"\n :overflow-visible=\"true\"\n position=\"bottom-start\"\n @dismiss=\"hideCreateViewPopover\"\n @keydown.esc.native.capture.stop.prevent=\"hideCreateViewPopover\"\n >\n <header-with-views-edit-form\n context=\"create\"\n :errors=\"errors\"\n :additional-form-item=\"additionalViewSetting\"\n :disable-customization=\"disableCustomization\"\n @blur:label=\"value => validateLabel(value, activeViewMenuPopover)\"\n @input:label=\"value => validateLabel(value, activeViewMenuPopover)\"\n @keydown:enter=\"handleKeydownEnterViewItem\"\n @update=\"handleCreateViewItem\"\n @cancel=\"hideCreateViewPopover\"\n >\n </header-with-views-edit-form>\n </bento-popover>\n\n <!-- Edit view -->\n <bento-popover\n v-if=\"activeViewMenuPopover !== null && editViewTargetElementRef\"\n :id=\"editViewPopoverId\"\n ref=\"editViewPopoverRef\"\n :disable-focus-trap=\"false\"\n :dismissible=\"true\"\n :fixed-positioning=\"true\"\n :target-element=\"editViewTargetElementRef\"\n :title=\"t('editDetails')\"\n :open=\"activeEditViewPopover !== null\"\n :overflow-visible=\"true\"\n position=\"right-start\"\n @dismiss=\"setActiveEditViewPopover()\"\n @keydown.esc.native.capture.stop.prevent=\"setActiveEditViewPopover()\"\n >\n <header-with-views-edit-form\n v-if=\"computedViews[activeEditViewPopover]\"\n context=\"edit\"\n :additional-form-item=\"computedViews[activeEditViewPopover].additionalViewSetting\"\n :errors=\"errors\"\n :icon=\"computedViews[activeEditViewPopover].icon\"\n :icon-color=\"computedViews[activeEditViewPopover].iconColor\"\n :label=\"computedViews[activeEditViewPopover].label\"\n :disable-customization=\"disableCustomization\"\n @blur:label=\"value => validateLabel(value, activeViewMenuPopover)\"\n @input:label=\"value => validateLabel(value, activeViewMenuPopover)\"\n @keydown:enter=\"handleKeydownEnterViewItem\"\n @update=\"handleUpdateViewItem\"\n @cancel=\"hideEditViewPopover\"\n >\n </header-with-views-edit-form>\n </bento-popover>\n\n <!-- Unsaved views prompt -->\n <bento-modal\n :actions=\"computedUnsavedViewModalActions\"\n :is-dismissible=\"false\"\n :is-open=\"showUnsavedModalWarning\"\n @close-modal=\"showUnsavedModalWarning = false\"\n >\n <template #default>{{ t('leaveView') }}</template>\n <template #content>\n <div class=\"b-header-with-views__modal-description\">\n <bento-typography>\n <component :is=\"i18nComponent\" v-bind=\"getI18nProps('leaveViewDescription')\" tag=\"span\">\n <template #label>\n <bento-typography strongest el=\"span\">{{\n computedViews[currentActiveView]?.label\n }}</bento-typography>\n </template>\n </component>\n </bento-typography>\n\n <bento-checkbox\n v-if=\"skipUnsavedChangesText\"\n :model-value=\"skipUnsavedChangesReminder\"\n @update:model-value=\"value => (skipUnsavedChangesReminder = value)\"\n >\n {{ skipUnsavedChangesText }}\n </bento-checkbox>\n </div>\n </template>\n </bento-modal>\n\n <!-- Delete views prompt -->\n <bento-modal\n :actions=\"computedDeleteViewModalActions\"\n :is-open=\"showDeleteModalWarning\"\n :is-dismissible=\"false\"\n destructive-actions\n @click.native.capture=\"handleClickModal\"\n @close-modal=\"showDeleteModalWarning = false\"\n >\n <template #default>\n {{ t('deleteView') }}\n </template>\n <template #content>\n <div class=\"b-header-with-views__modal-description\">\n <bento-typography>\n <component :is=\"i18nComponent\" v-bind=\"getI18nProps('deleteViewDescription')\" tag=\"span\">\n <template #label>\n <bento-typography strongest el=\"span\">{{\n computedViewToBeDeletedLabel\n }}</bento-typography>\n </template>\n </component>\n </bento-typography>\n </div>\n </template>\n </bento-modal>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { BentoButton, BentoToggleButton } from '@/components/button';\n import { BentoCheckbox } from '@/components/checkbox';\n import { BentoMenu, type BentoMenuItem } from '@/components/menu';\n import BentoModal from '@/components/modal/modal.vue';\n import { BentoPopover } from '@/components/popover';\n import { BentoTypography } from '@/components/typography';\n import { TitleDetails } from '@/internal';\n import { useBentoToastController, useClickOutside, useHasSlot } from '@/composables';\n import { generateUid } from '@/utils/ts/generate-uid';\n import ButtonActionsWithMenu from '@/internal/button-actions-with-menu/button-actions-with-menu.vue';\n import { InfoIconWithPopover } from '@/internal/info-icon-with-popover';\n import { getI18nComponent, getI18nProps, useI18n } from '@/utils/ts/i18n';\n import BinIcon from '@adyen/ui-assets-icons-16/vue/bin';\n import DotIcon from '@adyen/ui-assets-icons-16/vue/dot';\n import DownloadIcon from '@adyen/ui-assets-icons-16/vue/download';\n import EditIcon from '@adyen/ui-assets-icons-16/vue/edit-2';\n import HeartIcon from '@adyen/ui-assets-icons-16/vue/heart';\n import OptionsHorizontalIcon from '@adyen/ui-assets-icons-16/vue/options-horizontal';\n import PlusIcon from '@adyen/ui-assets-icons-16/vue/plus';\n import PlusMultipleIcon from '@adyen/ui-assets-icons-16/vue/plus-multiple';\n import RefreshIcon from '@adyen/ui-assets-icons-16/vue/refresh';\n import { useElementSize } from '@vueuse/core';\n import { computed, nextTick, onMounted, ref, useSlots, watch } from 'vue';\n import { HeaderWithViewsAllViews, HeaderWithViewsEditForm } from './components';\n import { useEditViews, useResponsiveViews } from './composables';\n import {\n type BentoHeaderWithViewsEmits,\n BentoHeaderWithViewsItemIconElement,\n } from './header-with-views.internal.types';\n import { type BentoHeaderWithViewsItem, type BentoHeaderWithViewsProps } from './header-with-views.types';\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n const props = defineProps({\n actions: { default: () => [] },\n title: { default: null },\n views: { default: () => [] },\n additionalViewSetting: { default: null },\n hasChanges: { type: Boolean },\n skipUnsavedChangesText: null,\n disableCustomization: { type: Boolean, default: false },\n infoIconTooltipText: { default: null },\n description: { default: null },\n lastUpdated: { default: null },\n reloadButton: { default: null },\n disableAutoSelect: { type: Boolean, default: false },\n activeViewIndex: { default: undefined }\n});\n\n const emit = defineEmits([\"add:view\", \"delete:view\", \"duplicate:view\", \"reorder:view\", \"restore:view\", \"save:view\", \"select:view\", \"update:view\", \"update:skip-unsaved-changes\", \"update:active-view-index\"]);\n\n const STACKED_LAYOUT_BREAKPOINT = 573;\n\n const i18nComponent = getI18nComponent();\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n const slots = useSlots();\n const hasSlot = useHasSlot(slots);\n\n // refs\n const createViewButtonRef = ref(null);\n const createViewPopoverRef = ref(null);\n const editViewPopoverRef = ref(null);\n const editViewMenuRefs = ref([]);\n const editViewTargetElementRef = ref(null); // used as a mount for the edit form popover\n const hostRef = ref(null);\n const viewsRef = ref<HTMLElement>(null); // container for all views\n const viewRefs = ref<Array<HTMLDivElement>>([]); // individual view\n const viewControlRef = ref(null); // all views menu and create view button container\n const viewControlAllViewsRef = ref(null); // all views menu\n\n // controls\n const showCreateViewPopover = ref<boolean>(false); // control the create view popover\n const showAllViewsPopover = ref<boolean>(false); // control when menu button is shown\n const showUnsavedModalWarning = ref<boolean>(false);\n const showDeleteModalWarning = ref<boolean>(false);\n const activeEditViewPopover = ref<number>(null); // control the edit view popover\n const activeViewMenuPopover = ref<number>(null); // control when menu items are shown\n const internalActiveView = ref<number>(null); // control which view the user is currently on\n const nextActiveView = ref<number>(null); // control which view is does the user want to navigate to, used for caching unsaved view navigation\n const viewToBeDeleted = ref<number>(null); // cache which view is marked for deletion\n\n // Computed property to handle two-way binding for activeViewIndex\n const currentActiveView = computed({\n get: () => internalActiveView.value,\n set: (value: number \| null) => {\n internalActiveView.value = value;\n emit('update:active-view-index', value);\n },\n });\n\n // models\n const skipUnsavedChangesReminder = ref<boolean>(false);\n\n const createViewPopoverId = generateUid('createViewPopover');\n const editViewPopoverId = generateUid('editViewPopover');\n\n useResponsiveViews({\n container: viewsRef,\n children: viewRefs,\n offset: viewControlRef,\n activeViewIndex: currentActiveView,\n });\n\n const { computedViews, clearError, duplicateView, errors, setViews, updateView, validateLabel } = useEditViews({\n additionalViewSetting: props.additionalViewSetting,\n views: props.views,\n });\n\n const hideCreateViewPopover = async (updateFocus = true) => {\n showCreateViewPopover.value = false;\n\n if (updateFocus) {\n await nextTick();\n\n createViewButtonRef.value.$el.focus();\n }\n\n clearError();\n };\n\n const hideEditViewPopover = () => {\n const currentMenuRef = showAllViewsPopover.value\n ? viewControlAllViewsRef.value.$refs.editViewMenuRefs[activeEditViewPopover.value]\n : editViewMenuRefs.value[0];\n\n currentMenuRef?.closeMenu();\n };\n\n useClickOutside(createViewPopoverRef, () => hideCreateViewPopover(false), {\n ignore: [createViewButtonRef],\n });\n\n useClickOutside(editViewPopoverRef, () => setActiveEditViewPopover(), {\n ignore: [editViewTargetElementRef],\n });\n\n const { width: hostWidth } = useElementSize(hostRef);\n\n const { addToast } = useBentoToastController();\n\n const computedUnsavedViewModalActions = computed(() => [\n {\n title: t('leave'),\n event: handleRestoreChanges,\n },\n {\n title: t('saveChanges'),\n event: handleSaveChanges,\n },\n ]);\n\n const computedDeleteViewModalActions = computed(() => [\n {\n title: t('delete'),\n event: async () => {\n showDeleteModalWarning.value = false;\n\n const updatedViewObj = updateView(null, viewToBeDeleted.value);\n\n emit('delete:view', updatedViewObj);\n\n hideViewMenuPopover();\n\n // if a view that is placed higher in the order is deleted, ignore\n if (currentActiveView.value < viewToBeDeleted.value) {\n return;\n }\n\n // if a view that is placed lower in the order is deleted,\n // we need to shift the index to maintain the current view\n if (currentActiveView.value > viewToBeDeleted.value) {\n currentActiveView.value -= 1;\n } else if (currentActiveView.value === viewToBeDeleted.value) {\n if (updatedViewObj.newViews.length === 0) {\n // there are no more views\n\n currentActiveView.value = null;\n } else if (currentActiveView.value >= updatedViewObj.newViews.length) {\n // shift it to the left\n\n currentActiveView.value -= 1;\n }\n // else, keep it at the same index\n }\n\n viewToBeDeleted.value = null;\n },\n },\n {\n title: t('cancel'),\n event: () => {\n showDeleteModalWarning.value = false;\n },\n },\n ]);\n\n const computedViewToBeDeletedLabel = computed(() => computedViews.value[viewToBeDeleted.value]?.label);\n const hasMetaSection = computed(() => props.description \|\| hasSlot('description') \|\| props.lastUpdated);\n const isCompact = computed(() => hostWidth.value <= STACKED_LAYOUT_BREAKPOINT);\n\n const conditionalContainerClass = computed(() => ({\n 'b-header-with-views__container--is-compact': isCompact.value,\n 'b-header-with-views__container--has-meta': hasMetaSection.value,\n }));\n\n watch([currentActiveView, computedViews], ([newIndex, newViews], [oldIndex, oldViews]) => {\n // skip if the labels are the same or no active view\n const isViewUpdated = newIndex === oldIndex && newViews.length === oldViews.length;\n const isViewDeletedWithChangedIndex = newViews[newIndex]?.label === oldViews[oldIndex]?.label;\n\n if (isViewUpdated \|\| isViewDeletedWithChangedIndex) {\n return;\n }\n\n // allow empty label\n // occurs when the user removes all views\n emit('select:view', newViews[newIndex]?.label ?? null);\n });\n\n // whenever the view menu popover changes, we reset the edit popover because it is never opened by default\n watch(activeViewMenuPopover, () => {\n setActiveEditViewPopover();\n });\n\n watch(showAllViewsPopover, value => {\n if (value) {\n return;\n }\n\n // if show all view popover is closed, close children as well\n hideViewMenuPopover();\n });\n\n // set the popover to open next to the edit button\n watch(activeEditViewPopover, value => {\n const editButtonIndex = isViewUnsaved(value) ? 2 : 0;\n\n // EDGE CASE:\n // Since edit button can be clicked while in all views popover or while it is in the bar,\n // we will not support the case where edit popover is opened and the screen is resize until the view menu is hidden.\n // Edit popover will still be displayed but the position does not have to follow the edit button as it is hidden.\n if (showAllViewsPopover.value) {\n const menuListItemRef =\n viewControlAllViewsRef.value.$refs.editViewMenuRefs[activeViewMenuPopover.value]?.$refs\n ?.menuItemListRef;\n\n editViewTargetElementRef.value =\n viewControlAllViewsRef.value.$refs.editViewMenuRefs[activeViewMenuPopover.value]?.$refs?.menuItemListRef\n ?.$refs?.menuItemRef?.[editButtonIndex] ?? null;\n\n if (!value) {\n menuListItemRef?.focusItem();\n\n clearError();\n }\n\n return;\n }\n\n const menuListItemRef = editViewMenuRefs.value.find(ref => ref.$refs.menuItemListRef)?.$refs?.menuItemListRef;\n editViewTargetElementRef.value = menuListItemRef?.$refs?.menuItemRef?.[editButtonIndex] ?? null;\n\n if (!value) {\n menuListItemRef?.focusItem();\n\n clearError();\n }\n });\n\n // Watch for external changes to the activeViewIndex prop\n watch(\n () => props.activeViewIndex,\n newValue => {\n if (newValue !== undefined && newValue >= 0 && newValue < computedViews.value.length) {\n currentActiveView.value = newValue;\n }\n }\n );\n\n onMounted(() => {\n if (\n props.activeViewIndex !== undefined &&\n props.activeViewIndex >= 0 &&\n props.activeViewIndex < computedViews.value.length\n ) {\n currentActiveView.value = props.activeViewIndex;\n } else if (!props.disableAutoSelect) {\n const defaultView = computedViews.value.findIndex(view => view.isDefault);\n currentActiveView.value = defaultView >= 0 ? defaultView : 0;\n }\n });\n\n const getViewMenuData = (index: number): Array<BentoMenuItem> => [\n ...(isViewUnsaved(index)\n ? [\n {\n text: t('saveChanges'),\n handler: handleSaveChanges,\n icon: DownloadIcon,\n },\n {\n addDivider: true,\n text: t('restoreChanges'),\n handler: handleRestoreChanges,\n icon: RefreshIcon,\n },\n ]\n : []),\n ...(!computedViews.value[index]?.isFixed\n ? [\n {\n text: t('edit'),\n handler: () => {\n setActiveEditViewPopover(activeViewMenuPopover.value);\n },\n icon: EditIcon,\n skipClose: true,\n },\n ]\n : []),\n {\n text: t('setAsDefault'),\n handler: () => {\n const updatedViewObj = updateView({ isDefault: true }, activeViewMenuPopover.value);\n\n emit('update:view', updatedViewObj);\n\n addToast({\n text: t('setAsDefaultToast', { label: updatedViewObj.targetViewLabel }),\n });\n\n hideViewMenuPopover();\n },\n icon: HeartIcon,\n },\n {\n text: t('duplicate'),\n handler: () => {\n const updatedViewObj = duplicateView(activeViewMenuPopover.value);\n\n emit('duplicate:view', updatedViewObj);\n\n hideViewMenuPopover();\n\n // switch to newly duplicated view\n handleViewSelect(updatedViewObj.newViews.length - 1);\n },\n icon: PlusMultipleIcon,\n },\n ...(!computedViews.value[index]?.isFixed\n ? [\n {\n text: t('delete'),\n handler: () => {\n viewToBeDeleted.value = activeViewMenuPopover.value;\n showDeleteModalWarning.value = true;\n },\n critical: true,\n icon: BinIcon,\n },\n ]\n : []),\n ];\n\n const showViewMenuPopover = (index: number) => {\n activeViewMenuPopover.value = index;\n };\n\n const hideViewMenuPopover = () => {\n activeViewMenuPopover.value = null;\n\n setActiveEditViewPopover();\n };\n\n const setActiveEditViewPopover = (index?: number) => {\n if (index === activeEditViewPopover.value) {\n activeEditViewPopover.value = null;\n } else {\n activeEditViewPopover.value = index ?? null;\n }\n };\n\n const handleCreateViewItem = (value: BentoHeaderWithViewsItem) => {\n const updatedViewObj = updateView(value);\n\n emit('add:view', updatedViewObj);\n\n hideCreateViewPopover();\n\n // switch to new view on add\n handleViewSelect(updatedViewObj.newViews.findIndex(view => updatedViewObj.targetViewLabel === view.label));\n\n addToast({\n text: t('createViewToast', { label: updatedViewObj.targetViewLabel }),\n });\n };\n\n const handleUpdateViewItem = (value: BentoHeaderWithViewsItem) => {\n emit('update:view', updateView(value, activeEditViewPopover.value));\n\n hideEditViewPopover();\n };\n\n const handleKeydownEnterViewItem = (value: BentoHeaderWithViewsItem) => {\n validateLabel(value.label, activeViewMenuPopover.value);\n\n if (Object.values(errors).some(error => error.length > 0)) {\n return;\n }\n\n if (activeEditViewPopover.value) {\n handleUpdateViewItem(value);\n\n return;\n }\n\n handleCreateViewItem(value);\n };\n\n const handleViewSelect = (index: number) => {\n // If there's no currently active view, or if there are no unsaved changes,\n // just switch to the new view.\n if (currentActiveView.value === null \|\| !props.hasChanges \|\| props.skipUnsavedChangesText === null) {\n // If switching from an existing view, emit restore event.\n if (currentActiveView.value !== null) {\n emit('restore:view', computedViews.value[currentActiveView.value].label);\n }\n currentActiveView.value = index;\n return;\n }\n\n nextActiveView.value = index;\n showUnsavedModalWarning.value = true;\n };\n\n const handleReorder = (reorderedViews: Array<BentoHeaderWithViewsItem>) => {\n const currentActiveLabel =\n currentActiveView.value !== null ? computedViews.value[currentActiveView.value]?.label : null;\n\n const result = setViews(reorderedViews);\n\n if (currentActiveLabel) {\n const newIndex = result.newViews.findIndex(view => view.label === currentActiveLabel);\n\n if (newIndex !== -1) {\n currentActiveView.value = newIndex;\n }\n }\n\n emit('reorder:view', result);\n };\n\n const handleClickModal = (event: MouseEvent) => {\n if ((event.target as HTMLElement).closest('button')) {\n return;\n }\n\n event.stopPropagation();\n event.preventDefault();\n };\n\n const handleTabEditViewPopover = () => {\n // skip built-in refocus on the menu button when menu is closed\n // enables tab to flow as intended by HTML spec\n editViewMenuRefs.value[0].closeMenu(false);\n };\n\n const handleSaveChanges = () => {\n const label = computedViews.value[currentActiveView.value].label;\n\n emit('save:view', label);\n\n if (showUnsavedModalWarning.value) {\n emit('update:skip-unsaved-changes', skipUnsavedChangesReminder.value);\n\n // fired when user saves the view while navigating to a different tab\n currentActiveView.value = nextActiveView.value;\n nextActiveView.value = null;\n showUnsavedModalWarning.value = false;\n } else {\n // fired when user saves the view via the menu\n hideViewMenuPopover();\n }\n\n addToast({\n text: t('saveChangesToast', { label }),\n action: {\n handler: () => emit('restore:view', label),\n text: t('undo'),\n },\n });\n };\n\n const handleRestoreChanges = () => {\n emit('restore:view', computedViews.value[currentActiveView.value].label);\n\n if (showUnsavedModalWarning.value) {\n emit('update:skip-unsaved-changes', skipUnsavedChangesReminder.value);\n\n // fired when user restore the view while navigating to a different tab\n currentActiveView.value = nextActiveView.value;\n nextActiveView.value = null;\n showUnsavedModalWarning.value = false;\n } else {\n // fired when user restore the view via the menu\n hideViewMenuPopover();\n }\n };\n\n const isViewActive = (index: number) => currentActiveView.value === index;\n const isViewUnsaved = (index: number) => isViewActive(index) && props.hasChanges;\n</script>\n\n<script lang=\"ts\">\n /\n Header with views allow users to save and quickly retrieve configurations tailored to specific tasks.\n * For example, managing daily transactions, auditing, or analyzing specific data sets.\n * It also allows the user to define the columns, filters, and search queries they need.\n \n @example\n * import { BentoHeaderWithViews } from '@adyen/bento-vue2';\n \n export default {\n * components: { BentoHeaderWithViews },\n * template: `\n * <bento-header-with-views\n * :actions=\"[\n * { title: 'Primary action', event: () => undefined },\n * { title: 'Secondary action', event: () => undefined },\n * { title: 'Tertiary action', event: () => undefined },\n * { title: 'Another action', event: () => undefined }\n * ]\"\n * description=\"Page Description\"\n * title=\"Page Title\"\n * :views=\"[\n * { icon: 'stack', iconColor: 'blue', label: 'A very long value' },\n * { icon: 'stack', iconColor: 'primary', label: 'Title 1' },\n * { icon: 'stack', iconColor: 'primary', label: 'Title 2' }\n * ]\"\n * :additionalViewSetting=\"{\n * label: 'Include date filter (relative)',\n * value: false\n * }\"\n * hasChanges\n * />\n * `\n * };\n */\n export default {\n i18n: { messages },\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./header-with-views.scss\" />\n"],"names":["instance","getCurrentInstance","uuid","BentoHeaderWithViewsItemIconColorEnum","BentoHeaderWithViewsItemIconColorEnum2","BentoHeaderWithViewsItemIconEnum","BentoHeaderWithViewsItemIconEnum2","BentoHeaderWithViewsItemIconElement","StackIcon","LeafIcon","HandRockIcon","CarIcon","EducationIcon","HotelIcon","TravelBagIcon","LightningIcon","NewsIcon","PrizeIcon","LockIcon","BagIcon","DiamondIcon","TargetIcon","GiftIcon","CashStackIcon","HashtagIcon","CloudIcon","HospitalityIcon","ShoppingCartIcon","SleepIcon","NotificationIcon","ThumbsUpIcon","ThumbsDownIcon","StarIcon","WarningDiamondIcon","RetailIcon","EmoticonHappyIcon","GamingIcon","SupportIcon","HeartIcon","HourglassIcon","WorldIcon","useEditViews","options","views","ref","errors","reactive","t","useI18n","computedViews","computed","viewItem","updateView","data","index","newViews","oldViews","targetViewLabel","view","duplicateView","toCopyLabel","copiedLabel","suffix","newView","setViews","clearError","value","labelIsRequired","labelAlreadyExist","viewIndex","UseDragAndDropViewsDirectionEnum","UseDragAndDropViewsDirectionEnum2","useDragAndDropViews","itemRefs","items","onDrop","animationFrameId","draggedViewIndex","dragMousePosition","dragKeyboardInitiated","dragOffset","draggingOverViewIndex","maxDragOffsetY","minDragOffsetY","menuItemsElementRects","isItemDragged","handleDragStart","event","updateMenuItemsRects","draggedElement","handleDragKeyboardToggle","handleDrop","handleDragKeyboardMove","direction","upperBound","lowerBound","isGoingDownwards","isGoingUpwards","targetElementIndex","isTargetAfterDragged","isTargetBeforeDragged","isDirectionReversed","updateDraggedElementTransform","offset","clampTransform","updateTargetElementTransform","targetElement","targetElementOffset","handleDragStop","menuItem","el","handleDragMove","mousePosition","overItemIndex","rect","updateDragPosition","draggedItem","newMenuItems","transferFocus","threshold","i","targetElementRect","percentFromTop","itemEl","top","bottom","height","useEventListener","useResponsiveViews","elements","container","children","activeViewIndex","maxDisplayedViews","width","useElementSize","watch","containerWidth","newActiveViewIndex","childrenEl","oldActiveViewIndex","numberOfChildren","totalWidth","previousActiveChild","index2","child","nextTick","activeChild","newMaxDisplayedViews","__default__$2","messages$1","showMenu","allViewsMenuToggleRef","allViewsMenuPopoverRef","allViewsRef","menuRef","menuItemRefs","editViewMenuRefs","menuPopoverId","generateUid","useClickOutside","closeMenu","props","openMenu","emit","toggleShowMenu","e","toRef","HeaderWithViewsEditFormContextEnum","HeaderWithViewsEditFormContextEnum2","__default__$1","messages","labelValue","iconValue","iconColorValue","additionalFormItemValue","isFormDirty","iconSelectorButtonRef","iconPopoverRef","inputFieldRef","iconPopoverId","showIconSelectorPopover","iconOptions","iconColorOptions","hasErrors","error","computedAlert","computedActions","resetView","computedFormValues","conditionalIconClass","hideIconSelectorPopover","handleInput","debounce","handleKeydownEnter","handleAdditionalFormItemChange","onKeyStroke","onMounted","__default__","messages$2","STACKED_LAYOUT_BREAKPOINT","i18nComponent","getI18nComponent","slots","useSlots","hasSlot","useHasSlot","createViewButtonRef","createViewPopoverRef","editViewPopoverRef","editViewTargetElementRef","hostRef","viewsRef","viewRefs","viewControlRef","viewControlAllViewsRef","showCreateViewPopover","showAllViewsPopover","showUnsavedModalWarning","showDeleteModalWarning","activeEditViewPopover","activeViewMenuPopover","internalActiveView","nextActiveView","viewToBeDeleted","currentActiveView","skipUnsavedChangesReminder","createViewPopoverId","editViewPopoverId","validateLabel","hideCreateViewPopover","updateFocus","hideEditViewPopover","setActiveEditViewPopover","hostWidth","addToast","useBentoToastController","computedUnsavedViewModalActions","handleRestoreChanges","handleSaveChanges","computedDeleteViewModalActions","updatedViewObj","hideViewMenuPopover","computedViewToBeDeletedLabel","hasMetaSection","isCompact","conditionalContainerClass","newIndex","oldIndex","isViewUpdated","isViewDeletedWithChangedIndex","editButtonIndex","isViewUnsaved","menuListItemRef2","menuListItemRef","ref2","newValue","defaultView","getViewMenuData","DownloadIcon","RefreshIcon","EditIcon","handleViewSelect","PlusMultipleIcon","BinIcon","showViewMenuPopover","handleCreateViewItem","handleUpdateViewItem","handleKeydownEnterViewItem","handleReorder","reorderedViews","currentActiveLabel","result","handleClickModal","handleTabEditViewPopover","label","isViewActive"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;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"}
1	+ {"version":3,"file":"header-with-views.BqobE7IF.js","sources":["../../../ui-assets/icons-16/dist/vue/download.vue","../../../ui-assets/icons-16/dist/vue/edit-2.vue","../../../ui-assets/icons-16/dist/vue/heart.vue","../../../ui-assets/icons-16/dist/vue/options-horizontal.vue","../../../ui-assets/icons-16/dist/vue/plus.vue","../../../ui-assets/icons-16/dist/vue/plus-multiple.vue","../../../ui-assets/icons-16/dist/vue/bag.vue","../../../ui-assets/icons-16/dist/vue/car.vue","../../../ui-assets/icons-16/dist/vue/cash-stack.vue","../../../ui-assets/icons-16/dist/vue/cloud.vue","../../../ui-assets/icons-16/dist/vue/diamond.vue","../../../ui-assets/icons-16/dist/vue/education.vue","../../../ui-assets/icons-16/dist/vue/emoticon-happy.vue","../../../ui-assets/icons-16/dist/vue/gambling.vue","../../../ui-assets/icons-16/dist/vue/gaming.vue","../../../ui-assets/icons-16/dist/vue/gift.vue","../../../ui-assets/icons-16/dist/vue/hand-rock.vue","../../../ui-assets/icons-16/dist/vue/hashtag.vue","../../../ui-assets/icons-16/dist/vue/hospitality.vue","../../../ui-assets/icons-16/dist/vue/hourglass.vue","../../../ui-assets/icons-16/dist/vue/leaf.vue","../../../ui-assets/icons-16/dist/vue/lightning.vue","../../../ui-assets/icons-16/dist/vue/lock.vue","../../../ui-assets/icons-16/dist/vue/news.vue","../../../ui-assets/icons-16/dist/vue/notification.vue","../../../ui-assets/icons-16/dist/vue/prize.vue","../../../ui-assets/icons-16/dist/vue/retail.vue","../../../ui-assets/icons-16/dist/vue/shopping-cart.vue","../../../ui-assets/icons-16/dist/vue/sleep.vue","../../../ui-assets/icons-16/dist/vue/stack.vue","../../../ui-assets/icons-16/dist/vue/star.vue","../../../ui-assets/icons-16/dist/vue/support.vue","../../../ui-assets/icons-16/dist/vue/target.vue","../../../ui-assets/icons-16/dist/vue/thumb-down.vue","../../../ui-assets/icons-16/dist/vue/thumb-up.vue","../../../ui-assets/icons-16/dist/vue/travel-bag.vue","../../../ui-assets/icons-16/dist/vue/warning-diamond.vue","../../../ui-assets/icons-16/dist/vue/world.vue","../../src/components/header-with-views/header-with-views.internal.types.ts","../../../ui-assets/icons-16/dist/vue/menu.vue","../../src/components/header-with-views/composables/use-edit-views/use-edit-views.ts","../../src/components/header-with-views/composables/use-drag-and-drop-views/use-drag-and-drop-views.ts","../../src/components/header-with-views/composables/use-responsive-views/use-responsive-views.ts","../../src/components/header-with-views/components/header-with-views-all-views/header-with-views-all-views.vue","../../../ui-assets/icons-16/dist/vue/circle-filled.vue","../../src/components/header-with-views/components/header-with-views-item-edit-form/header-with-views-edit-form.types.ts","../../src/components/header-with-views/components/header-with-views-item-edit-form/header-with-views-edit-form.vue","../../src/components/header-with-views/header-with-views.vue"],"sourcesContent":["\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M2.75 12C2.75 12.6904 3.30964 13.25 4 13.25H12C12.6904 13.25 13.25 12.6904 13.25 12V10.25H14.75V12C14.75 13.5188 13.5188 14.75 12 14.75H4C2.48122 14.75 1.25 13.5188 1.25 12V10.25H2.75V12Z\"/><path fill=\"#001222\" d=\"M8.75 9.18945L11 6.93945L12.0605 8L8 12.0605L3.93945 8L5 6.93945L7.25 9.18945V1.25H8.75V9.18945Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M6.75 2.75H4C3.30965 2.75 2.75002 3.30966 2.75 4V12C2.75 12.6904 3.30964 13.25 4 13.25H12C12.6904 13.25 13.25 12.6904 13.25 12V9.25H14.75V12C14.75 13.5188 13.5188 14.75 12 14.75H4C2.48122 14.75 1.25 13.5188 1.25 12V4C1.25002 2.48123 2.48123 1.25 4 1.25H6.75V2.75Z\"/><path fill=\"#001222\" d=\"M10.1367 2.13574C11.166 1.10695 12.8351 1.10677 13.8643 2.13574C14.8933 3.16488 14.8931 4.834 13.8643 5.86328L8.31152 11.416H4.58398V7.68945L10.1367 2.13574ZM12.8037 3.19629C12.3604 2.75311 11.6407 2.75328 11.1973 3.19629L6.08398 8.30957V9.91602H7.69043L12.8037 4.80273C13.2468 4.35924 13.247 3.63964 12.8037 3.19629Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M8 13.8501L7.65 13.6701C7.39 13.5301 1.25 10.2901 1.25 6.14015C1.25 5.50015 1.4 4.29015 2.4 3.33015C2.61 3.12015 3.73 2.14015 5.39 2.26015C6.41 2.33015 7.33 2.80015 8 3.53015C8.67 2.80015 9.6 2.33015 10.61 2.26015C12.27 2.14015 13.39 3.12015 13.6 3.32015C14.6 4.27015 14.75 5.49015 14.75 6.13015C14.75 10.2801 8.61 13.5301 8.35 13.6601L8 13.8401V13.8501ZM5.11 3.75015C4.16 3.75015 3.51 4.34015 3.43 4.41015C2.84 4.98015 2.75 5.73015 2.75 6.13015C2.75 8.64015 6.26 11.1601 8 12.1401C9.74 11.1501 13.25 8.64015 13.25 6.13015C13.25 5.73015 13.16 4.98015 12.57 4.41015C12.49 4.33015 11.77 3.67015 10.73 3.76015C9.84 3.82015 9.06 4.37015 8.69 5.19015L8.01 6.71015L7.33 5.19015C6.96 4.37015 6.18 3.82015 5.29 3.76015C5.23 3.76015 5.18 3.76015 5.12 3.76015L5.11 3.75015Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M12 8C12 7.60217 12.158 7.22064 12.4393 6.93934C12.7206 6.65803 13.1022 6.5 13.5 6.5C13.7967 6.5 14.0867 6.58797 14.3334 6.75279C14.58 6.91762 14.7723 7.15189 14.8858 7.42597C14.9993 7.70006 15.0291 8.00166 14.9712 8.29264C14.9133 8.58361 14.7704 8.85088 14.5607 9.06066C14.3509 9.27044 14.0836 9.4133 13.7926 9.47118C13.5017 9.52906 13.2001 9.49935 12.926 9.38582C12.6519 9.27229 12.4176 9.08003 12.2528 8.83335C12.088 8.58668 12 8.29667 12 8Z\"/><path fill=\"#001222\" d=\"M0.999999 8C0.999999 8.29667 1.08797 8.58668 1.25279 8.83335C1.41762 9.08003 1.65189 9.27229 1.92597 9.38582C2.20006 9.49935 2.50166 9.52906 2.79263 9.47118C3.08361 9.4133 3.35088 9.27044 3.56066 9.06066C3.77044 8.85088 3.9133 8.58361 3.97118 8.29264C4.02905 8.00166 3.99935 7.70006 3.88582 7.42597C3.77229 7.15189 3.58003 6.91762 3.33335 6.75279C3.08668 6.58797 2.79667 6.5 2.5 6.5C2.10217 6.5 1.72064 6.65803 1.43934 6.93934C1.15803 7.22064 0.999999 7.60217 0.999999 8Z\"/><path fill=\"#001222\" d=\"M6.75279 8.83335C6.58797 8.58668 6.5 8.29667 6.5 8C6.5 7.60217 6.65803 7.22064 6.93934 6.93934C7.22064 6.65803 7.60217 6.5 8 6.5C8.29667 6.5 8.58668 6.58797 8.83335 6.75279C9.08003 6.91762 9.27229 7.15189 9.38582 7.42597C9.49935 7.70006 9.52906 8.00166 9.47118 8.29264C9.4133 8.58361 9.27044 8.85088 9.06066 9.06066C8.85088 9.27044 8.58361 9.4133 8.29263 9.47118C8.00166 9.52906 7.70006 9.49935 7.42597 9.38582C7.15189 9.27229 6.91762 9.08003 6.75279 8.83335Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M8.75 7.25V2.25H7.25V7.25H2.25V8.75H7.25V13.75H8.75V8.75H13.75V7.25H8.75Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#001222\" :clip-path=\"'url(#uia-ui-assets/icons-16-plus_multiple__a' + uuid + ')'\"><path d=\"M10.75 9.25H12.75V10.75H10.75V12.75H9.25V10.75H7.25V9.25H9.25V7.25H10.75V9.25Z\"/><path fill-rule=\"evenodd\" d=\"M9 0.25C10.5188 0.25 11.75 1.48122 11.75 3V4.25H13C14.5188 4.25 15.75 5.48122 15.75 7V13C15.75 14.5188 14.5188 15.75 13 15.75H7C5.48122 15.75 4.25 14.5188 4.25 13V11.75H3C1.48122 11.75 0.25 10.5188 0.25 9V3C0.25 1.48122 1.48122 0.25 3 0.25H9ZM7 5.75C6.30964 5.75 5.75 6.30964 5.75 7V13C5.75 13.6904 6.30964 14.25 7 14.25H13C13.6904 14.25 14.25 13.6904 14.25 13V7C14.25 6.30964 13.6904 5.75 13 5.75H7ZM3 1.75C2.30964 1.75 1.75 2.30964 1.75 3V9C1.75 9.69036 2.30964 10.25 3 10.25H4.25V7C4.25 5.48122 5.48122 4.25 7 4.25H10.25V3C10.25 2.30964 9.69036 1.75 9 1.75H3Z\" clip-rule=\"evenodd\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-plus_multiple__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M5.25 4.25V3C5.25 1.48579 6.48579 0.25 8 0.25C9.51421 0.25 10.75 1.48579 10.75 3V4.25H12.6149L14.9149 15.75H1.08496L3.38496 4.25H5.25ZM6.75 3V4.25H9.25V3C9.25 2.31421 8.68579 1.75 8 1.75C7.31421 1.75 6.75 2.31421 6.75 3ZM4.61467 5.75L2.91467 14.25H8.38496L10.085 5.75H4.61467ZM9.91467 14.25H13.0851L11.4999 6.3238L9.91467 14.25Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#001222\" :clip-path=\"'url(#uia-ui-assets/icons-16-car__a' + uuid + ')'\"><path d=\"M5.75 10.25H3.25V8.75H5.75V10.25Z\"/><path d=\"M12.75 10.25H10.25V8.75H12.75V10.25Z\"/><path d=\"M10.3604 0.75C11.6685 0.750165 12.7941 1.67303 13.0547 2.96094L13.0557 2.96289L13.6143 5.75H15.75V7.25H14.8105L15.75 8.18945V15.25H11.25V13.25H4.75V15.25H0.25V8.18945L1.18945 7.25H0.25V5.75H2.38477L2.94434 2.96289L2.94531 2.95996C3.20547 1.68654 4.32777 0.750167 5.63965 0.75H10.3604ZM1.75 8.81055V13.75H3.25V11.75H12.75V13.75H14.25V8.81055L12.6895 7.25H3.31055L1.75 8.81055ZM5.63965 2.25C5.05195 2.25017 4.53498 2.67362 4.41504 3.25977L3.91504 5.75H12.085L11.585 3.25879L11.5576 3.14941C11.4004 2.6164 10.9146 2.25015 10.3604 2.25H5.63965Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-car__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#001222\" :clip-path=\"'url(#uia-ui-assets/icons-16-cash_stack__a' + uuid + ')'\"><path d=\"M8 2.25C6.48579 2.25 5.25 3.48579 5.25 5C5.25 6.51421 6.48579 7.75 8 7.75C9.51421 7.75 10.75 6.51421 10.75 5C10.75 3.48579 9.51421 2.25 8 2.25ZM6.75 5C6.75 4.31421 7.31421 3.75 8 3.75C8.68579 3.75 9.25 4.31421 9.25 5C9.25 5.68579 8.68579 6.25 8 6.25C7.31421 6.25 6.75 5.68579 6.75 5Z\"/><path d=\"M0.25 0.25H15.75V9.75H0.25V0.25ZM1.75 1.75V8.25H14.25V1.75H1.75Z\"/><path d=\"M15.75 12.75V11.25H0.25V12.75H15.75Z\"/><path d=\"M15.75 15.75V14.25H0.25V15.75H15.75Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-cash_stack__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M10.23 4.29004C9.3156 4.29004 8.51242 4.80018 8.09842 5.55918L7.71295 6.26587L7.03525 5.83145C6.76488 5.65813 6.44513 5.56004 6.1 5.56004C5.10421 5.56004 4.3 6.36425 4.3 7.36004V8.11004H3.55C2.55421 8.11004 1.75 8.91425 1.75 9.91004C1.75 10.9058 2.55421 11.71 3.55 11.71L12.45 11.71C13.4458 11.71 14.25 10.9058 14.25 9.91004V9.90004C14.25 9.12172 13.7547 8.45577 13.0664 8.21937L12.4036 7.99175L12.5858 7.31506C12.6366 7.12648 12.66 6.93285 12.66 6.72004C12.66 5.38272 11.5743 4.29004 10.23 4.29004ZM7.18175 4.24438C7.9021 3.35751 9.0015 2.79004 10.23 2.79004C12.4057 2.79004 14.16 4.55736 14.16 6.72004C14.16 6.83797 14.1552 6.95579 14.145 7.07378C15.113 7.64637 15.75 8.70715 15.75 9.90004V9.91004C15.75 11.7343 14.2742 13.21 12.45 13.21L3.55 13.21C1.72579 13.21 0.25 11.7343 0.25 9.91004C0.25 8.31898 1.37265 6.99297 2.86997 6.68001C3.18293 5.18269 4.50894 4.06004 6.1 4.06004C6.47667 4.06004 6.84115 4.12407 7.18175 4.24438Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-ui-assets/icons-16-diamond__a' + uuid + ')'\"><path fill=\"#001222\" d=\"M11.7637 1.03027C12.8053 1.03027 13.7578 1.61912 14.2236 2.55078L15.8818 5.86719L15.5918 6.24121L8 16.002L0.408203 6.24121L0.118164 5.86719L1.77637 2.55078C2.2422 1.61913 3.19471 1.03027 4.23633 1.03027H11.7637ZM6.11426 6.75L7.99902 12.4062L9.88477 6.75H6.11426ZM2.70508 6.75L5.90234 10.8604L4.53223 6.75H2.70508ZM11.4678 6.75L10.0967 10.8604L13.2939 6.75H11.4678ZM4.23633 2.53027C3.76286 2.53027 3.3299 2.7982 3.11816 3.22168L2.10352 5.25H4.42676L5.78613 2.53027H4.23633ZM6.10254 5.25H9.89648L8.53613 2.53027H7.46289L6.10254 5.25ZM11.5732 5.25H13.8965L12.8818 3.22168C12.6701 2.7982 12.2371 2.53027 11.7637 2.53027H10.2139L11.5732 5.25Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-diamond__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M16 6V11H14.5V6.93652L13.1104 7.80566V12C13.1102 13.5139 11.8742 14.7497 10.3604 14.75H5.62988C4.11584 14.7499 2.88007 13.514 2.87988 12V7.7998L0 6L8 1L16 6ZM4.37988 12C4.38008 12.6856 4.94427 13.2499 5.62988 13.25H10.3604C11.0458 13.2497 11.6102 12.6855 11.6104 12V8.74316L8 11L4.37988 8.7373V12ZM2.83008 6L8 9.23047L13.1699 6L8 2.76953L2.83008 6Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#001222\" :clip-path=\"'url(#uia-ui-assets/icons-16-emoticon_happy__a' + uuid + ')'\"><path d=\"M8 11.25C6.75421 11.25 5.75 10.2458 5.75 9H4.25C4.25 11.0742 5.92579 12.75 8 12.75C10.0742 12.75 11.75 11.0742 11.75 9H10.25C10.25 10.2458 9.24579 11.25 8 11.25Z\"/><path d=\"M5 6.75C4.58421 6.75 4.25 7.08421 4.25 7.5H2.75C2.75 6.25579 3.75579 5.25 5 5.25C6.24421 5.25 7.25 6.25579 7.25 7.5H5.75C5.75 7.08421 5.41579 6.75 5 6.75Z\"/><path d=\"M10.25 7.5C10.25 7.08421 10.5842 6.75 11 6.75C11.4158 6.75 11.75 7.08421 11.75 7.5H13.25C13.25 6.25579 12.2442 5.25 11 5.25C9.75579 5.25 8.75 6.25579 8.75 7.5H10.25Z\"/><path d=\"M8 0.25C3.71579 0.25 0.25 3.71579 0.25 8C0.25 12.2842 3.71579 15.75 8 15.75C12.2842 15.75 15.75 12.2842 15.75 8C15.75 3.71579 12.2842 0.25 8 0.25ZM1.75 8C1.75 4.54421 4.54421 1.75 8 1.75C11.4558 1.75 14.25 4.54421 14.25 8C14.25 11.4558 11.4558 14.25 8 14.25C4.54421 14.25 1.75 11.4558 1.75 8Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-emoticon_happy__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-ui-assets/icons-16-gambling__a' + uuid + ')'\"><path fill=\"#001222\" d=\"M7.25 0.285553C5.66909 0.436349 4.23359 1.05951 3.07538 2.01472L3.04992 1.98926L1.98926 3.04992L2.01472 3.07538C1.05951 4.23359 0.436349 5.66909 0.285553 7.25H0.25V8.75H0.285553C0.436346 10.3309 1.05949 11.7664 2.01468 12.9246L1.98926 12.95L3.04992 14.0106L3.07533 13.9852C4.23355 14.9405 5.66907 15.5636 7.25 15.7144V15.75H8.75V15.7144C10.331 15.5636 11.7665 14.9404 12.9248 13.9852L12.9502 14.0106L14.0109 12.95L13.9854 12.9245C14.9405 11.7663 15.5637 10.3308 15.7144 8.75H15.75V7.25H15.7144C15.5637 5.66913 14.9405 4.23366 13.9853 3.07546L14.0109 3.04992L12.9502 1.98926L12.9247 2.01479C11.7665 1.05954 10.3309 0.436353 8.75 0.285553V0.25H7.25V0.285553ZM12.9187 11.8578L11.1275 10.0666C11.3873 9.67434 11.5766 9.22909 11.6745 8.75H14.206C14.0676 9.91739 13.6097 10.9798 12.9187 11.8578ZM10.0668 11.1273L11.8581 12.9185C10.98 13.6097 9.91751 14.0676 8.75 14.206V11.6745C9.22921 11.5766 9.67456 11.3872 10.0668 11.1273ZM1.79405 7.25C1.93236 6.08255 2.3903 5.02006 3.0814 4.14206L4.87264 5.9333C4.61275 6.32555 4.4234 6.77085 4.32554 7.25H1.79405ZM4.14206 3.0814C5.02006 2.3903 6.08255 1.93236 7.25 1.79405V4.32554C6.77085 4.4234 6.32555 4.61275 5.9333 4.87264L4.14206 3.0814ZM14.206 7.25H11.6745C11.5766 6.77088 11.3873 6.32561 11.1274 5.93339L12.9187 4.14214C13.6097 5.02013 14.0676 6.08259 14.206 7.25ZM10.25 8C10.25 8.62119 9.99617 9.18317 9.58967 9.58967C9.18317 9.99617 8.62119 10.25 8 10.25C7.37881 10.25 6.81683 9.99617 6.41033 9.58967C6.00383 9.18317 5.75 8.62119 5.75 8C5.75 7.37881 6.00383 6.81683 6.41033 6.41033C6.81683 6.00383 7.37881 5.75 8 5.75C8.62119 5.75 9.18317 6.00383 9.58967 6.41033C9.99617 6.81683 10.25 7.37881 10.25 8ZM3.08136 11.8579C2.39028 10.9799 1.93236 9.91743 1.79405 8.75H4.32554C4.42339 9.22913 4.61273 9.67441 4.8726 10.0666L3.08136 11.8579ZM11.858 3.08147L10.0668 4.8727C9.67452 4.61278 9.22919 4.4234 8.75 4.32554V1.79405C9.91749 1.93236 10.98 2.39033 11.858 3.08147ZM7.25 14.206C6.08253 14.0676 5.02002 13.6097 4.14201 12.9186L5.93324 11.1273C6.3255 11.3872 6.77082 11.5766 7.25 11.6745V14.206Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-gambling__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M5.49968 5.25C6.74232 5.25 7.74968 6.25736 7.74968 7.5C7.74968 8.74264 6.74232 9.75 5.49968 9.75C4.25723 9.74978 3.24968 8.7425 3.24968 7.5C3.24968 6.2575 4.25723 5.25022 5.49968 5.25ZM5.49968 6.75C5.08565 6.75022 4.74968 7.08592 4.74968 7.5C4.74968 7.91408 5.08565 8.24978 5.49968 8.25C5.91389 8.25 6.24968 7.91421 6.24968 7.5C6.24968 7.08579 5.91389 6.75 5.49968 6.75Z\"/><path fill=\"#001222\" d=\"M10.9401 7.75C11.2201 7.27002 11.8302 7.09989 12.3102 7.37988C12.7901 7.65989 12.9602 8.27006 12.6803 8.75C12.4004 9.22992 11.7902 9.39993 11.3102 9.12012C10.8302 8.84012 10.6601 8.23 10.9401 7.75Z\"/><path fill=\"#001222\" d=\"M8.69987 7.37988C9.17985 7.1099 9.78997 7.27006 10.07 7.75C10.34 8.23 10.1799 8.85012 9.69987 9.12012C9.2199 9.38997 8.59972 9.22994 8.32975 8.75C8.05991 8.27006 8.22 7.64988 8.69987 7.37988Z\"/><path fill=\"#001222\" d=\"M10.4997 5C11.0497 5 11.4997 5.45 11.4997 6C11.4997 6.55 11.0497 7 10.4997 7C9.94986 6.99977 9.49968 6.54986 9.49968 6C9.49968 5.45014 9.94986 5.00023 10.4997 5Z\"/><path fill=\"#001222\" d=\"M8.74968 2.25H12.1598C13.5856 2.25017 14.7834 3.34511 14.8962 4.76758L15.5671 12.7666L15.5758 12.916C15.6251 14.4583 14.3889 15.7499 12.8298 15.75H12.4499C11.27 15.7499 10.2102 14.9957 9.83757 13.8652L9.46745 12.75H6.55143L6.18132 13.8633L6.18229 13.8643C5.80991 14.9951 4.74998 15.7498 3.56999 15.75H3.18913C1.58008 15.7496 0.314762 14.3738 0.451824 12.7666L1.12175 4.76758L1.12272 4.76562C1.24556 3.34623 2.41796 2.26124 3.83952 2.25098L7.24968 2.25V0.25H8.74968V2.25ZM3.85905 3.75C3.21015 3.7504 2.67349 4.24103 2.61686 4.89453L1.94694 12.8926C1.88439 13.6247 2.45905 14.2496 3.18913 14.25H3.56999C4.10954 14.2498 4.58991 13.9043 4.75749 13.3955L5.46745 11.25H10.5514L11.2614 13.3945C11.429 13.9034 11.9102 14.2499 12.4499 14.25H12.8298C13.5601 14.2499 14.1345 13.6258 14.0719 12.8936L13.402 4.89258V4.8877C13.3525 4.25272 12.8121 3.75017 12.1598 3.75H3.85905Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M10 0.25C11.5142 0.25 12.75 1.48579 12.75 3C12.75 3.45004 12.6385 3.87428 12.4453 4.25H14.75V8.75H13.75V13C13.75 14.5188 12.5188 15.75 11 15.75H5C3.48122 15.75 2.25 14.5188 2.25 13V8.75H1.25V4.25H3.55469C3.3615 3.87428 3.25 3.45004 3.25 3C3.25 1.48579 4.48579 0.25 6 0.25C6.78756 0.25 7.49778 0.586212 8 1.12012C8.50222 0.586212 9.21244 0.25 10 0.25ZM8.75 14.25H11C11.6904 14.25 12.25 13.6904 12.25 13V8.75H8.75V14.25ZM3.75 13C3.75 13.6904 4.30964 14.25 5 14.25H7.25V8.75H3.75V13ZM8.75 7.25H13.25V5.75H8.75V7.25ZM2.75 7.25H7.25V5.75H2.75V7.25ZM6 1.75C5.31421 1.75 4.75 2.31421 4.75 3C4.75 3.68579 5.31421 4.25 6 4.25H7.25V3C7.25 2.31421 6.68579 1.75 6 1.75ZM10 1.75C9.31421 1.75 8.75 2.31421 8.75 3V4.25H10C10.6858 4.25 11.25 3.68579 11.25 3C11.25 2.31421 10.6858 1.75 10 1.75Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M4.17969 0.25C5.29369 0.250066 6.19994 1.15557 6.2002 2.26953V3.50293C6.36912 3.45695 6.54617 3.42973 6.72949 3.42969C7.21332 3.42969 7.65762 3.60125 8.00586 3.88574C8.35205 3.60723 8.79147 3.44054 9.26953 3.44043C9.45359 3.44043 9.63122 3.46738 9.80078 3.51367C9.82025 2.41618 10.7182 1.53027 11.8203 1.53027C12.9342 1.53042 13.8396 2.4359 13.8398 3.5498V13C13.8397 14.5141 12.6039 15.7499 11.0898 15.75H4.91016C3.39602 15.75 2.16029 14.5141 2.16016 13V2.26953C2.16041 1.15569 3.06584 0.250254 4.17969 0.25ZM11.8203 3.03027C11.5347 3.03027 11.3001 3.26423 11.2998 3.5498V8.39062H11.29V8.64062C11.2897 9.75453 10.3835 10.6602 9.26953 10.6602C8.78871 10.66 8.3471 10.4903 8 10.209C7.65292 10.4905 7.21133 10.6601 6.73047 10.6602H4.70996V9.16016H6.73047C7.01602 9.15992 7.24993 8.92523 7.25 8.63965C7.24974 8.35422 7.0159 8.12035 6.73047 8.12012H4.17969C3.89427 8.12037 3.66041 8.35423 3.66016 8.63965V13C3.66029 13.6857 4.22445 14.25 4.91016 14.25H11.0898C11.7755 14.2499 12.3397 13.6856 12.3398 13V3.5498C12.3396 3.26432 12.1058 3.03043 11.8203 3.03027ZM9.26953 4.94043C8.98411 4.94069 8.75026 5.17454 8.75 5.45996V8.64062C8.75037 8.92594 8.98418 9.1599 9.26953 9.16016C9.55509 9.16016 9.78967 8.9261 9.79004 8.64062V5.45996C9.78978 5.17439 9.55516 4.94043 9.26953 4.94043ZM4.17969 1.75C3.89427 1.75026 3.66041 1.98411 3.66016 2.26953V6.68945C3.82606 6.64523 4.00001 6.62016 4.17969 6.62012H4.7002V2.26953C4.69994 1.984 4.46526 1.75007 4.17969 1.75ZM6.72949 4.92969C6.4442 4.92994 6.21042 5.16397 6.20996 5.44922V6.62012H6.73047C6.91019 6.62016 7.08406 6.64521 7.25 6.68945V5.44922C7.24954 5.16381 7.015 4.92969 6.72949 4.92969Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M7.62109 5.84961H9.0957L9.36035 4.25H10.8799L10.6152 5.84961H11.75V7.34961H10.3672L10.1523 8.65039H11.75V10.1504H9.9043L9.63965 11.75H8.12012L8.38477 10.1504H6.89844L6.62988 11.75H5.10938L5.37793 10.1504H4.25V8.65039H5.62988L5.84863 7.34961H4.25V5.84961H6.10156L6.37012 4.25H7.88965L7.62109 5.84961ZM7.15039 8.65039H8.63281L8.84766 7.34961H7.36914L7.15039 8.65039Z\"/><path fill=\"#001222\" d=\"M12 1.25C13.5188 1.25 14.75 2.48122 14.75 4V12C14.75 13.5188 13.5188 14.75 12 14.75H4C2.48122 14.75 1.25 13.5188 1.25 12V4C1.25 2.48122 2.48122 1.25 4 1.25H12ZM4 2.75C3.30964 2.75 2.75 3.30964 2.75 4V12C2.75 12.6904 3.30964 13.25 4 13.25H12C12.6904 13.25 13.25 12.6904 13.25 12V4C13.25 3.30964 12.6904 2.75 12 2.75H4Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M11 4.25C12.5188 4.25 13.75 5.48122 13.75 7V10.25H15.75V14.75H0.25V10.25H2.25V7C2.25 5.48122 3.48122 4.25 5 4.25H11ZM1.75 13.25H14.25V11.75H1.75V13.25ZM5 5.75C4.30964 5.75 3.75 6.30964 3.75 7V10.25H12.25V7C12.25 6.30964 11.6904 5.75 11 5.75H5Z\"/><path fill=\"#001222\" d=\"M10.75 2.75H5.25V1.25H10.75V2.75Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M13.75 1.75H12.75V6C12.75 6.78782 12.4131 7.49775 11.8789 8C12.4131 8.50225 12.75 9.21218 12.75 10V14.25H13.75V15.75H2.25V14.25H3.25V10C3.25 9.21244 3.58621 8.50222 4.12012 8C3.58621 7.49778 3.25 6.78756 3.25 6V1.75H2.25V0.25H13.75V1.75ZM4.75 12.75V14.25H11.25V12.75H4.75ZM4.75 6C4.75 6.68579 5.31421 7.25 6 7.25H6.75V8.75H6C5.31421 8.75 4.75 9.31421 4.75 10V11.25H11.25V10C11.25 9.31421 10.6858 8.75 10 8.75H9.25V7.25H10C10.6858 7.25 11.25 6.68579 11.25 6V1.75H4.75V6Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-ui-assets/icons-16-leaf__a' + uuid + ')'\"><path fill=\"#001222\" d=\"M15.75 8.16992C15.75 8.89401 15.4634 9.59536 14.9395 10.1094L13.1104 11.9404C12.5927 12.458 11.9031 12.75 11.1699 12.75H4.31055L1.53027 15.5303L0.469727 14.4697L3.25 11.6895V4.83008C3.25 4.106 3.53561 3.40366 4.05957 2.88965L5.88965 1.05957C6.40726 0.54198 7.09693 0.25 7.83008 0.25H15.75V8.16992ZM5.81055 11.25H11.1699C11.4967 11.25 11.8074 11.1222 12.0498 10.8799L13.8867 9.04297C13.975 8.957 14.0489 8.85806 14.1064 8.75H8.31055L5.81055 11.25ZM7.25 1.89551C7.14218 1.95356 7.04144 2.02888 6.9502 2.12012L5.11328 3.95703C4.88182 4.1824 4.75 4.49747 4.75 4.83008V10.1895L7.25 7.68945V1.89551ZM9.81055 7.25H14.25V2.81055L9.81055 7.25ZM8.75 6.18945L13.1895 1.75H8.75V6.18945Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-leaf__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M9.75 6.25V0.25H8.63L1.5 9.75H6.25V15.75H7.38L14.5 6.25H9.75ZM4.5 8.25L8.25 3.25V7.75H11.5L7.75 12.75V8.25H4.5Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M8.75 11.75H7.25V8.25H8.75V11.75Z\"/><path fill=\"#001222\" d=\"M8 1.25C9.51878 1.25 10.75 2.48122 10.75 4V5.25H11C12.5188 5.25 13.75 6.48122 13.75 8V12C13.75 13.5188 12.5188 14.75 11 14.75H5C3.48122 14.75 2.25 13.5188 2.25 12V8C2.25 6.48122 3.48122 5.25 5 5.25H5.25V4C5.25 2.48122 6.48122 1.25 8 1.25ZM5 6.75C4.30964 6.75 3.75 7.30964 3.75 8V12C3.75 12.6904 4.30964 13.25 5 13.25H11C11.6904 13.25 12.25 12.6904 12.25 12V8C12.25 7.30964 11.6904 6.75 11 6.75H5ZM8 2.75C7.30964 2.75 6.75 3.30964 6.75 4V5.25H9.25V4C9.25 3.30964 8.69036 2.75 8 2.75Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#001222\" :clip-path=\"'url(#uia-ui-assets/icons-16-news__a' + uuid + ')'\"><path d=\"M12.75 12.75H7.25V6.25H12.75V12.75ZM8.75 11.25H11.25V7.75H8.75V11.25Z\"/><path d=\"M10.75 4.75H7.25V3.25H10.75V4.75Z\"/><path d=\"M13 0.25C14.5188 0.25 15.75 1.48122 15.75 3V13C15.75 14.5188 14.5188 15.75 13 15.75H3.25V15.7363C3.16759 15.7438 3.08435 15.75 3 15.75C1.48122 15.75 0.25 14.5188 0.25 13V8C0.25 6.48122 1.48122 5.25 3 5.25H4.25V3C4.25 1.48122 5.48122 0.25 7 0.25H13ZM3 6.75C2.30964 6.75 1.75 7.30964 1.75 8V13C1.75 13.6904 2.30964 14.25 3 14.25C3.69036 14.25 4.25 13.6904 4.25 13V6.75H3ZM7 1.75C6.30964 1.75 5.75 2.30964 5.75 3V13C5.75 13.4506 5.63935 13.8747 5.44727 14.25H13C13.6904 14.25 14.25 13.6904 14.25 13V3C14.25 2.30964 13.6904 1.75 13 1.75H7Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-news__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\" transform=\"matrix(1 0 0 -1 0 16)\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M7.99047 0.25C6.85765 0.25 5.89704 0.935208 5.47759 1.9044C4.03119 2.68871 2.96599 4.13012 2.7463 5.87663L2.4163 8.50663L2.41589 8.51C2.32636 9.25062 1.98383 9.94416 1.45427 10.4656L1.23047 10.6859V13.75H5.35431C5.68227 14.9019 6.74559 15.75 8 15.75C9.25441 15.75 10.3177 14.9019 10.6457 13.75H14.7305V10.6893L14.5108 10.4697C14.0619 10.0208 13.7524 9.46107 13.6074 8.8473L13.2346 5.8764C13.0151 4.13169 11.9599 2.68854 10.5029 1.90326C10.0831 0.934672 9.12284 0.25 7.99047 0.25ZM13.2305 12.25H2.73047V11.2985C3.37295 10.5734 3.78718 9.66208 3.90483 8.69177L4.23463 6.06337C4.4008 4.74299 5.24843 3.65649 6.3979 3.11951L6.70638 2.97541L6.80095 2.64833C6.95173 2.12691 7.42704 1.75 7.99047 1.75C8.5539 1.75 9.02921 2.12691 9.17999 2.64833L9.27491 2.97662L9.58492 3.12039C10.7406 3.65634 11.5799 4.74095 11.7463 6.0636L11.9705 7.85H11.9451L12.0569 8.69805C12.1842 9.6635 12.5895 10.5649 13.2305 11.2958V12.25ZM7.00274 13.75H8.99726C8.76827 14.0529 8.40537 14.25 8 14.25C7.59463 14.25 7.23173 14.0529 7.00274 13.75Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-ui-assets/icons-16-prize__a' + uuid + ')'\"><path fill=\"#001222\" d=\"M12.75 3.25H15.75V6C15.75 7.51878 14.5188 8.75 13 8.75H12.75V9C12.75 10.5188 11.5188 11.75 10 11.75H8.75V14.25H12.75V15.75H3.25V14.25H7.25V11.75H6C4.48122 11.75 3.25 10.5188 3.25 9V8.75H3C1.48122 8.75 0.25 7.51878 0.25 6V3.25H3.25V0.25H12.75V3.25ZM4.75 9C4.75 9.69036 5.30964 10.25 6 10.25H10C10.6904 10.25 11.25 9.69036 11.25 9V1.75H4.75V9ZM1.75 6C1.75 6.69036 2.30964 7.25 3 7.25H3.25V4.75H1.75V6ZM12.75 7.25H13C13.6904 7.25 14.25 6.69036 14.25 6V4.75H12.75V7.25Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-prize__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M8 1.25C6.48579 1.25 5.25 2.48579 5.25 4H6.75C6.75 3.31421 7.31421 2.75 8 2.75C8.68579 2.75 9.25 3.31421 9.25 4C9.25 4.68579 8.68579 5.25 8 5.25H7.25V7.53638L2.68655 9.8181C1.79233 10.2592 1.25 11.1753 1.25 12.1499C1.25 13.5841 2.41579 14.7499 3.85 14.7499H12.15C13.5842 14.7499 14.75 13.5841 14.75 12.1499C14.75 11.1624 14.1872 10.2689 13.324 9.82338L8.75 7.53638V6.64569C9.90191 6.31773 10.75 5.25441 10.75 4C10.75 2.48579 9.51421 1.25 8 1.25ZM3.35114 11.1629L8 8.83843L12.6398 11.1583C13.0144 11.3534 13.25 11.7388 13.25 12.1499C13.25 12.7557 12.7558 13.2499 12.15 13.2499H3.85C3.24421 13.2499 2.75 12.7557 2.75 12.1499C2.75 11.7253 2.98674 11.3422 3.35114 11.1629Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M6.5 11.25C7.74421 11.25 8.75 12.2558 8.75 13.5C8.75 14.7442 7.74421 15.75 6.5 15.75C5.25579 15.75 4.25 14.7442 4.25 13.5C4.25 12.2558 5.25579 11.25 6.5 11.25ZM6.5 12.75C6.08421 12.75 5.75 13.0842 5.75 13.5C5.75 13.9158 6.08421 14.25 6.5 14.25C6.91579 14.25 7.25 13.9158 7.25 13.5C7.25 13.0842 6.91579 12.75 6.5 12.75Z\"/><path fill=\"#001222\" d=\"M12.5 11.25C13.7442 11.25 14.75 12.2558 14.75 13.5C14.75 14.7442 13.7442 15.75 12.5 15.75C11.2558 15.75 10.25 14.7442 10.25 13.5C10.25 12.2558 11.2558 11.25 12.5 11.25ZM12.5 12.75C12.0842 12.75 11.75 13.0842 11.75 13.5C11.75 13.9158 12.0842 14.25 12.5 14.25C12.9158 14.25 13.25 13.9158 13.25 13.5C13.25 13.0842 12.9158 12.75 12.5 12.75Z\"/><path fill=\"#001222\" d=\"M1.40039 0.25C2.6906 0.25018 3.80556 1.14319 4.08203 2.40723L4.26953 3.25H15.75V8C15.75 9.51421 14.5142 10.75 13 10.75H4.39844L2.61816 2.73242L2.61719 2.72949C2.49243 2.15562 1.98867 1.75018 1.40039 1.75H0.25V0.25H1.40039ZM5.60156 9.25H7.11426L6.36426 4.75H4.60254L5.60156 9.25ZM12.25 9.25H13C13.6858 9.25 14.25 8.68579 14.25 8V4.75H12.25V9.25ZM8.63574 9.25H10.75V4.75H7.88574L8.63574 9.25Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#001222\" :clip-path=\"'url(#uia-ui-assets/icons-16-sleep__a' + uuid + ')'\"><path d=\"M13.81 3.25L15.75 1.31V0.25H11.25V1.75H13.19L11.25 3.69V4.75H15.75V3.25H13.81Z\"/><path d=\"M9.86 9.25H11.69C11.73 9.5 11.75 9.74 11.75 10C11.75 11.14 11.42 12.25 10.78 13.2C10.15 14.14 9.25 14.88 8.2 15.31C7.5 15.6 6.75 15.75 6 15.75C5.63 15.75 5.25 15.71 4.88 15.64C3.76 15.42 2.74 14.87 1.93 14.07C1.13 13.26 0.58 12.24 0.36 11.12C0.14 10 0.25 8.85 0.69 7.8C1.12 6.74 1.86 5.85 2.81 5.22C3.75 4.58 4.86 4.25 6 4.25C6.25 4.25 6.5 4.27 6.75 4.31V6.14C6.61 6.22 6.49 6.33 6.37 6.45C6.1 6.73 5.91 7.08 5.81 7.45C5.72 7.83 5.72 8.23 5.82 8.6C5.93 8.98 6.13 9.32 6.4 9.6C6.68 9.87 7.02 10.07 7.4 10.17C7.77 10.28 8.17 10.28 8.55 10.19C8.92 10.09 9.27 9.9 9.55 9.63C9.67 9.51 9.78 9.39 9.86 9.25ZM7.63 13.93C8.41 13.6 9.07 13.06 9.53 12.36C9.79 11.97 9.99 11.55 10.1 11.11C9.74 11.35 9.34 11.53 8.92 11.64C8.29 11.8 7.63 11.79 7 11.62C6.37 11.45 5.8 11.12 5.34 10.66C4.88 10.2 4.55 9.63 4.38 9C4.21 8.38 4.2 7.71 4.36 7.08C4.47 6.66 4.65 6.26 4.89 5.9C4.45 6.02 4.03 6.21 3.64 6.47C2.94 6.93 2.4 7.59 2.07 8.37C1.75 9.15 1.67 10 1.83 10.83C2 11.66 2.4 12.41 2.99 13C3.59 13.6 4.34 14 5.17 14.17C6 14.33 6.85 14.25 7.63 13.93Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-sleep__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M6.99851 0.329277C7.60965 0.0237045 8.32485 0.0237045 8.936 0.329277L8.94763 0.335092L13.4899 2.80661C14.9132 3.5683 15.0156 5.45081 13.8121 6.36022C14.9426 7.15404 14.8998 8.80801 13.8648 9.65083C15.0545 10.501 14.8976 12.4276 13.573 13.1845L13.5662 13.1883L9.01459 15.665L9.00296 15.6708C8.39181 15.9763 7.67662 15.9763 7.06547 15.6708L7.05384 15.665L2.50223 13.1883L2.49544 13.1845C1.20854 12.4491 1.03328 10.6248 2.18975 9.74196C1.0278 8.92492 0.947607 7.14873 2.15756 6.33584C0.997812 5.42474 1.08812 3.5815 2.42848 2.81558L2.43527 2.81171L6.98688 0.335092L6.99851 0.329277ZM7.67888 1.66624L3.16715 4.12114C2.74814 4.36572 2.74509 4.95731 3.15799 5.20694L4.08079 5.66834L7.16483 7.34445L7.74797 7.66845C7.92526 7.75282 8.12695 7.75503 8.30552 7.67508L8.82242 7.35202L11.9204 5.66834L12.8431 5.20696C13.2441 4.96435 13.2605 4.38426 12.781 4.12853L12.7754 4.12558L8.25563 1.66624C8.07219 1.57805 7.86232 1.57805 7.67888 1.66624ZM7.73281 11.0237C7.90254 11.0878 8.08961 11.0801 8.25519 11.0006L11.9197 9.00179L12.8433 8.53998C13.2912 8.2708 13.2066 7.70823 12.865 7.53744L12.2815 7.2457L9.56162 8.72393L8.95041 9.06348L8.93584 9.07077C8.32469 9.37634 7.60949 9.37634 6.99835 9.07077L6.98377 9.06348L6.37257 8.72393L3.65264 7.2457L3.06917 7.53744C2.72758 7.70823 2.64303 8.2708 3.09087 8.53998L3.80065 8.89487L3.81599 8.88721L7.73281 11.0237ZM3.77974 10.5824L3.20296 10.8708C2.85902 11.0427 2.77566 11.6119 3.234 11.8788L7.74583 14.3338C7.92928 14.422 8.13915 14.422 8.3226 14.3338L12.8343 11.8789C13.049 11.7537 13.1599 11.5393 13.168 11.3144C13.1763 11.0868 13.0815 10.9295 12.9709 10.8568L12.416 10.5794L9.0816 12.3981L9.06963 12.4041C8.45848 12.7097 7.74328 12.7097 7.13214 12.4041L7.12016 12.3981L7.07964 12.376C7.05236 12.3637 7.02525 12.3509 6.99835 12.3374L6.98637 12.3315L3.77974 10.5824Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-ui-assets/icons-16-star__a' + uuid + ')'\"><path fill=\"#001222\" d=\"M7.99981 0.322998L10.4998 5.32304L15.4723 6.15178L11.8252 10.2041L13.1419 15.4004L8.00327 12.8397L2.97162 15.399L4.18057 10.2109L0.527344 6.15178L5.49979 5.32304L7.99981 0.322998ZM7.99981 3.6771L6.49983 6.67706L3.47227 7.18165L5.81904 9.78917L5.16379 12.6011L7.99635 11.1604L10.8848 12.5997L10.1744 9.79603L12.5273 7.18165L9.49979 6.67706L7.99981 3.6771Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-star__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-ui-assets/icons-16-support__a' + uuid + ')'\"><path fill=\"#001222\" d=\"M1.98926 3.04992L2.0153 3.07596C0.878906 4.45704 0.25 6.1961 0.25 8C0.25 9.80388 0.878891 11.5429 2.01525 12.924L1.98926 12.95L3.04992 14.0106L3.0759 13.9847C4.45699 15.1211 6.19607 15.75 8 15.75C9.80396 15.75 11.5431 15.1211 12.9242 13.9846L12.9502 14.0106L14.0109 12.95L13.9848 12.9239C15.1211 11.5429 15.75 9.80384 15.75 8C15.75 6.19613 15.1211 4.45711 13.9848 3.07604L14.0109 3.04992L12.9502 1.98926L12.9241 2.01536C11.543 0.878931 9.80394 0.25 8 0.25C6.1961 0.25 4.45704 0.878906 3.07596 2.0153L3.04992 1.98926L1.98926 3.04992ZM12.9179 11.857L11.0911 10.0302C11.423 9.52647 11.6301 8.94655 11.6895 8.33877C11.7716 7.49946 11.5672 6.65772 11.1107 5.95016L12.9179 4.14291C13.7765 5.23764 14.25 6.59441 14.25 8C14.25 9.40557 13.7765 10.7623 12.9179 11.857ZM10.031 11.0914L11.8573 12.9177C10.7625 13.7765 9.40568 14.25 8 14.25C6.59435 14.25 5.23753 13.7765 4.14278 12.9178L5.94737 11.1132C6.5494 11.5017 7.25334 11.7105 7.97579 11.7099C8.71206 11.7093 9.42572 11.4912 10.031 11.0914ZM1.75 8C1.75 6.59437 2.2235 5.23757 3.08217 4.14283L4.85612 5.91678C4.7921 6.01372 4.73242 6.11393 4.67735 6.21715C4.27061 6.97954 4.14082 7.85938 4.31009 8.70673C4.40771 9.19546 4.60134 9.65594 4.876 10.0632L3.08213 11.8571C2.22348 10.7624 1.75 9.4056 1.75 8ZM6.63778 6.18271C6.78433 6.07359 6.94467 5.98212 7.11574 5.91111C7.59328 5.71288 8.12479 5.68638 8.61968 5.83612C9.11457 5.98585 9.54224 6.30256 9.82979 6.73228C10.1173 7.16199 10.247 7.67812 10.1967 8.19272C10.1463 8.70731 9.91909 9.18853 9.55371 9.55437C9.13501 9.97359 8.56697 10.2094 7.97447 10.2099C7.45742 10.2104 6.9562 10.0315 6.55624 9.70383C6.15628 9.37616 5.88231 8.91993 5.78102 8.4129C5.67974 7.90587 5.7574 7.3794 6.00078 6.92321C6.05366 6.82409 6.11366 6.72962 6.18007 6.64042L6.63778 6.18271ZM4.14283 3.08217C5.23757 2.2235 6.59438 1.75 8 1.75C9.40566 1.75 10.7625 2.22352 11.8573 3.08224L10.0608 4.87873C9.75322 4.67132 9.41431 4.50939 9.05408 4.40039C8.227 4.15015 7.33875 4.19445 6.54067 4.52572C6.3216 4.61666 6.11304 4.72767 5.91732 4.85666L4.14283 3.08217Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-support__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M2.25 0.25H4.31066L5.70908 1.64842C6.42437 1.39051 7.19811 1.25 8 1.25C11.7242 1.25 14.75 4.27579 14.75 8C14.75 11.7242 11.7242 14.75 8 14.75C4.27579 14.75 1.25 11.7242 1.25 8C1.25 7.19811 1.39051 6.42437 1.64842 5.70908L0.25 4.31066V2.25H2.25V0.25ZM6.75 4.46261C7.14081 4.32489 7.5615 4.25 8 4.25C10.0742 4.25 11.75 5.92579 11.75 8C11.75 10.0742 10.0742 11.75 8 11.75C5.92579 11.75 4.25 10.0742 4.25 8C4.25 7.5615 4.32489 7.14081 4.46261 6.75H2.89933C2.8019 7.15004 2.75 7.56922 2.75 8C2.75 10.8958 5.10421 13.25 8 13.25C10.8958 13.25 13.25 10.8958 13.25 8C13.25 5.10421 10.8958 2.75 8 2.75C7.56922 2.75 7.15004 2.8019 6.75 2.89933V4.46261ZM5.96848 7.02914C5.82837 7.32282 5.75 7.65198 5.75 8C5.75 9.24579 6.75421 10.25 8 10.25C9.24579 10.25 10.25 9.24579 10.25 8C10.25 6.75421 9.24579 5.75 8 5.75C7.65198 5.75 7.32282 5.82837 7.02914 5.96848L9.06077 8.00011L8.00011 9.06077L5.96848 7.02914ZM3.75 1.81066V3.75H1.81066L3.31066 5.25H5.25V3.31066L3.75 1.81066Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M10.6797 1.25C11.783 1.25 12.7697 1.91156 13.207 2.90918L13.209 2.91406L14.3037 5.45996H14.3164L14.5107 5.91699C15.2793 7.72864 13.9505 9.74968 11.9805 9.75H10.1162L10.6045 10.9795L10.6055 10.9785C11.3359 12.7839 9.99885 14.75 8.05957 14.75H6.50293L6.31348 14.2793L4.81543 10.543C4.61821 10.0598 4.15918 9.75016 3.65039 9.75H1.25V1.25H10.6797ZM5.75 2.75V9.22754C5.93669 9.44832 6.09122 9.6999 6.2041 9.97656L6.20605 9.98047L7.51758 13.25H8.05957C8.94029 13.25 9.5444 12.3556 9.21484 11.541L9.21289 11.5371L7.9043 8.25H11.9805C12.8253 8.24969 13.4164 7.42163 13.1729 6.62891L13.1211 6.50586L11.833 3.51074C11.6302 3.04856 11.1763 2.75 10.6797 2.75H5.75ZM2.75 2.75V8.25H3.65039C3.85546 8.25003 4.05618 8.27304 4.25 8.31641V2.75H2.75Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M8.05957 1.25C9.99885 1.25 11.3359 3.21606 10.6055 5.02148L10.6045 5.02051L10.1162 6.25H11.9805C13.9505 6.25032 15.2793 8.27136 14.5107 10.083L14.3164 10.54H14.3037L13.209 13.0859L13.207 13.0908C12.7697 14.0884 11.783 14.75 10.6797 14.75H1.25V6.25H3.65039C4.15918 6.24984 4.61821 5.94021 4.81543 5.45703L6.31348 1.7207L6.50293 1.25H8.05957ZM6.20605 6.01953L6.2041 6.02344C6.09132 6.29986 5.93648 6.55084 5.75 6.77148V13.25H10.6797C11.1763 13.25 11.6302 12.9514 11.833 12.4893L13.1211 9.49414L13.1729 9.37109C13.4164 8.57837 12.8253 7.75031 11.9805 7.75H7.9043L9.21289 4.46289L9.21484 4.45898C9.5444 3.64441 8.94029 2.75 8.05957 2.75H7.51758L6.20605 6.01953ZM4.25 7.68262C4.05611 7.72602 3.85554 7.74997 3.65039 7.75H2.75V13.25H4.25V7.68262Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M10.75 4.25H12C13.5188 4.25 14.75 5.48122 14.75 7V12C14.75 13.5188 13.5188 14.75 12 14.75H4C2.48122 14.75 1.25 13.5188 1.25 12V7C1.25 5.48122 2.48122 4.25 4 4.25H5.25V1.25H10.75V4.25ZM11.75 13.25H12C12.6904 13.25 13.25 12.6904 13.25 12V7C13.25 6.30964 12.6904 5.75 12 5.75H11.75V13.25ZM5.75 13.25H10.25V5.75H5.75V13.25ZM4 5.75C3.30964 5.75 2.75 6.30964 2.75 7V12C2.75 12.6904 3.30964 13.25 4 13.25H4.25V5.75H4ZM6.75 4.25H9.25V2.75H6.75V4.25Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#001222\" :clip-path=\"'url(#uia-ui-assets/icons-16-warning_diamond__a' + uuid + ')'\"><path d=\"M8.00024 10.0005C8.55236 10.0007 9.00024 10.4483 9.00024 11.0005C8.99998 11.5524 8.5522 12.0003 8.00024 12.0005C7.44811 12.0005 7.00049 11.5525 7.00024 11.0005C7.00024 10.4482 7.44795 10.0005 8.00024 10.0005Z\"/><path d=\"M8.75024 8.42039H7.25024V4.25046H8.75024V8.42039Z\"/><path d=\"M6.05492 0.883276C7.12886 -0.190666 8.87063 -0.190666 9.94457 0.883276L15.1135 6.05222C16.1869 7.12613 16.1871 8.86708 15.1135 9.94089L9.94457 15.1098C8.87062 16.1837 7.12883 16.1838 6.05492 15.1098L0.886954 9.94089C-0.186957 8.86698 -0.186898 7.12617 0.886954 6.05222L6.05492 0.883276ZM8.88402 1.94382C8.39594 1.45574 7.60462 1.45588 7.11645 1.94382L1.9475 7.11277C1.45944 7.60093 1.45938 8.39222 1.9475 8.88035L7.11645 14.0493C7.60461 14.537 8.39601 14.5372 8.88402 14.0493L14.052 8.88035C14.5401 8.39219 14.5401 7.60092 14.052 7.11277L8.88402 1.94382Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-warning_diamond__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#001222\" :clip-path=\"'url(#uia-ui-assets/icons-16-world__a' + uuid + ')'\"><path d=\"M12.9004 7.3501C13.3146 7.3501 13.6504 7.01431 13.6504 6.6001C13.6504 6.18588 13.3146 5.8501 12.9004 5.8501C12.4862 5.8501 12.1504 6.18588 12.1504 6.6001C12.1504 7.01431 12.4862 7.3501 12.9004 7.3501Z\"/><path d=\"M13.6504 8.69995C13.6504 9.11416 13.3146 9.44995 12.9004 9.44995C12.4862 9.44995 12.1504 9.11416 12.1504 8.69995C12.1504 8.28574 12.4862 7.94995 12.9004 7.94995C13.3146 7.94995 13.6504 8.28574 13.6504 8.69995Z\"/><path d=\"M10.7998 5.94995C11.214 5.94995 11.5498 5.61416 11.5498 5.19995C11.5498 4.78574 11.214 4.44995 10.7998 4.44995C10.3856 4.44995 10.0498 4.78574 10.0498 5.19995C10.0498 5.61416 10.3856 5.94995 10.7998 5.94995Z\"/><path d=\"M11.5498 7.30005C11.5498 7.71426 11.214 8.05005 10.7998 8.05005C10.3856 8.05005 10.0498 7.71426 10.0498 7.30005C10.0498 6.88584 10.3856 6.55005 10.7998 6.55005C11.214 6.55005 11.5498 6.88584 11.5498 7.30005Z\"/><path d=\"M10.7998 10.1499C11.214 10.1499 11.5498 9.81412 11.5498 9.3999C11.5498 8.98569 11.214 8.6499 10.7998 8.6499C10.3856 8.6499 10.0498 8.98569 10.0498 9.3999C10.0498 9.81412 10.3856 10.1499 10.7998 10.1499Z\"/><path d=\"M11.5498 11.5C11.5498 11.9142 11.214 12.25 10.7998 12.25C10.3856 12.25 10.0498 11.9142 10.0498 11.5C10.0498 11.0858 10.3856 10.75 10.7998 10.75C11.214 10.75 11.5498 11.0858 11.5498 11.5Z\"/><path d=\"M8.7002 4.55005C9.11441 4.55005 9.4502 4.21426 9.4502 3.80005C9.4502 3.38584 9.11441 3.05005 8.7002 3.05005C8.28598 3.05005 7.9502 3.38584 7.9502 3.80005C7.9502 4.21426 8.28598 4.55005 8.7002 4.55005Z\"/><path d=\"M7.34961 7.30005C7.34961 7.71426 7.01382 8.05005 6.59961 8.05005C6.1854 8.05005 5.84961 7.71426 5.84961 7.30005C5.84961 6.88584 6.1854 6.55005 6.59961 6.55005C7.01382 6.55005 7.34961 6.88584 7.34961 7.30005Z\"/><path d=\"M8.7002 6.6499C9.11441 6.6499 9.4502 6.31412 9.4502 5.8999C9.4502 5.48569 9.11441 5.1499 8.7002 5.1499C8.28598 5.1499 7.9502 5.48569 7.9502 5.8999C7.9502 6.31412 8.28598 6.6499 8.7002 6.6499Z\"/><path d=\"M7.34961 5.19995C7.34961 5.61416 7.01382 5.94995 6.59961 5.94995C6.1854 5.94995 5.84961 5.61416 5.84961 5.19995C5.84961 4.78574 6.1854 4.44995 6.59961 4.44995C7.01382 4.44995 7.34961 4.78574 7.34961 5.19995Z\"/><path d=\"M8.7002 8.75C9.11441 8.75 9.4502 8.41421 9.4502 8C9.4502 7.58579 9.11441 7.25 8.7002 7.25C8.28598 7.25 7.9502 7.58579 7.9502 8C7.9502 8.41421 8.28598 8.75 8.7002 8.75Z\"/><path d=\"M5.25 3.80005C5.25 4.21426 4.91421 4.55005 4.5 4.55005C4.08579 4.55005 3.75 4.21426 3.75 3.80005C3.75 3.38584 4.08579 3.05005 4.5 3.05005C4.91421 3.05005 5.25 3.38584 5.25 3.80005Z\"/><path d=\"M9.51195 0.398918C8.0086 0.0998821 6.45033 0.253358 5.0342 0.839937C3.61808 1.42652 2.40769 2.41985 1.55611 3.69433C0.704529 4.96881 0.25 6.4672 0.25 8C0.25 10.0554 1.06652 12.0267 2.51992 13.4801C3.97333 14.9335 5.94457 15.75 8 15.75C9.53281 15.75 11.0312 15.2955 12.3057 14.4439C13.5801 13.5923 14.5735 12.3819 15.1601 10.9658C15.7466 9.54967 15.9001 7.99141 15.6011 6.48805C15.3021 4.9847 14.5639 3.60378 13.4801 2.51993C12.3962 1.43607 11.0153 0.697953 9.51195 0.398918ZM7.95322 1.75018C7.96139 1.84081 7.98602 1.92955 8.02626 2.01195C8.08507 2.13238 8.17507 2.23484 8.2869 2.30869C8.39873 2.38255 8.52831 2.42508 8.66215 2.43188C8.796 2.43868 8.92922 2.40949 9.04795 2.34735C9.16669 2.28521 9.26661 2.19239 9.33732 2.07854C9.36983 2.02619 9.39561 1.97028 9.41428 1.91212C9.856 2.01473 10.2833 2.16467 10.6893 2.35818C10.3275 2.41161 10.0498 2.72343 10.0498 3.1001C10.0498 3.51431 10.3856 3.8501 10.7998 3.8501C11.214 3.8501 11.5498 3.51431 11.5498 3.1001C11.5498 3.00058 11.5304 2.90559 11.4952 2.8187C11.8254 3.04143 12.1351 3.29626 12.4194 3.58059C12.4912 3.65234 12.561 3.72571 12.629 3.80061C12.3489 3.90937 12.1504 4.1815 12.1504 4.5C12.1504 4.91421 12.4862 5.25 12.9004 5.25C13.1304 5.25 13.3362 5.14645 13.4738 4.98342C13.7818 5.54229 14.0041 6.14805 14.1299 6.78069C14.3711 7.99307 14.2473 9.24974 13.7742 10.3918C13.7327 10.492 13.6887 10.591 13.6422 10.6886C13.5883 10.3272 13.2767 10.05 12.9004 10.05C12.4862 10.05 12.1504 10.3858 12.1504 10.8C12.1504 11.2143 12.4862 11.55 12.9004 11.55C12.9996 11.55 13.0942 11.5308 13.1809 11.4958C12.7294 12.165 12.1501 12.7438 11.4723 13.1967L11.4439 13.2156C11.3129 12.9967 11.0735 12.8501 10.7998 12.8501C10.3856 12.8501 10.0498 13.1859 10.0498 13.6001C10.0498 13.7008 10.0697 13.7969 10.1057 13.8846C9.43348 14.1251 8.72147 14.25 8 14.25C6.3424 14.25 4.75268 13.5915 3.58058 12.4194C2.40848 11.2473 1.75 9.65761 1.75 8C1.75 6.76387 2.11656 5.5555 2.80331 4.52769C3.49007 3.49988 4.46619 2.6988 5.60823 2.22576C6.35565 1.91617 7.15216 1.75618 7.95322 1.75018Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-world__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","import { type VueNodeElement } from '@/types/elements';\n\nimport BagIcon from '@adyen/ui-assets-icons-16/vue/bag';\nimport CarIcon from '@adyen/ui-assets-icons-16/vue/car';\nimport CashStackIcon from '@adyen/ui-assets-icons-16/vue/cash-stack';\nimport CloudIcon from '@adyen/ui-assets-icons-16/vue/cloud';\nimport DiamondIcon from '@adyen/ui-assets-icons-16/vue/diamond';\nimport EducationIcon from '@adyen/ui-assets-icons-16/vue/education';\nimport EmoticonHappyIcon from '@adyen/ui-assets-icons-16/vue/emoticon-happy';\nimport HotelIcon from '@adyen/ui-assets-icons-16/vue/gambling';\nimport GamingIcon from '@adyen/ui-assets-icons-16/vue/gaming';\nimport GiftIcon from '@adyen/ui-assets-icons-16/vue/gift';\nimport HandRockIcon from '@adyen/ui-assets-icons-16/vue/hand-rock';\nimport HashtagIcon from '@adyen/ui-assets-icons-16/vue/hashtag';\nimport HeartIcon from '@adyen/ui-assets-icons-16/vue/heart';\nimport HospitalityIcon from '@adyen/ui-assets-icons-16/vue/hospitality';\nimport HourglassIcon from '@adyen/ui-assets-icons-16/vue/hourglass';\nimport LeafIcon from '@adyen/ui-assets-icons-16/vue/leaf';\nimport LightningIcon from '@adyen/ui-assets-icons-16/vue/lightning';\nimport LockIcon from '@adyen/ui-assets-icons-16/vue/lock';\nimport NewsIcon from '@adyen/ui-assets-icons-16/vue/news';\nimport NotificationIcon from '@adyen/ui-assets-icons-16/vue/notification';\nimport PrizeIcon from '@adyen/ui-assets-icons-16/vue/prize';\nimport RetailIcon from '@adyen/ui-assets-icons-16/vue/retail';\nimport ShoppingCartIcon from '@adyen/ui-assets-icons-16/vue/shopping-cart';\nimport SleepIcon from '@adyen/ui-assets-icons-16/vue/sleep';\nimport StackIcon from '@adyen/ui-assets-icons-16/vue/stack';\nimport StarIcon from '@adyen/ui-assets-icons-16/vue/star';\nimport SupportIcon from '@adyen/ui-assets-icons-16/vue/support';\nimport TargetIcon from '@adyen/ui-assets-icons-16/vue/target';\nimport ThumbsDownIcon from '@adyen/ui-assets-icons-16/vue/thumb-down';\nimport ThumbsUpIcon from '@adyen/ui-assets-icons-16/vue/thumb-up';\nimport TravelBagIcon from '@adyen/ui-assets-icons-16/vue/travel-bag';\nimport WarningDiamondIcon from '@adyen/ui-assets-icons-16/vue/warning-diamond';\nimport WorldIcon from '@adyen/ui-assets-icons-16/vue/world';\n\nexport enum BentoHeaderWithViewsItemIconColorEnum {\n BLUE = 'blue',\n GREEN = 'green',\n ORANGE = 'orange',\n PRIMARY = 'primary',\n RED = 'red',\n YELLOW = 'yellow',\n}\n\nexport enum BentoHeaderWithViewsItemIconEnum {\n STACK = 'stack',\n LEAF = 'leaf',\n HAND_ROCK = 'hand-rock',\n CAR = 'car',\n EDUCATION = 'education',\n HOTEL = 'hotel',\n TRAVEL_BAG = 'travel-bag',\n LIGHTNING = 'lightning',\n NEWS = 'news',\n PRIZE = 'prize',\n LOCK = 'lock',\n BAG = 'bag',\n DIAMOND = 'diamond',\n TARGET = 'target',\n GIFT = 'gift',\n CASH_STACK = 'cash-stack',\n HASHTAG = 'hashtag',\n CLOUD = 'cloud',\n HOSPITALITY = 'hospitality',\n SHOPPING_CART = 'shopping-cart',\n SLEEP = 'sleep',\n NOTIFICATION = 'notification',\n THUMBS_UP = 'thumb-up',\n THUMBS_DOWN = 'thumb-down',\n STAR = 'star',\n WARNING_DIAMOND = 'warning-diamond',\n RETAIL = 'retail',\n EMOTICON_HAPPY = 'emoticon-happy',\n GAMING = 'gaming',\n SUPPORT = 'support',\n HEART = 'heart',\n HOURGLASS = 'hourglass',\n WORLD = 'world',\n}\n\nexport type BentoHeaderWithViewsItemIconColor = `${BentoHeaderWithViewsItemIconColorEnum}`;\nexport type BentoHeaderWithViewsItemIcon = `${BentoHeaderWithViewsItemIconEnum}`;\n\nexport interface BentoHeaderWithViewsItemAdditionalConfig {\n /*\n Label for an additional view setting (e.g. a checkbox or toggle).\n /\n label: string;\n\n /\n Boolean value indicating the state of the additional view setting (e.g., checked or toggled).\n /\n value: boolean;\n}\n\nexport interface BentoHeaderWithViewsItem {\n /\n Optional icon to display for the view item.\n /\n icon?: BentoHeaderWithViewsItemIcon;\n\n /\n Optional color of the icon for the view item.\n /\n iconColor?: BentoHeaderWithViewsItemIconColor;\n\n /\n Text label for the view item.\n /\n label: string;\n\n /\n Optional boolean indicating if this view item is the default or currently active view.\n /\n isDefault?: boolean;\n\n /\n Optional configuration for an additional view setting, such as a filter or option.\n /\n additionalViewSetting?: BentoHeaderWithViewsItemAdditionalConfig;\n\n /\n Optional boolean indicating if this view can be edited or deleted.\n /\n isFixed?: boolean;\n}\n\nexport interface BentoHeaderWithViewsItemUpdate {\n newViews: Array<BentoHeaderWithViewsItem>;\n oldViews: Array<BentoHeaderWithViewsItem>;\n targetViewLabel: BentoHeaderWithViewsItem['label'];\n}\n\nexport const BentoHeaderWithViewsItemIconElement: Record<BentoHeaderWithViewsItemIcon, VueNodeElement> = {\n [BentoHeaderWithViewsItemIconEnum.STACK]: StackIcon,\n [BentoHeaderWithViewsItemIconEnum.LEAF]: LeafIcon,\n [BentoHeaderWithViewsItemIconEnum.HAND_ROCK]: HandRockIcon,\n [BentoHeaderWithViewsItemIconEnum.CAR]: CarIcon,\n [BentoHeaderWithViewsItemIconEnum.EDUCATION]: EducationIcon,\n [BentoHeaderWithViewsItemIconEnum.HOTEL]: HotelIcon,\n [BentoHeaderWithViewsItemIconEnum.TRAVEL_BAG]: TravelBagIcon,\n [BentoHeaderWithViewsItemIconEnum.LIGHTNING]: LightningIcon,\n [BentoHeaderWithViewsItemIconEnum.NEWS]: NewsIcon,\n [BentoHeaderWithViewsItemIconEnum.PRIZE]: PrizeIcon,\n [BentoHeaderWithViewsItemIconEnum.LOCK]: LockIcon,\n [BentoHeaderWithViewsItemIconEnum.BAG]: BagIcon,\n [BentoHeaderWithViewsItemIconEnum.DIAMOND]: DiamondIcon,\n [BentoHeaderWithViewsItemIconEnum.TARGET]: TargetIcon,\n [BentoHeaderWithViewsItemIconEnum.GIFT]: GiftIcon,\n [BentoHeaderWithViewsItemIconEnum.CASH_STACK]: CashStackIcon,\n [BentoHeaderWithViewsItemIconEnum.HASHTAG]: HashtagIcon,\n [BentoHeaderWithViewsItemIconEnum.CLOUD]: CloudIcon,\n [BentoHeaderWithViewsItemIconEnum.HOSPITALITY]: HospitalityIcon,\n [BentoHeaderWithViewsItemIconEnum.SHOPPING_CART]: ShoppingCartIcon,\n [BentoHeaderWithViewsItemIconEnum.SLEEP]: SleepIcon,\n [BentoHeaderWithViewsItemIconEnum.NOTIFICATION]: NotificationIcon,\n [BentoHeaderWithViewsItemIconEnum.THUMBS_UP]: ThumbsUpIcon,\n [BentoHeaderWithViewsItemIconEnum.THUMBS_DOWN]: ThumbsDownIcon,\n [BentoHeaderWithViewsItemIconEnum.STAR]: StarIcon,\n [BentoHeaderWithViewsItemIconEnum.WARNING_DIAMOND]: WarningDiamondIcon,\n [BentoHeaderWithViewsItemIconEnum.RETAIL]: RetailIcon,\n [BentoHeaderWithViewsItemIconEnum.EMOTICON_HAPPY]: EmoticonHappyIcon,\n [BentoHeaderWithViewsItemIconEnum.GAMING]: GamingIcon,\n [BentoHeaderWithViewsItemIconEnum.SUPPORT]: SupportIcon,\n [BentoHeaderWithViewsItemIconEnum.HEART]: HeartIcon,\n [BentoHeaderWithViewsItemIconEnum.HOURGLASS]: HourglassIcon,\n [BentoHeaderWithViewsItemIconEnum.WORLD]: WorldIcon,\n};\n\nexport interface BentoHeaderWithViewsEmits {\n /\n Emitted when a new view is added to the list of views.\n /\n (e: 'add:view', value: BentoHeaderWithViewsItemUpdate): void;\n\n /\n Emitted when a view is deleted from the list of views.\n /\n (e: 'delete:view', value: BentoHeaderWithViewsItemUpdate): void;\n\n /\n Emitted when a view is duplicated.\n /\n (e: 'duplicate:view', value: BentoHeaderWithViewsItemUpdate): void;\n\n /\n Emitted when the user reorganizes the order of the views.\n * No `targetViewLabel` is emitted as the views are reordered as a whole.\n /\n (e: 'reorder:view', value: Omit<BentoHeaderWithViewsItemUpdate, 'targetViewLabel'>): void;\n\n /\n Emitted when the user requests to restore a previously saved or default view.\n /\n (e: 'restore:view', value: BentoHeaderWithViewsItem['label']): void;\n\n /\n Emitted when the user requests to save the current view.\n /\n (e: 'save:view', value: BentoHeaderWithViewsItem['label']): void;\n\n /\n Emitted when the user selects a different view from the available options.\n /\n (e: 'select:view', value: BentoHeaderWithViewsItem['label']): void;\n\n /\n Emitted when a property of a view is updated.\n /\n (e: 'update:view', value: BentoHeaderWithViewsItemUpdate): void;\n\n /\n Emitted when the user selects the prompt checkbox and closes the modal with a valid button action.\n * Only works when a string is pass into the `skipUnsavedChangesText` prop.\n /\n (e: 'update:skip-unsaved-changes', value: boolean): void;\n\n /\n Emitted when the active view index changes. Used for two-way binding with v-model:active-view-index.\n /\n (e: 'update:active-view-index', value: number \| null): void;\n}\n\nexport type BentoHeaderWithViewsItemErrors = {\n /\n Object where the keys correspond to the properties of `BentoHeaderWithViewsItem`,\n * and the values are strings representing any validation errors for that property.\n /\n [K in keyof BentoHeaderWithViewsItem]: string;\n};\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M1.25 2.58325H14.75V4.08325H1.25V2.58325Z\"/><path fill=\"#001222\" d=\"M1.25 7.25H14.75V8.75H1.25V7.25Z\"/><path fill=\"#001222\" d=\"M14.75 11.9167H1.25V13.4167H14.75V11.9167Z\"/></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","import { useI18n } from '@/utils/ts/i18n';\nimport { computed, reactive, ref } from 'vue';\nimport {\n type BentoHeaderWithViewsItemErrors,\n BentoHeaderWithViewsItemIconColorEnum,\n BentoHeaderWithViewsItemIconEnum,\n} from '../../header-with-views.internal.types';\nimport {\n type BentoHeaderWithViewsItem,\n type BentoHeaderWithViewsItemAdditionalConfig,\n type BentoHeaderWithViewsItemUpdate,\n} from '../../header-with-views.types';\nimport messages from '../../messages.json';\n\ntype MessageSchema = (typeof messages)['en-US'];\n\ninterface UseEditViewsProps {\n additionalViewSetting: BentoHeaderWithViewsItemAdditionalConfig \| null;\n views: Array<BentoHeaderWithViewsItem>;\n}\n\n/\n Composable function to create, edit, update and delete (CRUD) configurations in views.\n \n @param options - Configuration object for the CRUD functionality.\n * @returns An object containing reactive state and handler functions for CRUD.\n /\nexport const useEditViews = (options: UseEditViewsProps) => {\n const views = ref<Array<BentoHeaderWithViewsItem>>(options.views);\n const errors = reactive<BentoHeaderWithViewsItemErrors>({ label: '' });\n\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n const computedViews = computed<Array<BentoHeaderWithViewsItem>>(() =>\n views.value.map(viewItem => ({\n ...viewItem,\n\n iconColor: viewItem.iconColor ?? BentoHeaderWithViewsItemIconColorEnum.PRIMARY,\n icon: viewItem.icon ?? BentoHeaderWithViewsItemIconEnum.STACK,\n label: viewItem.label,\n\n ...(viewItem.isDefault !== null ? { isDefault: viewItem.isDefault } : null),\n\n ...(options?.additionalViewSetting\n ? {\n additionalViewSetting: {\n label: options.additionalViewSetting.label,\n value: viewItem.additionalViewSetting?.value ?? options.additionalViewSetting.value,\n },\n }\n : []),\n }))\n );\n\n /\n Adds, updates, or deletes a view item based on the provided data and index.\n * If `index` is provided and `data` is `null`, the view at `index` is deleted.\n * If `index` is provided and `data` is an object, the view at `index` is updated with `data`.\n * If `index` is not provided, a new view is added using `data`.\n * @param data - The partial data for the view item to add or update, or `null` to delete.\n * @param index - The optional index of the view item to update or delete.\n /\n const updateView = (data: Partial<BentoHeaderWithViewsItem>, index?: number): BentoHeaderWithViewsItemUpdate => {\n let newViews = [...views.value];\n const oldViews = [...views.value];\n\n let targetViewLabel: BentoHeaderWithViewsItem['label'];\n\n if (newViews[index]) {\n if (!data) {\n // delete\n newViews.splice(index, 1);\n\n targetViewLabel = oldViews[index].label;\n } else {\n // there can only be one default view - remove default view from all other views\n if (data.isDefault) {\n newViews = newViews.map(view => (view.isDefault ? { ...view, isDefault: false } : view));\n }\n\n // update\n newViews[index] = {\n ...newViews[index],\n ...data,\n };\n\n targetViewLabel = newViews[index].label;\n }\n } else {\n // add\n newViews.push(data as BentoHeaderWithViewsItem);\n\n targetViewLabel = data.label;\n }\n\n views.value = [...newViews];\n\n return {\n newViews: views.value,\n oldViews,\n targetViewLabel,\n };\n };\n\n /\n Duplicates a view item at the given index, appending a numerical suffix to its label to ensure uniqueness.\n * @param index - The index of the view item to duplicate.\n /\n const duplicateView = (index: number): BentoHeaderWithViewsItemUpdate => {\n const toCopyLabel = computedViews.value[index].label;\n\n let copiedLabel = `(1) - ${toCopyLabel}`;\n let suffix = 1;\n\n while (computedViews.value.some(view => view.label === copiedLabel)) {\n suffix++;\n copiedLabel = `(${suffix}) - ${computedViews.value[index].label}`;\n }\n\n const newView = {\n ...computedViews.value[index],\n label: copiedLabel,\n };\n\n // for duplicates, our target is the view that users want to duplicate\n // instead of the duplicated label\n return {\n ...updateView(newView),\n targetViewLabel: toCopyLabel,\n };\n };\n\n /\n Replaces the current list of views with a new array of views.\n * @param newViews - The new array of `BentoHeaderWithViewsItem` to set as the current views.\n * @returns An object containing the `oldViews` (the state before the update) and `newViews` (the new state).\n /\n const setViews = (newViews: Array<BentoHeaderWithViewsItem>) => {\n const oldViews = views.value;\n\n views.value = newViews;\n\n return { oldViews, newViews };\n };\n\n /* Clears any validation errors related to the view label. /\n const clearError = () => {\n errors.label = '';\n };\n\n /\n Validates the provided label for a view item.\n * Sets an error message if the label is empty or if it already exists among other views (excluding the view at the given index).\n * @param value - The label string to validate.\n * @param index - The index of the view item being validated (used to exclude itself from uniqueness checks).\n /\n const validateLabel = (value: BentoHeaderWithViewsItem['label'], index: number) => {\n const labelIsRequired = value.trim().length === 0;\n const labelAlreadyExist = computedViews.value.some(\n (view, viewIndex) => view.label === value && index !== viewIndex\n );\n\n if (labelIsRequired) {\n errors.label = t('labelRequiredError');\n } else if (labelAlreadyExist) {\n errors.label = t('labelNoDuplicateError');\n } else {\n clearError();\n }\n };\n\n return {\n // read\n computedViews,\n errors,\n\n // modify\n clearError,\n duplicateView,\n setViews,\n updateView,\n\n // validations\n validateLabel,\n };\n};\n","import { useEventListener } from '@/directives/click-outside/useEventListener';\nimport { type Ref, ref } from 'vue';\nimport { type BentoHeaderWithViewsItem, type BentoHeaderWithViewsProps } from '../../header-with-views.types';\n\nexport enum UseDragAndDropViewsDirectionEnum {\n UP = 'up',\n DOWN = 'down',\n}\n\ninterface UseDragAndDropViewsProps {\n itemRefs: Ref<Array<HTMLElement>>;\n items: Ref<BentoHeaderWithViewsProps['views']>;\n onDrop: (value: Array<BentoHeaderWithViewsItem>) => void;\n}\n\n/\n Composable function for implementing drag and drop reordering of views.\n \n Requires HTML to have\n * - data-drag-trigger - interactive element that initializes the drag-and-drop\n * - data-drag-item - element that will be dragged\n \n @param options - Configuration object for the drag and drop functionality.\n * @returns An object containing reactive state and handler functions for drag and drop.\n /\nexport const useDragAndDropViews = (options: UseDragAndDropViewsProps) => {\n const { itemRefs, items, onDrop } = options;\n\n const animationFrameId = ref<number>(null);\n const draggedViewIndex = ref<number>(null); // track which view item is being dragged\n const dragMousePosition = ref<number>(0); // track the place where the drag started\n const dragKeyboardInitiated = ref<boolean>(false); // track if the drag has been initiated by keyboard\n const dragOffset = ref<number>(0); // track the height of the dragged item - all draggable items have the same height\n const draggingOverViewIndex = ref<number>(null); // track which view item is being hovered over after drag started\n const maxDragOffsetY = ref<number>(0); // track bottom-most draggable location\n const minDragOffsetY = ref<number>(0); // track top-most draggable location\n\n const menuItemsElementRects = ref<Array<Pick<DOMRect, 'top' \| 'bottom' \| 'height'>>>([]);\n\n /\n * Public functions\n /\n\n /\n Checks if a specific item is currently being dragged.\n * @param index The index of the item to check.\n * @returns `true` if the item at the given index is being dragged, `false` otherwise.\n /\n const isItemDragged = (index: number) => draggedViewIndex.value === index;\n\n /\n Initiates the drag operation. This function is called when a drag is started\n * either by a mouse click and drag or by a keyboard action. It sets up the\n * initial state for the drag operation, including the dragged item's index,\n * its dimensions, and the boundaries for movement.\n * @param index The index of the item that is being dragged.\n * @param event The MouseEvent or KeyboardEvent that triggered the drag start.\n /\n const handleDragStart = (index: number, event: MouseEvent \| KeyboardEvent) => {\n if (!(event.target as HTMLElement).closest('[data-drag-trigger]')) {\n // skip if the grab icon button isn't the target\n return;\n }\n\n draggedViewIndex.value = index;\n\n updateMenuItemsRects();\n\n // Store the initial offset of the mouse pointer within the dragged element\n const draggedElement = itemRefs.value[index];\n\n if (!draggedElement) {\n return;\n }\n\n if (typeof (event as MouseEvent).clientY === 'number') {\n // clientY only exist on MouseEvent\n\n dragMousePosition.value = (event as MouseEvent).clientY;\n } else if (typeof (event as KeyboardEvent).key === 'string') {\n // clientY only exist on KeyboardEvent\n\n dragKeyboardInitiated.value = true;\n }\n\n dragOffset.value = draggedElement.clientHeight;\n\n // since all the height of the items are the same,\n // how far the dragged item can go is determined by checking it's current index and multiplying it\n maxDragOffsetY.value = dragOffset.value (itemRefs.value.length - index - 1); // how far down the dragged item can go\n minDragOffsetY.value = -(dragOffset.value * index); // how far top the dragged item can go\n\n // ensure that the grab is shown even if user is outside of the popover\n document.documentElement.style.cursor = 'grabbing';\n document.documentElement.style.userSelect = 'none';\n };\n\n /*\n Toggles the keyboard-initiated drag state. If a drag is not active, it starts one.\n * If a drag is already active (initiated by keyboard), it finalizes the drag operation\n * by calling `handleDrop`. This function is typically bound to an \"Enter\" key press.\n * @param index The index of the item to toggle drag for.\n * @param event The KeyboardEvent that triggered the toggle.\n /\n const handleDragKeyboardToggle = (index: number, event: KeyboardEvent) => {\n if (!dragKeyboardInitiated.value) {\n draggingOverViewIndex.value = index;\n\n handleDragStart(index, event);\n\n return;\n }\n\n handleDrop();\n };\n\n /\n Handles keyboard-driven movement of a dragged item. This function is called\n * when arrow keys (up/down) are pressed during a keyboard-initiated drag.\n * It updates the `draggingOverViewIndex` and visually transforms the elements\n * to simulate movement.\n * @param direction The direction of movement ('up' or 'down').\n * @param event The KeyboardEvent that triggered the move.\n /\n const handleDragKeyboardMove = (direction: `${UseDragAndDropViewsDirectionEnum}`, event: KeyboardEvent) => {\n if (!dragKeyboardInitiated.value) {\n return;\n }\n\n // prevent scrolling\n event.preventDefault();\n\n // scenarios to cover:\n // 1. dragging an item to the bottom\n // 2. dragging an item to the bottom and back up\n // 3. dragging an item to the top\n // 4. dragging an item to the top and back down\n // 5. dragging an item in place\n\n const upperBound = itemRefs.value.length - 1;\n const lowerBound = 0;\n const isGoingDownwards = direction === UseDragAndDropViewsDirectionEnum.DOWN;\n const isGoingUpwards = direction === UseDragAndDropViewsDirectionEnum.UP;\n\n // covers case 5 - up or down is pressed when the item is at the extremes\n if (\n (isGoingUpwards && draggingOverViewIndex.value === lowerBound) \|\|\n (isGoingDownwards && draggingOverViewIndex.value === upperBound)\n ) {\n return;\n }\n\n let targetElementIndex = draggingOverViewIndex.value + 1;\n\n if (isGoingUpwards) {\n targetElementIndex = draggingOverViewIndex.value - 1;\n }\n\n const isTargetAfterDragged = draggedViewIndex.value < targetElementIndex;\n const isTargetBeforeDragged = draggedViewIndex.value > targetElementIndex;\n\n // Indicators for when case 2 and 4 occurs\n const isDirectionReversed =\n (isGoingDownwards && isTargetBeforeDragged) \|\|\n (isGoingUpwards && isTargetAfterDragged) \|\|\n // This doesn't typically need transformation, but in a \"reversed\" direction,\n // it may potentially need to pass through it's original position\n draggedViewIndex.value === targetElementIndex;\n\n if (targetElementIndex > upperBound \|\| targetElementIndex < lowerBound) {\n return;\n }\n\n const updateDraggedElementTransform = () => {\n const draggedElement = itemRefs.value[draggedViewIndex.value];\n const offset = clampTransform((draggingOverViewIndex.value - draggedViewIndex.value) dragOffset.value);\n\n draggedElement.style.transform = `translateY(${offset}px)`;\n };\n\n const updateTargetElementTransform = () => {\n const targetElement = itemRefs.value[draggingOverViewIndex.value];\n const targetElementOffset = isGoingDownwards ? -dragOffset.value : dragOffset.value;\n\n targetElement.style.transform = isDirectionReversed\n ? 'translateY(0px)'\n : `translateY(${targetElementOffset}px)`;\n };\n\n if (!isDirectionReversed) {\n // normal reorder - case 1, 3\n draggingOverViewIndex.value = targetElementIndex;\n updateDraggedElementTransform();\n updateTargetElementTransform();\n\n return;\n }\n\n // revert reorder - case 2, 4\n updateTargetElementTransform();\n draggingOverViewIndex.value = targetElementIndex;\n updateDraggedElementTransform();\n };\n\n /*\n Stops the drag operation and resets the UI and internal state.\n * This function is called when the drag is completed (e.g., mouse button released,\n * or keyboard drag finalized). It also cleans up any applied CSS transforms.\n * @param event Optional KeyboardEvent that triggered the drag stop.\n /\n const handleDragStop = (event?: KeyboardEvent) => {\n if (event && dragKeyboardInitiated.value) {\n event.stopPropagation();\n event.preventDefault();\n }\n\n animationFrameId.value = requestAnimationFrame(() => {\n itemRefs.value.forEach(menuItem => {\n const el = menuItem;\n\n el.style.transform = '';\n });\n\n animationFrameId.value = null;\n });\n\n // Reset drag pointer events\n draggingOverViewIndex.value = null;\n draggedViewIndex.value = null;\n\n // Reset drag UI\n document.documentElement.style.cursor = '';\n document.documentElement.style.userSelect = '';\n\n // Reset drag keyboard events\n dragKeyboardInitiated.value = null;\n };\n\n /\n * Private functions\n /\n\n const handleDragMove = (event: MouseEvent) => {\n // skip if drag and drop is initiated by keyboard\n if (draggedViewIndex.value === null \|\| animationFrameId.value \|\| dragKeyboardInitiated.value) {\n return;\n }\n\n animationFrameId.value = requestAnimationFrame(() => {\n const mousePosition = event.clientY;\n const overItemIndex = menuItemsElementRects.value.findIndex(\n (rect, index) =>\n (mousePosition >= rect.top && mousePosition <= rect.bottom) \|\|\n (mousePosition <= rect.top && index === 0) \|\|\n (mousePosition >= rect.bottom && index === menuItemsElementRects.value.length - 1)\n );\n\n if (overItemIndex !== -1 && overItemIndex !== draggingOverViewIndex.value) {\n draggingOverViewIndex.value = overItemIndex;\n }\n\n updateDragPosition(mousePosition);\n\n animationFrameId.value = null;\n });\n };\n\n const handleDrop = () => {\n if (draggedViewIndex.value === null) {\n return;\n }\n\n const draggedElement = itemRefs.value[draggedViewIndex.value];\n\n if (!draggedElement) {\n return;\n }\n\n // check if there are shifts\n // handle case where the item is dragged around but placed back into it's original position\n const isNotShifted = draggedViewIndex.value === draggingOverViewIndex.value;\n\n if (isNotShifted) {\n handleDragStop();\n\n return;\n }\n\n // re-order the menu items\n const draggedItem = items.value[draggedViewIndex.value];\n const newMenuItems = [...items.value];\n\n newMenuItems.splice(draggedViewIndex.value, 1);\n newMenuItems.splice(draggingOverViewIndex.value, 0, draggedItem);\n\n transferFocus();\n handleDragStop();\n\n onDrop(newMenuItems);\n };\n\n const updateDragPosition = (mousePosition: number) => {\n // 1. set the current \"dragged\" item's position so that it looks like it is dragged\n const draggedElement = itemRefs.value[draggedViewIndex.value];\n\n if (!draggedElement) {\n return;\n }\n\n draggedElement.style.transform = `translateY(${clampTransform(mousePosition - dragMousePosition.value)}px)`;\n\n const threshold = 0.25;\n const isGoingDownwards = draggedViewIndex.value < draggingOverViewIndex.value;\n const isGoingUpwards = draggedViewIndex.value > draggingOverViewIndex.value;\n\n // 2. loop through every item in the menu and transform them\n for (let i = 0; i < menuItemsElementRects.value.length; i++) {\n if (i === draggedViewIndex.value) {\n continue;\n }\n\n const targetElement = itemRefs.value[i];\n const targetElementRect = menuItemsElementRects.value[i];\n\n const distanceFromTop = mousePosition - targetElementRect.top;\n const percentFromTop = distanceFromTop / targetElementRect.height;\n\n // scenarios to cover when optimisation is needed:\n // 1. dragging an item to the bottom\n // 2. dragging an item to the bottom and without releasing, back up\n // 3. dragging an item to the top\n // 4. dragging an item to the top and without releasing, back down\n // 5. dragging an item in place\n if (percentFromTop >= threshold && isGoingDownwards) {\n // covers scenario 1\n\n if (i < draggedViewIndex.value) {\n // avoid transforming an untouched item\n continue;\n }\n\n targetElement.style.transform = `translateY(-${dragOffset.value}px)`;\n } else if (percentFromTop <= 1 - threshold && isGoingUpwards) {\n // covers scenario 3\n\n if (i > draggedViewIndex.value) {\n // avoid transforming an untouched item\n continue;\n }\n\n targetElement.style.transform = `translateY(${dragOffset.value}px)`;\n } else {\n // covers scenario 2, 4, 5\n\n targetElement.style.transform = 'translateY(0px)';\n }\n }\n };\n\n const transferFocus = () => {\n const activeElement = document.activeElement;\n\n if (!activeElement?.closest('[data-drag-item]')) {\n return;\n }\n\n // usually, HTML will blur the item after drag and drop\n // this is used to handle the edge case where users tab onto the grab icon and then switch to using the mouse\n (\n itemRefs.value[draggingOverViewIndex.value]?.querySelector('[data-drag-trigger]') satisfies HTMLElement\n )?.focus();\n };\n\n const clampTransform = (value: number) => {\n return Math.max(minDragOffsetY.value, Math.min(maxDragOffsetY.value, value));\n };\n\n // cache rects to prevent getBoundingClientRect() from being intrusive\n // needed to ensure that mouse outside of the popover still relocates the dragged item\n const updateMenuItemsRects = () => {\n menuItemsElementRects.value = itemRefs.value.map(itemEl => {\n const { top, bottom, height } = itemEl.getBoundingClientRect();\n\n return {\n top,\n bottom,\n height,\n };\n });\n };\n\n useEventListener(document, 'pointermove', handleDragMove);\n useEventListener(document, 'pointerup', handleDrop, { capture: true });\n useEventListener(document, 'keydown', (event: KeyboardEvent) => {\n if (event.key !== 'Tab' \|\| draggedViewIndex.value === null) {\n return;\n }\n\n // prevent user from clicking Tab while drag is initiated\n event.preventDefault();\n });\n useEventListener(document, 'pointerdown', () => {\n // stop drag if it was dragged by keyboard and user changes to use a mouse\n if (dragKeyboardInitiated.value) {\n handleDragStop();\n }\n });\n\n return {\n draggedViewIndex,\n draggingOverViewIndex,\n isItemDragged,\n handleDragKeyboardToggle,\n handleDragKeyboardMove,\n handleDragStart,\n handleDragStop,\n };\n};\n","import { useElementSize } from '@vueuse/core';\nimport { nextTick, type Ref, ref, watch } from 'vue';\n\ninterface UseResponsiveViewsProps {\n container: Ref<HTMLElement>;\n children: Ref<Array<HTMLElement>>;\n offset: Ref<HTMLElement>;\n activeViewIndex: Ref<number>;\n}\n\n/\n Composable function for dynamically adjusting the visibility of view elements\n * within a container to ensure the active view remains visible and the total\n * width of displayed views fits within the container's width.\n \n @param elements - Configuration object containing refs to the container,\n * view elements, an offset element, and the active view index.\n * @returns An object containing reactive state for the maximum number of\n * views that can be displayed.\n /\nexport const useResponsiveViews = (elements: UseResponsiveViewsProps) => {\n const { container, children, offset, activeViewIndex } = elements;\n\n const maxDisplayedViews = ref<number>(children.value.length);\n\n const { width } = useElementSize(container);\n\n // responsible for calculating the number of views to be shown\n // and to keep the active view shown in the bar\n watch(\n [width, activeViewIndex, children],\n async ([containerWidth, newActiveViewIndex, childrenEl], [, oldActiveViewIndex]) => {\n const numberOfChildren = childrenEl.length;\n\n if (numberOfChildren === 0) {\n return;\n }\n\n // include the any additional spacing or the side buttons\n let totalWidth = offset.value.offsetWidth;\n\n // reset the views to display all views\n maxDisplayedViews.value = numberOfChildren;\n\n // reset any active children\n // case: when user click on a new active view\n // avoid: resetting when only the width changed and the activeIndex stays the same\n const previousActiveChild = childrenEl[oldActiveViewIndex];\n\n if (previousActiveChild) {\n previousActiveChild.style.display = 'none';\n }\n\n // loop through all children and count how many children can fit in the viewport\n for (let index = 0; index < numberOfChildren; index++) {\n const child = childrenEl[index];\n\n // temporarily enabled it so that the width can be obtained\n // `display: none` = 0 width\n child.style.display = 'inline-flex';\n\n if (totalWidth + child.offsetWidth <= containerWidth) {\n totalWidth += child.offsetWidth;\n } else {\n maxDisplayedViews.value = index;\n\n // the algorithms performs a lookahead\n // if the next child, that was enabled previously, does not fit, hide it again\n\n child.style.display = 'none';\n\n break;\n }\n }\n\n // if the active view is already in the bar i.e. users can see, skip\n if (newActiveViewIndex < maxDisplayedViews.value \|\| newActiveViewIndex === null) {\n return;\n }\n\n await nextTick();\n\n // ensure that the active view is always shown in the bar as the last item\n // loops through the items that are shown in the bar, from the end, remove them if they no longer fit\n let index = maxDisplayedViews.value - 1;\n const activeChild = childrenEl[newActiveViewIndex];\n\n activeChild.style.display = 'inline-flex';\n totalWidth += activeChild.offsetWidth;\n\n // if even the active child doesn't fit in the viewport, don't show\n //\n // EDGE CASE: title + action buttons are extremely long\n if (index < 0 && totalWidth > containerWidth) {\n activeChild.style.display = 'none';\n\n return;\n }\n\n // CASE:\n // when the active view is LONGER than most items in the bar,\n // hide as many items as possible until active view fits\n //\n // CASE:\n // when the active view is SHORTER than most items in the bar,\n // show as many as possible until active view fits\n while (totalWidth > containerWidth && index >= 0) {\n const child = children.value[index];\n\n totalWidth -= child.offsetWidth;\n\n child.style.display = 'none';\n\n index--;\n }\n },\n { immediate: true }\n );\n\n // responsible to hide any views that are more than the decided numbers of views\n watch([maxDisplayedViews, () => children.value.length], ([newMaxDisplayedViews, numberOfChildren]) => {\n for (let index = newMaxDisplayedViews; index < numberOfChildren; index++) {\n const child = children.value[index];\n\n child.style.display = 'none';\n }\n });\n\n return {\n maxDisplayedViews,\n };\n};\n","<template>\n <div\n ref=\"allViewsRef\"\n class=\"b-header-with-views-all-views\"\n data-testid=\"header-with-views-all-views\"\n @keydown.esc.stop.prevent=\"closeMenu\"\n >\n <bento-toggle-button\n ref=\"allViewsMenuToggleRef\"\n aria-haspopup=\"true\"\n :aria-expanded=\"showMenu\"\n :aria-controls=\"showMenu ? menuPopoverId : null\"\n variant=\"tertiary\"\n :toggled=\"showMenu\"\n @click=\"toggleShowMenu\"\n >\n <template #iconLeft>\n <menu-icon :svg-title=\"t('toggleAllViews')\" />\n </template>\n </bento-toggle-button>\n\n <bento-popover\n v-if=\"allViewsMenuToggleRef\"\n :id=\"menuPopoverId\"\n ref=\"allViewsMenuPopoverRef\"\n class=\"b-header-with-views-all-views__popover\"\n :open=\"showMenu\"\n :target-element=\"allViewsMenuToggleRef\"\n :fixed-positioning=\"true\"\n :overflow-visible=\"true\"\n position=\"bottom-end\"\n without-space\n >\n <output\n v-if=\"draggedViewIndex !== null && draggingOverViewIndex !== null\"\n class=\"b-header-with-views-all-views__popover-status\"\n >\n {{\n t('movingDraggedToPosition', {\n dragged: menuItems[draggedViewIndex].label,\n draggingOver: menuItems[draggingOverViewIndex].label,\n })\n }}\n </output>\n\n <ul ref=\"menuRef\" class=\"b-header-with-views-all-views__popover-menu\">\n <li\n v-for=\"(item, index) in menuItems\"\n ref=\"menuItemRefs\"\n :key=\"index\"\n data-drag-item\n class=\"b-header-with-views-all-views__popover-menu-item\"\n :class=\"conditionalDraggableItemClass(index)\"\n @pointerdown=\"handleDragStart(index, $event)\"\n >\n <div class=\"b-header-with-views-all-views__popover-menu-item-content\">\n <bento-button\n data-drag-trigger\n class=\"b-header-with-views-all-views__popover-menu-item-button b-header-with-views-all-views__popover-menu-item-button-reorder\"\n variant=\"tertiary\"\n :aria-pressed=\"isItemDragged(index)\"\n @keydown.enter.native=\"handleDragKeyboardToggle(index, $event)\"\n @keydown.space.native=\"handleDragKeyboardToggle(index, $event)\"\n @keydown.down.native=\"handleDragKeyboardMove(UseDragAndDropViewsDirectionEnum.DOWN, $event)\"\n @keydown.up.native=\"handleDragKeyboardMove(UseDragAndDropViewsDirectionEnum.UP, $event)\"\n @keydown.esc.native=\"handleDragStop\"\n >\n <template #iconLeft>\n <grab-icon :svg-title=\"t('reorderView', { label: item.label })\" />\n </template>\n </bento-button>\n\n <bento-button\n data-view-select\n class=\"b-header-with-views-all-views__popover-menu-item-button b-header-with-views-all-views__popover-menu-item-button-select\"\n variant=\"tertiary\"\n @click=\"emit('select:view', index)\"\n >\n <template #iconLeft>\n <span\n class=\"b-header-with-views-all-views__popover-menu-item-button-icon\"\n :class=\"`b-header-with-views-all-views__popover-menu-item-button-icon--${item.iconColor}`\"\n aria-hidden=\"true\"\n >\n <component :is=\"BentoHeaderWithViewsItemIconElement[item.icon]\" />\n </span>\n </template>\n\n <bento-typography\n el=\"span\"\n variant=\"body\"\n class=\"b-header-with-views-all-views__popover-menu-item-button-text\"\n >\n {{ item.label }}\n </bento-typography>\n </bento-button>\n\n <bento-menu\n ref=\"editViewMenuRefs\"\n data-view-menu\n class=\"b-header-with-views-all-views__popover-menu-item-button\"\n :button=\"{\n variant: 'tertiary',\n condensed: true,\n 'aria-label': t('openViewOptions', { label: item.label }),\n }\"\n :close-on-click-outside-options=\"menuCloseOnClickOutsideOptions\"\n :data=\"menuItemsActions\"\n menu-position=\"right-start\"\n @open=\"emit('open:view-menu', index)\"\n @close=\"emit('close:view-menu', index)\"\n @keydown.tab.native.capture=\"closeViewMenuNatively(index)\"\n >\n <template #iconLeft>\n <options-horizontal-icon :aria-hidden=\"true\" />\n </template>\n </bento-menu>\n </div>\n </li>\n </ul>\n </bento-popover>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { BentoButton, BentoToggleButton } from '@/components/button';\n import { BentoHeaderWithViewsItemIconElement } from '@/components/header-with-views/header-with-views.internal.types';\n import { BentoMenu } from '@/components/menu';\n import { BentoPopover } from '@/components/popover';\n import { BentoTypography } from '@/components/typography';\n import { useClickOutside } from '@/composables';\n import { generateUid } from '@/utils/ts/generate-uid';\n import { useI18n } from '@/utils/ts/i18n';\n import GrabIcon from '@adyen/ui-assets-icons-16/vue/grab';\n import MenuIcon from '@adyen/ui-assets-icons-16/vue/menu';\n import OptionsHorizontalIcon from '@adyen/ui-assets-icons-16/vue/options-horizontal';\n import { nextTick, ref, toRef } from 'vue';\n import { useDragAndDropViews, UseDragAndDropViewsDirectionEnum } from '../../composables';\n import { type HeaderWithViewsAllViewsProps } from './header-with-views-all-views.types';\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n const props = defineProps({\n menuCloseOnClickOutsideOptions: null,\n menuItems: null,\n menuItemsActions: null\n});\n\n const emit = defineEmits([\"close:all-views\", \"close:view-menu\", \"open:all-views\", \"open:view-menu\", \"select:view\", \"reorder:view\"]);\n\n const showMenu = ref(false);\n const allViewsMenuToggleRef = ref(null);\n const allViewsMenuPopoverRef = ref(null);\n const allViewsRef = ref(null);\n const menuRef = ref(null);\n const menuItemRefs = ref<Array<HTMLElement>>(null);\n const editViewMenuRefs = ref(null);\n\n const menuPopoverId = generateUid('menu-popover');\n\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n useClickOutside(allViewsMenuPopoverRef, () => closeMenu(), {\n ignore: [allViewsMenuToggleRef, ...(props.menuCloseOnClickOutsideOptions?.ignore ?? [])],\n });\n\n const openMenu = () => {\n showMenu.value = true;\n\n emit('open:all-views');\n };\n\n const closeMenu = async () => {\n if (!showMenu.value) {\n return;\n }\n\n showMenu.value = false;\n\n emit('close:all-views');\n\n await nextTick();\n\n allViewsMenuToggleRef.value.$el.focus();\n };\n\n const toggleShowMenu = (e: MouseEvent) => {\n e.stopPropagation();\n\n if (!showMenu.value) {\n openMenu();\n } else {\n closeMenu();\n }\n };\n\n const {\n draggedViewIndex,\n draggingOverViewIndex,\n isItemDragged,\n handleDragKeyboardMove,\n handleDragKeyboardToggle,\n handleDragStart,\n handleDragStop,\n } = useDragAndDropViews({\n items: toRef(props, 'menuItems'),\n itemRefs: menuItemRefs,\n onDrop: value => emit('reorder:view', value),\n });\n\n const conditionalDraggableItemClass = (index: number) => ({\n ['b-header-with-views-all-views__popover-menu-item--dragging']: isItemDragged(index),\n });\n\n const closeViewMenuNatively = (index: number) => {\n // skip built-in refocus on the menu button when menu is closed\n // enables tab to flow as intended by HTML spec\n editViewMenuRefs.value[index].closeMenu(false);\n };\n</script>\n\n<script lang=\"ts\">\n /\n Internal component to handle the logic for the list of all views available.\n /\n export default {\n i18n: { messages },\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./header-with-views-all-views.scss\" />\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-ui-assets/icons-16-circle_filled__a' + uuid + ')'\"><path fill=\"#001222\" d=\"M8 0.25C3.71979 0.25 0.25 3.71979 0.25 8C0.25 12.2802 3.71979 15.75 8 15.75C12.2802 15.75 15.75 12.2802 15.75 8C15.75 3.71979 12.2802 0.25 8 0.25Z\"/></g><defs><clipPath :id=\"'uia-ui-assets/icons-16-circle_filled__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script setup>\n import { getCurrentInstance } from 'vue';\n import '../css/main.css';\n\n const instance = getCurrentInstance();\n const uuid = String(instance?.uid ?? instance?.proxy?._uid);\n</script>\n","import {\n type BentoHeaderWithViewsItemAdditionalConfig,\n type BentoHeaderWithViewsItemIcon,\n type BentoHeaderWithViewsItemIconColor,\n} from '../../header-with-views.types';\nimport { type BentoHeaderWithViewsItemErrors } from '../../header-with-views.internal.types';\n\ntype HeaderWithViewsEditFormContext = `${HeaderWithViewsEditFormContextEnum}`;\n\nexport enum HeaderWithViewsEditFormContextEnum {\n EDIT = 'edit',\n CREATE = 'create',\n}\n\nexport interface HeaderWithViewsEditFormProps {\n additionalFormItem?: BentoHeaderWithViewsItemAdditionalConfig;\n context?: HeaderWithViewsEditFormContext;\n disableCustomization?: boolean;\n errors?: BentoHeaderWithViewsItemErrors;\n icon?: BentoHeaderWithViewsItemIcon;\n iconColor?: BentoHeaderWithViewsItemIconColor;\n label?: string;\n}\n","<template>\n <form class=\"b-header-with-views-edit-form\">\n <field-label>{{ t('title') }}</field-label>\n\n <div class=\"b-header-with-views-edit-form__icon-choice-alert\" role=\"alert\">{{ computedAlert }}</div>\n\n <div class=\"b-header-with-views-edit-form__icon-selector\">\n <bento-toggle-button\n ref=\"iconSelectorButtonRef\"\n variant=\"secondary\"\n :aria-expanded=\"showIconSelectorPopover\"\n :aria-controls=\"showIconSelectorPopover ? iconPopoverId : null\"\n :disabled=\"props.disableCustomization\"\n :toggled=\"showIconSelectorPopover\"\n @click=\"showIconSelectorPopover = !showIconSelectorPopover\"\n >\n <template #iconLeft>\n <component\n :is=\"BentoHeaderWithViewsItemIconElement[iconValue]\"\n :class=\"conditionalIconClass\"\n :svg-title=\"t('viewIcons')\"\n />\n </template>\n </bento-toggle-button>\n\n <bento-popover\n v-if=\"iconSelectorButtonRef && !props.disableCustomization\"\n :id=\"iconPopoverId\"\n ref=\"iconPopoverRef\"\n class=\"b-header-with-views-edit-form__icon-selector-popover\"\n :target-element=\"iconSelectorButtonRef\"\n :open=\"showIconSelectorPopover\"\n :fallback-position=\"['bottom-end']\"\n :fixed-positioning=\"true\"\n :overflow-visible=\"true\"\n position=\"bottom-end\"\n @dismiss=\"showIconSelectorPopover = false\"\n @keydown.escape.native.capture.stop.prevent=\"showIconSelectorPopover = false\"\n >\n <div class=\"b-header-with-views-edit-form__icon-panel\">\n <div class=\"b-header-with-views-edit-form__icon-color-options\">\n <div\n v-for=\"(color, index) in iconColorOptions\"\n :key=\"index\"\n class=\"b-header-with-views-edit-form__icon-options-wrapper\"\n >\n <bento-button\n class=\"b-header-with-views-edit-form__icon-color-options-button\"\n :class=\"`b-header-with-views-edit-form__icon-color--${color}`\"\n :aria-selected=\"iconColorValue === color\"\n variant=\"tertiary\"\n @click=\"iconColorValue = color\"\n >\n <template #iconLeft>\n <circle-filled-icon\n :svg-title=\"t('selectIconColor', { color })\"\n ></circle-filled-icon>\n </template>\n </bento-button>\n </div>\n </div>\n\n <bento-divider />\n\n <div class=\"b-header-with-views-edit-form__icon-options\">\n <bento-button\n v-for=\"(icon, index) in iconOptions\"\n :key=\"index\"\n class=\"b-header-with-views-edit-form__icon-options-button\"\n :aria-selected=\"iconValue === icon\"\n variant=\"tertiary\"\n @click=\"iconValue = icon\"\n >\n <template #iconLeft>\n <component\n :is=\"BentoHeaderWithViewsItemIconElement[icon]\"\n :svg-title=\"t('selectIcon', { icon })\"\n />\n </template>\n </bento-button>\n </div>\n </div>\n </bento-popover>\n\n <bento-input-field\n ref=\"inputFieldRef\"\n class=\"b-header-with-views-edit-form__icon-selector-input\"\n :aria-label=\"t('viewLabel')\"\n :error-message=\"errors.label\"\n :model-value=\"labelValue\"\n @keydown.enter.prevent=\"handleKeydownEnter\"\n @update:model-value=\"handleInput\"\n @blur=\"emit('blur:label', labelValue)\"\n ></bento-input-field>\n </div>\n\n <bento-checkbox\n v-if=\"additionalFormItem\"\n :model-value=\"additionalFormItemValue\"\n class=\"b-header-with-views-edit-form__additional-config\"\n @update:model-value=\"handleAdditionalFormItemChange\"\n >\n {{ additionalFormItem.label }}\n </bento-checkbox>\n\n <bento-button-actions\n class=\"b-header-with-views-edit-form__actions\"\n :actions=\"computedActions\"\n layout=\"buttons-end\"\n />\n </form>\n</template>\n\n<script setup lang=\"ts\">\n import {\n BentoButton,\n BentoButtonActions,\n type BentoButtonActionsList,\n BentoToggleButton,\n } from '@/components/button';\n import { BentoCheckbox } from '@/components/checkbox';\n import { BentoDivider } from '@/components/divider';\n import { BentoInputField } from '@/components/input-field';\n import { BentoPopover } from '@/components/popover';\n import { useClickOutside } from '@/composables';\n import { generateUid } from '@/utils/ts/generate-uid';\n import { FieldLabel } from '@/internal';\n import { debounce } from '@/utils/ts/debounce';\n import { useI18n } from '@/utils/ts/i18n';\n import CircleFilledIcon from '@adyen/ui-assets-icons-16/vue/circle-filled';\n import { onKeyStroke } from '@vueuse/core';\n import { computed, nextTick, onMounted, ref, watch } from 'vue';\n import {\n BentoHeaderWithViewsItemIconColorEnum,\n BentoHeaderWithViewsItemIconElement,\n BentoHeaderWithViewsItemIconEnum,\n } from '../../header-with-views.internal.types';\n import { type BentoHeaderWithViewsItem } from '../../header-with-views.types';\n import {\n HeaderWithViewsEditFormContextEnum,\n type HeaderWithViewsEditFormProps,\n } from './header-with-views-edit-form.types';\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n const props = defineProps({\n additionalFormItem: { default: null },\n context: { default: HeaderWithViewsEditFormContextEnum.CREATE },\n disableCustomization: { type: Boolean, default: false },\n errors: { default: null },\n icon: { default: BentoHeaderWithViewsItemIconEnum.STACK },\n iconColor: { default: BentoHeaderWithViewsItemIconColorEnum.PRIMARY },\n label: { default: '' }\n});\n\n const emit = defineEmits([\"cancel\", \"update\", \"delete\", \"input:label\", \"blur:label\", \"keydown:enter\"]);\n\n // form inputs\n const labelValue = ref(props.label);\n const iconValue = ref(props.icon);\n const iconColorValue = ref(props.iconColor);\n const additionalFormItemValue = ref<boolean>(props.additionalFormItem?.value ?? false);\n const isFormDirty = ref(false);\n\n // refs\n const iconSelectorButtonRef = ref(null);\n const iconPopoverRef = ref(null);\n const inputFieldRef = ref(null);\n\n const iconPopoverId = generateUid('iconPopover');\n\n // view controls\n const showIconSelectorPopover = ref(false);\n\n const iconOptions = computed(() => Object.values(BentoHeaderWithViewsItemIconEnum));\n const iconColorOptions = computed(() => Object.values(BentoHeaderWithViewsItemIconColorEnum));\n const hasErrors = computed(() => Object.values(props.errors).some(error => error.length > 0));\n const computedAlert = computed(\n () => `${t('selected')}: ${iconValue.value} ${t('icon')}, ${t('color')} ${iconColorValue.value}`\n );\n\n const computedActions = computed<BentoButtonActionsList>(() => [\n ...(props.context === HeaderWithViewsEditFormContextEnum.EDIT\n ? // edit mode\n [\n {\n title: t('save'),\n type: 'submit',\n event: () => {\n if (hasErrors.value) {\n return;\n }\n\n updateView();\n },\n },\n ]\n : // create mode\n [\n {\n title: t('create'),\n type: 'submit',\n event: () => {\n if (!isFormDirty.value \|\| hasErrors.value) {\n return;\n }\n\n updateView();\n },\n },\n ]),\n {\n title: t('cancel'),\n event: resetView,\n },\n ]);\n\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n const computedFormValues = computed(() => ({\n iconColor: iconColorValue.value,\n icon: iconValue.value,\n label: labelValue.value,\n ...(props.additionalFormItem\n ? {\n additionalViewSetting: {\n label: props.additionalFormItem.label,\n value: additionalFormItemValue.value,\n },\n }\n : []),\n }));\n\n const conditionalIconClass = computed(() =>\n props.disableCustomization ? '' : `b-header-with-views-edit-form__icon-color--${iconColorValue.value}`\n );\n\n const hideIconSelectorPopover = () => {\n showIconSelectorPopover.value = false;\n };\n\n const updateView = () => {\n emit('update', computedFormValues.value);\n };\n\n const resetView = () => {\n iconValue.value = props.icon;\n iconColorValue.value = props.iconColor;\n labelValue.value = props.label;\n\n emit('cancel');\n };\n\n const handleInput = debounce((value: string) => {\n labelValue.value = value;\n\n isFormDirty.value = true;\n }, 200);\n\n const handleKeydownEnter = (event: KeyboardEvent) => {\n labelValue.value = (event.target as HTMLInputElement).value;\n isFormDirty.value = true;\n\n emit('keydown:enter', computedFormValues.value);\n };\n\n const handleAdditionalFormItemChange = (value: boolean) => {\n additionalFormItemValue.value = value;\n\n isFormDirty.value = true;\n };\n\n useClickOutside(iconPopoverRef, hideIconSelectorPopover, {\n ignore: [iconSelectorButtonRef],\n });\n\n onKeyStroke('Escape', hideIconSelectorPopover, {\n target: iconPopoverRef,\n eventName: 'keydown',\n });\n\n watch(labelValue, value => emit('input:label', value));\n\n onMounted(async () => {\n // force focus to start from the input field\n await nextTick();\n inputFieldRef.value.$refs.inputFieldElement.focus();\n });\n</script>\n\n<script lang=\"ts\">\n /\n Internal component to which presents a form for handling the logic of editing and creating a view.\n /\n export default {\n i18n: { messages },\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./header-with-views-edit-form.scss\" />\n","<template>\n <div ref=\"hostRef\" class=\"b-header-with-views\">\n <div class=\"b-header-with-views__container\" :class=\"conditionalContainerClass\">\n <div class=\"b-header-with-views__title\">\n <bento-typography el=\"h2\" variant=\"title\">{{ title }}</bento-typography>\n\n <info-icon-with-popover\n v-if=\"infoIconTooltipText \|\| hasSlot('infoIconTooltipContent')\"\n :popover-text=\"infoIconTooltipText\"\n class=\"b-header-with-views__title-icon\"\n >\n <template v-if=\"hasSlot('infoIconTooltipContent')\" #default>\n <slot name=\"infoIconTooltipContent\" />\n </template>\n </info-icon-with-popover>\n </div>\n\n <fieldset ref=\"viewsRef\" class=\"b-header-with-views__bar\" :aria-label=\"t('viewListLabel')\">\n <div\n v-for=\"(view, index) in computedViews\"\n :key=\"index\"\n ref=\"viewRefs\"\n class=\"b-header-with-views__bar-tab\"\n :class=\"isViewActive(index) ? 'b-header-with-views__bar-tab--active' : null\"\n >\n <bento-button\n class=\"b-header-with-views__bar-tab-button\"\n variant=\"tertiary-with-background\"\n :aria-current=\"currentActiveView === index ? 'true' : 'false'\"\n @click=\"handleViewSelect(index)\"\n @keydown.enter.native=\"handleViewSelect(index)\"\n @keydown.space.native=\"handleViewSelect(index)\"\n >\n <template #iconLeft>\n <span\n class=\"b-header-with-views__bar-tab-button-icon\"\n :class=\"`b-header-with-views__bar-tab-button-icon--${view.iconColor}`\"\n aria-hidden=\"true\"\n >\n <component :is=\"BentoHeaderWithViewsItemIconElement[view.icon]\" />\n </span>\n </template>\n\n <bento-typography\n el=\"span\"\n variant=\"body\"\n stronger\n class=\"b-header-with-views__bar-tab-button-text\"\n >\n {{ view.label }}\n </bento-typography>\n\n <template v-if=\"isViewUnsaved(index)\" #iconRight>\n <span class=\"b-header-with-views__bar-tab-button--unsaved\">\n <dot-icon :svg-title=\"t('withUnsavedChanges')\" />\n </span>\n </template>\n </bento-button>\n\n <bento-menu\n v-if=\"currentActiveView === index\"\n ref=\"editViewMenuRefs\"\n class=\"b-header-with-views__bar-tab-menu\"\n :button=\"{ variant: 'tertiary', 'aria-label': t('openViewOptions', { label: view.label }) }\"\n :data=\"getViewMenuData(index)\"\n :close-on-click-outside-options=\"{\n ignore: [`#${editViewPopoverId}`],\n }\"\n :menu-fixed-positioning=\"true\"\n @open=\"showViewMenuPopover(index)\"\n @close=\"hideViewMenuPopover()\"\n @keydown.tab.native.capture=\"handleTabEditViewPopover\"\n >\n <template #iconLeft>\n <options-horizontal-icon :aria-hidden=\"true\" />\n </template>\n </bento-menu>\n </div>\n\n <div ref=\"viewControlRef\" class=\"b-header-with-views__bar-control\">\n <!-- All views -->\n <header-with-views-all-views\n v-if=\"computedViews.length\"\n ref=\"viewControlAllViewsRef\"\n :menu-items=\"computedViews\"\n :menu-items-actions=\"getViewMenuData(activeViewMenuPopover)\"\n :menu-close-on-click-outside-options=\"{ ignore: [`#${editViewPopoverId}`] }\"\n @close:view-menu=\"hideViewMenuPopover()\"\n @close:all-views=\"showAllViewsPopover = false\"\n @open:all-views=\"showAllViewsPopover = true\"\n @open:view-menu=\"index => showViewMenuPopover(index)\"\n @reorder:view=\"views => handleReorder(views)\"\n @select:view=\"index => handleViewSelect(index)\"\n />\n\n <bento-toggle-button\n ref=\"createViewButtonRef\"\n :aria-expanded=\"showCreateViewPopover\"\n :aria-controls=\"showCreateViewPopover ? createViewPopoverId : null\"\n :toggled=\"showCreateViewPopover\"\n variant=\"tertiary\"\n @click=\"showCreateViewPopover = !showCreateViewPopover\"\n >\n <template #iconLeft>\n <plus-icon :svg-title=\"t('createView')\" :aria-hidden=\"computedViews.length === 0\" />\n </template>\n\n <template v-if=\"computedViews.length === 0\" #default>{{ t('createView') }}</template>\n </bento-toggle-button>\n </div>\n </fieldset>\n\n <title-details\n v-if=\"hasMetaSection\"\n class=\"b-header-with-views__meta-container\"\n :description=\"description\"\n :last-updated=\"lastUpdated\"\n :reload-button=\"reloadButton\"\n >\n <template v-if=\"hasSlot('description')\" #description><slot name=\"description\" /></template>\n </title-details>\n\n <button-actions-with-menu\n v-if=\"actions\"\n :actions=\"actions\"\n :actions-layout=\"isCompact ? 'buttons-start' : 'buttons-end'\"\n :displayed-actions=\"2\"\n :disable-responsive-behavior=\"true\"\n :hide-displayed-actions-breakpoint=\"STACKED_LAYOUT_BREAKPOINT\"\n class=\"b-header-with-views__actions\"\n />\n </div>\n\n <!-- Create view -->\n <bento-popover\n v-if=\"activeViewMenuPopover === null && createViewButtonRef\"\n :id=\"createViewPopoverId\"\n ref=\"createViewPopoverRef\"\n :dismissible=\"true\"\n :fixed-positioning=\"true\"\n :target-element=\"createViewButtonRef\"\n :title=\"t('createView')\"\n :open=\"showCreateViewPopover\"\n :overflow-visible=\"true\"\n position=\"bottom-start\"\n @dismiss=\"hideCreateViewPopover\"\n @keydown.esc.native.capture.stop.prevent=\"hideCreateViewPopover\"\n >\n <header-with-views-edit-form\n context=\"create\"\n :errors=\"errors\"\n :additional-form-item=\"additionalViewSetting\"\n :disable-customization=\"disableCustomization\"\n @blur:label=\"value => validateLabel(value, activeViewMenuPopover)\"\n @input:label=\"value => validateLabel(value, activeViewMenuPopover)\"\n @keydown:enter=\"handleKeydownEnterViewItem\"\n @update=\"handleCreateViewItem\"\n @cancel=\"hideCreateViewPopover\"\n >\n </header-with-views-edit-form>\n </bento-popover>\n\n <!-- Edit view -->\n <bento-popover\n v-if=\"activeViewMenuPopover !== null && editViewTargetElementRef\"\n :id=\"editViewPopoverId\"\n ref=\"editViewPopoverRef\"\n :disable-focus-trap=\"false\"\n :dismissible=\"true\"\n :fixed-positioning=\"true\"\n :target-element=\"editViewTargetElementRef\"\n :title=\"t('editDetails')\"\n :open=\"activeEditViewPopover !== null\"\n :overflow-visible=\"true\"\n position=\"right-start\"\n @dismiss=\"setActiveEditViewPopover()\"\n @keydown.esc.native.capture.stop.prevent=\"setActiveEditViewPopover()\"\n >\n <header-with-views-edit-form\n v-if=\"computedViews[activeEditViewPopover]\"\n context=\"edit\"\n :additional-form-item=\"computedViews[activeEditViewPopover].additionalViewSetting\"\n :errors=\"errors\"\n :icon=\"computedViews[activeEditViewPopover].icon\"\n :icon-color=\"computedViews[activeEditViewPopover].iconColor\"\n :label=\"computedViews[activeEditViewPopover].label\"\n :disable-customization=\"disableCustomization\"\n @blur:label=\"value => validateLabel(value, activeViewMenuPopover)\"\n @input:label=\"value => validateLabel(value, activeViewMenuPopover)\"\n @keydown:enter=\"handleKeydownEnterViewItem\"\n @update=\"handleUpdateViewItem\"\n @cancel=\"hideEditViewPopover\"\n >\n </header-with-views-edit-form>\n </bento-popover>\n\n <!-- Unsaved views prompt -->\n <bento-modal\n :actions=\"computedUnsavedViewModalActions\"\n :is-dismissible=\"false\"\n :is-open=\"showUnsavedModalWarning\"\n @close-modal=\"showUnsavedModalWarning = false\"\n >\n <template #default>{{ t('leaveView') }}</template>\n <template #content>\n <div class=\"b-header-with-views__modal-description\">\n <bento-typography>\n <component :is=\"i18nComponent\" v-bind=\"getI18nProps('leaveViewDescription')\" tag=\"span\">\n <template #label>\n <bento-typography strongest el=\"span\">{{\n computedViews[currentActiveView]?.label\n }}</bento-typography>\n </template>\n </component>\n </bento-typography>\n\n <bento-checkbox\n v-if=\"skipUnsavedChangesText\"\n :model-value=\"skipUnsavedChangesReminder\"\n @update:model-value=\"value => (skipUnsavedChangesReminder = value)\"\n >\n {{ skipUnsavedChangesText }}\n </bento-checkbox>\n </div>\n </template>\n </bento-modal>\n\n <!-- Delete views prompt -->\n <bento-modal\n :actions=\"computedDeleteViewModalActions\"\n :is-open=\"showDeleteModalWarning\"\n :is-dismissible=\"false\"\n destructive-actions\n @click.native.capture=\"handleClickModal\"\n @close-modal=\"showDeleteModalWarning = false\"\n >\n <template #default>\n {{ t('deleteView') }}\n </template>\n <template #content>\n <div class=\"b-header-with-views__modal-description\">\n <bento-typography>\n <component :is=\"i18nComponent\" v-bind=\"getI18nProps('deleteViewDescription')\" tag=\"span\">\n <template #label>\n <bento-typography strongest el=\"span\">{{\n computedViewToBeDeletedLabel\n }}</bento-typography>\n </template>\n </component>\n </bento-typography>\n </div>\n </template>\n </bento-modal>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { BentoButton, BentoToggleButton } from '@/components/button';\n import { BentoCheckbox } from '@/components/checkbox';\n import { BentoMenu, type BentoMenuItem } from '@/components/menu';\n import BentoModal from '@/components/modal/modal.vue';\n import { BentoPopover } from '@/components/popover';\n import { BentoTypography } from '@/components/typography';\n import { TitleDetails } from '@/internal';\n import { useBentoToastController, useClickOutside, useHasSlot } from '@/composables';\n import { generateUid } from '@/utils/ts/generate-uid';\n import ButtonActionsWithMenu from '@/internal/button-actions-with-menu/button-actions-with-menu.vue';\n import { InfoIconWithPopover } from '@/internal/info-icon-with-popover';\n import { getI18nComponent, getI18nProps, useI18n } from '@/utils/ts/i18n';\n import BinIcon from '@adyen/ui-assets-icons-16/vue/bin';\n import DotIcon from '@adyen/ui-assets-icons-16/vue/dot';\n import DownloadIcon from '@adyen/ui-assets-icons-16/vue/download';\n import EditIcon from '@adyen/ui-assets-icons-16/vue/edit-2';\n import HeartIcon from '@adyen/ui-assets-icons-16/vue/heart';\n import OptionsHorizontalIcon from '@adyen/ui-assets-icons-16/vue/options-horizontal';\n import PlusIcon from '@adyen/ui-assets-icons-16/vue/plus';\n import PlusMultipleIcon from '@adyen/ui-assets-icons-16/vue/plus-multiple';\n import RefreshIcon from '@adyen/ui-assets-icons-16/vue/refresh';\n import { useElementSize } from '@vueuse/core';\n import { computed, nextTick, onMounted, ref, useSlots, watch } from 'vue';\n import { HeaderWithViewsAllViews, HeaderWithViewsEditForm } from './components';\n import { useEditViews, useResponsiveViews } from './composables';\n import {\n type BentoHeaderWithViewsEmits,\n BentoHeaderWithViewsItemIconElement,\n } from './header-with-views.internal.types';\n import { type BentoHeaderWithViewsItem, type BentoHeaderWithViewsProps } from './header-with-views.types';\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n const props = defineProps({\n actions: { default: () => [] },\n title: { default: null },\n views: { default: () => [] },\n additionalViewSetting: { default: null },\n hasChanges: { type: Boolean },\n skipUnsavedChangesText: null,\n disableCustomization: { type: Boolean, default: false },\n infoIconTooltipText: { default: null },\n description: { default: null },\n lastUpdated: { default: null },\n reloadButton: { default: null },\n disableAutoSelect: { type: Boolean, default: false },\n activeViewIndex: { default: undefined }\n});\n\n const emit = defineEmits([\"add:view\", \"delete:view\", \"duplicate:view\", \"reorder:view\", \"restore:view\", \"save:view\", \"select:view\", \"update:view\", \"update:skip-unsaved-changes\", \"update:active-view-index\"]);\n\n const STACKED_LAYOUT_BREAKPOINT = 573;\n\n const i18nComponent = getI18nComponent();\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n const slots = useSlots();\n const hasSlot = useHasSlot(slots);\n\n // refs\n const createViewButtonRef = ref(null);\n const createViewPopoverRef = ref(null);\n const editViewPopoverRef = ref(null);\n const editViewMenuRefs = ref([]);\n const editViewTargetElementRef = ref(null); // used as a mount for the edit form popover\n const hostRef = ref(null);\n const viewsRef = ref<HTMLElement>(null); // container for all views\n const viewRefs = ref<Array<HTMLDivElement>>([]); // individual view\n const viewControlRef = ref(null); // all views menu and create view button container\n const viewControlAllViewsRef = ref(null); // all views menu\n\n // controls\n const showCreateViewPopover = ref<boolean>(false); // control the create view popover\n const showAllViewsPopover = ref<boolean>(false); // control when menu button is shown\n const showUnsavedModalWarning = ref<boolean>(false);\n const showDeleteModalWarning = ref<boolean>(false);\n const activeEditViewPopover = ref<number>(null); // control the edit view popover\n const activeViewMenuPopover = ref<number>(null); // control when menu items are shown\n const internalActiveView = ref<number>(null); // control which view the user is currently on\n const nextActiveView = ref<number>(null); // control which view is does the user want to navigate to, used for caching unsaved view navigation\n const viewToBeDeleted = ref<number>(null); // cache which view is marked for deletion\n\n // Computed property to handle two-way binding for activeViewIndex\n const currentActiveView = computed({\n get: () => internalActiveView.value,\n set: (value: number \| null) => {\n internalActiveView.value = value;\n emit('update:active-view-index', value);\n },\n });\n\n // models\n const skipUnsavedChangesReminder = ref<boolean>(false);\n\n const createViewPopoverId = generateUid('createViewPopover');\n const editViewPopoverId = generateUid('editViewPopover');\n\n useResponsiveViews({\n container: viewsRef,\n children: viewRefs,\n offset: viewControlRef,\n activeViewIndex: currentActiveView,\n });\n\n const { computedViews, clearError, duplicateView, errors, setViews, updateView, validateLabel } = useEditViews({\n additionalViewSetting: props.additionalViewSetting,\n views: props.views,\n });\n\n const hideCreateViewPopover = async (updateFocus = true) => {\n showCreateViewPopover.value = false;\n\n if (updateFocus) {\n await nextTick();\n\n createViewButtonRef.value.$el.focus();\n }\n\n clearError();\n };\n\n const hideEditViewPopover = () => {\n const currentMenuRef = showAllViewsPopover.value\n ? viewControlAllViewsRef.value.$refs.editViewMenuRefs[activeEditViewPopover.value]\n : editViewMenuRefs.value[0];\n\n currentMenuRef?.closeMenu();\n };\n\n useClickOutside(createViewPopoverRef, () => hideCreateViewPopover(false), {\n ignore: [createViewButtonRef],\n });\n\n useClickOutside(editViewPopoverRef, () => setActiveEditViewPopover(), {\n ignore: [editViewTargetElementRef],\n });\n\n const { width: hostWidth } = useElementSize(hostRef);\n\n const { addToast } = useBentoToastController();\n\n const computedUnsavedViewModalActions = computed(() => [\n {\n title: t('leave'),\n event: handleRestoreChanges,\n },\n {\n title: t('saveChanges'),\n event: handleSaveChanges,\n },\n ]);\n\n const computedDeleteViewModalActions = computed(() => [\n {\n title: t('delete'),\n event: async () => {\n showDeleteModalWarning.value = false;\n\n const updatedViewObj = updateView(null, viewToBeDeleted.value);\n\n emit('delete:view', updatedViewObj);\n\n hideViewMenuPopover();\n\n // if a view that is placed higher in the order is deleted, ignore\n if (currentActiveView.value < viewToBeDeleted.value) {\n return;\n }\n\n // if a view that is placed lower in the order is deleted,\n // we need to shift the index to maintain the current view\n if (currentActiveView.value > viewToBeDeleted.value) {\n currentActiveView.value -= 1;\n } else if (currentActiveView.value === viewToBeDeleted.value) {\n if (updatedViewObj.newViews.length === 0) {\n // there are no more views\n\n currentActiveView.value = null;\n } else if (currentActiveView.value >= updatedViewObj.newViews.length) {\n // shift it to the left\n\n currentActiveView.value -= 1;\n }\n // else, keep it at the same index\n }\n\n viewToBeDeleted.value = null;\n },\n },\n {\n title: t('cancel'),\n event: () => {\n showDeleteModalWarning.value = false;\n },\n },\n ]);\n\n const computedViewToBeDeletedLabel = computed(() => computedViews.value[viewToBeDeleted.value]?.label);\n const hasMetaSection = computed(() => props.description \|\| hasSlot('description') \|\| props.lastUpdated);\n const isCompact = computed(() => hostWidth.value <= STACKED_LAYOUT_BREAKPOINT);\n\n const conditionalContainerClass = computed(() => ({\n 'b-header-with-views__container--is-compact': isCompact.value,\n 'b-header-with-views__container--has-meta': hasMetaSection.value,\n }));\n\n watch([currentActiveView, computedViews], ([newIndex, newViews], [oldIndex, oldViews]) => {\n // skip if the labels are the same or no active view\n const isViewUpdated = newIndex === oldIndex && newViews.length === oldViews.length;\n const isViewDeletedWithChangedIndex = newViews[newIndex]?.label === oldViews[oldIndex]?.label;\n\n if (isViewUpdated \|\| isViewDeletedWithChangedIndex) {\n return;\n }\n\n // allow empty label\n // occurs when the user removes all views\n emit('select:view', newViews[newIndex]?.label ?? null);\n });\n\n // whenever the view menu popover changes, we reset the edit popover because it is never opened by default\n watch(activeViewMenuPopover, () => {\n setActiveEditViewPopover();\n });\n\n watch(showAllViewsPopover, value => {\n if (value) {\n return;\n }\n\n // if show all view popover is closed, close children as well\n hideViewMenuPopover();\n });\n\n // set the popover to open next to the edit button\n watch(activeEditViewPopover, value => {\n const editButtonIndex = isViewUnsaved(value) ? 2 : 0;\n\n // EDGE CASE:\n // Since edit button can be clicked while in all views popover or while it is in the bar,\n // we will not support the case where edit popover is opened and the screen is resize until the view menu is hidden.\n // Edit popover will still be displayed but the position does not have to follow the edit button as it is hidden.\n if (showAllViewsPopover.value) {\n const menuListItemRef =\n viewControlAllViewsRef.value.$refs.editViewMenuRefs[activeViewMenuPopover.value]?.$refs\n ?.menuItemListRef;\n\n editViewTargetElementRef.value =\n viewControlAllViewsRef.value.$refs.editViewMenuRefs[activeViewMenuPopover.value]?.$refs?.menuItemListRef\n ?.$refs?.menuItemRef?.[editButtonIndex] ?? null;\n\n if (!value) {\n menuListItemRef?.focusItem();\n\n clearError();\n }\n\n return;\n }\n\n const menuListItemRef = editViewMenuRefs.value.find(ref => ref.$refs.menuItemListRef)?.$refs?.menuItemListRef;\n editViewTargetElementRef.value = menuListItemRef?.$refs?.menuItemRef?.[editButtonIndex] ?? null;\n\n if (!value) {\n menuListItemRef?.focusItem();\n\n clearError();\n }\n });\n\n // Watch for external changes to the activeViewIndex prop\n watch(\n () => props.activeViewIndex,\n newValue => {\n if (newValue !== undefined && newValue >= 0 && newValue < computedViews.value.length) {\n currentActiveView.value = newValue;\n }\n }\n );\n\n onMounted(() => {\n if (\n props.activeViewIndex !== undefined &&\n props.activeViewIndex >= 0 &&\n props.activeViewIndex < computedViews.value.length\n ) {\n currentActiveView.value = props.activeViewIndex;\n } else if (!props.disableAutoSelect) {\n const defaultView = computedViews.value.findIndex(view => view.isDefault);\n currentActiveView.value = defaultView >= 0 ? defaultView : 0;\n }\n });\n\n const getViewMenuData = (index: number): Array<BentoMenuItem> => [\n ...(isViewUnsaved(index)\n ? [\n {\n text: t('saveChanges'),\n handler: handleSaveChanges,\n icon: DownloadIcon,\n },\n {\n addDivider: true,\n text: t('restoreChanges'),\n handler: handleRestoreChanges,\n icon: RefreshIcon,\n },\n ]\n : []),\n ...(!computedViews.value[index]?.isFixed\n ? [\n {\n text: t('edit'),\n handler: () => {\n setActiveEditViewPopover(activeViewMenuPopover.value);\n },\n icon: EditIcon,\n skipClose: true,\n },\n ]\n : []),\n {\n text: t('setAsDefault'),\n handler: () => {\n const updatedViewObj = updateView({ isDefault: true }, activeViewMenuPopover.value);\n\n emit('update:view', updatedViewObj);\n\n addToast({\n text: t('setAsDefaultToast', { label: updatedViewObj.targetViewLabel }),\n });\n\n hideViewMenuPopover();\n },\n icon: HeartIcon,\n },\n {\n text: t('duplicate'),\n handler: () => {\n const updatedViewObj = duplicateView(activeViewMenuPopover.value);\n\n emit('duplicate:view', updatedViewObj);\n\n hideViewMenuPopover();\n\n // switch to newly duplicated view\n handleViewSelect(updatedViewObj.newViews.length - 1);\n },\n icon: PlusMultipleIcon,\n },\n ...(!computedViews.value[index]?.isFixed\n ? [\n {\n text: t('delete'),\n handler: () => {\n viewToBeDeleted.value = activeViewMenuPopover.value;\n showDeleteModalWarning.value = true;\n },\n critical: true,\n icon: BinIcon,\n },\n ]\n : []),\n ];\n\n const showViewMenuPopover = (index: number) => {\n activeViewMenuPopover.value = index;\n };\n\n const hideViewMenuPopover = () => {\n activeViewMenuPopover.value = null;\n\n setActiveEditViewPopover();\n };\n\n const setActiveEditViewPopover = (index?: number) => {\n if (index === activeEditViewPopover.value) {\n activeEditViewPopover.value = null;\n } else {\n activeEditViewPopover.value = index ?? null;\n }\n };\n\n const handleCreateViewItem = (value: BentoHeaderWithViewsItem) => {\n const updatedViewObj = updateView(value);\n\n emit('add:view', updatedViewObj);\n\n hideCreateViewPopover();\n\n // switch to new view on add\n handleViewSelect(updatedViewObj.newViews.findIndex(view => updatedViewObj.targetViewLabel === view.label));\n\n addToast({\n text: t('createViewToast', { label: updatedViewObj.targetViewLabel }),\n });\n };\n\n const handleUpdateViewItem = (value: BentoHeaderWithViewsItem) => {\n emit('update:view', updateView(value, activeEditViewPopover.value));\n\n hideEditViewPopover();\n };\n\n const handleKeydownEnterViewItem = (value: BentoHeaderWithViewsItem) => {\n validateLabel(value.label, activeViewMenuPopover.value);\n\n if (Object.values(errors).some(error => error.length > 0)) {\n return;\n }\n\n if (activeEditViewPopover.value) {\n handleUpdateViewItem(value);\n\n return;\n }\n\n handleCreateViewItem(value);\n };\n\n const handleViewSelect = (index: number) => {\n // If there's no currently active view, or if there are no unsaved changes,\n // just switch to the new view.\n if (currentActiveView.value === null \|\| !props.hasChanges \|\| props.skipUnsavedChangesText === null) {\n // If switching from an existing view, emit restore event.\n if (currentActiveView.value !== null) {\n emit('restore:view', computedViews.value[currentActiveView.value].label);\n }\n currentActiveView.value = index;\n return;\n }\n\n nextActiveView.value = index;\n showUnsavedModalWarning.value = true;\n };\n\n const handleReorder = (reorderedViews: Array<BentoHeaderWithViewsItem>) => {\n const currentActiveLabel =\n currentActiveView.value !== null ? computedViews.value[currentActiveView.value]?.label : null;\n\n const result = setViews(reorderedViews);\n\n if (currentActiveLabel) {\n const newIndex = result.newViews.findIndex(view => view.label === currentActiveLabel);\n\n if (newIndex !== -1) {\n currentActiveView.value = newIndex;\n }\n }\n\n emit('reorder:view', result);\n };\n\n const handleClickModal = (event: MouseEvent) => {\n if ((event.target as HTMLElement).closest('button')) {\n return;\n }\n\n event.stopPropagation();\n event.preventDefault();\n };\n\n const handleTabEditViewPopover = () => {\n // skip built-in refocus on the menu button when menu is closed\n // enables tab to flow as intended by HTML spec\n editViewMenuRefs.value[0].closeMenu(false);\n };\n\n const handleSaveChanges = () => {\n const label = computedViews.value[currentActiveView.value].label;\n\n emit('save:view', label);\n\n if (showUnsavedModalWarning.value) {\n emit('update:skip-unsaved-changes', skipUnsavedChangesReminder.value);\n\n // fired when user saves the view while navigating to a different tab\n currentActiveView.value = nextActiveView.value;\n nextActiveView.value = null;\n showUnsavedModalWarning.value = false;\n } else {\n // fired when user saves the view via the menu\n hideViewMenuPopover();\n }\n\n addToast({\n text: t('saveChangesToast', { label }),\n action: {\n handler: () => emit('restore:view', label),\n text: t('undo'),\n },\n });\n };\n\n const handleRestoreChanges = () => {\n emit('restore:view', computedViews.value[currentActiveView.value].label);\n\n if (showUnsavedModalWarning.value) {\n emit('update:skip-unsaved-changes', skipUnsavedChangesReminder.value);\n\n // fired when user restore the view while navigating to a different tab\n currentActiveView.value = nextActiveView.value;\n nextActiveView.value = null;\n showUnsavedModalWarning.value = false;\n } else {\n // fired when user restore the view via the menu\n hideViewMenuPopover();\n }\n };\n\n const isViewActive = (index: number) => currentActiveView.value === index;\n const isViewUnsaved = (index: number) => isViewActive(index) && props.hasChanges;\n</script>\n\n<script lang=\"ts\">\n /\n Header with views allow users to save and quickly retrieve configurations tailored to specific tasks.\n * For example, managing daily transactions, auditing, or analyzing specific data sets.\n * It also allows the user to define the columns, filters, and search queries they need.\n \n @example\n * import { BentoHeaderWithViews } from '@adyen/bento-vue2';\n \n export default {\n * components: { BentoHeaderWithViews },\n * template: `\n * <bento-header-with-views\n * :actions=\"[\n * { title: 'Primary action', event: () => undefined },\n * { title: 'Secondary action', event: () => undefined },\n * { title: 'Tertiary action', event: () => undefined },\n * { title: 'Another action', event: () => undefined }\n * ]\"\n * description=\"Page Description\"\n * title=\"Page Title\"\n * :views=\"[\n * { icon: 'stack', iconColor: 'blue', label: 'A very long value' },\n * { icon: 'stack', iconColor: 'primary', label: 'Title 1' },\n * { icon: 'stack', iconColor: 'primary', label: 'Title 2' }\n * ]\"\n * :additionalViewSetting=\"{\n * label: 'Include date filter (relative)',\n * value: false\n * }\"\n * hasChanges\n * />\n * `\n * };\n */\n export default {\n i18n: { messages },\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./header-with-views.scss\" />\n"],"names":["instance","getCurrentInstance","uuid","BentoHeaderWithViewsItemIconColorEnum","BentoHeaderWithViewsItemIconColorEnum2","BentoHeaderWithViewsItemIconEnum","BentoHeaderWithViewsItemIconEnum2","BentoHeaderWithViewsItemIconElement","StackIcon","LeafIcon","HandRockIcon","CarIcon","EducationIcon","HotelIcon","TravelBagIcon","LightningIcon","NewsIcon","PrizeIcon","LockIcon","BagIcon","DiamondIcon","TargetIcon","GiftIcon","CashStackIcon","HashtagIcon","CloudIcon","HospitalityIcon","ShoppingCartIcon","SleepIcon","NotificationIcon","ThumbsUpIcon","ThumbsDownIcon","StarIcon","WarningDiamondIcon","RetailIcon","EmoticonHappyIcon","GamingIcon","SupportIcon","HeartIcon","HourglassIcon","WorldIcon","useEditViews","options","views","ref","errors","reactive","t","useI18n","computedViews","computed","viewItem","updateView","data","index","newViews","oldViews","targetViewLabel","view","duplicateView","toCopyLabel","copiedLabel","suffix","newView","setViews","clearError","value","labelIsRequired","labelAlreadyExist","viewIndex","UseDragAndDropViewsDirectionEnum","UseDragAndDropViewsDirectionEnum2","useDragAndDropViews","itemRefs","items","onDrop","animationFrameId","draggedViewIndex","dragMousePosition","dragKeyboardInitiated","dragOffset","draggingOverViewIndex","maxDragOffsetY","minDragOffsetY","menuItemsElementRects","isItemDragged","handleDragStart","event","updateMenuItemsRects","draggedElement","handleDragKeyboardToggle","handleDrop","handleDragKeyboardMove","direction","upperBound","lowerBound","isGoingDownwards","isGoingUpwards","targetElementIndex","isTargetAfterDragged","isTargetBeforeDragged","isDirectionReversed","updateDraggedElementTransform","offset","clampTransform","updateTargetElementTransform","targetElement","targetElementOffset","handleDragStop","menuItem","el","handleDragMove","mousePosition","overItemIndex","rect","updateDragPosition","draggedItem","newMenuItems","transferFocus","threshold","i","targetElementRect","percentFromTop","itemEl","top","bottom","height","useEventListener","useResponsiveViews","elements","container","children","activeViewIndex","maxDisplayedViews","width","useElementSize","watch","containerWidth","newActiveViewIndex","childrenEl","oldActiveViewIndex","numberOfChildren","totalWidth","previousActiveChild","index2","child","nextTick","activeChild","newMaxDisplayedViews","__default__$2","messages$1","showMenu","allViewsMenuToggleRef","allViewsMenuPopoverRef","allViewsRef","menuRef","menuItemRefs","editViewMenuRefs","menuPopoverId","generateUid","useClickOutside","closeMenu","props","openMenu","emit","toggleShowMenu","e","toRef","HeaderWithViewsEditFormContextEnum","HeaderWithViewsEditFormContextEnum2","__default__$1","messages","labelValue","iconValue","iconColorValue","additionalFormItemValue","isFormDirty","iconSelectorButtonRef","iconPopoverRef","inputFieldRef","iconPopoverId","showIconSelectorPopover","iconOptions","iconColorOptions","hasErrors","error","computedAlert","computedActions","resetView","computedFormValues","conditionalIconClass","hideIconSelectorPopover","handleInput","debounce","handleKeydownEnter","handleAdditionalFormItemChange","onKeyStroke","onMounted","__default__","messages$2","STACKED_LAYOUT_BREAKPOINT","i18nComponent","getI18nComponent","slots","useSlots","hasSlot","useHasSlot","createViewButtonRef","createViewPopoverRef","editViewPopoverRef","editViewTargetElementRef","hostRef","viewsRef","viewRefs","viewControlRef","viewControlAllViewsRef","showCreateViewPopover","showAllViewsPopover","showUnsavedModalWarning","showDeleteModalWarning","activeEditViewPopover","activeViewMenuPopover","internalActiveView","nextActiveView","viewToBeDeleted","currentActiveView","skipUnsavedChangesReminder","createViewPopoverId","editViewPopoverId","validateLabel","hideCreateViewPopover","updateFocus","hideEditViewPopover","setActiveEditViewPopover","hostWidth","addToast","useBentoToastController","computedUnsavedViewModalActions","handleRestoreChanges","handleSaveChanges","computedDeleteViewModalActions","updatedViewObj","hideViewMenuPopover","computedViewToBeDeletedLabel","hasMetaSection","isCompact","conditionalContainerClass","newIndex","oldIndex","isViewUpdated","isViewDeletedWithChangedIndex","editButtonIndex","isViewUnsaved","menuListItemRef2","menuListItemRef","ref2","newValue","defaultView","getViewMenuData","DownloadIcon","RefreshIcon","EditIcon","handleViewSelect","PlusMultipleIcon","BinIcon","showViewMenuPopover","handleCreateViewItem","handleUpdateViewItem","handleKeydownEnterViewItem","handleReorder","reorderedViews","currentActiveLabel","result","handleClickModal","handleTabEditViewPopover","label","isViewActive"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;;;;;;;;;ACJA,UAAAA,IAAAC,EAAA,GAIAC,IAAA,OAAAF,GAAA,OAAAA,GAAA,OAAA,IAAA;;;;;;;;;;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"}