amotify 0.0.64 → 0.0.66

package/src/atoms/FAI/parts.tsx

@@ -1,139 +0,0 @@
-import React from 'react'
-import {
-  Box
-} from '../Various/parts'
-
-import {
-  FontAwesomeIcon
-} from '@fortawesome/react-fontawesome'
-import * as FontawesomeCore from '@fortawesome/fontawesome-svg-core'
-
-import { faUser } from '@fortawesome/free-solid-svg-icons/faUser'
-import { faTimes } from '@fortawesome/free-solid-svg-icons/faTimes'
-import { faAngleRight } from '@fortawesome/free-solid-svg-icons/faAngleRight'
-import { faAngleLeft } from '@fortawesome/free-solid-svg-icons/faAngleLeft'
-import { faAngleUp } from '@fortawesome/free-solid-svg-icons/faAngleUp'
-import { faAngleDown } from '@fortawesome/free-solid-svg-icons/faAngleDown'
-import { faChevronLeft } from '@fortawesome/free-solid-svg-icons/faChevronLeft'
-import { faChevronRight } from '@fortawesome/free-solid-svg-icons/faChevronRight'
-import { faChevronUp } from '@fortawesome/free-solid-svg-icons/faChevronUp'
-import { faChevronDown } from '@fortawesome/free-solid-svg-icons/faChevronDown'
-import { faCaretLeft } from '@fortawesome/free-solid-svg-icons/faCaretLeft'
-import { faCaretRight } from '@fortawesome/free-solid-svg-icons/faCaretRight'
-import { faCaretUp } from '@fortawesome/free-solid-svg-icons/faCaretUp'
-import { faCaretDown } from '@fortawesome/free-solid-svg-icons/faCaretDown'
-import { faArrowLeft } from '@fortawesome/free-solid-svg-icons/faArrowLeft'
-import { faArrowRight } from '@fortawesome/free-solid-svg-icons/faArrowRight'
-import { faArrowUp } from '@fortawesome/free-solid-svg-icons/faArrowUp'
-import { faArrowDown } from '@fortawesome/free-solid-svg-icons/faArrowDown'
-import { faRotate } from '@fortawesome/free-solid-svg-icons/faRotate'
-import { faRedo } from '@fortawesome/free-solid-svg-icons/faRedo'
-import { faCheck } from '@fortawesome/free-solid-svg-icons/faCheck'
-import { faCheckCircle } from '@fortawesome/free-solid-svg-icons/faCheckCircle'
-import { faQuestion } from '@fortawesome/free-solid-svg-icons/faQuestion'
-import { faQuestionCircle } from '@fortawesome/free-solid-svg-icons/faQuestionCircle'
-import { faExclamation } from '@fortawesome/free-solid-svg-icons/faExclamation'
-import { faExclamationTriangle } from '@fortawesome/free-solid-svg-icons/faExclamationTriangle'
-import { faHome } from '@fortawesome/free-solid-svg-icons/faHome'
-import { faShare } from '@fortawesome/free-solid-svg-icons/faShare'
-import { faSearch } from '@fortawesome/free-solid-svg-icons/faSearch'
-import { faYenSign } from '@fortawesome/free-solid-svg-icons/faYenSign'
-import { faHeart } from '@fortawesome/free-solid-svg-icons/faHeart'
-import { faStar } from '@fortawesome/free-solid-svg-icons/faStar'
-import { faEdit } from '@fortawesome/free-solid-svg-icons/faEdit'
-import { faPen } from '@fortawesome/free-solid-svg-icons/faPen'
-import { faCopy } from '@fortawesome/free-solid-svg-icons/faCopy'
-import { faFile } from '@fortawesome/free-solid-svg-icons/faFile'
-import { faTrashAlt } from '@fortawesome/free-solid-svg-icons/faTrashAlt'
-import { faBars } from '@fortawesome/free-solid-svg-icons/faBars'
-import { faDownload } from '@fortawesome/free-solid-svg-icons/faDownload'
-import { faLink } from '@fortawesome/free-solid-svg-icons/faLink'
-import { faLinkSlash } from '@fortawesome/free-solid-svg-icons/faLinkSlash'
-import { faExternalLinkAlt } from '@fortawesome/free-solid-svg-icons/faExternalLinkAlt'
-import { faGear } from '@fortawesome/free-solid-svg-icons/faGear'
-import { faPlus } from '@fortawesome/free-solid-svg-icons/faPlus'
-import { faMinus } from '@fortawesome/free-solid-svg-icons/faMinus'
-import { faEllipsisH } from '@fortawesome/free-solid-svg-icons/faEllipsisH'
-import { faEllipsisV } from '@fortawesome/free-solid-svg-icons/faEllipsisV'
-import { faPaperPlane } from '@fortawesome/free-solid-svg-icons/faPaperPlane'
-import { faImage } from '@fortawesome/free-solid-svg-icons/faImage'
-
-const FAIComps: React.FC<amotify.atoms.FAI.FAIParams> = ( params ) => {
-  let {
-    icon,
-    iconParams,
-    ...others
-  } = params
-
-  return <Box
-    flexCenter
-    { ...others }
-    freeCSS={ {
-      display: 'inline-flex',
-      ...others.freeCSS
-    } }
-  >
-    <Box freeCSS={ { aspectRatio: 1 } }>
-      <FontAwesomeIcon
-        icon={ icon as any }
-        fixedWidth
-        size='sm'
-        { ...iconParams }
-      />
-    </Box>
-  </Box>
-}
-
-const FAI: amotify.atoms.FAI.Method = FAIComps as any
-
-FAI.User = ( params ) => ( <FAI { ...params } icon={ faUser } /> )
-FAI.Times = ( params ) => ( <FAI { ...params } icon={ faTimes } /> )
-FAI.AngleRight = ( params ) => ( <FAI { ...params } icon={ faAngleRight } /> )
-FAI.AngleLeft = ( params ) => ( <FAI { ...params } icon={ faAngleLeft } /> )
-FAI.AngleUp = ( params ) => ( <FAI { ...params } icon={ faAngleUp } /> )
-FAI.AngleDown = ( params ) => ( <FAI { ...params } icon={ faAngleDown } /> )
-FAI.ChevronLeft = ( params ) => ( <FAI { ...params } icon={ faChevronLeft } /> )
-FAI.ChevronRight = ( params ) => ( <FAI { ...params } icon={ faChevronRight } /> )
-FAI.ChevronUp = ( params ) => ( <FAI { ...params } icon={ faChevronUp } /> )
-FAI.ChevronDown = ( params ) => ( <FAI { ...params } icon={ faChevronDown } /> )
-FAI.CaretLeft = ( params ) => ( <FAI { ...params } icon={ faCaretLeft } /> )
-FAI.CaretRight = ( params ) => ( <FAI { ...params } icon={ faCaretRight } /> )
-FAI.CaretUp = ( params ) => ( <FAI { ...params } icon={ faCaretUp } /> )
-FAI.CaretDown = ( params ) => ( <FAI { ...params } icon={ faCaretDown } /> )
-FAI.ArrowLeft = ( params ) => ( <FAI { ...params } icon={ faArrowLeft } /> )
-FAI.ArrowRight = ( params ) => ( <FAI { ...params } icon={ faArrowRight } /> )
-FAI.ArrowUp = ( params ) => ( <FAI { ...params } icon={ faArrowUp } /> )
-FAI.ArrowDown = ( params ) => ( <FAI { ...params } icon={ faArrowDown } /> )
-FAI.Rotate = ( params ) => ( <FAI { ...params } icon={ faRotate } /> )
-FAI.Redo = ( params ) => ( <FAI { ...params } icon={ faRedo } /> )
-FAI.Check = ( params ) => ( <FAI { ...params } icon={ faCheck } /> )
-FAI.CheckCircle = ( params ) => ( <FAI { ...params } icon={ faCheckCircle } /> )
-FAI.Question = ( params ) => ( <FAI { ...params } icon={ faQuestion } /> )
-FAI.QuestionCircle = ( params ) => ( <FAI { ...params } icon={ faQuestionCircle } /> )
-FAI.Exclamation = ( params ) => ( <FAI { ...params } icon={ faExclamation } /> )
-FAI.ExclamationTriangle = ( params ) => ( <FAI { ...params } icon={ faExclamationTriangle } /> )
-FAI.Home = ( params ) => ( <FAI { ...params } icon={ faHome } /> )
-FAI.Share = ( params ) => ( <FAI { ...params } icon={ faShare } /> )
-FAI.Search = ( params ) => ( <FAI { ...params } icon={ faSearch } /> )
-FAI.YenSign = ( params ) => ( <FAI { ...params } icon={ faYenSign } /> )
-FAI.Heart = ( params ) => ( <FAI { ...params } icon={ faHeart } /> )
-FAI.Star = ( params ) => ( <FAI { ...params } icon={ faStar } /> )
-FAI.Edit = ( params ) => ( <FAI { ...params } icon={ faEdit } /> )
-FAI.Pen = ( params ) => ( <FAI { ...params } icon={ faPen } /> )
-FAI.Copy = ( params ) => ( <FAI { ...params } icon={ faCopy } /> )
-FAI.File = ( params ) => ( <FAI { ...params } icon={ faFile } /> )
-FAI.TrashAlt = ( params ) => ( <FAI { ...params } icon={ faTrashAlt } /> )
-FAI.Bars = ( params ) => ( <FAI { ...params } icon={ faBars } /> )
-FAI.Download = ( params ) => ( <FAI { ...params } icon={ faDownload } /> )
-FAI.Link = ( params ) => ( <FAI { ...params } icon={ faLink } /> )
-FAI.LinkSlash = ( params ) => ( <FAI { ...params } icon={ faLinkSlash } /> )
-FAI.ExternalLinkAlt = ( params ) => ( <FAI { ...params } icon={ faExternalLinkAlt } /> )
-FAI.Gear = ( params ) => ( <FAI { ...params } icon={ faGear } /> )
-FAI.Plus = ( params ) => ( <FAI { ...params } icon={ faPlus } /> )
-FAI.Minus = ( params ) => ( <FAI { ...params } icon={ faMinus } /> )
-FAI.EllipsisH = ( params ) => ( <FAI { ...params } icon={ faEllipsisH } /> )
-FAI.EllipsisV = ( params ) => ( <FAI { ...params } icon={ faEllipsisV } /> )
-FAI.PaperPlane = ( params ) => ( <FAI { ...params } icon={ faPaperPlane } /> )
-FAI.Image = ( params ) => ( <FAI { ...params } icon={ faImage } /> )
-
-export { FAI }

package/src/atoms/Logo/parts.tsx

@@ -1,335 +0,0 @@
-import React from 'react'
-import {
-  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 '@props' 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 {
-  svg {
-    height: 100%;
-  }
-}
-.Title {
-  width: auto;
-  svg {
-    height: 100%;
-  }
-}
-.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;
-    }
-  }
-}