@phila/phila-ui-radio 0.0.9 → 0.0.11

package/README.md

@@ -1,16 +1,75 @@
-# Radio component
+# Radio Component
 
-## Create a new local build
+A simple, customizable Vue 3. Radio component built with TypeScript and Vite.
+A radio input component for Phila UI.
 
-In src/components/COMPONENT_NAME:
+## Features
 
+- 🎯 TypeScript support with full type definitions
+
+## Installation
+
+```bash
+npm install @phila/phila-ui-radio
+# or
+yarn add @phila/phila-ui-radio
+# or
+pnpm add @phila/phila-ui-radio
 ```
-npm run build
-npm pack
+
+## Usage
+
+```vue
+<script setup lang="ts">
+import { Radio } from "@phila/phila-ui-radio";
+</script>
+<template>...Add basic component template here...</template>
 ```
 
-copy .tgz file to project and run:
+## Props
+
+| Prop | Type | Default | Description |
+| ---- | ---- | ------- | ----------- |
+
+| ...Add props here...
+
+## Events
+
+| Event | Payload | Description |
+| ----- | ------- | ----------- |
+
+| ...Add events here...
+
+## Examples
+
+...Add examples here...
+
+## Development
 
+### Install Dependencies
+
+```bash
+pnpm install
+```
+
+### Run Demo
+
+```bash
+pnpm dev
 ```
-npm install COMPONENT_NAME*.tgz
+
+### Build Library
+
+```bash
+pnpm build
 ```
+
+### Type Check
+
+```bash
+pnpm type-check
+```
+
+## License
+
+MIT

package/dist/Radio.vue.d.ts

@@ -1,77 +1,4 @@
-import { InputProps } from '@phila/phila-ui-core';
-import { RadioProps } from './types';
-
-declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<InputProps & RadioProps>, {
-    id: any;
-    errors(): never[];
-    label: string;
-    desc: string;
-    modelValue: string;
-    valueKey: string;
-    textKey: string;
-    numOfColumns: number;
-    small: boolean;
-    options: () => {
-        "option-1": string;
-        "option-2": string;
-        "option-3": string;
-    };
-}>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "update:modelValue": (...args: any[]) => void;
-    change: (...args: any[]) => void;
-}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<InputProps & RadioProps>, {
-    id: any;
-    errors(): never[];
-    label: string;
-    desc: string;
-    modelValue: string;
-    valueKey: string;
-    textKey: string;
-    numOfColumns: number;
-    small: boolean;
-    options: () => {
-        "option-1": string;
-        "option-2": string;
-        "option-3": string;
-    };
-}>>> & Readonly<{
-    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
-    onChange?: ((...args: any[]) => any) | undefined;
-}>, {
-    id: string;
-    errors: import('@phila/phila-ui-core').InputErrors;
-    options: (import('@phila/phila-ui-core').HTMLInputValue[] | import('@phila/phila-ui-core').InputOptions | import('@phila/phila-ui-core').InputOptions[] | import('@phila/phila-ui-core').InputOptionsGroup | import('@phila/phila-ui-core').InputOptionObject[] | undefined) & (object | (string | number | object)[]);
-    textKey: string;
-    valueKey: string;
-    label: string;
-    desc: string;
-    modelValue: string | number | boolean;
-    numOfColumns: string | number;
-    small: boolean;
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>, {
-    label?(_: {}): any;
-    desc?(_: {}): any;
-}>;
+import { RadioProps } from './index';
+declare const _default: import('vue').DefineComponent<RadioProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<RadioProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLSpanElement>;
 export default _default;
-type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-type __VLS_TypePropsToRuntimeProps<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};
-type __VLS_WithDefaults<P, D> = {
-    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
-        default: D[K];
-    }> : P[K];
-};
-type __VLS_Prettify<T> = {
-    [K in keyof T]: T[K];
-} & {};
-type __VLS_WithTemplateSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};
+//# sourceMappingURL=Radio.vue.d.ts.map

package/dist/Radio.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Radio.vue.d.ts","sourceRoot":"","sources":["../src/Radio.vue"],"names":[],"mappings":"AAGA;AAgCA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;;AA+D1C,wBASG"}

package/dist/index.d.ts

