@sokngounchan/frontend-kit 0.0.0-stage → 0.1.0

package/README.md

@@ -1,3 +0,0 @@
-# Temporary Holding Version
-
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.

package/dist/components/BaseButton.vue.d.ts

@@ -0,0 +1,28 @@
+type __VLS_Props = {
+    variant?: 'primary' | 'secondary' | 'danger';
+    loading?: boolean;
+    disabled?: boolean;
+};
+declare const __VLS_template: () => {
+    __VLS_Slots: {
+        default?: (props: {}) => any;
+    };
+};
+type __VLS_Slots = ReturnType<typeof __VLS_template>['__VLS_Slots'];
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    click: (event: MouseEvent) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onClick?: ((event: MouseEvent) => any) | undefined;
+}>, {
+    variant: "primary" | "secondary" | "danger";
+    loading: boolean;
+    disabled: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/composables/index.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("vue");function t(t=!1){let n=(0,e.ref)(t);return{state:n,toggle:e=>{n.value=typeof e==`boolean`?e:!n.value}}}function n(t,n=300){let r=(0,e.ref)(t.value),i;return(0,e.watch)(t,e=>{i&&clearTimeout(i),i=setTimeout(()=>r.value=e,n)}),r}exports.useDebounce=n,exports.useToggle=t;

package/dist/composables/index.d.ts

@@ -0,0 +1,2 @@
+export * from './useToggle';
+export * from './useDebounce';

package/dist/composables/index.js

@@ -0,0 +1,19 @@
+import { ref as e, watch as t } from "vue";
+// src/composables/useToggle.ts
+function n(t = !1) {
+	let n = e(t);
+	return {
+		state: n,
+		toggle: (e) => {
+			n.value = typeof e == "boolean" ? e : !n.value;
+		}
+	};
+}
+// src/composables/useDebounce.ts
+function r(n, r = 300) {
+	let i = e(n.value), a;
+	return t(n, (e) => {
+		a && clearTimeout(a), a = setTimeout(() => i.value = e, r);
+	}), i;
+}
+export { r as useDebounce, n as useToggle };

package/dist/composables/useDebounce.d.ts

@@ -0,0 +1,2 @@
+import { Ref } from 'vue';
+export declare function useDebounce<T>(source: Ref<T>, delay?: number): Ref<T, T>;

package/dist/composables/useToggle.d.ts

@@ -0,0 +1,4 @@
+export declare function useToggle(initial?: boolean): {
+    state: import('vue').Ref<boolean, boolean>;
+    toggle: (value?: boolean) => void;
+};

package/dist/frontend-kit.css

@@ -0,0 +1,2 @@
+.fk-btn{cursor:pointer;font:inherit;border:0;border-radius:6px;padding:.5rem 1rem}.fk-btn--primary{color:#fff;background:#2563eb}.fk-btn--secondary{color:#111827;background:#e5e7eb}.fk-btn--danger{color:#fff;background:#dc2626}.fk-btn:disabled{opacity:.6;cursor:not-allowed}
+/*$vite$:1*/

package/dist/index.cjs

@@ -0,0 +1 @@
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("./utils/index.cjs"),t=require("./composables/index.cjs");let n=require("vue");var r=[`disabled`],i={key:0,class:`fk-btn__spinner`,"aria-hidden":`true`},a=(0,n.defineComponent)({__name:`BaseButton`,props:{variant:{default:`primary`},loading:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1}},emits:[`click`],setup(e,{emit:t}){let a=t;return(t,o)=>((0,n.openBlock)(),(0,n.createElementBlock)(`button`,{class:(0,n.normalizeClass)([`fk-btn`,`fk-btn--${e.variant}`]),disabled:e.disabled||e.loading,onClick:o[0]||=e=>a(`click`,e)},[e.loading?((0,n.openBlock)(),(0,n.createElementBlock)(`span`,i)):(0,n.createCommentVNode)(``,!0),(0,n.renderSlot)(t.$slots,`default`)],10,r))}}),o={install(e){e.component(`BaseButton`,a)}};exports.BaseButton=a,exports.debounce=e.debounce,exports.default=o,exports.formatCurrency=e.formatCurrency,exports.truncate=e.truncate,exports.useDebounce=t.useDebounce,exports.useToggle=t.useToggle;

package/dist/index.d.ts

@@ -0,0 +1,6 @@
+import { default as BaseButton } from './components/BaseButton.vue';
+import { default as plugin } from './plugin';
+export { BaseButton };
+export * from './utils';
+export * from './composables';
+export default plugin;

package/dist/index.js

@@ -0,0 +1,34 @@
+import { debounce as e, formatCurrency as t, truncate as n } from "./utils/index.js";
+import { useDebounce as r, useToggle as i } from "./composables/index.js";
+import { createCommentVNode as a, createElementBlock as o, defineComponent as s, normalizeClass as c, openBlock as l, renderSlot as u } from "vue";
+// src/components/BaseButton.vue?vue&type=script&setup=true&lang.ts
+var d = ["disabled"], f = {
+	key: 0,
+	class: "fk-btn__spinner",
+	"aria-hidden": "true"
+}, p = /* @__PURE__ */ s({
+	__name: "BaseButton",
+	props: {
+		variant: { default: "primary" },
+		loading: {
+			type: Boolean,
+			default: !1
+		},
+		disabled: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: ["click"],
+	setup(e, { emit: t }) {
+		let n = t;
+		return (t, r) => (l(), o("button", {
+			class: c(["fk-btn", `fk-btn--${e.variant}`]),
+			disabled: e.disabled || e.loading,
+			onClick: r[0] ||= (e) => n("click", e)
+		}, [e.loading ? (l(), o("span", f)) : a("", !0), u(t.$slots, "default")], 10, d));
+	}
+}), m = { install(e) {
+	e.component("BaseButton", p);
+} };
+export { p as BaseButton, e as debounce, m as default, t as formatCurrency, n as truncate, r as useDebounce, i as useToggle };

package/dist/plugin.d.ts

@@ -0,0 +1,5 @@
+import { App } from 'vue';
+declare const _default: {
+    install(app: App): void;
+};
+export default _default;

package/dist/utils/debounce.d.ts

@@ -0,0 +1 @@
+export declare function debounce<A extends unknown[]>(fn: (...args: A) => void, delay?: number): (...args: A) => void;

package/dist/utils/format.d.ts

@@ -0,0 +1,2 @@
+export declare function formatCurrency(value: number, currency?: string, locale?: string): string;
+export declare function truncate(text: string, max: number): string;

package/dist/utils/index.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});function e(e,t=`USD`,n=`en-US`){return new Intl.NumberFormat(n,{style:`currency`,currency:t}).format(e)}function t(e,t){return e.length>t?e.slice(0,t-3)+`...`:e}function n(e,t=300){let n;return(...r)=>{n&&clearTimeout(n),n=setTimeout(()=>e(...r),t)}}exports.debounce=n,exports.formatCurrency=e,exports.truncate=t;

