@kaizen/components 1.47.0 → 1.47.1

package/dist/esm/TitleBlockZen/TitleBlockZen.module.scss.mjs

@@ -0,0 +1,55 @@
+import { styleInject } from '../__build-tools/styleInject.mjs';
+var css_248z = ".TitleBlockZen-module_titleBlock__bekbg{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--color-purple-600,#5f3361);display:flex;flex-direction:column;justify-content:center;position:relative;width:100%}.TitleBlockZen-module_titleBlock__bekbg.TitleBlockZen-module_educationVariant__B3I7P{background-color:var(--color-blue-100,#e6f6ff)}.TitleBlockZen-module_titleBlock__bekbg.TitleBlockZen-module_adminVariant__vvIrj{background-color:var(--color-gray-100,#f9f9f9)}@media print{.TitleBlockZen-module_titleBlock__bekbg{display:none}}.TitleBlockZen-module_rowBelowSeparator__ES4X-,.TitleBlockZen-module_titleRow__LcreV{display:flex;justify-content:center;width:100%}.TitleBlockZen-module_adminVariant__vvIrj .TitleBlockZen-module_titleRow__LcreV{background-color:var(--color-white,#fff)}.TitleBlockZen-module_rowBelowSeparatorInner__ln-Nc,.TitleBlockZen-module_titleRowInner__JWjlG{display:flex;flex-direction:column;margin:0 72px;max-width:1392px;min-width:0;width:100%}@media (max-width:calc(1080px - 1px)){.TitleBlockZen-module_rowBelowSeparatorInner__ln-Nc,.TitleBlockZen-module_titleRowInner__JWjlG{margin:0 12px}}.TitleBlockZen-module_titleRowInnerContent__zhZ-S{align-items:center;border-bottom:.1875rem solid rgba(var(--color-white-rgb,255,255,255),.1);display:flex;justify-content:space-between;min-height:5.25rem;position:relative;width:100%}.TitleBlockZen-module_educationVariant__B3I7P .TitleBlockZen-module_titleRowInnerContent__zhZ-S{border-bottom-color:rgba(var(--color-purple-700-rgb,74,35,77),.2)}.TitleBlockZen-module_adminVariant__vvIrj .TitleBlockZen-module_titleRowInnerContent__zhZ-S,.TitleBlockZen-module_collapseNavigationArea__PkEa9 .TitleBlockZen-module_titleRowInnerContent__zhZ-S{border-bottom-color:transparent}@media (max-width:calc(1080px - 1px)){.TitleBlockZen-module_titleRowInnerContent__zhZ-S{border-bottom:none}}.TitleBlockZen-module_title__n0doa{align-items:center;display:flex;min-width:0}@media (max-width:1365px){.TitleBlockZen-module_title__n0doa{width:100%}}.TitleBlockZen-module_titleAndSubtitle__l2kEQ{align-items:center;display:flex;min-width:0;transform:translateY(-.0833em);z-index:1000}@media (max-width:1365px){.TitleBlockZen-module_hasSubtitle__onXCE .TitleBlockZen-module_titleAndSubtitle__l2kEQ{transform:translateY(-.3833em)}}.TitleBlockZen-module_titleAndSubtitleInner__-5y1m{display:flex;min-width:0}.TitleBlockZen-module_hasSubtitle__onXCE.TitleBlockZen-module_hasLongTitle__axGG9.TitleBlockZen-module_hasLongSubtitle__TlqEy .TitleBlockZen-module_titleAndSubtitleInner__-5y1m{align-items:center}@media (max-width:1365px){.TitleBlockZen-module_hasSubtitle__onXCE.TitleBlockZen-module_hasLongTitle__axGG9.TitleBlockZen-module_hasLongSubtitle__TlqEy .TitleBlockZen-module_titleAndSubtitleInner__-5y1m{align-items:baseline}}@media (max-width:calc(1080px - 1px)){.TitleBlockZen-module_hasPageSwitcherSelect__JrYn4 .TitleBlockZen-module_titleAndSubtitleInner__-5y1m{align-items:normal;flex-direction:column;justify-content:space-between;transform:translateY(.5rem)}}.TitleBlockZen-module_hasSubtitle__onXCE .TitleBlockZen-module_titleAndSubtitleInner__-5y1m{align-items:baseline;overflow:hidden}@media (max-width:1365px){.TitleBlockZen-module_hasSubtitle__onXCE .TitleBlockZen-module_titleAndSubtitleInner__-5y1m{align-items:normal;flex-direction:column;justify-content:space-between;transform:translateY(.5rem)}.TitleBlockZen-module_hasLongTitle__axGG9.TitleBlockZen-module_hasLongSubtitle__TlqEy .TitleBlockZen-module_hasSubtitle__onXCE .TitleBlockZen-module_titleAndSubtitleInner__-5y1m{align-items:baseline}}@media (max-width:calc(1080px - 1px)){.TitleBlockZen-module_hasSubtitle__onXCE .TitleBlockZen-module_titleAndSubtitleInner__-5y1m{transform:translateY(.75rem)}}.TitleBlockZen-module_titleTextOverride__Caa0-.TitleBlockZen-module_titleTextOverride__Caa0-{padding:4px 0}@media (max-width:1644px){.TitleBlockZen-module_titleTextOverride__Caa0-.TitleBlockZen-module_titleTextOverride__Caa0-{font-family:var(--typography-heading-2-font-family,\"Inter\",\"Noto Sans\",Helvetica,Arial,sans-serif);font-size:var(--typography-heading-2-font-size,1.75rem);font-weight:var(--typography-heading-2-font-weight,700);letter-spacing:var(--typography-heading-2-letter-spacing,normal);line-height:var(--typography-heading-2-line-height,2.25rem)}}@media (max-width:1365px){.TitleBlockZen-module_titleTextOverride__Caa0-.TitleBlockZen-module_titleTextOverride__Caa0-{font-family:var(--typography-heading-2-font-family,\"Inter\",\"Noto Sans\",Helvetica,Arial,sans-serif);font-size:var(--typography-heading-2-font-size,1.75rem);font-weight:var(--typography-heading-2-font-weight,700);letter-spacing:var(--typography-heading-2-letter-spacing,normal);line-height:var(--typography-heading-2-line-height,2.25rem);padding:2px 0}.TitleBlockZen-module_hasLongTitle__axGG9 .TitleBlockZen-module_titleTextOverride__Caa0-.TitleBlockZen-module_titleTextOverride__Caa0-{font-family:var(--typography-heading-3-font-family,\"Inter\",\"Noto Sans\",Helvetica,Arial,sans-serif);font-size:var(--typography-heading-3-font-size,1.375rem);font-weight:var(--typography-heading-3-font-weight,700);letter-spacing:var(--typography-heading-3-letter-spacing,normal);line-height:var(--typography-heading-3-line-height,1.875rem);padding:2px 0}}@media (max-width:calc(1080px - 1px)){.TitleBlockZen-module_titleTextOverride__Caa0-.TitleBlockZen-module_titleTextOverride__Caa0-{font-family:var(--typography-heading-4-font-family,\"Inter\",\"Noto Sans\",Helvetica,Arial,sans-serif);font-size:var(--typography-heading-4-font-size,1.125rem);font-weight:var(--typography-heading-4-font-weight,600);letter-spacing:var(--typography-heading-4-letter-spacing,normal);line-height:var(--typography-heading-4-line-height,1.5rem);padding:0}}.TitleBlockZen-module_avatar__CHWTd{box-sizing:border-box;display:none;height:3rem;margin-left:0;margin-right:.75rem;overflow:hidden;width:3rem}.TitleBlockZen-module_avatar__CHWTd[dir=rtl],[dir=rtl] .TitleBlockZen-module_avatar__CHWTd{margin-left:.75rem;margin-right:0}.TitleBlockZen-module_avatar__CHWTd>*{max-width:100%}@media (min-width:1080px){.TitleBlockZen-module_avatar__CHWTd{display:block}}.TitleBlockZen-module_avatar__CHWTd.TitleBlockZen-module_withBorder__lzJvb{border:3px solid var(--color-white,#fff);border-radius:50%}.TitleBlockZen-module_hasLongTitle__axGG9 .TitleBlockZen-module_avatar__CHWTd{display:none}.TitleBlockZen-module_hamburger__VFufP{display:none;margin-left:0;margin-right:var(--spacing-xs,.375rem)}.TitleBlockZen-module_hamburger__VFufP[dir=rtl],[dir=rtl] .TitleBlockZen-module_hamburger__VFufP{margin-left:var(--spacing-xs,.375rem);margin-right:0}@media (max-width:calc(1080px - 1px)){.TitleBlockZen-module_hamburger__VFufP{align-items:center;display:flex}}.TitleBlockZen-module_subtitle__OD-d5{align-items:center;color:var(--color-white,#fff);display:flex;font-family:var(--typography-paragraph-small-font-family,\"Inter\",\"Noto Sans\",Helvetica,Arial,sans-serif);font-size:var(--typography-paragraph-small-font-size,.875rem);font-weight:var(--typography-paragraph-small-font-weight,400);letter-spacing:var(--typography-paragraph-small-letter-spacing,normal);line-height:var(--typography-paragraph-small-line-height,1.125rem);margin-left:.75rem;margin-right:0;max-width:230px}.TitleBlockZen-module_adminVariant__vvIrj .TitleBlockZen-module_subtitle__OD-d5{color:var(--color-purple-800,#2f2438)}.TitleBlockZen-module_subtitle__OD-d5[dir=rtl],[dir=rtl] .TitleBlockZen-module_subtitle__OD-d5{margin-left:0;margin-right:.75rem}@media (max-width:1365px){.TitleBlockZen-module_subtitle__OD-d5{margin:.3rem 0;max-width:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.TitleBlockZen-module_subtitleText__odf0T{max-width:42vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}@media (max-width:767px){.TitleBlockZen-module_subtitleText__odf0T{max-width:88vw}}.TitleBlockZen-module_sectionTitleContainer__nzQ-r{align-items:center;display:flex;padding:1.125rem 0}.TitleBlockZen-module_sectionTitleInner__wYAWC{display:flex;flex-direction:column}.TitleBlockZen-module_sectionTitleOverride__GDHqp.TitleBlockZen-module_sectionTitleOverride__GDHqp{font-family:var(--typography-heading-2-font-family,\"Inter\",\"Noto Sans\",Helvetica,Arial,sans-serif);font-size:var(--typography-heading-2-font-size,1.75rem);font-weight:var(--typography-heading-2-font-weight,700);letter-spacing:var(--typography-heading-2-letter-spacing,normal);line-height:var(--typography-heading-2-line-height,2.25rem);margin-left:0;margin-right:1.5rem;white-space:nowrap}.TitleBlockZen-module_sectionTitleOverride__GDHqp.TitleBlockZen-module_sectionTitleOverride__GDHqp[dir=rtl],[dir=rtl] .TitleBlockZen-module_sectionTitleOverride__GDHqp.TitleBlockZen-module_sectionTitleOverride__GDHqp{margin-left:1.5rem;margin-right:0}@media (max-width:1644px){.TitleBlockZen-module_sectionTitleOverride__GDHqp.TitleBlockZen-module_sectionTitleOverride__GDHqp{font-family:var(--typography-heading-3-font-family,\"Inter\",\"Noto Sans\",Helvetica,Arial,sans-serif);font-size:var(--typography-heading-3-font-size,1.375rem);font-weight:var(--typography-heading-3-font-weight,700);letter-spacing:var(--typography-heading-3-letter-spacing,normal);line-height:var(--typography-heading-3-line-height,1.875rem)}}@media (max-width:calc(1080px - 1px)){.TitleBlockZen-module_sectionTitleOverride__GDHqp.TitleBlockZen-module_sectionTitleOverride__GDHqp{font-family:var(--typography-heading-4-font-family,\"Inter\",\"Noto Sans\",Helvetica,Arial,sans-serif);font-size:var(--typography-heading-4-font-size,1.125rem);font-weight:var(--typography-heading-4-font-weight,600);letter-spacing:var(--typography-heading-4-letter-spacing,normal);line-height:var(--typography-heading-4-line-height,1.5rem)}}.TitleBlockZen-module_sectionTitle__Le5YQ{display:block}.TitleBlockZen-module_sectionTitleDescription__mIl-A{color:var(--color-white,#fff);font-family:var(--typography-paragraph-small-font-family,\"Inter\",\"Noto Sans\",Helvetica,Arial,sans-serif);font-size:var(--typography-paragraph-small-font-size,.875rem);font-weight:var(--typography-paragraph-small-font-weight,400);letter-spacing:var(--typography-paragraph-small-letter-spacing,normal);line-height:var(--typography-paragraph-small-line-height,1.125rem);max-width:780px}.TitleBlockZen-module_sectionTitle__Le5YQ+.TitleBlockZen-module_sectionTitleDescription__mIl-A{margin-top:.375rem}.TitleBlockZen-module_sectionTitleDescription__mIl-A.TitleBlockZen-module_dark__Y-v1Z{color:rgba(var(--color-purple-800-rgb,47,36,56),.7)}.TitleBlockZen-module_rowBelowSeparatorInnerContent__aho-R{display:flex;justify-content:space-between;margin-top:-.1875rem;width:100%}.TitleBlockZen-module_titleAndAdjacent__BWNsj{display:flex;min-width:0}.TitleBlockZen-module_titleAndAdjacentNotBreadcrumb__9TuNA{align-items:center;display:flex;min-width:0;transition:opacity .3s ease}.TitleBlockZen-module_breadcrumbTextLink__1HhXQ:focus~.TitleBlockZen-module_titleAndAdjacentNotBreadcrumb__9TuNA,.TitleBlockZen-module_breadcrumbTextLink__1HhXQ:hover~.TitleBlockZen-module_titleAndAdjacentNotBreadcrumb__9TuNA,.TitleBlockZen-module_breadcrumb__o2c8A:focus~.TitleBlockZen-module_titleAndAdjacentNotBreadcrumb__9TuNA,.TitleBlockZen-module_breadcrumb__o2c8A:hover~.TitleBlockZen-module_titleAndAdjacentNotBreadcrumb__9TuNA{opacity:0}.TitleBlockZen-module_tag__mWbbU{align-items:center;display:flex;margin-left:.75rem;margin-right:0}.TitleBlockZen-module_tag__mWbbU[dir=rtl],[dir=rtl] .TitleBlockZen-module_tag__mWbbU{margin-left:0;margin-right:.75rem}@media (max-width:calc(1080px - 1px)){.TitleBlockZen-module_tag__mWbbU{display:none}}.TitleBlockZen-module_tag__mWbbU+.TitleBlockZen-module_pageSwitcherSelectNextToTitle__CPnE3,.TitleBlockZen-module_tag__mWbbU+.TitleBlockZen-module_pageSwitcherSelectNextToTitle__CPnE3[dir=rtl],[dir=rtl] .TitleBlockZen-module_tag__mWbbU+.TitleBlockZen-module_pageSwitcherSelectNextToTitle__CPnE3{margin-left:0;margin-right:0}.TitleBlockZen-module_pageSwitcherSelectNextToTitle__CPnE3{flex-shrink:0;margin-left:.75rem;margin-right:0;width:15rem}.TitleBlockZen-module_pageSwitcherSelectNextToTitle__CPnE3[dir=rtl],[dir=rtl] .TitleBlockZen-module_pageSwitcherSelectNextToTitle__CPnE3{margin-left:0;margin-right:.75rem}.TitleBlockZen-module_pageSwitcherSelectUnderneathTitle__MRZI2{flex-shrink:0;max-width:15rem}.TitleBlockZen-module_navigationTabsContainer__lto6e{height:4.5rem}@media (max-width:767px){.TitleBlockZen-module_navigationTabsContainer__lto6e{height:3.75rem}}.TitleBlockZen-module_navigationTabsContainerCollapsed__oMPa4{height:0}@media (max-width:calc(1080px - 1px)){.TitleBlockZen-module_navigationTabsContainerCollapsed__oMPa4{height:0}}@media (max-width:767px){.TitleBlockZen-module_hasNavigationTabs__S4JF- .TitleBlockZen-module_navigationTabScrollerContainer__n-B-b{display:block;overflow-x:scroll;scrollbar-width:none;width:100vw}.TitleBlockZen-module_hasNavigationTabs__S4JF- .TitleBlockZen-module_navigationTabScrollerContainer__n-B-b::-webkit-scrollbar{display:none}}.TitleBlockZen-module_navigationTabsNav__UOeVY{height:100%}.TitleBlockZen-module_navigationTabsList__sxozg{display:flex;height:100%;list-style:none;margin:0;padding:0}.TitleBlockZen-module_navigationTabEdgeShadowLeft__yfKxK,.TitleBlockZen-module_navigationTabEdgeShadowRight__7ySCE{display:none;pointer-events:none}@media (max-width:767px){.TitleBlockZen-module_navigationTabEdgeShadowLeft__yfKxK,.TitleBlockZen-module_navigationTabEdgeShadowRight__7ySCE{background:linear-gradient(0deg,var(--color-purple-600,#5f3361),rgba(var(--color-purple-600-rgb,95,51,97),0));display:block;height:3.75rem;position:absolute;top:3.5625rem;width:3.75rem;z-index:1020}.TitleBlockZen-module_adminVariant__vvIrj .TitleBlockZen-module_navigationTabEdgeShadowLeft__yfKxK,.TitleBlockZen-module_adminVariant__vvIrj .TitleBlockZen-module_navigationTabEdgeShadowRight__7ySCE{background:linear-gradient(0deg,var(--color-gray-100,#f9f9f9),rgba(var(--color-gray-100-rgb,249,249,249),0))}.TitleBlockZen-module_educationVariant__B3I7P .TitleBlockZen-module_navigationTabEdgeShadowLeft__yfKxK,.TitleBlockZen-module_educationVariant__B3I7P .TitleBlockZen-module_navigationTabEdgeShadowRight__7ySCE{background:linear-gradient(0deg,var(--color-blue-200,#bde2f5),rgba(var(--color-blue-200-rgb,189,226,245),0))}}.TitleBlockZen-module_navigationTabEdgeShadowLeft__yfKxK{left:0;top:calc(100% - 4.5rem);transform:rotate(90deg)}@media (max-width:767px){.TitleBlockZen-module_navigationTabEdgeShadowLeft__yfKxK{top:calc(100% - 3.75rem)}}.TitleBlockZen-module_navigationTabEdgeShadowRight__7ySCE{right:0;top:calc(100% - 4.5rem);transform:rotate(-90deg)}@media (max-width:767px){.TitleBlockZen-module_navigationTabEdgeShadowRight__7ySCE{top:calc(100% - 3.75rem)}}.TitleBlockZen-module_secondaryActionsContainer__Is7rl{align-items:flex-start;display:flex;justify-content:flex-end;margin-left:2.25rem;margin-right:0;padding:.75rem 0}.TitleBlockZen-module_secondaryActionsContainer__Is7rl[dir=rtl],[dir=rtl] .TitleBlockZen-module_secondaryActionsContainer__Is7rl{margin-left:0;margin-right:2.25rem}.TitleBlockZen-module_adminVariant__vvIrj .TitleBlockZen-module_secondaryActionsContainer__Is7rl,.TitleBlockZen-module_educationVariant__B3I7P .TitleBlockZen-module_secondaryActionsContainer__Is7rl{color:var(--color-blue-500,#0168b3)}@media (max-width:calc(1080px - 1px)){.TitleBlockZen-module_secondaryActionsContainer__Is7rl{display:none}}.TitleBlockZen-module_breadcrumb__o2c8A{align-items:center;align-self:normal;appearance:none;background:transparent;border:none;color:inherit;cursor:pointer;display:inline;display:flex;font:inherit;left:calc(-48px - 1.5rem);margin:0;padding:0;position:absolute;right:auto;top:50%;transform:translateY(-50%);z-index:1020}.TitleBlockZen-module_breadcrumb__o2c8A[dir=rtl],[dir=rtl] .TitleBlockZen-module_breadcrumb__o2c8A{left:auto;right:calc(-48px - 1.5rem)}.TitleBlockZen-module_breadcrumb__o2c8A:hover .TitleBlockZen-module_breadcrumbTextLink__1HhXQ{text-decoration:underline}.TitleBlockZen-module_breadcrumb__o2c8A:focus{outline:none}.TitleBlockZen-module_breadcrumb__o2c8A:focus:after{background:transparent;border-color:var(--color-blue-200,#bde2f5);border-radius:50%;border-style:var(--border-focus-ring-border-style,solid);border-width:var(--border-focus-ring-border-width,2px);content:\"\";inset:calc(var(--border-focus-ring-border-width, 2px)*-2 - var(--border-focus-ring-border-width, 2px));position:absolute}@media only screen and (max-width:1644px){.TitleBlockZen-module_breadcrumb__o2c8A{left:0;margin-left:0;margin-right:.75rem;position:relative;right:auto;transform:translateY(0)}.TitleBlockZen-module_breadcrumb__o2c8A[dir=rtl],[dir=rtl] .TitleBlockZen-module_breadcrumb__o2c8A{left:auto;margin-left:.75rem;margin-right:0;right:0}}@media (max-width:calc(1080px - 1px)){.TitleBlockZen-module_breadcrumb__o2c8A{display:none}}.TitleBlockZen-module_breadcrumbTextLink__1HhXQ{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;left:-3rem;overflow:hidden;position:absolute;right:auto;white-space:nowrap;width:1px;z-index:1019}.TitleBlockZen-module_breadcrumbTextLink__1HhXQ[dir=rtl],[dir=rtl] .TitleBlockZen-module_breadcrumbTextLink__1HhXQ{left:auto;right:-3rem}@media (max-width:1644px){.TitleBlockZen-module_breadcrumbTextLink__1HhXQ{left:1.5rem;right:auto}.TitleBlockZen-module_breadcrumbTextLink__1HhXQ[dir=rtl],[dir=rtl] .TitleBlockZen-module_breadcrumbTextLink__1HhXQ{left:auto;right:1.5rem}}@media only screen and (min-width:1644px){.TitleBlockZen-module_breadcrumbTextLink__1HhXQ{left:calc(48px - 1.5rem);right:auto}.TitleBlockZen-module_breadcrumbTextLink__1HhXQ[dir=rtl],[dir=rtl] .TitleBlockZen-module_breadcrumbTextLink__1HhXQ{left:auto;right:calc(48px - 1.5rem)}}.TitleBlockZen-module_breadcrumbTextLink__1HhXQ:focus,.TitleBlockZen-module_breadcrumbTextLink__1HhXQ:hover,.TitleBlockZen-module_breadcrumb__o2c8A:focus .TitleBlockZen-module_breadcrumbTextLink__1HhXQ,.TitleBlockZen-module_breadcrumb__o2c8A:hover .TitleBlockZen-module_breadcrumbTextLink__1HhXQ{clip:auto;animation:TitleBlockZen-module_slide-fade__k4tBT .4s;clip-path:none;display:block;height:auto;overflow:initial;position:static;position:absolute;white-space:normal;width:auto}[dir=rtl] .TitleBlockZen-module_breadcrumbTextLink__1HhXQ:focus,[dir=rtl] .TitleBlockZen-module_breadcrumbTextLink__1HhXQ:hover,[dir=rtl] .TitleBlockZen-module_breadcrumb__o2c8A:focus .TitleBlockZen-module_breadcrumbTextLink__1HhXQ,[dir=rtl] .TitleBlockZen-module_breadcrumb__o2c8A:hover .TitleBlockZen-module_breadcrumbTextLink__1HhXQ{animation:TitleBlockZen-module_reverse-slide-fade__WT9AW .4s}.TitleBlockZen-module_breadcrumbText__O-GCu{font-family:var(--typography-heading-5-font-family,\"Inter\",\"Noto Sans\",Helvetica,Arial,sans-serif);font-size:var(--typography-heading-5-font-size,1rem);font-weight:var(--typography-heading-5-font-weight,600);letter-spacing:var(--typography-heading-5-letter-spacing,normal);line-height:var(--typography-heading-5-line-height,1.5rem);margin-inline-start:var(--spacing-xl,3rem);white-space:nowrap}.TitleBlockZen-module_breadcrumbText__O-GCu,.TitleBlockZen-module_breadcrumb__o2c8A,.TitleBlockZen-module_breadcrumb__o2c8A:hover{color:var(--color-white,#fff)}.TitleBlockZen-module_adminVariant__vvIrj .TitleBlockZen-module_breadcrumbText__O-GCu,.TitleBlockZen-module_adminVariant__vvIrj .TitleBlockZen-module_breadcrumb__o2c8A,.TitleBlockZen-module_adminVariant__vvIrj .TitleBlockZen-module_breadcrumb__o2c8A:hover,.TitleBlockZen-module_educationVariant__B3I7P .TitleBlockZen-module_breadcrumbText__O-GCu,.TitleBlockZen-module_educationVariant__B3I7P .TitleBlockZen-module_breadcrumb__o2c8A,.TitleBlockZen-module_educationVariant__B3I7P .TitleBlockZen-module_breadcrumb__o2c8A:hover{color:var(--color-purple-800,#2f2438)}.TitleBlockZen-module_circle__4bfl6{align-items:center;border-color:rgba(var(--color-white-rgb,255,255,255),.5);border-radius:50%;border-style:solid;border-width:2px;box-sizing:border-box;color:var(--color-white,#fff);display:flex;flex:0 0 48px;height:48px;justify-content:center;transition:background-color .3s ease,transform .3s ease;width:48px}.TitleBlockZen-module_breadcrumb__o2c8A:focus .TitleBlockZen-module_circle__4bfl6,.TitleBlockZen-module_breadcrumb__o2c8A:hover .TitleBlockZen-module_circle__4bfl6{background-color:rgba(var(--color-white-rgb,255,255,255),.1);border-color:var(--color-white,#fff);color:var(--color-white,#fff);transform:scale(1.1)}.TitleBlockZen-module_adminVariant__vvIrj .TitleBlockZen-module_circle__4bfl6,.TitleBlockZen-module_educationVariant__B3I7P .TitleBlockZen-module_circle__4bfl6{border-color:var(--color-blue-300,#73c0e8);border-width:3px;color:var(--color-blue-500,#0168b3)}.TitleBlockZen-module_adminVariant__vvIrj .TitleBlockZen-module_breadcrumb__o2c8A:focus .TitleBlockZen-module_circle__4bfl6,.TitleBlockZen-module_adminVariant__vvIrj .TitleBlockZen-module_breadcrumb__o2c8A:hover .TitleBlockZen-module_circle__4bfl6,.TitleBlockZen-module_educationVariant__B3I7P .TitleBlockZen-module_breadcrumb__o2c8A:focus .TitleBlockZen-module_circle__4bfl6,.TitleBlockZen-module_educationVariant__B3I7P .TitleBlockZen-module_breadcrumb__o2c8A:hover .TitleBlockZen-module_circle__4bfl6{background-color:rgba(var(--color-blue-500-rgb,1,104,179),.1);border-color:var(--color-blue-500,#0168b3);color:var(--color-blue-500,#0168b3)}@keyframes TitleBlockZen-module_slide-fade__k4tBT{0%{display:none;opacity:0}1%{display:block;opacity:0;transform:translateX(-30px)}to{opacity:100%;transform:translateX(0)}}@keyframes TitleBlockZen-module_reverse-slide-fade__WT9AW{0%{display:none;opacity:0}1%{display:block;opacity:0;transform:translateX(30px)}to{opacity:100%;transform:translateX(0)}}";
+var styles = {
+  "titleBlock": "TitleBlockZen-module_titleBlock__bekbg",
+  "educationVariant": "TitleBlockZen-module_educationVariant__B3I7P",
+  "adminVariant": "TitleBlockZen-module_adminVariant__vvIrj",
+  "titleRow": "TitleBlockZen-module_titleRow__LcreV",
+  "rowBelowSeparator": "TitleBlockZen-module_rowBelowSeparator__ES4X-",
+  "rowBelowSeparatorInner": "TitleBlockZen-module_rowBelowSeparatorInner__ln-Nc",
+  "titleRowInner": "TitleBlockZen-module_titleRowInner__JWjlG",
+  "titleRowInnerContent": "TitleBlockZen-module_titleRowInnerContent__zhZ-S",
+  "collapseNavigationArea": "TitleBlockZen-module_collapseNavigationArea__PkEa9",
+  "title": "TitleBlockZen-module_title__n0doa",
+  "titleAndSubtitle": "TitleBlockZen-module_titleAndSubtitle__l2kEQ",
+  "hasSubtitle": "TitleBlockZen-module_hasSubtitle__onXCE",
+  "titleAndSubtitleInner": "TitleBlockZen-module_titleAndSubtitleInner__-5y1m",
+  "hasLongTitle": "TitleBlockZen-module_hasLongTitle__axGG9",
+  "hasLongSubtitle": "TitleBlockZen-module_hasLongSubtitle__TlqEy",
+  "hasPageSwitcherSelect": "TitleBlockZen-module_hasPageSwitcherSelect__JrYn4",
+  "titleTextOverride": "TitleBlockZen-module_titleTextOverride__Caa0-",
+  "avatar": "TitleBlockZen-module_avatar__CHWTd",
+  "withBorder": "TitleBlockZen-module_withBorder__lzJvb",
+  "hamburger": "TitleBlockZen-module_hamburger__VFufP",
+  "subtitle": "TitleBlockZen-module_subtitle__OD-d5",
+  "subtitleText": "TitleBlockZen-module_subtitleText__odf0T",
+  "sectionTitleContainer": "TitleBlockZen-module_sectionTitleContainer__nzQ-r",
+  "sectionTitleInner": "TitleBlockZen-module_sectionTitleInner__wYAWC",
+  "sectionTitleOverride": "TitleBlockZen-module_sectionTitleOverride__GDHqp",
+  "sectionTitle": "TitleBlockZen-module_sectionTitle__Le5YQ",
+  "sectionTitleDescription": "TitleBlockZen-module_sectionTitleDescription__mIl-A",
+  "dark": "TitleBlockZen-module_dark__Y-v1Z",
+  "rowBelowSeparatorInnerContent": "TitleBlockZen-module_rowBelowSeparatorInnerContent__aho-R",
+  "titleAndAdjacent": "TitleBlockZen-module_titleAndAdjacent__BWNsj",
+  "titleAndAdjacentNotBreadcrumb": "TitleBlockZen-module_titleAndAdjacentNotBreadcrumb__9TuNA",
+  "breadcrumb": "TitleBlockZen-module_breadcrumb__o2c8A",
+  "breadcrumbTextLink": "TitleBlockZen-module_breadcrumbTextLink__1HhXQ",
+  "tag": "TitleBlockZen-module_tag__mWbbU",
+  "pageSwitcherSelectNextToTitle": "TitleBlockZen-module_pageSwitcherSelectNextToTitle__CPnE3",
+  "pageSwitcherSelectUnderneathTitle": "TitleBlockZen-module_pageSwitcherSelectUnderneathTitle__MRZI2",
+  "navigationTabsContainer": "TitleBlockZen-module_navigationTabsContainer__lto6e",
+  "navigationTabsContainerCollapsed": "TitleBlockZen-module_navigationTabsContainerCollapsed__oMPa4",
+  "hasNavigationTabs": "TitleBlockZen-module_hasNavigationTabs__S4JF-",
+  "navigationTabScrollerContainer": "TitleBlockZen-module_navigationTabScrollerContainer__n-B-b",
+  "navigationTabsNav": "TitleBlockZen-module_navigationTabsNav__UOeVY",
+  "navigationTabsList": "TitleBlockZen-module_navigationTabsList__sxozg",
+  "navigationTabEdgeShadowRight": "TitleBlockZen-module_navigationTabEdgeShadowRight__7ySCE",
+  "navigationTabEdgeShadowLeft": "TitleBlockZen-module_navigationTabEdgeShadowLeft__yfKxK",
+  "secondaryActionsContainer": "TitleBlockZen-module_secondaryActionsContainer__Is7rl",
+  "slide-fade": "TitleBlockZen-module_slide-fade__k4tBT",
+  "reverse-slide-fade": "TitleBlockZen-module_reverse-slide-fade__WT9AW",
+  "breadcrumbText": "TitleBlockZen-module_breadcrumbText__O-GCu",
+  "circle": "TitleBlockZen-module_circle__4bfl6"
+};
+/*#__PURE__*/styleInject(css_248z);
+export { styles as default };

