espri-vue-input-text-float 0.0.1

package/README.md

@@ -0,0 +1,3 @@
+# Float Input Text - Vue component
+
+`import FloatInputText from 'espri-vue-float-input-text';`

package/dist/index.d.ts

@@ -0,0 +1,17 @@
+import type { DefineComponent } from 'vue';
+import type { InputTextFloatEmitsForDoc } from './interfaces/input-text-float-emits.interface';
+import type InputTextFloatProps from './interfaces/input-text-float-props.interface';
+/**
+ * **ESPRI Digital - Select Float (Vue component)**
+ * --- ---
+ * ![ESPRIDigital](https://espridigital.fr/wp-content/uploads/2024/09/logo_espri_digital_white-100-1.png)
+ *
+ */
+declare const InputTextFloat: DefineComponent<InputTextFloatProps, {}, // For slots if any
+{}, // For methods or data if any
+{}, // Computed
+{}, // Methods
+{}, // Mixin
+{}, // Extends
+InputTextFloatEmitsForDoc>;
+export default InputTextFloat;

package/dist/input-text-float.es.js

@@ -0,0 +1,79 @@
+import { defineComponent as b, computed as c, openBlock as s, createElementBlock as m, normalizeClass as p, createBlock as f, unref as o, withCtx as k, createVNode as v, createElementVNode as h, createTextVNode as y, toDisplayString as g, createCommentVNode as B } from "vue";
+import { Skeleton as C, FloatLabel as w, InputText as E } from "primevue";
+const N = ["for"], $ = {
+  key: 0,
+  class: "text-danger"
+}, I = { class: "text-danger" }, T = /* @__PURE__ */ b({
+  __name: "input-text-float",
+  props: {
+    label: {},
+    modelValue: {},
+    class: {},
+    classInput: {},
+    disabled: { type: Boolean },
+    required: { type: Boolean },
+    loading: { type: Boolean },
+    showError: { type: Boolean },
+    rules: {},
+    maxlength: {},
+    placeholder: {}
+  },
+  emits: ["update:modelValue"],
+  setup(e, { emit: V }) {
+    const n = e, d = V, r = Math.random().toString(16).slice(2), u = c({
+      get() {
+        return n.modelValue;
+      },
+      set(l) {
+        d("update:modelValue", l);
+      }
+    }), i = c(() => {
+      if (n.showError) {
+        const l = n.rules || [];
+        for (let t = 0; t < l.length; t++) {
+          const a = l[t];
+          if (a && a.$invalid && a.$message)
+            return a.$message;
+        }
+      }
+      return "";
+    });
+    function x(l) {
+      d("update:modelValue", l);
+    }
+    return (l, t) => (s(), m("div", {
+      class: p(`field ${n.class || ""}`)
+    }, [
+      e.loading ? (s(), f(o(C), {
+        key: 0,
+        class: "skeleton-input mt-3"
+      })) : (s(), f(o(w), {
+        key: 1,
+        class: "mt-3"
+      }, {
+        default: k(() => [
+          v(o(E), {
+            modelValue: u.value,
+            "onUpdate:modelValue": t[0] || (t[0] = (a) => u.value = a),
+            class: p(["w-full", e.classInput]),
+            invalid: !!i.value,
+            maxlength: e.maxlength,
+            disabled: e.disabled,
+            placeholder: e.placeholder,
+            "input-id": o(r),
+            onValueChange: x
+          }, null, 8, ["modelValue", "class", "invalid", "maxlength", "disabled", "placeholder", "input-id"]),
+          h("label", { for: o(r) }, [
+            y(g(e.label), 1),
+            e.required ? (s(), m("span", $, " *")) : B("", !0)
+          ], 8, N)
+        ]),
+        _: 1
+      })),
+      h("small", I, g(i.value), 1)
+    ], 2));
+  }
+});
+export {
+  T as default
+};

package/dist/input-text-float.umd.js

