monica-alexandria 3.2.21 → 3.3.0

package/src/export/components/button/Main_.js

@@ -25,8 +25,8 @@ const Main = styled(Button)`
 export const Main_ = (props) => {
   return (
     <Main className={props.className} size={props.size} onClick={props.onClick}>
-        {props.svgLeft ?
-            <IconSvg Icon={props.svgLeft} />
+        {props.iconLeft ?
+            <IconSvg Icon={props.iconLeft} />
         :
             null
         }
@@ -35,8 +35,8 @@ export const Main_ = (props) => {
         :
             null
         }
-        {props.svgRight ?
-            <IconSvg Icon={props.svgRight} />
+        {props.iconRight ?
+            <IconSvg Icon={props.iconRight} />
         :
             null
         }

package/src/export/components/button/Main_Plain.js

@@ -30,8 +30,8 @@ const MainPlain = styled(Button)`
 export const Main_Plain = (props) => {
   return (
     <MainPlain noPadding={props.noPadding} size={props.size} onClick={props.onClick}>
-        {props.svgLeft ?
-            <IconSvg Icon={props.svgLeft} />
+        {props.iconLeft ?
+            <IconSvg Icon={props.iconLeft} />
         :
             null
         }
@@ -40,8 +40,8 @@ export const Main_Plain = (props) => {
         :
             null
         }
-        {props.svgRight ?
-            <IconSvg Icon={props.svgRight} />
+        {props.iconRight ?
+            <IconSvg Icon={props.iconRight} />
         :
             null
         }

package/src/export/components/button/White_Plain.js

@@ -30,8 +30,8 @@ const WhitePlain = styled(Button)`
 export const White_Plain = (props) => {
   return (
     <WhitePlain size={props.size} onClick={props.onClick}>
-        {props.svgLeft ?
-            <IconSvg Icon={props.svgLeft} />
+        {props.iconLeft ?
+            <IconSvg Icon={props.iconLeft} />
         :
             null
         }
@@ -40,8 +40,8 @@ export const White_Plain = (props) => {
         :
             null
         }
-        {props.svgRight ?
-            <IconSvg Icon={props.svgRight} />
+        {props.iconRight ?
+            <IconSvg Icon={props.iconRight} />
         :
             null
         }

package/src/export/components/card/On_Click_Card.js

@@ -84,34 +84,34 @@ const JobCard = styled.div`
 export const On_Click_Card = (props) => {
   return (
     <OnClickCard variant_CardText={props.variant_CardText} onClick={props.onClick}>
-        {props.svg_Card || props.text_Card || props.img_SmallCard ?
+        {props.icon || props.header || props.imgSmall ?
             <header>
-                {props.svg_Card ?
+                {props.icon ?
                     <figure>
-                        <IconSvg Icon={props.svg_Card}/>
+                        <IconSvg Icon={props.icon}/>
                     </figure>
-                :props.img_SmallCard ?
+                :props.imgSmall ?
                     <OnClickSmallImg>
-                        <img src={props.img_SmallCard}/>
+                        <img src={props.imgSmall}/>
                     </OnClickSmallImg>
                 :
-                    <span>{props.text_Card}</span>
+                    <span>{props.header}</span>
                 } 
             </header>
-        :props.img_Card ?
+        :props.img ?
             <picture>
-                <img src={props.img_Card}/>
+                <img src={props.img}/>
             </picture>
         :
             null
         }
-        {props.text_CardTitle || props.text_CardSub ?
+        {props.title || props.subtitle ?
             <footer>
-                {props.text_CardTitle &&
-                    <h2>{props.text_CardTitle}</h2>
+                {props.title &&
+                    <h2>{props.title}</h2>
                 }
-                {props.text_CardSub &&
-                    <h5>{props.text_CardSub}</h5>
+                {props.subtitle &&
+                    <h5>{props.subtitle}</h5>
                 }
                 {props.children}
             </footer>

package/src/export/components/confirmation/Confirmation_.js

@@ -49,17 +49,17 @@ export const Confirmation_ = (props) => {
     return (
       <Confirmation>
           <ConfirmationContainer>
-              <h4>{props.text_Confirmation}</h4>
+              <h4>{props.message}</h4>
               <ConfirmationActions>
                   <Main_ 
-                      onClick = {props.onClick_Primary}
-                      svgLeft = {props.icon_Primary}
-                      text = {props.text_Primary}
+                      onClick = {props.onClick_Main}
+                      iconLeft = {props.icon_Main}
+                      text = {props.text_Main}
                   />
                   <Main_Plain 
-                      onClick = {props.onClick_Secondary}
-                      svgLeft = {props.icon_Secondary}
-                      text = {props.text_Secondary}
+                      onClick = {props.onClick_MainPlain}
+                      iconLeft = {props.icon_MainPlain}
+                      text = {props.text_MainPlain}
                   />
               </ConfirmationActions>
           </ConfirmationContainer>

package/src/export/components/form/Builder_.js

@@ -12,8 +12,8 @@ const Builder = styled.div`
 export const Builder_ = (props) => {
     return (
       <Builder key = {props.key}>
-          {props.text_BuilderTitle ?
-            <h4>{props.text_BuilderTitle}</h4>
+          {props.title ?
+            <h4>{props.title}</h4>
           :
             null
           }

package/src/export/components/form/Checkbox_.js

@@ -84,26 +84,26 @@ const Check = styled.div`
 
 const CheckboxInput = styled.div`
     input{
-        opacity: ${p => p.bool_Checked === true ? '1' : '0.4'};
-        cursor: ${p => p.bool_Checked === true ? 'auto' : 'not-allowed !important'};
+        opacity: ${p => p.checked === true ? '1' : '0.4'};
+        cursor: ${p => p.checked === true ? 'auto' : 'not-allowed !important'};
     }
 `
 
 export const Checkbox_ = (props) => {
   return (
     <Checkbox key={props.key}>
-        {props.variant_Input ?
-        <CheckboxInput bool_Checked = {props.bool_Checked}>
+        {props.withInput ?
+        <CheckboxInput checked = {props.checked}>
             <Input_ 
-                text_Placeholder = {props.text_CheckboxPlaceholder}
-                bool_DisabledInput = {props.bool_Checked ? false : true}
+                placeholder = {props.placeholder}
+                disableInput = {props.checked ? false : true}
             />
         </CheckboxInput>
         :
-            <label for={props.id_Checkbox}><p>{props.text_CheckboxLabel}</p></label>
+            <label for={props.id}><p>{props.text_CheckboxLabel}</p></label>
         }
         <Check className='Check'>
-            <input type="checkbox" id={props.id_Checkbox} checked = {props.bool_Checked} onClick={props.onClick_Checkbox}/>
+            <input type="checkbox" id={props.id} checked = {props.checked} onClick={props.onClick}/>
             <span className='CheckCustom'></span>
             <IconSvg Icon='Check' class_Icon='CheckIcon'/>
         </Check>

package/src/export/components/form/Dropdown_.js

@@ -41,9 +41,9 @@ export const Dropdown_ = (props) => {
   return (
     <Dropdown>
         <IconSvg Icon="Dropdown" class_Icon="Dropdown_IconAdapt"/>
-        {props.array_Dropdown ?
-            <select className = {props.class_Select}>
-                {props.array_Dropdown.map ((option, i) => 
+        {props.items ?
+            <select className = {props.className} onChange = {props.onChange} defaultValue = {props.defaultValue}>
+                {props.items.map ((option, i) => 
                     <option key={i}>{option}</option>
                 )}
             </select>

package/src/export/components/form/Elastic_Search.js

@@ -63,7 +63,7 @@ export const Elastic_Search = (props) => {
         address: 0,
         minMatchCharLength: 1,
         ignoreLocation: false,
-        keys: [props.key_SuggestionType] /* Μπορουμε να παιξουμε μπαλα και με αλλα attributes εννοειται όπως τα gigs! */,
+        keys: [props.suggestionType] /* Μπορουμε να παιξουμε μπαλα και με αλλα attributes εννοειται όπως τα gigs! */,
     };
 
     let file = props.json_File;
@@ -72,7 +72,7 @@ export const Elastic_Search = (props) => {
         query: "",
         file,
         notfoundmessage: false,
-        defaultValue : props.text_DefaultValue
+        defaultValue : props.defaultValue
     })
 
     const [suggestions, setsuggestions] = useState(false)
@@ -80,7 +80,7 @@ export const Elastic_Search = (props) => {
 
     const send_clicked_suggestion = (suggestion) => {
         props.onSuggestions(suggestion);
-        setCurrentSearch({...currentSearch, query:'', defaultValue:typeof(suggestion) == 'string' ? suggestion : suggestion[props.key_SuggestionType]})  
+        setCurrentSearch({...currentSearch, query:'', defaultValue:typeof(suggestion) == 'string' ? suggestion : suggestion[props.suggestionType]})  
     }
 
     const send_input_suggestion = () =>{
@@ -106,7 +106,7 @@ export const Elastic_Search = (props) => {
         }
         if((e.key) && e.key==='Enter'){
             e.preventDefault();
-            send_clicked_suggestion(typeof(suggestions[highlighted]) == 'string' ? suggestions[highlighted] : suggestions[highlighted][props.key_SuggestionType])
+            send_clicked_suggestion(typeof(suggestions[highlighted]) == 'string' ? suggestions[highlighted] : suggestions[highlighted][props.suggestionType])
         }  
     }
 
@@ -132,8 +132,6 @@ export const Elastic_Search = (props) => {
       send_input_suggestion();
     },[suggestions]) 
 
-    console.log(currentSearch.defaultValue);
-
   return (
     <ElasticSearch>
         <ElasticInput 
@@ -141,22 +139,22 @@ export const Elastic_Search = (props) => {
             autoComplete="off"
             type="text"
             value = {props.value}
-            placeholder={props.text_Placeholder}
+            placeholder={props.placeholder}
             onChange={onChange}
             defaultValue={currentSearch.defaultValue}
             onKeyPress={(e) => detectEnter(e)}
             onKeyDown={(e) => detectEnter(e)}
-            variant_List = {props.variant_List}
+            list = {props.list}
         />
-        <ElasticLabel>{props.text_Placeholder}</ElasticLabel>
-        {props.bool_Required ?
+        <ElasticLabel>{props.placeholder}</ElasticLabel>
+        {props.required ?
           <ValidatorRequired className='ValidatorRequired'>
               <IconSvg Icon='Asterisk' />
           </ValidatorRequired>
         :
           null
         }
-        {props.variant_List ?  
+        {props.list ?  
           <Main_ 
               variant_Size = 'small'
               text_Button = {props.text_AddToList}
@@ -170,25 +168,25 @@ export const Elastic_Search = (props) => {
         {currentSearch.query && suggestions ?
             <ElasticSuggestions>
                 {suggestions.slice(0,6).map((suggestion,i)=>(
-                    <li className={i=== highlighted % suggestions.length ? "ElasticSelected": ""} key={i} onClick={() => send_clicked_suggestion(suggestion?.item ? suggestion.item[props.key_SuggestionType]: suggestion[props.key_SuggestionType])}>
-                        <p>{suggestion?.item? suggestion.item[props.key_SuggestionType]: suggestion[props.key_SuggestionType]}</p>
+                    <li className={i=== highlighted % suggestions.length ? "ElasticSelected": ""} key={i} onClick={() => send_clicked_suggestion(suggestion?.item ? suggestion.item[props.suggestionType]: suggestion[props.suggestionType])}>
+                        <p>{suggestion?.item? suggestion.item[props.suggestionType]: suggestion[props.suggestionType]}</p>
                     </li>
                 ))}
             </ElasticSuggestions>  
         :
             null
         }
-        {props.variant_List ?
+        {props.list ?
           <ElasticList>
-                <h5>{props.text_Selecteditems}</h5>
-                {props.array_List.map((item) => 
+                <h5>{props.listItemTitle}</h5>
+                {props.list.map((item) => 
                     <li>
-                        <IconSvg Icon={props.icon_List} />
+                        <IconSvg Icon={props.icon_ListItem} />
                         <h6>{item}</h6>
                         <Delete_Plain 
                             variant_Size = 'small'
                             icon_Left = 'Delete'
-                            onClick = {props.onCLick_ListDelete}
+                            onClick = {props.onClick_ListItemDelete}
                         />
                     </li>
                 )}

package/src/export/components/form/Input_.js

@@ -9,39 +9,39 @@ export const Input_ = (props) => {
     <FormGroup>
         <FormInput 
           value = {props.value}
-          className={props.class_Name}
-          placeholder={props.text_Placeholder}
-          id={props.id_Input}
+          className={props.className}
+          placeholder={props.placeholder}
+          id={props.id}
           autoComplete="off"
           type="text"
-          onChange={props.onChange_Input}
-          defaultValue={props.text_Defaultvalue}
-          onKeyPress={props.onKeyPress_Input}
-          onKeyDown={props.onKeyDown_Input}
-          disabled ={props.bool_DisabledInput}
+          onChange={props.onChange}
+          defaultValue={props.defaultValue}
+          onKeyPress={props.onKeyPress}
+          onKeyDown={props.onKeyDown}
+          disabled ={props.disableInput}
         />
-        <FormLabel>{props.text_Placeholder}</FormLabel>
-        {props.variant_List ?  
+        <FormLabel>{props.placeholder}</FormLabel>
+        {props.list ?  
           <Main_ 
               size = 'small'
-              text = {props.text_AddInput}
-              svgLeft = 'Add'
+              text = {props.add}
+              iconLeft = 'Add'
               className = 'FormAddButton'
-              onClick = {props.onClick_AddInput}
+              onClick = {props.onClick_Add}
           />
         :
           null
         }
-        {props.bool_Required ?
+        {props.required ?
           <ValidatorRequired className='ValidatorRequired'>
               <IconSvg Icon='Asterisk' />
           </ValidatorRequired>
         :
           null
         }
-        {props.array_Errors ?
+        {props.errors ?
           <Validators className='ValidatorErrors'>
-              {props.array_Errors.map((error) => 
+              {props.errors.map((error) => 
                   <ValidatorError>
                       <IconSvg Icon='Error'/>
                       <h6>{error}</h6>
@@ -51,33 +51,33 @@ export const Input_ = (props) => {
         :
           null
         }
-        {props.array_Tips && props.array_Helpers ?
+        {props.tips && props.helpers ?
           <Validators className='ValidatorHelpers'>
-              {props.array_Helpers.map((helper) => 
+              {props.helpers.map((helper) => 
                   <ValidatorWarning>
                       <IconSvg Icon = 'Warning' />
                       <h6>{helper}</h6>
                   </ValidatorWarning>
               )}
-              {props.array_Tips.map((tip) => 
+              {props.tips.map((tip) => 
                   <ValidatorTip>
                       <IconSvg Icon = 'Tip' />
                       <h6>{tip}</h6>
                   </ValidatorTip>
               )}
           </Validators>
-        :props.array_Tips ?
+        :props.tips ?
           <Validators className='ValidatorHelpers'>
-              {props.array_Tips.map((tip) => 
+              {props.tips.map((tip) => 
                   <ValidatorTip>
                       <IconSvg Icon = 'Tip' />
                       <h6>{tip}</h6>
                   </ValidatorTip>
               )}
           </Validators>
-        :props.array_Helpers ?
+        :props.helpers ?
           <Validators className='ValidatorHelpers'>
-              {props.array_Helpers.map((helper) => 
+              {props.helpers.map((helper) => 
                   <ValidatorWarning>
                       <IconSvg Icon = 'Warning' />
                       <h6>{helper}</h6>
@@ -87,15 +87,16 @@ export const Input_ = (props) => {
         :
           null
         }
-        {props.variant_List ?
+        {props.list ?
           <FormList>
-              {props.array_List.map((item) => 
+              {props.list.map((item) => 
                   <li>
-                      <IconSvg Icon={props.icon_List} />
+                      <IconSvg Icon={props.icon_ListItem} />
                       <h6>{item}</h6>
                       <Delete_Plain 
+                        onClick = {props.onClick_ListItemDelete}
                         size = 'small'
-                        svgLeft = 'Delete'
+                        iconLeft = 'Delete'
                       />
                   </li>
               )}

package/src/export/components/form/Input_Phone.js

@@ -36,15 +36,14 @@ export const Input_Phone = (props) => {
                 </select>
             </Dropdown_>
             <Dropdown_ 
-                array_Dropdown = {props.array_PhoneDropdown}
+                items = {props.array_PhoneDropdown}
             />
         </InputPhoneDrops>
         <Input_ 
-            text_Placeholder = {props.text_PhonePlaceholder}
-            bool_Required = {props.bool_Required}
-            variant_List
-            array_List = {props.array_PhoneList}
-            icon_List = {props.icon_PhoneList}
+            placeholder = {props.text_PhonePlaceholder}
+            required = {props.required}
+            list = {props.array_PhoneList}
+            icon_ListItem = {props.icon_PhoneList}
         />
     </InputPhone>
   )

package/src/export/components/form/Input_Phone_Register.js

@@ -39,12 +39,12 @@ export const Input_Phone_Register = (props) => {
         </Dropdown_>
         <Input_ 
             class_Input={props.class_Input}
-            text_Placeholder={props.text_Placeholder}
-            id_Input={props.id_Input}
-            onChange_Input={props.onChange_Input}
-            text_Defaultvalue={props.text_Defaultvalue}
-            onKeyPress_Input={props.onKeyPress_Input}
-            onKeyDown_Input={props.onKeyDown_Input}
+            placeholder={props.placeholder}
+            id={props.id}
+            onChange={props.onChange}
+            defaultValue={props.defaultValue}
+            onKeyPress={props.onKeyPress}
+            onKeyDown={props.onKeyDown}
         />
     </InputPhoneRegister>
   )

package/src/export/components/form/Radio_.js

@@ -79,15 +79,15 @@ const RadioCircle = styled.div`
 export const Radio_ = (props) => {
   return (
     <Radio key={props.key}>
-        {props.variant_Input ?
+        {props.withInput ?
             <Input_ 
-                text_Placeholder = {props.text_RadioPlaceholder}
+                placeholder = {props.placeholder}
             />
         :
-            <label for={props.id_Radio}><p>{props.text_RadioLabel}</p></label>
+            <label for={props.id}><p>{props.text}</p></label>
         }
         <RadioCircle className='RadioCircle'>
-            <input name={props.name_Radio} type="radio" id={props.id_Radio} checked = {props.bool_RadioChecked}/>
+            <input name={props.name} type="radio" id={props.id} checked = {props.checked}/>
             <span className='RadioCustom'></span>
             <IconSvg Icon='Sun' class_Icon='RadioIcon'/>
         </RadioCircle>

package/src/export/components/form/Textarea_.js

@@ -44,26 +44,26 @@ export const Textarea_ = (props) => {
 
   return (
     <TextAreaGroup>
-        <Textarea placeholder={props.text_Placeholder} rows={props.rows ? props.rows : '5'} onChange={props.onChange_Textarea ? props.onChange_Textarea : val => counter(val)} >
-            {props.text_Prefill}
+        <Textarea placeholder={props.placeholder} rows={props.rows ? props.rows : '5'} onChange={props.onChange_Textarea ? props.onChange_Textarea : val => counter(val)} >
+            {props.defaultValue}
         </Textarea>
-        {props.int_Limit ?
+        {props.limit ?
             <TextAreaCounter
-                capped = {(count > props.int_Limit) ? true : false}
-            > <span>{count}</span> / {props.int_Limit}</TextAreaCounter>
+                capped = {(count > props.limit) ? true : false}
+            > <span>{count}</span> / {props.limit}</TextAreaCounter>
         :
             null
         }
-        {props.bool_Required ?
+        {props.required ?
             <ValidatorRequired className='ValidatorRequired'>
                 <IconSvg Icon='Asterisk' />
             </ValidatorRequired>
         :
             null
         }
-        {props.array_Errors ?
+        {props.errors ?
           <Validators className='ValidatorErrors'>
-              {props.array_Errors.map((error) => 
+              {props.errors.map((error) => 
                   <ValidatorError>
                       <IconSvg Icon='Error'/>
                       <h6>{error}</h6>
@@ -73,33 +73,33 @@ export const Textarea_ = (props) => {
         :
           null
         }
-        {props.array_Tips && props.array_Helpers ?
+        {props.tips && props.helpers ?
           <Validators className='ValidatorHelpers'>
-              {props.array_Helpers.map((helper) => 
+              {props.helpers.map((helper) => 
                   <ValidatorWarning>
                       <IconSvg Icon = 'Warning' />
                       <h6>{helper}</h6>
                   </ValidatorWarning>
               )}
-              {props.array_Tips.map((tip) => 
+              {props.tips.map((tip) => 
                   <ValidatorTip>
                       <IconSvg Icon = 'Tip' />
                       <h6>{tip}</h6>
                   </ValidatorTip>
               )}
           </Validators>
-        :props.array_Tips ?
+        :props.tips ?
           <Validators className='ValidatorHelpers'>
-              {props.array_Tips.map((tip) => 
+              {props.tips.map((tip) => 
                   <ValidatorTip>
                       <IconSvg Icon = 'Tip' />
                       <h6>{tip}</h6>
                   </ValidatorTip>
               )}
           </Validators>
-        :props.array_Helpers ?
+        :props.helpers ?
           <Validators className='ValidatorHelpers'>
-              {props.array_Helpers.map((helper) => 
+              {props.helpers.map((helper) => 
                   <ValidatorWarning>
                       <IconSvg Icon = 'Warning' />
                       <h6>{helper}</h6>

package/src/export/components/nav/Nav_Protected.js

@@ -67,7 +67,7 @@ export const Nav_Protected = (props) => {
         </NavUser>
         <Grey_ 
             size = 'small'
-            svgLeft = 'Ham'
+            iconLeft = 'Ham'
             onClick = {() => setHamState(!hamState)}
         />
         {hamState ?

package/src/export/components/nav/Nav_Unprotected.js

@@ -38,7 +38,7 @@ export const Nav_Unprotected = (props) => {
         </NavDesktop>
         <Grey_ 
             size = 'small'
-            svgLeft = 'Ham'
+            iconLeft = 'Ham'
             onClick = {() => setHamState(!hamState)}
         />
         {hamState ?

package/src/export/components/sidebar/Sidebar_Box.js

@@ -71,7 +71,7 @@ const SidebarBox = styled.li`
 export const Sidebar_Box = (props) => {
   return (
     <SidebarBox onClick={props.onClick}>
-        <h5 className={props.class_Name + ' ' + 'SidebarButtonTitle'}>{props.text}</h5>
+        <h5 className={props.className + ' ' + 'SidebarButtonTitle'}>{props.text}</h5>
         <picture>
             {props.icon ?
                 <IconSvg Icon={props.icon}/>

package/src/export/components/slider/Slider_.js

@@ -50,9 +50,9 @@ export const Slider_ = (props) => {
                 <h3>{props.title}</h3>
                 <Main_ 
                     text = {props.done}
-                    svgRight = "Check"
+                    iconRight = "Check"
                     size = 'normal'
-                    onClick = {props.onClick_Close}
+                    onClick = {props.onClick}
                 />
             </SliderTitle>
             <SliderContainer>

package/src/export/components/steps/Steps_.js

@@ -46,13 +46,13 @@ export const Steps_ = (props) => {
   return (
     <Steps>
         <Steps_Header 
-            array_Steps = {props.array_Steps}
-            int_CurrentStep = {props.int_CurrentStep}
+            steps = {props.steps}
+            currentStep = {props.currentStep}
         />
         <StepsContainer>
-            {(props.array_Steps).map((step, i) =>
+            {(props.steps).map((step, i) =>
                 <CSSTransition
-                    in={props.int_CurrentStep === i}
+                    in={props.currentStep === i}
                     timeout={500}
                     unmountOnExit
                     classNames="Steps"

package/src/export/components/steps/Steps_Actions.js

@@ -13,12 +13,12 @@ export const Steps_Actions = (props) => {
   return (
     <StepsActions>
         <Grey_ 
-            svgLeft = {props.icon_Grey}
+            iconLeft = {props.icon_Grey}
             text = {props.text_Grey}
             onClick = {props.onClick_Grey}
         />
         <Main_ 
-          svgRight = {props.icon_Main}
+          iconRight = {props.icon_Main}
           text = {props.text_Main}
           onClick = {props.onClick_Main}
         />