package/dist/utils/index.d.ts

@@ -0,0 +1,2 @@
+export * from './format';
+export * from './debounce';

package/dist/utils/index.js

@@ -0,0 +1,18 @@
+// src/utils/format.ts
+function e(e, t = "USD", n = "en-US") {
+	return new Intl.NumberFormat(n, {
+		style: "currency",
+		currency: t
+	}).format(e);
+}
+function t(e, t) {
+	return e.length > t ? e.slice(0, t - 3) + "..." : e;
+}
+// src/utils/debounce.ts
+function n(e, t = 300) {
+	let n;
+	return (...r) => {
+		n && clearTimeout(n), n = setTimeout(() => e(...r), t);
+	};
+}
+export { n as debounce, e as formatCurrency, t as truncate };

package/dist/validators/index.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var{req:e,regex:t,withMessage:n}=require("@vuelidate/validators").helpers,r=n(`Invalid phone number`,t(/^\+?[0-9\s-]{7,15}$/)),i=t=>n(`Must contain "${t}"`,n=>!e(n)||n.includes(t)),a=n(`Spaces are not allowed`,t=>!e(t)||!/\s/.test(t));exports.mustContain=i,exports.noSpaces=a,exports.phone=r;

package/dist/validators/index.d.ts

@@ -0,0 +1,6 @@
+/** Optional phone number: digits, spaces, dashes, optional leading + */
+export declare const phone: import('@vuelidate/core').ValidationRuleWithParams<object, any>;
+/** Value must contain a word. Empty values pass (use `required` for that). */
+export declare const mustContain: (word: string) => import('@vuelidate/core').ValidationRuleWithParams<object, any>;
+/** Value must not contain whitespace. */
+export declare const noSpaces: import('@vuelidate/core').ValidationRuleWithParams<object, any>;

