From 3bc00bae7d7569920d3d6f6221c7a57cabd80e35 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Mon, 27 Jan 2025 11:41:40 -0500
Subject: adjusted dash field views to work with new schemacells (eg mermaids
 docs)

---
 src/client/views/nodes/formattedText/DashFieldView.tsx | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

(limited to 'src/client/views/nodes/formattedText/DashFieldView.tsx')

diff --git a/src/client/views/nodes/formattedText/DashFieldView.tsx b/src/client/views/nodes/formattedText/DashFieldView.tsx
index f0313fba4..0684daeb6 100644
--- a/src/client/views/nodes/formattedText/DashFieldView.tsx
+++ b/src/client/views/nodes/formattedText/DashFieldView.tsx
@@ -5,7 +5,7 @@ import { observer } from 'mobx-react';
 import { NodeSelection } from 'prosemirror-state';
 import * as React from 'react';
 import * as ReactDOM from 'react-dom/client';
-import { returnFalse, returnZero, setupMoveUpEvents } from '../../../../ClientUtils';
+import { returnFalse, returnTrue, returnZero, setupMoveUpEvents } from '../../../../ClientUtils';
 import { Doc, DocListCast, Field } from '../../../../fields/Doc';
 import { List } from '../../../../fields/List';
 import { listSpec } from '../../../../fields/Schema';
@@ -169,12 +169,17 @@ export class DashFieldViewInternal extends ObservableReactComponent<IDashFieldVi
                     selectedCells={this.selectedCells}
                     selectedCol={returnZero}
                     fieldKey={this._fieldKey}
+                    highlightCells={emptyFunction} // fix
+                    refSelectModeInfo={{ enabled: false, currEditing: undefined }} // fix
+                    selectReference={emptyFunction} //
+                    eqHighlightFunc={() => []} // fix
+                    isolatedSelection={() => [true, true]} // fix
+                    rowSelected={returnTrue} //fix
                     rowHeight={returnZero}
                     isRowActive={this.isRowActive}
                     padding={0}
                     getFinfo={emptyFunction}
                     setColumnValues={returnFalse}
-                    setSelectedColumnValues={returnFalse}
                     allowCRs
                     oneLine={!this._expanded && !this._props.nodeSelected()}
                     finishEdit={this.finishEdit}
-- 
cgit v1.2.3-70-g09d2


From 82ba2c85e22fb809f1a5fba827c73555db0e4cd9 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Fri, 7 Mar 2025 13:46:59 -0500
Subject: fixed columnWidth settings for sidebar.  fixed color picker and other
 dropdowns to toggle when button is clicked. fixed dash field views to
 collapse properly.   fixed rtf to honor marks that were set before text box
 is created and typing starts.

---
 .../src/components/ColorPicker/ColorPicker.tsx     | 336 +++++++++------------
 .../src/components/IconButton/IconButton.tsx       | 280 +++++++++--------
 packages/components/src/components/Popup/Popup.tsx |  61 ++--
 src/client/documents/DocUtils.ts                   |   4 +-
 src/client/documents/Documents.ts                  |   3 +-
 src/client/util/CurrentUserUtils.ts                |   8 +-
 .../collectionSchema/SchemaTableCell.tsx           |   2 +-
 .../views/nodes/FontIconBox/FontIconBox.scss       |  20 +-
 src/client/views/nodes/FontIconBox/FontIconBox.tsx |   5 +-
 .../views/nodes/formattedText/DashFieldView.tsx    |   4 +-
 .../views/nodes/formattedText/FormattedTextBox.tsx |   3 +-
 11 files changed, 340 insertions(+), 386 deletions(-)

(limited to 'src/client/views/nodes/formattedText/DashFieldView.tsx')

diff --git a/packages/components/src/components/ColorPicker/ColorPicker.tsx b/packages/components/src/components/ColorPicker/ColorPicker.tsx
index 51b820a37..632b470f0 100644
--- a/packages/components/src/components/ColorPicker/ColorPicker.tsx
+++ b/packages/components/src/components/ColorPicker/ColorPicker.tsx
@@ -1,204 +1,156 @@
-import React, { useState } from 'react'
-import { GithubPicker, ChromePicker, BlockPicker, SliderPicker, SketchPicker } from 'react-color'
-import { IGlobalProps, Size, Type , getFormLabelSize } from '../../global'
-import { Button } from '../Button'
-import { IconButton } from '../IconButton'
-import { Popup, PopupTrigger } from '../Popup'
-import './ColorPicker.scss'
-import { Dropdown, DropdownType } from '../Dropdown'
+import React, { useRef, useState } from 'react';
+import { GithubPicker, ChromePicker, BlockPicker, SliderPicker, SketchPicker } from 'react-color';
+import { IGlobalProps, Size, Type, getFormLabelSize } from '../../global';
+import { Button } from '../Button';
+import { IconButton } from '../IconButton';
+import { Popup, PopupTrigger } from '../Popup';
+import './ColorPicker.scss';
+import { Dropdown, DropdownType } from '../Dropdown';
 
