# b-blocks/2.0.41/build/toggle-content/view.js

bBlocks – Essential Gutenberg Blocks & Patterns Collection, version 2.0.41. 1 lines.

- Page: https://pluginprobe.com/plugins/b-blocks/2.0.41/code/build/toggle-content/view.js
- Raw: https://pluginprobe.com/plugins/b-blocks/2.0.41/raw/build/toggle-content/view.js
- Modified: 2026-05-16T11:49:36+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/b-blocks/2.0.41/code/build/toggle-content/view.js#L10-L20`.

```javascript
(()=>{"use strict";const t="@media only screen and (max-width: 1024px)",n="@media only screen and (max-width: 640px)",e="linear-gradient(135deg, #0040E3, #18D4FD)";window.React;const o=(t,n,e=!1)=>{return null==(o=n)||""===o||Array.isArray(o)&&0===o.length||"object"==typeof o&&0===Object.keys(o).length||"string"==typeof o&&""===o.trim()||"number"==typeof o&&0===o?"":`${t}: ${n}${e?" !important":""};`;var o},r=(t,n=!0,r=!0,a=!0)=>{const{type:i="solid",color:l="",gradient:s=e,image:c={},position:g="center center",attachment:d="",repeat:$="no-repeat",size:b="",overlayColor:p=""}=t||{};return"gradient"===i&&r?o("background",s):"image"===i&&a?`background: url(${c?.url});\n\t\t\t\t${o("background-color",p)}\n\t\t\t\t${o("background-position",g)}\n\t\t\t\t${o("background-size",b)}\n\t\t\t\t${o("background-repeat",$)}\n\t\t\t\t${o("background-attachment",d)}\n\t\t\t\t${o("background-repeat",$)}\n\t\t\t\tbackground-blend-mode: overlay;`:n&&o("background",l)},a=t=>{if(!t)return"";const n=t=>{const{color:n="#000000",style:e="solid",width:o="0px"}=t;return`${o} ${e} ${n}`};return"object"!=typeof t||Array.isArray(t)?"":t.hasOwnProperty("top")||t.hasOwnProperty("right")||t.hasOwnProperty("bottom")||t.hasOwnProperty("left")?["top","right","bottom","left"].map((e=>t[e]?`border-${e}: ${n(t[e])};`:"")).join(" ").trim():o("border",n(t))},i=(e,r,a=!0)=>{const{fontFamily:i="Default",fontCategory:l="sans-serif",fontVariant:s=400,fontWeight:c,isUploadFont:g=!0,fontSize:d={desktop:null,tablet:null,mobile:null},fontStyle:$,textTransform:b,textDecoration:p,lineHeight:h,letterSpace:u}=r||{},m=!a||!i||"Default"===i,y=d?.desktop||d,k=d?.tablet||y,f=d?.mobile||k,v=t=>{const n=String(t);return["px","em","rem","%","vh","vw"].some((t=>n.endsWith(t)))?n:"number"==typeof t?`${n}px`:""},w=`\n\t\t${m?"":`font-family: '${i}', ${l};`}\n\t\t${o("font-weight",c)}\n\t\t${o("font-size",v(y))}\n\t\t${o("font-style",$)}\n\t\t${o("text-transform",b)}\n\t\t${o("text-decoration",p)}\n\t\t${o("line-height",h)}\n\t\t${o("letter-spacing",u)}\n\t`,_=s&&400!==s?"400i"===s?":ital@1":s?.includes("00i")?`: ital, wght@1, ${s?.replace("00i","00")} `:`: wght@${s} `:"",L=m?"":`https://fonts.googleapis.com/css2?family=${i?.split(" ").join("+")}${_.replace(/ /g,"")}&display=swap`;return{googleFontLink:!g||m?"":`@import url(${L});`,styles:`${e}{\n\t\t\t${w}\n\t\t}\n\t\t${t} {\n\t\t\t${e}{\n\t\t\t\t${o("font-size",v(k))}\n\t\t\t}\n\t\t}\n\t\t${n} {\n\t\t\t${e}{\n\t\t\t\t${o("font-size",v(f))}\n\t\t\t}\n\t\t}`.replace(/\s+/g," ").trim()}},l=t=>{if(!t)return"";if("string"==typeof t)return t;if("object"==typeof t&&!Array.isArray(t)){const n=["top","right","bottom","left"];return n.map((n=>t[n]||"")).every((t=>!t))?"":n.map((n=>t[n]||"0")).join(" ")}return""};document.addEventListener("DOMContentLoaded",(()=>{document.querySelectorAll(".wp-block-b-blocks-toggle-content").forEach((e=>{let s={};try{s=JSON.parse(e.dataset.attributes||"{}")}catch(t){s={}}const c=document.createElement("style");c.innerHTML=((e,s)=>{const{styles:c}=e,{toggle:g,header:d,label:$}=c,b=`#${s}`,p=`${b} .b-blocks-toggle-content__wrapper .b-blocks-toggle-content__head`,h=`${p} .b-blocks-toggle-content-switch__wrapper`,u=`${h} .b-blocks-toggle-content__switch`,m=`${b} .is-b .b-blocks-toggle-content__switch`,y=`${b} .is-a .b-blocks-toggle-content__switch`,k=`${u} .b-blocks-toggle-content__knob`,f=`${b} .is-b .b-blocks-toggle-content__knob`,v=`${b} .is-a .b-blocks-toggle-content__knob`,w=`${h} .b-blocks-toggle-content__label`;return`\n\t\t${i("",$.typo).googleFontLink}\n\t\t${i(w,$.typo).styles}\n\n\t\t${p}{\n\t\t\t${o("justify-content",g?.desktop?.align)}\n\t\t\t${o("margin-bottom",d?.desktop?.headingGap)}\n\t\t\t${o("padding",l(d?.desktop?.padding))}\n\t\t\t${r(d.normal.bg)}\n\t\t\t${a(d.normal.border)}\n\t\t\t${o("border-radius",l(d.normal.desktop.radius))}\n\t\t}\n\n\t\t${p}:hover{\n\t\t\t${r(d.hover.bg)}\n\t\t\t${a(d.hover.border)}\n\t\t\t${o("border-radius",l(d.hover.desktop.radius))}\n\t\t}\n\n\t\t${h}{\n\t\t\t${o("flex-direction",g?.direction)}\n\t\t\t${o("gap",$?.desktop?.gap)}\n\t\t}\n\n\t\t${u}{\n\t\t\t${o("width",g.width)}\n\t\t\t${o("height",g.height)}\n\t\t}\n\n\t\t${m}{\n\t\t\t${r(g.active.bg)}\n\t\t}\n\n\t\t${y}{\n\t\t\t${r(g.inactive.bg)}\n\t\t}\n\n\t\t${k}{\n\t\t\t${o("width",g.height?`calc(${g.height} - 6px)`:"")}\n\t\t\t${o("height",g.height?`calc(${g.height} - 6px)`:"")}\n\t\t\t\n\t\t}\n\t\t${f}{\n\t\t\t${o("transform",g.width?`translateX(calc(${g.width?g.width:"60px"} - ${g.height?g.height:"30px"}))`:"")}\n\t\t\t${r(g.active.color)}\n\t\t}\n\t\t${v}{\n\t\t\t${r(g.inactive.color)}\n\t\t}\n\n\t\t${w}.b-blocks-toggle-content__label--left {\n\t\t\t${o("color",$.inactive.first.color)}\n\t\t}\n\n\t\t${w}.b-blocks-toggle-content__label--right{\n\t\t\t${o("color",$.inactive.second.color)}\n\t\t}\n\t\t${w}.b-blocks-toggle-content__label--left.is-active {\n\t\t\t${o("color",$.active.first.color)}\n\t\t}\n\n\t\t${w}.b-blocks-toggle-content__label--right.is-active{\n\t\t\t${o("color",$.active.second.color)}\n\t\t}\n\n\t\t${t}{\n\t\t\t${p}{\n\t\t\t\t${o("justify-content",g?.tablet?.align)}\n\t\t\t\t${o("margin-bottom",d?.tablet?.headingGap)}\n\t\t\t\t${o("padding",l(d?.tablet?.padding))}\n\t\t\t\t${o("border-radius",l(d.normal.tablet.radius))}\n\t\t\t}\n\n\t\t\t${p}:hover{\n\t\t\t\t${o("border-radius",l(d.hover.tablet.radius))}\n\t\t\t}\n\n\t\t\t${h}{\n\t\t\t\t${o("gap",$?.tablet?.gap)}\n\t\t\t}\n\t\t}\n\t\t${n}{\n\t\t\t${p}{\n\t\t\t\t${o("justify-content",g?.mobile?.align)}\n\t\t\t\t${o("margin-bottom",d?.mobile?.headingGap)}\n\t\t\t\t${o("padding",l(d?.mobile?.padding))}\n\t\t\t\t${o("border-radius",l(d.normal.mobile.radius))}\n\t\t\t}\n\n\t\t\t${p}:hover{\n\t\t\t\t${o("border-radius",l(d.hover.mobile.radius))}\n\t\t\t}\n\n\t\t\t${h}{\n\t\t\t\t${o("gap",$?.mobile?.gap)}\n\t\t\t}\n\t\t}\n\n\t`})(s,e.id),e.prepend(c),e.removeAttribute("data-attributes");const g=e.querySelector(".b-blocks-toggle-content__wrapper");if(!g)return;const d=e.querySelector("[data-toggle-switch]"),$=e.querySelector('[data-toggle-target="a"]'),b=e.querySelector('[data-toggle-target="b"]');let p=g.classList.contains("is-a");g.classList.contains("is-a")||g.classList.contains("is-b")||(g.classList.add("is-a"),p=!0);const h=t=>{p=!!t,g.classList.toggle("is-a",p),g.classList.toggle("is-b",!p),d&&d.classList.toggle("is-b",!p),$&&$.classList.toggle("is-active",!p),b&&b.classList.toggle("is-active",!p)},u=()=>h(!p);d&&(d.addEventListener("click",(t=>{t.preventDefault(),u()})),d.addEventListener("keydown",(t=>{"Enter"!==t.key&&" "!==t.key||(t.preventDefault(),u())}))),$&&($.addEventListener("click",(t=>{t.preventDefault(),h(!0)})),$.addEventListener("keydown",(t=>{"Enter"!==t.key&&" "!==t.key||(t.preventDefault(),h(!0))}))),b&&(b.addEventListener("click",(t=>{t.preventDefault(),h(!1)})),b.addEventListener("keydown",(t=>{"Enter"!==t.key&&" "!==t.key||(t.preventDefault(),h(!1))}))),h(p)}))}))})();
```