@@ -0,0 +1,5 @@
+import { BaseProps } from '@phila/phila-ui-core';
+export { default as Radio } from './Radio.vue';
+export interface RadioProps extends BaseProps {
+}
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,aAAa,CAAC;AAI/C,MAAM,WAAW,UAAW,SAAQ,SAAS;CAE5C"}

package/dist/index.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('./index.css');const e=require("vue"),n=require("@phila/phila-ui-core"),r=e.defineComponent({__name:"Radio",props:{className:{}},setup(o,{emit:a}){const t=o,s=e.computed(()=>n.cn("default-class",t.className));return(c,p)=>(e.openBlock(),e.createElementBlock("span",{class:e.normalizeClass(s.value)}," Hello world! I am Radio ",2))}}),l=(o,a)=>{const t=o.__vccOpts||o;for(const[s,c]of a)t[s]=c;return t},i=l(r,[["__scopeId","data-v-be223e4b"]]);exports.Radio=i;

package/dist/index.mjs

@@ -0,0 +1,22 @@
+import { defineComponent as c, computed as n, createElementBlock as r, openBlock as l, normalizeClass as m } from "vue";
+import { cn as p } from "@phila/phila-ui-core";
+import './index.css';const _ = /* @__PURE__ */ c({
+  __name: "Radio",
+  props: {
+    className: {}
+  },
+  setup(e, { emit: s }) {
+    const o = e, t = n(() => p("default-class", o.className));
+    return (a, d) => (l(), r("span", {
+      class: m(t.value)
+    }, " Hello world! I am Radio ", 2));
+  }
+}), i = (e, s) => {
+  const o = e.__vccOpts || e;
+  for (const [t, a] of s)
+    o[t] = a;
+  return o;
+}, v = /* @__PURE__ */ i(_, [["__scopeId", "data-v-be223e4b"]]);
+export {
+  v as Radio
+};

package/package.json

@@ -1,47 +1,52 @@
 {
   "name": "@phila/phila-ui-radio",
-  "private": false,
-  "version": "0.0.9",
+  "version": "0.0.11",
   "type": "module",
-  "files": [
-    "dist"
-  ],
-  "main": "./dist/Radio.umd.cjs",
-  "module": "./dist/Radio.js",
-  "types": "./dist/types.d.ts",
+  "description": "A radio input component for Phila UI.",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
-      "import": {
-        "types": "./dist/types.d.ts",
-        "default": "./dist/Radio.js"
-      },
-      "require": "./dist/Radio.umd.cjs"
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
     }
   },
-  "scripts": {
-    "dev": "vite",
-    "prepublish": "npm i && npm run build",
-    "build": "vue-tsc && vite build",
-    "preview": "vite preview"
+  "files": [
+    "dist"
+  ],
+  "keywords": [
+    "ui",
+    "radio",
+    "vue",
+    "component"
+  ],
+  "author": "",
+  "license": "MIT",
+  "peerDependencies": {
+    "vue": "^3.0.0"
   },
   "dependencies": {
-    "@phila/phila-ui-core": "^1.0.24",
-    "bulma": "^0.9.4",
-    "vue": "^3.3.8"
+    "@phila/phila-ui-core": "2.1.0"
   },
   "devDependencies": {
-    "@types/node": "^20.10.3",
-    "@vitejs/plugin-vue": "^4.5.0",
-    "sass": "^1.69.5",
-    "typescript": "^5.8.2",
-    "vite": "^5.0.0",
-    "vite-plugin-dts": "^3.6.4",
-    "vite-plugin-lib-inject-css": "^1.3.0",
-    "vue-tsc": "^2.2.8"
+    "@types/node": "^24.0.0",
+    "@vitejs/plugin-vue": "^6.0.1",
+    "eslint": "^9.0.0",
+    "typescript": "^5.8.3",
+    "vite": "^7.0.6",
+    "vite-plugin-dts": "^4.5.4",
+    "vite-plugin-lib-inject-css": "^2.2.2"
   },
-  "publishConfig": {
-    "registry": "https://registry.npmjs.com/",
-    "access": "public"
-  },
-  "gitHead": "09f2b67c1d3db773c813231e21b62b37e34aefbd"
-}
+  "scripts": {
+    "build": "vite build",
+    "dev": "vite build --watch",
+    "lint": "eslint src --ext .ts,.tsx,.vue",
+    "lint:fix": "eslint src --ext .ts,.tsx,.vue --fix",
+    "type-check": "tsc --noEmit",
+    "clean": "rm -rf dist",
+    "format": "prettier --write .",
+    "format:check": "prettier --check ."
+  }
+}