-export const ColorPickerArray= ["Classic", "Chrome", "GitHub", "Block", "Slider"]
-export type ColorPickerType= typeof ColorPickerArray[number];
+export const ColorPickerArray = ['Classic', 'Chrome', 'GitHub', 'Block', 'Slider'];
+export type ColorPickerType = (typeof ColorPickerArray)[number];
 
 export interface IColorPickerProps extends IGlobalProps {
-  text?: string
-  icon?: JSX.Element | string
-  colorPickerType?: ColorPickerType
-  defaultPickerType?: ColorPickerType
-  selectedColor?: string
-  setSelectedColor: (color: any) => unknown
-  setFinalColor: (color:any) => unknown
+    text?: string;
+    icon?: JSX.Element | string;
+    colorPickerType?: ColorPickerType;
+    defaultPickerType?: ColorPickerType;
+    selectedColor?: string;
+    setSelectedColor: (color: any) => unknown;
+    setFinalColor: (color: any) => unknown;
 }
 
 export const ColorPicker = (props: IColorPickerProps) => {
-  const [selectedColorLoc, setSelectedColorLoc] = useState();
-  const { defaultPickerType, text, colorPickerType, fillWidth, formLabelPlacement, size = Size.SMALL, type = Type.TERT, icon, selectedColor = selectedColorLoc, setSelectedColor = setSelectedColorLoc, setFinalColor = setSelectedColorLoc, tooltip, color='black', formLabel } = props
-  const [isOpen, setOpen] = useState<boolean>(false)
-  const [pickerSelectorOpen, setPickerSelectorOpen] = useState<boolean>(false);
-  const decimalToHexString = (number: number) => {
-    if (number < 0) {
-        number = 0xffffffff + number + 1;
-    }
-    return (number < 16 ? '0' : '') + number.toString(16).toUpperCase();
-}
-  const colorString = (color: any ) => {
-    return color.hex === 'transparent' ? color.hex: color.hex + (color.rgb.a ? decimalToHexString(Math.round(color.rgb.a * 255)) : 'ff');
-  }
-  const onChange = (color: any) => {
-    setSelectedColor(colorString(color) as any);
-  }
-  const onChangeComplete = (color: any) => {
-    setFinalColor(colorString(color) as any);
-  }
-  const [picker, setPicker] = useState<string>(defaultPickerType ?? "Classic")
+    const [selectedColorLoc, setSelectedColorLoc] = useState();
+    const {
+        defaultPickerType,
+        text,
+        colorPickerType,
+        fillWidth,
+        formLabelPlacement,
+        size = Size.SMALL,
+        type = Type.TERT,
+        icon,
+        selectedColor = selectedColorLoc,
+        setSelectedColor = setSelectedColorLoc,
+        setFinalColor = setSelectedColorLoc,
+        tooltip,
+        color = 'black',
+        formLabel,
+    } = props;
+    const [isOpen, setOpen] = useState<boolean>(false);
+    const [pickerSelectorOpen, setPickerSelectorOpen] = useState<boolean>(false);
+    const decimalToHexString = (number: number) => {
+        if (number < 0) {
+            number = 0xffffffff + number + 1;
+        }
+        return (number < 16 ? '0' : '') + number.toString(16).toUpperCase();
+    };
+    const colorString = (color: any) => {
+        return color.hex === 'transparent' ? color.hex : color.hex + (color.rgb.a ? decimalToHexString(Math.round(color.rgb.a * 255)) : 'ff');
+    };
+    const onChange = (color: any) => {
+        setSelectedColor(colorString(color) as any);
+    };
+    const onChangeComplete = (color: any) => {
+        setFinalColor(colorString(color) as any);
+    };
+    const [picker, setPicker] = useState<string>(defaultPickerType ?? 'Classic');
 
-  const getToggle = () => {
-    if (icon && !text) {
-      return (
-        <IconButton
-          active={isOpen}
-          tooltip={tooltip}
-          type={type}
-          color={color}
-          size={size}
-          icon={icon}
-          colorPicker={selectedColor}
-          fillWidth={fillWidth}
-        />
-      )
-    } else if (text) {
-      return (
-        <Button
-          active={isOpen}
-          tooltip={tooltip}
-          size={size}
-          type={type}
-          color={color}
-          text={text}
-          icon={icon}
-          align={'flex-start'}
-          iconPlacement={'left'}
-          colorPicker={selectedColor}
-          fillWidth={fillWidth}
-        />
-      )
-    } else {
-      return (
-        <IconButton
-          active={isOpen}
-          tooltip={tooltip}
-          type={type}
-          color={color}
-          size={size}
-          icon={icon}
-          colorPicker={selectedColor}
-          fillWidth={fillWidth}
-        />
-      )
-    }
-  }
+    const toggleRef = useRef<HTMLDivElement | null>(null);
+    const getToggle = () => (
+        <div ref={toggleRef}>
+            {icon && !text ? (
+                <IconButton active={isOpen} tooltip={tooltip} type={type} color={color} size={size} icon={icon} colorPicker={selectedColor} fillWidth={fillWidth} />
+            ) : text ? (
+                <Button active={isOpen} tooltip={tooltip} size={size} type={type} color={color} text={text} icon={icon} align={'flex-start'} iconPlacement={'left'} colorPicker={selectedColor} fillWidth={fillWidth} />
+            ) : (
+                <IconButton active={isOpen} tooltip={tooltip} type={type} color={color} size={size} icon={icon} colorPicker={selectedColor} fillWidth={fillWidth} />
+            )}
+        </div>
+    );
 
-  const getColorPicker = (pickerType: ColorPickerType):JSX.Element => {
-    const colorPalette = ["FFFFFF", "#F9F6F2", "#E2E2E2", "#D1D1D1", "#737576", "#4b4a4d", "#222021", 
-    '#EB9694', '#FAD0C3', '#FEF3BD', '#C1E1C5', '#BEDADC', '#C4DEF6', '#BED3F3', '#D4C4FB', "transparent"
-    ]
-    switch(pickerType) {
-      case "Block":
-        return (
-          <BlockPicker
-            color={selectedColor}
-            triangle={'hide'}
-            colors={colorPalette}
-            onChange={onChange}
-            onChangeComplete={onChangeComplete}
-          />
-        );
-      case "Classic":
-        return (<SketchPicker
-          onChange={onChange}
-          onChangeComplete={onChangeComplete}
-          presetColors={['#D0021B', '#F5A623', '#F8E71C', '#8B572A', '#7ED321', '#417505', '#9013FE', '#4A90E2', '#50E3C2', '#B8E986', '#000000', '#4A4A4A', '#9B9B9B', '#FFFFFF', '#f1efeb', 'transparent']}
-          color={selectedColor}
-        />);
-      case "Chrome":
-      default:
-        return (
-          <ChromePicker
-            color={selectedColor}
-            onChange={onChange}
-            onChangeComplete={onChangeComplete}
-          />
-        );
-      case "GitHub":
-        return (
-          <GithubPicker
-            color={selectedColor}
-            colors={colorPalette}
-            triangle={'hide'}
-            onChange={onChange}
-            onChangeComplete={onChangeComplete}
-          />
-        );
-      case "Slider":
-        return (
-          <div style={{width: 200, height: 50}}>
-          <SliderPicker
-            color={selectedColor}
-            onChange={onChange}
-            onChangeComplete={onChangeComplete}
-          />
-          </div>
-        );
-    }
-  }
-  const openChanged = (isOpen:boolean) => setPickerSelectorOpen(isOpen);
+    const getColorPicker = (pickerType: ColorPickerType): JSX.Element => {
+        const colorPalette = ['FFFFFF', '#F9F6F2', '#E2E2E2', '#D1D1D1', '#737576', '#4b4a4d', '#222021', '#EB9694', '#FAD0C3', '#FEF3BD', '#C1E1C5', '#BEDADC', '#C4DEF6', '#BED3F3', '#D4C4FB', 'transparent'];
+        switch (pickerType) {
+            case 'Classic':  return (
+                    <SketchPicker
+                        onChange={onChange}
+                        onChangeComplete={onChangeComplete}
+                        presetColors={['#D0021B', '#F5A623', '#F8E71C', '#8B572A', '#7ED321', '#417505', '#9013FE', '#4A90E2', '#50E3C2', '#B8E986', '#000000', '#4A4A4A', '#9B9B9B', '#FFFFFF', '#f1efeb', 'transparent']}
+                        color={selectedColor}
+                    />
+                );
+            case 'Chrome':
+            default:        return <ChromePicker color={selectedColor} onChange={onChange} onChangeComplete={onChangeComplete} />;
+            case 'GitHub':  return <GithubPicker color={selectedColor} colors={colorPalette} triangle={'hide'} onChange={onChange} onChangeComplete={onChangeComplete} />;
+            case 'Block':   return <BlockPicker color={selectedColor} triangle={'hide'} colors={colorPalette} onChange={onChange} onChangeComplete={onChangeComplete} />;
+            case 'Slider':  return (
+                    <div style={{ width: 200, height: 50 }}>
+                        <SliderPicker color={selectedColor} onChange={onChange} onChangeComplete={onChangeComplete} />
+                    </div>
+                );
+        } // prettier-ignore
+    };
+    const openChanged = (isOpen: boolean) => setPickerSelectorOpen(isOpen);
 
-  const getPopup = ():JSX.Element => {
-    if (colorPickerType){
-      return getColorPicker(colorPickerType)
-    } else {
-      // Todo: this would be much easier if the selectedColor was a Color, not a string.
-      const newColor =  (selectedColor === 'transparent' ? 'white': selectedColor?.startsWith("#") ? selectedColor.substring(0,7):
-                         selectedColor?.startsWith('rgba') ? selectedColor?.replace(/,[0-9]*\)/,"1)") : selectedColor);
-      return <div style={{height: 'fit-content'}}>
-        <Dropdown
-          items={
-            ColorPickerArray.map((item) => {
-              return {
-                text: item,
-                val: item,
-              }
-            })
-          }
-          activeChanged={openChanged}
-          placement={'right'}
-          color={newColor}
-          type={Type.PRIM}
-          dropdownType={DropdownType.SELECT}
-          selectedVal={picker}
-          setSelectedVal={(val) => setPicker(val as string)}
-          fillWidth
-        />
-        {getColorPicker(picker)}
-      </div>
-    } 
-  }
+    const getPopup = (): JSX.Element => {
+        if (colorPickerType) {
+            return getColorPicker(colorPickerType);
+        } else {
+            // Todo: this would be much easier if the selectedColor was a Color, not a string.
+            const newColor = selectedColor === 'transparent' ? 'white' : selectedColor?.startsWith('#') ? selectedColor.substring(0, 7) : selectedColor?.startsWith('rgba') ? selectedColor?.replace(/,[0-9]*\)/, '1)') : selectedColor;
+            return (
+                <div style={{ height: 'fit-content' }}>
+                    <Dropdown
+                        items={ColorPickerArray.map(item => {
+                            return {
+                                text: item,
+                                val: item,
+                            };
+                        })}
+                        activeChanged={openChanged}
+                        placement={'right'}
+                        color={newColor}
+                        type={Type.PRIM}
+                        dropdownType={DropdownType.SELECT}
+                        selectedVal={picker}
+                        setSelectedVal={val => setPicker(val as string)}
+                        fillWidth
+                    />
+                    {getColorPicker(picker)}
+                </div>
+            );
+        }
+    };
 
