@purr-react-tailwindcss/components.radio-group 0.0.4 → 0.0.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@purr-react-tailwindcss/components.radio-group",
-  "version": "0.0.4",
+  "version": "0.0.6",
   "type": "module",
   "main": "dist/index.cjs",
   "module": "dist/index.js",
@@ -24,9 +24,9 @@
     "typescript": "*",
     "react": "*",
     "clsx": "*",
-    "@purr-core/utils.helpers": "0.0.9",
-    "@purr-core/utils.definitions": "0.0.9",
-    "@purr-core/hooks.sync-state-with-props": "0.0.7"
+    "@purr-core/hooks.sync-state-with-props": "0.0.8",
+    "@purr-core/utils.helpers": "0.0.11",
+    "@purr-core/utils.definitions": "0.0.11"
   },
   "author": "@DinhThienPhuc",
   "license": "ISC",
@@ -35,6 +35,8 @@
   "scripts": {
     "dev": "vite build --watch",
     "build": "tsc && vite build",
+    "build:vite": "tsc && vite build",
+    "build:tsup": "tsup",
     "lint": "eslint . --ext ts,tsx --max-warnings 0"
   }
 }

package/dist/_components/_label.d.ts

@@ -1,4 +0,0 @@
-import { default as React } from 'react';
-import { IRadioGroupLabelProps } from '../_types';
-
-export declare const RadioGroupLabel: React.MemoExoticComponent<({ label, hasValue, htmlAttributes }: IRadioGroupLabelProps) => React.JSX.Element>;

package/dist/_components/_option.d.ts

@@ -1,4 +0,0 @@
-import { default as React } from 'react';
-import { IRadioGroupOptionProps } from '../_types';
-
-export declare const RadioGroupOption: React.MemoExoticComponent<({ label, value, name, htmlAttributes, textHTMLAttributes, checkBoxHTMLAttributes, checkBoxTickHTMLAttributes, isStandalone, currentValue, setCurrentValue, onChange, }: IRadioGroupOptionProps) => React.JSX.Element>;

package/dist/_components/index.d.ts

@@ -1,4 +0,0 @@
-import { default as React } from 'react';
-import { IRadioGroupProps } from '../_types';
-
-export declare const RadioGroup: React.ForwardRefExoticComponent<IRadioGroupProps & React.RefAttributes<HTMLElement>>;

package/dist/_label-Bwrjrv60.js

@@ -1,21 +0,0 @@
-import { jsx as t } from "react/jsx-runtime";
-import a from "clsx";
-import { memo as i } from "react";
-const s = i(
-  ({ label: o = "", hasValue: e, htmlAttributes: r }) => /* @__PURE__ */ t(
-    "span",
-    {
-      className: a(
-        "text-base transition-colors duration-200 ease-in-out",
-        e ? "text-blue-300" : "text-white",
-        "radio-group-label"
-      ),
-      ...r,
-      children: o
-    }
-  )
-);
-s.displayName = "RadioGroupLabel";
-export {
-  s as RadioGroupLabel
-};

package/dist/_label-VT0fJVvQ.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),i=require("clsx"),s=require("react"),e=s.memo(({label:t="",hasValue:o,htmlAttributes:r})=>a.jsx("span",{className:i("text-base transition-colors duration-200 ease-in-out",o?"text-blue-300":"text-white","radio-group-label"),...r,children:t}));e.displayName="RadioGroupLabel";exports.RadioGroupLabel=e;

package/dist/_types.d.ts

