react-jupiter 6.0.0-beta.1 → 6.0.0-beta.10

package/src/docs/components/side-navigation/index.js

@@ -1,167 +0,0 @@
-import React, { createContext, useContext, useState } from 'react';
-import PropTypes from 'prop-types';
-import styled from 'styled-components';
-
-const NavContext = createContext();
-
-const Container = styled.div`
-  direction: ${({ ltr }) => (ltr ? 'ltr' : 'rtl')};
-  width: 100%;
-`;
-
-const NavTitle = styled.div`
-  font-size: 14px;
-  font-weight: 600;
-  color: #666;
-  padding: 16px 24px 8px;
-  text-transform: uppercase;
-`;
-
-const NavItemContainer = styled.div`
-  padding: 8px 24px;
-  cursor: pointer;
-  color: ${({ selected }) => (selected ? '#000' : '#666')};
-  background-color: ${({ selected }) => (selected ? '#f5f5f5' : 'transparent')};
-  &:hover {
-    background-color: #f5f5f5;
-  }
-`;
-
-const NavItemTitle = styled.span`
-  font-size: 14px;
-`;
-
-const Link = styled.a`
-  text-decoration: none;
-  color: inherit;
-  display: block;
-`;
-
-const NavItem = ({ title, ltr = false, id }) => {
-  const { selectedId, setSelectedId } = useContext(NavContext);
-  const selected = selectedId === id;
-
-  return (
-    <NavItemContainer 
-      selected={selected} 
-      ltr={ltr}
-      onClick={() => setSelectedId(id)}
-    >
-      <NavItemTitle>{title}</NavItemTitle>
-    </NavItemContainer>
-  );
-};
-
-NavItem.propTypes = {
-  title: PropTypes.string.isRequired,
-  ltr: PropTypes.bool,
-  id: PropTypes.string.isRequired,
-};
-
-const Nav = ({ children, id }) => {
-  const { selectedId } = useContext(NavContext);
-  const selected = selectedId === id;
-
-  return React.cloneElement(children, { selected });
-};
-
-Nav.propTypes = {
-  children: PropTypes.node.isRequired,
-  id: PropTypes.string.isRequired,
-};
-
-const SideNav = ({ children, defaultSelectedPath }) => {
-  const [selectedId, setSelectedId] = useState(defaultSelectedPath);
-
-  return (
-    <NavContext.Provider value={{ selectedId, setSelectedId }}>
-      {children}
-    </NavContext.Provider>
-  );
-};
-
-SideNav.propTypes = {
-  children: PropTypes.node.isRequired,
-  defaultSelectedPath: PropTypes.string.isRequired,
-};
-
-const SideNavigation = ({ ltr = false }) => (
-  <Container ltr={ltr}>
-    <NavTitle>معرفی</NavTitle>
-    <SideNav defaultSelectedPath="1">
-      <Nav id="1">
-        <Link href="/">
-          <NavItem title="چرا؟" ltr={ltr} id="1" />
-        </Link>
-      </Nav>
-      <Nav id="2">
-        <NavItem title="ویژگی‌ها" ltr={ltr} id="2" />
-      </Nav>
-      <Nav id="3">
-        <NavItem title="منابع" ltr={ltr} id="3" />
-      </Nav>
-      <NavTitle>شروع و راه اندازی</NavTitle>
-      <Nav id="4">
-        <NavItem title="نصب" ltr={ltr} id="4" />
-      </Nav>
-      <Nav id="5">
-        <NavItem title="راه اندازی" ltr={ltr} id="5" />
-      </Nav>
-      <Nav id="6">
-        <NavItem title="مفاهیم" ltr={ltr} id="6" />
-      </Nav>
-      <NavTitle>کامپوننت‌ها</NavTitle>
-      <Nav id="7">
-        <Link href="/components/typography">
-          <NavItem title="تایپوگرافی" ltr={ltr} id="7" />
-        </Link>
-      </Nav>
-      <Nav id="8">
-        <Link href="/components/button">
-          <NavItem title="دکمه‌ها" ltr={ltr} id="8" />
-        </Link>
-      </Nav>
-      <Nav id="9">
-        <Link href="/components/avatar">
-          <NavItem title="آواتار" ltr={ltr} id="9" />
-        </Link>
-      </Nav>
-      <Nav id="10">
-        <Link href="/components/icon">
-          <NavItem title="آیکون" ltr={ltr} id="10" />
-        </Link>
-      </Nav>
-      <Nav id="11">
-        <Link href="/components/icons">
-          <NavItem title="آیکون‌ها" ltr={ltr} id="11" />
-        </Link>
-      </Nav>
-      <Nav id="12">
-        <Link href="/components/card">
-          <NavItem title="کارت" ltr={ltr} id="12" />
-        </Link>
-      </Nav>
-      <Nav id="13">
-        <Link href="/components/cover">
-          <NavItem title="کاور" ltr={ltr} id="13" />
-        </Link>
-      </Nav>
-      <Nav id="14">
-        <Link href="/components/form">
-          <NavItem title="فرم" ltr={ltr} id="14" />
-        </Link>
-      </Nav>
-      <Nav id="15">
-        <Link href="/components/product">
-          <NavItem title="کامپوننت های پروداکت" ltr={ltr} id="15" />
-        </Link>
-      </Nav>
-    </SideNav>
-  </Container>
-);
-
-SideNavigation.propTypes = {
-  ltr: PropTypes.bool,
-};
-
-export default SideNavigation;

