enerdot-front-system 0.0.9 → 0.0.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/index.cjs.js +91 -63
- package/dist/index.es.js +788 -661
- package/dist/lib/components/Button/QuaternaryButton.d.ts +3 -0
- package/dist/lib/components/Button/common.d.ts +38 -0
- package/dist/lib/components/Button/index.d.ts +1 -1
- package/dist/lib/components/IconButton/QuaternaryButton.d.ts +3 -0
- package/dist/lib/components/IconButton/common.d.ts +33 -1
- package/dist/lib/components/IconButton/index.d.ts +2 -2
- package/dist/lib/theme/color.style.d.ts +1 -0
- package/package.json +6 -7
- package/dist/lib/components/IconButton/OnlyIconWhButton.d.ts +0 -3
package/dist/index.cjs.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const D=require("react"),Ar=require("styled-components"),Wr=e=>e&&typeof e=="object"&&"default"in e?e:{default:e};function Ir(e){if(e&&typeof e=="object"&&"default"in e)return e;const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const s=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(o,n,s.get?s:{enumerable:!0,get:()=>e[n]})}}return o.default=e,Object.freeze(o)}const zr=Ir(D),p=Wr(Ar);function Lr(e){if(e.__esModule)return e;var o=e.default;if(typeof o=="function"){var n=function s(){return this instanceof s?Reflect.construct(o,arguments,this.constructor):o.apply(this,arguments)};n.prototype=o.prototype}else n={};return Object.defineProperty(n,"__esModule",{value:!0}),Object.keys(e).forEach(function(s){var d=Object.getOwnPropertyDescriptor(e,s);Object.defineProperty(n,s,d.get?d:{enumerable:!0,get:function(){return e[s]}})}),n}var oe={exports:{}},J={};const Xe=Lr(zr);/**
|
|
2
2
|
* @license React
|
|
3
3
|
* react-jsx-runtime.production.min.js
|
|
4
4
|
*
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
*
|
|
7
7
|
* This source code is licensed under the MIT license found in the
|
|
8
8
|
* LICENSE file in the root directory of this source tree.
|
|
9
|
-
*/var Ne;function Mr(){if(Ne)return
|
|
9
|
+
*/var Ne;function Mr(){if(Ne)return J;Ne=1;var e=Xe,o=Symbol.for("react.element"),n=Symbol.for("react.fragment"),s=Object.prototype.hasOwnProperty,d=e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,a={key:!0,ref:!0,__self:!0,__source:!0};function u(f,h,m){var $,y={},x=null,j=null;m!==void 0&&(x=""+m),h.key!==void 0&&(x=""+h.key),h.ref!==void 0&&(j=h.ref);for($ in h)s.call(h,$)&&!a.hasOwnProperty($)&&(y[$]=h[$]);if(f&&f.defaultProps)for($ in h=f.defaultProps,h)y[$]===void 0&&(y[$]=h[$]);return{$$typeof:o,type:f,key:x,ref:j,props:y,_owner:d.current}}return J.Fragment=n,J.jsx=u,J.jsxs=u,J}var H={};/**
|
|
10
10
|
* @license React
|
|
11
11
|
* react-jsx-runtime.development.js
|
|
12
12
|
*
|
|
@@ -14,20 +14,20 @@
|
|
|
14
14
|
*
|
|
15
15
|
* This source code is licensed under the MIT license found in the
|
|
16
16
|
* LICENSE file in the root directory of this source tree.
|
|
17
|
-
*/var Ye;function Vr(){return Ye||(Ye=1,process.env.NODE_ENV!=="production"&&function(){var e=Xe,o=Symbol.for("react.element"),
|
|
18
|
-
`+de+r}}var ue=!1,
|
|
19
|
-
`),T=
|
|
20
|
-
`),
|
|
21
|
-
`+
|
|
17
|
+
*/var Ye;function Vr(){return Ye||(Ye=1,process.env.NODE_ENV!=="production"&&function(){var e=Xe,o=Symbol.for("react.element"),n=Symbol.for("react.portal"),s=Symbol.for("react.fragment"),d=Symbol.for("react.strict_mode"),a=Symbol.for("react.profiler"),u=Symbol.for("react.provider"),f=Symbol.for("react.context"),h=Symbol.for("react.forward_ref"),m=Symbol.for("react.suspense"),$=Symbol.for("react.suspense_list"),y=Symbol.for("react.memo"),x=Symbol.for("react.lazy"),j=Symbol.for("react.offscreen"),_=Symbol.iterator,R="@@iterator";function O(r){if(r===null||typeof r!="object")return null;var i=_&&r[_]||r[R];return typeof i=="function"?i:null}var F=e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;function E(r){{for(var i=arguments.length,c=new Array(i>1?i-1:0),g=1;g<i;g++)c[g-1]=arguments[g];L("error",r,c)}}function L(r,i,c){{var g=F.ReactDebugCurrentFrame,w=g.getStackAddendum();w!==""&&(i+="%s",c=c.concat([w]));var C=c.map(function(v){return String(v)});C.unshift("Warning: "+i),Function.prototype.apply.call(console[r],console,C)}}var ae=!1,X=!1,Q=!1,le=!1,M=!1,se;se=Symbol.for("react.module.reference");function lr(r){return!!(typeof r=="string"||typeof r=="function"||r===s||r===a||M||r===d||r===m||r===$||le||r===j||ae||X||Q||typeof r=="object"&&r!==null&&(r.$$typeof===x||r.$$typeof===y||r.$$typeof===u||r.$$typeof===f||r.$$typeof===h||r.$$typeof===se||r.getModuleId!==void 0))}function sr(r,i,c){var g=r.displayName;if(g)return g;var w=i.displayName||i.name||"";return w!==""?c+"("+w+")":c}function ve(r){return r.displayName||"Context"}function A(r){if(r==null)return null;if(typeof r.tag=="number"&&E("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),typeof r=="function")return r.displayName||r.name||null;if(typeof r=="string")return r;switch(r){case s:return"Fragment";case n:return"Portal";case a:return"Profiler";case d:return"StrictMode";case m:return"Suspense";case $:return"SuspenseList"}if(typeof r=="object")switch(r.$$typeof){case f:var i=r;return ve(i)+".Consumer";case u:var c=r;return ve(c._context)+".Provider";case h:return sr(r,r.render,"ForwardRef");case y:var g=r.displayName||null;return g!==null?g:A(r.type)||"Memo";case x:{var w=r,C=w._payload,v=w._init;try{return A(v(C))}catch{return null}}}return null}var I=Object.assign,q=0,ye,xe,we,Ce,je,ke,Re;function Ee(){}Ee.__reactDisabledLog=!0;function cr(){{if(q===0){ye=console.log,xe=console.info,we=console.warn,Ce=console.error,je=console.group,ke=console.groupCollapsed,Re=console.groupEnd;var r={configurable:!0,enumerable:!0,value:Ee,writable:!0};Object.defineProperties(console,{info:r,log:r,warn:r,error:r,group:r,groupCollapsed:r,groupEnd:r})}q++}}function dr(){{if(q--,q===0){var r={configurable:!0,enumerable:!0,writable:!0};Object.defineProperties(console,{log:I({},r,{value:ye}),info:I({},r,{value:xe}),warn:I({},r,{value:we}),error:I({},r,{value:Ce}),group:I({},r,{value:je}),groupCollapsed:I({},r,{value:ke}),groupEnd:I({},r,{value:Re})})}q<0&&E("disabledDepth fell below zero. This is a bug in React. Please file an issue.")}}var ce=F.ReactCurrentDispatcher,de;function Z(r,i,c){{if(de===void 0)try{throw Error()}catch(w){var g=w.stack.trim().match(/\n( *(at )?)/);de=g&&g[1]||""}return`
|
|
18
|
+
`+de+r}}var ue=!1,ee;{var ur=typeof WeakMap=="function"?WeakMap:Map;ee=new ur}function Se(r,i){if(!r||ue)return"";{var c=ee.get(r);if(c!==void 0)return c}var g;ue=!0;var w=Error.prepareStackTrace;Error.prepareStackTrace=void 0;var C;C=ce.current,ce.current=null,cr();try{if(i){var v=function(){throw Error()};if(Object.defineProperty(v.prototype,"props",{set:function(){throw Error()}}),typeof Reflect=="object"&&Reflect.construct){try{Reflect.construct(v,[])}catch(B){g=B}Reflect.construct(r,[],v)}else{try{v.call()}catch(B){g=B}r.call(v.prototype)}}else{try{throw Error()}catch(B){g=B}r()}}catch(B){if(B&&g&&typeof B.stack=="string"){for(var b=B.stack.split(`
|
|
19
|
+
`),T=g.stack.split(`
|
|
20
|
+
`),k=b.length-1,S=T.length-1;k>=1&&S>=0&&b[k]!==T[S];)S--;for(;k>=1&&S>=0;k--,S--)if(b[k]!==T[S]){if(k!==1||S!==1)do if(k--,S--,S<0||b[k]!==T[S]){var P=`
|
|
21
|
+
`+b[k].replace(" at new "," at ");return r.displayName&&P.includes("<anonymous>")&&(P=P.replace("<anonymous>",r.displayName)),typeof r=="function"&&ee.set(r,P),P}while(k>=1&&S>=0);break}}}finally{ue=!1,ce.current=C,dr(),Error.prepareStackTrace=w}var N=r?r.displayName||r.name:"",z=N?Z(N):"";return typeof r=="function"&&ee.set(r,z),z}function fr(r,i,c){return Se(r,!1)}function hr(r){var i=r.prototype;return!!(i&&i.isReactComponent)}function re(r,i,c){if(r==null)return"";if(typeof r=="function")return Se(r,hr(r));if(typeof r=="string")return Z(r);switch(r){case m:return Z("Suspense");case $:return Z("SuspenseList")}if(typeof r=="object")switch(r.$$typeof){case h:return fr(r.render);case y:return re(r.type,i,c);case x:{var g=r,w=g._payload,C=g._init;try{return re(C(w),i,c)}catch{}}}return""}var U=Object.prototype.hasOwnProperty,_e={},Fe=F.ReactDebugCurrentFrame;function te(r){if(r){var i=r._owner,c=re(r.type,r._source,i?i.type:null);Fe.setExtraStackFrame(c)}else Fe.setExtraStackFrame(null)}function gr(r,i,c,g,w){{var C=Function.call.bind(U);for(var v in r)if(C(r,v)){var b=void 0;try{if(typeof r[v]!="function"){var T=Error((g||"React class")+": "+c+" type `"+v+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof r[v]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw T.name="Invariant Violation",T}b=r[v](i,v,g,c,null,"SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED")}catch(k){b=k}b&&!(b instanceof Error)&&(te(w),E("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",g||"React class",c,v,typeof b),te(null)),b instanceof Error&&!(b.message in _e)&&(_e[b.message]=!0,te(w),E("Failed %s type: %s",c,b.message),te(null))}}}var pr=Array.isArray;function fe(r){return pr(r)}function $r(r){{var i=typeof Symbol=="function"&&Symbol.toStringTag,c=i&&r[Symbol.toStringTag]||r.constructor.name||"Object";return c}}function br(r){try{return Te(r),!1}catch{return!0}}function Te(r){return""+r}function Oe(r){if(br(r))return E("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.",$r(r)),Te(r)}var Be=F.ReactCurrentOwner,mr={key:!0,ref:!0,__self:!0,__source:!0},Pe,De;function vr(r){if(U.call(r,"ref")){var i=Object.getOwnPropertyDescriptor(r,"ref").get;if(i&&i.isReactWarning)return!1}return r.ref!==void 0}function yr(r){if(U.call(r,"key")){var i=Object.getOwnPropertyDescriptor(r,"key").get;if(i&&i.isReactWarning)return!1}return r.key!==void 0}function xr(r,i){typeof r.ref=="string"&&Be.current}function wr(r,i){{var c=function(){Pe||(Pe=!0,E("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",i))};c.isReactWarning=!0,Object.defineProperty(r,"key",{get:c,configurable:!0})}}function Cr(r,i){{var c=function(){De||(De=!0,E("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",i))};c.isReactWarning=!0,Object.defineProperty(r,"ref",{get:c,configurable:!0})}}var jr=function(r,i,c,g,w,C,v){var b={$$typeof:o,type:r,key:i,ref:c,props:v,_owner:C};return b._store={},Object.defineProperty(b._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:!1}),Object.defineProperty(b,"_self",{configurable:!1,enumerable:!1,writable:!1,value:g}),Object.defineProperty(b,"_source",{configurable:!1,enumerable:!1,writable:!1,value:w}),Object.freeze&&(Object.freeze(b.props),Object.freeze(b)),b};function kr(r,i,c,g,w){{var C,v={},b=null,T=null;c!==void 0&&(Oe(c),b=""+c),yr(i)&&(Oe(i.key),b=""+i.key),vr(i)&&(T=i.ref,xr(i,w));for(C in i)U.call(i,C)&&!mr.hasOwnProperty(C)&&(v[C]=i[C]);if(r&&r.defaultProps){var k=r.defaultProps;for(C in k)v[C]===void 0&&(v[C]=k[C])}if(b||T){var S=typeof r=="function"?r.displayName||r.name||"Unknown":r;b&&wr(v,S),T&&Cr(v,S)}return jr(r,b,T,w,g,Be.current,v)}}var he=F.ReactCurrentOwner,Ae=F.ReactDebugCurrentFrame;function V(r){if(r){var i=r._owner,c=re(r.type,r._source,i?i.type:null);Ae.setExtraStackFrame(c)}else Ae.setExtraStackFrame(null)}var ge;ge=!1;function pe(r){return typeof r=="object"&&r!==null&&r.$$typeof===o}function We(){{if(he.current){var r=A(he.current.type);if(r)return`
|
|
22
22
|
|
|
23
|
-
Check the render method of \``+r+"`."}return""}}function
|
|
23
|
+
Check the render method of \``+r+"`."}return""}}function Rr(r){return""}var Ie={};function Er(r){{var i=We();if(!i){var c=typeof r=="string"?r:r.displayName||r.name;c&&(i=`
|
|
24
24
|
|
|
25
|
-
Check the top-level render call using <`+c+">.")}return
|
|
25
|
+
Check the top-level render call using <`+c+">.")}return i}}function ze(r,i){{if(!r._store||r._store.validated||r.key!=null)return;r._store.validated=!0;var c=Er(i);if(Ie[c])return;Ie[c]=!0;var g="";r&&r._owner&&r._owner!==he.current&&(g=" It was passed a child from "+A(r._owner.type)+"."),V(r),E('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.',c,g),V(null)}}function Le(r,i){{if(typeof r!="object")return;if(fe(r))for(var c=0;c<r.length;c++){var g=r[c];pe(g)&&ze(g,i)}else if(pe(r))r._store&&(r._store.validated=!0);else if(r){var w=O(r);if(typeof w=="function"&&w!==r.entries)for(var C=w.call(r),v;!(v=C.next()).done;)pe(v.value)&&ze(v.value,i)}}}function Sr(r){{var i=r.type;if(i==null||typeof i=="string")return;var c;if(typeof i=="function")c=i.propTypes;else if(typeof i=="object"&&(i.$$typeof===h||i.$$typeof===y))c=i.propTypes;else return;if(c){var g=A(i);gr(c,r.props,"prop",g,r)}else if(i.PropTypes!==void 0&&!ge){ge=!0;var w=A(i);E("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",w||"Unknown")}typeof i.getDefaultProps=="function"&&!i.getDefaultProps.isReactClassApproved&&E("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.")}}function _r(r){{for(var i=Object.keys(r.props),c=0;c<i.length;c++){var g=i[c];if(g!=="children"&&g!=="key"){V(r),E("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.",g),V(null);break}}r.ref!==null&&(V(r),E("Invalid attribute `ref` supplied to `React.Fragment`."),V(null))}}var Me={};function Ve(r,i,c,g,w,C){{var v=lr(r);if(!v){var b="";(r===void 0||typeof r=="object"&&r!==null&&Object.keys(r).length===0)&&(b+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");var T=Rr();T?b+=T:b+=We();var k;r===null?k="null":fe(r)?k="array":r!==void 0&&r.$$typeof===o?(k="<"+(A(r.type)||"Unknown")+" />",b=" Did you accidentally export a JSX literal instead of a component?"):k=typeof r,E("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",k,b)}var S=kr(r,i,c,w,C);if(S==null)return S;if(v){var P=i.children;if(P!==void 0)if(g)if(fe(P)){for(var N=0;N<P.length;N++)Le(P[N],r);Object.freeze&&Object.freeze(P)}else E("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else Le(P,r)}if(U.call(i,"key")){var z=A(r),B=Object.keys(i).filter(function(Dr){return Dr!=="key"}),$e=B.length>0?"{key: someKey, "+B.join(": ..., ")+": ...}":"{key: someKey}";if(!Me[z+$e]){var Pr=B.length>0?"{"+B.join(": ..., ")+": ...}":"{}";E(`A props object containing a "key" prop is being spread into JSX:
|
|
26
26
|
let props = %s;
|
|
27
27
|
<%s {...props} />
|
|
28
28
|
React keys must be passed directly to JSX without using spread:
|
|
29
29
|
let props = %s;
|
|
30
|
-
<%s key={someKey} {...props}
|
|
30
|
+
<%s key={someKey} {...props} />`,$e,z,Pr,z),Me[z+$e]=!0}}return r===s?_r(S):Sr(S),S}}function Fr(r,i,c){return Ve(r,i,c,!0)}function Tr(r,i,c){return Ve(r,i,c,!1)}var Or=Tr,Br=Fr;H.Fragment=s,H.jsx=Or,H.jsxs=Br}()),H}var qe;function Nr(){return qe||(qe=1,process.env.NODE_ENV==="production"?oe.exports=Mr():oe.exports=Vr()),oe.exports}var l=Nr();const t={white:"#FFFFFF",black:"#222222",gray50:"#FBFBFB",gray100:"#F7F8F9",gray200:"#EBEDF2",gray300:"#DADEE5",gray400:"#C6CBD3",gray500:"#BABFC9",gray600:"#A3A8B4",gray700:"#8A8F9D",gray800:"#6D717D",gray900:"#4A515D",blue100:"#F1F5FE",blue150:"#E4EBFF",blue200:"#CEDBFF",blue300:"#A7BFFF",blue400:"#7EA1FF",blue500:"#5884FF",blue600:"#3369FF",blue700:"#2B59D9",blue800:"#244BB5",blue900:"#1D3C91",red50:"#FFF1EF",red100:"#FFACAD",red200:"#FF8182",red300:"#FA4549",red400:"#CF222E",red500:"#82071E",orange50:"#FFF1E5",orange100:"#FFD0AA",orange200:"#FFB37D",orange300:"#FF8E40",orange400:"#E16F24",orange500:"#953800",green50:"#EFFDEE",green100:"#8AE3A1",green200:"#4DD470",green300:"#1CB854",green400:"#149E53",green500:"#086A49",yellow50:"#FEF9E6",yellow100:"#FADD78",yellow200:"#F7CC33",yellow300:"#F7B200",yellow400:"#CB9D26",yellow500:"#956B00"},W={small:{height:32,fontSize:1.6,fontWeights:["400","500","700"]},medium:{height:40,fontSize:1.8,fontWeights:["500","500","700"]},large:{height:48,fontSize:2,fontWeights:["700","700","700"]}},Y={full:5,round:.8,no:0},G={primary:{$mainColor:t.blue600,$hoverColor:t.blue700,$activeColor:t.white,$disabledColor:t.blue200},green:{$mainColor:t.green300,$hoverColor:t.green400,$activeColor:t.white,$disabledColor:t.green50},red:{$mainColor:t.red300,$hoverColor:t.red400,$activeColor:t.white,$disabledColor:t.red50},orange:{$mainColor:t.orange300,$hoverColor:t.orange400,$activeColor:t.white,$disabledColor:t.orange50},yellow:{$mainColor:t.yellow300,$hoverColor:t.yellow400,$activeColor:t.white,$disabledColor:t.yellow50},gray:{$mainColor:t.gray900,$hoverColor:t.black,$activeColor:t.black,$disabledColor:t.gray300}},Yr={primary:{$mainColor:t.blue600,$hoverColor:t.blue700,$activeColor:t.blue100,$disabledColor:t.blue300},green:{$mainColor:t.green300,$hoverColor:t.green400,$activeColor:t.green50,$disabledColor:t.green100},red:{$mainColor:t.red300,$hoverColor:t.red400,$activeColor:t.red50,$disabledColor:t.red100},orange:{$mainColor:t.orange300,$hoverColor:t.orange400,$activeColor:t.orange50,$disabledColor:t.orange100},yellow:{$mainColor:t.yellow300,$hoverColor:t.yellow400,$activeColor:t.yellow50,$disabledColor:t.yellow100},gray:{$mainColor:t.gray900,$hoverColor:t.black,$activeColor:t.gray100,$disabledColor:t.gray300}},Ue=e=>{const{children:o,baseColor:n="primary",level:s="small",borderRadius:d="round",pl:a=2,pr:u=2,width:f="fit-content",...h}=e,{height:m,fontSize:$,fontWeights:y}=W[s],x=Y[d],j=G[n];return l.jsx(qr,{$borderRadius:x,$height:m,$fontSize:$,$fontWeights:y,$pl:a,$pr:u,$width:f,...j,...h,children:o})},qr=p.default.button`
|
|
31
31
|
display: flex;
|
|
32
32
|
align-items: center;
|
|
33
33
|
justify-content: center;
|
|
@@ -53,7 +53,35 @@ React keys must be passed directly to JSX without using spread:
|
|
|
53
53
|
&:disabled {
|
|
54
54
|
background-color: ${({$disabledColor:e})=>e};
|
|
55
55
|
}
|
|
56
|
-
`,Ur=e=>{const{children:o,baseColor:
|
|
56
|
+
`,Ur=e=>{const{children:o,baseColor:n="primary",level:s="small",borderRadius:d="round",pl:a=2,pr:u=2,width:f="fit-content",isSelected:h,...m}=e,{height:$,fontSize:y,fontWeights:x}=W[s],j=Y[d],_=Yr[n];return l.jsx(Jr,{$borderRadius:j,$height:$,$fontSize:y,$fontWeights:x,$pl:a,$pr:u,$width:f,$isSelected:h,..._,...m,children:o})},Jr=p.default.button`
|
|
57
|
+
display: flex;
|
|
58
|
+
align-items: center;
|
|
59
|
+
justify-content: center;
|
|
60
|
+
transition: 0.1s linear;
|
|
61
|
+
transition-property: border-color, color, background-color;
|
|
62
|
+
cursor: pointer;
|
|
63
|
+
width: ${({$width:e})=>e};
|
|
64
|
+
|
|
65
|
+
background-color: ${({$activeColor:e})=>e};
|
|
66
|
+
color: ${({$mainColor:e})=>e};
|
|
67
|
+
|
|
68
|
+
font-size: ${({$fontSize:e})=>e}rem;
|
|
69
|
+
font-weight: ${({$fontWeights:e})=>e[0]};
|
|
70
|
+
border-radius: ${({$borderRadius:e})=>e}rem;
|
|
71
|
+
padding-right: ${({$pr:e})=>e}rem;
|
|
72
|
+
padding-left: ${({$pl:e})=>e}rem;
|
|
73
|
+
height: ${({$height:e})=>e}px;
|
|
74
|
+
|
|
75
|
+
&:hover:not([disabled]) {
|
|
76
|
+
color: ${({$hoverColor:e})=>e};
|
|
77
|
+
font-weight: ${({$fontWeights:e})=>e[1]};
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
&:disabled {
|
|
81
|
+
color: ${({$disabledColor:e})=>e};
|
|
82
|
+
background-color: ${({$activeColor:e})=>e};
|
|
83
|
+
}
|
|
84
|
+
`,Hr=e=>{const{children:o,baseColor:n="primary",level:s="small",borderRadius:d="round",pl:a=2,pr:u=2,width:f="fit-content",isSelected:h,...m}=e,{height:$,fontSize:y,fontWeights:x}=W[s],j=Y[d],_=G[n];return l.jsx(Gr,{$borderRadius:j,$height:$,$fontSize:y,$fontWeights:x,$pl:a,$pr:u,$width:f,$isSelected:h,..._,...m,children:o})},Gr=p.default.button`
|
|
57
85
|
display: flex;
|
|
58
86
|
align-items: center;
|
|
59
87
|
justify-content: center;
|
|
@@ -85,7 +113,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
85
113
|
background-color: ${t.white};
|
|
86
114
|
border: 1px solid ${({$disabledColor:e})=>e};
|
|
87
115
|
}
|
|
88
|
-
`,
|
|
116
|
+
`,Kr=e=>{const{children:o,baseColor:n="gray",level:s="small",borderRadius:d="round",pl:a=2,pr:u=2,width:f="fit-content",...h}=e,{height:m,fontSize:$,fontWeights:y}=W[s],x=Y[d],j=G[n];return l.jsx(Xr,{$borderRadius:x,$height:m,$fontSize:$,$fontWeights:y,$pl:a,$pr:u,$width:f,...j,...h,children:o})},Xr=p.default.button`
|
|
89
117
|
display: flex;
|
|
90
118
|
align-items: center;
|
|
91
119
|
justify-content: center;
|
|
@@ -95,8 +123,8 @@ React keys must be passed directly to JSX without using spread:
|
|
|
95
123
|
width: ${({$width:e})=>e};
|
|
96
124
|
|
|
97
125
|
background-color: ${t.white};
|
|
98
|
-
color: ${
|
|
99
|
-
border: 1px solid ${
|
|
126
|
+
color: ${t.gray900};
|
|
127
|
+
border: 1px solid ${({$mainColor:e})=>e};
|
|
100
128
|
font-size: ${({$fontSize:e})=>e}rem;
|
|
101
129
|
font-weight: ${({$fontWeights:e})=>e[0]};
|
|
102
130
|
border-radius: ${({$borderRadius:e})=>e}rem;
|
|
@@ -105,8 +133,8 @@ React keys must be passed directly to JSX without using spread:
|
|
|
105
133
|
height: ${({$height:e})=>e}px;
|
|
106
134
|
|
|
107
135
|
&:hover:not([disabled]) {
|
|
108
|
-
color: ${
|
|
109
|
-
border: 1px solid ${
|
|
136
|
+
color: ${t.black};
|
|
137
|
+
border: 1px solid ${({$hoverColor:e})=>e};
|
|
110
138
|
font-weight: ${({$fontWeights:e})=>e[1]};
|
|
111
139
|
}
|
|
112
140
|
|
|
@@ -114,7 +142,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
114
142
|
color: ${({$disabledColor:e})=>e};
|
|
115
143
|
border: 1px solid ${t.gray300};
|
|
116
144
|
}
|
|
117
|
-
`,
|
|
145
|
+
`,Qr=e=>{const{children:o,baseColor:n="gray",level:s="small",borderRadius:d="round",pl:a=2,pr:u=2,width:f="fit-content",isSelected:h,...m}=e,{height:$,fontSize:y,fontWeights:x}=W[s],j=Y[d],_=G[n];return l.jsx(Zr,{$borderRadius:j,$height:$,$fontSize:y,$fontWeights:x,$pl:a,$pr:u,$width:f,$isSelected:h,..._,...m,children:o})},Zr=p.default.button`
|
|
118
146
|
display: flex;
|
|
119
147
|
align-items: center;
|
|
120
148
|
justify-content: center;
|
|
@@ -124,7 +152,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
124
152
|
width: ${({$width:e})=>e};
|
|
125
153
|
|
|
126
154
|
background-color: ${t.white};
|
|
127
|
-
color: ${
|
|
155
|
+
color: ${({$isSelected:e,$mainColor:o,$hoverColor:n})=>e?n:o};
|
|
128
156
|
border: none;
|
|
129
157
|
font-size: ${({$fontSize:e})=>e}rem;
|
|
130
158
|
font-weight: ${({$fontWeights:e})=>e[0]};
|
|
@@ -135,12 +163,13 @@ React keys must be passed directly to JSX without using spread:
|
|
|
135
163
|
|
|
136
164
|
&:hover:not([disabled]) {
|
|
137
165
|
font-weight: ${({$fontWeights:e})=>e[1]};
|
|
166
|
+
color: ${({$hoverColor:e})=>e};
|
|
138
167
|
}
|
|
139
168
|
|
|
140
169
|
&:disabled {
|
|
141
170
|
color: ${({$disabledColor:e})=>e};
|
|
142
171
|
}
|
|
143
|
-
`,
|
|
172
|
+
`,Qe=e=>{const{theme:o="primary",...n}=e;switch(o){case"primary":return l.jsx(Ue,{...n});case"secondary":return l.jsx(Hr,{...n});case"tertiary":return l.jsx(Kr,{...n});case"text":return l.jsx(Qr,{...n});case"quaternary":return l.jsx(Ur,{...n});default:return l.jsx(Ue,{...n})}},et=e=>{const[o,n]=D.useState(!1);return D.useEffect(()=>{function s(d){e.current&&d.target instanceof HTMLElement&&!e.current.contains(d.target)&&n(!1)}return document.addEventListener("mousedown",s),()=>{document.removeEventListener("mousedown",s)}},[e,n]),[o,n]},be=({id:e,checked:o,name:n,required:s,children:d,disabled:a,onClickBox:u,...f})=>{const h=()=>u==null?void 0:u({name:n,checked:!o}),m=a?!1:o;return l.jsxs(rt,{$disabled:a,onClick:h,children:[l.jsx("input",{id:e,type:"checkbox",name:n,checked:m,required:s,disabled:a,readOnly:!0,...f}),l.jsx(ot,{htmlFor:e,disabled:a,children:m&&l.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:"14",height:"10",viewBox:"0 0 14 10",fill:"none",children:l.jsx("path",{d:"M1.5 5.30252L5.16667 9L12.5 1",stroke:"white","stroke-width":"1.5","stroke-linecap":"round","stroke-linejoin":"round"})})}),d&&l.jsx(tt,{onClick:h,htmlFor:e,$disabled:a,children:d})]})},rt=p.default.button`
|
|
144
173
|
/* 드래그 방지 */
|
|
145
174
|
-webkit-user-select: none;
|
|
146
175
|
-moz-user-select: none;
|
|
@@ -150,6 +179,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
150
179
|
align-items: center;
|
|
151
180
|
gap: 0.8rem;
|
|
152
181
|
flex: 1;
|
|
182
|
+
cursor: ${e=>!e.$disabled&&"pointer"};
|
|
153
183
|
input[type="checkbox"] {
|
|
154
184
|
display: none;
|
|
155
185
|
padding: 0;
|
|
@@ -174,7 +204,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
174
204
|
border: 1.5px solid ${t.blue600};
|
|
175
205
|
background-color: ${t.blue600};
|
|
176
206
|
}
|
|
177
|
-
`,
|
|
207
|
+
`,tt=p.default.label`
|
|
178
208
|
white-space: nowrap;
|
|
179
209
|
display: flex;
|
|
180
210
|
align-items: center;
|
|
@@ -184,12 +214,12 @@ React keys must be passed directly to JSX without using spread:
|
|
|
184
214
|
line-height: 135%;
|
|
185
215
|
font-style: normal;
|
|
186
216
|
color: ${({$disabled:e})=>e?t.gray500:t.gray900};
|
|
187
|
-
`,
|
|
217
|
+
`,ot=p.default.label`
|
|
188
218
|
display: flex;
|
|
189
219
|
align-items: center;
|
|
190
220
|
justify-content: center;
|
|
191
221
|
cursor: ${e=>!e.disabled&&"pointer"};
|
|
192
|
-
|
|
222
|
+
`,me=e=>{const{onClick:o,disabled:n,label:s,name:d,checked:a}=e,u=h=>o==null?void 0:o(h.target.checked,d),f=n?!1:a;return l.jsxs(nt,{children:[l.jsx(it,{type:"radio",name:d,checked:f,onChange:u,disabled:n}),l.jsx(at,{$checked:f,$disabled:n,children:f&&l.jsx(lt,{})}),s&&l.jsx(st,{$checked:f,$disabled:n,children:s})]})},nt=p.default.label`
|
|
193
223
|
/* 드래그 방지 */
|
|
194
224
|
-webkit-user-select: none;
|
|
195
225
|
-moz-user-select: none;
|
|
@@ -201,9 +231,9 @@ React keys must be passed directly to JSX without using spread:
|
|
|
201
231
|
width: auto;
|
|
202
232
|
gap: 0.8rem;
|
|
203
233
|
cursor: pointer;
|
|
204
|
-
`,
|
|
234
|
+
`,it=p.default.input`
|
|
205
235
|
display: none;
|
|
206
|
-
`,
|
|
236
|
+
`,at=p.default.div`
|
|
207
237
|
display: flex;
|
|
208
238
|
align-items: center;
|
|
209
239
|
justify-content: center;
|
|
@@ -226,7 +256,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
226
256
|
width: 13px;
|
|
227
257
|
height: 13px;
|
|
228
258
|
`}
|
|
229
|
-
`,
|
|
259
|
+
`,lt=p.default.div`
|
|
230
260
|
background-color: ${t.blue600};
|
|
231
261
|
border-radius: 100%;
|
|
232
262
|
width: 100%;
|
|
@@ -244,14 +274,14 @@ React keys must be passed directly to JSX without using spread:
|
|
|
244
274
|
transform: scale(0);
|
|
245
275
|
}
|
|
246
276
|
}
|
|
247
|
-
`,
|
|
277
|
+
`,st=p.default.div`
|
|
248
278
|
white-space: nowrap;
|
|
249
279
|
font-size: 1.8rem;
|
|
250
280
|
font-weight: 500;
|
|
251
281
|
line-height: 135%;
|
|
252
282
|
color: ${({$disabled:e,$checked:o})=>e&&!o?t.gray400:t.gray800};
|
|
253
283
|
transition: color 150ms;
|
|
254
|
-
`,
|
|
284
|
+
`,Ze=({size:e=24,color:o})=>l.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:e,height:e,viewBox:"0 0 24 24",fill:"none",children:l.jsx("path",{d:"M6 9L12 15L18 9",stroke:o||t.gray800,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})}),er=({size:e=24,color:o})=>l.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:e,height:e,viewBox:"0 0 24 24",fill:"none",children:l.jsx("path",{d:"M6 15L12 9L18 15",stroke:o||t.gray800,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})}),rr=e=>{const{children:o,baseColor:n="gray",level:s="small",borderRadius:d="round",width:a="fit-content",isOpen:u,isSelected:f,...h}=e,{height:m,fontSize:$,fontWeights:y}=W[s],x=Y[d],j=ct[s],_=G[n];return l.jsx(dt,{$borderRadius:x,$height:m,$fontSize:$,$fontWeights:y,$pl:j.default,$pr:j.iconSide,$width:a,$isOpen:u,$isSelected:f,..._,...h,children:o})},ct={small:{default:1.6,iconSide:.8},medium:{default:2,iconSide:1.2},large:{default:2,iconSide:1.6}},dt=p.default.button`
|
|
255
285
|
display: flex;
|
|
256
286
|
align-items: center;
|
|
257
287
|
justify-content: center;
|
|
@@ -282,10 +312,10 @@ React keys must be passed directly to JSX without using spread:
|
|
|
282
312
|
color: ${({$disabledColor:e})=>e};
|
|
283
313
|
border-color: ${t.gray300};
|
|
284
314
|
}
|
|
285
|
-
`,tr=
|
|
315
|
+
`,tr=p.default.div`
|
|
286
316
|
position: relative;
|
|
287
317
|
height: fit-content;
|
|
288
|
-
`,or=
|
|
318
|
+
`,or=p.default.div`
|
|
289
319
|
display: flex;
|
|
290
320
|
flex-direction: column;
|
|
291
321
|
z-index: 1;
|
|
@@ -300,7 +330,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
300
330
|
::-webkit-scrollbar {
|
|
301
331
|
display: none;
|
|
302
332
|
}
|
|
303
|
-
`,
|
|
333
|
+
`,ne=p.default.button`
|
|
304
334
|
display: flex;
|
|
305
335
|
flex: 1;
|
|
306
336
|
padding: 1.2rem;
|
|
@@ -313,7 +343,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
313
343
|
&:hover:not([disabled]) {
|
|
314
344
|
background-color: ${t.blue100};
|
|
315
345
|
}
|
|
316
|
-
`,
|
|
346
|
+
`,ut=({title:e,level:o="medium",type:n="checkbox",options:s=[],values:d=[],onChange:a,isAllChecked:u,allCheckText:f="전체선택"})=>{const h=D.useRef(null),[m,$]=et(h),{height:y}=W[o],x=d.length===0,j=s==null?void 0:s.map(R=>{const O=d.some(F=>F.value===R.value);switch(n){case"checkbox":{const F=()=>{if(O){const E=d.filter(L=>L.value!==R.value);return a==null?void 0:a(E)}else return a==null?void 0:a([...d,R])};return l.jsx(ne,{onClick:F,children:l.jsx(be,{checked:O,children:R.label})})}case"radio":{const F=()=>{a==null||a([R])};return l.jsx(ne,{onClick:F,children:l.jsx(me,{checked:O,label:R.label})})}case"select":{const F=()=>($(!1),O?a==null?void 0:a([]):a==null?void 0:a([R]));return l.jsx(ne,{onClick:F,$isSelected:O,children:R.label})}}});if(u&&n==="checkbox"){const R=(s==null?void 0:s.length)===(d==null?void 0:d.length),O=()=>R?a==null?void 0:a([]):a==null?void 0:a(s);j.unshift(l.jsx(ne,{onClick:O,children:l.jsx(be,{checked:R,children:f})}))}const _=()=>$(R=>!R);return l.jsxs(tr,{ref:h,children:[l.jsxs(rr,{isSelected:!x,onClick:_,borderRadius:"full",isOpen:m,level:o,children:[e,m?l.jsx(er,{color:!x&&t.white}):l.jsx(Ze,{color:!x&&t.white})]}),m&&l.jsx(or,{$top:y/10,children:j})]})},ft=({title:e,isSelected:o,level:n="medium",tooltipWidth:s,children:d,isOpen:a,onOpenFilter:u,onCloseFilter:f})=>{const{height:h}=W[n],m=()=>a?f():u();return l.jsxs(tr,{children:[l.jsxs(rr,{isSelected:o,onClick:m,borderRadius:"full",isOpen:a,level:n,children:[e,a?l.jsx(er,{color:o&&t.white}):l.jsx(Ze,{color:o&&t.white})]}),a&&l.jsx(or,{$width:s,$top:h/10,children:d})]})},ht=({size:e=1,direction:o="row"})=>l.jsx(gt,{$size:e,$direction:o}),gt=p.default.div`
|
|
317
347
|
display: flex;
|
|
318
348
|
flex-direction: ${({$direction:e})=>e};
|
|
319
349
|
|
|
@@ -322,7 +352,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
322
352
|
`:`
|
|
323
353
|
border-right: ${o}px solid ${t.gray300};
|
|
324
354
|
`}
|
|
325
|
-
`,K={small:{padding:.4},medium:{padding:1.2},large:{padding:1.6}},
|
|
355
|
+
`,K={small:{padding:.4},medium:{padding:1.2},large:{padding:1.6}},ie={primary:{$mainColor:t.blue600,$hoverColor:t.blue700,$activeColor:t.white},green:{$mainColor:t.green300,$hoverColor:t.green400,$activeColor:t.white},red:{$mainColor:t.red300,$hoverColor:t.red400,$activeColor:t.white},orange:{$mainColor:t.orange300,$hoverColor:t.orange400,$activeColor:t.white},yellow:{$mainColor:t.yellow300,$hoverColor:t.yellow400,$activeColor:t.white},gray:{$mainColor:t.gray900,$hoverColor:t.gray700,$activeColor:t.gray700}},pt={primary:{$mainColor:t.blue600,$hoverColor:t.blue150,$activeColor:t.blue100},green:{$mainColor:t.green300,$hoverColor:t.green50,$activeColor:t.green50},red:{$mainColor:t.red300,$hoverColor:t.red50,$activeColor:t.red50},orange:{$mainColor:t.orange300,$hoverColor:t.orange50,$activeColor:t.orange50},yellow:{$mainColor:t.yellow300,$hoverColor:t.yellow50,$activeColor:t.yellow50},gray:{$mainColor:t.gray900,$hoverColor:t.gray200,$activeColor:t.gray100}},$t=e=>{const{children:o,baseColor:n="gray",level:s="small",isRound:d=!1,...a}=e,{padding:u}=K[s],f=ie[n];return l.jsx(bt,{$isRound:d,$padding:u,...f,...a,children:o})},bt=p.default.button`
|
|
326
356
|
display: flex;
|
|
327
357
|
align-items: center;
|
|
328
358
|
justify-content: center;
|
|
@@ -337,28 +367,26 @@ React keys must be passed directly to JSX without using spread:
|
|
|
337
367
|
&:disabled {
|
|
338
368
|
opacity: 0.3;
|
|
339
369
|
}
|
|
340
|
-
`,
|
|
370
|
+
`,Je=e=>{const{children:o,baseColor:n="primary",level:s="small",isRound:d=!1,...a}=e,{padding:u}=K[s],f=ie[n];return l.jsx(mt,{$isRound:d,$padding:u,...f,...a,children:o})},mt=p.default.button`
|
|
341
371
|
display: flex;
|
|
342
372
|
align-items: center;
|
|
343
373
|
justify-content: center;
|
|
344
374
|
transition: 0.1s linear;
|
|
345
|
-
transition-property:
|
|
375
|
+
transition-property: background-color, border-color;
|
|
346
376
|
cursor: pointer;
|
|
347
377
|
|
|
348
|
-
background-color: ${t.white+66};
|
|
349
|
-
|
|
350
|
-
border: none;
|
|
351
378
|
border-radius: ${({$isRound:e})=>e?"100%":"0.8rem"};
|
|
352
379
|
padding: ${({$padding:e})=>e}rem;
|
|
380
|
+
background-color: ${({$mainColor:e})=>e};
|
|
353
381
|
|
|
354
382
|
&:hover:not([disabled]) {
|
|
355
|
-
background-color: ${
|
|
383
|
+
background-color: ${({$hoverColor:e})=>e};
|
|
356
384
|
}
|
|
357
385
|
|
|
358
386
|
&:disabled {
|
|
359
387
|
opacity: 0.3;
|
|
360
388
|
}
|
|
361
|
-
`,
|
|
389
|
+
`,vt=e=>{const{children:o,baseColor:n="primary",level:s="small",isRound:d=!1,...a}=e,{padding:u}=K[s],f=pt[n];return l.jsx(yt,{$isRound:d,$padding:u,...f,...a,children:o})},yt=p.default.button`
|
|
362
390
|
display: flex;
|
|
363
391
|
align-items: center;
|
|
364
392
|
justify-content: center;
|
|
@@ -368,7 +396,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
368
396
|
|
|
369
397
|
border-radius: ${({$isRound:e})=>e?"100%":"0.8rem"};
|
|
370
398
|
padding: ${({$padding:e})=>e}rem;
|
|
371
|
-
background-color: ${({$
|
|
399
|
+
background-color: ${({$activeColor:e})=>e};
|
|
372
400
|
|
|
373
401
|
&:hover:not([disabled]) {
|
|
374
402
|
background-color: ${({$hoverColor:e})=>e};
|
|
@@ -377,7 +405,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
377
405
|
&:disabled {
|
|
378
406
|
opacity: 0.3;
|
|
379
407
|
}
|
|
380
|
-
`,
|
|
408
|
+
`,xt=e=>{const{children:o,baseColor:n="primary",level:s="small",isRound:d=!1,...a}=e,{padding:u}=K[s],f=ie[n];return l.jsx(wt,{$isRound:d,$padding:u,...f,...a,children:o})},wt=p.default.button`
|
|
381
409
|
display: flex;
|
|
382
410
|
align-items: center;
|
|
383
411
|
justify-content: center;
|
|
@@ -398,7 +426,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
398
426
|
&:disabled {
|
|
399
427
|
opacity: 0.3;
|
|
400
428
|
}
|
|
401
|
-
`,
|
|
429
|
+
`,Ct=e=>{const{children:o,baseColor:n="gray",level:s="small",isRound:d=!1,...a}=e,{padding:u}=K[s],f=ie[n];return l.jsx(jt,{$isRound:d,$padding:u,...f,...a,children:o})},jt=p.default.button`
|
|
402
430
|
display: flex;
|
|
403
431
|
align-items: center;
|
|
404
432
|
justify-content: center;
|
|
@@ -407,19 +435,19 @@ React keys must be passed directly to JSX without using spread:
|
|
|
407
435
|
cursor: pointer;
|
|
408
436
|
|
|
409
437
|
background-color: ${t.white};
|
|
410
|
-
border: 1px solid ${
|
|
438
|
+
border: 1px solid ${({$mainColor:e})=>e};
|
|
411
439
|
border-radius: ${({$isRound:e})=>e?"100%":"0.8rem"};
|
|
412
440
|
padding: ${({$padding:e})=>e}rem;
|
|
413
441
|
|
|
414
442
|
&:hover:not([disabled]) {
|
|
415
443
|
color: ${({$hoverColor:e})=>e};
|
|
416
|
-
border: 1px solid ${
|
|
444
|
+
border: 1px solid ${({$hoverColor:e})=>e};
|
|
417
445
|
}
|
|
418
446
|
|
|
419
447
|
&:disabled {
|
|
420
448
|
opacity: 0.3;
|
|
421
449
|
}
|
|
422
|
-
`,
|
|
450
|
+
`,kt=e=>{const{theme:o="primary",...n}=e;switch(o){case"primary":return l.jsx(Je,{...n});case"secondary":return l.jsx(xt,{...n});case"tertiary":return l.jsx(Ct,{...n});case"onlyIcon":return l.jsx($t,{...n});case"quaternary":return l.jsx(vt,{...n});default:return l.jsx(Je,{...n})}},Rt=({children:e,iconPosition:o="right",icon:n,level:s="small",...d})=>{const a=o==="right",u=Et[s];return l.jsxs(Qe,{...d,pl:a?u.default:u.iconSide,pr:a?u.iconSide:u.default,level:s,children:[!a&&l.jsx(He,{$isRight:a,$disabled:d.disabled,children:n}),e,a&&l.jsx(He,{$isRight:a,$disabled:d.disabled,children:n})]})},He=p.default.div`
|
|
423
451
|
display: flex;
|
|
424
452
|
align-items: center;
|
|
425
453
|
justify-content: center;
|
|
@@ -427,22 +455,22 @@ React keys must be passed directly to JSX without using spread:
|
|
|
427
455
|
margin-right: ${({$isRight:e})=>!e&&.4}rem;
|
|
428
456
|
gap: 0.4rem;
|
|
429
457
|
opacity: ${({$disabled:e})=>e?.3:1};
|
|
430
|
-
`,
|
|
458
|
+
`,Et={small:{default:1.6,iconSide:.8},medium:{default:2,iconSide:1.2},large:{default:2,iconSide:1.6}},St=(e,o=600)=>{let n;return function(){n||(n=setTimeout(()=>{n=null,e()},o))}},nr=(e,o)=>{const[n,s]=D.useState({width:void 0,height:void 0}),d=D.useMemo(()=>St(()=>{if(e!=null&&e.current){const{width:a,height:u}=e.current.getBoundingClientRect();(n.width!==a||n.height!==u)&&s({width:a,height:u})}},50),[e,n.height,n.width]);return D.useEffect(()=>{const a=new ResizeObserver(()=>d());return e!=null&&e.current&&a.observe(e.current),d(),()=>{a.disconnect()}},[d,e,o]),[n.width,n.height]},_t=/^\d+$/,Ft=/^-?\d+(\.\d+)?$/,Ge=e=>_t.test(e),Tt=e=>Ft.test(String(Number(e))),Ke=({targetValue:e,min:o,max:n})=>{const s=Number(e||0),d=o!==void 0,a=n!==void 0,u=d?s>=o:!0,f=a?s<=n:!0;return u&&f},Ot=({e,min:o,max:n})=>{var u,f,h,m,$;const s=Ge(e.target.value)||Tt(e.target.value),a=((f=(u=e==null?void 0:e.target)==null?void 0:u.value)==null?void 0:f[0])==="-"&&(o===void 0||o<0);if(s){if(!Ke({targetValue:e.target.value,min:o,max:n}))return!1}else if(a){const y=Ke({targetValue:e.target.value,min:o,max:n}),x=((h=e==null?void 0:e.target)==null?void 0:h.value)==="-",j=(m=e==null?void 0:e.target)==null?void 0:m.value.substring(1);if((!Ge(j)||!y)&&!x)return!1}else if(($=e==null?void 0:e.target)!=null&&$.value)return!1;return!0},Bt=({unit:e,type:o,onChange:n,min:s,max:d,width:a,label:u,level:f="large",value:h,disabled:m,errorMessage:$,successMessage:y,guideMessage:x,required:j,onCancel:_,...R})=>{const[O,F]=D.useState(!1),E=D.useRef(null),[L]=nr(E,[e,O]),ae=!!h||h===0,X=o==="number",Q=f==="small",le=M=>{X&&!Ot({e:M,min:s,max:d})||n==null||n(M)};return l.jsxs(zt,{$width:a,children:[u&&l.jsxs(Vt,{$gap:.4,children:[j&&l.jsx(Nt,{children:"*"}),u]}),l.jsxs(Pt,{children:[l.jsx(It,{type:X?"text":o,onChange:le,$isSmall:Q,$pr:L?L/10:2+(O&&_&&2.4),value:ae?h:"",disabled:m,$isError:!!$,$isSuccess:!!y,onFocus:()=>F(!0),onBlur:()=>F(!1),...R}),(e||O)&&l.jsxs(Lt,{$isSmall:Q,ref:E,children:[O&&_&&l.jsx(Mt,{$isRight:!0,onClick:()=>_(R==null?void 0:R.name),onMouseDown:M=>M.preventDefault(),children:l.jsx(Yt,{children:l.jsx("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:l.jsxs("g",{id:"Frame 48096259",children:[l.jsx("circle",{id:"Ellipse 52",cx:"9",cy:"9",r:"9",fill:"#DADEE5"}),l.jsx("path",{id:"Vector",d:"M5 5L13 13",stroke:"white","stroke-width":"1.5","stroke-linecap":"round","stroke-linejoin":"round"}),l.jsx("path",{id:"Vector_2",d:"M13 5L5 13",stroke:"white","stroke-width":"1.5","stroke-linecap":"round","stroke-linejoin":"round"})]})})})}),e]})]}),$&&l.jsx(Dt,{children:$}),y&&l.jsx(At,{children:y}),x&&l.jsx(Wt,{children:x})]})},Pt=p.default.span`
|
|
431
459
|
display: flex;
|
|
432
460
|
position: relative;
|
|
433
|
-
`,
|
|
461
|
+
`,Dt=p.default.label`
|
|
434
462
|
color: ${t.red300};
|
|
435
463
|
font-size: 1.2rem;
|
|
436
464
|
padding: 0 0.8rem;
|
|
437
|
-
`,
|
|
465
|
+
`,At=p.default.label`
|
|
438
466
|
color: ${t.green300};
|
|
439
467
|
font-size: 1.2rem;
|
|
440
468
|
padding: 0 0.8rem;
|
|
441
|
-
`,
|
|
469
|
+
`,Wt=p.default.label`
|
|
442
470
|
color: ${t.gray700};
|
|
443
471
|
font-size: 1.2rem;
|
|
444
472
|
padding: 0 0.8rem;
|
|
445
|
-
`,
|
|
473
|
+
`,It=p.default.input`
|
|
446
474
|
font-family: "Pretendard";
|
|
447
475
|
width: auto;
|
|
448
476
|
font-size: 1.6rem;
|
|
@@ -479,7 +507,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
479
507
|
${({$isSmall:e})=>e?ir:ar}
|
|
480
508
|
|
|
481
509
|
padding-right: ${({$pr:e})=>e}rem;
|
|
482
|
-
`,
|
|
510
|
+
`,zt=p.default.div`
|
|
483
511
|
display: flex;
|
|
484
512
|
flex-direction: column;
|
|
485
513
|
width: auto;
|
|
@@ -488,7 +516,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
488
516
|
color: ${t.gray900};
|
|
489
517
|
flex: 1;
|
|
490
518
|
width: ${({$width:e})=>e??"100%"};
|
|
491
|
-
`,
|
|
519
|
+
`,Lt=p.default.div`
|
|
492
520
|
position: absolute;
|
|
493
521
|
display: flex;
|
|
494
522
|
align-items: center;
|
|
@@ -499,7 +527,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
499
527
|
|
|
500
528
|
padding-left: 0.8rem;
|
|
501
529
|
gap: 0.4rem;
|
|
502
|
-
`,
|
|
530
|
+
`,Mt=p.default.div`
|
|
503
531
|
cursor: pointer;
|
|
504
532
|
`,ir=`
|
|
505
533
|
padding: 0 1.2rem;
|
|
@@ -507,24 +535,24 @@ React keys must be passed directly to JSX without using spread:
|
|
|
507
535
|
`,ar=`
|
|
508
536
|
padding: 0 1.2rem;
|
|
509
537
|
height: 4.8rem;
|
|
510
|
-
`,
|
|
538
|
+
`,Vt=p.default.div`
|
|
511
539
|
display: flex;
|
|
512
540
|
gap: ${({$gap:e})=>e}rem;
|
|
513
|
-
`,
|
|
541
|
+
`,Nt=p.default.div`
|
|
514
542
|
color: ${t.red300};
|
|
515
|
-
`,
|
|
543
|
+
`,Yt=p.default.div`
|
|
516
544
|
display: flex;
|
|
517
545
|
flex: 1;
|
|
518
546
|
flex-direction: column;
|
|
519
547
|
align-items: center;
|
|
520
548
|
justify-content: center;
|
|
521
549
|
padding: 0.4rem;
|
|
522
|
-
`,
|
|
550
|
+
`,qt=({width:e,level:o="large",value:n,disabled:s,onCancel:d,...a})=>{const[u,f]=D.useState(!1),h=D.useRef(null),m=D.useRef(null),[$]=nr(h),y=o==="small";return l.jsxs(Ut,{$isSmall:y,$width:e,children:[l.jsx(Jt,{ref:h,children:l.jsx("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:l.jsx("g",{id:"ic/search",children:l.jsx("path",{id:"Vector",d:"M21 21L15 15M3 10C3 10.9193 3.18106 11.8295 3.53284 12.6788C3.88463 13.5281 4.40024 14.2997 5.05025 14.9497C5.70026 15.5998 6.47194 16.1154 7.32122 16.4672C8.1705 16.8189 9.08075 17 10 17C10.9193 17 11.8295 16.8189 12.6788 16.4672C13.5281 16.1154 14.2997 15.5998 14.9497 14.9497C15.5998 14.2997 16.1154 13.5281 16.4672 12.6788C16.8189 11.8295 17 10.9193 17 10C17 9.08075 16.8189 8.1705 16.4672 7.32122C16.1154 6.47194 15.5998 5.70026 14.9497 5.05025C14.2997 4.40024 13.5281 3.88463 12.6788 3.53284C11.8295 3.18106 10.9193 3 10 3C9.08075 3 8.1705 3.18106 7.32122 3.53284C6.47194 3.88463 5.70026 4.40024 5.05025 5.05025C4.40024 5.70026 3.88463 6.47194 3.53284 7.32122C3.18106 8.1705 3 9.08075 3 10Z",stroke:"#A3A8B4","stroke-width":"1.5","stroke-linecap":"round","stroke-linejoin":"round"})})})}),l.jsx(Gt,{ref:m,onFocus:()=>f(!0),onBlur:()=>f(!1),type:"text",value:n,disabled:s,$paddingLeft:$?$/10:void 0,$paddingRight:1.2+(u&&d&&3.2),$isSmall:y,...a}),u&&d&&l.jsx(Ht,{$isRight:!0,onClick:()=>d(a==null?void 0:a.name),onMouseDown:x=>x.preventDefault(),children:l.jsx(Kt,{children:l.jsx("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:l.jsxs("g",{id:"Frame 48096259",children:[l.jsx("circle",{id:"Ellipse 52",cx:"9",cy:"9",r:"9",fill:"#DADEE5"}),l.jsx("path",{id:"Vector",d:"M5 5L13 13",stroke:"white","stroke-width":"1.5","stroke-linecap":"round","stroke-linejoin":"round"}),l.jsx("path",{id:"Vector_2",d:"M13 5L5 13",stroke:"white","stroke-width":"1.5","stroke-linecap":"round","stroke-linejoin":"round"})]})})})})]})},Ut=p.default.div`
|
|
523
551
|
display: flex;
|
|
524
552
|
position: relative;
|
|
525
553
|
height: ${({$isSmall:e})=>e?3.2:4.8}rem;
|
|
526
554
|
width: ${({$width:e})=>e??"100%"};
|
|
527
|
-
`,
|
|
555
|
+
`,Jt=p.default.div`
|
|
528
556
|
position: absolute;
|
|
529
557
|
display: flex;
|
|
530
558
|
align-items: center;
|
|
@@ -533,14 +561,14 @@ React keys must be passed directly to JSX without using spread:
|
|
|
533
561
|
padding: 0rem 0.4rem 0rem 1.2rem;
|
|
534
562
|
top: 50%;
|
|
535
563
|
transform: translateY(-50%);
|
|
536
|
-
`,
|
|
564
|
+
`,Ht=p.default.div`
|
|
537
565
|
position: absolute;
|
|
538
566
|
right: 0;
|
|
539
567
|
padding: 0rem 1.2rem 0rem 0.4rem;
|
|
540
568
|
top: 50%;
|
|
541
569
|
transform: translateY(-50%);
|
|
542
570
|
cursor: pointer;
|
|
543
|
-
`,
|
|
571
|
+
`,Gt=p.default.input`
|
|
544
572
|
font-family: "Pretendard";
|
|
545
573
|
width: auto;
|
|
546
574
|
font-size: ${({$isSmall:e})=>e?"1.6rem":"1.8rem"};
|
|
@@ -571,14 +599,14 @@ React keys must be passed directly to JSX without using spread:
|
|
|
571
599
|
background-color: ${t.gray50};
|
|
572
600
|
color: ${t.gray300};
|
|
573
601
|
}
|
|
574
|
-
`,
|
|
602
|
+
`,Kt=p.default.div`
|
|
575
603
|
display: flex;
|
|
576
604
|
flex: 1;
|
|
577
605
|
flex-direction: column;
|
|
578
606
|
align-items: center;
|
|
579
607
|
justify-content: center;
|
|
580
608
|
padding: 0.4rem;
|
|
581
|
-
`,
|
|
609
|
+
`,Xt=({options:e,value:o,onClick:n,disabled:s})=>{const d=e.map(a=>{const u=a.value===o.value,f=()=>n(a);return l.jsx(me,{checked:u,label:a.label,name:a.value,onClick:f,disabled:s},a.value)});return l.jsx(Qt,{gap:2,children:d})},Qt=p.default.div`
|
|
582
610
|
display: flex;
|
|
583
611
|
gap: ${e=>e.gap}rem;
|
|
584
|
-
`;exports.Button=
|
|
612
|
+
`;exports.Button=Qe;exports.ButtonFilter=ut;exports.Checkbox=be;exports.CustomButtonFilter=ft;exports.Divider=ht;exports.IconButton=kt;exports.IconWithButton=Rt;exports.Input=Bt;exports.RadioButton=me;exports.RadioButtons=Xt;exports.SearchInput=qt;exports.themeColors=t;
|