@posiwise/resource-module 0.0.203 → 0.0.205

package/fesm2022/posiwise-resource-module-resource-hub.module-alVvQLvR.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"posiwise-resource-module-resource-hub.module-alVvQLvR.mjs","names":["i1"],"sources":["../../../../libs/resource-module/src/lib/public/components/resources-hub/resources-hub.component.ts","../../../../libs/resource-module/src/lib/public/components/resources-hub/resources-hub.component.html","../../../../libs/resource-module/src/lib/public/modules/hub/resource-hub.module.ts"],"sourcesContent":["import { DatePipe, NgClass, UpperCasePipe } from '@angular/common';\nimport {\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    HostListener,\n    inject,\n    OnDestroy,\n    OnInit,\n    ViewEncapsulation\n} from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { RouterLink } from '@angular/router';\n\nimport { AppBaseComponent } from '@posiwise/app-base-component';\nimport { AuthService, TagService } from '@posiwise/common-services';\nimport { Resource, Tag, User } from '@posiwise/common-utilities';\nimport { LazyImgDirective } from '@posiwise/directives';\nimport { HelperService } from '@posiwise/helper-service';\nimport { RemoveHtmlPipe, TextTruncatePipe } from '@posiwise/pipes';\nimport { NoDataComponent } from '@posiwise/shared-components';\nimport { ResourceHeaderComponent } from '@posiwise/utils';\n\nimport { Bind } from 'primeng/bind';\nimport { IconField } from 'primeng/iconfield';\nimport { InputIcon } from 'primeng/inputicon';\nimport { InputText } from 'primeng/inputtext';\nimport { ProgressSpinner } from 'primeng/progressspinner';\nimport { forkJoin, Subscription } from 'rxjs';\n\nimport { TranslocoPipe } from '@jsverse/transloco';\n\nimport { ResourceService } from '../../../resource.service';\nimport { RESOURCE_PAGE_SIZE } from '../../shared/resource-pager';\nimport { ResourceEditCardLazyComponent } from '../resource-edit-card-lazy/resource-edit-card-lazy.component';\n\n@Component({\n    selector: 'pw-posts-list',\n    templateUrl: './resources-hub.component.html',\n    styleUrls: [\n        './resources-hub.component.scss',\n        '../resource-company-card/resource-company-card.component.scss'\n    ],\n    encapsulation: ViewEncapsulation.None,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    imports: [\n        ResourceHeaderComponent,\n        Bind,\n        IconField,\n        InputIcon,\n        FormsModule,\n        InputText,\n        ProgressSpinner,\n        ResourceEditCardLazyComponent,\n        RouterLink,\n        LazyImgDirective,\n        NgClass,\n        NoDataComponent,\n        UpperCasePipe,\n        DatePipe,\n        RemoveHtmlPipe,\n        TextTruncatePipe,\n        TranslocoPipe\n    ]\n})\nexport class ResourceHubComponent extends AppBaseComponent implements OnInit, OnDestroy {\n    private readonly resourceService = inject(ResourceService);\n    private readonly authService = inject(AuthService);\n    private readonly tagService = inject(TagService);\n    private readonly cdr = inject(ChangeDetectorRef);\n\n    private delayTimeout: ReturnType<typeof setTimeout> | null = null;\n    private userSub: Subscription;\n\n    data = [];\n\n    posts: Resource[] = [];\n    tags: Tag[] = [];\n\n    selectedTags = [];\n\n    currentPage = 1;\n    pageSize = RESOURCE_PAGE_SIZE;\n    objectCount = 0;\n\n    searchTextItems = '';\n    searchInput = false;\n\n    readingTime: number;\n\n    totalRecords: number;\n\n    loading = true;\n    loaded = false;\n\n    masterSubscriptionId: number;\n    subscriptionId;\n    userLoggedIn: boolean;\n    isMasterSubscription;\n\n    scrollLocked = false;\n\n    iconClasses: string[] = [\n        'fa-lightbulb',\n        'fa-rocket',\n        'fa-file-alt',\n        'fa-users',\n        'fa-video',\n        'fa-pencil-alt',\n        'fa-book-open',\n        'fa-cogs'\n    ];\n    user: User;\n\n    canEditResourcesValue = false;\n\n    ngOnInit() {\n        this.authService.getToken$().subscribe(res => {\n            this.userLoggedIn = !!res;\n            if (this.userLoggedIn) {\n                this.localStorage.getItem$('product').subscribe(res => {\n                    const data = res ? JSON.parse(res) : null;\n                    this.subscriptionId = data?.subscriptionId;\n                    this.cdr.markForCheck();\n                });\n                this.userSub = this.userService.getUserInfo().subscribe(data => {\n                    this.user = data;\n                    this.updateCanEditResourcesValue();\n                    this.getPostsAndTags();\n                    this.cdr.markForCheck();\n                });\n            } else {\n                this.getPostsAndTags();\n            }\n            this.cdr.markForCheck();\n        });\n        this.masterSubscriptionId = this.appConfig.master_subscription.subscription_id;\n        this.readingTime = 0;\n    }\n\n    getPostsAndTags() {\n        this.loading = true;\n        this.loaded = false;\n        forkJoin({\n            resPosts: this.resourceService.getPublicPosts(\n                this.getEffectiveSubscriptionId(),\n                this.currentPage,\n                this.pageSize,\n                this.searchTextItems\n            ),\n            resTags: this.tagService.getTagsByType(\n                'post_categories',\n                {},\n                this.getEffectiveSubscriptionId()\n            )\n        })\n            .subscribe(res => {\n                this.posts = res?.resPosts?.posts;\n                this.objectCount = res?.resPosts.object_count;\n                this.data = res?.resPosts?.posts;\n                this.data = res?.resPosts?.posts.map(post => ({\n                    ...post,\n                    expandedTags: false\n                }));\n                this.totalRecords = this.posts?.length;\n\n                this.tags = res?.resTags?.tags?.filter(tag => tag.visible_in_resources);\n                this.tags = this.tags.map(tag => ({\n                    ...tag\n                }));\n                this.cdr.markForCheck();\n            })\n            .add(() => {\n                this.loading = false;\n                this.loaded = true;\n                this.cdr.markForCheck();\n            });\n    }\n\n    toggleDropdown(event: Event, post): void {\n        event.stopPropagation();\n        post.showDropdown = !post.showDropdown;\n    }\n\n    getPosts(page: number, pageSize: number, fetchAll = false, append = false) {\n        if (fetchAll) this.selectedTags = [];\n\n        if (!append) {\n            this.loading = true;\n            this.loaded = false;\n        }\n\n        const tagCategoryParam = this.selectedTags.map(tag => tag.tag_category_id).join(',');\n\n        this.resourceService\n            .getPublicPosts(\n                this.getEffectiveSubscriptionId(),\n                page,\n                pageSize,\n                this.searchTextItems,\n                tagCategoryParam\n            )\n            .subscribe(response => {\n                this.objectCount = response.object_count;\n                this.posts = append ? [...this.posts, ...response.posts] : response.posts;\n                this.data = [...this.posts];\n                this.totalRecords = this.posts?.length;\n                this.cdr.markForCheck();\n            })\n            .add(() => {\n                this.loading = false;\n                this.loaded = true;\n                this.cdr.markForCheck();\n            });\n    }\n\n    onSearch(seconds: number) {\n        let delay = 0;\n        delay = seconds * 1000;\n        clearTimeout(this.delayTimeout);\n        const delayTimeout = setTimeout(() => {\n            this.currentPage = 1;\n            this.getPosts(1, this.pageSize);\n        }, delay);\n\n        this.delayTimeout = delayTimeout;\n    }\n\n    navigateToTagList(): void {\n        HelperService.navigateToTagList();\n    }\n\n    @HostListener('window:scroll', [])\n    onWindowScroll(): void {\n        const scrollPosition = window.scrollY + window.innerHeight;\n        const pageHeight = document.documentElement.scrollHeight;\n\n        const nearBottom = scrollPosition >= pageHeight - 100;\n\n        if (\n            nearBottom &&\n            this.posts.length < this.objectCount &&\n            !this.loading &&\n            !this.scrollLocked\n        ) {\n            this.scrollLocked = true;\n            this.currentPage += 1;\n\n            this.getPosts(this.currentPage, this.pageSize, false, true);\n\n            setTimeout(() => {\n                this.scrollLocked = false;\n            }, 500);\n        }\n    }\n\n    isSelected(tagId: number): boolean {\n        return this.selectedTags.map(tag => tag.id).includes(tagId);\n    }\n\n    tagPost(selectedTag) {\n        const index = this.selectedTags.findIndex(\n            tag => tag.tag_category_id === selectedTag?.tag_category_id && tag.id === selectedTag.id\n        );\n\n        if (index === -1) {\n            this.selectedTags.push({\n                tag_category_id: selectedTag?.tag_category_id,\n                id: selectedTag.id\n            });\n        } else {\n            this.selectedTags.splice(index, 1);\n        }\n\n        this.currentPage = 1;\n        this.getPosts(1, this.pageSize);\n    }\n\n    thisPostReadingTime(text: string): string {\n        if (text) {\n            const wordsPerMinute = 200;\n            const noOfWords = text.split(/\\s/g).length;\n            const minutes = noOfWords / wordsPerMinute;\n            const readTime = Math.ceil(minutes);\n\n            return `${readTime} minute read`;\n        }\n\n        return '';\n    }\n\n    override ngOnDestroy() {\n        this.userSub?.unsubscribe();\n        super.ngOnDestroy();\n    }\n\n    /** Helper method to get effective subscription ID */\n    private getEffectiveSubscriptionId(): number {\n        return HelperService.getEffectiveSubscriptionId(\n            this.user,\n            this.subscriptionId,\n            this.appConfig.master_subscription.subscription_id\n        );\n    }\n\n    private updateCanEditResourcesValue(): void {\n        if (this.userLoggedIn && this.user) {\n            this.canEditResourcesValue = HelperService.canEditResources(\n                this.user,\n                this.userLoggedIn,\n                this.permissionService\n            );\n        } else {\n            this.canEditResourcesValue = false;\n        }\n    }\n\n    canEditResources(): boolean {\n        return this.canEditResourcesValue;\n    }\n}\n","<pw-resource-header [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-resource-header>\n<main>\n\n<div class=\"hub-page\">\n<section class=\"hub-hero\" aria-labelledby=\"hub-hero-title\">\n  <div class=\"hub-hero__glow\" aria-hidden=\"true\"></div>\n  <div class=\"hub-hero__grid\" aria-hidden=\"true\"></div>\n  <div class=\"hub-hero__inner\">\n    <p class=\"hub-hero__eyebrow\">{{ 'Resource.Posts.Title' | transloco | uppercase }}</p>\n    <h1 id=\"hub-hero-title\" class=\"hub-hero__title\">\n      Stories, guides, and notes <br class=\"hub-hero__br\" />from the team.\n    </h1>\n    <p class=\"hub-hero__subtitle\">{{ 'Resource.Hub.Subtitle' | transloco }}</p>\n    <div class=\"hub-hero__search\">\n      <p-iconfield class=\"hub-hero__search-field\" iconPosition=\"left\">\n        <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n        <input type=\"text\" id=\"resources-hub-search\" name=\"resources-hub-search\"\n          [(ngModel)]=\"searchTextItems\" pInputText\n          [placeholder]=\"'Resource.Hub.SearchPlaceholder' | transloco\"\n          (input)=\"onSearch(1)\" class=\"hub-hero__search-input\"\n          aria-label=\"Resources Hub Search\" />\n      </p-iconfield>\n      @if (userLoggedIn && user?.auth?.granted['Pages.Admin']) {\n        <button type=\"button\" class=\"hub-hero__edit\"\n          [title]=\"'Resource.Hub.EditTagsTooltip' | transloco\"\n          [attr.aria-label]=\"'Resource.Hub.EditTagsTooltip' | transloco\"\n          (click)=\"navigateToTagList()\" (keydown.enter)=\"navigateToTagList()\">\n          <i class=\"fa fa-edit\" aria-hidden=\"true\"></i>\n        </button>\n      }\n    </div>\n  </div>\n</section>\n\n<div class=\"hub-shell\">\n  <nav class=\"hub-chips\" aria-label=\"Resource categories\">\n    <button type=\"button\" class=\"hub-chip hub-chip--all\"\n      [class.hub-chip--selected]=\"selectedTags.length === 0\"\n      (click)=\"getPosts(1, pageSize, true)\" (keydown.enter)=\"getPosts(1, pageSize, true)\">\n      <span class=\"hub-chip__dot\" aria-hidden=\"true\"></span>\n      <span class=\"hub-chip__label\">{{ 'Resource.Hub.AllResources' | transloco }}</span>\n      @if (objectCount) { <span class=\"hub-chip__count\">{{ objectCount }}</span> }\n    </button>\n    @for (tag of tags; track tag.id) {\n      <button type=\"button\" class=\"hub-chip\"\n        [class.hub-chip--selected]=\"isSelected(tag.id)\"\n        (click)=\"tagPost(tag)\" (keydown.enter)=\"tagPost(tag)\">\n        <span class=\"hub-chip__dot\" [attr.data-cat]=\"tag.id % 6\" aria-hidden=\"true\"></span>\n        <span class=\"hub-chip__label\">{{ tag.name }}</span>\n      </button>\n    }\n  </nav>\n\n  @if (loading && !loaded) {\n    <div class=\"hub-loading\"><p-progress-spinner strokeWidth=\"2\"></p-progress-spinner></div>\n  }\n\n  @if (posts?.length && !loading) {\n    <ul class=\"hub-grid\" role=\"list\">\n      @for (post of data; track post.id; let i = $index) {\n        <li class=\"hub-post\" [style.--reveal-delay.ms]=\"i * 40\">\n          <pw-resource-edit-card-lazy [canEdit]=\"canEditResourcesValue\" [id]=\"post?.id\"\n            [resourceData]=\"post\" (updated)=\"getPosts(1, pageSize)\"></pw-resource-edit-card-lazy>\n\n          <a class=\"hub-post__media\" [routerLink]=\"['/resources/view', post.slug]\"\n            [attr.aria-label]=\"post.title\"\n            [attr.data-cat]=\"(post?.tags?.[0]?.id || 0) % 6\">\n            @if (post.picture?.url && !post.picture.url.includes('default-photo')) {\n              <img [src]=\"post.picture?.url\" alt=\"\" loading=\"lazy\" class=\"hub-post__image\" />\n            } @else {\n              <span class=\"hub-post__glyph\" aria-hidden=\"true\">\n                {{ (post.title?.[0] || '?').toUpperCase() }}\n              </span>\n              @if (post?.tags?.[0]?.icon_name) {\n                <i class=\"fa hub-post__icon\" [ngClass]=\"post.tags[0].icon_name\" aria-hidden=\"true\"></i>\n              }\n            }\n          </a>\n\n          <div class=\"hub-post__body\">\n            @if (post?.tags?.[0]) {\n              <p class=\"hub-post__eyebrow\" [attr.data-cat]=\"post.tags[0].id % 6\">\n                <span class=\"hub-post__dot\" aria-hidden=\"true\"></span>\n                {{ post.tags[0].name }}\n              </p>\n            }\n            <h2 class=\"hub-post__title\" [routerLink]=\"['/resources/view', post.slug]\">{{ post.title }}</h2>\n            <p class=\"hub-post__excerpt\">{{ post.blurb || (post.body | removeHtml: 'quill' | textTruncate: 140) }}</p>\n            <div class=\"hub-post__foot\">\n              @if (post.author?.avatar?.[0]?.url) {\n                <img class=\"hub-post__avatar\" [src]=\"post.author.avatar[0].url\" alt=\"\" />\n              } @else {\n                <span class=\"hub-post__avatar hub-post__avatar--text\" aria-hidden=\"true\">{{ (post.author?.first_name?.[0] || '?').toUpperCase() }}</span>\n              }\n              <div class=\"hub-post__author-meta\">\n                <span class=\"hub-post__author-name\">{{ post.author?.first_name }}</span>\n                <span class=\"hub-post__author-sub\">\n                  <time [attr.datetime]=\"post.published_at\">{{ post.published_at | date: 'd MMM' }}</time>\n                  <span class=\"hub-post__sep\" aria-hidden=\"true\">·</span>\n                  <span class=\"hub-post__rt\">{{ thisPostReadingTime(post.body) }}</span>\n                </span>\n              </div>\n              <span class=\"hub-post__views\" [title]=\"'Resource.Hub.ViewCount' | transloco: { count: post.view ?? 0 }\">\n                {{ post.view ?? 0 }}\n              </span>\n            </div>\n          </div>\n        </li>\n      }\n    </ul>\n  }\n\n  @if (!posts?.length && loaded) {\n    <div class=\"hub-empty\">\n      <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"></pw-no-data>\n    </div>\n  }\n</div>\n</div>\n</main>\n","import { NgModule } from '@angular/core';\nimport { RouterModule, Routes } from '@angular/router';\n\nimport { ResourceHubComponent } from '../../components/resources-hub/resources-hub.component';\nimport { ResourceSharedModule } from '../../shared/resource-shared.module';\n\nconst routes: Routes = [\n    {\n        path: '',\n        component: ResourceHubComponent,\n        data: {\n            title: 'Resources - Hub',\n            permission: 'Pages.Blog',\n            preload: false\n        }\n    }\n];\n\n@NgModule({\n    imports: [ResourceSharedModule, RouterModule.forChild(routes), ResourceHubComponent]\n})\nexport class ResourceHubModule {}\n"],"mappings":"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"}

package/fesm2022/{posiwise-resource-module-resource-integrations.module-BXyPZf3W.mjs → posiwise-resource-module-resource-integrations.module-G4XvMMYf.mjs}

@@ -52,7 +52,7 @@ var IntegrationTopBannerComponent = class IntegrationTopBannerComponent extends
 			selector: "pw-integration-top-banner",
 			usesInheritance: true,
 			ngImport: i0,