package/src/docs/components/side-navigation/index.styles.js

@@ -1,46 +0,0 @@
-import styled from 'styled-components';
-import { Link as RouterLink } from 'react-router-dom';
-
-export const Container = styled.div`
-  background: #fff;
-  min-width: 180px;
-  color: #444;
-  ${({ ltr }) => (ltr ? 'border-right: 1px solid #e5e5e5' : 'border-left: 1px solid #e5e5e5')}
-  float: right;
-  position: absolute;
-  height: 100%;
-`;
-
-
-export const NavTitle = styled.div`
-  padding: 8px;
-  margin-bottom: -8px;
-  font-size: 0.92em;
-  color: #a5a5a5;
-`;
-
-export const NavItemContainer = styled.div`
-  display: flex;
-  justify-content: flex-start;
-  align-items: center;
-  padding: 8px 16px;
-  background: ${(props) => (props.selected ? '#F5F5F5' : 'inherit')};
-  cursor: pointer;
-  transition: all 0.3s ease-in-out;
-  ${({ ltr, selected }) => (!ltr
-    ? `border-right: 4px solid ${selected ? '#DE0A5F' : 'transparent'}`
-    : `border-left: 4px solid ${selected ? '#DE0A5F' : 'transparent'}`
-  )}
-  &:hover {
-    background: #f5f5f5;
-  }
-`;
-export const NavItemTitle = styled.div`
-  padding-left: 6px;
-  line-height: 22px;
-`;
-
-export const Link = styled(RouterLink)`
-  color: #444;
-  text-decoration: none;
-`;

package/src/docs/containers/avatar/index.js

