@bikdotai/bik-component-library 0.0.802-beta.0 → 0.0.802-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (29) hide show
  1. package/dist/cjs/editor/BikEditor.styles.js +0 -2
  2. package/dist/cjs/editor/BikEditor.styles.js.map +1 -1
  3. package/dist/cjs/editor/extensions/editorDropdown.styles.js +17 -5
  4. package/dist/cjs/editor/extensions/editorDropdown.styles.js.map +1 -1
  5. package/dist/cjs/editor/extensions/mention/MentionDropdown.js +1 -1
  6. package/dist/cjs/editor/extensions/mention/MentionDropdown.js.map +1 -1
  7. package/dist/cjs/editor/extensions/mention/MentionExtension.js +1 -1
  8. package/dist/cjs/editor/extensions/mention/MentionExtension.js.map +1 -1
  9. package/dist/cjs/editor/extensions/plainClipboard/PlainClipboardExtension.js +1 -1
  10. package/dist/cjs/editor/extensions/plainClipboard/PlainClipboardExtension.js.map +1 -1
  11. package/dist/cjs/editor/extensions/slashCommand/SlashCommandMenu.js +1 -1
  12. package/dist/cjs/editor/extensions/slashCommand/SlashCommandMenu.js.map +1 -1
  13. package/dist/cjs/src/components/bik-layout/MockMenus.d.ts +1 -0
  14. package/dist/cjs/src/editor/extensions/editorDropdown.styles.d.ts +1 -0
  15. package/dist/esm/editor/BikEditor.styles.js +0 -2
  16. package/dist/esm/editor/BikEditor.styles.js.map +1 -1
  17. package/dist/esm/editor/extensions/editorDropdown.styles.js +27 -15
  18. package/dist/esm/editor/extensions/editorDropdown.styles.js.map +1 -1
  19. package/dist/esm/editor/extensions/mention/MentionDropdown.js +1 -1
  20. package/dist/esm/editor/extensions/mention/MentionDropdown.js.map +1 -1
  21. package/dist/esm/editor/extensions/mention/MentionExtension.js +1 -1
  22. package/dist/esm/editor/extensions/mention/MentionExtension.js.map +1 -1
  23. package/dist/esm/editor/extensions/plainClipboard/PlainClipboardExtension.js +1 -1
  24. package/dist/esm/editor/extensions/plainClipboard/PlainClipboardExtension.js.map +1 -1
  25. package/dist/esm/editor/extensions/slashCommand/SlashCommandMenu.js +1 -1
  26. package/dist/esm/editor/extensions/slashCommand/SlashCommandMenu.js.map +1 -1
  27. package/dist/esm/src/components/bik-layout/MockMenus.d.ts +1 -0
  28. package/dist/esm/src/editor/extensions/editorDropdown.styles.d.ts +1 -0
  29. package/package.json +1 -1
@@ -44,8 +44,6 @@
44
44
  color: ${t.COLORS.content.brand};
45
45
  }
46
46
  .bik-variable {
47
- color: ${t.COLORS.content.brand};
48
- padding: 1px 3px;
49
47
  }
50
48
 
51
49
  a,
