a tool for shared writing and social publishing
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

in text blocks use break-word instead of break-all

+14 -11
+14 -11
components/Blocks/TextBlock/index.tsx
··· 78 78 79 79 export function IOSBS(props: BlockProps) { 80 80 let selected = useUIState((s) => 81 - s.selectedBlock.find((b) => b.value === props.entityID), 81 + s.selectedBlock.find((b) => b.value === props.entityID) 82 82 ); 83 83 let [initialRender, setInitialRender] = useState(true); 84 84 useEffect(() => { ··· 97 97 }); 98 98 setTimeout(async () => { 99 99 let target = document.getElementById( 100 - elementId.block(props.entityID).container, 100 + elementId.block(props.entityID).container 101 101 ); 102 102 let vis = await isVisible(target as Element); 103 103 if (!vis) { 104 104 let parentEl = document.getElementById( 105 - elementId.card(props.parent).container, 105 + elementId.card(props.parent).container 106 106 ); 107 107 if (!parentEl) return; 108 108 parentEl?.scrollBy({ ··· 152 152 } 153 153 154 154 export function BaseTextBlock( 155 - props: BlockProps & { className: string; blockPadding: string }, 155 + props: BlockProps & { className: string; blockPadding: string } 156 156 ) { 157 157 const [mount, setMount] = useState<HTMLElement | null>(null); 158 158 ··· 168 168 }, [rep?.rep]); 169 169 170 170 let selected = useUIState((s) => 171 - s.selectedBlock.find((b) => b.value === props.entityID), 171 + s.selectedBlock.find((b) => b.value === props.entityID) 172 172 ); 173 173 let first = props.previousBlock === null; 174 174 let headingLevel = useEntity(props.entityID, "block/heading-level"); ··· 176 176 let [value, factID] = useYJSValue(props.entityID); 177 177 178 178 let editorState = useEditorStates( 179 - (s) => s.editorStates[props.entityID], 179 + (s) => s.editorStates[props.entityID] 180 180 )?.editor; 181 181 useEffect(() => { 182 182 if (!editorState) ··· 243 243 await addLinkBlock( 244 244 editorState.doc.textContent, 245 245 props.entityID, 246 - rep.rep, 246 + rep.rep 247 247 ); 248 248 } 249 249 }} ··· 260 260 }, 5); 261 261 }} 262 262 id={elementId.block(props.entityID).text} 263 + // unless we break *only* on urls, this is better than tailwind 'break-all' 264 + // b/c break-all can cause breaks in the middle of words, but break-word still 265 + // forces break if a single text string (e.g. a url) spans more than a full line 266 + style={{ wordBreak: "break-word" }} 263 267 className={` 264 - break-all 265 268 grow resize-none align-top whitespace-pre-wrap bg-transparent 266 269 outline-none 267 270 ${props.blockPadding} ··· 328 331 ) { 329 332 toggleMark(args.mark, args.attrs)(view.state, view.dispatch); 330 333 } else setMark(args.mark, args.attrs)(view.state, view.dispatch); 331 - }, 334 + } 332 335 ); 333 336 useAppEventListener(props.entityID, "toggleMark", cb, []); 334 337 return null; ··· 355 358 356 359 // scroll card if cursor is at the very top or very bottom of the card 357 360 let parentID = document.getElementById( 358 - elementId.card(props.parentID).container, 361 + elementId.card(props.parentID).container 359 362 ); 360 363 let parentHeight = parentID?.clientHeight; 361 364 let cursorPosY = coords.top; ··· 390 393 }; 391 394 }); 392 395 }, 393 - [props.entityID], 396 + [props.entityID] 394 397 ); 395 398 return null; 396 399 };