@storyblok/js 6.3.0 → 6.3.2

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.
@@ -1,216 +0,0 @@
1
- /**
2
- * name: @storyblok/js
3
- * (c) 2026
4
- * description: SDK to integrate Storyblok into your project using JavaScript.
5
- * author: undefined
6
- */
7
- (function(a,m){typeof exports=="object"&&typeof module<"u"?m(exports,require("storyblok-js-client"),require("@storyblok/richtext")):typeof define=="function"&&define.amd?define(["exports","storyblok-js-client","@storyblok/richtext"],m):(a=typeof globalThis<"u"?globalThis:a||self,m(a.storyblok={},a.StoryblokClient,a.StoryblokRichtext))})(this,(function(a,m,E){"use strict";let v=!1,p;const _=[],M=()=>typeof window>"u"?Promise.reject(new Error("Cannot load Storyblok bridge: window is undefined (server-side environment)")):(window.storyblokRegisterEvent=o=>{if(!window.location.search.includes("_storyblok")){console.warn("You are not in Draft Mode or in the Visual Editor.");return}v?o():_.push(o)},v?Promise.resolve():p||(p=Promise.resolve().then(()=>ae).then(({default:o})=>{window.StoryblokBridge=o,_.forEach(e=>e()),v=!0}).catch(o=>{throw p=void 0,o}),p)),L=(o={})=>{const{apiOptions:e}=o;if(!e||!e.accessToken){console.error("You need to provide an access token to interact with Storyblok API. Read https://www.storyblok.com/docs/api/content-delivery#topics/authentication");return}return{storyblokApi:new m(e)}},P=o=>{if(typeof o!="object"||typeof o._editable!="string")return{};try{const e=JSON.parse(o._editable.replace(/^<!--#storyblok#/,"").replace(/-->$/,""));return e?{"data-blok-c":JSON.stringify(e),"data-blok-uid":`${e.id}-${e.uid}`}:{}}catch{return{}}};function R(o){const{language:e,resolveRelations:t,...n}=o;return e&&console.warn("[Storyblok] The `language` bridge option is no longer supported by the bundled bridge. Language context is now passed automatically by the Visual Editor via the `_storyblok_lang` URL parameter."),{...n,...t!==void 0&&{resolveRelations:Array.isArray(t)?t:[t]}}}const w=(o,e,t={})=>{var l;const i=!(typeof window>"u")&&typeof window.storyblokRegisterEvent<"u",r=new URL((l=window.location)==null?void 0:l.href).searchParams.get("_storyblok"),h=r!==null&&+r===o;if(!(!i||!h)){if(!o){console.warn("Story ID is not defined. Please provide a valid ID.");return}window.storyblokRegisterEvent(()=>{new window.StoryblokBridge(R(t)).on(["input","published","change"],d=>{var g;d&&(d.action==="input"&&((g=d.story)==null?void 0:g.id)===o?e(d.story):(d.action==="change"||d.action==="published")&&d.storyId===o&&window.location.reload())})})}},U=(o={})=>{var g,$;const{bridge:e,accessToken:t,use:n=[],apiOptions:i={},bridgeUrl:r}=o;r&&console.warn("[Storyblok] The `bridgeUrl` option is deprecated and will be removed in a future major version. The Storyblok bridge is now bundled and is no longer loaded from a CDN URL."),i.accessToken=i.accessToken||t;const h={bridge:e,apiOptions:i};let l={};n.forEach(le=>{l={...l,...le(h)}});const d=!(typeof window>"u")&&(($=(g=window.location)==null?void 0:g.search)==null?void 0:$.includes("_storyblok_tk"));return e!==!1&&d&&M(),l},H=()=>M(),D=(o,e)=>{for(;o&&o.nodeType===1;){if(o.hasAttribute(e))return o;o=o.parentNode}return null},A=o=>{const e=D(o,"data-blok-c");if(!e)return null;const t=e.getAttribute("data-blok-c");return JSON.parse(t)},F=(o,e)=>o.contains(e),u=o=>document.querySelector(`[data-blok-uid="${o}"]`),S=o=>{const e=o.getBoundingClientRect();return e.top<0&&e.top+e.height>=0||e.top>=0&&e.top<=(window.innerHeight||document.documentElement.clientHeight)},j=o=>{let e={};try{const t=o.replace(/\\/g,"");e=JSON.parse(t)}catch{console.error("Error parsing json",o)}return e},V=o=>{const e=[],t=()=>NodeFilter.FILTER_ACCEPT,n=document.createNodeIterator(o,NodeFilter.SHOW_COMMENT,t,!1);let i={};for(;i=n.nextNode();)if(i.nodeValue.indexOf("#storyblok#")>-1){const r=i.nodeValue.replace("#storyblok#",""),h=i.nextElementSibling||i.nextSibling,l=j(r);l&&e.push({options:l,el:h})}return e},I=o=>{let e="";return location.search.substr(1).split("&").forEach(t=>{const n=t.split("=");n[0]===o&&(e=decodeURIComponent(n[1]))}),e},z=(o,e,t)=>typeof o!="string"?"":o.toString().replace(/([A-Z])/g," $1").trim().toLowerCase().replace(/[_-]/g," ").replace(/(?:^|\s)\S/g,function(n,i){return n.toUpperCase()}),O=o=>o&&o.display_name?o.display_name:z(o.name),N=o=>{const e=document.createElementNS("http://www.w3.org/2000/svg","svg");e.setAttribute("viewBox",o.viewBox),e.setAttribute("class",o.svgClass);const t=document.createElementNS(e.namespaceURI,"path");return t.setAttribute("d",o.path),t.setAttribute("fill",o.pathFill),t.setAttribute("transform",o.pathTransform?o.pathTransform:"translate(0 0)"),e.appendChild(t),e},q=o=>o,Y=q,T=Y`
8
- @keyframes smoke {
9
- from {
10
- background-color: rgba(89, 197, 198, 0);
11
- }
12
- to {
13
- background-color: rgba(89, 197, 198, 0.5);
14
- }
15
- }
16
-
17
- .storyblok--outlined .storyblok__outline,
18
- .storyblok--outlined [data-blok-c] {
19
- outline: 1px dashed rgba(182, 186, 191, 0.5);
20
- }
21
-
22
- .storyblok--outlined .storyblok__outline[data-blok-focused='true'],
23
- .storyblok--outlined [data-blok-c][data-blok-focused='true'] {
24
- outline: 0;
25
- }
26
-
27
- .storyblok__hint {
28
- box-sizing: border-box;
29
- outline: 1px solid #05807f;
30
- pointer-events: none;
31
- position: absolute;
32
- transition: opacity 0.2s ease;
33
- z-index: 16777272;
34
- }
35
-
36
- .storyblok__highlight {
37
- background: rgba(89, 197, 198, 0.2);
38
- outline: 1px solid #05807f;
39
- pointer-events: none;
40
- position: absolute;
41
- transition: opacity 0.2s ease;
42
- z-index: 16777270;
43
- }
44
-
45
- .storyblok__overlay {
46
- box-shadow: 0 0 8px 2px rgba(34, 42, 69, 0.07);
47
- box-sizing: border-box;
48
- outline: 1px solid #05807f;
49
- pointer-events: none;
50
- position: absolute;
51
- z-index: 16777273;
52
- }
53
-
54
- .storyblok__overlay-menu {
55
- background-color: #05807f;
56
- border-radius: 5px;
57
- display: inline-flex;
58
- font-family:
59
- -apple-system, blinkmacsystemfont, 'Segoe UI', roboto, helvetica, arial,
60
- sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
61
- height: 30px;
62
- left: -1px;
63
- pointer-events: auto;
64
- position: absolute;
65
- top: -40px;
66
- }
67
-
68
- .storyblok__overlay-menu--simple .storyblok__overlay-menu-btn {
69
- border-bottom-right-radius: 5px;
70
- border-top-right-radius: 5px;
71
- }
72
-
73
- .storyblok__overlay-menu-label {
74
- color: #fff;
75
- font-size: 14px;
76
- line-height: 30px;
77
- margin-right: 20px;
78
- max-width: 200px;
79
- overflow-x: hidden;
80
- text-overflow: ellipsis;
81
- white-space: nowrap;
82
- }
83
-
84
- .storyblok__overlay-menu-label:first-child {
85
- margin-left: 20px;
86
- }
87
-
88
- .storyblok__overlay-menu-btn {
89
- align-items: center;
90
- background-color: transparent;
91
- border: 0;
92
- display: flex;
93
- justify-content: center;
94
- outline: none;
95
- padding: 0;
96
- }
97
-
98
- .storyblok__overlay-menu-btn:hover {
99
- background-color: #0d5454;
100
- }
101
-
102
- .storyblok__overlay-menu-btn-action {
103
- border-bottom-right-radius: 5px;
104
- border-left: 1px solid #fff;
105
- border-top-right-radius: 5px;
106
- height: inherit;
107
- margin: auto;
108
- margin-right: 0;
109
- }
110
-
111
- .storyblok__overlay-menu-btn-parent {
112
- border-bottom-left-radius: 5px;
113
- border-top-left-radius: 5px;
114
- cursor: pointer;
115
- margin: 0;
116
- width: auto;
117
- }
118
-
119
- .storyblok__overlay-menu-svg {
120
- box-sizing: border-box;
121
- cursor: pointer;
122
- height: 24px;
123
- margin: 0 3px;
124
- width: 24px;
125
- }
126
-
127
- .storyblok__overlay--bottom .storyblok__overlay-menu {
128
- bottom: -40px;
129
- top: auto;
130
- }
131
-
132
- .storyblok__overlay--clicked {
133
- animation-duration: 0.2s;
134
- animation-iteration-count: 1;
135
- animation-name: smoke;
136
- }
137
-
138
- .storyblok__actions-menu,
139
- .storyblok__breadcrumbs-menu {
140
- background-color: #fff;
141
- border: 1px solid #dfe3e8;
142
- border-radius: 5px;
143
- box-shadow: 0 2px 17px 3px rgba(34, 42, 69, 0.07);
144
- box-sizing: content-box;
145
- display: none;
146
- height: fit-content;
147
- min-width: 156px;
148
- overflow: hidden;
149
- padding: 11px 0;
150
- position: absolute;
151
- top: 25px;
152
- z-index: 2;
153
- }
154
-
155
- .storyblok__actions-menu hr,
156
- .storyblok__breadcrumbs-menu hr {
157
- background-color: #dfe3e8;
158
- border: 0;
159
- height: 1px;
160
- margin: 11px 0 11px 20px;
161
- }
162
-
163
- .storyblok__actions-menu__menu-item,
164
- .storyblok__breadcrumbs-menu__menu-item {
165
- align-items: center;
166
- appearance: none;
167
- background: #fff;
168
- border: 0;
169
- color: #1b243f;
170
- cursor: pointer;
171
- display: flex;
172
- font-family:
173
- -apple-system, blinkmacsystemfont, 'Segoe UI', roboto, helvetica, arial,
174
- sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
175
- font-size: 14px;
176
- padding: 8px 20px;
177
- text-align: left;
178
- width: 100%;
179
- }
180
-
181
- .storyblok__actions-menu__menu-item--delete,
182
- .storyblok__breadcrumbs-menu__menu-item--delete {
183
- color: #c11c14;
184
- margin-bottom: 0;
185
- }
186
-
187
- .storyblok__actions-menu__menu-item--selected,
188
- .storyblok__breadcrumbs-menu__menu-item--selected {
189
- color: #05807f;
190
- cursor: default;
191
- margin-bottom: 0;
192
- }
193
-
194
- .storyblok__actions-menu__menu-item--selected:hover,
195
- .storyblok__breadcrumbs-menu__menu-item--selected:hover {
196
- background: transparent;
197
- }
198
-
199
- .storyblok__actions-menu__menu-item:hover,
200
- .storyblok__breadcrumbs-menu__menu-item:hover {
201
- background: #eff1f3;
202
- }
203
-
204
- .storyblok__actions-menu__menu-item:focus,
205
- .storyblok__breadcrumbs-menu__menu-item:focus {
206
- outline: none;
207
- }
208
-
209
- .storyblok__actions-menu {
210
- left: calc(100% - 20px);
211
- }
212
-
213
- .storyblok__breadcrumbs-menu {
214
- left: -10px;
215
- }
216
- `,s={OUTLINE:"storyblok--outlined",STYLESHEET:"storyblok-bridge-stylesheet",HINT:"storyblok__hint",HIGHLIGHTER:"storyblok__highlight",OVERLAY:"storyblok__overlay",COMPONENT_BASE:"storyblok__overlay-menu",ACTIONS_MENU:"storyblok__actions-menu",BREADCRUMBS_MENU:"storyblok__breadcrumbs-menu"};class G{constructor(e){this.appVersion="v1",this.inEditor=!0,this.initialized=!1,this.currentUid=null,this.storyId="",this.componentNames={},this.outlineOnMoveInterval=null,this.calcInterval=null,this.canAddBlocks=!1,this.canMoveForward=!1,this.canMoveBackward=!1,this.canDeleteBlocks=!1,this.navigationBreadcrumbs=[],this.focusState=!1,this.actionsEnabled=!1,this.hinter=null,this.highlighter=null,this.overlay=null,this.componentBase=null,this.componentLabel=null,this.breadcrumbsButtonMenu=null,this.breadcrumbsMenu=null,this.actionsMenu=null,this.actionsMenuButton=null,this.actionsMenuItems=null,this.events={input:[],change:[],published:[],unpublished:[],viewLiveVersion:[],enterEditmode:[],enterComponent:[],hoverComponent:[],highlightComponent:[],customEvent:[],pingBack:[],sessionReceived:[],editedBlok:[],deselectBlok:[],addedBlock:[],deletedBlock:[],movedBlock:[],duplicatedBlock:[]};const t={customParent:null,resolveRelations:null,resolveLinks:null,preventClicks:!1,initOnlyOnce:!0,fallbackLang:null};this.config={...t,...e},this.init()}get isInIframe(){return window.top!==window.self}get csProtocol(){let e=location.protocol.replace(":","");return e!=="http"&&e!=="https"&&(e="https"),e}get targetOrigin(){return this.config.customParent?this.config.customParent:I("_storyblok_env")==="stage"?`${this.csProtocol}://app-beta.storyblok.com`:`${this.csProtocol}://app.storyblok.com`}get lastBreadcrumbItem(){return this.navigationBreadcrumbs[this.navigationBreadcrumbs.length-1]||{}}isInEditor(){return this.inEditor}init(){if(document.body===null){console.error("Body tag not found. Please install the Storyblok bridge script inside the body tag");return}this.config.initOnlyOnce&&document.querySelectorAll(`.${s.HINT}`).length>0||this.isInIframe&&(this.resetAllEvents(),this.addMessageListener(),this.outlineOnMove(),this.buildBridgeStyles(),this.on("enterEditmode",this.enterEditmode),this.isInIframe&&this.sendDataToEditor({action:"initialized",config:this.config}),this.initialized=!0)}keyPress(e,t){(t.key==="z"&&t.metaKey||t.key==="z"&&t.ctrlKey)&&(t.preventDefault(),t.stopImmediatePropagation(),e.sendDataToEditor({action:"undo"})),(t.key==="y"&&t.metaKey||t.key==="y"&&t.ctrlKey)&&(t.preventDefault(),t.stopImmediatePropagation(),e.sendDataToEditor({action:"redo"}))}sendDataToEditor(e){window.parent.postMessage(e,this.targetOrigin)}buildBridgeStyles(){document.getElementById(s.STYLESHEET)?(this.hinter=document.querySelector(`.${s.HINT}`),this.highlighter=document.querySelector(`.${s.HIGHLIGHTER}`),this.overlay=document.querySelector(`.${s.OVERLAY}`),this.componentBase=document.querySelector(`.${s.COMPONENT_BASE}`),this.breadcrumbsButtonMenu=document.querySelector(`.${s.COMPONENT_BASE}-btn-parent`),this.breadcrumbsMenu=document.querySelector(`.${s.BREADCRUMBS_MENU}`),this.actionsMenuButton=document.querySelector(`.${s.COMPONENT_BASE}-btn-action`),this.actionsMenu=document.querySelector(`.${s.ACTIONS_MENU}`),this.componentLabel=document.querySelector(`.${s.COMPONENT_BASE} > .${s.COMPONENT_BASE}-label`),this.createActionsMenuItems()):(this.createBridgeStylesheet(),this.createHinter(),this.createHighlighter(),this.createOverlay(),this.createComponentContext())}createBridgeStylesheet(){const e=document.createElement("style");e.setAttribute("type","text/css"),e.id=s.STYLESHEET,"textContent"in e?e.textContent=T:e.styleSheet.cssText=T,document.getElementsByTagName("head")[0].appendChild(e)}createHinter(){this.hinter=document.createElement("div"),this.hinter.className=s.HINT,this.hideElement(this.hinter),document.body.appendChild(this.hinter)}createHighlighter(){this.highlighter=document.createElement("div"),this.highlighter.style.opacity=0,this.hideElement(this.highlighter),document.body.appendChild(this.highlighter)}createOverlay(){this.overlay=document.createElement("div"),this.overlay.setAttribute("class",s.OVERLAY),this.overlay.setAttribute("id",s.OVERLAY),this.hideElement(this.overlay),document.body.appendChild(this.overlay)}calculateElementPosition(e,t){if(!t){this.hideElement(e);return}const n=u(t);if(n){const{left:i,top:r}=this.getElementOffset(n);r<=30?this.overlay.classList.add(`${s.OVERLAY}--bottom`):this.overlay.classList.remove(`${s.OVERLAY}--bottom`),e.style.top=`${r}px`,e.style.left=`${i}px`,e.style.width=`${n.offsetWidth}px`,e.style.height=`${n.offsetHeight}px`,e.style.minHeight="5px"}else this.hideElement(e)}getElementOffset(e){const t=e.getBoundingClientRect(),n=window.pageXOffset||document.documentElement.scrollLeft,i=window.pageYOffset||document.documentElement.scrollTop;return{top:t.top+i,left:t.left+n}}resetAllEvents(){for(const e in this.events)this.events[e]=[]}addMessageListener(){window.addEventListener&&addEventListener("message",this.receiveMessageFromApp.bind(this),!1)}receiveMessageFromApp(e){e&&e.data&&e.data.action&&this.emit(e.data.action,e.data)}emit(e,...t){const n=this.events[e];if(!(!e||!n||!n.length))for(let i=0;i<n.length;i++)n[i].apply(this,t)}outlineOnMoveHandler(){document.body.classList.add(s.OUTLINE);const e=()=>{document.body.classList.remove(s.OUTLINE),this.hinter&&(this.hinter.style.opacity=0)};this.outlineOnMoveInterval&&clearTimeout(this.outlineOnMoveInterval),this.outlineOnMoveInterval=setTimeout(e,800)}outlineOnMove(){document.addEventListener("mousemove",this.outlineOnMoveHandler.bind(this),!1)}on(e,t){if(e.constructor===Array){for(const n of e)this.subscribeEvent(n,t);return}this.subscribeEvent(e,t)}subscribeEvent(e,t){e==="input"&&(this.actionsEnabled=!0),this.events[e].indexOf(t)===-1&&this.events[e].push(t)}pingEditor(e){this.isInIframe?this.sendDataToEditor({action:"ping"}):(this.inEditor=!1,e(this)),this.on("pingBack",this.handlePingBack(e))}handlePingBack(e){return()=>{this.inEditor=!0,e(this)}}handleEditedBlok(e){this.navigationBreadcrumbs=e.breadcrumbs,this.canAddBlocks=e.canAddBlocks||!1,this.canMoveForward=e.canMoveForward||!1,this.canMoveBackward=e.canMoveBackward||!1,this.canDeleteBlocks=e.canDeleteBlocks||!1,this.updateComponentBase(e.blok)}handleAddMoveBlok(e){const t=u(`${this.storyId}-${e.blockId}`);t&&this.handleOpenBlok(t)}handleDeselectBlock(){document.querySelectorAll("[data-blok-focused]").forEach(e=>e.removeAttribute("data-blok-focused")),this.hideElement(this.overlay)}handleDuplicatedBlok(e){this.handleDeselectBlock(),setTimeout(()=>{const t=u(`${this.storyId}-${e.blockId}`);this.handleOpenBlok(t)},500)}handleWindowClick(e){this.config.preventClicks&&(e.preventDefault(),e.stopPropagation()),this.handleOpenBlok(e.target,e)}handleOpenBlok(e,t){const n=A(e);if(n){t&&n.uid!==this.currentUid&&(t.preventDefault(),t.stopPropagation()),this.currentUid=n.uid,this.storyId=n.id,this.openBlok(n);return}t&&this.toggleFocusElement(e,!0)}enterEditmode(e){const t=V(document.body);e&&e.appVersion&&(this.appVersion=e.appVersion),e&&e.componentNames&&(this.componentNames=e.componentNames);for(let n=0;n<t.length;n++){const i=t[n].el,r=t[n].options;!i||i.nodeType!==Node.ELEMENT_NODE||(r.name=this.componentNames[r.name]||r.name,i.setAttribute("data-blok-c",JSON.stringify(r)),i.setAttribute("data-blok-uid",`${r.id}-${r.uid}`),i.offsetHeight<5&&(i.style["min-height"]="5px"),i.classList.add("storyblok__outline"))}if(this.on("addedBlock",this.handleAddMoveBlok),this.on("duplicatedBlock",this.handleDuplicatedBlok),this.on("movedBlock",this.handleAddMoveBlok),this.on("enterComponent",this.enterComponent),this.on("highlightComponent",this.highlightComponent),this.on("hoverComponent",this.hoverComponent),this.on("editedBlok",this.handleEditedBlok),this.on("deselectBlok",this.handleDeselectBlock),e&&e.blockId&&this.config.setActiveBlock){const n=u(`${e.storyId}-${e.blockId}`);this.handleOpenBlok(n)}window.addEventListener("click",this.handleWindowClick.bind(this)),this.calcInterval!==null&&window.clearInterval(this.calcInterval),this.calcInterval=window.setInterval(()=>{this.calculateElementPosition(this.overlay,`${this.storyId}-${this.currentUid}`)},300)}highlightComponent(e){this.highlighter.innerHTML="",e.componentIds.length>0?(this.highlighter.style.display="block",this.highlighter.style.opacity=1):(this.highlighter.style.display="none",this.highlighter.style.opacity=0);for(let t=0;t<e.componentIds.length;t++){const n=`${e.storyId}-${e.componentIds[t]}`,i=u(n);if(i){const r=document.createElement("div");r.setAttribute("class",s.HIGHLIGHTER),this.highlighter.appendChild(r),this.calculateElementPosition(r,n),e.componentId===e.componentIds[t]&&!S(i)&&typeof i.scrollIntoView<"u"&&i.scrollIntoView()}}}hoverComponent(e){this.calculateElementPosition(this.hinter,`${e.storyId}-${e.componentId}`),this.hinter.style.opacity=1,this.hinter.style.display="block"}toggleFocusElement(e,t=!1){if(!F(this.overlay,e)){if(this.handleDeselectBlock(),!t&&this.storyId===I("_storyblok")){e.setAttribute("data-blok-focused",!0),this.showFocusedElement(this.overlay),this.focusState=!1;return}this.focusState||this.sendDataToEditor({action:"noFocus"})}}showFocusedElement(e){if(!this.currentUid){this.hideElement(e);return}this.showElement(e),this.calculateElementPosition(e,`${this.storyId}-${this.currentUid}`)}handleBlokActions(e){this.sendDataToEditor({action:e,blok:this.lastBreadcrumbItem}),e==="addBlockBefore"||e==="addBlockAfter"||e==="copy"?this.hideElement(this.actionsMenu):this.hideElement(this.overlay),(e==="moveForward"||e==="moveBackward")&&(this.focusState=!0)}hideElement(e){e.style.display="none"}showElement(e){e.style.display="block"}toggleElement(e){if(e.style.display==="block"){this.hideElement(e);return}this.showElement(e)}enterComponent(e){const t=u(`${e.storyId}-${e.componentId}`),n=A(t);n&&(this.hinter.style.opacity=0,this.hinter.style.display="none",this.currentUid=n.uid,this.storyId=n.id,this.scrollIntoView(t),this.handleEditedBlok(e))}scrollIntoView(e){e&&!S(e)&&typeof e.scrollIntoView<"u"&&setTimeout(()=>{e.scrollIntoView({behavior:"smooth",block:"start"})},100)}openBlok(e){this.sendDataToEditor({action:"edit",dataC:e,config:this.config})}createComponentContext(){this.createComponentBase(),this.createActionsMenu(),this.createActionsMenuItems(),this.createBreadcrumbsMenu(),this.createActionsMenuButton(),this.createBreadcrumbsMenuButton(),this.createComponentLabel(),this.createComponentButtonLabel()}createComponentBase(){this.componentBase=document.createElement("div"),this.componentBase.setAttribute("class",s.COMPONENT_BASE),this.componentBase.setAttribute("id",s.COMPONENT_BASE),this.overlay.append(this.componentBase)}createComponentLabel(){this.componentLabel=document.createElement("span"),this.componentLabel.setAttribute("class",`${s.COMPONENT_BASE}-label`),this.componentBase.prepend(this.componentLabel)}createComponentButtonLabel(){const e=document.createElement("span");e.setAttribute("class",`${s.COMPONENT_BASE}-label`),this.breadcrumbsButtonMenu.appendChild(e)}updateComponentLabel(e){document.querySelectorAll(`.${s.COMPONENT_BASE}-label`).forEach(t=>t.innerText=this.componentNames[e.name]||O(e))}updateComponentBase(e){this.hideElement(this.actionsMenu),this.hideElement(this.breadcrumbsMenu),this.overlay.classList.add(`${s.OVERLAY}--clicked`),setTimeout(()=>{this.overlay.classList.remove(`${s.OVERLAY}--clicked`)},400),this.navigationBreadcrumbs.length>1?(this.updateBreadcrumbsMenu(this.navigationBreadcrumbs),this.actionsEnabled?this.updateActionsMenu():(this.componentBase.setAttribute("class",`${s.COMPONENT_BASE} ${s.COMPONENT_BASE}--simple`),this.hideElement(this.actionsMenuButton)),this.hideElement(this.componentLabel)):(this.hideElement(this.breadcrumbsButtonMenu),this.hideElement(this.actionsMenuButton),this.showElement(this.componentLabel)),this.updateComponentLabel(e);const t=u(`${this.storyId}-${e.uid}`);t&&this.toggleFocusElement(t)}createBreadcrumbsMenuButton(){this.breadcrumbsButtonMenu=document.createElement("button"),this.breadcrumbsButtonMenu.setAttribute("class",`${s.COMPONENT_BASE}-btn ${s.COMPONENT_BASE}-btn-parent`),this.breadcrumbsButtonMenu.prepend(N({viewBox:"0 0 24 24",svgClass:`${s.COMPONENT_BASE}-svg`,path:"M13.73 14.284l-2.197-2.216 2.197-2.217a1.051 1.051 0 000-1.477 1.03 1.03 0 00-1.465 0l-2.93 2.955a1.043 1.043 0 00-.287.554l-.014.123v.123c.014.247.115.489.301.677l2.93 2.956a1.03 1.03 0 001.465 0 1.051 1.051 0 000-1.478z",pathFill:"#ffffff"})),this.breadcrumbsButtonMenu.addEventListener("click",()=>{this.toggleElement(this.breadcrumbsMenu),this.hideElement(this.actionsMenu)}),this.componentBase.prepend(this.breadcrumbsButtonMenu)}createBreadcrumbsMenu(){this.breadcrumbsMenu=document.createElement("div"),this.breadcrumbsMenu.setAttribute("class",s.BREADCRUMBS_MENU),this.breadcrumbsMenu.setAttribute("id",s.BREADCRUMBS_MENU),this.componentBase.append(this.breadcrumbsMenu)}updateBreadcrumbsMenu(e){this.breadcrumbsMenu.innerHTML="";const t=[];for(let n=0;n<e.length;n++){t[n]=document.createElement("button"),t[n].innerHTML=O({display_name:this.componentNames[e[n].component],name:e[n].component});const i=e[n];t[n].addEventListener("click",r=>{r.stopPropagation(),this.currentUid=i._uid,this.openBlok({id:this.storyId,uid:i._uid,name:i.component})}),t[n].classList.add(`${s.BREADCRUMBS_MENU}__menu-item`),e[n]._uid===this.currentUid&&(t[n].classList.add(`${s.BREADCRUMBS_MENU}__menu-item--selected`),t[n].setAttribute("disabled",!0)),this.breadcrumbsMenu.appendChild(t[n]),this.breadcrumbsButtonMenu.style.display="flex"}}createActionsMenuButton(){this.actionsMenuButton=document.createElement("button"),this.actionsMenuButton.setAttribute("class",`${s.COMPONENT_BASE}-btn ${s.COMPONENT_BASE}-btn-action`),this.actionsMenuButton.prepend(N({viewBox:"0 0 24 24",svgClass:`${s.COMPONENT_BASE}-svg`,path:"M7.5 11a1.5 1.5 0 110 3 1.5 1.5 0 010-3zm10 0a1.5 1.5 0 110 3 1.5 1.5 0 010-3zm-5 0a1.5 1.5 0 110 3 1.5 1.5 0 010-3z",pathFill:"#ffffff"})),this.actionsMenuButton.addEventListener("click",()=>{this.toggleElement(this.actionsMenu),this.breadcrumbsMenu&&this.hideElement(this.breadcrumbsMenu)}),this.componentBase.append(this.actionsMenuButton)}createActionsMenuItems(){this.actionsMenuItems=[{eventFunction:()=>this.handleBlokActions.bind(this,"addBlockBefore"),innerHTML:"Add Block Before",order:0,show:()=>this.canAddBlocks},{eventFunction:()=>this.handleBlokActions.bind(this,"addBlockAfter"),innerHTML:"Add Block After",order:1,show:()=>this.canAddBlocks},{eventFunction:()=>this.handleBlokActions.bind(this,"duplicateBlock"),innerHTML:"Duplicate",order:2,show:()=>this.canAddBlocks},{eventFunction:()=>this.handleBlokActions.bind(this,"copy"),innerHTML:"Copy",order:3,show:()=>this.appVersion==="v2"},{separator:!0,order:4,show:()=>this.canAddBlocks&&this.canMoveForward||!!(this.canMoveBackward&&this.lastBreadcrumbItem._parentindex)},{eventFunction:()=>this.handleBlokActions.bind(this,"moveForward"),innerHTML:"Move Forward",order:5,show:()=>this.canMoveForward},{eventFunction:()=>this.handleBlokActions.bind(this,"moveBackward"),innerHTML:"Move Backward",order:6,show:()=>this.canMoveBackward&&this.lastBreadcrumbItem._parentindex},{separator:!0,order:7,show:()=>this.canAddBlocks&&this.canDeleteBlocks},{eventFunction:()=>this.handleBlokActions.bind(this,"deleteBlock"),className:`${s.ACTIONS_MENU}__menu-item--delete`,innerHTML:"Delete",order:8,show:()=>this.canDeleteBlocks}]}createActionsMenu(){this.actionsMenu=document.createElement("div"),this.actionsMenu.setAttribute("class",s.ACTIONS_MENU),this.actionsMenu.setAttribute("id",s.ACTIONS_MENU),this.componentBase.append(this.actionsMenu)}updateActionsMenu(){this.actionsMenu.innerHTML="";const e=`${s.ACTIONS_MENU}__menu-item`,t="button",n="click";this.actionsMenuItems.sort((i,r)=>i.order>r.order?1:r.order>i.order?-1:0).forEach(i=>{if(i.separator&&i.show()){this.actionsMenu.appendChild(document.createElement("hr"));return}const r=document.createElement(i.element?i.element:t);r.classList.add(e),i.className&&r.classList.add(i.className),r.innerHTML=i.innerHTML,i.eventFunction&&r.addEventListener(i.event?i.event:n,i.eventFunction()),i.show()&&this.actionsMenu.appendChild(r)}),this.actionsMenuButton.style.display="flex"}}var J=Object.defineProperty,K=(o,e,t)=>e in o?J(o,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):o[e]=t,f=(o,e,t)=>K(o,typeof e!="symbol"?e+"":e,t);let W=class{constructor(e){f(this,"isInEditor"),f(this,"enterEditmode"),f(this,"pingEditor"),f(this,"on");const t=new G(e);this.isInEditor=()=>t.isInEditor(),this.enterEditmode=n=>{t.enterEditmode(n)},this.pingEditor=n=>{t.pingEditor(n)},this.on=(n,i)=>{t.on(n,i)}}};const y=o=>({tag:"success",value:o}),b=o=>({tag:"failure",error:o,path:[]}),C=(o,e)=>({tag:"failure",error:o.error,path:[e,...o.path]}),X=o=>typeof o>"u",Z=o=>typeof o=="string",Q=o=>typeof o=="object"&&o!==null,B=Symbol("propertyAbsent"),x=Symbol("omitProperty"),ee="Not an object",te=o=>C(b("Property is missing"),{tag:"object",key:o}),oe=o=>{const e=Object.entries(o);return t=>{if(!Q(t))return b(ee);const n={};for(let i=0;i<e.length;i++){const[r,h]=e[i],l=t[r];if(l===void 0&&!t.hasOwnProperty(r)){const c=h(B);if(c.tag==="failure"||c.value===B)return te(r);c.value!==x&&(n[r]=c.value)}else{const c=h(l);if(c.tag==="failure")return C(c,{tag:"object",key:r});n[r]=c.value}}return y(n)}},ne=o=>X(o)?y(o):b("Not undefined"),k=o=>Z(o)?y(o):b("Not a string"),ie=(...o)=>e=>{for(const t of o){const n=t(e);if(n.tag==="success")return y(n.value)}return b("No parser in the union matched")},se=o=>ie(re,ne,o),re=o=>o===B?y(x):b("not optional");oe({name:k,space:se(k),uid:k,id:k});const ae=Object.freeze(Object.defineProperty({__proto__:null,default:W},Symbol.toStringTag,{value:"Module"}));a.StoryblokClient=m,Object.defineProperty(a,"buildStoryblokImage",{enumerable:!0,get:()=>E.buildStoryblokImage}),Object.defineProperty(a,"renderRichText",{enumerable:!0,get:()=>E.renderRichText}),Object.defineProperty(a,"splitTableRows",{enumerable:!0,get:()=>E.splitTableRows}),a.apiPlugin=L,a.loadStoryblokBridge=H,a.registerStoryblokBridge=w,a.storyblokEditable=P,a.storyblokInit=U,a.useStoryblokBridge=w,Object.defineProperty(a,Symbol.toStringTag,{value:"Module"})}));
@@ -1,108 +0,0 @@
1
- /**
2
- * name: @storyblok/js
3
- * (c) 2026
4
- * description: SDK to integrate Storyblok into your project using JavaScript.
5
- * author: undefined
6
- */
7
- import g from "storyblok-js-client";
8
- import { default as _ } from "storyblok-js-client";
9
- import { buildStoryblokImage as P, renderRichText as x, splitTableRows as A } from "@storyblok/richtext";
10
- let u = !1, a;
11
- const y = [], f = () => typeof window > "u" ? Promise.reject(
12
- new Error("Cannot load Storyblok bridge: window is undefined (server-side environment)")
13
- ) : (window.storyblokRegisterEvent = (o) => {
14
- if (!window.location.search.includes("_storyblok")) {
15
- console.warn("You are not in Draft Mode or in the Visual Editor.");
16
- return;
17
- }
18
- u ? o() : y.push(o);
19
- }, u ? Promise.resolve() : a || (a = import("./index-CtMAhUF-.js").then(({ default: o }) => {
20
- window.StoryblokBridge = o, y.forEach((e) => e()), u = !0;
21
- }).catch((o) => {
22
- throw a = void 0, o;
23
- }), a)), S = (o = {}) => {
24
- const { apiOptions: e } = o;
25
- if (!e || !e.accessToken) {
26
- console.error(
27
- "You need to provide an access token to interact with Storyblok API. Read https://www.storyblok.com/docs/api/content-delivery#topics/authentication"
28
- );
29
- return;
30
- }
31
- return { storyblokApi: new g(e) };
32
- }, m = (o) => {
33
- if (typeof o != "object" || typeof o._editable != "string")
34
- return {};
35
- try {
36
- const e = JSON.parse(
37
- o._editable.replace(/^<!--#storyblok#/, "").replace(/-->$/, "")
38
- );
39
- return e ? {
40
- "data-blok-c": JSON.stringify(e),
41
- "data-blok-uid": `${e.id}-${e.uid}`
42
- } : {};
43
- } catch {
44
- return {};
45
- }
46
- };
47
- function k(o) {
48
- const { language: e, resolveRelations: r, ...l } = o;
49
- return e && console.warn(
50
- "[Storyblok] The `language` bridge option is no longer supported by the bundled bridge. Language context is now passed automatically by the Visual Editor via the `_storyblok_lang` URL parameter."
51
- ), {
52
- ...l,
53
- ...r !== void 0 && {
54
- resolveRelations: Array.isArray(r) ? r : [r]
55
- }
56
- };
57
- }
58
- const v = (o, e, r = {}) => {
59
- var i;
60
- const n = !(typeof window > "u") && typeof window.storyblokRegisterEvent < "u", d = new URL((i = window.location) == null ? void 0 : i.href).searchParams.get(
61
- "_storyblok"
62
- ), c = d !== null && +d === o;
63
- if (!(!n || !c)) {
64
- if (!o) {
65
- console.warn("Story ID is not defined. Please provide a valid ID.");
66
- return;
67
- }
68
- window.storyblokRegisterEvent(() => {
69
- new window.StoryblokBridge(
70
- k(r)
71
- ).on(["input", "published", "change"], (t) => {
72
- var s;
73
- t && (t.action === "input" && ((s = t.story) == null ? void 0 : s.id) === o ? e(t.story) : (t.action === "change" || t.action === "published") && t.storyId === o && window.location.reload());
74
- });
75
- });
76
- }
77
- }, R = (o = {}) => {
78
- var s, b;
79
- const {
80
- bridge: e,
81
- accessToken: r,
82
- use: l = [],
83
- apiOptions: n = {},
84
- bridgeUrl: d
85
- } = o;
86
- d && console.warn(
87
- "[Storyblok] The `bridgeUrl` option is deprecated and will be removed in a future major version. The Storyblok bridge is now bundled and is no longer loaded from a CDN URL."
88
- ), n.accessToken = n.accessToken || r;
89
- const c = { bridge: e, apiOptions: n };
90
- let i = {};
91
- l.forEach((w) => {
92
- i = { ...i, ...w(c) };
93
- });
94
- const t = !(typeof window > "u") && ((b = (s = window.location) == null ? void 0 : s.search) == null ? void 0 : b.includes("_storyblok_tk"));
95
- return e !== !1 && t && f(), i;
96
- }, B = () => f();
97
- export {
98
- _ as StoryblokClient,
99
- S as apiPlugin,
100
- P as buildStoryblokImage,
101
- B as loadStoryblokBridge,
102
- v as registerStoryblokBridge,
103
- x as renderRichText,
104
- A as splitTableRows,
105
- m as storyblokEditable,
106
- R as storyblokInit,
107
- v as useStoryblokBridge
108
- };
@@ -1,58 +0,0 @@
1
- import { ISbComponentType, ISbConfig, ISbStoryData, default as StoryblokClient } from 'storyblok-js-client';
2
- declare global {
3
- interface Window {
4
- storyblokRegisterEvent: (cb: () => void) => void;
5
- StoryblokBridge: {
6
- new (options?: StoryblokBridgeConfigV2): StoryblokBridgeV2;
7
- };
8
- }
9
- }
10
- export interface SbInitResult {
11
- storyblokApi?: StoryblokClient;
12
- }
13
- export type SbPluginFactory = (options: SbSDKOptions) => any;
14
- export type SbBlokKeyDataTypes = string | number | object | boolean | undefined;
15
- export interface SbBlokData extends ISbComponentType<string> {
16
- [index: string]: SbBlokKeyDataTypes;
17
- }
18
- export interface SbSDKOptions {
19
- bridge?: boolean;
20
- accessToken?: string;
21
- use?: any[];
22
- apiOptions?: ISbConfig;
23
- bridgeUrl?: string;
24
- }
25
- export interface ISbEventPayload<S extends ISbComponentType<string> = any> {
26
- action: 'customEvent' | 'published' | 'input' | 'change' | 'unpublished' | 'enterEditmode';
27
- event?: string;
28
- story?: ISbStoryData<S>;
29
- slug?: string;
30
- slugChanged?: boolean;
31
- storyId?: number;
32
- reload?: boolean;
33
- }
34
- export interface StoryblokBridgeConfigV2 {
35
- resolveRelations?: string | string[];
36
- customParent?: string;
37
- preventClicks?: boolean;
38
- language?: string;
39
- resolveLinks?: 'url' | 'story' | '0' | '1' | 'link';
40
- fallbackLang?: string;
41
- }
42
- export interface StoryblokBridgeV2 {
43
- pingEditor: (event: any) => void;
44
- isInEditor: () => boolean;
45
- enterEditmode: () => void;
46
- on: (event: 'customEvent' | 'published' | 'input' | 'change' | 'unpublished' | 'enterEditmode' | string[], callback: (payload?: ISbEventPayload) => void) => void;
47
- }
48
- export type { ArrayFn, AsyncFn, ISbAlternateObject, // previously AlternateObject
49
- ISbCache, // previously StoryblokCache
50
- ISbComponentType as StoryblokComponentType, ISbConfig, // previously StoryblokConfig
51
- ISbContentMangmntAPI, ISbDimensions, ISbError, ISbManagmentApiResult, // previously StoryblokManagmentApiResult
52
- ISbResponse, ISbResult, // previously StoryblokResult
53
- ISbSchema, ISbStories, // previously Stories
54
- ISbStoriesParams, // previously StoriesParams
55
- ISbStory, // previously Story
56
- ISbStoryData, // previously StoryData
57
- ISbStoryParams, // previously StoryParams
58
- ISbThrottle, ISbThrottledRequest, } from 'storyblok-js-client';