@devup-ui/components 0.1.3 → 0.1.5

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.
@@ -1,2 +1,2 @@
1
1
  "use client";
2
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),i=require("@devup-ui/react"),C=require("react");function S({defaultValue:a,value:k,onChange:n,typography:F,error:o=!1,errorMessage:b,allowClear:l=!0,icon:d,colors:t,disabled:u,className:B,classNames:e,ref:y,onClear:p,...D}){const[x,g]=C.useState(a||""),E=h=>{g(h.target.value),n==null||n(h)},j=()=>{g(""),p==null||p()},f=x&&!u&&l;return r.jsxs(i.Box,{display:"inline-block",pos:"relative",selectors:{"&,&>*":{boxSizing:"border-box"}},children:[d&&r.jsx(i.Center,{"aria-label":"icon",boxSize:"24px",className:e==null?void 0:e.icon,color:u?"var(--inputDisabledText, light-dark(#D6D7DE, #373737))":"var(--iconBold, light-dark(#8D8C9A, #666577))",left:"12px",pos:"absolute",styleOrder:1,top:"50%",transform:"translateY(-50%)",children:d}),r.jsx(i.Input,{ref:y,_disabled:{_placeholder:{color:"var(--inputDisabledText, light-dark(#D6D7DE, #373737))"},bg:"var(--inputDisabledBg, light-dark(#F0F0F3, #414244))",border:"1px solid var(--border, light-dark(#E4E4E4, #434343))",color:"var(--inputDisabledText, light-dark(#D6D7DE, #373737))"},_focus:{bg:"var(--primaryBg, light-dark(#F4F3FA, #F4F3FA0D))",border:"1px solid var(--primary, light-dark(#674DC7, #8163E1))",outline:"none"},_hover:{border:"1px solid var(--primary, light-dark(red, blue))"},_placeholder:{color:"var(--inputPlaceholder, light-dark(#A9A8AB, #CBCBCB))"},"aria-label":"input",bg:"var(--inputBg, light-dark(#FFFFFF, #2E2E2E))",borderColor:o?"var(--error, light-dark(#D52B2E, #FF5B5E))":"var(--border, light-dark(#E4E4E4, #434343))",borderRadius:"8px",borderStyle:"solid",borderWidth:"1px",className:`${B||""} ${(e==null?void 0:e.input)||""}`.trim(),disabled:u,onChange:E,pl:d?"36px":"12px",pr:l?"36px":"12px",py:"12px",styleOrder:1,styleVars:{primary:t==null?void 0:t.primary,error:t==null?void 0:t.error,text:t==null?void 0:t.text,base:t==null?void 0:t.base,iconBold:t==null?void 0:t.iconBold,border:t==null?void 0:t.border,inputBackground:t==null?void 0:t.inputBackground,primaryFocus:t==null?void 0:t.primaryFocus,negative20:t==null?void 0:t.negative20},transition:"all 0.1s ease-in-out",typography:F,value:k??x,...D}),f&&r.jsx(v,{onClick:j}),b&&r.jsx(i.Text,{"aria-label":"error-message",bottom:"-8px",className:e==null?void 0:e.errorMessage,color:"var(--error, light-dark(#D52B2E, #FF5B5E))",left:"0",pos:"absolute",styleOrder:1,transform:"translateY(100%)",typography:"inputPlaceholder",children:b})]})}function v(a){return r.jsx(i.Button,{alignItems:"center","aria-label":"clear-button",bg:"var(--negative20, light-dark(#0003, #FFF6))",border:"none",borderRadius:"50%",boxSize:"20px",color:"var(--base, light-dark(#FFF, #000))",cursor:"pointer",display:"flex",justifyContent:"center",p:"2px",pos:"absolute",right:"12px",styleOrder:1,top:"50%",transform:"translateY(-50%)",...a,children:r.jsxs("svg",{fill:"none",height:"24",viewBox:"0 0 24 24",width:"24",xmlns:"http://www.w3.org/2000/svg",children:[r.jsx("path",{d:"M18 6L6 18",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"2"}),r.jsx("path",{d:"M6 6L18 18",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"2"})]})})}exports.ClearButton=v;exports.Input=S;
2
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("@devup-ui/react"),C=require("react");function S({defaultValue:n,value:k,onChange:a,typography:F,error:o=!1,errorMessage:b,allowClear:x=!0,icon:d,colors:t,disabled:u,className:B,classNames:r,ref:y,onClear:p,...D}){const[g,h]=C.useState(n||""),E=l=>{h(l.target.value),a==null||a(l)},j=()=>{h(""),p==null||p()},f=g&&!u&&x;return e.jsxs(i.Box,{className:r==null?void 0:r.container,display:"inline-block",pos:"relative",selectors:{"&, & *":{boxSizing:"border-box"}},children:[d&&e.jsx(i.Center,{"aria-label":"icon",boxSize:"24px",className:r==null?void 0:r.icon,color:u?"var(--inputDisabledText, light-dark(#D6D7DE, #373737))":"var(--iconBold, light-dark(#8D8C9A, #666577))",left:"12px",pos:"absolute",styleOrder:1,top:"50%",transform:"translateY(-50%)",children:d}),e.jsx(i.Input,{ref:y,_disabled:{_placeholder:{color:"var(--inputDisabledText, light-dark(#D6D7DE, #373737))"},bg:"var(--inputDisabledBg, light-dark(#F0F0F3, #414244))",border:"1px solid var(--border, light-dark(#E4E4E4, #434343))",color:"var(--inputDisabledText, light-dark(#D6D7DE, #373737))"},_focus:{bg:"var(--primaryBg, light-dark(#F4F3FA, #F4F3FA0D))",border:"1px solid var(--primary, light-dark(#674DC7, #8163E1))",outline:"none"},_hover:{border:"1px solid var(--primary, light-dark(#674DC7, #8163E1))"},_placeholder:{color:"var(--inputPlaceholder, light-dark(#A9A8AB, #CBCBCB))"},"aria-label":"input",bg:"var(--inputBg, light-dark(#FFFFFF, #2E2E2E))",borderColor:o?"var(--error, light-dark(#D52B2E, #FF5B5E))":"var(--border, light-dark(#E4E4E4, #434343))",borderRadius:"8px",borderStyle:"solid",borderWidth:"1px",className:`${B||""} ${(r==null?void 0:r.input)||""}`.trim(),disabled:u,onChange:E,pl:d?"36px":"12px",pr:x?"36px":"12px",py:"12px",styleOrder:1,styleVars:{primary:t==null?void 0:t.primary,error:t==null?void 0:t.error,text:t==null?void 0:t.text,base:t==null?void 0:t.base,iconBold:t==null?void 0:t.iconBold,border:t==null?void 0:t.border,inputBackground:t==null?void 0:t.inputBackground,primaryFocus:t==null?void 0:t.primaryFocus,negative20:t==null?void 0:t.negative20},transition:"all 0.1s ease-in-out",typography:F,value:k??g,...D}),f&&e.jsx(v,{onClick:j}),b&&e.jsx(i.Text,{"aria-label":"error-message",bottom:"-8px",className:r==null?void 0:r.errorMessage,color:"var(--error, light-dark(#D52B2E, #FF5B5E))",left:"0",pos:"absolute",styleOrder:1,transform:"translateY(100%)",typography:"inputPlaceholder",children:b})]})}function v(n){return e.jsx(i.Button,{alignItems:"center","aria-label":"clear-button",bg:"var(--negative20, light-dark(#0003, #FFF6))",border:"none",borderRadius:"50%",boxSize:"20px",color:"var(--base, light-dark(#FFF, #000))",cursor:"pointer",display:"flex",justifyContent:"center",p:"2px",pos:"absolute",right:"12px",styleOrder:1,top:"50%",transform:"translateY(-50%)",...n,children:e.jsxs("svg",{fill:"none",height:"24",viewBox:"0 0 24 24",width:"24",xmlns:"http://www.w3.org/2000/svg",children:[e.jsx("path",{d:"M18 6L6 18",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"2"}),e.jsx("path",{d:"M6 6L18 18",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"2"})]})})}exports.ClearButton=v;exports.Input=S;
@@ -7,6 +7,7 @@ interface InputProps extends Omit<ComponentProps<'input'>, 'type'> {
7
7
  errorMessage?: string;
8
8
  allowClear?: boolean;
9
9
  classNames?: {
10
+ container?: string;
10
11
  input?: string;
11
12
  icon?: string;
12
13
  errorMessage?: string;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Input/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAIL,oBAAoB,EAGrB,MAAM,iBAAiB,CAAA;AACxB,OAAO,EAAE,cAAc,EAAY,MAAM,OAAO,CAAA;AAEhD,UAAU,UAAW,SAAQ,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IAChE,IAAI,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC,CAAA;IACvD,UAAU,CAAC,EAAE,MAAM,oBAAoB,CAAA;IACvC,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,UAAU,CAAC,EAAE;QACX,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,IAAI,CAAC,EAAE,MAAM,CAAA;QACb,YAAY,CAAC,EAAE,MAAM,CAAA;KACtB,CAAA;IACD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,MAAM,CAAC,EAAE;QACP,OAAO,CAAC,EAAE,MAAM,CAAA;QAChB,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,IAAI,CAAC,EAAE,MAAM,CAAA;QACb,IAAI,CAAC,EAAE,MAAM,CAAA;QACb,QAAQ,CAAC,EAAE,MAAM,CAAA;QACjB,MAAM,CAAC,EAAE,MAAM,CAAA;QACf,eAAe,CAAC,EAAE,MAAM,CAAA;QACxB,YAAY,CAAC,EAAE,MAAM,CAAA;QACrB,UAAU,CAAC,EAAE,MAAM,CAAA;KACpB,CAAA;IACD,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACvB;AAED,wBAAgB,KAAK,CAAC,EACpB,YAAY,EACZ,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,YAAY,EACtB,UAAU,EACV,KAAa,EACb,YAAY,EACZ,UAAiB,EACjB,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,SAAS,EACT,UAAU,EACV,GAAG,EACH,OAAO,EACP,GAAG,KAAK,EACT,EAAE,UAAU,2CA6GZ;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,QAAQ,CAAC,2CA6C1D"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Input/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAIL,oBAAoB,EAGrB,MAAM,iBAAiB,CAAA;AACxB,OAAO,EAAE,cAAc,EAAY,MAAM,OAAO,CAAA;AAEhD,UAAU,UAAW,SAAQ,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IAChE,IAAI,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC,CAAA;IACvD,UAAU,CAAC,EAAE,MAAM,oBAAoB,CAAA;IACvC,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,UAAU,CAAC,EAAE;QACX,SAAS,CAAC,EAAE,MAAM,CAAA;QAClB,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,IAAI,CAAC,EAAE,MAAM,CAAA;QACb,YAAY,CAAC,EAAE,MAAM,CAAA;KACtB,CAAA;IACD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,MAAM,CAAC,EAAE;QACP,OAAO,CAAC,EAAE,MAAM,CAAA;QAChB,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,IAAI,CAAC,EAAE,MAAM,CAAA;QACb,IAAI,CAAC,EAAE,MAAM,CAAA;QACb,QAAQ,CAAC,EAAE,MAAM,CAAA;QACjB,MAAM,CAAC,EAAE,MAAM,CAAA;QACf,eAAe,CAAC,EAAE,MAAM,CAAA;QACxB,YAAY,CAAC,EAAE,MAAM,CAAA;QACrB,UAAU,CAAC,EAAE,MAAM,CAAA;KACpB,CAAA;IACD,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACvB;AAED,wBAAgB,KAAK,CAAC,EACpB,YAAY,EACZ,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,YAAY,EACtB,UAAU,EACV,KAAa,EACb,YAAY,EACZ,UAAiB,EACjB,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,SAAS,EACT,UAAU,EACV,GAAG,EACH,OAAO,EACP,GAAG,KAAK,EACT,EAAE,UAAU,2CA8GZ;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,QAAQ,CAAC,2CA6C1D"}
@@ -1,49 +1,50 @@
1
1
  "use client";
2
2
  import { jsxs as x, jsx as e } from "react/jsx-runtime";
3
- import { Box as m, Center as C, Input as A, Text as L, Button as j } from "@devup-ui/react";
3
+ import { Box as C, Center as m, Input as A, Text as L, Button as j } from "@devup-ui/react";
4
4
  import { useState as w } from "react";
5
5
  function T({
6
6
  defaultValue: i,
7
7
  value: k,
8
- onChange: a,
8
+ onChange: n,
9
9
  typography: v,
10
10
  error: F = !1,
11
11
  errorMessage: u,
12
12
  allowClear: b = !0,
13
- icon: n,
14
- colors: r,
13
+ icon: a,
14
+ colors: t,
15
15
  disabled: d,
16
16
  className: o,
17
- classNames: t,
17
+ classNames: r,
18
18
  ref: B,
19
19
  onClear: p,
20
20
  ...y
21
21
  }) {
22
- const [h, l] = w(i || ""), D = (g) => {
23
- l(g.target.value), a == null || a(g);
22
+ const [h, g] = w(i || ""), D = (l) => {
23
+ g(l.target.value), n == null || n(l);
24
24
  }, E = () => {
25
- l(""), p == null || p();
25
+ g(""), p == null || p();
26
26
  }, f = h && !d && b;
27
27
  return /* @__PURE__ */ x(
28
- m,
28
+ C,
29
29
  {
30
+ className: r == null ? void 0 : r.container,
30
31
  display: "inline-block",
31
32
  pos: "relative",
32
- selectors: { "&,&>*": { boxSizing: "border-box" } },
33
+ selectors: { "&, & *": { boxSizing: "border-box" } },
33
34
  children: [
34
- n && /* @__PURE__ */ e(
35
- C,
35
+ a && /* @__PURE__ */ e(
36
+ m,
36
37
  {
37
38
  "aria-label": "icon",
38
39
  boxSize: "24px",
39
- className: t == null ? void 0 : t.icon,
40
+ className: r == null ? void 0 : r.icon,
40
41
  color: d ? "var(--inputDisabledText, light-dark(#D6D7DE, #373737))" : "var(--iconBold, light-dark(#8D8C9A, #666577))",
41
42
  left: "12px",
42
43
  pos: "absolute",
43
44
  styleOrder: 1,
44
45
  top: "50%",
45
46
  transform: "translateY(-50%)",
46
- children: n
47
+ children: a
47
48
  }
48
49
  ),
49
50
  /* @__PURE__ */ e(
@@ -64,7 +65,7 @@ function T({
64
65
  outline: "none"
65
66
  },
66
67
  _hover: {
67
- border: "1px solid var(--primary, light-dark(red, blue))"
68
+ border: "1px solid var(--primary, light-dark(#674DC7, #8163E1))"
68
69
  },
69
70
  _placeholder: {
70
71
  color: "var(--inputPlaceholder, light-dark(#A9A8AB, #CBCBCB))"
@@ -75,23 +76,23 @@ function T({
75
76
  borderRadius: "8px",
76
77
  borderStyle: "solid",
77
78
  borderWidth: "1px",
78
- className: `${o || ""} ${(t == null ? void 0 : t.input) || ""}`.trim(),
79
+ className: `${o || ""} ${(r == null ? void 0 : r.input) || ""}`.trim(),
79
80
  disabled: d,
80
81
  onChange: D,
81
- pl: n ? "36px" : "12px",
82
+ pl: a ? "36px" : "12px",
82
83
  pr: b ? "36px" : "12px",
83
84
  py: "12px",
84
85
  styleOrder: 1,
85
86
  styleVars: {
86
- primary: r == null ? void 0 : r.primary,
87
- error: r == null ? void 0 : r.error,
88
- text: r == null ? void 0 : r.text,
89
- base: r == null ? void 0 : r.base,
90
- iconBold: r == null ? void 0 : r.iconBold,
91
- border: r == null ? void 0 : r.border,
92
- inputBackground: r == null ? void 0 : r.inputBackground,
93
- primaryFocus: r == null ? void 0 : r.primaryFocus,
94
- negative20: r == null ? void 0 : r.negative20
87
+ primary: t == null ? void 0 : t.primary,
88
+ error: t == null ? void 0 : t.error,
89
+ text: t == null ? void 0 : t.text,
90
+ base: t == null ? void 0 : t.base,
91
+ iconBold: t == null ? void 0 : t.iconBold,
92
+ border: t == null ? void 0 : t.border,
93
+ inputBackground: t == null ? void 0 : t.inputBackground,
94
+ primaryFocus: t == null ? void 0 : t.primaryFocus,
95
+ negative20: t == null ? void 0 : t.negative20
95
96
  },
96
97
  transition: "all 0.1s ease-in-out",
97
98
  typography: v,
@@ -105,7 +106,7 @@ function T({
105
106
  {
106
107
  "aria-label": "error-message",
107
108
  bottom: "-8px",
108
- className: t == null ? void 0 : t.errorMessage,
109
+ className: r == null ? void 0 : r.errorMessage,
109
110
  color: "var(--error, light-dark(#D52B2E, #FF5B5E))",
110
111
  left: "0",
111
112
  pos: "absolute",
@@ -0,0 +1,3 @@
1
+ import { ComponentProps } from 'react';
2
+ export declare function IconArrow({ className, ...props }: ComponentProps<'svg'>): import("react/jsx-runtime").JSX.Element;
3
+ //# sourceMappingURL=IconArrow.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"IconArrow.d.ts","sourceRoot":"","sources":["../../../src/components/Select/IconArrow.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAEtC,wBAAgB,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,KAAK,CAAC,2CAmBvE"}
@@ -0,0 +1,3 @@
1
+ import { ComponentProps } from 'react';
2
+ export declare function IconCheck({ ...props }: ComponentProps<'svg'>): import("react/jsx-runtime").JSX.Element;
3
+ //# sourceMappingURL=IconCheck.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"IconCheck.d.ts","sourceRoot":"","sources":["../../../src/components/Select/IconCheck.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAEtC,wBAAgB,SAAS,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,KAAK,CAAC,2CAmB5D"}
@@ -0,0 +1,9 @@
1
+ import { Meta, StoryObj } from '@storybook/react-vite';
2
+ import { Select } from '.';
3
+ export type Story = StoryObj<typeof meta>;
4
+ declare const meta: Meta<typeof Select>;
5
+ export declare const DefaultStory: Story;
6
+ export declare const ControlledRadioStory: Story;
7
+ export declare const ControlledCheckboxStory: Story;
8
+ export default meta;
9
+ //# sourceMappingURL=Select.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Select.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAGtD,OAAO,EACL,MAAM,EAKP,MAAM,GAAG,CAAA;AAGV,MAAM,MAAM,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAGzC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,MAAM,CAU7B,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAK1B,CAAA;AAED,eAAO,MAAM,oBAAoB,EAAE,KAGlC,CAAA;AAED,eAAO,MAAM,uBAAuB,EAAE,KAGrC,CAAA;AAED,eAAe,IAAI,CAAA"}
@@ -0,0 +1,51 @@
1
+ import { DevupThemeTypography } from '@devup-ui/react';
2
+ import { ComponentProps } from 'react';
3
+ import { Button } from '../Button';
4
+ type SelectType = 'default' | 'radio' | 'checkbox';
5
+ type SelectValue<T extends SelectType> = T extends 'radio' ? string : string[];
6
+ export declare const useSelect: () => {
7
+ open: boolean;
8
+ setOpen: (open: boolean) => void;
9
+ value: SelectValue<SelectType>;
10
+ setValue: (value: string) => void;
11
+ type: SelectType;
12
+ };
13
+ interface SelectProps extends ComponentProps<'div'> {
14
+ defaultValue?: SelectValue<SelectType>;
15
+ value?: SelectValue<SelectType>;
16
+ onValueChange?: (value: string) => void;
17
+ defaultOpen?: boolean;
18
+ open?: boolean;
19
+ onOpenChange?: (open: boolean) => void;
20
+ children: React.ReactNode;
21
+ type?: SelectType;
22
+ colors?: {
23
+ primary?: string;
24
+ border?: string;
25
+ inputBackground?: string;
26
+ base10?: string;
27
+ title?: string;
28
+ selectDisabled?: string;
29
+ primaryBg?: string;
30
+ };
31
+ typography?: keyof DevupThemeTypography;
32
+ }
33
+ export declare function Select({ type, children, defaultValue, value: valueProp, onValueChange, defaultOpen, open: openProp, onOpenChange, colors, typography, ...props }: SelectProps): import("react/jsx-runtime").JSX.Element;
34
+ interface SelectTriggerProps extends ComponentProps<typeof Button> {
35
+ asChild?: boolean;
36
+ }
37
+ export declare function SelectTrigger({ className, children, asChild, ...props }: SelectTriggerProps): import("react/jsx-runtime").JSX.Element;
38
+ interface SelectContainerProps extends ComponentProps<'div'> {
39
+ showConfirmButton?: boolean;
40
+ }
41
+ export declare function SelectContainer({ children, showConfirmButton, ...props }: SelectContainerProps): import("react/jsx-runtime").JSX.Element | null;
42
+ interface SelectOptionProps extends Omit<ComponentProps<'div'>, 'onClick'> {
43
+ onClick?: (value: string | undefined, e?: React.MouseEvent<HTMLDivElement>) => void;
44
+ disabled?: boolean;
45
+ value?: string;
46
+ showCheck?: boolean;
47
+ }
48
+ export declare function SelectOption({ disabled, onClick, children, value, showCheck, ...props }: SelectOptionProps): import("react/jsx-runtime").JSX.Element;
49
+ export declare function SelectDivider({ ...props }: ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
50
+ export {};
51
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAY,oBAAoB,EAAgB,MAAM,iBAAiB,CAAA;AAE9E,OAAO,EAEL,cAAc,EASf,MAAM,OAAO,CAAA;AAEd,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAGlC,KAAK,UAAU,GAAG,SAAS,GAAG,OAAO,GAAG,UAAU,CAAA;AAClD,KAAK,WAAW,CAAC,CAAC,SAAS,UAAU,IAAI,CAAC,SAAS,OAAO,GAAG,MAAM,GAAG,MAAM,EAAE,CAAA;AAU9E,eAAO,MAAM,SAAS;UAPd,OAAO;aACJ,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI;WACzB,WAAW,CAAC,UAAU,CAAC;cACpB,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI;UAC3B,UAAU;CASjB,CAAA;AAED,UAAU,WAAY,SAAQ,cAAc,CAAC,KAAK,CAAC;IACjD,YAAY,CAAC,EAAE,WAAW,CAAC,UAAU,CAAC,CAAA;IACtC,KAAK,CAAC,EAAE,WAAW,CAAC,UAAU,CAAC,CAAA;IAC/B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACtC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,IAAI,CAAC,EAAE,UAAU,CAAA;IACjB,MAAM,CAAC,EAAE;QACP,OAAO,CAAC,EAAE,MAAM,CAAA;QAChB,MAAM,CAAC,EAAE,MAAM,CAAA;QACf,eAAe,CAAC,EAAE,MAAM,CAAA;QACxB,MAAM,CAAC,EAAE,MAAM,CAAA;QACf,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,cAAc,CAAC,EAAE,MAAM,CAAA;QACvB,SAAS,CAAC,EAAE,MAAM,CAAA;KACnB,CAAA;IACD,UAAU,CAAC,EAAE,MAAM,oBAAoB,CAAA;CACxC;AAED,wBAAgB,MAAM,CAAC,EACrB,IAAgB,EAChB,QAAQ,EACR,YAAY,EACZ,KAAK,EAAE,SAAS,EAChB,aAAa,EACb,WAAW,EACX,IAAI,EAAE,QAAQ,EACd,YAAY,EACZ,MAAM,EACN,UAAU,EACV,GAAG,KAAK,EACT,EAAE,WAAW,2CAwEb;AAED,UAAU,kBAAmB,SAAQ,cAAc,CAAC,OAAO,MAAM,CAAC;IAChE,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AACD,wBAAgB,aAAa,CAAC,EAC5B,SAAS,EACT,QAAQ,EACR,OAAO,EACP,GAAG,KAAK,EACT,EAAE,kBAAkB,2CAqCpB;AAED,UAAU,oBAAqB,SAAQ,cAAc,CAAC,KAAK,CAAC;IAC1D,iBAAiB,CAAC,EAAE,OAAO,CAAA;CAC5B;AACD,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,iBAAiB,EACjB,GAAG,KAAK,EACT,EAAE,oBAAoB,kDA8CtB;AAED,UAAU,iBAAkB,SAAQ,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC;IACxE,OAAO,CAAC,EAAE,CACR,KAAK,EAAE,MAAM,GAAG,SAAS,EACzB,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KACjC,IAAI,CAAA;IACT,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB;AAED,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,KAAK,EACL,SAAgB,EAChB,GAAG,KAAK,EACT,EAAE,iBAAiB,2CAmHnB;AAED,wBAAgB,aAAa,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,KAAK,CAAC,2CAUhE"}
@@ -0,0 +1,3 @@
1
+ import { SVGProps } from 'react';
2
+ export declare function IconMinus({ ...props }: SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
3
+ //# sourceMappingURL=IconMinus.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"IconMinus.d.ts","sourceRoot":"","sources":["../../../src/components/Stepper/IconMinus.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEhC,wBAAgB,SAAS,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,QAAQ,CAAC,aAAa,CAAC,2CAkB9D"}
@@ -0,0 +1,3 @@
1
+ import { SVGProps } from 'react';
2
+ export declare function IconPlus({ ...props }: SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
3
+ //# sourceMappingURL=IconPlus.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"IconPlus.d.ts","sourceRoot":"","sources":["../../../src/components/Stepper/IconPlus.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEhC,wBAAgB,QAAQ,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,QAAQ,CAAC,aAAa,CAAC,2CAgB7D"}
@@ -0,0 +1,7 @@
1
+ import { Meta, StoryObj } from '@storybook/react-vite';
2
+ import { Stepper } from './index';
3
+ type Story = StoryObj<typeof meta>;
4
+ declare const meta: Meta<typeof Stepper>;
5
+ export declare const Default: Story;
6
+ export default meta;
7
+ //# sourceMappingURL=Stepper.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Stepper.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Stepper/Stepper.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAEtD,OAAO,EACL,OAAO,EAKR,MAAM,SAAS,CAAA;AAEhB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAGlC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,OAAO,CAU9B,CAAA;AAED,eAAO,MAAM,OAAO,EAAE,KAWrB,CAAA;AAED,eAAe,IAAI,CAAA"}
@@ -0,0 +1,2 @@
1
+ "use client";
2
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const v=require("react/jsx-runtime");require("@devup-ui/react");require("clsx");const n=require("react"),S=n.createContext(null);function d({children:a,defaultValue:s,value:i,onValueChange:e,min:t=0,max:r=100}){const[o,c]=n.useState(s??0),l=p=>{const u=Math.min(Math.max(p,t),r);if(e){e(u);return}c(u)};return v.jsx(S.Provider,{value:{value:i??o,setValue:l,min:t,max:r},children:a})}exports.Stepper=d;
@@ -0,0 +1,28 @@
1
+ import { ComponentProps } from 'react';
2
+ import { Button } from '../Button';
3
+ import { Input } from '../Input';
4
+ type StepperContextType = {
5
+ value: number;
6
+ setValue: (value: number) => void;
7
+ min: number;
8
+ max: number;
9
+ };
10
+ export declare const useStepper: () => StepperContextType;
11
+ type StepperProps = {
12
+ children?: React.ReactNode;
13
+ defaultValue?: number;
14
+ value?: number;
15
+ onValueChange?: (value: number) => void;
16
+ min?: number;
17
+ max?: number;
18
+ };
19
+ declare function Stepper({ children, defaultValue, value: valueProp, onValueChange, min, max, }: StepperProps): import("react/jsx-runtime").JSX.Element;
20
+ declare function StepperContainer(props: ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
21
+ declare function StepperDecreaseButton({ ...props }: ComponentProps<typeof Button>): import("react/jsx-runtime").JSX.Element;
22
+ declare function StepperIncreaseButton({ ...props }: ComponentProps<typeof Button>): import("react/jsx-runtime").JSX.Element;
23
+ interface StepperInputProps extends ComponentProps<typeof Input> {
24
+ editable?: boolean;
25
+ }
26
+ declare function StepperInput({ editable, className, ...props }: StepperInputProps): import("react/jsx-runtime").JSX.Element;
27
+ export { Stepper, StepperContainer, StepperDecreaseButton, StepperIncreaseButton, StepperInput, };
28
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Stepper/index.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,cAAc,EAAuC,MAAM,OAAO,CAAA;AAE3E,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAIhC,KAAK,kBAAkB,GAAG;IACxB,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,GAAG,EAAE,MAAM,CAAA;IACX,GAAG,EAAE,MAAM,CAAA;CACZ,CAAA;AAID,eAAO,MAAM,UAAU,0BAMtB,CAAA;AAED,KAAK,YAAY,GAAG;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,GAAG,CAAC,EAAE,MAAM,CAAA;CACb,CAAA;AAED,iBAAS,OAAO,CAAC,EACf,QAAQ,EACR,YAAY,EACZ,KAAK,EAAE,SAAS,EAChB,aAAa,EACb,GAAO,EACP,GAAS,GACV,EAAE,YAAY,2CAmBd;AAED,iBAAS,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,2CAErD;AAED,iBAAS,qBAAqB,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,OAAO,MAAM,CAAC,2CAwBzE;AAED,iBAAS,qBAAqB,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,OAAO,MAAM,CAAC,2CA2BzE;AAED,UAAU,iBAAkB,SAAQ,cAAc,CAAC,OAAO,KAAK,CAAC;IAC9D,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,iBAAS,YAAY,CAAC,EACpB,QAAe,EACf,SAAS,EACT,GAAG,KAAK,EACT,EAAE,iBAAiB,2CA6CnB;AAED,OAAO,EACL,OAAO,EACP,gBAAgB,EAChB,qBAAqB,EACrB,qBAAqB,EACrB,YAAY,GACb,CAAA"}
@@ -0,0 +1,33 @@
1
+ "use client";
2
+ import { jsx as c } from "react/jsx-runtime";
3
+ import "@devup-ui/react";
4
+ import "clsx";
5
+ import { useState as m, createContext as v } from "react";
6
+ const f = v(null);
7
+ function C({
8
+ children: n,
9
+ defaultValue: a,
10
+ value: u,
11
+ onValueChange: t,
12
+ min: e = 0,
13
+ max: r = 100
14
+ }) {
15
+ const [i, p] = m(a ?? 0), s = (l) => {
16
+ const o = Math.min(Math.max(l, e), r);
17
+ if (t) {
18
+ t(o);
19
+ return;
20
+ }
21
+ p(o);
22
+ };
23
+ return /* @__PURE__ */ c(
24
+ f.Provider,
25
+ {
26
+ value: { value: u ?? i, setValue: s, min: e, max: r },
27
+ children: n
28
+ }
29
+ );
30
+ }
31
+ export {
32
+ C as Stepper
33
+ };
package/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./components/Button/index.cjs"),e=require("./components/Input/index.cjs");exports.Button=t.Button;exports.Input=e.Input;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./components/Button/index.cjs"),t=require("./components/Input/index.cjs"),n=require("./components/Stepper/index.cjs");exports.Button=e.Button;exports.Input=t.Input;exports.Stepper=n.Stepper;
package/dist/index.d.ts CHANGED
@@ -1,3 +1,4 @@
1
1
  export { Button } from './components/Button';
2
2
  export { Input } from './components/Input';
3
+ export { Stepper } from './components/Stepper';
3
4
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAC5C,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAC5C,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAA;AAC1C,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAA"}
package/dist/index.js CHANGED
@@ -1,6 +1,8 @@
1
- import { Button as r } from "./components/Button/index.js";
1
+ import { Button as t } from "./components/Button/index.js";
2
2
  import { Input as e } from "./components/Input/index.js";
3
+ import { Stepper as m } from "./components/Stepper/index.js";
3
4
  export {
4
- r as Button,
5
- e as Input
5
+ t as Button,
6
+ e as Input,
7
+ m as Stepper
6
8
  };
package/package.json CHANGED
@@ -16,7 +16,7 @@
16
16
  "css-in-js-framework",
17
17
  "react"
18
18
  ],
19
- "version": "0.1.3",
19
+ "version": "0.1.5",
20
20
  "type": "module",
21
21
  "publishConfig": {
22
22
  "access": "public"