package/dist/validators/index.js

@@ -0,0 +1,4 @@
+import { helpers as e } from "@vuelidate/validators";
+// src/validators/index.ts
+var { req: t, regex: n, withMessage: r } = e, i = r("Invalid phone number", n(/^\+?[0-9\s-]{7,15}$/)), a = (e) => r(`Must contain "${e}"`, (n) => !t(n) || n.includes(e)), o = r("Spaces are not allowed", (e) => !t(e) || !/\s/.test(e));
+export { a as mustContain, o as noSpaces, i as phone };

package/package.json

@@ -1,6 +1,98 @@
 {
   "name": "@sokngounchan/frontend-kit",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "0.1.0",
+  "description": "Reusable Vue components, composables, utilities and validators",
+  "license": "MIT",
+  "type": "module",
+  "author": "Sokngoun <sokngounchan@gmail.com>",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/sokngoun/frontend-kit.git"
+  },
+  "homepage": "https://github.com/sokngoun/frontend-kit#readme",
+  "bugs": {
+    "url": "https://github.com/sokngoun/frontend-kit/issues"
+  },
+  "keywords": [
+    "vue",
+    "vue3",
+    "components",
+    "composables",
+    "vuelidate",
+    "frontend"
+  ],
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    },
+    "./utils": {
+      "types": "./dist/utils/index.d.ts",
+      "import": "./dist/utils/index.js",
+      "require": "./dist/utils/index.cjs"
+    },
+    "./composables": {
+      "types": "./dist/composables/index.d.ts",
+      "import": "./dist/composables/index.js",
+      "require": "./dist/composables/index.cjs"
+    },
+    "./validators": {
+      "types": "./dist/validators/index.d.ts",
+      "import": "./dist/validators/index.js",
+      "require": "./dist/validators/index.cjs"
+    },
+    "./style.css": "./dist/style.css",
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE",
+    "CHANGELOG.md"
+  ],
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "engines": {
+    "node": ">=18"
+  },
+  "scripts": {
+    "dev": "vite build --watch",
+    "build": "vite build",
+    "test": "vitest run",
+    "typecheck": "vue-tsc --noEmit",
+    "prepublishOnly": "npm run typecheck && npm run test && npm run build"
+  },
+  "peerDependencies": {
+    "@vuelidate/core": "^2.0.0",
+    "@vuelidate/validators": "^2.0.0",
+    "vue": "^3.3.0"
+  },
+  "peerDependenciesMeta": {
+    "@vuelidate/core": {
+      "optional": true
+    },
+    "@vuelidate/validators": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^6.0.10",
+    "@vue/test-utils": "^2.5.1",
+    "@vuelidate/core": "^2.0.3",
+    "@vuelidate/validators": "^2.0.4",
+    "jsdom": "^31.0.0",
+    "typescript": "^6.0.3",
+    "vite-plugin-dts": "^5.1.2",
+    "vitest": "^5.1.0",
+    "vue": "^3.5.45",
+    "vue-tsc": "^3.3.14"
+  }
 }