Merge pull request #145 from break-stuff/solidjs-directive-support

add directive support for Solidjs types
break-stuff · Jul 17, 2024 · 1643b28 · 1643b28
2 parents 870dc63 + 38777c1
commit 1643b28
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 8 deletions.
diff --git a/demo/lit-app/solid-js.d.ts b/demo/lit-app/solid-js.d.ts
@@ -67,7 +67,9 @@ type BaseProps = {
   title?: string;
   /** Passing 'no' excludes the element content from being translated. */
   translate?: "yes" | "no";
-};
+} & JSX.DirectiveAttributes &
+  JSX.PropAttributes &
+  JSX.AttrAttributes;
 
 type BaseEvents = {};
 
@@ -104,7 +106,9 @@ type RadioGroupProps = {
   "on:typed-event"?: (e: CustomEvent<HTMLInputElement>) => void;
   /** (@deprecated) some description for typed-custom-event */
   "on:typed-custom-event"?: (e: CustomEvent<InterfaceEventType>) => void;
-};
+} & JSX.DirectiveFunctionAttributes<RadioGroup> &
+  JSX.OnAttributes<RadioGroup> &
+  JSX.OnCaptureAttributes<RadioGroup>;
 
 type RadioButtonProps = {
   /** The value assigned to the radio button. This will reflect in the radio group when clicked. */
@@ -117,9 +121,14 @@ type RadioButtonProps = {
   for?: RadioButton["for"];
   /** Enum example */
   position?: RadioButton["position"];
-};
+} & JSX.DirectiveFunctionAttributes<RadioButton> &
+  JSX.OnAttributes<RadioButton> &
+  JSX.OnCaptureAttributes<RadioButton>;
 
-type DeprecatedElementProps = {};
+type DeprecatedElementProps =
+  {} & JSX.DirectiveFunctionAttributes<DeprecatedElement> &
+    JSX.OnAttributes<DeprecatedElement> &
+    JSX.OnCaptureAttributes<DeprecatedElement>;
 
 type MyButtonProps = {
   /** Used to override the form owner's `action` attribute. */
@@ -128,7 +137,9 @@ type MyButtonProps = {
   formmethod?: MyButton["formMethod"];
   /** Used to override the form owner's `novalidate` attribute. */
   formnovalidate?: MyButton["formNoValidate"];
-};
+} & JSX.DirectiveFunctionAttributes<MyButton> &
+  JSX.OnAttributes<MyButton> &
+  JSX.OnCaptureAttributes<MyButton>;
 
 export type CustomElements = {
   /**

diff --git a/packages/solidjs-integration/CHANGELOG.md b/packages/solidjs-integration/CHANGELOG.md
@@ -1,5 +1,9 @@
 # CHANGELOG
 
+## 1.8.0
+
+- Added support for [custom directives](https://docs.solidjs.com/configuration/typescript#custom-directives)
+
 ## 1.7.0
 
 - Added the ability to hide logs

diff --git a/packages/solidjs-integration/package.json b/packages/solidjs-integration/package.json
@@ -1,6 +1,6 @@
 {
   "name": "custom-element-solidjs-integration",
-  "version": "1.7.0",
+  "version": "1.8.0",
   "description": "Tools for integrating custom elements into SolidJS",
   "main": "index.js",
   "module": "index.js",

diff --git a/packages/solidjs-integration/src/type-generator.ts b/packages/solidjs-integration/src/type-generator.ts
@@ -148,7 +148,7 @@ type BaseProps = {
   title?: string;
   /** Passing 'no' excludes the element content from being translated. */
   translate?: "yes" | "no";
-};
+} & JSX.DirectiveAttributes & JSX.PropAttributes & JSX.AttrAttributes;
 
 type BaseEvents = {${
     Object.hasOwn(options, "globalEvents") ? options.globalEvents : ""
@@ -202,7 +202,7 @@ ${
     })
     .join("\n") || ""
 }
-}`;
+} & JSX.DirectiveFunctionAttributes<${component.name}> & JSX.OnAttributes<${component.name}> & JSX.OnCaptureAttributes<${component.name}>`;
   })
   .join("\n")}