amotify 0.0.4 → 0.0.5

package/src/Atoms/Logo/parts.tsx

@@ -1,335 +0,0 @@
-import {
-  Box,
-  Flex,
-  Img
-} from '@atoms';
-
-import style from './style.module.scss';
-
-import { publicURI } from '../../launch';
-
-const SVG = {
-  ComunIcon: () => {
-    return ( <svg viewBox="0,0,1200,1200" className={ style.ComunIcon }>
-      <g>
-        <path
-          d='
-        M
-        100,600
-        A 500,500 0 0,0 600,1100
-        A 100,100 0 0,0 600,900
-        A 300,300 0 0,1 300,600
-        A 100,100 0 0,0 100,600
-        Z
-        '
-          className={ style.P1 }
-          style={ {
-            opacity: .9,
-            fill: '#16a3ec'
-          } }
-        />
-        <path
-          d='
-        M
-        600,1100
-        A 500,500 0 0,0 1100,600
-        A 100,100 0 0,0 900,600
-        A 300,300 0 0,1 600,900
-        A 100,100 0 1,0 600,1100
-        Z
-        '
-          className={ style.P2 }
-          style={ {
-            opacity: .9,
-            fill: '#ea6093'
-          } }
-        />
-
-        <path
-          d='
-        M
-        600,100
-        A 500,500 0 0,0 100,600
-        A 100,100 0 0,0 300,600
-        A 300,300 0 0,1 600,300
-        A 100,100 0 0,0 600,100
-        Z
-        '
-          className={ style.P3 }
-          style={ {
-            opacity: .9,
-            fill: '#387cfe'
-          } }
-        />
-
-        <path
-          d='
-        M
-        600,100
-        A 100,100 0 0,1 700,200
-        A 300,300 0 0,0 1000,500
-        A 100,100 0 0,1 1100,600
-        A 100,100 0 0,1 1000,700
-        A 500,500 0 0,1 500,200
-        A 100,100 0 0,1 600,100
-        Z
-        '
-          className={ style.P4 }
-          style={ {
-            opacity: .9,
-            fill: '#9a66ff'
-          } }
-        />
-      </g>
-    </svg> );
-  },
-  MingooIcon: () => {
-    const CircleSet = ( p: number ) => {
-      return ( <>
-        <path
-          d='
-            M
-            600,100
-            A 80,80 0 0,1 600,260
-            A 80,80 0 0,1 600,100
-            L600,600
-            L600,300
-            Z
-            '
-          className={ [
-            style.OuterCircle,
-            style.P,
-            style[ 'P_' + p ]
-          ].join( ' ' ) }
-          style={ {
-            fill: '#c56ff0'
-            // fill: '#9a66ff'
-          } }
-        />
-        <path
-          d='
-            M
-            600,300
-            A 45,45 0 0,1 600,390
-            A 45,45 0 0,1 600,300
-            L600,600
-            L600,300
-            Z
-            '
-          className={ [
-            style.InnerCircle,
-            style.P,
-            style[ 'P_' + p ]
-          ].join( ' ' ) }
-          style={ {
-            fill: '#ea6093'
-            // fill: '#ffa500'
-          } }
-        />
-      </> );
-    }
-    return <svg viewBox="0,0,1200,1200" className={ style.MingooIcon }>
-      { CircleSet( 0 ) }
-      { CircleSet( 1 ) }
-      { CircleSet( 2 ) }
-      { CircleSet( 3 ) }
-      { CircleSet( 4 ) }
-      { CircleSet( 5 ) }
-      { CircleSet( 6 ) }
-      { CircleSet( 7 ) }
-      { CircleSet( 8 ) }
-    </svg>;
-  }
-}
-
-
-const Mingoos = {
-  Icon: ( params: amotify.atoms.Logos.DefaultLogoTypes ) => ( <Logo.Icon
-    { ...params }
-  >
-    <SVG.MingooIcon />
-  </Logo.Icon> ),
-  Title: ( params: amotify.atoms.Logos.DefaultLogoTypes ) => ( <Logo.Title
-    height={ 'auto' }
-    className={ style.ComunTitle }
-    { ...params }
-    freeCSS={ {
-      letterSpacing: '3px',
-      ...params.freeCSS
-    } }
-  >
-    mingoo
-  </Logo.Title> ),
-  LogoH: ( params: amotify.atoms.Logos.DefaultLogoTypes ) => {
-    let { size,color,...others } = params;
-
-    return ( <Flex
-      gap={ '1/2' }
-      flexCenter
-      { ...others }
-    >
-      <Mingoos.Icon size={ size } color={ color } />
-      <Mingoos.Title size={ size } color={ color } />
-    </Flex> );
-  },
-  LogoV: ( params: amotify.atoms.Logos.DefaultLogoTypes ) => {
-    let { size,color,...others } = params;
-
-    return ( <Flex
-      flexType="col"
-      gap={ '1/2' }
-      { ...others }
-    >
-      <Mingoos.Icon
-        margin={ 'auto' }
-        size={ size }
-        color={ color }
-      />
-      <Mingoos.Title
-        size={ size } color={ color }
-      />
-    </Flex> );
-  }
-}
-const Comuns = {
-  Icon: ( params: amotify.atoms.Logos.DefaultLogoTypes ) => ( <Logo.Icon
-    { ...params }
-  >
-    <SVG.ComunIcon />
-  </Logo.Icon> ),
-  Title: ( params: amotify.atoms.Logos.DefaultLogoTypes ) => ( <Logo.Title
-    height={ 'auto' }
-    className={ style.ComunTitle }
-    { ...params }
-    freeCSS={ {
-      letterSpacing: '3px',
-      ...params.freeCSS
-    } }
-  >
-    comun
-  </Logo.Title> ),
-  LogoH: ( params: amotify.atoms.Logos.DefaultLogoTypes ) => {
-    let { size,color,...others } = params;
-
-    return ( <Flex
-      gap={ '1/2' }
-      flexCenter
-      { ...others }
-    >
-      <Comuns.Icon size={ size } color={ color } />
-      <Comuns.Title size={ size } color={ color } />
-    </Flex> );
-  },
-  LogoV: ( params: amotify.atoms.Logos.DefaultLogoTypes ) => {
-    let { size,color,...others } = params;
-
-    return ( <Flex
-      flexType="col"
-      gap={ '1/2' }
-      { ...others }
-    >
-      <Comuns.Icon
-        margin={ 'auto' }
-        size={ size }
-        color={ color }
-      />
-      <Comuns.Title
-        size={ size } color={ color }
-      />
-    </Flex> );
-  }
-}
-export const Logo: amotify.atoms.Logos.Methods = {
-  Icon: ( props: amotify.atoms.Logos.Params ) => {
-    let {
-      size = 'R',
-      color = 'normal',
-      className = '',
-      children: Children,
-      ...others
-    } = props;
-
-    return ( <Flex
-      verticalAlign='center'
-      className={ [
-        className,
-        style.Icon,
-        style[ 'Size_' + size ]
-      ].join( ' ' ) }
-      { ...others }
-    >
-      { $.is.function( Children ) ? <Children /> : Children }
-    </Flex > );
-  },
-  Title: ( props: amotify.atoms.Logos.Params ) => {
-    let {
-      size = 'R',
-      color = 'normal',
-      className = '',
-      children: Children,
-      ...others
-    } = props;
-
-    return <Flex
-      verticalAlign='center'
-      fontColor={ color == 'white' ? 'white' : 'logo' }
-      className={ [
-        className,
-        style.Title,
-        style[ 'Size_' + size ]
-      ].join( ' ' ) }
-      { ...others }
-      freeCSS={ {
-        lineHeight: '1.25',
-        ...others.freeCSS
-      } }
-    >
-      { $.is.function( Children ) ? <Children /> : Children }
-    </Flex>;
-  },
-
-  Brands: {
-    MingooIcon: Mingoos.Icon,
-    MingooTitle: Mingoos.Title,
-    MingooLogoH: Mingoos.LogoH,
-    MingooLogoV: Mingoos.LogoV,
-
-    ComunIcon: Comuns.Icon,
-    ComunTitle: Comuns.Title,
-    ComunLogoH: Comuns.LogoH,
-    ComunLogoV: Comuns.LogoV,
-
-    Google: ( params ) => ( <Logo.Icon
-      { ...params }
-    >
-      <Img
-        src={ publicURI + '@env/@logos/brands/Google_Icon.svg' }
-        alt=''
-      />
-    </Logo.Icon> ),
-    Facebook: ( params ) => ( <Logo.Icon
-      { ...params }
-    >
-      <Img
-        src={ publicURI + '@env/@logos/brands/FaceBook_Icon.svg' }
-        alt=''
-      />
-    </Logo.Icon> ),
-    Twitter: ( params ) => ( <Logo.Icon
-      { ...params }
-    >
-      <Img
-        src={ publicURI + '@env/@logos/brands/Twitter_Icon.svg' }
-        alt=''
-      />
-    </Logo.Icon> ),
-    LINE: ( params ) => ( <Logo.Icon
-      { ...params }
-    >
-      <Img
-        src={ publicURI + '@env/@logos/brands/Line_Icon.svg' }
-        alt=''
-      />
-    </Logo.Icon> ),
-  }
-}

