@dafaz-ui/react 4.0.3 → 4.0.5

package/.turbo/turbo-build.log

@@ -1,5 +1,5 @@
 
-> @dafaz-ui/react@4.0.3 build
+> @dafaz-ui/react@4.0.5 build
 > tsup src/index.tsx --format esm,cjs --dts --external react
 
 CLI Building entry: src/index.tsx
@@ -8,11 +8,11 @@
 CLI Target: es6
 ESM Build start
 CJS Build start
-CJS dist/index.js 22.22 KB
-CJS ⚡️ Build success in 36ms
-ESM dist/index.mjs 19.70 KB
-ESM ⚡️ Build success in 36ms
+ESM dist/index.mjs 19.57 KB
+ESM ⚡️ Build success in 40ms
+CJS dist/index.js 22.09 KB
+CJS ⚡️ Build success in 40ms
 DTS Build start
-DTS ⚡️ Build success in 4361ms
-DTS dist/index.d.mts 103.71 KB
-DTS dist/index.d.ts  103.71 KB
+DTS ⚡️ Build success in 4458ms
+DTS dist/index.d.mts 103.69 KB
+DTS dist/index.d.ts  103.69 KB

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @dafaz-ui/react
 
+## 4.0.5
+
+### Patch Changes
+
+- change default size select field
+
+## 4.0.4
+
+### Patch Changes
+
+- Change feat radio and select field
+
 ## 4.0.3
 
 ### Patch Changes

package/dist/index.d.mts

