better code: better typing
Massimo Melina committed
Jan 5, 2026 at 15:21 UTC
54d79f2e516f82436ca0c1f7709ceeb9e06965b3
3 files changed
+7
-6
admin/src/TextEditor.ts
+2
-2
@@ -2,7 +2,7 @@ import { ComponentProps, createElement as h, forwardRef, useState } from 'react'
2
import Editor from 'react-simple-code-editor'
3
import { FieldProps } from '@hfs/mui-grid-form'
4
import { Box, TextField, TextFieldProps } from '@mui/material'
5
-import { focusableSelector, isCtrlKey, try_ } from './misc'
5
+import { focusableSelector, isCtrlKey, Optional, try_ } from './misc'
6
import _ from 'lodash'
7
import { highlight, languages } from 'prismjs'
8
import 'prismjs/components/prism-markup'
@@ -14,7 +14,7 @@ import 'prismjs/themes/prism-solarizedlight.css' // looks good both with light a
14
15
type OP = ComponentProps<typeof Editor>
16
type Already = 'highlight' | 'padding' | 'tabSize' | 'insertSpaces' | 'ignoreTabKey'
17
-type TextEditorProps = Omit<OP, Already> & Partial<Pick<OP, Already>> & { lang?: 'plain' | 'js' | 'html' | 'css' | 'json' | 'yaml' }
17
+type TextEditorProps = Optional<OP, Already> & { lang?: 'plain' | 'js' | 'html' | 'css' | 'json' | 'yaml' }
18
export const TextEditor = forwardRef(({ style, lang='plain', ...props }: TextEditorProps, _ref) => h(Editor, {
19
// Editor component doesn't seem to support ref, but it didn't cause any problem yet
20
highlight: s => highlight(s, languages[lang], lang),
shared/react.ts
+4
-4
@@ -137,14 +137,14 @@ export function useFixSticky() {
137
}
138
139
// returns props to assign to your component, and a copy of the ref; calls back with [width, height]
140
-export function useOnResize(cb: (width: number, height: number, target: HTMLElement, style: CSSStyleDeclaration) => any) {
141
- const ref = useRef<HTMLElement | null>(null)
140
+export function useOnResize(cb: (width: number, height: number, target: Element, style: CSSStyleDeclaration) => any) {
141
+ const ref = useRef<Element | null>(null)
142
const cleanupRef = useRef(_.noop)
143
return useMemo(() => {
144
let lastW = -1
145
let lastH = -1
146
147
- function measure(el: HTMLElement) {
147
+ function measure(el: Element) {
148
const style = getComputedStyle(el)
149
const w = (el.clientWidth || el.getBoundingClientRect().width)
150
+ parseFloat(style.paddingLeft) + parseFloat(style.paddingRight)
@@ -158,7 +158,7 @@ export function useOnResize(cb: (width: number, height: number, target: HTMLElem
158
159
return {
160
ref,
161
- refToPass(el: HTMLElement | null) {
161
+ refToPass(el: Element | null) {
162
ref.current = el
163
cleanupRef.current()
164
cleanupRef.current = _.noop
src/cross.ts
+1
@@ -37,6 +37,7 @@ export const LIST = { add: '+', remove: '-', update: '=', props: 'props', ready:
37
export type Dict<T=any> = Record<string, T>
38
export type Falsy = false | null | undefined | '' | 0
39
type Truthy<T> = T extends false | '' | 0 | null | undefined | void ? never : T
40
+export type Optional<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>
41
export type Callback<IN=void, OUT=void> = (x:IN) => OUT
42
export type Promisable<T> = T | Promise<T>
43
export type Functionable<T, Args extends any[] = any[]> = T | ((...args: Args) => T)