@julien-wiegandt/open-ui 0.1.10 → 0.1.11
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.
- package/dist/components/input/index.d.ts +3 -0
- package/dist/open-ui.js +11 -3
- package/dist/open-ui.umd.cjs +4 -3
- package/package.json +1 -1
|
@@ -1,7 +1,9 @@
|
|
|
1
|
+
import { Color } from '../../theme/types';
|
|
1
2
|
import { MarginProps, PaddingProps } from '../common/types';
|
|
2
3
|
export type InputProps = {
|
|
3
4
|
error?: string;
|
|
4
5
|
label?: string;
|
|
6
|
+
color?: Color;
|
|
5
7
|
required?: boolean;
|
|
6
8
|
w?: string;
|
|
7
9
|
h?: string;
|
|
@@ -9,6 +11,7 @@ export type InputProps = {
|
|
|
9
11
|
export declare const Input: import('react').ForwardRefExoticComponent<{
|
|
10
12
|
error?: string;
|
|
11
13
|
label?: string;
|
|
14
|
+
color?: Color;
|
|
12
15
|
required?: boolean;
|
|
13
16
|
w?: string;
|
|
14
17
|
h?: string;
|
package/dist/open-ui.js
CHANGED
|
@@ -1803,7 +1803,8 @@ const Wn = te.input`
|
|
|
1803
1803
|
align-items: center;
|
|
1804
1804
|
text-align: left;
|
|
1805
1805
|
|
|
1806
|
-
color: ${({ theme: e }) => e.palette.
|
|
1806
|
+
color: ${({ theme: e, color: t }) => e.palette[t ?? "default"].main};
|
|
1807
|
+
|
|
1807
1808
|
background-color: white;
|
|
1808
1809
|
border-radius: ${({ theme: e }) => Te[e.radius]};
|
|
1809
1810
|
padding: 8px 12px;
|
|
@@ -1811,7 +1812,7 @@ const Wn = te.input`
|
|
|
1811
1812
|
${vr()};
|
|
1812
1813
|
|
|
1813
1814
|
border: 1px solid
|
|
1814
|
-
${({ error: e }) => e ? ({ theme: t }) => t.palette.error.main : ({ theme: t }) => t.palette.
|
|
1815
|
+
${({ error: e }) => e ? ({ theme: t }) => t.palette.error.main : ({ theme: t, color: r }) => t.palette[r ?? "default"].main};
|
|
1815
1816
|
${({ m: e, mb: t, ml: r, mr: n, mt: o, mx: a, my: i }) => ue({ m: e, mb: t, ml: r, mr: n, mt: o, mx: a, my: i })};
|
|
1816
1817
|
${({ p: e, pb: t, pl: r, pr: n, pt: o, px: a, py: i }) => pe({ p: e, pb: t, pl: r, pr: n, pt: o, px: a, py: i })};
|
|
1817
1818
|
|
|
@@ -1829,7 +1830,14 @@ const Wn = te.input`
|
|
|
1829
1830
|
mb: "4px",
|
|
1830
1831
|
style: { minHeight: "1.2em" },
|
|
1831
1832
|
children: [
|
|
1832
|
-
e.label && /* @__PURE__ */ x.jsx(
|
|
1833
|
+
e.label && /* @__PURE__ */ x.jsx(
|
|
1834
|
+
G,
|
|
1835
|
+
{
|
|
1836
|
+
color: e.error ? r.palette.error.main : r.palette[e.color ?? "default"].main,
|
|
1837
|
+
size: "12",
|
|
1838
|
+
children: e.label
|
|
1839
|
+
}
|
|
1840
|
+
),
|
|
1833
1841
|
e.required && /* @__PURE__ */ x.jsx(G, { color: r.palette.error.main, size: "12", children: "*" })
|
|
1834
1842
|
]
|
|
1835
1843
|
}
|
package/dist/open-ui.umd.cjs
CHANGED
|
@@ -187,7 +187,8 @@ See https://s-c.sh/2BAXzed for more info.`),window[Je]+=1);const O=e=>typeof e==
|
|
|
187
187
|
align-items: center;
|
|
188
188
|
text-align: left;
|
|
189
189
|
|
|
190
|
-
color: ${({theme:e})=>e.palette.
|
|
190
|
+
color: ${({theme:e,color:t})=>e.palette[t??"default"].main};
|
|
191
|
+
|
|
191
192
|
background-color: white;
|
|
192
193
|
border-radius: ${({theme:e})=>Re[e.radius]};
|
|
193
194
|
padding: 8px 12px;
|
|
@@ -195,13 +196,13 @@ See https://s-c.sh/2BAXzed for more info.`),window[Je]+=1);const O=e=>typeof e==
|
|
|
195
196
|
${hr()};
|
|
196
197
|
|
|
197
198
|
border: 1px solid
|
|
198
|
-
${({error:e})=>e?({theme:t})=>t.palette.error.main:({theme:t})=>t.palette.
|
|
199
|
+
${({error:e})=>e?({theme:t})=>t.palette.error.main:({theme:t,color:r})=>t.palette[r??"default"].main};
|
|
199
200
|
${({m:e,mb:t,ml:r,mr:n,mt:o,mx:a,my:i})=>le({m:e,mb:t,ml:r,mr:n,mt:o,mx:a,my:i})};
|
|
200
201
|
${({p:e,pb:t,pl:r,pr:n,pt:o,px:a,py:i})=>ue({p:e,pb:t,pl:r,pr:n,pt:o,px:a,py:i})};
|
|
201
202
|
|
|
202
203
|
width: ${({w:e})=>e};
|
|
203
204
|
height: ${({h:e})=>e};
|
|
204
|
-
`,br=h.forwardRef((e,t)=>{const r=Xe();return w.jsxs(X,{direction:"column",children:[(e.label||e.required)&&w.jsxs(X,{direction:"row",gap:.5,align:"center",mb:"4px",style:{minHeight:"1.2em"},children:[e.label&&w.jsx(W,{
|
|
205
|
+
`,br=h.forwardRef((e,t)=>{const r=Xe();return w.jsxs(X,{direction:"column",children:[(e.label||e.required)&&w.jsxs(X,{direction:"row",gap:.5,align:"center",mb:"4px",style:{minHeight:"1.2em"},children:[e.label&&w.jsx(W,{color:e.error?r.palette.error.main:r.palette[e.color??"default"].main,size:"12",children:e.label}),e.required&&w.jsx(W,{color:r.palette.error.main,size:"12",children:"*"})]}),w.jsx(Vn,{ref:t,...e}),e.error&&w.jsx(W,{color:r.palette.error.main,size:"10",mt:"4px",style:{minHeight:"1.2em"},children:e.error})]})});br.displayName="Input";const Yn=({color:e,value:t,height:r})=>{const n=Xe();return w.jsx("div",{style:{width:"100%",position:"relative",backgroundColor:n.palette[e].light,borderRadius:"8px",height:r??"8px",border:`2px solid ${n.palette[e].light}`},children:w.jsx("div",{style:{position:"absolute",top:"0",left:"0",height:"100%",width:`${t>100?100:t}%`,backgroundColor:n.palette[e].main,borderRadius:"8px"}})})},vr=h.forwardRef((e,t)=>{const r=Xe(),[n,o]=h.useState(e.initialValue??e.options[0]),[a,i]=h.useState(!1),c=f=>{o(f),e.onChange&&e.onChange(f)},l=({option:f,handleChange:y})=>w.jsx(X,{onClick:()=>y(f),px:1.5,py:1,hoverstyle:{backgroundColor:r.palette.primary.light},children:w.jsx(W,{size:"14",align:"left",children:f.label})},f.key);return w.jsxs(X,{ref:t,direction:"column",width:"100%",justify:"start",children:[(e.label||e.required)&&w.jsxs(X,{direction:"row",gap:.5,align:"center",mb:"4px",style:{minHeight:"1.2em"},children:[e.label&&w.jsx(W,{size:"12",children:e.label}),e.required&&w.jsx(W,{color:r.palette.error.main,size:"12",children:"*"})]}),w.jsxs(X,{elevation:1,height:"fit-content",onClick:()=>i(!a),style:{position:"relative",cursor:"pointer"},children:[e.CustomOption?w.jsx(e.CustomOption,{option:n,handleChange:c}):w.jsx(l,{option:n,handleChange:c}),w.jsx(X,{elevation:1,width:"100%",gap:.5,style:{position:"absolute",left:"0",top:"38px",display:a?"flex":"none",zIndex:1,backgroundColor:"white"},children:e.options.map(f=>e.CustomOption?w.jsx(e.CustomOption,{option:f,handleChange:c}):w.jsx(l,{option:f,handleChange:c}))})]})]})});vr.displayName="Select";const Bn=Q.textarea`
|
|
205
206
|
all: unset;
|
|
206
207
|
box-sizing: border-box;
|
|
207
208
|
font-family: ${({theme:e})=>e.text.fontFamily};
|