@phila/phila-ui-radio 0.0.10 → 0.0.11

package/README.md

@@ -1,30 +1,75 @@
+# Radio Component
+
+A simple, customizable Vue 3. Radio component built with TypeScript and Vite.
+A radio input component for Phila UI.
+
+## 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
+```
+
 ## Usage
 
-#### Import single component...
+```vue
+<script setup lang="ts">
+import { Radio } from "@phila/phila-ui-radio";
+</script>
+<template>...Add basic component template here...</template>
+```
+
+## Props
+
+| Prop | Type | Default | Description |
+| ---- | ---- | ------- | ----------- |
+
+| ...Add props here...
 
-```js
-import { Radio } from '@phila/phila-ui';
+## Events
 
-//register it locally...
-components: {
-  Radio,
-}
+| Event | Payload | Description |
+| ----- | ------- | ----------- |
 
-//... or register it globally
-Vue.component('radio', Radio);
+| ...Add events here...
+
+## Examples
+
+...Add examples here...
+
+## Development
+
+### Install Dependencies
+
+```bash
+pnpm install
 ```
 
-#### or import the whole library,
+### Run Demo
+
+```bash
+pnpm dev
+```
+
+### Build Library
+
+```bash
+pnpm build
+```
 
-```js
-import * as PhilaUI from "@phila/phila-ui";
+### Type Check
 
-//register it globally
-Vue.use(PhilaUI);
+```bash
+pnpm type-check
 ```
 
-#### then use it in the vue template
+## License
 
-```html
-<radio></radio>
-```
+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.10",
+  "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": "f00518592815b1bf558d88f77fc4b6b3a30296e5"
-}
+  "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;