@legion-ui-kit/react-core
Version:
<div align="center"> <img height="108" width="116" src="https://legion.digitaltelkom.id/favicon.svg?v=4643a71fb65fa61a5f2b266b769ea7b1" /> <h1 align="center">Legion UI Kit - React Core</h1> </div>
3 lines (2 loc) • 2.56 kB
JavaScript
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),l=require("classnames"),s=require("./styles/styles.module.scss.cjs"),a=require("../Icon/index.cjs"),i=require("../../helpers/typography.cjs"),r=require("./TextField.constant.cjs"),c=require("../Icon/Icon.constant.cjs");function n(e){return e&&e.__esModule?e:{default:e}}var u=n(l);exports.default=l=>{const{block:n,caption:d,captionClassName:f,captionStyle:o,className:_,disabled:p,hint:x,hintClassName:N,hintStyle:h,iconLeft:m,iconLeftClassName:y,iconLeftStyle:T,iconRight:j,iconRightClassName:E,iconRightStyle:S,id:I,inputClassName:b,inputStyle:C,inputWrapperClassName:g,inputWrapperStyle:L,label:F,labelClassName:A,labelStyle:v,placeholder:D,prefix:q,prefixClassName:w,prefixStyle:O,size:P=r.TEXT_FIELD_DEFAULT_PROPS.size,status:R=r.TEXT_FIELD_DEFAULT_PROPS.status,style:X,suffix:M,suffixClassName:U,suffixStyle:k,variant:z=r.TEXT_FIELD_DEFAULT_PROPS.variant,...W}=l,V=t.useId(),$=I||`legion_textfield_${i.kebabCase(V)}`,B=z===r.TEXT_FIELD_VARIANT.outline,G=u.default(s.default.legion_text_field,_,s.default[P],s.default[R],{[s.default.block]:n,[s.default.disabled]:p,[s.default[z]]:z}),H=u.default(s.default.text_field_caption,f),J=u.default(s.default.text_field_hint,N),K=u.default(s.default.text_field_input,b),Q=u.default(s.default.input_wrapper,g),Y=u.default(s.default.text_field_label,A),Z=u.default(s.default.icon_left,y),ee=u.default(s.default.icon_right,E),te=u.default(s.default.input_prefix,w),le=u.default(s.default.input_suffix,U),se=(e=>{switch(e){case r.TEXT_FIELD_STATUS.error:return c.ICON_NAME["error-triangle"];case r.TEXT_FIELD_STATUS.success:return c.ICON_NAME["success-circle"];default:return c.ICON_NAME["info-circle"]}})(R);return e.jsxs("div",{className:G,style:X,children:[F&&e.jsx("label",{htmlFor:$,className:Y,style:v,children:F}),e.jsxs("div",{className:Q,style:L,children:[q&&e.jsx("span",{className:te,style:O,children:q}),m&&e.jsx("span",{className:Z,style:T,children:m}),e.jsx("input",{className:K,id:$,placeholder:D,disabled:p,style:C,...W}),B&&e.jsx("svg",{className:s.default.text_field_outline,xmlns:"http://www.w3.org/2000/svg",children:e.jsx("rect",{height:"100%",width:"100%",fill:"none"})}),j&&e.jsx("span",{className:ee,style:S,children:j}),M&&e.jsx("span",{className:le,style:k,children:M})]}),d&&e.jsxs("p",{className:H,style:o,children:[e.jsx(a.default,{className:s.default.caption_icon,icon:se}),d]}),x&&e.jsx("p",{className:J,style:h,children:x})]})};
//# sourceMappingURL=index.cjs.map