@@ -1 +1 @@
1
- {"version":3,"file":"BikEditor.styles.js","sources":["../../../src/editor/BikEditor.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '../constants/Theme';\n\nexport const BikEditorShell = styled.div<{\n\tminHeight?: string;\n\tmaxHeight?: string;\n}>`\n\tposition: relative;\n\twidth: 100%;\n\n\t.ProseMirror {\n\t\tmin-height: ${({ minHeight }) => minHeight ?? '80px'};\n\t\tmax-height: ${({ maxHeight }) => maxHeight ?? 'none'};\n\t\toverflow-y: auto;\n\t\toutline: none;\n\t\tpadding: 8px 12px;\n\t\tfont-size: 14px;\n\t\tline-height: 1.5;\n\t\tword-break: break-word;\n\n\t\tp {\n\t\t\tmargin: 0;\n\t\t\tpadding: 0;\n\t\t}\n\n\t\tul,\n\t\tol {\n\t\t\tmargin: 0;\n\t\t\tpadding-left: 1.5em;\n\t\t}\n\n\t\tli + li {\n\t\t\tmargin-top: 2px;\n\t\t}\n\n\t\tp.is-editor-empty:first-child::before {\n\t\t\tcontent: attr(data-placeholder);\n\t\t\tfloat: left;\n\t\t\tcolor: #adb5bd;\n\t\t\tpointer-events: none;\n\t\t\theight: 0;\n\t\t}\n\t}\n\n\t.bik-mention {\n\t\tcolor: ${COLORS.content.brand};\n\t\tpadding: 1px 4px;\n\t}\n\t.bik-mention--team {\n\t\tcolor: ${COLORS.content.brand};\n\t}\n\t.bik-variable {\n\t\tcolor: ${COLORS.content.brand};\n\t\tpadding: 1px 3px;\n\t}\n\n\ta,\n\t.bik-link {\n\t\tcolor: #4f46e5;\n\t\ttext-decoration: underline;\n\t\ttext-decoration-color: #a5b4fc;\n\t\ttext-underline-offset: 2px;\n\t\tcursor: pointer;\n\t\t&:hover {\n\t\t\tcolor: #3730a3;\n\t\t\ttext-decoration-color: #6366f1;\n\t\t}\n\t}\n`;\n"],"names":["BikEditorShell","div","_ref","minHeight","_ref2","maxHeight","COLORS","content","brand"],"mappings":"kNAGaA,MAAAA,OAAuB,QAACC,GAGnC;;;;;gBAKcC,IAAA,IAACC,UAAEA,GAAWD,EAAA,OAAKC,QAAAA,EAAa,MAAM;gBACtCC,IAAA,IAACC,UAAEA,GAAWD,EAAA,OAAKC,QAAAA,EAAa,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;WAiC3CC,EAAMA,OAACC,QAAQC;;;;WAIfF,EAAMA,OAACC,QAAQC;;;WAGfF,EAAMA,OAACC,QAAQC;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"BikEditor.styles.js","sources":["../../../src/editor/BikEditor.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '../constants/Theme';\n\nexport const BikEditorShell = styled.div<{\n\tminHeight?: string;\n\tmaxHeight?: string;\n}>`\n\tposition: relative;\n\twidth: 100%;\n\n\t.ProseMirror {\n\t\tmin-height: ${({ minHeight }) => minHeight ?? '80px'};\n\t\tmax-height: ${({ maxHeight }) => maxHeight ?? 'none'};\n\t\toverflow-y: auto;\n\t\toutline: none;\n\t\tpadding: 8px 12px;\n\t\tfont-size: 14px;\n\t\tline-height: 1.5;\n\t\tword-break: break-word;\n\n\t\tp {\n\t\t\tmargin: 0;\n\t\t\tpadding: 0;\n\t\t}\n\n\t\tul,\n\t\tol {\n\t\t\tmargin: 0;\n\t\t\tpadding-left: 1.5em;\n\t\t}\n\n\t\tli + li {\n\t\t\tmargin-top: 2px;\n\t\t}\n\n\t\tp.is-editor-empty:first-child::before {\n\t\t\tcontent: attr(data-placeholder);\n\t\t\tfloat: left;\n\t\t\tcolor: #adb5bd;\n\t\t\tpointer-events: none;\n\t\t\theight: 0;\n\t\t}\n\t}\n\n\t.bik-mention {\n\t\tcolor: ${COLORS.content.brand};\n\t\tpadding: 1px 4px;\n\t}\n\t.bik-mention--team {\n\t\tcolor: ${COLORS.content.brand};\n\t}\n\t.bik-variable {\n\t}\n\n\ta,\n\t.bik-link {\n\t\tcolor: #4f46e5;\n\t\ttext-decoration: underline;\n\t\ttext-decoration-color: #a5b4fc;\n\t\ttext-underline-offset: 2px;\n\t\tcursor: pointer;\n\t\t&:hover {\n\t\t\tcolor: #3730a3;\n\t\t\ttext-decoration-color: #6366f1;\n\t\t}\n\t}\n`;\n"],"names":["BikEditorShell","div","_ref","minHeight","_ref2","maxHeight","COLORS","content","brand"],"mappings":"kNAGaA,MAAAA,OAAuB,QAACC,GAGnC;;;;;gBAKcC,IAAA,IAACC,UAAEA,GAAWD,EAAA,OAAKC,QAAAA,EAAa,MAAM;gBACtCC,IAAA,IAACC,UAAEA,GAAWD,EAAA,OAAKC,QAAAA,EAAa,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;WAiC3CC,EAAMA,OAACC,QAAQC;;;;WAIfF,EAAMA,OAACC,QAAQC;;;;;;;;;;;;;;;;;"}
@@ -25,22 +25,34 @@
25
25
  border-radius: 50%;
26
26
  object-fit: cover;
27
27
  flex-shrink: 0;
28
- `,p=o.default.span`
29
- font-weight: 500;
28
+ `,p=o.default.div`
29
+ width: 24px;
30
+ height: 24px;
31
+ border-radius: 50%;
32
+ background: ${t.COLORS.surface.hovered};
33
+ display: flex;
34
+ align-items: center;
35
+ justify-content: center;
36
+ font-size: 12px;
37
+ font-weight: 600;
30
38
  color: ${t.COLORS.content.primary};
39
+ flex-shrink: 0;
31
40
  `,s=o.default.span`
41
+ font-weight: 500;
42
+ color: ${t.COLORS.content.primary};
43
+ `,d=o.default.span`
32
44
  width: 8px;
33
45
  height: 8px;
34
46
  border-radius: 50%;
35
47
  background: ${e=>{let{$online:r}=e;return r?t.COLORS.content.positive:t.COLORS.content.placeholder}};
36
48
  margin-left: auto;
37
49
  flex-shrink: 0;
38
- `,d=o.default.span`
50
+ `,l=o.default.span`
39
51
  font-weight: 500;
40
52
  color: ${t.COLORS.content.primary};
41
- `,l=o.default.span`
53
+ `,c=o.default.span`
42
54
  font-size: 12px;
43
55
  color: ${t.COLORS.content.secondary};
44
56
  margin-left: auto;
45
- `;exports.DropdownContainer=n,exports.DropdownItem=a,exports.MentionAvatar=i,exports.MentionLabel=p,exports.MentionPresenceDot=s,exports.SlashDescription=l,exports.SlashLabel=d;
57
+ `;exports.DropdownContainer=n,exports.DropdownItem=a,exports.MentionAvatar=i,exports.MentionAvatarFallback=p,exports.MentionLabel=s,exports.MentionPresenceDot=d,exports.SlashDescription=c,exports.SlashLabel=l;
46
58
  //# sourceMappingURL=editorDropdown.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"editorDropdown.styles.js","sources":["../../../../src/editor/extensions/editorDropdown.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const DropdownContainer = styled.div`\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 8px;\n\tbox-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n\tpadding: 4px;\n\tmin-width: 330px;\n\tmax-height: 260px;\n\toverflow-y: auto;\n\tfont-size: 14px;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const DropdownItem = styled.div<{ $isActive?: boolean }>`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 12px 16px;\n\tmin-height: 43px;\n\tborder-radius: 6px;\n\tcursor: pointer;\n\tcolor: ${COLORS.content.primary};\n\tbackground: ${({ $isActive }) =>\n\t\t$isActive ? COLORS.surface.hovered : 'transparent'};\n`;\n\nexport const MentionAvatar = styled.img`\n\twidth: 24px;\n\theight: 24px;\n\tborder-radius: 50%;\n\tobject-fit: cover;\n\tflex-shrink: 0;\n`;\n\nexport const MentionLabel = styled.span`\n\tfont-weight: 500;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const MentionPresenceDot = styled.span<{ $online?: boolean }>`\n\twidth: 8px;\n\theight: 8px;\n\tborder-radius: 50%;\n\tbackground: ${({ $online }) =>\n\t\t$online ? COLORS.content.positive : COLORS.content.placeholder};\n\tmargin-left: auto;\n\tflex-shrink: 0;\n`;\n\nexport const SlashLabel = styled.span`\n\tfont-weight: 500;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const SlashDescription = styled.span`\n\tfont-size: 12px;\n\tcolor: ${COLORS.content.secondary};\n\tmargin-left: auto;\n`;\n"],"names":["DropdownContainer","styled","div","COLORS","surface","standard","stroke","primary","content","DropdownItem","_ref","$isActive","hovered","MentionAvatar","img","MentionLabel","span","MentionPresenceDot","_ref2","$online","positive","placeholder","SlashLabel","SlashDescription","secondary"],"mappings":"gOAGaA,MAAAA,EAAoBC,EAAM,QAACC,GAAG;eAC5BC,EAAMA,OAACC,QAAQC;qBACTF,EAAMA,OAACG,OAAOC;;;;;;;;UAQzBJ,EAAMA,OAACK,QAAQD;EAGZE,EAAeR,EAAM,QAACC,GAA4B;;;;;;;;UAQrDC,EAAMA,OAACK,QAAQD;eACVG,IAAA,IAACC,UAAEA,GAAWD,EAAA,OAC3BC,EAAYR,EAAMA,OAACC,QAAQQ,QAAU,aAAa;EAGvCC,EAAgBZ,EAAM,QAACa,GAAG;;;;;;EAQ1BC,EAAed,EAAM,QAACe,IAAI;;UAE7Bb,EAAMA,OAACK,QAAQD;EAGZU,EAAqBhB,EAAM,QAACe,IAA2B;;;;eAIrDE,IAAA,IAACC,QAAEA,GAASD,EAAA,OACzBC,EAAUhB,EAAAA,OAAOK,QAAQY,SAAWjB,EAAMA,OAACK,QAAQa,WAAW;;;EAKnDC,EAAarB,EAAM,QAACe,IAAI;;UAE3Bb,EAAMA,OAACK,QAAQD;EAGZgB,EAAmBtB,EAAM,QAACe,IAAI;;UAEjCb,EAAMA,OAACK,QAAQgB;;"}
1
+ {"version":3,"file":"editorDropdown.styles.js","sources":["../../../../src/editor/extensions/editorDropdown.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const DropdownContainer = styled.div`\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 8px;\n\tbox-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n\tpadding: 4px;\n\tmin-width: 330px;\n\tmax-height: 260px;\n\toverflow-y: auto;\n\tfont-size: 14px;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const DropdownItem = styled.div<{ $isActive?: boolean }>`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 12px 16px;\n\tmin-height: 43px;\n\tborder-radius: 6px;\n\tcursor: pointer;\n\tcolor: ${COLORS.content.primary};\n\tbackground: ${({ $isActive }) =>\n\t\t$isActive ? COLORS.surface.hovered : 'transparent'};\n`;\n\nexport const MentionAvatar = styled.img`\n\twidth: 24px;\n\theight: 24px;\n\tborder-radius: 50%;\n\tobject-fit: cover;\n\tflex-shrink: 0;\n`;\n\nexport const MentionAvatarFallback = styled.div`\n\twidth: 24px;\n\theight: 24px;\n\tborder-radius: 50%;\n\tbackground: ${COLORS.surface.hovered};\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tfont-size: 12px;\n\tfont-weight: 600;\n\tcolor: ${COLORS.content.primary};\n\tflex-shrink: 0;\n`;\n\nexport const MentionLabel = styled.span`\n\tfont-weight: 500;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const MentionPresenceDot = styled.span<{ $online?: boolean }>`\n\twidth: 8px;\n\theight: 8px;\n\tborder-radius: 50%;\n\tbackground: ${({ $online }) =>\n\t\t$online ? COLORS.content.positive : COLORS.content.placeholder};\n\tmargin-left: auto;\n\tflex-shrink: 0;\n`;\n\nexport const SlashLabel = styled.span`\n\tfont-weight: 500;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const SlashDescription = styled.span`\n\tfont-size: 12px;\n\tcolor: ${COLORS.content.secondary};\n\tmargin-left: auto;\n`;\n"],"names":["DropdownContainer","styled","div","COLORS","surface","standard","stroke","primary","content","DropdownItem","_ref","$isActive","hovered","MentionAvatar","img","MentionAvatarFallback","MentionLabel","span","MentionPresenceDot","_ref2","$online","positive","placeholder","SlashLabel","SlashDescription","secondary"],"mappings":"gOAGaA,MAAAA,EAAoBC,EAAM,QAACC,GAAG;eAC5BC,EAAMA,OAACC,QAAQC;qBACTF,EAAMA,OAACG,OAAOC;;;;;;;;UAQzBJ,EAAMA,OAACK,QAAQD;EAGZE,EAAeR,EAAM,QAACC,GAA4B;;;;;;;;UAQrDC,EAAMA,OAACK,QAAQD;eACVG,IAAA,IAACC,UAAEA,GAAWD,EAAA,OAC3BC,EAAYR,EAAMA,OAACC,QAAQQ,QAAU,aAAa;EAGvCC,EAAgBZ,EAAM,QAACa,GAAG;;;;;;EAQ1BC,EAAwBd,EAAM,QAACC,GAAG;;;;eAIhCC,EAAMA,OAACC,QAAQQ;;;;;;UAMpBT,EAAMA,OAACK,QAAQD;;EAIZS,EAAef,EAAM,QAACgB,IAAI;;UAE7Bd,EAAMA,OAACK,QAAQD;EAGZW,EAAqBjB,EAAM,QAACgB,IAA2B;;;;eAIrDE,IAAA,IAACC,QAAEA,GAASD,EAAA,OACzBC,EAAUjB,EAAAA,OAAOK,QAAQa,SAAWlB,EAAMA,OAACK,QAAQc,WAAW;;;EAKnDC,EAAatB,EAAM,QAACgB,IAAI;;UAE3Bd,EAAMA,OAACK,QAAQD;EAGZiB,EAAmBvB,EAAM,QAACgB,IAAI;;UAEjCd,EAAMA,OAACK,QAAQiB;;"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("react"),r=require("../editorDropdown.styles.js");const t=n.forwardRef(((t,o)=>{let{items:i,query:s,command:l,renderItem:a,renderDropdown:d}=t;const[c,u]=n.useState(0),p=e=>{i[e]&&l(i[e])};return n.useImperativeHandle(o,(()=>({onKeyDown:e=>{let{event:n}=e;return"ArrowUp"===n.key?(u((e=>(e+i.length-1)%i.length)),!0):"ArrowDown"===n.key?(u((e=>(e+1)%i.length)),!0):"Enter"===n.key&&(p(c),!0)}}))),n.useEffect((()=>u(0)),[i]),i.length?d?e.jsx(e.Fragment,{children:d({items:i,query:s,activeIndex:c,onSelect:e=>l(e)})}):e.jsx(r.DropdownContainer,{children:i.map(((n,t)=>e.jsx(r.DropdownItem,Object.assign({$isActive:t===c,onMouseEnter:()=>u(t),onClick:()=>p(t)},{children:a?a(n,t===c):e.jsxs(e.Fragment,{children:[n.avatarUrl&&e.jsx(r.MentionAvatar,{src:n.avatarUrl,alt:""}),e.jsx(r.MentionLabel,{children:n.label}),void 0!==n.isOnline&&e.jsx(r.MentionPresenceDot,{$online:n.isOnline})]})}),n.id)))}):null}));t.displayName="MentionDropdown",exports.MentionDropdown=t;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("react"),r=require("../editorDropdown.styles.js");const t=n.forwardRef(((t,o)=>{let{items:s,query:l,command:i,renderItem:a,renderDropdown:c}=t;const[d,u]=n.useState(0),p=n.useRef(null),j=n.useCallback((e=>{const n=p.current;if(!n)return;const r=n.children[e];null==r||r.scrollIntoView({block:"nearest"})}),[]),h=e=>{s[e]&&i(s[e])};return n.useImperativeHandle(o,(()=>({onKeyDown:e=>{let{event:n}=e;return"ArrowUp"===n.key?(u((e=>{const n=(e+s.length-1)%s.length;return j(n),n})),!0):"ArrowDown"===n.key?(u((e=>{const n=(e+1)%s.length;return j(n),n})),!0):"Enter"===n.key&&(h(d),!0)}}))),n.useEffect((()=>u(0)),[s]),s.length?c?e.jsx(e.Fragment,{children:c({items:s,query:l,activeIndex:d,onSelect:e=>i(e)})}):e.jsx(r.DropdownContainer,Object.assign({ref:p},{children:s.map(((n,t)=>e.jsx(r.DropdownItem,Object.assign({$isActive:t===d,onMouseEnter:()=>u(t),onClick:()=>h(t)},{children:a?a(n,t===d):e.jsxs(e.Fragment,{children:[n.avatarUrl?e.jsx(r.MentionAvatar,{src:n.avatarUrl,alt:""}):e.jsx(r.MentionAvatarFallback,{children:n.label.charAt(0).toUpperCase()}),e.jsx(r.MentionLabel,{children:n.label}),void 0!==n.isOnline&&e.jsx(r.MentionPresenceDot,{$online:n.isOnline})]})}),n.id)))})):null}));t.displayName="MentionDropdown",exports.MentionDropdown=t;
2
2
  //# sourceMappingURL=MentionDropdown.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"MentionDropdown.js","sources":["../../../../../src/editor/extensions/mention/MentionDropdown.tsx"],"sourcesContent":["import React, {\n\tforwardRef,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseState,\n} from 'react';\nimport type {\n\tMentionDropdownRenderProps,\n\tMentionItem,\n} from '../../BikEditor.types';\nimport {\n\tDropdownContainer,\n\tDropdownItem,\n\tMentionAvatar,\n\tMentionLabel,\n\tMentionPresenceDot,\n} from '../editorDropdown.styles';\n\ninterface Props {\n\titems: MentionItem[];\n\tquery: string;\n\tcommand: (item: MentionItem) => void;\n\t/** Custom per-row renderer. Receives the item and whether it is the active row. */\n\trenderItem?: (item: MentionItem, isActive: boolean) => React.ReactNode;\n\t/**\n\t * Full custom dropdown renderer. Takes priority over renderItem.\n\t * The editor passes activeIndex and onSelect — you handle all the visual rendering.\n\t */\n\trenderDropdown?: (props: MentionDropdownRenderProps) => React.ReactNode;\n}\n\nexport const MentionDropdown = forwardRef<any, Props>(\n\t({ items, query, command, renderItem, renderDropdown }, ref) => {\n\t\tconst [selectedIndex, setSelectedIndex] = useState(0);\n\n\t\tconst select = (i: number) => {\n\t\t\tif (items[i]) command(items[i]);\n\t\t};\n\n\t\tuseImperativeHandle(ref, () => ({\n\t\t\tonKeyDown: ({ event }: { event: KeyboardEvent }) => {\n\t\t\t\tif (event.key === 'ArrowUp') {\n\t\t\t\t\tsetSelectedIndex((i) => (i + items.length - 1) % items.length);\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'ArrowDown') {\n\t\t\t\t\tsetSelectedIndex((i) => (i + 1) % items.length);\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'Enter') {\n\t\t\t\t\tselect(selectedIndex);\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\treturn false;\n\t\t\t},\n\t\t}));\n\n\t\tuseEffect(() => setSelectedIndex(0), [items]);\n\n\t\tif (!items.length) return null;\n\n\t\t// Full custom dropdown — editor still manages keyboard nav via selectedIndex\n\t\tif (renderDropdown) {\n\t\t\treturn (\n\t\t\t\t<>\n\t\t\t\t\t{renderDropdown({\n\t\t\t\t\t\titems,\n\t\t\t\t\t\tquery,\n\t\t\t\t\t\tactiveIndex: selectedIndex,\n\t\t\t\t\t\tonSelect: (item) => command(item),\n\t\t\t\t\t})}\n\t\t\t\t</>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<DropdownContainer>\n\t\t\t\t{items.map((item, i) => (\n\t\t\t\t\t<DropdownItem\n\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t$isActive={i === selectedIndex}\n\t\t\t\t\t\tonMouseEnter={() => setSelectedIndex(i)}\n\t\t\t\t\t\tonClick={() => select(i)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderItem ? (\n\t\t\t\t\t\t\trenderItem(item, i === selectedIndex)\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t{item.avatarUrl && (\n\t\t\t\t\t\t\t\t\t<MentionAvatar src={item.avatarUrl} alt=\"\" />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t<MentionLabel>{item.label}</MentionLabel>\n\t\t\t\t\t\t\t\t{item.isOnline !== undefined && (\n\t\t\t\t\t\t\t\t\t<MentionPresenceDot $online={item.isOnline} />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</DropdownItem>\n\t\t\t\t))}\n\t\t\t</DropdownContainer>\n\t\t);\n\t},\n);\nMentionDropdown.displayName = 'MentionDropdown';\n"],"names":["MentionDropdown","forwardRef","_ref","ref","items","query","command","renderItem","renderDropdown","selectedIndex","setSelectedIndex","useState","select","i","useImperativeHandle","onKeyDown","_ref2","event","key","length","useEffect","_jsx","_Fragment","children","activeIndex","onSelect","item","DropdownContainer","map","DropdownItem","Object","assign","$isActive","onMouseEnter","onClick","_jsxs","jsxs","avatarUrl","MentionAvatar","src","alt","jsx","MentionLabel","label","undefined","isOnline","MentionPresenceDot","$online","id","displayName"],"mappings":"mKA+BO,MAAMA,EAAkBC,EAAUA,YACxC,CAAAC,EAAwDC,KAAO,IAA9DC,MAAEA,EAAKC,MAAEA,EAAKC,QAAEA,EAAOC,WAAEA,EAAUC,eAAEA,GAAgBN,EACrD,MAAOO,EAAeC,GAAoBC,EAAQA,SAAC,GAE7CC,EAAUC,IACXT,EAAMS,IAAIP,EAAQF,EAAMS,GAAG,EAuBhC,OApBAC,EAAmBA,oBAACX,GAAK,KAAO,CAC/BY,UAAWC,IAAwC,IAAvCC,MAAEA,GAAiCD,EAC9C,MAAkB,YAAdC,EAAMC,KACTR,GAAkBG,IAAOA,EAAIT,EAAMe,OAAS,GAAKf,EAAMe,UAChD,GAEU,cAAdF,EAAMC,KACTR,GAAkBG,IAAOA,EAAI,GAAKT,EAAMe,UACjC,GAEU,UAAdF,EAAMC,MACTN,EAAOH,IACA,EAEI,MAIdW,EAASA,WAAC,IAAMV,EAAiB,IAAI,CAACN,IAEjCA,EAAMe,OAGPX,EAEFa,EAAAA,IACEC,EAAAA,SAAA,CAAAC,SAAAf,EAAe,CACfJ,QACAC,QACAmB,YAAaf,EACbgB,SAAWC,GAASpB,EAAQoB,OAO/BL,EAAAA,IAACM,EAAAA,kBACC,CAAAJ,SAAAnB,EAAMwB,KAAI,CAACF,EAAMb,IACjBQ,MAACQ,EAAAA,aAEWC,OAAAC,OAAA,CAAAC,UAAAnB,IAAMJ,EACjBwB,aAAcA,IAAMvB,EAAiBG,GACrCqB,QAASA,IAAMtB,EAAOC,IAAE,CAAAU,SAEvBhB,EACAA,EAAWmB,EAAMb,IAAMJ,GAEvB0B,EACEC,KAAAd,WAAA,CAAAC,SAAA,CAAAG,EAAKW,WACLhB,EAAAA,IAACiB,EAAAA,cAAc,CAAAC,IAAKb,EAAKW,UAAWG,IAAI,KAEzCnB,EAACoB,IAAAC,eAAc,CAAAnB,SAAAG,EAAKiB,aACDC,IAAlBlB,EAAKmB,UACLxB,EAAAA,IAACyB,EAAAA,mBAA4B,CAAAC,QAAArB,EAAKmB,gBAdhCnB,EAAKsB,QApBY,IAwCL,IAIvBhD,EAAgBiD,YAAc"}
1
+ {"version":3,"file":"MentionDropdown.js","sources":["../../../../../src/editor/extensions/mention/MentionDropdown.tsx"],"sourcesContent":["import React, {\n\tforwardRef,\n\tuseCallback,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseRef,\n\tuseState,\n} from 'react';\nimport type {\n\tMentionDropdownRenderProps,\n\tMentionItem,\n} from '../../BikEditor.types';\nimport {\n\tDropdownContainer,\n\tDropdownItem,\n\tMentionAvatar,\n\tMentionAvatarFallback,\n\tMentionLabel,\n\tMentionPresenceDot,\n} from '../editorDropdown.styles';\n\ninterface Props {\n\titems: MentionItem[];\n\tquery: string;\n\tcommand: (item: MentionItem) => void;\n\t/** Custom per-row renderer. Receives the item and whether it is the active row. */\n\trenderItem?: (item: MentionItem, isActive: boolean) => React.ReactNode;\n\t/**\n\t * Full custom dropdown renderer. Takes priority over renderItem.\n\t * The editor passes activeIndex and onSelect — you handle all the visual rendering.\n\t */\n\trenderDropdown?: (props: MentionDropdownRenderProps) => React.ReactNode;\n}\n\nexport const MentionDropdown = forwardRef<any, Props>(\n\t({ items, query, command, renderItem, renderDropdown }, ref) => {\n\t\tconst [selectedIndex, setSelectedIndex] = useState(0);\n\t\tconst containerRef = useRef<HTMLDivElement>(null);\n\n\t\tconst scrollToIndex = useCallback((index: number) => {\n\t\t\tconst container = containerRef.current;\n\t\t\tif (!container) return;\n\t\t\tconst item = container.children[index] as HTMLElement | undefined;\n\t\t\titem?.scrollIntoView({ block: 'nearest' });\n\t\t}, []);\n\n\t\tconst select = (i: number) => {\n\t\t\tif (items[i]) command(items[i]);\n\t\t};\n\n\t\tuseImperativeHandle(ref, () => ({\n\t\t\tonKeyDown: ({ event }: { event: KeyboardEvent }) => {\n\t\t\t\tif (event.key === 'ArrowUp') {\n\t\t\t\t\tsetSelectedIndex((prev) => {\n\t\t\t\t\t\tconst next = (prev + items.length - 1) % items.length;\n\t\t\t\t\t\tscrollToIndex(next);\n\t\t\t\t\t\treturn next;\n\t\t\t\t\t});\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'ArrowDown') {\n\t\t\t\t\tsetSelectedIndex((prev) => {\n\t\t\t\t\t\tconst next = (prev + 1) % items.length;\n\t\t\t\t\t\tscrollToIndex(next);\n\t\t\t\t\t\treturn next;\n\t\t\t\t\t});\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'Enter') {\n\t\t\t\t\tselect(selectedIndex);\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\treturn false;\n\t\t\t},\n\t\t}));\n\n\t\tuseEffect(() => setSelectedIndex(0), [items]);\n\n\t\tif (!items.length) return null;\n\n\t\t// Full custom dropdown — editor still manages keyboard nav via selectedIndex\n\t\tif (renderDropdown) {\n\t\t\treturn (\n\t\t\t\t<>\n\t\t\t\t\t{renderDropdown({\n\t\t\t\t\t\titems,\n\t\t\t\t\t\tquery,\n\t\t\t\t\t\tactiveIndex: selectedIndex,\n\t\t\t\t\t\tonSelect: (item) => command(item),\n\t\t\t\t\t})}\n\t\t\t\t</>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<DropdownContainer ref={containerRef}>\n\t\t\t\t{items.map((item, i) => (\n\t\t\t\t\t<DropdownItem\n\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t$isActive={i === selectedIndex}\n\t\t\t\t\t\tonMouseEnter={() => setSelectedIndex(i)}\n\t\t\t\t\t\tonClick={() => select(i)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderItem ? (\n\t\t\t\t\t\t\trenderItem(item, i === selectedIndex)\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t{item.avatarUrl ? (\n\t\t\t\t\t\t\t\t\t<MentionAvatar src={item.avatarUrl} alt=\"\" />\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<MentionAvatarFallback>\n\t\t\t\t\t\t\t\t\t\t{item.label.charAt(0).toUpperCase()}\n\t\t\t\t\t\t\t\t\t</MentionAvatarFallback>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t<MentionLabel>{item.label}</MentionLabel>\n\t\t\t\t\t\t\t\t{item.isOnline !== undefined && (\n\t\t\t\t\t\t\t\t\t<MentionPresenceDot $online={item.isOnline} />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</DropdownItem>\n\t\t\t\t))}\n\t\t\t</DropdownContainer>\n\t\t);\n\t},\n);\nMentionDropdown.displayName = 'MentionDropdown';\n"],"names":["MentionDropdown","forwardRef","_ref","ref","items","query","command","renderItem","renderDropdown","selectedIndex","setSelectedIndex","useState","containerRef","useRef","scrollToIndex","useCallback","index","container","current","item","children","scrollIntoView","block","select","i","useImperativeHandle","onKeyDown","_ref2","event","key","prev","next","length","useEffect","_jsx","_Fragment","activeIndex","onSelect","DropdownContainer","Object","assign","map","DropdownItem","onMouseEnter","onClick","_jsxs","jsxs","avatarUrl","MentionAvatar","src","alt","jsx","MentionAvatarFallback","label","charAt","toUpperCase","MentionLabel","undefined","isOnline","MentionPresenceDot","$online","id","displayName"],"mappings":"mKAkCO,MAAMA,EAAkBC,EAAUA,YACxC,CAAAC,EAAwDC,KAAO,IAA9DC,MAAEA,EAAKC,MAAEA,EAAKC,QAAEA,EAAOC,WAAEA,EAAUC,eAAEA,GAAgBN,EACrD,MAAOO,EAAeC,GAAoBC,EAAQA,SAAC,GAC7CC,EAAeC,SAAuB,MAEtCC,EAAgBC,EAAWA,aAAEC,IAClC,MAAMC,EAAYL,EAAaM,QAC/B,IAAKD,EAAW,OAChB,MAAME,EAAOF,EAAUG,SAASJ,GAChCG,SAAAA,EAAME,eAAe,CAAEC,MAAO,WAAY,GACxC,IAEGC,EAAUC,IACXpB,EAAMoB,IAAIlB,EAAQF,EAAMoB,GAAG,EA+BhC,OA5BAC,EAAmBA,oBAACtB,GAAK,KAAO,CAC/BuB,UAAWC,IAAwC,IAAvCC,MAAEA,GAAiCD,EAC9C,MAAkB,YAAdC,EAAMC,KACTnB,GAAkBoB,IACjB,MAAMC,GAAQD,EAAO1B,EAAM4B,OAAS,GAAK5B,EAAM4B,OAE/C,OADAlB,EAAciB,GACPA,CAAI,KAEL,GAEU,cAAdH,EAAMC,KACTnB,GAAkBoB,IACjB,MAAMC,GAAQD,EAAO,GAAK1B,EAAM4B,OAEhC,OADAlB,EAAciB,GACPA,CAAI,KAEL,GAEU,UAAdH,EAAMC,MACTN,EAAOd,IACA,EAEI,MAIdwB,EAASA,WAAC,IAAMvB,EAAiB,IAAI,CAACN,IAEjCA,EAAM4B,OAGPxB,EAEF0B,EAAAA,IACEC,EAAAA,SAAA,CAAAf,SAAAZ,EAAe,CACfJ,QACAC,QACA+B,YAAa3B,EACb4B,SAAWlB,GAASb,EAAQa,OAO/Be,MAACI,EAAAA,kBAAiBC,OAAAC,OAAA,CAACrC,IAAKS,GACtB,CAAAQ,SAAAhB,EAAMqC,KAAI,CAACtB,EAAMK,IACjBU,MAACQ,EAAAA,sCAEWlB,IAAMf,EACjBkC,aAAcA,IAAMjC,EAAiBc,GACrCoB,QAASA,IAAMrB,EAAOC,IAAE,CAAAJ,SAEvBb,EACAA,EAAWY,EAAMK,IAAMf,GAEvBoC,EAAAC,KAAAX,WAAA,CAAAf,SAAA,CACED,EAAK4B,UACLb,EAAAA,IAACc,EAAAA,cAAc,CAAAC,IAAK9B,EAAK4B,UAAWG,IAAI,KAExChB,EAACiB,IAAAC,wBACC,CAAAhC,SAAAD,EAAKkC,MAAMC,OAAO,GAAGC,gBAGxBrB,EAAAiB,IAACK,eAAY,CAAApC,SAAED,EAAKkC,aACDI,IAAlBtC,EAAKuC,UACLxB,EAAAA,IAACyB,EAAAA,mBAA4B,CAAAC,QAAAzC,EAAKuC,gBAlBhCvC,EAAK0C,SApBY,IA4CL,IAIvB7D,EAAgB8D,YAAc"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/@tiptap/core/dist/index.js"),t=require("@tiptap/extension-mention"),n=require("@tiptap/react"),r=require("tippy.js"),o=require("./MentionDropdown.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var s=i(t),a=i(r);function l(e){let t=arguments.length>2?arguments[2]:void 0,r=arguments.length>3?arguments[3]:void 0;return()=>{let e,i;return{onStart:s=>{e=new n.ReactRenderer(o.MentionDropdown,{props:Object.assign(Object.assign({},s),{renderItem:t,renderDropdown:r}),editor:s.editor}),i=a.default(document.body,{getReferenceClientRect:s.clientRect,appendTo:()=>document.body,content:e.element,showOnCreate:!0,interactive:!0,trigger:"manual",placement:"bottom-start",zIndex:9999,arrow:!1,onMount:e=>{const t=e.popper.querySelector(".tippy-box");t&&(t.style.cssText="background:none;box-shadow:none;border:none;padding:0;border-radius:0;")}})},onUpdate:n=>{var o,s,a;e.updateProps(Object.assign(Object.assign({},n),{renderItem:t,renderDropdown:r})),(null===(o=n.items)||void 0===o?void 0:o.length)?null===(a=i[0])||void 0===a||a.setProps({getReferenceClientRect:n.clientRect}):null===(s=i[0])||void 0===s||s.hide()},onKeyDown:t=>{var n,r,o;return"Escape"===t.event.key?(null===(n=i[0])||void 0===n||n.hide(),!0):null!==(o=null===(r=e.ref)||void 0===r?void 0:r.onKeyDown(t))&&void 0!==o&&o},onExit:()=>{var t;null===(t=i[0])||void 0===t||t.destroy(),e.destroy()}}}}exports.buildAgentMentionExtension=function(t,n,r,o){return s.default.extend({name:"mentionAgent"}).configure({HTMLAttributes:{class:"bik-mention bik-mention--agent"},renderText:e=>{let{options:t,node:n}=e;return`${t.suggestion.char}${n.attrs.label}`},renderHTML:t=>{let{options:n,node:r}=t;return["span",e.mergeAttributes(n.HTMLAttributes),`${n.suggestion.char}${r.attrs.label}`]},suggestion:{char:"@",items:e=>{let{query:n}=e;return t.filter((e=>e.label.toLowerCase().includes(n.toLowerCase()))).slice(0,10)},command:e=>{let{editor:t,range:r,props:o}=e;t.chain().focus().deleteRange(r).insertContent({type:"mentionAgent",attrs:{id:o.id,label:o.label}}).run(),null==n||n(o,"@")},render:l(n,"@",r,o)}})},exports.buildTeamMentionExtension=function(t,n,r,o){return s.default.extend({name:"mentionTeam"}).configure({HTMLAttributes:{class:"bik-mention bik-mention--team"},renderText:e=>{let{options:t,node:n}=e;return`${t.suggestion.char}${n.attrs.label}`},renderHTML:t=>{let{options:n,node:r}=t;return["span",e.mergeAttributes(n.HTMLAttributes),`${n.suggestion.char}${r.attrs.label}`]},suggestion:{char:"#",items:e=>{let{query:n}=e;return t.filter((e=>e.label.toLowerCase().includes(n.toLowerCase()))).slice(0,10)},command:e=>{let{editor:t,range:r,props:o}=e;t.chain().focus().deleteRange(r).insertContent({type:"mentionTeam",attrs:{id:o.id,label:o.label}}).run(),null==n||n(o,"#")},render:l(n,"#",r,o)}})};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/@tiptap/core/dist/index.js"),t=require("@tiptap/extension-mention"),n=require("@tiptap/react"),r=require("tippy.js"),o=require("./MentionDropdown.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var s=i(t),a=i(r);function d(e){let t=arguments.length>2?arguments[2]:void 0,r=arguments.length>3?arguments[3]:void 0;return()=>{let e,i;return{onStart:s=>{e=new n.ReactRenderer(o.MentionDropdown,{props:Object.assign(Object.assign({},s),{renderItem:t,renderDropdown:r}),editor:s.editor}),i=a.default(document.body,{getReferenceClientRect:s.clientRect,appendTo:()=>document.body,content:e.element,showOnCreate:!0,interactive:!0,trigger:"manual",placement:"bottom-start",zIndex:9999,arrow:!1,onMount:e=>{const t=e.popper.querySelector(".tippy-box");t&&(t.style.cssText="background:none;box-shadow:none;border:none;padding:0;border-radius:0;")}})},onUpdate:n=>{var o,s,a;e.updateProps(Object.assign(Object.assign({},n),{renderItem:t,renderDropdown:r})),(null===(o=n.items)||void 0===o?void 0:o.length)?null===(a=i[0])||void 0===a||a.setProps({getReferenceClientRect:n.clientRect}):null===(s=i[0])||void 0===s||s.hide()},onKeyDown:t=>{var n,r,o;return"Escape"===t.event.key?(null===(n=i[0])||void 0===n||n.hide(),!0):null!==(o=null===(r=e.ref)||void 0===r?void 0:r.onKeyDown(t))&&void 0!==o&&o},onExit:()=>{var t;null===(t=i[0])||void 0===t||t.destroy(),e.destroy()}}}}exports.buildAgentMentionExtension=function(t,n,r,o){return s.default.extend({name:"mentionAgent"}).configure({HTMLAttributes:{class:"bik-mention bik-mention--agent"},renderText:e=>{let{options:t,node:n}=e;return`${t.suggestion.char}${n.attrs.label}`},renderHTML:t=>{let{options:n,node:r}=t;return["span",e.mergeAttributes(n.HTMLAttributes),`${n.suggestion.char}${r.attrs.label}`]},suggestion:{char:"@",items:e=>{let{query:n}=e;return t.filter((e=>e.label.toLowerCase().includes(n.toLowerCase())))},command:e=>{let{editor:t,range:r,props:o}=e;t.chain().focus().deleteRange(r).insertContent({type:"mentionAgent",attrs:{id:o.id,label:o.label}}).run(),null==n||n(o,"@")},render:d(n,"@",r,o)}})},exports.buildTeamMentionExtension=function(t,n,r,o){return s.default.extend({name:"mentionTeam"}).configure({HTMLAttributes:{class:"bik-mention bik-mention--team"},renderText:e=>{let{options:t,node:n}=e;return`${t.suggestion.char}${n.attrs.label}`},renderHTML:t=>{let{options:n,node:r}=t;return["span",e.mergeAttributes(n.HTMLAttributes),`${n.suggestion.char}${r.attrs.label}`]},suggestion:{char:"#",items:e=>{let{query:n}=e;return t.filter((e=>e.label.toLowerCase().includes(n.toLowerCase())))},command:e=>{let{editor:t,range:r,props:o}=e;t.chain().focus().deleteRange(r).insertContent({type:"mentionTeam",attrs:{id:o.id,label:o.label}}).run(),null==n||n(o,"#")},render:d(n,"#",r,o)}})};
2
2
  //# sourceMappingURL=MentionExtension.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"MentionExtension.js","sources":["../../../../../src/editor/extensions/mention/MentionExtension.ts"],"sourcesContent":["import { mergeAttributes } from '@tiptap/core';\nimport Mention from '@tiptap/extension-mention';\nimport { ReactRenderer } from '@tiptap/react';\nimport type { ReactNode } from 'react';\nimport tippy from 'tippy.js';\nimport type {\n\tMentionDropdownRenderProps,\n\tMentionItem,\n} from '../../BikEditor.types';\nimport { MentionDropdown } from './MentionDropdown';\n\nfunction buildRender(\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\tchar: '@' | '#' = '@',\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n) {\n\treturn () => {\n\t\tlet component: ReactRenderer;\n\t\tlet popup: any;\n\n\t\treturn {\n\t\t\tonStart: (props: any) => {\n\t\t\t\tcomponent = new ReactRenderer(MentionDropdown, {\n\t\t\t\t\tprops: { ...props, renderItem, renderDropdown },\n\t\t\t\t\teditor: props.editor,\n\t\t\t\t});\n\t\t\t\tpopup = tippy(document.body, {\n\t\t\t\t\tgetReferenceClientRect: props.clientRect,\n\t\t\t\t\tappendTo: () => document.body,\n\t\t\t\t\tcontent: component.element,\n\t\t\t\t\tshowOnCreate: true,\n\t\t\t\t\tinteractive: true,\n\t\t\t\t\ttrigger: 'manual',\n\t\t\t\t\tplacement: 'bottom-start',\n\t\t\t\t\tzIndex: 9999,\n\t\t\t\t\tarrow: false,\n\t\t\t\t\t// tippy's default dark theme adds a visible box even when content\n\t\t\t\t\t// is empty. Strip it so our dropdown handles all visual styling.\n\t\t\t\t\tonMount: (instance) => {\n\t\t\t\t\t\tconst box =\n\t\t\t\t\t\t\tinstance.popper.querySelector<HTMLElement>('.tippy-box');\n\t\t\t\t\t\tif (box)\n\t\t\t\t\t\t\tbox.style.cssText =\n\t\t\t\t\t\t\t\t'background:none;box-shadow:none;border:none;padding:0;border-radius:0;';\n\t\t\t\t\t},\n\t\t\t\t});\n\t\t\t},\n\t\t\tonUpdate: (props: any) => {\n\t\t\t\tcomponent.updateProps({ ...props, renderItem, renderDropdown });\n\t\t\t\tif (!props.items?.length) {\n\t\t\t\t\tpopup[0]?.hide();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tpopup[0]?.setProps({ getReferenceClientRect: props.clientRect });\n\t\t\t},\n\t\t\tonKeyDown: (props: any) => {\n\t\t\t\tif (props.event.key === 'Escape') {\n\t\t\t\t\tpopup[0]?.hide();\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\treturn (component.ref as any)?.onKeyDown(props) ?? false;\n\t\t\t},\n\t\t\tonExit: () => {\n\t\t\t\tpopup[0]?.destroy();\n\t\t\t\tcomponent.destroy();\n\t\t\t},\n\t\t};\n\t};\n}\n\nexport function buildAgentMentionExtension(\n\tagents: MentionItem[],\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n) {\n\treturn Mention.extend({ name: 'mentionAgent' }).configure({\n\t\tHTMLAttributes: { class: 'bik-mention bik-mention--agent' },\n\t\trenderText: ({ options, node }) =>\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\trenderHTML: ({ options, node }) => [\n\t\t\t'span',\n\t\t\tmergeAttributes(options.HTMLAttributes),\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\t],\n\t\tsuggestion: {\n\t\t\tchar: '@',\n\t\t\titems: ({ query }: { query: string }) =>\n\t\t\t\tagents\n\t\t\t\t\t.filter((a) => a.label.toLowerCase().includes(query.toLowerCase()))\n\t\t\t\t\t.slice(0, 10),\n\t\t\tcommand: ({ editor, range, props }: any) => {\n\t\t\t\teditor\n\t\t\t\t\t.chain()\n\t\t\t\t\t.focus()\n\t\t\t\t\t.deleteRange(range)\n\t\t\t\t\t.insertContent({\n\t\t\t\t\t\ttype: 'mentionAgent',\n\t\t\t\t\t\tattrs: { id: props.id, label: props.label },\n\t\t\t\t\t})\n\t\t\t\t\t.run();\n\t\t\t\tonSelect?.(props, '@');\n\t\t\t},\n\t\t\trender: buildRender(onSelect, '@', renderItem, renderDropdown),\n\t\t},\n\t});\n}\n\nexport function buildTeamMentionExtension(\n\tteams: MentionItem[],\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n) {\n\treturn Mention.extend({ name: 'mentionTeam' }).configure({\n\t\tHTMLAttributes: { class: 'bik-mention bik-mention--team' },\n\t\trenderText: ({ options, node }) =>\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\trenderHTML: ({ options, node }) => [\n\t\t\t'span',\n\t\t\tmergeAttributes(options.HTMLAttributes),\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\t],\n\t\tsuggestion: {\n\t\t\tchar: '#',\n\t\t\titems: ({ query }: { query: string }) =>\n\t\t\t\tteams\n\t\t\t\t\t.filter((t) => t.label.toLowerCase().includes(query.toLowerCase()))\n\t\t\t\t\t.slice(0, 10),\n\t\t\tcommand: ({ editor, range, props }: any) => {\n\t\t\t\teditor\n\t\t\t\t\t.chain()\n\t\t\t\t\t.focus()\n\t\t\t\t\t.deleteRange(range)\n\t\t\t\t\t.insertContent({\n\t\t\t\t\t\ttype: 'mentionTeam',\n\t\t\t\t\t\tattrs: { id: props.id, label: props.label },\n\t\t\t\t\t})\n\t\t\t\t\t.run();\n\t\t\t\tonSelect?.(props, '#');\n\t\t\t},\n\t\t\trender: buildRender(onSelect, '#', renderItem, renderDropdown),\n\t\t},\n\t});\n}\n"],"names":["buildRender","onSelect","renderItem","arguments","length","undefined","renderDropdown","component","popup","onStart","props","ReactRenderer","MentionDropdown","editor","tippy","document","body","getReferenceClientRect","clientRect","appendTo","content","element","showOnCreate","interactive","trigger","placement","zIndex","arrow","onMount","instance","box","popper","querySelector","style","cssText","onUpdate","updateProps","Object","assign","_a","items","_c","setProps","_b","hide","onKeyDown","event","key","ref","onExit","destroy","agents","Mention","extend","name","configure","HTMLAttributes","class","renderText","_ref","options","node","suggestion","char","attrs","renderHTML","_ref2","mergeAttributes","_ref3","query","filter","a","label","toLowerCase","includes","slice","command","_ref4","range","chain","focus","deleteRange","insertContent","type","id","run","render","teams","_ref5","_ref6","_ref7","t","_ref8"],"mappings":"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"}
1
+ {"version":3,"file":"MentionExtension.js","sources":["../../../../../src/editor/extensions/mention/MentionExtension.ts"],"sourcesContent":["import { mergeAttributes } from '@tiptap/core';\nimport Mention from '@tiptap/extension-mention';\nimport { ReactRenderer } from '@tiptap/react';\nimport type { ReactNode } from 'react';\nimport tippy from 'tippy.js';\nimport type {\n\tMentionDropdownRenderProps,\n\tMentionItem,\n} from '../../BikEditor.types';\nimport { MentionDropdown } from './MentionDropdown';\n\nfunction buildRender(\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\tchar: '@' | '#' = '@',\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n) {\n\treturn () => {\n\t\tlet component: ReactRenderer;\n\t\tlet popup: any;\n\n\t\treturn {\n\t\t\tonStart: (props: any) => {\n\t\t\t\tcomponent = new ReactRenderer(MentionDropdown, {\n\t\t\t\t\tprops: { ...props, renderItem, renderDropdown },\n\t\t\t\t\teditor: props.editor,\n\t\t\t\t});\n\t\t\t\tpopup = tippy(document.body, {\n\t\t\t\t\tgetReferenceClientRect: props.clientRect,\n\t\t\t\t\tappendTo: () => document.body,\n\t\t\t\t\tcontent: component.element,\n\t\t\t\t\tshowOnCreate: true,\n\t\t\t\t\tinteractive: true,\n\t\t\t\t\ttrigger: 'manual',\n\t\t\t\t\tplacement: 'bottom-start',\n\t\t\t\t\tzIndex: 9999,\n\t\t\t\t\tarrow: false,\n\t\t\t\t\t// tippy's default dark theme adds a visible box even when content\n\t\t\t\t\t// is empty. Strip it so our dropdown handles all visual styling.\n\t\t\t\t\tonMount: (instance) => {\n\t\t\t\t\t\tconst box =\n\t\t\t\t\t\t\tinstance.popper.querySelector<HTMLElement>('.tippy-box');\n\t\t\t\t\t\tif (box)\n\t\t\t\t\t\t\tbox.style.cssText =\n\t\t\t\t\t\t\t\t'background:none;box-shadow:none;border:none;padding:0;border-radius:0;';\n\t\t\t\t\t},\n\t\t\t\t});\n\t\t\t},\n\t\t\tonUpdate: (props: any) => {\n\t\t\t\tcomponent.updateProps({ ...props, renderItem, renderDropdown });\n\t\t\t\tif (!props.items?.length) {\n\t\t\t\t\tpopup[0]?.hide();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tpopup[0]?.setProps({ getReferenceClientRect: props.clientRect });\n\t\t\t},\n\t\t\tonKeyDown: (props: any) => {\n\t\t\t\tif (props.event.key === 'Escape') {\n\t\t\t\t\tpopup[0]?.hide();\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\treturn (component.ref as any)?.onKeyDown(props) ?? false;\n\t\t\t},\n\t\t\tonExit: () => {\n\t\t\t\tpopup[0]?.destroy();\n\t\t\t\tcomponent.destroy();\n\t\t\t},\n\t\t};\n\t};\n}\n\nexport function buildAgentMentionExtension(\n\tagents: MentionItem[],\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n) {\n\treturn Mention.extend({ name: 'mentionAgent' }).configure({\n\t\tHTMLAttributes: { class: 'bik-mention bik-mention--agent' },\n\t\trenderText: ({ options, node }) =>\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\trenderHTML: ({ options, node }) => [\n\t\t\t'span',\n\t\t\tmergeAttributes(options.HTMLAttributes),\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\t],\n\t\tsuggestion: {\n\t\t\tchar: '@',\n\t\t\titems: ({ query }: { query: string }) =>\n\t\t\t\tagents.filter((a) =>\n\t\t\t\t\ta.label.toLowerCase().includes(query.toLowerCase()),\n\t\t\t\t),\n\t\t\tcommand: ({ editor, range, props }: any) => {\n\t\t\t\teditor\n\t\t\t\t\t.chain()\n\t\t\t\t\t.focus()\n\t\t\t\t\t.deleteRange(range)\n\t\t\t\t\t.insertContent({\n\t\t\t\t\t\ttype: 'mentionAgent',\n\t\t\t\t\t\tattrs: { id: props.id, label: props.label },\n\t\t\t\t\t})\n\t\t\t\t\t.run();\n\t\t\t\tonSelect?.(props, '@');\n\t\t\t},\n\t\t\trender: buildRender(onSelect, '@', renderItem, renderDropdown),\n\t\t},\n\t});\n}\n\nexport function buildTeamMentionExtension(\n\tteams: MentionItem[],\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n) {\n\treturn Mention.extend({ name: 'mentionTeam' }).configure({\n\t\tHTMLAttributes: { class: 'bik-mention bik-mention--team' },\n\t\trenderText: ({ options, node }) =>\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\trenderHTML: ({ options, node }) => [\n\t\t\t'span',\n\t\t\tmergeAttributes(options.HTMLAttributes),\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\t],\n\t\tsuggestion: {\n\t\t\tchar: '#',\n\t\t\titems: ({ query }: { query: string }) =>\n\t\t\t\tteams.filter((t) =>\n\t\t\t\t\tt.label.toLowerCase().includes(query.toLowerCase()),\n\t\t\t\t),\n\t\t\tcommand: ({ editor, range, props }: any) => {\n\t\t\t\teditor\n\t\t\t\t\t.chain()\n\t\t\t\t\t.focus()\n\t\t\t\t\t.deleteRange(range)\n\t\t\t\t\t.insertContent({\n\t\t\t\t\t\ttype: 'mentionTeam',\n\t\t\t\t\t\tattrs: { id: props.id, label: props.label },\n\t\t\t\t\t})\n\t\t\t\t\t.run();\n\t\t\t\tonSelect?.(props, '#');\n\t\t\t},\n\t\t\trender: buildRender(onSelect, '#', renderItem, renderDropdown),\n\t\t},\n\t});\n}\n"],"names":["buildRender","onSelect","renderItem","arguments","length","undefined","renderDropdown","component","popup","onStart","props","ReactRenderer","MentionDropdown","editor","tippy","document","body","getReferenceClientRect","clientRect","appendTo","content","element","showOnCreate","interactive","trigger","placement","zIndex","arrow","onMount","instance","box","popper","querySelector","style","cssText","onUpdate","updateProps","Object","assign","_a","items","_c","setProps","_b","hide","onKeyDown","event","key","ref","onExit","destroy","agents","Mention","extend","name","configure","HTMLAttributes","class","renderText","_ref","options","node","suggestion","char","attrs","renderHTML","_ref2","mergeAttributes","_ref3","query","filter","a","label","toLowerCase","includes","command","_ref4","range","chain","focus","deleteRange","insertContent","type","id","run","render","teams","_ref5","_ref6","_ref7","t","_ref8"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/@tiptap/core/dist/index.js"),t=require("@tiptap/pm/model"),a=require("@tiptap/pm/state");const r=e.Extension.create({name:"plainClipboard",addProseMirrorPlugins:()=>[new a.Plugin({props:{handlePaste(e,a){var r,i,l,n;if(null===(i=null===(r=a.clipboardData)||void 0===r?void 0:r.files)||void 0===i?void 0:i.length)return!1;const o=null===(l=a.clipboardData)||void 0===l?void 0:l.getData("text/html"),p=null===(n=a.clipboardData)||void 0===n?void 0:n.getData("text/plain");if(!p||!o)return!1;const d=e.state.schema,s=p.split("\n").map((e=>d.node("paragraph",null,e?[d.text(e)]:[]))),u=new t.Slice(t.Fragment.fromArray(s),0,0);return e.dispatch(e.state.tr.replaceSelection(u)),!0}}})]});exports.PlainClipboardExtension=r;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/@tiptap/core/dist/index.js"),t=require("@tiptap/pm/model"),a=require("@tiptap/pm/state");const r=e.Extension.create({name:"plainClipboard",addProseMirrorPlugins:()=>[new a.Plugin({props:{handlePaste(e,a){var r,i,l,n;if(null===(i=null===(r=a.clipboardData)||void 0===r?void 0:r.files)||void 0===i?void 0:i.length)return!1;const o=null===(l=a.clipboardData)||void 0===l?void 0:l.getData("text/html"),p=null===(n=a.clipboardData)||void 0===n?void 0:n.getData("text/plain");if(!p||!o)return!1;const d=e.state.schema,s=p.split("\n").map((e=>d.node("paragraph",null,e?[d.text(e)]:[]))),u=new t.Slice(t.Fragment.fromArray(s),1,1);return e.dispatch(e.state.tr.replaceSelection(u)),!0}}})]});exports.PlainClipboardExtension=r;
2
2
  //# sourceMappingURL=PlainClipboardExtension.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"PlainClipboardExtension.js","sources":["../../../../../src/editor/extensions/plainClipboard/PlainClipboardExtension.ts"],"sourcesContent":["import { Extension } from '@tiptap/core';\nimport { Fragment, Slice } from '@tiptap/pm/model';\nimport { Plugin } from '@tiptap/pm/state';\n\nexport const PlainClipboardExtension = Extension.create({\n\tname: 'plainClipboard',\n\taddProseMirrorPlugins() {\n\t\treturn [\n\t\t\tnew Plugin({\n\t\t\t\tprops: {\n\t\t\t\t\thandlePaste(_view, event) {\n\t\t\t\t\t\tif (event.clipboardData?.files?.length) return false; // let ImagePaste handle\n\t\t\t\t\t\tconst html = event.clipboardData?.getData('text/html');\n\t\t\t\t\t\tconst text = event.clipboardData?.getData('text/plain');\n\t\t\t\t\t\tif (!text || !html) return false;\n\n\t\t\t\t\t\tconst schema = _view.state.schema;\n\t\t\t\t\t\t// Split on each newline so that multi-paragraph pastes produce\n\t\t\t\t\t\t// separate paragraph nodes — matching the behaviour of pressing\n\t\t\t\t\t\t// Enter between lines. Using schema.text() collapses all newlines\n\t\t\t\t\t\t// because ProseMirror text nodes cannot contain '\\n'.\n\t\t\t\t\t\tconst paragraphs = text\n\t\t\t\t\t\t\t.split('\\n')\n\t\t\t\t\t\t\t.map((line) =>\n\t\t\t\t\t\t\t\tschema.node('paragraph', null, line ? [schema.text(line)] : []),\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\tconst slice = new Slice(Fragment.fromArray(paragraphs), 0, 0);\n\t\t\t\t\t\t_view.dispatch(_view.state.tr.replaceSelection(slice));\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t}),\n\t\t];\n\t},\n});\n"],"names":["PlainClipboardExtension","Extension","create","name","addProseMirrorPlugins","Plugin","props","handlePaste","_view","event","_b","clipboardData","_a","files","length","html","_c","getData","text","_d","schema","state","paragraphs","split","map","line","node","slice","Slice","Fragment","fromArray","dispatch","tr","replaceSelection"],"mappings":"wMAIaA,EAA0BC,EAASA,UAACC,OAAO,CACvDC,KAAM,iBACNC,sBAAqBA,IACb,CACN,IAAIC,EAAAA,OAAO,CACVC,MAAO,CACNC,YAAYC,EAAOC,eAClB,WAAIC,EAAqB,UAArBD,EAAME,qBAAe,IAAAC,OAAA,EAAAA,EAAAC,4BAAOC,OAAQ,OAAO,EAC/C,MAAMC,EAA0B,QAAnBC,EAAAP,EAAME,qBAAa,IAAAK,OAAA,EAAAA,EAAEC,QAAQ,aACpCC,EAA0B,QAAnBC,EAAAV,EAAME,qBAAa,IAAAQ,OAAA,EAAAA,EAAEF,QAAQ,cAC1C,IAAKC,IAASH,EAAM,OAAO,EAE3B,MAAMK,EAASZ,EAAMa,MAAMD,OAKrBE,EAAaJ,EACjBK,MAAM,MACNC,KAAKC,GACLL,EAAOM,KAAK,YAAa,KAAMD,EAAO,CAACL,EAAOF,KAAKO,IAAS,MAExDE,EAAQ,IAAIC,EAAAA,MAAMC,EAAQA,SAACC,UAAUR,GAAa,EAAG,GAE3D,OADAd,EAAMuB,SAASvB,EAAMa,MAAMW,GAAGC,iBAAiBN,KACxC,CACR"}
1
+ {"version":3,"file":"PlainClipboardExtension.js","sources":["../../../../../src/editor/extensions/plainClipboard/PlainClipboardExtension.ts"],"sourcesContent":["import { Extension } from '@tiptap/core';\nimport { Fragment, Slice } from '@tiptap/pm/model';\nimport { Plugin } from '@tiptap/pm/state';\n\nexport const PlainClipboardExtension = Extension.create({\n\tname: 'plainClipboard',\n\taddProseMirrorPlugins() {\n\t\treturn [\n\t\t\tnew Plugin({\n\t\t\t\tprops: {\n\t\t\t\t\thandlePaste(_view, event) {\n\t\t\t\t\t\tif (event.clipboardData?.files?.length) return false; // let ImagePaste handle\n\t\t\t\t\t\tconst html = event.clipboardData?.getData('text/html');\n\t\t\t\t\t\tconst text = event.clipboardData?.getData('text/plain');\n\t\t\t\t\t\tif (!text || !html) return false;\n\n\t\t\t\t\t\tconst schema = _view.state.schema;\n\t\t\t\t\t\t// Split on each newline so that multi-paragraph pastes produce\n\t\t\t\t\t\t// separate paragraph nodes — matching the behaviour of pressing\n\t\t\t\t\t\t// Enter between lines. Using schema.text() collapses all newlines\n\t\t\t\t\t\t// because ProseMirror text nodes cannot contain '\\n'.\n\t\t\t\t\t\tconst paragraphs = text\n\t\t\t\t\t\t\t.split('\\n')\n\t\t\t\t\t\t\t.map((line) =>\n\t\t\t\t\t\t\t\tschema.node('paragraph', null, line ? [schema.text(line)] : []),\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\tconst slice = new Slice(Fragment.fromArray(paragraphs), 1, 1);\n\t\t\t\t\t\t_view.dispatch(_view.state.tr.replaceSelection(slice));\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t}),\n\t\t];\n\t},\n});\n"],"names":["PlainClipboardExtension","Extension","create","name","addProseMirrorPlugins","Plugin","props","handlePaste","_view","event","_b","clipboardData","_a","files","length","html","_c","getData","text","_d","schema","state","paragraphs","split","map","line","node","slice","Slice","Fragment","fromArray","dispatch","tr","replaceSelection"],"mappings":"wMAIaA,EAA0BC,EAASA,UAACC,OAAO,CACvDC,KAAM,iBACNC,sBAAqBA,IACb,CACN,IAAIC,EAAAA,OAAO,CACVC,MAAO,CACNC,YAAYC,EAAOC,eAClB,WAAIC,EAAqB,UAArBD,EAAME,qBAAe,IAAAC,OAAA,EAAAA,EAAAC,4BAAOC,OAAQ,OAAO,EAC/C,MAAMC,EAA0B,QAAnBC,EAAAP,EAAME,qBAAa,IAAAK,OAAA,EAAAA,EAAEC,QAAQ,aACpCC,EAA0B,QAAnBC,EAAAV,EAAME,qBAAa,IAAAQ,OAAA,EAAAA,EAAEF,QAAQ,cAC1C,IAAKC,IAASH,EAAM,OAAO,EAE3B,MAAMK,EAASZ,EAAMa,MAAMD,OAKrBE,EAAaJ,EACjBK,MAAM,MACNC,KAAKC,GACLL,EAAOM,KAAK,YAAa,KAAMD,EAAO,CAACL,EAAOF,KAAKO,IAAS,MAExDE,EAAQ,IAAIC,EAAAA,MAAMC,EAAQA,SAACC,UAAUR,GAAa,EAAG,GAE3D,OADAd,EAAMuB,SAASvB,EAAMa,MAAMW,GAAGC,iBAAiBN,KACxC,CACR"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),n=require("../editorDropdown.styles.js");const t=r.forwardRef(((t,s)=>{let{items:o,query:i,command:l,renderItem:a,renderDropdown:d}=t;const[c,u]=r.useState(0),m=e=>{o[e]&&l(o[e])};return r.useImperativeHandle(s,(()=>({onKeyDown:e=>{let{event:r}=e;return"ArrowUp"===r.key?(u((e=>(e+o.length-1)%o.length)),!0):"ArrowDown"===r.key?(u((e=>(e+1)%o.length)),!0):"Enter"===r.key&&(m(c),!0)}}))),r.useEffect((()=>u(0)),[o]),o.length?d?e.jsx(e.Fragment,{children:d({items:o,query:i,activeIndex:c,onSelect:e=>l(e)})}):e.jsx(n.DropdownContainer,{children:o.map(((r,t)=>e.jsx(n.DropdownItem,Object.assign({$isActive:t===c,onMouseEnter:()=>u(t),onClick:()=>m(t)},{children:a?a(r,t===c):e.jsxs(e.Fragment,{children:[e.jsx(n.SlashLabel,{children:r.label}),r.description&&e.jsx(n.SlashDescription,{children:r.description})]})}),r.id)))}):null}));t.displayName="SlashCommandMenu",exports.SlashCommandMenu=t;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),n=require("../editorDropdown.styles.js");const t=r.forwardRef(((t,s)=>{let{items:o,query:l,command:i,renderItem:c,renderDropdown:a}=t;const[d,u]=r.useState(0),m=r.useRef(null),h=r.useCallback((e=>{const r=m.current;if(!r)return;const n=r.children[e];null==n||n.scrollIntoView({block:"nearest"})}),[]),p=e=>{o[e]&&i(o[e])};return r.useImperativeHandle(s,(()=>({onKeyDown:e=>{let{event:r}=e;return"ArrowUp"===r.key?(u((e=>{const r=(e+o.length-1)%o.length;return h(r),r})),!0):"ArrowDown"===r.key?(u((e=>{const r=(e+1)%o.length;return h(r),r})),!0):"Enter"===r.key&&(p(d),!0)}}))),r.useEffect((()=>u(0)),[o]),o.length?a?e.jsx(e.Fragment,{children:a({items:o,query:l,activeIndex:d,onSelect:e=>i(e)})}):e.jsx(n.DropdownContainer,Object.assign({ref:m},{children:o.map(((r,t)=>e.jsx(n.DropdownItem,Object.assign({$isActive:t===d,onMouseEnter:()=>u(t),onClick:()=>p(t)},{children:c?c(r,t===d):e.jsxs(e.Fragment,{children:[e.jsx(n.SlashLabel,{children:r.label}),r.description&&e.jsx(n.SlashDescription,{children:r.description})]})}),r.id)))})):null}));t.displayName="SlashCommandMenu",exports.SlashCommandMenu=t;
2
2
  //# sourceMappingURL=SlashCommandMenu.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"SlashCommandMenu.js","sources":["../../../../../src/editor/extensions/slashCommand/SlashCommandMenu.tsx"],"sourcesContent":["import React, {\n\tforwardRef,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseState,\n} from 'react';\nimport type {\n\tSlashCommandDropdownRenderProps,\n\tSlashCommandItem,\n} from '../../BikEditor.types';\nimport {\n\tDropdownContainer,\n\tDropdownItem,\n\tSlashDescription,\n\tSlashLabel,\n} from '../editorDropdown.styles';\n\ninterface Props {\n\titems: SlashCommandItem[];\n\tquery: string;\n\tcommand: (item: SlashCommandItem) => void;\n\t/** Custom per-row renderer. Receives the item and whether it is the active row. */\n\trenderItem?: (item: SlashCommandItem, isActive: boolean) => React.ReactNode;\n\t/**\n\t * Full custom dropdown renderer. Takes priority over renderItem.\n\t * The editor passes activeIndex and onSelect — you handle all the visual rendering.\n\t */\n\trenderDropdown?: (props: SlashCommandDropdownRenderProps) => React.ReactNode;\n}\n\nexport const SlashCommandMenu = forwardRef<any, Props>(\n\t({ items, query, command, renderItem, renderDropdown }, ref) => {\n\t\tconst [selectedIndex, setSelectedIndex] = useState(0);\n\n\t\tconst select = (i: number) => {\n\t\t\tif (items[i]) command(items[i]);\n\t\t};\n\n\t\tuseImperativeHandle(ref, () => ({\n\t\t\tonKeyDown: ({ event }: { event: KeyboardEvent }) => {\n\t\t\t\tif (event.key === 'ArrowUp') {\n\t\t\t\t\tsetSelectedIndex((i) => (i + items.length - 1) % items.length);\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'ArrowDown') {\n\t\t\t\t\tsetSelectedIndex((i) => (i + 1) % items.length);\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'Enter') {\n\t\t\t\t\tselect(selectedIndex);\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\treturn false;\n\t\t\t},\n\t\t}));\n\n\t\tuseEffect(() => setSelectedIndex(0), [items]);\n\n\t\tif (!items.length) return null;\n\n\t\t// Full custom dropdown — editor still manages keyboard nav via selectedIndex\n\t\tif (renderDropdown) {\n\t\t\treturn (\n\t\t\t\t<>\n\t\t\t\t\t{renderDropdown({\n\t\t\t\t\t\titems,\n\t\t\t\t\t\tquery,\n\t\t\t\t\t\tactiveIndex: selectedIndex,\n\t\t\t\t\t\tonSelect: (item) => command(item),\n\t\t\t\t\t})}\n\t\t\t\t</>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<DropdownContainer>\n\t\t\t\t{items.map((item, i) => (\n\t\t\t\t\t<DropdownItem\n\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t$isActive={i === selectedIndex}\n\t\t\t\t\t\tonMouseEnter={() => setSelectedIndex(i)}\n\t\t\t\t\t\tonClick={() => select(i)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderItem ? (\n\t\t\t\t\t\t\trenderItem(item, i === selectedIndex)\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<SlashLabel>{item.label}</SlashLabel>\n\t\t\t\t\t\t\t\t{item.description && (\n\t\t\t\t\t\t\t\t\t<SlashDescription>{item.description}</SlashDescription>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</DropdownItem>\n\t\t\t\t))}\n\t\t\t</DropdownContainer>\n\t\t);\n\t},\n);\nSlashCommandMenu.displayName = 'SlashCommandMenu';\n"],"names":["SlashCommandMenu","forwardRef","_ref","ref","items","query","command","renderItem","renderDropdown","selectedIndex","setSelectedIndex","useState","select","i","useImperativeHandle","onKeyDown","_ref2","event","key","length","useEffect","_jsx","_Fragment","children","activeIndex","onSelect","item","DropdownContainer","map","DropdownItem","Object","assign","$isActive","onMouseEnter","onClick","_jsxs","jsxs","SlashLabel","label","description","SlashDescription","id","displayName"],"mappings":"mKA8BO,MAAMA,EAAmBC,EAAUA,YACzC,CAAAC,EAAwDC,KAAO,IAA9DC,MAAEA,EAAKC,MAAEA,EAAKC,QAAEA,EAAOC,WAAEA,EAAUC,eAAEA,GAAgBN,EACrD,MAAOO,EAAeC,GAAoBC,EAAQA,SAAC,GAE7CC,EAAUC,IACXT,EAAMS,IAAIP,EAAQF,EAAMS,GAAG,EAuBhC,OApBAC,EAAmBA,oBAACX,GAAK,KAAO,CAC/BY,UAAWC,IAAwC,IAAvCC,MAAEA,GAAiCD,EAC9C,MAAkB,YAAdC,EAAMC,KACTR,GAAkBG,IAAOA,EAAIT,EAAMe,OAAS,GAAKf,EAAMe,UAChD,GAEU,cAAdF,EAAMC,KACTR,GAAkBG,IAAOA,EAAI,GAAKT,EAAMe,UACjC,GAEU,UAAdF,EAAMC,MACTN,EAAOH,IACA,EAEI,MAIdW,EAASA,WAAC,IAAMV,EAAiB,IAAI,CAACN,IAEjCA,EAAMe,OAGPX,EAEFa,EAAAA,IACEC,EAAAA,SAAA,CAAAC,SAAAf,EAAe,CACfJ,QACAC,QACAmB,YAAaf,EACbgB,SAAWC,GAASpB,EAAQoB,OAO/BL,EAAAA,IAACM,EAAAA,kBAAiB,CAAAJ,SAChBnB,EAAMwB,KAAI,CAACF,EAAMb,IACjBQ,MAACQ,EAAAA,aAAYC,OAAAC,OAAA,CAAAC,UAEDnB,IAAMJ,EACjBwB,aAAcA,IAAMvB,EAAiBG,GACrCqB,QAASA,IAAMtB,EAAOC,IAAE,CAAAU,SAEvBhB,EACAA,EAAWmB,EAAMb,IAAMJ,GAEvB0B,EAAAC,KAAAd,WAAA,CAAAC,SAAA,CACCF,MAACgB,aAAU,CAAAd,SAAEG,EAAKY,QACjBZ,EAAKa,aACLlB,EAAAA,IAACmB,EAAAA,2BAAkBd,EAAKa,mBAXtBb,EAAKe,QApBY,IAqCL,IAIvBzC,EAAiB0C,YAAc"}
1
+ {"version":3,"file":"SlashCommandMenu.js","sources":["../../../../../src/editor/extensions/slashCommand/SlashCommandMenu.tsx"],"sourcesContent":["import React, {\n\tforwardRef,\n\tuseCallback,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseRef,\n\tuseState,\n} from 'react';\nimport type {\n\tSlashCommandDropdownRenderProps,\n\tSlashCommandItem,\n} from '../../BikEditor.types';\nimport {\n\tDropdownContainer,\n\tDropdownItem,\n\tSlashDescription,\n\tSlashLabel,\n} from '../editorDropdown.styles';\n\ninterface Props {\n\titems: SlashCommandItem[];\n\tquery: string;\n\tcommand: (item: SlashCommandItem) => void;\n\t/** Custom per-row renderer. Receives the item and whether it is the active row. */\n\trenderItem?: (item: SlashCommandItem, isActive: boolean) => React.ReactNode;\n\t/**\n\t * Full custom dropdown renderer. Takes priority over renderItem.\n\t * The editor passes activeIndex and onSelect — you handle all the visual rendering.\n\t */\n\trenderDropdown?: (props: SlashCommandDropdownRenderProps) => React.ReactNode;\n}\n\nexport const SlashCommandMenu = forwardRef<any, Props>(\n\t({ items, query, command, renderItem, renderDropdown }, ref) => {\n\t\tconst [selectedIndex, setSelectedIndex] = useState(0);\n\t\tconst containerRef = useRef<HTMLDivElement>(null);\n\n\t\tconst scrollToIndex = useCallback((index: number) => {\n\t\t\tconst container = containerRef.current;\n\t\t\tif (!container) return;\n\t\t\tconst item = container.children[index] as HTMLElement | undefined;\n\t\t\titem?.scrollIntoView({ block: 'nearest' });\n\t\t}, []);\n\n\t\tconst select = (i: number) => {\n\t\t\tif (items[i]) command(items[i]);\n\t\t};\n\n\t\tuseImperativeHandle(ref, () => ({\n\t\t\tonKeyDown: ({ event }: { event: KeyboardEvent }) => {\n\t\t\t\tif (event.key === 'ArrowUp') {\n\t\t\t\t\tsetSelectedIndex((prev) => {\n\t\t\t\t\t\tconst next = (prev + items.length - 1) % items.length;\n\t\t\t\t\t\tscrollToIndex(next);\n\t\t\t\t\t\treturn next;\n\t\t\t\t\t});\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'ArrowDown') {\n\t\t\t\t\tsetSelectedIndex((prev) => {\n\t\t\t\t\t\tconst next = (prev + 1) % items.length;\n\t\t\t\t\t\tscrollToIndex(next);\n\t\t\t\t\t\treturn next;\n\t\t\t\t\t});\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'Enter') {\n\t\t\t\t\tselect(selectedIndex);\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\treturn false;\n\t\t\t},\n\t\t}));\n\n\t\tuseEffect(() => setSelectedIndex(0), [items]);\n\n\t\tif (!items.length) return null;\n\n\t\t// Full custom dropdown — editor still manages keyboard nav via selectedIndex\n\t\tif (renderDropdown) {\n\t\t\treturn (\n\t\t\t\t<>\n\t\t\t\t\t{renderDropdown({\n\t\t\t\t\t\titems,\n\t\t\t\t\t\tquery,\n\t\t\t\t\t\tactiveIndex: selectedIndex,\n\t\t\t\t\t\tonSelect: (item) => command(item),\n\t\t\t\t\t})}\n\t\t\t\t</>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<DropdownContainer ref={containerRef}>\n\t\t\t\t{items.map((item, i) => (\n\t\t\t\t\t<DropdownItem\n\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t$isActive={i === selectedIndex}\n\t\t\t\t\t\tonMouseEnter={() => setSelectedIndex(i)}\n\t\t\t\t\t\tonClick={() => select(i)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderItem ? (\n\t\t\t\t\t\t\trenderItem(item, i === selectedIndex)\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<SlashLabel>{item.label}</SlashLabel>\n\t\t\t\t\t\t\t\t{item.description && (\n\t\t\t\t\t\t\t\t\t<SlashDescription>{item.description}</SlashDescription>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</DropdownItem>\n\t\t\t\t))}\n\t\t\t</DropdownContainer>\n\t\t);\n\t},\n);\nSlashCommandMenu.displayName = 'SlashCommandMenu';\n"],"names":["SlashCommandMenu","forwardRef","_ref","ref","items","query","command","renderItem","renderDropdown","selectedIndex","setSelectedIndex","useState","containerRef","useRef","scrollToIndex","useCallback","index","container","current","item","children","scrollIntoView","block","select","i","useImperativeHandle","onKeyDown","_ref2","event","key","prev","next","length","useEffect","_jsx","_Fragment","activeIndex","onSelect","DropdownContainer","Object","assign","map","DropdownItem","$isActive","onMouseEnter","onClick","_jsxs","jsxs","jsx","SlashLabel","label","description","SlashDescription","id","displayName"],"mappings":"mKAgCO,MAAMA,EAAmBC,EAAUA,YACzC,CAAAC,EAAwDC,KAAO,IAA9DC,MAAEA,EAAKC,MAAEA,EAAKC,QAAEA,EAAOC,WAAEA,EAAUC,eAAEA,GAAgBN,EACrD,MAAOO,EAAeC,GAAoBC,EAAQA,SAAC,GAC7CC,EAAeC,SAAuB,MAEtCC,EAAgBC,EAAWA,aAAEC,IAClC,MAAMC,EAAYL,EAAaM,QAC/B,IAAKD,EAAW,OAChB,MAAME,EAAOF,EAAUG,SAASJ,GAChCG,SAAAA,EAAME,eAAe,CAAEC,MAAO,WAAY,GACxC,IAEGC,EAAUC,IACXpB,EAAMoB,IAAIlB,EAAQF,EAAMoB,GAAG,EA+BhC,OA5BAC,EAAmBA,oBAACtB,GAAK,KAAO,CAC/BuB,UAAWC,IAAwC,IAAvCC,MAAEA,GAAiCD,EAC9C,MAAkB,YAAdC,EAAMC,KACTnB,GAAkBoB,IACjB,MAAMC,GAAQD,EAAO1B,EAAM4B,OAAS,GAAK5B,EAAM4B,OAE/C,OADAlB,EAAciB,GACPA,CAAI,KAEL,GAEU,cAAdH,EAAMC,KACTnB,GAAkBoB,IACjB,MAAMC,GAAQD,EAAO,GAAK1B,EAAM4B,OAEhC,OADAlB,EAAciB,GACPA,CAAI,KAEL,GAEU,UAAdH,EAAMC,MACTN,EAAOd,IACA,EAEI,MAIdwB,EAASA,WAAC,IAAMvB,EAAiB,IAAI,CAACN,IAEjCA,EAAM4B,OAGPxB,EAEF0B,EAAAA,IACEC,EAAAA,SAAA,CAAAf,SAAAZ,EAAe,CACfJ,QACAC,QACA+B,YAAa3B,EACb4B,SAAWlB,GAASb,EAAQa,OAO/Be,MAACI,EAAAA,kBAAiBC,OAAAC,OAAA,CAACrC,IAAKS,aACtBR,EAAMqC,KAAI,CAACtB,EAAMK,IACjBU,MAACQ,EAAAA,aAAYH,OAAAC,OAAA,CAAAG,UAEDnB,IAAMf,EACjBmC,aAAcA,IAAMlC,EAAiBc,GACrCqB,QAASA,IAAMtB,EAAOC,IAAE,CAAAJ,SAEvBb,EACAA,EAAWY,EAAMK,IAAMf,GAEvBqC,EACCC,KAAAZ,WAAA,CAAAf,SAAA,CAAAc,EAAAc,IAACC,aAAY,CAAA7B,SAAAD,EAAK+B,QACjB/B,EAAKgC,aACLjB,EAAAA,IAACkB,EAAAA,iBAAkB,CAAAhC,SAAAD,EAAKgC,mBAXtBhC,EAAKkC,SApBY,IAqCL,IAIvBrD,EAAiBsD,YAAc"}
@@ -1,3 +1,4 @@
1
+ /// <reference types="react" />
1
2
  export declare const Menus: ({
2
3
  displayName: string;
3
4
  key: number;
@@ -3,6 +3,7 @@ export declare const DropdownItem: import("styled-components").StyledComponent<"
3
3
  $isActive?: boolean | undefined;
4
4
  }, never>;
5
5
  export declare const MentionAvatar: import("styled-components").StyledComponent<"img", any, {}, never>;
6
+ export declare const MentionAvatarFallback: import("styled-components").StyledComponent<"div", any, {}, never>;
6
7
  export declare const MentionLabel: import("styled-components").StyledComponent<"span", any, {}, never>;
7
8
  export declare const MentionPresenceDot: import("styled-components").StyledComponent<"span", any, {
8
9
  $online?: boolean | undefined;
@@ -44,8 +44,6 @@ import e from"styled-components";import{COLORS as o}from"../constants/Theme.js";
44
44
  color: ${o.content.brand};
45
45
  }
46
46
  .bik-variable {
47
- color: ${o.content.brand};
48
- padding: 1px 3px;
49
47
  }
50
48
 
51
49
  a,
@@ -1 +1 @@
1
- {"version":3,"file":"BikEditor.styles.js","sources":["../../../src/editor/BikEditor.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '../constants/Theme';\n\nexport const BikEditorShell = styled.div<{\n\tminHeight?: string;\n\tmaxHeight?: string;\n}>`\n\tposition: relative;\n\twidth: 100%;\n\n\t.ProseMirror {\n\t\tmin-height: ${({ minHeight }) => minHeight ?? '80px'};\n\t\tmax-height: ${({ maxHeight }) => maxHeight ?? 'none'};\n\t\toverflow-y: auto;\n\t\toutline: none;\n\t\tpadding: 8px 12px;\n\t\tfont-size: 14px;\n\t\tline-height: 1.5;\n\t\tword-break: break-word;\n\n\t\tp {\n\t\t\tmargin: 0;\n\t\t\tpadding: 0;\n\t\t}\n\n\t\tul,\n\t\tol {\n\t\t\tmargin: 0;\n\t\t\tpadding-left: 1.5em;\n\t\t}\n\n\t\tli + li {\n\t\t\tmargin-top: 2px;\n\t\t}\n\n\t\tp.is-editor-empty:first-child::before {\n\t\t\tcontent: attr(data-placeholder);\n\t\t\tfloat: left;\n\t\t\tcolor: #adb5bd;\n\t\t\tpointer-events: none;\n\t\t\theight: 0;\n\t\t}\n\t}\n\n\t.bik-mention {\n\t\tcolor: ${COLORS.content.brand};\n\t\tpadding: 1px 4px;\n\t}\n\t.bik-mention--team {\n\t\tcolor: ${COLORS.content.brand};\n\t}\n\t.bik-variable {\n\t\tcolor: ${COLORS.content.brand};\n\t\tpadding: 1px 3px;\n\t}\n\n\ta,\n\t.bik-link {\n\t\tcolor: #4f46e5;\n\t\ttext-decoration: underline;\n\t\ttext-decoration-color: #a5b4fc;\n\t\ttext-underline-offset: 2px;\n\t\tcursor: pointer;\n\t\t&:hover {\n\t\t\tcolor: #3730a3;\n\t\t\ttext-decoration-color: #6366f1;\n\t\t}\n\t}\n`;\n"],"names":["BikEditorShell","styled","div","_ref","minHeight","_ref2","maxHeight","COLORS","content","brand"],"mappings":"gFAGaA,MAAAA,EAAiBC,EAAOC,GAGnC;;;;;gBAKcC,IAAA,IAACC,UAAEA,GAAWD,EAAA,OAAKC,QAAAA,EAAa,MAAM;gBACtCC,IAAA,IAACC,UAAEA,GAAWD,EAAA,OAAKC,QAAAA,EAAa,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;WAiC3CC,EAAOC,QAAQC;;;;WAIfF,EAAOC,QAAQC;;;WAGfF,EAAOC,QAAQC;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"BikEditor.styles.js","sources":["../../../src/editor/BikEditor.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '../constants/Theme';\n\nexport const BikEditorShell = styled.div<{\n\tminHeight?: string;\n\tmaxHeight?: string;\n}>`\n\tposition: relative;\n\twidth: 100%;\n\n\t.ProseMirror {\n\t\tmin-height: ${({ minHeight }) => minHeight ?? '80px'};\n\t\tmax-height: ${({ maxHeight }) => maxHeight ?? 'none'};\n\t\toverflow-y: auto;\n\t\toutline: none;\n\t\tpadding: 8px 12px;\n\t\tfont-size: 14px;\n\t\tline-height: 1.5;\n\t\tword-break: break-word;\n\n\t\tp {\n\t\t\tmargin: 0;\n\t\t\tpadding: 0;\n\t\t}\n\n\t\tul,\n\t\tol {\n\t\t\tmargin: 0;\n\t\t\tpadding-left: 1.5em;\n\t\t}\n\n\t\tli + li {\n\t\t\tmargin-top: 2px;\n\t\t}\n\n\t\tp.is-editor-empty:first-child::before {\n\t\t\tcontent: attr(data-placeholder);\n\t\t\tfloat: left;\n\t\t\tcolor: #adb5bd;\n\t\t\tpointer-events: none;\n\t\t\theight: 0;\n\t\t}\n\t}\n\n\t.bik-mention {\n\t\tcolor: ${COLORS.content.brand};\n\t\tpadding: 1px 4px;\n\t}\n\t.bik-mention--team {\n\t\tcolor: ${COLORS.content.brand};\n\t}\n\t.bik-variable {\n\t}\n\n\ta,\n\t.bik-link {\n\t\tcolor: #4f46e5;\n\t\ttext-decoration: underline;\n\t\ttext-decoration-color: #a5b4fc;\n\t\ttext-underline-offset: 2px;\n\t\tcursor: pointer;\n\t\t&:hover {\n\t\t\tcolor: #3730a3;\n\t\t\ttext-decoration-color: #6366f1;\n\t\t}\n\t}\n`;\n"],"names":["BikEditorShell","styled","div","_ref","minHeight","_ref2","maxHeight","COLORS","content","brand"],"mappings":"gFAGaA,MAAAA,EAAiBC,EAAOC,GAGnC;;;;;gBAKcC,IAAA,IAACC,UAAEA,GAAWD,EAAA,OAAKC,QAAAA,EAAa,MAAM;gBACtCC,IAAA,IAACC,UAAEA,GAAWD,EAAA,OAAKC,QAAAA,EAAa,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;WAiC3CC,EAAOC,QAAQC;;;;WAIfF,EAAOC,QAAQC;;;;;;;;;;;;;;;;;"}
@@ -1,6 +1,6 @@
1
- import r from"styled-components";import{COLORS as o}from"../../constants/Theme.js";const t=r.div`
2
- background: ${o.surface.standard};
3
- border: 1px solid ${o.stroke.primary};
1
+ import r from"styled-components";import{COLORS as e}from"../../constants/Theme.js";const t=r.div`
2
+ background: ${e.surface.standard};
3
+ border: 1px solid ${e.stroke.primary};
4
4
  border-radius: 8px;
5
5
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
6
6
  padding: 4px;
@@ -8,8 +8,8 @@ import r from"styled-components";import{COLORS as o}from"../../constants/Theme.j
8
8
  max-height: 260px;
9
9
  overflow-y: auto;
10
10
  font-size: 14px;
11
- color: ${o.content.primary};
12
- `,e=r.div`
11
+ color: ${e.content.primary};
12
+ `,o=r.div`
13
13
  display: flex;
14
14
  align-items: center;
15
15
  gap: 8px;
@@ -17,30 +17,42 @@ import r from"styled-components";import{COLORS as o}from"../../constants/Theme.j
17
17
  min-height: 43px;
18
18
  border-radius: 6px;
19
19
  cursor: pointer;
20
- color: ${o.content.primary};
21
- background: ${r=>{let{$isActive:t}=r;return t?o.surface.hovered:"transparent"}};
20
+ color: ${e.content.primary};
21
+ background: ${r=>{let{$isActive:t}=r;return t?e.surface.hovered:"transparent"}};
22
22
  `,n=r.img`
23
23
  width: 24px;
24
24
  height: 24px;
25
25
  border-radius: 50%;
26
26
  object-fit: cover;
27
27
  flex-shrink: 0;
28
- `,i=r.span`
28
+ `,i=r.div`
29
+ width: 24px;
30
+ height: 24px;
31
+ border-radius: 50%;
32
+ background: ${e.surface.hovered};
33
+ display: flex;
34
+ align-items: center;
35
+ justify-content: center;
36
+ font-size: 12px;
37
+ font-weight: 600;
38
+ color: ${e.content.primary};
39
+ flex-shrink: 0;
40
+ `,a=r.span`
29
41
  font-weight: 500;
30
- color: ${o.content.primary};
42
+ color: ${e.content.primary};
31
43
  `,p=r.span`
32
44
  width: 8px;
33
45
  height: 8px;
34
46
  border-radius: 50%;
35
- background: ${r=>{let{$online:t}=r;return t?o.content.positive:o.content.placeholder}};
47
+ background: ${r=>{let{$online:t}=r;return t?e.content.positive:e.content.placeholder}};
36
48
  margin-left: auto;
37
49
  flex-shrink: 0;
38
- `,a=r.span`
39
- font-weight: 500;
40
- color: ${o.content.primary};
41
50
  `,s=r.span`
51
+ font-weight: 500;
52
+ color: ${e.content.primary};
53
+ `,d=r.span`
42
54
  font-size: 12px;
43
- color: ${o.content.secondary};
55
+ color: ${e.content.secondary};
44
56
  margin-left: auto;
45
- `;export{t as DropdownContainer,e as DropdownItem,n as MentionAvatar,i as MentionLabel,p as MentionPresenceDot,s as SlashDescription,a as SlashLabel};
57
+ `;export{t as DropdownContainer,o as DropdownItem,n as MentionAvatar,i as MentionAvatarFallback,a as MentionLabel,p as MentionPresenceDot,d as SlashDescription,s as SlashLabel};
46
58
  //# sourceMappingURL=editorDropdown.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"editorDropdown.styles.js","sources":["../../../../src/editor/extensions/editorDropdown.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const DropdownContainer = styled.div`\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 8px;\n\tbox-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n\tpadding: 4px;\n\tmin-width: 330px;\n\tmax-height: 260px;\n\toverflow-y: auto;\n\tfont-size: 14px;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const DropdownItem = styled.div<{ $isActive?: boolean }>`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 12px 16px;\n\tmin-height: 43px;\n\tborder-radius: 6px;\n\tcursor: pointer;\n\tcolor: ${COLORS.content.primary};\n\tbackground: ${({ $isActive }) =>\n\t\t$isActive ? COLORS.surface.hovered : 'transparent'};\n`;\n\nexport const MentionAvatar = styled.img`\n\twidth: 24px;\n\theight: 24px;\n\tborder-radius: 50%;\n\tobject-fit: cover;\n\tflex-shrink: 0;\n`;\n\nexport const MentionLabel = styled.span`\n\tfont-weight: 500;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const MentionPresenceDot = styled.span<{ $online?: boolean }>`\n\twidth: 8px;\n\theight: 8px;\n\tborder-radius: 50%;\n\tbackground: ${({ $online }) =>\n\t\t$online ? COLORS.content.positive : COLORS.content.placeholder};\n\tmargin-left: auto;\n\tflex-shrink: 0;\n`;\n\nexport const SlashLabel = styled.span`\n\tfont-weight: 500;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const SlashDescription = styled.span`\n\tfont-size: 12px;\n\tcolor: ${COLORS.content.secondary};\n\tmargin-left: auto;\n`;\n"],"names":["DropdownContainer","styled","div","COLORS","surface","standard","stroke","primary","content","DropdownItem","_ref","$isActive","hovered","MentionAvatar","img","MentionLabel","span","MentionPresenceDot","_ref2","$online","positive","placeholder","SlashLabel","SlashDescription","secondary"],"mappings":"mFAGaA,MAAAA,EAAoBC,EAAOC,GAAG;eAC5BC,EAAOC,QAAQC;qBACTF,EAAOG,OAAOC;;;;;;;;UAQzBJ,EAAOK,QAAQD;EAGZE,EAAeR,EAAOC,GAA4B;;;;;;;;UAQrDC,EAAOK,QAAQD;eACVG,IAAA,IAACC,UAAEA,GAAWD,EAAA,OAC3BC,EAAYR,EAAOC,QAAQQ,QAAU,aAAa;EAGvCC,EAAgBZ,EAAOa,GAAG;;;;;;EAQ1BC,EAAed,EAAOe,IAAI;;UAE7Bb,EAAOK,QAAQD;EAGZU,EAAqBhB,EAAOe,IAA2B;;;;eAIrDE,IAAA,IAACC,QAAEA,GAASD,EAAA,OACzBC,EAAUhB,EAAOK,QAAQY,SAAWjB,EAAOK,QAAQa,WAAW;;;EAKnDC,EAAarB,EAAOe,IAAI;;UAE3Bb,EAAOK,QAAQD;EAGZgB,EAAmBtB,EAAOe,IAAI;;UAEjCb,EAAOK,QAAQgB;;"}
1
+ {"version":3,"file":"editorDropdown.styles.js","sources":["../../../../src/editor/extensions/editorDropdown.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const DropdownContainer = styled.div`\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 8px;\n\tbox-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n\tpadding: 4px;\n\tmin-width: 330px;\n\tmax-height: 260px;\n\toverflow-y: auto;\n\tfont-size: 14px;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const DropdownItem = styled.div<{ $isActive?: boolean }>`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 12px 16px;\n\tmin-height: 43px;\n\tborder-radius: 6px;\n\tcursor: pointer;\n\tcolor: ${COLORS.content.primary};\n\tbackground: ${({ $isActive }) =>\n\t\t$isActive ? COLORS.surface.hovered : 'transparent'};\n`;\n\nexport const MentionAvatar = styled.img`\n\twidth: 24px;\n\theight: 24px;\n\tborder-radius: 50%;\n\tobject-fit: cover;\n\tflex-shrink: 0;\n`;\n\nexport const MentionAvatarFallback = styled.div`\n\twidth: 24px;\n\theight: 24px;\n\tborder-radius: 50%;\n\tbackground: ${COLORS.surface.hovered};\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tfont-size: 12px;\n\tfont-weight: 600;\n\tcolor: ${COLORS.content.primary};\n\tflex-shrink: 0;\n`;\n\nexport const MentionLabel = styled.span`\n\tfont-weight: 500;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const MentionPresenceDot = styled.span<{ $online?: boolean }>`\n\twidth: 8px;\n\theight: 8px;\n\tborder-radius: 50%;\n\tbackground: ${({ $online }) =>\n\t\t$online ? COLORS.content.positive : COLORS.content.placeholder};\n\tmargin-left: auto;\n\tflex-shrink: 0;\n`;\n\nexport const SlashLabel = styled.span`\n\tfont-weight: 500;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const SlashDescription = styled.span`\n\tfont-size: 12px;\n\tcolor: ${COLORS.content.secondary};\n\tmargin-left: auto;\n`;\n"],"names":["DropdownContainer","styled","div","COLORS","surface","standard","stroke","primary","content","DropdownItem","_ref","$isActive","hovered","MentionAvatar","img","MentionAvatarFallback","MentionLabel","span","MentionPresenceDot","_ref2","$online","positive","placeholder","SlashLabel","SlashDescription","secondary"],"mappings":"mFAGaA,MAAAA,EAAoBC,EAAOC,GAAG;eAC5BC,EAAOC,QAAQC;qBACTF,EAAOG,OAAOC;;;;;;;;UAQzBJ,EAAOK,QAAQD;EAGZE,EAAeR,EAAOC,GAA4B;;;;;;;;UAQrDC,EAAOK,QAAQD;eACVG,IAAA,IAACC,UAAEA,GAAWD,EAAA,OAC3BC,EAAYR,EAAOC,QAAQQ,QAAU,aAAa;EAGvCC,EAAgBZ,EAAOa,GAAG;;;;;;EAQ1BC,EAAwBd,EAAOC,GAAG;;;;eAIhCC,EAAOC,QAAQQ;;;;;;UAMpBT,EAAOK,QAAQD;;EAIZS,EAAef,EAAOgB,IAAI;;UAE7Bd,EAAOK,QAAQD;EAGZW,EAAqBjB,EAAOgB,IAA2B;;;;eAIrDE,IAAA,IAACC,QAAEA,GAASD,EAAA,OACzBC,EAAUjB,EAAOK,QAAQa,SAAWlB,EAAOK,QAAQc,WAAW;;;EAKnDC,EAAatB,EAAOgB,IAAI;;UAE3Bd,EAAOK,QAAQD;EAGZiB,EAAmBvB,EAAOgB,IAAI;;UAEjCd,EAAOK,QAAQiB;;"}
@@ -1,2 +1,2 @@
1
- import{jsx as e,Fragment as n,jsxs as r}from"react/jsx-runtime";import{forwardRef as t,useState as o,useImperativeHandle as i,useEffect as l}from"react";import{DropdownContainer as a,DropdownItem as c,MentionAvatar as d,MentionLabel as s,MentionPresenceDot as m}from"../editorDropdown.styles.js";const p=t(((t,p)=>{let{items:h,query:y,command:u,renderItem:w,renderDropdown:v}=t;const[g,D]=o(0),k=e=>{h[e]&&u(h[e])};return i(p,(()=>({onKeyDown:e=>{let{event:n}=e;return"ArrowUp"===n.key?(D((e=>(e+h.length-1)%h.length)),!0):"ArrowDown"===n.key?(D((e=>(e+1)%h.length)),!0):"Enter"===n.key&&(k(g),!0)}}))),l((()=>D(0)),[h]),h.length?v?e(n,{children:v({items:h,query:y,activeIndex:g,onSelect:e=>u(e)})}):e(a,{children:h.map(((t,o)=>e(c,Object.assign({$isActive:o===g,onMouseEnter:()=>D(o),onClick:()=>k(o)},{children:w?w(t,o===g):r(n,{children:[t.avatarUrl&&e(d,{src:t.avatarUrl,alt:""}),e(s,{children:t.label}),void 0!==t.isOnline&&e(m,{$online:t.isOnline})]})}),t.id)))}):null}));p.displayName="MentionDropdown";export{p as MentionDropdown};
1
+ import{jsx as e,Fragment as n,jsxs as r}from"react/jsx-runtime";import{forwardRef as t,useState as o,useRef as l,useCallback as i,useImperativeHandle as c,useEffect as s}from"react";import{DropdownContainer as a,DropdownItem as d,MentionAvatar as m,MentionAvatarFallback as u,MentionLabel as h,MentionPresenceDot as p}from"../editorDropdown.styles.js";const w=t(((t,w)=>{let{items:y,query:g,command:v,renderItem:b,renderDropdown:f}=t;const[k,D]=o(0),j=l(null),A=i((e=>{const n=j.current;if(!n)return;const r=n.children[e];null==r||r.scrollIntoView({block:"nearest"})}),[]),O=e=>{y[e]&&v(y[e])};return c(w,(()=>({onKeyDown:e=>{let{event:n}=e;return"ArrowUp"===n.key?(D((e=>{const n=(e+y.length-1)%y.length;return A(n),n})),!0):"ArrowDown"===n.key?(D((e=>{const n=(e+1)%y.length;return A(n),n})),!0):"Enter"===n.key&&(O(k),!0)}}))),s((()=>D(0)),[y]),y.length?f?e(n,{children:f({items:y,query:g,activeIndex:k,onSelect:e=>v(e)})}):e(a,Object.assign({ref:j},{children:y.map(((t,o)=>e(d,Object.assign({$isActive:o===k,onMouseEnter:()=>D(o),onClick:()=>O(o)},{children:b?b(t,o===k):r(n,{children:[t.avatarUrl?e(m,{src:t.avatarUrl,alt:""}):e(u,{children:t.label.charAt(0).toUpperCase()}),e(h,{children:t.label}),void 0!==t.isOnline&&e(p,{$online:t.isOnline})]})}),t.id)))})):null}));w.displayName="MentionDropdown";export{w as MentionDropdown};
2
2
  //# sourceMappingURL=MentionDropdown.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"MentionDropdown.js","sources":["../../../../../src/editor/extensions/mention/MentionDropdown.tsx"],"sourcesContent":["import React, {\n\tforwardRef,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseState,\n} from 'react';\nimport type {\n\tMentionDropdownRenderProps,\n\tMentionItem,\n} from '../../BikEditor.types';\nimport {\n\tDropdownContainer,\n\tDropdownItem,\n\tMentionAvatar,\n\tMentionLabel,\n\tMentionPresenceDot,\n} from '../editorDropdown.styles';\n\ninterface Props {\n\titems: MentionItem[];\n\tquery: string;\n\tcommand: (item: MentionItem) => void;\n\t/** Custom per-row renderer. Receives the item and whether it is the active row. */\n\trenderItem?: (item: MentionItem, isActive: boolean) => React.ReactNode;\n\t/**\n\t * Full custom dropdown renderer. Takes priority over renderItem.\n\t * The editor passes activeIndex and onSelect — you handle all the visual rendering.\n\t */\n\trenderDropdown?: (props: MentionDropdownRenderProps) => React.ReactNode;\n}\n\nexport const MentionDropdown = forwardRef<any, Props>(\n\t({ items, query, command, renderItem, renderDropdown }, ref) => {\n\t\tconst [selectedIndex, setSelectedIndex] = useState(0);\n\n\t\tconst select = (i: number) => {\n\t\t\tif (items[i]) command(items[i]);\n\t\t};\n\n\t\tuseImperativeHandle(ref, () => ({\n\t\t\tonKeyDown: ({ event }: { event: KeyboardEvent }) => {\n\t\t\t\tif (event.key === 'ArrowUp') {\n\t\t\t\t\tsetSelectedIndex((i) => (i + items.length - 1) % items.length);\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'ArrowDown') {\n\t\t\t\t\tsetSelectedIndex((i) => (i + 1) % items.length);\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'Enter') {\n\t\t\t\t\tselect(selectedIndex);\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\treturn false;\n\t\t\t},\n\t\t}));\n\n\t\tuseEffect(() => setSelectedIndex(0), [items]);\n\n\t\tif (!items.length) return null;\n\n\t\t// Full custom dropdown — editor still manages keyboard nav via selectedIndex\n\t\tif (renderDropdown) {\n\t\t\treturn (\n\t\t\t\t<>\n\t\t\t\t\t{renderDropdown({\n\t\t\t\t\t\titems,\n\t\t\t\t\t\tquery,\n\t\t\t\t\t\tactiveIndex: selectedIndex,\n\t\t\t\t\t\tonSelect: (item) => command(item),\n\t\t\t\t\t})}\n\t\t\t\t</>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<DropdownContainer>\n\t\t\t\t{items.map((item, i) => (\n\t\t\t\t\t<DropdownItem\n\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t$isActive={i === selectedIndex}\n\t\t\t\t\t\tonMouseEnter={() => setSelectedIndex(i)}\n\t\t\t\t\t\tonClick={() => select(i)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderItem ? (\n\t\t\t\t\t\t\trenderItem(item, i === selectedIndex)\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t{item.avatarUrl && (\n\t\t\t\t\t\t\t\t\t<MentionAvatar src={item.avatarUrl} alt=\"\" />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t<MentionLabel>{item.label}</MentionLabel>\n\t\t\t\t\t\t\t\t{item.isOnline !== undefined && (\n\t\t\t\t\t\t\t\t\t<MentionPresenceDot $online={item.isOnline} />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</DropdownItem>\n\t\t\t\t))}\n\t\t\t</DropdownContainer>\n\t\t);\n\t},\n);\nMentionDropdown.displayName = 'MentionDropdown';\n"],"names":["MentionDropdown","forwardRef","_ref","ref","items","query","command","renderItem","renderDropdown","selectedIndex","setSelectedIndex","useState","select","i","useImperativeHandle","onKeyDown","_ref2","event","key","length","useEffect","_jsx","_Fragment","children","activeIndex","onSelect","item","DropdownContainer","map","DropdownItem","Object","assign","$isActive","onMouseEnter","onClick","_jsxs","avatarUrl","MentionAvatar","src","alt","MentionLabel","label","undefined","isOnline","MentionPresenceDot","$online","id","displayName"],"mappings":"wSA+BO,MAAMA,EAAkBC,GAC9B,CAAAC,EAAwDC,KAAO,IAA9DC,MAAEA,EAAKC,MAAEA,EAAKC,QAAEA,EAAOC,WAAEA,EAAUC,eAAEA,GAAgBN,EACrD,MAAOO,EAAeC,GAAoBC,EAAS,GAE7CC,EAAUC,IACXT,EAAMS,IAAIP,EAAQF,EAAMS,GAAG,EAuBhC,OApBAC,EAAoBX,GAAK,KAAO,CAC/BY,UAAWC,IAAwC,IAAvCC,MAAEA,GAAiCD,EAC9C,MAAkB,YAAdC,EAAMC,KACTR,GAAkBG,IAAOA,EAAIT,EAAMe,OAAS,GAAKf,EAAMe,UAChD,GAEU,cAAdF,EAAMC,KACTR,GAAkBG,IAAOA,EAAI,GAAKT,EAAMe,UACjC,GAEU,UAAdF,EAAMC,MACTN,EAAOH,IACA,EAEI,MAIdW,GAAU,IAAMV,EAAiB,IAAI,CAACN,IAEjCA,EAAMe,OAGPX,EAEFa,EACEC,EAAA,CAAAC,SAAAf,EAAe,CACfJ,QACAC,QACAmB,YAAaf,EACbgB,SAAWC,GAASpB,EAAQoB,OAO/BL,EAACM,EACC,CAAAJ,SAAAnB,EAAMwB,KAAI,CAACF,EAAMb,IACjBQ,EAACQ,EAEWC,OAAAC,OAAA,CAAAC,UAAAnB,IAAMJ,EACjBwB,aAAcA,IAAMvB,EAAiBG,GACrCqB,QAASA,IAAMtB,EAAOC,IAAE,CAAAU,SAEvBhB,EACAA,EAAWmB,EAAMb,IAAMJ,GAEvB0B,EACEb,EAAA,CAAAC,SAAA,CAAAG,EAAKU,WACLf,EAACgB,EAAc,CAAAC,IAAKZ,EAAKU,UAAWG,IAAI,KAEzClB,EAACmB,EAAc,CAAAjB,SAAAG,EAAKe,aACDC,IAAlBhB,EAAKiB,UACLtB,EAACuB,EAA4B,CAAAC,QAAAnB,EAAKiB,gBAdhCjB,EAAKoB,QApBY,IAwCL,IAIvB9C,EAAgB+C,YAAc"}
1
+ {"version":3,"file":"MentionDropdown.js","sources":["../../../../../src/editor/extensions/mention/MentionDropdown.tsx"],"sourcesContent":["import React, {\n\tforwardRef,\n\tuseCallback,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseRef,\n\tuseState,\n} from 'react';\nimport type {\n\tMentionDropdownRenderProps,\n\tMentionItem,\n} from '../../BikEditor.types';\nimport {\n\tDropdownContainer,\n\tDropdownItem,\n\tMentionAvatar,\n\tMentionAvatarFallback,\n\tMentionLabel,\n\tMentionPresenceDot,\n} from '../editorDropdown.styles';\n\ninterface Props {\n\titems: MentionItem[];\n\tquery: string;\n\tcommand: (item: MentionItem) => void;\n\t/** Custom per-row renderer. Receives the item and whether it is the active row. */\n\trenderItem?: (item: MentionItem, isActive: boolean) => React.ReactNode;\n\t/**\n\t * Full custom dropdown renderer. Takes priority over renderItem.\n\t * The editor passes activeIndex and onSelect — you handle all the visual rendering.\n\t */\n\trenderDropdown?: (props: MentionDropdownRenderProps) => React.ReactNode;\n}\n\nexport const MentionDropdown = forwardRef<any, Props>(\n\t({ items, query, command, renderItem, renderDropdown }, ref) => {\n\t\tconst [selectedIndex, setSelectedIndex] = useState(0);\n\t\tconst containerRef = useRef<HTMLDivElement>(null);\n\n\t\tconst scrollToIndex = useCallback((index: number) => {\n\t\t\tconst container = containerRef.current;\n\t\t\tif (!container) return;\n\t\t\tconst item = container.children[index] as HTMLElement | undefined;\n\t\t\titem?.scrollIntoView({ block: 'nearest' });\n\t\t}, []);\n\n\t\tconst select = (i: number) => {\n\t\t\tif (items[i]) command(items[i]);\n\t\t};\n\n\t\tuseImperativeHandle(ref, () => ({\n\t\t\tonKeyDown: ({ event }: { event: KeyboardEvent }) => {\n\t\t\t\tif (event.key === 'ArrowUp') {\n\t\t\t\t\tsetSelectedIndex((prev) => {\n\t\t\t\t\t\tconst next = (prev + items.length - 1) % items.length;\n\t\t\t\t\t\tscrollToIndex(next);\n\t\t\t\t\t\treturn next;\n\t\t\t\t\t});\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'ArrowDown') {\n\t\t\t\t\tsetSelectedIndex((prev) => {\n\t\t\t\t\t\tconst next = (prev + 1) % items.length;\n\t\t\t\t\t\tscrollToIndex(next);\n\t\t\t\t\t\treturn next;\n\t\t\t\t\t});\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'Enter') {\n\t\t\t\t\tselect(selectedIndex);\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\treturn false;\n\t\t\t},\n\t\t}));\n\n\t\tuseEffect(() => setSelectedIndex(0), [items]);\n\n\t\tif (!items.length) return null;\n\n\t\t// Full custom dropdown — editor still manages keyboard nav via selectedIndex\n\t\tif (renderDropdown) {\n\t\t\treturn (\n\t\t\t\t<>\n\t\t\t\t\t{renderDropdown({\n\t\t\t\t\t\titems,\n\t\t\t\t\t\tquery,\n\t\t\t\t\t\tactiveIndex: selectedIndex,\n\t\t\t\t\t\tonSelect: (item) => command(item),\n\t\t\t\t\t})}\n\t\t\t\t</>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<DropdownContainer ref={containerRef}>\n\t\t\t\t{items.map((item, i) => (\n\t\t\t\t\t<DropdownItem\n\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t$isActive={i === selectedIndex}\n\t\t\t\t\t\tonMouseEnter={() => setSelectedIndex(i)}\n\t\t\t\t\t\tonClick={() => select(i)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderItem ? (\n\t\t\t\t\t\t\trenderItem(item, i === selectedIndex)\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t{item.avatarUrl ? (\n\t\t\t\t\t\t\t\t\t<MentionAvatar src={item.avatarUrl} alt=\"\" />\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<MentionAvatarFallback>\n\t\t\t\t\t\t\t\t\t\t{item.label.charAt(0).toUpperCase()}\n\t\t\t\t\t\t\t\t\t</MentionAvatarFallback>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t<MentionLabel>{item.label}</MentionLabel>\n\t\t\t\t\t\t\t\t{item.isOnline !== undefined && (\n\t\t\t\t\t\t\t\t\t<MentionPresenceDot $online={item.isOnline} />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</DropdownItem>\n\t\t\t\t))}\n\t\t\t</DropdownContainer>\n\t\t);\n\t},\n);\nMentionDropdown.displayName = 'MentionDropdown';\n"],"names":["MentionDropdown","forwardRef","_ref","ref","items","query","command","renderItem","renderDropdown","selectedIndex","setSelectedIndex","useState","containerRef","useRef","scrollToIndex","useCallback","index","container","current","item","children","scrollIntoView","block","select","i","useImperativeHandle","onKeyDown","_ref2","event","key","prev","next","length","useEffect","_jsx","_Fragment","activeIndex","onSelect","DropdownContainer","Object","assign","map","DropdownItem","onMouseEnter","onClick","_jsxs","avatarUrl","MentionAvatar","src","alt","MentionAvatarFallback","label","charAt","toUpperCase","MentionLabel","undefined","isOnline","MentionPresenceDot","$online","id","displayName"],"mappings":"gWAkCO,MAAMA,EAAkBC,GAC9B,CAAAC,EAAwDC,KAAO,IAA9DC,MAAEA,EAAKC,MAAEA,EAAKC,QAAEA,EAAOC,WAAEA,EAAUC,eAAEA,GAAgBN,EACrD,MAAOO,EAAeC,GAAoBC,EAAS,GAC7CC,EAAeC,EAAuB,MAEtCC,EAAgBC,GAAaC,IAClC,MAAMC,EAAYL,EAAaM,QAC/B,IAAKD,EAAW,OAChB,MAAME,EAAOF,EAAUG,SAASJ,GAChCG,SAAAA,EAAME,eAAe,CAAEC,MAAO,WAAY,GACxC,IAEGC,EAAUC,IACXpB,EAAMoB,IAAIlB,EAAQF,EAAMoB,GAAG,EA+BhC,OA5BAC,EAAoBtB,GAAK,KAAO,CAC/BuB,UAAWC,IAAwC,IAAvCC,MAAEA,GAAiCD,EAC9C,MAAkB,YAAdC,EAAMC,KACTnB,GAAkBoB,IACjB,MAAMC,GAAQD,EAAO1B,EAAM4B,OAAS,GAAK5B,EAAM4B,OAE/C,OADAlB,EAAciB,GACPA,CAAI,KAEL,GAEU,cAAdH,EAAMC,KACTnB,GAAkBoB,IACjB,MAAMC,GAAQD,EAAO,GAAK1B,EAAM4B,OAEhC,OADAlB,EAAciB,GACPA,CAAI,KAEL,GAEU,UAAdH,EAAMC,MACTN,EAAOd,IACA,EAEI,MAIdwB,GAAU,IAAMvB,EAAiB,IAAI,CAACN,IAEjCA,EAAM4B,OAGPxB,EAEF0B,EACEC,EAAA,CAAAf,SAAAZ,EAAe,CACfJ,QACAC,QACA+B,YAAa3B,EACb4B,SAAWlB,GAASb,EAAQa,OAO/Be,EAACI,EAAiBC,OAAAC,OAAA,CAACrC,IAAKS,GACtB,CAAAQ,SAAAhB,EAAMqC,KAAI,CAACtB,EAAMK,IACjBU,EAACQ,2BAEWlB,IAAMf,EACjBkC,aAAcA,IAAMjC,EAAiBc,GACrCoB,QAASA,IAAMrB,EAAOC,IAAE,CAAAJ,SAEvBb,EACAA,EAAWY,EAAMK,IAAMf,GAEvBoC,EAAAV,EAAA,CAAAf,SAAA,CACED,EAAK2B,UACLZ,EAACa,EAAc,CAAAC,IAAK7B,EAAK2B,UAAWG,IAAI,KAExCf,EAACgB,EACC,CAAA9B,SAAAD,EAAKgC,MAAMC,OAAO,GAAGC,gBAGxBnB,EAACoB,EAAY,CAAAlC,SAAED,EAAKgC,aACDI,IAAlBpC,EAAKqC,UACLtB,EAACuB,EAA4B,CAAAC,QAAAvC,EAAKqC,gBAlBhCrC,EAAKwC,SApBY,IA4CL,IAIvB3D,EAAgB4D,YAAc"}
@@ -1,2 +1,2 @@
1
- import{mergeAttributes as e}from"../../../node_modules/@tiptap/core/dist/index.js";import t from"@tiptap/extension-mention";import{ReactRenderer as n}from"@tiptap/react";import r from"tippy.js";import{MentionDropdown as o}from"./MentionDropdown.js";function i(e){let t=arguments.length>2?arguments[2]:void 0,i=arguments.length>3?arguments[3]:void 0;return()=>{let e,s;return{onStart:a=>{e=new n(o,{props:Object.assign(Object.assign({},a),{renderItem:t,renderDropdown:i}),editor:a.editor}),s=r(document.body,{getReferenceClientRect:a.clientRect,appendTo:()=>document.body,content:e.element,showOnCreate:!0,interactive:!0,trigger:"manual",placement:"bottom-start",zIndex:9999,arrow:!1,onMount:e=>{const t=e.popper.querySelector(".tippy-box");t&&(t.style.cssText="background:none;box-shadow:none;border:none;padding:0;border-radius:0;")}})},onUpdate:n=>{var r,o,a;e.updateProps(Object.assign(Object.assign({},n),{renderItem:t,renderDropdown:i})),(null===(r=n.items)||void 0===r?void 0:r.length)?null===(a=s[0])||void 0===a||a.setProps({getReferenceClientRect:n.clientRect}):null===(o=s[0])||void 0===o||o.hide()},onKeyDown:t=>{var n,r,o;return"Escape"===t.event.key?(null===(n=s[0])||void 0===n||n.hide(),!0):null!==(o=null===(r=e.ref)||void 0===r?void 0:r.onKeyDown(t))&&void 0!==o&&o},onExit:()=>{var t;null===(t=s[0])||void 0===t||t.destroy(),e.destroy()}}}}function s(n,r,o,s){return t.extend({name:"mentionAgent"}).configure({HTMLAttributes:{class:"bik-mention bik-mention--agent"},renderText:e=>{let{options:t,node:n}=e;return`${t.suggestion.char}${n.attrs.label}`},renderHTML:t=>{let{options:n,node:r}=t;return["span",e(n.HTMLAttributes),`${n.suggestion.char}${r.attrs.label}`]},suggestion:{char:"@",items:e=>{let{query:t}=e;return n.filter((e=>e.label.toLowerCase().includes(t.toLowerCase()))).slice(0,10)},command:e=>{let{editor:t,range:n,props:o}=e;t.chain().focus().deleteRange(n).insertContent({type:"mentionAgent",attrs:{id:o.id,label:o.label}}).run(),null==r||r(o,"@")},render:i(r,"@",o,s)}})}function a(n,r,o,s){return t.extend({name:"mentionTeam"}).configure({HTMLAttributes:{class:"bik-mention bik-mention--team"},renderText:e=>{let{options:t,node:n}=e;return`${t.suggestion.char}${n.attrs.label}`},renderHTML:t=>{let{options:n,node:r}=t;return["span",e(n.HTMLAttributes),`${n.suggestion.char}${r.attrs.label}`]},suggestion:{char:"#",items:e=>{let{query:t}=e;return n.filter((e=>e.label.toLowerCase().includes(t.toLowerCase()))).slice(0,10)},command:e=>{let{editor:t,range:n,props:o}=e;t.chain().focus().deleteRange(n).insertContent({type:"mentionTeam",attrs:{id:o.id,label:o.label}}).run(),null==r||r(o,"#")},render:i(r,"#",o,s)}})}export{s as buildAgentMentionExtension,a as buildTeamMentionExtension};
1
+ import{mergeAttributes as e}from"../../../node_modules/@tiptap/core/dist/index.js";import t from"@tiptap/extension-mention";import{ReactRenderer as n}from"@tiptap/react";import r from"tippy.js";import{MentionDropdown as o}from"./MentionDropdown.js";function i(e){let t=arguments.length>2?arguments[2]:void 0,i=arguments.length>3?arguments[3]:void 0;return()=>{let e,s;return{onStart:a=>{e=new n(o,{props:Object.assign(Object.assign({},a),{renderItem:t,renderDropdown:i}),editor:a.editor}),s=r(document.body,{getReferenceClientRect:a.clientRect,appendTo:()=>document.body,content:e.element,showOnCreate:!0,interactive:!0,trigger:"manual",placement:"bottom-start",zIndex:9999,arrow:!1,onMount:e=>{const t=e.popper.querySelector(".tippy-box");t&&(t.style.cssText="background:none;box-shadow:none;border:none;padding:0;border-radius:0;")}})},onUpdate:n=>{var r,o,a;e.updateProps(Object.assign(Object.assign({},n),{renderItem:t,renderDropdown:i})),(null===(r=n.items)||void 0===r?void 0:r.length)?null===(a=s[0])||void 0===a||a.setProps({getReferenceClientRect:n.clientRect}):null===(o=s[0])||void 0===o||o.hide()},onKeyDown:t=>{var n,r,o;return"Escape"===t.event.key?(null===(n=s[0])||void 0===n||n.hide(),!0):null!==(o=null===(r=e.ref)||void 0===r?void 0:r.onKeyDown(t))&&void 0!==o&&o},onExit:()=>{var t;null===(t=s[0])||void 0===t||t.destroy(),e.destroy()}}}}function s(n,r,o,s){return t.extend({name:"mentionAgent"}).configure({HTMLAttributes:{class:"bik-mention bik-mention--agent"},renderText:e=>{let{options:t,node:n}=e;return`${t.suggestion.char}${n.attrs.label}`},renderHTML:t=>{let{options:n,node:r}=t;return["span",e(n.HTMLAttributes),`${n.suggestion.char}${r.attrs.label}`]},suggestion:{char:"@",items:e=>{let{query:t}=e;return n.filter((e=>e.label.toLowerCase().includes(t.toLowerCase())))},command:e=>{let{editor:t,range:n,props:o}=e;t.chain().focus().deleteRange(n).insertContent({type:"mentionAgent",attrs:{id:o.id,label:o.label}}).run(),null==r||r(o,"@")},render:i(r,"@",o,s)}})}function a(n,r,o,s){return t.extend({name:"mentionTeam"}).configure({HTMLAttributes:{class:"bik-mention bik-mention--team"},renderText:e=>{let{options:t,node:n}=e;return`${t.suggestion.char}${n.attrs.label}`},renderHTML:t=>{let{options:n,node:r}=t;return["span",e(n.HTMLAttributes),`${n.suggestion.char}${r.attrs.label}`]},suggestion:{char:"#",items:e=>{let{query:t}=e;return n.filter((e=>e.label.toLowerCase().includes(t.toLowerCase())))},command:e=>{let{editor:t,range:n,props:o}=e;t.chain().focus().deleteRange(n).insertContent({type:"mentionTeam",attrs:{id:o.id,label:o.label}}).run(),null==r||r(o,"#")},render:i(r,"#",o,s)}})}export{s as buildAgentMentionExtension,a as buildTeamMentionExtension};
2
2
  //# sourceMappingURL=MentionExtension.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"MentionExtension.js","sources":["../../../../../src/editor/extensions/mention/MentionExtension.ts"],"sourcesContent":["import { mergeAttributes } from '@tiptap/core';\nimport Mention from '@tiptap/extension-mention';\nimport { ReactRenderer } from '@tiptap/react';\nimport type { ReactNode } from 'react';\nimport tippy from 'tippy.js';\nimport type {\n\tMentionDropdownRenderProps,\n\tMentionItem,\n} from '../../BikEditor.types';\nimport { MentionDropdown } from './MentionDropdown';\n\nfunction buildRender(\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\tchar: '@' | '#' = '@',\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n) {\n\treturn () => {\n\t\tlet component: ReactRenderer;\n\t\tlet popup: any;\n\n\t\treturn {\n\t\t\tonStart: (props: any) => {\n\t\t\t\tcomponent = new ReactRenderer(MentionDropdown, {\n\t\t\t\t\tprops: { ...props, renderItem, renderDropdown },\n\t\t\t\t\teditor: props.editor,\n\t\t\t\t});\n\t\t\t\tpopup = tippy(document.body, {\n\t\t\t\t\tgetReferenceClientRect: props.clientRect,\n\t\t\t\t\tappendTo: () => document.body,\n\t\t\t\t\tcontent: component.element,\n\t\t\t\t\tshowOnCreate: true,\n\t\t\t\t\tinteractive: true,\n\t\t\t\t\ttrigger: 'manual',\n\t\t\t\t\tplacement: 'bottom-start',\n\t\t\t\t\tzIndex: 9999,\n\t\t\t\t\tarrow: false,\n\t\t\t\t\t// tippy's default dark theme adds a visible box even when content\n\t\t\t\t\t// is empty. Strip it so our dropdown handles all visual styling.\n\t\t\t\t\tonMount: (instance) => {\n\t\t\t\t\t\tconst box =\n\t\t\t\t\t\t\tinstance.popper.querySelector<HTMLElement>('.tippy-box');\n\t\t\t\t\t\tif (box)\n\t\t\t\t\t\t\tbox.style.cssText =\n\t\t\t\t\t\t\t\t'background:none;box-shadow:none;border:none;padding:0;border-radius:0;';\n\t\t\t\t\t},\n\t\t\t\t});\n\t\t\t},\n\t\t\tonUpdate: (props: any) => {\n\t\t\t\tcomponent.updateProps({ ...props, renderItem, renderDropdown });\n\t\t\t\tif (!props.items?.length) {\n\t\t\t\t\tpopup[0]?.hide();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tpopup[0]?.setProps({ getReferenceClientRect: props.clientRect });\n\t\t\t},\n\t\t\tonKeyDown: (props: any) => {\n\t\t\t\tif (props.event.key === 'Escape') {\n\t\t\t\t\tpopup[0]?.hide();\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\treturn (component.ref as any)?.onKeyDown(props) ?? false;\n\t\t\t},\n\t\t\tonExit: () => {\n\t\t\t\tpopup[0]?.destroy();\n\t\t\t\tcomponent.destroy();\n\t\t\t},\n\t\t};\n\t};\n}\n\nexport function buildAgentMentionExtension(\n\tagents: MentionItem[],\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n) {\n\treturn Mention.extend({ name: 'mentionAgent' }).configure({\n\t\tHTMLAttributes: { class: 'bik-mention bik-mention--agent' },\n\t\trenderText: ({ options, node }) =>\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\trenderHTML: ({ options, node }) => [\n\t\t\t'span',\n\t\t\tmergeAttributes(options.HTMLAttributes),\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\t],\n\t\tsuggestion: {\n\t\t\tchar: '@',\n\t\t\titems: ({ query }: { query: string }) =>\n\t\t\t\tagents\n\t\t\t\t\t.filter((a) => a.label.toLowerCase().includes(query.toLowerCase()))\n\t\t\t\t\t.slice(0, 10),\n\t\t\tcommand: ({ editor, range, props }: any) => {\n\t\t\t\teditor\n\t\t\t\t\t.chain()\n\t\t\t\t\t.focus()\n\t\t\t\t\t.deleteRange(range)\n\t\t\t\t\t.insertContent({\n\t\t\t\t\t\ttype: 'mentionAgent',\n\t\t\t\t\t\tattrs: { id: props.id, label: props.label },\n\t\t\t\t\t})\n\t\t\t\t\t.run();\n\t\t\t\tonSelect?.(props, '@');\n\t\t\t},\n\t\t\trender: buildRender(onSelect, '@', renderItem, renderDropdown),\n\t\t},\n\t});\n}\n\nexport function buildTeamMentionExtension(\n\tteams: MentionItem[],\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n) {\n\treturn Mention.extend({ name: 'mentionTeam' }).configure({\n\t\tHTMLAttributes: { class: 'bik-mention bik-mention--team' },\n\t\trenderText: ({ options, node }) =>\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\trenderHTML: ({ options, node }) => [\n\t\t\t'span',\n\t\t\tmergeAttributes(options.HTMLAttributes),\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\t],\n\t\tsuggestion: {\n\t\t\tchar: '#',\n\t\t\titems: ({ query }: { query: string }) =>\n\t\t\t\tteams\n\t\t\t\t\t.filter((t) => t.label.toLowerCase().includes(query.toLowerCase()))\n\t\t\t\t\t.slice(0, 10),\n\t\t\tcommand: ({ editor, range, props }: any) => {\n\t\t\t\teditor\n\t\t\t\t\t.chain()\n\t\t\t\t\t.focus()\n\t\t\t\t\t.deleteRange(range)\n\t\t\t\t\t.insertContent({\n\t\t\t\t\t\ttype: 'mentionTeam',\n\t\t\t\t\t\tattrs: { id: props.id, label: props.label },\n\t\t\t\t\t})\n\t\t\t\t\t.run();\n\t\t\t\tonSelect?.(props, '#');\n\t\t\t},\n\t\t\trender: buildRender(onSelect, '#', renderItem, renderDropdown),\n\t\t},\n\t});\n}\n"],"names":["buildRender","onSelect","renderItem","arguments","length","undefined","renderDropdown","component","popup","onStart","props","ReactRenderer","MentionDropdown","editor","tippy","document","body","getReferenceClientRect","clientRect","appendTo","content","element","showOnCreate","interactive","trigger","placement","zIndex","arrow","onMount","instance","box","popper","querySelector","style","cssText","onUpdate","updateProps","Object","assign","_a","items","_c","setProps","_b","hide","onKeyDown","event","key","ref","onExit","destroy","buildAgentMentionExtension","agents","Mention","extend","name","configure","HTMLAttributes","class","renderText","_ref","options","node","suggestion","char","attrs","renderHTML","_ref2","mergeAttributes","_ref3","query","filter","a","label","toLowerCase","includes","slice","command","_ref4","range","chain","focus","deleteRange","insertContent","type","id","run","render","buildTeamMentionExtension","teams","_ref5","_ref6","_ref7","t","_ref8"],"mappings":"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"}
1
+ {"version":3,"file":"MentionExtension.js","sources":["../../../../../src/editor/extensions/mention/MentionExtension.ts"],"sourcesContent":["import { mergeAttributes } from '@tiptap/core';\nimport Mention from '@tiptap/extension-mention';\nimport { ReactRenderer } from '@tiptap/react';\nimport type { ReactNode } from 'react';\nimport tippy from 'tippy.js';\nimport type {\n\tMentionDropdownRenderProps,\n\tMentionItem,\n} from '../../BikEditor.types';\nimport { MentionDropdown } from './MentionDropdown';\n\nfunction buildRender(\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\tchar: '@' | '#' = '@',\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n) {\n\treturn () => {\n\t\tlet component: ReactRenderer;\n\t\tlet popup: any;\n\n\t\treturn {\n\t\t\tonStart: (props: any) => {\n\t\t\t\tcomponent = new ReactRenderer(MentionDropdown, {\n\t\t\t\t\tprops: { ...props, renderItem, renderDropdown },\n\t\t\t\t\teditor: props.editor,\n\t\t\t\t});\n\t\t\t\tpopup = tippy(document.body, {\n\t\t\t\t\tgetReferenceClientRect: props.clientRect,\n\t\t\t\t\tappendTo: () => document.body,\n\t\t\t\t\tcontent: component.element,\n\t\t\t\t\tshowOnCreate: true,\n\t\t\t\t\tinteractive: true,\n\t\t\t\t\ttrigger: 'manual',\n\t\t\t\t\tplacement: 'bottom-start',\n\t\t\t\t\tzIndex: 9999,\n\t\t\t\t\tarrow: false,\n\t\t\t\t\t// tippy's default dark theme adds a visible box even when content\n\t\t\t\t\t// is empty. Strip it so our dropdown handles all visual styling.\n\t\t\t\t\tonMount: (instance) => {\n\t\t\t\t\t\tconst box =\n\t\t\t\t\t\t\tinstance.popper.querySelector<HTMLElement>('.tippy-box');\n\t\t\t\t\t\tif (box)\n\t\t\t\t\t\t\tbox.style.cssText =\n\t\t\t\t\t\t\t\t'background:none;box-shadow:none;border:none;padding:0;border-radius:0;';\n\t\t\t\t\t},\n\t\t\t\t});\n\t\t\t},\n\t\t\tonUpdate: (props: any) => {\n\t\t\t\tcomponent.updateProps({ ...props, renderItem, renderDropdown });\n\t\t\t\tif (!props.items?.length) {\n\t\t\t\t\tpopup[0]?.hide();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tpopup[0]?.setProps({ getReferenceClientRect: props.clientRect });\n\t\t\t},\n\t\t\tonKeyDown: (props: any) => {\n\t\t\t\tif (props.event.key === 'Escape') {\n\t\t\t\t\tpopup[0]?.hide();\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\treturn (component.ref as any)?.onKeyDown(props) ?? false;\n\t\t\t},\n\t\t\tonExit: () => {\n\t\t\t\tpopup[0]?.destroy();\n\t\t\t\tcomponent.destroy();\n\t\t\t},\n\t\t};\n\t};\n}\n\nexport function buildAgentMentionExtension(\n\tagents: MentionItem[],\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n) {\n\treturn Mention.extend({ name: 'mentionAgent' }).configure({\n\t\tHTMLAttributes: { class: 'bik-mention bik-mention--agent' },\n\t\trenderText: ({ options, node }) =>\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\trenderHTML: ({ options, node }) => [\n\t\t\t'span',\n\t\t\tmergeAttributes(options.HTMLAttributes),\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\t],\n\t\tsuggestion: {\n\t\t\tchar: '@',\n\t\t\titems: ({ query }: { query: string }) =>\n\t\t\t\tagents.filter((a) =>\n\t\t\t\t\ta.label.toLowerCase().includes(query.toLowerCase()),\n\t\t\t\t),\n\t\t\tcommand: ({ editor, range, props }: any) => {\n\t\t\t\teditor\n\t\t\t\t\t.chain()\n\t\t\t\t\t.focus()\n\t\t\t\t\t.deleteRange(range)\n\t\t\t\t\t.insertContent({\n\t\t\t\t\t\ttype: 'mentionAgent',\n\t\t\t\t\t\tattrs: { id: props.id, label: props.label },\n\t\t\t\t\t})\n\t\t\t\t\t.run();\n\t\t\t\tonSelect?.(props, '@');\n\t\t\t},\n\t\t\trender: buildRender(onSelect, '@', renderItem, renderDropdown),\n\t\t},\n\t});\n}\n\nexport function buildTeamMentionExtension(\n\tteams: MentionItem[],\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n) {\n\treturn Mention.extend({ name: 'mentionTeam' }).configure({\n\t\tHTMLAttributes: { class: 'bik-mention bik-mention--team' },\n\t\trenderText: ({ options, node }) =>\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\trenderHTML: ({ options, node }) => [\n\t\t\t'span',\n\t\t\tmergeAttributes(options.HTMLAttributes),\n\t\t\t`${options.suggestion.char}${node.attrs['label']}`,\n\t\t],\n\t\tsuggestion: {\n\t\t\tchar: '#',\n\t\t\titems: ({ query }: { query: string }) =>\n\t\t\t\tteams.filter((t) =>\n\t\t\t\t\tt.label.toLowerCase().includes(query.toLowerCase()),\n\t\t\t\t),\n\t\t\tcommand: ({ editor, range, props }: any) => {\n\t\t\t\teditor\n\t\t\t\t\t.chain()\n\t\t\t\t\t.focus()\n\t\t\t\t\t.deleteRange(range)\n\t\t\t\t\t.insertContent({\n\t\t\t\t\t\ttype: 'mentionTeam',\n\t\t\t\t\t\tattrs: { id: props.id, label: props.label },\n\t\t\t\t\t})\n\t\t\t\t\t.run();\n\t\t\t\tonSelect?.(props, '#');\n\t\t\t},\n\t\t\trender: buildRender(onSelect, '#', renderItem, renderDropdown),\n\t\t},\n\t});\n}\n"],"names":["buildRender","onSelect","renderItem","arguments","length","undefined","renderDropdown","component","popup","onStart","props","ReactRenderer","MentionDropdown","editor","tippy","document","body","getReferenceClientRect","clientRect","appendTo","content","element","showOnCreate","interactive","trigger","placement","zIndex","arrow","onMount","instance","box","popper","querySelector","style","cssText","onUpdate","updateProps","Object","assign","_a","items","_c","setProps","_b","hide","onKeyDown","event","key","ref","onExit","destroy","buildAgentMentionExtension","agents","Mention","extend","name","configure","HTMLAttributes","class","renderText","_ref","options","node","suggestion","char","attrs","renderHTML","_ref2","mergeAttributes","_ref3","query","filter","a","label","toLowerCase","includes","command","_ref4","range","chain","focus","deleteRange","insertContent","type","id","run","render","buildTeamMentionExtension","teams","_ref5","_ref6","_ref7","t","_ref8"],"mappings":"yPAWA,SAASA,EACRC,GACqB,IACrBC,EAAgEC,UAAAC,OAAAD,EAAAA,kBAAAE,EAChEC,EAAiEH,UAAAC,OAAAD,EAAAA,kBAAAE,EAEjE,MAAO,KACN,IAAIE,EACAC,EAEJ,MAAO,CACNC,QAAUC,IACTH,EAAY,IAAII,EAAcC,EAAiB,CAC9CF,qCAAYA,GAAK,CAAER,aAAYI,mBAC/BO,OAAQH,EAAMG,SAEfL,EAAQM,EAAMC,SAASC,KAAM,CAC5BC,uBAAwBP,EAAMQ,WAC9BC,SAAUA,IAAMJ,SAASC,KACzBI,QAASb,EAAUc,QACnBC,cAAc,EACdC,aAAa,EACbC,QAAS,SACTC,UAAW,eACXC,OAAQ,KACRC,OAAO,EAGPC,QAAUC,IACT,MAAMC,EACLD,EAASE,OAAOC,cAA2B,cACxCF,IACHA,EAAIG,MAAMC,QACT,yEAAwE,GAE1E,EAEHC,SAAWzB,cACVH,EAAU6B,YAAiBC,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAA5B,IAAOR,aAAYI,qBAC9B,QAAXiC,EAAA7B,EAAM8B,aAAK,IAAAD,OAAA,EAAAA,EAAEnC,gBAIlBqC,EAAAjC,EAAM,mBAAIkC,SAAS,CAAEzB,uBAAwBP,EAAMQ,aAHxC,QAAVyB,EAAAnC,EAAM,UAAI,IAAAmC,GAAAA,EAAAC,MAGqD,EAEjEC,UAAYnC,cACX,MAAwB,WAApBA,EAAMoC,MAAMC,KACL,QAAVR,EAAA/B,EAAM,UAAI,IAAA+B,GAAAA,EAAAK,QACH,GAE2C,QAA5CH,EAAsB,QAAtBE,EAACpC,EAAUyC,WAAW,IAAAL,OAAA,EAAAA,EAAEE,UAAUnC,UAAU,IAAA+B,GAAAA,CAAK,EAEzDQ,OAAQA,WACG,QAAVV,EAAA/B,EAAM,UAAI,IAAA+B,GAAAA,EAAAW,UACV3C,EAAU2C,SAAS,EAEpB,CAEH,CAEM,SAAUC,EACfC,EACAnD,EACAC,EACAI,GAEA,OAAO+C,EAAQC,OAAO,CAAEC,KAAM,iBAAkBC,UAAU,CACzDC,eAAgB,CAAEC,MAAO,kCACzBC,WAAYC,IAAA,IAACC,QAAEA,EAAOC,KAAEA,GAAMF,EAAA,MAC7B,GAAGC,EAAQE,WAAWC,OAAOF,EAAKG,MAAa,OAAG,EACnDC,WAAYC,IAAA,IAACN,QAAEA,EAAOC,KAAEA,GAAMK,EAAA,MAAK,CAClC,OACAC,EAAgBP,EAAQJ,gBACxB,GAAGI,EAAQE,WAAWC,OAAOF,EAAKG,MAAa,QAC/C,EACDF,WAAY,CACXC,KAAM,IACNxB,MAAO6B,IAAA,IAACC,MAAEA,GAA0BD,EAAA,OACnCjB,EAAOmB,QAAQC,GACdA,EAAEC,MAAMC,cAAcC,SAASL,EAAMI,gBACrC,EACFE,QAASC,IAAkC,IAAjChE,OAAEA,EAAMiE,MAAEA,EAAKpE,MAAEA,GAAYmE,EACtChE,EACEkE,QACAC,QACAC,YAAYH,GACZI,cAAc,CACdC,KAAM,eACNlB,MAAO,CAAEmB,GAAI1E,EAAM0E,GAAIX,MAAO/D,EAAM+D,SAEpCY,MACFpF,SAAAA,EAAWS,EAAO,IAAI,EAEvB4E,OAAQtF,EAAYC,EAAU,IAAKC,EAAYI,KAGlD,CAEM,SAAUiF,EACfC,EACAvF,EACAC,EACAI,GAEA,OAAO+C,EAAQC,OAAO,CAAEC,KAAM,gBAAiBC,UAAU,CACxDC,eAAgB,CAAEC,MAAO,iCACzBC,WAAY8B,IAAA,IAAC5B,QAAEA,EAAOC,KAAEA,GAAM2B,EAAA,MAC7B,GAAG5B,EAAQE,WAAWC,OAAOF,EAAKG,MAAa,OAAG,EACnDC,WAAYwB,IAAA,IAAC7B,QAAEA,EAAOC,KAAEA,GAAM4B,EAAA,MAAK,CAClC,OACAtB,EAAgBP,EAAQJ,gBACxB,GAAGI,EAAQE,WAAWC,OAAOF,EAAKG,MAAa,QAC/C,EACDF,WAAY,CACXC,KAAM,IACNxB,MAAOmD,IAAA,IAACrB,MAAEA,GAA0BqB,EAAA,OACnCH,EAAMjB,QAAQqB,GACbA,EAAEnB,MAAMC,cAAcC,SAASL,EAAMI,gBACrC,EACFE,QAASiB,IAAkC,IAAjChF,OAAEA,EAAMiE,MAAEA,EAAKpE,MAAEA,GAAYmF,EACtChF,EACEkE,QACAC,QACAC,YAAYH,GACZI,cAAc,CACdC,KAAM,cACNlB,MAAO,CAAEmB,GAAI1E,EAAM0E,GAAIX,MAAO/D,EAAM+D,SAEpCY,MACFpF,SAAAA,EAAWS,EAAO,IAAI,EAEvB4E,OAAQtF,EAAYC,EAAU,IAAKC,EAAYI,KAGlD"}
@@ -1,2 +1,2 @@
1
- import{Extension as t}from"../../../node_modules/@tiptap/core/dist/index.js";import{Slice as a,Fragment as e}from"@tiptap/pm/model";import{Plugin as o}from"@tiptap/pm/state";const r=t.create({name:"plainClipboard",addProseMirrorPlugins:()=>[new o({props:{handlePaste(t,o){var r,i,l,p;if(null===(i=null===(r=o.clipboardData)||void 0===r?void 0:r.files)||void 0===i?void 0:i.length)return!1;const n=null===(l=o.clipboardData)||void 0===l?void 0:l.getData("text/html"),d=null===(p=o.clipboardData)||void 0===p?void 0:p.getData("text/plain");if(!d||!n)return!1;const s=t.state.schema,m=d.split("\n").map((t=>s.node("paragraph",null,t?[s.text(t)]:[]))),c=new a(e.fromArray(m),0,0);return t.dispatch(t.state.tr.replaceSelection(c)),!0}}})]});export{r as PlainClipboardExtension};
1
+ import{Extension as t}from"../../../node_modules/@tiptap/core/dist/index.js";import{Slice as a,Fragment as e}from"@tiptap/pm/model";import{Plugin as o}from"@tiptap/pm/state";const r=t.create({name:"plainClipboard",addProseMirrorPlugins:()=>[new o({props:{handlePaste(t,o){var r,i,l,p;if(null===(i=null===(r=o.clipboardData)||void 0===r?void 0:r.files)||void 0===i?void 0:i.length)return!1;const n=null===(l=o.clipboardData)||void 0===l?void 0:l.getData("text/html"),d=null===(p=o.clipboardData)||void 0===p?void 0:p.getData("text/plain");if(!d||!n)return!1;const s=t.state.schema,m=d.split("\n").map((t=>s.node("paragraph",null,t?[s.text(t)]:[]))),c=new a(e.fromArray(m),1,1);return t.dispatch(t.state.tr.replaceSelection(c)),!0}}})]});export{r as PlainClipboardExtension};
2
2
  //# sourceMappingURL=PlainClipboardExtension.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"PlainClipboardExtension.js","sources":["../../../../../src/editor/extensions/plainClipboard/PlainClipboardExtension.ts"],"sourcesContent":["import { Extension } from '@tiptap/core';\nimport { Fragment, Slice } from '@tiptap/pm/model';\nimport { Plugin } from '@tiptap/pm/state';\n\nexport const PlainClipboardExtension = Extension.create({\n\tname: 'plainClipboard',\n\taddProseMirrorPlugins() {\n\t\treturn [\n\t\t\tnew Plugin({\n\t\t\t\tprops: {\n\t\t\t\t\thandlePaste(_view, event) {\n\t\t\t\t\t\tif (event.clipboardData?.files?.length) return false; // let ImagePaste handle\n\t\t\t\t\t\tconst html = event.clipboardData?.getData('text/html');\n\t\t\t\t\t\tconst text = event.clipboardData?.getData('text/plain');\n\t\t\t\t\t\tif (!text || !html) return false;\n\n\t\t\t\t\t\tconst schema = _view.state.schema;\n\t\t\t\t\t\t// Split on each newline so that multi-paragraph pastes produce\n\t\t\t\t\t\t// separate paragraph nodes — matching the behaviour of pressing\n\t\t\t\t\t\t// Enter between lines. Using schema.text() collapses all newlines\n\t\t\t\t\t\t// because ProseMirror text nodes cannot contain '\\n'.\n\t\t\t\t\t\tconst paragraphs = text\n\t\t\t\t\t\t\t.split('\\n')\n\t\t\t\t\t\t\t.map((line) =>\n\t\t\t\t\t\t\t\tschema.node('paragraph', null, line ? [schema.text(line)] : []),\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\tconst slice = new Slice(Fragment.fromArray(paragraphs), 0, 0);\n\t\t\t\t\t\t_view.dispatch(_view.state.tr.replaceSelection(slice));\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t}),\n\t\t];\n\t},\n});\n"],"names":["PlainClipboardExtension","Extension","create","name","addProseMirrorPlugins","Plugin","props","handlePaste","_view","event","_b","clipboardData","_a","files","length","html","_c","getData","text","_d","schema","state","paragraphs","split","map","line","node","slice","Slice","Fragment","fromArray","dispatch","tr","replaceSelection"],"mappings":"oLAIaA,EAA0BC,EAAUC,OAAO,CACvDC,KAAM,iBACNC,sBAAqBA,IACb,CACN,IAAIC,EAAO,CACVC,MAAO,CACNC,YAAYC,EAAOC,eAClB,WAAIC,EAAqB,UAArBD,EAAME,qBAAe,IAAAC,OAAA,EAAAA,EAAAC,4BAAOC,OAAQ,OAAO,EAC/C,MAAMC,EAA0B,QAAnBC,EAAAP,EAAME,qBAAa,IAAAK,OAAA,EAAAA,EAAEC,QAAQ,aACpCC,EAA0B,QAAnBC,EAAAV,EAAME,qBAAa,IAAAQ,OAAA,EAAAA,EAAEF,QAAQ,cAC1C,IAAKC,IAASH,EAAM,OAAO,EAE3B,MAAMK,EAASZ,EAAMa,MAAMD,OAKrBE,EAAaJ,EACjBK,MAAM,MACNC,KAAKC,GACLL,EAAOM,KAAK,YAAa,KAAMD,EAAO,CAACL,EAAOF,KAAKO,IAAS,MAExDE,EAAQ,IAAIC,EAAMC,EAASC,UAAUR,GAAa,EAAG,GAE3D,OADAd,EAAMuB,SAASvB,EAAMa,MAAMW,GAAGC,iBAAiBN,KACxC,CACR"}
1
+ {"version":3,"file":"PlainClipboardExtension.js","sources":["../../../../../src/editor/extensions/plainClipboard/PlainClipboardExtension.ts"],"sourcesContent":["import { Extension } from '@tiptap/core';\nimport { Fragment, Slice } from '@tiptap/pm/model';\nimport { Plugin } from '@tiptap/pm/state';\n\nexport const PlainClipboardExtension = Extension.create({\n\tname: 'plainClipboard',\n\taddProseMirrorPlugins() {\n\t\treturn [\n\t\t\tnew Plugin({\n\t\t\t\tprops: {\n\t\t\t\t\thandlePaste(_view, event) {\n\t\t\t\t\t\tif (event.clipboardData?.files?.length) return false; // let ImagePaste handle\n\t\t\t\t\t\tconst html = event.clipboardData?.getData('text/html');\n\t\t\t\t\t\tconst text = event.clipboardData?.getData('text/plain');\n\t\t\t\t\t\tif (!text || !html) return false;\n\n\t\t\t\t\t\tconst schema = _view.state.schema;\n\t\t\t\t\t\t// Split on each newline so that multi-paragraph pastes produce\n\t\t\t\t\t\t// separate paragraph nodes — matching the behaviour of pressing\n\t\t\t\t\t\t// Enter between lines. Using schema.text() collapses all newlines\n\t\t\t\t\t\t// because ProseMirror text nodes cannot contain '\\n'.\n\t\t\t\t\t\tconst paragraphs = text\n\t\t\t\t\t\t\t.split('\\n')\n\t\t\t\t\t\t\t.map((line) =>\n\t\t\t\t\t\t\t\tschema.node('paragraph', null, line ? [schema.text(line)] : []),\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\tconst slice = new Slice(Fragment.fromArray(paragraphs), 1, 1);\n\t\t\t\t\t\t_view.dispatch(_view.state.tr.replaceSelection(slice));\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t}),\n\t\t];\n\t},\n});\n"],"names":["PlainClipboardExtension","Extension","create","name","addProseMirrorPlugins","Plugin","props","handlePaste","_view","event","_b","clipboardData","_a","files","length","html","_c","getData","text","_d","schema","state","paragraphs","split","map","line","node","slice","Slice","Fragment","fromArray","dispatch","tr","replaceSelection"],"mappings":"oLAIaA,EAA0BC,EAAUC,OAAO,CACvDC,KAAM,iBACNC,sBAAqBA,IACb,CACN,IAAIC,EAAO,CACVC,MAAO,CACNC,YAAYC,EAAOC,eAClB,WAAIC,EAAqB,UAArBD,EAAME,qBAAe,IAAAC,OAAA,EAAAA,EAAAC,4BAAOC,OAAQ,OAAO,EAC/C,MAAMC,EAA0B,QAAnBC,EAAAP,EAAME,qBAAa,IAAAK,OAAA,EAAAA,EAAEC,QAAQ,aACpCC,EAA0B,QAAnBC,EAAAV,EAAME,qBAAa,IAAAQ,OAAA,EAAAA,EAAEF,QAAQ,cAC1C,IAAKC,IAASH,EAAM,OAAO,EAE3B,MAAMK,EAASZ,EAAMa,MAAMD,OAKrBE,EAAaJ,EACjBK,MAAM,MACNC,KAAKC,GACLL,EAAOM,KAAK,YAAa,KAAMD,EAAO,CAACL,EAAOF,KAAKO,IAAS,MAExDE,EAAQ,IAAIC,EAAMC,EAASC,UAAUR,GAAa,EAAG,GAE3D,OADAd,EAAMuB,SAASvB,EAAMa,MAAMW,GAAGC,iBAAiBN,KACxC,CACR"}
@@ -1,2 +1,2 @@
1
- import{jsx as e,Fragment as r,jsxs as n}from"react/jsx-runtime";import{forwardRef as t,useState as o,useImperativeHandle as i,useEffect as l}from"react";import{DropdownContainer as c,DropdownItem as d,SlashLabel as m,SlashDescription as s}from"../editorDropdown.styles.js";const a=t(((t,a)=>{let{items:h,query:p,command:u,renderItem:y,renderDropdown:w}=t;const[g,k]=o(0),D=e=>{h[e]&&u(h[e])};return i(a,(()=>({onKeyDown:e=>{let{event:r}=e;return"ArrowUp"===r.key?(k((e=>(e+h.length-1)%h.length)),!0):"ArrowDown"===r.key?(k((e=>(e+1)%h.length)),!0):"Enter"===r.key&&(D(g),!0)}}))),l((()=>k(0)),[h]),h.length?w?e(r,{children:w({items:h,query:p,activeIndex:g,onSelect:e=>u(e)})}):e(c,{children:h.map(((t,o)=>e(d,Object.assign({$isActive:o===g,onMouseEnter:()=>k(o),onClick:()=>D(o)},{children:y?y(t,o===g):n(r,{children:[e(m,{children:t.label}),t.description&&e(s,{children:t.description})]})}),t.id)))}):null}));a.displayName="SlashCommandMenu";export{a as SlashCommandMenu};
1
+ import{jsx as e,Fragment as n,jsxs as r}from"react/jsx-runtime";import{forwardRef as t,useState as o,useRef as l,useCallback as i,useImperativeHandle as c,useEffect as s}from"react";import{DropdownContainer as d,DropdownItem as m,SlashLabel as u,SlashDescription as a}from"../editorDropdown.styles.js";const h=t(((t,h)=>{let{items:p,query:y,command:w,renderItem:g,renderDropdown:f}=t;const[k,b]=o(0),j=l(null),D=i((e=>{const n=j.current;if(!n)return;const r=n.children[e];null==r||r.scrollIntoView({block:"nearest"})}),[]),v=e=>{p[e]&&w(p[e])};return c(h,(()=>({onKeyDown:e=>{let{event:n}=e;return"ArrowUp"===n.key?(b((e=>{const n=(e+p.length-1)%p.length;return D(n),n})),!0):"ArrowDown"===n.key?(b((e=>{const n=(e+1)%p.length;return D(n),n})),!0):"Enter"===n.key&&(v(k),!0)}}))),s((()=>b(0)),[p]),p.length?f?e(n,{children:f({items:p,query:y,activeIndex:k,onSelect:e=>w(e)})}):e(d,Object.assign({ref:j},{children:p.map(((t,o)=>e(m,Object.assign({$isActive:o===k,onMouseEnter:()=>b(o),onClick:()=>v(o)},{children:g?g(t,o===k):r(n,{children:[e(u,{children:t.label}),t.description&&e(a,{children:t.description})]})}),t.id)))})):null}));h.displayName="SlashCommandMenu";export{h as SlashCommandMenu};
2
2
  //# sourceMappingURL=SlashCommandMenu.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"SlashCommandMenu.js","sources":["../../../../../src/editor/extensions/slashCommand/SlashCommandMenu.tsx"],"sourcesContent":["import React, {\n\tforwardRef,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseState,\n} from 'react';\nimport type {\n\tSlashCommandDropdownRenderProps,\n\tSlashCommandItem,\n} from '../../BikEditor.types';\nimport {\n\tDropdownContainer,\n\tDropdownItem,\n\tSlashDescription,\n\tSlashLabel,\n} from '../editorDropdown.styles';\n\ninterface Props {\n\titems: SlashCommandItem[];\n\tquery: string;\n\tcommand: (item: SlashCommandItem) => void;\n\t/** Custom per-row renderer. Receives the item and whether it is the active row. */\n\trenderItem?: (item: SlashCommandItem, isActive: boolean) => React.ReactNode;\n\t/**\n\t * Full custom dropdown renderer. Takes priority over renderItem.\n\t * The editor passes activeIndex and onSelect — you handle all the visual rendering.\n\t */\n\trenderDropdown?: (props: SlashCommandDropdownRenderProps) => React.ReactNode;\n}\n\nexport const SlashCommandMenu = forwardRef<any, Props>(\n\t({ items, query, command, renderItem, renderDropdown }, ref) => {\n\t\tconst [selectedIndex, setSelectedIndex] = useState(0);\n\n\t\tconst select = (i: number) => {\n\t\t\tif (items[i]) command(items[i]);\n\t\t};\n\n\t\tuseImperativeHandle(ref, () => ({\n\t\t\tonKeyDown: ({ event }: { event: KeyboardEvent }) => {\n\t\t\t\tif (event.key === 'ArrowUp') {\n\t\t\t\t\tsetSelectedIndex((i) => (i + items.length - 1) % items.length);\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'ArrowDown') {\n\t\t\t\t\tsetSelectedIndex((i) => (i + 1) % items.length);\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'Enter') {\n\t\t\t\t\tselect(selectedIndex);\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\treturn false;\n\t\t\t},\n\t\t}));\n\n\t\tuseEffect(() => setSelectedIndex(0), [items]);\n\n\t\tif (!items.length) return null;\n\n\t\t// Full custom dropdown — editor still manages keyboard nav via selectedIndex\n\t\tif (renderDropdown) {\n\t\t\treturn (\n\t\t\t\t<>\n\t\t\t\t\t{renderDropdown({\n\t\t\t\t\t\titems,\n\t\t\t\t\t\tquery,\n\t\t\t\t\t\tactiveIndex: selectedIndex,\n\t\t\t\t\t\tonSelect: (item) => command(item),\n\t\t\t\t\t})}\n\t\t\t\t</>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<DropdownContainer>\n\t\t\t\t{items.map((item, i) => (\n\t\t\t\t\t<DropdownItem\n\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t$isActive={i === selectedIndex}\n\t\t\t\t\t\tonMouseEnter={() => setSelectedIndex(i)}\n\t\t\t\t\t\tonClick={() => select(i)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderItem ? (\n\t\t\t\t\t\t\trenderItem(item, i === selectedIndex)\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<SlashLabel>{item.label}</SlashLabel>\n\t\t\t\t\t\t\t\t{item.description && (\n\t\t\t\t\t\t\t\t\t<SlashDescription>{item.description}</SlashDescription>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</DropdownItem>\n\t\t\t\t))}\n\t\t\t</DropdownContainer>\n\t\t);\n\t},\n);\nSlashCommandMenu.displayName = 'SlashCommandMenu';\n"],"names":["SlashCommandMenu","forwardRef","_ref","ref","items","query","command","renderItem","renderDropdown","selectedIndex","setSelectedIndex","useState","select","i","useImperativeHandle","onKeyDown","_ref2","event","key","length","useEffect","_jsx","_Fragment","children","activeIndex","onSelect","item","DropdownContainer","map","DropdownItem","Object","assign","$isActive","onMouseEnter","onClick","_jsxs","SlashLabel","label","description","SlashDescription","id","displayName"],"mappings":"iRA8BO,MAAMA,EAAmBC,GAC/B,CAAAC,EAAwDC,KAAO,IAA9DC,MAAEA,EAAKC,MAAEA,EAAKC,QAAEA,EAAOC,WAAEA,EAAUC,eAAEA,GAAgBN,EACrD,MAAOO,EAAeC,GAAoBC,EAAS,GAE7CC,EAAUC,IACXT,EAAMS,IAAIP,EAAQF,EAAMS,GAAG,EAuBhC,OApBAC,EAAoBX,GAAK,KAAO,CAC/BY,UAAWC,IAAwC,IAAvCC,MAAEA,GAAiCD,EAC9C,MAAkB,YAAdC,EAAMC,KACTR,GAAkBG,IAAOA,EAAIT,EAAMe,OAAS,GAAKf,EAAMe,UAChD,GAEU,cAAdF,EAAMC,KACTR,GAAkBG,IAAOA,EAAI,GAAKT,EAAMe,UACjC,GAEU,UAAdF,EAAMC,MACTN,EAAOH,IACA,EAEI,MAIdW,GAAU,IAAMV,EAAiB,IAAI,CAACN,IAEjCA,EAAMe,OAGPX,EAEFa,EACEC,EAAA,CAAAC,SAAAf,EAAe,CACfJ,QACAC,QACAmB,YAAaf,EACbgB,SAAWC,GAASpB,EAAQoB,OAO/BL,EAACM,EAAiB,CAAAJ,SAChBnB,EAAMwB,KAAI,CAACF,EAAMb,IACjBQ,EAACQ,EAAYC,OAAAC,OAAA,CAAAC,UAEDnB,IAAMJ,EACjBwB,aAAcA,IAAMvB,EAAiBG,GACrCqB,QAASA,IAAMtB,EAAOC,IAAE,CAAAU,SAEvBhB,EACAA,EAAWmB,EAAMb,IAAMJ,GAEvB0B,EAAAb,EAAA,CAAAC,SAAA,CACCF,EAACe,EAAU,CAAAb,SAAEG,EAAKW,QACjBX,EAAKY,aACLjB,EAACkB,YAAkBb,EAAKY,mBAXtBZ,EAAKc,QApBY,IAqCL,IAIvBxC,EAAiByC,YAAc"}
1
+ {"version":3,"file":"SlashCommandMenu.js","sources":["../../../../../src/editor/extensions/slashCommand/SlashCommandMenu.tsx"],"sourcesContent":["import React, {\n\tforwardRef,\n\tuseCallback,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseRef,\n\tuseState,\n} from 'react';\nimport type {\n\tSlashCommandDropdownRenderProps,\n\tSlashCommandItem,\n} from '../../BikEditor.types';\nimport {\n\tDropdownContainer,\n\tDropdownItem,\n\tSlashDescription,\n\tSlashLabel,\n} from '../editorDropdown.styles';\n\ninterface Props {\n\titems: SlashCommandItem[];\n\tquery: string;\n\tcommand: (item: SlashCommandItem) => void;\n\t/** Custom per-row renderer. Receives the item and whether it is the active row. */\n\trenderItem?: (item: SlashCommandItem, isActive: boolean) => React.ReactNode;\n\t/**\n\t * Full custom dropdown renderer. Takes priority over renderItem.\n\t * The editor passes activeIndex and onSelect — you handle all the visual rendering.\n\t */\n\trenderDropdown?: (props: SlashCommandDropdownRenderProps) => React.ReactNode;\n}\n\nexport const SlashCommandMenu = forwardRef<any, Props>(\n\t({ items, query, command, renderItem, renderDropdown }, ref) => {\n\t\tconst [selectedIndex, setSelectedIndex] = useState(0);\n\t\tconst containerRef = useRef<HTMLDivElement>(null);\n\n\t\tconst scrollToIndex = useCallback((index: number) => {\n\t\t\tconst container = containerRef.current;\n\t\t\tif (!container) return;\n\t\t\tconst item = container.children[index] as HTMLElement | undefined;\n\t\t\titem?.scrollIntoView({ block: 'nearest' });\n\t\t}, []);\n\n\t\tconst select = (i: number) => {\n\t\t\tif (items[i]) command(items[i]);\n\t\t};\n\n\t\tuseImperativeHandle(ref, () => ({\n\t\t\tonKeyDown: ({ event }: { event: KeyboardEvent }) => {\n\t\t\t\tif (event.key === 'ArrowUp') {\n\t\t\t\t\tsetSelectedIndex((prev) => {\n\t\t\t\t\t\tconst next = (prev + items.length - 1) % items.length;\n\t\t\t\t\t\tscrollToIndex(next);\n\t\t\t\t\t\treturn next;\n\t\t\t\t\t});\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'ArrowDown') {\n\t\t\t\t\tsetSelectedIndex((prev) => {\n\t\t\t\t\t\tconst next = (prev + 1) % items.length;\n\t\t\t\t\t\tscrollToIndex(next);\n\t\t\t\t\t\treturn next;\n\t\t\t\t\t});\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'Enter') {\n\t\t\t\t\tselect(selectedIndex);\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\treturn false;\n\t\t\t},\n\t\t}));\n\n\t\tuseEffect(() => setSelectedIndex(0), [items]);\n\n\t\tif (!items.length) return null;\n\n\t\t// Full custom dropdown — editor still manages keyboard nav via selectedIndex\n\t\tif (renderDropdown) {\n\t\t\treturn (\n\t\t\t\t<>\n\t\t\t\t\t{renderDropdown({\n\t\t\t\t\t\titems,\n\t\t\t\t\t\tquery,\n\t\t\t\t\t\tactiveIndex: selectedIndex,\n\t\t\t\t\t\tonSelect: (item) => command(item),\n\t\t\t\t\t})}\n\t\t\t\t</>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<DropdownContainer ref={containerRef}>\n\t\t\t\t{items.map((item, i) => (\n\t\t\t\t\t<DropdownItem\n\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t$isActive={i === selectedIndex}\n\t\t\t\t\t\tonMouseEnter={() => setSelectedIndex(i)}\n\t\t\t\t\t\tonClick={() => select(i)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderItem ? (\n\t\t\t\t\t\t\trenderItem(item, i === selectedIndex)\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<SlashLabel>{item.label}</SlashLabel>\n\t\t\t\t\t\t\t\t{item.description && (\n\t\t\t\t\t\t\t\t\t<SlashDescription>{item.description}</SlashDescription>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</DropdownItem>\n\t\t\t\t))}\n\t\t\t</DropdownContainer>\n\t\t);\n\t},\n);\nSlashCommandMenu.displayName = 'SlashCommandMenu';\n"],"names":["SlashCommandMenu","forwardRef","_ref","ref","items","query","command","renderItem","renderDropdown","selectedIndex","setSelectedIndex","useState","containerRef","useRef","scrollToIndex","useCallback","index","container","current","item","children","scrollIntoView","block","select","i","useImperativeHandle","onKeyDown","_ref2","event","key","prev","next","length","useEffect","_jsx","_Fragment","activeIndex","onSelect","DropdownContainer","Object","assign","map","DropdownItem","$isActive","onMouseEnter","onClick","_jsxs","SlashLabel","label","description","SlashDescription","id","displayName"],"mappings":"8SAgCO,MAAMA,EAAmBC,GAC/B,CAAAC,EAAwDC,KAAO,IAA9DC,MAAEA,EAAKC,MAAEA,EAAKC,QAAEA,EAAOC,WAAEA,EAAUC,eAAEA,GAAgBN,EACrD,MAAOO,EAAeC,GAAoBC,EAAS,GAC7CC,EAAeC,EAAuB,MAEtCC,EAAgBC,GAAaC,IAClC,MAAMC,EAAYL,EAAaM,QAC/B,IAAKD,EAAW,OAChB,MAAME,EAAOF,EAAUG,SAASJ,GAChCG,SAAAA,EAAME,eAAe,CAAEC,MAAO,WAAY,GACxC,IAEGC,EAAUC,IACXpB,EAAMoB,IAAIlB,EAAQF,EAAMoB,GAAG,EA+BhC,OA5BAC,EAAoBtB,GAAK,KAAO,CAC/BuB,UAAWC,IAAwC,IAAvCC,MAAEA,GAAiCD,EAC9C,MAAkB,YAAdC,EAAMC,KACTnB,GAAkBoB,IACjB,MAAMC,GAAQD,EAAO1B,EAAM4B,OAAS,GAAK5B,EAAM4B,OAE/C,OADAlB,EAAciB,GACPA,CAAI,KAEL,GAEU,cAAdH,EAAMC,KACTnB,GAAkBoB,IACjB,MAAMC,GAAQD,EAAO,GAAK1B,EAAM4B,OAEhC,OADAlB,EAAciB,GACPA,CAAI,KAEL,GAEU,UAAdH,EAAMC,MACTN,EAAOd,IACA,EAEI,MAIdwB,GAAU,IAAMvB,EAAiB,IAAI,CAACN,IAEjCA,EAAM4B,OAGPxB,EAEF0B,EACEC,EAAA,CAAAf,SAAAZ,EAAe,CACfJ,QACAC,QACA+B,YAAa3B,EACb4B,SAAWlB,GAASb,EAAQa,OAO/Be,EAACI,EAAiBC,OAAAC,OAAA,CAACrC,IAAKS,aACtBR,EAAMqC,KAAI,CAACtB,EAAMK,IACjBU,EAACQ,EAAYH,OAAAC,OAAA,CAAAG,UAEDnB,IAAMf,EACjBmC,aAAcA,IAAMlC,EAAiBc,GACrCqB,QAASA,IAAMtB,EAAOC,IAAE,CAAAJ,SAEvBb,EACAA,EAAWY,EAAMK,IAAMf,GAEvBqC,EACCX,EAAA,CAAAf,SAAA,CAAAc,EAACa,EAAY,CAAA3B,SAAAD,EAAK6B,QACjB7B,EAAK8B,aACLf,EAACgB,EAAkB,CAAA9B,SAAAD,EAAK8B,mBAXtB9B,EAAKgC,SApBY,IAqCL,IAIvBnD,EAAiBoD,YAAc"}
@@ -1,3 +1,4 @@
1
+ /// <reference types="react" />
1
2
  export declare const Menus: ({
2
3
  displayName: string;
3
4
  key: number;
@@ -3,6 +3,7 @@ export declare const DropdownItem: import("styled-components").StyledComponent<"
3
3
  $isActive?: boolean | undefined;
4
4
  }, never>;
5
5
  export declare const MentionAvatar: import("styled-components").StyledComponent<"img", any, {}, never>;
6
+ export declare const MentionAvatarFallback: import("styled-components").StyledComponent<"div", any, {}, never>;
6
7
  export declare const MentionLabel: import("styled-components").StyledComponent<"span", any, {}, never>;
7
8
  export declare const MentionPresenceDot: import("styled-components").StyledComponent<"span", any, {
8
9
  $online?: boolean | undefined;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bikdotai/bik-component-library",
3
- "version": "0.0.802-beta.0",
3
+ "version": "0.0.802-beta.2",
4
4
  "description": "Bik Component Library",
5
5
  "repository": {
6
6
  "type": "git",