amotify 0.0.17 → 0.0.18

package/src/functions/Input/Segmented/_.tsx

@@ -26,7 +26,7 @@ export const Segmented: amotify.fn.Input.Segmented.Types = {
       },
     }
 
-    return ( <Core appearance={ ( params as any ).tone || 'Auto' } { ...params } /> );
+    return <Core appearance={ ( params as any ).tone || 'Auto' } { ...params } />;
   },
   Normal: ( params ) => {
     params = { ...params };
@@ -52,7 +52,7 @@ export const Segmented: amotify.fn.Input.Segmented.Types = {
     };
     ( params as any ).tone = 'ThemeBorder';
 
-    return ( <Core appearance={ 'Border' } { ...params } /> );
+    return <Core appearance={ 'Border' } { ...params } />;
   },
   Cloud: ( params ) => {
     params = { ...params };
@@ -73,31 +73,31 @@ export const Segmented: amotify.fn.Input.Segmented.Types = {
       },
     }
 
-    return ( <Core appearance={ ( params as any ).tone || 'Cloud' } { ...params } /> );
+    return <Core appearance={ ( params as any ).tone || 'Cloud' } { ...params } />;
   },
   Cloud2: ( params ) => {
     params = { ...params };
     ( params as any ).tone = 'WhiteCloud';
-    return ( <Segmented.Cloud
+    return <Segmented.Cloud
       fontColor='3.blur'
       { ...params }
       cellCheckedStyles={ {
         fontColor: '1.clear',
         ...params.cellCheckedStyles
       } }
-    /> );
+    />;
   },
   Cloud3: ( params ) => {
     params = { ...params };
     ( params as any ).tone = 'ThemeCloud';
-    return ( <Segmented.Cloud
+    return <Segmented.Cloud
       backgroundColor='tcOpFew'
       fontColor='theme'
       { ...params }
       cellStyles={ {
         ...params.cellStyles
       } }
-    /> );
+    />;
   },
   Border: ( params ) => {
     params = { ...params };
@@ -121,7 +121,7 @@ export const Segmented: amotify.fn.Input.Segmented.Types = {
       },
     }
 
-    return ( <Core appearance={ ( params as any ).tone || 'Border' } { ...params } /> );
+    return <Core appearance={ ( params as any ).tone || 'Border' } { ...params } />;
   },
   Border2: ( params ) => {
     params = { ...params };
@@ -148,7 +148,7 @@ export const Segmented: amotify.fn.Input.Segmented.Types = {
     };
     ( params as any ).tone = 'ThemeBorder';
 
-    return ( <Core appearance={ 'Border' } { ...params } /> );
+    return <Core appearance={ 'Border' } { ...params } />;
   },
   BottomLine: ( params ) => {
     params = { ...params };
@@ -168,7 +168,7 @@ export const Segmented: amotify.fn.Input.Segmented.Types = {
       }
     }
 
-    return ( <Core appearance={ 'BottomLine' } { ...params } /> );
+    return <Core appearance={ 'BottomLine' } { ...params } />;
   },
 }
 
@@ -200,7 +200,7 @@ const Core: React.FC<CoreParams> = ( params ) => {
     set_value( value );
   }
 
-  return ( <ListInputs.Radio
+  return <ListInputs.Radio
     // hideInput
     defaultActiveStyling={ false }
     flexWrap={ false }
@@ -242,5 +242,5 @@ const Core: React.FC<CoreParams> = ( params ) => {
         set_value( args.value[ 0 ] );
       }
     } }
-  /> );
+  />;
 }

package/src/functions/Input/Select/_.tsx

@@ -69,12 +69,11 @@ export const SelectInput: React.FC<amotify.fn.Input.Select.PlainParams> = ( para
   if ( !SelectedExist ) value = null;
   let DefaultValue = JSON.stringify( value );
 
-  return ( <Core
+  return <Core
     { ...params }
     value={ DefaultValue }
     options={ DefaultOptions }
-  />
-  );
+  />;
 }
 
 const Core: React.FC<amotify.fn.Input.Select.PlainParams> = ( params ) => {
@@ -136,7 +135,7 @@ const Core: React.FC<amotify.fn.Input.Select.PlainParams> = ( params ) => {
     if ( Selected ) SelectedElement = Selected.displayLabel ?? Selected.label;
   }
 
-  return ( <BoxWrapper
+  return <BoxWrapper
     val_status={ val_status }
     set_status={ set_status }
     val_validate={ val_validate }
@@ -182,7 +181,7 @@ const Core: React.FC<amotify.fn.Input.Select.PlainParams> = ( params ) => {
         <Options params={ params } />
       </select>
     </Box>
-  </BoxWrapper> );
+  </BoxWrapper>;
 }
 
 const Options: React.FC<{ params: amotify.fn.Input.Select.PlainParams }> = ( props ) => {
@@ -217,7 +216,7 @@ const Options: React.FC<{ params: amotify.fn.Input.Select.PlainParams }> = ( pro
     /> );
   }
 
-  return ( <>
+  return <>
     { Options }
-  </> );
+  </>;
 }