@@ -1097,7 +1097,6 @@ interface Item$1 {
     id: string;
     label: string;
     value: string;
-    disabled: boolean;
 }
 interface RadioGroupProps extends RadioUIProps {
     items: Item$1[];

package/dist/index.d.ts

@@ -1097,7 +1097,6 @@ interface Item$1 {
     id: string;
     label: string;
     value: string;
-    disabled: boolean;
 }
 interface RadioGroupProps extends RadioUIProps {
     items: Item$1[];

package/dist/index.js

@@ -331,17 +331,18 @@ var CheckBoxUI = styled(Checkbox.Root, {
   display: "flex",
   justifyContent: "center",
   alignItems: "center",
-  borderBottom: "2px solid $dafaz600",
-  transition: "border 0.1s linear",
+  transition: "border 0.2s linear",
+  border: "2px solid $gray400",
   '&:focus,&[data-state="checked"]': {
     backgroundColor: "$dafaz600",
     borderColor: "$dafaz600"
   },
   '&[data-state="unchecked"]': {
-    backgroundColor: "$gray800"
+    backgroundColor: "$gray400",
+    opacity: 0.9
   },
   "&:hover": {
-    borderColor: "$dafaz600"
+    border: "2px solid $dafaz600"
   },
   "&:disabled": {
     opacity: 0.5,
@@ -350,24 +351,21 @@ var CheckBoxUI = styled(Checkbox.Root, {
   variants: {
     size: {
       lg: {
-        width: "$7",
-        height: "$7",
-        borderBottom: "2px solid $dafaz600"
+        width: "$6",
+        height: "$6"
       },
       md: {
         width: "$5",
-        height: "$5",
-        borderBottom: "1px solid $dafaz600"
+        height: "$5"
       },
       sm: {
         width: "$5",
-        height: "$5",
-        borderBottom: "0.5px solid $dafaz600"
+        height: "$5"
       }
     }
   },
   defaultVariants: {
-    size: "md"
+    size: "lg"
   }
 });
 var slideIn = keyframes({
@@ -403,7 +401,7 @@ var CheckBoxIndicator = styled(Checkbox.Indicator, {
     }
   },
   defaultVariants: {
-    size: "md"
+    size: "lg"
   }
 });
 var Label = styled("label", {
@@ -413,7 +411,7 @@ var Label = styled("label", {
   fontWeight: "$regular",
   cursor: "pointer",
   display: "flex",
-  gap: "$2",
+  gap: "$3",
   alignItems: "center",
   variants: {
     disabled: {
@@ -436,7 +434,7 @@ var Label = styled("label", {
   },
   defaultVariants: {
     disabled: false,
-    size: "md"
+    size: "lg"
   }
 });
 
@@ -517,7 +515,7 @@ var RadioUI = styled(RadioGroup.Root, {
     }
   },
   defaultVariants: {
-    size: "md"
+    size: "lg"
   }
 });
 
@@ -529,7 +527,7 @@ var RadioGroup2 = __toESM(require("@radix-ui/react-radio-group"));
 var RadioItemContainer = styled("div", {
   display: "flex",
   alignItems: "center",
-  gap: "$2"
+  gap: "$3"
 });
 var RadioItemUI = styled(RadioGroup2.Item, {
   all: "unset",
@@ -541,8 +539,7 @@ var RadioItemUI = styled(RadioGroup2.Item, {
   display: "flex",
   justifyContent: "center",
   alignItems: "center",
-  borderBottom: "2px solid $dafaz600",
-  transition: "border 0.1s linear",
+  transition: "border 0.2s linear",
   "&:disabled": {
     cursor: "not-allowed"
   },
@@ -551,7 +548,8 @@ var RadioItemUI = styled(RadioGroup2.Item, {
     borderColor: "$dafaz600"
   },
   '&[data-state="unchecked"]': {
-    backgroundColor: "$gray800"
+    backgroundColor: "$gray400",
+    border: "2px solid $gray400"
   },
   "&:hover": {
     borderColor: "$dafaz600"
@@ -559,8 +557,8 @@ var RadioItemUI = styled(RadioGroup2.Item, {
   variants: {
     size: {
       lg: {
-        width: "$7",
-        height: "$7",
+        width: "$6",
+        height: "$6",
         borderBottom: "2px solid $dafaz600"
       },
       md: {
@@ -576,7 +574,7 @@ var RadioItemUI = styled(RadioGroup2.Item, {
     }
   },
   defaultVariants: {
-    size: "md"
+    size: "lg"
   }
 });
 var slideIn2 = keyframes({
@@ -612,7 +610,7 @@ var RadioIndicator = styled(RadioGroup2.Indicator, {
     }
   },
   defaultVariants: {
-    size: "md"
+    size: "lg"
   }
 });
 var Label2 = styled("label", {
@@ -642,7 +640,7 @@ var Label2 = styled("label", {
   },
   defaultVariants: {
     disabled: false,
-    size: "md"
+    size: "lg"
   }
 });
 
@@ -733,7 +731,7 @@ var SelectUI = styled("select", {
     }
   },
   defaultVariants: {
-    size: "md"
+    size: "lg"
   }
 });
 var OptionUI = styled("option", {
@@ -755,7 +753,7 @@ var OptionUI = styled("option", {
     }
   },
   defaultVariants: {
-    size: "md"
+    size: "lg"
   }
 });
 

package/dist/index.mjs

@@ -282,17 +282,18 @@ var CheckBoxUI = styled(Checkbox.Root, {
   display: "flex",
   justifyContent: "center",
   alignItems: "center",
-  borderBottom: "2px solid $dafaz600",
-  transition: "border 0.1s linear",
+  transition: "border 0.2s linear",
+  border: "2px solid $gray400",
   '&:focus,&[data-state="checked"]': {
     backgroundColor: "$dafaz600",
     borderColor: "$dafaz600"
   },
   '&[data-state="unchecked"]': {
-    backgroundColor: "$gray800"
+    backgroundColor: "$gray400",
+    opacity: 0.9
   },
   "&:hover": {
-    borderColor: "$dafaz600"
+    border: "2px solid $dafaz600"
   },
   "&:disabled": {
     opacity: 0.5,
@@ -301,24 +302,21 @@ var CheckBoxUI = styled(Checkbox.Root, {
   variants: {
     size: {
       lg: {
-        width: "$7",
-        height: "$7",
-        borderBottom: "2px solid $dafaz600"
+        width: "$6",
+        height: "$6"
       },
       md: {
         width: "$5",
-        height: "$5",
-        borderBottom: "1px solid $dafaz600"
+        height: "$5"
       },
       sm: {
         width: "$5",
-        height: "$5",
-        borderBottom: "0.5px solid $dafaz600"
+        height: "$5"
       }
     }
   },
   defaultVariants: {
-    size: "md"
+    size: "lg"
   }
 });
 var slideIn = keyframes({
@@ -354,7 +352,7 @@ var CheckBoxIndicator = styled(Checkbox.Indicator, {
     }
   },
   defaultVariants: {
-    size: "md"
+    size: "lg"
   }
 });
 var Label = styled("label", {
@@ -364,7 +362,7 @@ var Label = styled("label", {
   fontWeight: "$regular",
   cursor: "pointer",
   display: "flex",
-  gap: "$2",
+  gap: "$3",
   alignItems: "center",
   variants: {
     disabled: {
@@ -387,7 +385,7 @@ var Label = styled("label", {
   },
   defaultVariants: {
     disabled: false,
-    size: "md"
+    size: "lg"
   }
 });
 
@@ -468,7 +466,7 @@ var RadioUI = styled(RadioGroup.Root, {
     }
   },
   defaultVariants: {
-    size: "md"
+    size: "lg"
   }
 });
 
@@ -480,7 +478,7 @@ import * as RadioGroup2 from "@radix-ui/react-radio-group";
 var RadioItemContainer = styled("div", {
   display: "flex",
   alignItems: "center",
-  gap: "$2"
+  gap: "$3"
 });
 var RadioItemUI = styled(RadioGroup2.Item, {
   all: "unset",
@@ -492,8 +490,7 @@ var RadioItemUI = styled(RadioGroup2.Item, {
   display: "flex",
   justifyContent: "center",
   alignItems: "center",
-  borderBottom: "2px solid $dafaz600",
-  transition: "border 0.1s linear",
+  transition: "border 0.2s linear",
   "&:disabled": {
     cursor: "not-allowed"
   },
@@ -502,7 +499,8 @@ var RadioItemUI = styled(RadioGroup2.Item, {
     borderColor: "$dafaz600"
   },
   '&[data-state="unchecked"]': {
-    backgroundColor: "$gray800"
+    backgroundColor: "$gray400",
+    border: "2px solid $gray400"
   },
   "&:hover": {
     borderColor: "$dafaz600"
@@ -510,8 +508,8 @@ var RadioItemUI = styled(RadioGroup2.Item, {
   variants: {
     size: {
       lg: {
-        width: "$7",
-        height: "$7",
+        width: "$6",
+        height: "$6",
         borderBottom: "2px solid $dafaz600"
       },
       md: {
@@ -527,7 +525,7 @@ var RadioItemUI = styled(RadioGroup2.Item, {
     }
   },
   defaultVariants: {
-    size: "md"
+    size: "lg"
   }
 });
 var slideIn2 = keyframes({
@@ -563,7 +561,7 @@ var RadioIndicator = styled(RadioGroup2.Indicator, {
     }
   },
   defaultVariants: {
-    size: "md"
+    size: "lg"
   }
 });
 var Label2 = styled("label", {
@@ -593,7 +591,7 @@ var Label2 = styled("label", {
   },
   defaultVariants: {
     disabled: false,
-    size: "md"
+    size: "lg"
   }
 });
 
@@ -684,7 +682,7 @@ var SelectUI = styled("select", {
     }
   },
   defaultVariants: {
-    size: "md"
+    size: "lg"
   }
 });
 var OptionUI = styled("option", {
@@ -706,7 +704,7 @@ var OptionUI = styled("option", {
     }
   },
   defaultVariants: {
-    size: "md"
+    size: "lg"
   }
 });
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dafaz-ui/react",
-  "version": "4.0.3",
+  "version": "4.0.5",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",

package/src/components/CheckBox/styles.ts

@@ -12,8 +12,8 @@ export const CheckBoxUI = styled(Checkbox.Root, {
   display: 'flex',
   justifyContent: 'center',
   alignItems: 'center',
-  borderBottom: '2px solid $dafaz600',
-  transition: 'border 0.1s linear',
+  transition: 'border 0.2s linear',
+  border: '2px solid $gray400',
 
   '&:focus,&[data-state="checked"]': {
     backgroundColor: '$dafaz600',
@@ -21,11 +21,12 @@ export const CheckBoxUI = styled(Checkbox.Root, {
   },
 
   '&[data-state="unchecked"]': {
-    backgroundColor: '$gray800',
+    backgroundColor: '$gray400',
+    opacity: 0.9,
   },
 
   '&:hover': {
-    borderColor: '$dafaz600',
+    border: '2px solid $dafaz600',
   },
 
   '&:disabled': {
@@ -36,24 +37,21 @@ export const CheckBoxUI = styled(Checkbox.Root, {
   variants: {
     size: {
       lg: {
-        width: '$7',
-        height: '$7',
-        borderBottom: '2px solid $dafaz600',
+        width: '$6',
+        height: '$6',
       },
       md: {
         width: '$5',
         height: '$5',
-        borderBottom: '1px solid $dafaz600',
       },
       sm: {
         width: '$5',
         height: '$5',
-        borderBottom: '0.5px solid $dafaz600',
       },
     },
   },
   defaultVariants: {
-    size: 'md',
+    size: 'lg',
   },
 })
 
@@ -95,7 +93,7 @@ export const CheckBoxIndicator = styled(Checkbox.Indicator, {
     },
   },
   defaultVariants: {
-    size: 'md',
+    size: 'lg',
   },
 })
 
@@ -107,7 +105,7 @@ export const Label = styled('label', {
   cursor: 'pointer',
 
   display: 'flex',
-  gap: '$2',
+  gap: '$3',
   alignItems: 'center',
 
   variants: {
@@ -131,7 +129,7 @@ export const Label = styled('label', {
   },
   defaultVariants: {
     disabled: false,
-    size: 'md',
+    size: 'lg',
   },
 })
 

package/src/components/Radio/RadioItem/styles.ts

@@ -5,7 +5,7 @@ import * as RadioGroup from '@radix-ui/react-radio-group'
 export const RadioItemContainer = styled('div', {
   display: 'flex',
   alignItems: 'center',
-  gap: '$2',
+  gap: '$3',
 })
 
 export const RadioItemUI = styled(RadioGroup.Item, {
@@ -18,8 +18,7 @@ export const RadioItemUI = styled(RadioGroup.Item, {
   display: 'flex',
   justifyContent: 'center',
   alignItems: 'center',
-  borderBottom: '2px solid $dafaz600',
-  transition: 'border 0.1s linear',
+  transition: 'border 0.2s linear',
 
   '&:disabled': {
     cursor: 'not-allowed',
@@ -31,7 +30,8 @@ export const RadioItemUI = styled(RadioGroup.Item, {
   },
 
   '&[data-state="unchecked"]': {
-    backgroundColor: '$gray800',
+    backgroundColor: '$gray400',
+    border: '2px solid $gray400',
   },
 
   '&:hover': {
@@ -41,8 +41,8 @@ export const RadioItemUI = styled(RadioGroup.Item, {
   variants: {
     size: {
       lg: {
-        width: '$7',
-        height: '$7',
+        width: '$6',
+        height: '$6',
         borderBottom: '2px solid $dafaz600',
       },
       md: {
@@ -58,7 +58,7 @@ export const RadioItemUI = styled(RadioGroup.Item, {
     },
   },
   defaultVariants: {
-    size: 'md',
+    size: 'lg',
   },
 })
 
@@ -100,7 +100,7 @@ export const RadioIndicator = styled(RadioGroup.Indicator, {
     },
   },
   defaultVariants: {
-    size: 'md',
+    size: 'lg',
   },
 })
 
@@ -132,7 +132,7 @@ export const Label = styled('label', {
   },
   defaultVariants: {
     disabled: false,
-    size: 'md',
+    size: 'lg',
   },
 })
 

package/src/components/Radio/index.tsx

@@ -5,7 +5,6 @@ interface Item {
   id: string
   label: string
   value: string
-  disabled: boolean
 }
 
 interface RadioGroupProps extends RadioUIProps {

package/src/components/Radio/styles.ts

@@ -21,7 +21,7 @@ export const RadioUI = styled(RadioGroup.Root, {
     },
   },
   defaultVariants: {
-    size: 'md',
+    size: 'lg',
   },
 })
 

package/src/components/Select/styles.ts

@@ -47,7 +47,7 @@ export const SelectUI = styled('select', {
   },
 
   defaultVariants: {
-    size: 'md',
+    size: 'lg',
   },
 })
 
@@ -76,7 +76,7 @@ export const OptionUI = styled('option', {
     },
   },
   defaultVariants: {
-    size: 'md',
+    size: 'lg',
   },
 })