package/dist/Radio.js

@@ -1,104 +0,0 @@
-import { defineComponent as O, getCurrentInstance as I, ref as N, watch as S, createElementBlock as o, openBlock as l, normalizeClass as w, unref as s, createElementVNode as a, createCommentVNode as v, renderSlot as h, Fragment as p, createTextVNode as D, toDisplayString as n, normalizeStyle as P, renderList as _, withDirectives as z, mergeProps as E, vModelRadio as K } from "vue";
-import R from "@phila/phila-ui-core";
-const T = {
-  key: 0,
-  class: "input-error-msg"
-}, U = {
-  key: 1,
-  class: "is-field-info"
-}, q = {
-  key: 0,
-  class: "is-field-info"
-}, A = ["id"], F = ["id", "aria-checked", "name", "value"], H = ["for"], { formHelpers: g } = R, { randomID: L } = g, M = {
-  inheritAttrs: !1
-}, J = /* @__PURE__ */ O({
-  ...M,
-  __name: "Radio",
-  props: {
-    id: { default: L() },
-    errors: { default() {
-      return [];
-    } },
-    optgroup: { type: Boolean },
-    disableableOptions: { type: Boolean },
-    options: { default: () => ({
-      "option-1": "Option 1",
-      "option-2": "Option 2",
-      "option-3": "Option 3"
-    }) },
-    name: {},
-    textKey: { default: "" },
-    valueKey: { default: "" },
-    imaskProps: {},
-    label: { default: "" },
-    desc: { default: "" },
-    modelValue: { type: [String, Number, Boolean], default: "" },
-    numOfColumns: { default: 1 },
-    small: { type: Boolean, default: !1 }
-  },
-  emits: ["update:modelValue", "change"],
-  setup($, { emit: V }) {
-    const r = $, m = V, y = I(), { error: c, classes: b, optionText: C, optionValue: f } = g.useInput.useInputComposable(y, r), i = N(r.modelValue);
-    S(
-      () => r.modelValue,
-      (e) => {
-        i.value = e;
-      }
-    );
-    const k = (e) => {
-      m("change", e), m("update:modelValue", i.value);
-    };
-    return (e, d) => (l(), o("div", {
-      class: w(["input-wrap input-radio", [s(b), r.small && "small-checkradio"]])
-    }, [
-      a("fieldset", null, [
-        a("legend", null, [
-          e.label ? (l(), o(p, { key: 0 }, [
-            D(n(e.label) + " " + n(e.$attrs.required !== void 0 ? "*" : ""), 1)
-          ], 64)) : h(e.$slots, "label", { key: 1 })
-        ]),
-        s(c) ? (l(), o("div", T, [
-          d[1] || (d[1] = a("span", { class: "icon" }, [
-            a("i", { class: "fas fa-exclamation-circle" })
-          ], -1)),
-          a("span", null, n(s(c)), 1)
-        ])) : v("", !0),
-        e.desc ? (l(), o("div", U, n(e.desc), 1)) : (l(), o(p, { key: 2 }, [
-          e.$slots.desc ? (l(), o("div", q, [
-            h(e.$slots, "desc")
-          ])) : v("", !0)
-        ], 64)),
-        a("div", {
-          id: `rd-group-${e.id}`,
-          style: P(`columns: ${e.numOfColumns} auto`),
-          role: "radiogroup"
-        }, [
-          (l(!0), o(p, null, _(e.options, (u, t) => (l(), o("div", {
-            key: t,
-            class: "control"
-          }, [
-            z(a("input", E({
-              id: `rd-${t}-${e.id}`,
-              "onUpdate:modelValue": d[0] || (d[0] = (B) => i.value = B),
-              type: "radio",
-              role: "radio",
-              "aria-checked": e.modelValue === s(f)(u, t),
-              name: `rd-${t}-${e.id}`,
-              class: "is-checkradio",
-              value: s(f)(u, t),
-              ref_for: !0
-            }, e.$attrs, { onChange: k }), null, 16, F), [
-              [K, i.value]
-            ]),
-            a("label", {
-              for: `rd-${t}-${e.id}`
-            }, n(s(C)(u)), 9, H)
-          ]))), 128))
-        ], 12, A)
-      ])
-    ], 2));
-  }
-});
-export {
-  J as default
-};