@@ -0,0 +1 @@
+(function(e,t){typeof exports=="object"&&typeof module<"u"?module.exports=t(require("vue"),require("primevue")):typeof define=="function"&&define.amd?define(["vue","primevue"],t):(e=typeof globalThis<"u"?globalThis:e||self,e.SelectFloat=t(e.Vue,e.PrimeVue))})(this,(function(e,t){"use strict";const m=["for"],u={key:0,class:"text-danger"},f={class:"text-danger"};return e.defineComponent({__name:"input-text-float",props:{label:{},modelValue:{},class:{},classInput:{},disabled:{type:Boolean},required:{type:Boolean},loading:{type:Boolean},showError:{type:Boolean},rules:{},maxlength:{},placeholder:{}},emits:["update:modelValue"],setup(l,{emit:p}){const s=l,d=p,i=Math.random().toString(16).slice(2),r=e.computed({get(){return s.modelValue},set(n){d("update:modelValue",n)}}),c=e.computed(()=>{if(s.showError){const n=s.rules||[];for(let o=0;o<n.length;o++){const a=n[o];if(a&&a.$invalid&&a.$message)return a.$message}}return""});function h(n){d("update:modelValue",n)}return(n,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(`field ${s.class||""}`)},[l.loading?(e.openBlock(),e.createBlock(e.unref(t.Skeleton),{key:0,class:"skeleton-input mt-3"})):(e.openBlock(),e.createBlock(e.unref(t.FloatLabel),{key:1,class:"mt-3"},{default:e.withCtx(()=>[e.createVNode(e.unref(t.InputText),{modelValue:r.value,"onUpdate:modelValue":o[0]||(o[0]=a=>r.value=a),class:e.normalizeClass(["w-full",l.classInput]),invalid:!!c.value,maxlength:l.maxlength,disabled:l.disabled,placeholder:l.placeholder,"input-id":e.unref(i),onValueChange:h},null,8,["modelValue","class","invalid","maxlength","disabled","placeholder","input-id"]),e.createElementVNode("label",{for:e.unref(i)},[e.createTextVNode(e.toDisplayString(l.label),1),l.required?(e.openBlock(),e.createElementBlock("span",u," *")):e.createCommentVNode("",!0)],8,m)]),_:1})),e.createElementVNode("small",f,e.toDisplayString(c.value),1)],2))}})}));

package/dist/interfaces/input-text-float-emits.interface.d.ts

@@ -0,0 +1,10 @@
+import type { ObjectEmitsOptions } from 'vue';
+export default interface InputTextFloatEmits {
+    (e: 'update:modelValue', value: any): void;
+}
+export interface InputTextFloatEmitsForDoc extends ObjectEmitsOptions {
+    /**
+     * Called when modelValue is updated.
+     */
+    'update:modelValue': (value: any) => void;
+}

package/dist/interfaces/input-text-float-props.interface.d.ts

@@ -0,0 +1,52 @@
+export default interface SelectFloatProps {
+    /**
+     * Label displayed above the input.
+     */
+    label: string;
+    /**
+     * Model value representing the current state of the input.
+     */
+    modelValue: any;
+    /**
+     * Class of the component.
+     */
+    class?: any;
+    /**
+     * Optional CSS class applied to the input element.
+     */
+    classInput?: string;
+    /**
+     * Disables the input when true.
+     */
+    disabled?: boolean;
+    /**
+     * Marks the input as required when true.
+     */
+    required?: boolean;
+    /**
+     * Indicates if the input is in a loading state.
+     */
+    loading: boolean;
+    /**
+     * Shows error messages when true.
+     */
+    showError?: boolean;
+    /**
+     * Validation rules for the input.
+     * Each rule can be undefined or an object containing:
+     * - $invalid: whether the rule is violated
+     * - $message: the error message associated with the rule
+     */
+    rules?: Array<{
+        $invalid: boolean;
+        $message: string;
+    } | undefined>;
+    /**
+     * Maximum number of characters allowed in the input.
+     */
+    maxlength?: number;
+    /**
+     * Placeholder text displayed inside the input.
+     */
+    placeholder?: string;
+}

package/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "espri-vue-input-text-float",
+  "type": "module",
+  "version": "0.0.1",
+  "description": "Input Text Float - Vue component",
+  "author": "ESPRI Digital",
+  "homepage": "https://github.com/ESPRI-Digital/vue-input-text-float#readme",
+  "main": "dist/input-text-float.umd.js",
+  "module": "dist/input-text-float.es.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "vite build && tsc --emitDeclarationOnly",
+    "lint": "eslint .",
+    "ts-check": "vue-tsc --noEmit"
+  },
+  "peerDependencies": {
+    "primevue": ">=4.0.0 <5.0.0",
+    "vue": ">=3.0.0 <4.0.0"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^6.0.2",
+    "eslint": "^9.39.1",
+    "eslint-config-espri-front": "^3.0.0",
+    "typescript": "^5.9.3",
+    "vite": "^7.2.6",
+    "vue-tsc": "^3.1.5"
+  }
+}