@nr1e/qwik-ui 2.0.16 → 2.0.17

package/lib/components/text-field.qwik.cjs

@@ -3,6 +3,8 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@builder.io/qwik/jsx-runtime");
 const qwik = require("@builder.io/qwik");
 const TextField = qwik.component$((props) => {
+  const value = props.value;
+  const onInputHandler = props.onInput$;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", {
     class: "fieldset",
     children: [
@@ -22,6 +24,10 @@ const TextField = qwik.component$((props) => {
           /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {
             name: "left"
           }),
+          props.icon && /* @__PURE__ */ jsxRuntime.jsx(props.icon, {
+            size: 18,
+            class: "opacity-50"
+          }),
           /* @__PURE__ */ jsxRuntime.jsx("input", {
             type: props.type || "text",
             ...props.id && {
@@ -39,11 +45,11 @@ const TextField = qwik.component$((props) => {
             placeholder: props.placeholder,
             onBlur$: props.onBlur$,
             onInput$: (event, element) => {
-              if (props.value && typeof props.value !== "string") {
-                props.value.value = element.value;
+              if (value && typeof value !== "string") {
+                value.value = element.value;
               }
-              if (props.onInput$) {
-                props.onInput$(event, element);
+              if (onInputHandler) {
+                onInputHandler(event, element);
               }
             }
           }),

package/lib/components/text-field.qwik.mjs

@@ -1,6 +1,8 @@
 import { jsxs, jsx } from "@builder.io/qwik/jsx-runtime";
 import { component$, Slot } from "@builder.io/qwik";
 const TextField = component$((props) => {
+  const value = props.value;
+  const onInputHandler = props.onInput$;
   return /* @__PURE__ */ jsxs("div", {
     class: "fieldset",
     children: [
@@ -20,6 +22,10 @@ const TextField = component$((props) => {
           /* @__PURE__ */ jsx(Slot, {
             name: "left"
           }),
+          props.icon && /* @__PURE__ */ jsx(props.icon, {
+            size: 18,
+            class: "opacity-50"
+          }),
           /* @__PURE__ */ jsx("input", {
             type: props.type || "text",
             ...props.id && {
@@ -37,11 +43,11 @@ const TextField = component$((props) => {
             placeholder: props.placeholder,
             onBlur$: props.onBlur$,
             onInput$: (event, element) => {
-              if (props.value && typeof props.value !== "string") {
-                props.value.value = element.value;
+              if (value && typeof value !== "string") {
+                value.value = element.value;
               }
-              if (props.onInput$) {
-                props.onInput$(event, element);
+              if (onInputHandler) {
+                onInputHandler(event, element);
               }
             }
           }),

package/lib-types/components/text-field.d.ts

@@ -1,4 +1,5 @@
-import { QRL, Signal } from '@builder.io/qwik';
+import { QRL, Signal, Component } from '@builder.io/qwik';
+import { IconProps } from '@nr1e/qwik-icons';
 /**
  * The type of the input field.
  */
@@ -25,9 +26,10 @@ export interface TextFieldProps {
      * Called when the input value changes.
      */
     onInput$?: QRL<(event: InputEvent, element: HTMLInputElement) => void>;
+    icon?: Component<IconProps>;
 }
 /**
  * A standardized text input field meant to be used independently or with Qwik
  * Modular Forms.
  */
-export declare const TextField: import("@builder.io/qwik").Component<TextFieldProps>;
+export declare const TextField: Component<TextFieldProps>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nr1e/qwik-ui",
-  "version": "2.0.16",
+  "version": "2.0.17",
   "description": "NR1E Qwik UI Library",
   "author": "NR1E, Inc.",
   "publishConfig": {
@@ -36,7 +36,7 @@
   "peerDependencies": {
     "@builder.io/qwik-city": "1.19.2",
     "tailwindcss-animated": "2.0.0",
-    "@nr1e/qwik-icons": "0.0.31"
+    "@nr1e/qwik-icons": "0.0.32"
   },
   "devDependencies": {
     "@builder.io/qwik": "1.19.1",