@devup-ui/components 0.1.15 → 0.1.16

package/dist/components/Radio/Radio.stories.d.ts

@@ -7,20 +7,6 @@ export default _default;
 export declare const Default: {
     args: {
         checked: undefined;
-        colors: {
-            primary: string;
-            border: string;
-            text: string;
-            bg: string;
-            hoverBg: string;
-            hoverBorder: string;
-            hoverColor: string;
-            checkedBg: string;
-            checkedBorder: string;
-            checkedColor: string;
-            disabledBg: string;
-            disabledColor: string;
-        };
         name: string;
         children: string;
         variant: string;

package/dist/components/Radio/Radio.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Radio/Radio.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,GAAG,CAAA;;;;;AAEzB,wBAGC;AAED,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;CAqBnB,CAAA"}
+{"version":3,"file":"Radio.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Radio/Radio.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,GAAG,CAAA;;;;;AAEzB,wBAGC;AAED,eAAO,MAAM,OAAO;;;;;;;CAOnB,CAAA"}

package/dist/components/Radio/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),r=require("@devup-ui/react");function x({className:t,disabled:d,children:h,variant:g="default",checked:v,classNames:b,styles:u,style:n,firstButton:B,lastButton:k,colors:e,...p}){const a=g==="button";return i.jsxs(r.Box,{alignItems:a?void 0:"center","aria-disabled":d,as:"label",cursor:a?void 0:"pointer",display:a?void 0:"inline-flex",gap:a?void 0:2,selectors:{"&[aria-disabled=true]":{cursor:"default"}},children:[a?i.jsx(r.Input,{checked:v,className:t,"data-radio-input":!0,disabled:d,display:"none",opacity:0,styleOrder:1,type:"radio",...p}):i.jsx(r.Input,{_focus:{outline:"1px sold var(--border, var(--primary))"},appearance:"none",bg:"light-dark(#fff, #2E2E2E)",border:"1px solid",borderColor:"$border",borderRadius:"100%",checked:v,className:t,"data-radio-input":!0,disabled:d,height:"18px",m:0,selectors:{"&:checked:not(:disabled)":{bg:"var(--checkedBg, var(--primary, light-dark(#fff, #2E2E2E)))",border:"3px solid",borderColor:"var(--checkedBg, light-dark(#fff, #2E2E2E))",boxShadow:"0 0 0 1px var(--checkedBorder, var(--primary))"},"&:hover:not(:disabled,:checked)":{border:"1px solid var(--hoverBorder, var(--primary))",bg:"var(--hoverBg, light-dark(color-mix(in srgb, var(--primary) 10%, white 90%), color-mix(in srgb, var(--primary) 10%, black 90%)))"},"&:is(:disabled, [aria-disabled=true])":{bgColor:"var(--disabledBg, light-dark(#F0F0F3, #47474A))"}},styleOrder:1,styleVars:{primary:e==null?void 0:e.primary,border:e==null?void 0:e.border,text:e==null?void 0:e.text,bg:e==null?void 0:e.bg,hoverBg:e==null?void 0:e.hoverBg,hoverBorder:e==null?void 0:e.hoverBorder,hoverColor:e==null?void 0:e.hoverColor,checkedBg:e==null?void 0:e.checkedBg,checkedBorder:e==null?void 0:e.checkedBorder,checkedColor:e==null?void 0:e.checkedColor,disabledBg:e==null?void 0:e.disabledBg,disabledColor:e==null?void 0:e.disabledColor},transition:".25s",type:"radio",width:"18px",...p}),g==="button"?i.jsx(r.Box,{_disabled:{cursor:"not-allowed"},"aria-disabled":d,bg:"var(--bg, light-dark(#fff, #2E2E2E))",border:"1px solid",borderColor:"$border",borderRadius:B?"6px 0 0 6px":k?"0 6px 6px 0":void 0,className:t,color:"var(--text, light-dark(#000, #fff))",cursor:"pointer","data-radio-button":!0,display:"flex",px:8,py:4,selectors:{"[data-radio-input]:checked + &:not([aria-disabled=true])":{fontWeight:600,bg:"var(--checkedBg, light-dark(color-mix(in srgb, var(--primary) 10%, white 80%), color-mix(in srgb, var(--primary) 10%, black 80%)))",borderColor:"var(--checkedBorder, var(--primary))",color:"var(--checkedColor, var(--primary))"},"&:hover:not([aria-disabled=true])":{bg:"var(--hoverBg, light-dark(color-mix(in srgb, var(--primary) 10%, white 90%), color-mix(in srgb, var(--primary) 10%, black 90%)))",borderColor:"var(--hoverBorder, var(--primary))"},"[data-radio-input]:disabled + &":{bg:"var(--disabledBg, light-dark(#F0F0F3, #47474A))",color:"var(--disabledColor, light-dark(#D6D7DE, #373737))"}},style:n,styleOrder:1,styleVars:{primary:e==null?void 0:e.primary,border:e==null?void 0:e.border,text:e==null?void 0:e.text,bg:e==null?void 0:e.bg,hoverBg:e==null?void 0:e.hoverBg,hoverBorder:e==null?void 0:e.hoverBorder,hoverColor:e==null?void 0:e.hoverColor,checkedBg:e==null?void 0:e.checkedBg,checkedBorder:e==null?void 0:e.checkedBorder,checkedColor:e==null?void 0:e.checkedColor,disabledBg:e==null?void 0:e.disabledBg,disabledColor:e==null?void 0:e.disabledColor},transition:"background-color 0.25s, border-color 0.25s",w:"fit-content",children:h}):i.jsx(r.Text,{"aria-disabled":d,className:b==null?void 0:b.label,color:"var(--text, light-dark(#000, #fff))",selectors:{"&[aria-disabled=true]":{color:"var(--disabledColor, light-dark(#D6D7DE, #373737))"}},style:n,styleOrder:1,styleVars:{primary:e==null?void 0:e.primary,border:e==null?void 0:e.border,text:e==null?void 0:e.text,bg:e==null?void 0:e.bg,hoverBg:e==null?void 0:e.hoverBg,hoverBorder:e==null?void 0:e.hoverBorder,hoverColor:e==null?void 0:e.hoverColor,checkedBg:e==null?void 0:e.checkedBg,checkedBorder:e==null?void 0:e.checkedBorder,checkedColor:e==null?void 0:e.checkedColor,disabledBg:e==null?void 0:e.disabledBg,disabledColor:e==null?void 0:e.disabledColor},children:h})]})}exports.Radio=x;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),r=require("@devup-ui/react");function x({className:t,disabled:d,children:h,variant:g="default",checked:v,classNames:b,styles:u,style:n,firstButton:B,lastButton:k,colors:e,...p}){const a=g==="button";return i.jsxs(r.Box,{alignItems:a?void 0:"center","aria-disabled":d,as:"label",cursor:a?void 0:"pointer",display:a?void 0:"inline-flex",gap:a?void 0:2,selectors:{"&[aria-disabled=true]":{cursor:"default"}},children:[a?i.jsx(r.Input,{checked:v,className:t,"data-radio-input":!0,disabled:d,display:"none",opacity:0,styleOrder:1,type:"radio",...p}):i.jsx(r.Input,{_focus:{outline:"1px sold var(--border, var(--primary))"},appearance:"none",bg:"light-dark(#fff, #2E2E2E)",border:"1px solid",borderColor:"$border",borderRadius:"100%",checked:v,className:t,"data-radio-input":!0,disabled:d,height:"18px",m:0,selectors:{"&:checked:not(:disabled)":{bg:"var(--checkedBg, var(--primary, light-dark(#fff, #2E2E2E)))",border:"3px solid",borderColor:"var(--checkedBg, light-dark(#fff, #2E2E2E))",boxShadow:"0 0 0 1px var(--checkedBorder, var(--primary))"},"&:hover:not(:disabled,:checked)":{border:"1px solid var(--hoverBorder, var(--primary))",bg:"var(--hoverBg, light-dark(color-mix(in srgb, var(--primary) 10%, white 90%), color-mix(in srgb, var(--primary) 10%, black 90%)))"},"&:is(:disabled, [aria-disabled=true])":{bgColor:"var(--disabledBg, light-dark(#F0F0F3, #47474A))"}},styleOrder:1,styleVars:{primary:e==null?void 0:e.primary,border:e==null?void 0:e.border,text:e==null?void 0:e.text,bg:e==null?void 0:e.bg,hoverBg:e==null?void 0:e.hoverBg,hoverBorder:e==null?void 0:e.hoverBorder,hoverColor:e==null?void 0:e.hoverColor,checkedBg:e==null?void 0:e.checkedBg,checkedBorder:e==null?void 0:e.checkedBorder,checkedColor:e==null?void 0:e.checkedColor,disabledBg:e==null?void 0:e.disabledBg,disabledColor:e==null?void 0:e.disabledColor},transition:".25s",type:"radio",width:"18px",...p}),g==="button"?i.jsx(r.Box,{_disabled:{cursor:"not-allowed"},"aria-disabled":d,bg:"var(--bg, light-dark(#fff, #2E2E2E))",border:"1px solid",borderColor:"$border",borderRadius:B?"8px 0 0 8px":k?"0 8px 8px 0":void 0,className:t,color:"var(--text, light-dark(#000, #fff))",cursor:"pointer","data-radio-button":!0,display:"flex",px:8,py:3,selectors:{"[data-radio-input]:checked + &:not([aria-disabled=true])":{fontWeight:600,bg:"var(--checkedBg, light-dark(color-mix(in srgb, var(--primary) 10%, white 80%), color-mix(in srgb, var(--primary) 10%, black 80%)))",borderColor:"var(--checkedBorder, var(--primary))",color:"var(--checkedColor, var(--primary))"},"&:hover:not([aria-disabled=true])":{bg:"var(--hoverBg, light-dark(color-mix(in srgb, var(--primary) 10%, white 90%), color-mix(in srgb, var(--primary) 10%, black 90%)))",borderColor:"var(--hoverBorder, var(--primary))"},"[data-radio-input]:disabled + &":{bg:"var(--disabledBg, light-dark(#F0F0F3, #47474A))",color:"var(--disabledColor, light-dark(#D6D7DE, #373737))"}},style:n,styleOrder:1,styleVars:{primary:e==null?void 0:e.primary,border:e==null?void 0:e.border,text:e==null?void 0:e.text,bg:e==null?void 0:e.bg,hoverBg:e==null?void 0:e.hoverBg,hoverBorder:e==null?void 0:e.hoverBorder,hoverColor:e==null?void 0:e.hoverColor,checkedBg:e==null?void 0:e.checkedBg,checkedBorder:e==null?void 0:e.checkedBorder,checkedColor:e==null?void 0:e.checkedColor,disabledBg:e==null?void 0:e.disabledBg,disabledColor:e==null?void 0:e.disabledColor},transition:"background-color 0.25s, border-color 0.25s",w:"fit-content",children:h}):i.jsx(r.Text,{"aria-disabled":d,className:b==null?void 0:b.label,color:"var(--text, light-dark(#000, #fff))",selectors:{"&[aria-disabled=true]":{color:"var(--disabledColor, light-dark(#D6D7DE, #373737))"}},style:n,styleOrder:1,styleVars:{primary:e==null?void 0:e.primary,border:e==null?void 0:e.border,text:e==null?void 0:e.text,bg:e==null?void 0:e.bg,hoverBg:e==null?void 0:e.hoverBg,hoverBorder:e==null?void 0:e.hoverBorder,hoverColor:e==null?void 0:e.hoverColor,checkedBg:e==null?void 0:e.checkedBg,checkedBorder:e==null?void 0:e.checkedBorder,checkedColor:e==null?void 0:e.checkedColor,disabledBg:e==null?void 0:e.disabledBg,disabledColor:e==null?void 0:e.disabledColor},children:h})]})}exports.Radio=x;

