@forgedevstack/bear 1.0.6 → 1.0.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/BottomSheet/BottomSheet.cjs +1 -0
- package/dist/components/BottomSheet/BottomSheet.d.ts +3 -0
- package/dist/components/BottomSheet/BottomSheet.js +102 -0
- package/dist/components/BottomSheet/BottomSheet.types.d.ts +13 -0
- package/dist/components/BottomSheet/index.d.ts +2 -0
- package/dist/components/Button/Button.cjs +1 -1
- package/dist/components/Button/Button.js +40 -38
- package/dist/components/Button/Button.types.d.ts +4 -0
- package/dist/components/EmojiPicker/EmojiPicker.cjs +1 -0
- package/dist/components/EmojiPicker/EmojiPicker.const.cjs +1 -0
- package/dist/components/EmojiPicker/EmojiPicker.const.d.ts +5 -0
- package/dist/components/EmojiPicker/EmojiPicker.const.js +10 -0
- package/dist/components/EmojiPicker/EmojiPicker.d.ts +3 -0
- package/dist/components/EmojiPicker/EmojiPicker.js +63 -0
- package/dist/components/EmojiPicker/EmojiPicker.types.d.ts +6 -0
- package/dist/components/EmojiPicker/index.d.ts +3 -0
- package/dist/components/Kanban/Kanban.cjs +1 -0
- package/dist/components/Kanban/Kanban.d.ts +3 -0
- package/dist/components/Kanban/Kanban.js +90 -0
- package/dist/components/Kanban/Kanban.types.d.ts +21 -0
- package/dist/components/Kanban/index.d.ts +2 -0
- package/dist/components/MentionsInput/MentionsInput.cjs +1 -0
- package/dist/components/MentionsInput/MentionsInput.d.ts +3 -0
- package/dist/components/MentionsInput/MentionsInput.js +140 -0
- package/dist/components/MentionsInput/MentionsInput.types.d.ts +21 -0
- package/dist/components/MentionsInput/index.d.ts +2 -0
- package/dist/components/RichEditor/RichEditor.cjs +1 -1
- package/dist/components/RichEditor/RichEditor.const.cjs +2 -2
- package/dist/components/RichEditor/RichEditor.const.d.ts +4 -1
- package/dist/components/RichEditor/RichEditor.const.js +51 -18
- package/dist/components/RichEditor/RichEditor.js +106 -105
- package/dist/components/RichEditor/components/ToolbarColorPicker/ToolbarColorPicker.cjs +1 -1
- package/dist/components/RichEditor/components/ToolbarColorPicker/ToolbarColorPicker.js +105 -95
- package/dist/components/RichEditor/components/ToolbarMore/ToolbarMore.cjs +1 -1
- package/dist/components/RichEditor/components/ToolbarMore/ToolbarMore.d.ts +2 -0
- package/dist/components/RichEditor/components/ToolbarMore/ToolbarMore.js +47 -29
- package/dist/components/SegmentedControl/SegmentedControl.cjs +1 -0
- package/dist/components/SegmentedControl/SegmentedControl.d.ts +3 -0
- package/dist/components/SegmentedControl/SegmentedControl.js +58 -0
- package/dist/components/SegmentedControl/SegmentedControl.types.d.ts +16 -0
- package/dist/components/SegmentedControl/index.d.ts +2 -0
- package/dist/components/SignPad/SignPad.cjs +1 -1
- package/dist/components/SignPad/SignPad.js +98 -90
- package/dist/components/SliderRange/SliderRange.cjs +1 -0
- package/dist/components/SliderRange/SliderRange.d.ts +3 -0
- package/dist/components/SliderRange/SliderRange.js +142 -0
- package/dist/components/SliderRange/SliderRange.types.d.ts +17 -0
- package/dist/components/SliderRange/index.d.ts +2 -0
- package/dist/components/TagsInput/TagsInput.cjs +1 -0
- package/dist/components/TagsInput/TagsInput.d.ts +3 -0
- package/dist/components/TagsInput/TagsInput.js +100 -0
- package/dist/components/TagsInput/TagsInput.types.d.ts +16 -0
- package/dist/components/TagsInput/index.d.ts +2 -0
- package/dist/components/VirtualList/VirtualList.cjs +1 -0
- package/dist/components/VirtualList/VirtualList.d.ts +3 -0
- package/dist/components/VirtualList/VirtualList.js +68 -0
- package/dist/components/VirtualList/VirtualList.types.d.ts +10 -0
- package/dist/components/VirtualList/index.d.ts +2 -0
- package/dist/components/index.cjs +1 -1
- package/dist/components/index.d.ts +16 -0
- package/dist/components/index.js +124 -106
- package/dist/hooks/index.cjs +1 -1
- package/dist/hooks/index.d.ts +4 -0
- package/dist/hooks/index.js +36 -32
- package/dist/hooks/useDragDrop/index.d.ts +2 -0
- package/dist/hooks/useDragDrop/useDragDrop.cjs +1 -0
- package/dist/hooks/useDragDrop/useDragDrop.d.ts +22 -0
- package/dist/hooks/useDragDrop/useDragDrop.js +56 -0
- package/dist/hooks/useDragDrop/useDragDrop.types.d.ts +55 -0
- package/dist/hooks/useLazyLoad/index.d.ts +2 -0
- package/dist/hooks/useLazyLoad/useLazyLoad.cjs +1 -0
- package/dist/hooks/useLazyLoad/useLazyLoad.d.ts +26 -0
- package/dist/hooks/useLazyLoad/useLazyLoad.js +27 -0
- package/dist/hooks/useLazyLoad/useLazyLoad.types.d.ts +25 -0
- package/dist/index.cjs +1 -1
- package/dist/index.js +179 -157
- package/dist/styles.css +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,140 @@
|
|
|
1
|
+
import { jsxs as M, jsx as x } from "react/jsx-runtime";
|
|
2
|
+
import { useState as u, useRef as k, useCallback as G, useEffect as p } from "react";
|
|
3
|
+
import { cn as z } from "../../utils/cn.js";
|
|
4
|
+
const J = {
|
|
5
|
+
sm: "bear-h-8 bear-text-sm bear-px-3",
|
|
6
|
+
md: "bear-h-10 bear-text-base bear-px-4",
|
|
7
|
+
lg: "bear-h-12 bear-text-lg bear-px-5"
|
|
8
|
+
}, P = (o, m) => {
|
|
9
|
+
const t = m.toLowerCase();
|
|
10
|
+
return o.filter(
|
|
11
|
+
(s) => s.value.toLowerCase().includes(t) || String(s.label).toLowerCase().includes(t)
|
|
12
|
+
);
|
|
13
|
+
}, Z = ({
|
|
14
|
+
value: o,
|
|
15
|
+
defaultValue: m = "",
|
|
16
|
+
onChange: t,
|
|
17
|
+
onMentionSelect: s,
|
|
18
|
+
options: T,
|
|
19
|
+
trigger: l = "@",
|
|
20
|
+
placeholder: $ = "Type @ to mention...",
|
|
21
|
+
disabled: I = !1,
|
|
22
|
+
maxSuggestions: j = 5,
|
|
23
|
+
filterOptions: A = P,
|
|
24
|
+
size: K = "md",
|
|
25
|
+
fullWidth: Q = !1,
|
|
26
|
+
className: B
|
|
27
|
+
}) => {
|
|
28
|
+
const [F, q] = u(m), [d, H] = u(""), [S, f] = u(!1), [c, h] = u(0), [g, U] = u(null), w = k(null), E = k(null), y = k(null), a = o ?? F, b = A(T, d).slice(0, j), D = S && d.length >= 0, L = G(() => {
|
|
29
|
+
const e = a.lastIndexOf(l);
|
|
30
|
+
if (e === -1) return { query: "", start: null };
|
|
31
|
+
const r = a.slice(e + l.length), n = r.indexOf(" ");
|
|
32
|
+
return { query: n === -1 ? r : r.slice(0, n), start: e };
|
|
33
|
+
}, [a, l]);
|
|
34
|
+
p(() => {
|
|
35
|
+
const { query: e, start: r } = L();
|
|
36
|
+
H(e), U(r), f(r !== null && !e.includes(" "));
|
|
37
|
+
}, [a, L]), p(() => {
|
|
38
|
+
h(0);
|
|
39
|
+
}, [d]), p(() => {
|
|
40
|
+
if (c >= 0 && y.current) {
|
|
41
|
+
const e = y.current.children[c];
|
|
42
|
+
e == null || e.scrollIntoView({ block: "nearest" });
|
|
43
|
+
}
|
|
44
|
+
}, [c]), p(() => {
|
|
45
|
+
const e = (r) => {
|
|
46
|
+
w.current && !w.current.contains(r.target) && f(!1);
|
|
47
|
+
};
|
|
48
|
+
return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
|
|
49
|
+
}, []);
|
|
50
|
+
const O = (e) => {
|
|
51
|
+
const r = new RegExp(`${l}(\\w+)`, "g"), n = [];
|
|
52
|
+
let i;
|
|
53
|
+
for (; (i = r.exec(e)) !== null; )
|
|
54
|
+
n.push(i[1]);
|
|
55
|
+
return [...new Set(n)];
|
|
56
|
+
}, V = (e) => {
|
|
57
|
+
const r = e.target.value;
|
|
58
|
+
o === void 0 && q(r), t == null || t(r, O(r));
|
|
59
|
+
}, N = (e) => {
|
|
60
|
+
var R;
|
|
61
|
+
if (g == null) return;
|
|
62
|
+
const r = a.slice(0, g), n = a.slice(g + l.length + d.length), i = `${l}${e.value}`, v = r + i + " " + n;
|
|
63
|
+
o === void 0 && q(v), t == null || t(v, O(v)), s == null || s(e), f(!1), (R = E.current) == null || R.focus();
|
|
64
|
+
}, C = (e) => {
|
|
65
|
+
if (!(!D || b.length === 0)) {
|
|
66
|
+
if (e.key === "ArrowDown") {
|
|
67
|
+
e.preventDefault(), h((r) => Math.min(r + 1, b.length - 1));
|
|
68
|
+
return;
|
|
69
|
+
}
|
|
70
|
+
if (e.key === "ArrowUp") {
|
|
71
|
+
e.preventDefault(), h((r) => Math.max(r - 1, 0));
|
|
72
|
+
return;
|
|
73
|
+
}
|
|
74
|
+
if (e.key === "Enter" || e.key === "Tab") {
|
|
75
|
+
e.preventDefault();
|
|
76
|
+
const r = b[c];
|
|
77
|
+
r && N(r);
|
|
78
|
+
return;
|
|
79
|
+
}
|
|
80
|
+
e.key === "Escape" && f(!1);
|
|
81
|
+
}
|
|
82
|
+
};
|
|
83
|
+
return /* @__PURE__ */ M(
|
|
84
|
+
"div",
|
|
85
|
+
{
|
|
86
|
+
ref: w,
|
|
87
|
+
className: z(
|
|
88
|
+
"Bear-MentionsInput bear-relative",
|
|
89
|
+
Q && "bear-w-full",
|
|
90
|
+
B
|
|
91
|
+
),
|
|
92
|
+
children: [
|
|
93
|
+
/* @__PURE__ */ x(
|
|
94
|
+
"input",
|
|
95
|
+
{
|
|
96
|
+
ref: E,
|
|
97
|
+
type: "text",
|
|
98
|
+
value: a,
|
|
99
|
+
onChange: V,
|
|
100
|
+
onKeyDown: C,
|
|
101
|
+
placeholder: $,
|
|
102
|
+
disabled: I,
|
|
103
|
+
className: z(
|
|
104
|
+
"bear-w-full bear-rounded-lg bear-border bear-border-gray-300 dark:bear-border-zinc-600 bear-bg-white dark:bear-bg-zinc-900 bear-text-gray-900 dark:bear-text-white placeholder:bear-text-gray-500 dark:placeholder:bear-text-zinc-500 bear-outline-none bear-transition-colors focus:bear-border-bear-500 focus:bear-ring-2 focus:bear-ring-bear-500/20",
|
|
105
|
+
I && "bear-opacity-50 bear-cursor-not-allowed",
|
|
106
|
+
J[K]
|
|
107
|
+
)
|
|
108
|
+
}
|
|
109
|
+
),
|
|
110
|
+
D && b.length > 0 && /* @__PURE__ */ x(
|
|
111
|
+
"div",
|
|
112
|
+
{
|
|
113
|
+
ref: y,
|
|
114
|
+
className: "bear-absolute bear-z-50 bear-mt-1 bear-w-full bear-max-h-48 bear-overflow-auto bear-rounded-lg bear-border bear-border-gray-200 dark:bear-border-zinc-600 bear-bg-white dark:bear-bg-zinc-800 bear-py-1 bear-shadow-lg",
|
|
115
|
+
children: b.map((e, r) => /* @__PURE__ */ M(
|
|
116
|
+
"button",
|
|
117
|
+
{
|
|
118
|
+
type: "button",
|
|
119
|
+
className: z(
|
|
120
|
+
"bear-w-full bear-flex bear-items-center bear-gap-2 bear-px-3 bear-py-2 bear-text-left bear-text-gray-800 dark:bear-text-zinc-200 hover:bear-bg-gray-100 dark:hover:bear-bg-zinc-700 bear-transition-colors",
|
|
121
|
+
r === c && "bear-bg-gray-100 dark:bear-bg-zinc-700"
|
|
122
|
+
),
|
|
123
|
+
onMouseEnter: () => h(r),
|
|
124
|
+
onClick: () => N(e),
|
|
125
|
+
children: [
|
|
126
|
+
e.avatar && /* @__PURE__ */ x("span", { className: "bear-shrink-0", children: e.avatar }),
|
|
127
|
+
/* @__PURE__ */ x("span", { children: e.label })
|
|
128
|
+
]
|
|
129
|
+
},
|
|
130
|
+
e.value
|
|
131
|
+
))
|
|
132
|
+
}
|
|
133
|
+
)
|
|
134
|
+
]
|
|
135
|
+
}
|
|
136
|
+
);
|
|
137
|
+
};
|
|
138
|
+
export {
|
|
139
|
+
Z as MentionsInput
|
|
140
|
+
};
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
export interface MentionOption {
|
|
3
|
+
value: string;
|
|
4
|
+
label: ReactNode;
|
|
5
|
+
avatar?: ReactNode;
|
|
6
|
+
}
|
|
7
|
+
export interface MentionsInputProps {
|
|
8
|
+
value?: string;
|
|
9
|
+
defaultValue?: string;
|
|
10
|
+
onChange?: (value: string, mentions: string[]) => void;
|
|
11
|
+
onMentionSelect?: (option: MentionOption) => void;
|
|
12
|
+
options: MentionOption[];
|
|
13
|
+
trigger?: string;
|
|
14
|
+
placeholder?: string;
|
|
15
|
+
disabled?: boolean;
|
|
16
|
+
maxSuggestions?: number;
|
|
17
|
+
filterOptions?: (options: MentionOption[], query: string) => MentionOption[];
|
|
18
|
+
size?: 'sm' | 'md' | 'lg';
|
|
19
|
+
fullWidth?: boolean;
|
|
20
|
+
className?: string;
|
|
21
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),c=require("react"),T=require("../../utils/cn.cjs"),u=require("./helpers/formatHelpers.cjs"),f=require("./RichEditor.const.cjs"),C=require("./components/ToolbarButton/ToolbarButton.cjs"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),c=require("react"),T=require("../../utils/cn.cjs"),u=require("./helpers/formatHelpers.cjs"),f=require("./RichEditor.const.cjs"),re=require("../../hooks/useMediaQuery.cjs"),C=require("./components/ToolbarButton/ToolbarButton.cjs"),se=require("./components/ToolbarDropdown/ToolbarDropdown.cjs"),H=require("./components/ToolbarColorPicker/ToolbarColorPicker.cjs"),le=require("./components/ToolbarMore/ToolbarMore.cjs"),r=require("../Icon/icons/editor.cjs"),ae=6,ce=B=>{const{value:x,defaultValue:E="",onChange:R,placeholder:S="Start typing...",disabled:o=!1,readOnly:i=!1,minHeight:j=f.RICH_EDITOR_MIN_HEIGHT,maxHeight:b,toolbar:z=f.RICH_EDITOR_DEFAULT_TOOLBAR,className:A="",testId:D,id:v,allowImagePaste:y=!0,...N}=B,a=c.useRef(null),p=re.useMediaQuery(`(max-width: ${f.RICH_EDITOR_MOBILE_BREAKPOINT}px)`),k=p?f.RICH_EDITOR_MOBILE_TOOLBAR:z,[F,M]=c.useState(new Set),[q,L]=c.useState("p"),[w,U]=c.useState("#000000"),[P,V]=c.useState("#fef08a"),[J,G]=c.useState([]),[$,Q]=c.useState([]);c.useEffect(()=>{const e="bear-rich-editor-styles";if(!document.getElementById(e)){const n=document.createElement("style");n.id=e,n.textContent=f.RICH_EDITOR_CONTENT_STYLES,document.head.appendChild(n)}},[]),c.useEffect(()=>{a.current&&x!==void 0&&a.current.innerHTML!==x&&(a.current.innerHTML=x)},[x]),c.useEffect(()=>{a.current&&E&&!x&&(a.current.innerHTML=E)},[]);const h=c.useCallback(()=>{M(u.getActiveFormats());const e=u.queryCommandValue("formatBlock");e&&L(e.toLowerCase().replace(/[<>]/g,""))},[]),l=c.useCallback(()=>{a.current&&R&&R(a.current.innerHTML),h()},[R,h]),K=c.useCallback(e=>{var d;if(o||i)return;(d=a.current)==null||d.focus();const n=f.RICH_EDITOR_BUTTON_CONFIG[e];if(!n)return;const g="value"in n?n.value:void 0;g?u.execCommand(n.command,g):u.execCommand(n.command),h(),l()},[o,i,h,l]),Y=c.useCallback(e=>{var n;o||i||((n=a.current)==null||n.focus(),u.execCommand("formatBlock",e),L(e),l())},[o,i,l]),W=c.useCallback(()=>{var d;if(o||i)return;const e=window.getSelection(),n=e&&e.toString().length>0,g=prompt("Enter URL:",n?"":"https://");g&&((d=a.current)==null||d.focus(),u.insertLink(g),l())},[o,i,l]),m=c.useCallback((e,n)=>{if(!e)return;(n==="text"?G:Q)(d=>{const s=d.filter(I=>I!==e);return[e,...s].slice(0,ae)})},[]),X=c.useCallback(e=>{var n;o||i||((n=a.current)==null||n.focus(),u.setTextColor(e),U(e),m(e,"text"),l())},[o,i,l,m]),Z=c.useCallback(e=>{var n;o||i||((n=a.current)==null||n.focus(),u.setHighlightColor(e),V(e),m(e,"highlight"),l())},[o,i,l,m]),ee=c.useCallback(e=>{var n;o||i||((n=a.current)==null||n.focus(),u.setTextColor(e),l())},[o,i,l]),te=c.useCallback(e=>{var n;o||i||((n=a.current)==null||n.focus(),u.setHighlightColor(e),l())},[o,i,l]),ne=c.useCallback(async e=>{var g;if(!y)return;const n=(g=e.clipboardData)==null?void 0:g.items;if(n)for(let d=0;d<n.length;d++){const s=n[d];if(s.type.startsWith("image/")){e.preventDefault();const I=s.getAsFile();if(I){const _=await u.fileToDataUrl(I);u.insertImage(_),l()}return}}},[y,l]),oe=c.useCallback(()=>{if(o||i)return;const e=document.createElement("input");e.type="file",e.accept="image/*",e.onchange=async n=>{var d,s;const g=(d=n.target.files)==null?void 0:d[0];if(g){const I=await u.fileToDataUrl(g);(s=a.current)==null||s.focus(),u.insertImage(I),l()}},e.click()},[o,i,l]),ie={bold:t.jsx(r.BoldIcon,{size:16}),italic:t.jsx(r.ItalicIcon,{size:16}),underline:t.jsx(r.UnderlineIcon,{size:16}),strikethrough:t.jsx(r.StrikethroughIcon,{size:16}),heading1:t.jsx(r.Heading1Icon,{size:16}),heading2:t.jsx(r.Heading2Icon,{size:16}),heading3:t.jsx(r.Heading3Icon,{size:16}),bulletList:t.jsx(r.ListBulletIcon,{size:16}),orderedList:t.jsx(r.ListNumberedIcon,{size:16}),blockquote:t.jsx(r.QuoteIcon,{size:16}),code:t.jsx(r.CodeIcon,{size:16}),link:t.jsx(r.InsertLinkIcon,{size:16}),alignLeft:t.jsx(r.AlignLeftIcon,{size:16}),alignCenter:t.jsx(r.AlignCenterIcon,{size:16}),alignRight:t.jsx(r.AlignRightIcon,{size:16}),alignJustify:t.jsx(r.AlignJustifyIcon,{size:16}),image:t.jsx(r.InsertPhotoIcon,{size:16}),indent:t.jsx(r.IndentIncreaseIcon,{size:16}),outdent:t.jsx(r.IndentDecreaseIcon,{size:16}),clearFormat:t.jsx(r.FormatClearIcon,{size:16}),table:t.jsx(r.TableIcon,{size:16})},O=(e,n)=>{if(e==="divider")return t.jsx("div",{className:T.cn("Bear-RichEditor__divider",f.RICH_EDITOR_DIVIDER_CLASSES)},`divider-${n}`);if(e==="headingDropdown")return t.jsx(se.ToolbarDropdown,{options:f.RICH_EDITOR_HEADING_OPTIONS,value:q,onChange:Y,title:"Text Style",disabled:o||i,icon:t.jsx(r.TextIcon,{size:16})},"heading-dropdown");if(e==="textColor")return t.jsx(H.ToolbarColorPicker,{value:w,onChange:X,title:"Text Color",disabled:o||i,type:"text",recentColors:J,onApplyLast:ee},"text-color");if(e==="highlightColor")return t.jsx(H.ToolbarColorPicker,{value:P,onChange:Z,title:"Highlight Color",disabled:o||i,type:"highlight",recentColors:$,onApplyLast:te},"highlight-color");if(e==="link")return t.jsx(C.ToolbarButton,{icon:t.jsx(r.InsertLinkIcon,{size:16}),title:"Insert Link",onClick:W,disabled:o||i},"link");if(e==="image")return t.jsx(C.ToolbarButton,{icon:t.jsx(r.InsertPhotoIcon,{size:16}),title:"Insert Image",onClick:oe,disabled:o||i},"image");if(e==="alignLeft")return t.jsx(C.ToolbarButton,{icon:t.jsx(r.AlignLeftIcon,{size:16}),title:"Align Left",onClick:()=>{var s;(s=a.current)==null||s.focus(),u.execCommand("justifyLeft"),l()},disabled:o||i},"alignLeft");if(e==="alignCenter")return t.jsx(C.ToolbarButton,{icon:t.jsx(r.AlignCenterIcon,{size:16}),title:"Align Center",onClick:()=>{var s;(s=a.current)==null||s.focus(),u.execCommand("justifyCenter"),l()},disabled:o||i},"alignCenter");if(e==="alignRight")return t.jsx(C.ToolbarButton,{icon:t.jsx(r.AlignRightIcon,{size:16}),title:"Align Right",onClick:()=>{var s;(s=a.current)==null||s.focus(),u.execCommand("justifyRight"),l()},disabled:o||i},"alignRight");if(e==="alignJustify")return t.jsx(C.ToolbarButton,{icon:t.jsx(r.AlignJustifyIcon,{size:16}),title:"Justify",onClick:()=>{var s;(s=a.current)==null||s.focus(),u.execCommand("justifyFull"),l()},disabled:o||i},"alignJustify");if(e==="indent")return t.jsx(C.ToolbarButton,{icon:t.jsx(r.IndentIncreaseIcon,{size:16}),title:"Increase Indent",onClick:()=>{var s;(s=a.current)==null||s.focus(),u.execCommand("indent"),l()},disabled:o||i},"indent");if(e==="outdent")return t.jsx(C.ToolbarButton,{icon:t.jsx(r.IndentDecreaseIcon,{size:16}),title:"Decrease Indent",onClick:()=>{var s;(s=a.current)==null||s.focus(),u.execCommand("outdent"),l()},disabled:o||i},"outdent");if(e==="clearFormat")return t.jsx(C.ToolbarButton,{icon:t.jsx(r.FormatClearIcon,{size:16}),title:"Clear Formatting",onClick:()=>{var s;(s=a.current)==null||s.focus(),u.execCommand("removeFormat"),l()},disabled:o||i},"clearFormat");if(e==="more"){const s=p?f.RICH_EDITOR_MOBILE_MORE_ITEMS:["alignLeft","alignCenter","alignRight","alignJustify","indent","outdent","blockquote","code","clearFormat"];return t.jsx(le.ToolbarMore,{disabled:o||i,isMobile:p,children:s.map((I,_)=>O(I,_+1e3))},"more")}const g=f.RICH_EDITOR_BUTTON_CONFIG[e],d=ie[e];return!g||!d?null:t.jsx(C.ToolbarButton,{icon:d,title:g.title,active:F.has(e),onClick:()=>K(e),disabled:o||i},e)};return t.jsxs("div",{id:v,"data-testid":D,className:T.cn("Bear-RichEditor",f.RICH_EDITOR_ROOT_CLASSES,o&&"Bear-RichEditor--disabled",i&&"Bear-RichEditor--readonly",A),...N,children:[k.length>0&&t.jsx("div",{className:T.cn("Bear-RichEditor__toolbar",f.RICH_EDITOR_TOOLBAR_CLASSES),children:k.map((e,n)=>O(e,n))}),t.jsx("div",{ref:a,contentEditable:!o&&!i,onInput:l,onSelect:h,onKeyUp:h,onMouseUp:h,onPaste:ne,"data-placeholder":S,className:T.cn("Bear-RichEditor__content",f.RICH_EDITOR_CONTENT_CLASSES,"[&:empty]:before:bear-content-[attr(data-placeholder)] [&:empty]:before:bear-text-gray-400 [&:empty]:before:bear-pointer-events-none",o&&"Bear-RichEditor__content--disabled bear-opacity-50 bear-cursor-not-allowed"),style:{minHeight:typeof j=="number"?`${j}px`:j,maxHeight:b?typeof b=="number"?`${b}px`:b:void 0,overflowY:b?"auto":void 0}})]})};exports.RichEditor=ce;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=150,
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=150,i=["headingDropdown","divider","bold","italic","underline","strikethrough","divider","textColor","highlightColor","divider","alignLeft","alignCenter","alignRight","alignJustify","divider","bulletList","orderedList","divider","indent","outdent","divider","blockquote","code","link","image","divider","clearFormat"],o=["headingDropdown","divider","bold","italic","strikethrough","divider","more"],r=["underline","textColor","highlightColor","divider","alignLeft","alignCenter","alignRight","alignJustify","divider","bulletList","orderedList","divider","indent","outdent","divider","blockquote","code","link","image","divider","clearFormat"],a=640,n="Bear-RichEditor rounded-lg border border-gray-200 dark:border-zinc-700 overflow-hidden bg-white dark:bg-zinc-900 shadow-sm",d="flex flex-wrap items-center gap-0.5 p-2 border-b border-gray-200 dark:border-zinc-700 bg-gray-50 dark:bg-zinc-800 overflow-x-auto overflow-y-hidden",l="p-4 outline-none max-w-none text-gray-900 dark:text-gray-100 bg-white dark:bg-zinc-900 min-h-[100px]",c="w-px h-5 bg-gray-300 dark:bg-zinc-600 mx-1",m="p-1.5 rounded transition-colors",_="bg-pink-500 text-white",g="text-gray-700 dark:text-gray-300 hover:bg-gray-200 dark:hover:bg-zinc-700",s="opacity-50 cursor-not-allowed",h=[{value:"p",label:"Paragraph",preview:e.jsx("span",{className:"bear-text-sm bear-font-normal",children:"Normal text"})},{value:"h1",label:"Heading 1",preview:e.jsx("span",{className:"bear-text-2xl bear-font-bold",children:"Heading 1"})},{value:"h2",label:"Heading 2",preview:e.jsx("span",{className:"bear-text-xl bear-font-bold",children:"Heading 2"})},{value:"h3",label:"Heading 3",preview:e.jsx("span",{className:"bear-text-lg bear-font-semibold",children:"Heading 3"})},{value:"h4",label:"Heading 4",preview:e.jsx("span",{className:"bear-text-base bear-font-semibold",children:"Heading 4"})},{value:"h5",label:"Heading 5",preview:e.jsx("span",{className:"bear-text-sm bear-font-semibold",children:"Heading 5"})},{value:"h6",label:"Heading 6",preview:e.jsx("span",{className:"bear-text-xs bear-font-semibold bear-uppercase",children:"Heading 6"})}],R={bold:{title:"Bold (Ctrl+B)",command:"bold"},italic:{title:"Italic (Ctrl+I)",command:"italic"},underline:{title:"Underline (Ctrl+U)",command:"underline"},strikethrough:{title:"Strikethrough",command:"strikeThrough"},heading1:{title:"Heading 1",command:"formatBlock",value:"h1"},heading2:{title:"Heading 2",command:"formatBlock",value:"h2"},heading3:{title:"Heading 3",command:"formatBlock",value:"h3"},heading4:{title:"Heading 4",command:"formatBlock",value:"h4"},heading5:{title:"Heading 5",command:"formatBlock",value:"h5"},heading6:{title:"Heading 6",command:"formatBlock",value:"h6"},paragraph:{title:"Paragraph",command:"formatBlock",value:"p"},bulletList:{title:"Bullet List",command:"insertUnorderedList"},orderedList:{title:"Numbered List",command:"insertOrderedList"},blockquote:{title:"Quote",command:"formatBlock",value:"blockquote"},code:{title:"Code Block",command:"formatBlock",value:"pre"},link:{title:"Insert Link",command:"createLink"},image:{title:"Insert Image",command:"insertImage"},textColor:{title:"Text Color",command:"foreColor"},highlightColor:{title:"Highlight Color",command:"hiliteColor"},alignLeft:{title:"Align Left",command:"justifyLeft"},alignCenter:{title:"Align Center",command:"justifyCenter"},alignRight:{title:"Align Right",command:"justifyRight"},alignJustify:{title:"Justify",command:"justifyFull"},indent:{title:"Increase Indent",command:"indent"},outdent:{title:"Decrease Indent",command:"outdent"},clearFormat:{title:"Clear Formatting",command:"removeFormat"},table:{title:"Insert Table",command:"insertTable"}},b=["#000000","#374151","#6b7280","#9ca3af","#d1d5db","#ffffff","#991b1b","#dc2626","#ef4444","#f87171","#fca5a5","#fee2e2","#9a3412","#ea580c","#f97316","#fb923c","#fdba74","#fed7aa","#854d0e","#ca8a04","#eab308","#facc15","#fde047","#fef08a","#166534","#16a34a","#22c55e","#4ade80","#86efac","#bbf7d0","#1e40af","#2563eb","#3b82f6","#60a5fa","#93c5fd","#bfdbfe","#6b21a8","#9333ea","#a855f7","#c084fc","#d8b4fe","#e9d5ff","#9d174d","#db2777","#ec4899","#f472b6","#f9a8d4","#fbcfe8"],E=`
|
|
2
2
|
.Bear-RichEditor__content {
|
|
3
3
|
line-height: 1.6;
|
|
4
4
|
}
|
|
@@ -138,4 +138,4 @@
|
|
|
138
138
|
.dark .Bear-RichEditor__content td {
|
|
139
139
|
border-color: #4b5563;
|
|
140
140
|
}
|
|
141
|
-
`;exports.RICH_EDITOR_BUTTON_ACTIVE_CLASSES=
|
|
141
|
+
`;exports.RICH_EDITOR_BUTTON_ACTIVE_CLASSES=_;exports.RICH_EDITOR_BUTTON_BASE_CLASSES=m;exports.RICH_EDITOR_BUTTON_CONFIG=R;exports.RICH_EDITOR_BUTTON_DISABLED_CLASSES=s;exports.RICH_EDITOR_BUTTON_INACTIVE_CLASSES=g;exports.RICH_EDITOR_COLORS=b;exports.RICH_EDITOR_CONTENT_CLASSES=l;exports.RICH_EDITOR_CONTENT_STYLES=E;exports.RICH_EDITOR_DEFAULT_TOOLBAR=i;exports.RICH_EDITOR_DIVIDER_CLASSES=c;exports.RICH_EDITOR_HEADING_OPTIONS=h;exports.RICH_EDITOR_MIN_HEIGHT=t;exports.RICH_EDITOR_MOBILE_BREAKPOINT=a;exports.RICH_EDITOR_MOBILE_MORE_ITEMS=r;exports.RICH_EDITOR_MOBILE_TOOLBAR=o;exports.RICH_EDITOR_ROOT_CLASSES=n;exports.RICH_EDITOR_TOOLBAR_CLASSES=d;
|
|
@@ -2,9 +2,12 @@ import { ToolbarOption, DropdownOption } from './RichEditor.types';
|
|
|
2
2
|
export declare const RICH_EDITOR_MIN_HEIGHT = 150;
|
|
3
3
|
export declare const RICH_EDITOR_DEFAULT_TOOLBAR: ToolbarOption[];
|
|
4
4
|
export declare const RICH_EDITOR_COMPACT_TOOLBAR: ToolbarOption[];
|
|
5
|
+
export declare const RICH_EDITOR_MOBILE_TOOLBAR: ToolbarOption[];
|
|
6
|
+
export declare const RICH_EDITOR_MOBILE_MORE_ITEMS: ToolbarOption[];
|
|
7
|
+
export declare const RICH_EDITOR_MOBILE_BREAKPOINT = 640;
|
|
5
8
|
export declare const RICH_EDITOR_SIMPLE_TOOLBAR: ToolbarOption[];
|
|
6
9
|
export declare const RICH_EDITOR_ROOT_CLASSES = "Bear-RichEditor rounded-lg border border-gray-200 dark:border-zinc-700 overflow-hidden bg-white dark:bg-zinc-900 shadow-sm";
|
|
7
|
-
export declare const RICH_EDITOR_TOOLBAR_CLASSES = "flex flex-wrap items-center gap-0.5 p-2 border-b border-gray-200 dark:border-zinc-700 bg-gray-50 dark:bg-zinc-800";
|
|
10
|
+
export declare const RICH_EDITOR_TOOLBAR_CLASSES = "flex flex-wrap items-center gap-0.5 p-2 border-b border-gray-200 dark:border-zinc-700 bg-gray-50 dark:bg-zinc-800 overflow-x-auto overflow-y-hidden";
|
|
8
11
|
export declare const RICH_EDITOR_CONTENT_CLASSES = "p-4 outline-none max-w-none text-gray-900 dark:text-gray-100 bg-white dark:bg-zinc-900 min-h-[100px]";
|
|
9
12
|
export declare const RICH_EDITOR_DIVIDER_CLASSES = "w-px h-5 bg-gray-300 dark:bg-zinc-600 mx-1";
|
|
10
13
|
export declare const RICH_EDITOR_BUTTON_BASE_CLASSES = "p-1.5 rounded transition-colors";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as e } from "react/jsx-runtime";
|
|
2
|
-
const
|
|
2
|
+
const i = 150, o = [
|
|
3
3
|
"headingDropdown",
|
|
4
4
|
"divider",
|
|
5
5
|
"bold",
|
|
@@ -27,7 +27,37 @@ const a = 150, o = [
|
|
|
27
27
|
"image",
|
|
28
28
|
"divider",
|
|
29
29
|
"clearFormat"
|
|
30
|
-
], r =
|
|
30
|
+
], r = [
|
|
31
|
+
"headingDropdown",
|
|
32
|
+
"divider",
|
|
33
|
+
"bold",
|
|
34
|
+
"italic",
|
|
35
|
+
"strikethrough",
|
|
36
|
+
"divider",
|
|
37
|
+
"more"
|
|
38
|
+
], a = [
|
|
39
|
+
"underline",
|
|
40
|
+
"textColor",
|
|
41
|
+
"highlightColor",
|
|
42
|
+
"divider",
|
|
43
|
+
"alignLeft",
|
|
44
|
+
"alignCenter",
|
|
45
|
+
"alignRight",
|
|
46
|
+
"alignJustify",
|
|
47
|
+
"divider",
|
|
48
|
+
"bulletList",
|
|
49
|
+
"orderedList",
|
|
50
|
+
"divider",
|
|
51
|
+
"indent",
|
|
52
|
+
"outdent",
|
|
53
|
+
"divider",
|
|
54
|
+
"blockquote",
|
|
55
|
+
"code",
|
|
56
|
+
"link",
|
|
57
|
+
"image",
|
|
58
|
+
"divider",
|
|
59
|
+
"clearFormat"
|
|
60
|
+
], n = 640, d = "Bear-RichEditor rounded-lg border border-gray-200 dark:border-zinc-700 overflow-hidden bg-white dark:bg-zinc-900 shadow-sm", l = "flex flex-wrap items-center gap-0.5 p-2 border-b border-gray-200 dark:border-zinc-700 bg-gray-50 dark:bg-zinc-800 overflow-x-auto overflow-y-hidden", c = "p-4 outline-none max-w-none text-gray-900 dark:text-gray-100 bg-white dark:bg-zinc-900 min-h-[100px]", m = "w-px h-5 bg-gray-300 dark:bg-zinc-600 mx-1", g = "p-1.5 rounded transition-colors", s = "bg-pink-500 text-white", h = "text-gray-700 dark:text-gray-300 hover:bg-gray-200 dark:hover:bg-zinc-700", b = "opacity-50 cursor-not-allowed", f = [
|
|
31
61
|
{ value: "p", label: "Paragraph", preview: /* @__PURE__ */ e("span", { className: "bear-text-sm bear-font-normal", children: "Normal text" }) },
|
|
32
62
|
{ value: "h1", label: "Heading 1", preview: /* @__PURE__ */ e("span", { className: "bear-text-2xl bear-font-bold", children: "Heading 1" }) },
|
|
33
63
|
{ value: "h2", label: "Heading 2", preview: /* @__PURE__ */ e("span", { className: "bear-text-xl bear-font-bold", children: "Heading 2" }) },
|
|
@@ -35,7 +65,7 @@ const a = 150, o = [
|
|
|
35
65
|
{ value: "h4", label: "Heading 4", preview: /* @__PURE__ */ e("span", { className: "bear-text-base bear-font-semibold", children: "Heading 4" }) },
|
|
36
66
|
{ value: "h5", label: "Heading 5", preview: /* @__PURE__ */ e("span", { className: "bear-text-sm bear-font-semibold", children: "Heading 5" }) },
|
|
37
67
|
{ value: "h6", label: "Heading 6", preview: /* @__PURE__ */ e("span", { className: "bear-text-xs bear-font-semibold bear-uppercase", children: "Heading 6" }) }
|
|
38
|
-
],
|
|
68
|
+
], _ = {
|
|
39
69
|
bold: { title: "Bold (Ctrl+B)", command: "bold" },
|
|
40
70
|
italic: { title: "Italic (Ctrl+I)", command: "italic" },
|
|
41
71
|
underline: { title: "Underline (Ctrl+U)", command: "underline" },
|
|
@@ -63,7 +93,7 @@ const a = 150, o = [
|
|
|
63
93
|
outdent: { title: "Decrease Indent", command: "outdent" },
|
|
64
94
|
clearFormat: { title: "Clear Formatting", command: "removeFormat" },
|
|
65
95
|
table: { title: "Insert Table", command: "insertTable" }
|
|
66
|
-
},
|
|
96
|
+
}, p = [
|
|
67
97
|
// Row 1: Grayscale
|
|
68
98
|
"#000000",
|
|
69
99
|
"#374151",
|
|
@@ -120,7 +150,7 @@ const a = 150, o = [
|
|
|
120
150
|
"#f472b6",
|
|
121
151
|
"#f9a8d4",
|
|
122
152
|
"#fbcfe8"
|
|
123
|
-
],
|
|
153
|
+
], u = `
|
|
124
154
|
.Bear-RichEditor__content {
|
|
125
155
|
line-height: 1.6;
|
|
126
156
|
}
|
|
@@ -262,18 +292,21 @@ const a = 150, o = [
|
|
|
262
292
|
}
|
|
263
293
|
`;
|
|
264
294
|
export {
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
295
|
+
s as RICH_EDITOR_BUTTON_ACTIVE_CLASSES,
|
|
296
|
+
g as RICH_EDITOR_BUTTON_BASE_CLASSES,
|
|
297
|
+
_ as RICH_EDITOR_BUTTON_CONFIG,
|
|
298
|
+
b as RICH_EDITOR_BUTTON_DISABLED_CLASSES,
|
|
299
|
+
h as RICH_EDITOR_BUTTON_INACTIVE_CLASSES,
|
|
300
|
+
p as RICH_EDITOR_COLORS,
|
|
301
|
+
c as RICH_EDITOR_CONTENT_CLASSES,
|
|
302
|
+
u as RICH_EDITOR_CONTENT_STYLES,
|
|
273
303
|
o as RICH_EDITOR_DEFAULT_TOOLBAR,
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
304
|
+
m as RICH_EDITOR_DIVIDER_CLASSES,
|
|
305
|
+
f as RICH_EDITOR_HEADING_OPTIONS,
|
|
306
|
+
i as RICH_EDITOR_MIN_HEIGHT,
|
|
307
|
+
n as RICH_EDITOR_MOBILE_BREAKPOINT,
|
|
308
|
+
a as RICH_EDITOR_MOBILE_MORE_ITEMS,
|
|
309
|
+
r as RICH_EDITOR_MOBILE_TOOLBAR,
|
|
310
|
+
d as RICH_EDITOR_ROOT_CLASSES,
|
|
311
|
+
l as RICH_EDITOR_TOOLBAR_CLASSES
|
|
279
312
|
};
|