@qkix/strapi-plugin-better-blocks 0.23.5 → 0.23.7
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/README.md +42 -34
- package/dist/admin/index.js +9 -9
- package/dist/admin/index.mjs +11 -11
- package/dist/admin/src/blockRegistry.d.ts +2 -2
- package/dist/admin/src/components/BlocksInput/Blocks/Embed.d.ts +1 -1
- package/dist/admin/src/components/BlocksInput/Blocks/Table.d.ts +1 -1
- package/dist/admin/src/components/BlocksInput/Blocks/TableGridPicker.d.ts +1 -1
- package/dist/admin/src/components/BlocksInput/Blocks/TableIcons.d.ts +1 -1
- package/dist/admin/src/components/BlocksInput/Blocks/TableToolbar.d.ts +1 -1
- package/dist/admin/src/components/BlocksInput/Blocks/embedProviders.d.ts +1 -1
- package/dist/admin/src/components/BlocksInput/Blocks/muxClient.d.ts +1 -1
- package/dist/admin/src/components/BlocksInput/Blocks/tableGrid.d.ts +7 -7
- package/dist/admin/src/components/BlocksInput/Blocks/tableOperations.d.ts +4 -4
- package/dist/admin/src/components/BlocksInput/Blocks/videoProviders.d.ts +2 -2
- package/dist/admin/src/components/BlocksInput/BlocksEditor.d.ts +1 -1
- package/dist/admin/src/components/BlocksInput/MenuScrollbar.d.ts +1 -1
- package/dist/admin/src/components/BlocksInput/utils/types.d.ts +5 -5
- package/dist/server/index.mjs +2 -2
- package/dist/server/src/services/oembed.d.ts +1 -1
- package/dist/server/src/services/ttlCache.d.ts +1 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -47,43 +47,43 @@
|
|
|
47
47
|
|
|
48
48
|
### Text color & background highlight
|
|
49
49
|
|
|
50
|
-
|
|
51
51
|
|
|
52
52
|
### Tables
|
|
53
53
|
|
|
54
|
-
|
|
55
55
|
|
|
56
56
|
### Nested lists
|
|
57
57
|
|
|
58
|
-
|
|
59
59
|
|
|
60
60
|
### Media embeds (YouTube / Vimeo)
|
|
61
61
|
|
|
62
|
-
|
|
63
63
|
|
|
64
64
|
### Text alignment
|
|
65
65
|
|
|
66
|
-
|
|
67
67
|
|
|
68
68
|
### Line height & indentation
|
|
69
69
|
|
|
70
|
-
|
|
71
71
|
|
|
72
72
|
### Image captions & alignment
|
|
73
73
|
|
|
74
|
-
|
|
75
75
|
|
|
76
76
|
### Emoji & special character pickers
|
|
77
77
|
|
|
78
|
-
|
|
79
79
|
|
|
80
80
|
### Find & replace
|
|
81
81
|
|
|
82
|
-
|
|
83
83
|
|
|
84
84
|
### Undo / redo, remove formatting & word count
|
|
85
85
|
|
|
86
|
-
|
|
87
87
|
|
|
88
88
|
## Features
|
|
89
89
|
|
|
@@ -130,7 +130,10 @@
|
|
|
130
130
|
|
|
131
131
|
| Strapi Version | Plugin Version |
|
|
132
132
|
| -------------- | -------------- |
|
|
133
|
-
| v5.x | v0.
|
|
133
|
+
| v5.x | v0.x |
|
|
134
|
+
|
|
135
|
+
Strapi v5 only. The plugin is built against the v5 Document Service and the v5
|
|
136
|
+
admin APIs, and there is no v4 branch.
|
|
134
137
|
|
|
135
138
|
## Installation
|
|
136
139
|
|
|
@@ -215,13 +218,13 @@ with **Full Access**. Once they are set, the video block's source picker grows a
|
|
|
215
218
|
|
|
216
219
|
Notes:
|
|
217
220
|
|
|
218
|
-
- Only assets **uploaded through the Mux plugin** appear
|
|
221
|
+
- Only assets **uploaded through the Mux plugin** appear - the plugin lists its
|
|
219
222
|
own `mux-asset` records, not everything in your Mux account.
|
|
220
223
|
- Assets with a **signed** playback policy are shown but not selectable: signed
|
|
221
224
|
playback needs a short-lived JWT minted per request, and a token stored in the
|
|
222
225
|
document body would expire.
|
|
223
226
|
- Better Blocks detects the plugin by calling its asset-list route, not its
|
|
224
|
-
`mux-settings` route
|
|
227
|
+
`mux-settings` route - the latter reports "not configured" unless a webhook
|
|
225
228
|
signing secret is also set, which listing assets does not require.
|
|
226
229
|
|
|
227
230
|
#### Button defaults (optional)
|
|
@@ -324,7 +327,7 @@ A button is stored as a single block. `buttonType` selects the rendering mode:
|
|
|
324
327
|
Render link mode as `<a href={link.url} target={link.target} rel={link.rel}>`. For file
|
|
325
328
|
mode, honour `filePreview`: when `true` open the file in a new tab
|
|
326
329
|
(`<a href={file.url} target="_blank" rel="noopener noreferrer">`), otherwise force a
|
|
327
|
-
download (`<a href={file.url} download={file.name}>`)
|
|
330
|
+
download (`<a href={file.url} download={file.name}>`) - optionally prefixing
|
|
328
331
|
`file.name`/size with `showFileIcon`/`showFileSize`. Only the keys for the active mode are
|
|
329
332
|
present. `style.variant` records the selected preset for the editor UI; renderers can
|
|
330
333
|
ignore it.
|
|
@@ -346,8 +349,8 @@ display and player settings:
|
|
|
346
349
|
"size": 5242880, // bytes
|
|
347
350
|
"provider": "local", // local | cloudinary | …
|
|
348
351
|
},
|
|
349
|
-
"title": "Episode 1: Introduction", // optional
|
|
350
|
-
"caption": "Our first podcast episode", // optional
|
|
352
|
+
"title": "Episode 1: Introduction", // optional - key omitted when empty
|
|
353
|
+
"caption": "Our first podcast episode", // optional - key omitted when empty
|
|
351
354
|
"player": {
|
|
352
355
|
"autoplay": false,
|
|
353
356
|
"loop": false,
|
|
@@ -368,16 +371,16 @@ omitted when empty. See the full React/Astro renderer contract on [issue #43](ht
|
|
|
368
371
|
#### Embed JSON shape (for frontend renderers)
|
|
369
372
|
|
|
370
373
|
A generic embed is a void block. `embedHtml` is the **only** field a renderer
|
|
371
|
-
needs
|
|
374
|
+
needs - it is already sanitized (rebuilt from an attribute allowlist, https-only
|
|
372
375
|
`src`), so render it as-is and ignore `url` / `iframe`, which exist to
|
|
373
376
|
round-trip the editor UI:
|
|
374
377
|
|
|
375
378
|
```jsonc
|
|
376
379
|
{
|
|
377
380
|
"type": "embed",
|
|
378
|
-
"source": "url", // "url" | "iframe"
|
|
381
|
+
"source": "url", // "url" | "iframe" - which input the author used
|
|
379
382
|
"url": "https://www.youtube.com/watch?v=abc12345678", // source: "url" only
|
|
380
|
-
"iframe": "<iframe src=…>", // source: "iframe" only
|
|
383
|
+
"iframe": "<iframe src=…>", // source: "iframe" only - the raw paste
|
|
381
384
|
"embedHtml": "<iframe src=\"https://www.youtube.com/embed/abc12345678\" …></iframe>",
|
|
382
385
|
"embedSrc": "https://www.youtube.com/embed/abc12345678", // hoisted for host checks
|
|
383
386
|
"provider": "youtube", // youtube | vimeo | loom | wistia | dailymotion | api-video | generic
|
|
@@ -386,7 +389,7 @@ round-trip the editor UI:
|
|
|
386
389
|
"customAspectRatio": "3 / 2", // only when aspectRatio is "custom"
|
|
387
390
|
"alignment": "center", // "left" | "center" | "right" | "none"
|
|
388
391
|
"caption": "A video explaining the feature", // optional
|
|
389
|
-
"title": "Product Demo", // optional
|
|
392
|
+
"title": "Product Demo", // optional - becomes the iframe's accessible name
|
|
390
393
|
}
|
|
391
394
|
```
|
|
392
395
|
|
|
@@ -440,15 +443,15 @@ sibling `audio` block so renderers only learn one shape.
|
|
|
440
443
|
|
|
441
444
|
Rendering rules:
|
|
442
445
|
|
|
443
|
-
- **`provider: "local"` / `"custom"` with a direct file URL**
|
|
446
|
+
- **`provider: "local"` / `"custom"` with a direct file URL** - a native
|
|
444
447
|
`<video src={url} poster={poster} controls={player.controls}
|
|
445
448
|
autoPlay={player.autoplay} loop={player.loop} muted={player.muted}>`. Add
|
|
446
449
|
`<track kind="captions" src={transcript}>` when `transcript` is set, and
|
|
447
450
|
associate `caption` via `aria-describedby`.
|
|
448
451
|
- **HLS/DASH sources** (`url` ending in `.m3u8` / `.mpd`, i.e. most Mux assets)
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
- **`provider: "mux"`**
|
|
452
|
+
- a bare `<video>` only plays these in Safari. Use the provider's player
|
|
453
|
+
(`<mux-player playback-id={playbackId}>` for Mux) or attach `hls.js`.
|
|
454
|
+
- **`provider: "mux"`** - `playbackId` alone is enough for a **public** playback
|
|
452
455
|
policy; no credentials are needed on the frontend. Assets with a **signed**
|
|
453
456
|
policy are intentionally not selectable in the editor, because they need a
|
|
454
457
|
short-lived JWT minted per request and a token baked into the document body
|
|
@@ -460,8 +463,8 @@ keys are omitted when empty.
|
|
|
460
463
|
#### Table JSON shape (for frontend renderers)
|
|
461
464
|
|
|
462
465
|
A table is a `table` block holding `table-row` children, each holding
|
|
463
|
-
`table-cell` or `table-header-cell` children. Cells contain **inline** content
|
|
464
|
-
text leaves with marks, links, inline math
|
|
466
|
+
`table-cell` or `table-header-cell` children. Cells contain **inline** content -
|
|
467
|
+
text leaves with marks, links, inline math - so render their `children` through
|
|
465
468
|
the same inline renderer used for paragraphs, never as plain text.
|
|
466
469
|
|
|
467
470
|
```jsonc
|
|
@@ -499,10 +502,10 @@ the same inline renderer used for paragraphs, never as plain text.
|
|
|
499
502
|
|
|
500
503
|
Rendering rules:
|
|
501
504
|
|
|
502
|
-
- **`align`** maps to `text-align`. **Absent means `left`**
|
|
505
|
+
- **`align`** maps to `text-align`. **Absent means `left`** - left-aligned cells
|
|
503
506
|
store nothing, so documents authored before alignment existed stay valid.
|
|
504
507
|
- **`colSpan` / `rowSpan`** map to the HTML attributes of the same name.
|
|
505
|
-
**Absent means 1**, so unmerged cells
|
|
508
|
+
**Absent means 1**, so unmerged cells - the overwhelming majority - carry
|
|
506
509
|
neither key. A spanned-over slot has no node at all: the cell that covers it
|
|
507
510
|
simply carries the span, exactly like hand-written HTML.
|
|
508
511
|
- **`table-header-cell`** renders as `<th scope="col">`, `table-cell` as `<td>`.
|
|
@@ -511,7 +514,7 @@ Rendering rules:
|
|
|
511
514
|
row exists.
|
|
512
515
|
- **A `rowSpan` never crosses the header/body divide.** The editor won't merge
|
|
513
516
|
across it and normalizes away any span that does, because HTML doesn't allow a
|
|
514
|
-
cell to span `<thead>` into `<tbody>`
|
|
517
|
+
cell to span `<thead>` into `<tbody>` - so `<thead>` is always exactly the
|
|
515
518
|
leading header rows, and no cell straddles the two groups.
|
|
516
519
|
|
|
517
520
|
### 2. Restart Strapi
|
|
@@ -688,7 +691,7 @@ hosts added to `frame-src`:
|
|
|
688
691
|
],
|
|
689
692
|
```
|
|
690
693
|
|
|
691
|
-
Add only the platforms you enable. Without them the card still works
|
|
694
|
+
Add only the platforms you enable. Without them the card still works - clicking
|
|
692
695
|
**Show live post** just renders an empty frame, since the admin CSP blocks it.
|
|
693
696
|
Third-party frames load only after that click, never on page load.
|
|
694
697
|
|
|
@@ -724,8 +727,8 @@ See the [@qkix/better-blocks-react-renderer](https://github.com/qkix/strapi-plug
|
|
|
724
727
|
|
|
725
728
|
## Adding Your Own Block Type
|
|
726
729
|
|
|
727
|
-
Another Strapi plugin
|
|
728
|
-
`src/admin/app.tsx`
|
|
730
|
+
Another Strapi plugin - or your own admin customization in
|
|
731
|
+
`src/admin/app.tsx` - can add a block type to the editor. Call `registerBlock`
|
|
729
732
|
from `register()`, which runs before any editor is mounted.
|
|
730
733
|
|
|
731
734
|
```tsx
|
|
@@ -770,7 +773,7 @@ Registering is the only supported way in. Editing this package to add a block is
|
|
|
770
773
|
how the editor, both renderers and the validator ended up with four separate
|
|
771
774
|
hardcoded lists of block types in the first place.
|
|
772
775
|
|
|
773
|
-
`registerBlock` throws if the type shadows a built-in or is registered twice
|
|
776
|
+
`registerBlock` throws if the type shadows a built-in or is registered twice -
|
|
774
777
|
either one would otherwise surface much later as a block that mysteriously does
|
|
775
778
|
not appear.
|
|
776
779
|
|
|
@@ -786,7 +789,7 @@ package writes `type` and `content` once:
|
|
|
786
789
|
| `migrateDocument(doc, { blocks })` in the core | `migrate`, called for every node of the type |
|
|
787
790
|
| `blockPlugins` on either renderer | `component`, so the front end draws it |
|
|
788
791
|
|
|
789
|
-
A renderer given no plugin for a type renders nothing for it
|
|
792
|
+
A renderer given no plugin for a type renders nothing for it - content authored
|
|
790
793
|
with a registered block is not lost, it is simply not drawn until the front end
|
|
791
794
|
knows about it too.
|
|
792
795
|
|
|
@@ -867,6 +870,11 @@ This plugin is built and maintained in my free time, and it's free for everyone.
|
|
|
867
870
|
|
|
868
871
|
Every coffee goes toward fixing bugs, reviewing PRs, writing docs, and shipping the features you ask for. Thank you! ☕
|
|
869
872
|
|
|
873
|
+
## Roadmap
|
|
874
|
+
|
|
875
|
+
What is worth building next, what is deliberately not planned, and why:
|
|
876
|
+
[ROADMAP.md](https://github.com/qkix/strapi-plugins/blob/main/packages/strapi-plugin-better-blocks/ROADMAP.md).
|
|
877
|
+
|
|
870
878
|
## License
|
|
871
879
|
|
|
872
880
|
[MIT License](LICENSE) © [qkix](https://github.com/qkix)
|
package/dist/admin/index.js
CHANGED
|
@@ -252,7 +252,7 @@
|
|
|
252
252
|
width: 100%;
|
|
253
253
|
`,Md=b.styled(p.Typography)`
|
|
254
254
|
color: ${({theme:e})=>e.colors.neutral500};
|
|
255
|
-
`,Bd=["file","title","caption","player","alignment"],Id=({attributes:e,children:t,element:n})=>{const r=n,{editor:s,disabled:a}=P("Audio"),i=R.useSelected(),[l,c]=k.useState((r.file?.url??"").trim()===""&&!a),u=r.alignment??"center",h=(r.file?.url??"").trim()!=="",f=()=>{try{return R.ReactEditor.findPath(s,r)}catch{return null}},g=()=>{const v=f();v&&(s.children.length===1?(d.Transforms.setNodes(s,{type:"paragraph"},{at:v}),d.Transforms.unsetNodes(s,Bd,{at:v})):d.Transforms.removeNodes(s,{at:v}))},m=v=>{const $=f();if($){d.Transforms.setNodes(s,v,{at:$});const E=["title","caption"].filter(C=>v[C]===void 0||v[C]==="");E.length&&d.Transforms.unsetNodes(s,E,{at:$})}c(!1),R.ReactEditor.focus(s)},x=()=>{g(),c(!1),R.ReactEditor.focus(s)},y=()=>{h||g(),c(!1)};return o.jsxs(p.Box,{...e,children:[t,o.jsx($d,{$align:u,contentEditable:!1,children:o.jsxs(Ed,{$selected:i,onMouseDown:v=>{v.target.closest("audio")||(v.preventDefault(),a||c(!0))},children:[o.jsxs(Cd,{alignItems:"center",children:[o.jsx(Sd,{children:o.jsx(D.MusicNotes,{})}),o.jsx(p.Typography,{fontWeight:"bold",children:r.title||r.file?.name||(h?"Audio":"Audio
|
|
255
|
+
`,Bd=["file","title","caption","player","alignment"],Id=({attributes:e,children:t,element:n})=>{const r=n,{editor:s,disabled:a}=P("Audio"),i=R.useSelected(),[l,c]=k.useState((r.file?.url??"").trim()===""&&!a),u=r.alignment??"center",h=(r.file?.url??"").trim()!=="",f=()=>{try{return R.ReactEditor.findPath(s,r)}catch{return null}},g=()=>{const v=f();v&&(s.children.length===1?(d.Transforms.setNodes(s,{type:"paragraph"},{at:v}),d.Transforms.unsetNodes(s,Bd,{at:v})):d.Transforms.removeNodes(s,{at:v}))},m=v=>{const $=f();if($){d.Transforms.setNodes(s,v,{at:$});const E=["title","caption"].filter(C=>v[C]===void 0||v[C]==="");E.length&&d.Transforms.unsetNodes(s,E,{at:$})}c(!1),R.ReactEditor.focus(s)},x=()=>{g(),c(!1),R.ReactEditor.focus(s)},y=()=>{h||g(),c(!1)};return o.jsxs(p.Box,{...e,children:[t,o.jsx($d,{$align:u,contentEditable:!1,children:o.jsxs(Ed,{$selected:i,onMouseDown:v=>{v.target.closest("audio")||(v.preventDefault(),a||c(!0))},children:[o.jsxs(Cd,{alignItems:"center",children:[o.jsx(Sd,{children:o.jsx(D.MusicNotes,{})}),o.jsx(p.Typography,{fontWeight:"bold",children:r.title||r.file?.name||(h?"Audio":"Audio - click to add a file")})]}),h?o.jsx(Td,{src:r.file.url,controls:r.player?.controls??!0,loop:r.player?.loop??!1,preload:r.player?.preload??"metadata"},r.file.url):o.jsx(Md,{variant:"pi",children:"No audio selected - click to choose from the Media Library or paste a URL."}),r.file?.size?o.jsxs(p.Typography,{variant:"pi",textColor:"neutral500",children:[Pa(r.file.size),r.file.mime?` · ${r.file.mime}`:""]}):null,r.caption?o.jsx(p.Typography,{variant:"pi",textColor:"neutral600",fontWeight:"semiBold",children:r.caption}):null]})}),l&&!a?o.jsx(kd,{open:!0,element:r,onSave:m,onRemove:x,onClose:y}):null]})},Rd=e=>{const{isVoid:t}=e;return e.isVoid=n=>rd(n)?!0:t(n),e},Fd={audio:{renderElement:e=>o.jsx(Id,{...e}),icon:D.MusicNotes,label:{id:"components.Blocks.blocks.audio",defaultMessage:"Audio"},matchNode:e=>e.type==="audio",isInBlocksSelector:!0,handleConvert(e){jd(e)},handleBackspaceKey(e){e.children.length===1?d.Transforms.setNodes(e,{type:"paragraph"}):d.Transforms.removeNodes(e)},handleEnterKey(e){d.Transforms.insertNodes(e,{type:"paragraph",children:[{type:"text",text:""}]})},snippets:["[audio]"]}},Nr=e=>{if(!e||e<=0)return"0 B";const t=["B","KB","MB","GB","TB"],n=Math.min(t.length-1,Math.floor(Math.log(e)/Math.log(1024))),r=e/Math.pow(1024,n);return`${parseFloat(r.toFixed(1))} ${t[n]}`},Dd={pdf:"📄",doc:"📝",docx:"📝",rtf:"📝",txt:"📄",xls:"📊",xlsx:"📊",csv:"📊",ppt:"📽️",pptx:"📽️",zip:"📦",rar:"📦","7z":"📦",mp3:"🎵",wav:"🎵",ogg:"🎵",mp4:"🎬",mov:"🎬",avi:"🎬",webm:"🎬",png:"🖼️",jpg:"🖼️",jpeg:"🖼️",gif:"🖼️",svg:"🖼️",webp:"🖼️"},Pr=e=>{if(!e)return"📎";const t=e.replace(/^\./,"").toLowerCase();return Dd[t]??"📎"},Ad=e=>e&&e.startsWith("/")?`${window.strapi.backendURL}${e}`:e,_d=e=>e.replace(/\.[^./\\]+$/,""),Nd=b.styled(p.Modal.Content)`
|
|
256
256
|
width: 95vw;
|
|
257
257
|
height: 95vh;
|
|
258
258
|
max-width: none;
|
|
@@ -371,7 +371,7 @@
|
|
|
371
371
|
${({$hoverBg:e})=>e?`background-color: ${e};`:""}
|
|
372
372
|
${({$hoverText:e})=>e?`color: ${e};`:""}
|
|
373
373
|
}
|
|
374
|
-
`,Lr=["solid","dashed","dotted","double"],Oa=e=>{const t={enabled:!1,width:"1px",style:"solid",color:"#cccccc"},n=(e??"").trim();if(n===""||n==="none")return t;const r=n.split(/\s+/),s=r.find(l=>/^[\d.]+(px|em|rem|%)$/.test(l)),a=r.find(l=>Lr.includes(l)),i=r.find(l=>l!==s&&!Lr.includes(l)&&/^#|rgb|hsl|[a-z]/i.test(l));return{enabled:!0,width:s??t.width,style:a??t.style,color:i??t.color}},za=e=>e.borderEnabled?`${e.borderWidth||"1px"} ${e.borderStyle||"solid"} ${e.borderColor||"#cccccc"}`:"",es=e=>{const{border:t,variant:n,...r}=e.style??{},s=Oa(e.style?.border);return{buttonType:e.buttonType??"link",label:e.label??"",alignment:e.alignment??"center",url:e.link?.url??"",newTab:e.link?.target==="_blank",ariaLabel:e.link?.ariaLabel??"",file:e.file,showFileSize:e.showFileSize??!0,showFileIcon:e.showFileIcon??!0,filePreview:e.filePreview??!1,variant:e.style?.variant??"custom",style:{...r},cssClass:e.cssClass??"",borderEnabled:s.enabled,borderWidth:s.width,borderStyle:s.style,borderColor:s.color}},qd=e=>{const t={};return Object.keys(e).forEach(n=>{const r=e[n];typeof r=="string"&&r.trim()!==""&&(t[n]=r)}),t},Xd=e=>{const t=za(e),n={buttonType:e.buttonType,label:e.label.trim(),alignment:e.alignment,style:{...qd(e.style),variant:e.variant,...t?{border:t}:{}},showFileSize:e.showFileSize,showFileIcon:e.showFileIcon,filePreview:e.filePreview,cssClass:e.cssClass.trim()||void 0};if(e.buttonType==="link"){const r={url:e.url.trim(),target:e.newTab?"_blank":"_self"};e.newTab&&(r.rel="noopener noreferrer"),e.ariaLabel.trim()&&(r.ariaLabel=e.ariaLabel.trim()),n.link=r}else n.file=e.file;return n},$n={primary:{backgroundColor:"#4945ff",textColor:"#ffffff",border:"none"},secondary:{backgroundColor:"#dcdce4",textColor:"#32324d",border:"none"},outline:{backgroundColor:"transparent",textColor:"#4945ff",border:"2px solid #4945ff"},filled:{backgroundColor:"#32324d",textColor:"#ffffff",border:"none"}},Yd=[{value:"primary",label:"Primary"},{value:"secondary",label:"Secondary"},{value:"outline",label:"Outline"},{value:"filled",label:"Filled"},{value:"custom",label:"Custom"}],ts=[{value:"8px 16px",labelId:"small",label:"Small"},{value:"12px 24px",labelId:"medium",label:"Medium"},{value:"16px 32px",labelId:"large",label:"Large"}],Zd=[{value:"400",label:"Normal (400)"},{value:"500",label:"Medium (500)"},{value:"600",label:"Semibold (600)"},{value:"700",label:"Bold (700)"}],Jd=["left","center","right"],J=({label:e,hint:t,children:n})=>o.jsxs(p.Flex,{direction:"column",gap:1,alignItems:"stretch",children:[e?o.jsx(p.Typography,{variant:"pi",fontWeight:"bold",textColor:"neutral700",tag:"label",children:e}):null,n,t?o.jsx(p.Typography,{variant:"pi",textColor:"neutral500",children:t}):null]}),Kt=({children:e})=>o.jsx(p.Typography,{variant:"delta",tag:"h3",children:e}),Gt=({label:e,value:t,onChange:n})=>o.jsx(J,{label:e,children:o.jsxs(p.Flex,{gap:2,alignItems:"center",children:[o.jsx(Ud,{type:"color",value:t&&/^#[0-9a-fA-F]{6}$/.test(t)?t:"#000000",onChange:r=>n(r.target.value)}),o.jsx(Wd,{value:t??"",placeholder:"—",spellCheck:!1,onChange:r=>n(r.target.value)}),t?o.jsx(Kd,{type:"button",onClick:()=>n(""),children:"Clear"}):null]})}),Qd=({open:e,element:t,presets:n,onSave:r,onRemove:s,onClose:a})=>{const{formatMessage:i}=O.useIntl(),l=Xe.useStrapiApp("ButtonEditorModal",w=>w.components),[c,u]=k.useState(()=>es(t)),[h,f]=k.useState(!1),g={primary:{...$n.primary,...n?.primary},secondary:{...$n.secondary,...n?.secondary},outline:{...$n.outline,...n?.outline},filled:{...$n.filled,...n?.filled}};k.useEffect(()=>{e&&u(es(t))},[e]);const m=w=>u(B=>({...B,style:{...B.style,...w}})),x=w=>u(B=>({...B,variant:"custom",style:{...B.style,...w}})),y=w=>u(B=>({...B,variant:"custom",...w})),v=w=>{if(w==="custom"){u(N=>({...N,variant:"custom"}));return}const B=g[w],A=Oa(B.border);u(N=>({...N,variant:w,style:{...N.style,backgroundColor:B.backgroundColor??N.style.backgroundColor,textColor:B.textColor??N.style.textColor},borderEnabled:A.enabled,borderWidth:A.width,borderStyle:A.style,borderColor:A.color}))},$=l?.["media-library"],E=w=>{const B=w[0];if(B){const A=typeof B.size=="number"?B.size:void 0,N={id:typeof B.id=="number"?B.id:void 0,url:Ad(B.url)??"",name:B.name??"file",size:A!==void 0?Math.round(A*1024):void 0,ext:B.ext??void 0,mime:B.mime??void 0};u(F=>({...F,file:N,label:F.label.trim()?F.label:_d(N.name)}))}f(!1)},C=c.style.padding??"",I=ts.some(w=>w.value===C),S=c.label.trim()||i({id:"components.Blocks.button.preview.placeholder",defaultMessage:"Button"}),T=c.buttonType==="file"&&c.showFileIcon,j=c.buttonType==="file"&&c.showFileSize&&!!c.file?.size;return o.jsxs(p.Modal.Root,{open:e,onOpenChange:w=>{w||a()},children:[o.jsxs(Nd,{children:[o.jsx(p.Modal.Header,{children:o.jsx(p.Modal.Title,{children:i({id:"components.Blocks.button.modal.title",defaultMessage:"Edit button"})})}),o.jsx(Pd,{children:o.jsxs(Od,{children:[o.jsx(zd,{children:o.jsxs(p.Flex,{direction:"column",gap:4,alignItems:"stretch",children:[o.jsx(Kt,{children:i({id:"components.Blocks.button.section.content",defaultMessage:"Content"})}),o.jsx(J,{label:i({id:"components.Blocks.button.type",defaultMessage:"Button type"}),children:o.jsx(gr,{children:["link","file"].map(w=>o.jsx(mr,{type:"button",$active:c.buttonType===w,onClick:()=>u(B=>({...B,buttonType:w})),children:i(w==="link"?{id:"components.Blocks.button.type.link",defaultMessage:"🔗 Link"}:{id:"components.Blocks.button.type.file",defaultMessage:"📁 File download"})},w))})}),o.jsx(J,{label:i({id:"components.Blocks.button.text",defaultMessage:"Text"}),children:o.jsx(Fe,{value:c.label,placeholder:"Click me",onChange:w=>u(B=>({...B,label:w.target.value}))})}),c.buttonType==="link"?o.jsxs(o.Fragment,{children:[o.jsx(J,{label:i({id:"components.Blocks.button.url",defaultMessage:"URL"}),children:o.jsx(Fe,{value:c.url,placeholder:"https://example.com",spellCheck:!1,onChange:w=>u(B=>({...B,url:w.target.value}))})}),o.jsx(p.Checkbox,{checked:c.newTab,onCheckedChange:w=>u(B=>({...B,newTab:!!w})),children:i({id:"components.Blocks.button.newTab",defaultMessage:'Open in new tab (adds rel="noopener noreferrer")'})}),o.jsx(J,{label:i({id:"components.Blocks.button.ariaLabel",defaultMessage:"ARIA label (optional)"}),children:o.jsx(Fe,{value:c.ariaLabel,placeholder:"Accessible description",onChange:w=>u(B=>({...B,ariaLabel:w.target.value}))})})]}):o.jsxs(o.Fragment,{children:[o.jsx(J,{label:i({id:"components.Blocks.button.file",defaultMessage:"File"}),children:c.file?o.jsxs(Gd,{justifyContent:"space-between",gap:2,children:[o.jsxs(p.Flex,{gap:2,alignItems:"center",overflow:"hidden",children:[o.jsx("span",{children:Pr(c.file.ext)}),o.jsxs(p.Flex,{direction:"column",alignItems:"flex-start",children:[o.jsx(p.Typography,{variant:"pi",fontWeight:"bold",ellipsis:!0,children:c.file.name}),o.jsx(p.Typography,{variant:"pi",textColor:"neutral500",children:Nr(c.file.size)})]})]}),o.jsx(p.Button,{variant:"tertiary",type:"button",disabled:!$,onClick:()=>f(!0),children:i({id:"components.Blocks.button.file.change",defaultMessage:"Change"})})]}):o.jsx(p.Button,{variant:"secondary",type:"button",disabled:!$,onClick:()=>f(!0),children:i({id:"components.Blocks.button.file.select",defaultMessage:"Select from Media Library"})})}),o.jsxs(p.Flex,{gap:4,wrap:"wrap",children:[o.jsx(p.Checkbox,{checked:c.showFileSize,onCheckedChange:w=>u(B=>({...B,showFileSize:!!w})),children:i({id:"components.Blocks.button.showFileSize",defaultMessage:"Show file size"})}),o.jsx(p.Checkbox,{checked:c.showFileIcon,onCheckedChange:w=>u(B=>({...B,showFileIcon:!!w})),children:i({id:"components.Blocks.button.showFileIcon",defaultMessage:"Show file icon"})})]}),o.jsx(J,{hint:i({id:"components.Blocks.button.filePreview.hint",defaultMessage:"On: open the file in a new tab (preview). Off: download it directly."}),children:o.jsx(p.Checkbox,{checked:c.filePreview,onCheckedChange:w=>u(B=>({...B,filePreview:!!w})),children:i({id:"components.Blocks.button.filePreview",defaultMessage:"Preview file instead of downloading"})})})]}),o.jsx(p.Divider,{}),o.jsx(Kt,{children:i({id:"components.Blocks.button.section.layout",defaultMessage:"Layout"})}),o.jsx(J,{label:i({id:"components.Blocks.button.alignment",defaultMessage:"Alignment"}),children:o.jsx(gr,{children:Jd.map(w=>o.jsx(mr,{type:"button",$active:c.alignment===w,onClick:()=>u(B=>({...B,alignment:w})),children:w.charAt(0).toUpperCase()+w.slice(1)},w))})}),o.jsx(p.Divider,{}),o.jsx(Kt,{children:i({id:"components.Blocks.button.section.colors",defaultMessage:"Colors"})}),o.jsx(J,{label:i({id:"components.Blocks.button.preset",defaultMessage:"Style preset"}),hint:i({id:"components.Blocks.button.preset.hint",defaultMessage:"Apply a brand variant, then fine-tune below. Editing colors or the border switches to Custom."}),children:o.jsx(gr,{children:Yd.map(w=>o.jsx(mr,{type:"button",$active:c.variant===w.value,onClick:()=>v(w.value),children:w.label},w.value))})}),o.jsxs(p.Flex,{gap:4,wrap:"wrap",alignItems:"flex-start",children:[o.jsx(Gt,{label:i({id:"components.Blocks.button.bgColor",defaultMessage:"Background"}),value:c.style.backgroundColor,onChange:w=>x({backgroundColor:w})}),o.jsx(Gt,{label:i({id:"components.Blocks.button.textColor",defaultMessage:"Text"}),value:c.style.textColor,onChange:w=>x({textColor:w})}),o.jsx(Gt,{label:i({id:"components.Blocks.button.hoverBgColor",defaultMessage:"Hover background"}),value:c.style.hoverBackgroundColor,onChange:w=>x({hoverBackgroundColor:w})}),o.jsx(Gt,{label:i({id:"components.Blocks.button.hoverTextColor",defaultMessage:"Hover text"}),value:c.style.hoverTextColor,onChange:w=>x({hoverTextColor:w})})]}),o.jsx(p.Divider,{}),o.jsx(Kt,{children:i({id:"components.Blocks.button.section.sizing",defaultMessage:"Sizing & typography"})}),o.jsxs(p.Flex,{gap:4,wrap:"wrap",alignItems:"flex-start",children:[o.jsx(J,{label:i({id:"components.Blocks.button.borderRadius",defaultMessage:"Border radius"}),children:o.jsx(Fe,{value:c.style.borderRadius??"",placeholder:"4px",onChange:w=>m({borderRadius:w.target.value})})}),o.jsx(J,{label:i({id:"components.Blocks.button.fontSize",defaultMessage:"Font size"}),children:o.jsx(Fe,{value:c.style.fontSize??"",placeholder:"16px",onChange:w=>m({fontSize:w.target.value})})})]}),o.jsx(J,{label:i({id:"components.Blocks.button.fontWeight",defaultMessage:"Font weight"}),children:o.jsxs(p.SingleSelect,{value:c.style.fontWeight||"inherit",onChange:w=>m({fontWeight:w==="inherit"?"":String(w)}),children:[o.jsx(p.SingleSelectOption,{value:"inherit",children:i({id:"components.Blocks.button.default",defaultMessage:"Default"})}),Zd.map(w=>o.jsx(p.SingleSelectOption,{value:w.value,children:w.label},w.value))]})}),o.jsx(J,{label:i({id:"components.Blocks.button.padding",defaultMessage:"Padding"}),hint:i({id:"components.Blocks.button.padding.hint",defaultMessage:"Pick a preset or type a custom CSS padding value."}),children:o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsxs(p.SingleSelect,{value:I?C:"custom",onChange:w=>{w!=="custom"&&m({padding:String(w)})},children:[ts.map(w=>o.jsxs(p.SingleSelectOption,{value:w.value,children:[w.label," (",w.value,")"]},w.value)),o.jsx(p.SingleSelectOption,{value:"custom",children:i({id:"components.Blocks.button.padding.custom",defaultMessage:"Custom…"})})]}),o.jsx(Fe,{value:C,placeholder:"12px 24px",onChange:w=>m({padding:w.target.value})})]})}),o.jsx(J,{label:i({id:"components.Blocks.button.border",defaultMessage:"Border"}),children:o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(p.Checkbox,{checked:c.borderEnabled,onCheckedChange:w=>y({borderEnabled:!!w}),children:i({id:"components.Blocks.button.border.enable",defaultMessage:"Show border"})}),c.borderEnabled?o.jsxs(p.Flex,{gap:4,wrap:"wrap",alignItems:"flex-start",children:[o.jsx(J,{label:i({id:"components.Blocks.button.border.width",defaultMessage:"Thickness"}),children:o.jsx(Fe,{value:c.borderWidth,placeholder:"1px",onChange:w=>y({borderWidth:w.target.value})})}),o.jsx(J,{label:i({id:"components.Blocks.button.border.style",defaultMessage:"Style"}),children:o.jsx(p.SingleSelect,{value:c.borderStyle,onChange:w=>y({borderStyle:String(w)}),children:Lr.map(w=>o.jsx(p.SingleSelectOption,{value:w,children:w.charAt(0).toUpperCase()+w.slice(1)},w))})}),o.jsx(Gt,{label:i({id:"components.Blocks.button.border.color",defaultMessage:"Color"}),value:c.borderColor,onChange:w=>y({borderColor:w})})]}):null]})}),o.jsx(p.Divider,{}),o.jsx(Kt,{children:i({id:"components.Blocks.button.section.advanced",defaultMessage:"Advanced"})}),o.jsx(J,{label:i({id:"components.Blocks.button.cssClass",defaultMessage:"Custom CSS class"}),hint:i({id:"components.Blocks.button.cssClass.hint",defaultMessage:"Applied to the rendered button for frontend theming."}),children:o.jsx(Fe,{value:c.cssClass,placeholder:"my-cta",spellCheck:!1,onChange:w=>u(B=>({...B,cssClass:w.target.value}))})})]})}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(p.Typography,{variant:"pi",textColor:"neutral600",children:i({id:"components.Blocks.button.preview",defaultMessage:"Preview"})}),o.jsx(Hd,{style:{textAlign:c.alignment},children:o.jsxs(Vd,{className:c.cssClass||void 0,$bg:c.style.backgroundColor,$text:c.style.textColor,$hoverBg:c.style.hoverBackgroundColor,$hoverText:c.style.hoverTextColor,$radius:c.style.borderRadius,$fontSize:c.style.fontSize,$fontWeight:c.style.fontWeight,$padding:c.style.padding,$border:za(c)||"none",onClick:w=>w.preventDefault(),children:[T?o.jsx("span",{children:Pr(c.file?.ext)}):null,o.jsx("span",{children:S}),j?o.jsxs("span",{children:["(",Nr(c.file?.size),")"]}):null]})}),o.jsx(p.Typography,{variant:"pi",textColor:"neutral500",children:i({id:"components.Blocks.button.preview.hoverHint",defaultMessage:"Hover the button to preview hover colors."})})]})]})}),o.jsxs(Ld,{children:[o.jsx(p.Button,{variant:"danger-light",type:"button",onClick:s,children:i({id:"components.Blocks.popover.remove",defaultMessage:"Remove"})}),o.jsxs(p.Flex,{gap:2,marginLeft:"auto",children:[o.jsx(p.Button,{variant:"tertiary",type:"button",onClick:a,children:i({id:"global.cancel",defaultMessage:"Cancel"})}),o.jsx(p.Button,{type:"button",onClick:()=>r(Xd(c)),children:i({id:"global.save",defaultMessage:"Save"})})]})]})]}),h&&$?o.jsx($,{allowedTypes:["files","images","videos","audios"],onClose:()=>f(!1),onSelectAssets:E}):null]})},eu=({fill:e="currentColor",...t})=>{const r=b.useTheme()?.colors,s=r&&e in r?r[e]:e;return o.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",width:16,height:16,fill:"none",...t,children:[o.jsx("rect",{x:"2.5",y:"7.5",width:"19",height:"9",rx:"3",fill:s,opacity:"0.18",stroke:s,strokeWidth:"1.5"}),o.jsx("rect",{x:"7",y:"11",width:"10",height:"2",rx:"1",fill:s})]})},tu=e=>{const t=e.pluginOptions,n=typeof t?.buttonDefaultBackgroundColor=="string"?t.buttonDefaultBackgroundColor:"#4945ff",r=typeof t?.buttonDefaultTextColor=="string"?t.buttonDefaultTextColor:"#ffffff";return{backgroundColor:n,textColor:r,borderRadius:"4px",padding:"12px 24px",fontSize:"16px",fontWeight:"600"}},nu=e=>{const n=e.pluginOptions?.buttonPresets;return n&&typeof n=="object"?n:void 0},ns=e=>({type:"button",buttonType:"link",label:"",alignment:"center",link:{url:"",target:"_self"},showFileSize:!0,showFileIcon:!0,style:tu(e),children:[{type:"text",text:""}]}),ru=e=>{const t=he(e,ns(e));t&&(d.Transforms.removeNodes(e,{at:t}),d.Transforms.insertNodes(e,ns(e),{at:t,select:!0}))},ou=b.styled.div`
|
|
374
|
+
`,Lr=["solid","dashed","dotted","double"],Oa=e=>{const t={enabled:!1,width:"1px",style:"solid",color:"#cccccc"},n=(e??"").trim();if(n===""||n==="none")return t;const r=n.split(/\s+/),s=r.find(l=>/^[\d.]+(px|em|rem|%)$/.test(l)),a=r.find(l=>Lr.includes(l)),i=r.find(l=>l!==s&&!Lr.includes(l)&&/^#|rgb|hsl|[a-z]/i.test(l));return{enabled:!0,width:s??t.width,style:a??t.style,color:i??t.color}},za=e=>e.borderEnabled?`${e.borderWidth||"1px"} ${e.borderStyle||"solid"} ${e.borderColor||"#cccccc"}`:"",es=e=>{const{border:t,variant:n,...r}=e.style??{},s=Oa(e.style?.border);return{buttonType:e.buttonType??"link",label:e.label??"",alignment:e.alignment??"center",url:e.link?.url??"",newTab:e.link?.target==="_blank",ariaLabel:e.link?.ariaLabel??"",file:e.file,showFileSize:e.showFileSize??!0,showFileIcon:e.showFileIcon??!0,filePreview:e.filePreview??!1,variant:e.style?.variant??"custom",style:{...r},cssClass:e.cssClass??"",borderEnabled:s.enabled,borderWidth:s.width,borderStyle:s.style,borderColor:s.color}},qd=e=>{const t={};return Object.keys(e).forEach(n=>{const r=e[n];typeof r=="string"&&r.trim()!==""&&(t[n]=r)}),t},Xd=e=>{const t=za(e),n={buttonType:e.buttonType,label:e.label.trim(),alignment:e.alignment,style:{...qd(e.style),variant:e.variant,...t?{border:t}:{}},showFileSize:e.showFileSize,showFileIcon:e.showFileIcon,filePreview:e.filePreview,cssClass:e.cssClass.trim()||void 0};if(e.buttonType==="link"){const r={url:e.url.trim(),target:e.newTab?"_blank":"_self"};e.newTab&&(r.rel="noopener noreferrer"),e.ariaLabel.trim()&&(r.ariaLabel=e.ariaLabel.trim()),n.link=r}else n.file=e.file;return n},$n={primary:{backgroundColor:"#4945ff",textColor:"#ffffff",border:"none"},secondary:{backgroundColor:"#dcdce4",textColor:"#32324d",border:"none"},outline:{backgroundColor:"transparent",textColor:"#4945ff",border:"2px solid #4945ff"},filled:{backgroundColor:"#32324d",textColor:"#ffffff",border:"none"}},Yd=[{value:"primary",label:"Primary"},{value:"secondary",label:"Secondary"},{value:"outline",label:"Outline"},{value:"filled",label:"Filled"},{value:"custom",label:"Custom"}],ts=[{value:"8px 16px",labelId:"small",label:"Small"},{value:"12px 24px",labelId:"medium",label:"Medium"},{value:"16px 32px",labelId:"large",label:"Large"}],Zd=[{value:"400",label:"Normal (400)"},{value:"500",label:"Medium (500)"},{value:"600",label:"Semibold (600)"},{value:"700",label:"Bold (700)"}],Jd=["left","center","right"],J=({label:e,hint:t,children:n})=>o.jsxs(p.Flex,{direction:"column",gap:1,alignItems:"stretch",children:[e?o.jsx(p.Typography,{variant:"pi",fontWeight:"bold",textColor:"neutral700",tag:"label",children:e}):null,n,t?o.jsx(p.Typography,{variant:"pi",textColor:"neutral500",children:t}):null]}),Kt=({children:e})=>o.jsx(p.Typography,{variant:"delta",tag:"h3",children:e}),Gt=({label:e,value:t,onChange:n})=>o.jsx(J,{label:e,children:o.jsxs(p.Flex,{gap:2,alignItems:"center",children:[o.jsx(Ud,{type:"color",value:t&&/^#[0-9a-fA-F]{6}$/.test(t)?t:"#000000",onChange:r=>n(r.target.value)}),o.jsx(Wd,{value:t??"",placeholder:"-",spellCheck:!1,onChange:r=>n(r.target.value)}),t?o.jsx(Kd,{type:"button",onClick:()=>n(""),children:"Clear"}):null]})}),Qd=({open:e,element:t,presets:n,onSave:r,onRemove:s,onClose:a})=>{const{formatMessage:i}=O.useIntl(),l=Xe.useStrapiApp("ButtonEditorModal",w=>w.components),[c,u]=k.useState(()=>es(t)),[h,f]=k.useState(!1),g={primary:{...$n.primary,...n?.primary},secondary:{...$n.secondary,...n?.secondary},outline:{...$n.outline,...n?.outline},filled:{...$n.filled,...n?.filled}};k.useEffect(()=>{e&&u(es(t))},[e]);const m=w=>u(B=>({...B,style:{...B.style,...w}})),x=w=>u(B=>({...B,variant:"custom",style:{...B.style,...w}})),y=w=>u(B=>({...B,variant:"custom",...w})),v=w=>{if(w==="custom"){u(N=>({...N,variant:"custom"}));return}const B=g[w],A=Oa(B.border);u(N=>({...N,variant:w,style:{...N.style,backgroundColor:B.backgroundColor??N.style.backgroundColor,textColor:B.textColor??N.style.textColor},borderEnabled:A.enabled,borderWidth:A.width,borderStyle:A.style,borderColor:A.color}))},$=l?.["media-library"],E=w=>{const B=w[0];if(B){const A=typeof B.size=="number"?B.size:void 0,N={id:typeof B.id=="number"?B.id:void 0,url:Ad(B.url)??"",name:B.name??"file",size:A!==void 0?Math.round(A*1024):void 0,ext:B.ext??void 0,mime:B.mime??void 0};u(F=>({...F,file:N,label:F.label.trim()?F.label:_d(N.name)}))}f(!1)},C=c.style.padding??"",I=ts.some(w=>w.value===C),S=c.label.trim()||i({id:"components.Blocks.button.preview.placeholder",defaultMessage:"Button"}),T=c.buttonType==="file"&&c.showFileIcon,j=c.buttonType==="file"&&c.showFileSize&&!!c.file?.size;return o.jsxs(p.Modal.Root,{open:e,onOpenChange:w=>{w||a()},children:[o.jsxs(Nd,{children:[o.jsx(p.Modal.Header,{children:o.jsx(p.Modal.Title,{children:i({id:"components.Blocks.button.modal.title",defaultMessage:"Edit button"})})}),o.jsx(Pd,{children:o.jsxs(Od,{children:[o.jsx(zd,{children:o.jsxs(p.Flex,{direction:"column",gap:4,alignItems:"stretch",children:[o.jsx(Kt,{children:i({id:"components.Blocks.button.section.content",defaultMessage:"Content"})}),o.jsx(J,{label:i({id:"components.Blocks.button.type",defaultMessage:"Button type"}),children:o.jsx(gr,{children:["link","file"].map(w=>o.jsx(mr,{type:"button",$active:c.buttonType===w,onClick:()=>u(B=>({...B,buttonType:w})),children:i(w==="link"?{id:"components.Blocks.button.type.link",defaultMessage:"🔗 Link"}:{id:"components.Blocks.button.type.file",defaultMessage:"📁 File download"})},w))})}),o.jsx(J,{label:i({id:"components.Blocks.button.text",defaultMessage:"Text"}),children:o.jsx(Fe,{value:c.label,placeholder:"Click me",onChange:w=>u(B=>({...B,label:w.target.value}))})}),c.buttonType==="link"?o.jsxs(o.Fragment,{children:[o.jsx(J,{label:i({id:"components.Blocks.button.url",defaultMessage:"URL"}),children:o.jsx(Fe,{value:c.url,placeholder:"https://example.com",spellCheck:!1,onChange:w=>u(B=>({...B,url:w.target.value}))})}),o.jsx(p.Checkbox,{checked:c.newTab,onCheckedChange:w=>u(B=>({...B,newTab:!!w})),children:i({id:"components.Blocks.button.newTab",defaultMessage:'Open in new tab (adds rel="noopener noreferrer")'})}),o.jsx(J,{label:i({id:"components.Blocks.button.ariaLabel",defaultMessage:"ARIA label (optional)"}),children:o.jsx(Fe,{value:c.ariaLabel,placeholder:"Accessible description",onChange:w=>u(B=>({...B,ariaLabel:w.target.value}))})})]}):o.jsxs(o.Fragment,{children:[o.jsx(J,{label:i({id:"components.Blocks.button.file",defaultMessage:"File"}),children:c.file?o.jsxs(Gd,{justifyContent:"space-between",gap:2,children:[o.jsxs(p.Flex,{gap:2,alignItems:"center",overflow:"hidden",children:[o.jsx("span",{children:Pr(c.file.ext)}),o.jsxs(p.Flex,{direction:"column",alignItems:"flex-start",children:[o.jsx(p.Typography,{variant:"pi",fontWeight:"bold",ellipsis:!0,children:c.file.name}),o.jsx(p.Typography,{variant:"pi",textColor:"neutral500",children:Nr(c.file.size)})]})]}),o.jsx(p.Button,{variant:"tertiary",type:"button",disabled:!$,onClick:()=>f(!0),children:i({id:"components.Blocks.button.file.change",defaultMessage:"Change"})})]}):o.jsx(p.Button,{variant:"secondary",type:"button",disabled:!$,onClick:()=>f(!0),children:i({id:"components.Blocks.button.file.select",defaultMessage:"Select from Media Library"})})}),o.jsxs(p.Flex,{gap:4,wrap:"wrap",children:[o.jsx(p.Checkbox,{checked:c.showFileSize,onCheckedChange:w=>u(B=>({...B,showFileSize:!!w})),children:i({id:"components.Blocks.button.showFileSize",defaultMessage:"Show file size"})}),o.jsx(p.Checkbox,{checked:c.showFileIcon,onCheckedChange:w=>u(B=>({...B,showFileIcon:!!w})),children:i({id:"components.Blocks.button.showFileIcon",defaultMessage:"Show file icon"})})]}),o.jsx(J,{hint:i({id:"components.Blocks.button.filePreview.hint",defaultMessage:"On: open the file in a new tab (preview). Off: download it directly."}),children:o.jsx(p.Checkbox,{checked:c.filePreview,onCheckedChange:w=>u(B=>({...B,filePreview:!!w})),children:i({id:"components.Blocks.button.filePreview",defaultMessage:"Preview file instead of downloading"})})})]}),o.jsx(p.Divider,{}),o.jsx(Kt,{children:i({id:"components.Blocks.button.section.layout",defaultMessage:"Layout"})}),o.jsx(J,{label:i({id:"components.Blocks.button.alignment",defaultMessage:"Alignment"}),children:o.jsx(gr,{children:Jd.map(w=>o.jsx(mr,{type:"button",$active:c.alignment===w,onClick:()=>u(B=>({...B,alignment:w})),children:w.charAt(0).toUpperCase()+w.slice(1)},w))})}),o.jsx(p.Divider,{}),o.jsx(Kt,{children:i({id:"components.Blocks.button.section.colors",defaultMessage:"Colors"})}),o.jsx(J,{label:i({id:"components.Blocks.button.preset",defaultMessage:"Style preset"}),hint:i({id:"components.Blocks.button.preset.hint",defaultMessage:"Apply a brand variant, then fine-tune below. Editing colors or the border switches to Custom."}),children:o.jsx(gr,{children:Yd.map(w=>o.jsx(mr,{type:"button",$active:c.variant===w.value,onClick:()=>v(w.value),children:w.label},w.value))})}),o.jsxs(p.Flex,{gap:4,wrap:"wrap",alignItems:"flex-start",children:[o.jsx(Gt,{label:i({id:"components.Blocks.button.bgColor",defaultMessage:"Background"}),value:c.style.backgroundColor,onChange:w=>x({backgroundColor:w})}),o.jsx(Gt,{label:i({id:"components.Blocks.button.textColor",defaultMessage:"Text"}),value:c.style.textColor,onChange:w=>x({textColor:w})}),o.jsx(Gt,{label:i({id:"components.Blocks.button.hoverBgColor",defaultMessage:"Hover background"}),value:c.style.hoverBackgroundColor,onChange:w=>x({hoverBackgroundColor:w})}),o.jsx(Gt,{label:i({id:"components.Blocks.button.hoverTextColor",defaultMessage:"Hover text"}),value:c.style.hoverTextColor,onChange:w=>x({hoverTextColor:w})})]}),o.jsx(p.Divider,{}),o.jsx(Kt,{children:i({id:"components.Blocks.button.section.sizing",defaultMessage:"Sizing & typography"})}),o.jsxs(p.Flex,{gap:4,wrap:"wrap",alignItems:"flex-start",children:[o.jsx(J,{label:i({id:"components.Blocks.button.borderRadius",defaultMessage:"Border radius"}),children:o.jsx(Fe,{value:c.style.borderRadius??"",placeholder:"4px",onChange:w=>m({borderRadius:w.target.value})})}),o.jsx(J,{label:i({id:"components.Blocks.button.fontSize",defaultMessage:"Font size"}),children:o.jsx(Fe,{value:c.style.fontSize??"",placeholder:"16px",onChange:w=>m({fontSize:w.target.value})})})]}),o.jsx(J,{label:i({id:"components.Blocks.button.fontWeight",defaultMessage:"Font weight"}),children:o.jsxs(p.SingleSelect,{value:c.style.fontWeight||"inherit",onChange:w=>m({fontWeight:w==="inherit"?"":String(w)}),children:[o.jsx(p.SingleSelectOption,{value:"inherit",children:i({id:"components.Blocks.button.default",defaultMessage:"Default"})}),Zd.map(w=>o.jsx(p.SingleSelectOption,{value:w.value,children:w.label},w.value))]})}),o.jsx(J,{label:i({id:"components.Blocks.button.padding",defaultMessage:"Padding"}),hint:i({id:"components.Blocks.button.padding.hint",defaultMessage:"Pick a preset or type a custom CSS padding value."}),children:o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsxs(p.SingleSelect,{value:I?C:"custom",onChange:w=>{w!=="custom"&&m({padding:String(w)})},children:[ts.map(w=>o.jsxs(p.SingleSelectOption,{value:w.value,children:[w.label," (",w.value,")"]},w.value)),o.jsx(p.SingleSelectOption,{value:"custom",children:i({id:"components.Blocks.button.padding.custom",defaultMessage:"Custom…"})})]}),o.jsx(Fe,{value:C,placeholder:"12px 24px",onChange:w=>m({padding:w.target.value})})]})}),o.jsx(J,{label:i({id:"components.Blocks.button.border",defaultMessage:"Border"}),children:o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(p.Checkbox,{checked:c.borderEnabled,onCheckedChange:w=>y({borderEnabled:!!w}),children:i({id:"components.Blocks.button.border.enable",defaultMessage:"Show border"})}),c.borderEnabled?o.jsxs(p.Flex,{gap:4,wrap:"wrap",alignItems:"flex-start",children:[o.jsx(J,{label:i({id:"components.Blocks.button.border.width",defaultMessage:"Thickness"}),children:o.jsx(Fe,{value:c.borderWidth,placeholder:"1px",onChange:w=>y({borderWidth:w.target.value})})}),o.jsx(J,{label:i({id:"components.Blocks.button.border.style",defaultMessage:"Style"}),children:o.jsx(p.SingleSelect,{value:c.borderStyle,onChange:w=>y({borderStyle:String(w)}),children:Lr.map(w=>o.jsx(p.SingleSelectOption,{value:w,children:w.charAt(0).toUpperCase()+w.slice(1)},w))})}),o.jsx(Gt,{label:i({id:"components.Blocks.button.border.color",defaultMessage:"Color"}),value:c.borderColor,onChange:w=>y({borderColor:w})})]}):null]})}),o.jsx(p.Divider,{}),o.jsx(Kt,{children:i({id:"components.Blocks.button.section.advanced",defaultMessage:"Advanced"})}),o.jsx(J,{label:i({id:"components.Blocks.button.cssClass",defaultMessage:"Custom CSS class"}),hint:i({id:"components.Blocks.button.cssClass.hint",defaultMessage:"Applied to the rendered button for frontend theming."}),children:o.jsx(Fe,{value:c.cssClass,placeholder:"my-cta",spellCheck:!1,onChange:w=>u(B=>({...B,cssClass:w.target.value}))})})]})}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(p.Typography,{variant:"pi",textColor:"neutral600",children:i({id:"components.Blocks.button.preview",defaultMessage:"Preview"})}),o.jsx(Hd,{style:{textAlign:c.alignment},children:o.jsxs(Vd,{className:c.cssClass||void 0,$bg:c.style.backgroundColor,$text:c.style.textColor,$hoverBg:c.style.hoverBackgroundColor,$hoverText:c.style.hoverTextColor,$radius:c.style.borderRadius,$fontSize:c.style.fontSize,$fontWeight:c.style.fontWeight,$padding:c.style.padding,$border:za(c)||"none",onClick:w=>w.preventDefault(),children:[T?o.jsx("span",{children:Pr(c.file?.ext)}):null,o.jsx("span",{children:S}),j?o.jsxs("span",{children:["(",Nr(c.file?.size),")"]}):null]})}),o.jsx(p.Typography,{variant:"pi",textColor:"neutral500",children:i({id:"components.Blocks.button.preview.hoverHint",defaultMessage:"Hover the button to preview hover colors."})})]})]})}),o.jsxs(Ld,{children:[o.jsx(p.Button,{variant:"danger-light",type:"button",onClick:s,children:i({id:"components.Blocks.popover.remove",defaultMessage:"Remove"})}),o.jsxs(p.Flex,{gap:2,marginLeft:"auto",children:[o.jsx(p.Button,{variant:"tertiary",type:"button",onClick:a,children:i({id:"global.cancel",defaultMessage:"Cancel"})}),o.jsx(p.Button,{type:"button",onClick:()=>r(Xd(c)),children:i({id:"global.save",defaultMessage:"Save"})})]})]})]}),h&&$?o.jsx($,{allowedTypes:["files","images","videos","audios"],onClose:()=>f(!1),onSelectAssets:E}):null]})},eu=({fill:e="currentColor",...t})=>{const r=b.useTheme()?.colors,s=r&&e in r?r[e]:e;return o.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",width:16,height:16,fill:"none",...t,children:[o.jsx("rect",{x:"2.5",y:"7.5",width:"19",height:"9",rx:"3",fill:s,opacity:"0.18",stroke:s,strokeWidth:"1.5"}),o.jsx("rect",{x:"7",y:"11",width:"10",height:"2",rx:"1",fill:s})]})},tu=e=>{const t=e.pluginOptions,n=typeof t?.buttonDefaultBackgroundColor=="string"?t.buttonDefaultBackgroundColor:"#4945ff",r=typeof t?.buttonDefaultTextColor=="string"?t.buttonDefaultTextColor:"#ffffff";return{backgroundColor:n,textColor:r,borderRadius:"4px",padding:"12px 24px",fontSize:"16px",fontWeight:"600"}},nu=e=>{const n=e.pluginOptions?.buttonPresets;return n&&typeof n=="object"?n:void 0},ns=e=>({type:"button",buttonType:"link",label:"",alignment:"center",link:{url:"",target:"_self"},showFileSize:!0,showFileIcon:!0,style:tu(e),children:[{type:"text",text:""}]}),ru=e=>{const t=he(e,ns(e));t&&(d.Transforms.removeNodes(e,{at:t}),d.Transforms.insertNodes(e,ns(e),{at:t,select:!0}))},ou=b.styled.div`
|
|
375
375
|
margin: ${({theme:e})=>e.spaces[2]} 0;
|
|
376
376
|
`,su=b.styled.span`
|
|
377
377
|
display: inline-flex;
|
|
@@ -722,7 +722,7 @@
|
|
|
722
722
|
.katex {
|
|
723
723
|
font-size: 2.4rem;
|
|
724
724
|
}
|
|
725
|
-
`,Xa=({open:e,title:t,label:n,placeholder:r,source:s,onSourceChange:a,renderPreview:i,onSave:l,onRemove:c,onClose:u})=>{const{formatMessage:h}=O.useIntl(),f=k.useRef(null),[g,m]=k.useState(1),x=.25,y=4,v=1.25,$=S=>Math.min(y,Math.max(x,S)),E=()=>m(S=>$(S*v)),C=()=>m(S=>$(S/v)),I=()=>m(1);return k.useEffect(()=>{if(e){m(1);const S=window.setTimeout(()=>f.current?.focus(),0);return()=>window.clearTimeout(S)}},[e]),o.jsx(p.Modal.Root,{open:e,onOpenChange:S=>{S||u()},children:o.jsxs(Xu,{children:[o.jsx(p.Modal.Header,{children:o.jsx(p.Modal.Title,{children:t})}),o.jsx(Yu,{children:o.jsxs(Ju,{children:[o.jsxs(ss,{direction:"column",gap:1,alignItems:"stretch",children:[o.jsx(p.Typography,{variant:"pi",textColor:"neutral600",tag:"label",children:n}),o.jsx(Qu,{ref:f,value:s,spellCheck:!1,placeholder:r,onChange:S=>a(S.target.value),onKeyDown:S=>{S.key==="Enter"&&(S.metaKey||S.ctrlKey)&&(S.preventDefault(),l())}})]}),o.jsxs(ss,{direction:"column",gap:1,alignItems:"stretch",children:[o.jsxs(p.Flex,{justifyContent:"space-between",alignItems:"center",children:[o.jsx(p.Typography,{variant:"pi",textColor:"neutral600",children:h({id:"components.Blocks.sourceEditor.preview",defaultMessage:"Preview"})}),s.trim()?o.jsxs(p.Flex,{gap:1,alignItems:"center",children:[o.jsx(p.IconButton,{variant:"ghost",onClick:C,disabled:g<=x,label:h({id:"components.Blocks.sourceEditor.zoomOut",defaultMessage:"Zoom out"}),children:o.jsx(D.Minus,{})}),o.jsxs(p.Typography,{variant:"pi",textColor:"neutral600",style:{minWidth:"4ch",textAlign:"center"},children:[Math.round(g*100),"%"]}),o.jsx(p.IconButton,{variant:"ghost",onClick:E,disabled:g>=y,label:h({id:"components.Blocks.sourceEditor.zoomIn",defaultMessage:"Zoom in"}),children:o.jsx(D.Plus,{})}),o.jsx(p.IconButton,{variant:"ghost",onClick:I,disabled:g===1,label:h({id:"components.Blocks.sourceEditor.zoomReset",defaultMessage:"Reset zoom"}),children:o.jsx(D.ArrowClockwise,{})})]}):null]}),o.jsx(ep,{children:o.jsx(tp,{$scale:g,children:s.trim()?i(s):o.jsx(p.Typography,{variant:"pi",textColor:"neutral400",children:"
|
|
725
|
+
`,Xa=({open:e,title:t,label:n,placeholder:r,source:s,onSourceChange:a,renderPreview:i,onSave:l,onRemove:c,onClose:u})=>{const{formatMessage:h}=O.useIntl(),f=k.useRef(null),[g,m]=k.useState(1),x=.25,y=4,v=1.25,$=S=>Math.min(y,Math.max(x,S)),E=()=>m(S=>$(S*v)),C=()=>m(S=>$(S/v)),I=()=>m(1);return k.useEffect(()=>{if(e){m(1);const S=window.setTimeout(()=>f.current?.focus(),0);return()=>window.clearTimeout(S)}},[e]),o.jsx(p.Modal.Root,{open:e,onOpenChange:S=>{S||u()},children:o.jsxs(Xu,{children:[o.jsx(p.Modal.Header,{children:o.jsx(p.Modal.Title,{children:t})}),o.jsx(Yu,{children:o.jsxs(Ju,{children:[o.jsxs(ss,{direction:"column",gap:1,alignItems:"stretch",children:[o.jsx(p.Typography,{variant:"pi",textColor:"neutral600",tag:"label",children:n}),o.jsx(Qu,{ref:f,value:s,spellCheck:!1,placeholder:r,onChange:S=>a(S.target.value),onKeyDown:S=>{S.key==="Enter"&&(S.metaKey||S.ctrlKey)&&(S.preventDefault(),l())}})]}),o.jsxs(ss,{direction:"column",gap:1,alignItems:"stretch",children:[o.jsxs(p.Flex,{justifyContent:"space-between",alignItems:"center",children:[o.jsx(p.Typography,{variant:"pi",textColor:"neutral600",children:h({id:"components.Blocks.sourceEditor.preview",defaultMessage:"Preview"})}),s.trim()?o.jsxs(p.Flex,{gap:1,alignItems:"center",children:[o.jsx(p.IconButton,{variant:"ghost",onClick:C,disabled:g<=x,label:h({id:"components.Blocks.sourceEditor.zoomOut",defaultMessage:"Zoom out"}),children:o.jsx(D.Minus,{})}),o.jsxs(p.Typography,{variant:"pi",textColor:"neutral600",style:{minWidth:"4ch",textAlign:"center"},children:[Math.round(g*100),"%"]}),o.jsx(p.IconButton,{variant:"ghost",onClick:E,disabled:g>=y,label:h({id:"components.Blocks.sourceEditor.zoomIn",defaultMessage:"Zoom in"}),children:o.jsx(D.Plus,{})}),o.jsx(p.IconButton,{variant:"ghost",onClick:I,disabled:g===1,label:h({id:"components.Blocks.sourceEditor.zoomReset",defaultMessage:"Reset zoom"}),children:o.jsx(D.ArrowClockwise,{})})]}):null]}),o.jsx(ep,{children:o.jsx(tp,{$scale:g,children:s.trim()?i(s):o.jsx(p.Typography,{variant:"pi",textColor:"neutral400",children:"-"})})})]})]})}),o.jsxs(Zu,{children:[o.jsx(p.Button,{variant:"danger-light",onClick:c,children:h({id:"components.Blocks.popover.remove",defaultMessage:"Remove"})}),o.jsxs(p.Flex,{gap:2,marginLeft:"auto",children:[o.jsx(p.Button,{variant:"tertiary",onClick:u,children:h({id:"global.cancel",defaultMessage:"Cancel"})}),o.jsx(p.Button,{onClick:l,children:h({id:"global.save",defaultMessage:"Save"})})]})]})]})})},Ya=({fill:e="currentColor",...t})=>{const r=b.useTheme()?.colors,s=r&&e in r?r[e]:e;return o.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",width:16,height:16,fill:"none",stroke:s,strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",...t,children:[o.jsx("rect",{x:"8.5",y:"2.5",width:"7",height:"5",rx:"1"}),o.jsx("rect",{x:"2.5",y:"16.5",width:"7",height:"5",rx:"1"}),o.jsx("rect",{x:"14.5",y:"16.5",width:"7",height:"5",rx:"1"}),o.jsx("path",{d:"M12 7.5v4"}),o.jsx("path",{d:"M6 16.5v-2a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v2"})]})};let as=0;const np=e=>{if(!e)return!1;const t=e.trim().replace("#","");if(t.length!==3&&t.length!==6)return!1;const n=t.length===3?t.split("").map(i=>i+i).join(""):t,r=parseInt(n.slice(0,2),16),s=parseInt(n.slice(2,4),16),a=parseInt(n.slice(4,6),16);return(.299*r+.587*s+.114*a)/255<.5},is=({value:e,isDark:t})=>{const{formatMessage:n}=O.useIntl(),[r,s]=k.useState(null),[a,i]=k.useState(!1);return k.useEffect(()=>{let l=!1;if(e.trim()===""){s(null),i(!1);return}return(async()=>{try{const c=(await import("mermaid")).default;c.initialize({startOnLoad:!1,theme:t?"dark":"default",securityLevel:"strict"}),await c.parse(e),as+=1;const{svg:u}=await c.render(`bb-mermaid-${as}`,e);l||(s(u),i(!1))}catch{l||(s(null),i(!0))}})(),()=>{l=!0}},[e,t]),a?o.jsx(p.Typography,{variant:"pi",textColor:"danger600",children:n({id:"components.Blocks.diagram.invalid",defaultMessage:"Invalid diagram"})}):r===null?o.jsx(p.Typography,{variant:"pi",textColor:"neutral400",children:"…"}):o.jsx("span",{dangerouslySetInnerHTML:{__html:r}})},ho=e=>{const t=he(e,{type:"diagram",format:"mermaid",value:"",children:[{type:"text",text:""}]});t&&(d.Transforms.removeNodes(e,{at:t}),d.Transforms.insertNodes(e,{type:"diagram",format:"mermaid",value:"",children:[{type:"text",text:""}]},{at:t,select:!0}))},rp=b.styled.div`
|
|
726
726
|
margin: ${({theme:e})=>e.spaces[2]} 0;
|
|
727
727
|
padding: ${({theme:e})=>e.spaces[4]};
|
|
728
728
|
text-align: center;
|
|
@@ -877,7 +877,7 @@
|
|
|
877
877
|
color: ${({theme:e})=>e.colors.neutral500};
|
|
878
878
|
`,Sp=b.styled(p.Typography)`
|
|
879
879
|
color: ${({theme:e})=>e.colors.danger600};
|
|
880
|
-
`,Je=({children:e})=>o.jsx(p.Typography,{variant:"pi",fontWeight:"bold",textColor:"neutral700",children:e}),Tp=["left","center","right","none"],Mp=({open:e,element:t,onSave:n,onRemove:r,onClose:s})=>{const{formatMessage:a}=O.useIntl(),[i,l]=k.useState({source:t.source??"url",url:t.url,iframe:t.iframe,aspectRatio:t.aspectRatio??"16:9",customAspectRatio:t.customAspectRatio,alignment:t.alignment??"center",caption:t.caption,title:t.title}),c=y=>l(v=>({...v,...y})),u=k.useMemo(()=>{if(i.source==="url"){const $=(i.url??"").trim();if(!$)return{error:null};const E=ei($,i.title);if(!E)return{error:a({id:"components.Blocks.embed.error.unknownUrl",defaultMessage:"That URL isn't a provider we can embed automatically. Switch to the Embed code tab and paste the platform's iframe instead."})};const C=Qa($);return{error:null,embedHtml:E.html,embedSrc:E.src,provider:C,thumbnail:Or($)??void 0}}const y=(i.iframe??"").trim();if(!y)return{error:null};const v=bp(y);return v.error?{error:{"no-iframe":a({id:"components.Blocks.embed.error.noIframe",defaultMessage:"No <iframe> found in that snippet. Paste the full embed code from the platform."}),"no-src":a({id:"components.Blocks.embed.error.noSrc",defaultMessage:"That iframe has no src attribute."}),"insecure-src":a({id:"components.Blocks.embed.error.insecureSrc",defaultMessage:"Only https:// embeds are allowed. Scripts and other embed types are stripped for security."})}[v.error]}:{error:null,embedHtml:v.html,embedSrc:v.src,provider:"generic",width:v.width,height:v.height}},[i.source,i.url,i.iframe,i.title,a]),h=k.useMemo(()=>yp(u.width,u.height),[u.width,u.height]),f=k.useRef(null);k.useEffect(()=>{if(!h)return;const y=`${u.embedSrc}:${h}`;f.current!==y&&(f.current=y,l(v=>({...v,aspectRatio:h})))},[h,u.embedSrc]);const g=i.aspectRatio==="custom"?i.customAspectRatio||"16 / 9":Jn(i.aspectRatio),m=!!u.embedHtml,x=()=>{u.embedHtml&&n({...i,url:i.source==="url"?i.url?.trim():void 0,iframe:i.source==="iframe"?i.iframe?.trim():void 0,embedHtml:u.embedHtml,embedSrc:u.embedSrc,provider:u.provider,thumbnail:u.thumbnail})};return o.jsx(p.Modal.Root,{open:e,onOpenChange:y=>{y||s()},children:o.jsxs(xp,{children:[o.jsx(p.Modal.Header,{children:o.jsx(p.Modal.Title,{children:a({id:"components.Blocks.embed.modal.title",defaultMessage:"Embed"})})}),o.jsxs(vp,{children:[o.jsxs(Ep,{children:[o.jsx(ds,{type:"button",$active:i.source==="url",onClick:()=>c({source:"url"}),children:a({id:"components.Blocks.embed.tab.url",defaultMessage:"URL"})}),o.jsx(ds,{type:"button",$active:i.source==="iframe",onClick:()=>c({source:"iframe"}),children:a({id:"components.Blocks.embed.tab.code",defaultMessage:"Embed code"})})]}),i.source==="url"?o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Je,{children:a({id:"components.Blocks.embed.field.url",defaultMessage:"Video or page URL"})}),o.jsx(En,{type:"url",autoFocus:!0,placeholder:"https://www.youtube.com/watch?v=…",value:i.url??"",onChange:y=>c({url:y.target.value})}),o.jsx(kr,{variant:"pi",children:a({id:"components.Blocks.embed.hint.url",defaultMessage:"YouTube, Vimeo, Loom, Wistia, Dailymotion and api.video are converted automatically. For anything else, use the Embed code tab."})})]}):o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Je,{children:a({id:"components.Blocks.embed.field.code",defaultMessage:"Embed code"})}),o.jsx(wp,{autoFocus:!0,spellCheck:!1,placeholder:'<iframe src="https://…" allowfullscreen></iframe>',value:i.iframe??"",onChange:y=>c({iframe:y.target.value})}),o.jsx(kr,{variant:"pi",children:a({id:"components.Blocks.embed.hint.code",defaultMessage:"Only the <iframe> is kept
|
|
880
|
+
`,Je=({children:e})=>o.jsx(p.Typography,{variant:"pi",fontWeight:"bold",textColor:"neutral700",children:e}),Tp=["left","center","right","none"],Mp=({open:e,element:t,onSave:n,onRemove:r,onClose:s})=>{const{formatMessage:a}=O.useIntl(),[i,l]=k.useState({source:t.source??"url",url:t.url,iframe:t.iframe,aspectRatio:t.aspectRatio??"16:9",customAspectRatio:t.customAspectRatio,alignment:t.alignment??"center",caption:t.caption,title:t.title}),c=y=>l(v=>({...v,...y})),u=k.useMemo(()=>{if(i.source==="url"){const $=(i.url??"").trim();if(!$)return{error:null};const E=ei($,i.title);if(!E)return{error:a({id:"components.Blocks.embed.error.unknownUrl",defaultMessage:"That URL isn't a provider we can embed automatically. Switch to the Embed code tab and paste the platform's iframe instead."})};const C=Qa($);return{error:null,embedHtml:E.html,embedSrc:E.src,provider:C,thumbnail:Or($)??void 0}}const y=(i.iframe??"").trim();if(!y)return{error:null};const v=bp(y);return v.error?{error:{"no-iframe":a({id:"components.Blocks.embed.error.noIframe",defaultMessage:"No <iframe> found in that snippet. Paste the full embed code from the platform."}),"no-src":a({id:"components.Blocks.embed.error.noSrc",defaultMessage:"That iframe has no src attribute."}),"insecure-src":a({id:"components.Blocks.embed.error.insecureSrc",defaultMessage:"Only https:// embeds are allowed. Scripts and other embed types are stripped for security."})}[v.error]}:{error:null,embedHtml:v.html,embedSrc:v.src,provider:"generic",width:v.width,height:v.height}},[i.source,i.url,i.iframe,i.title,a]),h=k.useMemo(()=>yp(u.width,u.height),[u.width,u.height]),f=k.useRef(null);k.useEffect(()=>{if(!h)return;const y=`${u.embedSrc}:${h}`;f.current!==y&&(f.current=y,l(v=>({...v,aspectRatio:h})))},[h,u.embedSrc]);const g=i.aspectRatio==="custom"?i.customAspectRatio||"16 / 9":Jn(i.aspectRatio),m=!!u.embedHtml,x=()=>{u.embedHtml&&n({...i,url:i.source==="url"?i.url?.trim():void 0,iframe:i.source==="iframe"?i.iframe?.trim():void 0,embedHtml:u.embedHtml,embedSrc:u.embedSrc,provider:u.provider,thumbnail:u.thumbnail})};return o.jsx(p.Modal.Root,{open:e,onOpenChange:y=>{y||s()},children:o.jsxs(xp,{children:[o.jsx(p.Modal.Header,{children:o.jsx(p.Modal.Title,{children:a({id:"components.Blocks.embed.modal.title",defaultMessage:"Embed"})})}),o.jsxs(vp,{children:[o.jsxs(Ep,{children:[o.jsx(ds,{type:"button",$active:i.source==="url",onClick:()=>c({source:"url"}),children:a({id:"components.Blocks.embed.tab.url",defaultMessage:"URL"})}),o.jsx(ds,{type:"button",$active:i.source==="iframe",onClick:()=>c({source:"iframe"}),children:a({id:"components.Blocks.embed.tab.code",defaultMessage:"Embed code"})})]}),i.source==="url"?o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Je,{children:a({id:"components.Blocks.embed.field.url",defaultMessage:"Video or page URL"})}),o.jsx(En,{type:"url",autoFocus:!0,placeholder:"https://www.youtube.com/watch?v=…",value:i.url??"",onChange:y=>c({url:y.target.value})}),o.jsx(kr,{variant:"pi",children:a({id:"components.Blocks.embed.hint.url",defaultMessage:"YouTube, Vimeo, Loom, Wistia, Dailymotion and api.video are converted automatically. For anything else, use the Embed code tab."})})]}):o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Je,{children:a({id:"components.Blocks.embed.field.code",defaultMessage:"Embed code"})}),o.jsx(wp,{autoFocus:!0,spellCheck:!1,placeholder:'<iframe src="https://…" allowfullscreen></iframe>',value:i.iframe??"",onChange:y=>c({iframe:y.target.value})}),o.jsx(kr,{variant:"pi",children:a({id:"components.Blocks.embed.hint.code",defaultMessage:"Only the <iframe> is kept - scripts, event handlers and unknown attributes are removed before saving."})})]}),u.error?o.jsx(Sp,{variant:"pi",children:u.error}):null,u.embedHtml?o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Je,{children:a({id:"components.Blocks.embed.field.preview",defaultMessage:"Preview"})}),o.jsx(Cp,{$ratio:g,dangerouslySetInnerHTML:{__html:u.embedHtml}}),o.jsx(kr,{variant:"pi",children:a({id:"components.Blocks.embed.hint.provider",defaultMessage:"Detected: {provider}. The preview only renders if its host is allowed in your admin frame-src CSP."},{provider:Ja(u.provider)})})]}):null,o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Je,{children:a({id:"components.Blocks.embed.field.title",defaultMessage:"Title (accessible name, optional)"})}),o.jsx(En,{type:"text",value:i.title??"",onChange:y=>c({title:y.target.value})})]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Je,{children:a({id:"components.Blocks.embed.field.caption",defaultMessage:"Caption (optional)"})}),o.jsx(En,{type:"text",value:i.caption??"",onChange:y=>c({caption:y.target.value})})]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Je,{children:a({id:"components.Blocks.embed.field.aspectRatio",defaultMessage:"Aspect ratio"})}),o.jsxs(p.Flex,{gap:2,alignItems:"center",wrap:"wrap",children:[o.jsxs(kp,{value:i.aspectRatio,onChange:y=>c({aspectRatio:y.target.value}),children:[zr.map(y=>o.jsx("option",{value:y,children:y},y)),o.jsx("option",{value:"custom",children:a({id:"components.Blocks.embed.aspectRatio.custom",defaultMessage:"Custom"})})]}),i.aspectRatio==="custom"?o.jsx(En,{type:"text",style:{maxWidth:160},placeholder:"3 / 2",value:i.customAspectRatio??"",onChange:y=>c({customAspectRatio:y.target.value})}):null]})]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Je,{children:a({id:"components.Blocks.embed.field.alignment",defaultMessage:"Alignment"})}),o.jsx(jp,{children:Tp.map(y=>o.jsx($p,{type:"button",$active:i.alignment===y,onClick:()=>c({alignment:y}),children:y},y))})]})]}),o.jsxs(p.Modal.Footer,{children:[o.jsx(p.Button,{variant:"danger-light",type:"button",onClick:r,children:a({id:"components.Blocks.popover.remove",defaultMessage:"Remove"})}),o.jsxs(p.Flex,{gap:2,marginLeft:"auto",children:[o.jsx(p.Button,{variant:"tertiary",type:"button",onClick:s,children:a({id:"global.cancel",defaultMessage:"Cancel"})}),o.jsx(p.Button,{type:"button",disabled:!m,onClick:x,children:a({id:"global.save",defaultMessage:"Save"})})]})]})]})})},ti=()=>({type:"embed",source:"url",aspectRatio:"16:9",alignment:"center",children:[{type:"text",text:""}]}),ni=(e,t)=>{const n={...ti(),...t},r=he(e,n);r&&(d.Transforms.removeNodes(e,{at:r}),d.Transforms.insertNodes(e,n,{at:r,select:!0}))},Bp=(e,t)=>{const n=t.trim(),r=ei(n);if(!r)return!1;const s={...ti(),url:n,embedHtml:r.html,embedSrc:r.src,provider:Qa(n),...Or(n)?{thumbnail:Or(n)}:{}},a={type:"paragraph",children:[{type:"text",text:""}]};return d.Transforms.insertNodes(e,[s,a]),!0},Ip=b.styled.div`
|
|
881
881
|
margin: ${({theme:e})=>e.spaces[2]} 0;
|
|
882
882
|
display: flex;
|
|
883
883
|
justify-content: ${({$align:e})=>e==="left"?"flex-start":e==="right"?"flex-end":e==="none"?"stretch":"center"};
|
|
@@ -927,7 +927,7 @@
|
|
|
927
927
|
border-radius: ${({theme:e})=>e.borderRadius};
|
|
928
928
|
background: ${({theme:e})=>e.colors.neutral100};
|
|
929
929
|
color: ${({theme:e})=>e.colors.neutral600};
|
|
930
|
-
`,Pp=["source","url","iframe","embedHtml","embedSrc","provider","thumbnail","aspectRatio","customAspectRatio","alignment","caption","title"],Lp=["url","iframe","thumbnail","customAspectRatio","caption","title"],Op=({attributes:e,children:t,element:n})=>{const r=n,{editor:s,disabled:a}=P("Embed"),i=R.useSelected(),l=(r.embedHtml??"").trim()!=="",[c,u]=k.useState(!l&&!a),h=r.alignment??"center",f=r.aspectRatio==="custom"?r.customAspectRatio||"16 / 9":Jn(r.aspectRatio),g=()=>{try{return R.ReactEditor.findPath(s,r)}catch{return null}},m=()=>{const $=g();$&&(s.children.length===1?(d.Transforms.setNodes(s,{type:"paragraph"},{at:$}),d.Transforms.unsetNodes(s,Pp,{at:$})):d.Transforms.removeNodes(s,{at:$}))},x=$=>{const E=g();if(E){d.Transforms.setNodes(s,$,{at:E});const C=Lp.filter(I=>$[I]===void 0||$[I]==="");C.length&&d.Transforms.unsetNodes(s,C,{at:E})}u(!1),R.ReactEditor.focus(s)},y=()=>{m(),u(!1),R.ReactEditor.focus(s)},v=()=>{l||m(),u(!1)};return o.jsxs(p.Box,{...e,children:[t,o.jsx(Ip,{$align:h,contentEditable:!1,children:l?o.jsxs(Rp,{$selected:i,$full:h==="none",onMouseDown:$=>{$.preventDefault(),a||u(!0)},children:[o.jsxs(Fp,{children:[o.jsx(Dp,{$ratio:f,dangerouslySetInnerHTML:{__html:r.embedHtml}}),o.jsx(_p,{children:Ja(r.provider)}),o.jsx(Ap,{})]}),r.caption?o.jsx(p.Typography,{variant:"pi",textColor:"neutral600",fontWeight:"semiBold",children:r.caption}):null]}):o.jsxs(Np,{alignItems:"center",gap:2,children:[o.jsx(D.Code,{}),o.jsx(p.Typography,{variant:"pi",children:"Embed
|
|
930
|
+
`,Pp=["source","url","iframe","embedHtml","embedSrc","provider","thumbnail","aspectRatio","customAspectRatio","alignment","caption","title"],Lp=["url","iframe","thumbnail","customAspectRatio","caption","title"],Op=({attributes:e,children:t,element:n})=>{const r=n,{editor:s,disabled:a}=P("Embed"),i=R.useSelected(),l=(r.embedHtml??"").trim()!=="",[c,u]=k.useState(!l&&!a),h=r.alignment??"center",f=r.aspectRatio==="custom"?r.customAspectRatio||"16 / 9":Jn(r.aspectRatio),g=()=>{try{return R.ReactEditor.findPath(s,r)}catch{return null}},m=()=>{const $=g();$&&(s.children.length===1?(d.Transforms.setNodes(s,{type:"paragraph"},{at:$}),d.Transforms.unsetNodes(s,Pp,{at:$})):d.Transforms.removeNodes(s,{at:$}))},x=$=>{const E=g();if(E){d.Transforms.setNodes(s,$,{at:E});const C=Lp.filter(I=>$[I]===void 0||$[I]==="");C.length&&d.Transforms.unsetNodes(s,C,{at:E})}u(!1),R.ReactEditor.focus(s)},y=()=>{m(),u(!1),R.ReactEditor.focus(s)},v=()=>{l||m(),u(!1)};return o.jsxs(p.Box,{...e,children:[t,o.jsx(Ip,{$align:h,contentEditable:!1,children:l?o.jsxs(Rp,{$selected:i,$full:h==="none",onMouseDown:$=>{$.preventDefault(),a||u(!0)},children:[o.jsxs(Fp,{children:[o.jsx(Dp,{$ratio:f,dangerouslySetInnerHTML:{__html:r.embedHtml}}),o.jsx(_p,{children:Ja(r.provider)}),o.jsx(Ap,{})]}),r.caption?o.jsx(p.Typography,{variant:"pi",textColor:"neutral600",fontWeight:"semiBold",children:r.caption}):null]}):o.jsxs(Np,{alignItems:"center",gap:2,children:[o.jsx(D.Code,{}),o.jsx(p.Typography,{variant:"pi",children:"Embed - click to add a URL or embed code."})]})}),c&&!a?o.jsx(Mp,{open:!0,element:r,onSave:x,onRemove:y,onClose:v}):null]})},zp=e=>{const{isVoid:t}=e;return e.isVoid=n=>ld(n)?!0:t(n),e},Hp={embed:{renderElement:e=>o.jsx(Op,{...e}),icon:D.Code,label:{id:"components.Blocks.blocks.embed",defaultMessage:"Embed"},matchNode:e=>e.type==="embed",isInBlocksSelector:!0,handleConvert(e){ni(e)},handleBackspaceKey(e){e.children.length===1?d.Transforms.setNodes(e,{type:"paragraph"}):d.Transforms.removeNodes(e)},handleEnterKey(e){d.Transforms.insertNodes(e,{type:"paragraph",children:[{type:"text",text:""}]})}}},ri=/(?:youtube\.com\/(?:watch\?v=|embed\/|shorts\/)|youtu\.be\/)([a-zA-Z0-9_-]{11})/,oi=/(?:vimeo\.com\/)(\d+)/,Up=e=>{const t=e.match(ri);return t?`https://img.youtube.com/vi/${t[1]}/hqdefault.jpg`:(e.match(oi),null)},Wp=e=>ri.test(e)?"YouTube":oi.test(e)?"Vimeo":"Video",Kp=b.styled(p.Box)`
|
|
931
931
|
position: relative;
|
|
932
932
|
width: 100%;
|
|
933
933
|
aspect-ratio: 16 / 9;
|
|
@@ -1079,7 +1079,7 @@
|
|
|
1079
1079
|
`,hh=b.styled.div`
|
|
1080
1080
|
color: ${({theme:e})=>e.colors.danger600};
|
|
1081
1081
|
font-size: 13px;
|
|
1082
|
-
`,Vt=({children:e})=>o.jsx(p.Typography,{variant:"pi",fontWeight:"bold",textColor:"neutral700",children:e}),fh=["left","center","right"],gh=({open:e,element:t,enabledPlatforms:n,onSave:r,onRemove:s,onClose:a})=>{const{formatMessage:i}=O.useIntl(),{get:l}=Xe.useFetchClient(),c=n&&n.length>0?n:Hr,[u,h]=k.useState({platform:t.platform??c[0],url:t.url??"",embedCode:t.embedCode,oembed:t.oembed,alignment:t.alignment??"center",caption:t.caption}),[f,g]=k.useState(!1),[m,x]=k.useState(null),y=T=>h(j=>({...j,...T})),v=T=>{const j=us(T);y({url:T,oembed:void 0,...j?{platform:j}:{}}),x(null)},$=T=>{const j=T.trim()===""?"":T;if(j&&!u.url.trim()){const w=nh(j),B=w?us(w):null;y({embedCode:j,...w?{url:w}:{},...B?{platform:B}:{}});return}y({embedCode:j})},E=async()=>{if(u.url.trim()){g(!0),x(null);try{const j=(await l(`/better-blocks/oembed?url=${encodeURIComponent(u.url.trim())}&platform=${u.platform}`)).data;y({oembed:{html:j.html??void 0,title:j.title,author:j.author,authorUrl:j.authorUrl,thumbnailUrl:j.thumbnailUrl,providerName:j.providerName,width:j.width,height:j.height}})}catch(T){const j=T?.response?.data?.error?.message||T?.message||"Failed to fetch embed.";x(j)}finally{g(!1)}}},C=u.oembed,I=jt[u.platform],S=!!(u.url.trim()||u.embedCode?.trim());return o.jsx(p.Modal.Root,{open:e,onOpenChange:T=>{T||a()},children:o.jsxs(rh,{children:[o.jsx(p.Modal.Header,{children:o.jsx(p.Modal.Title,{children:i({id:"components.Blocks.social.modal.title",defaultMessage:"Social media embed"})})}),o.jsxs(oh,{children:[o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Vt,{children:i({id:"components.Blocks.social.field.platform",defaultMessage:"Platform"})}),o.jsx(sh,{children:c.map(T=>o.jsxs(ah,{type:"button",$active:u.platform===T,$color:jt[T].color,onClick:()=>y({platform:T}),children:[o.jsx(ih,{children:jt[T].icon}),jt[T].label]},T))})]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Vt,{children:i({id:"components.Blocks.social.field.url",defaultMessage:"Post URL"})}),o.jsxs(p.Flex,{gap:2,alignItems:"stretch",children:[o.jsx(ps,{type:"url",placeholder:"https://x.com/user/status/123…",value:u.url,onChange:T=>v(T.target.value)}),o.jsx(p.Button,{type:"button",variant:"secondary",onClick:E,disabled:!u.url.trim()||f,children:f?o.jsx(p.Loader,{small:!0,children:"…"}):i({id:"components.Blocks.social.action.fetch",defaultMessage:"Fetch preview"})})]}),m?o.jsx(hh,{children:m}):null]}),C&&(C.thumbnailUrl||C.author||C.title)?o.jsxs(uh,{children:[C.thumbnailUrl?o.jsx(ph,{src:C.thumbnailUrl,alt:""}):null,o.jsxs(p.Flex,{direction:"column",gap:1,alignItems:"flex-start",children:[o.jsxs(p.Typography,{variant:"sigma",textColor:"neutral600",children:[I.icon," ",C.providerName||I.label]}),C.author?o.jsx(p.Typography,{fontWeight:"bold",children:C.author}):null,C.title?o.jsx(p.Typography,{variant:"pi",textColor:"neutral700",children:C.title}):null]})]}):null,o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Vt,{children:i({id:"components.Blocks.social.field.caption",defaultMessage:"Caption (optional)"})}),o.jsx(ps,{type:"text",value:u.caption??"",onChange:T=>y({caption:T.target.value})})]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Vt,{children:i({id:"components.Blocks.social.field.alignment",defaultMessage:"Alignment"})}),o.jsx(ch,{children:fh.map(T=>o.jsx(dh,{type:"button",$active:u.alignment===T,onClick:()=>y({alignment:T}),children:T},T))})]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Vt,{children:i({id:"components.Blocks.social.field.embedCode",defaultMessage:"Embed code override (optional)"})}),o.jsx(lh,{placeholder:"<blockquote …>…</blockquote>",value:u.embedCode??"",onChange:T=>$(T.target.value)}),o.jsx(p.Typography,{variant:"pi",textColor:"neutral600",children:i({id:"components.Blocks.social.field.embedCode.hint",defaultMessage:"Pasting an embed code is enough on its own
|
|
1082
|
+
`,Vt=({children:e})=>o.jsx(p.Typography,{variant:"pi",fontWeight:"bold",textColor:"neutral700",children:e}),fh=["left","center","right"],gh=({open:e,element:t,enabledPlatforms:n,onSave:r,onRemove:s,onClose:a})=>{const{formatMessage:i}=O.useIntl(),{get:l}=Xe.useFetchClient(),c=n&&n.length>0?n:Hr,[u,h]=k.useState({platform:t.platform??c[0],url:t.url??"",embedCode:t.embedCode,oembed:t.oembed,alignment:t.alignment??"center",caption:t.caption}),[f,g]=k.useState(!1),[m,x]=k.useState(null),y=T=>h(j=>({...j,...T})),v=T=>{const j=us(T);y({url:T,oembed:void 0,...j?{platform:j}:{}}),x(null)},$=T=>{const j=T.trim()===""?"":T;if(j&&!u.url.trim()){const w=nh(j),B=w?us(w):null;y({embedCode:j,...w?{url:w}:{},...B?{platform:B}:{}});return}y({embedCode:j})},E=async()=>{if(u.url.trim()){g(!0),x(null);try{const j=(await l(`/better-blocks/oembed?url=${encodeURIComponent(u.url.trim())}&platform=${u.platform}`)).data;y({oembed:{html:j.html??void 0,title:j.title,author:j.author,authorUrl:j.authorUrl,thumbnailUrl:j.thumbnailUrl,providerName:j.providerName,width:j.width,height:j.height}})}catch(T){const j=T?.response?.data?.error?.message||T?.message||"Failed to fetch embed.";x(j)}finally{g(!1)}}},C=u.oembed,I=jt[u.platform],S=!!(u.url.trim()||u.embedCode?.trim());return o.jsx(p.Modal.Root,{open:e,onOpenChange:T=>{T||a()},children:o.jsxs(rh,{children:[o.jsx(p.Modal.Header,{children:o.jsx(p.Modal.Title,{children:i({id:"components.Blocks.social.modal.title",defaultMessage:"Social media embed"})})}),o.jsxs(oh,{children:[o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Vt,{children:i({id:"components.Blocks.social.field.platform",defaultMessage:"Platform"})}),o.jsx(sh,{children:c.map(T=>o.jsxs(ah,{type:"button",$active:u.platform===T,$color:jt[T].color,onClick:()=>y({platform:T}),children:[o.jsx(ih,{children:jt[T].icon}),jt[T].label]},T))})]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Vt,{children:i({id:"components.Blocks.social.field.url",defaultMessage:"Post URL"})}),o.jsxs(p.Flex,{gap:2,alignItems:"stretch",children:[o.jsx(ps,{type:"url",placeholder:"https://x.com/user/status/123…",value:u.url,onChange:T=>v(T.target.value)}),o.jsx(p.Button,{type:"button",variant:"secondary",onClick:E,disabled:!u.url.trim()||f,children:f?o.jsx(p.Loader,{small:!0,children:"…"}):i({id:"components.Blocks.social.action.fetch",defaultMessage:"Fetch preview"})})]}),m?o.jsx(hh,{children:m}):null]}),C&&(C.thumbnailUrl||C.author||C.title)?o.jsxs(uh,{children:[C.thumbnailUrl?o.jsx(ph,{src:C.thumbnailUrl,alt:""}):null,o.jsxs(p.Flex,{direction:"column",gap:1,alignItems:"flex-start",children:[o.jsxs(p.Typography,{variant:"sigma",textColor:"neutral600",children:[I.icon," ",C.providerName||I.label]}),C.author?o.jsx(p.Typography,{fontWeight:"bold",children:C.author}):null,C.title?o.jsx(p.Typography,{variant:"pi",textColor:"neutral700",children:C.title}):null]})]}):null,o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Vt,{children:i({id:"components.Blocks.social.field.caption",defaultMessage:"Caption (optional)"})}),o.jsx(ps,{type:"text",value:u.caption??"",onChange:T=>y({caption:T.target.value})})]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Vt,{children:i({id:"components.Blocks.social.field.alignment",defaultMessage:"Alignment"})}),o.jsx(ch,{children:fh.map(T=>o.jsx(dh,{type:"button",$active:u.alignment===T,onClick:()=>y({alignment:T}),children:T},T))})]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Vt,{children:i({id:"components.Blocks.social.field.embedCode",defaultMessage:"Embed code override (optional)"})}),o.jsx(lh,{placeholder:"<blockquote …>…</blockquote>",value:u.embedCode??"",onChange:T=>$(T.target.value)}),o.jsx(p.Typography,{variant:"pi",textColor:"neutral600",children:i({id:"components.Blocks.social.field.embedCode.hint",defaultMessage:"Pasting an embed code is enough on its own - the post URL is optional."})})]})]}),o.jsxs(p.Modal.Footer,{children:[o.jsx(p.Button,{variant:"danger-light",type:"button",onClick:s,children:i({id:"components.Blocks.popover.remove",defaultMessage:"Remove"})}),o.jsxs(p.Flex,{gap:2,marginLeft:"auto",children:[o.jsx(p.Button,{variant:"tertiary",type:"button",onClick:a,children:i({id:"global.cancel",defaultMessage:"Cancel"})}),o.jsx(p.Button,{type:"button",disabled:!S,onClick:()=>r({...u,url:u.url.trim(),embedCode:u.embedCode&&th(u.embedCode)||void 0}),children:i({id:"global.save",defaultMessage:"Save"})})]})]})]})})},mh={twitter:"https://platform.twitter.com",instagram:"https://www.instagram.com",facebook:"https://www.facebook.com",tiktok:"https://www.tiktok.com",linkedin:"https://www.linkedin.com",pinterest:"https://assets.pinterest.com"},bh={twitter:560,instagram:700,facebook:680,tiktok:760,linkedin:600,pinterest:450},hs=e=>{const t=e?.match(/<iframe[^>]+src=["']([^"']+)["']/i);return t?t[1].replace(/&/g,"&"):null},Cn=(e,...t)=>{for(const n of t)if(n)for(const r of e){const s=n.match(r);if(s)return s[1]}return null},yh=e=>{const{platform:t,url:n="",embedCode:r}=e,s=e.oembed?.html,a=bh[t]??600,i=hs(r)??hs(s);if(i)return{src:i,height:a};switch(t){case"twitter":{const l=Cn([/(?:twitter\.com|x\.com)\/[^/]+\/status(?:es)?\/(\d+)/i],n,r,s);return l?{src:`https://platform.twitter.com/embed/Tweet.html?id=${l}&dnt=true`,height:a}:null}case"instagram":{const l=Cn([/instagram\.com\/(?:p|reel|tv)\/([A-Za-z0-9_-]+)/i],n,r,s);return l?{src:`https://www.instagram.com/p/${l}/embed/captioned/`,height:a}:null}case"tiktok":{const l=Cn([/tiktok\.com\/@[^/]+\/video\/(\d+)/i,/data-video-id=["'](\d+)["']/i],n,r,s);return l?{src:`https://www.tiktok.com/embed/v2/${l}`,height:a}:null}case"pinterest":{const l=Cn([/\/pin\/(\d+)/i],n,r,s);return l?{src:`https://assets.pinterest.com/ext/embed.html?id=${l}`,height:a}:null}case"facebook":return n?{src:`https://www.facebook.com/plugins/post.php?href=${encodeURIComponent(n)}&show_text=true&width=500`,height:a}:null;case"linkedin":{const l=n.match(/(?:urn:li:)?(ugcPost|activity|share)[:-](\d{10,})/i);if(!l)return null;const c=l[1].toLowerCase()==="ugcpost"?"ugcPost":l[1].toLowerCase();return{src:`https://www.linkedin.com/embed/feed/update/${encodeURIComponent(`urn:li:${c}:${l[2]}`)}`,height:a}}default:return null}},xh=e=>o.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",width:16,height:16,fill:"none",stroke:"currentColor",strokeWidth:"1.8",strokeLinecap:"round",strokeLinejoin:"round",...e,children:[o.jsx("circle",{cx:"18",cy:"5",r:"3"}),o.jsx("circle",{cx:"6",cy:"12",r:"3"}),o.jsx("circle",{cx:"18",cy:"19",r:"3"}),o.jsx("line",{x1:"8.6",y1:"10.7",x2:"15.4",y2:"6.3"}),o.jsx("line",{x1:"8.6",y1:"13.3",x2:"15.4",y2:"17.7"})]}),fs=(e="twitter")=>({type:"social-embed",platform:e,url:"",alignment:"center",children:[{type:"text",text:""}]}),vh=e=>{const t=he(e,fs());t&&(d.Transforms.removeNodes(e,{at:t}),d.Transforms.insertNodes(e,fs(),{at:t,select:!0}))},wh=b.styled.div`
|
|
1083
1083
|
margin: ${({theme:e})=>e.spaces[2]} 0;
|
|
1084
1084
|
`,kh=b.styled.div`
|
|
1085
1085
|
display: inline-flex;
|
|
@@ -1278,7 +1278,7 @@
|
|
|
1278
1278
|
display: flex;
|
|
1279
1279
|
flex-direction: column;
|
|
1280
1280
|
gap: 2px;
|
|
1281
|
-
`,Re=({children:e})=>o.jsx(p.Typography,{variant:"pi",fontWeight:"bold",textColor:"neutral700",children:e}),rf=["left","center","right","none"],of=({open:e,element:t,onSave:n,onRemove:r,onClose:s})=>{const{formatMessage:a}=O.useIntl(),i=Xe.useStrapiApp("VideoEditorModal",j=>j.components),[l,c]=k.useState({provider:t.provider??"local",assetId:t.assetId,playbackId:t.playbackId,url:t.url??"",file:t.file,poster:t.poster,title:t.title,caption:t.caption,transcript:t.transcript,player:t.player??ci,alignment:t.alignment??"center",aspectRatio:t.aspectRatio??"16:9",customAspectRatio:t.customAspectRatio}),[u,h]=k.useState(null),[f,g]=k.useState(!1),m=_h(!0),x=j=>c(w=>({...w,...j})),y=j=>c(w=>({...w,player:{...w.player,...j}})),v=i?.["media-library"],$=j=>{const w=j[0],B=u;if(h(null),!w)return;const A=Uh(w.url);if(B==="poster"){x({poster:A});return}if(B==="transcript"){x({transcript:A});return}const N=typeof w.size=="number"?w.size:void 0,F=w.name??"video";c(_=>({..._,provider:"local",url:A,playbackId:void 0,assetId:void 0,file:{id:typeof w.id=="number"?w.id:void 0,name:F,ext:w.ext??void 0,mime:w.mime??void 0,size:N!==void 0?Math.round(N*1024):void 0,duration:typeof w.duration=="number"?w.duration:void 0,provider:w.provider??void 0},title:_.title?.trim()?_.title:Wh(F)}))},E=j=>{const w=Hh(j);if(!w){x({url:"",provider:"local",playbackId:void 0,file:void 0});return}c(B=>({...B,provider:w.provider,url:w.url,playbackId:w.playbackId,poster:B.poster??w.poster,file:void 0}))},C=j=>{if(!j.playback_id)return;const w=j.aspect_ratio;c(B=>({...B,provider:"mux",assetId:j.asset_id,playbackId:j.playback_id,url:Ur(j.playback_id),poster:Wr(j.playback_id),file:void 0,title:B.title?.trim()?B.title:j.title,aspectRatio:w&&zr.includes(w)?w:B.aspectRatio})),g(!1)},I=!!l.url?.trim(),S=I&&ii(l.url),T=l.aspectRatio==="custom"?l.customAspectRatio||"16 / 9":Jn(l.aspectRatio);return u&&v?o.jsx(v,{allowedTypes:u==="video"?["videos"]:u==="poster"?["images"]:["files"],onClose:()=>h(null),onSelectAssets:$}):o.jsx(p.Modal.Root,{open:e,onOpenChange:j=>{j||s()},children:o.jsxs(Kh,{children:[o.jsx(p.Modal.Header,{children:o.jsx(p.Modal.Title,{children:a({id:"components.Blocks.video.modal.title",defaultMessage:"Video"})})}),o.jsxs(Gh,{children:[o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Re,{children:a({id:"components.Blocks.video.field.source",defaultMessage:"Video source"})}),o.jsxs(Yh,{children:[o.jsxs(p.Flex,{gap:2,alignItems:"center",justifyContent:"space-between",children:[o.jsx(p.Flex,{direction:"column",gap:1,alignItems:"flex-start",children:I?o.jsxs(o.Fragment,{children:[o.jsx(p.Typography,{fontWeight:"bold",variant:"pi",children:l.file?.name||l.playbackId||l.url}),o.jsxs(p.Typography,{variant:"pi",textColor:"neutral500",children:[Kr[l.provider],l.file?.size?` · ${li(l.file.size)}`:""]})]}):o.jsx(p.Typography,{variant:"pi",textColor:"neutral500",children:a({id:"components.Blocks.video.source.empty",defaultMessage:"No video selected yet."})})}),o.jsxs(p.Flex,{gap:2,children:[m.available?o.jsx(p.Button,{type:"button",variant:"secondary",onClick:()=>g(j=>!j),children:a({id:"components.Blocks.video.action.browseMux",defaultMessage:"Mux"})}):null,o.jsx(p.Button,{type:"button",variant:"secondary",disabled:!v,onClick:()=>h("video"),children:a({id:"components.Blocks.video.action.browse",defaultMessage:"Media Library"})})]})]}),f&&m.available?o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Qe,{type:"search",placeholder:a({id:"components.Blocks.video.mux.search",defaultMessage:"Search Mux assets by title…"}),value:m.query,onChange:j=>m.search(j.target.value)}),m.error?o.jsx(Qh,{variant:"pi",children:m.error}):null,m.loading?o.jsx(qt,{variant:"pi",children:a({id:"components.Blocks.video.mux.loading",defaultMessage:"Loading…"})}):m.assets.length===0?o.jsx(qt,{variant:"pi",children:a({id:"components.Blocks.video.mux.empty",defaultMessage:"No Mux assets found."})}):o.jsx(ef,{children:m.assets.map(j=>{const w=!j.playback_id||!j.isReady||j.signed;return o.jsxs(tf,{type:"button",disabled:w,$selected:l.playbackId===j.playback_id,onClick:()=>C(j),children:[j.playback_id?o.jsx("img",{src:Dh(j.playback_id),alt:"",loading:"lazy"}):null,o.jsxs(nf,{children:[o.jsx(p.Typography,{variant:"pi",fontWeight:"bold",children:j.title}),o.jsx(p.Typography,{variant:"pi",textColor:"neutral500",children:j.signed?a({id:"components.Blocks.video.mux.signed",defaultMessage:"Signed playback — not supported"}):j.isReady?j.aspect_ratio||"":a({id:"components.Blocks.video.mux.notReady",defaultMessage:"Still processing"})})]})]},j.documentId)})})]}):null,o.jsx(Zh,{children:a({id:"components.Blocks.video.source.or",defaultMessage:"or"})}),o.jsx(Qe,{type:"text",placeholder:"https://stream.mux.com/…m3u8, a Mux playback ID, or https://example.com/video.mp4",value:l.file?.id?"":l.url??"",onChange:j=>E(j.target.value)}),o.jsx(qt,{variant:"pi",children:a({id:"components.Blocks.video.hint.source",defaultMessage:"Mux, api.video and Cloudinary URLs are detected automatically. A bare Mux playback ID fills in the stream URL and poster for you. For YouTube or Vimeo, use the Embed block instead."})})]})]}),I?o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Re,{children:a({id:"components.Blocks.video.field.preview",defaultMessage:"Preview"})}),o.jsx(Jh,{$ratio:T,children:S?l.poster?o.jsx("img",{src:l.poster,alt:a({id:"components.Blocks.video.preview.posterAlt",defaultMessage:"Video poster"})}):null:o.jsx("video",{src:l.url,poster:l.poster,controls:!0,preload:"metadata"},l.url)}),S?o.jsx(qt,{variant:"pi",children:a({id:"components.Blocks.video.hint.streaming",defaultMessage:"HLS/DASH streams need a streaming-capable player, so the editor shows the poster frame instead. Playback works on the frontend via the provider player."})}):null]}):null,o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Re,{children:a({id:"components.Blocks.video.field.poster",defaultMessage:"Poster image (optional)"})}),o.jsxs(p.Flex,{gap:2,alignItems:"center",children:[o.jsx(Qe,{type:"url",placeholder:"https://…/thumbnail.jpg",value:l.poster??"",onChange:j=>x({poster:j.target.value})}),o.jsx(p.Button,{type:"button",variant:"secondary",disabled:!v,onClick:()=>h("poster"),children:a({id:"components.Blocks.video.action.browsePoster",defaultMessage:"Browse"})})]})]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Re,{children:a({id:"components.Blocks.video.field.title",defaultMessage:"Title (optional)"})}),o.jsx(Qe,{type:"text",value:l.title??"",onChange:j=>x({title:j.target.value})})]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Re,{children:a({id:"components.Blocks.video.field.caption",defaultMessage:"Caption (optional)"})}),o.jsx(Qe,{type:"text",value:l.caption??"",onChange:j=>x({caption:j.target.value})})]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Re,{children:a({id:"components.Blocks.video.field.player",defaultMessage:"Player settings"})}),o.jsxs(p.Flex,{gap:4,wrap:"wrap",children:[o.jsxs(Sn,{children:[o.jsx("input",{type:"checkbox",checked:l.player.controls,onChange:j=>y({controls:j.target.checked})}),o.jsx(p.Typography,{variant:"pi",children:a({id:"components.Blocks.video.player.controls",defaultMessage:"Show controls"})})]}),o.jsxs(Sn,{children:[o.jsx("input",{type:"checkbox",checked:l.player.autoplay,onChange:j=>y({autoplay:j.target.checked,...j.target.checked?{muted:!0}:{}})}),o.jsx(p.Typography,{variant:"pi",children:a({id:"components.Blocks.video.player.autoplay",defaultMessage:"Autoplay"})})]}),o.jsxs(Sn,{children:[o.jsx("input",{type:"checkbox",checked:l.player.muted,onChange:j=>y({muted:j.target.checked})}),o.jsx(p.Typography,{variant:"pi",children:a({id:"components.Blocks.video.player.muted",defaultMessage:"Muted"})})]}),o.jsxs(Sn,{children:[o.jsx("input",{type:"checkbox",checked:l.player.loop,onChange:j=>y({loop:j.target.checked})}),o.jsx(p.Typography,{variant:"pi",children:a({id:"components.Blocks.video.player.loop",defaultMessage:"Loop"})})]})]}),l.player.autoplay&&!l.player.muted?o.jsx(qt,{variant:"pi",children:a({id:"components.Blocks.video.player.autoplayWarning",defaultMessage:"Most browsers block autoplay unless the video is muted."})}):null]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Re,{children:a({id:"components.Blocks.video.field.aspectRatio",defaultMessage:"Aspect ratio"})}),o.jsxs(p.Flex,{gap:2,alignItems:"center",wrap:"wrap",children:[o.jsxs(Vh,{value:l.aspectRatio,onChange:j=>x({aspectRatio:j.target.value}),children:[zr.map(j=>o.jsx("option",{value:j,children:j},j)),o.jsx("option",{value:"custom",children:a({id:"components.Blocks.embed.aspectRatio.custom",defaultMessage:"Custom"})})]}),l.aspectRatio==="custom"?o.jsx(Qe,{type:"text",style:{maxWidth:160},placeholder:"3 / 2",value:l.customAspectRatio??"",onChange:j=>x({customAspectRatio:j.target.value})}):null]})]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Re,{children:a({id:"components.Blocks.video.field.alignment",defaultMessage:"Alignment"})}),o.jsx(qh,{children:rf.map(j=>o.jsx(Xh,{type:"button",$active:l.alignment===j,onClick:()=>x({alignment:j}),children:j},j))})]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Re,{children:a({id:"components.Blocks.video.field.transcript",defaultMessage:"Captions / transcript (WebVTT, optional)"})}),o.jsxs(p.Flex,{gap:2,alignItems:"center",children:[o.jsx(Qe,{type:"url",placeholder:"https://…/captions.vtt",value:l.transcript??"",onChange:j=>x({transcript:j.target.value})}),o.jsx(p.Button,{type:"button",variant:"secondary",disabled:!v,onClick:()=>h("transcript"),children:a({id:"components.Blocks.video.action.browseTranscript",defaultMessage:"Browse"})})]})]})]}),o.jsxs(p.Modal.Footer,{children:[o.jsx(p.Button,{variant:"danger-light",type:"button",onClick:r,children:a({id:"components.Blocks.popover.remove",defaultMessage:"Remove"})}),o.jsxs(p.Flex,{gap:2,marginLeft:"auto",children:[o.jsx(p.Button,{variant:"tertiary",type:"button",onClick:s,children:a({id:"global.cancel",defaultMessage:"Cancel"})}),o.jsx(p.Button,{type:"button",disabled:!I,onClick:()=>n(l),children:a({id:"global.save",defaultMessage:"Save"})})]})]})]})})},ms=()=>({type:"video",provider:"local",url:"",player:{...ci},alignment:"center",aspectRatio:"16:9",children:[{type:"text",text:""}]}),di=e=>{const t=he(e,ms());t&&(d.Transforms.removeNodes(e,{at:t}),d.Transforms.insertNodes(e,ms(),{at:t,select:!0}))},sf=b.styled.div`
|
|
1281
|
+
`,Re=({children:e})=>o.jsx(p.Typography,{variant:"pi",fontWeight:"bold",textColor:"neutral700",children:e}),rf=["left","center","right","none"],of=({open:e,element:t,onSave:n,onRemove:r,onClose:s})=>{const{formatMessage:a}=O.useIntl(),i=Xe.useStrapiApp("VideoEditorModal",j=>j.components),[l,c]=k.useState({provider:t.provider??"local",assetId:t.assetId,playbackId:t.playbackId,url:t.url??"",file:t.file,poster:t.poster,title:t.title,caption:t.caption,transcript:t.transcript,player:t.player??ci,alignment:t.alignment??"center",aspectRatio:t.aspectRatio??"16:9",customAspectRatio:t.customAspectRatio}),[u,h]=k.useState(null),[f,g]=k.useState(!1),m=_h(!0),x=j=>c(w=>({...w,...j})),y=j=>c(w=>({...w,player:{...w.player,...j}})),v=i?.["media-library"],$=j=>{const w=j[0],B=u;if(h(null),!w)return;const A=Uh(w.url);if(B==="poster"){x({poster:A});return}if(B==="transcript"){x({transcript:A});return}const N=typeof w.size=="number"?w.size:void 0,F=w.name??"video";c(_=>({..._,provider:"local",url:A,playbackId:void 0,assetId:void 0,file:{id:typeof w.id=="number"?w.id:void 0,name:F,ext:w.ext??void 0,mime:w.mime??void 0,size:N!==void 0?Math.round(N*1024):void 0,duration:typeof w.duration=="number"?w.duration:void 0,provider:w.provider??void 0},title:_.title?.trim()?_.title:Wh(F)}))},E=j=>{const w=Hh(j);if(!w){x({url:"",provider:"local",playbackId:void 0,file:void 0});return}c(B=>({...B,provider:w.provider,url:w.url,playbackId:w.playbackId,poster:B.poster??w.poster,file:void 0}))},C=j=>{if(!j.playback_id)return;const w=j.aspect_ratio;c(B=>({...B,provider:"mux",assetId:j.asset_id,playbackId:j.playback_id,url:Ur(j.playback_id),poster:Wr(j.playback_id),file:void 0,title:B.title?.trim()?B.title:j.title,aspectRatio:w&&zr.includes(w)?w:B.aspectRatio})),g(!1)},I=!!l.url?.trim(),S=I&&ii(l.url),T=l.aspectRatio==="custom"?l.customAspectRatio||"16 / 9":Jn(l.aspectRatio);return u&&v?o.jsx(v,{allowedTypes:u==="video"?["videos"]:u==="poster"?["images"]:["files"],onClose:()=>h(null),onSelectAssets:$}):o.jsx(p.Modal.Root,{open:e,onOpenChange:j=>{j||s()},children:o.jsxs(Kh,{children:[o.jsx(p.Modal.Header,{children:o.jsx(p.Modal.Title,{children:a({id:"components.Blocks.video.modal.title",defaultMessage:"Video"})})}),o.jsxs(Gh,{children:[o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Re,{children:a({id:"components.Blocks.video.field.source",defaultMessage:"Video source"})}),o.jsxs(Yh,{children:[o.jsxs(p.Flex,{gap:2,alignItems:"center",justifyContent:"space-between",children:[o.jsx(p.Flex,{direction:"column",gap:1,alignItems:"flex-start",children:I?o.jsxs(o.Fragment,{children:[o.jsx(p.Typography,{fontWeight:"bold",variant:"pi",children:l.file?.name||l.playbackId||l.url}),o.jsxs(p.Typography,{variant:"pi",textColor:"neutral500",children:[Kr[l.provider],l.file?.size?` · ${li(l.file.size)}`:""]})]}):o.jsx(p.Typography,{variant:"pi",textColor:"neutral500",children:a({id:"components.Blocks.video.source.empty",defaultMessage:"No video selected yet."})})}),o.jsxs(p.Flex,{gap:2,children:[m.available?o.jsx(p.Button,{type:"button",variant:"secondary",onClick:()=>g(j=>!j),children:a({id:"components.Blocks.video.action.browseMux",defaultMessage:"Mux"})}):null,o.jsx(p.Button,{type:"button",variant:"secondary",disabled:!v,onClick:()=>h("video"),children:a({id:"components.Blocks.video.action.browse",defaultMessage:"Media Library"})})]})]}),f&&m.available?o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Qe,{type:"search",placeholder:a({id:"components.Blocks.video.mux.search",defaultMessage:"Search Mux assets by title…"}),value:m.query,onChange:j=>m.search(j.target.value)}),m.error?o.jsx(Qh,{variant:"pi",children:m.error}):null,m.loading?o.jsx(qt,{variant:"pi",children:a({id:"components.Blocks.video.mux.loading",defaultMessage:"Loading…"})}):m.assets.length===0?o.jsx(qt,{variant:"pi",children:a({id:"components.Blocks.video.mux.empty",defaultMessage:"No Mux assets found."})}):o.jsx(ef,{children:m.assets.map(j=>{const w=!j.playback_id||!j.isReady||j.signed;return o.jsxs(tf,{type:"button",disabled:w,$selected:l.playbackId===j.playback_id,onClick:()=>C(j),children:[j.playback_id?o.jsx("img",{src:Dh(j.playback_id),alt:"",loading:"lazy"}):null,o.jsxs(nf,{children:[o.jsx(p.Typography,{variant:"pi",fontWeight:"bold",children:j.title}),o.jsx(p.Typography,{variant:"pi",textColor:"neutral500",children:j.signed?a({id:"components.Blocks.video.mux.signed",defaultMessage:"Signed playback - not supported"}):j.isReady?j.aspect_ratio||"":a({id:"components.Blocks.video.mux.notReady",defaultMessage:"Still processing"})})]})]},j.documentId)})})]}):null,o.jsx(Zh,{children:a({id:"components.Blocks.video.source.or",defaultMessage:"or"})}),o.jsx(Qe,{type:"text",placeholder:"https://stream.mux.com/…m3u8, a Mux playback ID, or https://example.com/video.mp4",value:l.file?.id?"":l.url??"",onChange:j=>E(j.target.value)}),o.jsx(qt,{variant:"pi",children:a({id:"components.Blocks.video.hint.source",defaultMessage:"Mux, api.video and Cloudinary URLs are detected automatically. A bare Mux playback ID fills in the stream URL and poster for you. For YouTube or Vimeo, use the Embed block instead."})})]})]}),I?o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Re,{children:a({id:"components.Blocks.video.field.preview",defaultMessage:"Preview"})}),o.jsx(Jh,{$ratio:T,children:S?l.poster?o.jsx("img",{src:l.poster,alt:a({id:"components.Blocks.video.preview.posterAlt",defaultMessage:"Video poster"})}):null:o.jsx("video",{src:l.url,poster:l.poster,controls:!0,preload:"metadata"},l.url)}),S?o.jsx(qt,{variant:"pi",children:a({id:"components.Blocks.video.hint.streaming",defaultMessage:"HLS/DASH streams need a streaming-capable player, so the editor shows the poster frame instead. Playback works on the frontend via the provider player."})}):null]}):null,o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Re,{children:a({id:"components.Blocks.video.field.poster",defaultMessage:"Poster image (optional)"})}),o.jsxs(p.Flex,{gap:2,alignItems:"center",children:[o.jsx(Qe,{type:"url",placeholder:"https://…/thumbnail.jpg",value:l.poster??"",onChange:j=>x({poster:j.target.value})}),o.jsx(p.Button,{type:"button",variant:"secondary",disabled:!v,onClick:()=>h("poster"),children:a({id:"components.Blocks.video.action.browsePoster",defaultMessage:"Browse"})})]})]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Re,{children:a({id:"components.Blocks.video.field.title",defaultMessage:"Title (optional)"})}),o.jsx(Qe,{type:"text",value:l.title??"",onChange:j=>x({title:j.target.value})})]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Re,{children:a({id:"components.Blocks.video.field.caption",defaultMessage:"Caption (optional)"})}),o.jsx(Qe,{type:"text",value:l.caption??"",onChange:j=>x({caption:j.target.value})})]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Re,{children:a({id:"components.Blocks.video.field.player",defaultMessage:"Player settings"})}),o.jsxs(p.Flex,{gap:4,wrap:"wrap",children:[o.jsxs(Sn,{children:[o.jsx("input",{type:"checkbox",checked:l.player.controls,onChange:j=>y({controls:j.target.checked})}),o.jsx(p.Typography,{variant:"pi",children:a({id:"components.Blocks.video.player.controls",defaultMessage:"Show controls"})})]}),o.jsxs(Sn,{children:[o.jsx("input",{type:"checkbox",checked:l.player.autoplay,onChange:j=>y({autoplay:j.target.checked,...j.target.checked?{muted:!0}:{}})}),o.jsx(p.Typography,{variant:"pi",children:a({id:"components.Blocks.video.player.autoplay",defaultMessage:"Autoplay"})})]}),o.jsxs(Sn,{children:[o.jsx("input",{type:"checkbox",checked:l.player.muted,onChange:j=>y({muted:j.target.checked})}),o.jsx(p.Typography,{variant:"pi",children:a({id:"components.Blocks.video.player.muted",defaultMessage:"Muted"})})]}),o.jsxs(Sn,{children:[o.jsx("input",{type:"checkbox",checked:l.player.loop,onChange:j=>y({loop:j.target.checked})}),o.jsx(p.Typography,{variant:"pi",children:a({id:"components.Blocks.video.player.loop",defaultMessage:"Loop"})})]})]}),l.player.autoplay&&!l.player.muted?o.jsx(qt,{variant:"pi",children:a({id:"components.Blocks.video.player.autoplayWarning",defaultMessage:"Most browsers block autoplay unless the video is muted."})}):null]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Re,{children:a({id:"components.Blocks.video.field.aspectRatio",defaultMessage:"Aspect ratio"})}),o.jsxs(p.Flex,{gap:2,alignItems:"center",wrap:"wrap",children:[o.jsxs(Vh,{value:l.aspectRatio,onChange:j=>x({aspectRatio:j.target.value}),children:[zr.map(j=>o.jsx("option",{value:j,children:j},j)),o.jsx("option",{value:"custom",children:a({id:"components.Blocks.embed.aspectRatio.custom",defaultMessage:"Custom"})})]}),l.aspectRatio==="custom"?o.jsx(Qe,{type:"text",style:{maxWidth:160},placeholder:"3 / 2",value:l.customAspectRatio??"",onChange:j=>x({customAspectRatio:j.target.value})}):null]})]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Re,{children:a({id:"components.Blocks.video.field.alignment",defaultMessage:"Alignment"})}),o.jsx(qh,{children:rf.map(j=>o.jsx(Xh,{type:"button",$active:l.alignment===j,onClick:()=>x({alignment:j}),children:j},j))})]}),o.jsxs(p.Flex,{direction:"column",gap:2,alignItems:"stretch",children:[o.jsx(Re,{children:a({id:"components.Blocks.video.field.transcript",defaultMessage:"Captions / transcript (WebVTT, optional)"})}),o.jsxs(p.Flex,{gap:2,alignItems:"center",children:[o.jsx(Qe,{type:"url",placeholder:"https://…/captions.vtt",value:l.transcript??"",onChange:j=>x({transcript:j.target.value})}),o.jsx(p.Button,{type:"button",variant:"secondary",disabled:!v,onClick:()=>h("transcript"),children:a({id:"components.Blocks.video.action.browseTranscript",defaultMessage:"Browse"})})]})]})]}),o.jsxs(p.Modal.Footer,{children:[o.jsx(p.Button,{variant:"danger-light",type:"button",onClick:r,children:a({id:"components.Blocks.popover.remove",defaultMessage:"Remove"})}),o.jsxs(p.Flex,{gap:2,marginLeft:"auto",children:[o.jsx(p.Button,{variant:"tertiary",type:"button",onClick:s,children:a({id:"global.cancel",defaultMessage:"Cancel"})}),o.jsx(p.Button,{type:"button",disabled:!I,onClick:()=>n(l),children:a({id:"global.save",defaultMessage:"Save"})})]})]})]})})},ms=()=>({type:"video",provider:"local",url:"",player:{...ci},alignment:"center",aspectRatio:"16:9",children:[{type:"text",text:""}]}),di=e=>{const t=he(e,ms());t&&(d.Transforms.removeNodes(e,{at:t}),d.Transforms.insertNodes(e,ms(),{at:t,select:!0}))},sf=b.styled.div`
|
|
1282
1282
|
margin: ${({theme:e})=>e.spaces[2]} 0;
|
|
1283
1283
|
display: flex;
|
|
1284
1284
|
justify-content: ${({$align:e})=>e==="left"?"flex-start":e==="right"?"flex-end":e==="none"?"stretch":"center"};
|
|
@@ -1354,7 +1354,7 @@
|
|
|
1354
1354
|
border-radius: ${({theme:e})=>e.borderRadius};
|
|
1355
1355
|
background: ${({theme:e})=>e.colors.neutral100};
|
|
1356
1356
|
color: ${({theme:e})=>e.colors.neutral600};
|
|
1357
|
-
`,ff=["provider","assetId","playbackId","url","file","poster","title","caption","transcript","player","alignment","aspectRatio","customAspectRatio"],gf=["assetId","playbackId","file","poster","title","caption","transcript","customAspectRatio"],mf=({attributes:e,children:t,element:n})=>{const r=n,{editor:s,disabled:a}=P("Video"),i=R.useSelected(),l=(r.url??"").trim()!=="",[c,u]=k.useState(!l&&!a),h=r.alignment??"center",f=r.aspectRatio==="custom"?r.customAspectRatio||"16 / 9":Jn(r.aspectRatio),g=l&&ii(r.url),m=()=>{try{return R.ReactEditor.findPath(s,r)}catch{return null}},x=()=>{const E=m();E&&(s.children.length===1?(d.Transforms.setNodes(s,{type:"paragraph"},{at:E}),d.Transforms.unsetNodes(s,ff,{at:E})):d.Transforms.removeNodes(s,{at:E}))},y=E=>{const C=m();if(C){d.Transforms.setNodes(s,E,{at:C});const I=gf.filter(S=>E[S]===void 0||E[S]==="");I.length&&d.Transforms.unsetNodes(s,I,{at:C})}u(!1),R.ReactEditor.focus(s)},v=()=>{x(),u(!1),R.ReactEditor.focus(s)},$=()=>{l||x(),u(!1)};return o.jsxs(p.Box,{...e,children:[t,o.jsx(sf,{$align:h,contentEditable:!1,children:l?o.jsxs(af,{$selected:i,$full:h==="none",onMouseDown:E=>{E.target.closest("video")||(E.preventDefault(),a||u(!0))},children:[o.jsxs(lf,{$ratio:f,children:[g?o.jsxs(o.Fragment,{children:[r.poster?o.jsx("img",{src:r.poster,alt:r.title||"Video poster"}):o.jsx(pf,{alignItems:"center",justifyContent:"center",children:Kr[r.provider]??"Video"}),o.jsx(df,{children:o.jsx(uf,{})})]}):o.jsx("video",{src:r.url,poster:r.poster,controls:r.player?.controls??!0,loop:r.player?.loop??!1,muted:r.player?.muted??!1,preload:"metadata"},r.url),o.jsx(cf,{children:Kr[r.provider]??"Video"})]}),r.file?.size?o.jsxs(p.Typography,{variant:"pi",textColor:"neutral500",children:[li(r.file.size),r.file.mime?` · ${r.file.mime}`:""]}):null,r.caption?o.jsx(p.Typography,{variant:"pi",textColor:"neutral600",fontWeight:"semiBold",children:r.caption}):null]}):o.jsxs(hf,{alignItems:"center",gap:2,children:[o.jsx(D.Play,{}),o.jsx(p.Typography,{variant:"pi",children:"Video
|
|
1357
|
+
`,ff=["provider","assetId","playbackId","url","file","poster","title","caption","transcript","player","alignment","aspectRatio","customAspectRatio"],gf=["assetId","playbackId","file","poster","title","caption","transcript","customAspectRatio"],mf=({attributes:e,children:t,element:n})=>{const r=n,{editor:s,disabled:a}=P("Video"),i=R.useSelected(),l=(r.url??"").trim()!=="",[c,u]=k.useState(!l&&!a),h=r.alignment??"center",f=r.aspectRatio==="custom"?r.customAspectRatio||"16 / 9":Jn(r.aspectRatio),g=l&&ii(r.url),m=()=>{try{return R.ReactEditor.findPath(s,r)}catch{return null}},x=()=>{const E=m();E&&(s.children.length===1?(d.Transforms.setNodes(s,{type:"paragraph"},{at:E}),d.Transforms.unsetNodes(s,ff,{at:E})):d.Transforms.removeNodes(s,{at:E}))},y=E=>{const C=m();if(C){d.Transforms.setNodes(s,E,{at:C});const I=gf.filter(S=>E[S]===void 0||E[S]==="");I.length&&d.Transforms.unsetNodes(s,I,{at:C})}u(!1),R.ReactEditor.focus(s)},v=()=>{x(),u(!1),R.ReactEditor.focus(s)},$=()=>{l||x(),u(!1)};return o.jsxs(p.Box,{...e,children:[t,o.jsx(sf,{$align:h,contentEditable:!1,children:l?o.jsxs(af,{$selected:i,$full:h==="none",onMouseDown:E=>{E.target.closest("video")||(E.preventDefault(),a||u(!0))},children:[o.jsxs(lf,{$ratio:f,children:[g?o.jsxs(o.Fragment,{children:[r.poster?o.jsx("img",{src:r.poster,alt:r.title||"Video poster"}):o.jsx(pf,{alignItems:"center",justifyContent:"center",children:Kr[r.provider]??"Video"}),o.jsx(df,{children:o.jsx(uf,{})})]}):o.jsx("video",{src:r.url,poster:r.poster,controls:r.player?.controls??!0,loop:r.player?.loop??!1,muted:r.player?.muted??!1,preload:"metadata"},r.url),o.jsx(cf,{children:Kr[r.provider]??"Video"})]}),r.file?.size?o.jsxs(p.Typography,{variant:"pi",textColor:"neutral500",children:[li(r.file.size),r.file.mime?` · ${r.file.mime}`:""]}):null,r.caption?o.jsx(p.Typography,{variant:"pi",textColor:"neutral600",fontWeight:"semiBold",children:r.caption}):null]}):o.jsxs(hf,{alignItems:"center",gap:2,children:[o.jsx(D.Play,{}),o.jsx(p.Typography,{variant:"pi",children:"Video - click to choose a file, paste a URL, or add a Mux playback ID."})]})}),c&&!a?o.jsx(of,{open:!0,element:r,onSave:y,onRemove:v,onClose:$}):null]})},bf=e=>{const{isVoid:t}=e;return e.isVoid=n=>cd(n)?!0:t(n),e},yf={video:{renderElement:e=>o.jsx(mf,{...e}),icon:D.Play,label:{id:"components.Blocks.blocks.video",defaultMessage:"Video"},matchNode:e=>e.type==="video",isInBlocksSelector:!0,handleConvert(e){di(e)},handleBackspaceKey(e){e.children.length===1?d.Transforms.setNodes(e,{type:"paragraph"}):d.Transforms.removeNodes(e)},handleEnterKey(e){d.Transforms.insertNodes(e,{type:"paragraph",children:[{type:"text",text:""}]})}}},xf={paragraph:{renderElement:e=>{const t=e.element,n={};return t.fontColor&&(n.color=t.fontColor),t.textAlign&&(n.textAlign=t.textAlign),t.indent&&(n.marginLeft=`${t.indent*2}rem`),t.lineHeight&&(n.lineHeight=t.lineHeight),o.jsx(p.Typography,{tag:"p",variant:"omega",...e.attributes,style:n,children:e.children})},icon:D.Paragraph,label:{id:"components.Blocks.blocks.text",defaultMessage:"Text"},matchNode:e=>e.type==="paragraph",isInBlocksSelector:!0,dragHandleTopMargin:"-2px",handleConvert(e){he(e,{type:"paragraph"})},handleEnterKey(e){if(!e.selection)return;const t=e.selection.anchor.path;d.Transforms.splitNodes(e,{always:!0});const n=d.Editor.above(e,{match:l=>!d.Editor.isEditor(l)&&"type"in l&&l.type!=="text"});if(!n)return;const[,r]=n,s=d.Editor.isEnd(e,e.selection.anchor,r),[a]=d.Editor.parent(e,e.selection.anchor.path);d.Transforms.removeNodes(e);const i=e.children.length-t[0]>1;d.Transforms.insertNodes(e,{type:"paragraph",children:s?[{type:"text",text:""}]:a.children},{at:i?[t[0]+1]:[e.children.length]}),d.Transforms.select(e,e.start([t[0]+1]))}}},vf=b.styled.blockquote.attrs({role:"blockquote"})`
|
|
1358
1358
|
font-weight: ${({theme:e})=>e.fontWeights.regular};
|
|
1359
1359
|
border-left: ${({theme:e})=>`${e.spaces[1]} solid ${e.colors.neutral200}`};
|
|
1360
1360
|
padding: ${({theme:e})=>e.spaces[2]} ${({theme:e})=>e.spaces[4]};
|
|
@@ -1425,7 +1425,7 @@
|
|
|
1425
1425
|
text-align: inherit;
|
|
1426
1426
|
}
|
|
1427
1427
|
|
|
1428
|
-
/* Cells carry their own highlight
|
|
1428
|
+
/* Cells carry their own highlight - with colSpan/rowSpan in play, a cell's
|
|
1429
1429
|
index within its row is no longer its visual column, so nth-child rules
|
|
1430
1430
|
can't identify a column any more. */
|
|
1431
1431
|
th[data-highlight='active'],
|
package/dist/admin/index.mjs
CHANGED
|
@@ -1343,7 +1343,7 @@ const fo = /* @__PURE__ */ new Set(), Zn = /* @__PURE__ */ new Set(), go = /* @_
|
|
|
1343
1343
|
children: [
|
|
1344
1344
|
/* @__PURE__ */ f(Wu, { alignItems: "center", children: [
|
|
1345
1345
|
/* @__PURE__ */ a(Ku, { children: /* @__PURE__ */ a(mi, {}) }),
|
|
1346
|
-
/* @__PURE__ */ a(A, { fontWeight: "bold", children: r.title || r.file?.name || (u ? "Audio" : "Audio
|
|
1346
|
+
/* @__PURE__ */ a(A, { fontWeight: "bold", children: r.title || r.file?.name || (u ? "Audio" : "Audio - click to add a file") })
|
|
1347
1347
|
] }),
|
|
1348
1348
|
u ? /* @__PURE__ */ a(
|
|
1349
1349
|
Gu,
|
|
@@ -1354,7 +1354,7 @@ const fo = /* @__PURE__ */ new Set(), Zn = /* @__PURE__ */ new Set(), go = /* @_
|
|
|
1354
1354
|
preload: r.player?.preload ?? "metadata"
|
|
1355
1355
|
},
|
|
1356
1356
|
r.file.url
|
|
1357
|
-
) : /* @__PURE__ */ a(Vu, { variant: "pi", children: "No audio selected
|
|
1357
|
+
) : /* @__PURE__ */ a(Vu, { variant: "pi", children: "No audio selected - click to choose from the Media Library or paste a URL." }),
|
|
1358
1358
|
r.file?.size ? /* @__PURE__ */ f(A, { variant: "pi", textColor: "neutral500", children: [
|
|
1359
1359
|
_i(r.file.size),
|
|
1360
1360
|
r.file.mime ? ` · ${r.file.mime}` : ""
|
|
@@ -1706,7 +1706,7 @@ const fo = /* @__PURE__ */ new Set(), Zn = /* @__PURE__ */ new Set(), go = /* @_
|
|
|
1706
1706
|
lp,
|
|
1707
1707
|
{
|
|
1708
1708
|
value: t ?? "",
|
|
1709
|
-
placeholder: "
|
|
1709
|
+
placeholder: "-",
|
|
1710
1710
|
spellCheck: !1,
|
|
1711
1711
|
onChange: (r) => n(r.target.value)
|
|
1712
1712
|
}
|
|
@@ -3975,7 +3975,7 @@ const fo = /* @__PURE__ */ new Set(), Zn = /* @__PURE__ */ new Set(), go = /* @_
|
|
|
3975
3975
|
)
|
|
3976
3976
|
] }) : null
|
|
3977
3977
|
] }),
|
|
3978
|
-
/* @__PURE__ */ a(yh, { children: /* @__PURE__ */ a(vh, { $scale: h, children: o.trim() ? i(o) : /* @__PURE__ */ a(A, { variant: "pi", textColor: "neutral400", children: "
|
|
3978
|
+
/* @__PURE__ */ a(yh, { children: /* @__PURE__ */ a(vh, { $scale: h, children: o.trim() ? i(o) : /* @__PURE__ */ a(A, { variant: "pi", textColor: "neutral400", children: "-" }) }) })
|
|
3979
3979
|
] })
|
|
3980
3980
|
] }) }),
|
|
3981
3981
|
/* @__PURE__ */ f(gh, { children: [
|
|
@@ -4792,7 +4792,7 @@ const Br = (e) => {
|
|
|
4792
4792
|
),
|
|
4793
4793
|
/* @__PURE__ */ a(to, { variant: "pi", children: s({
|
|
4794
4794
|
id: "components.Blocks.embed.hint.code",
|
|
4795
|
-
defaultMessage: "Only the <iframe> is kept
|
|
4795
|
+
defaultMessage: "Only the <iframe> is kept - scripts, event handlers and unknown attributes are removed before saving."
|
|
4796
4796
|
}) })
|
|
4797
4797
|
] }),
|
|
4798
4798
|
d.error ? /* @__PURE__ */ a(Kh, { variant: "pi", children: d.error }) : null,
|
|
@@ -5078,7 +5078,7 @@ const Br = (e) => {
|
|
|
5078
5078
|
}
|
|
5079
5079
|
) : /* @__PURE__ */ f(tf, { alignItems: "center", gap: 2, children: [
|
|
5080
5080
|
/* @__PURE__ */ a(Tn, {}),
|
|
5081
|
-
/* @__PURE__ */ a(A, { variant: "pi", children: "Embed
|
|
5081
|
+
/* @__PURE__ */ a(A, { variant: "pi", children: "Embed - click to add a URL or embed code." })
|
|
5082
5082
|
] }) }),
|
|
5083
5083
|
c && !s ? /* @__PURE__ */ a(
|
|
5084
5084
|
Vh,
|
|
@@ -5513,7 +5513,7 @@ const Br = (e) => {
|
|
|
5513
5513
|
),
|
|
5514
5514
|
/* @__PURE__ */ a(A, { variant: "pi", textColor: "neutral600", children: i({
|
|
5515
5515
|
id: "components.Blocks.social.field.embedCode.hint",
|
|
5516
|
-
defaultMessage: "Pasting an embed code is enough on its own
|
|
5516
|
+
defaultMessage: "Pasting an embed code is enough on its own - the post URL is optional."
|
|
5517
5517
|
}) })
|
|
5518
5518
|
] })
|
|
5519
5519
|
] }),
|
|
@@ -6324,7 +6324,7 @@ const Br = (e) => {
|
|
|
6324
6324
|
/* @__PURE__ */ a(A, { variant: "pi", fontWeight: "bold", children: $.title }),
|
|
6325
6325
|
/* @__PURE__ */ a(A, { variant: "pi", textColor: "neutral500", children: $.signed ? s({
|
|
6326
6326
|
id: "components.Blocks.video.mux.signed",
|
|
6327
|
-
defaultMessage: "Signed playback
|
|
6327
|
+
defaultMessage: "Signed playback - not supported"
|
|
6328
6328
|
}) : $.isReady ? $.aspect_ratio || "" : s({
|
|
6329
6329
|
id: "components.Blocks.video.mux.notReady",
|
|
6330
6330
|
defaultMessage: "Still processing"
|
|
@@ -6817,7 +6817,7 @@ const Br = (e) => {
|
|
|
6817
6817
|
}
|
|
6818
6818
|
) : /* @__PURE__ */ f(Dg, { alignItems: "center", gap: 2, children: [
|
|
6819
6819
|
/* @__PURE__ */ a(Ir, {}),
|
|
6820
|
-
/* @__PURE__ */ a(A, { variant: "pi", children: "Video
|
|
6820
|
+
/* @__PURE__ */ a(A, { variant: "pi", children: "Video - click to choose a file, paste a URL, or add a Mux playback ID." })
|
|
6821
6821
|
] }) }),
|
|
6822
6822
|
c && !s ? /* @__PURE__ */ a(
|
|
6823
6823
|
$g,
|
|
@@ -7901,7 +7901,7 @@ const Br = (e) => {
|
|
|
7901
7901
|
text-align: inherit;
|
|
7902
7902
|
}
|
|
7903
7903
|
|
|
7904
|
-
/* Cells carry their own highlight
|
|
7904
|
+
/* Cells carry their own highlight - with colSpan/rowSpan in play, a cell's
|
|
7905
7905
|
index within its row is no longer its visual column, so nth-child rules
|
|
7906
7906
|
can't identify a column any more. */
|
|
7907
7907
|
th[data-highlight='active'],
|
|
@@ -14925,7 +14925,7 @@ const E0 = (...e) => (t) => e.reduce((n, r) => r(n), t), M0 = S.forwardRef(
|
|
|
14925
14925
|
...Ng,
|
|
14926
14926
|
...Jf,
|
|
14927
14927
|
// Types other packages registered. Last, so a registration can never
|
|
14928
|
-
// quietly replace a built-in
|
|
14928
|
+
// quietly replace a built-in - `registerBlock` rejects that outright,
|
|
14929
14929
|
// and this ordering means a bug there cannot become a silent override.
|
|
14930
14930
|
...R
|
|
14931
14931
|
}),
|
|
@@ -29,7 +29,7 @@ export type EditorBlockDefinition = BlockDefinition & {
|
|
|
29
29
|
renderElement: (props: RenderElementProps) => React.JSX.Element;
|
|
30
30
|
/**
|
|
31
31
|
* Icon for the Insert menu and the slash command. Required to appear in
|
|
32
|
-
* either
|
|
32
|
+
* either - a block with no icon is still rendered, just not offered.
|
|
33
33
|
*/
|
|
34
34
|
icon?: React.ComponentType;
|
|
35
35
|
/** Menu label. A plain string is fine; a descriptor gets translated. */
|
|
@@ -43,7 +43,7 @@ export type EditorBlockDefinition = BlockDefinition & {
|
|
|
43
43
|
/** Text that converts into this block as you type, e.g. '```mermaid'. */
|
|
44
44
|
snippets?: string[];
|
|
45
45
|
/**
|
|
46
|
-
* Anything `isVoid` cannot express
|
|
46
|
+
* Anything `isVoid` cannot express - custom normalization, paste handling,
|
|
47
47
|
* key bindings. Applied when the editor is created.
|
|
48
48
|
*/
|
|
49
49
|
withEditor?: (editor: Editor) => Editor;
|
|
@@ -8,7 +8,7 @@ import { isEmbeddableUrl } from './embedProviders';
|
|
|
8
8
|
*/
|
|
9
9
|
declare const insertEmbed: (editor: Editor, initial?: Partial<EmbedElement>) => void;
|
|
10
10
|
/**
|
|
11
|
-
* Insert a ready-to-render embed straight from a share URL
|
|
11
|
+
* Insert a ready-to-render embed straight from a share URL - used by the
|
|
12
12
|
* toolbar's media button, which takes the URL up front and so can skip the
|
|
13
13
|
* modal entirely. Returns false when the URL isn't one we can embed.
|
|
14
14
|
*
|
|
@@ -6,7 +6,7 @@ import { createTableCell, createTableRow, insertTable } from './tableOperations'
|
|
|
6
6
|
* across cells, normalizing rows away, converting a cell to a paragraph, …).
|
|
7
7
|
*
|
|
8
8
|
* Structural edits are performed by tableOperations, which lifts the guard via
|
|
9
|
-
* `allowTableEdit`. Inline editing inside a cell
|
|
9
|
+
* `allowTableEdit`. Inline editing inside a cell - marks, links, inline math -
|
|
10
10
|
* is deliberately untouched, so cells keep full rich-text parity.
|
|
11
11
|
*/
|
|
12
12
|
declare const withTables: (editor: Editor) => Editor;
|
|
@@ -2,7 +2,7 @@ import * as React from 'react';
|
|
|
2
2
|
/** Size of the hover grid. Larger tables go through the custom-size inputs. */
|
|
3
3
|
declare const GRID_ROWS = 10;
|
|
4
4
|
declare const GRID_COLS = 10;
|
|
5
|
-
/** Upper bound for the custom-size inputs
|
|
5
|
+
/** Upper bound for the custom-size inputs - a guard against typos, not a limit
|
|
6
6
|
* anyone should hit in practice. */
|
|
7
7
|
declare const MAX_DIMENSION = 50;
|
|
8
8
|
interface TableGridPickerProps {
|
|
@@ -19,7 +19,7 @@ export declare const InsertColumnLeftIcon: ({ fill }: TableIconProps) => React.J
|
|
|
19
19
|
export declare const InsertColumnRightIcon: ({ fill }: TableIconProps) => React.JSX.Element;
|
|
20
20
|
export declare const DeleteRowIcon: ({ fill }: TableIconProps) => React.JSX.Element;
|
|
21
21
|
export declare const DeleteColumnIcon: ({ fill }: TableIconProps) => React.JSX.Element;
|
|
22
|
-
/** Table frame with a solid top row
|
|
22
|
+
/** Table frame with a solid top row - the "toggle header row" affordance. */
|
|
23
23
|
export declare const HeaderRowIcon: ({ fill }: TableIconProps) => React.JSX.Element;
|
|
24
24
|
/**
|
|
25
25
|
* Merge: the top-left 2x2 block reads as one tinted cell, with arrows pointing
|
|
@@ -7,7 +7,7 @@ interface TableToolbarProps {
|
|
|
7
7
|
/**
|
|
8
8
|
* Contextual toolbar that floats above a table while the caret is inside it.
|
|
9
9
|
*
|
|
10
|
-
* Every row/column action is directional and anchored on the focused cell
|
|
10
|
+
* Every row/column action is directional and anchored on the focused cell -
|
|
11
11
|
* "insert row above" means above *this* row, not at the end of the table.
|
|
12
12
|
*/
|
|
13
13
|
declare const TableToolbar: ({ location, disabled }: TableToolbarProps) => React.JSX.Element;
|
|
@@ -33,7 +33,7 @@ export interface IframeError {
|
|
|
33
33
|
export declare const sanitizeIframe: (input: string) => SanitizedIframe | IframeError;
|
|
34
34
|
/**
|
|
35
35
|
* Build the iframe markup for a recognized share URL. Returns null when the URL
|
|
36
|
-
* isn't one of the known providers
|
|
36
|
+
* isn't one of the known providers - the author then has to use embed-code mode.
|
|
37
37
|
*/
|
|
38
38
|
export declare const buildUrlEmbed: (url: string, title?: string) => SanitizedIframe | null;
|
|
39
39
|
export declare const ASPECT_RATIOS: AspectRatio[];
|
|
@@ -34,7 +34,7 @@ export interface UseMuxAssetsResult {
|
|
|
34
34
|
*
|
|
35
35
|
* Availability is decided by the asset-list call itself rather than the
|
|
36
36
|
* plugin's `mux-settings` route: that route reports "configured" only when a
|
|
37
|
-
* *webhook signing secret* is also set, which listing assets does not need
|
|
37
|
+
* *webhook signing secret* is also set, which listing assets does not need - so
|
|
38
38
|
* it answers false for perfectly usable installs.
|
|
39
39
|
*/
|
|
40
40
|
export declare const useMuxAssets: (enabled: boolean) => UseMuxAssetsResult;
|
|
@@ -6,8 +6,8 @@ import type { CustomElement, TableCellElement } from '../utils/types';
|
|
|
6
6
|
* Once cells can carry `colSpan` / `rowSpan`, a cell's index within its row
|
|
7
7
|
* stops being its visual column: a row of three cells can cover four columns,
|
|
8
8
|
* and a cell with `rowSpan: 2` occupies a slot in the row below without having
|
|
9
|
-
* a node there. Every structural operation therefore works against this grid
|
|
10
|
-
* a slot-by-slot map of what covers what
|
|
9
|
+
* a node there. Every structural operation therefore works against this grid -
|
|
10
|
+
* a slot-by-slot map of what covers what - rather than against raw child
|
|
11
11
|
* indices.
|
|
12
12
|
*/
|
|
13
13
|
/** A cell as it sits in the grid. One per node, shared by every slot it covers. */
|
|
@@ -29,7 +29,7 @@ export interface TableGrid {
|
|
|
29
29
|
rowCount: number;
|
|
30
30
|
/** Total grid columns, spans included. */
|
|
31
31
|
colCount: number;
|
|
32
|
-
/** `matrix[row][col]`
|
|
32
|
+
/** `matrix[row][col]` - the cell covering that slot, or undefined if ragged. */
|
|
33
33
|
matrix: (GridCell | undefined)[][];
|
|
34
34
|
/** Every cell once, in document order. */
|
|
35
35
|
cells: GridCell[];
|
|
@@ -55,7 +55,7 @@ export declare const findCellByPath: (grid: TableGrid, path: Path) => GridCell |
|
|
|
55
55
|
export declare const cellsOriginatingInRow: (grid: TableGrid, row: number) => GridCell[];
|
|
56
56
|
/**
|
|
57
57
|
* Where a new cell covering grid column `col` has to be inserted among row
|
|
58
|
-
* `row`'s children
|
|
58
|
+
* `row`'s children - i.e. how many of that row's own cells start left of it.
|
|
59
59
|
* Cells that merely reach into the row from above have no node here and so
|
|
60
60
|
* don't count.
|
|
61
61
|
*/
|
|
@@ -66,7 +66,7 @@ export declare const covers: (cell: GridCell, row: number, col: number) => boole
|
|
|
66
66
|
* Grows `range` until every cell it touches is fully inside it.
|
|
67
67
|
*
|
|
68
68
|
* Selecting two cells that a third one straddles can't produce a rectangle
|
|
69
|
-
* without swallowing that third cell
|
|
69
|
+
* without swallowing that third cell - so the range expands to include it,
|
|
70
70
|
* which may in turn pull in others. Repeats to a fixed point, which always
|
|
71
71
|
* terminates because the range only ever grows and is bounded by the table.
|
|
72
72
|
*/
|
|
@@ -77,13 +77,13 @@ export declare const cellsInRange: (grid: TableGrid, range: GridRange) => GridCe
|
|
|
77
77
|
* The rectangle of cells the selection covers, or null when it stays within a
|
|
78
78
|
* single cell.
|
|
79
79
|
*
|
|
80
|
-
* The selection model is Slate's own
|
|
80
|
+
* The selection model is Slate's own - dragging across cells already produces a
|
|
81
81
|
* range spanning both, and Shift+arrow already extends it, so there's no
|
|
82
82
|
* separate cell-selection state to keep in sync.
|
|
83
83
|
*
|
|
84
84
|
* Only the two *endpoints* define the rectangle, though. A document range is
|
|
85
85
|
* linear, so everything between r2c1 and r3c2 includes the whole tail of row 2
|
|
86
|
-
*
|
|
86
|
+
* - taking the bounding box of every touched cell would turn a 2x2 pick into a
|
|
87
87
|
* full-width 2x5 one. Treating anchor and focus as opposite corners gives the
|
|
88
88
|
* 2D behavior authors expect from a table.
|
|
89
89
|
*/
|
|
@@ -54,7 +54,7 @@ declare const isHeaderRowAt: (table: CustomElement, rowIndex: number) => boolean
|
|
|
54
54
|
* Inserts a column beside the caret's cell.
|
|
55
55
|
*
|
|
56
56
|
* A cell that straddles the insertion boundary is widened rather than given a
|
|
57
|
-
* new neighbour
|
|
57
|
+
* new neighbour - otherwise the merge would visually break apart. Every other
|
|
58
58
|
* row gets a fresh cell, placed at the child index that lands it in the new
|
|
59
59
|
* grid column (which is not the same as the column number once spans exist).
|
|
60
60
|
*/
|
|
@@ -74,7 +74,7 @@ declare const insertRow: (editor: Editor, location: TableLocation, position: 'ab
|
|
|
74
74
|
* Deletes the row the caret sits in.
|
|
75
75
|
*
|
|
76
76
|
* Cells reaching into the row from above simply shrink. Cells that *start* in
|
|
77
|
-
* the row but continue below it can't just be removed
|
|
77
|
+
* the row but continue below it can't just be removed - they're re-inserted
|
|
78
78
|
* into the following row, one row shorter, so the merge survives.
|
|
79
79
|
*/
|
|
80
80
|
declare const deleteRow: (editor: Editor, location: TableLocation) => void;
|
|
@@ -83,7 +83,7 @@ declare const deleteTable: (editor: Editor, location: TableLocation) => void;
|
|
|
83
83
|
* Whether a range straddles the header/body divide.
|
|
84
84
|
*
|
|
85
85
|
* A header cell labels a column; one that runs from the header down into the
|
|
86
|
-
* body labels nothing and belongs to neither. HTML agrees
|
|
86
|
+
* body labels nothing and belongs to neither. HTML agrees - a `rowSpan` may not
|
|
87
87
|
* cross the `<thead>`/`<tbody>` boundary, so a browser would clamp it and render
|
|
88
88
|
* something different from what the editor shows. Merging is therefore confined
|
|
89
89
|
* to one side of the divide. Merging *within* the header (a heading spanning two
|
|
@@ -99,7 +99,7 @@ declare const canSplitCell: (location: TableLocation) => boolean;
|
|
|
99
99
|
*
|
|
100
100
|
* The range arrives already squared off (see expandRangeToRectangle), so the
|
|
101
101
|
* result always tiles the grid. Content from the absorbed cells is appended to
|
|
102
|
-
* the anchor rather than discarded
|
|
102
|
+
* the anchor rather than discarded - losing an author's text to a layout
|
|
103
103
|
* operation would be unforgivable.
|
|
104
104
|
*/
|
|
105
105
|
declare const mergeCells: (editor: Editor, location: TableLocation) => void;
|
|
@@ -9,7 +9,7 @@ export declare const MUX_HOSTS: {
|
|
|
9
9
|
*
|
|
10
10
|
* Only valid for assets with a **public** playback policy. Signed playback
|
|
11
11
|
* requires a per-request JWT (`?token=…`) that must be minted server-side with
|
|
12
|
-
* a Mux signing key, which this block deliberately does not handle
|
|
12
|
+
* a Mux signing key, which this block deliberately does not handle - storing a
|
|
13
13
|
* short-lived token in the document body would break as soon as it expired.
|
|
14
14
|
*/
|
|
15
15
|
export declare const muxPlaybackUrl: (playbackId: string) => string;
|
|
@@ -30,7 +30,7 @@ export declare const detectVideoSource: (input: string) => DetectedVideo | null;
|
|
|
30
30
|
/**
|
|
31
31
|
* True when the URL needs an HLS/DASH-capable player rather than a plain
|
|
32
32
|
* `<video src>`. Safari plays HLS natively; other browsers need hls.js or a
|
|
33
|
-
* provider player, which is a frontend-renderer concern
|
|
33
|
+
* provider player, which is a frontend-renderer concern - the editor preview
|
|
34
34
|
* degrades to the poster image instead.
|
|
35
35
|
*/
|
|
36
36
|
export declare const isStreamingUrl: (url: string) => boolean;
|
|
@@ -31,7 +31,7 @@ type SelectorBlockKey = (typeof selectorBlockKeys)[number];
|
|
|
31
31
|
declare const isSelectorBlockKey: (key: unknown) => key is "image" | "audio" | "math" | "diagram" | "callout" | "details" | "button" | "social-embed" | "embed" | "video" | "code" | "paragraph" | "heading-one" | "heading-two" | "heading-three" | "heading-four" | "heading-five" | "heading-six" | "list-ordered" | "list-unordered" | "list-todo" | "quote";
|
|
32
32
|
/**
|
|
33
33
|
* The built-in keys are spelled out so `blocks.paragraph` stays typed, while
|
|
34
|
-
* the index signature leaves room for the types other packages register
|
|
34
|
+
* the index signature leaves room for the types other packages register - see
|
|
35
35
|
* `registerBlock`. Without it, every consumer that walks the store would have
|
|
36
36
|
* to widen at the call site.
|
|
37
37
|
*/
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
* content fits.
|
|
16
16
|
* - `scrollbar-width` must be overridden to `auto` (not `thin`) to un-hide the
|
|
17
17
|
* design-system's `none`. `auto` keeps the `::-webkit-scrollbar`
|
|
18
|
-
* pseudo-elements active, whereas `thin`
|
|
18
|
+
* pseudo-elements active, whereas `thin` - like `scrollbar-color` - makes
|
|
19
19
|
* Chromium fall back to an OS overlay scrollbar that is invisible until you
|
|
20
20
|
* scroll (defeating the purpose on macOS). We therefore do NOT set
|
|
21
21
|
* `scrollbar-color`; Firefox falls back to its own always-visible bar.
|
|
@@ -96,7 +96,7 @@ export interface AudioPlayerSettings {
|
|
|
96
96
|
* Audio block. A void block referencing a Strapi Media Library asset (or an
|
|
97
97
|
* external URL). Stores the file metadata plus a display title, caption, player
|
|
98
98
|
* behavior flags and alignment. The frontend renderer turns this into a native
|
|
99
|
-
* HTML5 `<audio>` player
|
|
99
|
+
* HTML5 `<audio>` player - see issue #43 for the renderer contract.
|
|
100
100
|
*/
|
|
101
101
|
export interface AudioElement extends CustomElement {
|
|
102
102
|
type: 'audio';
|
|
@@ -207,7 +207,7 @@ export interface ButtonElement extends CustomElement {
|
|
|
207
207
|
/** "link" → hyperlink, "file" → Media Library download. */
|
|
208
208
|
buttonType: ButtonMode;
|
|
209
209
|
/**
|
|
210
|
-
* Visible button label. NOTE: must not be named `text`
|
|
210
|
+
* Visible button label. NOTE: must not be named `text` - Slate treats any node
|
|
211
211
|
* with a string `text` property as a Text leaf, which would break this element.
|
|
212
212
|
*/
|
|
213
213
|
label: string;
|
|
@@ -238,7 +238,7 @@ export interface TableCellElement extends CustomElement {
|
|
|
238
238
|
align?: TableCellAlign;
|
|
239
239
|
/**
|
|
240
240
|
* Columns this cell covers, from merging. Absent means 1, so unmerged cells
|
|
241
|
-
*
|
|
241
|
+
* - the overwhelming majority - store nothing and existing tables stay valid.
|
|
242
242
|
*/
|
|
243
243
|
colSpan?: number;
|
|
244
244
|
/** Rows this cell covers. Absent means 1. */
|
|
@@ -332,7 +332,7 @@ export interface EmbedElement extends CustomElement {
|
|
|
332
332
|
iframe?: string;
|
|
333
333
|
/**
|
|
334
334
|
* Sanitized iframe markup to render. Always present once the block has a
|
|
335
|
-
* source
|
|
335
|
+
* source - renderers should output this and ignore `url`/`iframe`.
|
|
336
336
|
*/
|
|
337
337
|
embedHtml?: string;
|
|
338
338
|
/** The `src` of `embedHtml`, hoisted so renderers can check the host. */
|
|
@@ -365,7 +365,7 @@ export interface VideoPlayerSettings {
|
|
|
365
365
|
* a provider playback id, or a direct URL) plus display and player settings.
|
|
366
366
|
*
|
|
367
367
|
* NOTE: player flags are nested under `player` rather than sitting at the top
|
|
368
|
-
* level as issue #44 proposed, to match the sibling `audio` block
|
|
368
|
+
* level as issue #44 proposed, to match the sibling `audio` block - one shape
|
|
369
369
|
* for renderers to learn, not two.
|
|
370
370
|
*/
|
|
371
371
|
export interface VideoElement extends CustomElement {
|
package/dist/server/index.mjs
CHANGED
|
@@ -99,7 +99,7 @@ const k = ({ strapi: o }) => {
|
|
|
99
99
|
// seconds (24h)
|
|
100
100
|
// Upper bound on cached embeds, evicted least-recently-used. Without one
|
|
101
101
|
// the cache keeps an entry for every post ever embedded, for the life of
|
|
102
|
-
// the process
|
|
102
|
+
// the process - expiry alone never frees anything nobody asks for again.
|
|
103
103
|
cacheMaxEntries: 500,
|
|
104
104
|
instagram: { accessToken: void 0 },
|
|
105
105
|
facebook: { accessToken: void 0 }
|
|
@@ -230,7 +230,7 @@ const k = ({ strapi: o }) => {
|
|
|
230
230
|
{
|
|
231
231
|
method: "GET",
|
|
232
232
|
path: "/oembed",
|
|
233
|
-
// Social oEmbed proxy
|
|
233
|
+
// Social oEmbed proxy - fetches a post's embed payload server-side.
|
|
234
234
|
handler: "oembed.fetch",
|
|
235
235
|
config: {
|
|
236
236
|
policies: ["admin::isAuthenticatedAdmin"]
|
|
@@ -43,7 +43,7 @@ export declare const buildLinkedInIframe: (url: string) => NormalisedOEmbed | nu
|
|
|
43
43
|
* Platform oEmbed markup often ships the widget script inline (TikTok always
|
|
44
44
|
* does; Twitter/Instagram only when `omit_script` isn't honoured). Renderers
|
|
45
45
|
* inject that script themselves, and a `<script>` added through `innerHTML`
|
|
46
|
-
* never executes anyway
|
|
46
|
+
* never executes anyway - worse, its inert tag makes a renderer believe the
|
|
47
47
|
* widget is already loaded. Strip it so the stored html is markup only.
|
|
48
48
|
*/
|
|
49
49
|
export declare const stripScripts: (html: string) => string;
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
*
|
|
4
4
|
* The oEmbed service used a bare `Map` keyed by URL, which meant one entry for
|
|
5
5
|
* every social post ever embedded, for the life of the process. Entries expired
|
|
6
|
-
* logically
|
|
6
|
+
* logically - a stale hit was discarded on read - but nothing ever removed them,
|
|
7
7
|
* so a long-running instance kept the memory whether or not anyone asked for
|
|
8
8
|
* that post again.
|
|
9
9
|
*
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@qkix/strapi-plugin-better-blocks",
|
|
3
|
-
"version": "0.23.
|
|
3
|
+
"version": "0.23.7",
|
|
4
4
|
"description": "An enhanced Rich Text (Blocks) field for Strapi with inline color picker and more",
|
|
5
5
|
"strapi": {
|
|
6
6
|
"kind": "plugin",
|
|
@@ -55,7 +55,7 @@
|
|
|
55
55
|
"remark-parse": "^11.0.0",
|
|
56
56
|
"shiki": "^4.3.0",
|
|
57
57
|
"unified": "^11.0.5",
|
|
58
|
-
"@qkix/better-blocks-core": "^0.2.
|
|
58
|
+
"@qkix/better-blocks-core": "^0.2.5"
|
|
59
59
|
},
|
|
60
60
|
"devDependencies": {
|
|
61
61
|
"@strapi/sdk-plugin": "^5.3.2",
|