package/src/Atoms/Logo/style.module.scss

@@ -1,96 +0,0 @@
-@use '@uniVar' as *;
-@use'@styleSet' as *;
-
-.Size_ {
-  &S {
-    width: $unit2;
-    height: $unit2;
-    font-size: $unit1;
-  }
-  &R {
-    width: $unit3;
-    height: $unit3;
-    font-size: $unit1-5;
-  }
-  &L {
-    width: $unit4;
-    height: $unit4;
-    font-size: $unit2-5;
-  }
-  &2L {
-    width: $unit6;
-    height: $unit6;
-    font-size: $unit3;
-  }
-  &3L {
-    width: $unit8;
-    height: $unit8;
-    font-size: $unit4;
-  }
-}
-
-.Icon {
-
-}
-.Title {
-  width: auto;
-}
-
-
-.ComunIcon {
-  path {
-    filter: drop-shadow($shadow4);
-  }
-}
-.ComunTitle {
-  letter-spacing: 3px;
-}
-.MingooIcon {
-  .P {
-    transform-box: fill-box;
-    transform-origin: bottom !important;
-    &.P_0 {
-      transform: rotate(0deg);
-    }
-    &.P_1 {
-      transform: rotate(-30deg);
-    }
-    &.P_2 {
-      transform: rotate(-60deg);
-    }
-    &.P_3 {
-      transform: rotate(-90deg);
-    }
-    &.P_4 {
-      transform: rotate(-120deg);
-    }
-    &.P_5 {
-      transform: rotate(-150deg);
-    }
-    &.P_6 {
-      transform: rotate(-180deg);
-    }
-    &.P_7 {
-      transform: rotate(-210deg);
-    }
-    &.P_8 {
-      transform: rotate(-240deg);
-    }
-    &.P_9 {
-      transform: rotate(-270deg);
-      opacity: .3;
-    }
-    &.P_10 {
-      transform: rotate(30deg);
-      opacity: .3;
-    }
-    &.P_11 {
-      transform: rotate(60deg);
-      opacity: .3;
-    }
-    &.P_12 {
-      transform: rotate(90deg);
-      opacity: .3;
-    }
-  }
-}