package/src/functions/Input/Slider/_.tsx

@@ -252,7 +252,7 @@ const Comps = {
       }
     },[] );
 
-    return ( <Flex
+    return <Flex
       className={ style.Labels }
       verticalAlign='center'
       horizontalAlign='between'
@@ -269,7 +269,7 @@ const Comps = {
         bottom={ 0 }
         children={ Labels }
       />
-    </Flex> );
+    </Flex>;
   },
   Rail: ( props: {
     color: amotify.fn.Input.Slider.ColorTypes
@@ -290,7 +290,7 @@ const Comps = {
       componentID
     } = val_status;
 
-    return ( <Flex
+    return <Flex
       className={ style.Rail }
       position='relative'
       paddingLeft={ '1/2' }
@@ -379,7 +379,7 @@ const Comps = {
           } }
         />
       </Box>
-    </Flex> );
+    </Flex>;
   }
 }
 

package/src/functions/Input/Text.tsx

@@ -316,116 +316,114 @@ export const TextInput: React.FC<amotify.fn.Input.Text.OriginParams> = ( params
     setSelection( { id: params.id,restrict,val_status } );
   },[ val_status ] );
 
-  return (
-    <BoxWrapper
-      val_status={ val_status }
-      set_status={ set_status }
-      val_validate={ val_validate }
-      params={ params }
-    >
-      <input
-        type={ inputType }
-        inputMode={ inputMode }
-        data-form={ form }
-        data-input-type={ 'text' }
-        data-validation={ val_validate.ok }
-        data-value={ val_status.dataValue }
-        data-component-id={ val_status.componentID }
-        value={ val_status.formatValue }
-        autoComplete={ autoComplete }
-        autoCapitalize={ autoCapitalize }
-        onKeyDown={ ( event ) => {
-          let { key,target } = event;
-          {
-            let input = target as HTMLInputElement;
-            let { selectionStart,selectionEnd } = input;
-            let caretFrom = Number( selectionStart );
-            let caretTo = Number( selectionEnd )
-
-            let _v = val_status.formatValue[ Number( caretFrom ) ];
-            let v_ = val_status.formatValue[ Number( caretFrom ) - 1 ];
-            if ( key == 'Delete' && (
-              ( restrict == 'creditCard' && _v == ' ' ) ||
-              ( restrict == 'postal' && _v == '-' ) ||
-              ( restrict == 'digitNumber' && _v == ',' )
-            ) ) {
-              input.setSelectionRange( caretFrom + 1,caretTo + 1 );
-              event.preventDefault();
-            }
-            if ( key == 'Backspace' && (
-              ( restrict == 'creditCard' && v_ == ' ' ) ||
-              ( restrict == 'postal' && v_ == '-' ) ||
-              ( restrict == 'digitNumber' && v_ == ',' )
-            ) ) {
-              input.setSelectionRange( caretFrom - 1,caretTo - 1 );
-              event.preventDefault();
-            }
+  return <BoxWrapper
+    val_status={ val_status }
+    set_status={ set_status }
+    val_validate={ val_validate }
+    params={ params }
+  >
+    <input
+      type={ inputType }
+      inputMode={ inputMode }
+      data-form={ form }
+      data-input-type={ 'text' }
+      data-validation={ val_validate.ok }
+      data-value={ val_status.dataValue }
+      data-component-id={ val_status.componentID }
+      value={ val_status.formatValue }
+      autoComplete={ autoComplete }
+      autoCapitalize={ autoCapitalize }
+      onKeyDown={ ( event ) => {
+        let { key,target } = event;
+        {
+          let input = target as HTMLInputElement;
+          let { selectionStart,selectionEnd } = input;
+          let caretFrom = Number( selectionStart );
+          let caretTo = Number( selectionEnd )
+
+          let _v = val_status.formatValue[ Number( caretFrom ) ];
+          let v_ = val_status.formatValue[ Number( caretFrom ) - 1 ];
+          if ( key == 'Delete' && (
+            ( restrict == 'creditCard' && _v == ' ' ) ||
+            ( restrict == 'postal' && _v == '-' ) ||
+            ( restrict == 'digitNumber' && _v == ',' )
+          ) ) {
+            input.setSelectionRange( caretFrom + 1,caretTo + 1 );
+            event.preventDefault();
           }
+          if ( key == 'Backspace' && (
+            ( restrict == 'creditCard' && v_ == ' ' ) ||
+            ( restrict == 'postal' && v_ == '-' ) ||
+            ( restrict == 'digitNumber' && v_ == ',' )
+          ) ) {
+            input.setSelectionRange( caretFrom - 1,caretTo - 1 );
+            event.preventDefault();
+          }
+        }
 
-          if ( [ 'number','digitNumber','creditCard' ].includes( restrict ) ) {
-            if ( key == 'Clear' ) {
-              set_status( {
-                ...val_status,
-                dataValue: '',
-                formatValue: '',
-                eventType: 'update',
-                eventID: $.uuidGen(),
-              } )
-            }
+        if ( [ 'number','digitNumber','creditCard' ].includes( restrict ) ) {
+          if ( key == 'Clear' ) {
+            set_status( {
+              ...val_status,
+              dataValue: '',
+              formatValue: '',
+              eventType: 'update',
+              eventID: $.uuidGen(),
+            } )
           }
-          if ( [ 'number','digitNumber' ].includes( restrict ) ) {
-            if ( [ 'ArrowUp','ArrowDown' ].includes( key ) ) {
-              let direction = Number( key == 'ArrowUp' ) * 2 - 1;
-              let Value = String( Number( val_status.dataValue ) + direction );
-              if ( val_validate.ok ) {
-                set_validate( { ok: false,notice: [] } );
-              }
-              set_status( {
-                ...val_status,
-                ...DataLeveling( {
-                  min,max,
-                  restrict,
-                  value: Value
-                } ),
-                eventType: 'update',
-                eventID: $.uuidGen(),
-              } );
-              event.preventDefault();
+        }
+        if ( [ 'number','digitNumber' ].includes( restrict ) ) {
+          if ( [ 'ArrowUp','ArrowDown' ].includes( key ) ) {
+            let direction = Number( key == 'ArrowUp' ) * 2 - 1;
+            let Value = String( Number( val_status.dataValue ) + direction );
+            if ( val_validate.ok ) {
+              set_validate( { ok: false,notice: [] } );
             }
+            set_status( {
+              ...val_status,
+              ...DataLeveling( {
+                min,max,
+                restrict,
+                value: Value
+              } ),
+              eventType: 'update',
+              eventID: $.uuidGen(),
+            } );
+            event.preventDefault();
           }
+        }
 
-          if ( onKeyDown ) onKeyDown( event );
-          if ( enableFormSubmit ) SubmitForm( event );
-        } }
-        onChange={ ( event ) => {
-          let {
-            value: rawValue,
-            selectionStart,
-            selectionEnd
-          } = event.target;
-
-          let value = DataLeveling( {
-            min,max,
-            restrict,
-            value: rawValue
-          } );
-          if ( value.formatValue == val_status.formatValue ) return;
-
-          if ( val_validate.ok ) set_validate( { ok: false,notice: [] } );
-          set_status( {
-            ...val_status,
-            ...value,
-            prevValue: val_status.formatValue,
-            eventType: 'update',
-            eventID: $.uuidGen(),
-            caretFrom: Number( selectionStart ),
-            caretTo: Number( selectionEnd )
-          } );
-
-          if ( onChange ) onChange( event );
-        } }
-        { ...others }
-      />
-    </BoxWrapper>
-  );
+        if ( onKeyDown ) onKeyDown( event );
+        if ( enableFormSubmit ) SubmitForm( event );
+      } }
+      onChange={ ( event ) => {
+        let {
+          value: rawValue,
+          selectionStart,
+          selectionEnd
+        } = event.target;
+
+        let value = DataLeveling( {
+          min,max,
+          restrict,
+          value: rawValue
+        } );
+        if ( value.formatValue == val_status.formatValue ) return;
+
+        if ( val_validate.ok ) set_validate( { ok: false,notice: [] } );
+        set_status( {
+          ...val_status,
+          ...value,
+          prevValue: val_status.formatValue,
+          eventType: 'update',
+          eventID: $.uuidGen(),
+          caretFrom: Number( selectionStart ),
+          caretTo: Number( selectionEnd )
+        } );
+
+        if ( onChange ) onChange( event );
+      } }
+      { ...others }
+    />
+  </BoxWrapper>;
 }

package/src/functions/Input/TextArea.tsx

@@ -71,41 +71,39 @@ export const TextAreaInput: React.FC<amotify.fn.Input.TextArea.PlainParams> = (
     DefaultValidation
   } );
 
-  return (
-    <BoxWrapper
-      val_status={ val_status }
-      set_status={ set_status }
-      val_validate={ val_validate }
-      params={ params }
-    >
-      <textarea
-        data-form={ form }
-        data-input-type={ 'textarea' }
-        data-validation={ val_validate.ok }
-        data-value={ val_status.dataValue }
-        data-component-id={ val_status.componentID }
-        value={ val_status.dataValue }
-        onKeyDown={ ( event ) => {
-          if ( onKeyDown ) onKeyDown( event );
-          if ( enableFormSubmit ) SubmitForm( event );
-        } }
-        onChange={ ( event ) => {
-          let {
-            value
-          } = event.target;
+  return <BoxWrapper
+    val_status={ val_status }
+    set_status={ set_status }
+    val_validate={ val_validate }
+    params={ params }
+  >
+    <textarea
+      data-form={ form }
+      data-input-type={ 'textarea' }
+      data-validation={ val_validate.ok }
+      data-value={ val_status.dataValue }
+      data-component-id={ val_status.componentID }
+      value={ val_status.dataValue }
+      onKeyDown={ ( event ) => {
+        if ( onKeyDown ) onKeyDown( event );
+        if ( enableFormSubmit ) SubmitForm( event );
+      } }
+      onChange={ ( event ) => {
+        let {
+          value
+        } = event.target;
 
-          if ( val_validate.ok ) set_validate( { ok: false,notice: [] } );
-          set_status( {
-            ...val_status,
-            dataValue: value,
-            eventType: 'update',
-            eventID: $.uuidGen(),
-          } );
+        if ( val_validate.ok ) set_validate( { ok: false,notice: [] } );
+        set_status( {
+          ...val_status,
+          dataValue: value,
+          eventType: 'update',
+          eventID: $.uuidGen(),
+        } );
 
-          if ( onChange ) onChange( event );
-        } }
-        { ...others }
-      />
-    </BoxWrapper>
-  );
+        if ( onChange ) onChange( event );
+      } }
+      { ...others }
+    />
+  </BoxWrapper>;
 }

package/src/functions/Input/Time/Picker.tsx

@@ -170,7 +170,7 @@ export const Picker: React.FC<amotify.fn.Input.Time.PickerParams> = ( params ) =
     set_value
   }
 
