@pareto-engineering/design-system 0.0.1-alpha.60 → 0.0.1-alpha.64

package/src/stories/c/TeamGallery.stories.jsx

@@ -1,52 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.2 */
-import * as React from 'react'
-
-import { TeamGallery } from 'ui'
-
-export default {
-  title        :'c/TeamGallery',
-  component    :TeamGallery,
-  subcomponents:{
-    'TeamGallery.PersonCard':TeamGallery.PersonCard,
-  },
-  decorators:[
-    // storyfn => <div className="">{ storyfn() }</div>,
-  ],
-  argTypes:{
-  },
-}
-
-export const Base = () => (
-  <TeamGallery title="Leadership">
-    <TeamGallery.PersonCard
-      name="Phoebe Yao"
-      position="CEO & Founder"
-      picture="https://images.unsplash.com/photo-1494790108377-be9c29b29330?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=934&q=80"
-    />
-    <TeamGallery.PersonCard
-      name="Dulce May Tigol"
-      position="Accounting"
-      picture="https://images.unsplash.com/photo-1494790108377-be9c29b29330?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=934&q=80"
-    />
-    <TeamGallery.PersonCard
-      name="Ellen Free"
-      position="Growth"
-      picture="https://images.unsplash.com/photo-1494790108377-be9c29b29330?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=934&q=80"
-    />
-    <TeamGallery.PersonCard
-      name="Collins Mbulakyalo"
-      position="Software"
-      picture="https://images.unsplash.com/photo-1494790108377-be9c29b29330?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=934&q=80"
-    />
-    <TeamGallery.PersonCard
-      name="Kaylin Hu"
-      position="Operations"
-      picture="https://images.unsplash.com/photo-1494790108377-be9c29b29330?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=934&q=80"
-    />
-    <TeamGallery.PersonCard
-      name="Diza Hendrawan"
-      position="Marketing"
-      picture="https://images.unsplash.com/photo-1494790108377-be9c29b29330?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=934&q=80"
-    />
-  </TeamGallery>
-)

package/src/stories/c/Testimonials.stories.jsx

@@ -1,43 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-import * as React from 'react'
-
-import { Testimonials } from 'ui'
-
-export default {
-  title        :'c/Testimonials',
-  component    :Testimonials,
-  subcomponents:{
-    // 'Testimonials.Slide':Testimonials.Slide,
-  },
-  decorators:[
-    // storyfn => <div className="">{ storyfn() }</div>,
-  ],
-  argTypes:{
-    backgroundColor:{ control: 'color' },
-  },
-}
-
-export const Base = () => {
-  const testimonialMap = [
-    {
-      firstName  :'David',
-      lastName   :'Head',
-      picture    :'https://pareto-v1.s3-us-west-2.amazonaws.com/testimonials/user-headshots/david-head-headshot.png',
-      company    :'CEO at Bridge',
-      testimonial:'I’ve been impressed with the breadth of tasks Pareto can tackle. Everything from research, to organization, to helping plan social activities. Highly recommend!',
-    },
-    {
-      firstName  :'Avni',
-      lastName   :'Levy',
-      picture    :'https://pareto-v1.s3-us-west-2.amazonaws.com/testimonials/user-headshots/avni-levy-headshot.png',
-      company    :'CEO at Avni Creates',
-      testimonial:'Pareto is like an extension of our team. Love how fast and convenient it is to outsource important tasks and have the trust of the Pareto team to get it done at the highest quality.',
-    },
-  ]
-
-  return (
-    <Testimonials
-      contentMap={testimonialMap}
-    />
-  )
-}

package/src/stories/c/blogUrlMap.js

@@ -1,13 +0,0 @@
-const basePath = '/blog/'
-const slugUrlParam = ':slug([0-9a-z-]{3,80})'
-const categoryUrlParam = ':category([0-9a-z-]{3,20})'
-const pageUrlParam = ':pageNumber([0-9]{1,3})'
-
-export default {
-  HOME                   :basePath,
-  LIST                   :basePath,
-  LIST_PAGINATED         :basePath + pageUrlParam,
-  LIST_CATEGORY          :`${basePath}c/${categoryUrlParam}`,
-  LIST_CATEGORY_PAGINATED:`${basePath}c/${categoryUrlParam}/${pageUrlParam}`,
-  SINGLE                 :basePath + slugUrlParam,
-}