@@ -1,92 +0,0 @@
-import React from 'react';
-import styled from 'styled-components';
-import { Typography, Avatar, FileItem } from '../../../components';
-
-const AvatarWrapper = styled(Avatar)`
-  border: 1px solid red;
-`;
-
-const { Heading, Link } = Typography;
-
-const AvatarPage = () => (
-  <>
-    <Heading level={1}>
-      آواتار
-    </Heading>
-    <br />
-    <br />
-
-    <Heading level={2}>
-      آواتار با حداقل پارامتر ها
-    </Heading>
-    <Avatar src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcRqkhWwKzw6iSa0JBXxtse4JPKKR5VVmRXwBF0j_Bqooq9nVDoZ" />
-    <br />
-
-    <Heading level={2}>
-      آواتار همراه با لینک
-    </Heading>
-    <Link to="http://yahoo.com" external>
-      <Avatar alt="cat" src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcRqkhWwKzw6iSa0JBXxtse4JPKKR5VVmRXwBF0j_Bqooq9nVDoZ" />
-    </Link>
-    <br />
-
-    <Heading level={2}>
-      آواتار در اندازه های متفاوت
-    </Heading>
-
-    <Heading level={3}>
-      sm size
-    </Heading>
-    <Avatar alt="cat" size="sm" src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcRqkhWwKzw6iSa0JBXxtse4JPKKR5VVmRXwBF0j_Bqooq9nVDoZ" />
-    <br />
-
-    <Heading level={3}>
-      md size (default)
-    </Heading>
-    <Avatar alt="cat" src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcRqkhWwKzw6iSa0JBXxtse4JPKKR5VVmRXwBF0j_Bqooq9nVDoZ" />
-    <br />
-
-    <Heading level={3}>
-      lg size
-    </Heading>
-    <Avatar alt="cat" size="lg" src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcRqkhWwKzw6iSa0JBXxtse4JPKKR5VVmRXwBF0j_Bqooq9nVDoZ" />
-    <br />
-
-    <Heading level={2}>
-      آواتار با
-      wrapper
-      ای که ویژگی های آن را تغییر میدهد
-    </Heading>
-    <AvatarWrapper alt="cat" src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcRqkhWwKzw6iSa0JBXxtse4JPKKR5VVmRXwBF0j_Bqooq9nVDoZ" />
-    <br />
-
-    <Heading level={2}>
-      آواتار با آدرس دهی نا موجود
-    </Heading>
-    <Avatar alt="گربه ی ناز نازی" src="wrong-src" />
-    <br />
-
-    <Heading level={2}>
-      آواتار  بدون آدرس دهی
-    </Heading>
-    <Avatar alt="گربه ی ناز نازی" />
-    <br />
-
-
-    <Heading level={2}>
-      تست فایل
-    </Heading>
-    <FileItem
-      description="متن توضیحات"
-      fileSize="۵ مگابایت"
-      onClick={() => (window.console.log('finallyyyyy'))}
-      price="۶۰۰۰ تومن"
-      title="فایل جلسه اول ما"
-      type="zip"
-    />
-    <br />
-
-  </>
-);
-
-export default AvatarPage;

package/src/docs/containers/button/index.js

