update jsdoc comment

lume · Sep 20, 2024 · c372a81 · c372a81
1 parent e474ad0
commit c372a81
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 5 deletions.
diff --git a/dist/LumeElement.d.ts b/dist/LumeElement.d.ts
@@ -191,14 +191,21 @@ type Template = TemplateContent | (() => TemplateContent);
  * }
  * ```
  *
- * The result is that TypeScript will properly type-check the following
- * JSX expression (notice lorem-ipsum is dash-case):
+ * The result is that TypeScript will properly type-check the following JSX
+ * expression (notice loremIpsum is camelCase in the class, but dash-cased
+ * lorem-ipsum is used in the JSX):
  *
  * ```jsx
  * let coolEl = <cool-element foo={'foo'} bar={null} lorem-ipsum={456}></cool-element>
  * ```
  */
 export type ElementAttributes<ElementType, SelectedProperties extends keyof ElementType, AdditionalProperties extends object = {}> = WithStringValues<DashCasedProps<Partial<Pick<ElementType, SelectedProperties>>>> & AdditionalProperties & Omit<JSX.HTMLAttributes<ElementType>, SelectedProperties | keyof AdditionalProperties>;
+/**
+ * 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`)
+ */
 type WithStringValues<Type extends object> = {
     [Property in keyof Type]: NonNullable<Type[Property]> extends string ? Type[Property] : Type[Property] | string;
 };

diff --git a/dist/LumeElement.d.ts.map b/dist/LumeElement.d.ts.map
diff --git a/src/LumeElement.ts b/src/LumeElement.ts
@@ -482,8 +482,9 @@ type Template = TemplateContent | (() => TemplateContent)
  * }
  * ```
  *
- * The result is that TypeScript will properly type-check the following
- * JSX expression (notice lorem-ipsum is dash-case):
+ * The result is that TypeScript will properly type-check the following JSX
+ * expression (notice loremIpsum is camelCase in the class, but dash-cased
+ * lorem-ipsum is used in the JSX):
  *
  * ```jsx
  * let coolEl = <cool-element foo={'foo'} bar={null} lorem-ipsum={456}></cool-element>
@@ -497,6 +498,12 @@ export type ElementAttributes<
 	AdditionalProperties &
 	Omit<JSX.HTMLAttributes<ElementType>, SelectedProperties | keyof AdditionalProperties>
 
+/**
+ * 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`)
+ */
 type WithStringValues<Type extends object> = {
 	[Property in keyof Type]: NonNullable<Type[Property]> extends string ? Type[Property] : Type[Property] | string
 }