quirk-ui 0.1.127 → 0.1.129
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index17.css +1 -1
- package/dist/next/blocks/TabsBlock/TabsBlock.test.cjs +1 -1
- package/dist/next/blocks/TabsBlock/TabsBlock.test.mjs +124 -479
- package/dist/next/blocks/TabsBlock/index.cjs +1 -1
- package/dist/next/blocks/TabsBlock/index.mjs +77 -74
- package/dist/next/cards/GridCard/index.cjs +1 -1
- package/dist/next/cards/GridCard/index.mjs +43 -43
- package/package.json +1 -1
package/dist/index17.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._cardLink_14uy9_1{text-decoration:none;cursor:pointer}._card_14uy9_1{background-color:transparent;min-height:100%;border-radius:var(--radius-md);position:relative;overflow:hidden}@media (max-width: 768px){._card_14uy9_1{width:100%;max-width:none;min-width:0}}._container_14uy9_21{display:flex;align-items:flex-start;justify-content:space-between;gap:1.5rem;height:100%;width:100%;padding:3.25rem var(--spacing-xl)}._content_14uy9_31{display:flex;flex-direction:column;gap:var(--spacing-sm);width:100%}._icon_14uy9_38{margin-bottom:var(--spacing-sm)}._icon_14uy9_38 i,._icon_14uy9_38 svg{font-size:2.5rem;color:var(--color-primary-100)}._cardLink_14uy9_1:hover ._card_14uy9_1,._modalTrigger_14uy9_60:hover ._card_14uy9_1{background-color:var(--color-primary-100)}._cardLink_14uy9_1:hover ._callToAction_14uy9_65 ._label_14uy9_66,._modalTrigger_14uy9_60:hover ._callToAction_14uy9_65 ._label_14uy9_66{opacity:1;transform:translateY(0)}._cardLink_14uy9_1:hover ._callToAction_14uy9_65 ._cardIcon_14uy9_71,._modalTrigger_14uy9_60:hover ._callToAction_14uy9_65 ._cardIcon_14uy9_71{background-color:var(--color-primary-100);color:#fff;border:5px solid var(--color-primary-100)}._title_14uy9_78{margin:0;font-size:1.75rem;font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight);text-decoration:none;flex:1;transition:color .3s ease-in-out}._title_14uy9_78 span{transition:color .3s ease-in-out}._description_14uy9_101{margin:0}._description_14uy9_101:has(.inlineNumber){display:flex;gap:var(--spacing-md)}@media (max-width: 767px){._description_14uy9_101:has(.inlineNumber){align-items:center;justify-content:center;flex-direction:column}}._imageWrapper_14uy9_116{position:relative;height:100%;display:flex;justify-content:center}@media (max-width: 767px){._imageWrapper_14uy9_116{max-width:380px}}._imageWrapper_14uy9_116 img{position:relative;height:auto}._modalTrigger_14uy9_60{cursor:pointer}._modalTrigger_14uy9_60 ._imageWrapper_14uy9_116{transition:opacity .3s ease-in-out}._modalTrigger_14uy9_60:hover ._cardIcon_14uy9_71{background-color:var(--color-primary-100);border-color:var(--color-primary-100);color:#fff}._modalTrigger_14uy9_60:hover ._imageWrapper_14uy9_116{opacity:.75}._callToAction_14uy9_65{position:absolute;top:.75rem;right:.75rem;display:flex;align-items:center;gap:var(--spacing-sm)}._callToAction_14uy9_65 ._cardIcon_14uy9_71{display:flex;align-items:center;justify-content:center;width:35px;height:35px;padding:var(--spacing-xs);background-color:#fff;color:var(--color-primary-100);border:5px solid #fff;border-radius:var(--radius-full);transition:color .3s ease-in-out,background-color .3s ease-in-out,border-color .3s ease-in-out}._callToAction_14uy9_65 ._label_14uy9_66{color:var(--color-primary-100);font-weight:var(--font-weight-semibold);opacity:0;transform:translateY(-10px);transition:opacity .3s ease-in-out,transform .3s ease-in-out}._metric_14uy9_205 ._content_14uy9_31{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-sm);width:100%;height:100%;margin:0 auto}._metric_14uy9_205 ._description_14uy9_101{text-align:center;font-size:var(--font-size-lg)}._metric_14uy9_205 ._outerCircle_14uy9_222{stroke-width:10px;stroke:#ccc}._metric_14uy9_205 ._innerCircle_14uy9_227{stroke:var(--color-primary-100);fill:none;stroke-width:10px}._metric_14uy9_205 ._metricLabel_14uy9_233{position:relative;font-weight:var(--font-weight-bold);font-size:1.75rem;fill:var(--color-primary-100)}._textOnly_14uy9_241 ._title_14uy9_78{color:var(--color-primary-100);font-size:var(--font-size-xl)}._textOnly_14uy9_241 ._description_14uy9_101{color:var(--color-text-primary);font-size:var(--font-size-md)}._textOnly_14uy9_241 ._imageWrapper_14uy9_116{display:none}._textOnly_14uy9_241 ._cardLink_14uy9_1:hover ._card_14uy9_1,._textOnly_14uy9_241 ._modalTrigger_14uy9_60:hover ._card_14uy9_1{background-color:var(--color-primary-100)}._textOnly_14uy9_241 ._cardLink_14uy9_1:hover ._callToAction_14uy9_65 ._label_14uy9_66,._textOnly_14uy9_241 ._modalTrigger_14uy9_60:hover ._callToAction_14uy9_65 ._label_14uy9_66{opacity:1;transform:translateY(0);color:#fff}._textOnly_14uy9_241 ._cardLink_14uy9_1:hover ._callToAction_14uy9_65 ._cardIcon_14uy9_71,._textOnly_14uy9_241 ._modalTrigger_14uy9_60:hover ._callToAction_14uy9_65 ._cardIcon_14uy9_71{background-color:#e0eaf9;color:var(--color-primary-100);border:5px solid #e0eaf9}._imageOnly_14uy9_278 ._container_14uy9_21{padding:var(--spacing-md);display:flex;align-items:center;justify-content:center}._imageOnly_14uy9_278 ._imageWrapper_14uy9_116{display:flex;align-items:center;justify-content:center;position:relative;top:0;right:0;bottom:0;left:0;width:100%;height:100%}._imageOnly_14uy9_278 ._imageWrapper_14uy9_116 img{width:100%;height:100%;object-fit:cover}._fullBleed_14uy9_303{min-height:450px}._fullBleed_14uy9_303 ._container_14uy9_21{display:block;padding:0}._fullBleed_14uy9_303 ._modalTrigger_14uy9_60{display:block}._fullBleed_14uy9_303 ._content_14uy9_31{position:absolute;bottom:var(--spacing-md);right:var(--spacing-md);left:var(--spacing-md);z-index:5;background:#ffffffa6;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:var(--radius-md);padding:var(--spacing-lg)}._fullBleed_14uy9_303 ._imageWrapper_14uy9_116{position:absolute;top:0;right:0;bottom:0;left:0;display:block;width:100%;height:100%}._fullBleed_14uy9_303 ._imageWrapper_14uy9_116 img{width:100%;height:100%;object-fit:cover}._imageTop_14uy9_344 ._container_14uy9_21{height:auto;justify-content:flex-start;flex-direction:column-reverse}._imageTop_14uy9_344 ._imageWrapper_14uy9_116{aspect-ratio:16/9}._imageTop_14uy9_344 ._imageWrapper_14uy9_116 img{position:relative;width:100%;height:auto;object-fit:cover}._imageBottom_14uy9_363 ._container_14uy9_21{height:100%;justify-content:flex-start;flex-direction:column}._imageBottom_14uy9_363 ._imageWrapper_14uy9_116{height:auto;align-items:normal}@media (max-width: 767px){._imageBottom_14uy9_363 ._imageWrapper_14uy9_116{max-height:350px}}._imageBottom_14uy9_363 ._imageWrapper_14uy9_116 img{width:100%;height:auto;object-fit:cover}@media (max-width: 767px){._imageBottom_14uy9_363 ._imageWrapper_14uy9_116 img{position:relative}}._imageLeft_14uy9_391 ._container_14uy9_21{flex-direction:row-reverse}@media (max-width: 767px){._imageLeft_14uy9_391 ._container_14uy9_21{flex-direction:column-reverse}}._imageRight_14uy9_401 ._container_14uy9_21{flex-direction:row}@media (max-width: 767px){._imageRight_14uy9_401 ._container_14uy9_21{flex-direction:column}}._imageLeft_14uy9_391 ._content_14uy9_31,._imageRight_14uy9_401 ._content_14uy9_31{flex:.8;width:100%}._imageLeft_14uy9_391 ._title_14uy9_78,._imageRight_14uy9_401 ._title_14uy9_78{font-size:var(--font-size-xl)}._imageLeft_14uy9_391 ._description_14uy9_101,._imageRight_14uy9_401 ._description_14uy9_101{font-size:var(--font-size-md)}._imageLeft_14uy9_391 ._imageWrapper_14uy9_116,._imageRight_14uy9_401 ._imageWrapper_14uy9_116{flex:.75 1;height:100%;max-height:450px;max-width:275px;margin:0 auto;position:relative}._imageLeft_14uy9_391 ._imageWrapper_14uy9_116 img,._imageRight_14uy9_401 ._imageWrapper_14uy9_116 img{border-radius:var(--radius-md);overflow:hidden;width:100%;object-fit:cover;height:auto}@media (max-width: 767px){._imageLeft_14uy9_391 ._imageWrapper_14uy9_116,._imageRight_14uy9_401 ._imageWrapper_14uy9_116{flex:1;justify-content:flex-start;max-height:250px;width:100%}._imageLeft_14uy9_391 ._imageWrapper_14uy9_116 img,._imageRight_14uy9_401 ._imageWrapper_14uy9_116 img{position:relative;height:100%;width:100%;min-width:150px}}._containImage_14uy9_459{gap:var(--spacing-xl)}._containImage_14uy9_459 ._imageWrapper_14uy9_116{align-items:center}._fullBleedImage_14uy9_467{padding:0;gap:0}@media (max-width: 767px){._fullBleedImage_14uy9_467 ._imageWrapper_14uy9_116{max-width:unset}}._fullBleedImage_14uy9_467 ._imageWrapper_14uy9_116 img{height:100%}._fullBleedImage_14uy9_467 ._content_14uy9_31{width:auto;padding:var(--spacing-md)}._image_14uy9_116{min-height:unset}._image_14uy9_116 ._container_14uy9_21{padding:var(--spacing-sm);justify-content:center}._image_14uy9_116 ._imageWrapper_14uy9_116{width:100%;min-height:unset}._image_14uy9_116 ._imageWrapper_14uy9_116 ._imageWrapper_14uy9_116 img{position:relative}.homeGrid ._textOnly_14uy9_241 ._title_14uy9_78{color:#fff}.homeGrid ._textOnly_14uy9_241 ._description_14uy9_101{color:#fff;font-size:var(--font-size-md)}.homeGrid ._fullBleed_14uy9_303{min-height:400px}@media (min-width: 768px){.homeGrid ._fullBleed_14uy9_303{min-height:unset}}.startMetricGrid ._textOnly_14uy9_241{max-width:300px;margin:0 auto}.startMetricGrid ._textOnly_14uy9_241 ._title_14uy9_78{font-size:3rem}.conditionManagementServicesGrid ._imageLeft_14uy9_391{min-height:235px}.conditionManagementServicesGrid ._imageLeft_14uy9_391 ._content_14uy9_31{flex:1}.conditionManagementServicesGrid ._imageLeft_14uy9_391 ._title_14uy9_78{font-size:var(--font-size-xl)}.conditionManagementServicesGrid ._imageLeft_14uy9_391 ._imageWrapper_14uy9_116{flex:.25}@media (max-width: 767px){.conditionManagementServicesGrid ._imageLeft_14uy9_391 ._imageWrapper_14uy9_116{flex:1}}.backgroundPrimary ._eyebrow_14uy9_563,.backgroundPrimary ._title_14uy9_78,.backgroundPrimary ._description_14uy9_101{color:#fff}.backgroundPrimary ._cta_14uy9_575 ._secondary_14uy9_576{background-color:#fff}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";const n=require("react/jsx-runtime"),e=require("../../../react.esm-C_9Ma9mj.cjs"),r=require("./index.cjs");e.vi.mock("./styles.module.css",()=>({default:new Proxy({},{get:(a,o)=>o})}));e.vi.mock("../../hooks/useStyleClasses",()=>({useStyleClasses:()=>"style-classes"}));e.vi.mock("../../context/ThemeContext",()=>({useTheme:()=>({mode:"light"})}));e.vi.mock("../../utils/mediaUtils",()=>({resolveImageUrl:(t,a,o)=>t?`https://cdn.example.com/${o??"medium"}.jpg`:void 0,resolveAltText:(t,a,o)=>t?"Resolved alt text":o??""}));e.vi.mock("../../utils/resolveLinkUrl",()=>({resolveLinkURL:t=>(t==null?void 0:t.href)??"/resolved"}));const{MockTabs:m,MockTabsList:T,MockTabsTrigger:x,MockTabsPanel:u}=e.vi.hoisted(()=>{const t=e.vi.fn(({children:i})=>n.jsx("div",{"data-testid":"tabs-list",children:i})),a=e.vi.fn(({children:i,index:b})=>n.jsx("button",{"data-testid":"tabs-trigger","data-index":b,children:i})),o=e.vi.fn(({children:i,index:b})=>n.jsx("div",{"data-testid":"tabs-panel","data-index":b,children:i}));return{MockTabs:e.vi.fn(({children:i,orientation:b,theme:p})=>n.jsx("div",{"data-testid":"tabs","data-orientation":b,"data-theme":p,children:i})),MockTabsList:t,MockTabsTrigger:a,MockTabsPanel:o}});e.vi.mock("../../../core/components/Tabs",()=>({Tabs:Object.assign(m,{List:T,Trigger:x,Panel:u})}));e.vi.mock("../../../core/components/Button",()=>({Button:({children:t,href:a,target:o,rel:d,"aria-label":i})=>n.jsx("a",{"data-testid":"tab-button",href:a,target:o,rel:d,"aria-label":i,children:t})}));function c(t){return[{_type:"block",_key:"b1",style:"normal",markDefs:[],children:[{_type:"span",_key:"s1",text:t,marks:[]}]}]}const h=({blocks:t,className:a})=>{var o,d,i;return n.jsx("span",{"data-testid":"rich-text",className:a,children:((i=(d=(o=t==null?void 0:t[0])==null?void 0:o.children)==null?void 0:d[0])==null?void 0:i.text)??""})},B=({items:t,alignment:a})=>n.jsx("nav",{"data-testid":"cta","data-alignment":a,children:t.map(o=>n.jsx("a",{children:o.label},o._key))}),g=({src:t,alt:a,fill:o})=>n.jsx("img",{"data-testid":"render-image",src:t,alt:a,"data-fill":o});function l(t,a={}){return{title:t,content:{tabText:c(`${t} body text`),...a}}}function s(t={}){return{heading:{title:c("Tabs Heading")},items:[l("Tab One"),l("Tab Two")],callToAction:{alignment:"left",spacing:"md",mobileOrientation:"column",items:[]},styleOptions:{layout:"default"},renderRichText:h,renderCallToAction:B,...t}}e.beforeEach(()=>{m.mockClear(),T.mockClear(),x.mockClear(),u.mockClear()});e.describe("1. Default layout",()=>{e.it("renders a section with the default class",()=>{var a;const{container:t}=e.render(n.jsx(r.TabsBlock,{...s()}));e.globalExpect((a=t.querySelector("section"))==null?void 0:a.className).toContain("default")}),e.it("renders the tabs element",()=>{e.render(n.jsx(r.TabsBlock,{...s()})),e.globalExpect(e.screen.getByTestId("tabs")).toBeInTheDocument()}),e.it("renders the heading",()=>{e.render(n.jsx(r.TabsBlock,{...s()}));const t=e.screen.getAllByTestId("rich-text");e.globalExpect(t.some(a=>a.textContent==="Tabs Heading")).toBe(!0)}),e.it("does not set data-overlay on the section",()=>{var a;const{container:t}=e.render(n.jsx(r.TabsBlock,{...s()}));e.globalExpect((a=t.querySelector("section"))==null?void 0:a.dataset.overlay).toBeUndefined()})});e.describe("2. Full-bleed layout",()=>{const t={styleOptions:{layout:"full-bleed"}};e.it("renders a section with the fullBleed class",()=>{var o;const{container:a}=e.render(n.jsx(r.TabsBlock,{...s(t)}));e.globalExpect((o=a.querySelector("section"))==null?void 0:o.className).toContain("fullBleed")}),e.it("sets data-overlay=true on the section",()=>{var o;const{container:a}=e.render(n.jsx(r.TabsBlock,{...s(t)}));e.globalExpect((o=a.querySelector("section"))==null?void 0:o.dataset.overlay).toBe("true")}),e.it("renders an overlay div",()=>{const{container:a}=e.render(n.jsx(r.TabsBlock,{...s(t)}));e.globalExpect(a.querySelector(".overlay")).toBeInTheDocument()}),e.it("renders the tabs inside the overlay",()=>{var o;const{container:a}=e.render(n.jsx(r.TabsBlock,{...s(t)}));e.globalExpect((o=a.querySelector(".overlay"))==null?void 0:o.querySelector("[data-testid='tabs']")).toBeInTheDocument()})});e.describe("3. Unknown layout — returns null",()=>{e.it("renders nothing for an unknown layout value",()=>{const{container:t}=e.render(n.jsx(r.TabsBlock,{...s({styleOptions:{layout:"unknown"}})}));e.globalExpect(t.firstChild).toBeNull()})});e.describe("4. Heading area — eyebrow, title, description, disclaimer",()=>{e.it("renders the title",()=>{e.render(n.jsx(r.TabsBlock,{...s()}));const t=e.screen.getAllByTestId("rich-text");e.globalExpect(t.some(a=>a.textContent==="Tabs Heading")).toBe(!0)}),e.it("renders the eyebrow when provided",()=>{e.render(n.jsx(r.TabsBlock,{...s({heading:{title:c("Title"),eyebrow:c("Product")}})}));const t=e.screen.getAllByTestId("rich-text");e.globalExpect(t.some(a=>a.textContent==="Product")).toBe(!0)}),e.it("renders description when provided",()=>{e.render(n.jsx(r.TabsBlock,{...s({heading:{title:c("Title"),description:c("Intro paragraph")}})}));const t=e.screen.getAllByTestId("rich-text");e.globalExpect(t.some(a=>a.textContent==="Intro paragraph")).toBe(!0)}),e.it("renders disclaimer when provided",()=>{e.render(n.jsx(r.TabsBlock,{...s({heading:{title:c("Title"),disclaimer:c("Terms apply")}})}));const t=e.screen.getAllByTestId("rich-text");e.globalExpect(t.some(a=>a.textContent==="Terms apply")).toBe(!0)})});e.describe("5. headingLayout class",()=>{e.it("applies headingVertical by default",()=>{var a;const{container:t}=e.render(n.jsx(r.TabsBlock,{...s()}));e.globalExpect((a=t.querySelector(".heading"))==null?void 0:a.className).toContain("headingVertical")}),e.it("applies headingHorizontal when headingLayout=horizontal",()=>{var a;const{container:t}=e.render(n.jsx(r.TabsBlock,{...s({heading:{title:c("Title"),headingLayout:"horizontal"}})}));e.globalExpect((a=t.querySelector(".heading"))==null?void 0:a.className).toContain("headingHorizontal")})});e.describe("6. Tabs element — triggers and panels per item",()=>{e.it("renders one trigger per item",()=>{e.render(n.jsx(r.TabsBlock,{...s()})),e.globalExpect(e.screen.getAllByTestId("tabs-trigger")).toHaveLength(2)}),e.it("renders each item title as trigger text",()=>{e.render(n.jsx(r.TabsBlock,{...s()}));const t=e.screen.getAllByTestId("tabs-trigger");e.globalExpect(t[0].textContent).toBe("Tab One"),e.globalExpect(t[1].textContent).toBe("Tab Two")}),e.it("renders one panel per item",()=>{e.render(n.jsx(r.TabsBlock,{...s()})),e.globalExpect(e.screen.getAllByTestId("tabs-panel")).toHaveLength(2)})});e.describe("7. Tab panel — tabText, tabImage, tabDisclaimer",()=>{e.it("renders tabText via renderRichText",()=>{e.render(n.jsx(r.TabsBlock,{...s()}));const t=e.screen.getAllByTestId("rich-text");e.globalExpect(t.some(a=>a.textContent==="Tab One body text")).toBe(!0)}),e.it("renders a tab image when tabImage is provided",()=>{e.render(n.jsx(r.TabsBlock,{...s({items:[l("Tab One",{tabImage:{asset:{_ref:"img-abc"}}})],renderImage:g})})),e.globalExpect(e.screen.getByTestId("render-image")).toBeInTheDocument()}),e.it("renders tabDisclaimer when provided",()=>{e.render(n.jsx(r.TabsBlock,{...s({items:[l("Tab One",{tabDisclaimer:c("Tab disclaimer text")})]})}));const t=e.screen.getAllByTestId("rich-text");e.globalExpect(t.some(a=>a.textContent==="Tab disclaimer text")).toBe(!0)}),e.it("does not render image div when tabImage is absent",()=>{const{container:t}=e.render(n.jsx(r.TabsBlock,{...s()}));e.globalExpect(t.querySelector(".tabImage")).toBeNull()})});e.describe("8. Tab CTA link — Button for valid URL; absent for '#' or missing",()=>{e.it("renders a Button when tabLink resolves to a valid URL",()=>{e.render(n.jsx(r.TabsBlock,{...s({items:[l("Tab One",{tabLink:{href:"/learn-more",label:"Learn More"}})]})})),e.globalExpect(e.screen.getByTestId("tab-button")).toBeInTheDocument(),e.globalExpect(e.screen.getByTestId("tab-button").textContent).toBe("Learn More")}),e.it("does not render a Button when tabLink is absent",()=>{e.render(n.jsx(r.TabsBlock,{...s()})),e.globalExpect(e.screen.queryByTestId("tab-button")).toBeNull()}),e.it("does not render a Button when resolved URL is '#'",()=>{e.render(n.jsx(r.TabsBlock,{...s({items:[l("Tab One",{tabLink:{href:"#",label:"Anchor"}})]})})),e.globalExpect(e.screen.queryByTestId("tab-button")).toBeNull()})});e.describe("9. Tab CTA — external links get target=_blank and rel=noopener",()=>{e.it("sets target=_blank for external link type",()=>{e.render(n.jsx(r.TabsBlock,{...s({items:[l("Tab One",{tabLink:{href:"/go",label:"Go",linkOptions:{linkType:"external"}}})]})})),e.globalExpect(e.screen.getByTestId("tab-button").getAttribute("target")).toBe("_blank")}),e.it("sets rel=noopener noreferrer for external links",()=>{e.render(n.jsx(r.TabsBlock,{...s({items:[l("Tab One",{tabLink:{href:"/go",label:"Go",linkOptions:{linkType:"external"}}})]})})),e.globalExpect(e.screen.getByTestId("tab-button").getAttribute("rel")).toBe("noopener noreferrer")}),e.it("sets target=_self for internal links",()=>{e.render(n.jsx(r.TabsBlock,{...s({items:[l("Tab One",{tabLink:{href:"/internal",label:"Internal",linkOptions:{linkType:"internal"}}})]})})),e.globalExpect(e.screen.getByTestId("tab-button").getAttribute("target")).toBe("_self")})});e.describe("10. Tab grid items — GridItems rendered with image and text",()=>{e.it("renders grid item text via renderRichText",()=>{e.render(n.jsx(r.TabsBlock,{...s({items:[l("Tab One",{tabGridItem:[{itemText:c("Grid item text")}]})]})}));const t=e.screen.getAllByTestId("rich-text");e.globalExpect(t.some(a=>a.textContent==="Grid item text")).toBe(!0)}),e.it("renders grid item image via renderImage when provided",()=>{e.render(n.jsx(r.TabsBlock,{...s({items:[l("Tab One",{tabGridItem:[{itemImage:{asset:{_ref:"grid-img"}}}]})],renderImage:g})})),e.globalExpect(e.screen.getByTestId("render-image")).toBeInTheDocument()}),e.it("renders a plain <img> fallback for grid item when renderImage is absent",()=>{const{container:t}=e.render(n.jsx(r.TabsBlock,{...s({items:[l("Tab One",{tabGridItem:[{itemImage:{asset:{_ref:"grid-img"}}}]})],renderImage:void 0})}));e.globalExpect(t.querySelector("img")).toBeInTheDocument()})});e.describe("11. Block-level image",()=>{e.it("renders BlockImage in default layout when image is provided",()=>{e.render(n.jsx(r.TabsBlock,{...s({image:{asset:{_ref:"block-img"}},renderImage:g})})),e.globalExpect(e.screen.getByTestId("render-image")).toBeInTheDocument()}),e.it("does not render a block image when image prop is absent",()=>{const{container:t}=e.render(n.jsx(r.TabsBlock,{...s()}));e.globalExpect(t.querySelector("img")).toBeNull()}),e.it("renders a fill image in full-bleed layout",()=>{e.render(n.jsx(r.TabsBlock,{...s({image:{asset:{_ref:"bg-img"}},styleOptions:{layout:"full-bleed"},renderImage:g})})),e.globalExpect(e.screen.getByTestId("render-image").dataset.fill).toBe("true")})});e.describe("12. renderImage — plain <img> fallback when renderImage not provided",()=>{e.it("renders a plain <img> for tab image when renderImage is absent",()=>{var a;const{container:t}=e.render(n.jsx(r.TabsBlock,{...s({items:[l("Tab One",{tabImage:{asset:{_ref:"tab-img"}}})],renderImage:void 0})}));e.globalExpect(t.querySelector("img")).toBeInTheDocument(),e.globalExpect((a=t.querySelector("img"))==null?void 0:a.getAttribute("src")).toContain("cdn.example.com")})});e.describe("13. renderCallToAction — called with correct props",()=>{e.it("renders CTA via renderCallToAction when items are present",()=>{e.render(n.jsx(r.TabsBlock,{...s({callToAction:{alignment:"center",spacing:"lg",mobileOrientation:"row",items:[{_key:"l1",href:"/go",label:"Go"}]}})})),e.globalExpect(e.screen.getByTestId("cta")).toBeInTheDocument()}),e.it("passes alignment to renderCallToAction",()=>{e.render(n.jsx(r.TabsBlock,{...s({callToAction:{alignment:"right",spacing:"sm",mobileOrientation:"column",items:[{_key:"l1",href:"/x",label:"X"}]}})})),e.globalExpect(e.screen.getByTestId("cta").dataset.alignment).toBe("right")})});e.describe("14. Orientation — forwarded to Tabs",()=>{e.it("passes horizontal orientation by default",()=>{e.render(n.jsx(r.TabsBlock,{...s()})),e.globalExpect(e.screen.getByTestId("tabs").dataset.orientation).toBe("horizontal")}),e.it("passes vertical orientation when styleOptions.orientation=orientationVertical",()=>{e.render(n.jsx(r.TabsBlock,{...s({styleOptions:{layout:"default",orientation:"orientationVertical"}})})),e.globalExpect(e.screen.getByTestId("tabs").dataset.orientation).toBe("vertical")})});e.describe("15. Theme — resolved from styleOptions.theme and forwarded to Tabs",()=>{e.it("passes default theme by default",()=>{e.render(n.jsx(r.TabsBlock,{...s()})),e.globalExpect(e.screen.getByTestId("tabs").dataset.theme).toBe("default")}),e.it("passes dark theme when styleOptions.theme=themeDark",()=>{e.render(n.jsx(r.TabsBlock,{...s({styleOptions:{layout:"default",theme:"themeDark"}})})),e.globalExpect(e.screen.getByTestId("tabs").dataset.theme).toBe("dark")}),e.it("passes light theme when styleOptions.theme=themeLight",()=>{e.render(n.jsx(r.TabsBlock,{...s({styleOptions:{layout:"default",theme:"themeLight"}})})),e.globalExpect(e.screen.getByTestId("tabs").dataset.theme).toBe("light")})});
|
|
1
|
+
"use strict";const s=require("react/jsx-runtime"),e=require("../../../react.esm-C_9Ma9mj.cjs"),r=require("./index.cjs");e.vi.mock("./styles.module.css",()=>({default:new Proxy({},{get:(a,l)=>l})}));e.vi.mock("../../hooks/useStyleClasses",()=>({useStyleClasses:e.vi.fn(t=>t!=null&&t.tabClass?`tab-style-${t.tabClass}`:"block-style-classes")}));e.vi.mock("../../context/ThemeContext",()=>({useTheme:()=>({mode:"light",mounted:!0,toggleTheme:e.vi.fn(),setTheme:e.vi.fn()})}));let d=!1;e.vi.mock("../../hooks/useMediaQuery",()=>({useMediaQuery:()=>d}));const m=e.vi.fn((t,a)=>({objectFit:"contain"}));e.vi.mock("../../utils/mediaUtils",()=>({resolveImageUrl:(t,a,l)=>t?`https://cdn.example.com/${l??"medium"}.jpg`:void 0,resolveAltText:()=>"Alt text",resolveImageStyle:(t,a)=>m(t,a)}));e.vi.mock("../../utils/resolveLinkUrl",()=>({resolveLinkURL:t=>(t==null?void 0:t.href)??"/resolved"}));const{MockTabs:u,MockTabsList:p,MockTabsTrigger:T,MockTabsPanel:y}=e.vi.hoisted(()=>{const t=e.vi.fn(({children:n})=>s.jsx("div",{"data-testid":"tabs-list",children:n})),a=e.vi.fn(({children:n,index:g})=>s.jsx("button",{"data-testid":"tabs-trigger","data-index":g,children:n})),l=e.vi.fn(({children:n,index:g})=>s.jsx("div",{"data-testid":"tabs-panel","data-index":g,children:n})),i=e.vi.fn(({children:n})=>s.jsx("div",{"data-testid":"tabs",children:n}));return i.List=t,i.Trigger=a,i.Panel=l,{MockTabs:i,MockTabsList:t,MockTabsTrigger:a,MockTabsPanel:l}});e.vi.mock("../../../core/components/Tabs",()=>({Tabs:new Proxy(u,{get:(t,a)=>a==="List"?p:a==="Trigger"?T:a==="Panel"?y:t[a]})}));e.vi.mock("../../../core/components/Button",()=>({Button:({children:t})=>s.jsx("button",{children:t})}));function x(t){return[{_type:"block",_key:"b1",style:"normal",markDefs:[],children:[{_type:"span",_key:"s1",text:t,marks:[]}]}]}const k=({blocks:t,className:a})=>{var l,i,n;return s.jsx("span",{"data-testid":"rich-text",className:a,children:((n=(i=(l=t==null?void 0:t[0])==null?void 0:l.children)==null?void 0:i[0])==null?void 0:n.text)??""})},b={asset:{_ref:"image-abc"}};function o(t,a={}){return{title:t,content:{tabText:x(`${t} body`),...a}}}function c(t={}){return{heading:{title:x("Heading")},items:[o("Tab One")],callToAction:{alignment:"left",spacing:"md",mobileOrientation:"column",items:[]},styleOptions:{layout:"default"},renderRichText:k,...t}}e.beforeEach(()=>{d=!1,m.mockReturnValue({objectFit:"contain"}),u.mockClear(),y.mockClear()});e.describe("1. tabStyleOptions — useStyleClasses result applied to tabContent div",()=>{e.it("applies the tab style class to the tabContent wrapper",()=>{e.render(s.jsx(r.TabsBlock,{...c({items:[o("Tab One",{tabStyleOptions:{tabClass:"fancy"}})]})}));const a=e.screen.getAllByTestId("tabs-panel")[0].querySelector(".tabContent");e.globalExpect(a==null?void 0:a.className).toContain("tab-style-fancy")}),e.it("applies tab style classes from multiple tabs independently",()=>{var a,l;e.render(s.jsx(r.TabsBlock,{...c({items:[o("Tab One",{tabStyleOptions:{tabClass:"alpha"}}),o("Tab Two",{tabStyleOptions:{tabClass:"beta"}})]})}));const t=e.screen.getAllByTestId("tabs-panel");e.globalExpect((a=t[0].querySelector(".tabContent"))==null?void 0:a.className).toContain("tab-style-alpha"),e.globalExpect((l=t[1].querySelector(".tabContent"))==null?void 0:l.className).toContain("tab-style-beta")})});e.describe("2. imageStyle — resolveImageStyle result forwarded to renderImage",()=>{e.it("passes the imageStyle to renderImage for a tab image",()=>{m.mockReturnValue({objectFit:"cover",width:"100%"});const t=e.vi.fn(({style:a})=>s.jsx("img",{"data-testid":"render-image",style:a,src:"x",alt:"x"}));e.render(s.jsx(r.TabsBlock,{...c({items:[o("Tab One",{tabImage:b})],renderImage:t})})),e.globalExpect(t).toHaveBeenCalledWith(e.globalExpect.objectContaining({style:e.globalExpect.objectContaining({objectFit:"cover"})}))})});e.describe("3. imageStyle — applied to plain <img> fallback style",()=>{e.it("merges imageStyle into the fallback <img> style",()=>{m.mockReturnValue({borderRadius:"8px"});const{container:t}=e.render(s.jsx(r.TabsBlock,{...c({items:[o("Tab One",{tabImage:b})],renderImage:void 0})})),a=t.querySelector(".tabImage img");e.globalExpect(a).toBeInTheDocument(),e.globalExpect(a.style.borderRadius).toBe("8px")})});e.describe("4. isMobile — resolveImageStyle called with isMobile flag",()=>{e.it("calls resolveImageStyle with isMobile=false on desktop",()=>{d=!1,e.render(s.jsx(r.TabsBlock,{...c({image:b,items:[o("Tab One",{tabImage:b})]})})),e.globalExpect(m).toHaveBeenCalledWith(e.globalExpect.anything(),!1)}),e.it("calls resolveImageStyle with isMobile=true on mobile",()=>{d=!0,e.render(s.jsx(r.TabsBlock,{...c({image:b,items:[o("Tab One",{tabImage:b})]})})),e.globalExpect(m).toHaveBeenCalledWith(e.globalExpect.anything(),!0)})});e.describe("5. tabStyleOptions absent — no extra class on tabContent when omitted",()=>{e.it("renders tabContent with undefined tabStyles when tabStyleOptions not provided",()=>{e.render(s.jsx(r.TabsBlock,{...c()}));const a=e.screen.getAllByTestId("tabs-panel")[0].querySelector(".tabContent");e.globalExpect(a==null?void 0:a.className).not.toContain("tab-style-")})});
|