package/dist/esm/TitleBlockZen/constants.mjs

@@ -0,0 +1,3 @@
+var TITLE_BLOCK_ZEN_SECONDARY_MENU_HTML_ID = "title-block-secondary-menu";
+var TITLE_BLOCK_ZEN_OTHER_ACTIONS_HTML_ID = "title-block-other-actions";
+export { TITLE_BLOCK_ZEN_OTHER_ACTIONS_HTML_ID, TITLE_BLOCK_ZEN_SECONDARY_MENU_HTML_ID };

package/dist/esm/TitleBlockZen/subcomponents/MainActions.mjs

@@ -0,0 +1,115 @@
+import { __assign, __spreadArray } from 'tslib';
+import React from 'react';
+import { Button } from '../../Button/Button/Button.mjs';
+import { IconButton } from '../../Button/IconButton/IconButton.mjs';
+import '../../Icon/subcomponents/SVG/SVG.mjs';
+import { ChevronDownIcon } from '../../Icon/ChevronDownIcon.mjs';
+import { MeatballsIcon } from '../../Icon/MeatballsIcon.mjs';
+import { Menu } from '../../Menu/Menu.mjs';
+import '../../Menu/subcomponents/MenuHeading/MenuHeading.mjs';
+import '../../Menu/subcomponents/MenuItem/MenuItem.mjs';
+import { MenuList } from '../../Menu/subcomponents/MenuList/MenuList.mjs';
+import '../../Menu/subcomponents/StatelessMenu/StatelessMenu.mjs';
+import { TITLE_BLOCK_ZEN_SECONDARY_MENU_HTML_ID } from '../constants.mjs';
+import { isMenuGroupNotButton } from '../utils.mjs';
+import { TitleBlockMenuItem } from './TitleBlockMenuItem.mjs';
+import { Toolbar } from './Toolbar.mjs';
+import styles from './MainActions.module.scss.mjs';
+const MainActions = /*#__PURE__*/function () {
+  const MainActions = function (_a) {
+    var primaryAction = _a.primaryAction,
+      defaultAction = _a.defaultAction,
+      _b = _a.reversed,
+      reversed = _b === void 0 ? false : _b,
+      overflowMenuItems = _a.overflowMenuItems,
+      _c = _a.showOverflowMenu,
+      showOverflowMenu = _c === void 0 ? false : _c;
+    var items;
+    if (primaryAction && isMenuGroupNotButton(primaryAction)) {
+      var menuContent = primaryAction.menuItems.map(function (item, idx) {
+        return /*#__PURE__*/React.createElement(TitleBlockMenuItem, __assign({}, item, {
+          key: "main-action-primary-menu-item-".concat(idx),
+          "data-automation-id": "main-action-primary-menu-item-".concat(idx),
+          "data-testid": "main-action-primary-menu-item-".concat(idx)
+        }));
+      });
+      items = __spreadArray(__spreadArray([], defaultAction ? [{
+        key: "defaultAction",
+        node: ( /*#__PURE__*/React.createElement(Button, __assign({}, defaultAction, {
+          reversed: defaultAction.reversed !== undefined ? defaultAction.reversed : reversed,
+          "data-automation-id": "title-block-default-action-button",
+          "data-testid": "title-block-default-action-button"
+        })))
+      }] : [], true), primaryAction ? [{
+        key: "primaryAction",
+        node: ( /*#__PURE__*/React.createElement(Menu, {
+          align: "right",
+          button: /*#__PURE__*/React.createElement(Button, {
+            label: primaryAction.label,
+            primary: true,
+            reversed: reversed,
+            icon: /*#__PURE__*/React.createElement(ChevronDownIcon, {
+              role: "presentation"
+            }),
+            iconPosition: "end",
+            "data-automation-id": "title-block-primary-action-button",
+            "data-testid": "title-block-primary-action-button",
+            badge: primaryAction.badge ? __assign(__assign({}, primaryAction.badge), {
+              variant: "dark"
+            }) : undefined
+          })
+        }, /*#__PURE__*/React.createElement(MenuList, null, menuContent)))
+      }] : [], true);
+    } else {
+      items = __spreadArray(__spreadArray([], defaultAction ? [{
+        key: "defaultAction",
+        node: ( /*#__PURE__*/React.createElement(Button, __assign({}, defaultAction, {
+          reversed: defaultAction.reversed !== undefined ? defaultAction.reversed : reversed,
+          "data-automation-id": "title-block-default-action-button",
+          "data-testid": "title-block-default-action-button"
+        })))
+      }] : [], true), primaryAction ? [{
+        key: "primaryAction",
+        node: ( /*#__PURE__*/React.createElement(Button, __assign({}, primaryAction, {
+          primary: primaryAction.primary !== undefined ? primaryAction.primary : true,
+          reversed: primaryAction.reversed !== undefined ? primaryAction.reversed : reversed,
+          "data-automation-id": "title-block-primary-action-button",
+          "data-testid": "title-block-primary-action-button",
+          badge: primaryAction.badge ? __assign(__assign({}, primaryAction.badge), {
+            variant: "dark"
+          }) : undefined
+        })))
+      }] : [], true);
+    }
+    if (overflowMenuItems && showOverflowMenu && overflowMenuItems.length > 0) {
+      items = __spreadArray([{
+        key: "overflowMenu",
+        node: ( /*#__PURE__*/React.createElement(Menu, {
+          align: "right",
+          button: /*#__PURE__*/React.createElement(IconButton, {
+            id: TITLE_BLOCK_ZEN_SECONDARY_MENU_HTML_ID,
+            label: "Open secondary menu",
+            reversed: reversed,
+            icon: /*#__PURE__*/React.createElement(MeatballsIcon, {
+              role: "presentation"
+            })
+          })
+        }, /*#__PURE__*/React.createElement(MenuList, null, overflowMenuItems.map(function (menuItem, idx) {
+          return /*#__PURE__*/React.createElement(TitleBlockMenuItem, __assign({}, menuItem, {
+            key: "main-action-overflow-item-menu-item-".concat(idx)
+          }));
+        }))))
+      }], items, true);
+    }
+    return /*#__PURE__*/React.createElement("div", {
+      className: styles.mainActionsContainer
+    }, /*#__PURE__*/React.createElement(Toolbar, {
+      items: items,
+      automationId: "title-block-main-actions-toolbar",
+      "data-testid": "title-block-main-actions-toolbar"
+    }));
+  };
+  MainActions.displayName = "MainActions";
+  return MainActions;
+}();
+export { MainActions };

