From f9b1326f10d27448478f8f6b4be5dda89e391c65 Mon Sep 17 00:00:00 2001 From: Joe Pea Date: Thu, 10 Oct 2024 21:27:30 -0700 Subject: [PATCH] **feat:** improve the JSX type helpers: - `on*` event properties can now be specified to define event props for JSX. The README has an example, plus the `jsx-types-*.test.tsx` files show all the type test cases. - They will be mapped without string values, accepting only functions. - For Solid specifically, all the `on*` properties are also mapped to `on:*` JSX props with the same types. - Any boolean JSX props will also accept "true" and "false" string values. - Any number JSX props will also accept number strings, f.e. "1.23". - For Solid specifically, automatically map prop types for `attr:`, `prop:`, and `bool:` prefixed JSX props. - `attr:` props will accept only strings. - `attr:` props mapped from boolean JS properties will specifically accept "true" and "false" strings. - `attr:` props mapped from number JS properties will specifically accept number strings, f.e. "1.23". - Only boolean JS properties will map to `bool:` JSX props, and f.e. `bool:` will not be available for any number props. - `bool:` props will accept only booleans, and not the "true" or "false" strings (otherwise Solid will set the attribute to always exist regardless of the value, and this is not an issue with React props because React props always map to JS properties never attributes when it comes to Lume Elements). - The `attr:` props will accept only "true" or "false" strings. - The non-prefixed JSX props, and `prop:` props, will accept both booleans and "true" or "false" strings. - Number JS properties are mapped to JSX props that accept numbers as well as number strings, but similar to boolean properties: - The `attr:` props accept only number strings. - And there are no `bool:` props mapped for number properties. - **POSSIBLY BREAKING:**: This update adds JSX types for event properties, which has a tiny chance of being breaking. If you had a typed JSX prop like `onnotevent` for an element whose JSX types you defined with `ElementAttributes`, there might be a type error, but this scenario is unlikely. To migrate, use the `prop:` prefix to set the JS property instead, for example `prop:onnotevent={someValue}`. The additional prefixed props could also cause an `@ts-expect-error` somewhere to start erroring, or a type conflict, in which case some care is needed. **feat:** add a new `dispatchEventWithCall(event)` method This is similar to `dispatchEvent()`, but useful for dispatching a non-builtin event and causing any `on*` method for that event to also be called if it exists. With builtin events, for example, when the builtin `click` event is dispatched, the element's `.onclick()` method is called automatically if it exists. Now we can achieve the same behavior with custom events, so that for example `dispatchEventWithCall(new Event('myevent'))` will also cause `.onmyevent()` to be called if it exists. Note, avoid calling this method with an event that is not a custom event, or you'll trigger the respective builtin `on*` method twice. --- README.md | 143 ++++++++--------- dist/LumeElement.d.ts | 76 ++++++++- dist/LumeElement.d.ts.map | 2 +- dist/LumeElement.js | 21 +++ dist/LumeElement.js.map | 2 +- dist/jsx-types-react.test.d.ts | 12 +- dist/jsx-types-react.test.d.ts.map | 2 +- dist/jsx-types-react.test.jsx | 58 +++++++ dist/jsx-types-react.test.jsx.map | 2 +- dist/jsx-types-solid.test.d.ts | 15 +- dist/jsx-types-solid.test.d.ts.map | 2 +- dist/jsx-types-solid.test.jsx | 245 +++++++++++++++++++++++++++-- dist/jsx-types-solid.test.jsx.map | 2 +- dist/react.d.ts | 6 +- dist/react.d.ts.map | 2 +- src/LumeElement.ts | 149 ++++++++++++++---- src/jsx-types-react.test.tsx | 69 +++++++- src/jsx-types-solid.test.tsx | 197 ++++++++++++++++++++++- src/react.ts | 34 +++- 19 files changed, 905 insertions(+), 134 deletions(-) diff --git a/README.md b/README.md index b8a2fbd..038a20b 100644 --- a/README.md +++ b/README.md @@ -604,9 +604,6 @@ Modifying the very first example from above for TypeScript, it would look like the following. ```tsx -/* @jsxImportSource solid-js */ -// ^ Alternatively, configure this in tsconfig.json instead of per-file. - import {createSignal} from 'solid-js' import {div} from '@lume/element/dist/type-helpers.js' @@ -643,7 +640,6 @@ The main differences from plain JS are > `` element then we need to use the `menu()` helper like follows. ```tsx -/* @jsxImportSource solid-js */ import {createSignal} from 'solid-js' import {menu} from '@lume/element/dist/type-helpers.js' @@ -663,7 +659,6 @@ type `HTMLDivElement` despite the fact that at runtime we will be have an `HTMLMenuElement` instance. ```tsx -/* @jsxImportSource solid-js */ import {div, button} from '@lume/element/dist/type-helpers.js' // GOOD. @@ -680,8 +675,6 @@ following to have the proper types, but note that the following is also not type safe: ```tsx -/* @jsxImportSource solid-js */ - // GOOD. const el = (...) as any as HTMLMenuElement @@ -695,33 +688,38 @@ const el2 = (...) as any as HTMLDivElement ### With Solid JSX To give your Custom Elements type checking for use with DOM APIs, and type -checking in Solid JSX, we can add the element type definition to `JSX.IntrinsicElements`: +checking in Solid JSX, we can add the element type definition to +`JSX.IntrinsicElements`. We can use the `ElementAttributes` helper to specify +which attributes/properties should be exposed in the JSX type: ```tsx -/* @jsxImportSource solid-js */ - -// We already use @jsxImportSource above, but if you need to reference JSX -// anywhere in non-JSX parts of the code, you also need to import it from -// solid-js: -import {Element, element, stringAttribute, numberAttribute, /*...,*/ JSX} from 'solid-js' - -// Define the attributes that your element accepts -export interface CoolElementAttributes extends JSX.HTMLAttributes { - 'cool-type'?: 'beans' | 'hair' - 'cool-factor'?: number - // ^ NOTE: These should be dash-case versions of your class's attribute properties. -} +import type {ElementAttributes} from '@lume/element' +import {Element, element, stringAttribute, numberAttribute} from '@lume/element' + +export type CoolElementAttributes = 'coolType' | 'coolFactor' | 'oncoolness' @element('cool-element') -class CoolElement extends Element { +export class CoolElement extends Element { @stringAttribute coolType: 'beans' | 'hair' = 'beans' @numberAttribute coolFactor = 100 // ^ NOTE: These are the camelCase equivalents of the attributes defined above. + // Define the event prop by defining a method with the event name prefixed with 'on'. + oncoolness: ((event: SomeEvent) => void) | null = null + + // This property will not appear in the JSX types because it is not listed in + // the CoolElementAttributes that are passed to ElementAttributes below. + notJsxProp = 123 + // ... Define your class as described above. ... } -export {CoolElement} +/** This an event that our element emits. */ +class SomeEvent extends Event { + constructor() { + super('someevent', {...}) + } +} // Add your element to the list of known HTML elements. This makes it possible // for browser APIs to have the expected return type. For example, the return @@ -732,36 +730,14 @@ declare global { } } -// Also register the element name in the JSX types for TypeScript to recognize -// the element as a valid JSX tag. -declare module 'solid-js' { - namespace JSX { - interface IntrinsicElements { - 'cool-element': CoolElementAttributes - } - } -} -``` - -> :bulb:**TIP:** -> -> To make code less redundant, use the `ElementAttributes` helper to -> pluck the types of properties directly from your custom element class for the -> attribute types: - -```ts -import type {ElementAttributes} from '@lume/element' - -// This definition is now shorter than before, automatically maps the property -// names to dash-case, and automatically picks up the property types from the -// class. -export type CoolElementAttributes = ElementAttributes - // The same as before: declare module 'solid-js' { namespace JSX { interface IntrinsicElements { - 'cool-element': CoolElementAttributes + // This automatically maps the property names from camelCase to dash-case, + // automatically picks up the property types from the class, and also + // defines additional types for attr:, prop:, and bool: prefixed props. + 'cool-element': ElementAttributes } } } @@ -772,8 +748,11 @@ Now when you use `` in Solid JSX, it will be type checked: ```jsx return ( ) ``` @@ -794,16 +773,7 @@ Defining the types of custom elements for React JSX is similar as for Solid JSX ``` ```ts -import type {HTMLAttributes} from 'react' - -// Define the attributes that your element accepts, almost the same as before: -export interface CoolElementAttributes extends HTMLAttributes { - coolType?: 'beans' | 'hair' - coolFactor?: number - // ^ NOTE: These are the names of the class's properties verbatim, not - // dash-cased as with Solid. React works differently than Solid's: it will - // map the exact prop name to the JS property. -} +import type {ReactElementAttributes} from '@lume/element/dist/react.js' // Add your element to the list of known HTML elements, like before. declare global { @@ -832,14 +802,15 @@ declare global { ```ts import type {ReactElementAttributes} from '@lume/element/dist/react' -// This definition is now shorter than before, and automatically maps the property names to dash-case. -export type CoolElementAttributes = ReactElementAttributes +// ... same as before ... -// The same as before: -declare global { +declare module 'react' { namespace JSX { interface IntrinsicElements { - 'cool-element': CoolElementAttributes + // Similar as before, with ReactElementAttributes instead of + // ElementAttributes, and props will remain camelCase, not mapped to + // dash-case: + 'cool-element': ReactElementAttributes } } } @@ -850,8 +821,11 @@ Now when you use `` in React JSX, it will be type checked: ```jsx return ( ) ``` @@ -860,8 +834,7 @@ return ( > You may want to define React JSX types for your elements in separate files, and > have only React users import those files if they need the types, and similar if you make > JSX types for Vue, Svelte, etc (we don't have helpers for those other fameworks -> yet, but you can manually augment JSX as in the examples above on a -> per-framework basis, contributions welcome!). +> yet, but you can manually augment JSX in that case, contributions welcome!). ### With Preact JSX @@ -884,6 +857,8 @@ layer: } ``` +The rest is the same. + ## API ### `Element` @@ -1664,6 +1639,34 @@ element's style sheet into the `ShadowRoot` conflicts with how DOM is created in `ShadowRoot` content, or etc, then the user may want to place the stylesheet somewhere else). +#### `dispatchEventWithCall(event)` + +This is similar to `dispatchEvent()`, but useful for dispatching a non-builtin +event and causing any `on*` method for that event to also be called if it +exists. + +With builtin events, for example, when the builtin `click` event is dispatched, +the element's `.onclick()` method is called automatically if it exists. Now we +can achieve the same behavior with custom events, so that for example +`dispatchEventWithCall(new Event('myevent'))` will also cause `.onmyevent()` +to be called if it exists. + +Note, avoid calling this method with an event that is not a custom event, or +you'll trigger the respective builtin `on*` method twice. + +```ts +import {element, Element} from '@lume/element' + +@element('my-el') +class MyEl extends Element { + onfoo: ((event: Event) => void) | null = null +} + +const el = new MyEl() +el.onfoo = () => console.log('foo') +el.dispatchEventWithCall(new Event('foo')) // logs "foo" +``` + ### Decorators Using decorators (if available in your build, or natively in your JS engine) diff --git a/dist/LumeElement.d.ts b/dist/LumeElement.d.ts index 868ee48..8741b0b 100644 --- a/dist/LumeElement.d.ts +++ b/dist/LumeElement.d.ts @@ -158,6 +158,21 @@ declare class LumeElement extends LumeElement_base { disconnectedCallback(): void; attributeChangedCallback?(name: string, oldVal: string | null, newVal: string | null): void; adoptedCallback(): void; + /** + * This is similar to `dispatchEvent()`, but useful for dispatching a + * non-builtin event and causing any `on*` method for that event to also be + * called if it exists. + * + * With builtin events, for example, when the builtin `click` event is + * dispatched, the element's `.onclick()` method is called automatically if + * it exists. Now we can achieve the same behavior with custom events, so + * that for example `dispatchEventWithCall(new Event('myevent'))` will + * also cause `.onmyevent()` to be called if it exists. + * + * Note, avoid calling this method with an event that is not a custom event, + * or you'll trigger the respective builtin `on*` method twice. + */ + dispatchEventWithCall(event: Event): boolean; } export { LumeElement as Element }; export type AttributeHandlerMap = Record; @@ -204,23 +219,70 @@ type Template = TemplateContent | (() => TemplateContent); * let coolEl = * ``` */ -export type ElementAttributes, SetterTypePrefix>, AdditionalProperties extends object = {}> = Omit, SelectedProperties | keyof AdditionalProperties | 'onerror'> & { +export type ElementAttributes, SetterTypePrefix>, AdditionalProperties extends object = {}> = Omit, SelectedProperties | keyof AdditionalProperties | 'onerror'> & { onerror?: ((error: ErrorEvent) => void) | null; -} & Partial, SetterTypePrefix>, SelectedProperties>>>> & AdditionalProperties; +} & Partial>>>>> & Partial>, never>> & Partial>>>>> & Partial>>>>>> & Partial, SelectedProperties>>>> & PrefixProps<'bool:', DashCasedProps, SelectedProperties>>>>> & PrefixProps<'prop:', WithBooleanStringValues, SelectedProperties>>>> & PrefixProps<'attr:', DashCasedProps, SelectedProperties>>>>>> & Partial, SelectedProperties>>>> & PrefixProps<'prop:', WithNumberStringValues, SelectedProperties>>>> & PrefixProps<'attr:', DashCasedProps, SelectedProperties>>>>>> & FunctionsOnly> & Partial>>> & AdditionalProperties; +type RemapSetters = RemoveSetterPrefixes, SetterTypePrefix>; +type NonOnProps> = Pick, OmitFromUnion>>; +export type NonEventProps, SetterTypePrefix>> = NonOnProps & NonFunctionsOnly>; +export type EventProps = Pick>>; +export type NonBooleanProps = Omit>; +export type BooleanProps = { + [K in keyof T as T[K] extends boolean | 'true' | 'false' ? K : never]: T[K]; +}; +export type NonNumberProps = Omit>; +export type NumberProps = { + [K in keyof T as T[K] extends number ? K : never]: T[K]; +}; +export type FunctionsOnly = { + [K in keyof T as NonNullable extends (...args: any[]) => any ? K : never]: T[K]; +}; +export type NonFunctionsOnly = { + [K in keyof T as ((...args: any[]) => any) extends NonNullable ? never : K]: T[K]; +}; /** * Make all non-string properties union with |string because they can all * receive string values from string attributes like opacity="0.5" (those values * are converted to the types of values they should be, f.e. reading a * `@numberAttribute` property always returns a `number`) */ -export type WithStringValues = { - [Property in keyof Type]: PickFromUnion extends never ? // if the type does not include a type assignable to string - Type[Property] | string : Type[Property]; +export type WithStringValues = { + [K in keyof T]: PickFromUnion extends never ? // if the type does not include a type assignable to string + T[K] | string : T[K]; +}; +export type WithBooleanStringValues = { + [K in keyof T]: T[K] | 'true' | 'false'; +}; +export type AsBooleanStringValues = { + [K in keyof T]: 'true' | 'false'; +}; +export type AsBooleanValues = { + [K in keyof T]: boolean; +}; +export type WithNumberStringValues = { + [K in keyof T]: T[K] | `${number}`; +}; +export type AsNumberStringValues = { + [K in keyof T]: `${number}`; +}; +export type AsValues = { + [K in keyof T]: V; +}; +type AsStringValues = { + [K in keyof T]: PickFromUnion extends never ? string : T[K]; }; type StringKeysOnly = OmitFromUnion; -type OmitFromUnion = T extends TypeToOmit ? never : T; +export type OmitFromUnion = T extends TypeToOmit ? never : T; type PickFromUnion = T extends TypeToPick ? T : never; -export type RemovePrefixes = { +export type EventKeys = T extends `on${infer _}` ? T : never; +type AddDelimitersToEventKeys = { + [K in keyof T as K extends string ? AddDelimiters : never]: T[K]; +}; +type AddDelimiters = T extends `${'on'}${infer Right}` ? `${'on'}${Delimiter}${Right}` : T; +type PrefixProps = { + [K in keyof T as K extends string ? `${Prefix}${K}` : K]: T[K]; +}; +export type RemoveSetterPrefixes = { [K in keyof T as K extends string ? RemovePrefix : K]: T[K]; }; type RemovePrefix = T extends `${Prefix}${infer Rest}` ? Rest : T; diff --git a/dist/LumeElement.d.ts.map b/dist/LumeElement.d.ts.map index 25b7cc4..2946edd 100644 --- a/dist/LumeElement.d.ts.map +++ b/dist/LumeElement.d.ts.map @@ -1 +1 @@ -{"version":3,"file":"LumeElement.d.ts","sourceRoot":"","sources":["../src/LumeElement.ts"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAC,gBAAgB,EAAE,mBAAmB,EAAC,MAAM,aAAa,CAAA;AACtE,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,SAAS,CAAA;AAe3C,QAAA,MAAM,IAAI,eAAiB,CAAA;;;;;;;;;;;;;;;AAI3B,cAAM,WAAY,SAAQ,gBAAsB;;IAC/C;;;;OAIG;IACH,MAAM,CAAC,WAAW,EAAE,MAAM,CAAK;IAE/B;;;;;;;;;;;;;;OAcG;IACH,MAAM,CAAC,aAAa,CAAC,IAAI,SAAmB,EAAE,QAAQ,GAAE,qBAAsC;IAoB9F;;;;;;;;;;;OAWG;IACH,MAAM,CAAC,kBAAkB,CAAC,EAAE,MAAM,EAAE,CAAA;IAEpC;;;;;;;;;;;;;;;;;;;;;;;;;OAyBG;IACH,MAAM,CAAC,yBAAyB,CAAC,EAAE,mBAAmB,CAAC;IAEvD,qFAAqF;IAC7E,CAAC,mBAAmB,CAAC,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,gBAAgB,CAAC,EAAE,gBAAgB,CAAA;KAAC,CAAC,CAAA;IAEnG;;;;;;;;;;;OAWG;IACH,UAAkB,iBAAiB,EAAE,GAAG,CAAC,WAAW,EAAE,OAAO,CAAC,CAAA;IA2F9D;;;;;OAKG;IACH,UAAkB,QAAQ,CAAC,EAAE,QAAQ,CAAA;IAErC;;;;OAIG;IACH,UAAkB,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,MAAM,CAAC,CAAA;IAE/C;;;;;OAKG;IACH,iBAAyB,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,MAAM,CAAC,CAAA;IAEtD;;;;;;OAMG;IACH,QAAQ,CAAC,SAAS,EAAE,OAAO,CAAO;IAElC,mEAAmE;IACnE,aAAa,CAAC,EAAE,cAAc,CAAC;IAE/B,CAAC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAO;IAE1B;;;;OAIG;IACH,SAAS,KAAK,YAAY,IAAI,IAAI,CAMjC;IACD,SAAS,KAAK,YAAY,CAAC,CAAC,EAAE,IAAI,EAKjC;IAED,gHAAgH;IAChH,IAAI,IAAI,SAEP;IACD,IAAI,IAAI,CAAC,GAAG,MAAA,EAEX;IAED;;;;;;;;;;;;;OAaG;IACH,SAAS,KAAK,SAAS,IAAI,IAAI,CAE9B;IAEQ,YAAY,CAAC,OAAO,EAAE,cAAc;IAO7C,iBAAiB;IAYjB,oBAAoB;IAMpB,wBAAwB,CAAC,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IA6H3F,eAAe;CACf;AAGD,OAAO,EAAC,WAAW,IAAI,OAAO,EAAC,CAAA;AAE/B,MAAM,MAAM,mBAAmB,GAAG,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAA;AAElE,OAAO,KAAK,EAAC,GAAG,EAAC,MAAM,eAAe,CAAA;AACtC,KAAK,QAAQ,GAAG,GAAG,CAAC,OAAO,GAAG,UAAU,CAAC,OAAO,CAAA;AAChD,KAAK,eAAe,GAAG,QAAQ,GAAG,QAAQ,EAAE,CAAA;AAC5C,KAAK,QAAQ,GAAG,eAAe,GAAG,CAAC,MAAM,eAAe,CAAC,CAAA;AAGzD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,MAAM,MAAM,iBAAiB,CAC5B,WAAW,SAAS,WAAW,EAC/B,kBAAkB,SAAS,MAAM,cAAc,CAAC,eAAe,CAAC,WAAW,CAAC,EAAE,gBAAgB,CAAC,EAC/F,oBAAoB,SAAS,MAAM,GAAG,EAAE,IACrC,IAAI,CACP,GAAG,CAAC,cAAc,CAAC,WAAW,CAAC,EAC/B,kBAAkB,GAAG,MAAM,oBAAoB,GAAG,SAAS,CAC3D,GACE;IAED,OAAO,CAAC,EAAE,CAAC,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAC,GAAG,IAAI,CAAA;CAC9C,GAEC,OAAO,CACR,cAAc,CACb,gBAAgB,CACf,IAAI,CACH,cAAc,CAAC,eAAe,CAAC,WAAW,CAAC,EAAE,gBAAgB,CAAC,EAC9D,kBAAkB,CAClB,CACD,CACD,CACD,GAEC,oBAAoB,CAAA;AAEvB;;;;;GAKG;AACH,MAAM,MAAM,gBAAgB,CAAC,IAAI,SAAS,MAAM,IAAI;KAElD,QAAQ,IAAI,MAAM,IAAI,GAAG,aAAa,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,SAAS,KAAK,GAE1E,AADA,2DAA2D;IAC3D,IAAI,CAAC,QAAQ,CAAC,GAAG,MAAM,GAEvB,IAAI,CAAC,QAAQ,CAAC;CACjB,CAAA;AAED,KAAK,cAAc,CAAC,CAAC,SAAS,WAAW,IAAI,aAAa,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,CAAA;AAE9E,KAAK,aAAa,CAAC,CAAC,EAAE,UAAU,IAAI,CAAC,SAAS,UAAU,GAAG,KAAK,GAAG,CAAC,CAAA;AACpE,KAAK,aAAa,CAAC,CAAC,EAAE,UAAU,IAAI,CAAC,SAAS,UAAU,GAAG,CAAC,GAAG,KAAK,CAAA;AAEpE,MAAM,MAAM,cAAc,CAAC,CAAC,EAAE,MAAM,SAAS,MAAM,IAAI;KACrD,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,SAAS,MAAM,GAAG,YAAY,CAAC,CAAC,EAAE,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CACtE,CAAA;AAED,KAAK,YAAY,CAAC,CAAC,SAAS,MAAM,EAAE,MAAM,SAAS,MAAM,IAAI,CAAC,SAAS,GAAG,MAAM,GAAG,MAAM,IAAI,EAAE,GAAG,IAAI,GAAG,CAAC,CAAA;AAE1G,MAAM,MAAM,eAAe,CAAC,CAAC,IAAI;KAC/B,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,SAAS,YAAY,CAAC,cAAc,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,EAAE,gBAAgB,CAAC,GAAG,KAAK,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAClH,CAAA;AAED,KAAK,iBAAiB,CAAC,CAAC,IAAI,MAAM,UAAU,CAAC,CAAC,EAAE,gBAAgB,CAAC,CAAA;AAEjE,KAAK,UAAU,CAAC,CAAC,EAAE,MAAM,SAAS,MAAM,IAAI;KAC1C,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,SAAS,GAAG,MAAM,GAAG,MAAM,EAAE,GAAG,CAAC,GAAG,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC;CAClE,CAAA;AAED,MAAM,MAAM,gBAAgB,GAAG,SAAS,CAAA"} \ No newline at end of file +{"version":3,"file":"LumeElement.d.ts","sourceRoot":"","sources":["../src/LumeElement.ts"],"names":[],"mappings":"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"} \ No newline at end of file diff --git a/dist/LumeElement.js b/dist/LumeElement.js index 3975aad..fb594e4 100644 --- a/dist/LumeElement.js +++ b/dist/LumeElement.js @@ -349,6 +349,27 @@ class LumeElement extends Effectful(HTMLElement) { // not used currently, but we'll leave this here so that child classes can // call super, and that way we can add an implementation later when needed. adoptedCallback() { } + /** + * This is similar to `dispatchEvent()`, but useful for dispatching a + * non-builtin event and causing any `on*` method for that event to also be + * called if it exists. + * + * With builtin events, for example, when the builtin `click` event is + * dispatched, the element's `.onclick()` method is called automatically if + * it exists. Now we can achieve the same behavior with custom events, so + * that for example `dispatchEventWithCall(new Event('myevent'))` will + * also cause `.onmyevent()` to be called if it exists. + * + * Note, avoid calling this method with an event that is not a custom event, + * or you'll trigger the respective builtin `on*` method twice. + */ + dispatchEventWithCall(event) { + const name = event.type; + const methodName = 'on' + name; + if (methodName in this) + this[methodName](event); + return super.dispatchEvent(event); + } } _a = LumeElement; // TODO rename the export to LumeElement in a breaking version bump. diff --git a/dist/LumeElement.js.map b/dist/LumeElement.js.map index 4a28636..1c8ee79 100644 --- a/dist/LumeElement.js.map +++ b/dist/LumeElement.js.map @@ -1 +1 @@ -{"version":3,"file":"LumeElement.js","sourceRoot":"","sources":["../src/LumeElement.ts"],"names":[],"mappings":";AAAA,OAAO,EAAC,MAAM,EAAC,MAAM,cAAc,CAAA;AACnC,sEAAsE;AACtE,yEAAyE;AACzE,uEAAuE;AACvE,4BAA4B;AAC5B,OAAO,EAAC,SAAS,EAAE,sBAAsB,EAAC,MAAM,cAAc,CAAA;AAK9D,gFAAgF;AAChF,gFAAgF;AAEhF,MAAM,WAAW,GAChB,UAAU,CAAC,WAAW;IACtB,MAAM,WAAW;QAChB;YACC,MAAM,IAAI,KAAK,CACd,iPAAiP,CACjP,CAAA;QACF,CAAC;KACD,CAAA;AAEF,MAAM,IAAI,GAAG,MAAM,CAAC,MAAM,CAAC,CAAA;AAE3B,mCAAmC;AAEnC,MAAM,WAAY,SAAQ,SAAS,CAAC,WAAW,CAAC;IAC/C;;;;OAIG;IACH,MAAM,CAAC,WAAW,GAAW,EAAE,CAAA;IAE/B;;;;;;;;;;;;;;OAcG;IACH,MAAM,CAAC,aAAa,CAAC,IAAI,GAAG,IAAI,CAAC,WAAW,EAAE,WAAkC,cAAc;QAC7F,IAAI,CAAC,IAAI,EAAE,CAAC;YACX,OAAO,CAAC,IAAI,CAAC,iEAAiE,CAAC,CAAA;YAC/E,OAAO,IAAI,CAAA;QACZ,CAAC;QAED,IAAI,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;YACxB,OAAO,CAAC,IAAI,CAAC,sEAAsE,IAAI,oBAAoB,CAAC,CAAA;YAC5G,OAAO,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAE,CAAA;QAC3B,CAAC;QAED,4DAA4D;QAC5D,MAAM,WAAW,GAAG,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;QAC5C,MAAM,KAAK,GAAG,WAAW,CAAC,CAAC,CAAC,KAAM,SAAQ,IAAI;SAAG,CAAC,CAAC,CAAC,IAAI,CAAA;QAExD,KAAK,CAAC,WAAW,GAAG,IAAI,CAAA;QACxB,QAAQ,CAAC,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,CAAA;QAC5B,OAAO,KAAK,CAAA;IACb,CAAC;IAED;;;;;;;;;;;OAWG;IACH,MAAM,CAAC,kBAAkB,CAAW;IAEpC;;;;;;;;;;;;;;;;;;;;;;;;;OAyBG;IACH,MAAM,CAAC,yBAAyB,CAAuB;IAmBvD,iCAAiC;QAChC,wEAAwE;QACxE,uEAAuE;QACvE,aAAa;QACb,EAAE;QACF,oEAAoE;QACpE,uEAAuE;QACvE,iEAAiE;QACjE,mEAAmE;QACnE,uEAAuE;QACvE,gEAAgE;QAChE,qEAAqE;QACrE,iEAAiE;QACjE,EAAE;QACF,qEAAqE;QACrE,qEAAqE;QACrE,aAAa;QACb,EAAE;QACF,+DAA+D;QAC/D,6DAA6D;QAC7D,kBAAkB;QAElB,MAAM,cAAc,GAAG,MAAM,CAAC,IAAI,CAAC,IAAI,CAAmB,CAAA;QAC1D,IAAI,CAAC,iBAAiB,GAAG,IAAI,GAAG,EAAE,CAAA;QAElC,KAAK,MAAM,QAAQ,IAAI,cAAc,EAAE,CAAC;YACvC,MAAM,UAAU,GAAG,MAAM,CAAC,wBAAwB,CAAC,IAAI,EAAE,QAAQ,CAAE,CAAA;YAEnE,iCAAiC;YACjC,IAAI,OAAO,IAAI,UAAU,EAAE,CAAC;gBAC3B,mDAAmD;gBACnD,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAA;gBAErB,4DAA4D;gBAC5D,+BAA+B;gBAC/B,IAAI,CAAC,iBAAiB,CAAC,GAAG,CAAC,QAAQ,EAAE,UAAU,CAAC,KAAK,CAAC,CAAA;gBAEtD,2DAA2D;gBAC3D,6DAA6D;gBAC7D,2DAA2D;gBAC3D,gEAAgE;gBAChE,kDAAkD;gBAClD,qDAAqD;gBACrD,+DAA+D;gBAC/D,oCAAoC;gBACpC,cAAc,CAAC,GAAG,EAAE;oBACnB,MAAM,kBAAkB,GAAG,sBAAsB,CAAC,IAAI,EAAE,QAA2B,CAAC,CAAA;oBAEpF,4DAA4D;oBAC5D,qDAAqD;oBACrD,yDAAyD;oBACzD,EAAE;oBACF,4DAA4D;oBAC5D,4DAA4D;oBAC5D,4DAA4D;oBAC5D,qDAAqD;oBACrD,mCAAmC;oBACnC,0DAA0D;oBAC1D,oDAAoD;oBACpD,0DAA0D;oBAC1D,EAAE;oBACF,qDAAqD;oBACrD,0DAA0D;oBAC1D,+DAA+D;oBAC/D,kDAAkD;oBAClD,eAAe;oBACf,IAAI,kBAAkB;wBAAE,OAAM;oBAE9B,MAAM,gBAAgB,GAAG,QAAQ,IAAK,IAAY,CAAC,SAAS,CAAA;oBAC5D,IAAI,gBAAgB;wBAAE,IAAI,CAAC,QAAQ,CAAC,GAAG,UAAU,CAAC,KAAK,CAAA;oBACvD,KAAK;gBACN,CAAC,CAAC,CAAA;YACH,CAAC;iBAAM,CAAC;gBACP,gEAAgE;gBAChE,4DAA4D;gBAC5D,0DAA0D;gBAC1D,iDAAiD;YAClD,CAAC;QACF,CAAC;IACF,CAAC;IAED,yEAAyE;IACzE,4EAA4E;IAC5E,sEAAsE;IACtE,0DAA0D;IAC1D,gDAAgD;IAChD,0BAA0B;IAC1B,WAAW,GAAG,IAAI,CAAC,iCAAiC,EAAE,CAAA;IAyBtD;;;;;;OAMG;IACM,SAAS,GAAY,IAAI,CAAA;IAElC,mEAAmE;IACnE,aAAa,CAAkB;IAE/B,CAAC,IAAI,CAAC,GAAgB,IAAI,CAAA;IAE1B;;;;OAIG;IACH,IAAc,YAAY;QACzB,IAAI,CAAC,IAAI,CAAC,SAAS;YAAE,OAAO,IAAI,CAAA;QAChC,IAAI,IAAI,CAAC,IAAI,CAAC;YAAE,OAAO,IAAI,CAAC,IAAI,CAAC,CAAA;QACjC,IAAI,IAAI,CAAC,UAAU;YAAE,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,UAAU,CAAC,CAAA;QAC1D,oFAAoF;QACpF,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,EAAC,IAAI,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,aAAa,EAAC,CAAC,CAAC,CAAA;IAC/E,CAAC;IACD,IAAc,YAAY,CAAC,CAAO;QACjC,IAAI,CAAC,IAAI,CAAC,SAAS;YAAE,MAAM,IAAI,KAAK,CAAC,+CAA+C,CAAC,CAAA;QACrF,cAAc;QACd,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,UAAU;YAAE,MAAM,IAAI,KAAK,CAAC,8DAA8D,CAAC,CAAA;QAClH,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;IACf,CAAC;IAED,gHAAgH;IAChH,IAAI,IAAI;QACP,OAAO,IAAI,CAAC,YAAY,CAAA;IACzB,CAAC;IACD,IAAI,IAAI,CAAC,GAAG;QACX,IAAI,CAAC,YAAY,GAAG,GAAG,CAAA;IACxB,CAAC;IAED;;;;;;;;;;;;;OAaG;IACH,IAAc,SAAS;QACtB,OAAO,IAAI,CAAC,YAAY,CAAA;IACzB,CAAC;IAEQ,YAAY,CAAC,OAAuB;QAC5C,IAAI,IAAI,CAAC,IAAI,CAAC;YAAE,OAAO,CAAC,IAAI,CAAC,qCAAqC,CAAC,CAAA;QACnE,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,CAAA;IAClD,CAAC;IAED,gBAAgB,CAAa;IAE7B,iBAAiB;QAChB,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAA;QAE9B,IAAI,QAAQ;YACX,IAAI,CAAC,gBAAgB,GAAG,MAAM,CAC7B,OAAO,QAAQ,KAAK,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,QAAQ,EACrE,IAAI,CAAC,YAAY,CACjB,CAAA;QAEF,IAAI,CAAC,SAAS,EAAE,CAAA;IACjB,CAAC;IAED,oBAAoB;QACnB,IAAI,CAAC,WAAW,EAAE,CAAA;QAClB,IAAI,CAAC,gBAAgB,EAAE,EAAE,CAAA;QACzB,IAAI,CAAC,aAAa,EAAE,CAAA;IACrB,CAAC;IAID,MAAM,CAAC,gCAAgC,GAAG,IAAI,OAAO,EAAgC,CAAA;IACrF,cAAc,GAAwC,IAAI,CAAA;IAE1D,iBAAiB,GAAG,CAAC,YAAoB,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,YAAY;;GAEnE,CAAA;IAEF,MAAM,CAAC,UAAU,GAAG,CAAC,CAAA;IACrB,GAAG,GAAG,EAAW,CAAC,UAAU,EAAE,CAAA;IAC9B,aAAa,GAA4B,IAAI,CAAA;IAE7C,SAAS;QACR,MAAM,IAAI,GAAG,IAAI,CAAC,WAAiC,CAAA;QACnD,MAAM,SAAS,GAAG,OAAO,IAAI,CAAC,GAAG,KAAK,UAAU,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,IAAI,EAAE,CAAA;QAC3F,MAAM,WAAW,GAAG,OAAO,IAAI,CAAC,GAAG,KAAK,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,IAAI,EAAE,CAAA;QAEhF,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACpB,MAAM,YAAY,GAAG,OAAO,CAAA;YAC5B,MAAM,WAAW,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAA;YAEnD,WAAW,CAAC,SAAS,GAAG;MACrB,IAAI,CAAC,iBAAiB,CAAC,YAAY,CAAC;MACpC,SAAS;MACT,WAAW;IACb,CAAA;YAED,sEAAsE;YACtE,+CAA+C;YAE/C,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,WAAW,CAAC,CAAA;YAEvC,sEAAsE;QACvE,CAAC;aAAM,CAAC;YACP,2EAA2E;YAC3E,mEAAmE;YACnE,yEAAyE;YACzE,yEAAyE;YACzE,wBAAwB;YAExB,8DAA8D;YAC9D,6BAA6B;YAC7B,MAAM,QAAQ,GAAG,IAAI,CAAC,WAAW,EAAE,CAAA;YAEnC,IAAI,CAAC,cAAc,GAAG,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAE,QAAuB,CAAA;YAEtF,IAAI,kBAAkB,GAAG,EAAW,CAAC,gCAAgC,CAAC,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC,CAAA;YAC9F,IAAI,CAAC,kBAAkB;gBACtB,EAAW,CAAC,gCAAgC,CAAC,GAAG,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC,kBAAkB,GAAG,EAAE,CAAC,CAAC,CAAA;YACjG,MAAM,QAAQ,GAAG,kBAAkB,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;YACtD,kBAAkB,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,QAAQ,GAAG,CAAC,CAAA;YAE/C,IAAI,QAAQ,KAAK,CAAC,EAAE,CAAC;gBACpB,MAAM,YAAY,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,CAAA;gBAC/C,MAAM,WAAW,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAA;gBAEnD,WAAW,CAAC,SAAS,GAAG;OACrB,IAAI,CAAC,iBAAiB,CAAC,YAAY,CAAC;OACpC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,UAAU,CAAC,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,SAAS;KACrE,CAAA;gBAED,WAAW,CAAC,EAAE,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,CAAA;gBAE3C,IAAI,CAAC,cAAc,CAAC,WAAW,CAAC,WAAW,CAAC,CAAA;YAC7C,CAAC;YAED,IAAI,WAAW,EAAE,CAAC;gBACjB,8DAA8D;gBAC9D,gEAAgE;gBAChE,6CAA6C;gBAC7C,MAAM,EAAE,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,GAAG,GAAG,GAAG,IAAI,CAAC,GAAG,CAAA;gBAEtD,gEAAgE;gBAChE,IAAI,CAAC,YAAY,CAAC,EAAE,EAAE,EAAE,CAAC,CAAA;gBAEzB,wDAAwD;gBACxD,+DAA+D;gBAC/D,4DAA4D;gBAC5D,2DAA2D;gBAC3D,2DAA2D;gBAC3D,0BAA0B;gBAC1B,MAAM,aAAa,GAAG,CAAC,IAAI,CAAC,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,CAAA;gBAE5E,aAAa,CAAC,EAAE,GAAG,EAAE,CAAA;gBACrB,aAAa,CAAC,SAAS,GAAG,WAAW,CAAC,UAAU,CAAC,OAAO,EAAE,IAAI,EAAE,GAAG,CAAC,CAAA;gBAEpE,MAAM,QAAQ,GAAG,IAAI,CAAC,WAAW,EAAE,CAAA;gBAEnC,IAAI,CAAC,cAAc,GAAG,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAE,QAAuB,CAAA;gBAEtF,IAAI,CAAC,cAAc,CAAC,WAAW,CAAC,aAAa,CAAC,CAAA;YAC/C,CAAC;QACF,CAAC;IACF,CAAC;IAED,aAAa;QACZ,GAAG,CAAC;YACH,IAAI,IAAI,CAAC,SAAS;gBAAE,MAAK;YAEzB,MAAM,kBAAkB,GAAG,EAAW,CAAC,gCAAgC,CAAC,GAAG,CAAC,IAAI,CAAC,cAAe,CAAC,CAAA;YAEjG,IAAI,CAAC,kBAAkB;gBAAE,MAAK;YAE9B,IAAI,QAAQ,GAAG,kBAAkB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;YAE/C,IAAI,QAAQ,KAAK,SAAS;gBAAE,MAAK;YAEjC,kBAAkB,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,EAAE,QAAQ,CAAA;YAE7C,IAAI,QAAQ,KAAK,CAAC,EAAE,CAAC;gBACpB,OAAO,kBAAkB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;gBAEvC,oDAAoD;gBACpD,wDAAwD;gBACxD,MAAM,KAAK,GAAG,IAAI,CAAC,cAAe,CAAC,aAAa,CAAC,GAAG,GAAG,IAAI,CAAC,OAAO,CAAC,CAAA;gBACpE,KAAK,EAAE,MAAM,EAAE,CAAA;YAChB,CAAC;QACF,CAAC,QAAQ,KAAK,EAAC;QAEf,IAAI,IAAI,CAAC,aAAa;YAAE,IAAI,CAAC,aAAa,CAAC,MAAM,EAAE,CAAA;IACpD,CAAC;IAED,0EAA0E;IAC1E,2EAA2E;IAC3E,eAAe,KAAI,CAAC;;;AAGrB,oEAAoE;AACpE,OAAO,EAAC,WAAW,IAAI,OAAO,EAAC,CAAA"} \ No newline at end of file +{"version":3,"file":"LumeElement.js","sourceRoot":"","sources":["../src/LumeElement.ts"],"names":[],"mappings":"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"} \ No newline at end of file diff --git a/dist/jsx-types-react.test.d.ts b/dist/jsx-types-react.test.d.ts index 135e9f6..656224f 100644 --- a/dist/jsx-types-react.test.d.ts +++ b/dist/jsx-types-react.test.d.ts @@ -1,15 +1,25 @@ import type { ReactElementAttributes } from './react.js'; +type SomeElementAttributes = 'someProp' | 'booleanProp' | 'otherProp' | 'onsomeevent' | 'onnotanevent' | 'someNumber'; declare class SomeElement extends HTMLElement { someProp: 'true' | 'false' | boolean; + ignoredBoolean: boolean; + booleanProp: boolean; get otherProp(): number; set otherProp(_: this['__set__otherProp']); /** do not use this property, its only for JSX types */ __set__otherProp: number | 'foo'; + onsomeevent?: (event: SomeEvent) => void; + onnotanevent: number; + ignoredNumber: number; + someNumber: number; +} +declare class SomeEvent extends Event { + foo: number; } declare module 'react' { namespace JSX { interface IntrinsicElements { - 'some-element': ReactElementAttributes; + 'some-element': ReactElementAttributes; } } } diff --git a/dist/jsx-types-react.test.d.ts.map b/dist/jsx-types-react.test.d.ts.map index 2f39cb6..57442fc 100644 --- a/dist/jsx-types-react.test.d.ts.map +++ b/dist/jsx-types-react.test.d.ts.map @@ -1 +1 @@ -{"version":3,"file":"jsx-types-react.test.d.ts","sourceRoot":"","sources":["../src/jsx-types-react.test.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAC,sBAAsB,EAAC,MAAM,YAAY,CAAA;AAEtD,cAAM,WAAY,SAAQ,WAAW;IACpC,QAAQ,EAAE,MAAM,GAAG,OAAO,GAAG,OAAO,CAAO;IAE3C,IAAI,SAAS,IAAI,MAAM,CAEtB;IACD,IAAI,SAAS,CAAC,CAAC,EAAE,IAAI,CAAC,kBAAkB,CAAC,EAAI;IAE7C,uDAAuD;IACvD,gBAAgB,EAAG,MAAM,GAAG,KAAK,CAAA;CACjC;AAID,OAAO,QAAQ,OAAO,CAAC;IACtB,UAAU,GAAG,CAAC;QACb,UAAU,iBAAiB;YAC1B,cAAc,EAAE,sBAAsB,CAAC,WAAW,EAAE,UAAU,GAAG,WAAW,CAAC,CAAA;SAC7E;KACD;CACD"} \ No newline at end of file +{"version":3,"file":"jsx-types-react.test.d.ts","sourceRoot":"","sources":["../src/jsx-types-react.test.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAC,sBAAsB,EAAC,MAAM,YAAY,CAAA;AAEtD,KAAK,qBAAqB,GAAG,UAAU,GAAG,aAAa,GAAG,WAAW,GAAG,aAAa,GAAG,cAAc,GAAG,YAAY,CAAA;AAErH,cAAM,WAAY,SAAQ,WAAW;IACpC,QAAQ,EAAE,MAAM,GAAG,OAAO,GAAG,OAAO,CAAO;IAE3C,cAAc,UAAQ;IAEtB,WAAW,UAAO;IAElB,IAAI,SAAS,IAAI,MAAM,CAEtB;IACD,IAAI,SAAS,CAAC,CAAC,EAAE,IAAI,CAAC,kBAAkB,CAAC,EAAI;IAE7C,uDAAuD;IACvD,gBAAgB,EAAG,MAAM,GAAG,KAAK,CAAA;IAEjC,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAA;IAExC,YAAY,SAAM;IAElB,aAAa,SAAI;IAEjB,UAAU,SAAM;CAChB;AAID,cAAM,SAAU,SAAQ,KAAK;IAC5B,GAAG,SAAI;CACP;AAED,OAAO,QAAQ,OAAO,CAAC;IACtB,UAAU,GAAG,CAAC;QACb,UAAU,iBAAiB;YAC1B,cAAc,EAAE,sBAAsB,CAAC,WAAW,EAAE,qBAAqB,CAAC,CAAA;SAC1E;KACD;CACD"} \ No newline at end of file diff --git a/dist/jsx-types-react.test.jsx b/dist/jsx-types-react.test.jsx index 633c3a6..dee45e8 100644 --- a/dist/jsx-types-react.test.jsx +++ b/dist/jsx-types-react.test.jsx @@ -1,18 +1,30 @@ /* @jsxImportSource react */ class SomeElement extends HTMLElement { someProp = true; + ignoredBoolean = false; + booleanProp = true; get otherProp() { return 0; } set otherProp(_) { } /** do not use this property, its only for JSX types */ __set__otherProp; + onsomeevent; + onnotanevent = 123; + ignoredNumber = 0; + someNumber = 123; } SomeElement; +class SomeEvent extends Event { + foo = 0; +} describe('JSX types with ReactElementAttributes', () => { it('derives JSX types from classes', () => { ; <> + {/* Ensure common element attributes still work. */} + event.button} aria-hidden="true" className="foo" style={{ color: 'red' }}/> + @@ -25,6 +37,52 @@ describe('JSX types with ReactElementAttributes', () => { {/* @ts-expect-error foo doesn't exist. TypeScript will only check existence of properties without dashes */} + + {/* @ts-expect-error `ignoredBoolean` was not selected, not available in JSX */} + + + + + + + + {/* @ts-expect-error good, only booleans and boolean strings allowed, no strings */} + + {/* @ts-expect-error good, only booleans allowed */} + + + event.foo}/> + {/* @ts-expect-error on:-prefixed event props are not for React */} + event}/> + {/* @ts-expect-error wrong event type */} + event}/> + + {/* This is fine in React, it will set the JS property to the given value instead of adding an event listener if the value is not a function. */} + + {/* @ts-expect-error good, boolean is not valid */} + + {/* @ts-expect-error good, event handler is not valid (although at runtime React will listen for "notanevent") */} + e}/> + + {/* @ts-expect-error `ignoredNumber` was not selected, not available in JSX */} + + + + {/* @ts-expect-error good, `false` is not a number */} + + + + + + + + + {/* @ts-expect-error good, "0z1010" is not a number string */} + + {/* @ts-expect-error good, "blah" is not a number string */} + + {/* @ts-expect-error good, "1.blah" is not a number string */} + ; }); }); diff --git a/dist/jsx-types-react.test.jsx.map b/dist/jsx-types-react.test.jsx.map index e2fb448..931a202 100644 --- a/dist/jsx-types-react.test.jsx.map +++ b/dist/jsx-types-react.test.jsx.map @@ -1 +1 @@ -{"version":3,"file":"jsx-types-react.test.jsx","sourceRoot":"","sources":["../src/jsx-types-react.test.tsx"],"names":[],"mappings":"AAAA,4BAA4B;AAI5B,MAAM,WAAY,SAAQ,WAAW;IACpC,QAAQ,GAA+B,IAAI,CAAA;IAE3C,IAAI,SAAS;QACZ,OAAO,CAAC,CAAA;IACT,CAAC;IACD,IAAI,SAAS,CAAC,CAA2B,IAAG,CAAC;IAE7C,uDAAuD;IACvD,gBAAgB,CAAiB;CACjC;AAED,WAAW,CAAA;AAUX,QAAQ,CAAC,uCAAuC,EAAE,GAAG,EAAE;IACtD,EAAE,CAAC,gCAAgC,EAAE,GAAG,EAAE;QACzC,CAAC;QAAA,EACA;GAAA,CAAC,YAAY,CAAC,QAAQ,CAAC,OAAO,CAAC,SAAS,CAAC,KAAK,EAC9C;GAAA,CAAC,YAAY,CAAC,QAAQ,CAAC,OAAO,CAAC,SAAS,CAAC,KAAK,EAC9C;GAAA,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,CAAC,GAAG,CAAC,EAC9C;GAAA,CAAC,8CAA8C,CAC/C;GAAA,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,EAC5B;GAAA,CAAC,8CAA8C,CAC/C;GAAA,CAAC,YAAY,CAAC,SAAS,CAAC,MAAM,EAE9B;;GAAA,CAAC,mSAAmS,CACpS;GAAA,CAAC,YAAY,CAAC,SAAS,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,EAChD;GAAA,CAAC,2GAA2G,CAC5G;GAAA,CAAC,YAAY,CAAC,GAAG,CAAC,OAAO,EAC1B;EAAA,GAAG,CAAA;IACJ,CAAC,CAAC,CAAA;AACH,CAAC,CAAC,CAAA"} \ No newline at end of file +{"version":3,"file":"jsx-types-react.test.jsx","sourceRoot":"","sources":["../src/jsx-types-react.test.tsx"],"names":[],"mappings":"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"} \ No newline at end of file diff --git a/dist/jsx-types-solid.test.d.ts b/dist/jsx-types-solid.test.d.ts index 3df1786..70a06a0 100644 --- a/dist/jsx-types-solid.test.d.ts +++ b/dist/jsx-types-solid.test.d.ts @@ -1,17 +1,30 @@ import type { ElementAttributes } from './LumeElement.js'; +type SomeElementAttributes = 'someProp' | 'booleanProp' | 'otherProp' | 'onsomeevent' | 'onnotanevent' | 'someNumber'; declare class SomeElement extends HTMLElement { someProp: 'true' | 'false' | boolean; + ignoredBoolean: boolean; + booleanProp: boolean; get otherProp(): number; set otherProp(_: this['__set__otherProp']); /** do not use this property, its only for JSX types */ __set__otherProp: number | 'foo'; + onsomeevent?: (event: SomeEvent) => void; + onnotanevent: number; + ignoredNumber: number; + someNumber: number; +} +declare class SomeEvent extends Event { + foo: number; } declare module 'solid-js' { namespace JSX { interface IntrinsicElements { - 'some-element': ElementAttributes; + 'some-element': ElementAttributes; } } + type test = { + [K in keyof ElementAttributes]: ElementAttributes[K]; + }; } export {}; //# sourceMappingURL=jsx-types-solid.test.d.ts.map \ No newline at end of file diff --git a/dist/jsx-types-solid.test.d.ts.map b/dist/jsx-types-solid.test.d.ts.map index 7e97015..829c162 100644 --- a/dist/jsx-types-solid.test.d.ts.map +++ b/dist/jsx-types-solid.test.d.ts.map @@ -1 +1 @@ -{"version":3,"file":"jsx-types-solid.test.d.ts","sourceRoot":"","sources":["../src/jsx-types-solid.test.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,kBAAkB,CAAA;AAEvD,cAAM,WAAY,SAAQ,WAAW;IACpC,QAAQ,EAAE,MAAM,GAAG,OAAO,GAAG,OAAO,CAAO;IAE3C,IAAI,SAAS,IAAI,MAAM,CAEtB;IACD,IAAI,SAAS,CAAC,CAAC,EAAE,IAAI,CAAC,kBAAkB,CAAC,EAAI;IAE7C,uDAAuD;IACvD,gBAAgB,EAAG,MAAM,GAAG,KAAK,CAAA;CACjC;AAID,OAAO,QAAQ,UAAU,CAAC;IACzB,UAAU,GAAG,CAAC;QACb,UAAU,iBAAiB;YAC1B,cAAc,EAAE,iBAAiB,CAAC,WAAW,EAAE,UAAU,GAAG,WAAW,CAAC,CAAA;SACxE;KACD;CACD"} \ No newline at end of file +{"version":3,"file":"jsx-types-solid.test.d.ts","sourceRoot":"","sources":["../src/jsx-types-solid.test.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,kBAAkB,CAAA;AAEvD,KAAK,qBAAqB,GAAG,UAAU,GAAG,aAAa,GAAG,WAAW,GAAG,aAAa,GAAG,cAAc,GAAG,YAAY,CAAA;AAErH,cACM,WAAY,SAAQ,WAAW;IACpC,QAAQ,EAAE,MAAM,GAAG,OAAO,GAAG,OAAO,CAAO;IAE3C,cAAc,UAAQ;IAEtB,WAAW,UAAO;IAElB,IAAI,SAAS,IAAI,MAAM,CAEtB;IACD,IAAI,SAAS,CAAC,CAAC,EAAE,IAAI,CAAC,kBAAkB,CAAC,EAAI;IAE7C,uDAAuD;IACvD,gBAAgB,EAAG,MAAM,GAAG,KAAK,CAAA;IAEjC,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAA;IAExC,YAAY,SAAM;IAElB,aAAa,SAAI;IAEjB,UAAU,SAAM;CAChB;AAID,cAAM,SAAU,SAAQ,KAAK;IAC5B,GAAG,SAAI;CACP;AAED,OAAO,QAAQ,UAAU,CAAC;IACzB,UAAU,GAAG,CAAC;QACb,UAAU,iBAAiB;YAC1B,cAAc,EAAE,iBAAiB,CAAC,WAAW,EAAE,qBAAqB,CAAC,CAAA;SACrE;KACD;IAED,KAAK,IAAI,GAAG;SACV,CAAC,IAAI,MAAM,iBAAiB,CAAC,WAAW,EAAE,qBAAqB,CAAC,GAAG,iBAAiB,CACpF,WAAW,EACX,qBAAqB,CACrB,CAAC,CAAC,CAAC;KACJ,CAAA;CACD"} \ No newline at end of file diff --git a/dist/jsx-types-solid.test.jsx b/dist/jsx-types-solid.test.jsx index edf139c..7a86b96 100644 --- a/dist/jsx-types-solid.test.jsx +++ b/dist/jsx-types-solid.test.jsx @@ -1,18 +1,81 @@ /* @jsxImportSource solid-js */ -class SomeElement extends HTMLElement { - someProp = true; - get otherProp() { - return 0; +var __esDecorate = (this && this.__esDecorate) || function (ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) { + function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; } + var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value"; + var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null; + var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {}); + var _, done = false; + for (var i = decorators.length - 1; i >= 0; i--) { + var context = {}; + for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p]; + for (var p in contextIn.access) context.access[p] = contextIn.access[p]; + context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); }; + var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context); + if (kind === "accessor") { + if (result === void 0) continue; + if (result === null || typeof result !== "object") throw new TypeError("Object expected"); + if (_ = accept(result.get)) descriptor.get = _; + if (_ = accept(result.set)) descriptor.set = _; + if (_ = accept(result.init)) initializers.unshift(_); + } + else if (_ = accept(result)) { + if (kind === "field") initializers.unshift(_); + else descriptor[key] = _; + } } - set otherProp(_) { } - /** do not use this property, its only for JSX types */ - __set__otherProp; -} + if (target) Object.defineProperty(target, contextIn.name, descriptor); + done = true; +}; +var __runInitializers = (this && this.__runInitializers) || function (thisArg, initializers, value) { + var useValue = arguments.length > 2; + for (var i = 0; i < initializers.length; i++) { + value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg); + } + return useValue ? value : void 0; +}; +import { element } from './element.js'; +let SomeElement = (() => { + let _classDecorators = [element('some-element-solid-jsx')]; + let _classDescriptor; + let _classExtraInitializers = []; + let _classThis; + let _classSuper = HTMLElement; + var SomeElement = class extends _classSuper { + static { _classThis = this; } + static { + const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0; + __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers); + SomeElement = _classThis = _classDescriptor.value; + if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata }); + __runInitializers(_classThis, _classExtraInitializers); + } + someProp = true; + ignoredBoolean = false; + booleanProp = true; + get otherProp() { + return 0; + } + set otherProp(_) { } + /** do not use this property, its only for JSX types */ + __set__otherProp; + onsomeevent; + onnotanevent = 123; + ignoredNumber = 0; + someNumber = 123; + }; + return SomeElement = _classThis; +})(); SomeElement; +class SomeEvent extends Event { + foo = 0; +} describe('JSX types with ElementAttributes', () => { it('derives JSX types from classes', () => { ; <> + {/* Ensure common element attributes still work. */} + event.button} aria-hidden="true" class="foo" style="color: red"/> + @@ -21,12 +84,176 @@ describe('JSX types with ElementAttributes', () => { {/* @ts-expect-error good, 'blah' is invalid */} + + + + {/* @ts-expect-error good, number is invalid */} + + {/* @ts-expect-error good, someProp JSX is not valid, has to be dash-cased version of the JS prop, or use the prop: prefix */} + + {/* @ts-expect-error good, 'blah' is invalid */} + + {/* Additionally TypeScript will allow unknown dash-case props (the attr: can be used here to tell Solid to set the element attributes instead of the JS properties) */} + {/* @ts-expect-error string types can be checked, here an invalid string type */} + + + + + + + {/* @ts-expect-error good, "blah" is not valid */} + + {/* @ts-expect-error good, "blah" is not valid */} + + + + + + + {/* @ts-expect-error good, "blah" is not valid */} + + {/* @ts-expect-error good, "blah" is not valid */} + + + + + {/* @ts-expect-error good, only booleans are allowed when using `bool:` */} + + {/* @ts-expect-error good, only booleans are allowed when using `bool:` */} + + {/* @ts-expect-error good, "blah" is not valid */} + + {/* @ts-expect-error good, "blah" is not valid */} + + + + + {/* @ts-expect-error good, only the strings "false" and "false" are allowed in attribute form */} + + {/* @ts-expect-error good, only the strings "false" and "false" are allowed in attribute form */} + + {/* @ts-expect-error good, "blah" is not valid */} + + {/* @ts-expect-error good, "blah" is not valid */} + + + {/* @ts-expect-error `ignoredBoolean` was not selected, not available in JSX */} + + + + + + + {/* @ts-expect-error good, "blah" is not valid */} + + {/* @ts-expect-error good, "blah" is not valid */} + + + + + + + {/* @ts-expect-error good, "blah" is not valid */} + + {/* @ts-expect-error good, "blah" is not valid */} + + + + + {/* @ts-expect-error good, only booleans are allowed when using `bool:` */} + + {/* @ts-expect-error good, only booleans are allowed when using `bool:` */} + + {/* @ts-expect-error good, "blah" is not valid */} + + {/* @ts-expect-error good, "blah" is not valid */} + + + + + {/* @ts-expect-error good, only the strings "false" and "false" are allowed in attribute form */} + + {/* @ts-expect-error good, only the strings "false" and "false" are allowed in attribute form */} + + {/* @ts-expect-error good, "blah" is not valid */} + + {/* @ts-expect-error good, "blah" is not valid */} + + {/* @ts-expect-error foo doesn't exist. TypeScript will only check existence of properties without dashes */} + + event.foo}/> + event.foo}/> + {/* @ts-expect-error wrong event type */} + event}/> + {/* @ts-expect-error wrong event type */} + event}/> + + {/* @ts-expect-error the property cannot be used like this, as Solid will try to pass the number to addEventListener, so we make it error with `never`. Use prop: or attr: instead. */} + + {/* @ts-expect-error only strings can be assigned to attributes */} + + + + + {/* @ts-expect-error `ignoredNumber` was not selected, not available in JSX */} + + + + {/* @ts-expect-error good, `false` is not a number */} + + + + + + + + + {/* @ts-expect-error good, "0z1010" is not a number string */} + + {/* @ts-expect-error good, "blah" is not a number string */} + + {/* @ts-expect-error good, "1.blah" is not a number string */} + + + + {/* @ts-expect-error good, `false` is not a number */} + + + + + + + + + {/* @ts-expect-error good, "0z1010" is not a number string */} + + {/* @ts-expect-error good, "blah" is not a number string */} + + {/* @ts-expect-error good, "1.blah" is not a number string */} + + + {/* @ts-expect-error good, attribute accepts only strings */} + + {/* @ts-expect-error good, `false` is not a number string */} + + + + + + + + + {/* @ts-expect-error good, "0z1010" is not a number string */} + + {/* @ts-expect-error good, "blah" is not a number string */} + + {/* @ts-expect-error good, "1.blah" is not a number string */} + ; }); }); -export {}; //# sourceMappingURL=jsx-types-solid.test.jsx.map \ No newline at end of file diff --git a/dist/jsx-types-solid.test.jsx.map b/dist/jsx-types-solid.test.jsx.map index bd4d335..e291379 100644 --- a/dist/jsx-types-solid.test.jsx.map +++ b/dist/jsx-types-solid.test.jsx.map @@ -1 +1 @@ -{"version":3,"file":"jsx-types-solid.test.jsx","sourceRoot":"","sources":["../src/jsx-types-solid.test.tsx"],"names":[],"mappings":"AAAA,+BAA+B;AAI/B,MAAM,WAAY,SAAQ,WAAW;IACpC,QAAQ,GAA+B,IAAI,CAAA;IAE3C,IAAI,SAAS;QACZ,OAAO,CAAC,CAAA;IACT,CAAC;IACD,IAAI,SAAS,CAAC,CAA2B,IAAG,CAAC;IAE7C,uDAAuD;IACvD,gBAAgB,CAAiB;CACjC;AAED,WAAW,CAAA;AAUX,QAAQ,CAAC,kCAAkC,EAAE,GAAG,EAAE;IACjD,EAAE,CAAC,gCAAgC,EAAE,GAAG,EAAE;QACzC,CAAC;QAAA,EACA;GAAA,CAAC,YAAY,CAAC,SAAS,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,EAChD;GAAA,CAAC,YAAY,CAAC,SAAS,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,EAChD;GAAA,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC,CAAC,GAAG,CAAC,EAChD;GAAA,CAAC,8CAA8C,CAC/C;GAAA,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,GAAG,CAAC,EAC7B;GAAA,CAAC,8CAA8C,CAC/C;GAAA,CAAC,YAAY,CAAC,UAAU,CAAC,MAAM,EAE/B;;GAAA,CAAC,sKAAsK,CACvK;GAAA,CAAC,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,KAAK,EAC1D;GAAA,CAAC,2GAA2G,CAC5G;GAAA,CAAC,YAAY,CAAC,GAAG,CAAC,OAAO,EAC1B;EAAA,GAAG,CAAA;IACJ,CAAC,CAAC,CAAA;AACH,CAAC,CAAC,CAAA"} \ No newline at end of file +{"version":3,"file":"jsx-types-solid.test.jsx","sourceRoot":"","sources":["../src/jsx-types-solid.test.tsx"],"names":[],"mappings":"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"} \ No newline at end of file diff --git a/dist/react.d.ts b/dist/react.d.ts index d87c077..a17285b 100644 --- a/dist/react.d.ts +++ b/dist/react.d.ts @@ -1,13 +1,13 @@ import type { HTMLAttributes as ReactHTMLAttributes, DetailedHTMLProps as ReactDetailedHTMLProps } from 'react'; -import type { RemoveAccessors, RemovePrefixes, SetterTypePrefix, WithStringValues } from './LumeElement.js'; +import type { BooleanProps, EventProps, FunctionsOnly, NonBooleanProps, NonEventProps, NonNumberProps, NumberProps, RemoveAccessors, RemoveSetterPrefixes, SetterTypePrefix, WithBooleanStringValues, WithNumberStringValues, WithStringValues } from './LumeElement.js'; /** * Similar to ElementAttributes, but for defining element attribute types for * React JSX. See LUME Element's [TypeScript * docs](https://docs.lume.io/#/guide/making-elements?id=typescript) for * details. */ -export type ReactElementAttributes, SetterTypePrefix>, AdditionalProperties extends object = {}> = Omit, ElementType>, SelectedProperties | keyof AdditionalProperties> & { +export type ReactElementAttributes, SetterTypePrefix>, AdditionalProperties extends object = {}> = Omit, El>, SelectedProperties | keyof AdditionalProperties> & { /** The 'has' attribute from the 'element-behaviors' package. If element-behaviors is installed and imported (it is if you're using `lume` 3D elements) then this specifies which behaviors to instantiate on the given element. */ has?: string; -} & Partial, SetterTypePrefix>, SelectedProperties>>> & AdditionalProperties; +} & Partial>>>> & FunctionsOnly> & Partial>>> & Partial>>> & AdditionalProperties; //# sourceMappingURL=react.d.ts.map \ No newline at end of file diff --git a/dist/react.d.ts.map b/dist/react.d.ts.map index c33566f..5db902c 100644 --- a/dist/react.d.ts.map +++ b/dist/react.d.ts.map @@ -1 +1 @@ -{"version":3,"file":"react.d.ts","sourceRoot":"","sources":["../src/react.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,cAAc,IAAI,mBAAmB,EAAE,iBAAiB,IAAI,sBAAsB,EAAC,MAAM,OAAO,CAAA;AAC7G,OAAO,KAAK,EAAC,eAAe,EAAE,cAAc,EAAE,gBAAgB,EAAE,gBAAgB,EAAC,MAAM,kBAAkB,CAAA;AAGzG;;;;;GAKG;AACH,MAAM,MAAM,sBAAsB,CACjC,WAAW,SAAS,WAAW,EAC/B,kBAAkB,SAAS,MAAM,cAAc,CAAC,eAAe,CAAC,WAAW,CAAC,EAAE,gBAAgB,CAAC,EAC/F,oBAAoB,SAAS,MAAM,GAAG,EAAE,IACrC,IAAI,CACN,sBAAsB,CAAC,mBAAmB,CAAC,WAAW,CAAC,EAAE,WAAW,CAAC,EACrE,kBAAkB,GAAG,MAAM,oBAAoB,CAC/C,GAEC;IACD,mOAAmO;IACnO,GAAG,CAAC,EAAE,MAAM,CAAA;CACZ,GAEC,OAAO,CAAC,gBAAgB,CAAC,IAAI,CAAC,cAAc,CAAC,eAAe,CAAC,WAAW,CAAC,EAAE,gBAAgB,CAAC,EAAE,kBAAkB,CAAC,CAAC,CAAC,GAEnH,oBAAoB,CAAA"} \ No newline at end of file +{"version":3,"file":"react.d.ts","sourceRoot":"","sources":["../src/react.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,cAAc,IAAI,mBAAmB,EAAE,iBAAiB,IAAI,sBAAsB,EAAC,MAAM,OAAO,CAAA;AAC7G,OAAO,KAAK,EACX,YAAY,EACZ,UAAU,EACV,aAAa,EACb,eAAe,EACf,aAAa,EACb,cAAc,EACd,WAAW,EACX,eAAe,EACf,oBAAoB,EACpB,gBAAgB,EAChB,uBAAuB,EACvB,sBAAsB,EACtB,gBAAgB,EAChB,MAAM,kBAAkB,CAAA;AAGzB;;;;;GAKG;AACH,MAAM,MAAM,sBAAsB,CACjC,EAAE,EACF,kBAAkB,SAAS,MAAM,oBAAoB,CAAC,eAAe,CAAC,EAAE,CAAC,EAAE,gBAAgB,CAAC,EAC5F,oBAAoB,SAAS,MAAM,GAAG,EAAE,IAEtC,IAAI,CACL,sBAAsB,CAAC,mBAAmB,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,EACnD,kBAAkB,GAAG,MAAM,oBAAoB,CAC/C,GAEC;IACD,mOAAmO;IACnO,GAAG,CAAC,EAAE,MAAM,CAAA;CACZ,GAEC,OAAO,CAAC,gBAAgB,CAAC,cAAc,CAAC,eAAe,CAAC,aAAa,CAAC,EAAE,EAAE,kBAAkB,CAAC,CAAC,CAAC,CAAC,CAAC,GAGjG,aAAa,CAAC,UAAU,CAAC,EAAE,EAAE,kBAAkB,CAAC,CAAC,GAEjD,OAAO,CAAC,uBAAuB,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,EAAE,kBAAkB,CAAC,CAAC,CAAC,CAAC,GAErF,OAAO,CAAC,sBAAsB,CAAC,WAAW,CAAC,aAAa,CAAC,EAAE,EAAE,kBAAkB,CAAC,CAAC,CAAC,CAAC,GAEnF,oBAAoB,CAAA"} \ No newline at end of file diff --git a/src/LumeElement.ts b/src/LumeElement.ts index 7fa0013..800564d 100644 --- a/src/LumeElement.ts +++ b/src/LumeElement.ts @@ -449,6 +449,27 @@ class LumeElement extends Effectful(HTMLElement) { // not used currently, but we'll leave this here so that child classes can // call super, and that way we can add an implementation later when needed. adoptedCallback() {} + + /** + * This is similar to `dispatchEvent()`, but useful for dispatching a + * non-builtin event and causing any `on*` method for that event to also be + * called if it exists. + * + * With builtin events, for example, when the builtin `click` event is + * dispatched, the element's `.onclick()` method is called automatically if + * it exists. Now we can achieve the same behavior with custom events, so + * that for example `dispatchEventWithCall(new Event('myevent'))` will + * also cause `.onmyevent()` to be called if it exists. + * + * Note, avoid calling this method with an event that is not a custom event, + * or you'll trigger the respective builtin `on*` method twice. + */ + dispatchEventWithCall(event: Event) { + const name = event.type + const methodName = 'on' + name + if (methodName in this) (this as any)[methodName](event) + return super.dispatchEvent(event) + } } // TODO rename the export to LumeElement in a breaking version bump. @@ -502,52 +523,126 @@ type Template = TemplateContent | (() => TemplateContent) * ``` */ export type ElementAttributes< - ElementType extends HTMLElement, - SelectedProperties extends keyof RemovePrefixes, SetterTypePrefix>, + El, + SelectedProperties extends keyof RemoveSetterPrefixes, SetterTypePrefix>, AdditionalProperties extends object = {}, -> = Omit< - JSX.HTMLAttributes, - SelectedProperties | keyof AdditionalProperties | 'onerror' -> - & { - // Fixes the onerror JSX prop type (https://github.com/microsoft/TypeScript-DOM-lib-generator/issues/1821) - onerror?: ((error: ErrorEvent) => void) | null - } +> = + // Any props inherited from HTMLElement except for any that we will override from the custom element subclass or AdditionalProperties + & Omit< + JSX.HTMLAttributes, + SelectedProperties | keyof AdditionalProperties | 'onerror' + > + // Fixes the onerror JSX prop type (https://github.com/microsoft/TypeScript-DOM-lib-generator/issues/1821) + & { onerror?: ((error: ErrorEvent) => void) | null } + + // All non-'on' non-boolean properties + & Partial< DashCasedProps< WithStringValues< NonNumberProps< NonBooleanProps< NonOnProps > > > > > + + // All 'on' properties that are not functions, they will always error when not prefixed with prop: or attr: + & Partial>, never>> + // All non-event properties that are not boolean, prefixed with prop: + & Partial< PrefixProps<'prop:', WithStringValues< NonNumberProps< NonBooleanProps< NonEventProps > > > > > + + // All non-event properties that are not boolean, prefixed with attr: + & Partial< PrefixProps<'attr:', DashCasedProps< AsStringValues< NonNumberProps< NonBooleanProps< NonEventProps > > > > > > + + // Boolean attributes + & Partial< + DashCasedProps< WithBooleanStringValues< BooleanProps< Pick, SelectedProperties> > > > + & PrefixProps<'bool:', DashCasedProps< AsBooleanValues< BooleanProps< Pick, SelectedProperties> > > > > + & PrefixProps<'prop:', WithBooleanStringValues< BooleanProps< Pick, SelectedProperties> > > > + & PrefixProps<'attr:', DashCasedProps< AsBooleanStringValues< BooleanProps< Pick, SelectedProperties> > > > > + > + + // Number attributes & Partial< - DashCasedProps< - WithStringValues< - Pick< - RemovePrefixes, SetterTypePrefix>, - SelectedProperties - > - > - > + DashCasedProps< WithNumberStringValues< NumberProps< Pick, SelectedProperties> > > > + & PrefixProps<'prop:', WithNumberStringValues< NumberProps< Pick, SelectedProperties> > > > + & PrefixProps<'attr:', DashCasedProps< AsNumberStringValues< NumberProps< Pick, SelectedProperties> > > > > > + // Pick the `on*` event handler types from the element type, without string values (only functions) + & FunctionsOnly> + // Also map `on*` event handler types to `on:*` prop types for JSX + & Partial>>> + & AdditionalProperties +// This maps __set__foo, replacing any existing `get foo` type, so that the JSX prop type will be that of the specified setter type instead of the getter type. +type RemapSetters = RemoveSetterPrefixes, SetterTypePrefix> + +type NonOnProps> = Pick, OmitFromUnion>> + +export type NonEventProps, SetterTypePrefix>> = + // All non-'on' properties + NonOnProps & + // All 'on' properties that are not functions + NonFunctionsOnly> + +export type EventProps = Pick>> + +export type NonBooleanProps = Omit> + +export type BooleanProps = {[K in keyof T as T[K] extends boolean | 'true' | 'false' ? K : never]: T[K]} + +export type NonNumberProps = Omit> + +export type NumberProps = {[K in keyof T as T[K] extends number ? K : never]: T[K]} + +export type FunctionsOnly = {[K in keyof T as NonNullable extends (...args: any[]) => any ? K : never]: T[K]} + +export type NonFunctionsOnly = { + [K in keyof T as ((...args: any[]) => any) extends NonNullable ? never : K]: T[K] +} + /** * Make all non-string properties union with |string because they can all * receive string values from string attributes like opacity="0.5" (those values * are converted to the types of values they should be, f.e. reading a * `@numberAttribute` property always returns a `number`) */ -export type WithStringValues = { - // [Property in keyof Type]: NonNullable extends string ? Type[Property] : Type[Property] | string - [Property in keyof Type]: PickFromUnion extends never +export type WithStringValues = { + [K in keyof T]: PickFromUnion extends never ? // if the type does not include a type assignable to string - Type[Property] | string + T[K] | string : // otherwise it does - Type[Property] + T[K] +} + +export type WithBooleanStringValues = {[K in keyof T]: T[K] | 'true' | 'false'} +export type AsBooleanStringValues = {[K in keyof T]: 'true' | 'false'} +export type AsBooleanValues = {[K in keyof T]: boolean} +export type WithNumberStringValues = {[K in keyof T]: T[K] | `${number}`} +export type AsNumberStringValues = {[K in keyof T]: `${number}`} +export type AsValues = {[K in keyof T]: V} + +type AsStringValues = { + [K in keyof T]: PickFromUnion extends never + ? // if the type does not include a type assignable to string + string + : // otherwise it does + T[K] } type StringKeysOnly = OmitFromUnion -type OmitFromUnion = T extends TypeToOmit ? never : T +export type OmitFromUnion = T extends TypeToOmit ? never : T type PickFromUnion = T extends TypeToPick ? T : never -export type RemovePrefixes = { +export type EventKeys = T extends `on${infer _}` ? T : never + +type AddDelimitersToEventKeys = { + [K in keyof T as K extends string ? AddDelimiters : never]: T[K] +} + +type AddDelimiters = T extends `${'on'}${infer Right}` + ? `${'on'}${Delimiter}${Right}` + : T + +type PrefixProps = {[K in keyof T as K extends string ? `${Prefix}${K}` : K]: T[K]} + +export type RemoveSetterPrefixes = { [K in keyof T as K extends string ? RemovePrefix : K]: T[K] } @@ -559,8 +654,6 @@ export type RemoveAccessors = { type SetterTypeKeysFor = keyof PrefixPick -type PrefixPick = { - [K in keyof T as K extends `${Prefix}${string}` ? K : never]: T[K] -} +type PrefixPick = {[K in keyof T as K extends `${Prefix}${string}` ? K : never]: T[K]} export type SetterTypePrefix = '__set__' diff --git a/src/jsx-types-react.test.tsx b/src/jsx-types-react.test.tsx index d8bc68a..8d5e7ef 100644 --- a/src/jsx-types-react.test.tsx +++ b/src/jsx-types-react.test.tsx @@ -2,9 +2,15 @@ import type {ReactElementAttributes} from './react.js' +type SomeElementAttributes = 'someProp' | 'booleanProp' | 'otherProp' | 'onsomeevent' | 'onnotanevent' | 'someNumber' + class SomeElement extends HTMLElement { someProp: 'true' | 'false' | boolean = true + ignoredBoolean = false + + booleanProp = true + get otherProp(): number { return 0 } @@ -12,14 +18,26 @@ class SomeElement extends HTMLElement { /** do not use this property, its only for JSX types */ __set__otherProp!: number | 'foo' + + onsomeevent?: (event: SomeEvent) => void + + onnotanevent = 123 + + ignoredNumber = 0 + + someNumber = 123 } SomeElement +class SomeEvent extends Event { + foo = 0 +} + declare module 'react' { namespace JSX { interface IntrinsicElements { - 'some-element': ReactElementAttributes + 'some-element': ReactElementAttributes } } } @@ -27,6 +45,9 @@ declare module 'react' { describe('JSX types with ReactElementAttributes', () => { it('derives JSX types from classes', () => { ;<> + {/* Ensure common element attributes still work. */} + event.button} aria-hidden="true" className="foo" style={{color: 'red'}} /> + @@ -39,6 +60,52 @@ describe('JSX types with ReactElementAttributes', () => { {/* @ts-expect-error foo doesn't exist. TypeScript will only check existence of properties without dashes */} + + {/* @ts-expect-error `ignoredBoolean` was not selected, not available in JSX */} + + + + + + + + {/* @ts-expect-error good, only booleans and boolean strings allowed, no strings */} + + {/* @ts-expect-error good, only booleans allowed */} + + + event.foo} /> + {/* @ts-expect-error on:-prefixed event props are not for React */} + event} /> + {/* @ts-expect-error wrong event type */} + event} /> + + {/* This is fine in React, it will set the JS property to the given value instead of adding an event listener if the value is not a function. */} + + {/* @ts-expect-error good, boolean is not valid */} + + {/* @ts-expect-error good, event handler is not valid (although at runtime React will listen for "notanevent") */} + e} /> + + {/* @ts-expect-error `ignoredNumber` was not selected, not available in JSX */} + + + + {/* @ts-expect-error good, `false` is not a number */} + + + + + + + + + {/* @ts-expect-error good, "0z1010" is not a number string */} + + {/* @ts-expect-error good, "blah" is not a number string */} + + {/* @ts-expect-error good, "1.blah" is not a number string */} + }) }) diff --git a/src/jsx-types-solid.test.tsx b/src/jsx-types-solid.test.tsx index 913556f..15ec267 100644 --- a/src/jsx-types-solid.test.tsx +++ b/src/jsx-types-solid.test.tsx @@ -1,10 +1,18 @@ /* @jsxImportSource solid-js */ +import {element} from './element.js' import type {ElementAttributes} from './LumeElement.js' +type SomeElementAttributes = 'someProp' | 'booleanProp' | 'otherProp' | 'onsomeevent' | 'onnotanevent' | 'someNumber' + +@element('some-element-solid-jsx') class SomeElement extends HTMLElement { someProp: 'true' | 'false' | boolean = true + ignoredBoolean = false + + booleanProp = true + get otherProp(): number { return 0 } @@ -12,21 +20,43 @@ class SomeElement extends HTMLElement { /** do not use this property, its only for JSX types */ __set__otherProp!: number | 'foo' + + onsomeevent?: (event: SomeEvent) => void + + onnotanevent = 123 + + ignoredNumber = 0 + + someNumber = 123 } SomeElement +class SomeEvent extends Event { + foo = 0 +} + declare module 'solid-js' { namespace JSX { interface IntrinsicElements { - 'some-element': ElementAttributes + 'some-element': ElementAttributes } } + + type test = { + [K in keyof ElementAttributes]: ElementAttributes< + SomeElement, + SomeElementAttributes + >[K] + } } describe('JSX types with ElementAttributes', () => { it('derives JSX types from classes', () => { ;<> + {/* Ensure common element attributes still work. */} + event.button} aria-hidden="true" class="foo" style="color: red" /> + @@ -35,10 +65,175 @@ describe('JSX types with ElementAttributes', () => { {/* @ts-expect-error good, 'blah' is invalid */} + + + + {/* @ts-expect-error good, number is invalid */} + + {/* @ts-expect-error good, someProp JSX is not valid, has to be dash-cased version of the JS prop, or use the prop: prefix */} + + {/* @ts-expect-error good, 'blah' is invalid */} + + {/* Additionally TypeScript will allow unknown dash-case props (the attr: can be used here to tell Solid to set the element attributes instead of the JS properties) */} + {/* @ts-expect-error string types can be checked, here an invalid string type */} + + + + + + + {/* @ts-expect-error good, "blah" is not valid */} + + {/* @ts-expect-error good, "blah" is not valid */} + + + + + + + {/* @ts-expect-error good, "blah" is not valid */} + + {/* @ts-expect-error good, "blah" is not valid */} + + + + + {/* @ts-expect-error good, only booleans are allowed when using `bool:` */} + + {/* @ts-expect-error good, only booleans are allowed when using `bool:` */} + + {/* @ts-expect-error good, "blah" is not valid */} + + {/* @ts-expect-error good, "blah" is not valid */} + + + + + {/* @ts-expect-error good, only the strings "false" and "false" are allowed in attribute form */} + + {/* @ts-expect-error good, only the strings "false" and "false" are allowed in attribute form */} + + {/* @ts-expect-error good, "blah" is not valid */} + + {/* @ts-expect-error good, "blah" is not valid */} + + + {/* @ts-expect-error `ignoredBoolean` was not selected, not available in JSX */} + + + + + + + {/* @ts-expect-error good, "blah" is not valid */} + + {/* @ts-expect-error good, "blah" is not valid */} + + + + + + + {/* @ts-expect-error good, "blah" is not valid */} + + {/* @ts-expect-error good, "blah" is not valid */} + + + + + {/* @ts-expect-error good, only booleans are allowed when using `bool:` */} + + {/* @ts-expect-error good, only booleans are allowed when using `bool:` */} + + {/* @ts-expect-error good, "blah" is not valid */} + + {/* @ts-expect-error good, "blah" is not valid */} + + + + + {/* @ts-expect-error good, only the strings "false" and "false" are allowed in attribute form */} + + {/* @ts-expect-error good, only the strings "false" and "false" are allowed in attribute form */} + + {/* @ts-expect-error good, "blah" is not valid */} + + {/* @ts-expect-error good, "blah" is not valid */} + + {/* @ts-expect-error foo doesn't exist. TypeScript will only check existence of properties without dashes */} + + event.foo} /> + event.foo} /> + {/* @ts-expect-error wrong event type */} + event} /> + {/* @ts-expect-error wrong event type */} + event} /> + + {/* @ts-expect-error the property cannot be used like this, as Solid will try to pass the number to addEventListener, so we make it error with `never`. Use prop: or attr: instead. */} + + {/* @ts-expect-error only strings can be assigned to attributes */} + + + + + {/* @ts-expect-error `ignoredNumber` was not selected, not available in JSX */} + + + + {/* @ts-expect-error good, `false` is not a number */} + + + + + + + + + {/* @ts-expect-error good, "0z1010" is not a number string */} + + {/* @ts-expect-error good, "blah" is not a number string */} + + {/* @ts-expect-error good, "1.blah" is not a number string */} + + + + {/* @ts-expect-error good, `false` is not a number */} + + + + + + + + + {/* @ts-expect-error good, "0z1010" is not a number string */} + + {/* @ts-expect-error good, "blah" is not a number string */} + + {/* @ts-expect-error good, "1.blah" is not a number string */} + + + {/* @ts-expect-error good, attribute accepts only strings */} + + {/* @ts-expect-error good, `false` is not a number string */} + + + + + + + + + {/* @ts-expect-error good, "0z1010" is not a number string */} + + {/* @ts-expect-error good, "blah" is not a number string */} + + {/* @ts-expect-error good, "1.blah" is not a number string */} + }) }) diff --git a/src/react.ts b/src/react.ts index 11e59d0..060fc95 100644 --- a/src/react.ts +++ b/src/react.ts @@ -1,5 +1,19 @@ import type {HTMLAttributes as ReactHTMLAttributes, DetailedHTMLProps as ReactDetailedHTMLProps} from 'react' -import type {RemoveAccessors, RemovePrefixes, SetterTypePrefix, WithStringValues} from './LumeElement.js' +import type { + BooleanProps, + EventProps, + FunctionsOnly, + NonBooleanProps, + NonEventProps, + NonNumberProps, + NumberProps, + RemoveAccessors, + RemoveSetterPrefixes, + SetterTypePrefix, + WithBooleanStringValues, + WithNumberStringValues, + WithStringValues, +} from './LumeElement.js' // prettier-ignore /** @@ -9,11 +23,12 @@ import type {RemoveAccessors, RemovePrefixes, SetterTypePrefix, WithStringValues * details. */ export type ReactElementAttributes< - ElementType extends HTMLElement, - SelectedProperties extends keyof RemovePrefixes, SetterTypePrefix>, + El, + SelectedProperties extends keyof RemoveSetterPrefixes, SetterTypePrefix>, AdditionalProperties extends object = {}, -> = Omit< - ReactDetailedHTMLProps, ElementType>, +> = + & Omit< + ReactDetailedHTMLProps, El>, SelectedProperties | keyof AdditionalProperties > @@ -22,6 +37,13 @@ export type ReactElementAttributes< has?: string } - & Partial, SetterTypePrefix>, SelectedProperties>>> + & Partial>>>> + + // Pick the `onfoo` event handler types from the element type, without string values + & FunctionsOnly> + + & Partial>>> + + & Partial>>> & AdditionalProperties