@@ -1,38 +0,0 @@
-import { ChangeEvent, HTMLAttributes, LabelHTMLAttributes } from 'react';
-import { IExtendable } from '@purr-core/utils.definitions';
-
-export type TRadioGroupDirection = "column" | "row";
-export interface IRadioGroupOption {
-    key: string;
-    value: string;
-    label?: string;
-    htmlAttributes?: LabelHTMLAttributes<HTMLLabelElement> & IExtendable;
-    textHTMLAttributes?: LabelHTMLAttributes<HTMLSpanElement> & IExtendable;
-    checkBoxHTMLAttributes?: LabelHTMLAttributes<HTMLInputElement> & IExtendable;
-    checkBoxTickHTMLAttributes?: LabelHTMLAttributes<HTMLInputElement> & IExtendable;
-}
-export interface IRadioGroupOptionProps extends IRadioGroupOption {
-    name: string;
-    currentValue?: string;
-    isStandalone?: boolean;
-    setCurrentValue?: (value: string) => void;
-    onChange?: (value: string, e: ChangeEvent<HTMLInputElement>) => void;
-}
-export interface IRadioGroupLabelProps {
-    label?: string;
-    hasValue?: boolean;
-    htmlAttributes?: LabelHTMLAttributes<HTMLLabelElement> & IExtendable;
-}
-export interface IRadioGroupProps {
-    options: IRadioGroupOption[];
-    name: string;
-    value?: string;
-    label?: string;
-    isStandalone?: boolean;
-    direction?: TRadioGroupDirection;
-    htmlAttributes?: HTMLAttributes<HTMLDivElement> & IExtendable;
-    labelHtmlAttributes?: HTMLAttributes<HTMLSpanElement> & IExtendable;
-    optionHtmlAttributes?: LabelHTMLAttributes<HTMLLabelElement> & IExtendable;
-    optionGroupHtmlAttributes?: LabelHTMLAttributes<HTMLDivElement> & IExtendable;
-    onChange?: (value: string, e: ChangeEvent<HTMLInputElement>) => void;
-}

package/dist/index.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),t=require("react"),b=require("clsx"),g=require("@purr-core/hooks.sync-state-with-props"),k=require("@purr-core/utils.helpers"),j=t.memo(({label:r,value:e,name:o,htmlAttributes:c,textHTMLAttributes:n,checkBoxHTMLAttributes:d,checkBoxTickHTMLAttributes:f,isStandalone:p,currentValue:m,setCurrentValue:a,onChange:l})=>{var R;const h=t.useRef(null),i=p?(R=h.current)==null?void 0:R.checked:m===e,x=p?void 0:m===e,u=t.useCallback(y=>{l==null||l(e,y),a==null||a(e)},[l,a,e]),w=t.useMemo(()=>s.jsx("span",{className:"radio-group-option-label text-base text-white",...n,children:r}),[r,n]);return s.jsxs("label",{className:"radio-group-option flex cursor-pointer items-center gap-3",...c,children:[s.jsxs("span",{className:"relative flex",children:[s.jsx("input",{className:b("h-4 w-4 appearance-none rounded-full border-2 border-blue-300","radio-group-option-input",i?"radio-group-option-input--checked":""),name:o,type:"radio",value:e,checked:x,onChange:u,ref:h,...d}),s.jsx("span",{className:b("absolute left-1 top-1 h-2 w-2 rounded-full bg-blue-300 transition-transform duration-200 ease-in-out",i?"scale-100 transform":"scale-0 transform"),...f})]}),w]})},k.arePropsShallowEqual(["currentValue"],(r,e,o)=>{switch(r){case"currentValue":return o.currentValue===o.value==(e.currentValue===e.value);default:return}}));j.displayName="RadioGroupOption";const q=t.lazy(()=>Promise.resolve().then(()=>require("./_label-VT0fJVvQ.cjs")).then(r=>({default:r.RadioGroupLabel}))),N=t.forwardRef(({options:r,name:e,value:o="",label:c="",onChange:n,isStandalone:d=!1,direction:f="column",htmlAttributes:p,labelHtmlAttributes:m,optionHtmlAttributes:a,optionGroupHtmlAttributes:l},h)=>{const{currentValue:i,setCurrentValue:x}=g(o,d);return s.jsxs("div",{className:"radio-group flex flex-col gap-4",...p,children:[s.jsx(t.Suspense,{children:!!c&&s.jsx(q,{hasValue:!!i,label:c,htmlAttributes:m})}),s.jsx("div",{className:b("flex gap-4",f==="column"?"flex-col items-start":"flex-row"),...l,children:r==null?void 0:r.map(u=>t.createElement(j,{...u,key:u.key,name:e,htmlAttributes:a??u.htmlAttributes,isStandalone:d,currentValue:i,setCurrentValue:x,onChange:n}))})]})});N.displayName="RadioGroup";exports.RadioGroup=N;

package/dist/index.d.ts

@@ -1,2 +0,0 @@
-export * from './_components';
-export * from './_types';

package/dist/index.js

