@varialkit/inlineedit 0.1.1 → 0.1.3

package/examples.tsx

@@ -1,6 +1,6 @@
 import React from "react";
-import { iconNames } from "@solara/icons";
-import type { SolaraIconName } from "@solara/icons";
+import { iconNames } from "@varialkit/icons";
+import type { SolaraIconName } from "@varialkit/icons";
 import { InlineEdit } from "./src/InlineEdit";
 import type { InlineEditProps } from "./src/InlineEdit.types";
 
@@ -104,7 +104,7 @@ export const stories = {
       );
     },
     code: `import React from "react";
-import { InlineEdit } from "@solara/inlineedit";
+import { InlineEdit } from "@varialkit/inlineedit";
 
 export function Example() {
   const [title, setTitle] = React.useState("Quarterly review");
@@ -137,7 +137,7 @@ export function Example() {
       );
     },
     code: `import React from "react";
-import { InlineEdit } from "@solara/inlineedit";
+import { InlineEdit } from "@varialkit/inlineedit";
 
 const StatusOptions = [
   { label: "Planned", value: "planned" },
@@ -180,7 +180,7 @@ export function Example() {
       );
     },
     code: `import React from "react";
-import { InlineEdit } from "@solara/inlineedit";
+import { InlineEdit } from "@varialkit/inlineedit";
 
 export function Example() {
   const [summary, setSummary] = React.useState(
@@ -216,7 +216,7 @@ export function Example() {
       );
     },
     code: `import React from "react";
-import { InlineEdit } from "@solara/inlineedit";
+import { InlineEdit } from "@varialkit/inlineedit";
 
 export function Example() {
   const [title, setTitle] = React.useState("Short label");
@@ -249,7 +249,7 @@ export function Example() {
       );
     },
     code: `import React from "react";
-import { InlineEdit } from "@solara/inlineedit";
+import { InlineEdit } from "@varialkit/inlineedit";
 
 export function Example() {
   const [title, setTitle] = React.useState("Project status");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@varialkit/inlineedit",
-  "version": "0.1.1",
+  "version": "0.1.3",
   "type": "module",
   "main": "src/index.ts",
   "types": "src/index.ts",
@@ -9,11 +9,11 @@
     "./examples": "./examples/index.tsx"
   },
   "dependencies": {
-    "@varialkit/button": "0.1.1",
-    "@varialkit/dropdown": "0.1.1",
-    "@varialkit/textarea": "0.1.1",
-    "@varialkit/textfield": "0.1.1",
-    "@varialkit/icons": "0.1.1"
+    "@varialkit/button": "0.1.3",
+    "@varialkit/dropdown": "0.1.3",
+    "@varialkit/textarea": "0.1.3",
+    "@varialkit/textfield": "0.1.3",
+    "@varialkit/icons": "0.1.3"
   },
   "files": [
     "src",

package/src/InlineEdit.tsx

@@ -1,9 +1,9 @@
 import React, { useEffect, useLayoutEffect, useRef, useState } from "react";
-import { Button } from "@solara/button";
-import type { ButtonSize, ButtonVariant } from "@solara/button";
-import { Dropdown } from "@solara/dropdown";
-import { TextArea } from "@solara/textarea";
-import { TextField } from "@solara/textfield";
+import { Button } from "@varialkit/button";
+import type { ButtonSize, ButtonVariant } from "@varialkit/button";
+import { Dropdown } from "@varialkit/dropdown";
+import { TextArea } from "@varialkit/textarea";
+import { TextField } from "@varialkit/textfield";
 import type {
   InlineEditEditor,
   InlineEditProps,
@@ -145,10 +145,15 @@ export const InlineEdit: React.FC<InlineEditProps> = ({
 
   useEffect(() => {
     if (!isEditing) return;
-    const input = containerRef.current?.querySelector(
-      "input, textarea, select"
-    );
+    const input = containerRef.current?.querySelector("input, textarea, select");
     if (!input) return;
+    if (
+      !(input instanceof HTMLInputElement) &&
+      !(input instanceof HTMLTextAreaElement) &&
+      !(input instanceof HTMLSelectElement)
+    ) {
+      return;
+    }
 
     if (input instanceof HTMLTextAreaElement) {
       input.style.height = "auto";

package/src/InlineEdit.types.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import type { ButtonIcon } from "@solara/button";
+import type { ButtonIcon } from "@varialkit/button";
 
 export type InlineEditSize =
   | "xs"