aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/StyleProvider.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/StyleProvider.tsx')
-rw-r--r--src/client/views/StyleProvider.tsx42
1 files changed, 19 insertions, 23 deletions
diff --git a/src/client/views/StyleProvider.tsx b/src/client/views/StyleProvider.tsx
index 8c100f238..8a07a6bd7 100644
--- a/src/client/views/StyleProvider.tsx
+++ b/src/client/views/StyleProvider.tsx
@@ -1,6 +1,3 @@
-/* eslint-disable jsx-a11y/alt-text */
-/* eslint-disable jsx-a11y/no-static-element-interactions */
-/* eslint-disable jsx-a11y/click-events-have-key-events */
import { IconProp } from '@fortawesome/fontawesome-svg-core';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { Tooltip } from '@mui/material';
@@ -24,7 +21,7 @@ import { undoBatch, UndoManager } from '../util/UndoManager';
import { TreeSort } from './collections/TreeSort';
import { Colors } from './global/globalEnums';
import { DocumentView, DocumentViewProps } from './nodes/DocumentView';
-import { FieldViewProps } from './nodes/FieldView';
+import { FieldViewProps, StyleProviderFuncType } from './nodes/FieldView';
import { StyleProp } from './StyleProp';
import './StyleProvider.scss';
@@ -43,9 +40,9 @@ function togglePaintView(e: React.MouseEvent, doc: Opt<Doc>, props: Opt<FieldVie
}
export function styleFromLayoutString(doc: Doc, props: FieldViewProps, scale: number) {
- const style: { [key: string]: any } = {};
+ const style: { [key: string]: string } = {};
const divKeys = ['width', 'height', 'fontSize', 'transform', 'left', 'backgroundColor', 'left', 'right', 'top', 'bottom', 'pointerEvents', 'position'];
- const replacer = (match: any, expr: string) =>
+ const replacer = (match: string, expr: string) =>
// bcz: this executes a script to convert a property expression string: { script } into a value
ScriptField.MakeFunction(expr, { this: Doc.name, scale: 'number' })?.script.run({ this: doc, scale }).result?.toString() ?? '';
divKeys.forEach((prop: string) => {
@@ -72,7 +69,7 @@ export function SetFilterOpener(func: () => void) {
// a preliminary implementation of a dash style sheet for setting rendering properties of documents nested within a Tab
//
-export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<FieldViewProps & DocumentViewProps>, property: string): any {
+export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<FieldViewProps & DocumentViewProps>, property: string) : StyleProviderFuncType {
const remoteDocHeader = 'author;author_date;noMargin';
const isCaption = property.includes(':caption');
const isAnchor = property.includes(':anchor');
@@ -110,9 +107,9 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<FieldViewProps &
const lockedPosition = () => doc && BoolCast(doc._lockedPosition);
const titleHeight = () => styleProvider?.(doc, props, StyleProp.TitleHeight);
const backgroundCol = () => styleProvider?.(doc, props, StyleProp.BackgroundColor + ':nonTransparent' + (isNonTransparentLevel + 1));
- const color = () => styleProvider?.(doc, props, StyleProp.Color);
+ const color = () => styleProvider?.(doc, props, StyleProp.Color) as string;
const opacity = () => styleProvider?.(doc, props, StyleProp.Opacity);
- const layoutShowTitle = () => styleProvider?.(doc, props, StyleProp.ShowTitle);
+ const layoutShowTitle = () => styleProvider?.(doc, props, StyleProp.ShowTitle) as string;
// prettier-ignore
switch (property.split(':')[0]) {
case StyleProp.TreeViewIcon: {
@@ -144,7 +141,7 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<FieldViewProps &
highlightStyle: doc.isGroup ? "dotted": highlightStyle,
highlightColor,
highlightIndex,
- highlightStroke: layoutDoc?.layout_isSvg,
+ highlightStroke: BoolCast(layoutDoc?.layout_isSvg),
};
}
}
@@ -152,7 +149,7 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<FieldViewProps &
case StyleProp.DocContents: return undefined;
case StyleProp.WidgetColor: return isAnnotated ? Colors.LIGHT_BLUE : 'dimgrey';
case StyleProp.Opacity: return componentView?.isUnstyledView?.() ? 1 : Cast(doc?._opacity, "number", Cast(doc?.opacity, 'number', null));
- case StyleProp.FontColor: return StrCast(doc?.[fieldKey + 'fontColor'], isCaption ? lightOrDark(backgroundCol()) : StrCast(Doc.UserDoc().fontColor, color()));
+ case StyleProp.FontColor: return StrCast(doc?.[fieldKey + 'fontColor'], isCaption ? lightOrDark(backgroundCol()) : StrCast(Doc.UserDoc().fontColor, color()));
case StyleProp.FontSize: return StrCast(doc?.[fieldKey + 'fontSize'], StrCast(Doc.UserDoc().fontSize));
case StyleProp.FontFamily: return StrCast(doc?.[fieldKey + 'fontFamily'], StrCast(Doc.UserDoc().fontFamily));
case StyleProp.FontWeight: return StrCast(doc?.[fieldKey + 'fontWeight'], StrCast(Doc.UserDoc().fontWeight));
@@ -168,7 +165,7 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<FieldViewProps &
StrCast(
doc._layout_showTitle,
showTitle?.() ||
- (!Doc.IsSystem(doc) && [DocumentType.COL, DocumentType.FUNCPLOT, DocumentType.LABEL, DocumentType.RTF, DocumentType.IMG, DocumentType.VID].includes(doc.type as any)
+ (!Doc.IsSystem(doc) && [DocumentType.COL, DocumentType.FUNCPLOT, DocumentType.LABEL, DocumentType.RTF, DocumentType.IMG, DocumentType.VID].includes(doc.type as DocumentType)
? doc.author === ClientUtils.CurrentUserEmail()
? StrCast(Doc.UserDoc().layout_showTitle)
: remoteDocHeader
@@ -207,7 +204,7 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<FieldViewProps &
};
}
case StyleProp.HeaderMargin:
- return ([CollectionViewType.Stacking, CollectionViewType.NoteTaking, CollectionViewType.Masonry, CollectionViewType.Tree].includes(doc?._type_collection as any) ||
+ return ([CollectionViewType.Stacking, CollectionViewType.NoteTaking, CollectionViewType.Masonry, CollectionViewType.Tree].includes(doc?._type_collection as CollectionViewType) ||
(doc?.type === DocumentType.RTF && !layoutShowTitle()?.includes('noMargin')) ||
doc?.type === DocumentType.LABEL) &&
layoutShowTitle() &&
@@ -297,8 +294,7 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<FieldViewProps &
if (SnappingManager.ExploreMode || doc?.layout_unrendered) return isInk() ? 'visiblePainted' : 'all';
if (pointerEvents?.() === 'none') return 'none';
if (opacity() === 0) return 'none';
- if (isGroupActive?.() ) return isInk() ? 'visiblePainted': (doc?.
- isGroup )? undefined: 'all'
+ if (isGroupActive?.() ) return isInk() ? 'visiblePainted': (doc?.isGroup ) ? undefined: 'all';
if (isDocumentActive?.()) return isInk() ? 'visiblePainted' : 'all';
return undefined; // fixes problem with tree view elements getting pointer events when the tree view is not active
case StyleProp.Decorations: {
@@ -329,11 +325,12 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<FieldViewProps &
// eslint-disable-next-line react/no-unstable-nested-components
iconProvider={() => <div className='styleProvider-filterShift'><FaFilter/></div>}
closeOnSelect
- setSelectedVal={((dv: DocumentView) => {
+ setSelectedVal={((dvValue: unknown) => {
+ const dv = dvValue as DocumentView;
dv.select(false);
SnappingManager.SetPropertiesWidth(250);
_filterOpener?.();
- }) as any // Dropdown assumes values are strings or numbers..
+ }) // Dropdown assumes values are strings or numbers..
}
size={Size.XSMALL}
width={15}
@@ -345,11 +342,9 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<FieldViewProps &
background={showFilterIcon}
items={[ ...(dashView ? [dashView]: []), ...(docViewPath?.()??[])]
.filter(dv => StrListCast(dv?.Document.childFilters).length || StrListCast(dv?.Document.childRangeFilters).length)
- .map(dv => ({
- text: StrCast(dv?.Document.title),
- val: dv as any,
- style: {color:SnappingManager.userColor, background:SnappingManager.userBackgroundColor},
- } as IListItemProps)) }
+ .map(dv => ({ text: StrCast(dv?.Document.title),
+ val: dv as unknown,
+ style: {color:SnappingManager.userColor, background:SnappingManager.userBackgroundColor} } as IListItemProps)) }
/>
</div>
);
@@ -378,6 +373,7 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<FieldViewProps &
}
default:
}
+ return undefined;
}
export function DashboardToggleButton(doc: Doc, field: string, onIcon: IconProp, offIcon: IconProp, clickFunc?: () => void) {
@@ -386,7 +382,7 @@ export function DashboardToggleButton(doc: Doc, field: string, onIcon: IconProp,
<IconButton
size={Size.XSMALL}
color={color}
- icon={<FontAwesomeIcon icon={(doc[field] ? (onIcon as any) : offIcon) as IconProp} />}
+ icon={<FontAwesomeIcon icon={doc[field] ? onIcon : offIcon} />}
onClick={undoBatch(
action((e: React.MouseEvent) => {
e.stopPropagation();