-  const popupContainsPt = (x:number, y:number) => pickerSelectorOpen;
+    const popupContainsPt = (x: number, y: number) => {
+        const rect = toggleRef.current?.getBoundingClientRect();
+        return rect && rect.left < x && rect.top < y && rect.right > x && rect.bottom > y;
+    };
 
-  const colorPicker: JSX.Element = 
-  (
-    <Popup
-        toggle={getToggle()}
-        trigger={PopupTrigger.CLICK}
-        isOpen={isOpen}
-        setOpen={setOpen}
-        tooltip={tooltip}
-        size={size}
-        color={selectedColor}
-        popup={getPopup()}
-        popupContainsPt={popupContainsPt} // this should prohbably test to see if the click pt is actually within the picker selector list popup.
-      />
-  )
+    const colorPicker: JSX.Element = (
+        <Popup
+            toggle={getToggle()}
+            trigger={PopupTrigger.CLICK}
+            isOpen={isOpen}
+            setOpen={setOpen}
+            tooltip={tooltip}
+            size={size}
+            color={selectedColor}
+            popup={getPopup()}
+            popupContainsPt={popupContainsPt} // this should prohbably test to see if the click pt is actually within the picker selector list popup.
+        />
+    );
 
-  return (
-    formLabel ? 
-      <div className={`form-wrapper ${formLabelPlacement}`}
-style={{ width: fillWidth ? '100%' : undefined}}>
-        <div className={'formLabel'} style={{fontSize: getFormLabelSize(size)}}>{formLabel}</div>
-        {colorPicker}
-      </div>
-    :
-      colorPicker
-  )
-}
+    return formLabel ? (
+        <div className={`form-wrapper ${formLabelPlacement}`} style={{ width: fillWidth ? '100%' : undefined }}>
+            <div className={'formLabel'} style={{ fontSize: getFormLabelSize(size) }}>
+                {formLabel}
+            </div>
+            {colorPicker}
+        </div>
+    ) : (
+        colorPicker
+    );
+};
diff --git a/packages/components/src/components/IconButton/IconButton.tsx b/packages/components/src/components/IconButton/IconButton.tsx
index 7d273e23f..954a0ae44 100644
--- a/packages/components/src/components/IconButton/IconButton.tsx
+++ b/packages/components/src/components/IconButton/IconButton.tsx
@@ -1,157 +1,153 @@
-import { Tooltip } from '@mui/material'
-import React from 'react'
-import { Colors, Size, Type, getFontSize, getHeight, isDark, getFormLabelSize } from '../../global'
-import { IButtonProps } from '../Button'
-import './IconButton.scss'
+import { Tooltip } from '@mui/material';
+import React from 'react';
+import { Colors, Size, Type, getFontSize, getHeight, isDark, getFormLabelSize } from '../../global';
+import { IButtonProps } from '../Button';
+import './IconButton.scss';
 
 export interface IIconButtonProps extends IButtonProps {}
 
 export const IconButton = (props: IButtonProps) => {
-  const {
-    active,
-    icon,
-    onClick,
-    onDoubleClick,
-    onPointerDown,
-    inactive,
-    type = Type.PRIM,
-    color = Colors.MEDIUM_BLUE,
-    background,
-    label,
-    height,
-    size = Size.SMALL,
-    style,
-    tooltip,
-    tooltipPlacement = 'top',
-    colorPicker,
-    formLabel,
-    formLabelPlacement,
-    hideLabel,
-    fillWidth
-  } = props
+    const {
+        active,
+        icon,
+        onClick,
+        onDoubleClick,
+        onPointerDown,
+        inactive,
+        type = Type.PRIM,
+        color = Colors.MEDIUM_BLUE,
+        background,
+        label,
+        height,
+        size = Size.SMALL,
+        style,
+        tooltip,
+        tooltipPlacement = 'top',
+        colorPicker,
+        formLabel,
+        formLabelPlacement,
+        hideLabel,
+        fillWidth,
+    } = props;
 
-  /**
-   * Pointer down
-   * @param e
-   */
-  const handlePointerDown = (e: React.PointerEvent) => {
-    
-    if (!inactive && onPointerDown) {
-      e.stopPropagation();
-      e.preventDefault();
-      onPointerDown(e)
-    }
-  }
+    /**
+     * Pointer down
+     * @param e
+     */
+    const handlePointerDown = (e: React.PointerEvent) => {
+        if (!inactive && onPointerDown) {
+            e.stopPropagation();
+            e.preventDefault();
+            onPointerDown(e);
+        }
+    };
 
-  /**
-   * In the event that there is a single click
-   * @param e
-   */
-  const handleClick = (e: React.MouseEvent) => {
-    if (!inactive && onClick) {
-      e.stopPropagation();
-      e.preventDefault();
-      onClick(e)
-    } 
-  }
+    /**
+     * In the event that there is a single click
+     * @param e
+     */
+    const handleClick = (e: React.MouseEvent) => {
+        if (!inactive && onClick) {
+            e.stopPropagation();
+            e.preventDefault();
+            onClick(e);
+        }
+    };
 
-  /**
-   * Double click
-   * @param e
-   */
-  const handleDoubleClick = (e: React.MouseEvent) => {
-    if (!inactive && onDoubleClick){
-      e.stopPropagation();
-      e.preventDefault();
-      onDoubleClick(e)
-    } 
-  }
+    /**
+     * Double click
+     * @param e
+     */
+    const handleDoubleClick = (e: React.MouseEvent) => {
+        if (!inactive && onDoubleClick) {
+            e.stopPropagation();
+            e.preventDefault();
+            onDoubleClick(e);
+        }
+    };
 
-  const getBorderColor = (): Colors | string | undefined => {
-    switch(type){
-      case Type.PRIM:
-        return undefined;
-      case Type.SEC:
-        return color;
-      case Type.TERT:
-        if (colorPicker) return colorPicker;
-        if (active) return color;
-        else return color;
-    }
-  }
+    const getBorderColor = (): Colors | string | undefined => {
+        switch (type) {
+            case Type.PRIM:
+                return undefined;
+            case Type.SEC:
+                return color;
+            case Type.TERT:
+                if (colorPicker) return colorPicker;
+                if (active) return color;
+                else return color;
+        }
+    };
 
-  const getColor = (): Colors | string | undefined => {
-    if (color && background) return color;
-    switch(type){
-      case Type.PRIM:
-        return color;
-      case Type.SEC:
-        return color;
-      case Type.TERT:
-        if (colorPicker) {
-          if (isDark(colorPicker)) return Colors.WHITE;
-          else return Colors.BLACK
+    const getColor = (): Colors | string | undefined => {
+        if (color && background) return color;
+        switch (type) {
+            case Type.PRIM:
+                return color;
+            case Type.SEC:
+                return color;
+            case Type.TERT:
+                if (colorPicker) {
+                    if (isDark(colorPicker)) return Colors.WHITE;
+                    else return Colors.BLACK;
+                }
+                if (isDark(color)) return Colors.WHITE;
+                else return Colors.BLACK;
         }
-        if (isDark(color)) return Colors.WHITE;
-        else return Colors.BLACK
-    }
-  }
+    };
 
-  const getBackground = (): Colors | string | undefined => {
-    if(background) return background;
-    switch(type){
-      case Type.PRIM:
-        return color;
-      case Type.SEC:
-        return color;
-      case Type.TERT:
-        if (colorPicker) return colorPicker
-        else return color
-    }
-  }
+    const getBackground = (): Colors | string | undefined => {
+        if (background) return background;
+        switch (type) {
+            case Type.PRIM:
+                return color;
+            case Type.SEC:
+                return color;
+            case Type.TERT:
+                if (colorPicker) return colorPicker;
+                else return color;
+        }
+    };
 
-  const defaultProperties: React.CSSProperties = {
-    height: getHeight(height, size),
-    width: fillWidth ? '100%' : getHeight(height, size),
-    minWidth: getHeight(height, size),
-    fontWeight: 500,
-    fontSize: getFontSize(size, true),
-    borderColor: getBorderColor(),
-    color: getColor()
-  }
+    const defaultProperties: React.CSSProperties = {
+        height: getHeight(height, size),
+        width: fillWidth ? '100%' : getHeight(height, size),
+        minWidth: getHeight(height, size),
+        fontWeight: 500,
+        fontSize: getFontSize(size, true),
+        borderColor: getBorderColor(),
+        color: getColor(),
+    };
 
-  const backgroundProperties: React.CSSProperties = {
-    background: getBackground()
-  }
+    const backgroundProperties: React.CSSProperties = {
+        background: getBackground(),
+    };
 
-  const iconButton: JSX.Element = (
-    <Tooltip disableInteractive={true} arrow={true} placement={tooltipPlacement} title={tooltip}>
-      <div
-        className={`iconButton-container ${type} ${inactive && 'inactive'}`}
-        onClick={handleClick}
-        onDoubleClick={handleDoubleClick}
-        onPointerDown={handlePointerDown}
-        style={{...defaultProperties, ...style}}
-        tabIndex={-1}
-      >
-        <div className="iconButton-content">
-          {icon}
-          {colorPicker && type !== (Type.TERT) && <div className={`color`} style={{background: colorPicker, outlineColor: defaultProperties.color}}/>}
-          {label && !hideLabel && <div className={'iconButton-label'} style={{color: defaultProperties.color}}>{label}</div>}
-        </div>
-        <div className={`background ${active && 'active'} ${inactive && 'inactive'}`} style={backgroundProperties}/>
-      </div>
-    </Tooltip>
-  )
+    const iconButton: JSX.Element = (
+        <Tooltip disableInteractive={true} arrow={true} placement={tooltipPlacement} title={tooltip}>
+            <div className={`iconButton-container ${type} ${inactive && 'inactive'}`} onClick={handleClick} onDoubleClick={handleDoubleClick} onPointerDown={handlePointerDown} style={{ ...defaultProperties, ...style }} tabIndex={-1}>
+                <div className="iconButton-content">
+                    {icon}
+                    {colorPicker && type !== Type.TERT && <div className={`color`} style={{ background: colorPicker, outlineColor: defaultProperties.color }} />}
+                    {label && !hideLabel && (
+                        <div className={'iconButton-label'} style={{ color: defaultProperties.color }}>
+                            {label}
+                        </div>
+                    )}
+                </div>
+                <div className={`background ${active && 'active'} ${inactive && 'inactive'}`} style={backgroundProperties} />
+            </div>
+        </Tooltip>
+    );
 
-  return (
-    formLabel ? 
-      <div className={`form-wrapper ${formLabelPlacement}`}
-style={{ width: fillWidth ? '100%' : undefined}}>
-        <div className={'formLabel'} style={{fontSize: getFormLabelSize(size)}}>{formLabel}</div>
-        {iconButton}
-      </div>
-    :
-      iconButton
-  )
-}
+    return formLabel ? (
+        <div className={`form-wrapper ${formLabelPlacement}`} style={{ width: fillWidth ? '100%' : undefined }}>
+            <div className={'formLabel'} style={{ fontSize: getFormLabelSize(size) }}>
+                {formLabel}
+            </div>
+            {iconButton}
+        </div>
+    ) : (
+        iconButton
+    );
+};
diff --git a/packages/components/src/components/Popup/Popup.tsx b/packages/components/src/components/Popup/Popup.tsx
index f0920b723..5a58fee29 100644
--- a/packages/components/src/components/Popup/Popup.tsx
+++ b/packages/components/src/components/Popup/Popup.tsx
@@ -63,12 +63,19 @@ export const Popup = (props: IPopupProps) => {
 
     const triggerRef = useRef(null);
     const popperRef = useRef<HTMLDivElement | null>(null);
+    const toggleRef = useRef<HTMLDivElement | null>(null);
 
     let timeout = setTimeout(() => {});
 
     const handlePointerAwayDown = (e: PointerEvent) => {
         const rect = popperRef.current?.getBoundingClientRect();
-        if (rect && !(rect.left < e.clientX && rect.top < e.clientY && rect.right > e.clientX && rect.bottom > e.clientY) && !popupContainsPt?.(e.clientX, e.clientY)) {
+        const rect2 = toggleRef.current?.getBoundingClientRect();
+        if (
+            (!rect2 || !(rect2.left < e.clientX && rect2.top < e.clientY && rect2.right > e.clientX && rect2.bottom > e.clientY)) &&
+            rect &&
+            !(rect.left < e.clientX && rect.top < e.clientY && rect.right > e.clientX && rect.bottom > e.clientY) &&
+            !popupContainsPt?.(e.clientX, e.clientY)
+        ) {
             e.preventDefault();
             setOpen(false);
             e.stopPropagation();
@@ -79,9 +86,7 @@ export const Popup = (props: IPopupProps) => {
         if (isOpen) {
             window.removeEventListener('pointerdown', handlePointerAwayDown, { capture: true });
             window.addEventListener('pointerdown', handlePointerAwayDown, { capture: true });
-            return () => {
-                window.removeEventListener('pointerdown', handlePointerAwayDown, { capture: true });
-            };
+            return () => window.removeEventListener('pointerdown', handlePointerAwayDown, { capture: true });
         }
     }, [isOpen, popupContainsPt]);
 
@@ -104,31 +109,31 @@ export const Popup = (props: IPopupProps) => {
                         timeout = setTimeout(() => setOpen(false), 1000);
                     }
                 }}>
-                {toggle ? (
-                    toggle
-                ) : (
-                    <Toggle
-                        tooltip={tooltip}
-                        size={size}
-                        type={type}
-                        color={color}
-                        background={props.isToggle ? undefined : background}
-                        toggleType={ToggleType.BUTTON}
-                        icon={icon}
-                        iconPlacement={iconPlacement}
-                        text={text}
-                        label={props.label}
-                        toggleStatus={isOpen || props.toggleStatus}
-                        onClick={() => {
-                            if (trigger === PopupTrigger.CLICK) {
-                                if (!props.isToggle || props.toggleStatus) {
-                                    setOpen(!isOpen);
+                {toggle ?? (
+                    <div ref={toggleRef}>
+                        <Toggle
+                            tooltip={tooltip}
+                            size={size}
+                            type={type}
+                            color={color}
+                            background={props.isToggle ? undefined : background}
+                            toggleType={ToggleType.BUTTON}
+                            icon={icon}
+                            iconPlacement={iconPlacement}
+                            text={text}
+                            label={props.label}
+                            toggleStatus={isOpen || props.toggleStatus}
+                            onClick={() => {
+                                if (trigger === PopupTrigger.CLICK) {
+                                    if (!props.isToggle || props.toggleStatus) {
+                                        setOpen(!isOpen);
+                                    }
+                                    props.toggleFunc?.();
                                 }
-                                props.toggleFunc?.();
-                            }
-                        }}
-                        fillWidth={fillWidth}
-                    />
+                            }}
+                            fillWidth={fillWidth}
+                        />
+                    </div>
                 )}
             </div>
             <Popper open={isOpen} style={{ zIndex: 20000 }} anchorEl={triggerRef.current} placement={placement} modifiers={[]}>
diff --git a/src/client/documents/DocUtils.ts b/src/client/documents/DocUtils.ts
index 42ccd0810..b216551d5 100644
--- a/src/client/documents/DocUtils.ts
+++ b/src/client/documents/DocUtils.ts
@@ -372,7 +372,9 @@ export namespace DocUtils {
      * @param pivotValue
      */
     export function addDocumentCreatorMenuItems(docTextAdder: (d: Doc) => void, docAdder: (d: Doc) => void, x: number, y: number, simpleMenu: boolean = false, pivotField?: string, pivotValue?: string | number | boolean): void {
-        const documentList: ContextMenuProps[] = DocListCast(DocListCast(Doc.MyTools?.data)[0]?.data)
+        const foo = DocListCast(DocListCast(Doc.MyTools?.data)[0]?.data).concat(...DocListCast(DocListCast(Doc.MyTools?.data)[1]?.data));
+
+        const documentList: ContextMenuProps[] = foo
             .filter(btnDoc => !btnDoc.hidden)
             .map(btnDoc => Cast(btnDoc?.dragFactory, Doc, null))
             .filter(doc => doc && doc !== Doc.UserDoc().emptyTrail && doc.title)
diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index e1aa9aca2..61b370da4 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -274,6 +274,8 @@ export class DocumentOptions {
     _layout_noSidebar?: BOOLt = new BoolInfo('whether to display the sidebar toggle button');
     layout_boxShadow?: string; // box-shadow css string OR "standard" to use dash standard box shadow
     layout_maxShown?: NUMt = new NumInfo('maximum number of children to display at one time (see multicolumnview)');
+    _layout_columnWidth?: NUMt = new NumInfo('width of table column', false);
+    _layout_columnCount?: NUMt = new NumInfo('number of columns in a masonry view');
     _layout_dontCenter?: STRt = new StrInfo("whether collections will center their content - values of 'x', 'xy', or 'y'");
     _layout_autoHeight?: BOOLt = new BoolInfo('whether document automatically resizes vertically to display contents');
     _layout_autoHeightMargins?: NUMt = new NumInfo('Margin heights to be added to the computed auto height of a Doc');
@@ -297,7 +299,6 @@ export class DocumentOptions {
     _xPadding?: NUMt = new NumInfo('x padding', false);
     _yPadding?: NUMt = new NumInfo('y padding', false);
     _createDocOnCR?: boolean; // whether carriage returns and tabs create new text documents
-    _columnWidth?: NUMt = new NumInfo('width of table column', false);
     _columnsHideIfEmpty?: BOOLt = new BoolInfo('whether stacking view column headings should be hidden');
     _caption_xMargin?: NUMt = new NumInfo('x margin of caption inside of a carousel collection', false, true);
     _caption_yMargin?: NUMt = new NumInfo('y margin of caption inside of a carousel collection', false, true);
diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index ce875ff6c..778b522c4 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -92,7 +92,7 @@ export class CurrentUserUtils {
         const reqdOpts:DocumentOptions = {
             title: "User Tools", _xMargin: 0, _layout_showTitle: "title", _chromeHidden: true, hidden: false,
             _dragOnlyWithinContainer: true, layout_hideContextMenu: true, isSystem: true, _forceActive: true,
-            _layout_autoHeight: true, _width: 500, _height: 300, _layout_fitWidth: true, _columnWidth: 35, ignoreClick: true, _lockedPosition: true,
+            _layout_autoHeight: true, _width: 500, _height: 300, _layout_fitWidth: true, _layout_columnWidth: 35, ignoreClick: true, _lockedPosition: true,
         };
         const reqdScripts = { dropConverter : "convertToButtons(dragData)" };
         const reqdFuncs = { /* hidden: "IsNoviceMode()"  */ };
@@ -181,7 +181,7 @@ export class CurrentUserUtils {
         const reqdOpts:DocumentOptions = {
             title: "Stickers", _xMargin: 0, _layout_showTitle: "title", hidden: false, _chromeHidden: true,
             _dragOnlyWithinContainer: true, layout_hideContextMenu: true, isSystem: true, _forceActive: true,
-            _layout_autoHeight: true, _width: 500, _height: 300, _layout_fitWidth: true, _columnWidth: 35, ignoreClick: true, _lockedPosition: true,
+            _layout_autoHeight: true, _width: 500, _height: 300, _layout_fitWidth: true, _layout_columnWidth: 35, ignoreClick: true, _lockedPosition: true,
         };
         const reqdScripts = {  dropConverter: "convertToButtons(dragData)"  };
         const savedAnnos = DocCast(doc[field]);
@@ -469,7 +469,7 @@ pie title Minerals in my tap water
 
         const reqdOpts:DocumentOptions = {
             title: "Document Creators", _layout_showTitle: "title", _xMargin: 0, _dragOnlyWithinContainer: true, layout_hideContextMenu: true, _chromeHidden: true, isSystem: true,
-            _layout_autoHeight: true, _width: 500, _height: 300, _layout_fitWidth: true, _columnWidth: 40, ignoreClick: true, _lockedPosition: true, _forceActive: true,
+            _layout_autoHeight: true, _width: 500, _height: 300, _layout_fitWidth: true, _layout_columnWidth: 40, ignoreClick: true, _lockedPosition: true, _forceActive: true,
              childDragAction: dropActionType.embed
         };
         const reqdScripts = { dropConverter: "convertToButtons(dragData)" };
@@ -516,7 +516,7 @@ pie title Minerals in my tap water
         const reqdStackOpts:DocumentOptions ={
             title: "menuItemPanel", childDragAction: dropActionType.same, layout_boxShadow: "rgba(0,0,0,0)",  dontRegisterView: true, ignoreClick: true,
             _layout_dontCenter: 'y',
-            _chromeHidden: true, _gridGap: 0, _yMargin: 0, _xMargin: 0, _layout_autoHeight: false, _width: 60, _columnWidth: 60, _lockedPosition: true, isSystem: true,
+            _chromeHidden: true, _gridGap: 0, _yMargin: 0, _xMargin: 0, _layout_autoHeight: false, _width: 60, _layout_columnWidth: 60, _lockedPosition: true, isSystem: true,
         };
         return DocUtils.AssignDocField(doc, field, (opts, items) => Docs.Create.StackingDocument(items??[], opts), reqdStackOpts, menuBtns, { dropConverter: "convertToButtons(dragData)" });
     }
diff --git a/src/client/views/collections/collectionSchema/SchemaTableCell.tsx b/src/client/views/collections/collectionSchema/SchemaTableCell.tsx
index cd46ae824..c847bc546 100644
--- a/src/client/views/collections/collectionSchema/SchemaTableCell.tsx
+++ b/src/client/views/collections/collectionSchema/SchemaTableCell.tsx
@@ -402,7 +402,7 @@ export class SchemaDateCell extends ObservableReactComponent<SchemaTableCellProp
                 </div>
                 {pointerEvents === 'none' ? null : (
                     <Popup
-                        icon={<FontAwesomeIcon size="sm" icon="caret-down" />}
+                        icon={<FontAwesomeIcon size="xs" icon="caret-down" />}
                         size={Size.XSMALL}
                         type={Type.TERT}
                         color={SnappingManager.userColor}
diff --git a/src/client/views/nodes/FontIconBox/FontIconBox.scss b/src/client/views/nodes/FontIconBox/FontIconBox.scss
index 186d24e92..8bc68c131 100644
--- a/src/client/views/nodes/FontIconBox/FontIconBox.scss
+++ b/src/client/views/nodes/FontIconBox/FontIconBox.scss
@@ -1,21 +1,21 @@
 @use '../../global/globalCssVariables.module.scss' as global;
 
-// bcz: something's messed up with the IconButton css.  this mostly fixes the fit-all button, the color buttons, the undo +/- expander and the dropdown doc type list (eg 'text')
-.iconButton-container {
-    width: unset !important;
-    min-width: 30px !important;
-    height: unset !important;
-    min-height: 30px;
-    .color {
-        height: 3px !important;
-    }
-}
 .fonticonbox {
     margin: auto;
     width: 100%;
     .formLabel {
         height: 5px;
     }
+    // bcz: something's messed up with the IconButton css.  this mostly fixes the fit-all button, the color buttons, the undo +/- expander and the dropdown doc type list (eg 'text')
+    .iconButton-container {
+        width: unset !important;
+        min-width: 30px !important;
+        height: unset !important;
+        min-height: 30px;
+        .color {
+            height: 3px !important;
+        }
+    }
 }
 .menuButton {
     height: 100%;
diff --git a/src/client/views/nodes/FontIconBox/FontIconBox.tsx b/src/client/views/nodes/FontIconBox/FontIconBox.tsx
index 7e0236b74..f699568f1 100644
--- a/src/client/views/nodes/FontIconBox/FontIconBox.tsx
+++ b/src/client/views/nodes/FontIconBox/FontIconBox.tsx
@@ -257,10 +257,7 @@ export class FontIconBox extends ViewBoxBaseComponent<ButtonProps>() {
         const tooltip: string = StrCast(this.Document.toolTip);
 
         return (
-            <div
-                onPointerDown={e => {
-                    e.stopPropagation();
-                }}>
+            <div onPointerDown={e => e.stopPropagation()}>
                 <ColorPicker
                     setSelectedColor={value => {
                         if (!this.colorBatch) this.colorBatch = UndoManager.StartBatch(`Set ${tooltip} color`);
diff --git a/src/client/views/nodes/formattedText/DashFieldView.tsx b/src/client/views/nodes/formattedText/DashFieldView.tsx
index 0684daeb6..18cf36603 100644
--- a/src/client/views/nodes/formattedText/DashFieldView.tsx
+++ b/src/client/views/nodes/formattedText/DashFieldView.tsx
@@ -155,8 +155,8 @@ export class DashFieldViewInternal extends ObservableReactComponent<IDashFieldVi
     @computed get fieldValueContent() {
         return !this._dashDoc ? null : (
             <div
-                onClick={action(() => {
-                    this._expanded = !this._props.editable ? !this._expanded : true;
+                onPointerDown={action(() => {
+                    this._expanded = !this._props.editable ? false : !this._expanded;
                 })}
                 style={{ fontSize: 'smaller', width: !this._hideKey && this._expanded ? this.columnWidth() : undefined }}>
                 <SchemaTableCell
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index 83ee619d0..a0eb6067e 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -1557,8 +1557,9 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FormattedTextB
                 const tr1 = this.EditorView.state.tr.setStoredMarks(storedMarks);
                 tr = selLoadChar === 'Enter' ? tr1.insert(this.EditorView.state.doc.content.size - 1, schema.nodes.paragraph.create()) : tr1.insertText(selLoadChar, this.EditorView.state.doc.content.size - 1);
             }
-            this.EditorView.dispatch(tr.setSelection(new TextSelection(tr.doc.resolve(tr.doc.content.size))).setStoredMarks(storedMarks));
+            this.EditorView.dispatch(tr.setSelection(new TextSelection(tr.doc.resolve(tr.doc.content.size - 1))).setStoredMarks(storedMarks));
             this.tryUpdateDoc(true); // calling select() above will make isContentActive() true only after a render .. which means the selectAll() above won't write to the Document and the incomingValue will overwrite the selection with the non-updated data
+            console.log(this.EditorView.state);
         }
         if (selectOnLoad) {
             this.EditorView!.focus();
-- 
cgit v1.2.3-70-g09d2


From 1a48ccf57ae43bc582dcd7be453e0ad217d38828 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Fri, 7 Mar 2025 23:13:33 -0500
Subject: fixed following text hyperlinks to Docs. fixed using fieldinfos for
 DashFieldViews to get appropriate Schmema cell input.  fixed dashFieldView to
 show correct input editor for field type.

---
 src/client/documents/Documents.ts                            |  2 +-
 .../collections/collectionSchema/CollectionSchemaView.tsx    | 12 +++++++-----
 .../views/collections/collectionSchema/SchemaCellField.tsx   |  2 +-
 .../views/collections/collectionSchema/SchemaTableCell.tsx   |  6 +++---
 src/client/views/nodes/formattedText/DashFieldView.tsx       | 11 +++++++----
 src/client/views/nodes/formattedText/FormattedTextBox.tsx    |  2 +-
 6 files changed, 20 insertions(+), 15 deletions(-)

(limited to 'src/client/views/nodes/formattedText/DashFieldView.tsx')

diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index 61b370da4..4b5979965 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -35,7 +35,7 @@ export enum FInfoFieldType {
     enumeration = 'enum',
     date = 'date',
     list = 'list',
-    rtf = 'rich text',
+    rtf = 'richtext',
     map = 'map',
 }
 export class FInfo {
diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
index 5a5cc3622..8e9e8e1cc 100644
--- a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
+++ b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
@@ -12,7 +12,7 @@ import { List } from '../../../../fields/List';
 import { ColumnType } from '../../../../fields/SchemaHeaderField';
 import { BoolCast, NumCast, StrCast } from '../../../../fields/Types';
 import { DocUtils } from '../../../documents/DocUtils';
-import { Docs, DocumentOptions, FInfo } from '../../../documents/Documents';
+import { Docs, DocumentOptions, FInfo, FInfoFieldType } from '../../../documents/Documents';
 import { DocumentManager } from '../../../util/DocumentManager';
 import { DragManager } from '../../../util/DragManager';
 import { dropActionType } from '../../../util/DropActionTypes';
@@ -49,14 +49,16 @@ import { SchemaRowBox } from './SchemaRowBox';
 // eslint-disable-next-line @typescript-eslint/no-require-imports
 const { SCHEMA_NEW_NODE_HEIGHT } = require('../../global/globalCssVariables.module.scss'); // prettier-ignore
 
-export const FInfotoColType: { [key: string]: ColumnType } = {
+export const FInfotoColType: { [key in FInfoFieldType]: ColumnType } = {
     string: ColumnType.String,
     number: ColumnType.Number,
     boolean: ColumnType.Boolean,
     date: ColumnType.Date,
-    image: ColumnType.Image,
-    rtf: ColumnType.RTF,
-    enumeration: ColumnType.Enumeration,
+    richtext: ColumnType.RTF,
+    enum: ColumnType.Enumeration,
+    Doc: ColumnType.Any,
+    list: ColumnType.Any,
+    map: ColumnType.Any,
 };
 
 const defaultColumnKeys: string[] = ['title', 'type', 'author', 'author_date', 'text'];
diff --git a/src/client/views/collections/collectionSchema/SchemaCellField.tsx b/src/client/views/collections/collectionSchema/SchemaCellField.tsx
index 5a64ecc62..20ec2f151 100644
--- a/src/client/views/collections/collectionSchema/SchemaCellField.tsx
+++ b/src/client/views/collections/collectionSchema/SchemaCellField.tsx
@@ -21,7 +21,7 @@ import DOMPurify from 'dompurify';
  */
 
 export interface SchemaCellFieldProps {
-    contents: FieldType;
+    contents: FieldType | undefined;
     fieldContents?: FieldViewProps;
     editing?: boolean;
     oneLine?: boolean;
diff --git a/src/client/views/collections/collectionSchema/SchemaTableCell.tsx b/src/client/views/collections/collectionSchema/SchemaTableCell.tsx
index c847bc546..d404378eb 100644
--- a/src/client/views/collections/collectionSchema/SchemaTableCell.tsx
+++ b/src/client/views/collections/collectionSchema/SchemaTableCell.tsx
@@ -136,7 +136,7 @@ export class SchemaTableCell extends ObservableReactComponent<SchemaTableCellPro
             PanelHeight: props.rowHeight,
             rootSelected: props.rootSelected,
         };
-        const readOnly = getFinfo(fieldKey)?.readOnly ?? false;
+        const readOnly = false; // getFinfo(fieldKey)?.readOnly ?? false;
         const cursor = !readOnly ? 'text' : 'default';
         const pointerEvents: 'all' | 'none' = !readOnly && isRowActive() ? 'all' : 'none';
         return { color, textDecoration, fieldProps, cursor, pointerEvents };
@@ -232,9 +232,8 @@ export class SchemaTableCell extends ObservableReactComponent<SchemaTableCellPro
         if (typeof cellValue === 'number') return ColumnType.Any;
         if (typeof cellValue === 'string' && columnTypeStr !== FInfoFieldType.enumeration) return ColumnType.Any;
         if (typeof cellValue === 'boolean') return ColumnType.Boolean;
-        if (columnTypeStr && columnTypeStr in FInfotoColType) return FInfotoColType[columnTypeStr];
 
-        return ColumnType.Any;
+        return columnTypeStr ? FInfotoColType[columnTypeStr] : ColumnType.Any;
     }
 
     get content() {
@@ -449,6 +448,7 @@ export class SchemaBoolCell extends ObservableReactComponent<SchemaTableCellProp
         return (
             <div className="schemaBoolCell" style={{ display: 'flex', color, textDecoration, cursor, pointerEvents }}>
                 <input
+                    onPointerDown={e => e.stopPropagation()}
                     style={{ marginRight: 4 }}
                     type="checkbox"
                     checked={BoolCast(this._props.Document[this._props.fieldKey])}
diff --git a/src/client/views/nodes/formattedText/DashFieldView.tsx b/src/client/views/nodes/formattedText/DashFieldView.tsx
index 18cf36603..e899b49bc 100644
--- a/src/client/views/nodes/formattedText/DashFieldView.tsx
+++ b/src/client/views/nodes/formattedText/DashFieldView.tsx
@@ -25,6 +25,7 @@ import './DashFieldView.scss';
 import { FormattedTextBox } from './FormattedTextBox';
 import { Node } from 'prosemirror-model';
 import { EditorView } from 'prosemirror-view';
+import { DocumentOptions, FInfo } from '../../../documents/Documents';
 
 @observer
 export class DashFieldViewMenu extends AntimodeMenu<AntimodeMenuProps> {
@@ -151,6 +152,8 @@ export class DashFieldViewInternal extends ObservableReactComponent<IDashFieldVi
     selectedCells = () => (this._dashDoc ? [this._dashDoc] : undefined);
     columnWidth = () => Math.min(this._props.tbox._props.PanelWidth(), Math.max(50, this._props.tbox._props.PanelWidth() - 100)); // try to leave room for the fieldKey
 
+    finfo = (fieldKey: string) => (new DocumentOptions() as Record<string, FInfo>)[fieldKey];
+
     // set the display of the field's value (checkbox for booleans, span of text for strings)
     @computed get fieldValueContent() {
         return !this._dashDoc ? null : (
@@ -165,7 +168,7 @@ export class DashFieldViewInternal extends ObservableReactComponent<IDashFieldVi
                     deselectCell={emptyFunction}
                     selectCell={emptyFunction}
                     maxWidth={this._props.hideKey || this._hideKey ? undefined : this._props.tbox._props.PanelWidth}
-                    columnWidth={this._expanded || this._props.nodeSelected() ? this.columnWidth : returnZero}
+                    columnWidth={this._expanded || this._props.nodeSelected() ? () => undefined : returnZero}
                     selectedCells={this.selectedCells}
                     selectedCol={returnZero}
                     fieldKey={this._fieldKey}
@@ -178,7 +181,7 @@ export class DashFieldViewInternal extends ObservableReactComponent<IDashFieldVi
                     rowHeight={returnZero}
                     isRowActive={this.isRowActive}
                     padding={0}
-                    getFinfo={emptyFunction}
+                    getFinfo={this.finfo}
                     setColumnValues={returnFalse}
                     allowCRs
                     oneLine={!this._expanded && !this._props.nodeSelected()}
@@ -196,7 +199,7 @@ export class DashFieldViewInternal extends ObservableReactComponent<IDashFieldVi
         const container = this._props.tbox.DocumentView?.().containerViewPath?.().lastElement();
         if (container) {
             const embedding = Doc.MakeEmbedding(container.Document);
-            embedding._type_collection = CollectionViewType.Time;
+            embedding._type_collection = CollectionViewType.Pivot;
             const colHdrKey = '_' + container.LayoutFieldKey + '_columnHeaders';
             let list = Cast(embedding[colHdrKey], listSpec(SchemaHeaderField));
             if (!list) {
@@ -264,7 +267,7 @@ export class DashFieldViewInternal extends ObservableReactComponent<IDashFieldVi
                 className={`dashFieldView${this.isRowActive() ? '-active' : ''}`}
                 ref={this._fieldRef}
                 style={{
-                    width: this._props.width,
+                    // width: this._props.width,
                     height: this._props.height,
                     pointerEvents: this._props.tbox._props.rootSelected?.() || this._props.tbox.isAnyChildContentActive?.() ? undefined : 'none',
                 }}>
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index a0eb6067e..3844616fd 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -1652,7 +1652,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FormattedTextB
             while (clickTarget instanceof HTMLElement && !clickTarget.dataset?.targethrefs) clickTarget = clickTarget.parentElement;
             const dataset = clickTarget instanceof HTMLElement ? clickTarget?.dataset : undefined;
 
-            if (dataset?.targethrefs)
+            if (dataset?.targethrefs && !dataset.targethrefs.startsWith('/doc'))
                 window
                     .open(
                         dataset?.targethrefs
-- 
cgit v1.2.3-70-g09d2