amotify 0.0.64 → 0.0.66

package/src/atoms/Various/parts.tsx

@@ -1,159 +0,0 @@
-import React from 'react'
-import {
-  StyleConverter
-} from '@global'
-
-import { publicURI } from '../../launch'
-
-import style from './style.module.scss'
-
-export const Box: React.FC<amotify.atoms.BoxInput> = ( params ) => {
-  let {
-    freeCSS,
-    ...Params
-  } = StyleConverter.ToClassName( params )
-  return <div { ...Params } />
-}
-export const Span: React.FC<amotify.atoms.SpanProps> = ( params ) => {
-  let {
-    freeCSS,
-    ...Params
-  } = StyleConverter.ToClassName( params )
-  return <span { ...Params } />
-}
-
-export const Placeholder: React.FC<amotify.atoms.PlaceholderParams> = ( params ) => {
-  let {
-    color = 'cloud',
-    ...others
-  } = params
-
-  let DefStyles: amotifyUniStyleParams = {
-    flexCenter: true,
-    position: 'relative',
-    ssCardBox: true,
-    border: 'unset',
-    overflow: 'hidden',
-    backgroundColor: '3.layer.canvas',
-  }
-
-  return <Box
-    className={ [
-      style.Placeholder,
-      params.className
-    ].join( ' ' ) }
-    { ...DefStyles }
-    { ...others }
-  >
-    <Box
-      className={ [
-        style.Body,
-        style[ 'Color_' + color ],
-      ].join( ' ' ) }
-    />
-  </Box>
-}
-
-let Img: amotify.atoms.Image.Methods = {} as any
-{
-  const ImageComp: React.FC<amotify.atoms.Image.CompInput> = ( params ) => {
-    let {
-      src = '',
-      alt = '',
-      showExpand,
-      ...others
-    } = params
-
-    others.freeCSS = {
-      cursor: showExpand ? 'zoom-in' : 'inherit',
-      ...others.freeCSS
-    }
-    let {
-      className = '',
-      ...Others
-    } = StyleConverter.ToClassName( others )
-
-    let ClassName = [
-      style.Img,
-      style[ 'ShowExpand_' + showExpand ],
-      className
-    ].join( ' ' )
-
-    return <img
-      src={ src }
-      alt={ alt }
-      className={ ClassName }
-      onMouseDown={ ( event ) => {
-        if ( showExpand ) event.stopPropagation()
-      } }
-      onTouchStart={ ( event ) => {
-        if ( showExpand ) event.stopPropagation()
-      } }
-      onClick={ ( event ) => {
-        if ( showExpand ) {
-          event.stopPropagation()
-          amotify.fn.Sheet.open( {
-            type: 'image',
-            src: showExpand != true ? showExpand : src
-          } )
-        }
-      } }
-      { ...Others }
-    />
-  }
-  Img = ImageComp as any
-  Img.uri = {
-    comunIcon: publicURI + 'app/admin/@logo/icon.png',
-    comunIconClear: publicURI + 'app/admin/@logo/iconClear.png',
-    mingooIcon: '',
-    defaultIcon: ( type ) => {
-      return publicURI + '@env/@icon/' + ( type || 'image' ) + '.png'
-    },
-  }
-}
-export { Img }
-
-export const Flex: React.FC<amotify.atoms.FlexProps> = ( props ) => {
-  let {
-    children,
-    freeCSS,
-    ...others
-  } = props
-
-  return <Box
-    flexType={ 'row' }
-    flexWrap={ true }
-    display='flex'
-    freeCSS={ {
-      wordBreak: 'break-word',
-      ...freeCSS
-    } }
-    { ...others }
-    children={ children }
-  />
-}
-
-export const FlexBr: React.FC<amotifyUniStyleParams> = ( params ) => ( <Box
-  width={ 1 }
-  flexSizing='none'
-  { ...params }
-/> )
-
-export const Grid: React.FC<amotify.atoms.GridProps> = ( props ) => {
-  let {
-    children,
-    freeCSS,
-    ...others
-  } = props
-
-  return <Box
-    freeCSS={ {
-      display: 'grid',
-      ...freeCSS
-    } }
-    { ...others }
-    children={ children }
-  />
-}
-
-export const Paragraph: React.FC<amotify.atoms.ParagraphProps> = ( props ) => ( <p { ...StyleConverter.ToClassName( props ) } /> )