-			template: "<section class=\"bg-white pricing-section\">\n  <div class=\"resource-banner\">\n    @if (isLoaded) {\n      <div class=\"container d-flex flex-column flex-lg-row align-items-center justify-content-between\">\n        <div class=\"text-content\">\n          <div class=\"resource-heading\">\n            <h1 class=\"resource-header-text mb-4\">\n              <span class=\"d-inline-flex align-items-center gap-2 flex-wrap\">\n                <span [innerHTML]=\"blogPostTag?.title || 'Integrated vendors'\"></span>\n                @if (canEditResourcesValue) {\n                  <pw-resource-top-banner-edit\n                    [blogPostTag]=\"blogPostTag\"\n                    [user]=\"user\"\n                    [userLoggedIn]=\"userLoggedIn\"\n                    (getUpdatedTag)=\"getTags()\"\n                  ></pw-resource-top-banner-edit>\n                }\n              </span>\n              <span class=\"blue-text\"></span>\n            </h1>\n          </div>\n        </div>\n        <div class=\"text-extension mt-4\">\n          <div class=\"cta-buttons d-flex flex-column justify-between h-100\">\n            <div class=\"flex-grow-1\">\n              @if (blogPostTag?.description && blogPostTag.description !== 'null' ) {\n                <p class=\"intro\" [innerHTML]=\"blogPostTag.description\"></p>\n              } @else {\n                <p class=\"intro\">\n                  Browse below the vendor integrations<br />\n                  we support.\n                </p>\n              }\n            </div>\n            <div class=\"d-flex gap-3 flex-wrap mt-3\">\n              <a [href]=\"contactUsUrl\" target=\"_blank\" rel=\"noopener noreferrer\"\n              class=\"cta-btn filled\">Talk to us <i class=\"fa fa-chevron-right cta-btn__icon\" aria-hidden=\"true\"></i></a>\n            </div>\n          </div>\n        </div>\n        <div class=\"image-content ms-lg-5 mt-5 mt-lg-0\">\n          <div class=\"resource-math-img\"></div>\n          <img class=\"resource-laptop-img dyn-img\"\n            [src]=\"(blogPostTag?.image?.url && !(blogPostTag?.image?.url.includes('no_image_uploaded_squared'))) ? blogPostTag?.image?.url : '/assets/img/resource/men.png'\"\n            alt=\"Integrated vendors banner\"\n            width=\"600\"\n            height=\"450\"\n            loading=\"eager\"\n            fetchpriority=\"high\" />\n        </div>\n      </div>\n    }\n  </div>\n</section>\n",
+			template: "<section class=\"bg-white pricing-section\">\n  <div class=\"resource-banner\">\n    @if (isLoaded) {\n      <div class=\"container d-flex flex-column flex-lg-row align-items-center justify-content-between\">\n        <div class=\"text-content\">\n          <div class=\"resource-heading\">\n            <h1 class=\"resource-header-text mb-4\">\n              <span class=\"d-inline-flex align-items-center gap-2 flex-wrap\">\n                <span [innerHTML]=\"blogPostTag?.title || 'Integrated vendors'\"></span>\n                @if (canEditResourcesValue) {\n                  <pw-resource-top-banner-edit\n                    [blogPostTag]=\"blogPostTag\"\n                    [user]=\"user\"\n                    [userLoggedIn]=\"userLoggedIn\"\n                    (getUpdatedTag)=\"getTags()\"\n                  ></pw-resource-top-banner-edit>\n                }\n              </span>\n              <span class=\"blue-text\"></span>\n            </h1>\n          </div>\n        </div>\n        <div class=\"text-extension mt-4\">\n          <div class=\"cta-buttons d-flex flex-column justify-between h-100\">\n            <div class=\"flex-grow-1\">\n              @if (blogPostTag?.description && blogPostTag.description !== 'null' ) {\n                <p class=\"intro\" [innerHTML]=\"blogPostTag.description\"></p>\n              } @else {\n                <p class=\"intro\">\n                  Browse below the vendor integrations<br />\n                  we support.\n                </p>\n              }\n            </div>\n            <div class=\"d-flex gap-3 flex-wrap mt-3\">\n              <a [href]=\"contactUsUrl\" target=\"_blank\" rel=\"noopener noreferrer\"\n              class=\"cta-btn filled\">Talk to us <i class=\"fa fa-chevron-right cta-btn__icon\" aria-hidden=\"true\"></i></a>\n            </div>\n          </div>\n        </div>\n        <div class=\"image-content ms-lg-5 mt-5 mt-lg-0\">\n          <div class=\"resource-math-img\"></div>\n          <img class=\"resource-laptop-img dyn-img\"\n            [src]=\"(blogPostTag?.image?.url && !(blogPostTag?.image?.url.includes('no_image_uploaded_squared'))) ? blogPostTag?.image?.url : '/assets/img/resource/men.webp'\"\n            alt=\"Integrated vendors banner\"\n            width=\"600\"\n            height=\"450\"\n            loading=\"eager\"\n            fetchpriority=\"high\" />\n        </div>\n      </div>\n    }\n  </div>\n</section>\n",
 			styles: [
 				"@charset \"UTF-8\";.cta-btn{display:inline-flex;align-items:center;gap:.6rem;background:var(--text-color, currentcolor);color:#fff;padding:1rem 2rem;border-radius:40px;font-weight:500;text-decoration:none;font-size:1.4rem;border:1px solid var(--text-color, currentcolor);box-shadow:none!important;transition:background .15s ease,color .15s ease,transform .15s ease}.cta-btn:hover{background-color:#fff!important;color:var(--text-color, currentcolor)!important;transform:translateY(-1px)}.cta-btn:focus-visible{outline:2px solid var(--text-color, currentcolor);outline-offset:3px}.cta-btn__icon{font-size:1.1rem;line-height:1}@media(width<=768px){.dyn-img{top:-3rem!important}}.text-extension{max-width:560px}.text-extension .intro{font-size:2rem;line-height:3rem;font-weight:400;color:var(--text-color, currentColor);margin-bottom:1rem}.text-extension .cta-buttons{margin-top:2rem!important}.text-extension .note{font-size:1.2rem;color:#000;margin-top:1rem;margin-left:3rem}.resource-banner{box-shadow:0 4px 32px -14px #40576d4d!important;position:relative;padding:5rem 0;color:#fff;background:linear-gradient(90deg,var(--first) 0%,#a8e1fb 100%);overflow:hidden;z-index:2}@media(width<=1200px){.resource-banner .container{padding:7rem 3rem 0rem!important}}.resource-banner:after{content:\"\";position:absolute;bottom:0;left:0;width:100%;height:61%;background:#fff;clip-path:polygon(0 18%,100% 0%,100% 100%,0% 100%)}.resource-banner .container{position:relative;z-index:2}.resource-banner .text-content{max-width:500px;text-align:left;margin-bottom:75rem}.resource-banner .text-content h1{margin-bottom:1.5rem;line-height:1.2}.resource-banner .text-content .intro{font-size:1.2rem;margin:1rem 0;color:#000}.resource-banner .text-content .cta-btn{display:inline-block;background:#000;color:#fff;padding:1rem 2rem;border-radius:40px;font-weight:500;text-decoration:none;font-size:1.4rem}.resource-banner .text-content .cta-buttons{margin-top:2rem}.resource-banner .text-content .note{margin-top:1rem;margin-left:5.6rem;font-size:.9rem;color:#555}.resource-banner .resource-header-text{max-width:500px;font-weight:500;color:#fff!important;font-size:4.5rem!important}.resource-banner .blue-text{font-weight:100}@media(width<=991px){.resource-banner .text-content{margin-top:1.5rem;margin-bottom:0;text-align:center;max-width:360px}.resource-banner .text-content h1{margin-bottom:6.5rem!important}.resource-banner .resource-header-text{font-size:2.5rem!important}.resource-banner .cta-buttons{margin-top:0rem!important;justify-content:center!important}.resource-banner .note{margin-left:8rem!important}.resource-banner .image-content{position:relative;margin-bottom:3rem;height:230px}.resource-banner .image-content .floating-box{position:absolute;top:25px;left:3rem;transform:translate(-50%) rotate(-10deg);background:#fff;padding:.75rem 1rem;border-radius:20px;box-shadow:0 8px 30px #00000026;text-align:center;z-index:3;display:inline-block;width:auto}.resource-banner .image-content .floating-box img{width:24px;margin-bottom:.4rem}.resource-banner .image-content .floating-box .label{font-size:.75rem;color:#333;margin:0;line-height:1.2}.resource-banner .image-content .floating-box .count{font-size:1.2rem;font-weight:700;color:#000;margin-top:.25rem}.resource-banner .image-content .screen-img{max-width:280px;position:absolute;bottom:0;left:3rem;z-index:2;transform:rotate(-1deg);box-shadow:0 8px 15px #0003}.resource-banner .image-content .person-img{max-width:170px;width:100%;position:relative;z-index:3;left:13rem;top:-11.35rem}.resource-banner .image-content .resource-laptop-img{max-width:300px;width:100%;position:relative;z-index:3;margin-top:3rem;left:2%;height:auto!important;top:4rem}}@media(width>=991px){.resource-banner .text-content{position:absolute;width:760px}}.white-content{background:#fff;color:#000}.white-content .intro{font-size:1.2rem;color:#000}.white-content .note{font-size:.85rem;margin-top:1rem;color:#555}@media(width>=991px){.section-outer{padding-top:7rem!important}}@media(width>=768px)and (width<=991px){.resource-math-img{left:36%!important;top:22rem!important}}@media(width>=991px)and (width<=1200px){.text-extension{max-width:760px;position:absolute;margin-bottom:23rem!important}.resource-divider{top:63.5rem;position:absolute!important}.resource-banner{padding-bottom:90px!important}}@media(width>=1200px){.text-extension{max-width:500px;position:absolute;margin-bottom:31rem!important}.resource-laptop-img{width:100%;max-width:800px!important;max-height:800px!important;height:auto}}@media(width>=1200px){.resource-divider{top:59.5rem;position:absolute!important}.cta-tab{margin-bottom:5rem!important}}@media(width>=1200px){.image-content{margin-top:0;display:flex;align-items:flex-end;gap:1.5rem;height:0}.image-content .floating-box{position:absolute;top:25px;transform:translate(-50%) rotate(-10deg);background:#fff;padding:1rem;border-radius:20px;box-shadow:0 8px 30px #00000026;text-align:center;width:170px;z-index:3}.image-content .floating-box img{width:30px;margin-bottom:.5rem}.image-content .floating-box .label{font-size:.85rem;color:#333;margin:0}.image-content .floating-box .count{font-size:1.5rem;font-weight:700;color:#000;margin:.25rem 0 0}.image-content .screen-img{width:100%;position:absolute;bottom:5rem;left:3rem;z-index:2;transform:rotate(-1deg);box-shadow:0 8px 15px #0003;max-width:400px;margin-bottom:4rem}.image-content .person-img{max-width:800px;width:100%;position:relative;z-index:3;min-width:420px;margin-bottom:0;bottom:7rem;left:4rem}.image-content .resource-laptop-img{top:4rem;left:2rem;position:relative}.image-content .resource-math-img{bottom:9rem;left:61rem;position:relative;height:312px;margin-right:1rem;min-width:450px!important}}@media(width<=786px){.text-extension{position:absolute;margin:3rem;margin-top:11rem!important}}@media(width>=786px)and (width<=991px){.text-extension{position:absolute;margin:3rem;margin-top:24rem!important}}@media(width>=704px)and (width<=768px){.resource-laptop-img{top:18rem!important;right:30%!important;left:auto!important}}@media(width>=786px)and (width<=991px){.resource-laptop-img{max-width:250px!important;top:18rem!important;right:30%!important;left:auto!important}}@media(width>=991px)and (width<=1200px){.resource-laptop-img{top:7rem;left:3%;position:relative;width:100%;max-width:600px!important;height:auto}}@media(width>=786px)and (width<=1200px){.image-content{margin-top:0;display:flex;align-items:flex-end;gap:1.5rem;height:0}.image-content .floating-box{position:absolute;top:25px;transform:translate(-50%) rotate(-10deg);background:#fff;padding:1rem;border-radius:20px;box-shadow:0 8px 30px #00000026;text-align:center;width:170px;z-index:3}.image-content .floating-box img{width:30px;margin-bottom:.5rem}.image-content .floating-box .label{font-size:.85rem;color:#333;margin:0}.image-content .floating-box .count{font-size:1.5rem;font-weight:700;color:#000;margin:.25rem 0 0}.image-content .screen-img{width:100%;position:absolute;bottom:5rem;left:3rem;z-index:2;transform:rotate(-1deg);box-shadow:0 8px 15px #0003;max-width:400px;margin-bottom:4rem}.image-content .person-img{max-width:800px;width:100%;position:relative;z-index:3;min-width:420px;margin-bottom:0;bottom:7rem;left:4rem}.image-content .resource-math-img{height:243px!important;min-width:350px;bottom:9rem;left:34rem;position:relative;width:350px!important}}@media(width<=991px){.resource-banner{padding-bottom:15rem}}@media(width<=768px){.resource-math-img{top:18rem}.cta-btn{justify-content:center}.resource-divider{margin-top:49rem!important}.intro{font-size:1.7rem!important}}@media(width>=768px)and (width<=991px){.cta-btn{justify-content:center}.resource-divider{margin-top:36rem!important}}@media(width>=991px){.resource-banner{padding-top:768px;padding-bottom:42px;overflow:hidden}.section-fadeout{height:40px;width:100%;background:linear-gradient(to bottom,#fff0,#f8f9fa)}.resource-heading{width:700px!important}::ng-deep .vault-section{max-width:1580px!important;padding-left:48px!important;padding-top:130px!important}}@media(width<=991px){.billing-section{flex-direction:column!important;gap:3rem}.billing-section .billing-section1,.billing-section .billing-section2{width:90%!important}.billing-section .billing-section1{margin-left:1.5rem;margin-top:4rem}}@media(width>=768px)and (width<=1200px){.container{padding:0 6rem!important}.outer-section-fadeout{top:62rem!important}}@media(max-width:991px){.resource-banner .container{display:flex;flex-direction:column;align-items:flex-start;min-height:auto}.resource-banner .text-content,.resource-banner .text-extension,.resource-banner .image-content{position:static!important;left:auto;top:auto;max-width:100%;margin:0!important}.resource-banner .text-content{margin-bottom:0!important}.text-extension{margin-top:1rem!important}.resource-banner .image-content{width:100%;height:auto;align-self:center;margin-top:auto!important}.resource-banner .resource-laptop-img{position:static!important;max-width:260px;width:100%;height:auto!important}.resource-banner{padding:2rem 0 0rem!important}}@media(max-width:575px){.resource-banner:after{height:45%}}\n",
 				".bold{font-weight:700}.resource-heading{margin-bottom:2rem}.resource-note{margin-top:1rem;font-size:.85rem;color:#555}.resource-divider{border:0;height:40px;width:100%;background:linear-gradient(to bottom,#0000,#00000026);margin:0}.press-release-icon{height:auto!important;margin:0 11px 1.9rem;display:block;align-self:center;width:auto!important;aspect-ratio:0!important;object-fit:cover;margin-top:auto;margin-right:0!important}.resource-vault-section{padding:60px 0;background:#fff;padding-bottom:9rem!important;padding-top:7rem!important;box-shadow:0 4px 32px -14px #40576d4d!important}.resource-vault-section .vault-heading{font-size:3rem;font-weight:300}.resource-vault-section .explore-link{color:#000;font-weight:400;text-decoration:none;font-size:1.5rem}.resource-vault-section .resource-blog-card{display:flex;flex-direction:column;justify-content:space-between;background-color:#fff;border-radius:30px;box-shadow:0 20px 40px #00000014;padding:25px;text-align:center;width:338px;height:auto!important}.resource-vault-section .resource-blog-card h5{font-size:1.5rem;font-weight:400;margin-bottom:.5rem;color:var(--text-color, black)}.resource-vault-section .resource-blog-card p{font-size:1.5rem;color:var(--text-color, black);line-height:2rem}.resource-vault-section .resource-blog-card img{width:100%;border-radius:10px;aspect-ratio:1/1;object-fit:cover;margin-top:auto;margin-right:0!important;max-width:250px!important;align-self:center!important}.resource-vault-section .resource-blog-card iframe{height:210px;border-radius:10px;object-fit:cover;margin-right:0!important;max-width:280px!important}.resource-vault-section .resource-blog-card .resource-btn{background-color:var(--text-color, black);color:#fff;margin-top:auto;padding:10px 24px;border-radius:24px;font-size:1.5rem;font-weight:500;width:100%;max-width:240px;cursor:pointer;transition:background .3s ease;display:flex;justify-content:space-between;align-self:center;align-items:center;text-align:left;text-decoration:none;border:1px solid;box-shadow:none!important;border-color:var(--text-color, black)}.resource-vault-section .resource-blog-card .resource-btn:hover{background:#fff;color:var(--text-color, black)!important}.resource-vault-section .vault-description{text-align:left;max-width:657px;color:#182527;line-height:2.3rem!important;font-size:1.65rem}@media(width<=1200px){.resource-vault-section .vault-heading{font-size:3.5rem}.resource-vault-section .vault-description{margin-top:1.35rem}.resource-vault-section .resource-btn{margin-left:0!important}}.video-row{gap:5.5rem!important;margin-top:3rem!important}@media(width>=991px){section.bg-white.text-center.extra-top-padding{position:relative;overflow:hidden}section.bg-white.text-center.extra-top-padding .banner-header{margin-bottom:4rem!important}}.vault-header{text-align:left}@media(width>=768px)and (width<=1200px){.container{padding:0 6rem!important}}@media(width<=768px){.video-row{gap:3rem!important}}@media(max-width:768px){.resource-vault-section{padding-bottom:6rem!important}.resource-vault-section .container{padding-top:0rem!important;padding-bottom:0rem!important}.vault-header{text-align:center!important}.vault-heading{font-size:3rem!important}}@media(width<=1200px){.container{padding:7rem 3rem 1rem!important}}\n",
@@ -88,7 +88,7 @@ i0.ɵɵngDeclareClassMetadata({
 			selector: "pw-integration-top-banner",
 			changeDetection: ChangeDetectionStrategy.OnPush,
 			imports: [ResourceTopBannerEditComponent, LazyImgDirective],
-			template: "<section class=\"bg-white pricing-section\">\n  <div class=\"resource-banner\">\n    @if (isLoaded) {\n      <div class=\"container d-flex flex-column flex-lg-row align-items-center justify-content-between\">\n        <div class=\"text-content\">\n          <div class=\"resource-heading\">\n            <h1 class=\"resource-header-text mb-4\">\n              <span class=\"d-inline-flex align-items-center gap-2 flex-wrap\">\n                <span [innerHTML]=\"blogPostTag?.title || 'Integrated vendors'\"></span>\n                @if (canEditResourcesValue) {\n                  <pw-resource-top-banner-edit\n                    [blogPostTag]=\"blogPostTag\"\n                    [user]=\"user\"\n                    [userLoggedIn]=\"userLoggedIn\"\n                    (getUpdatedTag)=\"getTags()\"\n                  ></pw-resource-top-banner-edit>\n                }\n              </span>\n              <span class=\"blue-text\"></span>\n            </h1>\n          </div>\n        </div>\n        <div class=\"text-extension mt-4\">\n          <div class=\"cta-buttons d-flex flex-column justify-between h-100\">\n            <div class=\"flex-grow-1\">\n              @if (blogPostTag?.description && blogPostTag.description !== 'null' ) {\n                <p class=\"intro\" [innerHTML]=\"blogPostTag.description\"></p>\n              } @else {\n                <p class=\"intro\">\n                  Browse below the vendor integrations<br />\n                  we support.\n                </p>\n              }\n            </div>\n            <div class=\"d-flex gap-3 flex-wrap mt-3\">\n              <a [href]=\"contactUsUrl\" target=\"_blank\" rel=\"noopener noreferrer\"\n              class=\"cta-btn filled\">Talk to us <i class=\"fa fa-chevron-right cta-btn__icon\" aria-hidden=\"true\"></i></a>\n            </div>\n          </div>\n        </div>\n        <div class=\"image-content ms-lg-5 mt-5 mt-lg-0\">\n          <div class=\"resource-math-img\"></div>\n          <img class=\"resource-laptop-img dyn-img\"\n            [src]=\"(blogPostTag?.image?.url && !(blogPostTag?.image?.url.includes('no_image_uploaded_squared'))) ? blogPostTag?.image?.url : '/assets/img/resource/men.png'\"\n            alt=\"Integrated vendors banner\"\n            width=\"600\"\n            height=\"450\"\n            loading=\"eager\"\n            fetchpriority=\"high\" />\n        </div>\n      </div>\n    }\n  </div>\n</section>\n",
+			template: "<section class=\"bg-white pricing-section\">\n  <div class=\"resource-banner\">\n    @if (isLoaded) {\n      <div class=\"container d-flex flex-column flex-lg-row align-items-center justify-content-between\">\n        <div class=\"text-content\">\n          <div class=\"resource-heading\">\n            <h1 class=\"resource-header-text mb-4\">\n              <span class=\"d-inline-flex align-items-center gap-2 flex-wrap\">\n                <span [innerHTML]=\"blogPostTag?.title || 'Integrated vendors'\"></span>\n                @if (canEditResourcesValue) {\n                  <pw-resource-top-banner-edit\n                    [blogPostTag]=\"blogPostTag\"\n                    [user]=\"user\"\n                    [userLoggedIn]=\"userLoggedIn\"\n                    (getUpdatedTag)=\"getTags()\"\n                  ></pw-resource-top-banner-edit>\n                }\n              </span>\n              <span class=\"blue-text\"></span>\n            </h1>\n          </div>\n        </div>\n        <div class=\"text-extension mt-4\">\n          <div class=\"cta-buttons d-flex flex-column justify-between h-100\">\n            <div class=\"flex-grow-1\">\n              @if (blogPostTag?.description && blogPostTag.description !== 'null' ) {\n                <p class=\"intro\" [innerHTML]=\"blogPostTag.description\"></p>\n              } @else {\n                <p class=\"intro\">\n                  Browse below the vendor integrations<br />\n                  we support.\n                </p>\n              }\n            </div>\n            <div class=\"d-flex gap-3 flex-wrap mt-3\">\n              <a [href]=\"contactUsUrl\" target=\"_blank\" rel=\"noopener noreferrer\"\n              class=\"cta-btn filled\">Talk to us <i class=\"fa fa-chevron-right cta-btn__icon\" aria-hidden=\"true\"></i></a>\n            </div>\n          </div>\n        </div>\n        <div class=\"image-content ms-lg-5 mt-5 mt-lg-0\">\n          <div class=\"resource-math-img\"></div>\n          <img class=\"resource-laptop-img dyn-img\"\n            [src]=\"(blogPostTag?.image?.url && !(blogPostTag?.image?.url.includes('no_image_uploaded_squared'))) ? blogPostTag?.image?.url : '/assets/img/resource/men.webp'\"\n            alt=\"Integrated vendors banner\"\n            width=\"600\"\n            height=\"450\"\n            loading=\"eager\"\n            fetchpriority=\"high\" />\n        </div>\n      </div>\n    }\n  </div>\n</section>\n",
 			styles: [
 				"@charset \"UTF-8\";.cta-btn{display:inline-flex;align-items:center;gap:.6rem;background:var(--text-color, currentcolor);color:#fff;padding:1rem 2rem;border-radius:40px;font-weight:500;text-decoration:none;font-size:1.4rem;border:1px solid var(--text-color, currentcolor);box-shadow:none!important;transition:background .15s ease,color .15s ease,transform .15s ease}.cta-btn:hover{background-color:#fff!important;color:var(--text-color, currentcolor)!important;transform:translateY(-1px)}.cta-btn:focus-visible{outline:2px solid var(--text-color, currentcolor);outline-offset:3px}.cta-btn__icon{font-size:1.1rem;line-height:1}@media(width<=768px){.dyn-img{top:-3rem!important}}.text-extension{max-width:560px}.text-extension .intro{font-size:2rem;line-height:3rem;font-weight:400;color:var(--text-color, currentColor);margin-bottom:1rem}.text-extension .cta-buttons{margin-top:2rem!important}.text-extension .note{font-size:1.2rem;color:#000;margin-top:1rem;margin-left:3rem}.resource-banner{box-shadow:0 4px 32px -14px #40576d4d!important;position:relative;padding:5rem 0;color:#fff;background:linear-gradient(90deg,var(--first) 0%,#a8e1fb 100%);overflow:hidden;z-index:2}@media(width<=1200px){.resource-banner .container{padding:7rem 3rem 0rem!important}}.resource-banner:after{content:\"\";position:absolute;bottom:0;left:0;width:100%;height:61%;background:#fff;clip-path:polygon(0 18%,100% 0%,100% 100%,0% 100%)}.resource-banner .container{position:relative;z-index:2}.resource-banner .text-content{max-width:500px;text-align:left;margin-bottom:75rem}.resource-banner .text-content h1{margin-bottom:1.5rem;line-height:1.2}.resource-banner .text-content .intro{font-size:1.2rem;margin:1rem 0;color:#000}.resource-banner .text-content .cta-btn{display:inline-block;background:#000;color:#fff;padding:1rem 2rem;border-radius:40px;font-weight:500;text-decoration:none;font-size:1.4rem}.resource-banner .text-content .cta-buttons{margin-top:2rem}.resource-banner .text-content .note{margin-top:1rem;margin-left:5.6rem;font-size:.9rem;color:#555}.resource-banner .resource-header-text{max-width:500px;font-weight:500;color:#fff!important;font-size:4.5rem!important}.resource-banner .blue-text{font-weight:100}@media(width<=991px){.resource-banner .text-content{margin-top:1.5rem;margin-bottom:0;text-align:center;max-width:360px}.resource-banner .text-content h1{margin-bottom:6.5rem!important}.resource-banner .resource-header-text{font-size:2.5rem!important}.resource-banner .cta-buttons{margin-top:0rem!important;justify-content:center!important}.resource-banner .note{margin-left:8rem!important}.resource-banner .image-content{position:relative;margin-bottom:3rem;height:230px}.resource-banner .image-content .floating-box{position:absolute;top:25px;left:3rem;transform:translate(-50%) rotate(-10deg);background:#fff;padding:.75rem 1rem;border-radius:20px;box-shadow:0 8px 30px #00000026;text-align:center;z-index:3;display:inline-block;width:auto}.resource-banner .image-content .floating-box img{width:24px;margin-bottom:.4rem}.resource-banner .image-content .floating-box .label{font-size:.75rem;color:#333;margin:0;line-height:1.2}.resource-banner .image-content .floating-box .count{font-size:1.2rem;font-weight:700;color:#000;margin-top:.25rem}.resource-banner .image-content .screen-img{max-width:280px;position:absolute;bottom:0;left:3rem;z-index:2;transform:rotate(-1deg);box-shadow:0 8px 15px #0003}.resource-banner .image-content .person-img{max-width:170px;width:100%;position:relative;z-index:3;left:13rem;top:-11.35rem}.resource-banner .image-content .resource-laptop-img{max-width:300px;width:100%;position:relative;z-index:3;margin-top:3rem;left:2%;height:auto!important;top:4rem}}@media(width>=991px){.resource-banner .text-content{position:absolute;width:760px}}.white-content{background:#fff;color:#000}.white-content .intro{font-size:1.2rem;color:#000}.white-content .note{font-size:.85rem;margin-top:1rem;color:#555}@media(width>=991px){.section-outer{padding-top:7rem!important}}@media(width>=768px)and (width<=991px){.resource-math-img{left:36%!important;top:22rem!important}}@media(width>=991px)and (width<=1200px){.text-extension{max-width:760px;position:absolute;margin-bottom:23rem!important}.resource-divider{top:63.5rem;position:absolute!important}.resource-banner{padding-bottom:90px!important}}@media(width>=1200px){.text-extension{max-width:500px;position:absolute;margin-bottom:31rem!important}.resource-laptop-img{width:100%;max-width:800px!important;max-height:800px!important;height:auto}}@media(width>=1200px){.resource-divider{top:59.5rem;position:absolute!important}.cta-tab{margin-bottom:5rem!important}}@media(width>=1200px){.image-content{margin-top:0;display:flex;align-items:flex-end;gap:1.5rem;height:0}.image-content .floating-box{position:absolute;top:25px;transform:translate(-50%) rotate(-10deg);background:#fff;padding:1rem;border-radius:20px;box-shadow:0 8px 30px #00000026;text-align:center;width:170px;z-index:3}.image-content .floating-box img{width:30px;margin-bottom:.5rem}.image-content .floating-box .label{font-size:.85rem;color:#333;margin:0}.image-content .floating-box .count{font-size:1.5rem;font-weight:700;color:#000;margin:.25rem 0 0}.image-content .screen-img{width:100%;position:absolute;bottom:5rem;left:3rem;z-index:2;transform:rotate(-1deg);box-shadow:0 8px 15px #0003;max-width:400px;margin-bottom:4rem}.image-content .person-img{max-width:800px;width:100%;position:relative;z-index:3;min-width:420px;margin-bottom:0;bottom:7rem;left:4rem}.image-content .resource-laptop-img{top:4rem;left:2rem;position:relative}.image-content .resource-math-img{bottom:9rem;left:61rem;position:relative;height:312px;margin-right:1rem;min-width:450px!important}}@media(width<=786px){.text-extension{position:absolute;margin:3rem;margin-top:11rem!important}}@media(width>=786px)and (width<=991px){.text-extension{position:absolute;margin:3rem;margin-top:24rem!important}}@media(width>=704px)and (width<=768px){.resource-laptop-img{top:18rem!important;right:30%!important;left:auto!important}}@media(width>=786px)and (width<=991px){.resource-laptop-img{max-width:250px!important;top:18rem!important;right:30%!important;left:auto!important}}@media(width>=991px)and (width<=1200px){.resource-laptop-img{top:7rem;left:3%;position:relative;width:100%;max-width:600px!important;height:auto}}@media(width>=786px)and (width<=1200px){.image-content{margin-top:0;display:flex;align-items:flex-end;gap:1.5rem;height:0}.image-content .floating-box{position:absolute;top:25px;transform:translate(-50%) rotate(-10deg);background:#fff;padding:1rem;border-radius:20px;box-shadow:0 8px 30px #00000026;text-align:center;width:170px;z-index:3}.image-content .floating-box img{width:30px;margin-bottom:.5rem}.image-content .floating-box .label{font-size:.85rem;color:#333;margin:0}.image-content .floating-box .count{font-size:1.5rem;font-weight:700;color:#000;margin:.25rem 0 0}.image-content .screen-img{width:100%;position:absolute;bottom:5rem;left:3rem;z-index:2;transform:rotate(-1deg);box-shadow:0 8px 15px #0003;max-width:400px;margin-bottom:4rem}.image-content .person-img{max-width:800px;width:100%;position:relative;z-index:3;min-width:420px;margin-bottom:0;bottom:7rem;left:4rem}.image-content .resource-math-img{height:243px!important;min-width:350px;bottom:9rem;left:34rem;position:relative;width:350px!important}}@media(width<=991px){.resource-banner{padding-bottom:15rem}}@media(width<=768px){.resource-math-img{top:18rem}.cta-btn{justify-content:center}.resource-divider{margin-top:49rem!important}.intro{font-size:1.7rem!important}}@media(width>=768px)and (width<=991px){.cta-btn{justify-content:center}.resource-divider{margin-top:36rem!important}}@media(width>=991px){.resource-banner{padding-top:768px;padding-bottom:42px;overflow:hidden}.section-fadeout{height:40px;width:100%;background:linear-gradient(to bottom,#fff0,#f8f9fa)}.resource-heading{width:700px!important}::ng-deep .vault-section{max-width:1580px!important;padding-left:48px!important;padding-top:130px!important}}@media(width<=991px){.billing-section{flex-direction:column!important;gap:3rem}.billing-section .billing-section1,.billing-section .billing-section2{width:90%!important}.billing-section .billing-section1{margin-left:1.5rem;margin-top:4rem}}@media(width>=768px)and (width<=1200px){.container{padding:0 6rem!important}.outer-section-fadeout{top:62rem!important}}@media(max-width:991px){.resource-banner .container{display:flex;flex-direction:column;align-items:flex-start;min-height:auto}.resource-banner .text-content,.resource-banner .text-extension,.resource-banner .image-content{position:static!important;left:auto;top:auto;max-width:100%;margin:0!important}.resource-banner .text-content{margin-bottom:0!important}.text-extension{margin-top:1rem!important}.resource-banner .image-content{width:100%;height:auto;align-self:center;margin-top:auto!important}.resource-banner .resource-laptop-img{position:static!important;max-width:260px;width:100%;height:auto!important}.resource-banner{padding:2rem 0 0rem!important}}@media(max-width:575px){.resource-banner:after{height:45%}}\n",
 				".bold{font-weight:700}.resource-heading{margin-bottom:2rem}.resource-note{margin-top:1rem;font-size:.85rem;color:#555}.resource-divider{border:0;height:40px;width:100%;background:linear-gradient(to bottom,#0000,#00000026);margin:0}.press-release-icon{height:auto!important;margin:0 11px 1.9rem;display:block;align-self:center;width:auto!important;aspect-ratio:0!important;object-fit:cover;margin-top:auto;margin-right:0!important}.resource-vault-section{padding:60px 0;background:#fff;padding-bottom:9rem!important;padding-top:7rem!important;box-shadow:0 4px 32px -14px #40576d4d!important}.resource-vault-section .vault-heading{font-size:3rem;font-weight:300}.resource-vault-section .explore-link{color:#000;font-weight:400;text-decoration:none;font-size:1.5rem}.resource-vault-section .resource-blog-card{display:flex;flex-direction:column;justify-content:space-between;background-color:#fff;border-radius:30px;box-shadow:0 20px 40px #00000014;padding:25px;text-align:center;width:338px;height:auto!important}.resource-vault-section .resource-blog-card h5{font-size:1.5rem;font-weight:400;margin-bottom:.5rem;color:var(--text-color, black)}.resource-vault-section .resource-blog-card p{font-size:1.5rem;color:var(--text-color, black);line-height:2rem}.resource-vault-section .resource-blog-card img{width:100%;border-radius:10px;aspect-ratio:1/1;object-fit:cover;margin-top:auto;margin-right:0!important;max-width:250px!important;align-self:center!important}.resource-vault-section .resource-blog-card iframe{height:210px;border-radius:10px;object-fit:cover;margin-right:0!important;max-width:280px!important}.resource-vault-section .resource-blog-card .resource-btn{background-color:var(--text-color, black);color:#fff;margin-top:auto;padding:10px 24px;border-radius:24px;font-size:1.5rem;font-weight:500;width:100%;max-width:240px;cursor:pointer;transition:background .3s ease;display:flex;justify-content:space-between;align-self:center;align-items:center;text-align:left;text-decoration:none;border:1px solid;box-shadow:none!important;border-color:var(--text-color, black)}.resource-vault-section .resource-blog-card .resource-btn:hover{background:#fff;color:var(--text-color, black)!important}.resource-vault-section .vault-description{text-align:left;max-width:657px;color:#182527;line-height:2.3rem!important;font-size:1.65rem}@media(width<=1200px){.resource-vault-section .vault-heading{font-size:3.5rem}.resource-vault-section .vault-description{margin-top:1.35rem}.resource-vault-section .resource-btn{margin-left:0!important}}.video-row{gap:5.5rem!important;margin-top:3rem!important}@media(width>=991px){section.bg-white.text-center.extra-top-padding{position:relative;overflow:hidden}section.bg-white.text-center.extra-top-padding .banner-header{margin-bottom:4rem!important}}.vault-header{text-align:left}@media(width>=768px)and (width<=1200px){.container{padding:0 6rem!important}}@media(width<=768px){.video-row{gap:3rem!important}}@media(max-width:768px){.resource-vault-section{padding-bottom:6rem!important}.resource-vault-section .container{padding-top:0rem!important;padding-bottom:0rem!important}.vault-header{text-align:center!important}.vault-heading{font-size:3rem!important}}@media(width<=1200px){.container{padding:7rem 3rem 1rem!important}}\n",
@@ -306,7 +306,7 @@ var ResourceIntegrationComponent = class ResourceIntegrationComponent extends Ap
 			}],
 			usesInheritance: true,
 			ngImport: i0,
-			template: "<pw-resource-header [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-resource-header>\n<pw-integration-top-banner></pw-integration-top-banner>\n<div class=\"bg-white\">\n  <section class=\"guide-section bg-white py-5 section-outer\">\n    <div class=\"container sec-container\">\n      @if (isLoaded && (posts.length + distributerPosts.length) > 0) {\n        <div>\n          <h1 class=\"int-title mb-0\">{{ integrationCountDisplay }}+ integrations <span class=\"int-title__sub\">(&amp; counting)</span></h1>\n          <p class=\"int-text\">Search the current list of {{ companyName }} vendor and distributor integrations below.</p>\n        </div>\n      }\n      @if (isLoaded) {\n        <pw-resource-company-card [header]=\"'integrated vendors'\"\n          (getPosts)=\"getPostTags()\"\n          [integrationCountDisplay]=\"integrationCountDisplay\"\n          [data]=\"posts\"\n          [user]=\"user\"\n        [userLoggedIn]=\"userLoggedIn\"></pw-resource-company-card>\n      }\n      @if (!isLoaded) {\n        <div class=\"w-100 text-center mt-3\"\n          >\n          <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n        </div>\n      }\n      @if (integrationCountDisplay === 0 && isLoaded) {\n        <div>\n          <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n        </div>\n      }\n      @if (isLoaded && (posts.length + distributerPosts.length) > 0) {\n        <div class=\"text-center pt-3 mt-4\">\n          <p class=\"see-span\">Don&rsquo;t see what you&rsquo;re after? <a [href]=\"contactUsUrl\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            class=\"int-span team-span\">Speak with our team to request a connection <i class=\"fa fa-chevron-right team-span__icon\" aria-hidden=\"true\"></i></a>\n        </p>\n      </div>\n    }\n  </div>\n\n</section>\n<section class=\"guide-section bg-white py-5 section-outer\">\n  <div class=\"container\">\n    @if (isLoaded) {\n      <pw-resource-company-card [header]=\"'integrated Distributors'\"\n        [integrationCountDisplay]=\"integrationCountDisplay\"\n        [vendor]=\"true\"\n        (getPosts)=\"getPostTags()\"\n        [data]=\"distributerPosts\"\n        [user]=\"user\"\n      [userLoggedIn]=\"userLoggedIn\"></pw-resource-company-card>\n    }\n    @if (!isLoaded) {\n      <div class=\"w-100 text-center mt-3\"\n        >\n        <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n      </div>\n    }\n    @if (integrationCountDisplay === 0 && isLoaded) {\n      <div>\n        <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n      </div>\n    }\n  </div>\n\n</section>\n@if (integrations) {\n  <section class=\"guide-section bg-white py-5 section-outer\">\n    <div class=\"container\">\n      <div class=\"how-it-works-wrapper\">\n        <div class=\"d-flex\">\n          <h2 class=\"it-works-title mb-0\">{{ integrations?.title || 'How it works' }}</h2>\n          @if (canEditResourcesValue) {\n            <i\n              class=\"fa fa-edit in-page-edit-icon text-black ms-4 mt-3 cursor-pointer\"\n              (click)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n              (keydown.enter)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n              (keydown.space)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n            title=\"Edit Integrations Section\"></i>\n          }\n        </div>\n        <p class=\"pb-20\" [innerHTML]=\"integrations?.description || 'View short example videos to understand how these integrations can work for you:'\"></p>\n        <div class=\"row section-row\"  [ngClass]=\"{ 'justify-content-center': integrations?.items?.length === 1 }\">\n          @if (integrations?.items?.length > 0) {\n            @for (integration of integrations?.items; track integration) {\n              @if (integration?.image_url || integration?.title || integration?.description) {\n                <div\n                  class=\"col-md-6\"\n                  >\n                  @if (integration?.video_url && integration?.video_url.includes('https')) {\n                    <div class=\"d-flex justify-content-center cursor-pointer\">\n                      @if (integration?.video_url) {\n                        <img\n                          [src]=\"integration?.image_url\"\n                          (click)=\"loadMicrosoftVideo(integration?.video_url)\"\n                          (keydown.enter)=\"loadMicrosoftVideo(integration?.video_url)\"\n                          class=\"how-it-works-img\"\n                          alt=\"Integration Video Thumbnail\"\n                          />\n                      }\n                    </div>\n                  } @else {\n                    <div class=\"d-flex justify-content-center\">\n                      <div class=\"w-100\">\n                        <pw-no-data [withImage]=\"true\" [message]=\"'No video found' | transloco\">\n                        </pw-no-data>\n                      </div>\n                    </div>\n                  }\n                </div>\n              }\n            }\n          } @else {\n            <div class=\"w-100 text-center\">\n              <pw-no-data [withImage]=\"true\" [message]=\"'Integration.NoDataMessage' | transloco\"></pw-no-data>\n            </div>\n          }\n        </div>\n      </div>\n    </div>\n  </section>\n}\n@if (showIntegrations()) {\n  <section class=\"guide-section bg-white py-5 section-outer\">\n    <div class=\"container\">\n      <div class=\"row align-items-start\">\n        <div class=\"col-md-6 text-md-start text-center\">\n          <div class=\"d-flex\">\n            <h2 class=\"guide-title mb-3\">{{ guideData?.items?.[0]?.title || 'Featured guide' }}</h2>\n            @if (canEditResourcesValue) {\n              <button type=\"button\"\n                class=\"in-page-edit-icon text-black ms-4 mt-3 cursor-pointer\"\n                (click)=\"openGuidesModal(guidesEditModal)\"\n                title=\"Edit featured guide\"\n                aria-label=\"Edit featured guide\">\n                <i class=\"fa fa-edit\" aria-hidden=\"true\"></i>\n              </button>\n            }\n          </div>\n          <p class=\"guide-subtext\"\n            [innerHTML]=\"guideData?.items?.[0]?.description || (canEditResourcesValue ? 'Add a featured guide via Admin &rarr; Domain config &rarr; Integrations.' : 'A practical walkthrough of how to get the most from your integrations.')\">\n          </p>\n          @if (guideData?.items?.[0]?.guide_url) {\n            <a class=\"vault-btn\"\n              [href]=\"guideData?.items?.[0]?.guide_url\"\n              target=\"_blank\"\n              rel=\"noopener noreferrer\">\n              {{ guideData?.items?.[0]?.button_text || 'View the guide' }} <i class=\"fa fa-chevron-right vault-btn__icon\" aria-hidden=\"true\"></i>\n            </a>\n          }\n        </div>\n        <div class=\"col-md-6 text-center\">\n          @if (guideData?.items?.[0]?.image_url && !guideData?.items?.[0]?.image_url?.includes('default-photo.jpg')) {\n            <img\n              [src]=\"guideData?.items?.[0]?.image_url\"\n              alt=\"\"\n              class=\"guide-img\"\n              loading=\"lazy\" />\n          }\n        </div>\n      </div>\n    </div>\n  </section>\n}\n</div>\n\n@if (resourcePostTag?.tag_category_id) {\n  <pw-resource-note-card [categoryId]=\"resourcePostTag?.tag_category_id\" [tag]=\"resourcePostTag\" [releaseHeader]=\"true\" [resourceTitle]=\"resourcePostTag?.title\" [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-resource-note-card>\n}\n\n<pw-trial-4-contact-us [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-trial-4-contact-us>\n\n\n\n<ng-template #editIntegrationsModal let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Edit Integrations Section</h5>\n    <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n  </div>\n\n  <div class=\"modal-body\">\n    <div class=\"mb-3\">\n      <label class=\"form-label\" for=\"integration-title\">Title</label>\n      <input class=\"form-control\" id=\"integration-title\" [(ngModel)]=\"editingIntegrations.title\"\n          aria-label=\"Integration Title\" />\n    </div>\n\n    <div class=\"mb-3\">\n      <label class=\"form-label\" for=\"integration-description\">Description</label>\n      <textarea class=\"form-control\" id=\"integration-description\" rows=\"3\" [(ngModel)]=\"editingIntegrations.description\"\n          aria-label=\"Integration Description\"></textarea>\n    </div>\n\n    <div cdkDropList (cdkDropListDropped)=\"dropIntegrationItems($event)\">\n      @for (integration of editingIntegrations.items; track integration; let i = $index) {\n        <div class=\"border p-3 mb-3\" cdkDrag>\n          <div class=\"d-flex justify-content-between align-items-center mb-2\">\n            <span class=\"pw-label-style form-label mb-0\" id=\"integration-item-label\">Integration Item</span>\n            <i class=\"fa fa-bars cursor-move in-page-bars-icon\" cdkDragHandle></i>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-title-' + i\">Title</label>\n              <input class=\"form-control\" [id]=\"'integration-item-title-' + i\" [(ngModel)]=\"integration.title\" id=\"input_integration.title_7712\" name=\"input_integration.title_7712\"\n                  aria-label=\"Input Integration.title 7712\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-description-' + i\">Description</label>\n              <input class=\"form-control\" [id]=\"'integration-item-description-' + i\" [(ngModel)]=\"integration.description\" id=\"input_integration.description_9056\" name=\"input_integration.description_9056\"\n                  aria-label=\"Input Integration.description 9056\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-blog-url-' + i\">Blog URL</label>\n              <input class=\"form-control\" [id]=\"'integration-item-blog-url-' + i\" [(ngModel)]=\"integration.blog_url\" id=\"input_integration.blog_url_7856\" name=\"input_integration.blog_url_7856\"\n                  aria-label=\"Input Integration.blog Url 7856\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-image-url-' + i\">Image URL</label>\n              <input class=\"form-control\" [id]=\"'integration-item-image-url-' + i\" [(ngModel)]=\"integration.image_url\" id=\"input_integration.image_url_9056\" name=\"input_integration.image_url_9056\"\n                  aria-label=\"Input Integration.image Url 9056\" />\n            </div>\n            <div class=\"col-md-12 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-video-url-' + i\">Video URL</label>\n              <input class=\"form-control\" [id]=\"'integration-item-video-url-' + i\" [(ngModel)]=\"integration.video_url\" id=\"input_integration.video_url_9056\" name=\"input_integration.video_url_9056\"\n                  aria-label=\"Input Integration.video Url 9056\" />\n            </div>\n          </div>\n          <div class=\"d-flex justify-content-end\">\n            <i class=\"fa fa-trash text-danger cursor-pointer\" (click)=\"removeIntegrationItem(i)\"   (keydown.enter)=\"removeIntegrationItem(i)\"\n            (keydown.space)=\"removeIntegrationItem(i)\"></i>\n          </div>\n        </div>\n      }\n    </div>\n\n    <button class=\"btn btn-outline-primary btn-sm\" (click)=\"addIntegrationItem()\">+ Add Integration</button>\n  </div>\n\n  <div class=\"modal-footer\">\n    <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n    <button class=\"btn btn-primary\" (click)=\"saveIntegrations(modal)\">Save</button>\n  </div>\n</ng-template>\n\n\n\n<ng-template #guidesEditModal let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Edit Guides</h5>\n    <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n  </div>\n\n  <div class=\"modal-body\">\n    <h4 class=\"mb-3\">Guides Section</h4>\n\n    <div cdkDropList (cdkDropListDropped)=\"dropGuides($event)\">\n      @for (guide of editingGuides.items; track guide; let i = $index) {\n        <div class=\"border p-3 mb-3\" cdkDrag>\n          <div class=\"row\">\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-title-' + i\">Title</label>\n              <input class=\"form-control\" [id]=\"'guide-title-' + i\" [(ngModel)]=\"guide.title\" id=\"input_guide.title_7072\" name=\"input_guide.title_7072\"\n                  aria-label=\"Input Guide.title 7072\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-button-text-' + i\">Button Text</label>\n              <input class=\"form-control\" [id]=\"'guide-button-text-' + i\" [(ngModel)]=\"guide.button_text\" id=\"input_guide.button_text_7712\" name=\"input_guide.button_text_7712\"\n                  aria-label=\"Input Guide.button Text 7712\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-image-url-' + i\">Image URL</label>\n              <input class=\"form-control\" [id]=\"'guide-image-url-' + i\" [(ngModel)]=\"guide.image_url\" id=\"input_guide.image_url_7856\" name=\"input_guide.image_url_7856\"\n                  aria-label=\"Input Guide.image Url 7856\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-url-' + i\">Guide URL</label>\n              <input class=\"form-control\" [id]=\"'guide-url-' + i\" [(ngModel)]=\"guide.guide_url\" id=\"input_guide.guide_url_6944\" name=\"input_guide.guide_url_6944\"\n                  aria-label=\"Input Guide.guide Url 6944\" />\n            </div>\n            <div class=\"col-12 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-description-' + i\">Description</label>\n              <textarea class=\"form-control\" [id]=\"'guide-description-' + i\" [name]=\"'guide-description-' + i\" rows=\"3\" [(ngModel)]=\"guide.description\"></textarea>\n            </div>\n            <div class=\"d-flex justify-content-between align-items-center mt-2\">\n              <i class=\"fa fa-trash text-danger cursor-pointer\" (click)=\"removeGuide(i)\" (keydown.enter)=\"removeGuide(i)\" (keydown.space)=\"removeGuide(i)\"></i>\n              <i class=\"fa fa-bars cursor-move\" cdkDragHandle></i>\n            </div>\n          </div>\n        </div>\n      }\n    </div>\n\n    <button class=\"btn btn-primary mt-2\" (click)=\"addGuide()\">+ Add Guide</button>\n  </div>\n\n  <div class=\"modal-footer\">\n    <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n    <button class=\"btn btn-primary\" (click)=\"saveGuides(modal)\">Save</button>\n  </div>\n</ng-template>\n",
+			template: "<pw-resource-header [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-resource-header>\n<main>\n<pw-integration-top-banner></pw-integration-top-banner>\n<div class=\"bg-white\">\n  <section class=\"guide-section bg-white py-5 section-outer\">\n    <div class=\"container sec-container\">\n      @if (isLoaded && (posts.length + distributerPosts.length) > 0) {\n        <div>\n          <h1 class=\"int-title mb-0\">{{ integrationCountDisplay }}+ integrations <span class=\"int-title__sub\">(&amp; counting)</span></h1>\n          <p class=\"int-text\">Search the current list of {{ companyName }} vendor and distributor integrations below.</p>\n        </div>\n      }\n      @if (isLoaded) {\n        <pw-resource-company-card [header]=\"'integrated vendors'\"\n          (getPosts)=\"getPostTags()\"\n          [integrationCountDisplay]=\"integrationCountDisplay\"\n          [data]=\"posts\"\n          [user]=\"user\"\n        [userLoggedIn]=\"userLoggedIn\"></pw-resource-company-card>\n      }\n      @if (!isLoaded) {\n        <div class=\"w-100 text-center mt-3\"\n          >\n          <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n        </div>\n      }\n      @if (integrationCountDisplay === 0 && isLoaded) {\n        <div>\n          <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n        </div>\n      }\n      @if (isLoaded && (posts.length + distributerPosts.length) > 0) {\n        <div class=\"text-center pt-3 mt-4\">\n          <p class=\"see-span\">Don&rsquo;t see what you&rsquo;re after? <a [href]=\"contactUsUrl\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            class=\"int-span team-span\">Speak with our team to request a connection <i class=\"fa fa-chevron-right team-span__icon\" aria-hidden=\"true\"></i></a>\n        </p>\n      </div>\n    }\n  </div>\n\n</section>\n<section class=\"guide-section bg-white py-5 section-outer\">\n  <div class=\"container\">\n    @if (isLoaded) {\n      <pw-resource-company-card [header]=\"'integrated Distributors'\"\n        [integrationCountDisplay]=\"integrationCountDisplay\"\n        [vendor]=\"true\"\n        (getPosts)=\"getPostTags()\"\n        [data]=\"distributerPosts\"\n        [user]=\"user\"\n      [userLoggedIn]=\"userLoggedIn\"></pw-resource-company-card>\n    }\n    @if (!isLoaded) {\n      <div class=\"w-100 text-center mt-3\"\n        >\n        <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n      </div>\n    }\n    @if (integrationCountDisplay === 0 && isLoaded) {\n      <div>\n        <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n      </div>\n    }\n  </div>\n\n</section>\n@if (integrations) {\n  <section class=\"guide-section bg-white py-5 section-outer\">\n    <div class=\"container\">\n      <div class=\"how-it-works-wrapper\">\n        <div class=\"d-flex\">\n          <h2 class=\"it-works-title mb-0\">{{ integrations?.title || 'How it works' }}</h2>\n          @if (canEditResourcesValue) {\n            <i\n              class=\"fa fa-edit in-page-edit-icon text-black ms-4 mt-3 cursor-pointer\"\n              (click)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n              (keydown.enter)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n              (keydown.space)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n            title=\"Edit Integrations Section\"></i>\n          }\n        </div>\n        <p class=\"pb-20\" [innerHTML]=\"integrations?.description || 'View short example videos to understand how these integrations can work for you:'\"></p>\n        <div class=\"row section-row\"  [ngClass]=\"{ 'justify-content-center': integrations?.items?.length === 1 }\">\n          @if (integrations?.items?.length > 0) {\n            @for (integration of integrations?.items; track integration) {\n              @if (integration?.image_url || integration?.title || integration?.description) {\n                <div\n                  class=\"col-md-6\"\n                  >\n                  @if (integration?.video_url && integration?.video_url.includes('https')) {\n                    <div class=\"d-flex justify-content-center cursor-pointer\">\n                      @if (integration?.video_url) {\n                        <img\n                          [src]=\"integration?.image_url\"\n                          (click)=\"loadMicrosoftVideo(integration?.video_url)\"\n                          (keydown.enter)=\"loadMicrosoftVideo(integration?.video_url)\"\n                          class=\"how-it-works-img\"\n                          alt=\"Integration Video Thumbnail\"\n                          />\n                      }\n                    </div>\n                  } @else {\n                    <div class=\"d-flex justify-content-center\">\n                      <div class=\"w-100\">\n                        <pw-no-data [withImage]=\"true\" [message]=\"'No video found' | transloco\">\n                        </pw-no-data>\n                      </div>\n                    </div>\n                  }\n                </div>\n              }\n            }\n          } @else {\n            <div class=\"w-100 text-center\">\n              <pw-no-data [withImage]=\"true\" [message]=\"'Integration.NoDataMessage' | transloco\"></pw-no-data>\n            </div>\n          }\n        </div>\n      </div>\n    </div>\n  </section>\n}\n@if (showIntegrations()) {\n  <section class=\"guide-section bg-white py-5 section-outer\">\n    <div class=\"container\">\n      <div class=\"row align-items-start\">\n        <div class=\"col-md-6 text-md-start text-center\">\n          <div class=\"d-flex\">\n            <h2 class=\"guide-title mb-3\">{{ guideData?.items?.[0]?.title || 'Featured guide' }}</h2>\n            @if (canEditResourcesValue) {\n              <button type=\"button\"\n                class=\"in-page-edit-icon text-black ms-4 mt-3 cursor-pointer\"\n                (click)=\"openGuidesModal(guidesEditModal)\"\n                title=\"Edit featured guide\"\n                aria-label=\"Edit featured guide\">\n                <i class=\"fa fa-edit\" aria-hidden=\"true\"></i>\n              </button>\n            }\n          </div>\n          <p class=\"guide-subtext\"\n            [innerHTML]=\"guideData?.items?.[0]?.description || (canEditResourcesValue ? 'Add a featured guide via Admin &rarr; Domain config &rarr; Integrations.' : 'A practical walkthrough of how to get the most from your integrations.')\">\n          </p>\n          @if (guideData?.items?.[0]?.guide_url) {\n            <a class=\"vault-btn\"\n              [href]=\"guideData?.items?.[0]?.guide_url\"\n              target=\"_blank\"\n              rel=\"noopener noreferrer\">\n              {{ guideData?.items?.[0]?.button_text || 'View the guide' }} <i class=\"fa fa-chevron-right vault-btn__icon\" aria-hidden=\"true\"></i>\n            </a>\n          }\n        </div>\n        <div class=\"col-md-6 text-center\">\n          @if (guideData?.items?.[0]?.image_url && !guideData?.items?.[0]?.image_url?.includes('default-photo.jpg')) {\n            <img\n              [src]=\"guideData?.items?.[0]?.image_url\"\n              alt=\"\"\n              class=\"guide-img\"\n              loading=\"lazy\" />\n          }\n        </div>\n      </div>\n    </div>\n  </section>\n}\n</div>\n\n@if (resourcePostTag?.tag_category_id) {\n  <pw-resource-note-card [categoryId]=\"resourcePostTag?.tag_category_id\" [tag]=\"resourcePostTag\" [releaseHeader]=\"true\" [resourceTitle]=\"resourcePostTag?.title\" [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-resource-note-card>\n}\n\n</main>\n<pw-trial-4-contact-us [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-trial-4-contact-us>\n\n\n\n<ng-template #editIntegrationsModal let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Edit Integrations Section</h5>\n    <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n  </div>\n\n  <div class=\"modal-body\">\n    <div class=\"mb-3\">\n      <label class=\"form-label\" for=\"integration-title\">Title</label>\n      <input class=\"form-control\" id=\"integration-title\" [(ngModel)]=\"editingIntegrations.title\"\n          aria-label=\"Integration Title\" />\n    </div>\n\n    <div class=\"mb-3\">\n      <label class=\"form-label\" for=\"integration-description\">Description</label>\n      <textarea class=\"form-control\" id=\"integration-description\" rows=\"3\" [(ngModel)]=\"editingIntegrations.description\"\n          aria-label=\"Integration Description\"></textarea>\n    </div>\n\n    <div cdkDropList (cdkDropListDropped)=\"dropIntegrationItems($event)\">\n      @for (integration of editingIntegrations.items; track integration; let i = $index) {\n        <div class=\"border p-3 mb-3\" cdkDrag>\n          <div class=\"d-flex justify-content-between align-items-center mb-2\">\n            <span class=\"pw-label-style form-label mb-0\" id=\"integration-item-label\">Integration Item</span>\n            <i class=\"fa fa-bars cursor-move in-page-bars-icon\" cdkDragHandle></i>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-title-' + i\">Title</label>\n              <input class=\"form-control\" [id]=\"'integration-item-title-' + i\" [(ngModel)]=\"integration.title\" id=\"input_integration.title_7712\" name=\"input_integration.title_7712\"\n                  aria-label=\"Input Integration.title 7712\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-description-' + i\">Description</label>\n              <input class=\"form-control\" [id]=\"'integration-item-description-' + i\" [(ngModel)]=\"integration.description\" id=\"input_integration.description_9056\" name=\"input_integration.description_9056\"\n                  aria-label=\"Input Integration.description 9056\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-blog-url-' + i\">Blog URL</label>\n              <input class=\"form-control\" [id]=\"'integration-item-blog-url-' + i\" [(ngModel)]=\"integration.blog_url\" id=\"input_integration.blog_url_7856\" name=\"input_integration.blog_url_7856\"\n                  aria-label=\"Input Integration.blog Url 7856\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-image-url-' + i\">Image URL</label>\n              <input class=\"form-control\" [id]=\"'integration-item-image-url-' + i\" [(ngModel)]=\"integration.image_url\" id=\"input_integration.image_url_9056\" name=\"input_integration.image_url_9056\"\n                  aria-label=\"Input Integration.image Url 9056\" />\n            </div>\n            <div class=\"col-md-12 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-video-url-' + i\">Video URL</label>\n              <input class=\"form-control\" [id]=\"'integration-item-video-url-' + i\" [(ngModel)]=\"integration.video_url\" id=\"input_integration.video_url_9056\" name=\"input_integration.video_url_9056\"\n                  aria-label=\"Input Integration.video Url 9056\" />\n            </div>\n          </div>\n          <div class=\"d-flex justify-content-end\">\n            <i class=\"fa fa-trash text-danger cursor-pointer\" (click)=\"removeIntegrationItem(i)\"   (keydown.enter)=\"removeIntegrationItem(i)\"\n            (keydown.space)=\"removeIntegrationItem(i)\"></i>\n          </div>\n        </div>\n      }\n    </div>\n\n    <button class=\"btn btn-outline-primary btn-sm\" (click)=\"addIntegrationItem()\">+ Add Integration</button>\n  </div>\n\n  <div class=\"modal-footer\">\n    <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n    <button class=\"btn btn-primary\" (click)=\"saveIntegrations(modal)\">Save</button>\n  </div>\n</ng-template>\n\n\n\n<ng-template #guidesEditModal let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Edit Guides</h5>\n    <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n  </div>\n\n  <div class=\"modal-body\">\n    <h4 class=\"mb-3\">Guides Section</h4>\n\n    <div cdkDropList (cdkDropListDropped)=\"dropGuides($event)\">\n      @for (guide of editingGuides.items; track guide; let i = $index) {\n        <div class=\"border p-3 mb-3\" cdkDrag>\n          <div class=\"row\">\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-title-' + i\">Title</label>\n              <input class=\"form-control\" [id]=\"'guide-title-' + i\" [(ngModel)]=\"guide.title\" id=\"input_guide.title_7072\" name=\"input_guide.title_7072\"\n                  aria-label=\"Input Guide.title 7072\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-button-text-' + i\">Button Text</label>\n              <input class=\"form-control\" [id]=\"'guide-button-text-' + i\" [(ngModel)]=\"guide.button_text\" id=\"input_guide.button_text_7712\" name=\"input_guide.button_text_7712\"\n                  aria-label=\"Input Guide.button Text 7712\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-image-url-' + i\">Image URL</label>\n              <input class=\"form-control\" [id]=\"'guide-image-url-' + i\" [(ngModel)]=\"guide.image_url\" id=\"input_guide.image_url_7856\" name=\"input_guide.image_url_7856\"\n                  aria-label=\"Input Guide.image Url 7856\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-url-' + i\">Guide URL</label>\n              <input class=\"form-control\" [id]=\"'guide-url-' + i\" [(ngModel)]=\"guide.guide_url\" id=\"input_guide.guide_url_6944\" name=\"input_guide.guide_url_6944\"\n                  aria-label=\"Input Guide.guide Url 6944\" />\n            </div>\n            <div class=\"col-12 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-description-' + i\">Description</label>\n              <textarea class=\"form-control\" [id]=\"'guide-description-' + i\" [name]=\"'guide-description-' + i\" rows=\"3\" [(ngModel)]=\"guide.description\"></textarea>\n            </div>\n            <div class=\"d-flex justify-content-between align-items-center mt-2\">\n              <i class=\"fa fa-trash text-danger cursor-pointer\" (click)=\"removeGuide(i)\" (keydown.enter)=\"removeGuide(i)\" (keydown.space)=\"removeGuide(i)\"></i>\n              <i class=\"fa fa-bars cursor-move\" cdkDragHandle></i>\n            </div>\n          </div>\n        </div>\n      }\n    </div>\n\n    <button class=\"btn btn-primary mt-2\" (click)=\"addGuide()\">+ Add Guide</button>\n  </div>\n\n  <div class=\"modal-footer\">\n    <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n    <button class=\"btn btn-primary\" (click)=\"saveGuides(modal)\">Save</button>\n  </div>\n</ng-template>\n",
 			styles: [".int-span{font-size:3rem;color:var(--first, #1968e1)}.team-span{font-size:2rem;color:var(--first, #1968e1);font-weight:400;text-decoration:none;border-radius:4px;transition:color .15s ease,text-decoration-color .15s ease}.team-span:hover{color:var(--first, #1968e1);text-decoration:underline;text-underline-offset:4px}.team-span:focus-visible{outline:2px solid var(--first, #1968e1);outline-offset:3px}.team-span__icon{font-size:1.4rem;margin-left:.4rem;vertical-align:.05em}.see-span{font-size:2rem;font-weight:300;color:#182527}::ng-deep .edit-card .in-page-edit-icon{margin-left:1rem!important;margin-top:.5rem!important}::ng-deep .modal-content{margin-top:5rem!important}.how-it-works-wrapper .it-works-title{font-size:3rem;margin-bottom:2rem;color:var(--text-color, black);font-weight:300!important;padding-bottom:12px!important;line-height:1.15}.how-it-works-wrapper .how-it-works-img{width:85%!important;margin:0 auto!important;border-radius:8px;transition:transform .2s ease,box-shadow .2s ease}.how-it-works-wrapper .how-it-works-img:hover{transform:translateY(-2px);box-shadow:0 12px 28px -16px #00000059}.how-it-works-wrapper p{padding-top:1rem;font-size:1.8rem;color:#182527;font-weight:300;line-height:1.45;margin-bottom:3rem}.guide-wrapper{padding:55px 47px 220px}.guide-wrapper .horizontal{position:absolute;left:0;bottom:24%;width:100%}.guide-wrapper .pb-20{padding-bottom:20px}.guide-wrapper .flex{display:flex}.guide-wrapper .guide-title{font: 500 28px Montserrat-Regular,sans-serif}.guide-wrapper p{font: 400 17px Montserrat-Regular,sans-serif;color:#182527}.guide-section{box-shadow:0 4px 32px -14px #40576d4d!important;position:relative}.guide-section .integration-fadeout{position:absolute;bottom:0;left:0;width:100%;height:80px;background:linear-gradient(to bottom,#fff0,#f8f9fa);pointer-events:none}@media(width>=768px){.guide-section .container-section{padding:20px 190px 20px 120px!important}}@media(width<=768px){.guide-section .container-section{padding:3rem!important}.guide-section .guide-img{max-width:236px!important}.guide-section .guide-title{font-size:2.6rem!important}.guide-section .vault-btn{width:90%!important;margin-bottom:3rem!important}.guide-section .guide-subtext{padding:2rem;line-height:1.7rem!important}}.guide-section .guide-title{font-size:3rem;font-weight:300;line-height:1.15}.guide-section .guide-subtext{font-size:1.6rem;line-height:2.4rem;color:var(--text-color, black);font-weight:300;margin-bottom:2rem}.guide-section .guide-note{font-size:1.6rem;color:#182527;font-weight:300}.guide-section .vault-btn{display:inline-flex;align-items:center;gap:.6rem;background:var(--text-color, black);color:#fff;padding:1rem 2rem;border-radius:40px;font-weight:500;text-decoration:none;margin-top:1rem!important;font-size:1.4rem;border:1px solid;box-shadow:none!important;border-color:var(--text-color, currentcolor);transition:background .15s ease,color .15s ease,transform .15s ease}.guide-section .vault-btn:hover{background:#fff;color:var(--text-color, black)!important;transform:translateY(-1px)}.guide-section .vault-btn:focus-visible{outline:2px solid var(--text-color, black);outline-offset:3px}.guide-section .vault-btn__icon{font-size:1.1rem}.guide-section .guide-img{max-width:536px;max-height:536px!important;height:auto;border-radius:12px}.int-title{color:var(--text-color, black);font-size:4rem!important;font-weight:400;line-height:1.1}.int-title__sub{font-size:.55em;font-weight:300;opacity:.7;margin-left:.4rem;vertical-align:.3em}.int-text{font-size:1.4rem;font-weight:400;color:#182527;line-height:1.6;margin-top:.6rem}@media(width<=768px){.int-title{font-size:3rem!important}.int-span,.team-span,.see-span{font-size:1.6rem}}@media(width>=991px){.section-outer{padding-top:4.5rem!important}}\n", ".bold{font-weight:700}.resource-heading{margin-bottom:2rem}.resource-note{margin-top:1rem;font-size:.85rem;color:#555}.resource-divider{border:0;height:40px;width:100%;background:linear-gradient(to bottom,#0000,#00000026);margin:0}.press-release-icon{height:auto!important;margin:0 11px 1.9rem;display:block;align-self:center;width:auto!important;aspect-ratio:0!important;object-fit:cover;margin-top:auto;margin-right:0!important}.resource-vault-section{padding:60px 0;background:#fff;padding-bottom:9rem!important;padding-top:7rem!important;box-shadow:0 4px 32px -14px #40576d4d!important}.resource-vault-section .vault-heading{font-size:3rem;font-weight:300}.resource-vault-section .explore-link{color:#000;font-weight:400;text-decoration:none;font-size:1.5rem}.resource-vault-section .resource-blog-card{display:flex;flex-direction:column;justify-content:space-between;background-color:#fff;border-radius:30px;box-shadow:0 20px 40px #00000014;padding:25px;text-align:center;width:338px;height:auto!important}.resource-vault-section .resource-blog-card h5{font-size:1.5rem;font-weight:400;margin-bottom:.5rem;color:var(--text-color, black)}.resource-vault-section .resource-blog-card p{font-size:1.5rem;color:var(--text-color, black);line-height:2rem}.resource-vault-section .resource-blog-card img{width:100%;border-radius:10px;aspect-ratio:1/1;object-fit:cover;margin-top:auto;margin-right:0!important;max-width:250px!important;align-self:center!important}.resource-vault-section .resource-blog-card iframe{height:210px;border-radius:10px;object-fit:cover;margin-right:0!important;max-width:280px!important}.resource-vault-section .resource-blog-card .resource-btn{background-color:var(--text-color, black);color:#fff;margin-top:auto;padding:10px 24px;border-radius:24px;font-size:1.5rem;font-weight:500;width:100%;max-width:240px;cursor:pointer;transition:background .3s ease;display:flex;justify-content:space-between;align-self:center;align-items:center;text-align:left;text-decoration:none;border:1px solid;box-shadow:none!important;border-color:var(--text-color, black)}.resource-vault-section .resource-blog-card .resource-btn:hover{background:#fff;color:var(--text-color, black)!important}.resource-vault-section .vault-description{text-align:left;max-width:657px;color:#182527;line-height:2.3rem!important;font-size:1.65rem}@media(width<=1200px){.resource-vault-section .vault-heading{font-size:3.5rem}.resource-vault-section .vault-description{margin-top:1.35rem}.resource-vault-section .resource-btn{margin-left:0!important}}.video-row{gap:5.5rem!important;margin-top:3rem!important}@media(width>=991px){section.bg-white.text-center.extra-top-padding{position:relative;overflow:hidden}section.bg-white.text-center.extra-top-padding .banner-header{margin-bottom:4rem!important}}.vault-header{text-align:left}@media(width>=768px)and (width<=1200px){.container{padding:0 6rem!important}}@media(width<=768px){.video-row{gap:3rem!important}}@media(max-width:768px){.resource-vault-section{padding-bottom:6rem!important}.resource-vault-section .container{padding-top:0rem!important;padding-bottom:0rem!important}.vault-header{text-align:center!important}.vault-heading{font-size:3rem!important}}@media(width<=1200px){.container{padding:7rem 3rem 1rem!important}}\n"],
 			dependencies: [
 				{
@@ -525,7 +525,7 @@ i0.ɵɵngDeclareClassMetadata({
 				CdkDragHandle,
 				TranslocoPipe
 			],
-			template: "<pw-resource-header [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-resource-header>\n<pw-integration-top-banner></pw-integration-top-banner>\n<div class=\"bg-white\">\n  <section class=\"guide-section bg-white py-5 section-outer\">\n    <div class=\"container sec-container\">\n      @if (isLoaded && (posts.length + distributerPosts.length) > 0) {\n        <div>\n          <h1 class=\"int-title mb-0\">{{ integrationCountDisplay }}+ integrations <span class=\"int-title__sub\">(&amp; counting)</span></h1>\n          <p class=\"int-text\">Search the current list of {{ companyName }} vendor and distributor integrations below.</p>\n        </div>\n      }\n      @if (isLoaded) {\n        <pw-resource-company-card [header]=\"'integrated vendors'\"\n          (getPosts)=\"getPostTags()\"\n          [integrationCountDisplay]=\"integrationCountDisplay\"\n          [data]=\"posts\"\n          [user]=\"user\"\n        [userLoggedIn]=\"userLoggedIn\"></pw-resource-company-card>\n      }\n      @if (!isLoaded) {\n        <div class=\"w-100 text-center mt-3\"\n          >\n          <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n        </div>\n      }\n      @if (integrationCountDisplay === 0 && isLoaded) {\n        <div>\n          <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n        </div>\n      }\n      @if (isLoaded && (posts.length + distributerPosts.length) > 0) {\n        <div class=\"text-center pt-3 mt-4\">\n          <p class=\"see-span\">Don&rsquo;t see what you&rsquo;re after? <a [href]=\"contactUsUrl\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            class=\"int-span team-span\">Speak with our team to request a connection <i class=\"fa fa-chevron-right team-span__icon\" aria-hidden=\"true\"></i></a>\n        </p>\n      </div>\n    }\n  </div>\n\n</section>\n<section class=\"guide-section bg-white py-5 section-outer\">\n  <div class=\"container\">\n    @if (isLoaded) {\n      <pw-resource-company-card [header]=\"'integrated Distributors'\"\n        [integrationCountDisplay]=\"integrationCountDisplay\"\n        [vendor]=\"true\"\n        (getPosts)=\"getPostTags()\"\n        [data]=\"distributerPosts\"\n        [user]=\"user\"\n      [userLoggedIn]=\"userLoggedIn\"></pw-resource-company-card>\n    }\n    @if (!isLoaded) {\n      <div class=\"w-100 text-center mt-3\"\n        >\n        <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n      </div>\n    }\n    @if (integrationCountDisplay === 0 && isLoaded) {\n      <div>\n        <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n      </div>\n    }\n  </div>\n\n</section>\n@if (integrations) {\n  <section class=\"guide-section bg-white py-5 section-outer\">\n    <div class=\"container\">\n      <div class=\"how-it-works-wrapper\">\n        <div class=\"d-flex\">\n          <h2 class=\"it-works-title mb-0\">{{ integrations?.title || 'How it works' }}</h2>\n          @if (canEditResourcesValue) {\n            <i\n              class=\"fa fa-edit in-page-edit-icon text-black ms-4 mt-3 cursor-pointer\"\n              (click)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n              (keydown.enter)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n              (keydown.space)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n            title=\"Edit Integrations Section\"></i>\n          }\n        </div>\n        <p class=\"pb-20\" [innerHTML]=\"integrations?.description || 'View short example videos to understand how these integrations can work for you:'\"></p>\n        <div class=\"row section-row\"  [ngClass]=\"{ 'justify-content-center': integrations?.items?.length === 1 }\">\n          @if (integrations?.items?.length > 0) {\n            @for (integration of integrations?.items; track integration) {\n              @if (integration?.image_url || integration?.title || integration?.description) {\n                <div\n                  class=\"col-md-6\"\n                  >\n                  @if (integration?.video_url && integration?.video_url.includes('https')) {\n                    <div class=\"d-flex justify-content-center cursor-pointer\">\n                      @if (integration?.video_url) {\n                        <img\n                          [src]=\"integration?.image_url\"\n                          (click)=\"loadMicrosoftVideo(integration?.video_url)\"\n                          (keydown.enter)=\"loadMicrosoftVideo(integration?.video_url)\"\n                          class=\"how-it-works-img\"\n                          alt=\"Integration Video Thumbnail\"\n                          />\n                      }\n                    </div>\n                  } @else {\n                    <div class=\"d-flex justify-content-center\">\n                      <div class=\"w-100\">\n                        <pw-no-data [withImage]=\"true\" [message]=\"'No video found' | transloco\">\n                        </pw-no-data>\n                      </div>\n                    </div>\n                  }\n                </div>\n              }\n            }\n          } @else {\n            <div class=\"w-100 text-center\">\n              <pw-no-data [withImage]=\"true\" [message]=\"'Integration.NoDataMessage' | transloco\"></pw-no-data>\n            </div>\n          }\n        </div>\n      </div>\n    </div>\n  </section>\n}\n@if (showIntegrations()) {\n  <section class=\"guide-section bg-white py-5 section-outer\">\n    <div class=\"container\">\n      <div class=\"row align-items-start\">\n        <div class=\"col-md-6 text-md-start text-center\">\n          <div class=\"d-flex\">\n            <h2 class=\"guide-title mb-3\">{{ guideData?.items?.[0]?.title || 'Featured guide' }}</h2>\n            @if (canEditResourcesValue) {\n              <button type=\"button\"\n                class=\"in-page-edit-icon text-black ms-4 mt-3 cursor-pointer\"\n                (click)=\"openGuidesModal(guidesEditModal)\"\n                title=\"Edit featured guide\"\n                aria-label=\"Edit featured guide\">\n                <i class=\"fa fa-edit\" aria-hidden=\"true\"></i>\n              </button>\n            }\n          </div>\n          <p class=\"guide-subtext\"\n            [innerHTML]=\"guideData?.items?.[0]?.description || (canEditResourcesValue ? 'Add a featured guide via Admin &rarr; Domain config &rarr; Integrations.' : 'A practical walkthrough of how to get the most from your integrations.')\">\n          </p>\n          @if (guideData?.items?.[0]?.guide_url) {\n            <a class=\"vault-btn\"\n              [href]=\"guideData?.items?.[0]?.guide_url\"\n              target=\"_blank\"\n              rel=\"noopener noreferrer\">\n              {{ guideData?.items?.[0]?.button_text || 'View the guide' }} <i class=\"fa fa-chevron-right vault-btn__icon\" aria-hidden=\"true\"></i>\n            </a>\n          }\n        </div>\n        <div class=\"col-md-6 text-center\">\n          @if (guideData?.items?.[0]?.image_url && !guideData?.items?.[0]?.image_url?.includes('default-photo.jpg')) {\n            <img\n              [src]=\"guideData?.items?.[0]?.image_url\"\n              alt=\"\"\n              class=\"guide-img\"\n              loading=\"lazy\" />\n          }\n        </div>\n      </div>\n    </div>\n  </section>\n}\n</div>\n\n@if (resourcePostTag?.tag_category_id) {\n  <pw-resource-note-card [categoryId]=\"resourcePostTag?.tag_category_id\" [tag]=\"resourcePostTag\" [releaseHeader]=\"true\" [resourceTitle]=\"resourcePostTag?.title\" [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-resource-note-card>\n}\n\n<pw-trial-4-contact-us [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-trial-4-contact-us>\n\n\n\n<ng-template #editIntegrationsModal let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Edit Integrations Section</h5>\n    <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n  </div>\n\n  <div class=\"modal-body\">\n    <div class=\"mb-3\">\n      <label class=\"form-label\" for=\"integration-title\">Title</label>\n      <input class=\"form-control\" id=\"integration-title\" [(ngModel)]=\"editingIntegrations.title\"\n          aria-label=\"Integration Title\" />\n    </div>\n\n    <div class=\"mb-3\">\n      <label class=\"form-label\" for=\"integration-description\">Description</label>\n      <textarea class=\"form-control\" id=\"integration-description\" rows=\"3\" [(ngModel)]=\"editingIntegrations.description\"\n          aria-label=\"Integration Description\"></textarea>\n    </div>\n\n    <div cdkDropList (cdkDropListDropped)=\"dropIntegrationItems($event)\">\n      @for (integration of editingIntegrations.items; track integration; let i = $index) {\n        <div class=\"border p-3 mb-3\" cdkDrag>\n          <div class=\"d-flex justify-content-between align-items-center mb-2\">\n            <span class=\"pw-label-style form-label mb-0\" id=\"integration-item-label\">Integration Item</span>\n            <i class=\"fa fa-bars cursor-move in-page-bars-icon\" cdkDragHandle></i>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-title-' + i\">Title</label>\n              <input class=\"form-control\" [id]=\"'integration-item-title-' + i\" [(ngModel)]=\"integration.title\" id=\"input_integration.title_7712\" name=\"input_integration.title_7712\"\n                  aria-label=\"Input Integration.title 7712\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-description-' + i\">Description</label>\n              <input class=\"form-control\" [id]=\"'integration-item-description-' + i\" [(ngModel)]=\"integration.description\" id=\"input_integration.description_9056\" name=\"input_integration.description_9056\"\n                  aria-label=\"Input Integration.description 9056\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-blog-url-' + i\">Blog URL</label>\n              <input class=\"form-control\" [id]=\"'integration-item-blog-url-' + i\" [(ngModel)]=\"integration.blog_url\" id=\"input_integration.blog_url_7856\" name=\"input_integration.blog_url_7856\"\n                  aria-label=\"Input Integration.blog Url 7856\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-image-url-' + i\">Image URL</label>\n              <input class=\"form-control\" [id]=\"'integration-item-image-url-' + i\" [(ngModel)]=\"integration.image_url\" id=\"input_integration.image_url_9056\" name=\"input_integration.image_url_9056\"\n                  aria-label=\"Input Integration.image Url 9056\" />\n            </div>\n            <div class=\"col-md-12 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-video-url-' + i\">Video URL</label>\n              <input class=\"form-control\" [id]=\"'integration-item-video-url-' + i\" [(ngModel)]=\"integration.video_url\" id=\"input_integration.video_url_9056\" name=\"input_integration.video_url_9056\"\n                  aria-label=\"Input Integration.video Url 9056\" />\n            </div>\n          </div>\n          <div class=\"d-flex justify-content-end\">\n            <i class=\"fa fa-trash text-danger cursor-pointer\" (click)=\"removeIntegrationItem(i)\"   (keydown.enter)=\"removeIntegrationItem(i)\"\n            (keydown.space)=\"removeIntegrationItem(i)\"></i>\n          </div>\n        </div>\n      }\n    </div>\n\n    <button class=\"btn btn-outline-primary btn-sm\" (click)=\"addIntegrationItem()\">+ Add Integration</button>\n  </div>\n\n  <div class=\"modal-footer\">\n    <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n    <button class=\"btn btn-primary\" (click)=\"saveIntegrations(modal)\">Save</button>\n  </div>\n</ng-template>\n\n\n\n<ng-template #guidesEditModal let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Edit Guides</h5>\n    <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n  </div>\n\n  <div class=\"modal-body\">\n    <h4 class=\"mb-3\">Guides Section</h4>\n\n    <div cdkDropList (cdkDropListDropped)=\"dropGuides($event)\">\n      @for (guide of editingGuides.items; track guide; let i = $index) {\n        <div class=\"border p-3 mb-3\" cdkDrag>\n          <div class=\"row\">\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-title-' + i\">Title</label>\n              <input class=\"form-control\" [id]=\"'guide-title-' + i\" [(ngModel)]=\"guide.title\" id=\"input_guide.title_7072\" name=\"input_guide.title_7072\"\n                  aria-label=\"Input Guide.title 7072\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-button-text-' + i\">Button Text</label>\n              <input class=\"form-control\" [id]=\"'guide-button-text-' + i\" [(ngModel)]=\"guide.button_text\" id=\"input_guide.button_text_7712\" name=\"input_guide.button_text_7712\"\n                  aria-label=\"Input Guide.button Text 7712\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-image-url-' + i\">Image URL</label>\n              <input class=\"form-control\" [id]=\"'guide-image-url-' + i\" [(ngModel)]=\"guide.image_url\" id=\"input_guide.image_url_7856\" name=\"input_guide.image_url_7856\"\n                  aria-label=\"Input Guide.image Url 7856\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-url-' + i\">Guide URL</label>\n              <input class=\"form-control\" [id]=\"'guide-url-' + i\" [(ngModel)]=\"guide.guide_url\" id=\"input_guide.guide_url_6944\" name=\"input_guide.guide_url_6944\"\n                  aria-label=\"Input Guide.guide Url 6944\" />\n            </div>\n            <div class=\"col-12 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-description-' + i\">Description</label>\n              <textarea class=\"form-control\" [id]=\"'guide-description-' + i\" [name]=\"'guide-description-' + i\" rows=\"3\" [(ngModel)]=\"guide.description\"></textarea>\n            </div>\n            <div class=\"d-flex justify-content-between align-items-center mt-2\">\n              <i class=\"fa fa-trash text-danger cursor-pointer\" (click)=\"removeGuide(i)\" (keydown.enter)=\"removeGuide(i)\" (keydown.space)=\"removeGuide(i)\"></i>\n              <i class=\"fa fa-bars cursor-move\" cdkDragHandle></i>\n            </div>\n          </div>\n        </div>\n      }\n    </div>\n\n    <button class=\"btn btn-primary mt-2\" (click)=\"addGuide()\">+ Add Guide</button>\n  </div>\n\n  <div class=\"modal-footer\">\n    <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n    <button class=\"btn btn-primary\" (click)=\"saveGuides(modal)\">Save</button>\n  </div>\n</ng-template>\n",
+			template: "<pw-resource-header [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-resource-header>\n<main>\n<pw-integration-top-banner></pw-integration-top-banner>\n<div class=\"bg-white\">\n  <section class=\"guide-section bg-white py-5 section-outer\">\n    <div class=\"container sec-container\">\n      @if (isLoaded && (posts.length + distributerPosts.length) > 0) {\n        <div>\n          <h1 class=\"int-title mb-0\">{{ integrationCountDisplay }}+ integrations <span class=\"int-title__sub\">(&amp; counting)</span></h1>\n          <p class=\"int-text\">Search the current list of {{ companyName }} vendor and distributor integrations below.</p>\n        </div>\n      }\n      @if (isLoaded) {\n        <pw-resource-company-card [header]=\"'integrated vendors'\"\n          (getPosts)=\"getPostTags()\"\n          [integrationCountDisplay]=\"integrationCountDisplay\"\n          [data]=\"posts\"\n          [user]=\"user\"\n        [userLoggedIn]=\"userLoggedIn\"></pw-resource-company-card>\n      }\n      @if (!isLoaded) {\n        <div class=\"w-100 text-center mt-3\"\n          >\n          <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n        </div>\n      }\n      @if (integrationCountDisplay === 0 && isLoaded) {\n        <div>\n          <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n        </div>\n      }\n      @if (isLoaded && (posts.length + distributerPosts.length) > 0) {\n        <div class=\"text-center pt-3 mt-4\">\n          <p class=\"see-span\">Don&rsquo;t see what you&rsquo;re after? <a [href]=\"contactUsUrl\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            class=\"int-span team-span\">Speak with our team to request a connection <i class=\"fa fa-chevron-right team-span__icon\" aria-hidden=\"true\"></i></a>\n        </p>\n      </div>\n    }\n  </div>\n\n</section>\n<section class=\"guide-section bg-white py-5 section-outer\">\n  <div class=\"container\">\n    @if (isLoaded) {\n      <pw-resource-company-card [header]=\"'integrated Distributors'\"\n        [integrationCountDisplay]=\"integrationCountDisplay\"\n        [vendor]=\"true\"\n        (getPosts)=\"getPostTags()\"\n        [data]=\"distributerPosts\"\n        [user]=\"user\"\n      [userLoggedIn]=\"userLoggedIn\"></pw-resource-company-card>\n    }\n    @if (!isLoaded) {\n      <div class=\"w-100 text-center mt-3\"\n        >\n        <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n      </div>\n    }\n    @if (integrationCountDisplay === 0 && isLoaded) {\n      <div>\n        <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n      </div>\n    }\n  </div>\n\n</section>\n@if (integrations) {\n  <section class=\"guide-section bg-white py-5 section-outer\">\n    <div class=\"container\">\n      <div class=\"how-it-works-wrapper\">\n        <div class=\"d-flex\">\n          <h2 class=\"it-works-title mb-0\">{{ integrations?.title || 'How it works' }}</h2>\n          @if (canEditResourcesValue) {\n            <i\n              class=\"fa fa-edit in-page-edit-icon text-black ms-4 mt-3 cursor-pointer\"\n              (click)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n              (keydown.enter)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n              (keydown.space)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n            title=\"Edit Integrations Section\"></i>\n          }\n        </div>\n        <p class=\"pb-20\" [innerHTML]=\"integrations?.description || 'View short example videos to understand how these integrations can work for you:'\"></p>\n        <div class=\"row section-row\"  [ngClass]=\"{ 'justify-content-center': integrations?.items?.length === 1 }\">\n          @if (integrations?.items?.length > 0) {\n            @for (integration of integrations?.items; track integration) {\n              @if (integration?.image_url || integration?.title || integration?.description) {\n                <div\n                  class=\"col-md-6\"\n                  >\n                  @if (integration?.video_url && integration?.video_url.includes('https')) {\n                    <div class=\"d-flex justify-content-center cursor-pointer\">\n                      @if (integration?.video_url) {\n                        <img\n                          [src]=\"integration?.image_url\"\n                          (click)=\"loadMicrosoftVideo(integration?.video_url)\"\n                          (keydown.enter)=\"loadMicrosoftVideo(integration?.video_url)\"\n                          class=\"how-it-works-img\"\n                          alt=\"Integration Video Thumbnail\"\n                          />\n                      }\n                    </div>\n                  } @else {\n                    <div class=\"d-flex justify-content-center\">\n                      <div class=\"w-100\">\n                        <pw-no-data [withImage]=\"true\" [message]=\"'No video found' | transloco\">\n                        </pw-no-data>\n                      </div>\n                    </div>\n                  }\n                </div>\n              }\n            }\n          } @else {\n            <div class=\"w-100 text-center\">\n              <pw-no-data [withImage]=\"true\" [message]=\"'Integration.NoDataMessage' | transloco\"></pw-no-data>\n            </div>\n          }\n        </div>\n      </div>\n    </div>\n  </section>\n}\n@if (showIntegrations()) {\n  <section class=\"guide-section bg-white py-5 section-outer\">\n    <div class=\"container\">\n      <div class=\"row align-items-start\">\n        <div class=\"col-md-6 text-md-start text-center\">\n          <div class=\"d-flex\">\n            <h2 class=\"guide-title mb-3\">{{ guideData?.items?.[0]?.title || 'Featured guide' }}</h2>\n            @if (canEditResourcesValue) {\n              <button type=\"button\"\n                class=\"in-page-edit-icon text-black ms-4 mt-3 cursor-pointer\"\n                (click)=\"openGuidesModal(guidesEditModal)\"\n                title=\"Edit featured guide\"\n                aria-label=\"Edit featured guide\">\n                <i class=\"fa fa-edit\" aria-hidden=\"true\"></i>\n              </button>\n            }\n          </div>\n          <p class=\"guide-subtext\"\n            [innerHTML]=\"guideData?.items?.[0]?.description || (canEditResourcesValue ? 'Add a featured guide via Admin &rarr; Domain config &rarr; Integrations.' : 'A practical walkthrough of how to get the most from your integrations.')\">\n          </p>\n          @if (guideData?.items?.[0]?.guide_url) {\n            <a class=\"vault-btn\"\n              [href]=\"guideData?.items?.[0]?.guide_url\"\n              target=\"_blank\"\n              rel=\"noopener noreferrer\">\n              {{ guideData?.items?.[0]?.button_text || 'View the guide' }} <i class=\"fa fa-chevron-right vault-btn__icon\" aria-hidden=\"true\"></i>\n            </a>\n          }\n        </div>\n        <div class=\"col-md-6 text-center\">\n          @if (guideData?.items?.[0]?.image_url && !guideData?.items?.[0]?.image_url?.includes('default-photo.jpg')) {\n            <img\n              [src]=\"guideData?.items?.[0]?.image_url\"\n              alt=\"\"\n              class=\"guide-img\"\n              loading=\"lazy\" />\n          }\n        </div>\n      </div>\n    </div>\n  </section>\n}\n</div>\n\n@if (resourcePostTag?.tag_category_id) {\n  <pw-resource-note-card [categoryId]=\"resourcePostTag?.tag_category_id\" [tag]=\"resourcePostTag\" [releaseHeader]=\"true\" [resourceTitle]=\"resourcePostTag?.title\" [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-resource-note-card>\n}\n\n</main>\n<pw-trial-4-contact-us [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-trial-4-contact-us>\n\n\n\n<ng-template #editIntegrationsModal let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Edit Integrations Section</h5>\n    <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n  </div>\n\n  <div class=\"modal-body\">\n    <div class=\"mb-3\">\n      <label class=\"form-label\" for=\"integration-title\">Title</label>\n      <input class=\"form-control\" id=\"integration-title\" [(ngModel)]=\"editingIntegrations.title\"\n          aria-label=\"Integration Title\" />\n    </div>\n\n    <div class=\"mb-3\">\n      <label class=\"form-label\" for=\"integration-description\">Description</label>\n      <textarea class=\"form-control\" id=\"integration-description\" rows=\"3\" [(ngModel)]=\"editingIntegrations.description\"\n          aria-label=\"Integration Description\"></textarea>\n    </div>\n\n    <div cdkDropList (cdkDropListDropped)=\"dropIntegrationItems($event)\">\n      @for (integration of editingIntegrations.items; track integration; let i = $index) {\n        <div class=\"border p-3 mb-3\" cdkDrag>\n          <div class=\"d-flex justify-content-between align-items-center mb-2\">\n            <span class=\"pw-label-style form-label mb-0\" id=\"integration-item-label\">Integration Item</span>\n            <i class=\"fa fa-bars cursor-move in-page-bars-icon\" cdkDragHandle></i>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-title-' + i\">Title</label>\n              <input class=\"form-control\" [id]=\"'integration-item-title-' + i\" [(ngModel)]=\"integration.title\" id=\"input_integration.title_7712\" name=\"input_integration.title_7712\"\n                  aria-label=\"Input Integration.title 7712\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-description-' + i\">Description</label>\n              <input class=\"form-control\" [id]=\"'integration-item-description-' + i\" [(ngModel)]=\"integration.description\" id=\"input_integration.description_9056\" name=\"input_integration.description_9056\"\n                  aria-label=\"Input Integration.description 9056\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-blog-url-' + i\">Blog URL</label>\n              <input class=\"form-control\" [id]=\"'integration-item-blog-url-' + i\" [(ngModel)]=\"integration.blog_url\" id=\"input_integration.blog_url_7856\" name=\"input_integration.blog_url_7856\"\n                  aria-label=\"Input Integration.blog Url 7856\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-image-url-' + i\">Image URL</label>\n              <input class=\"form-control\" [id]=\"'integration-item-image-url-' + i\" [(ngModel)]=\"integration.image_url\" id=\"input_integration.image_url_9056\" name=\"input_integration.image_url_9056\"\n                  aria-label=\"Input Integration.image Url 9056\" />\n            </div>\n            <div class=\"col-md-12 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-video-url-' + i\">Video URL</label>\n              <input class=\"form-control\" [id]=\"'integration-item-video-url-' + i\" [(ngModel)]=\"integration.video_url\" id=\"input_integration.video_url_9056\" name=\"input_integration.video_url_9056\"\n                  aria-label=\"Input Integration.video Url 9056\" />\n            </div>\n          </div>\n          <div class=\"d-flex justify-content-end\">\n            <i class=\"fa fa-trash text-danger cursor-pointer\" (click)=\"removeIntegrationItem(i)\"   (keydown.enter)=\"removeIntegrationItem(i)\"\n            (keydown.space)=\"removeIntegrationItem(i)\"></i>\n          </div>\n        </div>\n      }\n    </div>\n\n    <button class=\"btn btn-outline-primary btn-sm\" (click)=\"addIntegrationItem()\">+ Add Integration</button>\n  </div>\n\n  <div class=\"modal-footer\">\n    <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n    <button class=\"btn btn-primary\" (click)=\"saveIntegrations(modal)\">Save</button>\n  </div>\n</ng-template>\n\n\n\n<ng-template #guidesEditModal let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Edit Guides</h5>\n    <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n  </div>\n\n  <div class=\"modal-body\">\n    <h4 class=\"mb-3\">Guides Section</h4>\n\n    <div cdkDropList (cdkDropListDropped)=\"dropGuides($event)\">\n      @for (guide of editingGuides.items; track guide; let i = $index) {\n        <div class=\"border p-3 mb-3\" cdkDrag>\n          <div class=\"row\">\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-title-' + i\">Title</label>\n              <input class=\"form-control\" [id]=\"'guide-title-' + i\" [(ngModel)]=\"guide.title\" id=\"input_guide.title_7072\" name=\"input_guide.title_7072\"\n                  aria-label=\"Input Guide.title 7072\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-button-text-' + i\">Button Text</label>\n              <input class=\"form-control\" [id]=\"'guide-button-text-' + i\" [(ngModel)]=\"guide.button_text\" id=\"input_guide.button_text_7712\" name=\"input_guide.button_text_7712\"\n                  aria-label=\"Input Guide.button Text 7712\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-image-url-' + i\">Image URL</label>\n              <input class=\"form-control\" [id]=\"'guide-image-url-' + i\" [(ngModel)]=\"guide.image_url\" id=\"input_guide.image_url_7856\" name=\"input_guide.image_url_7856\"\n                  aria-label=\"Input Guide.image Url 7856\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-url-' + i\">Guide URL</label>\n              <input class=\"form-control\" [id]=\"'guide-url-' + i\" [(ngModel)]=\"guide.guide_url\" id=\"input_guide.guide_url_6944\" name=\"input_guide.guide_url_6944\"\n                  aria-label=\"Input Guide.guide Url 6944\" />\n            </div>\n            <div class=\"col-12 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-description-' + i\">Description</label>\n              <textarea class=\"form-control\" [id]=\"'guide-description-' + i\" [name]=\"'guide-description-' + i\" rows=\"3\" [(ngModel)]=\"guide.description\"></textarea>\n            </div>\n            <div class=\"d-flex justify-content-between align-items-center mt-2\">\n              <i class=\"fa fa-trash text-danger cursor-pointer\" (click)=\"removeGuide(i)\" (keydown.enter)=\"removeGuide(i)\" (keydown.space)=\"removeGuide(i)\"></i>\n              <i class=\"fa fa-bars cursor-move\" cdkDragHandle></i>\n            </div>\n          </div>\n        </div>\n      }\n    </div>\n\n    <button class=\"btn btn-primary mt-2\" (click)=\"addGuide()\">+ Add Guide</button>\n  </div>\n\n  <div class=\"modal-footer\">\n    <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n    <button class=\"btn btn-primary\" (click)=\"saveGuides(modal)\">Save</button>\n  </div>\n</ng-template>\n",
 			styles: [".int-span{font-size:3rem;color:var(--first, #1968e1)}.team-span{font-size:2rem;color:var(--first, #1968e1);font-weight:400;text-decoration:none;border-radius:4px;transition:color .15s ease,text-decoration-color .15s ease}.team-span:hover{color:var(--first, #1968e1);text-decoration:underline;text-underline-offset:4px}.team-span:focus-visible{outline:2px solid var(--first, #1968e1);outline-offset:3px}.team-span__icon{font-size:1.4rem;margin-left:.4rem;vertical-align:.05em}.see-span{font-size:2rem;font-weight:300;color:#182527}::ng-deep .edit-card .in-page-edit-icon{margin-left:1rem!important;margin-top:.5rem!important}::ng-deep .modal-content{margin-top:5rem!important}.how-it-works-wrapper .it-works-title{font-size:3rem;margin-bottom:2rem;color:var(--text-color, black);font-weight:300!important;padding-bottom:12px!important;line-height:1.15}.how-it-works-wrapper .how-it-works-img{width:85%!important;margin:0 auto!important;border-radius:8px;transition:transform .2s ease,box-shadow .2s ease}.how-it-works-wrapper .how-it-works-img:hover{transform:translateY(-2px);box-shadow:0 12px 28px -16px #00000059}.how-it-works-wrapper p{padding-top:1rem;font-size:1.8rem;color:#182527;font-weight:300;line-height:1.45;margin-bottom:3rem}.guide-wrapper{padding:55px 47px 220px}.guide-wrapper .horizontal{position:absolute;left:0;bottom:24%;width:100%}.guide-wrapper .pb-20{padding-bottom:20px}.guide-wrapper .flex{display:flex}.guide-wrapper .guide-title{font: 500 28px Montserrat-Regular,sans-serif}.guide-wrapper p{font: 400 17px Montserrat-Regular,sans-serif;color:#182527}.guide-section{box-shadow:0 4px 32px -14px #40576d4d!important;position:relative}.guide-section .integration-fadeout{position:absolute;bottom:0;left:0;width:100%;height:80px;background:linear-gradient(to bottom,#fff0,#f8f9fa);pointer-events:none}@media(width>=768px){.guide-section .container-section{padding:20px 190px 20px 120px!important}}@media(width<=768px){.guide-section .container-section{padding:3rem!important}.guide-section .guide-img{max-width:236px!important}.guide-section .guide-title{font-size:2.6rem!important}.guide-section .vault-btn{width:90%!important;margin-bottom:3rem!important}.guide-section .guide-subtext{padding:2rem;line-height:1.7rem!important}}.guide-section .guide-title{font-size:3rem;font-weight:300;line-height:1.15}.guide-section .guide-subtext{font-size:1.6rem;line-height:2.4rem;color:var(--text-color, black);font-weight:300;margin-bottom:2rem}.guide-section .guide-note{font-size:1.6rem;color:#182527;font-weight:300}.guide-section .vault-btn{display:inline-flex;align-items:center;gap:.6rem;background:var(--text-color, black);color:#fff;padding:1rem 2rem;border-radius:40px;font-weight:500;text-decoration:none;margin-top:1rem!important;font-size:1.4rem;border:1px solid;box-shadow:none!important;border-color:var(--text-color, currentcolor);transition:background .15s ease,color .15s ease,transform .15s ease}.guide-section .vault-btn:hover{background:#fff;color:var(--text-color, black)!important;transform:translateY(-1px)}.guide-section .vault-btn:focus-visible{outline:2px solid var(--text-color, black);outline-offset:3px}.guide-section .vault-btn__icon{font-size:1.1rem}.guide-section .guide-img{max-width:536px;max-height:536px!important;height:auto;border-radius:12px}.int-title{color:var(--text-color, black);font-size:4rem!important;font-weight:400;line-height:1.1}.int-title__sub{font-size:.55em;font-weight:300;opacity:.7;margin-left:.4rem;vertical-align:.3em}.int-text{font-size:1.4rem;font-weight:400;color:#182527;line-height:1.6;margin-top:.6rem}@media(width<=768px){.int-title{font-size:3rem!important}.int-span,.team-span,.see-span{font-size:1.6rem}}@media(width>=991px){.section-outer{padding-top:4.5rem!important}}\n", ".bold{font-weight:700}.resource-heading{margin-bottom:2rem}.resource-note{margin-top:1rem;font-size:.85rem;color:#555}.resource-divider{border:0;height:40px;width:100%;background:linear-gradient(to bottom,#0000,#00000026);margin:0}.press-release-icon{height:auto!important;margin:0 11px 1.9rem;display:block;align-self:center;width:auto!important;aspect-ratio:0!important;object-fit:cover;margin-top:auto;margin-right:0!important}.resource-vault-section{padding:60px 0;background:#fff;padding-bottom:9rem!important;padding-top:7rem!important;box-shadow:0 4px 32px -14px #40576d4d!important}.resource-vault-section .vault-heading{font-size:3rem;font-weight:300}.resource-vault-section .explore-link{color:#000;font-weight:400;text-decoration:none;font-size:1.5rem}.resource-vault-section .resource-blog-card{display:flex;flex-direction:column;justify-content:space-between;background-color:#fff;border-radius:30px;box-shadow:0 20px 40px #00000014;padding:25px;text-align:center;width:338px;height:auto!important}.resource-vault-section .resource-blog-card h5{font-size:1.5rem;font-weight:400;margin-bottom:.5rem;color:var(--text-color, black)}.resource-vault-section .resource-blog-card p{font-size:1.5rem;color:var(--text-color, black);line-height:2rem}.resource-vault-section .resource-blog-card img{width:100%;border-radius:10px;aspect-ratio:1/1;object-fit:cover;margin-top:auto;margin-right:0!important;max-width:250px!important;align-self:center!important}.resource-vault-section .resource-blog-card iframe{height:210px;border-radius:10px;object-fit:cover;margin-right:0!important;max-width:280px!important}.resource-vault-section .resource-blog-card .resource-btn{background-color:var(--text-color, black);color:#fff;margin-top:auto;padding:10px 24px;border-radius:24px;font-size:1.5rem;font-weight:500;width:100%;max-width:240px;cursor:pointer;transition:background .3s ease;display:flex;justify-content:space-between;align-self:center;align-items:center;text-align:left;text-decoration:none;border:1px solid;box-shadow:none!important;border-color:var(--text-color, black)}.resource-vault-section .resource-blog-card .resource-btn:hover{background:#fff;color:var(--text-color, black)!important}.resource-vault-section .vault-description{text-align:left;max-width:657px;color:#182527;line-height:2.3rem!important;font-size:1.65rem}@media(width<=1200px){.resource-vault-section .vault-heading{font-size:3.5rem}.resource-vault-section .vault-description{margin-top:1.35rem}.resource-vault-section .resource-btn{margin-left:0!important}}.video-row{gap:5.5rem!important;margin-top:3rem!important}@media(width>=991px){section.bg-white.text-center.extra-top-padding{position:relative;overflow:hidden}section.bg-white.text-center.extra-top-padding .banner-header{margin-bottom:4rem!important}}.vault-header{text-align:left}@media(width>=768px)and (width<=1200px){.container{padding:0 6rem!important}}@media(width<=768px){.video-row{gap:3rem!important}}@media(max-width:768px){.resource-vault-section{padding-bottom:6rem!important}.resource-vault-section .container{padding-top:0rem!important;padding-bottom:0rem!important}.vault-header{text-align:center!important}.vault-heading{font-size:3rem!important}}@media(width<=1200px){.container{padding:7rem 3rem 1rem!important}}\n"]
 		}]
 	}],
@@ -600,4 +600,4 @@ i0.ɵɵngDeclareClassMetadata({
 });
 export { ResourceIntegrationsModule };
 
-//# sourceMappingURL=posiwise-resource-module-resource-integrations.module-BXyPZf3W.mjs.map
+//# sourceMappingURL=posiwise-resource-module-resource-integrations.module-G4XvMMYf.mjs.map

package/fesm2022/posiwise-resource-module-resource-integrations.module-G4XvMMYf.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"posiwise-resource-module-resource-integrations.module-G4XvMMYf.mjs","names":["i1"],"sources":["../../../../libs/resource-module/src/lib/public/components/resource-integration/integration-top-banner/integration-top-banner.component.ts","../../../../libs/resource-module/src/lib/public/components/resource-integration/integration-top-banner/integration-top-banner.component.html","../../../../libs/resource-module/src/lib/public/components/resource-integration/resource-integration.component.ts","../../../../libs/resource-module/src/lib/public/components/resource-integration/resource-integration.component.html","../../../../libs/resource-module/src/lib/public/modules/integrations/resource-integrations.module.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component } from '@angular/core';\n\nimport { LazyImgDirective } from '@posiwise/directives';\n\nimport { BaseTopBannerComponent } from '../../base/base-top-banner.component';\nimport { ResourceTopBannerEditComponent } from '../../resource-top-banner-edit/resource-top-banner-edit.component';\n\n@Component({\n    selector: 'pw-integration-top-banner',\n    templateUrl: './integration-top-banner.component.html',\n    styleUrls: [\n        '../../resource-case-studies/resource-case-studies.component.scss',\n        '../../resources/resources-shared.component.scss',\n        '../../resource-post/related-resources/related-resources.component.scss'\n    ],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    imports: [ResourceTopBannerEditComponent, LazyImgDirective]\n})\nexport class IntegrationTopBannerComponent extends BaseTopBannerComponent {\n    contactUsUrl = this.appConfig?.pages_config?.contact_us?.url;\n\n    protected getSearchTerm(): string {\n        return 'Integrations';\n    }\n}\n","<section class=\"bg-white pricing-section\">\n  <div class=\"resource-banner\">\n    @if (isLoaded) {\n      <div class=\"container d-flex flex-column flex-lg-row align-items-center justify-content-between\">\n        <div class=\"text-content\">\n          <div class=\"resource-heading\">\n            <h1 class=\"resource-header-text mb-4\">\n              <span class=\"d-inline-flex align-items-center gap-2 flex-wrap\">\n                <span [innerHTML]=\"blogPostTag?.title || 'Integrated vendors'\"></span>\n                @if (canEditResourcesValue) {\n                  <pw-resource-top-banner-edit\n                    [blogPostTag]=\"blogPostTag\"\n                    [user]=\"user\"\n                    [userLoggedIn]=\"userLoggedIn\"\n                    (getUpdatedTag)=\"getTags()\"\n                  ></pw-resource-top-banner-edit>\n                }\n              </span>\n              <span class=\"blue-text\"></span>\n            </h1>\n          </div>\n        </div>\n        <div class=\"text-extension mt-4\">\n          <div class=\"cta-buttons d-flex flex-column justify-between h-100\">\n            <div class=\"flex-grow-1\">\n              @if (blogPostTag?.description && blogPostTag.description !== 'null' ) {\n                <p class=\"intro\" [innerHTML]=\"blogPostTag.description\"></p>\n              } @else {\n                <p class=\"intro\">\n                  Browse below the vendor integrations<br />\n                  we support.\n                </p>\n              }\n            </div>\n            <div class=\"d-flex gap-3 flex-wrap mt-3\">\n              <a [href]=\"contactUsUrl\" target=\"_blank\" rel=\"noopener noreferrer\"\n              class=\"cta-btn filled\">Talk to us <i class=\"fa fa-chevron-right cta-btn__icon\" aria-hidden=\"true\"></i></a>\n            </div>\n          </div>\n        </div>\n        <div class=\"image-content ms-lg-5 mt-5 mt-lg-0\">\n          <div class=\"resource-math-img\"></div>\n          <img class=\"resource-laptop-img dyn-img\"\n            [src]=\"(blogPostTag?.image?.url && !(blogPostTag?.image?.url.includes('no_image_uploaded_squared'))) ? blogPostTag?.image?.url : '/assets/img/resource/men.webp'\"\n            alt=\"Integrated vendors banner\"\n            width=\"600\"\n            height=\"450\"\n            loading=\"eager\"\n            fetchpriority=\"high\" />\n        </div>\n      </div>\n    }\n  </div>\n</section>\n","import {\n    CdkDrag,\n    CdkDragDrop,\n    CdkDragHandle,\n    CdkDropList,\n    moveItemInArray\n} from '@angular/cdk/drag-drop';\nimport { DOCUMENT, NgClass } from '@angular/common';\nimport {\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    inject,\n    OnInit,\n    TemplateRef,\n    ViewChild\n} from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';\n\nimport { AdminService } from '@posiwise/admin-module-utils';\nimport { AppBaseComponent } from '@posiwise/app-base-component';\nimport { AuthService, TagService } from '@posiwise/common-services';\nimport { CompanyData, Resource, User } from '@posiwise/common-utilities';\nimport { LazyImgDirective } from '@posiwise/directives';\nimport { HelperService } from '@posiwise/helper-service';\nimport { Trial4ContactUsComponent } from '@posiwise/resource-contact-us';\nimport { NoDataComponent } from '@posiwise/shared-components';\nimport { CustomUploaderComponent, ResourceHeaderComponent } from '@posiwise/utils';\n\nimport { Bind } from 'primeng/bind';\nimport { ProgressSpinner } from 'primeng/progressspinner';\nimport { forkJoin } from 'rxjs';\n\nimport { TranslocoPipe } from '@jsverse/transloco';\nimport { NgbModal } from '@ng-bootstrap/ng-bootstrap';\n\nimport { ResourceService } from '../../../resource.service';\nimport { ResourceNoteCardComponent } from '../reslease-note-card/release-note-card.component';\nimport { ResourceCompanyCardComponent } from '../resource-company-card/resource-company-card.component';\n\nimport { IntegrationTopBannerComponent } from './integration-top-banner/integration-top-banner.component';\n\n@Component({\n    selector: 'pw-resource-integration',\n    templateUrl: './resource-integration.component.html',\n    styleUrls: [\n        './resource-integration.component.scss',\n        '../resources/resources-shared.component.scss'\n    ],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    imports: [\n        ResourceHeaderComponent,\n        IntegrationTopBannerComponent,\n        ResourceCompanyCardComponent,\n        Bind,\n        ProgressSpinner,\n        NoDataComponent,\n        NgClass,\n        LazyImgDirective,\n        ResourceNoteCardComponent,\n        Trial4ContactUsComponent,\n        FormsModule,\n        CdkDropList,\n        CdkDrag,\n        CdkDragHandle,\n        TranslocoPipe\n    ]\n})\nexport class ResourceIntegrationComponent extends AppBaseComponent implements OnInit {\n    private readonly sanitizer = inject(DomSanitizer);\n    private readonly resourceService = inject(ResourceService);\n    private readonly modalService = inject(NgbModal);\n    private readonly tagService = inject(TagService);\n    private readonly authService = inject(AuthService);\n    private readonly adminService = inject(AdminService);\n    private readonly cdr = inject(ChangeDetectorRef);\n\n    private readonly doc = inject(DOCUMENT);\n\n    @ViewChild('editIntegrationsModal') editIntegrationsModal: TemplateRef<CustomUploaderComponent>;\n    editingIntegrations;\n    distributorsData = CompanyData?.distributorsData;\n    vendorsData = CompanyData?.vendorsData;\n\n    textColor = this.appConfig?.color_codes?.text;\n\n    subscriptionId: number;\n    masterSubscriptionId = this.appConfig.master_subscription.subscription_id;\n    posts: Resource[] = [];\n    distributerPosts = [];\n    userLoggedIn: boolean;\n    blogPostTag;\n    isLoaded = false;\n    resourcePostTag;\n    blogPostVendorTag;\n    isMasterSubscription;\n\n    integrations = this.appConfig?.pages_config?.integrations;\n\n    releaseNotesLink = '/resources/product-release-notes';\n    q1NotesLink = '/resources/product-release-q1-2025';\n    q3NotesLink = '/resources/product-release-q3-2024';\n    q4NotesLink = '/resources/product-release-q4-2024';\n    companyName;\n\n    videoWebinarLoaded = false;\n    videoDemoLoaded = false;\n    youtubeVideoId = 'R7Vk219zbhA';\n    videoTitle = 'CloudOlive Overview';\n    sanitizedMicrosoftVideoUrl: SafeResourceUrl;\n    sanitizedKesyaVideoUrl: SafeResourceUrl;\n    integrationCountDisplay: number;\n    contactUsUrl = this.appConfig?.pages_config?.contact_us?.url;\n    tagCategory;\n    totalPosts: number;\n\n    guideData = this.appConfig?.pages_config?.guides;\n    editingGuides = { items: [] };\n    user: User;\n\n    canEditResourcesValue = false;\n    domainId = this.appConfig.domain_id;\n\n    ngOnInit() {\n        this.companyName = this.appConfig.company.name;\n\n        this.doc.documentElement.style.setProperty('--text-color', this.textColor);\n        this.getUserSubscriptionId().subscribe(response => {\n            this.subscriptionId = response;\n            this.cdr.markForCheck();\n        });\n        this.authService.getToken$().subscribe(res => {\n            this.userLoggedIn = !!res;\n            if (this.userLoggedIn) {\n                this.localStorage.getItem$('product').subscribe(res => {\n                    const data = res ? JSON.parse(res) : null;\n                    this.subscriptionId = data?.subscriptionId;\n                    this.cdr.markForCheck();\n                });\n                this.userService.getUserInfo().subscribe(data => {\n                    this.user = data;\n\n                    this.getTags();\n                    this.updateCanEditResourcesValue();\n                    this.cdr.markForCheck();\n                });\n            } else {\n                this.getTags();\n            }\n            this.cdr.markForCheck();\n        });\n    }\n\n    private getTags() {\n        this.isLoaded = false;\n        this.tagService\n            .getAllTagCategories({ search: 'Integrations' }, this.getEffectiveSubscriptionId())\n            .subscribe(response => {\n                this.tagCategory = response?.tag_categories?.[0];\n                this.getPostTags();\n                this.cdr.markForCheck();\n            });\n    }\n\n    openEditIntegrationsModal(modalRef) {\n        this.editingIntegrations = structuredClone(this.integrations);\n        this.modalService.open(modalRef, {\n            size: 'lg',\n            centered: true,\n            windowClass: 'modal-holder'\n        });\n    }\n\n    showIntegrations(): boolean {\n        if (this.userLoggedIn) {\n            return true;\n        }\n\n        if (Array.isArray(this.guideData?.items) && this.guideData.items.length) {\n            const item = this.guideData.items[0];\n            return (\n                !!item?.title ||\n                !!item?.description ||\n                !!item?.guide_url ||\n                (!!item?.image_url && !item.image_url.includes('default-image.png'))\n            );\n        }\n\n        return false;\n    }\n\n    private getPostTags() {\n        this.tagService\n            .getTagsByType('post_categories', {}, this.getEffectiveSubscriptionId())\n            .subscribe(response => {\n                this.resourcePostTag = response.tags.find(\n                    tag => tag.name === 'Product Release Notes'\n                );\n                this.blogPostTag = response.tags.find(\n                    tag =>\n                        tag.name === 'Integrated Distributors' &&\n                        tag.tag_category_id === this.tagCategory?.id\n                );\n                this.blogPostVendorTag = response.tags.find(\n                    tag =>\n                        tag.name === 'Integrated Vendors' &&\n                        tag.tag_category_id === this.tagCategory?.id\n                );\n\n                // use forkJoin to fetch both sets of posts in parallel\n                forkJoin({\n                    vendorResponse: this.resourceService.getPublicPosts(\n                        this.getEffectiveSubscriptionId(),\n                        1,\n                        100,\n                        '',\n                        '',\n                        this.blogPostVendorTag?.id\n                    ),\n                    distributorResponse: this.resourceService.getPublicPosts(\n                        this.getEffectiveSubscriptionId(),\n                        1,\n                        100,\n                        '',\n                        '',\n                        this.blogPostTag?.id\n                    )\n                }).subscribe(({ vendorResponse, distributorResponse }) => {\n                    const sortedVendors = vendorResponse.posts.sort(\n                        (a, b) =>\n                            new Date(b.published_at).getTime() - new Date(a.published_at).getTime()\n                    );\n                    const sortedDistributors = distributorResponse.posts.sort(\n                        (a, b) =>\n                            new Date(b.published_at).getTime() - new Date(a.published_at).getTime()\n                    );\n\n                    // Show only integrations that have an image; count still includes all\n                    this.posts = sortedVendors.filter(post => this.hasDisplayableImage(post));\n                    this.distributerPosts = sortedDistributors.filter(post =>\n                        this.hasDisplayableImage(post)\n                    );\n\n                    const vendorCount = vendorResponse?.object_count ?? 0;\n                    const distributorCount = distributorResponse?.object_count ?? 0;\n                    const total = vendorCount + distributorCount;\n\n                    this.integrationCountDisplay = total === 0 ? 0 : Math.ceil(total / 10) * 10;\n                    this.isLoaded = true;\n                    this.cdr.markForCheck();\n                });\n                this.cdr.markForCheck();\n            });\n    }\n\n    loadMicrosoftVideo(videoUrl) {\n        window.open(videoUrl, '_blank', 'noopener,noreferrer');\n    }\n\n    loadKeseyaVideo(): void {\n        const baseUrl = `https://www.youtube.com/embed/${this.youtubeVideoId}?autoplay=1`;\n        // baseUrl is a trusted internal source (e.g. YouTube embed URL)\n        this.sanitizedKesyaVideoUrl = this.sanitizer.bypassSecurityTrustResourceUrl(baseUrl); // NOSONAR\n        this.videoWebinarLoaded = true;\n    }\n\n    addIntegrationItem() {\n        this.editingIntegrations.items.push({\n            title: '',\n            description: '',\n            blog_url: '',\n            image_url: '',\n            video_url: ''\n        });\n    }\n\n    removeIntegrationItem(index: number) {\n        this.editingIntegrations.items.splice(index, 1);\n    }\n\n    dropIntegrationItems(event) {\n        moveItemInArray(this.editingIntegrations.items, event.previousIndex, event.currentIndex);\n    }\n\n    saveIntegrations(modalRef) {\n        const updatedIntegrations = {\n            ...this.editingIntegrations\n        };\n\n        this.adminService\n            .updateDomainConfig(this.domainId, {\n                integrations: updatedIntegrations,\n                subscription_id: this.getEffectiveSubscriptionId()\n            })\n            .subscribe(() => {\n                this.integrations = updatedIntegrations;\n                this.toast.success('Integrations updated');\n                modalRef.close();\n                this.cdr.markForCheck();\n            });\n    }\n\n    saveGuides(modalRef) {\n        const updatedGuides = {\n            ...this.editingGuides\n        };\n\n        this.adminService\n            .updateDomainConfig(this.domainId, {\n                guides: updatedGuides,\n                subscription_id: this.getEffectiveSubscriptionId()\n            })\n            .subscribe(() => {\n                this.guideData = updatedGuides;\n                this.toast.success('Guides updated');\n                modalRef.close();\n                this.cdr.markForCheck();\n            });\n    }\n\n    openGuidesModal(template) {\n        this.editingGuides = structuredClone(this.guideData ?? { items: [] });\n        this.modalService.open(template, { size: 'xl' });\n    }\n\n    addGuide() {\n        this.editingGuides.items.push({\n            title: '',\n            button_text: '',\n            image_url: '',\n            guide_url: '',\n            description: ''\n        });\n    }\n\n    removeGuide(index: number) {\n        this.editingGuides.items.splice(index, 1);\n    }\n\n    dropGuides(event: CdkDragDrop<string[]>) {\n        moveItemInArray(this.editingGuides.items, event.previousIndex, event.currentIndex);\n    }\n\n    private hasDisplayableImage(post: {\n        companyImg?: string;\n        rectangular_picture?: { url?: string };\n    }): boolean {\n        if (post?.companyImg) {\n            return true;\n        }\n        const url = post?.rectangular_picture?.url;\n        return !!url && !url.includes('default-photo');\n    }\n\n    /** Helper method to get effective subscription ID */\n    private getEffectiveSubscriptionId(): number {\n        return HelperService.getEffectiveSubscriptionId(\n            this.user,\n            this.subscriptionId,\n            this.masterSubscriptionId\n        );\n    }\n\n    private updateCanEditResourcesValue(): void {\n        if (this.userLoggedIn && this.user) {\n            this.canEditResourcesValue = HelperService.canEditResources(\n                this.user,\n                this.userLoggedIn,\n                this.permissionService\n            );\n        } else {\n            this.canEditResourcesValue = false;\n        }\n    }\n\n    canEditResources(): boolean {\n        return this.canEditResourcesValue;\n    }\n}\n","<pw-resource-header [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-resource-header>\n<main>\n<pw-integration-top-banner></pw-integration-top-banner>\n<div class=\"bg-white\">\n  <section class=\"guide-section bg-white py-5 section-outer\">\n    <div class=\"container sec-container\">\n      @if (isLoaded && (posts.length + distributerPosts.length) > 0) {\n        <div>\n          <h1 class=\"int-title mb-0\">{{ integrationCountDisplay }}+ integrations <span class=\"int-title__sub\">(&amp; counting)</span></h1>\n          <p class=\"int-text\">Search the current list of {{ companyName }} vendor and distributor integrations below.</p>\n        </div>\n      }\n      @if (isLoaded) {\n        <pw-resource-company-card [header]=\"'integrated vendors'\"\n          (getPosts)=\"getPostTags()\"\n          [integrationCountDisplay]=\"integrationCountDisplay\"\n          [data]=\"posts\"\n          [user]=\"user\"\n        [userLoggedIn]=\"userLoggedIn\"></pw-resource-company-card>\n      }\n      @if (!isLoaded) {\n        <div class=\"w-100 text-center mt-3\"\n          >\n          <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n        </div>\n      }\n      @if (integrationCountDisplay === 0 && isLoaded) {\n        <div>\n          <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n        </div>\n      }\n      @if (isLoaded && (posts.length + distributerPosts.length) > 0) {\n        <div class=\"text-center pt-3 mt-4\">\n          <p class=\"see-span\">Don&rsquo;t see what you&rsquo;re after? <a [href]=\"contactUsUrl\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            class=\"int-span team-span\">Speak with our team to request a connection <i class=\"fa fa-chevron-right team-span__icon\" aria-hidden=\"true\"></i></a>\n        </p>\n      </div>\n    }\n  </div>\n\n</section>\n<section class=\"guide-section bg-white py-5 section-outer\">\n  <div class=\"container\">\n    @if (isLoaded) {\n      <pw-resource-company-card [header]=\"'integrated Distributors'\"\n        [integrationCountDisplay]=\"integrationCountDisplay\"\n        [vendor]=\"true\"\n        (getPosts)=\"getPostTags()\"\n        [data]=\"distributerPosts\"\n        [user]=\"user\"\n      [userLoggedIn]=\"userLoggedIn\"></pw-resource-company-card>\n    }\n    @if (!isLoaded) {\n      <div class=\"w-100 text-center mt-3\"\n        >\n        <p-progress-spinner strokeWidth=\"2\"> </p-progress-spinner>\n      </div>\n    }\n    @if (integrationCountDisplay === 0 && isLoaded) {\n      <div>\n        <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n      </div>\n    }\n  </div>\n\n</section>\n@if (integrations) {\n  <section class=\"guide-section bg-white py-5 section-outer\">\n    <div class=\"container\">\n      <div class=\"how-it-works-wrapper\">\n        <div class=\"d-flex\">\n          <h2 class=\"it-works-title mb-0\">{{ integrations?.title || 'How it works' }}</h2>\n          @if (canEditResourcesValue) {\n            <i\n              class=\"fa fa-edit in-page-edit-icon text-black ms-4 mt-3 cursor-pointer\"\n              (click)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n              (keydown.enter)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n              (keydown.space)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n            title=\"Edit Integrations Section\"></i>\n          }\n        </div>\n        <p class=\"pb-20\" [innerHTML]=\"integrations?.description || 'View short example videos to understand how these integrations can work for you:'\"></p>\n        <div class=\"row section-row\"  [ngClass]=\"{ 'justify-content-center': integrations?.items?.length === 1 }\">\n          @if (integrations?.items?.length > 0) {\n            @for (integration of integrations?.items; track integration) {\n              @if (integration?.image_url || integration?.title || integration?.description) {\n                <div\n                  class=\"col-md-6\"\n                  >\n                  @if (integration?.video_url && integration?.video_url.includes('https')) {\n                    <div class=\"d-flex justify-content-center cursor-pointer\">\n                      @if (integration?.video_url) {\n                        <img\n                          [src]=\"integration?.image_url\"\n                          (click)=\"loadMicrosoftVideo(integration?.video_url)\"\n                          (keydown.enter)=\"loadMicrosoftVideo(integration?.video_url)\"\n                          class=\"how-it-works-img\"\n                          alt=\"Integration Video Thumbnail\"\n                          />\n                      }\n                    </div>\n                  } @else {\n                    <div class=\"d-flex justify-content-center\">\n                      <div class=\"w-100\">\n                        <pw-no-data [withImage]=\"true\" [message]=\"'No video found' | transloco\">\n                        </pw-no-data>\n                      </div>\n                    </div>\n                  }\n                </div>\n              }\n            }\n          } @else {\n            <div class=\"w-100 text-center\">\n              <pw-no-data [withImage]=\"true\" [message]=\"'Integration.NoDataMessage' | transloco\"></pw-no-data>\n            </div>\n          }\n        </div>\n      </div>\n    </div>\n  </section>\n}\n@if (showIntegrations()) {\n  <section class=\"guide-section bg-white py-5 section-outer\">\n    <div class=\"container\">\n      <div class=\"row align-items-start\">\n        <div class=\"col-md-6 text-md-start text-center\">\n          <div class=\"d-flex\">\n            <h2 class=\"guide-title mb-3\">{{ guideData?.items?.[0]?.title || 'Featured guide' }}</h2>\n            @if (canEditResourcesValue) {\n              <button type=\"button\"\n                class=\"in-page-edit-icon text-black ms-4 mt-3 cursor-pointer\"\n                (click)=\"openGuidesModal(guidesEditModal)\"\n                title=\"Edit featured guide\"\n                aria-label=\"Edit featured guide\">\n                <i class=\"fa fa-edit\" aria-hidden=\"true\"></i>\n              </button>\n            }\n          </div>\n          <p class=\"guide-subtext\"\n            [innerHTML]=\"guideData?.items?.[0]?.description || (canEditResourcesValue ? 'Add a featured guide via Admin &rarr; Domain config &rarr; Integrations.' : 'A practical walkthrough of how to get the most from your integrations.')\">\n          </p>\n          @if (guideData?.items?.[0]?.guide_url) {\n            <a class=\"vault-btn\"\n              [href]=\"guideData?.items?.[0]?.guide_url\"\n              target=\"_blank\"\n              rel=\"noopener noreferrer\">\n              {{ guideData?.items?.[0]?.button_text || 'View the guide' }} <i class=\"fa fa-chevron-right vault-btn__icon\" aria-hidden=\"true\"></i>\n            </a>\n          }\n        </div>\n        <div class=\"col-md-6 text-center\">\n          @if (guideData?.items?.[0]?.image_url && !guideData?.items?.[0]?.image_url?.includes('default-photo.jpg')) {\n            <img\n              [src]=\"guideData?.items?.[0]?.image_url\"\n              alt=\"\"\n              class=\"guide-img\"\n              loading=\"lazy\" />\n          }\n        </div>\n      </div>\n    </div>\n  </section>\n}\n</div>\n\n@if (resourcePostTag?.tag_category_id) {\n  <pw-resource-note-card [categoryId]=\"resourcePostTag?.tag_category_id\" [tag]=\"resourcePostTag\" [releaseHeader]=\"true\" [resourceTitle]=\"resourcePostTag?.title\" [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-resource-note-card>\n}\n\n</main>\n<pw-trial-4-contact-us [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-trial-4-contact-us>\n\n\n\n<ng-template #editIntegrationsModal let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Edit Integrations Section</h5>\n    <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n  </div>\n\n  <div class=\"modal-body\">\n    <div class=\"mb-3\">\n      <label class=\"form-label\" for=\"integration-title\">Title</label>\n      <input class=\"form-control\" id=\"integration-title\" [(ngModel)]=\"editingIntegrations.title\"\n          aria-label=\"Integration Title\" />\n    </div>\n\n    <div class=\"mb-3\">\n      <label class=\"form-label\" for=\"integration-description\">Description</label>\n      <textarea class=\"form-control\" id=\"integration-description\" rows=\"3\" [(ngModel)]=\"editingIntegrations.description\"\n          aria-label=\"Integration Description\"></textarea>\n    </div>\n\n    <div cdkDropList (cdkDropListDropped)=\"dropIntegrationItems($event)\">\n      @for (integration of editingIntegrations.items; track integration; let i = $index) {\n        <div class=\"border p-3 mb-3\" cdkDrag>\n          <div class=\"d-flex justify-content-between align-items-center mb-2\">\n            <span class=\"pw-label-style form-label mb-0\" id=\"integration-item-label\">Integration Item</span>\n            <i class=\"fa fa-bars cursor-move in-page-bars-icon\" cdkDragHandle></i>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-title-' + i\">Title</label>\n              <input class=\"form-control\" [id]=\"'integration-item-title-' + i\" [(ngModel)]=\"integration.title\" id=\"input_integration.title_7712\" name=\"input_integration.title_7712\"\n                  aria-label=\"Input Integration.title 7712\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-description-' + i\">Description</label>\n              <input class=\"form-control\" [id]=\"'integration-item-description-' + i\" [(ngModel)]=\"integration.description\" id=\"input_integration.description_9056\" name=\"input_integration.description_9056\"\n                  aria-label=\"Input Integration.description 9056\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-blog-url-' + i\">Blog URL</label>\n              <input class=\"form-control\" [id]=\"'integration-item-blog-url-' + i\" [(ngModel)]=\"integration.blog_url\" id=\"input_integration.blog_url_7856\" name=\"input_integration.blog_url_7856\"\n                  aria-label=\"Input Integration.blog Url 7856\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-image-url-' + i\">Image URL</label>\n              <input class=\"form-control\" [id]=\"'integration-item-image-url-' + i\" [(ngModel)]=\"integration.image_url\" id=\"input_integration.image_url_9056\" name=\"input_integration.image_url_9056\"\n                  aria-label=\"Input Integration.image Url 9056\" />\n            </div>\n            <div class=\"col-md-12 mb-2\">\n              <label class=\"form-label\" [for]=\"'integration-item-video-url-' + i\">Video URL</label>\n              <input class=\"form-control\" [id]=\"'integration-item-video-url-' + i\" [(ngModel)]=\"integration.video_url\" id=\"input_integration.video_url_9056\" name=\"input_integration.video_url_9056\"\n                  aria-label=\"Input Integration.video Url 9056\" />\n            </div>\n          </div>\n          <div class=\"d-flex justify-content-end\">\n            <i class=\"fa fa-trash text-danger cursor-pointer\" (click)=\"removeIntegrationItem(i)\"   (keydown.enter)=\"removeIntegrationItem(i)\"\n            (keydown.space)=\"removeIntegrationItem(i)\"></i>\n          </div>\n        </div>\n      }\n    </div>\n\n    <button class=\"btn btn-outline-primary btn-sm\" (click)=\"addIntegrationItem()\">+ Add Integration</button>\n  </div>\n\n  <div class=\"modal-footer\">\n    <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n    <button class=\"btn btn-primary\" (click)=\"saveIntegrations(modal)\">Save</button>\n  </div>\n</ng-template>\n\n\n\n<ng-template #guidesEditModal let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Edit Guides</h5>\n    <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n  </div>\n\n  <div class=\"modal-body\">\n    <h4 class=\"mb-3\">Guides Section</h4>\n\n    <div cdkDropList (cdkDropListDropped)=\"dropGuides($event)\">\n      @for (guide of editingGuides.items; track guide; let i = $index) {\n        <div class=\"border p-3 mb-3\" cdkDrag>\n          <div class=\"row\">\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-title-' + i\">Title</label>\n              <input class=\"form-control\" [id]=\"'guide-title-' + i\" [(ngModel)]=\"guide.title\" id=\"input_guide.title_7072\" name=\"input_guide.title_7072\"\n                  aria-label=\"Input Guide.title 7072\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-button-text-' + i\">Button Text</label>\n              <input class=\"form-control\" [id]=\"'guide-button-text-' + i\" [(ngModel)]=\"guide.button_text\" id=\"input_guide.button_text_7712\" name=\"input_guide.button_text_7712\"\n                  aria-label=\"Input Guide.button Text 7712\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-image-url-' + i\">Image URL</label>\n              <input class=\"form-control\" [id]=\"'guide-image-url-' + i\" [(ngModel)]=\"guide.image_url\" id=\"input_guide.image_url_7856\" name=\"input_guide.image_url_7856\"\n                  aria-label=\"Input Guide.image Url 7856\" />\n            </div>\n            <div class=\"col-md-6 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-url-' + i\">Guide URL</label>\n              <input class=\"form-control\" [id]=\"'guide-url-' + i\" [(ngModel)]=\"guide.guide_url\" id=\"input_guide.guide_url_6944\" name=\"input_guide.guide_url_6944\"\n                  aria-label=\"Input Guide.guide Url 6944\" />\n            </div>\n            <div class=\"col-12 mb-2\">\n              <label class=\"form-label\" [for]=\"'guide-description-' + i\">Description</label>\n              <textarea class=\"form-control\" [id]=\"'guide-description-' + i\" [name]=\"'guide-description-' + i\" rows=\"3\" [(ngModel)]=\"guide.description\"></textarea>\n            </div>\n            <div class=\"d-flex justify-content-between align-items-center mt-2\">\n              <i class=\"fa fa-trash text-danger cursor-pointer\" (click)=\"removeGuide(i)\" (keydown.enter)=\"removeGuide(i)\" (keydown.space)=\"removeGuide(i)\"></i>\n              <i class=\"fa fa-bars cursor-move\" cdkDragHandle></i>\n            </div>\n          </div>\n        </div>\n      }\n    </div>\n\n    <button class=\"btn btn-primary mt-2\" (click)=\"addGuide()\">+ Add Guide</button>\n  </div>\n\n  <div class=\"modal-footer\">\n    <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n    <button class=\"btn btn-primary\" (click)=\"saveGuides(modal)\">Save</button>\n  </div>\n</ng-template>\n","import { NgModule } from '@angular/core';\nimport { RouterModule, Routes } from '@angular/router';\n\nimport { IntegrationTopBannerComponent } from '../../components/resource-integration/integration-top-banner/integration-top-banner.component';\nimport { ResourceIntegrationComponent } from '../../components/resource-integration/resource-integration.component';\nimport { ResourceSharedModule } from '../../shared/resource-shared.module';\n\nconst routes: Routes = [\n    {\n        path: '',\n        component: ResourceIntegrationComponent,\n        data: {\n            title: 'Resources - Integrations',\n            permission: 'Pages.Blog',\n            preload: false\n        }\n    }\n];\n\n@NgModule({\n    imports: [\n        ResourceSharedModule,\n        RouterModule.forChild(routes),\n        ResourceIntegrationComponent,\n        IntegrationTopBannerComponent\n    ]\n})\nexport class ResourceIntegrationsModule {}\n"],"mappings":"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"}