package/dist/esm/TitleBlockZen/subcomponents/MainActions.module.scss.mjs

@@ -0,0 +1,7 @@
+import { styleInject } from '../../__build-tools/styleInject.mjs';
+var css_248z = ".MainActions-module_mainActionsContainer__wN117{align-items:center;display:flex;flex-grow:1;flex-shrink:0;justify-content:flex-end;margin-left:.75rem;margin-right:0}.MainActions-module_mainActionsContainer__wN117[dir=rtl],[dir=rtl] .MainActions-module_mainActionsContainer__wN117{margin-left:0;margin-right:.75rem}@media (max-width:767px){.MainActions-module_mainActionsContainer__wN117{display:none}}";
+var styles = {
+  "mainActionsContainer": "MainActions-module_mainActionsContainer__wN117"
+};
+/*#__PURE__*/styleInject(css_248z);
+export { styles as default };

package/dist/esm/TitleBlockZen/subcomponents/MobileActions.mjs

@@ -0,0 +1,303 @@
+import { __assign } from 'tslib';
+import React, { useState, useCallback, useEffect } from 'react';
+import classnames from 'classnames';
+import { FocusOn } from 'react-focus-on';
+import '../../Icon/subcomponents/SVG/SVG.mjs';
+import { ChevronDownIcon } from '../../Icon/ChevronDownIcon.mjs';
+import { ChevronUpIcon } from '../../Icon/ChevronUpIcon.mjs';
+import '../../Menu/Menu.mjs';
+import { MenuHeading } from '../../Menu/subcomponents/MenuHeading/MenuHeading.mjs';
+import { MenuItem } from '../../Menu/subcomponents/MenuItem/MenuItem.mjs';
+import { MenuList } from '../../Menu/subcomponents/MenuList/MenuList.mjs';
+import '../../Menu/subcomponents/StatelessMenu/StatelessMenu.mjs';
+import { TITLE_BLOCK_ZEN_OTHER_ACTIONS_HTML_ID } from '../constants.mjs';
+import { isMenuGroupNotButton, convertSecondaryActionsToMenuItems } from '../utils.mjs';
+import { TitleBlockMenuItem } from './TitleBlockMenuItem.mjs';
+import styles from './MobileActions.module.scss.mjs';
+var menuItemIsLink = function (item) {
+  return "href" in item;
+};
+var defaultActionIsLink = function (action) {
+  return "href" in action;
+};
+var defaultActionIsButton = function (action) {
+  return !("href" in action) && "onClick" in action || "component" in action;
+};
+var filterActions = function (menuItems, filterType) {
+  return menuItems.filter(function (item) {
+    return filterType === "link" ? menuItemIsLink(item) : !menuItemIsLink(item);
+  });
+};
+/** Returns a filtered array of TitleBlockMenuItem based on actionType
+ * This is use to sort a selectively render the action into a specifc order
+ */
+var renderPrimaryActionDrawerContent = function (primaryAction, actionType) {
+  if (!primaryAction) return null;
+  if (isMenuGroupNotButton(primaryAction)) {
+    var filteredActions = filterActions(primaryAction.menuItems, actionType);
+    return filteredActions.map(function (item, idx) {
+      var itemType = menuItemIsLink(item) ? "link" : "action";
+      return /*#__PURE__*/React.createElement(TitleBlockMenuItem, __assign({}, item, {
+        key: "title-block-mobile-actions-primary-".concat(itemType, "-").concat(idx),
+        "data-automation-id": "title-block-mobile-actions-primary-".concat(itemType, "-").concat(idx),
+        "data-testid": "title-block-mobile-actions-primary-".concat(itemType, "-").concat(idx)
+      }));
+    });
+  }
+  return null;
+};
+var renderDefaultLink = function (defaultAction) {
+  if (!defaultActionIsLink(defaultAction)) return;
+  if ("component" in defaultAction) {
+    return /*#__PURE__*/React.createElement(TitleBlockMenuItem, __assign({}, defaultAction, {
+      key: "title-block-mobile-actions-default-link",
+      "data-automation-id": "title-block-mobile-actions-default-link",
+      "data-testid": "title-block-mobile-actions-default-link"
+    }));
+  }
+  return /*#__PURE__*/React.createElement(MenuItem, {
+    href: defaultAction.href,
+    label: defaultAction.label,
+    icon: defaultAction.icon,
+    disabled: defaultAction.disabled,
+    key: "title-block-mobile-actions-default-link",
+    "data-automation-id": "title-block-mobile-actions-default-link",
+    "data-testid": "title-block-mobile-actions-default-link",
+    id: defaultAction.id
+  });
+};
+var renderDefaultAction = function (defaultAction) {
+  if (!defaultActionIsLink(defaultAction)) {
+    return /*#__PURE__*/React.createElement(TitleBlockMenuItem, __assign({}, defaultAction, {
+      key: "title-block-mobile-actions-default-action",
+      "data-automation-id": "title-block-mobile-actions-default-action",
+      "data-testid": "title-block-mobile-actions-default-action"
+    }));
+  }
+  return null;
+};
+var renderSecondaryActions = function (secondaryActions) {
+  if (!secondaryActions) return null;
+  var secondaryActionMenuItems = convertSecondaryActionsToMenuItems(secondaryActions);
+  return secondaryActionMenuItems.map(function (item, idx) {
+    return /*#__PURE__*/React.createElement(TitleBlockMenuItem, __assign({}, item, {
+      key: "title-block-mobile-actions-secondary-action-".concat(idx),
+      "data-testid": "title-block-mobile-actions-secondary-action"
+    }));
+  });
+};
+var renderSecondaryOverflowMenuItems = function (secondaryOverflowMenuItems) {
+  return secondaryOverflowMenuItems.map(function (item, idx) {
+    return /*#__PURE__*/React.createElement(TitleBlockMenuItem, __assign({}, item, {
+      key: "title-block-mobile-actions-overflow-menu-item-".concat(idx),
+      "data-testid": "title-block-mobile-actions-overflow-menu-item"
+    }));
+  });
+};
+var DrawerMenuContent = function (_a) {
+  var primaryAction = _a.primaryAction,
+    defaultAction = _a.defaultAction,
+    secondaryActions = _a.secondaryActions,
+    secondaryOverflowMenuItems = _a.secondaryOverflowMenuItems;
+  var showOtherActionsHeading = defaultAction && defaultActionIsButton(defaultAction) || secondaryActions || secondaryOverflowMenuItems;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(MenuList, null, primaryAction && renderPrimaryActionDrawerContent(primaryAction, "link"), defaultAction && renderDefaultLink(defaultAction), primaryAction && renderPrimaryActionDrawerContent(primaryAction, "action")), (defaultAction || secondaryActions || secondaryOverflowMenuItems) && ( /*#__PURE__*/React.createElement(MenuList, {
+    heading: showOtherActionsHeading && /*#__PURE__*/React.createElement(MenuHeading, null, "Other actions")
+  }, defaultAction && renderDefaultAction(defaultAction), secondaryActions && renderSecondaryActions(secondaryActions), secondaryOverflowMenuItems && renderSecondaryOverflowMenuItems(secondaryOverflowMenuItems))));
+};
+var renderDrawerHandleLabel = function (label, icon, drawerHandleLabelIconPosition) {
+  if (drawerHandleLabelIconPosition === "end") {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
+      className: styles.drawerHandleLabelText,
+      "data-testid": "drawer-handle-lable-text"
+    }, label), /*#__PURE__*/React.createElement(React.Fragment, null, icon && /*#__PURE__*/React.createElement("span", {
+      className: styles.drawerHandleIcon
+    }, icon)));
+  } else {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(React.Fragment, null, icon && /*#__PURE__*/React.createElement("span", {
+      className: styles.drawerHandleIcon
+    }, icon)), /*#__PURE__*/React.createElement("span", {
+      className: styles.drawerHandleLabelText,
+      "data-testid": "drawer-handle-lable-text"
+    }, label));
+  }
+};
+var ButtonOrLink = function (_a) {
+  var action = _a.action,
+    children = _a.children;
+  if (typeof action === "object" && "onClick" in action && "href" in action) {
+    return /*#__PURE__*/React.createElement("a", {
+      onClick: action.onClick,
+      href: action.href,
+      className: classnames(styles.mobileActionsPrimaryLabel, styles.mobileActionsPrimaryButton),
+      "data-testid": "title-block-mobile-actions-primary-button"
+    }, children);
+  }
+  if (typeof action === "function") {
+    return /*#__PURE__*/React.createElement("button", {
+      type: "button",
+      onClick: action,
+      className: classnames(styles.mobileActionsPrimaryLabel, styles.mobileActionsPrimaryButton),
+      "data-testid": "title-block-mobile-actions-primary-button"
+    }, children);
+  }
+  if (typeof action === "string") {
+    return /*#__PURE__*/React.createElement("a", {
+      href: action,
+      className: classnames(styles.mobileActionsPrimaryLabel, styles.mobileActionsPrimaryButton),
+      "data-testid": "title-block-mobile-actions-primary-button"
+    }, children);
+  }
+  // when there's no action (e.g. primary button is disabled)
+  return /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    className: classnames(styles.mobileActionsPrimaryLabel, styles.mobileActionsPrimaryButton),
+    "data-testid": "title-block-mobile-actions-primary-button"
+  }, children);
+};
+var getAction = function (primaryAction) {
+  if (primaryAction && !primaryAction.disabled) {
+    if (primaryAction.onClick && primaryAction.href) {
+      return {
+        href: primaryAction.href,
+        onClick: primaryAction.onClick
+      };
+    }
+    if (primaryAction.onClick) {
+      return primaryAction.onClick;
+    }
+    if (primaryAction.href) {
+      return primaryAction.href;
+    }
+  }
+  return undefined;
+};
+var DrawerHandle = function (_a) {
+  var primaryAction = _a.primaryAction,
+    secondaryActions = _a.secondaryActions,
+    defaultAction = _a.defaultAction,
+    secondaryOverflowMenuItems = _a.secondaryOverflowMenuItems,
+    drawerHandleLabelIconPosition = _a.drawerHandleLabelIconPosition,
+    toggleDisplay = _a.toggleDisplay,
+    isOpen = _a.isOpen;
+  var showDrawer = defaultAction || secondaryActions || secondaryOverflowMenuItems;
+  if (primaryAction) {
+    // If the primary action is a menu
+    if (isMenuGroupNotButton(primaryAction)) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: classnames(styles.mobileActionsTopRow, styles.mobileActionsTopRowSingleButton),
+        "data-testid": "title-block-mobile-actions-drawer-handle"
+      }, /*#__PURE__*/React.createElement("button", {
+        type: "button",
+        className: classnames(styles.mobileActionsExpandButton, styles.mobileActionsPrimaryLabel),
+        onClick: toggleDisplay,
+        "aria-expanded": isOpen
+      }, primaryAction.label, /*#__PURE__*/React.createElement("span", {
+        className: styles.mobileActionsChevronSquare
+      }, isOpen ? ( /*#__PURE__*/React.createElement(ChevronDownIcon, {
+        role: "presentation"
+      })) : ( /*#__PURE__*/React.createElement(ChevronUpIcon, {
+        role: "presentation"
+      })))));
+    }
+    // If the primary action is a button, or has no onClick/href/action
+    return /*#__PURE__*/React.createElement("div", {
+      className: classnames(styles.mobileActionsTopRow, !showDrawer && styles.mobileActionsTopRowSingleButton),
+      "data-testid": "title-block-mobile-actions-drawer-handle"
+    }, "component" in primaryAction ? ( /*#__PURE__*/React.createElement(primaryAction.component, __assign({
+      className: classnames(styles.mobileActionsPrimaryLabel, styles.mobileActionsPrimaryButton)
+    }, primaryAction), primaryAction.label && renderDrawerHandleLabel(primaryAction.label, primaryAction.icon, drawerHandleLabelIconPosition))) : ( /*#__PURE__*/React.createElement(ButtonOrLink, {
+      action: getAction(primaryAction)
+    }, renderDrawerHandleLabel(primaryAction.label, primaryAction.icon, drawerHandleLabelIconPosition))), showDrawer && ( /*#__PURE__*/React.createElement("button", {
+      type: "button",
+      className: styles.mobileActionsExpandButton,
+      onClick: toggleDisplay,
+      "aria-expanded": isOpen,
+      id: TITLE_BLOCK_ZEN_OTHER_ACTIONS_HTML_ID,
+      "aria-label": "Other actions"
+    }, isOpen ? ( /*#__PURE__*/React.createElement(ChevronDownIcon, {
+      role: "presentation"
+    })) : ( /*#__PURE__*/React.createElement(ChevronUpIcon, {
+      role: "presentation"
+    })))));
+  }
+  // if there are default/secondary actions but no primary action
+  if (showDrawer) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: classnames(styles.mobileActionsTopRow, styles.mobileActionsTopRowSingleButton),
+      "data-testid": "title-block-mobile-actions-drawer-handle"
+    }, /*#__PURE__*/React.createElement("button", {
+      type: "button",
+      className: classnames(styles.mobileActionsExpandButton, styles.mobileActionsPrimaryLabel),
+      onClick: toggleDisplay,
+      "aria-expanded": isOpen,
+      id: TITLE_BLOCK_ZEN_OTHER_ACTIONS_HTML_ID
+    }, renderDrawerHandleLabel("Other actions"), /*#__PURE__*/React.createElement("span", {
+      className: styles.mobileActionsChevronSquare
+    }, isOpen ? ( /*#__PURE__*/React.createElement(ChevronDownIcon, {
+      role: "presentation"
+    })) : ( /*#__PURE__*/React.createElement(ChevronUpIcon, {
+      role: "presentation"
+    })))));
+  }
+  return null;
+};
+const MobileActions = /*#__PURE__*/function () {
+  const MobileActions = function (_a) {
+    var primaryAction = _a.primaryAction,
+      defaultAction = _a.defaultAction,
+      secondaryActions = _a.secondaryActions,
+      secondaryOverflowMenuItems = _a.secondaryOverflowMenuItems,
+      drawerHandleLabelIconPosition = _a.drawerHandleLabelIconPosition,
+      _b = _a.autoHide,
+      autoHide = _b === void 0 ? false : _b;
+    var _c = useState(false),
+      isOpen = _c[0],
+      setIsOpen = _c[1];
+    var menuContent = /*#__PURE__*/React.createRef();
+    var toggleDisplay = function () {
+      setIsOpen(!isOpen);
+    };
+    // This callback handler will not run when autoHide === "off"
+    var handleDocumentClickForAutoHide = useCallback(function (e) {
+      var _a;
+      if (isOpen && e.target instanceof Node && ((_a = menuContent.current) === null || _a === void 0 ? void 0 : _a.contains(e.target))) {
+        setIsOpen(false);
+      }
+    }, [menuContent]);
+    useEffect(function () {
+      if (autoHide) {
+        document.addEventListener("click", handleDocumentClickForAutoHide, true);
+      }
+      return function () {
+        if (autoHide) {
+          document.removeEventListener("click", handleDocumentClickForAutoHide, true);
+        }
+      };
+    }, [autoHide, handleDocumentClickForAutoHide]);
+    return /*#__PURE__*/React.createElement("div", {
+      className: classnames(styles.mobileActionsContainer, isOpen && styles.isOpen)
+    }, /*#__PURE__*/React.createElement(FocusOn, {
+      enabled: isOpen,
+      scrollLock: false
+    }, /*#__PURE__*/React.createElement(DrawerHandle, {
+      primaryAction: primaryAction,
+      secondaryActions: secondaryActions,
+      defaultAction: defaultAction,
+      secondaryOverflowMenuItems: secondaryOverflowMenuItems,
+      drawerHandleLabelIconPosition: drawerHandleLabelIconPosition,
+      toggleDisplay: toggleDisplay,
+      isOpen: isOpen
+    }), (defaultAction || secondaryActions || secondaryOverflowMenuItems || primaryAction && isMenuGroupNotButton(primaryAction)) && ( /*#__PURE__*/React.createElement("div", {
+      ref: menuContent,
+      className: styles.mobileActionsMenuContainer
+    }, /*#__PURE__*/React.createElement(DrawerMenuContent, {
+      primaryAction: primaryAction,
+      defaultAction: defaultAction,
+      secondaryActions: secondaryActions,
+      secondaryOverflowMenuItems: secondaryOverflowMenuItems
+    })))));
+  };
+  MobileActions.displayName = "MobileActions";
+  return MobileActions;
+}();
+export { MobileActions };