package/dist/components/Radio/index.js

@@ -109,14 +109,14 @@ function E({
             bg: "var(--bg, light-dark(#fff, #2E2E2E))",
             border: "1px solid",
             borderColor: "$border",
-            borderRadius: B ? "6px 0 0 6px" : x ? "0 6px 6px 0" : void 0,
+            borderRadius: B ? "8px 0 0 8px" : x ? "0 8px 8px 0" : void 0,
             className: r,
             color: "var(--text, light-dark(#000, #fff))",
             cursor: "pointer",
             "data-radio-button": !0,
             display: "flex",
             px: 8,
-            py: 4,
+            py: 3,
             selectors: {
               // checked
               "[data-radio-input]:checked + &:not([aria-disabled=true])": {

package/dist/components/RadioGroup/RadioGroup.stories.d.ts

@@ -8,20 +8,6 @@ export declare const Default: {
     args: {
         disabled: boolean;
         name: string;
-        colors: {
-            primary: string;
-            border: string;
-            text: string;
-            bg: string;
-            hoverBg: string;
-            hoverBorder: string;
-            hoverColor: string;
-            checkedBg: string;
-            checkedBorder: string;
-            checkedColor: string;
-            disabledBg: string;
-            disabledColor: string;
-        };
         options: {
             value: string;
             label: string;

package/dist/components/RadioGroup/RadioGroup.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.stories.d.ts","sourceRoot":"","sources":["../../../src/components/RadioGroup/RadioGroup.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;;;;;AAEpC,wBAGC;AAED,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;CAmCnB,CAAA"}
+{"version":3,"file":"RadioGroup.stories.d.ts","sourceRoot":"","sources":["../../../src/components/RadioGroup/RadioGroup.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;;;;;AAEpC,wBAGC;AAED,eAAO,MAAM,OAAO;;;;;;;;;;;CAqBnB,CAAA"}

package/dist/components/Toggle/Toggle.stories.d.ts

@@ -0,0 +1,7 @@
+import { Meta, StoryObj } from '@storybook/react-vite';
+import { Toggle } from './index';
+type Story = StoryObj<typeof meta>;
+declare const meta: Meta<typeof Toggle>;
+export declare const Default: Story;
+export default meta;
+//# sourceMappingURL=Toggle.stories.d.ts.map

package/dist/components/Toggle/Toggle.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Toggle/Toggle.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAEtD,OAAO,EAAE,MAAM,EAAE,MAAM,SAAS,CAAA;AAEhC,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,MAAM,CAU7B,CAAA;AAED,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAA;AAED,eAAe,IAAI,CAAA"}

package/dist/components/Toggle/index.d.ts

@@ -0,0 +1,27 @@
+interface ToggleProps {
+    defaultValue?: boolean | null;
+    value?: boolean | null;
+    onChange?: (value: boolean) => void;
+    disabled?: boolean;
+    variant?: 'default' | 'switch';
+    className?: string;
+    style?: React.CSSProperties;
+    classNames?: {
+        toggle?: string;
+    };
+    styles?: {
+        toggle?: React.CSSProperties;
+    };
+    colors?: {
+        primary?: string;
+        bg?: string;
+        hoverBg?: string;
+        primaryHoverBg?: string;
+        disabledBg?: string;
+        switchHoverOutline?: string;
+        switchShadow?: string;
+    };
+}
+export declare function Toggle({ defaultValue, value, onChange, disabled, className, style, variant, colors, classNames, styles, }: ToggleProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Toggle/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Toggle/index.tsx"],"names":[],"mappings":"AAIA,UAAU,WAAW;IACnB,YAAY,CAAC,EAAE,OAAO,GAAG,IAAI,CAAA;IAC7B,KAAK,CAAC,EAAE,OAAO,GAAG,IAAI,CAAA;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAA;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAA;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IAC3B,UAAU,CAAC,EAAE;QACX,MAAM,CAAC,EAAE,MAAM,CAAA;KAChB,CAAA;IACD,MAAM,CAAC,EAAE;QACP,MAAM,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;KAC7B,CAAA;IACD,MAAM,CAAC,EAAE;QACP,OAAO,CAAC,EAAE,MAAM,CAAA;QAChB,EAAE,CAAC,EAAE,MAAM,CAAA;QACX,OAAO,CAAC,EAAE,MAAM,CAAA;QAChB,cAAc,CAAC,EAAE,MAAM,CAAA;QACvB,UAAU,CAAC,EAAE,MAAM,CAAA;QACnB,kBAAkB,CAAC,EAAE,MAAM,CAAA;QAC3B,YAAY,CAAC,EAAE,MAAM,CAAA;KACtB,CAAA;CACF;AAED,wBAAgB,MAAM,CAAC,EACrB,YAAmB,EACnB,KAAY,EACZ,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,KAAK,EACL,OAAmB,EACnB,MAAM,EACN,UAAU,EACV,MAAM,GACP,EAAE,WAAW,2CAwFb"}

package/package.json

@@ -16,7 +16,7 @@
     "css-in-js-framework",
     "react"
   ],
-  "version": "0.1.15",
+  "version": "0.1.16",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -52,7 +52,7 @@
     "vite": "^7.1.5",
     "vite-plugin-dts": "^4.5.4",
     "vitest": "^3.2.4",
-    "@devup-ui/vite-plugin": "1.0.35"
+    "@devup-ui/vite-plugin": "1.0.36"
   },
   "peerDependencies": {
     "csstype": "*",