@@ -1,295 +0,0 @@
-import React from 'react';
-import { Link } from 'react-router-dom';
-import styled from 'styled-components';
-import { Typography, Button } from '../../../components';
-
-const { Heading } = Typography;
-
-const ButtonWrapper = styled.div`
-  display: flex;
-`;
-
-const ButtonPage = () => (
-  <>
-    <Heading level={1}>
-      دکمه ها
-    </Heading>
-    <br />
-    <br />
-
-    <Heading level={2}>
-      نمونه دکمه پیشفرض
-    </Heading>
-    <Button>
-      دکمه
-    </Button>
-    <br />
-
-    <Heading level={2}>
-      دکمه آیکون دار
-    </Heading>
-    <Button icon="watch-later">
-      دکمه آیکون دار
-    </Button>
-    <br />
-
-    <Heading level={2}>
-      دکمه full-width
-    </Heading>
-    <Button wide size="sm">
-      دکمه full-width (sm size)
-    </Button>
-    <Button wide>
-      دکمه full-width(md size - default)
-    </Button>
-    <Button wide size="lg">
-      دکمه full-width(lg size)
-    </Button>
-    <br />
-
-    <Heading level={2}>
-      دکمه در اندازه های متفاوت
-    </Heading>
-
-    <Heading level={3}>
-      sm size
-    </Heading>
-    <Button size="sm">
-      دکمه
-    </Button>
-    <Button size="sm" icon="watch-later">
-      دکمه
-    </Button>
-    <br />
-
-    <Heading level={3}>
-      md size (default)
-    </Heading>
-    <Button size="md">
-      دکمه
-    </Button>
-    <Button size="md" icon="watch-later">
-      دکمه
-    </Button>
-    <br />
-
-    <Heading level={3}>
-      lg size
-    </Heading>
-    <Button size="lg">
-      دکمه
-    </Button>
-    <Button size="lg" icon="watch-later">
-      دکمه
-    </Button>
-    <br />
-
-    <Heading level={2}>
-      دکمه ها در استایل ها متفاوت و رنگ های متفاوت
-    </Heading>
-    <Heading level={3}>
-      رنگ قرمز
-    </Heading>
-    <Heading level={4}>
-      رنگ قرمز - normal
-    </Heading>
-    <ButtonWrapper>
-      <Button styleType="primary" icon="watch-later" mainColor="red">
-        دکمه primary (default)
-      </Button>
-      <Button styleType="secondary" icon="watch-later" mainColor="red">
-        دکمه secondary
-      </Button>
-      <Button styleType="tertiary" icon="watch-later" mainColor="red">
-        دکمه tertiary
-      </Button>
-    </ButtonWrapper>
-    <Heading level={4}>
-      رنگ قرمز - disabled
-    </Heading>
-    <ButtonWrapper>
-      <Button styleType="primary" icon="watch-later" mainColor="red" disabled>
-        دکمه primary (default) - disabled
-      </Button>
-      <Button styleType="secondary" icon="watch-later" mainColor="red" disabled>
-        دکمه secondary - disabled
-      </Button>
-      <Button styleType="tertiary" icon="watch-later" mainColor="red" disabled>
-        دکمه tertiary - disabled
-      </Button>
-    </ButtonWrapper>
-    <hr />
-    <Heading level={3}>
-      رنگ سبز
-    </Heading>
-    <Heading level={4}>
-      رنگ سبز - normal
-    </Heading>
-    <ButtonWrapper>
-      <Button styleType="primary" icon="watch-later" mainColor="green">
-        دکمه primary (default)
-      </Button>
-      <Button styleType="secondary" icon="watch-later" mainColor="green">
-        دکمه secondary
-      </Button>
-      <Button styleType="tertiary" icon="watch-later" mainColor="green">
-        دکمه tertiary
-      </Button>
-    </ButtonWrapper>
-    <Heading level={4}>
-      رنگ سبز - disabled
-    </Heading>
-    <ButtonWrapper>
-      <Button styleType="primary" icon="watch-later" mainColor="green" disabled>
-        دکمه primary (default) - disabled
-      </Button>
-      <Button styleType="secondary" icon="watch-later" mainColor="green" disabled>
-        دکمه secondary - disabled
-      </Button>
-      <Button styleType="tertiary" icon="watch-later" mainColor="green" disabled>
-        دکمه tertiary - disabled
-      </Button>
-    </ButtonWrapper>
-    <hr />
-    <Heading level={3}>
-      رنگ زرد
-    </Heading>
-    <Heading level={4}>
-      رنگ زرد - normal
-    </Heading>
-    <ButtonWrapper>
-      <Button styleType="primary" icon="watch-later" mainColor="yellow">
-        دکمه primary (default)
-      </Button>
-      <Button styleType="secondary" icon="watch-later" mainColor="yellow">
-        دکمه secondary
-      </Button>
-      <Button styleType="tertiary" icon="watch-later" mainColor="yellow">
-        دکمه tertiary
-      </Button>
-    </ButtonWrapper>
-    <Heading level={4}>
-      رنگ زرد - disabled
-    </Heading>
-    <ButtonWrapper>
-      <Button styleType="primary" icon="watch-later" mainColor="yellow" disabled>
-        دکمه primary (default) - disabled
-      </Button>
-      <Button styleType="secondary" icon="watch-later" mainColor="yellow" disabled>
-        دکمه secondary - disabled
-      </Button>
-      <Button styleType="tertiary" icon="watch-later" mainColor="yellow" disabled>
-        دکمه tertiary - disabled
-      </Button>
-    </ButtonWrapper>
-    <hr />
-    <Heading level={3}>
-      رنگ آبی
-    </Heading>
-    <Heading level={4}>
-      رنگ آبی - normal
-    </Heading>
-    <ButtonWrapper>
-      <Button styleType="primary" icon="watch-later" mainColor="blue">
-        دکمه primary (default)
-      </Button>
-      <Button styleType="secondary" icon="watch-later" mainColor="blue">
-        دکمه secondary
-      </Button>
-      <Button styleType="tertiary" icon="watch-later" mainColor="blue">
-        دکمه tertiary
-      </Button>
-    </ButtonWrapper>
-    <Heading level={4}>
-      رنگ آبی - disabled
-    </Heading>
-    <ButtonWrapper>
-      <Button styleType="primary" icon="watch-later" mainColor="blue" disabled>
-        دکمه primary (default) - disabled
-      </Button>
-      <Button styleType="secondary" icon="watch-later" mainColor="blue" disabled>
-        دکمه secondary - disabled
-      </Button>
-      <Button styleType="tertiary" icon="watch-later" mainColor="blue" disabled>
-        دکمه tertiary - disabled
-      </Button>
-    </ButtonWrapper>
-    <hr />
-    <Heading level={3}>
-      رنگ آبی تیره - پیشفرض
-    </Heading>
-    <Heading level={4}>
-      رنگ آبی تیره - پیشفرض - normal
-    </Heading>
-    <ButtonWrapper>
-      <Button styleType="primary" icon="watch-later">
-        دکمه primary (default)
-      </Button>
-      <Button styleType="secondary" icon="watch-later">
-        دکمه secondary
-      </Button>
-      <Button styleType="tertiary" icon="watch-later">
-        دکمه tertiary
-      </Button>
-    </ButtonWrapper>
-    <Heading level={4}>
-      رنگ آبی تیره - پیشفرض - disabled
-    </Heading>
-    <ButtonWrapper>
-      <Button styleType="primary" icon="watch-later" disabled>
-        دکمه primary (default) - disabled
-      </Button>
-      <Button styleType="secondary" icon="watch-later" disabled>
-        دکمه secondary - disabled
-      </Button>
-      <Button styleType="tertiary" icon="watch-later" disabled>
-        دکمه tertiary - disabled
-      </Button>
-    </ButtonWrapper>
-    <br />
-
-    <Heading level={2}>
-      دکمه لینک دار
-    </Heading>
-    <ButtonWrapper>
-      <Button linkTo="/avatar">
-        دکمه لینک ساده با تنظیمات پیشفرض
-      </Button>
-      <Button styleType="secondary" icon="watch-later" linkTo="https://sciencebusiness.net/categories/dfgdfg" linkTarget="_blank">
-        دکمه لینک با لینک خارجی
-      </Button>
-      <Button
-        styleType="tertiary"
-        icon="watch-later"
-        renderLink={(element) => <Link to="/tosomewherenew">{element}</Link>}
-        linkTarget="_self"
-      >
-        دکمه لینک داخلی (نمونه کامل)
-      </Button>
-    </ButtonWrapper>
-    <Heading level={4}>
-      دکمه لینک دار - disabled
-    </Heading>
-    <ButtonWrapper>
-      <Button styleType="primary" icon="watch-later" linkTo="/avatar" disabled>
-        دکمه لینک ساده با تنظیمات پیشفرض - disabled
-      </Button>
-      <Button styleType="secondary" icon="watch-later" linkTo="https://sciencebusiness.net/categories/dfgdfg" linkTarget="_blank" disabled>
-        دکمه لینک با لینک خارجی - disabled
-      </Button>
-      <Button
-        styleType="tertiary"
-        icon="watch-later"
-        linkTarget="_self"
-        renderLink={(element) => <Link to="/tosomewherenew">{element}</Link>}
-        disabled
-      >
-        دکمه لینک داخلی (نمونه کامل) - disabled
-      </Button>
-    </ButtonWrapper>
-    <br />
-
-  </>
-);
-
-export default ButtonPage;