@pareto-engineering/design-system 3.0.0-alpha.29 → 4.0.0-alpha.4

package/src/assets/images/test

@@ -1 +0,0 @@
-1

package/src/local.scss

@@ -1,16 +0,0 @@
-@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap");
-
-:root {
-  --font-default: inter, helvetica, helvetica neue, arial, verdana, sans-serif;
-  --theme-border-style: 1px solid;
-  --theme-border-color: var(--paragraph);
-  --theme-border: var(--theme-border-style) var(--theme-border-color);
-  --default-gap: 1em;
-}
-
-html {
-  font-family: var(--font-default);
-  font-size: 18px;
-  font-feature-settings: 'liga' on;
-  scroll-behavior: smooth;
-}

package/src/stories/a/AnimatedCounter.stories.jsx

@@ -1,34 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-import * as React from 'react'
-
-import { AnimatedCounter } from 'ui'
-
-export default {
-  title        :'a/AnimatedCounter',
-  component    :AnimatedCounter,
-  subcomponents:{
-    // Item:AnimatedCounter.Item
-  },
-  decorators:[
-    // storyfn => <div className="">{ storyfn() }</div>,
-  ],
-  argTypes:{
-    backgroundColor:{ control: 'color' },
-  },
-}
-
-export const Base = () => (
-  <AnimatedCounter delay={5} number={100.555} after="%" />
-)
-
-export const Before = () => (
-  <AnimatedCounter delay={5} number={100} before="%" />
-)
-
-export const After = () => (
-  <AnimatedCounter delay={5} number={100} after="%" />
-)
-
-export const BeforeAndAfter = () => (
-  <AnimatedCounter delay={5} number={100} before="%" after="+" />
-)

package/src/ui/a/AnimatedCounter/AnimatedCounter.jsx

@@ -1,118 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-import * as React from 'react'
-
-import { useLayoutEffect, useCallback } from 'react'
-
-import CountUp from 'react-countup'
-
-import VisibilitySensor from 'react-visibility-sensor'
-
-import PropTypes from 'prop-types'
-
-import styleNames from '@pareto-engineering/bem/exports'
-
-// Local Definitions
-
-const baseClassName = styleNames.base
-
-const componentClassName = 'animated-counter'
-
-/**
- * This is the component description
- */
-const AnimatedCounter = ({
-  id,
-  className:userClassName,
-  style,
-  color,
-  number,
-  before,
-  after,
-  delay,
-  // ...otherProps
-}) => {
-  useLayoutEffect(() => {
-    import('./styles.scss')
-  }, [])
-
-  const countDecimals = useCallback((value) => {
-    if ((value % 1) !== 0) return value.toString().split('.')[1].length
-    return 0
-  }, [])
-
-  return (
-    <div
-      id={id}
-      className={[
-        baseClassName,
-        componentClassName,
-        userClassName,
-        `x-${color}`,
-      ]
-        .filter((e) => e)
-        .join(' ')}
-      style={style}
-      // {...otherProps}
-    >
-      <div className="count s3">
-        {before && <span>{before}</span>}
-        <CountUp end={number} delay={delay} decimals={countDecimals(number)} redraw>
-          {({ countUpRef, start }) => (
-            <VisibilitySensor onChange={start} delayedCall>
-              <span ref={countUpRef} />
-            </VisibilitySensor>
-          )}
-        </CountUp>
-        {after && <span>{after}</span>}
-      </div>
-    </div>
-  )
-}
-
-AnimatedCounter.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 count color
-   */
-  color:PropTypes.string,
-
-  /**
-   *  The review count value
-   */
-  number:PropTypes.number,
-
-  /**
-   *  The unit before the number
-   */
-  before:PropTypes.string,
-
-  /**
-   *  The unit after the number
-   */
-  after:PropTypes.string,
-
-  /**
-   *  react counter delay
-   */
-  delay:PropTypes.number,
-}
-
-AnimatedCounter.defaultProps = {
-  color:'main1',
-}
-
-export default AnimatedCounter

package/src/ui/a/AnimatedCounter/index.js

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

package/src/ui/a/AnimatedCounter/styles.scss

@@ -1,16 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-
-@use "@pareto-engineering/bem";
-//@use "@pareto-engineering/styles/src/mixins";
-//@use "@pareto-engineering/styles/src/globals" as *;
-
-.#{bem.$base}.animated-counter {
-  display: flex;
-  justify-content: center;
-
-  .count {
-    color: var(--x);
-  }
-}
-
-