-  return ( <Box
+  return <Box
     backgroundColor={ '1.layer.base' }
     borderRadius={ '2.tone.secondary' }
     boxShadow={ 3 }
@@ -190,7 +190,7 @@ export const Picker: React.FC<amotify.fn.Input.Time.PickerParams> = ( params ) =
                     : restrict == 'dateWareki' ? ''
                       : <></> }
     />
-  </Box> );
+  </Box>;
 }
 
 const Comps = {
@@ -460,7 +460,7 @@ const Comps = {
 
       let { year,month,date } = val_value;
 
-      return ( <Column
+      return <Column
         padding={ 1 }
       >
         <Flex
@@ -573,7 +573,7 @@ const Comps = {
           tipsID={ tipsID! }
           onValueUpdate={ onValueUpdate }
         />
-      </Column> );
+      </Column>;
     },
     MonthCalendar: ( params: {
       min?: string
@@ -687,14 +687,14 @@ const Comps = {
         </Box> );
       }
 
-      return ( <Grid gridCols={ 7 }
+      return <Grid gridCols={ 7 }
         gap={ '1/3' }
       >
         { legends }
         { lastMonthLastishDates }
         { thisMonthDates }
         { nextMonthFirstishDates }
-      </Grid> );
+      </Grid>;
     }
   },
   Month: {
@@ -709,7 +709,7 @@ const Comps = {
 
       let { year,month } = val_value;
 
-      return ( <Column
+      return <Column
         padding={ 1 }
       >
         <Row.Separate gap={ 0 }>
@@ -768,7 +768,7 @@ const Comps = {
           tipsID={ tipsID! }
           onValueUpdate={ onValueUpdate }
         />
-      </Column> );
+      </Column>;
     },
     Months: ( params: {
       min?: string
@@ -820,11 +820,11 @@ const Comps = {
         </Buttons.Button.Clear.R> );
       }
 
-      return ( <Grid
+      return <Grid
         gridCols={ 4 }
         gap={ '2/3' }
         children={ Months }
-      /> );
+      />;
     }
   },
   Year: {
@@ -839,7 +839,7 @@ const Comps = {
 
       let { year } = val_value;
 
-      return ( <Column
+      return <Column
         padding={ 1 }
       >
         <Input.Select
@@ -858,7 +858,7 @@ const Comps = {
           tipsID={ tipsID! }
           onValueUpdate={ onValueUpdate }
         />
-      </Column> );
+      </Column>;
     }
   },
   Variables: {
@@ -866,7 +866,7 @@ const Comps = {
       tipsID: string
       onValueUpdate: any
     } ) => {
-      return ( <Flex
+      return <Flex
         flexWrap={ false }
         gap={ 1 }
         flexChilds='even'
@@ -893,7 +893,7 @@ const Comps = {
           children={ '決定' }
           padding={ [ '2/3',1 ] }
         />
-      </Flex> );
+      </Flex>;
     },
     ShiftButtons: ( params: {
       callback( dir: -1 | 1 ): void