@devup-ui/components 0.1.43 → 0.1.45

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (34) hide show
  1. package/dist/_virtual/_rolldown/runtime.cjs +1 -0
  2. package/dist/components/Button/IconSpinner.cjs +1 -1
  3. package/dist/components/Button/IconSpinner.js +72 -84
  4. package/dist/components/Button/index.cjs +1 -1
  5. package/dist/components/Button/index.js +220 -217
  6. package/dist/components/Checkbox/CheckIcon.cjs +1 -1
  7. package/dist/components/Checkbox/CheckIcon.js +17 -23
  8. package/dist/components/Checkbox/index.cjs +1 -2
  9. package/dist/components/Checkbox/index.js +87 -127
  10. package/dist/components/Input/index.cjs +1 -2
  11. package/dist/components/Input/index.js +130 -181
  12. package/dist/components/Radio/index.cjs +1 -1
  13. package/dist/components/Radio/index.js +143 -194
  14. package/dist/components/RadioGroup/index.cjs +1 -2
  15. package/dist/components/RadioGroup/index.js +43 -59
  16. package/dist/components/Select/IconCheck.cjs +1 -1
  17. package/dist/components/Select/IconCheck.js +18 -24
  18. package/dist/components/Select/index.cjs +1 -2
  19. package/dist/components/Select/index.js +215 -315
  20. package/dist/components/Stepper/IconMinus.cjs +1 -1
  21. package/dist/components/Stepper/IconMinus.js +18 -24
  22. package/dist/components/Stepper/IconPlus.cjs +1 -1
  23. package/dist/components/Stepper/IconPlus.js +17 -23
  24. package/dist/components/Stepper/index.cjs +1 -2
  25. package/dist/components/Stepper/index.js +98 -142
  26. package/dist/components/Textarea/index.cjs +1 -2
  27. package/dist/components/Textarea/index.js +85 -108
  28. package/dist/components/Toggle/index.cjs +1 -2
  29. package/dist/components/Toggle/index.js +71 -91
  30. package/dist/contexts/useSelect.cjs +1 -2
  31. package/dist/contexts/useSelect.js +9 -10
  32. package/dist/index.cjs +1 -1
  33. package/dist/index.js +11 -32
  34. package/package.json +13 -13
@@ -1,93 +1,73 @@
1
1
  "use client";