package/fesm2022/{posiwise-resource-module-resource-jobs.module-B53AOs8y.mjs → posiwise-resource-module-resource-jobs.module-DOdaBrZi.mjs}

@@ -270,7 +270,7 @@ var ResourceJobsComponent = class ResourceJobsComponent extends BaseResourceComp
 			selector: "pw-resource-jobs",
 			usesInheritance: true,
 			ngImport: i0,
-			template: "<pw-resource-header [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-resource-header>\n\n<pw-resource-jobs-top-banner />\n\n@if (blogPostTag?.tag_category_id) {\n  <pw-resource-job-cards [categoryId]=\"blogPostTag.tag_category_id\" [user]=\"user\" [userLoggedIn]=\"userLoggedIn\" />\n}\n\n<pw-trial-4-contact-us [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-trial-4-contact-us>\n",
+			template: "<pw-resource-header [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-resource-header>\n<main>\n\n<pw-resource-jobs-top-banner />\n\n@if (blogPostTag?.tag_category_id) {\n  <pw-resource-job-cards [categoryId]=\"blogPostTag.tag_category_id\" [user]=\"user\" [userLoggedIn]=\"userLoggedIn\" />\n}\n\n</main>\n<pw-trial-4-contact-us [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-trial-4-contact-us>\n",
 			dependencies: [
 				{
 					kind: "component",
@@ -329,7 +329,7 @@ i0.ɵɵngDeclareClassMetadata({
 				ResourceJobCardsComponent,
 				Trial4ContactUsComponent
 			],
-			template: "<pw-resource-header [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-resource-header>\n\n<pw-resource-jobs-top-banner />\n\n@if (blogPostTag?.tag_category_id) {\n  <pw-resource-job-cards [categoryId]=\"blogPostTag.tag_category_id\" [user]=\"user\" [userLoggedIn]=\"userLoggedIn\" />\n}\n\n<pw-trial-4-contact-us [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-trial-4-contact-us>\n"
+			template: "<pw-resource-header [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-resource-header>\n<main>\n\n<pw-resource-jobs-top-banner />\n\n@if (blogPostTag?.tag_category_id) {\n  <pw-resource-job-cards [categoryId]=\"blogPostTag.tag_category_id\" [user]=\"user\" [userLoggedIn]=\"userLoggedIn\" />\n}\n\n</main>\n<pw-trial-4-contact-us [user]=\"user\" [userLoggedIn]=\"userLoggedIn\"></pw-trial-4-contact-us>\n"
 		}]
 	}]
 });
@@ -396,4 +396,4 @@ i0.ɵɵngDeclareClassMetadata({
 });
 export { ResourceJobsModule };
 
-//# sourceMappingURL=posiwise-resource-module-resource-jobs.module-B53AOs8y.mjs.map
+//# sourceMappingURL=posiwise-resource-module-resource-jobs.module-DOdaBrZi.mjs.map