@sokchea/vue-form-khmer 1.0.31 → 1.0.32

package/dist/vue-form-khmer.es.js

@@ -1,42 +1,11 @@
-import { openBlock as r, createElementBlock as n, withModifiers as f, renderSlot as b, createElementVNode as c, toDisplayString as d, createTextVNode as p, createCommentVNode as a, normalizeClass as _ } from "vue";
-const m = (t, o) => {
-  const e = t.__vccOpts || t;
-  for (const [l, s] of o)
-    e[l] = s;
+import { openBlock as n, createElementBlock as r, createTextVNode as c, toDisplayString as d, createCommentVNode as l, createElementVNode as i, normalizeClass as m } from "vue";
+const f = (o, t) => {
+  const e = o.__vccOpts || o;
+  for (const [a, s] of t)
+    e[a] = s;
   return e;
-}, y = {
-  name: "Form",
-  props: {
-    submitText: {
-      type: String,
-      default: "Submit"
-    },
-    onSubmit: {
-      type: Function,
-      default: null
-    }
-  },
-  emits: ["submit"],
-  methods: {
-    handleSubmit(t) {
-      this.$emit("submit", t), this.onSubmit && this.onSubmit(t);
-    }
-  }
-}, h = {
-  type: "submit",
-  class: "bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700 transition"
-};
-function S(t, o, e, l, s, u) {
-  return r(), n("form", {
-    onSubmit: o[0] || (o[0] = f((...i) => u.handleSubmit && u.handleSubmit(...i), ["prevent"])),
-    class: "space-y-4"
-  }, [
-    b(t.$slots, "default", {}, void 0, !0),
-    c("button", h, d(e.submitText), 1)
-  ], 32);
-}
-const B = /* @__PURE__ */ m(y, [["render", S], ["__scopeId", "data-v-c3510b80"], ["__file", "/Users/sokchea/Documents/Study/vue-form-khmer/src/components/Form.vue"]]), x = {
-  name: "Input",
+}, p = {
+  name: "VfkInput",
   props: {
     modelValue: {
       type: [String, Number],
@@ -64,37 +33,43 @@ const B = /* @__PURE__ */ m(y, [["render", S], ["__scopeId", "data-v-c3510b80"],
     }
   },
   emits: ["update:modelValue"]
-}, g = { class: "flex flex-col" }, v = {
+}, _ = { class: "flex flex-col" }, y = {
   key: 0,
   class: "mb-1 font-semibold text-gray-700"
-}, k = {
+}, g = {
   key: 0,
   class: "text-red-500"
-}, V = ["type", "value", "placeholder"], I = {
+}, b = ["type", "value", "placeholder"], x = {
   key: 1,
   class: "text-red-500 text-sm mt-1"
 };
-function F(t, o, e, l, s, u) {
-  return r(), n("div", g, [
-    e.label ? (r(), n("label", v, [
-      p(d(e.label) + " ", 1),
-      e.required ? (r(), n("span", k, "*")) : a("", !0)
-    ])) : a("", !0),
-    c("input", {
+function h(o, t, e, a, s, V) {
+  return n(), r("div", _, [
+    e.label ? (n(), r("label", y, [
+      c(d(e.label) + " ", 1),
+      e.required ? (n(), r("span", g, "*")) : l("", !0)
+    ])) : l("", !0),
+    i("input", {
       type: e.type,
       value: e.modelValue,
       placeholder: e.placeholder,
-      class: _([
+      class: m([
         "border rounded px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500",
         e.error ? "border-red-500" : "border-gray-300"
       ]),
-      onInput: o[0] || (o[0] = (i) => t.$emit("update:modelValue", e.modelValue))
-    }, null, 42, V),
-    e.error ? (r(), n("p", I, d(e.error), 1)) : a("", !0)
+      onInput: t[0] || (t[0] = (u) => o.$emit("update:modelValue", u.target.value))
+    }, null, 42, b),
+    e.error ? (n(), r("p", x, d(e.error), 1)) : l("", !0)
   ]);
 }
-const D = /* @__PURE__ */ m(x, [["render", F], ["__scopeId", "data-v-6bfa3c29"], ["__file", "/Users/sokchea/Documents/Study/vue-form-khmer/src/components/Input.vue"]]);
+const k = /* @__PURE__ */ f(p, [["render", h], ["__scopeId", "data-v-6bfa3c29"], ["__file", "/Users/sokchea/Documents/Study/vue-form-khmer/src/components/Input.vue"]]), v = [k], I = {
+  install(o) {
+    v.forEach((t) => {
+      t.name || console.warn("Component missing name", t), o.component(t.name, t);
+    });
+  }
+};
 export {
-  B as Form,
-  D as Input
+  k as VfkInput,
+  I as default
 };

package/dist/vue-form-khmer.umd.js

@@ -1 +1 @@
-(function(n,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(n=typeof globalThis<"u"?globalThis:n||self,e(n.VueFormKhmer={},n.Vue))})(this,(function(n,e){"use strict";const i=(o,r)=>{const t=o.__vccOpts||o;for(const[l,s]of r)t[l]=s;return t},c={name:"Form",props:{submitText:{type:String,default:"Submit"},onSubmit:{type:Function,default:null}},emits:["submit"],methods:{handleSubmit(o){this.$emit("submit",o),this.onSubmit&&this.onSubmit(o)}}},u={type:"submit",class:"bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700 transition"};function m(o,r,t,l,s,d){return e.openBlock(),e.createElementBlock("form",{onSubmit:r[0]||(r[0]=e.withModifiers((...a)=>d.handleSubmit&&d.handleSubmit(...a),["prevent"])),class:"space-y-4"},[e.renderSlot(o.$slots,"default",{},void 0,!0),e.createElementVNode("button",u,e.toDisplayString(t.submitText),1)],32)}const f=i(c,[["render",m],["__scopeId","data-v-c3510b80"],["__file","/Users/sokchea/Documents/Study/vue-form-khmer/src/components/Form.vue"]]),p={name:"Input",props:{modelValue:{type:[String,Number],default:""},label:{type:String,default:""},type:{type:String,default:"text"},placeholder:{type:String,default:""},required:{type:Boolean,default:!1},error:{type:String,default:""}},emits:["update:modelValue"]},b={class:"flex flex-col"},y={key:0,class:"mb-1 font-semibold text-gray-700"},_={key:0,class:"text-red-500"},h=["type","value","placeholder"],S={key:1,class:"text-red-500 text-sm mt-1"};function k(o,r,t,l,s,d){return e.openBlock(),e.createElementBlock("div",b,[t.label?(e.openBlock(),e.createElementBlock("label",y,[e.createTextVNode(e.toDisplayString(t.label)+" ",1),t.required?(e.openBlock(),e.createElementBlock("span",_,"*")):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0),e.createElementVNode("input",{type:t.type,value:t.modelValue,placeholder:t.placeholder,class:e.normalizeClass(["border rounded px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500",t.error?"border-red-500":"border-gray-300"]),onInput:r[0]||(r[0]=a=>o.$emit("update:modelValue",t.modelValue))},null,42,h),t.error?(e.openBlock(),e.createElementBlock("p",S,e.toDisplayString(t.error),1)):e.createCommentVNode("",!0)])}const g=i(p,[["render",k],["__scopeId","data-v-6bfa3c29"],["__file","/Users/sokchea/Documents/Study/vue-form-khmer/src/components/Input.vue"]]);n.Form=f,n.Input=g,Object.defineProperty(n,Symbol.toStringTag,{value:"Module"})}));
+(function(n,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(n=typeof globalThis<"u"?globalThis:n||self,e(n.VueFormKhmer={},n.Vue))})(this,(function(n,e){"use strict";const s=(l,o)=>{const t=l.__vccOpts||l;for(const[a,d]of o)t[a]=d;return t},c={name:"VfkInput",props:{modelValue:{type:[String,Number],default:""},label:{type:String,default:""},type:{type:String,default:"text"},placeholder:{type:String,default:""},required:{type:Boolean,default:!1},error:{type:String,default:""}},emits:["update:modelValue"]},i={class:"flex flex-col"},u={key:0,class:"mb-1 font-semibold text-gray-700"},m={key:0,class:"text-red-500"},f=["type","value","placeholder"],p={key:1,class:"text-red-500 text-sm mt-1"};function y(l,o,t,a,d,h){return e.openBlock(),e.createElementBlock("div",i,[t.label?(e.openBlock(),e.createElementBlock("label",u,[e.createTextVNode(e.toDisplayString(t.label)+" ",1),t.required?(e.openBlock(),e.createElementBlock("span",m,"*")):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0),e.createElementVNode("input",{type:t.type,value:t.modelValue,placeholder:t.placeholder,class:e.normalizeClass(["border rounded px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500",t.error?"border-red-500":"border-gray-300"]),onInput:o[0]||(o[0]=g=>l.$emit("update:modelValue",g.target.value))},null,42,f),t.error?(e.openBlock(),e.createElementBlock("p",p,e.toDisplayString(t.error),1)):e.createCommentVNode("",!0)])}const r=s(c,[["render",y],["__scopeId","data-v-6bfa3c29"],["__file","/Users/sokchea/Documents/Study/vue-form-khmer/src/components/Input.vue"]]),_=[r],k={install(l){_.forEach(o=>{o.name||console.warn("Component missing name",o),l.component(o.name,o)})}};n.VfkInput=r,n.default=k,Object.defineProperties(n,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));

package/package.json

@@ -1,42 +1,46 @@
 {
   "name": "@sokchea/vue-form-khmer",
-  "version": "1.0.31",
+  "version": "1.0.32",
   "description": "Vue 3 Form Components with Khmer validation support",
   "type": "module",
+
   "main": "dist/vue-form-khmer.umd.js",
   "module": "dist/vue-form-khmer.es.js",
+
   "exports": {
     ".": {
       "import": "./dist/vue-form-khmer.es.js",
       "require": "./dist/vue-form-khmer.umd.js"
     }
   },
-  "files": [
-    "dist",
-    "src",
-    "lib"
-  ],
-  "style": "dist/style.css",
+
+  "files": ["dist"],
+
   "scripts": {
-    "build": "vite build"
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
   },
+
   "keywords": [
     "vue",
     "form",
     "khmer",
     "validation"
   ],
+
   "author": "sokchea",
   "license": "MIT",
+
   "peerDependencies": {
-    "vue": "^3.3.0"
+    "vue": "^3.3.0",
+    "tailwindcss": "^4.0.0"
   },
+
   "devDependencies": {
     "@vitejs/plugin-vue": "^6.0.5",
-    "vite": "^7.3.1"
-  },
-  "dependencies": {
-    "@tailwindcss/vite": "^4.2.2",
-    "tailwindcss": "^4.2.2"
+    "vite": "^7.3.1",
+    "tailwindcss": "^4.2.2",
+    "@tailwindcss/vite": "^4.2.2"
   }
-}
+}

package/src/App.vue

@@ -1,14 +0,0 @@
-<script setup>
-
-</script>
-
-<template>
-  <header>
-    <div class="text-red-500">HelloWorld</div>
-    
-  </header>
-
-  <main>
-    
-  </main>
-</template>

package/src/assets/base.css

@@ -1,86 +0,0 @@
-/* color palette from <https://github.com/vuejs/theme> */
-:root {
-  --vt-c-white: #ffffff;
-  --vt-c-white-soft: #f8f8f8;
-  --vt-c-white-mute: #f2f2f2;
-
-  --vt-c-black: #181818;
-  --vt-c-black-soft: #222222;
-  --vt-c-black-mute: #282828;
-
-  --vt-c-indigo: #2c3e50;
-
-  --vt-c-divider-light-1: rgba(60, 60, 60, 0.29);
-  --vt-c-divider-light-2: rgba(60, 60, 60, 0.12);
-  --vt-c-divider-dark-1: rgba(84, 84, 84, 0.65);
-  --vt-c-divider-dark-2: rgba(84, 84, 84, 0.48);
-
-  --vt-c-text-light-1: var(--vt-c-indigo);
-  --vt-c-text-light-2: rgba(60, 60, 60, 0.66);
-  --vt-c-text-dark-1: var(--vt-c-white);
-  --vt-c-text-dark-2: rgba(235, 235, 235, 0.64);
-}
-
-/* semantic color variables for this project */
-:root {
-  --color-background: var(--vt-c-white);
-  --color-background-soft: var(--vt-c-white-soft);
-  --color-background-mute: var(--vt-c-white-mute);
-
-  --color-border: var(--vt-c-divider-light-2);
-  --color-border-hover: var(--vt-c-divider-light-1);
-
-  --color-heading: var(--vt-c-text-light-1);
-  --color-text: var(--vt-c-text-light-1);
-
-  --section-gap: 160px;
-}
-
-@media (prefers-color-scheme: dark) {
-  :root {
-    --color-background: var(--vt-c-black);
-    --color-background-soft: var(--vt-c-black-soft);
-    --color-background-mute: var(--vt-c-black-mute);
-
-    --color-border: var(--vt-c-divider-dark-2);
-    --color-border-hover: var(--vt-c-divider-dark-1);
-
-    --color-heading: var(--vt-c-text-dark-1);
-    --color-text: var(--vt-c-text-dark-2);
-  }
-}
-
-*,
-*::before,
-*::after {
-  box-sizing: border-box;
-  margin: 0;
-  font-weight: normal;
-}
-
-body {
-  min-height: 100vh;
-  color: var(--color-text);
-  background: var(--color-background);
-  transition:
-    color 0.5s,
-    background-color 0.5s;
-  line-height: 1.6;
-  font-family:
-    Inter,
-    -apple-system,
-    BlinkMacSystemFont,
-    'Segoe UI',
-    Roboto,
-    Oxygen,
-    Ubuntu,
-    Cantarell,
-    'Fira Sans',
-    'Droid Sans',
-    'Helvetica Neue',
-    sans-serif;
-  font-size: 15px;
-  text-rendering: optimizeLegibility;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}

package/src/assets/logo.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 261.76 226.69"><path d="M161.096.001l-30.225 52.351L100.647.001H-.005l130.877 226.688L261.749.001z" fill="#41b883"/><path d="M161.096.001l-30.225 52.351L100.647.001H52.346l78.526 136.01L209.398.001z" fill="#34495e"/></svg>

package/src/assets/main.css

@@ -1,36 +0,0 @@
-@import './base.css';
-@import "tailwindcss";
-
-#app {
-  max-width: 1280px;
-  margin: 0 auto;
-  padding: 2rem;
-  font-weight: normal;
-}
-
-a,
-.green {
-  text-decoration: none;
-  color: hsla(160, 100%, 37%, 1);
-  transition: 0.4s;
-  padding: 3px;
-}
-
-@media (hover: hover) {
-  a:hover {
-    background-color: hsla(160, 100%, 37%, 0.2);
-  }
-}
-
-@media (min-width: 1024px) {
-  body {
-    display: flex;
-    place-items: center;
-  }
-
-  #app {
-    display: grid;
-    grid-template-columns: 1fr 1fr;
-    padding: 0 2rem;
-  }
-}

package/src/components/Form.vue

@@ -1,46 +0,0 @@
-<template>
-    <form @submit.prevent="handleSubmit" class="space-y-4">
-        <!-- Render slot content for inputs -->
-        <slot></slot>
-
-        <!-- Submit button -->
-        <button
-        type="submit"
-        class="bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700 transition"
-        >
-            {{ submitText }}
-        </button>
-    </form>
-</template>
-
-<script>
-export default {
-    name: 'Form',
-    props: {
-        submitText: {
-            type: String,
-            default: 'Submit',
-        },
-        onSubmit: {
-            type: Function,
-            default: null,
-        },
-    },
-    emits: ['submit'],
-    methods: {
-        handleSubmit(event) {
-            // Emit submit event with form data
-            this.$emit('submit', event);
-
-            // Call onSubmit prop if provided
-            if (this.onSubmit) {
-                this.onSubmit(event);
-            }
-        },
-    },
-};
-</script>
-
-<style scoped>
-/* Optional scoped styles for form */
-</style>

package/src/components/Input.vue

@@ -1,64 +0,0 @@
-<template>
-    <div class="flex flex-col">
-        <!-- Label -->
-        <label v-if="label" class="mb-1 font-semibold text-gray-700">
-        {{ label }}
-        <span v-if="required" class="text-red-500">*</span>
-        </label>
-
-        <!-- Input field -->
-        <input
-        :type="type"
-        :value="modelValue"
-        :placeholder="placeholder"
-        :class="[
-            'border rounded px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500',
-            error ? 'border-red-500' : 'border-gray-300'
-        ]"
-        @input="$emit('update:modelValue', modelValue)"
-        />
-
-        <!-- Error message -->
-        <p v-if="error" class="text-red-500 text-sm mt-1">{{ error }}</p>
-    </div>
-</template>
-
-<script>
-export default {
-    name: 'Input',
-    props: {
-        modelValue: {
-            type: [String, Number],
-            default: '',
-        },
-        label: {
-            type: String,
-            default: '',
-        },
-        type: {
-            type: String,
-            default: 'text',
-        },
-        placeholder: {
-            type: String,
-            default: '',
-        },
-        required: {
-            type: Boolean,
-            default: false,
-        },
-        error: {
-            type: String,
-            default: '',
-        },
-    },
-    emits: ['update:modelValue'],
-};
-</script>
-
-<style scoped>
-/* Optional: smooth focus animation */
-input:focus {
-  transition: all 0.2s ease-in-out;
-}
-</style>

package/src/index.js

@@ -1,2 +0,0 @@
-export { default as Form } from './components/Form.vue'
-export { default as Input } from './components/Input.vue'

package/src/main.js

@@ -1,6 +0,0 @@
-import './assets/main.css'
-
-import { createApp } from 'vue'
-import App from './App.vue'
-
-createApp(App).mount('#app')

package/src/style.css

@@ -1 +0,0 @@
-@import "tailwindcss";