package/dist/esm/TitleBlockZen/subcomponents/MobileActions.module.scss.mjs

@@ -0,0 +1,18 @@
+import { styleInject } from '../../__build-tools/styleInject.mjs';
+var css_248z = ".MobileActions-module_mobileActionsContainer__ob6ML{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;animation:MobileActions-module_slide-up__vX8Ad 1s ease;border-start-end-radius:var(--border-solid-border-radius,7px);border-start-start-radius:var(--border-solid-border-radius,7px);bottom:0;display:none;flex-direction:column;left:0;overflow:hidden;position:fixed;right:0;transform:translateY(calc(100% - 60px));transition:.4s ease;z-index:1030}.MobileActions-module_mobileActionsContainer__ob6ML.MobileActions-module_isOpen__mmGTA{transform:translateY(0)}.MobileActions-module_mobileActionsContainer__ob6ML.MobileActions-module_isOpen__mmGTA .MobileActions-module_mobileActionsMenuContainer__a7LUt{visibility:visible}@media (max-width:767px){.MobileActions-module_mobileActionsContainer__ob6ML{display:flex}}.MobileActions-module_mobileActionsTopRow__51iiz{align-items:center;display:flex;height:60px;justify-content:space-between}.MobileActions-module_mobileActionsTopRow__51iiz.MobileActions-module_mobileActionsTopRowSingleButton__IB5x6{justify-content:center}.MobileActions-module_mobileActionsMenuContainer__a7LUt{background:var(--color-white,#fff);padding:var(--spacing-xs,.375rem) 0;transition:visibility .4s;visibility:hidden;width:100%}.MobileActions-module_drawerHandleIcon__z-Hp-{align-items:center;display:flex;justify-content:center;margin-left:0;margin-right:.75rem}.MobileActions-module_drawerHandleIcon__z-Hp-[dir=rtl],.MobileActions-module_drawerHandleLabelText__UDIFl+.MobileActions-module_drawerHandleIcon__z-Hp-,[dir=rtl] .MobileActions-module_drawerHandleIcon__z-Hp-{margin-left:.75rem;margin-right:0}.MobileActions-module_drawerHandleLabelText__UDIFl+.MobileActions-module_drawerHandleIcon__z-Hp-[dir=rtl],[dir=rtl] .MobileActions-module_drawerHandleLabelText__UDIFl+.MobileActions-module_drawerHandleIcon__z-Hp-{margin-left:0;margin-right:.75rem}.MobileActions-module_mobileActionsPrimaryLabel__y-kgB{color:var(--color-white,#fff);font-family:var(--typography-button-primary-font-family,\"Inter\",\"Noto Sans\",Helvetica,Arial,sans-serif);font-size:var(--typography-button-primary-font-size,1.125rem);font-weight:var(--typography-button-primary-font-weight,700);letter-spacing:var(--typography-button-primary-letter-spacing,normal);line-height:var(--typography-button-primary-line-height,1.5rem);padding-left:1.125rem;padding-right:0;text-align:left;text-decoration:none}.MobileActions-module_mobileActionsPrimaryLabel__y-kgB[dir=rtl],[dir=rtl] .MobileActions-module_mobileActionsPrimaryLabel__y-kgB{padding-left:0;padding-right:1.125rem}.MobileActions-module_mobileActionsExpandButton__shDFU,.MobileActions-module_mobileActionsPrimaryButton__5Ggbi{align-items:center;background-color:var(--color-blue-500,#0168b3);border:0;box-sizing:border-box;color:var(--color-white,#fff);display:flex;height:100%;justify-content:flex-start;position:relative}.MobileActions-module_mobileActionsExpandButton__shDFU:focus,.MobileActions-module_mobileActionsPrimaryButton__5Ggbi:focus{background-color:var(--color-blue-600,#004970);outline:none}.MobileActions-module_mobileActionsExpandButton__shDFU:focus-visible,.MobileActions-module_mobileActionsPrimaryButton__5Ggbi:focus-visible{height:52px}.MobileActions-module_mobileActionsExpandButton__shDFU:focus-visible:after,.MobileActions-module_mobileActionsPrimaryButton__5Ggbi:focus-visible:after{background:transparent;border-color:var(--color-blue-500,#0168b3);border-style:var(--border-focus-ring-border-style,solid);border-width:2px;content:\"\";inset:calc(var(--border-focus-ring-border-width, 2px)*2*-1);position:absolute}.MobileActions-module_mobileActionsExpandButton__shDFU:hover,.MobileActions-module_mobileActionsPrimaryButton__5Ggbi:hover{text-decoration:none}.MobileActions-module_mobileActionsExpandButton__shDFU:only-child,.MobileActions-module_mobileActionsPrimaryButton__5Ggbi:only-child{border-start-end-radius:var(--border-solid-border-radius,7px);border-start-start-radius:var(--border-solid-border-radius,7px);flex-basis:100%}.MobileActions-module_mobileActionsExpandButton__shDFU:only-child:focus-visible,.MobileActions-module_mobileActionsPrimaryButton__5Ggbi:only-child:focus-visible{flex-basis:calc(100% - 8px)}.MobileActions-module_mobileActionsExpandButton__shDFU:only-child:focus-visible:after,.MobileActions-module_mobileActionsPrimaryButton__5Ggbi:only-child:focus-visible:after{border-start-end-radius:var(--border-focus-ring-border-radius,10px);border-start-start-radius:var(--border-focus-ring-border-radius,10px)}.MobileActions-module_mobileActionsPrimaryButton__5Ggbi:not(:only-child){flex:0 0 calc(100% - 3.75rem)}.MobileActions-module_mobileActionsPrimaryButton__5Ggbi:not(:only-child):focus-visible{border-start-start-radius:var(--border-solid-border-radius,7px);flex-basis:calc(100% - 3.75rem - 8px);margin-left:4px}.MobileActions-module_mobileActionsPrimaryButton__5Ggbi:not(:only-child):focus-visible+.MobileActions-module_mobileActionsExpandButton__shDFU{border-color:var(--color-white,#fff)}.MobileActions-module_mobileActionsPrimaryButton__5Ggbi:not(:only-child):focus-visible:after{border-start-start-radius:var(--border-focus-ring-border-radius,10px)}.MobileActions-module_mobileActionsExpandButton__shDFU:not(:only-child){border-left:2px solid var(--color-blue-200,#bde2f5);flex:0 0 3.75rem;justify-content:center}.MobileActions-module_mobileActionsExpandButton__shDFU:not(:only-child):focus-visible{border-color:var(--color-white,#fff);border-start-end-radius:var(--border-solid-border-radius,7px);flex-basis:calc(3.75rem - 8px);margin-right:4px}.MobileActions-module_mobileActionsExpandButton__shDFU:not(:only-child):focus-visible:after{border-start-end-radius:var(--border-focus-ring-border-radius,10px)}.MobileActions-module_mobileActionsChevronSquare__u4OYT{align-items:center;display:flex;height:100%;justify-content:center;left:auto;position:absolute;right:20px}.MobileActions-module_mobileActionsChevronSquare__u4OYT[dir=rtl],[dir=rtl] .MobileActions-module_mobileActionsChevronSquare__u4OYT{left:20px;right:auto}@keyframes MobileActions-module_slide-up__vX8Ad{0%{transform:translateY(100%)}50%{transform:translateY(100%)}to{transform:translateY(calc(100% - 60px))}}";
+var styles = {
+  "mobileActionsContainer": "MobileActions-module_mobileActionsContainer__ob6ML",
+  "slide-up": "MobileActions-module_slide-up__vX8Ad",
+  "isOpen": "MobileActions-module_isOpen__mmGTA",
+  "mobileActionsMenuContainer": "MobileActions-module_mobileActionsMenuContainer__a7LUt",
+  "mobileActionsTopRow": "MobileActions-module_mobileActionsTopRow__51iiz",
+  "mobileActionsTopRowSingleButton": "MobileActions-module_mobileActionsTopRowSingleButton__IB5x6",
+  "drawerHandleIcon": "MobileActions-module_drawerHandleIcon__z-Hp-",
+  "drawerHandleLabelText": "MobileActions-module_drawerHandleLabelText__UDIFl",
+  "mobileActionsPrimaryLabel": "MobileActions-module_mobileActionsPrimaryLabel__y-kgB",
+  "mobileActionsPrimaryButton": "MobileActions-module_mobileActionsPrimaryButton__5Ggbi",
+  "mobileActionsExpandButton": "MobileActions-module_mobileActionsExpandButton__shDFU",
+  "mobileActionsChevronSquare": "MobileActions-module_mobileActionsChevronSquare__u4OYT"
+};
+/*#__PURE__*/styleInject(css_248z);
+export { styles as default };