@@ -1,144 +0,0 @@
-import { jsx as l, jsxs as b } from "react/jsx-runtime";
-import { memo as y, useRef as g, useCallback as G, useMemo as O, lazy as j, forwardRef as A, Suspense as E, createElement as L } from "react";
-import R from "clsx";
-import S from "@purr-core/hooks.sync-state-with-props";
-import { arePropsShallowEqual as q } from "@purr-core/utils.helpers";
-const N = y(
-  ({
-    label: r,
-    value: e,
-    name: o,
-    htmlAttributes: c,
-    textHTMLAttributes: u,
-    checkBoxHTMLAttributes: n,
-    checkBoxTickHTMLAttributes: m,
-    isStandalone: d,
-    currentValue: p,
-    setCurrentValue: t,
-    onChange: a
-  }) => {
-    var x;
-    const f = g(null), s = d ? (x = f.current) == null ? void 0 : x.checked : p === e, h = d ? void 0 : p === e, i = G(
-      (k) => {
-        a == null || a(e, k), t == null || t(e);
-      },
-      [a, t, e]
-    ), w = O(
-      () => /* @__PURE__ */ l(
-        "span",
-        {
-          className: "radio-group-option-label text-base text-white",
-          ...u,
-          children: r
-        }
-      ),
-      [r, u]
-    );
-    return /* @__PURE__ */ b(
-      "label",
-      {
-        className: "radio-group-option flex cursor-pointer items-center gap-3",
-        ...c,
-        children: [
-          /* @__PURE__ */ b("span", { className: "relative flex", children: [
-            /* @__PURE__ */ l(
-              "input",
-              {
-                className: R(
-                  "h-4 w-4 appearance-none rounded-full border-2 border-blue-300",
-                  "radio-group-option-input",
-                  s ? "radio-group-option-input--checked" : ""
-                ),
-                name: o,
-                type: "radio",
-                value: e,
-                checked: h,
-                onChange: i,
-                ref: f,
-                ...n
-              }
-            ),
-            /* @__PURE__ */ l(
-              "span",
-              {
-                className: R(
-                  "absolute left-1 top-1 h-2 w-2 rounded-full bg-blue-300 transition-transform duration-200 ease-in-out",
-                  s ? "scale-100 transform" : "scale-0 transform"
-                ),
-                ...m
-              }
-            )
-          ] }),
-          w
-        ]
-      }
-    );
-  },
-  q(["currentValue"], (r, e, o) => {
-    switch (r) {
-      case "currentValue":
-        return o.currentValue === o.value == (e.currentValue === e.value);
-      default:
-        return;
-    }
-  })
-);
-N.displayName = "RadioGroupOption";
-const z = j(
-  () => import("./_label-Bwrjrv60.js").then((r) => ({
-    default: r.RadioGroupLabel
-  }))
-), I = A(
-  ({
-    options: r,
-    name: e,
-    value: o = "",
-    label: c = "",
-    onChange: u,
-    isStandalone: n = !1,
-    direction: m = "column",
-    htmlAttributes: d,
-    labelHtmlAttributes: p,
-    optionHtmlAttributes: t,
-    optionGroupHtmlAttributes: a
-  }, f) => {
-    const { currentValue: s, setCurrentValue: h } = S(o, n);
-    return /* @__PURE__ */ b("div", { className: "radio-group flex flex-col gap-4", ...d, children: [
-      /* @__PURE__ */ l(E, { children: !!c && /* @__PURE__ */ l(
-        z,
-        {
-          hasValue: !!s,
-          label: c,
-          htmlAttributes: p
-        }
-      ) }),
-      /* @__PURE__ */ l(
-        "div",
-        {
-          className: R(
-            "flex gap-4",
-            m === "column" ? "flex-col items-start" : "flex-row"
-          ),
-          ...a,
-          children: r == null ? void 0 : r.map((i) => /* @__PURE__ */ L(
-            N,
-            {
-              ...i,
-              key: i.key,
-              name: e,
-              htmlAttributes: t ?? i.htmlAttributes,
-              isStandalone: n,
-              currentValue: s,
-              setCurrentValue: h,
-              onChange: u
-            }
-          ))
-        }
-      )
-    ] });
-  }
-);
-I.displayName = "RadioGroup";
-export {
-  I as RadioGroup
-};