2
- import { jsxs as c, Fragment as f, jsx as i } from "react/jsx-runtime";
3
- import { Box as n, Input as w } from "@devup-ui/react";
4
- import { useState as B } from "react";
5
- function S({
6
- defaultValue: l = null,
7
- value: t = null,
8
- onChange: s,
9
- disabled: o,
10
- className: p,
11
- style: g,
12
- variant: d = "default",
13
- colors: r,
14
- classNames: u,
15
- styles: m
16
- }) {
17
- const [b, v] = B(
18
- t ?? l ?? !1
19
- ), a = t ?? b;
20
- function x(h) {
21
- s?.(!h), v((y) => !y);
22
- }
23
- const e = d === "default";
24
- return /* @__PURE__ */ c(f, { children: [
25
- /* @__PURE__ */ i(
26
- n,
27
- {
28
- "aria-disabled": o,
29
- bg: a ? "var(--primary)" : "var(--bg, light-dark(#E4E4E4, #383838))",
30
- borderRadius: "500px",
31
- boxSizing: "border-box",
32
- className: p,
33
- cursor: "pointer",
34
- h: e ? "28px" : "8px",
35
- justifyContent: a && "flex-end",
36
- onClick: () => !o && x(a),
37
- p: e && 1,
38
- position: "relative",
39
- role: "group",
40
- selectors: {
41
- "&[aria-disabled=true]": {
42
- cursor: "not-allowed",
43
- bg: "var(--disabledBg, light-dark(#D6D7DE, #373737))"
44
- },
45
- "&:hover:not([aria-disabled=true]):not(:disabled)": {
46
- bg: a ? "var(--primaryHoverBg, light-dark(color-mix(in srgb, var(--primary) 100%, #000 15%), color-mix(in srgb, var(--primary) 100%, #FFF 15%)))" : "var(--hoverBg, light-dark(#C3C2C8, #696A6F))"
47
- }
48
- },
49
- style: g,
50
- styleVars: {
51
- primary: r?.primary,
52
- bg: r?.bg,
53
- primaryHoverBg: r?.primaryHoverBg,
54
- hoverBg: r?.hoverBg,
55
- disabledBg: r?.disabledBg
56
- },
57
- "test-id": "toggle-wrapper",
58
- transition: ".25s",
59
- w: e ? "50px" : "40px",
60
- children: /* @__PURE__ */ i(
61
- n,
62
- {
63
- _groupHover: !e && {
64
- outline: "4px solid",
65
- outlineColor: "var(--switchHoverOutline, light-dark(color-mix(in srgb, var(--primary) 20%, transparent), color-mix(in srgb, var(--primary) 50%, transparent)))"
66
- },
67
- backgroundColor: "#fff",
68
- borderRadius: "100%",
69
- boxSize: "20px",
70
- className: u?.toggle,
71
- filter: !e && "drop-shadow(0px 0px 3px var(--switchShadow, rgba(0, 0, 0, 0.10)));",
72
- outline: "4px",
73
- pos: "absolute",
74
- style: m?.toggle,
75
- styleVars: {
76
- primary: r?.primary,
77
- primaryHoverBg: r?.primaryHoverBg,
78
- switchShadow: r?.switchShadow,
79
- switchHoverOutline: r?.switchHoverOutline
80
- },
81
- top: !e && "-6px",
82
- transform: a && "translateX(calc(100% + 2px))",
83
- transition: ".25s"
84
- }
85
- )
86
- }
87
- ),
88
- /* @__PURE__ */ i(w, { type: "hidden", value: String(a) })
89
- ] });
2
+ "use client";
3
+ import { Box as e, Input as t } from "@devup-ui/react";
4
+ import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
5
+ import { useState as a } from "react";
6
+ //#region src/components/Toggle/index.tsx
7
+ function o({ defaultValue: o = null, value: s = null, onChange: c, disabled: l, className: u, style: d, variant: f = "default", colors: p, classNames: m, styles: h }) {
8
+ let [g, _] = a(s ?? o ?? !1), v = s ?? g;
9
+ function y(e) {
10
+ c?.(!e), _((e) => !e);
11
+ }
12
+ let b = f === "default";
13
+ return /* @__PURE__ */ i(n, { children: [/* @__PURE__ */ r(e, {
14
+ "aria-disabled": l,
15
+ bg: v ? "var(--primary)" : "var(--bg, light-dark(#E4E4E4, #383838))",
16
+ borderRadius: "500px",
17
+ boxSizing: "border-box",
18
+ className: u,
19
+ cursor: "pointer",
20
+ h: b ? "28px" : "8px",
21
+ justifyContent: v && "flex-end",
22
+ onClick: () => !l && y(v),
23
+ p: b && 1,
24
+ position: "relative",
25
+ role: "group",
26
+ selectors: {
27
+ "&[aria-disabled=true]": {
28
+ cursor: "not-allowed",
29
+ bg: "var(--disabledBg, light-dark(#D6D7DE, #373737))"
30
+ },
31
+ "&:hover:not([aria-disabled=true]):not(:disabled)": { bg: v ? "var(--primaryHoverBg, light-dark(color-mix(in srgb, var(--primary) 100%, #000 15%), color-mix(in srgb, var(--primary) 100%, #FFF 15%)))" : "var(--hoverBg, light-dark(#C3C2C8, #696A6F))" }
32
+ },
33
+ style: d,
34
+ styleVars: {
35
+ primary: p?.primary,
36
+ bg: p?.bg,
37
+ primaryHoverBg: p?.primaryHoverBg,
38
+ hoverBg: p?.hoverBg,
39
+ disabledBg: p?.disabledBg
40
+ },
41
+ "test-id": "toggle-wrapper",
42
+ transition: ".25s",
43
+ w: b ? "50px" : "40px",
44
+ children: /* @__PURE__ */ r(e, {
45
+ _groupHover: !b && {
46
+ outline: "4px solid",
47
+ outlineColor: "var(--switchHoverOutline, light-dark(color-mix(in srgb, var(--primary) 20%, transparent), color-mix(in srgb, var(--primary) 50%, transparent)))"
48
+ },
49
+ backgroundColor: "#fff",
50
+ borderRadius: "100%",
51
+ boxSize: "20px",
52
+ className: m?.toggle,
53
+ filter: !b && "drop-shadow(0px 0px 3px var(--switchShadow, rgba(0, 0, 0, 0.10)));",
54
+ outline: "4px",
55
+ pos: "absolute",
56
+ style: h?.toggle,
57
+ styleVars: {
58
+ primary: p?.primary,
59
+ primaryHoverBg: p?.primaryHoverBg,
60
+ switchShadow: p?.switchShadow,
61
+ switchHoverOutline: p?.switchHoverOutline
62
+ },
63
+ top: !b && "-6px",
64
+ transform: v && "translateX(calc(100% + 2px))",
65
+ transition: ".25s"
66
+ })
67
+ }), /* @__PURE__ */ r(t, {
68
+ type: "hidden",
69
+ value: String(v)
70
+ })] });
90
71
  }
91
- export {
92
- S as Toggle
93
- };
72
+ //#endregion
73
+ export { o as Toggle };
@@ -1,2 +1 @@
1
- "use client";
2
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),c=t.createContext(null),n=()=>{const e=t.useContext(c);if(!e)throw new Error("useSelect must be used within a Select");return e};exports.SelectContext=c;exports.useSelect=n;
1
+ "use client";"use client";require(`../_virtual/_rolldown/runtime.cjs`);let e=require(`react`);var t=(0,e.createContext)(null),n=()=>{let n=(0,e.useContext)(t);if(!n)throw Error(`useSelect must be used within a Select`);return n};exports.SelectContext=t,exports.useSelect=n;
@@ -1,12 +1,11 @@
1
1
  "use client";
