@jamsrui/checkbox 0.0.21 → 0.1.0

package/README.md

@@ -2,12 +2,11 @@
 
 **A comprehensive React UI component library designed for developers, with Tailwind CSS integration for seamless styling.**
 
-
 ## 📖 **Overview**
 
 [JamsrUI](https://jamsr-ui.jamsrworld.com) is designed to help developers build modern, fast and visually appealing web applications with ease.
 
-## 🚀 Getting Started 
+## 🚀 Getting Started
 
 Boost & Build your websites using [JamsrUI](https://jamsr-ui.jamsrworld.com).
 
@@ -37,4 +36,3 @@ We welcome contributions from developers of all skill levels!
 ## ⭐ Support the Project
 
 If you find **JamsrUI** helpful, consider giving it a ⭐ on [GitHub](https://github.com/jamsrworld/jamsr-ui).
-

package/dist/checkbox-context.d.mts

@@ -7,7 +7,6 @@ import './checkbox-indicator.mjs';
 import 'react/jsx-runtime';
 import './checkbox-input.mjs';
 import './checkbox-root.mjs';
-import './styles.mjs';
 
 declare const useCheckboxContext: () => CheckboxContext.Props;
 declare const CheckboxContext: react.Context<CheckboxContext.Props | null>;

package/dist/checkbox-control.mjs

@@ -1 +1 @@
-"use client";import{Fragment as m,jsx as e,jsxs as i}from"react/jsx-runtime";import{useRenderElement as n}from"@jamsrui/hooks";import{useCheckboxContext as p}from"./checkbox-context.mjs";import{CheckboxIndicator as c}from"./checkbox-indicator.mjs";import{CheckboxInput as s}from"./checkbox-input.mjs";const b=o=>{const{getControlProps:r}=p(),{children:t=e(c,{})}=o;return n("div",{props:[r(o),{children:i(m,{children:[e(s,{}),t]})}]})};export{b as CheckboxControl};
+"use client";import{useRenderElement as r}from"@jamsrui/hooks";import{useCheckboxContext as t}from"./checkbox-context.mjs";const m=e=>{const{getControlProps:o}=t();return r("div",{props:[o(e)]})};export{m as CheckboxControl};

package/dist/checkbox-icon.mjs

@@ -1 +1 @@
-"use client";import{jsx as e}from"react/jsx-runtime";import{motion as o}from"motion/react";import{useCheckboxContext as i}from"./checkbox-context.mjs";const r={pressed:{pathLength:.5},checked:{pathLength:1,opacity:1,transition:{duration:.2}},unchecked:{pathLength:0,opacity:0,transition:{duration:.2}}},c=()=>{const{isChecked:n,isIntermediate:t}=i();return e(o.svg,{animate:n||t?"checked":"unchecked",fill:"none",initial:!1,stroke:"currentColor",strokeWidth:"2",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",children:e(o.path,{d:t?"M5 12h14":"M4.5 12.75l6 6 9-13.5",strokeLinecap:"round",strokeLinejoin:"round",variants:r})})};export{c as CheckboxIcon};
+"use client";import{jsx as e}from"react/jsx-runtime";import{motion as o}from"motion/react";import{useCheckboxContext as i}from"./checkbox-context.mjs";const r={pressed:{pathLength:.5},checked:{pathLength:1,opacity:1,transition:{duration:.2}},unchecked:{pathLength:0,opacity:0,transition:{duration:.2}}},c=()=>{const{isChecked:n,isIntermediate:t}=i();return e(o.svg,{animate:n||t?"checked":"unchecked",fill:"none",initial:!1,stroke:"currentColor",strokeWidth:"4",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",children:e(o.path,{d:t?"M5 12h14":"M4.5 12.75l6 6 9-13.5",strokeLinecap:"round",strokeLinejoin:"round",variants:r})})};export{c as CheckboxIcon};

package/dist/checkbox-indicator.mjs

@@ -1 +1 @@
-"use client";import{jsx as e}from"react/jsx-runtime";import{useCheckboxContext as n}from"./checkbox-context.mjs";import{CheckboxIcon as s}from"./checkbox-icon.mjs";const p=t=>{const{getIndicatorProps:c,isChecked:r}=n(),{children:o=e(s,{})}=t,i=typeof o=="function"?o({isChecked:r}):o;return e("div",{...c({}),children:i})};export{p as CheckboxIndicator};
+"use client";import{jsx as e}from"react/jsx-runtime";import{useCheckboxContext as s}from"./checkbox-context.mjs";import{CheckboxIcon as d}from"./checkbox-icon.mjs";const h=t=>{const{getIndicatorProps:c,isChecked:r}=s(),{children:o=e(d,{}),...i}=t,n=typeof o=="function"?o({isChecked:r}):o;return e("div",{...c(i),children:n})};export{h as CheckboxIndicator};

package/dist/checkbox.d.mts

@@ -7,7 +7,6 @@ import './checkbox-control.mjs';
 import './checkbox-indicator.mjs';
 import './checkbox-input.mjs';
 import './checkbox-root.mjs';
-import './styles.mjs';
 
 declare const Checkbox: (props: Checkbox.Props) => react_jsx_runtime.JSX.Element;
 declare namespace Checkbox {

package/dist/checkbox.mjs

@@ -1 +1 @@
-"use client";import{jsx as o}from"react/jsx-runtime";import{FieldA11yContext as n,useFieldA11y as i}from"@jamsrui/context";import{mergeConfigProps as s}from"@jamsrui/utils";import{useCheckboxConfig as C}from"./checkbox-config.mjs";import{CheckboxContext as m}from"./checkbox-context.mjs";import{CheckboxRoot as p}from"./checkbox-root.mjs";import{checkboxVariants as f}from"./styles.mjs";import{useCheckbox as h}from"./use-checkbox.mjs";const P=e=>{const t=C(),r=s(f.defaultVariants,t,e),c=h(r),x=i();return o(m,{value:c,children:o(n,{value:x,children:o(p,{children:e.children})})})};export{P as Checkbox};
+"use client";import{jsx as e}from"react/jsx-runtime";import{FieldA11yContext as c,useFieldA11y as r}from"@jamsrui/context";import{CheckboxContext as C}from"./checkbox-context.mjs";import{CheckboxRoot as n}from"./checkbox-root.mjs";import{useCheckbox as h}from"./use-checkbox.mjs";const k=o=>{const t=h(o),x=r();return e(C,{value:t,children:e(c,{value:x,children:e(n,{children:o.children})})})};export{k as Checkbox};

package/dist/index.d.mts

@@ -1,35 +1,32 @@
 import * as react from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { Checkbox as Checkbox$1 } from './checkbox.mjs';
-import { CheckboxConfig } from './checkbox-config.mjs';
-export { useCheckboxConfig } from './checkbox-config.mjs';
 import { CheckboxContent } from './checkbox-content.mjs';
 import { CheckboxControl } from './checkbox-control.mjs';
 import { CheckboxIndicator } from './checkbox-indicator.mjs';
+import { CheckboxInput } from './checkbox-input.mjs';
 export { useCheckbox } from './use-checkbox.mjs';
-import '@jamsrui/core';
 import '@jamsrui/utils';
-import './checkbox-input.mjs';
 import './checkbox-root.mjs';
-import './styles.mjs';
 
 declare const Checkbox: ((props: Checkbox$1.Props) => react_jsx_runtime.JSX.Element) & {
     Root: (props: Checkbox$1.Props) => react_jsx_runtime.JSX.Element;
     Control: (props: CheckboxControl.Props) => react.ReactElement<unknown, string | react.JSXElementConstructor<any>>;
     Indicator: (props: CheckboxIndicator.Props) => react_jsx_runtime.JSX.Element;
     Content: (props: CheckboxContent.Props) => react.ReactElement<unknown, string | react.JSXElementConstructor<any>>;
+    Input: (props: CheckboxInput.Props) => react.ReactElement<unknown, string | react.JSXElementConstructor<any>>;
 };
 declare namespace Checkbox {
     interface Props extends Checkbox$1.Props {
     }
-    interface Config extends CheckboxConfig.Props {
-    }
     interface Control extends CheckboxControl.Props {
     }
     interface Indicator extends CheckboxIndicator.Props {
     }
     interface Content extends CheckboxContent.Props {
     }
+    interface Input extends CheckboxInput.Props {
+    }
 }
 
-export { Checkbox, CheckboxConfig, CheckboxContent, CheckboxControl, CheckboxIndicator };
+export { Checkbox };

package/dist/index.mjs

@@ -1 +1 @@
-import{Checkbox as o}from"./checkbox.mjs";import{CheckboxConfig as n,useCheckboxConfig as x}from"./checkbox-config.mjs";import{CheckboxContent as e}from"./checkbox-content.mjs";import{CheckboxControl as t}from"./checkbox-control.mjs";import{CheckboxIndicator as r}from"./checkbox-indicator.mjs";import{useCheckbox as c}from"./use-checkbox.mjs";const h=Object.assign(o,{Root:o,Control:t,Indicator:r,Content:e});export{h as Checkbox,n as CheckboxConfig,e as CheckboxContent,t as CheckboxControl,r as CheckboxIndicator,c as useCheckbox,x as useCheckboxConfig};
+import{Checkbox as o}from"./checkbox.mjs";import{CheckboxContent as e}from"./checkbox-content.mjs";import{CheckboxControl as t}from"./checkbox-control.mjs";import{CheckboxIndicator as r}from"./checkbox-indicator.mjs";import{CheckboxInput as n}from"./checkbox-input.mjs";import{useCheckbox as x}from"./use-checkbox.mjs";const h=Object.assign(o,{Root:o,Control:t,Indicator:r,Content:e,Input:n});export{h as Checkbox,x as useCheckbox};

package/dist/use-checkbox.d.mts

@@ -4,7 +4,6 @@ import { CheckboxControl } from './checkbox-control.mjs';
 import { CheckboxIndicator } from './checkbox-indicator.mjs';
 import { CheckboxInput } from './checkbox-input.mjs';
 import { CheckboxRoot } from './checkbox-root.mjs';
-import { CheckboxVariantProps } from './styles.mjs';
 import 'react';
 import 'react/jsx-runtime';
 
@@ -20,12 +19,13 @@ declare const useCheckbox: (props: useCheckbox.Props) => {
     isIntermediate: boolean | undefined;
 };
 declare namespace useCheckbox {
-    interface Props extends CheckboxRoot.Props, CheckboxVariantProps {
+    interface Props extends CheckboxRoot.Props {
         defaultChecked?: boolean;
         checked?: boolean;
         onCheckedChange?: (checked: boolean) => void;
         isIntermediate?: boolean;
         disabled?: boolean;
+        isInvalid?: boolean;
         inputProps?: UIProps<"input">;
         name?: string;
         form?: string;

package/dist/use-checkbox.mjs

@@ -1 +1 @@
-"use client";import{useCallback as a,useMemo as E}from"react";import{useControlledState as F,useFocusVisible as U,useHover as j,useMergeRefs as K,usePress as L}from"@jamsrui/hooks";import{dataAttr as s,dataAttrDev as r,mapPropsVariants as O,mergeProps as S}from"@jamsrui/utils";import{checkboxVariants as v}from"./styles.mjs";const J=y=>{const[R,m]=O(y,v.variantKeys),{isInvalid:h}=m,o=v(m),{checked:V,onCheckedChange:i,defaultChecked:p,isIntermediate:c,disabled:G=!1,inputProps:H,...l}=R,t=G,[n=!1,b]=F({defaultProp:p,prop:V,onChange:i}),{isFocusVisible:C,ref:M}=U({isDisabled:t}),{isPressed:k,ref:A}=L({isDisabled:t}),{isHovered:u,ref:D}=j({isDisabled:t}),P=K([M,A,D]),d=a(e=>{b(e.target.checked)},[b]),f=a(()=>({...l,className:o.root({className:l.className}),"data-slot":r("root"),"data-component":r("checkbox"),"data-checked":s(n||c),"data-focus-visible":s(C),"data-pressed":s(k),"data-hovered":s(u),"data-disabled":s(t),"aria-disabled":s(t),"data-invalid":s(h)}),[l,n,t,C,u,c,k,h,o]),x=a(e=>({onChange:d,...S(e,H,{onChange:d}),disabled:t,"aria-disabled":s(t),ref:P,type:"checkbox","data-slot":r("input"),className:o.input({className:e.className})}),[d,t,P,o]),g=a(e=>({...e,"data-slot":r("content"),className:o.content({className:e.className})}),[o]),N=a(e=>({...e,"data-slot":r("control"),className:o.control({className:e.className})}),[o]),I=a(e=>({...e,"data-slot":r("indicator"),className:o.indicator({className:e.className})}),[o]);return E(()=>({getRootProps:f,getInputProps:x,getContentProps:g,getControlProps:N,getIndicatorProps:I,onCheckedChange:i,defaultChecked:p,isChecked:n,isIntermediate:c}),[p,g,x,f,N,I,n,c,i])};export{J as useCheckbox};
+"use client";import{useCallback as s,useMemo as G}from"react";import{useControlledState as L,useFocusVisible as T,useHover as V,useMergeRefs as F,usePress as U}from"@jamsrui/hooks";import{dataAttr as t,mergeProps as j}from"@jamsrui/utils";const q=v=>{const{checked:R,onCheckedChange:a,defaultChecked:c,isIntermediate:r,disabled:y=!1,isInvalid:i,inputProps:d,className:l,...h}=v,e=y,[n=!1,b]=L({defaultProp:c,prop:R,onChange:a}),{isFocusVisible:C,ref:H}=T({isDisabled:e}),{isPressed:u,ref:M}=U({isDisabled:e}),{isHovered:k,ref:E}=V({isDisabled:e}),m=F([H,M,E]),p=s(o=>{b(o.target.checked)},[b]),P=s(()=>({...h,className:l,"data-slot":"root","data-component":"checkbox","data-checked":t(n||r),"data-focus-visible":t(C),"data-pressed":t(u),"data-hovered":t(k),"data-disabled":t(e),"aria-disabled":t(e),"data-invalid":t(i)}),[h,l,n,e,C,k,r,u,i]),f=s(o=>({onChange:p,...j(o,d,{onChange:p}),disabled:e,"aria-disabled":t(e),ref:m,type:"checkbox","data-slot":"input"}),[p,e,m,d]),x=s(o=>({...o,"data-slot":"content"}),[]),I=s(o=>({...o,"data-slot":"control"}),[]),g=s(o=>({...o,"data-slot":"indicator"}),[]);return G(()=>({getRootProps:P,getInputProps:f,getContentProps:x,getControlProps:I,getIndicatorProps:g,onCheckedChange:a,defaultChecked:c,isChecked:n,isIntermediate:r}),[c,x,f,P,I,g,n,r,a])};export{q as useCheckbox};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jamsrui/checkbox",
-  "version": "0.0.21",
+  "version": "0.1.0",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
@@ -16,11 +16,10 @@
     "react": ">=19"
   },
   "dependencies": {
-    "@jamsrui/core": "^0.0.16",
-    "@jamsrui/hooks": "^0.0.20",
-    "@jamsrui/slot": "^0.0.17",
-    "@jamsrui/utils": "^0.0.20",
-    "@jamsrui/context": "^0.0.9"
+    "@jamsrui/context": "^0.1.0",
+    "@jamsrui/core": "^0.1.0",
+    "@jamsrui/utils": "^0.1.0",
+    "@jamsrui/hooks": "^0.1.0"
   },
   "description": "A modern and beautiful Next.js UI components library.",
   "keywords": [

package/dist/checkbox-config.d.mts

@@ -1,24 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { WithGlobalConfig } from '@jamsrui/core';
-import { Checkbox } from './checkbox.mjs';
-import './use-checkbox.mjs';
-import '@jamsrui/utils';
-import './checkbox-content.mjs';
-import 'react';
-import './checkbox-control.mjs';
-import './checkbox-indicator.mjs';
-import './checkbox-input.mjs';
-import './checkbox-root.mjs';
-import './styles.mjs';
-
-declare const useCheckboxConfig: () => CheckboxConfig.Props;
-declare const CheckboxConfig: (props: Omit<Partial<CheckboxConfig.Props>, "children"> & {
-    merge?: boolean;
-    children: React.ReactNode;
-}) => react_jsx_runtime.JSX.Element;
-declare namespace CheckboxConfig {
-    interface Props extends WithGlobalConfig<Checkbox.Props> {
-    }
-}
-
-export { CheckboxConfig, useCheckboxConfig };

package/dist/checkbox-config.mjs

@@ -1 +0,0 @@
-"use client";import{createConfigContext as o}from"@jamsrui/utils";const[i,t]=o({displayName:"CheckboxConfig"});export{i as CheckboxConfig,t as useCheckboxConfig};

package/dist/styles.d.mts

@@ -1,116 +0,0 @@
-import * as _jamsrui_utils from '@jamsrui/utils';
-import { VariantProps } from '@jamsrui/utils';
-
-declare const checkboxVariants: _jamsrui_utils.TVReturnType<{
-    size: {
-        sm: {
-            root: string;
-            control: string;
-        };
-        md: {
-            root: string;
-            control: string;
-        };
-        lg: {
-            root: string;
-            control: string;
-        };
-    };
-    isInvalid: {
-        true: {
-            control: string;
-        };
-    };
-    radius: {
-        sm: {};
-        md: {};
-        lg: {};
-        xl: {};
-        "2xl": {};
-        "3xl": {};
-        full: {};
-        none: {};
-    };
-}, {
-    root: string[];
-    control: string[];
-    input: string;
-    content: string;
-    indicator: string;
-}, undefined, {
-    size: {
-        sm: {
-            root: string;
-            control: string;
-        };
-        md: {
-            root: string;
-            control: string;
-        };
-        lg: {
-            root: string;
-            control: string;
-        };
-    };
-    isInvalid: {
-        true: {
-            control: string;
-        };
-    };
-    radius: {
-        sm: {};
-        md: {};
-        lg: {};
-        xl: {};
-        "2xl": {};
-        "3xl": {};
-        full: {};
-        none: {};
-    };
-}, {
-    root: string[];
-    control: string[];
-    input: string;
-    content: string;
-    indicator: string;
-}, _jamsrui_utils.TVReturnType<{
-    size: {
-        sm: {
-            root: string;
-            control: string;
-        };
-        md: {
-            root: string;
-            control: string;
-        };
-        lg: {
-            root: string;
-            control: string;
-        };
-    };
-    isInvalid: {
-        true: {
-            control: string;
-        };
-    };
-    radius: {
-        sm: {};
-        md: {};
-        lg: {};
-        xl: {};
-        "2xl": {};
-        "3xl": {};
-        full: {};
-        none: {};
-    };
-}, {
-    root: string[];
-    control: string[];
-    input: string;
-    content: string;
-    indicator: string;
-}, undefined, unknown, unknown, undefined>>;
-type CheckboxVariantProps = VariantProps<typeof checkboxVariants>;
-type CheckboxSlots = keyof ReturnType<typeof checkboxVariants>;
-
-export { type CheckboxSlots, type CheckboxVariantProps, checkboxVariants };

package/dist/styles.mjs

@@ -1 +0,0 @@
-import{groupDataFocusVisibleClasses as e,radiusVariant as o,tv as r}from"@jamsrui/utils";const a=r({slots:{root:["checkbox group flex gap-2 items-start","data-disabled:status-disabled"],control:["checkbox__control flex justify-center items-center",...e,"shrink-0 border-default uig-hover:border-default-hover","relative appearance-none border uig-checked:border-primary uig-checked:bg-primary uig-checked:text-primary-foreground","uig-disabled:status-disabled uig-pressed:scale-90 transition-all duration-300"],input:"checkbox__input absolute opacity-[0.0001] cursor-default disabled:cursor-not-allowed inset-0 z-1",content:"checkbox__content flex flex-col justify-center gap-1",indicator:"checkbox__indicator size-3"},variants:{size:{sm:{root:"checkbox--sm",control:"size-4"},md:{root:"checkbox--md",control:"size-4.5"},lg:{root:"checkbox--lg",control:"size-5"}},isInvalid:{true:{control:"border-danger! uig-checked:bg-danger"}},radius:o("control")},defaultVariants:{radius:"md",size:"md"}});export{a as checkboxVariants};