Commit 4f013030 authored by Alejandro Celaya's avatar Alejandro Celaya Committed by Alejandro Celaya

Migrate presentational-component to TS

parent ba92ed1b
import classnames from 'classnames'; import classnames from 'classnames';
import type { JSX, ComponentChildren, Ref } from 'preact';
import { downcastRef } from './type-coercions'; import { downcastRef } from './type-coercions';
/** type HTMLDivAttributes = JSX.HTMLAttributes<HTMLDivElement>;
* @typedef {import('preact').JSX.HTMLAttributes<HTMLDivElement>} HTMLDivAttributes
*/
/** export type PresentationalComponentProps = {
* @typedef PresentationalComponentProps children?: ComponentChildren;
* @prop {import('preact').ComponentChildren} [children] /** Optional extra CSS classes to append to the component's default classes */
* @prop {string|string[]} [classes] - Optional extra CSS classes to append to the classes?: string | string[];
* component's default classes elementRef?: Ref<HTMLElement>;
* @prop {import('preact').Ref<HTMLElement>} [elementRef] };
*/
/** /**
* Make a presentational component which wraps children to apply layout and * Make a presentational component which wraps children to apply layout and
* styling. * styling.
* *
* @param {string} displayName * @param classes - CSS classes for this component
* @param {string|string[]} classes - CSS classes for this component
*/ */
export function makePresentationalComponent(displayName, classes) { export function makePresentationalComponent(
/** displayName: string,
* @param {HTMLDivAttributes & PresentationalComponentProps} props classes: string | string[]
*/ ) {
function PresentationalComponent({ function PresentationalComponent({
classes: extraClasses, classes: extraClasses,
elementRef, elementRef,
children, children,
...htmlAttributes ...htmlAttributes
}) { }: HTMLDivAttributes & PresentationalComponentProps) {
return ( return (
<div <div
className={classnames(classes, extraClasses)} className={classnames(classes, extraClasses)}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment