imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Enable strictFunctionTypes (#11201)

Browse source
This commit is contained in:
Michael Telatynski 2023-07-07 13:37:26 +01:00 • committed by GitHub
parent 40de66424d
commit 4207d182cd
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
30 changed files with 245 additions and 258 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/resizer/distributors/collapse.ts
View file

@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import FixedDistributor from "./fixed";
import { BaseDistributor } from "./fixed";
import ResizeItem from "../item";
import Resizer, { IConfig } from "../resizer";
import Sizer from "../sizer";
@ -25,7 +25,7 @@ export interface ICollapseConfig extends IConfig {
isItemCollapsed(element: HTMLElement): boolean;
}
class CollapseItem extends ResizeItem<ICollapseConfig> {
export class CollapseItem extends ResizeItem<ICollapseConfig> {
public notifyCollapsed(collapsed: boolean): void {
this.resizer.config?.onCollapsed?.(collapsed, this.id, this.domNode);
}
@ -35,10 +35,10 @@ class CollapseItem extends ResizeItem<ICollapseConfig> {
}
}
export default class CollapseDistributor extends FixedDistributor<ICollapseConfig, CollapseItem> {
export default class CollapseDistributor extends BaseDistributor<ICollapseConfig, CollapseItem> {
public static createItem(
resizeHandle: HTMLDivElement,
resizer: Resizer<ICollapseConfig>,
resizer: Resizer<ICollapseConfig, CollapseItem>,
sizer: Sizer,
container?: HTMLElement,
): CollapseItem {

35
src/resizer/distributors/fixed.ts
View file

@ -18,21 +18,7 @@ import ResizeItem from "../item";
import Sizer from "../sizer";
import Resizer, { IConfig } from "../resizer";
/**
distributors translate a moving cursor into
CSS/DOM changes by calling the sizer
they have two methods:
`resize` receives then new item size
`resizeFromContainerOffset` receives resize handle location
within the container bounding box. For internal use.
This method usually ends up calling `resize` once the start offset is subtracted.
*/
export default class FixedDistributor<C extends IConfig, I extends ResizeItem<any> = ResizeItem<C>> {
public static createItem(resizeHandle: HTMLDivElement, resizer: Resizer, sizer: Sizer): ResizeItem {
return new ResizeItem(resizeHandle, resizer, sizer);
}
export abstract class BaseDistributor<C extends IConfig, I extends ResizeItem<C> = ResizeItem<C>> {
public static createSizer(containerElement: HTMLElement, vertical: boolean, reverse: boolean): Sizer {
return new Sizer(containerElement, vertical, reverse);
}
@ -67,3 +53,22 @@ export default class FixedDistributor<C extends IConfig, I extends ResizeItem<an
this.item.finish();
}
}
/**
distributors translate a moving cursor into
CSS/DOM changes by calling the sizer
they have two methods:
`resize` receives then new item size
`resizeFromContainerOffset` receives resize handle location
within the container bounding box. For internal use.
This method usually ends up calling `resize` once the start offset is subtracted.
*/
export default class FixedDistributor<
C extends IConfig,
I extends ResizeItem<C> = ResizeItem<C>,
> extends BaseDistributor<C, I> {
public static createItem(resizeHandle: HTMLDivElement, resizer: Resizer<any>, sizer: Sizer): ResizeItem<any> {
return new ResizeItem(resizeHandle, resizer, sizer);
}
}

21
src/resizer/item.ts
View file

@ -17,14 +17,14 @@ limitations under the License.
import Resizer, { IConfig } from "./resizer";
import Sizer from "./sizer";
export default class ResizeItem<C extends IConfig = IConfig> {
export default class ResizeItem<C extends IConfig> {
public readonly domNode: HTMLElement;
protected readonly id: string | null;
protected reverse: boolean;
public constructor(
handle: HTMLElement,
public readonly resizer: Resizer<C>,
public readonly resizer: Resizer<C, any>,
public readonly sizer: Sizer,
public readonly container?: HTMLElement,
) {
@ -37,12 +37,17 @@ export default class ResizeItem<C extends IConfig = IConfig> {
this.id = handle.getAttribute("data-id");
}
private copyWith(handle: HTMLElement, resizer: Resizer, sizer: Sizer, container?: HTMLElement): ResizeItem {
private copyWith(
handle: HTMLElement,
resizer: Resizer<C, any>,
sizer: Sizer,
container?: HTMLElement,
): ResizeItem<C> {
const Ctor = this.constructor as typeof ResizeItem;
return new Ctor(handle, resizer, sizer, container);
}
private advance(forwards: boolean): ResizeItem | undefined {
private advance(forwards: boolean): ResizeItem<C> | undefined {
// opposite direction from fromResizeHandle to get back to handle
let handle: Element | null | undefined = this.reverse
? this.domNode.previousElementSibling
@ -64,11 +69,11 @@ export default class ResizeItem<C extends IConfig = IConfig> {
}
}
public next(): ResizeItem | undefined {
public next(): ResizeItem<C> | undefined {
return this.advance(true);
}
public previous(): ResizeItem | undefined {
public previous(): ResizeItem<C> | undefined {
return this.advance(false);
}
@ -106,7 +111,7 @@ export default class ResizeItem<C extends IConfig = IConfig> {
this.resizer.config?.onResized?.(null, this.id, this.domNode);
}
public first(): ResizeItem | undefined {
public first(): ResizeItem<C> | undefined {
if (!this.domNode.parentElement?.children) {
return;
}
@ -118,7 +123,7 @@ export default class ResizeItem<C extends IConfig = IConfig> {
}
}
public last(): ResizeItem | undefined {
public last(): ResizeItem<C> | undefined {
if (!this.domNode.parentElement?.children) {
return;
}

19
src/resizer/resizer.ts
View file

@ -38,7 +38,7 @@ export interface IConfig {
handler?: HTMLDivElement;
}
export default class Resizer<C extends IConfig = IConfig> {
export default class Resizer<C extends IConfig, I extends ResizeItem<C> = ResizeItem<C>> {
private classNames: IClassNames;
// TODO move vertical/horizontal to config option/container class
@ -46,13 +46,8 @@ export default class Resizer<C extends IConfig = IConfig> {
public constructor(
public container: HTMLElement | null,
private readonly distributorCtor: {
new (item: ResizeItem): FixedDistributor<C, any>;
createItem(
resizeHandle: HTMLDivElement,
resizer: Resizer,
sizer: Sizer,
container?: HTMLElement,
): ResizeItem;
new (item: I): FixedDistributor<C, I>;
createItem(resizeHandle: HTMLDivElement, resizer: Resizer<C, I>, sizer: Sizer, container?: HTMLElement): I;
createSizer(containerElement: HTMLElement | null, vertical: boolean, reverse: boolean): Sizer;
},
public readonly config?: C,
@ -87,7 +82,7 @@ export default class Resizer<C extends IConfig = IConfig> {
@param {number} handleIndex the index of the resize handle in the container
@return {FixedDistributor} a new distributor for the given handle
*/
public forHandleAt(handleIndex: number): FixedDistributor<C> | undefined {
public forHandleAt(handleIndex: number): FixedDistributor<C, I> | undefined {
const handles = this.getResizeHandles();
const handle = handles[handleIndex];
if (handle) {
@ -96,7 +91,7 @@ export default class Resizer<C extends IConfig = IConfig> {
}
}
public forHandleWithId(id: string): FixedDistributor<C> | undefined {
public forHandleWithId(id: string): FixedDistributor<C, I> | undefined {
const handles = this.getResizeHandles();
const handle = handles.find((h) => h.getAttribute("data-id") === id);
if (handle) {
@ -178,7 +173,7 @@ export default class Resizer<C extends IConfig = IConfig> {
{ trailing: true, leading: true },
);
public getDistributors = (): FixedDistributor<any, ResizeItem<any>>[] => {
public getDistributors = (): FixedDistributor<C, I>[] => {
return this.getResizeHandles().map((handle) => {
const { distributor } = this.createSizerAndDistributor(<HTMLDivElement>handle);
return distributor;
@ -187,7 +182,7 @@ export default class Resizer<C extends IConfig = IConfig> {
private createSizerAndDistributor(resizeHandle: HTMLDivElement): {
sizer: Sizer;
distributor: FixedDistributor<any>;
distributor: FixedDistributor<C, I>;
} {
const vertical = resizeHandle.classList.contains(this.classNames.vertical!);
const reverse = this.isReverseResizeHandle(resizeHandle);