package/dist/Radio.umd.cjs

@@ -1 +0,0 @@
-(function(e,l){typeof exports=="object"&&typeof module<"u"?module.exports=l(require("vue"),require("@phila/phila-ui-core")):typeof define=="function"&&define.amd?define(["vue","@phila/phila-ui-core"],l):(e=typeof globalThis<"u"?globalThis:e||self,e.Radio=l(e.Vue,e.PhilaUICore))})(this,function(e,l){"use strict";const m={key:0,class:"input-error-msg"},f={key:1,class:"is-field-info"},u={key:0,class:"is-field-info"},k=["id"],h=["id","aria-checked","name","value"],V=["for"],{formHelpers:i}=l,{randomID:B}=i,g={inheritAttrs:!1};return e.defineComponent({...g,__name:"Radio",props:{id:{default:B()},errors:{default(){return[]}},optgroup:{type:Boolean},disableableOptions:{type:Boolean},options:{default:()=>({"option-1":"Option 1","option-2":"Option 2","option-3":"Option 3"})},name:{},textKey:{default:""},valueKey:{default:""},imaskProps:{},label:{default:""},desc:{default:""},modelValue:{type:[String,Number,Boolean],default:""},numOfColumns:{default:1},small:{type:Boolean,default:!1}},emits:["update:modelValue","change"],setup(y,{emit:E}){const n=y,d=E,$=e.getCurrentInstance(),{error:c,classes:N,optionText:C,optionValue:p}=i.useInput.useInputComposable($,n),a=e.ref(n.modelValue);e.watch(()=>n.modelValue,o=>{a.value=o});const S=o=>{d("change",o),d("update:modelValue",a.value)};return(o,r)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["input-wrap input-radio",[e.unref(N),n.small&&"small-checkradio"]])},[e.createElementVNode("fieldset",null,[e.createElementVNode("legend",null,[o.label?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createTextVNode(e.toDisplayString(o.label)+" "+e.toDisplayString(o.$attrs.required!==void 0?"*":""),1)],64)):e.renderSlot(o.$slots,"label",{key:1})]),e.unref(c)?(e.openBlock(),e.createElementBlock("div",m,[r[1]||(r[1]=e.createElementVNode("span",{class:"icon"},[e.createElementVNode("i",{class:"fas fa-exclamation-circle"})],-1)),e.createElementVNode("span",null,e.toDisplayString(e.unref(c)),1)])):e.createCommentVNode("",!0),o.desc?(e.openBlock(),e.createElementBlock("div",f,e.toDisplayString(o.desc),1)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:2},[o.$slots.desc?(e.openBlock(),e.createElementBlock("div",u,[e.renderSlot(o.$slots,"desc")])):e.createCommentVNode("",!0)],64)),e.createElementVNode("div",{id:`rd-group-${o.id}`,style:e.normalizeStyle(`columns: ${o.numOfColumns} auto`),role:"radiogroup"},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.options,(s,t)=>(e.openBlock(),e.createElementBlock("div",{key:t,class:"control"},[e.withDirectives(e.createElementVNode("input",e.mergeProps({id:`rd-${t}-${o.id}`,"onUpdate:modelValue":r[0]||(r[0]=b=>a.value=b),type:"radio",role:"radio","aria-checked":o.modelValue===e.unref(p)(s,t),name:`rd-${t}-${o.id}`,class:"is-checkradio",value:e.unref(p)(s,t),ref_for:!0},o.$attrs,{onChange:S}),null,16,h),[[e.vModelRadio,a.value]]),e.createElementVNode("label",{for:`rd-${t}-${o.id}`},e.toDisplayString(e.unref(C)(s)),9,V)]))),128))],12,k)])],2))}})});

package/dist/types.d.ts

@@ -1,18 +0,0 @@
-import { default as Radio } from './Radio.vue';
-
-declare module 'vue' {
-    interface GlobalComponents {
-        Radio: typeof Radio;
-    }
-}
-export interface RadioProps {
-    label?: string;
-    desc?: string;
-    modelValue: string | number | boolean;
-    valueKey?: string;
-    textKey?: string;
-    numOfColumns?: string | number;
-    small?: boolean;
-    options: object | Array<string | number | object>;
-}
-export default Radio;