2
- import { createContext as t, useContext as o } from "react";
3
- const n = t(null), c = () => {
4
- const e = o(n);
5
- if (!e)
6
- throw new Error("useSelect must be used within a Select");
7
- return e;
8
- };
9
- export {
10
- n as SelectContext,
11
- c as useSelect
2
+ "use client";
3
+ import { createContext as e, useContext as t } from "react";
4
+ //#region src/contexts/useSelect.ts
5
+ var n = e(null), r = () => {
6
+ let e = t(n);
7
+ if (!e) throw Error("useSelect must be used within a Select");
8
+ return e;
12
9
  };
10
+ //#endregion
11
+ export { n as SelectContext, r as useSelect };
package/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("./components/Button/index.cjs"),i=require("./components/Checkbox/index.cjs"),o=require("./components/Input/index.cjs"),c=require("./components/Radio/index.cjs"),p=require("./components/RadioGroup/index.cjs"),t=require("./components/Select/index.cjs"),e=require("./components/Stepper/index.cjs"),u=require("./components/Textarea/index.cjs"),S=require("./components/Toggle/index.cjs"),r=require("./contexts/useSelect.cjs");exports.Button=n.Button;exports.Checkbox=i.Checkbox;exports.Input=o.Input;exports.Radio=c.Radio;exports.RadioGroup=p.RadioGroup;exports.Select=t.Select;exports.SelectContainer=t.SelectContainer;exports.SelectDivider=t.SelectDivider;exports.SelectOption=t.SelectOption;exports.SelectTrigger=t.SelectTrigger;exports.Stepper=e.Stepper;exports.StepperContainer=e.StepperContainer;exports.StepperDecreaseButton=e.StepperDecreaseButton;exports.StepperIncreaseButton=e.StepperIncreaseButton;exports.StepperInput=e.StepperInput;exports.useStepper=e.useStepper;exports.Textarea=u.Textarea;exports.Toggle=S.Toggle;exports.SelectContext=r.SelectContext;exports.useSelect=r.useSelect;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./components/Button/index.cjs`),t=require(`./components/Checkbox/index.cjs`),n=require(`./components/Input/index.cjs`),r=require(`./components/Radio/index.cjs`),i=require(`./components/RadioGroup/index.cjs`),a=require(`./contexts/useSelect.cjs`),o=require(`./components/Select/index.cjs`),s=require(`./components/Stepper/index.cjs`),c=require(`./components/Textarea/index.cjs`),l=require(`./components/Toggle/index.cjs`);exports.Button=e.Button,exports.Checkbox=t.Checkbox,exports.Input=n.Input,exports.Radio=r.Radio,exports.RadioGroup=i.RadioGroup,exports.Select=o.Select,exports.SelectContainer=o.SelectContainer,exports.SelectContext=a.SelectContext,exports.SelectDivider=o.SelectDivider,exports.SelectOption=o.SelectOption,exports.SelectTrigger=o.SelectTrigger,exports.Stepper=s.Stepper,exports.StepperContainer=s.StepperContainer,exports.StepperDecreaseButton=s.StepperDecreaseButton,exports.StepperIncreaseButton=s.StepperIncreaseButton,exports.StepperInput=s.StepperInput,exports.Textarea=c.Textarea,exports.Toggle=l.Toggle,exports.useSelect=a.useSelect,exports.useStepper=s.useStepper;
package/dist/index.js CHANGED
@@ -1,32 +1,11 @@
1
- import { Button as r } from "./components/Button/index.js";
2
- import { Checkbox as p } from "./components/Checkbox/index.js";
3
- import { Input as S } from "./components/Input/index.js";
4
- import { Radio as c } from "./components/Radio/index.js";
5
- import { RadioGroup as m } from "./components/RadioGroup/index.js";
6
- import { Select as i, SelectContainer as l, SelectDivider as u, SelectOption as g, SelectTrigger as s } from "./components/Select/index.js";
7
- import { Stepper as d, StepperContainer as B, StepperDecreaseButton as I, StepperIncreaseButton as T, StepperInput as D, useStepper as R } from "./components/Stepper/index.js";
8
- import { Textarea as h } from "./components/Textarea/index.js";
9
- import { Toggle as v } from "./components/Toggle/index.js";
10
- import { SelectContext as O, useSelect as j } from "./contexts/useSelect.js";
11
- export {
12
- r as Button,
13
- p as Checkbox,
14
- S as Input,
15
- c as Radio,
16
- m as RadioGroup,
17
- i as Select,
18
- l as SelectContainer,
19
- O as SelectContext,
20
- u as SelectDivider,
21
- g as SelectOption,
22
- s as SelectTrigger,
23
- d as Stepper,
24
- B as StepperContainer,
25
- I as StepperDecreaseButton,
26
- T as StepperIncreaseButton,
27
- D as StepperInput,
28
- h as Textarea,
29
- v as Toggle,
30
- j as useSelect,
31
- R as useStepper
32
- };
1
+ import { Button as e } from "./components/Button/index.js";
2
+ import { Checkbox as t } from "./components/Checkbox/index.js";
3
+ import { Input as n } from "./components/Input/index.js";
4
+ import { Radio as r } from "./components/Radio/index.js";
5
+ import { RadioGroup as i } from "./components/RadioGroup/index.js";
6
+ import { SelectContext as a, useSelect as o } from "./contexts/useSelect.js";
7
+ import { Select as s, SelectContainer as c, SelectDivider as l, SelectOption as u, SelectTrigger as d } from "./components/Select/index.js";
8
+ import { Stepper as f, StepperContainer as p, StepperDecreaseButton as m, StepperIncreaseButton as h, StepperInput as g, useStepper as _ } from "./components/Stepper/index.js";
9
+ import { Textarea as v } from "./components/Textarea/index.js";
10
+ import { Toggle as y } from "./components/Toggle/index.js";
11
+ export { e as Button, t as Checkbox, n as Input, r as Radio, i as RadioGroup, s as Select, c as SelectContainer, a as SelectContext, l as SelectDivider, u as SelectOption, d as SelectTrigger, f as Stepper, p as StepperContainer, m as StepperDecreaseButton, h as StepperIncreaseButton, g as StepperInput, v as Textarea, y as Toggle, o as useSelect, _ as useStepper };
package/package.json CHANGED
@@ -16,7 +16,7 @@
16
16
  "css-in-js-framework",
17
17
  "react"
18
18
  ],
19
- "version": "0.1.43",
19
+ "version": "0.1.45",
20
20
  "type": "module",
21
21
  "scripts": {
22
22
  "lint": "eslint",
@@ -43,25 +43,25 @@
43
43
  ],
44
44
  "types": "./dist/index.d.ts",
45
45
  "dependencies": {
46
- "@devup-ui/react": "^1.0.34",
47
- "react": "^19.2.4",
46
+ "@devup-ui/react": "^1.0.36",
47
+ "react": "^19.2.6",
48
48
  "clsx": "^2.1"
49
49
  },
50
50
  "devDependencies": {
51
- "@devup-ui/vite-plugin": "^1.0.57",
52
- "@storybook/addon-docs": "^10.2",
53
- "@storybook/addon-onboarding": "^10.2",
54
- "@storybook/react-vite": "^10.2",
51
+ "@devup-ui/vite-plugin": "^1.0.59",
52
+ "@storybook/addon-docs": "^10.3",
53
+ "@storybook/addon-onboarding": "^10.3",
54
+ "@storybook/react-vite": "^10.3",
55
55
  "@types/react": "^19.2",
56
- "eslint-plugin-storybook": "^10.2",
56
+ "eslint-plugin-storybook": "^10.3",
57
57
  "rollup-plugin-preserve-directives": "^0.4",
58
- "storybook": "^10.2",
59
- "typescript": "^5.9",
60
- "vite": "^7.3",
61
- "vite-plugin-dts": "^4.5"
58
+ "storybook": "^10.3",
59
+ "typescript": "^6.0",
60
+ "vite": "^8.0",
61
+ "vite-plugin-dts": "^5.0"
62
62
  },
63
63
  "peerDependencies": {
64
- "@devup-ui/react": "^1.0.34",
64
+ "@devup-ui/react": "^1.0.36",
65
65
  "react": "*"
66
66
  }
67
67
  }