package/src/Atoms/Various/parts.tsx

@@ -1,157 +0,0 @@
-import {
-  StyleConverter
-} from '@global';
-
-import { publicURI } from '../../launch';
-
-import style from './style.module.scss';
-
-export const Box: FNC<amotify.atoms.BoxInput> = ( params ) => {
-  let {
-    freeCSS,
-    ...Params
-  } = StyleConverter.ToClassName( params );
-  return ( <div { ...Params } /> );
-}
-export const Span: FNC<amotify.atoms.SpanProps> = ( params ) => {
-  let {
-    freeCSS,
-    ...Params
-  } = StyleConverter.ToClassName( params );
-  return ( <span { ...Params } /> );
-}
-
-export const Placeholder: FNC<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: FNC<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: FNC<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: FNC<amotifyUniStyleParams> = ( params ) => ( <Box
-  width={ 1 }
-  flexSizing='none'
-  { ...params }
-/> );
-
-export const Grid: FNC<amotify.atoms.GridProps> = ( props ) => {
-  let {
-    children,
-    freeCSS,
-    ...others
-  } = props;
-
-  return ( <Box
-    freeCSS={ {
-      display: 'grid',
-      ...freeCSS
-    } }
-    { ...others }
-    children={ children }
-  /> );
-}
-
-export const Paragraph: FNC<amotify.atoms.ParagraphProps> = ( props ) => ( <p { ...StyleConverter.ToClassName( props ) } /> )

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

@@ -1,40 +0,0 @@
-@use '@uniVar' as *;
-@use'@styleSet' as *;
-.Img {
-  &.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/Functions/@export.tsx

@@ -1,29 +0,0 @@
-import {
-  Effects
-} from './Effects/_';
-
-import { Buttons } from './Button/_';
-import { Input } from './Input/_';
-import { Inputs } from './Inputs/_';
-import { Layout } from './Layout/_';
-import { Table } from './Table/_';
-import { Sheet } from './Sheet/parts';
-import { SnackBar } from './SnackBar/parts';
-import { Loader } from './Loader/parts';
-import { Tooltips } from './Tooltips/parts';
-
-import { Cropper } from './Cropper/parts';
-
-export {
-  Buttons,
-  Input,
-  Inputs,
-  Table,
-  Layout,
-  Sheet,
-  SnackBar,
-  Loader,
-  Tooltips,
-  Effects,
-  Cropper,
-}