@saooti/octopus-sdk 42.2.0 → 42.2.1

package/dist/TopBar-Tbxl2Elm.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TopBar-Tbxl2Elm.mjs","names":[],"sources":["../src/components/misc/RightsScopeSelector.vue","../src/components/misc/RightsScopeSelector.vue","../src/components/misc/RightsScopeMenu.vue","../src/components/misc/RightsScopeMenu.vue","../src/components/misc/TopBarMainContent.vue","../src/components/misc/TopBarMainContent.vue","../src/components/misc/TopBar.vue","../src/components/misc/TopBar.vue"],"sourcesContent":["<template>\n    <div\n        v-if=\"subOrganisations.length > 0\"\n        class=\"d-flex flex-column ms-4\"\n    >\n        <span class=\"label mb-1\">\n            {{ t('RightsScopeSelector - Title', { rubriquage: rubriquage?.title}) }}\n        </span>\n        <div class=\"d-flex value\">\n            <button\n                type=\"button\"\n                class=\"btn-transparent d-flex align-items-center\"\n                aria-controls=\"suborga-list-menu\"\n                :aria-expanded=\"open\"\n                @click=\"$emit('change')\"\n            >\n                <span\n                    v-if=\"selectedSubOrganisation\"\n                    class=\"me-2 selected\"\n                >\n                    {{ selectedSubOrganisation.name }}\n                </span>\n                <span v-else class=\"me-2\">\n                    {{ t('RightsScopeSelector - No filter') }}\n                </span>\n                <SwapIcon class=\"icon\" />\n            </button>\n            <button\n                v-if=\"selectedSubOrganisation\"\n                type=\"button\"\n                class=\"btn-transparent\"\n                @click=\"unselectSubOrganisation\"\n            >\n                <ClearIcon\n                    class=\"icon\"\n                    :title=\"t('RightsScopeSelector - Clear filter')\"\n                />\n            </button>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { useAuthStore } from \"../../stores/AuthStore\";\nimport { ref, toRef, watch } from \"vue\";\nimport { useSubOrganisations } from \"../composable/useSubOrganisations\";\nimport { Rubriquage } from \"@/stores/class/rubrique/rubriquage\";\nimport { rubriquesApi } from \"@/api\";\n\nimport SwapIcon from \"vue-material-design-icons/SwapHorizontalCircleOutline.vue\";\nimport ClearIcon from \"vue-material-design-icons/CloseCircleOutline.vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Composables\nconst { t } = useI18n();\nconst authStore = useAuthStore();\nconst authOrgaId = toRef(authStore, 'authOrgaId');\nconst rubriquage = ref<Rubriquage|null>(null);\nconst {\n    selectedSubOrganisation,\n    subOrganisations,\n    unselectSubOrganisation\n} = useSubOrganisations(authOrgaId);\n\ndefineProps<{\n    /** Whether the sub organisation menu controlled by this selector is open */\n    open?: boolean;\n}>();\n\ndefineEmits<{\n    (e: 'change'): void;\n}>();\n\nwatch(authOrgaId, async () => {\n    rubriquage.value = await rubriquesApi.findRestrictiveRubriquage(authOrgaId.value);\n}, { immediate: true });\n</script>\n\n<style scoped lang=\"scss\">\n#header-scope-selector:deep(.octopus-select-field) {\n    background: transparent;\n    border-color: rgba(255, 255, 255, 0.1);\n    margin-left: 200px;\n\n    .octopus-select-value {\n        color: var(--octopus-secondary);\n        font-weight: bold;\n        align-content: center;\n    }\n\n    input {\n        color: white;\n    }\n\n    button {\n        color: rgba(255, 255, 255, 0.3);\n    }\n}\n\n.value {\n    color: var(--octopus-secondary);\n    font-weight: bold;\n    align-content: center;\n    align-items: center;\n\n    button {\n        color: inherit;\n        font-weight: inherit;\n        text-align: start;\n        padding: 0;\n    }\n\n    span:not(.selected):not(.icon) {\n        opacity: .5;\n        transition: opacity .5s;\n\n        &:hover {\n            opacity: .7;\n        }\n    }\n}\n\n.label {\n    color: rgba(255, 255, 255, 0.3);\n    font-weight: 600;\n    font-style: italic;\n    font-size: 14px;\n    white-space: nowrap;\n    overflow-y: visible;\n}\n\n.icon {\n    opacity: .7;\n    transition: opacity .5s;\n\n    &:hover {\n        opacity: 1;\n    }\n}\n</style>\n","<template>\n    <div\n        v-if=\"subOrganisations.length > 0\"\n        class=\"d-flex flex-column ms-4\"\n    >\n        <span class=\"label mb-1\">\n            {{ t('RightsScopeSelector - Title', { rubriquage: rubriquage?.title}) }}\n        </span>\n        <div class=\"d-flex value\">\n            <button\n                type=\"button\"\n                class=\"btn-transparent d-flex align-items-center\"\n                aria-controls=\"suborga-list-menu\"\n                :aria-expanded=\"open\"\n                @click=\"$emit('change')\"\n            >\n                <span\n                    v-if=\"selectedSubOrganisation\"\n                    class=\"me-2 selected\"\n                >\n                    {{ selectedSubOrganisation.name }}\n                </span>\n                <span v-else class=\"me-2\">\n                    {{ t('RightsScopeSelector - No filter') }}\n                </span>\n                <SwapIcon class=\"icon\" />\n            </button>\n            <button\n                v-if=\"selectedSubOrganisation\"\n                type=\"button\"\n                class=\"btn-transparent\"\n                @click=\"unselectSubOrganisation\"\n            >\n                <ClearIcon\n                    class=\"icon\"\n                    :title=\"t('RightsScopeSelector - Clear filter')\"\n                />\n            </button>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { useAuthStore } from \"../../stores/AuthStore\";\nimport { ref, toRef, watch } from \"vue\";\nimport { useSubOrganisations } from \"../composable/useSubOrganisations\";\nimport { Rubriquage } from \"@/stores/class/rubrique/rubriquage\";\nimport { rubriquesApi } from \"@/api\";\n\nimport SwapIcon from \"vue-material-design-icons/SwapHorizontalCircleOutline.vue\";\nimport ClearIcon from \"vue-material-design-icons/CloseCircleOutline.vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Composables\nconst { t } = useI18n();\nconst authStore = useAuthStore();\nconst authOrgaId = toRef(authStore, 'authOrgaId');\nconst rubriquage = ref<Rubriquage|null>(null);\nconst {\n    selectedSubOrganisation,\n    subOrganisations,\n    unselectSubOrganisation\n} = useSubOrganisations(authOrgaId);\n\ndefineProps<{\n    /** Whether the sub organisation menu controlled by this selector is open */\n    open?: boolean;\n}>();\n\ndefineEmits<{\n    (e: 'change'): void;\n}>();\n\nwatch(authOrgaId, async () => {\n    rubriquage.value = await rubriquesApi.findRestrictiveRubriquage(authOrgaId.value);\n}, { immediate: true });\n</script>\n\n<style scoped lang=\"scss\">\n#header-scope-selector:deep(.octopus-select-field) {\n    background: transparent;\n    border-color: rgba(255, 255, 255, 0.1);\n    margin-left: 200px;\n\n    .octopus-select-value {\n        color: var(--octopus-secondary);\n        font-weight: bold;\n        align-content: center;\n    }\n\n    input {\n        color: white;\n    }\n\n    button {\n        color: rgba(255, 255, 255, 0.3);\n    }\n}\n\n.value {\n    color: var(--octopus-secondary);\n    font-weight: bold;\n    align-content: center;\n    align-items: center;\n\n    button {\n        color: inherit;\n        font-weight: inherit;\n        text-align: start;\n        padding: 0;\n    }\n\n    span:not(.selected):not(.icon) {\n        opacity: .5;\n        transition: opacity .5s;\n\n        &:hover {\n            opacity: .7;\n        }\n    }\n}\n\n.label {\n    color: rgba(255, 255, 255, 0.3);\n    font-weight: 600;\n    font-style: italic;\n    font-size: 14px;\n    white-space: nowrap;\n    overflow-y: visible;\n}\n\n.icon {\n    opacity: .7;\n    transition: opacity .5s;\n\n    &:hover {\n        opacity: 1;\n    }\n}\n</style>\n","<template>\n    <div\n        id=\"suborga-list-menu\"\n        ref=\"menuNav\"\n        role=\"dialog\"\n        aria-labelledby=\"suborga-list-menu-title\"\n        :class=\"{ shown: open }\"\n        :inert=\"!open\"\n    >\n        <button\n            type=\"button\"\n            class=\"btn-transparent close-btn\"\n            @click=\"close\"\n        >\n            <CloseIcon :title=\"t('Close')\" />\n        </button>\n\n        <div class=\"search\">\n            <h3 id=\"suborga-list-menu-title\">\n                {{ t('RightsScopeMenu - Title') }}\n            </h3>\n            <ClassicInputText\n                v-model:text-init=\"search\"\n                :placeholder=\"t('RightsScopeMenu - Search')\"\n                can-be-null\n            />\n        </div>\n\n        <div v-if=\"showFirstList\" class=\"suborga-list mb-4\">\n            <h4>{{ t('RightsScopeMenu - First list - Title') }}</h4>\n            <span\n                v-for=\"suborga in userSubOrgas\"\n                :key=\"suborga.id\"\n                class=\"suborga\"\n                @click=\"select(suborga)\"\n            >\n                {{ suborga.name }}\n            </span>\n        </div>\n\n        <div class=\"suborga-list\">\n            <h4>{{ secondListTitle }}</h4>\n\n            <div v-if=\"showLetters\" class=\"letters mt-2\">\n                <button\n                    v-for=\"letter in 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'\"\n                    :key=\"letter\"\n                    type=\"button\"\n                    class=\"letter\"\n                    :title=\"subOrgaByLetter.has(letter) ? undefined : t('RightsScopeMenu - Letters - No sub orga for letter')\"\n                    :disabled=\"!subOrgaByLetter.has(letter)\"\n                    @click=\"scrollToLetter(letter)\"\n                >\n                    {{ letter }}\n                </button>\n            </div>\n\n            <div\n                v-for=\"[letter, suborgaForLetter] in subOrgaByLetter\"\n                :key=\"'suborgas-' + letter\"\n            >\n                <div\n                    :id=\"'suborga-letter-' + letter\"\n                    class=\"letter\"\n                    tabindex=\"-1\"\n                >\n                    {{ letter }}\n                </div>\n                <span\n                    v-for=\"suborga in suborgaForLetter\"\n                    :key=\"suborga.id\"\n                    class=\"suborga\"\n                    @click=\"select(suborga)\"\n                >\n                    {{ suborga.name }}\n                </span>\n            </div>\n        </div>\n\n        <p role=\"status\" class=\"text-indic px-3\">\n            <template v-if=\"noResult\">\n                {{ t('RightsScopeMenu - No result') }}\n            </template>\n        </p>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, defineAsyncComponent, nextTick, onUnmounted, ref, toRef, useTemplateRef, watch } from 'vue';\nimport { getClassicInputText, useAuthStore } from '@saooti/octopus-sdk'; \nimport { SubOrganisation, useSubOrganisations } from '../composable/useSubOrganisations';\nimport { useI18n } from 'vue-i18n';\nimport CloseIcon from 'vue-material-design-icons/Close.vue';\n\nconst ClassicInputText = defineAsyncComponent(getClassicInputText);\n\nconst { t } = useI18n();\n\n///////////////////////////////\n// Menu\n///////////////////////////////\nconst props = defineProps<{\n    open?: boolean;\n}>();\n\nconst emit = defineEmits<{\n    (e: 'update:open', open: boolean): void;\n}>();\n\nconst menuNav = useTemplateRef('menuNav');\nlet previousFocus: HTMLElement | null = null;\n\nwatch(() => props.open, async open => {\n    if (open) {\n        previousFocus = document.activeElement as HTMLElement | null;\n        setTimeout(() => document.addEventListener('click', openOnClick), 200);\n        document.addEventListener('keydown', closeOnEscape);\n        // Wait for the menu to no longer be inert before focusing\n        await nextTick();\n        menuNav.value?.querySelector('input')?.focus();\n    } else {\n        removeListeners();\n        // Only give focus back if it would otherwise be lost (inside the\n        // closed menu, or on body), to avoid stealing it after a click\n        // elsewhere\n        const active = document.activeElement;\n        if (active === document.body || menuNav.value?.contains(active)) {\n            previousFocus?.focus();\n        }\n    }\n});\n\nonUnmounted(removeListeners);\n\nfunction removeListeners(): void {\n    document.removeEventListener('click', openOnClick);\n    document.removeEventListener('keydown', closeOnEscape);\n}\n\nfunction close(): void {\n    emit('update:open', false);\n}\n\nfunction openOnClick(event: MouseEvent) {\n    const menu = menuNav.value;\n    if (props.open && event.target && !menu?.contains(event.target as Node)) {\n        close();\n    }\n}\n\nfunction closeOnEscape(event: KeyboardEvent): void {\n    if (event.key === 'Escape') {\n        close();\n    }\n}\n\nfunction prefersReducedMotion(): boolean {\n    return window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n}\n\n///////////////////////////////\n// Display list\n///////////////////////////////\nconst search = ref('');\nconst authStore = useAuthStore();\nconst { subOrganisations, selectSubOrganisation } = useSubOrganisations(toRef(authStore, 'authOrgaId'));\n\nfunction normalize(str: string): string {\n    // Separate accented character in letter/diacritic, then remove the\n    // diacritic\n    return str.toUpperCase().normalize(\"NFD\").replace(/\\p{Diacritic}/gu, '');\n}\n\nconst normalizedSearch = computed((): string => {\n    return normalize(search.value);\n});\n\nconst userSubOrgas = computed((): Array<SubOrganisation> => {\n    const userScope = authStore.userScope;\n    return subOrganisations.value\n        .filter(sub => sub.name.includes(normalizedSearch.value))\n        .filter(sub => userScope.includes(sub.id))\n        .sort((o1, o2) => o1.name.localeCompare(o2.name))\n    ;\n});\n\nconst showFirstList = computed((): boolean => {\n    return userSubOrgas.value.length > 0;\n});\n\nconst secondListTitle = computed((): string => {\n    const userScope = authStore.userScope;\n    if (userScope.length === 0) {\n        return t('RightsScopeMenu - Second list - Title unscoped');\n    } else {\n        return t('RightsScopeMenu - Second list - Title scoped');\n    }\n});\n\nconst showLetters = computed((): boolean => {\n    return subOrganisations.value.length > 10;\n});\n\nconst subOrgaByLetter = computed((): Map<string, Array<SubOrganisation>> => {\n    const data: Map<string, Array<SubOrganisation>> = new Map();\n\n    const filtered = subOrganisations.value\n        .filter(sub => sub.name.includes(normalizedSearch.value))\n        .filter(sub => !userSubOrgas.value.includes(sub))\n        .sort((o1, o2) => o1.name.localeCompare(o2.name))\n    ;\n\n    if (showLetters.value) {\n        filtered.forEach((sub: SubOrganisation) => {\n            const firstLetter = sub.name[0];\n            if (data.has(firstLetter)) {\n                const present = data.get(firstLetter);\n                present!.push(sub);\n            } else {\n                data.set(firstLetter, [sub]);\n            }\n        });\n    } else {\n        data.set(null, filtered);\n    }\n\n    data.values().forEach(ary => ary.sort((a, b) => a.name.localeCompare(b.name)));\n\n    return data;\n});\n\nconst noResult = computed((): boolean => {\n    return !showFirstList.value\n        && [...subOrgaByLetter.value.values()].every(ary => ary.length === 0);\n});\n\nfunction scrollToLetter(letter: string): void {\n    if (!subOrgaByLetter.value.has(letter)) {\n        return;\n    }\n    const container = menuNav.value;\n    const target: HTMLElement | null | undefined = container?.querySelector(`#suborga-letter-${letter}`);\n    if (container && target) {\n        container.scrollTo({\n            top: target.offsetTop,\n            behavior: prefersReducedMotion() ? 'auto' : 'smooth'\n        });\n        target.focus({ preventScroll: true });\n    }\n}\n\n///////////////////////////////\n// Sub orga selection\n///////////////////////////////\nfunction select(org: SubOrganisation): void {\n    selectSubOrganisation(org);\n    emit('update:open', false);\n}\n</script>\n\n<style scoped lang=\"scss\">\n#suborga-list-menu-btn {\n    transition: rotate 0.3s ease-out;\n    \n    &.active {\n        rotate: 90deg;\n    }\n}\n\n#suborga-list-menu {\n    z-index: 100;\n    \n    --width: 30dvw;\n\n    // Positioning\n    position: fixed;\n    left: 0;\n    top: 0;\n    width: var(--width);\n    height: 100dvh;\n\n    // Margins\n    padding: 1.5em 0;\n\n    // Overflow\n    overflow-y: auto;\n\n    // Style\n    background-color: white;\n    //border-radius: 0 var(--octopus-border-radius);\n    border-right: 2px solid var(--octopus-primary);\n\n    // Animation\n    @media (prefers-reduced-motion: no-preference) {\n        transition: left 0.6s ease-out;\n    }\n\n    &.shown {\n        left: 0;\n    }\n\n    &:not(.shown) {\n        left: calc(var(--width) * -1);\n    }\n\n    @media(width <= 960px) {\n        --width: 100dvw;\n    }\n}\n\n.close-btn {\n    position: absolute;\n    top: 0.5rem;\n    right: 0.5rem;\n}\n\nh4 {\n    margin-left: 10px;\n    color: var(--octopus-primary);\n}\n\n.letter {\n    color: var(--pm-accent);\n    font-weight: bold;\n    font-size: 1em;\n    background-color: oklch(from var(--pm-accent) l c h / 15%);\n}\n\n.search {\n    padding: 0 1rem;\n\n    h3 {\n        color: var(--pm-accent);\n        text-align: center;\n    }\n}\n\n.letters {\n    display: grid;\n    grid-template-columns: repeat(9, 28px);\n    width: fit-content;\n    margin: auto;\n\n    .letter {\n        border: none;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        color: black;\n        margin: 7px 0 8px;\n        width: 24px;\n        height: 24px;\n        border-radius: 8px;\n        font-size: 12px;\n        padding: 0 !important;\n        cursor: pointer;\n\n        &:disabled {\n            background-color: #EBF3FE;\n            cursor: not-allowed;\n        }\n    }\n}\n\n.suborga-list {\n    .letter {\n        padding: 0.1rem 1rem;\n        color: var(--octopus-primary);\n    }\n\n    .suborga {\n        display: block;\n        padding: 0.5rem 1.4rem;\n        cursor: pointer;\n\n        &:not(:last-child) {\n            border-bottom: 1px solid var(--octopus-primary-really-transparent);\n        }\n    }\n}\n</style>\n","<template>\n    <div\n        id=\"suborga-list-menu\"\n        ref=\"menuNav\"\n        role=\"dialog\"\n        aria-labelledby=\"suborga-list-menu-title\"\n        :class=\"{ shown: open }\"\n        :inert=\"!open\"\n    >\n        <button\n            type=\"button\"\n            class=\"btn-transparent close-btn\"\n            @click=\"close\"\n        >\n            <CloseIcon :title=\"t('Close')\" />\n        </button>\n\n        <div class=\"search\">\n            <h3 id=\"suborga-list-menu-title\">\n                {{ t('RightsScopeMenu - Title') }}\n            </h3>\n            <ClassicInputText\n                v-model:text-init=\"search\"\n                :placeholder=\"t('RightsScopeMenu - Search')\"\n                can-be-null\n            />\n        </div>\n\n        <div v-if=\"showFirstList\" class=\"suborga-list mb-4\">\n            <h4>{{ t('RightsScopeMenu - First list - Title') }}</h4>\n            <span\n                v-for=\"suborga in userSubOrgas\"\n                :key=\"suborga.id\"\n                class=\"suborga\"\n                @click=\"select(suborga)\"\n            >\n                {{ suborga.name }}\n            </span>\n        </div>\n\n        <div class=\"suborga-list\">\n            <h4>{{ secondListTitle }}</h4>\n\n            <div v-if=\"showLetters\" class=\"letters mt-2\">\n                <button\n                    v-for=\"letter in 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'\"\n                    :key=\"letter\"\n                    type=\"button\"\n                    class=\"letter\"\n                    :title=\"subOrgaByLetter.has(letter) ? undefined : t('RightsScopeMenu - Letters - No sub orga for letter')\"\n                    :disabled=\"!subOrgaByLetter.has(letter)\"\n                    @click=\"scrollToLetter(letter)\"\n                >\n                    {{ letter }}\n                </button>\n            </div>\n\n            <div\n                v-for=\"[letter, suborgaForLetter] in subOrgaByLetter\"\n                :key=\"'suborgas-' + letter\"\n            >\n                <div\n                    :id=\"'suborga-letter-' + letter\"\n                    class=\"letter\"\n                    tabindex=\"-1\"\n                >\n                    {{ letter }}\n                </div>\n                <span\n                    v-for=\"suborga in suborgaForLetter\"\n                    :key=\"suborga.id\"\n                    class=\"suborga\"\n                    @click=\"select(suborga)\"\n                >\n                    {{ suborga.name }}\n                </span>\n            </div>\n        </div>\n\n        <p role=\"status\" class=\"text-indic px-3\">\n            <template v-if=\"noResult\">\n                {{ t('RightsScopeMenu - No result') }}\n            </template>\n        </p>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, defineAsyncComponent, nextTick, onUnmounted, ref, toRef, useTemplateRef, watch } from 'vue';\nimport { getClassicInputText, useAuthStore } from '@saooti/octopus-sdk'; \nimport { SubOrganisation, useSubOrganisations } from '../composable/useSubOrganisations';\nimport { useI18n } from 'vue-i18n';\nimport CloseIcon from 'vue-material-design-icons/Close.vue';\n\nconst ClassicInputText = defineAsyncComponent(getClassicInputText);\n\nconst { t } = useI18n();\n\n///////////////////////////////\n// Menu\n///////////////////////////////\nconst props = defineProps<{\n    open?: boolean;\n}>();\n\nconst emit = defineEmits<{\n    (e: 'update:open', open: boolean): void;\n}>();\n\nconst menuNav = useTemplateRef('menuNav');\nlet previousFocus: HTMLElement | null = null;\n\nwatch(() => props.open, async open => {\n    if (open) {\n        previousFocus = document.activeElement as HTMLElement | null;\n        setTimeout(() => document.addEventListener('click', openOnClick), 200);\n        document.addEventListener('keydown', closeOnEscape);\n        // Wait for the menu to no longer be inert before focusing\n        await nextTick();\n        menuNav.value?.querySelector('input')?.focus();\n    } else {\n        removeListeners();\n        // Only give focus back if it would otherwise be lost (inside the\n        // closed menu, or on body), to avoid stealing it after a click\n        // elsewhere\n        const active = document.activeElement;\n        if (active === document.body || menuNav.value?.contains(active)) {\n            previousFocus?.focus();\n        }\n    }\n});\n\nonUnmounted(removeListeners);\n\nfunction removeListeners(): void {\n    document.removeEventListener('click', openOnClick);\n    document.removeEventListener('keydown', closeOnEscape);\n}\n\nfunction close(): void {\n    emit('update:open', false);\n}\n\nfunction openOnClick(event: MouseEvent) {\n    const menu = menuNav.value;\n    if (props.open && event.target && !menu?.contains(event.target as Node)) {\n        close();\n    }\n}\n\nfunction closeOnEscape(event: KeyboardEvent): void {\n    if (event.key === 'Escape') {\n        close();\n    }\n}\n\nfunction prefersReducedMotion(): boolean {\n    return window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n}\n\n///////////////////////////////\n// Display list\n///////////////////////////////\nconst search = ref('');\nconst authStore = useAuthStore();\nconst { subOrganisations, selectSubOrganisation } = useSubOrganisations(toRef(authStore, 'authOrgaId'));\n\nfunction normalize(str: string): string {\n    // Separate accented character in letter/diacritic, then remove the\n    // diacritic\n    return str.toUpperCase().normalize(\"NFD\").replace(/\\p{Diacritic}/gu, '');\n}\n\nconst normalizedSearch = computed((): string => {\n    return normalize(search.value);\n});\n\nconst userSubOrgas = computed((): Array<SubOrganisation> => {\n    const userScope = authStore.userScope;\n    return subOrganisations.value\n        .filter(sub => sub.name.includes(normalizedSearch.value))\n        .filter(sub => userScope.includes(sub.id))\n        .sort((o1, o2) => o1.name.localeCompare(o2.name))\n    ;\n});\n\nconst showFirstList = computed((): boolean => {\n    return userSubOrgas.value.length > 0;\n});\n\nconst secondListTitle = computed((): string => {\n    const userScope = authStore.userScope;\n    if (userScope.length === 0) {\n        return t('RightsScopeMenu - Second list - Title unscoped');\n    } else {\n        return t('RightsScopeMenu - Second list - Title scoped');\n    }\n});\n\nconst showLetters = computed((): boolean => {\n    return subOrganisations.value.length > 10;\n});\n\nconst subOrgaByLetter = computed((): Map<string, Array<SubOrganisation>> => {\n    const data: Map<string, Array<SubOrganisation>> = new Map();\n\n    const filtered = subOrganisations.value\n        .filter(sub => sub.name.includes(normalizedSearch.value))\n        .filter(sub => !userSubOrgas.value.includes(sub))\n        .sort((o1, o2) => o1.name.localeCompare(o2.name))\n    ;\n\n    if (showLetters.value) {\n        filtered.forEach((sub: SubOrganisation) => {\n            const firstLetter = sub.name[0];\n            if (data.has(firstLetter)) {\n                const present = data.get(firstLetter);\n                present!.push(sub);\n            } else {\n                data.set(firstLetter, [sub]);\n            }\n        });\n    } else {\n        data.set(null, filtered);\n    }\n\n    data.values().forEach(ary => ary.sort((a, b) => a.name.localeCompare(b.name)));\n\n    return data;\n});\n\nconst noResult = computed((): boolean => {\n    return !showFirstList.value\n        && [...subOrgaByLetter.value.values()].every(ary => ary.length === 0);\n});\n\nfunction scrollToLetter(letter: string): void {\n    if (!subOrgaByLetter.value.has(letter)) {\n        return;\n    }\n    const container = menuNav.value;\n    const target: HTMLElement | null | undefined = container?.querySelector(`#suborga-letter-${letter}`);\n    if (container && target) {\n        container.scrollTo({\n            top: target.offsetTop,\n            behavior: prefersReducedMotion() ? 'auto' : 'smooth'\n        });\n        target.focus({ preventScroll: true });\n    }\n}\n\n///////////////////////////////\n// Sub orga selection\n///////////////////////////////\nfunction select(org: SubOrganisation): void {\n    selectSubOrganisation(org);\n    emit('update:open', false);\n}\n</script>\n\n<style scoped lang=\"scss\">\n#suborga-list-menu-btn {\n    transition: rotate 0.3s ease-out;\n    \n    &.active {\n        rotate: 90deg;\n    }\n}\n\n#suborga-list-menu {\n    z-index: 100;\n    \n    --width: 30dvw;\n\n    // Positioning\n    position: fixed;\n    left: 0;\n    top: 0;\n    width: var(--width);\n    height: 100dvh;\n\n    // Margins\n    padding: 1.5em 0;\n\n    // Overflow\n    overflow-y: auto;\n\n    // Style\n    background-color: white;\n    //border-radius: 0 var(--octopus-border-radius);\n    border-right: 2px solid var(--octopus-primary);\n\n    // Animation\n    @media (prefers-reduced-motion: no-preference) {\n        transition: left 0.6s ease-out;\n    }\n\n    &.shown {\n        left: 0;\n    }\n\n    &:not(.shown) {\n        left: calc(var(--width) * -1);\n    }\n\n    @media(width <= 960px) {\n        --width: 100dvw;\n    }\n}\n\n.close-btn {\n    position: absolute;\n    top: 0.5rem;\n    right: 0.5rem;\n}\n\nh4 {\n    margin-left: 10px;\n    color: var(--octopus-primary);\n}\n\n.letter {\n    color: var(--pm-accent);\n    font-weight: bold;\n    font-size: 1em;\n    background-color: oklch(from var(--pm-accent) l c h / 15%);\n}\n\n.search {\n    padding: 0 1rem;\n\n    h3 {\n        color: var(--pm-accent);\n        text-align: center;\n    }\n}\n\n.letters {\n    display: grid;\n    grid-template-columns: repeat(9, 28px);\n    width: fit-content;\n    margin: auto;\n\n    .letter {\n        border: none;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        color: black;\n        margin: 7px 0 8px;\n        width: 24px;\n        height: 24px;\n        border-radius: 8px;\n        font-size: 12px;\n        padding: 0 !important;\n        cursor: pointer;\n\n        &:disabled {\n            background-color: #EBF3FE;\n            cursor: not-allowed;\n        }\n    }\n}\n\n.suborga-list {\n    .letter {\n        padding: 0.1rem 1rem;\n        color: var(--octopus-primary);\n    }\n\n    .suborga {\n        display: block;\n        padding: 0.5rem 1.4rem;\n        cursor: pointer;\n\n        &:not(:last-child) {\n            border-bottom: 1px solid var(--octopus-primary-really-transparent);\n        }\n    }\n}\n</style>\n","<template>\n    <div class=\"top-bar-grid header-content\" :class=\"{ scrolled: titleIsDisplayed }\">\n        <div class=\"d-flex align-items-center\">\n            <!-- Logo to the left -->\n            <router-link\n                class=\"top-bar-logo d-block\"\n                :to=\"{\n                    name: 'home',\n                    query: getQueriesRouter('home'),\n                }\"\n                :title=\"t('Home')\"\n            >\n                <img\n                    v-if=\"!filterStore.filterOrgaId || '' === imgUrl\"\n                    :src=\"logoUrl\"\n                    aria-hidden=\"true\"\n                    alt=\"\"\n                    width=\"140\"\n                    height=\"50\"\n                    title=\"Logo\"\n                    :class=\"generalStore.platformEducation ? 'education-logo' : 'octopus-logo'\"\n                >\n                <img\n                    v-else\n                    :src=\"useProxyImageUrl(imgUrl, '', '80')\"\n                    aria-hidden=\"true\"\n                    alt=\"\"\n                    class=\"client-logo\"\n                    title=\"Logo\"\n                    :class=\"generalStore.platformEducation ? 'education-logo' : ''\"\n                >\n            </router-link>\n\n            <RightsScopeMenu v-model:open=\"menuOpen\" />\n            <RightsScopeSelector\n                class=\"ms-4\"\n                :open=\"menuOpen\"\n                @change=\"menuOpen = true\"\n            />\n        </div>\n\n        <h1 v-if=\"titleIsDisplayed\" class=\"text-truncate m-0 align-self-center\">\n            {{ titleDisplay }}\n        </h1>\n\n        <!-- Right section -->\n        <div\n            class=\"d-flex right-section\"\n            :class=\"[\n                inContentDisplayPage || isPhone\n                    ? 'flex-row-reverse align-items-center'\n                    : 'flex-column align-items-end',\n            ]\"\n        >\n            <!-- Logo to the right -->\n            <template v-if=\"filterStore.filterOrgaId && '' !== imgUrl\">\n                <img\n                    v-if=\"authStore.isGarRole\"\n                    :src=\"logoUrl\"\n                    aria-hidden=\"true\"\n                    alt=\"\"\n                    width=\"100\"\n                    height=\"29\"\n                    class=\"ms-2\"\n                    title=\"Logo\"\n                    :class=\"generalStore.platformEducation ? 'education-logo' : 'octopus-logo'\"\n                >\n                <a\n                    v-else\n                    href=\"https://www.saooti.com/\"\n                    target=\"_blank\"\n                    rel=\"noreferrer noopener\"\n                    :title=\"t('New window', {text: 'Saooti'})\"\n                >\n                    <img\n                        :src=\"logoUrl\"\n                        aria-hidden=\"true\"\n                        alt=\"\"\n                        title=\"Saooti\"\n                        width=\"100\"\n                        height=\"29\"\n                        class=\"ms-2\"\n                        :class=\"generalStore.platformEducation ? 'education-logo' : 'octopus-logo'\"\n                    >\n                </a>\n            </template>\n\n            <div role=\"navigation\" class=\"d-flex align-items-center justify-content-end flex-grow-1\">\n                <nav :aria-label=\"t('Site menu')\">\n                    <ul class=\"d-flex\">\n                        <template v-for=\"link in routerLinkArray\" :key=\"link.routeName\">\n                            <li v-if=\"link.condition\" class=\"li-style-none\">\n                                <router-link\n                                    v-show=\"!isPhone\"\n                                    :to=\"{\n                                        name: link.routeName,\n                                        query: getQueriesRouter(link.routeName),\n                                    }\"\n                                    class=\"link-hover py-2 px-3\"\n                                >\n                                    {{ link.title }}\n                                </router-link>\n                            </li>\n                        </template>\n                    </ul>\n                </nav>\n                <button\n                    v-show=\"!isPhone && !inContentDisplayPage\"\n                    id=\"more-dropdown\"\n                    :title=\"t('More')\"\n                    class=\"d-flex-column flex-nowrap align-items-center btn-transparent py-2 px-3 text-white\"\n                >\n                    <span class=\"link-hover\">\n                        {{ t(\"More\") }}\n                    </span>\n                    <ChevronDownIcon />\n                </button>\n                <ClassicPopover\n                    target=\"more-dropdown\"\n                    :only-click=\"true\"\n                    :is-fixed=\"true\"\n                    :left-pos=\"true\"\n                    :is-top-layer=\"true\"\n                >\n                    <nav class=\"d-flex flex-column\" :aria-label=\"t('Site menu')\">\n                        <ul class=\"p-0 m-0\">\n                            <template v-for=\"link in routerLinkInsideArray\" :key=\"link.routeName\">\n                                <li\n                                    v-if=\"link.condition\"\n                                    class=\"li-style-none\"\n                                >\n                                    <router-link\n                                        :to=\"{\n                                            name: link.routeName,\n                                            query: getQueriesRouter(link.routeName),\n                                        }\"\n                                        class=\"p-1 octopus-dropdown-item\"\n                                    >\n                                        {{ link.title }}\n                                    </router-link>\n                                </li>\n                            </template>\n                        </ul>\n                    </nav>\n                </ClassicPopover>\n\n                <MobileMenu\n                    :is-education=\"generalStore.platformEducation\"\n                    :show=\"mobileMenuDisplay\"\n                    :not-podcast-and-emission=\"inContentDisplayPage && !scrolled\"\n                />\n                <HomeDropdown\n                    :is-education=\"generalStore.platformEducation\"\n                    :mobile-menu-display=\"mobileMenuDisplay\"\n                    v-bind=\"options?.homeDropdown\"\n                />\n                <router-link\n                    v-show=\"!isPhone && !inContentDisplayPage\"\n                    :title=\"t('Search')\"\n                    :to=\"{\n                        name: 'podcasts',\n                    }\"\n                    class=\"btn admin-button m-1 text-blue-octopus\"\n                    role=\"search\"\n                >\n                    <MagnifyIcon :size=\"30\" />\n                </router-link>\n            </div>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ChevronDownIcon from \"vue-material-design-icons/ChevronDown.vue\";\nimport MagnifyIcon from \"vue-material-design-icons/Magnify.vue\";\nimport { useRubriquesFilterComputed } from \"../composable/route/useRubriquesFilterComputed\";\nimport { state } from \"../../stores/ParamSdkStore\";\nimport HomeDropdown, { type HomeDropdownProps } from \"./HomeDropdown.vue\";\nimport {useImageProxy} from \"../composable/useImageProxy\";\nimport { useFilterStore } from \"../../stores/FilterStore\";\nimport { useAuthStore } from \"../../stores/AuthStore\";\nimport ClassicPopover from \"../misc/ClassicPopover.vue\";\nimport { defineAsyncComponent, computed, ref } from \"vue\";\nimport { useGeneralStore } from \"../../stores/GeneralStore\";\nimport { useI18n } from \"vue-i18n\";\nimport RightsScopeSelector from \"./RightsScopeSelector.vue\";\nimport RightsScopeMenu from \"./RightsScopeMenu.vue\"; \nconst MobileMenu = defineAsyncComponent(() => import(\"./MobileMenu.vue\"));\n\nexport interface TopBarMainContentOptions {\n    homeDropdown?: HomeDropdownProps;\n}\n\nexport interface TopBarMainContentProps {\n    isPhone?: boolean;\n    titleDisplay?: string;\n    scrolled?: boolean;\n};\n\n//Props \nconst props = defineProps<TopBarMainContentProps & {\n    /** Props for subcomponents */\n    options?: TopBarMainContentOptions;\n}>();\n\n\n//Composables\nconst { t } = useI18n();\nconst { useProxyImageUrl } = useImageProxy();\nconst { rubriqueQueryParam } = useRubriquesFilterComputed();\nconst authStore = useAuthStore();\nconst generalStore = useGeneralStore();\nconst filterStore = useFilterStore();\n\nconst menuOpen = ref(false);\n\n//Computed\nconst mobileMenuDisplay = computed(() => props.isPhone || inContentDisplayPage.value);\nconst titleIsDisplayed = computed(() => inContentDisplayPage.value && props.scrolled && !props.isPhone);\nconst inContentDisplayPage = computed(() => 0 !== props.titleDisplay.length);\nconst routerLinkArray = computed(() => [{\n    title: t(\"Radio & Live\"),\n    routeName: \"lives\",\n    condition:\n        !inContentDisplayPage.value &&\n        (state.generalParameters.isLiveTab as boolean) &&\n        ((filterStore.filterOrgaId && filterStore.filterLive) || !filterStore.filterOrgaId),\n}, {\n    title: t(\"Podcasts\"),\n    routeName: \"podcasts\",\n    condition:\n        !inContentDisplayPage.value ||\n        (inContentDisplayPage.value && !props.scrolled),\n}, {\n    title: t(\"Emissions\"),\n    routeName: \"emissions\",\n    condition:\n        !inContentDisplayPage.value ||\n        (inContentDisplayPage.value && !props.scrolled),\n}]);\n\nconst routerLinkInsideArray = computed(() =>{\n    return [\n        {\n            title: t(\"Speakers\"),\n            routeName: \"participants\",\n            condition: true,\n        },\n        {\n            title: t(\"Playlists\"),\n            routeName: \"playlists\",\n            condition: true,\n        },\n        {\n            title: t(\"Productors\"),\n            routeName: \"productors\",\n            condition:\n                !state.generalParameters.podcastmaker && (!filterStore.filterOrgaId || generalStore.platformEducation),\n        },\n    ];\n});\nconst logoUrl = computed(() =>{\n    if (generalStore.platformEducation) {\n        return \"/img/logo_education_white.svg\";\n    }\n    return props.isPhone\n        ? \"/img/logo_octopus_bubble.svg\"\n        : \"/img/logo_saooti_play_white.svg\";\n});\nconst imgUrl = computed(() =>{\n    if (!filterStore.filterImgUrl?.includes(\"emptypodcast\")){\n        return `${filterStore.filterImgUrl}`;\n    }\n    return \"\";\n});\n \n//Methods\nfunction getQueriesRouter(routeName: string) {\n    if (\"podcasts\" !== routeName && \"emissions\" !== routeName  && \"home\" !== routeName) {\n        return { productor: filterStore.filterOrgaId };\n    }\n    return {\n        productor: filterStore.filterOrgaId,\n        iabId: filterStore.filterIab?.id,\n        rubriquesId: rubriqueQueryParam.value,\n    };\n}\n</script>\n\n<style scoped lang=\"scss\">\n.top-bar-grid {\n    display: grid;\n    grid-template-columns: 1fr 5fr;\n    padding: 0 1rem 0 0.5rem;\n\n    &.scrolled {\n        grid-template-columns: 1fr 2fr 1fr;\n    }\n\n    @media (width <= 450px) {\n        padding: 0 0.5rem;\n    }\n\n    .link-hover {\n        color: white;\n        font-weight: bold;\n        font-size: 0.93rem;\n        text-decoration: underline;\n        text-decoration-color: transparent;\n        transition: text-decoration-color 250ms;\n        text-underline-offset: 8px;\n\n        &.link-hover:hover,\n        &.link-hover.router-link-exact-active.router-link-active {\n            color: white;\n            text-decoration-color: white;\n        }\n    }\n\n    .client-logo {\n        border-radius: var(--octopus-border-radius);\n    }\n\n    .top-bar-logo img {\n        max-width: 140px !important;\n        max-height: 4rem;\n        height: 4rem;\n\n        &.education-logo {\n            height: auto;\n        }\n\n        @media (width <= 650px) {\n            max-height: 2rem;\n        }\n    }\n\n    .octopus-logo {\n        @media (width <= 960px) {\n            max-width: 30px !important;\n        }\n    }\n}\n\n.right-section {\n    padding-top: 0.5rem;\n}\n</style>\n","<template>\n    <div class=\"top-bar-grid header-content\" :class=\"{ scrolled: titleIsDisplayed }\">\n        <div class=\"d-flex align-items-center\">\n            <!-- Logo to the left -->\n            <router-link\n                class=\"top-bar-logo d-block\"\n                :to=\"{\n                    name: 'home',\n                    query: getQueriesRouter('home'),\n                }\"\n                :title=\"t('Home')\"\n            >\n                <img\n                    v-if=\"!filterStore.filterOrgaId || '' === imgUrl\"\n                    :src=\"logoUrl\"\n                    aria-hidden=\"true\"\n                    alt=\"\"\n                    width=\"140\"\n                    height=\"50\"\n                    title=\"Logo\"\n                    :class=\"generalStore.platformEducation ? 'education-logo' : 'octopus-logo'\"\n                >\n                <img\n                    v-else\n                    :src=\"useProxyImageUrl(imgUrl, '', '80')\"\n                    aria-hidden=\"true\"\n                    alt=\"\"\n                    class=\"client-logo\"\n                    title=\"Logo\"\n                    :class=\"generalStore.platformEducation ? 'education-logo' : ''\"\n                >\n            </router-link>\n\n            <RightsScopeMenu v-model:open=\"menuOpen\" />\n            <RightsScopeSelector\n                class=\"ms-4\"\n                :open=\"menuOpen\"\n                @change=\"menuOpen = true\"\n            />\n        </div>\n\n        <h1 v-if=\"titleIsDisplayed\" class=\"text-truncate m-0 align-self-center\">\n            {{ titleDisplay }}\n        </h1>\n\n        <!-- Right section -->\n        <div\n            class=\"d-flex right-section\"\n            :class=\"[\n                inContentDisplayPage || isPhone\n                    ? 'flex-row-reverse align-items-center'\n                    : 'flex-column align-items-end',\n            ]\"\n        >\n            <!-- Logo to the right -->\n            <template v-if=\"filterStore.filterOrgaId && '' !== imgUrl\">\n                <img\n                    v-if=\"authStore.isGarRole\"\n                    :src=\"logoUrl\"\n                    aria-hidden=\"true\"\n                    alt=\"\"\n                    width=\"100\"\n                    height=\"29\"\n                    class=\"ms-2\"\n                    title=\"Logo\"\n                    :class=\"generalStore.platformEducation ? 'education-logo' : 'octopus-logo'\"\n                >\n                <a\n                    v-else\n                    href=\"https://www.saooti.com/\"\n                    target=\"_blank\"\n                    rel=\"noreferrer noopener\"\n                    :title=\"t('New window', {text: 'Saooti'})\"\n                >\n                    <img\n                        :src=\"logoUrl\"\n                        aria-hidden=\"true\"\n                        alt=\"\"\n                        title=\"Saooti\"\n                        width=\"100\"\n                        height=\"29\"\n                        class=\"ms-2\"\n                        :class=\"generalStore.platformEducation ? 'education-logo' : 'octopus-logo'\"\n                    >\n                </a>\n            </template>\n\n            <div role=\"navigation\" class=\"d-flex align-items-center justify-content-end flex-grow-1\">\n                <nav :aria-label=\"t('Site menu')\">\n                    <ul class=\"d-flex\">\n                        <template v-for=\"link in routerLinkArray\" :key=\"link.routeName\">\n                            <li v-if=\"link.condition\" class=\"li-style-none\">\n                                <router-link\n                                    v-show=\"!isPhone\"\n                                    :to=\"{\n                                        name: link.routeName,\n                                        query: getQueriesRouter(link.routeName),\n                                    }\"\n                                    class=\"link-hover py-2 px-3\"\n                                >\n                                    {{ link.title }}\n                                </router-link>\n                            </li>\n                        </template>\n                    </ul>\n                </nav>\n                <button\n                    v-show=\"!isPhone && !inContentDisplayPage\"\n                    id=\"more-dropdown\"\n                    :title=\"t('More')\"\n                    class=\"d-flex-column flex-nowrap align-items-center btn-transparent py-2 px-3 text-white\"\n                >\n                    <span class=\"link-hover\">\n                        {{ t(\"More\") }}\n                    </span>\n                    <ChevronDownIcon />\n                </button>\n                <ClassicPopover\n                    target=\"more-dropdown\"\n                    :only-click=\"true\"\n                    :is-fixed=\"true\"\n                    :left-pos=\"true\"\n                    :is-top-layer=\"true\"\n                >\n                    <nav class=\"d-flex flex-column\" :aria-label=\"t('Site menu')\">\n                        <ul class=\"p-0 m-0\">\n                            <template v-for=\"link in routerLinkInsideArray\" :key=\"link.routeName\">\n                                <li\n                                    v-if=\"link.condition\"\n                                    class=\"li-style-none\"\n                                >\n                                    <router-link\n                                        :to=\"{\n                                            name: link.routeName,\n                                            query: getQueriesRouter(link.routeName),\n                                        }\"\n                                        class=\"p-1 octopus-dropdown-item\"\n                                    >\n                                        {{ link.title }}\n                                    </router-link>\n                                </li>\n                            </template>\n                        </ul>\n                    </nav>\n                </ClassicPopover>\n\n                <MobileMenu\n                    :is-education=\"generalStore.platformEducation\"\n                    :show=\"mobileMenuDisplay\"\n                    :not-podcast-and-emission=\"inContentDisplayPage && !scrolled\"\n                />\n                <HomeDropdown\n                    :is-education=\"generalStore.platformEducation\"\n                    :mobile-menu-display=\"mobileMenuDisplay\"\n                    v-bind=\"options?.homeDropdown\"\n                />\n                <router-link\n                    v-show=\"!isPhone && !inContentDisplayPage\"\n                    :title=\"t('Search')\"\n                    :to=\"{\n                        name: 'podcasts',\n                    }\"\n                    class=\"btn admin-button m-1 text-blue-octopus\"\n                    role=\"search\"\n                >\n                    <MagnifyIcon :size=\"30\" />\n                </router-link>\n            </div>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ChevronDownIcon from \"vue-material-design-icons/ChevronDown.vue\";\nimport MagnifyIcon from \"vue-material-design-icons/Magnify.vue\";\nimport { useRubriquesFilterComputed } from \"../composable/route/useRubriquesFilterComputed\";\nimport { state } from \"../../stores/ParamSdkStore\";\nimport HomeDropdown, { type HomeDropdownProps } from \"./HomeDropdown.vue\";\nimport {useImageProxy} from \"../composable/useImageProxy\";\nimport { useFilterStore } from \"../../stores/FilterStore\";\nimport { useAuthStore } from \"../../stores/AuthStore\";\nimport ClassicPopover from \"../misc/ClassicPopover.vue\";\nimport { defineAsyncComponent, computed, ref } from \"vue\";\nimport { useGeneralStore } from \"../../stores/GeneralStore\";\nimport { useI18n } from \"vue-i18n\";\nimport RightsScopeSelector from \"./RightsScopeSelector.vue\";\nimport RightsScopeMenu from \"./RightsScopeMenu.vue\"; \nconst MobileMenu = defineAsyncComponent(() => import(\"./MobileMenu.vue\"));\n\nexport interface TopBarMainContentOptions {\n    homeDropdown?: HomeDropdownProps;\n}\n\nexport interface TopBarMainContentProps {\n    isPhone?: boolean;\n    titleDisplay?: string;\n    scrolled?: boolean;\n};\n\n//Props \nconst props = defineProps<TopBarMainContentProps & {\n    /** Props for subcomponents */\n    options?: TopBarMainContentOptions;\n}>();\n\n\n//Composables\nconst { t } = useI18n();\nconst { useProxyImageUrl } = useImageProxy();\nconst { rubriqueQueryParam } = useRubriquesFilterComputed();\nconst authStore = useAuthStore();\nconst generalStore = useGeneralStore();\nconst filterStore = useFilterStore();\n\nconst menuOpen = ref(false);\n\n//Computed\nconst mobileMenuDisplay = computed(() => props.isPhone || inContentDisplayPage.value);\nconst titleIsDisplayed = computed(() => inContentDisplayPage.value && props.scrolled && !props.isPhone);\nconst inContentDisplayPage = computed(() => 0 !== props.titleDisplay.length);\nconst routerLinkArray = computed(() => [{\n    title: t(\"Radio & Live\"),\n    routeName: \"lives\",\n    condition:\n        !inContentDisplayPage.value &&\n        (state.generalParameters.isLiveTab as boolean) &&\n        ((filterStore.filterOrgaId && filterStore.filterLive) || !filterStore.filterOrgaId),\n}, {\n    title: t(\"Podcasts\"),\n    routeName: \"podcasts\",\n    condition:\n        !inContentDisplayPage.value ||\n        (inContentDisplayPage.value && !props.scrolled),\n}, {\n    title: t(\"Emissions\"),\n    routeName: \"emissions\",\n    condition:\n        !inContentDisplayPage.value ||\n        (inContentDisplayPage.value && !props.scrolled),\n}]);\n\nconst routerLinkInsideArray = computed(() =>{\n    return [\n        {\n            title: t(\"Speakers\"),\n            routeName: \"participants\",\n            condition: true,\n        },\n        {\n            title: t(\"Playlists\"),\n            routeName: \"playlists\",\n            condition: true,\n        },\n        {\n            title: t(\"Productors\"),\n            routeName: \"productors\",\n            condition:\n                !state.generalParameters.podcastmaker && (!filterStore.filterOrgaId || generalStore.platformEducation),\n        },\n    ];\n});\nconst logoUrl = computed(() =>{\n    if (generalStore.platformEducation) {\n        return \"/img/logo_education_white.svg\";\n    }\n    return props.isPhone\n        ? \"/img/logo_octopus_bubble.svg\"\n        : \"/img/logo_saooti_play_white.svg\";\n});\nconst imgUrl = computed(() =>{\n    if (!filterStore.filterImgUrl?.includes(\"emptypodcast\")){\n        return `${filterStore.filterImgUrl}`;\n    }\n    return \"\";\n});\n \n//Methods\nfunction getQueriesRouter(routeName: string) {\n    if (\"podcasts\" !== routeName && \"emissions\" !== routeName  && \"home\" !== routeName) {\n        return { productor: filterStore.filterOrgaId };\n    }\n    return {\n        productor: filterStore.filterOrgaId,\n        iabId: filterStore.filterIab?.id,\n        rubriquesId: rubriqueQueryParam.value,\n    };\n}\n</script>\n\n<style scoped lang=\"scss\">\n.top-bar-grid {\n    display: grid;\n    grid-template-columns: 1fr 5fr;\n    padding: 0 1rem 0 0.5rem;\n\n    &.scrolled {\n        grid-template-columns: 1fr 2fr 1fr;\n    }\n\n    @media (width <= 450px) {\n        padding: 0 0.5rem;\n    }\n\n    .link-hover {\n        color: white;\n        font-weight: bold;\n        font-size: 0.93rem;\n        text-decoration: underline;\n        text-decoration-color: transparent;\n        transition: text-decoration-color 250ms;\n        text-underline-offset: 8px;\n\n        &.link-hover:hover,\n        &.link-hover.router-link-exact-active.router-link-active {\n            color: white;\n            text-decoration-color: white;\n        }\n    }\n\n    .client-logo {\n        border-radius: var(--octopus-border-radius);\n    }\n\n    .top-bar-logo img {\n        max-width: 140px !important;\n        max-height: 4rem;\n        height: 4rem;\n\n        &.education-logo {\n            height: auto;\n        }\n\n        @media (width <= 650px) {\n            max-height: 2rem;\n        }\n    }\n\n    .octopus-logo {\n        @media (width <= 960px) {\n            max-width: 30px !important;\n        }\n    }\n}\n\n.right-section {\n    padding-top: 0.5rem;\n}\n</style>\n","<template>\n  <header\n    role=\"banner\"\n    class=\"header-saooti-play\"\n    :style=\"headerBackgroundImage\"\n    :class=\"[generalStore.contentToDisplay ? 'header-img-bg':'bg-gradient', scrolled? 'scrolled':'', needToBlur ? 'header-force-blur':'']\"\n  >\n    <TopBarMainContent\n      :is-phone=\"isPhone\"\n      :scrolled=\"scrolled\"\n      :title-display=\"titleToDisplay\"\n      style=\"height: var(--header-size);\"\n      :class=\"headerBackgroundImage.length ? 'header-opacity':''\"\n      :options=\"options?.topBarMainContent\"\n    />\n  </header>\n\n  <div\n    v-if=\"generalStore.contentToDisplay\"\n    class=\"header-content-bg\"\n    :style=\"headerBackgroundImage\"\n    :class=\"{ scrolled: scrolled, 'header-force-blur':needToBlur }\"\n  >\n    <div class=\"header-additional-content header-content\">\n      <h1 v-if=\"!scrolled\" class=\"text-truncate\">\n        {{ titleToDisplay }}\n      </h1>\n      <SubscribeButtons\n        v-if=\"!authStore.isGarRole && content\"\n        v-show=\"!scrolled\"\n        :content=\"content\"\n        :window-width=\"windowWidth\"\n      />\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport {useImageProxy} from \"../composable/useImageProxy\";\nimport TopBarMainContent, { type TopBarMainContentOptions } from \"./TopBarMainContent.vue\";\nimport { computed, defineAsyncComponent, onBeforeUnmount, onMounted, ref, watch } from \"vue\";\nimport { useAuthStore } from \"../../stores/AuthStore\";\nimport { useGeneralStore } from \"../../stores/GeneralStore\";\nimport { Podcast } from \"@/stores/class/general/podcast\";\nimport { Emission } from \"@/stores/class/general/emission\";\nimport {useResizePhone} from \"../composable/useResizePhone\";\nimport { Playlist } from \"@/stores/class/general/playlist\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport axios from \"axios\";\nconst SubscribeButtons = defineAsyncComponent(\n  () => import(\"../display/sharing/SubscribeButtons.vue\"),\n);\n\ndefineProps<{\n  options?: {\n    topBarMainContent?: TopBarMainContentOptions\n  }\n}>();\n\n//Data \nconst scrolled = ref(false);\nconst oldScrollY = ref(0);\nconst minScroll = ref(0);\nconst headerBackgroundImage = ref(\"\");\nconst needToBlur = ref(false);\n\n\n//Composables\nconst { isPhone, windowWidth } = useResizePhone();\nconst { useProxyImageUrl } = useImageProxy();\nconst authStore = useAuthStore();\nconst generalStore = useGeneralStore();\n\n//Computed\nconst titleToDisplay = computed(() => {\n  if ((generalStore.contentToDisplay as Podcast)?.podcastId) {\n    return (generalStore.contentToDisplay as Podcast).emission.name;\n  }\n  if ((generalStore.contentToDisplay as Playlist)?.playlistId) {\n    return (generalStore.contentToDisplay as Playlist).title;\n  }\n  if ((generalStore.contentToDisplay as Emission)?.emissionId) {\n    return (generalStore.contentToDisplay as Emission).name;\n  }\n  if ((generalStore.contentToDisplay as Canal)?.id) {\n    return (generalStore.contentToDisplay as Canal).name;\n  }\n  return \"\";\n});\n\n/** The element displayed by the subscribe buttons */\nconst content = computed(() => {\n  if ((generalStore.contentToDisplay as Podcast)?.podcastId) {\n    return (generalStore.contentToDisplay as Podcast).emission;\n  }\n  if ((generalStore.contentToDisplay as Emission)?.emissionId) {\n    return generalStore.contentToDisplay as Emission;\n  }\n  if ((generalStore.contentToDisplay as Playlist)?.playlistId) {\n    return generalStore.contentToDisplay as Playlist;\n  }\n  return null;\n});\n\n//Watch\nwatch(()=>generalStore.contentToDisplay, async () => {\n  if(!generalStore.contentToDisplay){\n    headerBackgroundImage.value = \"\";\n    needToBlur.value = false;\n    return;\n  }\n  const widthAsked = window.innerWidth > 960 ? \"1600\":\"1000\";\n  const proxyUrl = useProxyImageUrl(generalStore.contentToDisplay.imageUrl, widthAsked, undefined, true);\n  try {\n    const result = await axios.get(proxyUrl);\n    headerBackgroundImage.value = `background-image: url('${result.data}');`;\n    needToBlur.value = result.data === generalStore.contentToDisplay.imageUrl;\n  } catch {\n    if (generalStore.contentToDisplay.imageUrl) {\n      const url = encodeURI(generalStore.contentToDisplay.imageUrl);\n      headerBackgroundImage.value = `background-image: url('${url}');`;\n      needToBlur.value = true;\n    } else {\n      headerBackgroundImage.value = '';\n    }\n  }\n}, {deep: true, immediate: true});\n\n\nonMounted(()=>{\n  window.addEventListener(\"scroll\", handleScroll);\n})\nonBeforeUnmount(() => {\n  window.removeEventListener(\"scroll\", handleScroll);\n})\n\n\n//Methods\nfunction handleScroll(): void {\n  if (\n    window.scrollY - oldScrollY.value > 0 &&\n    window.scrollY > 1 &&\n    document.body.offsetHeight - window.innerHeight > 40\n  ) {\n    if (!scrolled.value) {\n      scrolled.value = true;\n      minScroll.value = 0;\n    }\n  } else if (\n    window.scrollY - oldScrollY.value  < 0 &&\n    window.scrollY < 1 &&\n    minScroll.value > 20\n  ) {\n    scrolled.value = false;\n    minScroll.value = 0;\n  }\n  oldScrollY.value  = window.scrollY;\n  if (minScroll.value < window.scrollY) {\n    minScroll.value = window.scrollY;\n  }\n}\n</script>\n\n<style lang=\"scss\">\n.octopus-app {\n  --header-size: 5rem;\n  --header-additional-content-size: 22rem;\n  @media (width <= 650px) {\n    --header-size: 3.5rem;\n  }\n  @media (width <= 550px) {\n    --header-additional-content-size: 13rem;\n  }\n  .header-saooti-play{\n    z-index: 11;\n    position: sticky;\n    top: 0;\n    background-color: black;\n    &.header-img-bg{\n      background-position: center -20vw;\n      background-repeat: no-repeat;\n      background-size: cover;\n    }\n    &.bg-gradient, &.scrolled{\n      box-shadow: 0 2px 15px 5px var(--octopus-shadow) !important; \n    }\n  }\n  .header-content-bg{\n    background-position: center calc(calc(var(--header-size) * -1) - 20vw);\n    background-repeat: no-repeat;\n    background-size: cover;\n    width: 100%;\n    display: flex;\n    background-color: black;\n    transition: height 0.7s;\n    height: calc(var(--header-additional-content-size) - var(--header-size));\n    @starting-style {\n      height: 0rem;\n    }\n    &.scrolled {\n      height: 0rem;\n    }\n  }\n  .header-additional-content{\n    display: flex;\n    flex-direction: column;\n    flex-grow: 1;\n    width: 100%;\n  }\n  .header-additional-content, .header-opacity{\n    background: oklch(0 0 0 / 0.5);\n  }\n  .header-force-blur .header-additional-content, .header-force-blur .header-opacity{\n    backdrop-filter: blur(8px);\n  }\n  .header-content{\n    *:focus-visible {\n      box-shadow: 0 0 10px 1px white !important;\n    }\n    h1 {\n      color: white !important;\n      font-size: 1.8rem;\n      margin: 2rem 5rem;\n      @media (width <= 550px) {\n        font-size: 1rem;\n        margin: 1rem 0.5rem 0.5rem;\n      }\n    }\n    .admin-button:hover,\n    .share-btn:hover {\n      background: white;\n    }\n  }\n}\n</style>\n","<template>\n  <header\n    role=\"banner\"\n    class=\"header-saooti-play\"\n    :style=\"headerBackgroundImage\"\n    :class=\"[generalStore.contentToDisplay ? 'header-img-bg':'bg-gradient', scrolled? 'scrolled':'', needToBlur ? 'header-force-blur':'']\"\n  >\n    <TopBarMainContent\n      :is-phone=\"isPhone\"\n      :scrolled=\"scrolled\"\n      :title-display=\"titleToDisplay\"\n      style=\"height: var(--header-size);\"\n      :class=\"headerBackgroundImage.length ? 'header-opacity':''\"\n      :options=\"options?.topBarMainContent\"\n    />\n  </header>\n\n  <div\n    v-if=\"generalStore.contentToDisplay\"\n    class=\"header-content-bg\"\n    :style=\"headerBackgroundImage\"\n    :class=\"{ scrolled: scrolled, 'header-force-blur':needToBlur }\"\n  >\n    <div class=\"header-additional-content header-content\">\n      <h1 v-if=\"!scrolled\" class=\"text-truncate\">\n        {{ titleToDisplay }}\n      </h1>\n      <SubscribeButtons\n        v-if=\"!authStore.isGarRole && content\"\n        v-show=\"!scrolled\"\n        :content=\"content\"\n        :window-width=\"windowWidth\"\n      />\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport {useImageProxy} from \"../composable/useImageProxy\";\nimport TopBarMainContent, { type TopBarMainContentOptions } from \"./TopBarMainContent.vue\";\nimport { computed, defineAsyncComponent, onBeforeUnmount, onMounted, ref, watch } from \"vue\";\nimport { useAuthStore } from \"../../stores/AuthStore\";\nimport { useGeneralStore } from \"../../stores/GeneralStore\";\nimport { Podcast } from \"@/stores/class/general/podcast\";\nimport { Emission } from \"@/stores/class/general/emission\";\nimport {useResizePhone} from \"../composable/useResizePhone\";\nimport { Playlist } from \"@/stores/class/general/playlist\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport axios from \"axios\";\nconst SubscribeButtons = defineAsyncComponent(\n  () => import(\"../display/sharing/SubscribeButtons.vue\"),\n);\n\ndefineProps<{\n  options?: {\n    topBarMainContent?: TopBarMainContentOptions\n  }\n}>();\n\n//Data \nconst scrolled = ref(false);\nconst oldScrollY = ref(0);\nconst minScroll = ref(0);\nconst headerBackgroundImage = ref(\"\");\nconst needToBlur = ref(false);\n\n\n//Composables\nconst { isPhone, windowWidth } = useResizePhone();\nconst { useProxyImageUrl } = useImageProxy();\nconst authStore = useAuthStore();\nconst generalStore = useGeneralStore();\n\n//Computed\nconst titleToDisplay = computed(() => {\n  if ((generalStore.contentToDisplay as Podcast)?.podcastId) {\n    return (generalStore.contentToDisplay as Podcast).emission.name;\n  }\n  if ((generalStore.contentToDisplay as Playlist)?.playlistId) {\n    return (generalStore.contentToDisplay as Playlist).title;\n  }\n  if ((generalStore.contentToDisplay as Emission)?.emissionId) {\n    return (generalStore.contentToDisplay as Emission).name;\n  }\n  if ((generalStore.contentToDisplay as Canal)?.id) {\n    return (generalStore.contentToDisplay as Canal).name;\n  }\n  return \"\";\n});\n\n/** The element displayed by the subscribe buttons */\nconst content = computed(() => {\n  if ((generalStore.contentToDisplay as Podcast)?.podcastId) {\n    return (generalStore.contentToDisplay as Podcast).emission;\n  }\n  if ((generalStore.contentToDisplay as Emission)?.emissionId) {\n    return generalStore.contentToDisplay as Emission;\n  }\n  if ((generalStore.contentToDisplay as Playlist)?.playlistId) {\n    return generalStore.contentToDisplay as Playlist;\n  }\n  return null;\n});\n\n//Watch\nwatch(()=>generalStore.contentToDisplay, async () => {\n  if(!generalStore.contentToDisplay){\n    headerBackgroundImage.value = \"\";\n    needToBlur.value = false;\n    return;\n  }\n  const widthAsked = window.innerWidth > 960 ? \"1600\":\"1000\";\n  const proxyUrl = useProxyImageUrl(generalStore.contentToDisplay.imageUrl, widthAsked, undefined, true);\n  try {\n    const result = await axios.get(proxyUrl);\n    headerBackgroundImage.value = `background-image: url('${result.data}');`;\n    needToBlur.value = result.data === generalStore.contentToDisplay.imageUrl;\n  } catch {\n    if (generalStore.contentToDisplay.imageUrl) {\n      const url = encodeURI(generalStore.contentToDisplay.imageUrl);\n      headerBackgroundImage.value = `background-image: url('${url}');`;\n      needToBlur.value = true;\n    } else {\n      headerBackgroundImage.value = '';\n    }\n  }\n}, {deep: true, immediate: true});\n\n\nonMounted(()=>{\n  window.addEventListener(\"scroll\", handleScroll);\n})\nonBeforeUnmount(() => {\n  window.removeEventListener(\"scroll\", handleScroll);\n})\n\n\n//Methods\nfunction handleScroll(): void {\n  if (\n    window.scrollY - oldScrollY.value > 0 &&\n    window.scrollY > 1 &&\n    document.body.offsetHeight - window.innerHeight > 40\n  ) {\n    if (!scrolled.value) {\n      scrolled.value = true;\n      minScroll.value = 0;\n    }\n  } else if (\n    window.scrollY - oldScrollY.value  < 0 &&\n    window.scrollY < 1 &&\n    minScroll.value > 20\n  ) {\n    scrolled.value = false;\n    minScroll.value = 0;\n  }\n  oldScrollY.value  = window.scrollY;\n  if (minScroll.value < window.scrollY) {\n    minScroll.value = window.scrollY;\n  }\n}\n</script>\n\n<style lang=\"scss\">\n.octopus-app {\n  --header-size: 5rem;\n  --header-additional-content-size: 22rem;\n  @media (width <= 650px) {\n    --header-size: 3.5rem;\n  }\n  @media (width <= 550px) {\n    --header-additional-content-size: 13rem;\n  }\n  .header-saooti-play{\n    z-index: 11;\n    position: sticky;\n    top: 0;\n    background-color: black;\n    &.header-img-bg{\n      background-position: center -20vw;\n      background-repeat: no-repeat;\n      background-size: cover;\n    }\n    &.bg-gradient, &.scrolled{\n      box-shadow: 0 2px 15px 5px var(--octopus-shadow) !important; \n    }\n  }\n  .header-content-bg{\n    background-position: center calc(calc(var(--header-size) * -1) - 20vw);\n    background-repeat: no-repeat;\n    background-size: cover;\n    width: 100%;\n    display: flex;\n    background-color: black;\n    transition: height 0.7s;\n    height: calc(var(--header-additional-content-size) - var(--header-size));\n    @starting-style {\n      height: 0rem;\n    }\n    &.scrolled {\n      height: 0rem;\n    }\n  }\n  .header-additional-content{\n    display: flex;\n    flex-direction: column;\n    flex-grow: 1;\n    width: 100%;\n  }\n  .header-additional-content, .header-opacity{\n    background: oklch(0 0 0 / 0.5);\n  }\n  .header-force-blur .header-additional-content, .header-force-blur .header-opacity{\n    backdrop-filter: blur(8px);\n  }\n  .header-content{\n    *:focus-visible {\n      box-shadow: 0 0 10px 1px white !important;\n    }\n    h1 {\n      color: white !important;\n      font-size: 1.8rem;\n      margin: 2rem 5rem;\n      @media (width <= 550px) {\n        font-size: 1rem;\n        margin: 1rem 0.5rem 0.5rem;\n      }\n    }\n    .admin-button:hover,\n    .share-btn:hover {\n      background: white;\n    }\n  }\n}\n</style>\n"],"mappings":"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"}