package/src/ui/c/AcceptCookies/AcceptCookies.jsx

@@ -1,133 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-import * as React from 'react'
-
-import { useState, useCallback, useLayoutEffect } from 'react'
-
-import PropTypes from 'prop-types'
-
-import { Button } from 'ui/b'
-
-import styleNames from '@pareto-engineering/bem'
-
-// Local Definitions
-
-const baseClassName = styleNames.base
-
-const componentClassName = 'accept-cookies'
-
-/**
- * This is the component description.
- */
-const AcceptCookies = ({
-  id,
-  className:userClassName,
-  style,
-  color,
-  title,
-  subtitle,
-  onClickAllow,
-  onClickDecline,
-  defaultIsShown,
-  // ...otherProps
-}) => {
-  const [isShown, setIsShown] = useState(defaultIsShown)
-
-  const hide = useCallback(() => setIsShown(false), [])
-
-  const allow = useCallback(() => {
-    onClickAllow?.()
-    hide()
-  }, [])
-
-  const decline = useCallback(() => {
-    onClickDecline?.()
-    hide()
-  }, [])
-
-  useLayoutEffect(() => {
-    import('./styles.scss')
-  }, [])
-
-  if (!isShown) return null
-
-  return (
-    <div
-      id={id}
-      className={[
-
-        baseClassName,
-
-        componentClassName,
-        userClassName,
-        `x-${color}`,
-        'u1',
-      ]
-        .filter((e) => e)
-        .join(' ')}
-      style={style}
-      // {...otherProps}
-    >
-      <div className={styleNames.elementContent}>
-        <p className="s0">{title}</p>
-        <p className="s-1">{subtitle}</p>
-        <div className="buttons s-1">
-          <Button className="allow" onClick={allow}>Allow</Button>
-          <Button className="decline v1 ml-v" onClick={decline}>Decline</Button>
-        </div>
-      </div>
-    </div>
-  )
-}
-
-AcceptCookies.propTypes = {
-  /**
-   * The HTML id for this element
-   */
-  id:PropTypes.string,
-
-  /**
-   * The HTML class names for this element
-   */
-  className:PropTypes.string,
-
-  /**
-   * The React-written, css properties for this element.
-   */
-  style:PropTypes.objectOf(PropTypes.string),
-
-  /**
-   *  The children JSX
-   */
-  // children:PropTypes.node,
-  /**
-   *  The title
-   */
-  title         :PropTypes.string,
-  /**
-   *  The sub-title
-   */
-  subtitle      :PropTypes.string,
-  /**
-   *  The color
-   */
-  color         :PropTypes.string,
-  /**
-   *  Allow cookies function
-   */
-  onClickAllow  :PropTypes.func,
-  /**
-   *  Allow cookies function
-   */
-  onClickDecline:PropTypes.func,
-  /**
-   *  Condition to show or hide the component
-   */
-  defaultIsShown:PropTypes.bool,
-}
-
-AcceptCookies.defaultProps = {
-  color         :'main1',
-  defaultIsShown:true,
-}
-
-export default AcceptCookies

package/src/ui/c/AcceptCookies/index.js

@@ -1,2 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-export { default as AcceptCookies } from './AcceptCookies'

package/src/ui/c/AcceptCookies/styles.scss

@@ -1,49 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-
-@use "@pareto-engineering/bem";
-@use "@aztlan/stylebook/src/mixins";
-@use "@aztlan/stylebook/src/globals" as *;
-
-$default-padding:var(--u, 1em);
-
-.#{bem.$base}.accept-cookies {
-  padding: $default-padding;
-
-  .#{bem.$element-content} {
-    align-items: center;
-    background-color: var(--on-x);
-    border-radius: var(--theme-border-radius);
-    display: flex;
-    justify-content: space-between;
-    padding: $default-padding;
-
-    .buttons {
-      display: flex;
-
-      .allow,
-      .decline {
-        min-width: 100px;
-      }
-
-      .decline {
-        background-color: var(--on-x);
-        border: 1px solid var(--x);
-        color: var(--x);
-      }
-    }
-  }
-
-  @include mixins.media($to:$sm-md) {
-    .content {
-      flex-direction: column;
-    }
-  }
-
-  @include mixins.media($from:$sm-md) {
-    .content {
-      p {
-        margin-bottom: 0;
-      }
-    }
-  }
-}