package/dist/esm/TitleBlockZen/subcomponents/NavigationTabs.mjs

@@ -0,0 +1,32 @@
+import { __rest, __assign } from 'tslib';
+import React from 'react';
+import classnames from 'classnames';
+import { NON_REVERSED_VARIANTS } from '../utils.mjs';
+import styles from './NavigationTabs.module.scss.mjs';
+var isLight = function (variant) {
+  return variant !== undefined && NON_REVERSED_VARIANTS.includes(variant);
+};
+const NavigationTab = /*#__PURE__*/function () {
+  const NavigationTab = function (props) {
+    var className = classnames(styles.linkAnchor, isLight(props.variant) && styles.lightBackground, props.active && styles.active);
+    if (props.render) {
+      var Component = props.render,
+        otherProps = __rest(props, ["render"]);
+      return /*#__PURE__*/React.createElement(Component, __assign({}, otherProps, {
+        className: className
+      }));
+    }
+    return /*#__PURE__*/React.createElement("a", {
+      className: className,
+      href: props.href,
+      onClick: props.handleClick,
+      id: props.id,
+      "data-automation-id": props.automationId,
+      "data-testid": props.automationId,
+      "aria-current": props.active ? "page" : undefined
+    }, props.text);
+  };
+  NavigationTab.displayName = "NavigationTab";
+  return NavigationTab;
+}();
+export { NavigationTab };