package/src/atoms/Various/style.module.scss

@@ -1,46 +0,0 @@
-@use '@props' as *;
-@use'@styleSet' as *;
-.Img {
-  user-drag: none;
-  -webkit-user-drag: none;
-  -moz-user-select: none;
-  vertical-align: top;
-  object-fit: cover;
-  width: 100%;
-  height: 100%;
-  border-radius: inherit;
-  &.ShowExpand_true {
-    transition: $animation-time-middle;
-    &:hover {
-      opacity: .8;
-    }
-  }
-}
-@keyframes PlaceholderEffect {
-  0% {
-    left: -50%;
-    opacity: 0;
-  }
-  30% {
-    opacity: 1;
-  }
-  100% {
-    left: 150%;
-    opacity: 0;
-  }
-}
-.Placeholder {
-  .Body {
-    @include absoluteCovered();
-    width: 40%;
-    background: linear-gradient(to right,
-        transparent,
-        $color-layer5 );
-    animation: 1.5s PlaceholderEffect linear infinite;
-    &.Color_white {
-      background: linear-gradient(to right,
-          transparent,
-          $color-layer3 );
-    }
-  }
-}

package/src/config.tsx

@@ -1,191 +0,0 @@
-export const script = document.currentScript
-export const fileName = script?.attributes.getNamedItem( 'src' )!.textContent
-export const Version = ( fileName?.match( /v\d\.\d\.\d/ ) || [ 'v0.0.0' ] )[ 0 ]!
-
-export const userAgent = window.navigator.userAgent.toLowerCase()
-export const deviceType: amotify.DeviceTypes =
-  userAgent.indexOf( "windows nt" ) !== -1 ? 'windows'
-    : userAgent.indexOf( "android" ) !== -1 ? 'android'
-      : userAgent.indexOf( "iphone" ) !== -1 ? 'iPhone'
-        : userAgent.indexOf( "ipad" ) > -1 || ( userAgent.indexOf( "macintosh" ) > -1 && "ontouchend" in document ) ? 'iPad'
-          : userAgent.indexOf( "mac os x" ) !== -1 ? 'macOSX'
-            : 'undefined'
-export const browserType: amotify.BrowserTypes =
-  userAgent.indexOf( "msie" ) !== -1 || userAgent.indexOf( "trident" ) !== -1 ? 'ie'
-    : userAgent.indexOf( "edge" ) !== -1 ? 'edge'
-      : userAgent.indexOf( "chrome" ) !== -1 ? 'chrome'
-        : userAgent.indexOf( "safari" ) !== -1 ? 'safari'
-          : userAgent.indexOf( "firefox" ) !== -1 ? 'firefox'
-            : userAgent.indexOf( "opera" ) !== -1 || userAgent.indexOf( "opr" ) !== -1 ? 'opera'
-              : 'undefined'
-
-export const deviceIdentifier = () => {
-  let info = {
-    deviceIs: deviceType,
-    browserIs: browserType,
-    isTouchDevice: window.ontouchstart !== undefined && 0 < navigator.maxTouchPoints,
-    isPhone: [ 'Android','iPhone' ].includes( deviceType ),
-    isIOS: [ 'iPhone','iPad' ].includes( deviceType ),
-    isSystemDarkmode: () => {
-      return window.matchMedia( '(prefers-color-scheme: dark)' ).matches == true
-    },
-    isBreakpoint: () => {
-      // if (amotify.config.)
-      return window.innerWidth <= 834
-    },
-    isPhonepoint: () => window.innerWidth <= 690
-  }
-
-  return info
-}
-
-
-import {
-  launchID,
-  ColorObjects
-} from './@variables'
-
-export const SetThemeColorTag = () => {
-  let hex = '#45515c'
-  let meta = $( '#ThemeColorMetaTag' )
-  if ( !meta[ 0 ] ) return
-  meta.setAttribute( 'content',hex )
-}
-
-const DarkmodeColors: {
-  light: string
-  dark: string
-  dim: string
-  auto(): string
-} = {
-  light: '#FFF',
-  dark: '#333',
-  dim: '#666',
-  auto: () => {
-    return amotify.config.device.isSystemDarkmode() ? '#333' : '#FFF'
-  }
-}
-
-const ThemeColors: {
-  [ key in amotify.ThemeColorTypes ]: {
-    alfa( alfa?: number ): string
-    isBrand: boolean
-    isAvocado: boolean
-  }
-} = {} as any
-ColorObjects.forEach( ( ColorObject ) => {
-  let { key,isAvocado,isBrand } = ColorObject
-
-  ThemeColors[ key ] = {
-    alfa: ( alfa?: number ) => ( `hsla( var( --cH_${ key } ),var( --cS_${ key } ),var( --cL_${ key } ),${ alfa ?? 1 } ) ` ),
-    isAvocado,
-    isBrand,
-  }
-} )
-
-export const defaultConfig: amotify.config.Methods = {
-  version: Version,
-  launchID,
-  tone: 'default',
-  darkMode: 'light',
-  themeColor: 'comun',
-  roundness: 2,
-
-  device: deviceIdentifier(),
-  update: {
-    tone: ( value ) => {
-      if ( ![ 'default','flat','sharp' ].includes( value ) ) value = 'default'
-
-      if ( value == amotify.config.tone ) return
-
-      amotify.config.tone = value
-
-      let body = $( 'body' )
-      body
-        .removeClass( body.findClass( /^bdsTN/ ) )
-        .addClass( 'bdsTN' + value )
-        .callback( () => {
-          SetThemeColorTag()
-        } )
-
-      amotify.global.useRecycle.do( 'RootViewController' )
-    },
-    themeColor: ( value ) => {
-      if ( !ColorObjects.find( ( ColorObject ) => ColorObject.key == value ) ) value = 'comun'
-      if ( value == amotify.config.themeColor ) return
-
-      amotify.config.themeColor = value
-
-      let body = $( document.body )
-      body
-        .removeClass( body.findClass( /^bdsTC/ ) )
-        .addClass( 'bdsTC_' + value )
-        .callback( () => {
-          SetThemeColorTag()
-        } )
-      amotify.global.useRecycle.do( 'RootViewController' )
-    },
-    darkMode: ( value ) => {
-      if ( ![ 'light','dark','dim','auto' ].includes( value ) ) value = 'light'
-      if ( value == amotify.config.darkMode ) return
-      let Value = value == 'auto'
-        ? deviceIdentifier().isSystemDarkmode()
-          ? 'dark'
-          : 'light'
-        : value
-
-      amotify.config.darkMode = value
-
-      let body = $( 'body' )
-      body
-        .removeClass( body.findClass( /^bdsDM/ ) )
-        .addClass( 'bdsDM_' + Value )
-
-      amotify.global.useRecycle.do( 'RootViewController' )
-    },
-    roundness: ( value ) => {
-      if ( !( value >= 0 && value <= 5 ) ) value = 2
-      if ( value == amotify.config.roundness ) return
-
-      amotify.config.roundness = value
-      amotify.global.useRecycle.do( 'RootViewController' )
-    },
-  },
-  readExtraCDN: async ( key ) => {
-    let url = key
-    let valid = false
-    if ( url ) {
-      await $.CDNReader( url )
-      console.log( 'Read extraCdn : ' + key )
-      valid = true
-    }
-    return valid
-  },
-  variables: {
-    themeColors: ThemeColors,
-    darkmodeColors: DarkmodeColors
-  }
-}
-
-$( 'body' ).addClass( [
-  'usrDevice_' + deviceIdentifier().deviceIs,
-  'bdsDM_' + defaultConfig.darkMode,
-  'bdsTC_' + defaultConfig.themeColor
-] )
-
-$( window ).addEvent( {
-  eventType: 'load',
-  callback: () => {
-    let style: any = document.body.style
-
-    let Body = $( document.body )
-    let topNavHeight = Number( Body.getStyleProperty( '--topNavHeight' ).removeLetters() || 0 )
-    let footerNavHeight = Number( Body.getStyleProperty( '--footerNavHeight' ).removeLetters() || 0 )
-
-    let viewHeight = window.innerHeight
-    let contentHeight = viewHeight - topNavHeight - footerNavHeight
-
-    style.setProperty( '--viewHeight',window.innerHeight + 'px' )
-    style.setProperty( '--contentHeight',contentHeight + 'px' )
-  }
-} )