package/dist/TopBar-cTlaCeTY.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TopBar-cTlaCeTY.mjs","names":[],"sources":["../src/components/misc/RightsScopeSelector.vue","../src/components/misc/RightsScopeSelector.vue","../src/components/misc/RightsScopeMenu.vue","../src/components/misc/RightsScopeMenu.vue","../src/components/misc/TopBarMainContent.vue","../src/components/misc/TopBarMainContent.vue","../src/components/misc/TopBar.vue","../src/components/misc/TopBar.vue"],"sourcesContent":["<template>\n    <div\n        v-if=\"subOrganisations.length > 0\"\n        class=\"d-flex flex-column ms-4\"\n    >\n        <span class=\"label mb-1\">\n            {{ t('RightsScopeSelector - Title', { rubriquage: rubriquage?.title}) }}\n        </span>\n        <div class=\"d-flex value\">\n            <button\n                type=\"button\"\n                class=\"btn-transparent d-flex align-items-center\"\n                aria-controls=\"suborga-list-menu\"\n                :aria-expanded=\"open\"\n                @click=\"$emit('change')\"\n            >\n                <span\n                    v-if=\"selectedSubOrganisation\"\n                    class=\"me-2 selected\"\n                >\n                    {{ selectedSubOrganisation.name }}\n                </span>\n                <span v-else class=\"me-2\">\n                    {{ t('RightsScopeSelector - No filter') }}\n                </span>\n                <SwapIcon class=\"icon\" />\n            </button>\n            <button\n                v-if=\"selectedSubOrganisation\"\n                type=\"button\"\n                class=\"btn-transparent\"\n                @click=\"unselectSubOrganisation\"\n            >\n                <ClearIcon\n                    class=\"icon\"\n                    :title=\"t('RightsScopeSelector - Clear filter')\"\n                />\n            </button>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { useAuthStore } from \"../../stores/AuthStore\";\nimport { ref, toRef, watch } from \"vue\";\nimport { useSubOrganisations } from \"../composable/useSubOrganisations\";\nimport { Rubriquage } from \"@/stores/class/rubrique/rubriquage\";\nimport { rubriquesApi } from \"@/api\";\n\nimport SwapIcon from \"vue-material-design-icons/SwapHorizontalCircleOutline.vue\";\nimport ClearIcon from \"vue-material-design-icons/CloseCircleOutline.vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Composables\nconst { t } = useI18n();\nconst authStore = useAuthStore();\nconst authOrgaId = toRef(authStore, 'authOrgaId');\nconst rubriquage = ref<Rubriquage|null>(null);\nconst {\n    selectedSubOrganisation,\n    subOrganisations,\n    unselectSubOrganisation\n} = useSubOrganisations(authOrgaId);\n\ndefineProps<{\n    /** Whether the sub organisation menu controlled by this selector is open */\n    open?: boolean;\n}>();\n\ndefineEmits<{\n    (e: 'change'): void;\n}>();\n\nwatch(authOrgaId, async () => {\n    rubriquage.value = await rubriquesApi.findRestrictiveRubriquage(authOrgaId.value);\n}, { immediate: true });\n</script>\n\n<style scoped lang=\"scss\">\n#header-scope-selector:deep(.octopus-select-field) {\n    background: transparent;\n    border-color: rgba(255, 255, 255, 0.1);\n    margin-left: 200px;\n\n    .octopus-select-value {\n        color: var(--octopus-secondary);\n        font-weight: bold;\n        align-content: center;\n    }\n\n    input {\n        color: white;\n    }\n\n    button {\n        color: rgba(255, 255, 255, 0.3);\n    }\n}\n\n.value {\n    color: var(--octopus-secondary);\n    font-weight: bold;\n    align-content: center;\n    align-items: center;\n\n    button {\n        color: inherit;\n        font-weight: inherit;\n        text-align: start;\n        padding: 0;\n    }\n\n    span:not(.selected):not(.icon) {\n        opacity: .5;\n        transition: opacity .5s;\n\n        &:hover {\n            opacity: .7;\n        }\n    }\n}\n\n.label {\n    color: rgba(255, 255, 255, 0.3);\n    font-weight: 600;\n    font-style: italic;\n    font-size: 14px;\n    white-space: nowrap;\n    overflow-y: visible;\n}\n\n.icon {\n    opacity: .7;\n    transition: opacity .5s;\n\n    &:hover {\n        opacity: 1;\n    }\n}\n</style>\n","<template>\n    <div\n        v-if=\"subOrganisations.length > 0\"\n        class=\"d-flex flex-column ms-4\"\n    >\n        <span class=\"label mb-1\">\n            {{ t('RightsScopeSelector - Title', { rubriquage: rubriquage?.title}) }}\n        </span>\n        <div class=\"d-flex value\">\n            <button\n                type=\"button\"\n                class=\"btn-transparent d-flex align-items-center\"\n                aria-controls=\"suborga-list-menu\"\n                :aria-expanded=\"open\"\n                @click=\"$emit('change')\"\n            >\n                <span\n                    v-if=\"selectedSubOrganisation\"\n                    class=\"me-2 selected\"\n                >\n                    {{ selectedSubOrganisation.name }}\n                </span>\n                <span v-else class=\"me-2\">\n                    {{ t('RightsScopeSelector - No filter') }}\n                </span>\n                <SwapIcon class=\"icon\" />\n            </button>\n            <button\n                v-if=\"selectedSubOrganisation\"\n                type=\"button\"\n                class=\"btn-transparent\"\n                @click=\"unselectSubOrganisation\"\n            >\n                <ClearIcon\n                    class=\"icon\"\n                    :title=\"t('RightsScopeSelector - Clear filter')\"\n                />\n            </button>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { useAuthStore } from \"../../stores/AuthStore\";\nimport { ref, toRef, watch } from \"vue\";\nimport { useSubOrganisations } from \"../composable/useSubOrganisations\";\nimport { Rubriquage } from \"@/stores/class/rubrique/rubriquage\";\nimport { rubriquesApi } from \"@/api\";\n\nimport SwapIcon from \"vue-material-design-icons/SwapHorizontalCircleOutline.vue\";\nimport ClearIcon from \"vue-material-design-icons/CloseCircleOutline.vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Composables\nconst { t } = useI18n();\nconst authStore = useAuthStore();\nconst authOrgaId = toRef(authStore, 'authOrgaId');\nconst rubriquage = ref<Rubriquage|null>(null);\nconst {\n    selectedSubOrganisation,\n    subOrganisations,\n    unselectSubOrganisation\n} = useSubOrganisations(authOrgaId);\n\ndefineProps<{\n    /** Whether the sub organisation menu controlled by this selector is open */\n    open?: boolean;\n}>();\n\ndefineEmits<{\n    (e: 'change'): void;\n}>();\n\nwatch(authOrgaId, async () => {\n    rubriquage.value = await rubriquesApi.findRestrictiveRubriquage(authOrgaId.value);\n}, { immediate: true });\n</script>\n\n<style scoped lang=\"scss\">\n#header-scope-selector:deep(.octopus-select-field) {\n    background: transparent;\n    border-color: rgba(255, 255, 255, 0.1);\n    margin-left: 200px;\n\n    .octopus-select-value {\n        color: var(--octopus-secondary);\n        font-weight: bold;\n        align-content: center;\n    }\n\n    input {\n        color: white;\n    }\n\n    button {\n        color: rgba(255, 255, 255, 0.3);\n    }\n}\n\n.value {\n    color: var(--octopus-secondary);\n    font-weight: bold;\n    align-content: center;\n    align-items: center;\n\n    button {\n        color: inherit;\n        font-weight: inherit;\n        text-align: start;\n        padding: 0;\n    }\n\n    span:not(.selected):not(.icon) {\n        opacity: .5;\n        transition: opacity .5s;\n\n        &:hover {\n            opacity: .7;\n        }\n    }\n}\n\n.label {\n    color: rgba(255, 255, 255, 0.3);\n    font-weight: 600;\n    font-style: italic;\n    font-size: 14px;\n    white-space: nowrap;\n    overflow-y: visible;\n}\n\n.icon {\n    opacity: .7;\n    transition: opacity .5s;\n\n    &:hover {\n        opacity: 1;\n    }\n}\n</style>\n","<template>\n    <div\n        id=\"suborga-list-menu\"\n        ref=\"menuNav\"\n        role=\"dialog\"\n        aria-labelledby=\"suborga-list-menu-title\"\n        :class=\"{ shown: open }\"\n        :inert=\"!open\"\n    >\n        <button\n            type=\"button\"\n            class=\"btn-transparent close-btn\"\n            @click=\"close\"\n        >\n            <CloseIcon :title=\"t('Close')\" />\n        </button>\n\n        <div class=\"search\">\n            <h3 id=\"suborga-list-menu-title\">\n                {{ t('RightsScopeMenu - Title') }}\n            </h3>\n            <ClassicInputText\n                v-model:text-init=\"search\"\n                :placeholder=\"t('RightsScopeMenu - Search')\"\n                can-be-null\n            />\n        </div>\n\n        <div v-if=\"showFirstList\" class=\"suborga-list mb-4\">\n            <h4>{{ t('RightsScopeMenu - First list - Title') }}</h4>\n            <span\n                v-for=\"suborga in userSubOrgas\"\n                :key=\"suborga.id\"\n                class=\"suborga\"\n                @click=\"select(suborga)\"\n            >\n                {{ suborga.name }}\n            </span>\n        </div>\n\n        <div class=\"suborga-list\">\n            <h4>{{ secondListTitle }}</h4>\n\n            <div v-if=\"showLetters\" class=\"letters mt-2\">\n                <button\n                    v-for=\"letter in 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'\"\n                    :key=\"letter\"\n                    type=\"button\"\n                    class=\"letter\"\n                    :title=\"subOrgaByLetter.has(letter) ? undefined : t('RightsScopeMenu - Letters - No sub orga for letter')\"\n                    :disabled=\"!subOrgaByLetter.has(letter)\"\n                    @click=\"scrollToLetter(letter)\"\n                >\n                    {{ letter }}\n                </button>\n            </div>\n\n            <div\n                v-for=\"[letter, suborgaForLetter] in subOrgaByLetter\"\n                :key=\"'suborgas-' + letter\"\n            >\n                <div\n                    :id=\"'suborga-letter-' + letter\"\n                    class=\"letter\"\n                    tabindex=\"-1\"\n                >\n                    {{ letter }}\n                </div>\n                <span\n                    v-for=\"suborga in suborgaForLetter\"\n                    :key=\"suborga.id\"\n                    class=\"suborga\"\n                    @click=\"select(suborga)\"\n                >\n                    {{ suborga.name }}\n                </span>\n            </div>\n        </div>\n\n        <p role=\"status\" class=\"text-indic px-3\">\n            <template v-if=\"noResult\">\n                {{ t('RightsScopeMenu - No result') }}\n            </template>\n        </p>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, defineAsyncComponent, nextTick, onUnmounted, ref, toRef, useTemplateRef, watch } from 'vue';\nimport { getClassicInputText, useAuthStore } from '@saooti/octopus-sdk'; \nimport { SubOrganisation, useSubOrganisations } from '../composable/useSubOrganisations';\nimport { useI18n } from 'vue-i18n';\nimport CloseIcon from 'vue-material-design-icons/Close.vue';\n\nconst ClassicInputText = defineAsyncComponent(getClassicInputText);\n\nconst { t } = useI18n();\n\n///////////////////////////////\n// Menu\n///////////////////////////////\nconst props = defineProps<{\n    open?: boolean;\n}>();\n\nconst emit = defineEmits<{\n    (e: 'update:open', open: boolean): void;\n}>();\n\nconst menuNav = useTemplateRef('menuNav');\nlet previousFocus: HTMLElement | null = null;\n\nwatch(() => props.open, async open => {\n    if (open) {\n        previousFocus = document.activeElement as HTMLElement | null;\n        setTimeout(() => document.addEventListener('click', openOnClick), 200);\n        document.addEventListener('keydown', closeOnEscape);\n        // Wait for the menu to no longer be inert before focusing\n        await nextTick();\n        menuNav.value?.querySelector('input')?.focus();\n    } else {\n        removeListeners();\n        // Only give focus back if it would otherwise be lost (inside the\n        // closed menu, or on body), to avoid stealing it after a click\n        // elsewhere\n        const active = document.activeElement;\n        if (active === document.body || menuNav.value?.contains(active)) {\n            previousFocus?.focus();\n        }\n    }\n});\n\nonUnmounted(removeListeners);\n\nfunction removeListeners(): void {\n    document.removeEventListener('click', openOnClick);\n    document.removeEventListener('keydown', closeOnEscape);\n}\n\nfunction close(): void {\n    emit('update:open', false);\n}\n\nfunction openOnClick(event: MouseEvent) {\n    const menu = menuNav.value;\n    if (props.open && event.target && !menu?.contains(event.target as Node)) {\n        close();\n    }\n}\n\nfunction closeOnEscape(event: KeyboardEvent): void {\n    if (event.key === 'Escape') {\n        close();\n    }\n}\n\nfunction prefersReducedMotion(): boolean {\n    return window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n}\n\n///////////////////////////////\n// Display list\n///////////////////////////////\nconst search = ref('');\nconst authStore = useAuthStore();\nconst { subOrganisations, selectSubOrganisation } = useSubOrganisations(toRef(authStore, 'authOrgaId'));\n\nfunction normalize(str: string): string {\n    // Separate accented character in letter/diacritic, then remove the\n    // diacritic\n    return str.toUpperCase().normalize(\"NFD\").replace(/\\p{Diacritic}/gu, '');\n}\n\nconst normalizedSearch = computed((): string => {\n    return normalize(search.value);\n});\n\nconst userSubOrgas = computed((): Array<SubOrganisation> => {\n    const userScope = authStore.userScope;\n    return subOrganisations.value\n        .filter(sub => sub.name.includes(normalizedSearch.value))\n        .filter(sub => userScope.includes(sub.id))\n        .sort((o1, o2) => o1.name.localeCompare(o2.name))\n    ;\n});\n\nconst showFirstList = computed((): boolean => {\n    return userSubOrgas.value.length > 0;\n});\n\nconst secondListTitle = computed((): string => {\n    const userScope = authStore.userScope;\n    if (userScope.length === 0) {\n        return t('RightsScopeMenu - Second list - Title unscoped');\n    } else {\n        return t('RightsScopeMenu - Second list - Title scoped');\n    }\n});\n\nconst showLetters = computed((): boolean => {\n    return subOrganisations.value.length > 10;\n});\n\nconst subOrgaByLetter = computed((): Map<string, Array<SubOrganisation>> => {\n    const data: Map<string, Array<SubOrganisation>> = new Map();\n\n    const filtered = subOrganisations.value\n        .filter(sub => sub.name.includes(normalizedSearch.value))\n        .filter(sub => !userSubOrgas.value.includes(sub))\n        .sort((o1, o2) => o1.name.localeCompare(o2.name))\n    ;\n\n    if (showLetters.value) {\n        filtered.forEach((sub: SubOrganisation) => {\n            const firstLetter = sub.name[0];\n            if (data.has(firstLetter)) {\n                const present = data.get(firstLetter);\n                present!.push(sub);\n            } else {\n                data.set(firstLetter, [sub]);\n            }\n        });\n    } else {\n        data.set(null, filtered);\n    }\n\n    data.values().forEach(ary => ary.sort((a, b) => a.name.localeCompare(b.name)));\n\n    return data;\n});\n\nconst noResult = computed((): boolean => {\n    return !showFirstList.value\n        && [...subOrgaByLetter.value.values()].every(ary => ary.length === 0);\n});\n\nfunction scrollToLetter(letter: string): void {\n    if (!subOrgaByLetter.value.has(letter)) {\n        return;\n    }\n    const container = menuNav.value;\n    const target: HTMLElement | null | undefined = container?.querySelector(`#suborga-letter-${letter}`);\n    if (container && target) {\n        container.scrollTo({\n            top: target.offsetTop,\n            behavior: prefersReducedMotion() ? 'auto' : 'smooth'\n        });\n        target.focus({ preventScroll: true });\n    }\n}\n\n///////////////////////////////\n// Sub orga selection\n///////////////////////////////\nfunction select(org: SubOrganisation): void {\n    selectSubOrganisation(org);\n    emit('update:open', false);\n}\n</script>\n\n<style scoped lang=\"scss\">\n#suborga-list-menu-btn {\n    transition: rotate 0.3s ease-out;\n    \n    &.active {\n        rotate: 90deg;\n    }\n}\n\n#suborga-list-menu {\n    z-index: 100;\n    \n    --width: 30dvw;\n\n    // Positioning\n    position: fixed;\n    left: 0;\n    top: 0;\n    width: var(--width);\n    height: 100dvh;\n\n    // Margins\n    padding: 1.5em 0;\n\n    // Overflow\n    overflow-y: auto;\n\n    // Style\n    background-color: white;\n    //border-radius: 0 var(--octopus-border-radius);\n    border-right: 2px solid var(--octopus-primary);\n\n    // Animation\n    @media (prefers-reduced-motion: no-preference) {\n        transition: left 0.6s ease-out;\n    }\n\n    &.shown {\n        left: 0;\n    }\n\n    &:not(.shown) {\n        left: calc(var(--width) * -1);\n    }\n\n    @media(width <= 960px) {\n        --width: 100dvw;\n    }\n}\n\n.close-btn {\n    position: absolute;\n    top: 0.5rem;\n    right: 0.5rem;\n}\n\nh4 {\n    margin-left: 10px;\n    color: var(--octopus-primary);\n}\n\n.letter {\n    color: var(--pm-accent);\n    font-weight: bold;\n    font-size: 1em;\n    background-color: oklch(from var(--pm-accent) l c h / 15%);\n}\n\n.search {\n    padding: 0 1rem;\n\n    h3 {\n        color: var(--pm-accent);\n        text-align: center;\n    }\n}\n\n.letters {\n    display: grid;\n    grid-template-columns: repeat(9, 28px);\n    width: fit-content;\n    margin: auto;\n\n    .letter {\n        border: none;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        color: black;\n        margin: 7px 0 8px;\n        width: 24px;\n        height: 24px;\n        border-radius: 8px;\n        font-size: 12px;\n        padding: 0 !important;\n        cursor: pointer;\n\n        &:disabled {\n            background-color: #EBF3FE;\n            cursor: not-allowed;\n        }\n    }\n}\n\n.suborga-list {\n    .letter {\n        padding: 0.1rem 1rem;\n        color: var(--octopus-primary);\n    }\n\n    .suborga {\n        display: block;\n        padding: 0.5rem 1.4rem;\n        cursor: pointer;\n\n        &:not(:last-child) {\n            border-bottom: 1px solid var(--octopus-primary-really-transparent);\n        }\n    }\n}\n</style>\n","<template>\n    <div\n        id=\"suborga-list-menu\"\n        ref=\"menuNav\"\n        role=\"dialog\"\n        aria-labelledby=\"suborga-list-menu-title\"\n        :class=\"{ shown: open }\"\n        :inert=\"!open\"\n    >\n        <button\n            type=\"button\"\n            class=\"btn-transparent close-btn\"\n            @click=\"close\"\n        >\n            <CloseIcon :title=\"t('Close')\" />\n        </button>\n\n        <div class=\"search\">\n            <h3 id=\"suborga-list-menu-title\">\n                {{ t('RightsScopeMenu - Title') }}\n            </h3>\n            <ClassicInputText\n                v-model:text-init=\"search\"\n                :placeholder=\"t('RightsScopeMenu - Search')\"\n                can-be-null\n            />\n        </div>\n\n        <div v-if=\"showFirstList\" class=\"suborga-list mb-4\">\n            <h4>{{ t('RightsScopeMenu - First list - Title') }}</h4>\n            <span\n                v-for=\"suborga in userSubOrgas\"\n                :key=\"suborga.id\"\n                class=\"suborga\"\n                @click=\"select(suborga)\"\n            >\n                {{ suborga.name }}\n            </span>\n        </div>\n\n        <div class=\"suborga-list\">\n            <h4>{{ secondListTitle }}</h4>\n\n            <div v-if=\"showLetters\" class=\"letters mt-2\">\n                <button\n                    v-for=\"letter in 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'\"\n                    :key=\"letter\"\n                    type=\"button\"\n                    class=\"letter\"\n                    :title=\"subOrgaByLetter.has(letter) ? undefined : t('RightsScopeMenu - Letters - No sub orga for letter')\"\n                    :disabled=\"!subOrgaByLetter.has(letter)\"\n                    @click=\"scrollToLetter(letter)\"\n                >\n                    {{ letter }}\n                </button>\n            </div>\n\n            <div\n                v-for=\"[letter, suborgaForLetter] in subOrgaByLetter\"\n                :key=\"'suborgas-' + letter\"\n            >\n                <div\n                    :id=\"'suborga-letter-' + letter\"\n                    class=\"letter\"\n                    tabindex=\"-1\"\n                >\n                    {{ letter }}\n                </div>\n                <span\n                    v-for=\"suborga in suborgaForLetter\"\n                    :key=\"suborga.id\"\n                    class=\"suborga\"\n                    @click=\"select(suborga)\"\n                >\n                    {{ suborga.name }}\n                </span>\n            </div>\n        </div>\n\n        <p role=\"status\" class=\"text-indic px-3\">\n            <template v-if=\"noResult\">\n                {{ t('RightsScopeMenu - No result') }}\n            </template>\n        </p>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, defineAsyncComponent, nextTick, onUnmounted, ref, toRef, useTemplateRef, watch } from 'vue';\nimport { getClassicInputText, useAuthStore } from '@saooti/octopus-sdk'; \nimport { SubOrganisation, useSubOrganisations } from '../composable/useSubOrganisations';\nimport { useI18n } from 'vue-i18n';\nimport CloseIcon from 'vue-material-design-icons/Close.vue';\n\nconst ClassicInputText = defineAsyncComponent(getClassicInputText);\n\nconst { t } = useI18n();\n\n///////////////////////////////\n// Menu\n///////////////////////////////\nconst props = defineProps<{\n    open?: boolean;\n}>();\n\nconst emit = defineEmits<{\n    (e: 'update:open', open: boolean): void;\n}>();\n\nconst menuNav = useTemplateRef('menuNav');\nlet previousFocus: HTMLElement | null = null;\n\nwatch(() => props.open, async open => {\n    if (open) {\n        previousFocus = document.activeElement as HTMLElement | null;\n        setTimeout(() => document.addEventListener('click', openOnClick), 200);\n        document.addEventListener('keydown', closeOnEscape);\n        // Wait for the menu to no longer be inert before focusing\n        await nextTick();\n        menuNav.value?.querySelector('input')?.focus();\n    } else {\n        removeListeners();\n        // Only give focus back if it would otherwise be lost (inside the\n        // closed menu, or on body), to avoid stealing it after a click\n        // elsewhere\n        const active = document.activeElement;\n        if (active === document.body || menuNav.value?.contains(active)) {\n            previousFocus?.focus();\n        }\n    }\n});\n\nonUnmounted(removeListeners);\n\nfunction removeListeners(): void {\n    document.removeEventListener('click', openOnClick);\n    document.removeEventListener('keydown', closeOnEscape);\n}\n\nfunction close(): void {\n    emit('update:open', false);\n}\n\nfunction openOnClick(event: MouseEvent) {\n    const menu = menuNav.value;\n    if (props.open && event.target && !menu?.contains(event.target as Node)) {\n        close();\n    }\n}\n\nfunction closeOnEscape(event: KeyboardEvent): void {\n    if (event.key === 'Escape') {\n        close();\n    }\n}\n\nfunction prefersReducedMotion(): boolean {\n    return window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n}\n\n///////////////////////////////\n// Display list\n///////////////////////////////\nconst search = ref('');\nconst authStore = useAuthStore();\nconst { subOrganisations, selectSubOrganisation } = useSubOrganisations(toRef(authStore, 'authOrgaId'));\n\nfunction normalize(str: string): string {\n    // Separate accented character in letter/diacritic, then remove the\n    // diacritic\n    return str.toUpperCase().normalize(\"NFD\").replace(/\\p{Diacritic}/gu, '');\n}\n\nconst normalizedSearch = computed((): string => {\n    return normalize(search.value);\n});\n\nconst userSubOrgas = computed((): Array<SubOrganisation> => {\n    const userScope = authStore.userScope;\n    return subOrganisations.value\n        .filter(sub => sub.name.includes(normalizedSearch.value))\n        .filter(sub => userScope.includes(sub.id))\n        .sort((o1, o2) => o1.name.localeCompare(o2.name))\n    ;\n});\n\nconst showFirstList = computed((): boolean => {\n    return userSubOrgas.value.length > 0;\n});\n\nconst secondListTitle = computed((): string => {\n    const userScope = authStore.userScope;\n    if (userScope.length === 0) {\n        return t('RightsScopeMenu - Second list - Title unscoped');\n    } else {\n        return t('RightsScopeMenu - Second list - Title scoped');\n    }\n});\n\nconst showLetters = computed((): boolean => {\n    return subOrganisations.value.length > 10;\n});\n\nconst subOrgaByLetter = computed((): Map<string, Array<SubOrganisation>> => {\n    const data: Map<string, Array<SubOrganisation>> = new Map();\n\n    const filtered = subOrganisations.value\n        .filter(sub => sub.name.includes(normalizedSearch.value))\n        .filter(sub => !userSubOrgas.value.includes(sub))\n        .sort((o1, o2) => o1.name.localeCompare(o2.name))\n    ;\n\n    if (showLetters.value) {\n        filtered.forEach((sub: SubOrganisation) => {\n            const firstLetter = sub.name[0];\n            if (data.has(firstLetter)) {\n                const present = data.get(firstLetter);\n                present!.push(sub);\n            } else {\n                data.set(firstLetter, [sub]);\n            }\n        });\n    } else {\n        data.set(null, filtered);\n    }\n\n    data.values().forEach(ary => ary.sort((a, b) => a.name.localeCompare(b.name)));\n\n    return data;\n});\n\nconst noResult = computed((): boolean => {\n    return !showFirstList.value\n        && [...subOrgaByLetter.value.values()].every(ary => ary.length === 0);\n});\n\nfunction scrollToLetter(letter: string): void {\n    if (!subOrgaByLetter.value.has(letter)) {\n        return;\n    }\n    const container = menuNav.value;\n    const target: HTMLElement | null | undefined = container?.querySelector(`#suborga-letter-${letter}`);\n    if (container && target) {\n        container.scrollTo({\n            top: target.offsetTop,\n            behavior: prefersReducedMotion() ? 'auto' : 'smooth'\n        });\n        target.focus({ preventScroll: true });\n    }\n}\n\n///////////////////////////////\n// Sub orga selection\n///////////////////////////////\nfunction select(org: SubOrganisation): void {\n    selectSubOrganisation(org);\n    emit('update:open', false);\n}\n</script>\n\n<style scoped lang=\"scss\">\n#suborga-list-menu-btn {\n    transition: rotate 0.3s ease-out;\n    \n    &.active {\n        rotate: 90deg;\n    }\n}\n\n#suborga-list-menu {\n    z-index: 100;\n    \n    --width: 30dvw;\n\n    // Positioning\n    position: fixed;\n    left: 0;\n    top: 0;\n    width: var(--width);\n    height: 100dvh;\n\n    // Margins\n    padding: 1.5em 0;\n\n    // Overflow\n    overflow-y: auto;\n\n    // Style\n    background-color: white;\n    //border-radius: 0 var(--octopus-border-radius);\n    border-right: 2px solid var(--octopus-primary);\n\n    // Animation\n    @media (prefers-reduced-motion: no-preference) {\n        transition: left 0.6s ease-out;\n    }\n\n    &.shown {\n        left: 0;\n    }\n\n    &:not(.shown) {\n        left: calc(var(--width) * -1);\n    }\n\n    @media(width <= 960px) {\n        --width: 100dvw;\n    }\n}\n\n.close-btn {\n    position: absolute;\n    top: 0.5rem;\n    right: 0.5rem;\n}\n\nh4 {\n    margin-left: 10px;\n    color: var(--octopus-primary);\n}\n\n.letter {\n    color: var(--pm-accent);\n    font-weight: bold;\n    font-size: 1em;\n    background-color: oklch(from var(--pm-accent) l c h / 15%);\n}\n\n.search {\n    padding: 0 1rem;\n\n    h3 {\n        color: var(--pm-accent);\n        text-align: center;\n    }\n}\n\n.letters {\n    display: grid;\n    grid-template-columns: repeat(9, 28px);\n    width: fit-content;\n    margin: auto;\n\n    .letter {\n        border: none;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        color: black;\n        margin: 7px 0 8px;\n        width: 24px;\n        height: 24px;\n        border-radius: 8px;\n        font-size: 12px;\n        padding: 0 !important;\n        cursor: pointer;\n\n        &:disabled {\n            background-color: #EBF3FE;\n            cursor: not-allowed;\n        }\n    }\n}\n\n.suborga-list {\n    .letter {\n        padding: 0.1rem 1rem;\n        color: var(--octopus-primary);\n    }\n\n    .suborga {\n        display: block;\n        padding: 0.5rem 1.4rem;\n        cursor: pointer;\n\n        &:not(:last-child) {\n            border-bottom: 1px solid var(--octopus-primary-really-transparent);\n        }\n    }\n}\n</style>\n","<template>\n    <div class=\"top-bar-grid header-content\" :class=\"{ scrolled: titleIsDisplayed }\">\n        <div class=\"d-flex align-items-center\">\n            <!-- Logo to the left -->\n            <router-link\n                class=\"top-bar-logo d-block\"\n                :to=\"{\n                    name: 'home',\n                    query: getQueriesRouter('home'),\n                }\"\n                :title=\"t('Home')\"\n            >\n                <img\n                    v-if=\"!filterStore.filterOrgaId || '' === imgUrl\"\n                    :src=\"logoUrl\"\n                    aria-hidden=\"true\"\n                    alt=\"\"\n                    width=\"140\"\n                    height=\"50\"\n                    title=\"Logo\"\n                    :class=\"generalStore.platformEducation ? 'education-logo' : 'octopus-logo'\"\n                >\n                <img\n                    v-else\n                    :src=\"useProxyImageUrl(imgUrl, '', '80')\"\n                    aria-hidden=\"true\"\n                    alt=\"\"\n                    class=\"client-logo\"\n                    title=\"Logo\"\n                    :class=\"generalStore.platformEducation ? 'education-logo' : ''\"\n                >\n            </router-link>\n\n            <RightsScopeMenu v-model:open=\"menuOpen\" />\n            <RightsScopeSelector\n                class=\"ms-4\"\n                :open=\"menuOpen\"\n                @change=\"menuOpen = true\"\n            />\n        </div>\n\n        <h1 v-if=\"titleIsDisplayed\" class=\"text-truncate m-0 align-self-center\">\n            {{ titleDisplay }}\n        </h1>\n\n        <!-- Right section -->\n        <div\n            class=\"d-flex right-section\"\n            :class=\"[\n                inContentDisplayPage || isPhone\n                    ? 'flex-row-reverse align-items-center'\n                    : 'flex-column align-items-end',\n            ]\"\n        >\n            <!-- Logo to the right -->\n            <template v-if=\"filterStore.filterOrgaId && '' !== imgUrl\">\n                <img\n                    v-if=\"authStore.isGarRole\"\n                    :src=\"logoUrl\"\n                    aria-hidden=\"true\"\n                    alt=\"\"\n                    width=\"100\"\n                    height=\"29\"\n                    class=\"ms-2\"\n                    title=\"Logo\"\n                    :class=\"generalStore.platformEducation ? 'education-logo' : 'octopus-logo'\"\n                >\n                <a\n                    v-else\n                    href=\"https://www.saooti.com/\"\n                    target=\"_blank\"\n                    rel=\"noreferrer noopener\"\n                    :title=\"t('New window', {text: 'Saooti'})\"\n                >\n                    <img\n                        :src=\"logoUrl\"\n                        aria-hidden=\"true\"\n                        alt=\"\"\n                        title=\"Saooti\"\n                        width=\"100\"\n                        height=\"29\"\n                        class=\"ms-2\"\n                        :class=\"generalStore.platformEducation ? 'education-logo' : 'octopus-logo'\"\n                    >\n                </a>\n            </template>\n\n            <div role=\"navigation\" class=\"d-flex align-items-center justify-content-end flex-grow-1\">\n                <nav :aria-label=\"t('Site menu')\">\n                    <ul class=\"d-flex\">\n                        <template v-for=\"link in routerLinkArray\" :key=\"link.routeName\">\n                            <li v-if=\"link.condition\" class=\"li-style-none\">\n                                <router-link\n                                    v-show=\"!isPhone\"\n                                    :to=\"{\n                                        name: link.routeName,\n                                        query: getQueriesRouter(link.routeName),\n                                    }\"\n                                    class=\"link-hover py-2 px-3\"\n                                >\n                                    {{ link.title }}\n                                </router-link>\n                            </li>\n                        </template>\n                    </ul>\n                </nav>\n                <button\n                    v-show=\"!isPhone && !inContentDisplayPage\"\n                    id=\"more-dropdown\"\n                    :title=\"t('More')\"\n                    class=\"d-flex-column flex-nowrap align-items-center btn-transparent py-2 px-3 text-white\"\n                >\n                    <span class=\"link-hover\">\n                        {{ t(\"More\") }}\n                    </span>\n                    <ChevronDownIcon />\n                </button>\n                <ClassicPopover\n                    target=\"more-dropdown\"\n                    :only-click=\"true\"\n                    :is-fixed=\"true\"\n                    :left-pos=\"true\"\n                    :is-top-layer=\"true\"\n                >\n                    <nav class=\"d-flex flex-column\" :aria-label=\"t('Site menu')\">\n                        <ul class=\"p-0 m-0\">\n                            <template v-for=\"link in routerLinkInsideArray\" :key=\"link.routeName\">\n                                <li\n                                    v-if=\"link.condition\"\n                                    class=\"li-style-none\"\n                                >\n                                    <router-link\n                                        :to=\"{\n                                            name: link.routeName,\n                                            query: getQueriesRouter(link.routeName),\n                                        }\"\n                                        class=\"p-1 octopus-dropdown-item\"\n                                    >\n                                        {{ link.title }}\n                                    </router-link>\n                                </li>\n                            </template>\n                        </ul>\n                    </nav>\n                </ClassicPopover>\n\n                <MobileMenu\n                    :is-education=\"generalStore.platformEducation\"\n                    :show=\"mobileMenuDisplay\"\n                    :not-podcast-and-emission=\"inContentDisplayPage && !scrolled\"\n                />\n                <HomeDropdown\n                    :is-education=\"generalStore.platformEducation\"\n                    :mobile-menu-display=\"mobileMenuDisplay\"\n                    v-bind=\"options?.homeDropdown\"\n                />\n                <router-link\n                    v-show=\"!isPhone && !inContentDisplayPage\"\n                    :title=\"t('Search')\"\n                    :to=\"{\n                        name: 'podcasts',\n                    }\"\n                    class=\"btn admin-button m-1 text-blue-octopus\"\n                    role=\"search\"\n                >\n                    <MagnifyIcon :size=\"30\" />\n                </router-link>\n            </div>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ChevronDownIcon from \"vue-material-design-icons/ChevronDown.vue\";\nimport MagnifyIcon from \"vue-material-design-icons/Magnify.vue\";\nimport { useRubriquesFilterComputed } from \"../composable/route/useRubriquesFilterComputed\";\nimport { state } from \"../../stores/ParamSdkStore\";\nimport HomeDropdown, { type HomeDropdownProps } from \"./HomeDropdown.vue\";\nimport {useImageProxy} from \"../composable/useImageProxy\";\nimport { useFilterStore } from \"../../stores/FilterStore\";\nimport { useAuthStore } from \"../../stores/AuthStore\";\nimport ClassicPopover from \"../misc/ClassicPopover.vue\";\nimport { defineAsyncComponent, computed, ref } from \"vue\";\nimport { useGeneralStore } from \"../../stores/GeneralStore\";\nimport { useI18n } from \"vue-i18n\";\nimport RightsScopeSelector from \"./RightsScopeSelector.vue\";\nimport RightsScopeMenu from \"./RightsScopeMenu.vue\"; \nconst MobileMenu = defineAsyncComponent(() => import(\"./MobileMenu.vue\"));\n\nexport interface TopBarMainContentOptions {\n    homeDropdown?: HomeDropdownProps;\n}\n\nexport interface TopBarMainContentProps {\n    isPhone?: boolean;\n    titleDisplay?: string;\n    scrolled?: boolean;\n};\n\n//Props \nconst props = defineProps<TopBarMainContentProps & {\n    /** Props for subcomponents */\n    options?: TopBarMainContentOptions;\n}>();\n\n\n//Composables\nconst { t } = useI18n();\nconst { useProxyImageUrl } = useImageProxy();\nconst { rubriqueQueryParam } = useRubriquesFilterComputed();\nconst authStore = useAuthStore();\nconst generalStore = useGeneralStore();\nconst filterStore = useFilterStore();\n\nconst menuOpen = ref(false);\n\n//Computed\nconst mobileMenuDisplay = computed(() => props.isPhone || inContentDisplayPage.value);\nconst titleIsDisplayed = computed(() => inContentDisplayPage.value && props.scrolled && !props.isPhone);\nconst inContentDisplayPage = computed(() => 0 !== props.titleDisplay.length);\nconst routerLinkArray = computed(() => [{\n    title: t(\"Radio & Live\"),\n    routeName: \"lives\",\n    condition:\n        !inContentDisplayPage.value &&\n        (state.generalParameters.isLiveTab as boolean) &&\n        ((filterStore.filterOrgaId && filterStore.filterLive) || !filterStore.filterOrgaId),\n}, {\n    title: t(\"Podcasts\"),\n    routeName: \"podcasts\",\n    condition:\n        !inContentDisplayPage.value ||\n        (inContentDisplayPage.value && !props.scrolled),\n}, {\n    title: t(\"Emissions\"),\n    routeName: \"emissions\",\n    condition:\n        !inContentDisplayPage.value ||\n        (inContentDisplayPage.value && !props.scrolled),\n}]);\n\nconst routerLinkInsideArray = computed(() =>{\n    return [\n        {\n            title: t(\"Speakers\"),\n            routeName: \"participants\",\n            condition: true,\n        },\n        {\n            title: t(\"Playlists\"),\n            routeName: \"playlists\",\n            condition: true,\n        },\n        {\n            title: t(\"Productors\"),\n            routeName: \"productors\",\n            condition:\n                !state.generalParameters.podcastmaker && (!filterStore.filterOrgaId || generalStore.platformEducation),\n        },\n    ];\n});\nconst logoUrl = computed(() =>{\n    if (generalStore.platformEducation) {\n        return \"/img/logo_education_white.svg\";\n    }\n    return props.isPhone\n        ? \"/img/logo_octopus_bubble.svg\"\n        : \"/img/logo_saooti_play_white.svg\";\n});\nconst imgUrl = computed(() =>{\n    if (!filterStore.filterImgUrl?.includes(\"emptypodcast\")){\n        return `${filterStore.filterImgUrl}`;\n    }\n    return \"\";\n});\n \n//Methods\nfunction getQueriesRouter(routeName: string) {\n    if (\"podcasts\" !== routeName && \"emissions\" !== routeName  && \"home\" !== routeName) {\n        return { productor: filterStore.filterOrgaId };\n    }\n    return {\n        productor: filterStore.filterOrgaId,\n        iabId: filterStore.filterIab?.id,\n        rubriquesId: rubriqueQueryParam.value,\n    };\n}\n</script>\n\n<style scoped lang=\"scss\">\n.top-bar-grid {\n    display: grid;\n    grid-template-columns: 1fr 5fr;\n    padding: 0 1rem 0 0.5rem;\n\n    &.scrolled {\n        grid-template-columns: 1fr 2fr 1fr;\n    }\n\n    @media (width <= 450px) {\n        padding: 0 0.5rem;\n    }\n\n    .link-hover {\n        color: white;\n        font-weight: bold;\n        font-size: 0.93rem;\n        text-decoration: underline;\n        text-decoration-color: transparent;\n        transition: text-decoration-color 250ms;\n        text-underline-offset: 8px;\n\n        &.link-hover:hover,\n        &.link-hover.router-link-exact-active.router-link-active {\n            color: white;\n            text-decoration-color: white;\n        }\n    }\n\n    .client-logo {\n        border-radius: var(--octopus-border-radius);\n    }\n\n    .top-bar-logo img {\n        max-width: 140px !important;\n        max-height: 4rem;\n        height: 4rem;\n\n        &.education-logo {\n            height: auto;\n        }\n\n        @media (width <= 650px) {\n            max-height: 2rem;\n        }\n    }\n\n    .octopus-logo {\n        @media (width <= 960px) {\n            max-width: 30px !important;\n        }\n    }\n}\n\n.right-section {\n    padding-top: 0.5rem;\n}\n</style>\n","<template>\n    <div class=\"top-bar-grid header-content\" :class=\"{ scrolled: titleIsDisplayed }\">\n        <div class=\"d-flex align-items-center\">\n            <!-- Logo to the left -->\n            <router-link\n                class=\"top-bar-logo d-block\"\n                :to=\"{\n                    name: 'home',\n                    query: getQueriesRouter('home'),\n                }\"\n                :title=\"t('Home')\"\n            >\n                <img\n                    v-if=\"!filterStore.filterOrgaId || '' === imgUrl\"\n                    :src=\"logoUrl\"\n                    aria-hidden=\"true\"\n                    alt=\"\"\n                    width=\"140\"\n                    height=\"50\"\n                    title=\"Logo\"\n                    :class=\"generalStore.platformEducation ? 'education-logo' : 'octopus-logo'\"\n                >\n                <img\n                    v-else\n                    :src=\"useProxyImageUrl(imgUrl, '', '80')\"\n                    aria-hidden=\"true\"\n                    alt=\"\"\n                    class=\"client-logo\"\n                    title=\"Logo\"\n                    :class=\"generalStore.platformEducation ? 'education-logo' : ''\"\n                >\n            </router-link>\n\n            <RightsScopeMenu v-model:open=\"menuOpen\" />\n            <RightsScopeSelector\n                class=\"ms-4\"\n                :open=\"menuOpen\"\n                @change=\"menuOpen = true\"\n            />\n        </div>\n\n        <h1 v-if=\"titleIsDisplayed\" class=\"text-truncate m-0 align-self-center\">\n            {{ titleDisplay }}\n        </h1>\n\n        <!-- Right section -->\n        <div\n            class=\"d-flex right-section\"\n            :class=\"[\n                inContentDisplayPage || isPhone\n                    ? 'flex-row-reverse align-items-center'\n                    : 'flex-column align-items-end',\n            ]\"\n        >\n            <!-- Logo to the right -->\n            <template v-if=\"filterStore.filterOrgaId && '' !== imgUrl\">\n                <img\n                    v-if=\"authStore.isGarRole\"\n                    :src=\"logoUrl\"\n                    aria-hidden=\"true\"\n                    alt=\"\"\n                    width=\"100\"\n                    height=\"29\"\n                    class=\"ms-2\"\n                    title=\"Logo\"\n                    :class=\"generalStore.platformEducation ? 'education-logo' : 'octopus-logo'\"\n                >\n                <a\n                    v-else\n                    href=\"https://www.saooti.com/\"\n                    target=\"_blank\"\n                    rel=\"noreferrer noopener\"\n                    :title=\"t('New window', {text: 'Saooti'})\"\n                >\n                    <img\n                        :src=\"logoUrl\"\n                        aria-hidden=\"true\"\n                        alt=\"\"\n                        title=\"Saooti\"\n                        width=\"100\"\n                        height=\"29\"\n                        class=\"ms-2\"\n                        :class=\"generalStore.platformEducation ? 'education-logo' : 'octopus-logo'\"\n                    >\n                </a>\n            </template>\n\n            <div role=\"navigation\" class=\"d-flex align-items-center justify-content-end flex-grow-1\">\n                <nav :aria-label=\"t('Site menu')\">\n                    <ul class=\"d-flex\">\n                        <template v-for=\"link in routerLinkArray\" :key=\"link.routeName\">\n                            <li v-if=\"link.condition\" class=\"li-style-none\">\n                                <router-link\n                                    v-show=\"!isPhone\"\n                                    :to=\"{\n                                        name: link.routeName,\n                                        query: getQueriesRouter(link.routeName),\n                                    }\"\n                                    class=\"link-hover py-2 px-3\"\n                                >\n                                    {{ link.title }}\n                                </router-link>\n                            </li>\n                        </template>\n                    </ul>\n                </nav>\n                <button\n                    v-show=\"!isPhone && !inContentDisplayPage\"\n                    id=\"more-dropdown\"\n                    :title=\"t('More')\"\n                    class=\"d-flex-column flex-nowrap align-items-center btn-transparent py-2 px-3 text-white\"\n                >\n                    <span class=\"link-hover\">\n                        {{ t(\"More\") }}\n                    </span>\n                    <ChevronDownIcon />\n                </button>\n                <ClassicPopover\n                    target=\"more-dropdown\"\n                    :only-click=\"true\"\n                    :is-fixed=\"true\"\n                    :left-pos=\"true\"\n                    :is-top-layer=\"true\"\n                >\n                    <nav class=\"d-flex flex-column\" :aria-label=\"t('Site menu')\">\n                        <ul class=\"p-0 m-0\">\n                            <template v-for=\"link in routerLinkInsideArray\" :key=\"link.routeName\">\n                                <li\n                                    v-if=\"link.condition\"\n                                    class=\"li-style-none\"\n                                >\n                                    <router-link\n                                        :to=\"{\n                                            name: link.routeName,\n                                            query: getQueriesRouter(link.routeName),\n                                        }\"\n                                        class=\"p-1 octopus-dropdown-item\"\n                                    >\n                                        {{ link.title }}\n                                    </router-link>\n                                </li>\n                            </template>\n                        </ul>\n                    </nav>\n                </ClassicPopover>\n\n                <MobileMenu\n                    :is-education=\"generalStore.platformEducation\"\n                    :show=\"mobileMenuDisplay\"\n                    :not-podcast-and-emission=\"inContentDisplayPage && !scrolled\"\n                />\n                <HomeDropdown\n                    :is-education=\"generalStore.platformEducation\"\n                    :mobile-menu-display=\"mobileMenuDisplay\"\n                    v-bind=\"options?.homeDropdown\"\n                />\n                <router-link\n                    v-show=\"!isPhone && !inContentDisplayPage\"\n                    :title=\"t('Search')\"\n                    :to=\"{\n                        name: 'podcasts',\n                    }\"\n                    class=\"btn admin-button m-1 text-blue-octopus\"\n                    role=\"search\"\n                >\n                    <MagnifyIcon :size=\"30\" />\n                </router-link>\n            </div>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ChevronDownIcon from \"vue-material-design-icons/ChevronDown.vue\";\nimport MagnifyIcon from \"vue-material-design-icons/Magnify.vue\";\nimport { useRubriquesFilterComputed } from \"../composable/route/useRubriquesFilterComputed\";\nimport { state } from \"../../stores/ParamSdkStore\";\nimport HomeDropdown, { type HomeDropdownProps } from \"./HomeDropdown.vue\";\nimport {useImageProxy} from \"../composable/useImageProxy\";\nimport { useFilterStore } from \"../../stores/FilterStore\";\nimport { useAuthStore } from \"../../stores/AuthStore\";\nimport ClassicPopover from \"../misc/ClassicPopover.vue\";\nimport { defineAsyncComponent, computed, ref } from \"vue\";\nimport { useGeneralStore } from \"../../stores/GeneralStore\";\nimport { useI18n } from \"vue-i18n\";\nimport RightsScopeSelector from \"./RightsScopeSelector.vue\";\nimport RightsScopeMenu from \"./RightsScopeMenu.vue\"; \nconst MobileMenu = defineAsyncComponent(() => import(\"./MobileMenu.vue\"));\n\nexport interface TopBarMainContentOptions {\n    homeDropdown?: HomeDropdownProps;\n}\n\nexport interface TopBarMainContentProps {\n    isPhone?: boolean;\n    titleDisplay?: string;\n    scrolled?: boolean;\n};\n\n//Props \nconst props = defineProps<TopBarMainContentProps & {\n    /** Props for subcomponents */\n    options?: TopBarMainContentOptions;\n}>();\n\n\n//Composables\nconst { t } = useI18n();\nconst { useProxyImageUrl } = useImageProxy();\nconst { rubriqueQueryParam } = useRubriquesFilterComputed();\nconst authStore = useAuthStore();\nconst generalStore = useGeneralStore();\nconst filterStore = useFilterStore();\n\nconst menuOpen = ref(false);\n\n//Computed\nconst mobileMenuDisplay = computed(() => props.isPhone || inContentDisplayPage.value);\nconst titleIsDisplayed = computed(() => inContentDisplayPage.value && props.scrolled && !props.isPhone);\nconst inContentDisplayPage = computed(() => 0 !== props.titleDisplay.length);\nconst routerLinkArray = computed(() => [{\n    title: t(\"Radio & Live\"),\n    routeName: \"lives\",\n    condition:\n        !inContentDisplayPage.value &&\n        (state.generalParameters.isLiveTab as boolean) &&\n        ((filterStore.filterOrgaId && filterStore.filterLive) || !filterStore.filterOrgaId),\n}, {\n    title: t(\"Podcasts\"),\n    routeName: \"podcasts\",\n    condition:\n        !inContentDisplayPage.value ||\n        (inContentDisplayPage.value && !props.scrolled),\n}, {\n    title: t(\"Emissions\"),\n    routeName: \"emissions\",\n    condition:\n        !inContentDisplayPage.value ||\n        (inContentDisplayPage.value && !props.scrolled),\n}]);\n\nconst routerLinkInsideArray = computed(() =>{\n    return [\n        {\n            title: t(\"Speakers\"),\n            routeName: \"participants\",\n            condition: true,\n        },\n        {\n            title: t(\"Playlists\"),\n            routeName: \"playlists\",\n            condition: true,\n        },\n        {\n            title: t(\"Productors\"),\n            routeName: \"productors\",\n            condition:\n                !state.generalParameters.podcastmaker && (!filterStore.filterOrgaId || generalStore.platformEducation),\n        },\n    ];\n});\nconst logoUrl = computed(() =>{\n    if (generalStore.platformEducation) {\n        return \"/img/logo_education_white.svg\";\n    }\n    return props.isPhone\n        ? \"/img/logo_octopus_bubble.svg\"\n        : \"/img/logo_saooti_play_white.svg\";\n});\nconst imgUrl = computed(() =>{\n    if (!filterStore.filterImgUrl?.includes(\"emptypodcast\")){\n        return `${filterStore.filterImgUrl}`;\n    }\n    return \"\";\n});\n \n//Methods\nfunction getQueriesRouter(routeName: string) {\n    if (\"podcasts\" !== routeName && \"emissions\" !== routeName  && \"home\" !== routeName) {\n        return { productor: filterStore.filterOrgaId };\n    }\n    return {\n        productor: filterStore.filterOrgaId,\n        iabId: filterStore.filterIab?.id,\n        rubriquesId: rubriqueQueryParam.value,\n    };\n}\n</script>\n\n<style scoped lang=\"scss\">\n.top-bar-grid {\n    display: grid;\n    grid-template-columns: 1fr 5fr;\n    padding: 0 1rem 0 0.5rem;\n\n    &.scrolled {\n        grid-template-columns: 1fr 2fr 1fr;\n    }\n\n    @media (width <= 450px) {\n        padding: 0 0.5rem;\n    }\n\n    .link-hover {\n        color: white;\n        font-weight: bold;\n        font-size: 0.93rem;\n        text-decoration: underline;\n        text-decoration-color: transparent;\n        transition: text-decoration-color 250ms;\n        text-underline-offset: 8px;\n\n        &.link-hover:hover,\n        &.link-hover.router-link-exact-active.router-link-active {\n            color: white;\n            text-decoration-color: white;\n        }\n    }\n\n    .client-logo {\n        border-radius: var(--octopus-border-radius);\n    }\n\n    .top-bar-logo img {\n        max-width: 140px !important;\n        max-height: 4rem;\n        height: 4rem;\n\n        &.education-logo {\n            height: auto;\n        }\n\n        @media (width <= 650px) {\n            max-height: 2rem;\n        }\n    }\n\n    .octopus-logo {\n        @media (width <= 960px) {\n            max-width: 30px !important;\n        }\n    }\n}\n\n.right-section {\n    padding-top: 0.5rem;\n}\n</style>\n","<template>\n  <header\n    role=\"banner\"\n    class=\"header-saooti-play\"\n    :style=\"headerBackgroundImage\"\n    :class=\"[generalStore.contentToDisplay ? 'header-img-bg':'bg-gradient', scrolled? 'scrolled':'', needToBlur ? 'header-force-blur':'']\"\n  >\n    <TopBarMainContent\n      :is-phone=\"isPhone\"\n      :scrolled=\"scrolled\"\n      :title-display=\"titleToDisplay\"\n      style=\"height: var(--header-size);\"\n      :class=\"headerBackgroundImage.length ? 'header-opacity':''\"\n      :options=\"options?.topBarMainContent\"\n    />\n  </header>\n\n  <div\n    v-if=\"generalStore.contentToDisplay\"\n    class=\"header-content-bg\"\n    :style=\"headerBackgroundImage\"\n    :class=\"{ scrolled: scrolled, 'header-force-blur':needToBlur }\"\n  >\n    <div class=\"header-additional-content header-content\">\n      <h1 v-if=\"!scrolled\" class=\"text-truncate\">\n        {{ titleToDisplay }}\n      </h1>\n      <SubscribeButtons\n        v-if=\"!authStore.isGarRole && content\"\n        v-show=\"!scrolled\"\n        :content=\"content\"\n        :window-width=\"windowWidth\"\n      />\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport {useImageProxy} from \"../composable/useImageProxy\";\nimport TopBarMainContent, { type TopBarMainContentOptions } from \"./TopBarMainContent.vue\";\nimport { computed, defineAsyncComponent, onBeforeUnmount, onMounted, ref, watch } from \"vue\";\nimport { useAuthStore } from \"../../stores/AuthStore\";\nimport { useGeneralStore } from \"../../stores/GeneralStore\";\nimport { Podcast } from \"@/stores/class/general/podcast\";\nimport { Emission } from \"@/stores/class/general/emission\";\nimport {useResizePhone} from \"../composable/useResizePhone\";\nimport { Playlist } from \"@/stores/class/general/playlist\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport axios from \"axios\";\nconst SubscribeButtons = defineAsyncComponent(\n  () => import(\"../display/sharing/SubscribeButtons.vue\"),\n);\n\ndefineProps<{\n  options?: {\n    topBarMainContent?: TopBarMainContentOptions\n  }\n}>();\n\n//Data \nconst scrolled = ref(false);\nconst oldScrollY = ref(0);\nconst minScroll = ref(0);\nconst headerBackgroundImage = ref(\"\");\nconst needToBlur = ref(false);\n\n\n//Composables\nconst { isPhone, windowWidth } = useResizePhone();\nconst { useProxyImageUrl } = useImageProxy();\nconst authStore = useAuthStore();\nconst generalStore = useGeneralStore();\n\n//Computed\nconst titleToDisplay = computed(() => {\n  if ((generalStore.contentToDisplay as Podcast)?.podcastId) {\n    return (generalStore.contentToDisplay as Podcast).emission.name;\n  }\n  if ((generalStore.contentToDisplay as Playlist)?.playlistId) {\n    return (generalStore.contentToDisplay as Playlist).title;\n  }\n  if ((generalStore.contentToDisplay as Emission)?.emissionId) {\n    return (generalStore.contentToDisplay as Emission).name;\n  }\n  if ((generalStore.contentToDisplay as Canal)?.id) {\n    return (generalStore.contentToDisplay as Canal).name;\n  }\n  return \"\";\n});\n\n/** The element displayed by the subscribe buttons */\nconst content = computed(() => {\n  if ((generalStore.contentToDisplay as Podcast)?.podcastId) {\n    return (generalStore.contentToDisplay as Podcast).emission;\n  }\n  if ((generalStore.contentToDisplay as Emission)?.emissionId) {\n    return generalStore.contentToDisplay as Emission;\n  }\n  if ((generalStore.contentToDisplay as Playlist)?.playlistId) {\n    return generalStore.contentToDisplay as Playlist;\n  }\n  return null;\n});\n\n//Watch\nwatch(()=>generalStore.contentToDisplay, async () => {\n  if(!generalStore.contentToDisplay){\n    headerBackgroundImage.value = \"\";\n    needToBlur.value = false;\n    return;\n  }\n  const widthAsked = window.innerWidth > 960 ? \"1600\":\"1000\";\n  const proxyUrl = useProxyImageUrl(generalStore.contentToDisplay.imageUrl, widthAsked, undefined, true);\n  try {\n    const result = await axios.get(proxyUrl);\n    headerBackgroundImage.value = `background-image: url('${result.data}');`;\n    needToBlur.value = result.data === generalStore.contentToDisplay.imageUrl;\n  } catch {\n    if (generalStore.contentToDisplay.imageUrl) {\n      const url = encodeURI(generalStore.contentToDisplay.imageUrl);\n      headerBackgroundImage.value = `background-image: url('${url}');`;\n      needToBlur.value = true;\n    } else {\n      headerBackgroundImage.value = '';\n    }\n  }\n}, {deep: true, immediate: true});\n\n\nonMounted(()=>{\n  window.addEventListener(\"scroll\", handleScroll);\n})\nonBeforeUnmount(() => {\n  window.removeEventListener(\"scroll\", handleScroll);\n})\n\n\n//Methods\nfunction handleScroll(): void {\n  if (\n    window.scrollY - oldScrollY.value > 0 &&\n    window.scrollY > 1 &&\n    document.body.offsetHeight - window.innerHeight > 40\n  ) {\n    if (!scrolled.value) {\n      scrolled.value = true;\n      minScroll.value = 0;\n    }\n  } else if (\n    window.scrollY - oldScrollY.value  < 0 &&\n    window.scrollY < 1 &&\n    minScroll.value > 20\n  ) {\n    scrolled.value = false;\n    minScroll.value = 0;\n  }\n  oldScrollY.value  = window.scrollY;\n  if (minScroll.value < window.scrollY) {\n    minScroll.value = window.scrollY;\n  }\n}\n</script>\n\n<style lang=\"scss\">\n.octopus-app {\n  --header-size: 5rem;\n  --header-additional-content-size: 22rem;\n  @media (width <= 650px) {\n    --header-size: 3.5rem;\n  }\n  @media (width <= 550px) {\n    --header-additional-content-size: 13rem;\n  }\n  .header-saooti-play{\n    z-index: 11;\n    position: sticky;\n    top: 0;\n    background-color: black;\n    &.header-img-bg{\n      background-position: center -20vw;\n      background-repeat: no-repeat;\n      background-size: cover;\n    }\n    &.bg-gradient, &.scrolled{\n      box-shadow: 0 2px 15px 5px var(--octopus-shadow) !important; \n    }\n  }\n  .header-content-bg{\n    background-position: center calc(calc(var(--header-size) * -1) - 20vw);\n    background-repeat: no-repeat;\n    background-size: cover;\n    width: 100%;\n    display: flex;\n    background-color: black;\n    transition: height 0.7s;\n    height: calc(var(--header-additional-content-size) - var(--header-size));\n    @starting-style {\n      height: 0rem;\n    }\n    &.scrolled {\n      height: 0rem;\n    }\n  }\n  .header-additional-content{\n    display: flex;\n    flex-direction: column;\n    flex-grow: 1;\n    width: 100%;\n  }\n  .header-additional-content, .header-opacity{\n    background: oklch(0 0 0 / 0.5);\n  }\n  .header-force-blur .header-additional-content, .header-force-blur .header-opacity{\n    backdrop-filter: blur(8px);\n  }\n  .header-content{\n    *:focus-visible {\n      box-shadow: 0 0 10px 1px white !important;\n    }\n    h1 {\n      color: white !important;\n      font-size: 1.8rem;\n      margin: 2rem 5rem;\n      @media (width <= 550px) {\n        font-size: 1rem;\n        margin: 1rem 0.5rem 0.5rem;\n      }\n    }\n    .admin-button:hover,\n    .share-btn:hover {\n      background: white;\n    }\n  }\n}\n</style>\n","<template>\n  <header\n    role=\"banner\"\n    class=\"header-saooti-play\"\n    :style=\"headerBackgroundImage\"\n    :class=\"[generalStore.contentToDisplay ? 'header-img-bg':'bg-gradient', scrolled? 'scrolled':'', needToBlur ? 'header-force-blur':'']\"\n  >\n    <TopBarMainContent\n      :is-phone=\"isPhone\"\n      :scrolled=\"scrolled\"\n      :title-display=\"titleToDisplay\"\n      style=\"height: var(--header-size);\"\n      :class=\"headerBackgroundImage.length ? 'header-opacity':''\"\n      :options=\"options?.topBarMainContent\"\n    />\n  </header>\n\n  <div\n    v-if=\"generalStore.contentToDisplay\"\n    class=\"header-content-bg\"\n    :style=\"headerBackgroundImage\"\n    :class=\"{ scrolled: scrolled, 'header-force-blur':needToBlur }\"\n  >\n    <div class=\"header-additional-content header-content\">\n      <h1 v-if=\"!scrolled\" class=\"text-truncate\">\n        {{ titleToDisplay }}\n      </h1>\n      <SubscribeButtons\n        v-if=\"!authStore.isGarRole && content\"\n        v-show=\"!scrolled\"\n        :content=\"content\"\n        :window-width=\"windowWidth\"\n      />\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport {useImageProxy} from \"../composable/useImageProxy\";\nimport TopBarMainContent, { type TopBarMainContentOptions } from \"./TopBarMainContent.vue\";\nimport { computed, defineAsyncComponent, onBeforeUnmount, onMounted, ref, watch } from \"vue\";\nimport { useAuthStore } from \"../../stores/AuthStore\";\nimport { useGeneralStore } from \"../../stores/GeneralStore\";\nimport { Podcast } from \"@/stores/class/general/podcast\";\nimport { Emission } from \"@/stores/class/general/emission\";\nimport {useResizePhone} from \"../composable/useResizePhone\";\nimport { Playlist } from \"@/stores/class/general/playlist\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport axios from \"axios\";\nconst SubscribeButtons = defineAsyncComponent(\n  () => import(\"../display/sharing/SubscribeButtons.vue\"),\n);\n\ndefineProps<{\n  options?: {\n    topBarMainContent?: TopBarMainContentOptions\n  }\n}>();\n\n//Data \nconst scrolled = ref(false);\nconst oldScrollY = ref(0);\nconst minScroll = ref(0);\nconst headerBackgroundImage = ref(\"\");\nconst needToBlur = ref(false);\n\n\n//Composables\nconst { isPhone, windowWidth } = useResizePhone();\nconst { useProxyImageUrl } = useImageProxy();\nconst authStore = useAuthStore();\nconst generalStore = useGeneralStore();\n\n//Computed\nconst titleToDisplay = computed(() => {\n  if ((generalStore.contentToDisplay as Podcast)?.podcastId) {\n    return (generalStore.contentToDisplay as Podcast).emission.name;\n  }\n  if ((generalStore.contentToDisplay as Playlist)?.playlistId) {\n    return (generalStore.contentToDisplay as Playlist).title;\n  }\n  if ((generalStore.contentToDisplay as Emission)?.emissionId) {\n    return (generalStore.contentToDisplay as Emission).name;\n  }\n  if ((generalStore.contentToDisplay as Canal)?.id) {\n    return (generalStore.contentToDisplay as Canal).name;\n  }\n  return \"\";\n});\n\n/** The element displayed by the subscribe buttons */\nconst content = computed(() => {\n  if ((generalStore.contentToDisplay as Podcast)?.podcastId) {\n    return (generalStore.contentToDisplay as Podcast).emission;\n  }\n  if ((generalStore.contentToDisplay as Emission)?.emissionId) {\n    return generalStore.contentToDisplay as Emission;\n  }\n  if ((generalStore.contentToDisplay as Playlist)?.playlistId) {\n    return generalStore.contentToDisplay as Playlist;\n  }\n  return null;\n});\n\n//Watch\nwatch(()=>generalStore.contentToDisplay, async () => {\n  if(!generalStore.contentToDisplay){\n    headerBackgroundImage.value = \"\";\n    needToBlur.value = false;\n    return;\n  }\n  const widthAsked = window.innerWidth > 960 ? \"1600\":\"1000\";\n  const proxyUrl = useProxyImageUrl(generalStore.contentToDisplay.imageUrl, widthAsked, undefined, true);\n  try {\n    const result = await axios.get(proxyUrl);\n    headerBackgroundImage.value = `background-image: url('${result.data}');`;\n    needToBlur.value = result.data === generalStore.contentToDisplay.imageUrl;\n  } catch {\n    if (generalStore.contentToDisplay.imageUrl) {\n      const url = encodeURI(generalStore.contentToDisplay.imageUrl);\n      headerBackgroundImage.value = `background-image: url('${url}');`;\n      needToBlur.value = true;\n    } else {\n      headerBackgroundImage.value = '';\n    }\n  }\n}, {deep: true, immediate: true});\n\n\nonMounted(()=>{\n  window.addEventListener(\"scroll\", handleScroll);\n})\nonBeforeUnmount(() => {\n  window.removeEventListener(\"scroll\", handleScroll);\n})\n\n\n//Methods\nfunction handleScroll(): void {\n  if (\n    window.scrollY - oldScrollY.value > 0 &&\n    window.scrollY > 1 &&\n    document.body.offsetHeight - window.innerHeight > 40\n  ) {\n    if (!scrolled.value) {\n      scrolled.value = true;\n      minScroll.value = 0;\n    }\n  } else if (\n    window.scrollY - oldScrollY.value  < 0 &&\n    window.scrollY < 1 &&\n    minScroll.value > 20\n  ) {\n    scrolled.value = false;\n    minScroll.value = 0;\n  }\n  oldScrollY.value  = window.scrollY;\n  if (minScroll.value < window.scrollY) {\n    minScroll.value = window.scrollY;\n  }\n}\n</script>\n\n<style lang=\"scss\">\n.octopus-app {\n  --header-size: 5rem;\n  --header-additional-content-size: 22rem;\n  @media (width <= 650px) {\n    --header-size: 3.5rem;\n  }\n  @media (width <= 550px) {\n    --header-additional-content-size: 13rem;\n  }\n  .header-saooti-play{\n    z-index: 11;\n    position: sticky;\n    top: 0;\n    background-color: black;\n    &.header-img-bg{\n      background-position: center -20vw;\n      background-repeat: no-repeat;\n      background-size: cover;\n    }\n    &.bg-gradient, &.scrolled{\n      box-shadow: 0 2px 15px 5px var(--octopus-shadow) !important; \n    }\n  }\n  .header-content-bg{\n    background-position: center calc(calc(var(--header-size) * -1) - 20vw);\n    background-repeat: no-repeat;\n    background-size: cover;\n    width: 100%;\n    display: flex;\n    background-color: black;\n    transition: height 0.7s;\n    height: calc(var(--header-additional-content-size) - var(--header-size));\n    @starting-style {\n      height: 0rem;\n    }\n    &.scrolled {\n      height: 0rem;\n    }\n  }\n  .header-additional-content{\n    display: flex;\n    flex-direction: column;\n    flex-grow: 1;\n    width: 100%;\n  }\n  .header-additional-content, .header-opacity{\n    background: oklch(0 0 0 / 0.5);\n  }\n  .header-force-blur .header-additional-content, .header-force-blur .header-opacity{\n    backdrop-filter: blur(8px);\n  }\n  .header-content{\n    *:focus-visible {\n      box-shadow: 0 0 10px 1px white !important;\n    }\n    h1 {\n      color: white !important;\n      font-size: 1.8rem;\n      margin: 2rem 5rem;\n      @media (width <= 550px) {\n        font-size: 1rem;\n        margin: 1rem 0.5rem 0.5rem;\n      }\n    }\n    .admin-button:hover,\n    .share-btn:hover {\n      background: white;\n    }\n  }\n}\n</style>\n"],"mappings":"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"}