package/src/ui/c/BlogCategoryButton/BlogCategoryButton.jsx

@@ -1,96 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-import * as React from 'react'
-
-import PropTypes from 'prop-types'
-
-import styleNames from '@pareto-engineering/bem'
-
-import {
-  Button,
-} from 'ui/b'
-import { Link } from 'react-router-dom'
-import { useBlog } from '../BlogContext'
-
-// Local Definitions
-
-const baseClassName = styleNames.base
-const componentClassName = 'blog-category-button'
-
-/**
- * This is the component description.
- */
-const BlogCategoryButton = ({
-  id,
-  className:userClassName,
-  style,
-  children,
-  categorySlug,
-  ...otherProps
-}) => {
-  const {
-    generateBlogPath,
-  } = useBlog()
-
-  return (
-    <Link to={
-    generateBlogPath(
-      'LIST_CATEGORY',
-      {
-        category:categorySlug,
-      },
-    )
-    }
-    >
-      <Button
-        id={id}
-        isCompact
-        className={[
-
-          baseClassName,
-
-          componentClassName,
-          userClassName,
-        ]
-          .filter((e) => e)
-          .join(' ')}
-        style={style}
-        {...otherProps}
-      >
-        {children}
-      </Button>
-    </Link>
-  )
-}
-
-BlogCategoryButton.propTypes = {
-  /**
-   * The HTML id for this element
-   */
-  id:PropTypes.string,
-
-  /**
-   * The HTML class names for this element
-   */
-  className:PropTypes.string,
-
-  /**
-   * The React-written, css properties for this element.
-   */
-  style:PropTypes.objectOf(PropTypes.string),
-
-  /**
-   *  The children JSX
-   */
-  children:PropTypes.node,
-
-  /**
-   * The slug of the category
-   */
-  categorySlug:PropTypes.string.isRequired,
-}
-
-BlogCategoryButton.defaultProps = {
-  // someProp:false
-}
-
-export default BlogCategoryButton

package/src/ui/c/BlogCategoryButton/index.js

@@ -1,2 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-export { default as BlogCategoryButton } from './BlogCategoryButton'

package/src/ui/c/BlogContext/BlogContextProvider.jsx

@@ -1,60 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-import * as React from 'react'
-import { useCallback } from 'react'
-
-import PropTypes from 'prop-types'
-
-import { generatePath } from 'react-router-dom'
-
-import Context from './Context'
-
-/**
- * This is the component description.
- */
-const BlogContextProvider = ({
-  urlMap,
-  children,
-  // ...otherProps
-}) => {
-  const generateBlogPath = useCallback((key, variables) => generatePath(
-    urlMap[key],
-    variables,
-  ),
-  [urlMap])
-
-  return (
-    <Context.Provider value={{
-      generateBlogPath,
-      urlMap,
-    }}
-    >
-      { children }
-    </Context.Provider>
-  )
-}
-
-BlogContextProvider.propTypes = {
-  /**
-   *  The children JSX
-   */
-  children:PropTypes.node,
-
-  /**
-   * The hash of urls
-   */
-  urlMap:PropTypes.shape({
-    HOME                   :PropTypes.string.isRequired,
-    LIST                   :PropTypes.string.isRequired,
-    LIST_PAGINATED         :PropTypes.string.isRequired,
-    LIST_CATEGORY          :PropTypes.string.isRequired,
-    LIST_CATEGORY_PAGINATED:PropTypes.string.isRequired,
-    SINGLE                 :PropTypes.string.isRequired,
-
-  }).isRequired,
-}
-
-BlogContextProvider.defaultProps = {
-  // someProp:false
-}
-
-export default BlogContextProvider