@zydon/common-csr 2.1.22 → 2.1.23
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
CHANGED
|
@@ -1,40 +1,97 @@
|
|
|
1
|
-
|
|
1
|
+
# Commons CSR (@zydon/common-csr)
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Biblioteca de componentes e hooks compartilhados para projetos React com Client-Side Rendering (CSR) do ecossistema Zydon. Complementa o pacote `@zydon/common` com recursos especificos para renderizacao no lado do cliente.
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
- **instalação dependências necessárias:** `yarn add @emotion/react @emotion/styled @mui/material react-router-dom`
|
|
7
|
-
- **instalação @types necessários:** `yarn add @types/react-lazy-load-image-component -D`
|
|
5
|
+
## Proposito
|
|
8
6
|
|
|
9
|
-
|
|
10
|
-
> Esse pacote tem os seguintes recursos disponiveis (components, hooks e utils):
|
|
7
|
+
Fornecer componentes de UI reutilizaveis (navegacao, editores rich text, editores SQL) e hooks utilitarios que sao exclusivos para aplicacoes CSR, evitando duplicacao de codigo entre os microfrontends da Zydon.
|
|
11
8
|
|
|
12
|
-
##
|
|
9
|
+
## Funcionalidades Principais
|
|
13
10
|
|
|
14
|
-
- **Image
|
|
11
|
+
- **Componente Image**: Imagem otimizada construida sobre `react-lazy-load-image-component` com lazy loading
|
|
12
|
+
- **Navegacao**: Componentes de menu em tres variantes (NavSectionHorizontal, NavSectionMini, NavSectionVertical)
|
|
13
|
+
- **Editor rich text**: Editor de texto rico construido sobre `react-quill` com versoes standalone e integrada a formularios
|
|
14
|
+
- **Editor SQL**: Editor de queries SQL com highlight, disponivel como campo de formulario `react-hook-form`
|
|
15
|
+
- **Hook useActiveLink**: Verifica se uma rota especifica esta ativa no React Router
|
|
15
16
|
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
17
|
+
## Arquitetura e Stack
|
|
18
|
+
|
|
19
|
+
| Categoria | Tecnologia |
|
|
20
|
+
|-----------|-----------|
|
|
21
|
+
| Framework | React |
|
|
22
|
+
| Linguagem | TypeScript |
|
|
23
|
+
| UI | MUI (Material UI) |
|
|
24
|
+
| Roteamento | React Router DOM |
|
|
25
|
+
| Imagens | react-lazy-load-image-component |
|
|
26
|
+
| Editor rich text | react-quill |
|
|
27
|
+
| Formularios | react-hook-form |
|
|
28
|
+
|
|
29
|
+
## Componentes Exportados
|
|
30
|
+
|
|
31
|
+
### Componentes de UI
|
|
32
|
+
|
|
33
|
+
| Componente | Descricao |
|
|
34
|
+
|-----------|-----------|
|
|
35
|
+
| `Image` | Componente de imagem com lazy loading. Priorize este componente ao renderizar imagens |
|
|
36
|
+
| `Editor` | Editor rich text construido sobre react-quill |
|
|
37
|
+
| `EditorField` | Editor rich text como campo de formulario react-hook-form |
|
|
38
|
+
| `SQLEditor` | Editor SQL construido sobre react-quill |
|
|
39
|
+
| `SQLEditorField` | Editor SQL como campo de formulario react-hook-form |
|
|
40
|
+
|
|
41
|
+
### Componentes de Navegacao
|
|
42
|
+
|
|
43
|
+
| Componente | Descricao |
|
|
44
|
+
|-----------|-----------|
|
|
45
|
+
| `NavSectionHorizontal` | Itens de navegacao dispostos horizontalmente |
|
|
46
|
+
| `NavSectionMini` | Itens de navegacao em versao compacta/mini |
|
|
47
|
+
| `NavSectionVertical` | Itens de navegacao dispostos verticalmente |
|
|
24
48
|
|
|
25
49
|
### Hooks
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
50
|
+
|
|
51
|
+
| Hook | Descricao |
|
|
52
|
+
|------|-----------|
|
|
53
|
+
| `useActiveLink` | Retorna se a rota passada como parametro esta ativa ou nao |
|
|
54
|
+
|
|
55
|
+
## Como Utilizar
|
|
56
|
+
|
|
57
|
+
### Instalacao
|
|
58
|
+
|
|
59
|
+
```bash
|
|
60
|
+
yarn add @zydon/common-csr
|
|
61
|
+
yarn add @emotion/react @emotion/styled @mui/material react-router-dom
|
|
62
|
+
yarn add @types/react-lazy-load-image-component -D
|
|
63
|
+
```
|
|
64
|
+
|
|
65
|
+
## Desenvolvimento
|
|
66
|
+
|
|
67
|
+
### Pre-requisitos
|
|
68
|
+
|
|
69
|
+
- Node.js
|
|
70
|
+
- Yarn
|
|
71
|
+
|
|
72
|
+
### Testando localmente
|
|
73
|
+
|
|
74
|
+
1. Clone o repositorio
|
|
75
|
+
2. Crie uma branch para suas alteracoes
|
|
76
|
+
3. Realize as implementacoes/correcoes
|
|
77
|
+
4. Compile e crie o link local:
|
|
78
|
+
```bash
|
|
79
|
+
yarn build
|
|
80
|
+
npm link
|
|
81
|
+
```
|
|
82
|
+
5. Em outro projeto, conecte o pacote local:
|
|
83
|
+
```bash
|
|
84
|
+
npm link @zydon/common-csr
|
|
85
|
+
```
|
|
86
|
+
6. Utilize o componente `App.tsx` para testar implementacoes de forma pratica
|
|
87
|
+
|
|
88
|
+
### Publicacao
|
|
89
|
+
|
|
90
|
+
Apos merge na branch `main`, as alteracoes sao publicadas automaticamente no npm.
|
|
91
|
+
|
|
92
|
+
### Comandos
|
|
93
|
+
|
|
94
|
+
| Comando | Descricao |
|
|
95
|
+
|---------|-----------|
|
|
96
|
+
| `yarn build` | Compila o pacote |
|
|
97
|
+
| `npm link` | Cria link simbolico para testes locais |
|
|
@@ -25,6 +25,6 @@ import co from '@mui/material/Popover';
|
|
|
25
25
|
import mo from '@mui/material/TextField';
|
|
26
26
|
import uo from '@mui/material/Typography';
|
|
27
27
|
|
|
28
|
-
var e={root:"nml__editor__root",toolbar:{hr:"nml__editor__toolbar__hr",root:"nml__editor__toolbar__root",bold:"nml__editor__toolbar__bold",code:"nml__editor__toolbar__code",undo:"nml__editor__toolbar__undo",redo:"nml__editor__toolbar__redo",link:"nml__editor__toolbar__link",clear:"nml__editor__toolbar__clear",image:"nml__editor__toolbar__image",italic:"nml__editor__toolbar__italic",strike:"nml__editor__toolbar__strike",hardbreak:"nml__editor__toolbar__hardbreak",unsetlink:"nml__editor__toolbar__unsetlink",codeBlock:"nml__editor__toolbar__code__block",alignLeft:"nml__editor__toolbar__align__left",fullscreen:"nml__editor__toolbar__fullscreen",blockquote:"nml__editor__toolbar__blockquote",bulletList:"nml__editor__toolbar__bullet__list",alignRight:"nml__editor__toolbar__align__right",orderedList:"nml__editor__toolbar__ordered__list",alignCenter:"nml__editor__toolbar__align__center",alignJustify:"nml__editor__toolbar__align__justify"},content:{hr:"nml__editor__content__hr",root:"nml__editor__content__root",link:"nml__editor__content__link",image:"nml__editor__content__image",codeInline:"nml__editor__content__code",heading:"nml__editor__content__heading",listItem:"nml__editor__content__listItem",codeBlock:"nml__editor__content__code__block",blockquote:"nml__editor__content__blockquote",langSelect:"nml__editor__content__lang__select",placeholder:"nml__editor__content__placeholder",bulletList:"nml__editor__content__bullet__list",orderedList:"nml__editor__content__ordered__list"}};var T=({node:{attrs:{language:o}},extension:a,updateAttributes:i})=>jsxs(NodeViewWrapper,{className:e.content.codeBlock,children:[jsxs("select",{name:"language",contentEditable:!1,defaultValue:o,onChange:t=>i({language:t.target.value}),className:e.content.langSelect,children:[jsx("option",{value:"null",children:"auto"}),jsx("option",{disabled:!0,children:"\u2014"}),a.options.lowlight.listLanguages().map(t=>jsx("option",{value:t,children:t},t))]}),jsx("pre",{children:jsx(NodeViewContent,{as:"code"})})]});var G="0.75em",S=styled(d,{shouldForwardProp:o=>o!=="error"&&o!=="disabled"&&o!=="fullScreen"})(({error:o,disabled:a,fullScreen:i,theme:t})=>({minHeight:240,borderRadius:t.shape.borderRadius,border:`solid 1px ${varAlpha(t.vars.palette.grey["500Channel"],.2)}`,scrollbarWidth:"thin",scrollbarColor:`${varAlpha(t.vars.palette.text.disabledChannel,.4)} ${varAlpha(t.vars.palette.text.disabledChannel,.08)}`,...o&&{border:`solid 1px ${t.vars.palette.error.main}`},...a&&{opacity:.48,pointerEvents:"none"},...i&&{top:16,left:16,position:"fixed",zIndex:t.zIndex.modal,maxHeight:"unset !important",width:"calc(100% - 32px)",height:"calc(100% - 32px)",backgroundColor:t.vars.palette.background.default},[`& .${e.content.placeholder}`]:{"&:first-of-type::before":{...t.typography.body2,height:0,float:"left",pointerEvents:"none",content:"attr(data-placeholder)",color:t.vars.palette.text.disabled}},[`& .${e.content.root}`]:{display:"flex",flex:"1 1 auto",overflowY:"auto",flexDirection:"column",borderBottomLeftRadius:"inherit",borderBottomRightRadius:"inherit",backgroundColor:varAlpha(t.vars.palette.grey["500Channel"],.08),...o&&{backgroundColor:varAlpha(t.vars.palette.error.mainChannel,.08)},"& .tiptap":{"> * + *":{marginTop:0,marginBottom:G},"&.ProseMirror":{flex:"1 1 auto",outline:"none",padding:t.spacing(0,2)},h1:{...t.typography.h1,marginTop:40,marginBottom:8},h2:{...t.typography.h2,marginTop:40,marginBottom:8},h3:{...t.typography.h3,marginTop:24,marginBottom:8},h4:{...t.typography.h4,marginTop:24,marginBottom:8},h5:{...t.typography.h5,marginTop:24,marginBottom:8},h6:{...t.typography.h6,marginTop:24,marginBottom:8},p:{...t.typography.body1,marginBottom:"1.25rem"},[`& .${e.content.heading}`]:{},[`& .${e.content.link}`]:{color:t.vars.palette.primary.main},[`& .${e.content.hr}`]:{flexShrink:0,borderWidth:0,margin:"2em 0",msFlexNegative:0,WebkitFlexShrink:0,borderStyle:"solid",borderBottomWidth:"thin",borderColor:t.vars.palette.divider},[`& .${e.content.image}`]:{width:"100%",height:"auto",maxWidth:"100%",margin:"auto auto 1.25em"},[`& .${e.content.bulletList}`]:{paddingLeft:16,listStyleType:"disc"},[`& .${e.content.orderedList}`]:{paddingLeft:16},[`& .${e.content.listItem}`]:{lineHeight:2,"& > p":{margin:0,display:"inline-block"}},[`& .${e.content.blockquote}`]:{lineHeight:1.5,fontSize:"1.5em",margin:"24px auto",position:"relative",fontFamily:"Georgia, serif",padding:t.spacing(3,3,3,8),color:t.vars.palette.text.secondary,borderLeft:`solid 8px ${varAlpha(t.vars.palette.grey["500Channel"],.08)}`,[t.breakpoints.up("md")]:{width:"100%",maxWidth:640},"& p":{margin:0,fontSize:"inherit",fontFamily:"inherit"},"&::before":{left:16,top:-8,display:"block",fontSize:"3em",content:'"\\201C"',position:"absolute",color:t.vars.palette.text.disabled}},[`& .${e.content.codeInline}`]:{padding:t.spacing(.25,.5),color:t.vars.palette.text.secondary,fontSize:t.typography.body2.fontSize,borderRadius:t.shape.borderRadius/2,backgroundColor:varAlpha(t.vars.palette.grey["500Channel"],.2)},[`& .${e.content.codeBlock}`]:{position:"relative","& pre":{overflowX:"auto",color:t.vars.palette.common.white,padding:t.spacing(5,3,3,3),borderRadius:t.shape.borderRadius,backgroundColor:t.vars.palette.grey[900],fontFamily:"'JetBrainsMono', monospace","& code":{fontSize:t.typography.body2.fontSize}},[`& .${e.content.langSelect}`]:{top:8,right:8,zIndex:1,padding:4,outline:"none",borderRadius:4,position:"absolute",color:t.vars.palette.common.white,fontWeight:t.typography.fontWeightMedium,borderColor:varAlpha(t.vars.palette.grey["500Channel"],.08),backgroundColor:varAlpha(t.vars.palette.grey["500Channel"],.08)}}}}}));var n=({sx:o,icon:a,label:i,active:t,disabled:l,...s})=>jsxs(J,{sx:{px:.75,width:28,height:28,borderRadius:.75,typography:"body2","&:hover":{bgcolor:"action.hover"},...t&&{bgcolor:"action.selected"},...l&&{pointerEvents:"none",cursor:"not-allowed",opacity:.48},...o},...s,children:[a&&jsx(j,{sx:{fontSize:18},children:a}),i&&i]});var no=["Heading 1","Heading 2","Heading 3","Heading 4","Heading 5","Heading 6"],A=({editor:o})=>{let[a,i]=useState(null),t=s=>{i(s.currentTarget);},l=()=>{i(null);};return o?jsxs(Fragment,{children:[jsxs(J,{id:"heading-menu-button","aria-label":"Heading menu button","aria-controls":a?"heading-menu-button":void 0,"aria-haspopup":"true","aria-expanded":a?"true":void 0,onClick:t,sx:{px:1,width:120,height:32,borderRadius:.75,typography:"body2",justifyContent:"space-between",border:s=>`solid 1px ${varAlpha(s.vars.palette.grey["500Channel"],.2)}`},children:[o.isActive("heading",{level:1})&&"Heading 1"||o.isActive("heading",{level:2})&&"Heading 2"||o.isActive("heading",{level:3})&&"Heading 3"||o.isActive("heading",{level:4})&&"Heading 4"||o.isActive("heading",{level:5})&&"Heading 5"||o.isActive("heading",{level:6})&&"Heading 6"||"Paragraph",jsx(ro,{width:16,icon:a?"ARROW_UP_SIMPLE":"ARROW_DOWN_SIMPLE"})]}),jsxs(eo,{id:"heading-menu",anchorEl:a,open:!!a,onClose:l,MenuListProps:{"aria-labelledby":"heading-button"},slotProps:{paper:{sx:{width:120,[`& .${listClasses.root}`]:{gap:.5,display:"flex",flexDirection:"column"},[`& .${buttonBaseClasses.root}`]:{px:1,width:1,height:34,borderRadius:.75,justifyContent:"flex-start","&:hover":{backgroundColor:"action.hover"}}}}},children:[jsx(n,{component:"li",label:"Paragraph",active:o.isActive("paragraph"),onClick:()=>{l(),o.chain().focus().setParagraph().run();}}),no.map((s,p)=>{let g=p+1;return jsx(n,{"aria-label":s,component:"li",label:s,active:o.isActive("heading",{level:g}),onClick:()=>{l(),o.chain().focus().toggleHeading({level:g}).run();},sx:{...s!=="Paragraph"&&{fontSize:18-p,fontWeight:"fontWeightBold"}}},s)})]})]}):null};var P=({editor:o})=>{let[a,i]=useState(""),[t,l]=useState(null),s=c=>{l(c.currentTarget);},p=()=>{l(null);},g=useCallback(()=>{p(),t&&o?.chain().focus().setImage({src:a}).run();},[t,o,a]);return o?jsxs(Fragment,{children:[jsx(n,{"aria-label":"Image",className:e.toolbar.image,onClick:s,icon:jsx("path",{d:"M20 5H4V19L13.2923 9.70649C13.6828 9.31595 14.3159 9.31591 14.7065 9.70641L20 15.0104V5ZM2 3.9934C2 3.44476 2.45531 3 2.9918 3H21.0082C21.556 3 22 3.44495 22 3.9934V20.0066C22 20.5552 21.5447 21 21.0082 21H2.9918C2.44405 21 2 20.5551 2 20.0066V3.9934ZM8 11C6.89543 11 6 10.1046 6 9C6 7.89543 6.89543 7 8 7C9.10457 7 10 7.89543 10 9C10 10.1046 9.10457 11 8 11Z"})}),jsxs(co,{id:t?"simple-popover":void 0,open:!!t,anchorEl:t,onClose:p,anchorOrigin:{vertical:"bottom",horizontal:"left"},slotProps:{paper:{sx:{p:2.5}}},children:[jsx(uo,{variant:"subtitle2",sx:{mb:1},children:"URL"}),jsxs(d,{direction:"row",alignItems:"center",spacing:1,children:[jsx(mo,{size:"small",placeholder:"Enter URL here...",value:a,onChange:c=>{i(c.target.value);},sx:{width:240}}),jsx(so,{variant:"contained",onClick:g,children:"Apply"})]})]})]}):null};var R=({editor:o})=>{let[a,i]=useState(""),[t,l]=useState(null),s=c=>{let L=o?.getAttributes("link").href;l(c.currentTarget),i(L||"");},p=()=>{l(null);},g=useCallback(()=>{p(),a?o?.chain().focus().extendMarkRange("link").setLink({href:a}).run():o?.chain().focus().extendMarkRange("link").unsetLink().run();},[o,a]);return o?jsxs(Fragment,{children:[jsx(n,{"aria-label":"Link",active:o.isActive("link"),className:e.toolbar.link,onClick:s,icon:jsx("path",{d:"M17.6567 14.8284L16.2425 13.4142L17.6567 12C19.2188 10.4379 19.2188 7.90524 17.6567 6.34314C16.0946 4.78105 13.5619 4.78105 11.9998 6.34314L10.5856 7.75736L9.17139 6.34314L10.5856 4.92893C12.9287 2.58578 16.7277 2.58578 19.0709 4.92893C21.414 7.27208 21.414 11.0711 19.0709 13.4142L17.6567 14.8284ZM14.8282 17.6569L13.414 19.0711C11.0709 21.4142 7.27189 21.4142 4.92875 19.0711C2.5856 16.7279 2.5856 12.9289 4.92875 10.5858L6.34296 9.17157L7.75717 10.5858L6.34296 12C4.78086 13.5621 4.78086 16.0948 6.34296 17.6569C7.90506 19.2189 10.4377 19.2189 11.9998 17.6569L13.414 16.2426L14.8282 17.6569ZM14.8282 7.75736L16.2425 9.17157L9.17139 16.2426L7.75717 14.8284L14.8282 7.75736Z"})}),jsx(n,{"aria-label":"Unset link",disabled:!o.isActive("link"),className:e.toolbar.unsetlink,onClick:()=>o.chain().focus().unsetLink().run(),icon:jsx("path",{d:"M17.657 14.8284L16.2428 13.4142L17.657 12C19.2191 10.4379 19.2191 7.90526 17.657 6.34316C16.0949 4.78106 13.5622 4.78106 12.0001 6.34316L10.5859 7.75737L9.17171 6.34316L10.5859 4.92895C12.9291 2.5858 16.7281 2.5858 19.0712 4.92895C21.4143 7.27209 21.4143 11.0711 19.0712 13.4142L17.657 14.8284ZM14.8286 17.6569L13.4143 19.0711C11.0712 21.4142 7.27221 21.4142 4.92907 19.0711C2.58592 16.7279 2.58592 12.9289 4.92907 10.5858L6.34328 9.17159L7.75749 10.5858L6.34328 12C4.78118 13.5621 4.78118 16.0948 6.34328 17.6569C7.90538 19.219 10.438 19.219 12.0001 17.6569L13.4143 16.2427L14.8286 17.6569ZM14.8286 7.75737L16.2428 9.17159L9.17171 16.2427L7.75749 14.8284L14.8286 7.75737ZM5.77539 2.29291L7.70724 1.77527L8.74252 5.63897L6.81067 6.15661L5.77539 2.29291ZM15.2578 18.3611L17.1896 17.8434L18.2249 21.7071L16.293 22.2248L15.2578 18.3611ZM2.29303 5.77527L6.15673 6.81054L5.63909 8.7424L1.77539 7.70712L2.29303 5.77527ZM18.3612 15.2576L22.2249 16.2929L21.7072 18.2248L17.8435 17.1895L18.3612 15.2576Z"})}),jsxs(co,{id:t?"simple-popover":void 0,open:!!t,anchorEl:t,onClose:p,anchorOrigin:{vertical:"bottom",horizontal:"left"},slotProps:{paper:{sx:{p:2.5}}},children:[jsx(uo,{variant:"subtitle2",sx:{mb:1},children:"URL"}),jsxs(d,{direction:"row",alignItems:"center",spacing:1,children:[jsx(mo,{size:"small",placeholder:"Enter URL here...",value:a,onChange:c=>{i(c.target.value);},sx:{width:240}}),jsx(so,{variant:"contained",onClick:g,children:"Apply"})]})]})]}):null};var I=({editor:o,fullItem:a,fullScreen:i,onToggleFullScreen:t})=>o?jsxs(d,{spacing:1,direction:"row",flexWrap:"wrap",alignItems:"center",divider:jsx(ko,{orientation:"vertical",flexItem:!0,sx:{height:16,my:"auto"}}),className:e.toolbar.root,sx:{p:1.25,bgcolor:"background.paper",borderTopRightRadius:"inherit",borderTopLeftRadius:"inherit",borderBottom:l=>`solid 1px ${varAlpha(l.vars.palette.grey["500Channel"],.2)}`},children:[jsx(A,{editor:o}),jsxs(d,{direction:"row",spacing:.5,children:[jsx(n,{"aria-label":"Bold",active:o.isActive("bold"),className:e.toolbar.bold,onClick:()=>o.chain().focus().toggleBold().run(),icon:jsx("path",{d:"M8 11H12.5C13.8807 11 15 9.88071 15 8.5C15 7.11929 13.8807 6 12.5 6H8V11ZM18 15.5C18 17.9853 15.9853 20 13.5 20H6V4H12.5C14.9853 4 17 6.01472 17 8.5C17 9.70431 16.5269 10.7981 15.7564 11.6058C17.0979 12.3847 18 13.837 18 15.5ZM8 13V18H13.5C14.8807 18 16 16.8807 16 15.5C16 14.1193 14.8807 13 13.5 13H8Z"})}),jsx(n,{"aria-label":"Italic",active:o.isActive("italic"),className:e.toolbar.italic,onClick:()=>o.chain().focus().toggleItalic().run(),icon:jsx("path",{d:"M15 20H7V18H9.92661L12.0425 6H9V4H17V6H14.0734L11.9575 18H15V20Z"})}),jsx(n,{"aria-label":"Strike",active:o.isActive("strike"),className:e.toolbar.italic,onClick:()=>o.chain().focus().toggleStrike().run(),icon:jsx("path",{d:"M17.1538 14C17.3846 14.5161 17.5 15.0893 17.5 15.7196C17.5 17.0625 16.9762 18.1116 15.9286 18.867C14.8809 19.6223 13.4335 20 11.5862 20C9.94674 20 8.32335 19.6185 6.71592 18.8555V16.6009C8.23538 17.4783 9.7908 17.917 11.3822 17.917C13.9333 17.917 15.2128 17.1846 15.2208 15.7196C15.2208 15.0939 15.0049 14.5598 14.5731 14.1173C14.5339 14.0772 14.4939 14.0381 14.4531 14H3V12H21V14H17.1538ZM13.076 11H7.62908C7.4566 10.8433 7.29616 10.6692 7.14776 10.4778C6.71592 9.92084 6.5 9.24559 6.5 8.45207C6.5 7.21602 6.96583 6.165 7.89749 5.299C8.82916 4.43299 10.2706 4 12.2219 4C13.6934 4 15.1009 4.32808 16.4444 4.98426V7.13591C15.2448 6.44921 13.9293 6.10587 12.4978 6.10587C10.0187 6.10587 8.77917 6.88793 8.77917 8.45207C8.77917 8.87172 8.99709 9.23796 9.43293 9.55079C9.86878 9.86362 10.4066 10.1135 11.0463 10.3004C11.6665 10.4816 12.3431 10.7148 13.076 11H13.076Z"})})]}),jsxs(d,{direction:"row",spacing:.5,children:[jsx(n,{"aria-label":"Bullet list",active:o.isActive("bulletList"),className:e.toolbar.bulletList,onClick:()=>o.chain().focus().toggleBulletList().run(),icon:jsx("path",{d:"M8 4H21V6H8V4ZM4.5 6.5C3.67157 6.5 3 5.82843 3 5C3 4.17157 3.67157 3.5 4.5 3.5C5.32843 3.5 6 4.17157 6 5C6 5.82843 5.32843 6.5 4.5 6.5ZM4.5 13.5C3.67157 13.5 3 12.8284 3 12C3 11.1716 3.67157 10.5 4.5 10.5C5.32843 10.5 6 11.1716 6 12C6 12.8284 5.32843 13.5 4.5 13.5ZM4.5 20.4C3.67157 20.4 3 19.7284 3 18.9C3 18.0716 3.67157 17.4 4.5 17.4C5.32843 17.4 6 18.0716 6 18.9C6 19.7284 5.32843 20.4 4.5 20.4ZM8 11H21V13H8V11ZM8 18H21V20H8V18Z"})}),jsx(n,{"aria-label":"Ordered list",active:o.isActive("orderedList"),className:e.toolbar.orderedList,onClick:()=>o.chain().focus().toggleOrderedList().run(),icon:jsx("path",{d:"M8 4H21V6H8V4ZM5 3V6H6V7H3V6H4V4H3V3H5ZM3 14V11.5H5V11H3V10H6V12.5H4V13H6V14H3ZM5 19.5H3V18.5H5V18H3V17H6V21H3V20H5V19.5ZM8 11H21V13H8V11ZM8 18H21V20H8V18Z"})})]}),jsxs(d,{direction:"row",spacing:.5,children:[jsx(n,{"aria-label":"Align left",active:o.isActive({textAlign:"left"}),className:e.toolbar.alignLeft,onClick:()=>o.chain().focus().setTextAlign("left").run(),icon:jsx("path",{d:"M3 4H21V6H3V4ZM3 19H17V21H3V19ZM3 14H21V16H3V14ZM3 9H17V11H3V9Z"})}),jsx(n,{"aria-label":"Align center",active:o.isActive({textAlign:"center"}),className:e.toolbar.alignCenter,onClick:()=>o.chain().focus().setTextAlign("center").run(),icon:jsx("path",{d:"M3 4H21V6H3V4ZM5 19H19V21H5V19ZM3 14H21V16H3V14ZM5 9H19V11H5V9Z"})}),jsx(n,{"aria-label":"Align right",active:o.isActive({textAlign:"right"}),className:e.toolbar.alignRight,onClick:()=>o.chain().focus().setTextAlign("right").run(),icon:jsx("path",{d:"M3 4H21V6H3V4ZM7 19H21V21H7V19ZM3 14H21V16H3V14ZM7 9H21V11H7V9Z"})}),jsx(n,{"aria-label":"Align justify",active:o.isActive({textAlign:"justify"}),className:e.toolbar.alignJustify,onClick:()=>o.chain().focus().setTextAlign("justify").run(),icon:jsx("path",{d:"M3 4H21V6H3V4ZM3 19H21V21H3V19ZM3 14H21V16H3V14ZM3 9H21V11H3V9Z"})})]}),a&&jsxs(d,{direction:"row",spacing:.5,children:[jsx(n,{"aria-label":"Align justify",active:o.isActive("code"),className:e.toolbar.code,onClick:()=>o.chain().focus().toggleCode().run(),icon:jsx("path",{d:"M16.95 8.46448L18.3642 7.05026L23.3139 12L18.3642 16.9498L16.95 15.5355L20.4855 12L16.95 8.46448ZM7.05048 8.46448L3.51495 12L7.05048 15.5355L5.63627 16.9498L0.686523 12L5.63627 7.05026L7.05048 8.46448Z"})}),jsx(n,{"aria-label":"Align justify",active:o.isActive("codeBlock"),className:e.toolbar.codeBlock,onClick:()=>o.chain().focus().toggleCodeBlock().run(),icon:jsx("path",{d:"M3 3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3ZM4 5V19H20V5H4ZM20 12L16.4645 15.5355L15.0503 14.1213L17.1716 12L15.0503 9.87868L16.4645 8.46447L20 12ZM6.82843 12L8.94975 14.1213L7.53553 15.5355L4 12L7.53553 8.46447L8.94975 9.87868L6.82843 12ZM11.2443 17H9.11597L12.7557 7H14.884L11.2443 17Z"})})]}),a&&jsxs(d,{direction:"row",spacing:.5,children:[jsx(n,{"aria-label":"Blockquote",active:o.isActive("blockquote"),className:e.toolbar.blockquote,onClick:()=>o.chain().focus().toggleBlockquote().run(),icon:jsx("path",{d:"M4.58341 17.3211C3.55316 16.2274 3 15 3 13.0103C3 9.51086 5.45651 6.37366 9.03059 4.82318L9.92328 6.20079C6.58804 8.00539 5.93618 10.346 5.67564 11.822C6.21263 11.5443 6.91558 11.4466 7.60471 11.5105C9.40908 11.6778 10.8312 13.159 10.8312 15C10.8312 16.933 9.26416 18.5 7.33116 18.5C6.2581 18.5 5.23196 18.0095 4.58341 17.3211ZM14.5834 17.3211C13.5532 16.2274 13 15 13 13.0103C13 9.51086 15.4565 6.37366 19.0306 4.82318L19.9233 6.20079C16.588 8.00539 15.9362 10.346 15.6756 11.822C16.2126 11.5443 16.9156 11.4466 17.6047 11.5105C19.4091 11.6778 20.8312 13.159 20.8312 15C20.8312 16.933 19.2642 18.5 17.3312 18.5C16.2581 18.5 15.232 18.0095 14.5834 17.3211Z"})}),jsx(n,{"aria-label":"Horizontal",className:e.toolbar.hr,onClick:()=>o.chain().focus().setHorizontalRule().run(),icon:jsx("path",{d:"M2 11H4V13H2V11ZM6 11H18V13H6V11ZM20 11H22V13H20V11Z"})})]}),jsxs(d,{direction:"row",spacing:.5,children:[jsx(R,{editor:o}),jsx(P,{editor:o})]}),jsxs(d,{direction:"row",spacing:.5,children:[jsx(n,{"aria-label":"HardBreak",onClick:()=>o.chain().focus().setHardBreak().run(),className:e.toolbar.hardbreak,icon:jsx("path",{d:"M15 18H16.5C17.8807 18 19 16.8807 19 15.5C19 14.1193 17.8807 13 16.5 13H3V11H16.5C18.9853 11 21 13.0147 21 15.5C21 17.9853 18.9853 20 16.5 20H15V22L11 19L15 16V18ZM3 4H21V6H3V4ZM9 18V20H3V18H9Z"})}),jsx(n,{"aria-label":"Clear",className:e.toolbar.clear,onClick:()=>o.chain().focus().clearNodes().unsetAllMarks().run(),icon:jsx("path",{d:"M12.6512 14.0654L11.6047 20H9.57389L10.9247 12.339L3.51465 4.92892L4.92886 3.51471L20.4852 19.0711L19.071 20.4853L12.6512 14.0654ZM11.7727 7.53009L12.0425 5.99999H10.2426L8.24257 3.99999H19.9999V5.99999H14.0733L13.4991 9.25652L11.7727 7.53009Z"})})]}),a&&jsxs(d,{direction:"row",spacing:.5,children:[jsx(n,{"aria-label":"Undo",className:e.toolbar.undo,disabled:!o.can().chain().focus().undo().run(),onClick:()=>o.chain().focus().undo().run(),icon:jsx("path",{d:"M8 7V11L2 6L8 1V5H13C17.4183 5 21 8.58172 21 13C21 17.4183 17.4183 21 13 21H4V19H13C16.3137 19 19 16.3137 19 13C19 9.68629 16.3137 7 13 7H8Z"})}),jsx(n,{"aria-label":"Redo",className:e.toolbar.redo,disabled:!o.can().chain().focus().redo().run(),onClick:()=>o.chain().focus().redo().run(),icon:jsx("path",{d:"M16 7H11C7.68629 7 5 9.68629 5 13C5 16.3137 7.68629 19 11 19H20V21H11C6.58172 21 3 17.4183 3 13C3 8.58172 6.58172 5 11 5H16V1L22 6L16 11V7Z"})})]}),jsx(d,{direction:"row",spacing:.5,children:jsx(n,{"aria-label":"Fullscreen",className:e.toolbar.fullscreen,onClick:t,icon:i?jsx("path",{d:"M18 7H22V9H16V3H18V7ZM8 9H2V7H6V3H8V9ZM18 17V21H16V15H22V17H18ZM8 15V21H6V17H2V15H8Z"}):jsx("path",{d:"M16 3H22V9H20V5H16V3ZM2 3H8V5H4V9H2V3ZM20 19V15H22V21H16V19H20ZM4 19H8V21H2V15H4V19Z"})})})]}):null;var Fo=createLowlight(common),Oo=memo(forwardRef(({sx:o,error:a,onChange:i,slotProps:t,helperText:l,resetValue:s,editable:p=!0,fullItem:g=!1,value:c="",placeholder:L="Write something awesome...",...N},$)=>{let[h,z]=useState(!1),W=useCallback(()=>{z(_=>!_);},[]),f=useEditor({content:c,editable:p,extensions:[zo.configure({codeBlock:!1,code:{HTMLAttributes:{class:e.content.codeInline}},heading:{HTMLAttributes:{class:e.content.heading}},horizontalRule:{HTMLAttributes:{class:e.content.hr}},listItem:{HTMLAttributes:{class:e.content.listItem}},blockquote:{HTMLAttributes:{class:e.content.blockquote}},bulletList:{HTMLAttributes:{class:e.content.bulletList}},orderedList:{HTMLAttributes:{class:e.content.orderedList}}}),wo.configure({placeholder:L,emptyEditorClass:e.content.placeholder}),Eo.configure({HTMLAttributes:{class:e.content.image}}),Ro.configure({types:["heading","paragraph"]}),Po.configure({autolink:!0,openOnClick:!1,HTMLAttributes:{class:e.content.link}}),Ao.extend({addNodeView(){return ReactNodeViewRenderer(T)}}).configure({lowlight:Fo,HTMLAttributes:{class:e.content.codeBlock}})],onUpdate({editor:_}){let U=_.getHTML();i?.(U);},...N});return useEffect(()=>{let _=setTimeout(()=>{f?.isEmpty&&c!=="<p></p>"&&f.commands.setContent(c);},100);return ()=>clearTimeout(_)},[c,f]),useEffect(()=>{s&&!c&&f?.commands.clearContent();},[c]),useEffect(()=>{h?document.body.style.overflow="hidden":document.body.style.overflow="";},[h]),jsxs(To,{disablePortal:!h,children:[h&&jsx(Zo,{open:!0,sx:{zIndex:_=>_.zIndex.modal-1}}),jsxs(d,{sx:{...!p&&{cursor:"not-allowed"},...t?.wrap},children:[jsxs(S,{error:!!a,disabled:!p,fullScreen:h,className:e.root,sx:o,children:[jsx(I,{editor:f,fullItem:g,fullScreen:h,onToggleFullScreen:W}),jsx(EditorContent,{ref:$,spellCheck:"false",autoComplete:"off",autoCapitalize:"off",editor:f,className:e.content.root})]}),l&&jsx(Bo,{error:!!a,sx:{px:2},children:l})]})]})}));Oo.displayName="Editor";
|
|
28
|
+
var e={root:"nml__editor__root",toolbar:{hr:"nml__editor__toolbar__hr",root:"nml__editor__toolbar__root",bold:"nml__editor__toolbar__bold",code:"nml__editor__toolbar__code",undo:"nml__editor__toolbar__undo",redo:"nml__editor__toolbar__redo",link:"nml__editor__toolbar__link",clear:"nml__editor__toolbar__clear",image:"nml__editor__toolbar__image",italic:"nml__editor__toolbar__italic",strike:"nml__editor__toolbar__strike",hardbreak:"nml__editor__toolbar__hardbreak",unsetlink:"nml__editor__toolbar__unsetlink",codeBlock:"nml__editor__toolbar__code__block",alignLeft:"nml__editor__toolbar__align__left",fullscreen:"nml__editor__toolbar__fullscreen",blockquote:"nml__editor__toolbar__blockquote",bulletList:"nml__editor__toolbar__bullet__list",alignRight:"nml__editor__toolbar__align__right",orderedList:"nml__editor__toolbar__ordered__list",alignCenter:"nml__editor__toolbar__align__center",alignJustify:"nml__editor__toolbar__align__justify"},content:{hr:"nml__editor__content__hr",root:"nml__editor__content__root",link:"nml__editor__content__link",image:"nml__editor__content__image",codeInline:"nml__editor__content__code",heading:"nml__editor__content__heading",listItem:"nml__editor__content__listItem",codeBlock:"nml__editor__content__code__block",blockquote:"nml__editor__content__blockquote",langSelect:"nml__editor__content__lang__select",placeholder:"nml__editor__content__placeholder",bulletList:"nml__editor__content__bullet__list",orderedList:"nml__editor__content__ordered__list"}};var T=({node:{attrs:{language:o}},extension:a,updateAttributes:i})=>jsxs(NodeViewWrapper,{className:e.content.codeBlock,children:[jsxs("select",{name:"language",contentEditable:!1,defaultValue:o,onChange:t=>i({language:t.target.value}),className:e.content.langSelect,children:[jsx("option",{value:"null",children:"auto"}),jsx("option",{disabled:!0,children:"\u2014"}),a.options.lowlight.listLanguages().map(t=>jsx("option",{value:t,children:t},t))]}),jsx("pre",{children:jsx(NodeViewContent,{as:"code"})})]});var G="0.75em",S=styled(d,{shouldForwardProp:o=>o!=="error"&&o!=="disabled"&&o!=="fullScreen"})(({error:o,disabled:a,fullScreen:i,theme:t})=>({minHeight:240,borderRadius:t.shape.borderRadius,border:`solid 1px ${varAlpha(t.vars.palette.grey["500Channel"],.2)}`,scrollbarWidth:"thin",scrollbarColor:`${varAlpha(t.vars.palette.text.disabledChannel,.4)} ${varAlpha(t.vars.palette.text.disabledChannel,.08)}`,...o&&{border:`solid 1px ${t.vars.palette.error.main}`},...a&&{opacity:.48,pointerEvents:"none"},...i&&{top:16,left:16,position:"fixed",zIndex:t.zIndex.modal,maxHeight:"unset !important",width:"calc(100% - 32px)",height:"calc(100% - 32px)",backgroundColor:t.vars.palette.background.default},[`& .${e.content.placeholder}`]:{"&:first-of-type::before":{...t.typography.body2,height:0,float:"left",pointerEvents:"none",content:"attr(data-placeholder)",color:t.vars.palette.text.disabled}},[`& .${e.content.root}`]:{display:"flex",flex:"1 1 auto",overflowY:"auto",flexDirection:"column",borderBottomLeftRadius:"inherit",borderBottomRightRadius:"inherit",...o&&{backgroundColor:varAlpha(t.vars.palette.error.mainChannel,.08)},"& .tiptap":{"> * + *":{marginTop:0,marginBottom:G},"&.ProseMirror":{flex:"1 1 auto",outline:"none",padding:t.spacing(0,2)},h1:{...t.typography.h1,marginTop:40,marginBottom:8},h2:{...t.typography.h2,marginTop:40,marginBottom:8},h3:{...t.typography.h3,marginTop:24,marginBottom:8},h4:{...t.typography.h4,marginTop:24,marginBottom:8},h5:{...t.typography.h5,marginTop:24,marginBottom:8},h6:{...t.typography.h6,marginTop:24,marginBottom:8},p:{...t.typography.body1,marginBottom:"1.25rem"},[`& .${e.content.heading}`]:{},[`& .${e.content.link}`]:{color:t.vars.palette.primary.main},[`& .${e.content.hr}`]:{flexShrink:0,borderWidth:0,margin:"2em 0",msFlexNegative:0,WebkitFlexShrink:0,borderStyle:"solid",borderBottomWidth:"thin",borderColor:t.vars.palette.divider},[`& .${e.content.image}`]:{width:"100%",height:"auto",maxWidth:"100%",margin:"auto auto 1.25em"},[`& .${e.content.bulletList}`]:{paddingLeft:16,listStyleType:"disc"},[`& .${e.content.orderedList}`]:{paddingLeft:16},[`& .${e.content.listItem}`]:{lineHeight:2,"& > p":{margin:0,display:"inline-block"}},[`& .${e.content.blockquote}`]:{lineHeight:1.5,fontSize:"1.5em",margin:"24px auto",position:"relative",fontFamily:"Georgia, serif",padding:t.spacing(3,3,3,8),color:t.vars.palette.text.secondary,borderLeft:`solid 8px ${varAlpha(t.vars.palette.grey["500Channel"],.08)}`,[t.breakpoints.up("md")]:{width:"100%",maxWidth:640},"& p":{margin:0,fontSize:"inherit",fontFamily:"inherit"},"&::before":{left:16,top:-8,display:"block",fontSize:"3em",content:'"\\201C"',position:"absolute",color:t.vars.palette.text.disabled}},[`& .${e.content.codeInline}`]:{padding:t.spacing(.25,.5),color:t.vars.palette.text.secondary,fontSize:t.typography.body2.fontSize,borderRadius:t.shape.borderRadius/2,backgroundColor:varAlpha(t.vars.palette.grey["500Channel"],.2)},[`& .${e.content.codeBlock}`]:{position:"relative","& pre":{overflowX:"auto",color:t.vars.palette.common.white,padding:t.spacing(5,3,3,3),borderRadius:t.shape.borderRadius,backgroundColor:t.vars.palette.grey[900],fontFamily:"'JetBrainsMono', monospace","& code":{fontSize:t.typography.body2.fontSize}},[`& .${e.content.langSelect}`]:{top:8,right:8,zIndex:1,padding:4,outline:"none",borderRadius:4,position:"absolute",color:t.vars.palette.common.white,fontWeight:t.typography.fontWeightMedium,borderColor:varAlpha(t.vars.palette.grey["500Channel"],.08),backgroundColor:varAlpha(t.vars.palette.grey["500Channel"],.08)}}}}}));var n=({sx:o,icon:a,label:i,active:t,disabled:l,...s})=>jsxs(J,{sx:{px:.75,width:28,height:28,borderRadius:.75,typography:"body2","&:hover":{bgcolor:"action.hover"},...t&&{bgcolor:"action.selected"},...l&&{pointerEvents:"none",cursor:"not-allowed",opacity:.48},...o},...s,children:[a&&jsx(j,{sx:{fontSize:18},children:a}),i&&i]});var no=["Heading 1","Heading 2","Heading 3","Heading 4","Heading 5","Heading 6"],A=({editor:o})=>{let[a,i]=useState(null),t=s=>{i(s.currentTarget);},l=()=>{i(null);};return o?jsxs(Fragment,{children:[jsxs(J,{id:"heading-menu-button","aria-label":"Heading menu button","aria-controls":a?"heading-menu-button":void 0,"aria-haspopup":"true","aria-expanded":a?"true":void 0,onClick:t,sx:{px:1,width:120,height:32,borderRadius:.75,typography:"body2",justifyContent:"space-between",border:s=>`solid 1px ${varAlpha(s.vars.palette.grey["500Channel"],.2)}`},children:[o.isActive("heading",{level:1})&&"Heading 1"||o.isActive("heading",{level:2})&&"Heading 2"||o.isActive("heading",{level:3})&&"Heading 3"||o.isActive("heading",{level:4})&&"Heading 4"||o.isActive("heading",{level:5})&&"Heading 5"||o.isActive("heading",{level:6})&&"Heading 6"||"Paragraph",jsx(ro,{width:16,icon:a?"ARROW_UP_SIMPLE":"ARROW_DOWN_SIMPLE"})]}),jsxs(eo,{id:"heading-menu",anchorEl:a,open:!!a,onClose:l,MenuListProps:{"aria-labelledby":"heading-button"},slotProps:{paper:{sx:{width:120,[`& .${listClasses.root}`]:{gap:.5,display:"flex",flexDirection:"column"},[`& .${buttonBaseClasses.root}`]:{px:1,width:1,height:34,borderRadius:.75,justifyContent:"flex-start","&:hover":{backgroundColor:"action.hover"}}}}},children:[jsx(n,{component:"li",label:"Paragraph",active:o.isActive("paragraph"),onClick:()=>{l(),o.chain().focus().setParagraph().run();}}),no.map((s,p)=>{let u=p+1;return jsx(n,{"aria-label":s,component:"li",label:s,active:o.isActive("heading",{level:u}),onClick:()=>{l(),o.chain().focus().toggleHeading({level:u}).run();},sx:{...s!=="Paragraph"&&{fontSize:18-p,fontWeight:"fontWeightBold"}}},s)})]})]}):null};var P=({editor:o})=>{let[a,i]=useState(""),[t,l]=useState(null),s=c=>{l(c.currentTarget);},p=()=>{l(null);},u=useCallback(()=>{p(),t&&o?.chain().focus().setImage({src:a}).run();},[t,o,a]);return o?jsxs(Fragment,{children:[jsx(n,{"aria-label":"Image",className:e.toolbar.image,onClick:s,icon:jsx("path",{d:"M20 5H4V19L13.2923 9.70649C13.6828 9.31595 14.3159 9.31591 14.7065 9.70641L20 15.0104V5ZM2 3.9934C2 3.44476 2.45531 3 2.9918 3H21.0082C21.556 3 22 3.44495 22 3.9934V20.0066C22 20.5552 21.5447 21 21.0082 21H2.9918C2.44405 21 2 20.5551 2 20.0066V3.9934ZM8 11C6.89543 11 6 10.1046 6 9C6 7.89543 6.89543 7 8 7C9.10457 7 10 7.89543 10 9C10 10.1046 9.10457 11 8 11Z"})}),jsxs(co,{id:t?"simple-popover":void 0,open:!!t,anchorEl:t,onClose:p,anchorOrigin:{vertical:"bottom",horizontal:"left"},slotProps:{paper:{sx:{p:2.5}}},children:[jsx(uo,{variant:"subtitle2",sx:{mb:1},children:"URL"}),jsxs(d,{direction:"row",alignItems:"center",spacing:1,children:[jsx(mo,{size:"small",placeholder:"Enter URL here...",value:a,onChange:c=>{i(c.target.value);},sx:{width:240}}),jsx(so,{variant:"contained",onClick:u,children:"Apply"})]})]})]}):null};var R=({editor:o})=>{let[a,i]=useState(""),[t,l]=useState(null),s=c=>{let L=o?.getAttributes("link").href;l(c.currentTarget),i(L||"");},p=()=>{l(null);},u=useCallback(()=>{p(),a?o?.chain().focus().extendMarkRange("link").setLink({href:a}).run():o?.chain().focus().extendMarkRange("link").unsetLink().run();},[o,a]);return o?jsxs(Fragment,{children:[jsx(n,{"aria-label":"Link",active:o.isActive("link"),className:e.toolbar.link,onClick:s,icon:jsx("path",{d:"M17.6567 14.8284L16.2425 13.4142L17.6567 12C19.2188 10.4379 19.2188 7.90524 17.6567 6.34314C16.0946 4.78105 13.5619 4.78105 11.9998 6.34314L10.5856 7.75736L9.17139 6.34314L10.5856 4.92893C12.9287 2.58578 16.7277 2.58578 19.0709 4.92893C21.414 7.27208 21.414 11.0711 19.0709 13.4142L17.6567 14.8284ZM14.8282 17.6569L13.414 19.0711C11.0709 21.4142 7.27189 21.4142 4.92875 19.0711C2.5856 16.7279 2.5856 12.9289 4.92875 10.5858L6.34296 9.17157L7.75717 10.5858L6.34296 12C4.78086 13.5621 4.78086 16.0948 6.34296 17.6569C7.90506 19.2189 10.4377 19.2189 11.9998 17.6569L13.414 16.2426L14.8282 17.6569ZM14.8282 7.75736L16.2425 9.17157L9.17139 16.2426L7.75717 14.8284L14.8282 7.75736Z"})}),jsx(n,{"aria-label":"Unset link",disabled:!o.isActive("link"),className:e.toolbar.unsetlink,onClick:()=>o.chain().focus().unsetLink().run(),icon:jsx("path",{d:"M17.657 14.8284L16.2428 13.4142L17.657 12C19.2191 10.4379 19.2191 7.90526 17.657 6.34316C16.0949 4.78106 13.5622 4.78106 12.0001 6.34316L10.5859 7.75737L9.17171 6.34316L10.5859 4.92895C12.9291 2.5858 16.7281 2.5858 19.0712 4.92895C21.4143 7.27209 21.4143 11.0711 19.0712 13.4142L17.657 14.8284ZM14.8286 17.6569L13.4143 19.0711C11.0712 21.4142 7.27221 21.4142 4.92907 19.0711C2.58592 16.7279 2.58592 12.9289 4.92907 10.5858L6.34328 9.17159L7.75749 10.5858L6.34328 12C4.78118 13.5621 4.78118 16.0948 6.34328 17.6569C7.90538 19.219 10.438 19.219 12.0001 17.6569L13.4143 16.2427L14.8286 17.6569ZM14.8286 7.75737L16.2428 9.17159L9.17171 16.2427L7.75749 14.8284L14.8286 7.75737ZM5.77539 2.29291L7.70724 1.77527L8.74252 5.63897L6.81067 6.15661L5.77539 2.29291ZM15.2578 18.3611L17.1896 17.8434L18.2249 21.7071L16.293 22.2248L15.2578 18.3611ZM2.29303 5.77527L6.15673 6.81054L5.63909 8.7424L1.77539 7.70712L2.29303 5.77527ZM18.3612 15.2576L22.2249 16.2929L21.7072 18.2248L17.8435 17.1895L18.3612 15.2576Z"})}),jsxs(co,{id:t?"simple-popover":void 0,open:!!t,anchorEl:t,onClose:p,anchorOrigin:{vertical:"bottom",horizontal:"left"},slotProps:{paper:{sx:{p:2.5}}},children:[jsx(uo,{variant:"subtitle2",sx:{mb:1},children:"URL"}),jsxs(d,{direction:"row",alignItems:"center",spacing:1,children:[jsx(mo,{size:"small",placeholder:"Enter URL here...",value:a,onChange:c=>{i(c.target.value);},sx:{width:240}}),jsx(so,{variant:"contained",onClick:u,children:"Apply"})]})]})]}):null};var I=({editor:o,fullItem:a,fullScreen:i,onToggleFullScreen:t})=>o?jsxs(d,{spacing:1,direction:"row",flexWrap:"wrap",alignItems:"center",divider:jsx(ko,{orientation:"vertical",flexItem:!0,sx:{height:16,my:"auto"}}),className:e.toolbar.root,sx:{p:1.25,bgcolor:"background.paper",borderTopRightRadius:"inherit",borderTopLeftRadius:"inherit",borderBottom:l=>`solid 1px ${varAlpha(l.vars.palette.grey["500Channel"],.2)}`},children:[jsx(A,{editor:o}),jsxs(d,{direction:"row",spacing:.5,children:[jsx(n,{"aria-label":"Bold",active:o.isActive("bold"),className:e.toolbar.bold,onClick:()=>o.chain().focus().toggleBold().run(),icon:jsx("path",{d:"M8 11H12.5C13.8807 11 15 9.88071 15 8.5C15 7.11929 13.8807 6 12.5 6H8V11ZM18 15.5C18 17.9853 15.9853 20 13.5 20H6V4H12.5C14.9853 4 17 6.01472 17 8.5C17 9.70431 16.5269 10.7981 15.7564 11.6058C17.0979 12.3847 18 13.837 18 15.5ZM8 13V18H13.5C14.8807 18 16 16.8807 16 15.5C16 14.1193 14.8807 13 13.5 13H8Z"})}),jsx(n,{"aria-label":"Italic",active:o.isActive("italic"),className:e.toolbar.italic,onClick:()=>o.chain().focus().toggleItalic().run(),icon:jsx("path",{d:"M15 20H7V18H9.92661L12.0425 6H9V4H17V6H14.0734L11.9575 18H15V20Z"})}),jsx(n,{"aria-label":"Strike",active:o.isActive("strike"),className:e.toolbar.italic,onClick:()=>o.chain().focus().toggleStrike().run(),icon:jsx("path",{d:"M17.1538 14C17.3846 14.5161 17.5 15.0893 17.5 15.7196C17.5 17.0625 16.9762 18.1116 15.9286 18.867C14.8809 19.6223 13.4335 20 11.5862 20C9.94674 20 8.32335 19.6185 6.71592 18.8555V16.6009C8.23538 17.4783 9.7908 17.917 11.3822 17.917C13.9333 17.917 15.2128 17.1846 15.2208 15.7196C15.2208 15.0939 15.0049 14.5598 14.5731 14.1173C14.5339 14.0772 14.4939 14.0381 14.4531 14H3V12H21V14H17.1538ZM13.076 11H7.62908C7.4566 10.8433 7.29616 10.6692 7.14776 10.4778C6.71592 9.92084 6.5 9.24559 6.5 8.45207C6.5 7.21602 6.96583 6.165 7.89749 5.299C8.82916 4.43299 10.2706 4 12.2219 4C13.6934 4 15.1009 4.32808 16.4444 4.98426V7.13591C15.2448 6.44921 13.9293 6.10587 12.4978 6.10587C10.0187 6.10587 8.77917 6.88793 8.77917 8.45207C8.77917 8.87172 8.99709 9.23796 9.43293 9.55079C9.86878 9.86362 10.4066 10.1135 11.0463 10.3004C11.6665 10.4816 12.3431 10.7148 13.076 11H13.076Z"})})]}),jsxs(d,{direction:"row",spacing:.5,children:[jsx(n,{"aria-label":"Bullet list",active:o.isActive("bulletList"),className:e.toolbar.bulletList,onClick:()=>o.chain().focus().toggleBulletList().run(),icon:jsx("path",{d:"M8 4H21V6H8V4ZM4.5 6.5C3.67157 6.5 3 5.82843 3 5C3 4.17157 3.67157 3.5 4.5 3.5C5.32843 3.5 6 4.17157 6 5C6 5.82843 5.32843 6.5 4.5 6.5ZM4.5 13.5C3.67157 13.5 3 12.8284 3 12C3 11.1716 3.67157 10.5 4.5 10.5C5.32843 10.5 6 11.1716 6 12C6 12.8284 5.32843 13.5 4.5 13.5ZM4.5 20.4C3.67157 20.4 3 19.7284 3 18.9C3 18.0716 3.67157 17.4 4.5 17.4C5.32843 17.4 6 18.0716 6 18.9C6 19.7284 5.32843 20.4 4.5 20.4ZM8 11H21V13H8V11ZM8 18H21V20H8V18Z"})}),jsx(n,{"aria-label":"Ordered list",active:o.isActive("orderedList"),className:e.toolbar.orderedList,onClick:()=>o.chain().focus().toggleOrderedList().run(),icon:jsx("path",{d:"M8 4H21V6H8V4ZM5 3V6H6V7H3V6H4V4H3V3H5ZM3 14V11.5H5V11H3V10H6V12.5H4V13H6V14H3ZM5 19.5H3V18.5H5V18H3V17H6V21H3V20H5V19.5ZM8 11H21V13H8V11ZM8 18H21V20H8V18Z"})})]}),jsxs(d,{direction:"row",spacing:.5,children:[jsx(n,{"aria-label":"Align left",active:o.isActive({textAlign:"left"}),className:e.toolbar.alignLeft,onClick:()=>o.chain().focus().setTextAlign("left").run(),icon:jsx("path",{d:"M3 4H21V6H3V4ZM3 19H17V21H3V19ZM3 14H21V16H3V14ZM3 9H17V11H3V9Z"})}),jsx(n,{"aria-label":"Align center",active:o.isActive({textAlign:"center"}),className:e.toolbar.alignCenter,onClick:()=>o.chain().focus().setTextAlign("center").run(),icon:jsx("path",{d:"M3 4H21V6H3V4ZM5 19H19V21H5V19ZM3 14H21V16H3V14ZM5 9H19V11H5V9Z"})}),jsx(n,{"aria-label":"Align right",active:o.isActive({textAlign:"right"}),className:e.toolbar.alignRight,onClick:()=>o.chain().focus().setTextAlign("right").run(),icon:jsx("path",{d:"M3 4H21V6H3V4ZM7 19H21V21H7V19ZM3 14H21V16H3V14ZM7 9H21V11H7V9Z"})}),jsx(n,{"aria-label":"Align justify",active:o.isActive({textAlign:"justify"}),className:e.toolbar.alignJustify,onClick:()=>o.chain().focus().setTextAlign("justify").run(),icon:jsx("path",{d:"M3 4H21V6H3V4ZM3 19H21V21H3V19ZM3 14H21V16H3V14ZM3 9H21V11H3V9Z"})})]}),a&&jsxs(d,{direction:"row",spacing:.5,children:[jsx(n,{"aria-label":"Align justify",active:o.isActive("code"),className:e.toolbar.code,onClick:()=>o.chain().focus().toggleCode().run(),icon:jsx("path",{d:"M16.95 8.46448L18.3642 7.05026L23.3139 12L18.3642 16.9498L16.95 15.5355L20.4855 12L16.95 8.46448ZM7.05048 8.46448L3.51495 12L7.05048 15.5355L5.63627 16.9498L0.686523 12L5.63627 7.05026L7.05048 8.46448Z"})}),jsx(n,{"aria-label":"Align justify",active:o.isActive("codeBlock"),className:e.toolbar.codeBlock,onClick:()=>o.chain().focus().toggleCodeBlock().run(),icon:jsx("path",{d:"M3 3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3ZM4 5V19H20V5H4ZM20 12L16.4645 15.5355L15.0503 14.1213L17.1716 12L15.0503 9.87868L16.4645 8.46447L20 12ZM6.82843 12L8.94975 14.1213L7.53553 15.5355L4 12L7.53553 8.46447L8.94975 9.87868L6.82843 12ZM11.2443 17H9.11597L12.7557 7H14.884L11.2443 17Z"})})]}),a&&jsxs(d,{direction:"row",spacing:.5,children:[jsx(n,{"aria-label":"Blockquote",active:o.isActive("blockquote"),className:e.toolbar.blockquote,onClick:()=>o.chain().focus().toggleBlockquote().run(),icon:jsx("path",{d:"M4.58341 17.3211C3.55316 16.2274 3 15 3 13.0103C3 9.51086 5.45651 6.37366 9.03059 4.82318L9.92328 6.20079C6.58804 8.00539 5.93618 10.346 5.67564 11.822C6.21263 11.5443 6.91558 11.4466 7.60471 11.5105C9.40908 11.6778 10.8312 13.159 10.8312 15C10.8312 16.933 9.26416 18.5 7.33116 18.5C6.2581 18.5 5.23196 18.0095 4.58341 17.3211ZM14.5834 17.3211C13.5532 16.2274 13 15 13 13.0103C13 9.51086 15.4565 6.37366 19.0306 4.82318L19.9233 6.20079C16.588 8.00539 15.9362 10.346 15.6756 11.822C16.2126 11.5443 16.9156 11.4466 17.6047 11.5105C19.4091 11.6778 20.8312 13.159 20.8312 15C20.8312 16.933 19.2642 18.5 17.3312 18.5C16.2581 18.5 15.232 18.0095 14.5834 17.3211Z"})}),jsx(n,{"aria-label":"Horizontal",className:e.toolbar.hr,onClick:()=>o.chain().focus().setHorizontalRule().run(),icon:jsx("path",{d:"M2 11H4V13H2V11ZM6 11H18V13H6V11ZM20 11H22V13H20V11Z"})})]}),jsxs(d,{direction:"row",spacing:.5,children:[jsx(R,{editor:o}),jsx(P,{editor:o})]}),jsxs(d,{direction:"row",spacing:.5,children:[jsx(n,{"aria-label":"HardBreak",onClick:()=>o.chain().focus().setHardBreak().run(),className:e.toolbar.hardbreak,icon:jsx("path",{d:"M15 18H16.5C17.8807 18 19 16.8807 19 15.5C19 14.1193 17.8807 13 16.5 13H3V11H16.5C18.9853 11 21 13.0147 21 15.5C21 17.9853 18.9853 20 16.5 20H15V22L11 19L15 16V18ZM3 4H21V6H3V4ZM9 18V20H3V18H9Z"})}),jsx(n,{"aria-label":"Clear",className:e.toolbar.clear,onClick:()=>o.chain().focus().clearNodes().unsetAllMarks().run(),icon:jsx("path",{d:"M12.6512 14.0654L11.6047 20H9.57389L10.9247 12.339L3.51465 4.92892L4.92886 3.51471L20.4852 19.0711L19.071 20.4853L12.6512 14.0654ZM11.7727 7.53009L12.0425 5.99999H10.2426L8.24257 3.99999H19.9999V5.99999H14.0733L13.4991 9.25652L11.7727 7.53009Z"})})]}),a&&jsxs(d,{direction:"row",spacing:.5,children:[jsx(n,{"aria-label":"Undo",className:e.toolbar.undo,disabled:!o.can().chain().focus().undo().run(),onClick:()=>o.chain().focus().undo().run(),icon:jsx("path",{d:"M8 7V11L2 6L8 1V5H13C17.4183 5 21 8.58172 21 13C21 17.4183 17.4183 21 13 21H4V19H13C16.3137 19 19 16.3137 19 13C19 9.68629 16.3137 7 13 7H8Z"})}),jsx(n,{"aria-label":"Redo",className:e.toolbar.redo,disabled:!o.can().chain().focus().redo().run(),onClick:()=>o.chain().focus().redo().run(),icon:jsx("path",{d:"M16 7H11C7.68629 7 5 9.68629 5 13C5 16.3137 7.68629 19 11 19H20V21H11C6.58172 21 3 17.4183 3 13C3 8.58172 6.58172 5 11 5H16V1L22 6L16 11V7Z"})})]}),jsx(d,{direction:"row",spacing:.5,children:jsx(n,{"aria-label":"Fullscreen",className:e.toolbar.fullscreen,onClick:t,icon:i?jsx("path",{d:"M18 7H22V9H16V3H18V7ZM8 9H2V7H6V3H8V9ZM18 17V21H16V15H22V17H18ZM8 15V21H6V17H2V15H8Z"}):jsx("path",{d:"M16 3H22V9H20V5H16V3ZM2 3H8V5H4V9H2V3ZM20 19V15H22V21H16V19H20ZM4 19H8V21H2V15H4V19Z"})})})]}):null;var Fo=createLowlight(common),Oo=memo(forwardRef(({sx:o,error:a,onChange:i,slotProps:t,helperText:l,resetValue:s,editable:p=!0,fullItem:u=!1,value:c="",placeholder:L="Write something awesome...",...N},$)=>{let[h,z]=useState(!1),W=useCallback(()=>{z(_=>!_);},[]),f=useEditor({content:c,editable:p,extensions:[zo.configure({codeBlock:!1,code:{HTMLAttributes:{class:e.content.codeInline}},heading:{HTMLAttributes:{class:e.content.heading}},horizontalRule:{HTMLAttributes:{class:e.content.hr}},listItem:{HTMLAttributes:{class:e.content.listItem}},blockquote:{HTMLAttributes:{class:e.content.blockquote}},bulletList:{HTMLAttributes:{class:e.content.bulletList}},orderedList:{HTMLAttributes:{class:e.content.orderedList}}}),wo.configure({placeholder:L,emptyEditorClass:e.content.placeholder}),Eo.configure({HTMLAttributes:{class:e.content.image}}),Ro.configure({types:["heading","paragraph"]}),Po.configure({autolink:!0,openOnClick:!1,HTMLAttributes:{class:e.content.link}}),Ao.extend({addNodeView(){return ReactNodeViewRenderer(T)}}).configure({lowlight:Fo,HTMLAttributes:{class:e.content.codeBlock}})],onUpdate({editor:_}){let U=_.getHTML();i?.(U);},...N});return useEffect(()=>{let _=setTimeout(()=>{f?.isEmpty&&c!=="<p></p>"&&f.commands.setContent(c);},100);return ()=>clearTimeout(_)},[c,f]),useEffect(()=>{s&&!c&&f?.commands.clearContent();},[c]),useEffect(()=>{h?document.body.style.overflow="hidden":document.body.style.overflow="";},[h]),jsxs(To,{disablePortal:!h,children:[h&&jsx(Zo,{open:!0,sx:{zIndex:_=>_.zIndex.modal-1}}),jsxs(d,{sx:{...!p&&{cursor:"not-allowed"},...t?.wrap},children:[jsxs(S,{error:!!a,disabled:!p,fullScreen:h,className:e.root,sx:o,children:[jsx(I,{editor:f,fullItem:u,fullScreen:h,onToggleFullScreen:W}),jsx(EditorContent,{ref:$,spellCheck:"false",autoComplete:"off",autoCapitalize:"off",editor:f,className:e.content.root})]}),l&&jsx(Bo,{error:!!a,sx:{px:2},children:l})]})]})}));Oo.displayName="Editor";
|
|
29
29
|
|
|
30
30
|
export { e as a, Oo as b };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { b as Editor, a as editorClasses } from '../../chunk-
|
|
1
|
+
export { b as Editor, a as editorClasses } from '../../chunk-7B52USZL.js';
|
package/package.json
CHANGED