package/dist/esm/TitleBlockZen/subcomponents/NavigationTabs.module.scss.mjs

@@ -0,0 +1,10 @@
+import { styleInject } from '../../__build-tools/styleInject.mjs';
+var css_248z = ".NavigationTabs-module_container__lK-HH{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex}.NavigationTabs-module_linkAnchor__oUsWX{align-items:center;color:rgba(var(--color-white-rgb,255,255,255),.7);display:flex;font-family:var(--typography-heading-4-font-family,\"Inter\",\"Noto Sans\",Helvetica,Arial,sans-serif);font-size:var(--typography-heading-4-font-size,1.125rem);font-weight:var(--typography-heading-4-font-weight,600);height:100%;letter-spacing:var(--typography-heading-4-letter-spacing,normal);line-height:var(--typography-heading-4-line-height,1.5rem);margin-right:var(--spacing-md,1.5rem);padding:0 var(--spacing-sm,.75rem);position:relative;text-decoration:none;white-space:nowrap}.NavigationTabs-module_linkAnchor__oUsWX[dir=rtl],[dir=rtl] .NavigationTabs-module_linkAnchor__oUsWX{margin-left:var(--spacing-md,1.5rem);margin-right:0}.NavigationTabs-module_linkAnchor__oUsWX:hover{color:var(--color-white,#fff);text-decoration:none}@media (max-width:1365px){.NavigationTabs-module_linkAnchor__oUsWX{font-family:var(--typography-heading-5-font-family,\"Inter\",\"Noto Sans\",Helvetica,Arial,sans-serif);font-size:var(--typography-heading-5-font-size,1rem);font-weight:var(--typography-heading-5-font-weight,600);letter-spacing:var(--typography-heading-5-letter-spacing,normal);line-height:var(--typography-heading-5-line-height,1.5rem)}}@media (max-width:1439px){.NavigationTabs-module_linkAnchor__oUsWX{margin-right:var(--spacing-xs,.375rem)}.NavigationTabs-module_linkAnchor__oUsWX[dir=rtl],[dir=rtl] .NavigationTabs-module_linkAnchor__oUsWX{margin-left:var(--spacing-xs,.375rem);margin-right:0}}@media (max-width:1189px){.NavigationTabs-module_linkAnchor__oUsWX{margin:0}}.NavigationTabs-module_linkAnchor__oUsWX.NavigationTabs-module_active__-38QW,.NavigationTabs-module_linkAnchor__oUsWX:focus{color:var(--color-white,#fff)}.NavigationTabs-module_linkAnchor__oUsWX.NavigationTabs-module_active__-38QW:before,.NavigationTabs-module_linkAnchor__oUsWX:focus:before{background-color:var(--color-white,#fff);border-radius:0 0 var(--border-solid-border-radius,7px) var(--border-solid-border-radius,7px);content:\"\";display:block;height:5px;left:0;position:absolute;right:0;top:0;transition:transform .15s cubic-bezier(.55,.085,.68,.53)}@media (max-width:calc(1080px - 1px)){.NavigationTabs-module_linkAnchor__oUsWX.NavigationTabs-module_active__-38QW:before,.NavigationTabs-module_linkAnchor__oUsWX:focus:before{border-radius:var(--border-solid-border-radius,7px) var(--border-solid-border-radius,7px) 0 0;bottom:0;top:auto}}.NavigationTabs-module_linkAnchor__oUsWX:focus{outline:none}.NavigationTabs-module_linkAnchor__oUsWX:focus:before{background-color:var(--color-blue-200,#bde2f5)}.NavigationTabs-module_linkAnchor__oUsWX:focus:after{background:transparent;border-color:var(--color-blue-200,#bde2f5);border-radius:0 0 var(--border-focus-ring-border-radius,10px) var(--border-focus-ring-border-radius,10px);border-style:var(--border-focus-ring-border-style,solid);border-width:var(--border-focus-ring-border-width,2px);content:\"\";inset:0 calc(var(--border-focus-ring-border-width, 2px)*-1) 5px calc(var(--border-focus-ring-border-width, 2px)*-1);position:absolute}@media (max-width:calc(1080px - 1px)){.NavigationTabs-module_linkAnchor__oUsWX:focus:after{border-radius:var(--border-focus-ring-border-radius,10px) var(--border-focus-ring-border-radius,10px) 0 0;inset:5px calc(var(--border-focus-ring-border-width, 2px)*-1) 0 calc(var(--border-focus-ring-border-width, 2px)*-1)}}@media (forced-colors:active){.NavigationTabs-module_linkAnchor__oUsWX.NavigationTabs-module_active__-38QW:before,.NavigationTabs-module_linkAnchor__oUsWX:focus:before{background:transparent;border:5px solid transparent;height:0}}.NavigationTabs-module_linkAnchor__oUsWX.NavigationTabs-module_lightBackground__TR-5T{color:rgba(var(--color-purple-800-rgb,47,36,56),.75)}.NavigationTabs-module_linkAnchor__oUsWX.NavigationTabs-module_lightBackground__TR-5T.NavigationTabs-module_active__-38QW,.NavigationTabs-module_linkAnchor__oUsWX.NavigationTabs-module_lightBackground__TR-5T:hover{color:var(--color-blue-500,#0168b3)}.NavigationTabs-module_linkAnchor__oUsWX.NavigationTabs-module_lightBackground__TR-5T.NavigationTabs-module_active__-38QW:before{background-color:var(--color-blue-500,#0168b3);top:3px}@media (max-width:calc(1080px - 1px)){.NavigationTabs-module_linkAnchor__oUsWX.NavigationTabs-module_lightBackground__TR-5T.NavigationTabs-module_active__-38QW:before{border-radius:var(--border-solid-border-radius,7px) var(--border-solid-border-radius,7px) 0 0;bottom:0;top:auto}}";
+var styles = {
+  "container": "NavigationTabs-module_container__lK-HH",
+  "linkAnchor": "NavigationTabs-module_linkAnchor__oUsWX",
+  "active": "NavigationTabs-module_active__-38QW",
+  "lightBackground": "NavigationTabs-module_lightBackground__TR-5T"
+};
+/*#__PURE__*/styleInject(css_248z);
+export { styles as default };