react-restyle-components 0.1.60 → 0.1.62

package/lib/package.json

@@ -1,148 +0,0 @@
-{
-  "name": "react-restyle-components",
-  "version": "0.1.56",
-  "private": false,
-  "description": "Easy use restyle components",
-  "main": "lib/cjs/core-components/index.js",
-  "types": "lib/cjs/core-components/index.d.ts",
-  "author": {
-    "email": "onlyappasaheb4@gmail.com",
-    "name": "Lakade Appasaheb",
-    "url": "http://github.com/appasaheb4"
-  },
-  "license": "MIT",
-  "scripts": {
-    "start": "serve -s ./build",
-    "dev": "chmod +x setup.sh && sh ./setup.sh && craco start",
-    "serve-webapp": "craco build && craco start",
-    "build": "rm -rf lib && chmod +x npm-publish.sh && sh ./npm-publish.sh && tsc -p tsconfig.json  & tsc -p tsconfig-cjs.json",
-    "test": "react-scripts test",
-    "eject": "react-scripts eject",
-    "precommit": "lint-staged --allow-empty",
-    "storybook": "storybook dev -p 6006",
-    "build-storybook": "rm -rf docs-build && storybook build -o docs-build",
-    "deploy-storybook": "gh-pages -d docs-build",
-    "prettier": "prettier --write '**/*.{js,jsx}'",
-    "go": "npm run build && npm publish"
-  },
-  "dependencies": {
-    "@loadable/component": "^5.16.4",
-    "@mui/material": "^5.15.19",
-    "@testing-library/jest-dom": "^5.16.4",
-    "@testing-library/react": "^13.1.1",
-    "@testing-library/user-event": "^13.5.0",
-    "@types/jest": "^27.4.1",
-    "@types/react": "^18.0.5",
-    "@types/react-dom": "^18.0.1",
-    "dayjs": "^1.11.1",
-    "react-datepicker": "^4.7.0",
-    "react-icons": "^5.2.1",
-    "reactstrap": "^9.0.2",
-    "tailwindcss": "^3.0.24",
-    "typescript": "^4.6.3"
-  },
-  "peerDependencies": {
-    "@testing-library/jest-dom": "*",
-    "@testing-library/react": "*",
-    "@testing-library/user-event": "*",
-    "@types/jest": "*",
-    "@types/react": "*",
-    "@types/react-dom": "*",
-    "dayjs": "*",
-    "react": "*",
-    "react-datepicker": "*",
-    "react-dom": "*",
-    "react-scripts": "*",
-    "reactstrap": "*",
-    "tailwindcss": "*",
-    "typescript": "*",
-    "web-vitals": "*"
-  },
-  "files": [
-    "src/",
-    "lib/"
-  ],
-  "sideEffects": [
-    "**/*.css"
-  ],
-  "eslintConfig": {
-    "extends": [
-      "react-app",
-      "react-app/jest",
-      "plugin:storybook/recommended"
-    ],
-    "overrides": [
-      {
-        "files": [
-          "**/*.stories.*"
-        ],
-        "rules": {
-          "import/no-anonymous-default-export": "off"
-        }
-      }
-    ]
-  },
-  "browserslist": {
-    "production": [
-      ">0.2%",
-      "not dead",
-      "not op_mini all"
-    ],
-    "development": [
-      "last 1 chrome version",
-      "last 1 firefox version",
-      "last 1 safari version"
-    ]
-  },
-  "devDependencies": {
-    "@chromatic-com/storybook": "^1.3.1",
-    "@craco/craco": "^6.4.3",
-    "@emotion/react": "^11.11.4",
-    "@emotion/styled": "^11.11.5",
-    "@storybook/addon-essentials": "^8.0.6",
-    "@storybook/addon-interactions": "^8.0.6",
-    "@storybook/addon-links": "^8.0.6",
-    "@storybook/addon-onboarding": "^8.0.6",
-    "@storybook/addon-webpack5-compiler-swc": "^1.0.2",
-    "@storybook/blocks": "^8.0.6",
-    "@storybook/react": "^8.0.6",
-    "@storybook/react-webpack5": "^8.0.6",
-    "@storybook/test": "^8.0.6",
-    "@svgr/webpack": "^8.1.0",
-    "autoprefixer": "^10.4.19",
-    "copyfiles": "^2.4.1",
-    "craco-alias": "^3.0.1",
-    "css-loader": "^7.1.2",
-    "eslint-plugin-storybook": "^0.8.0",
-    "gh-pages": "^3.2.3",
-    "husky": "^7.0.4",
-    "lint-staged": "^12.4.0",
-    "postcss-loader": "^8.1.1",
-    "storybook": "^8.0.6",
-    "style-loader": "^4.0.0",
-    "webpack": "^5.72.0"
-  },
-  "keywords": [
-    "react",
-    "components",
-    "restyle-components",
-    "tech-abl"
-  ],
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/appasaheb4/react-restyle-components.git"
-  },
-  "bugs": {
-    "url": "https://github.com/appasaheb4/react-restyle-components/issues"
-  },
-  "homepage": "https://github.com/appasaheb4/react-restyle-components#readme",
-  "lint-staged": {
-    "*.{js,jsx,json,css,scss,md}": [
-      "prettier --write",
-      "git add"
-    ]
-  },
-  "resolutions": {
-    "jackspeak": "2.1.1"
-  }
-}

package/src/App.css

@@ -1,38 +0,0 @@
-.App {
-  text-align: center;
-}
-
-.App-logo {
-  height: 40vmin;
-  pointer-events: none;
-}
-
-@media (prefers-reduced-motion: no-preference) {
-  .App-logo {
-    animation: App-logo-spin infinite 20s linear;
-  }
-}
-
-.App-header {
-  background-color: #282c34;
-  min-height: 100vh;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  font-size: calc(10px + 2vmin);
-  color: white;
-}
-
-.App-link {
-  color: #61dafb;
-}
-
-@keyframes App-logo-spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}

package/src/App.test.tsx

@@ -1,9 +0,0 @@
-import React from 'react';
-import { render, screen } from '@testing-library/react';
-import App from './App';
-
-test('renders learn react link', () => {
-  render(<App />);
-  const linkElement = screen.getByText(/learn react/i);
-  expect(linkElement).toBeInTheDocument();
-});

package/src/App.tsx

@@ -1,26 +0,0 @@
-import React from 'react';
-import logo from './logo.svg';
-import './App.css';
-
-function App() {
-  return (
-    <div className="App">
-      <header className="App-header">
-        <img src={logo as any} className="App-logo" alt="logo" />
-        <p>
-          Edit <code>src/App.tsx</code> and save to reload.
-        </p>
-        <a
-          className="App-link"
-          href="https://reactjs.org"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          Learn React
-        </a>
-      </header>
-    </div>
-  );
-}
-
-export default App;

package/src/core-components/atoms/buttons/button.stories.tsx

@@ -1,42 +0,0 @@
-import React from 'react';
-import type {Meta, StoryObj} from '@storybook/react';
-import {Button} from './buttons.component';
-// import {Title, Component, Source, Canvas, ArgTypes} from '@storybook/blocks';
-import {fn} from '@storybook/test';
-
-const meta: Meta<typeof Button> = {
-  title: 'Design System/Atoms/Button',
-  component: Button,
-  tags: ['autodocs'],
-  args: {
-    className: 'w-40',
-  },
-  parameters: {
-    componentSubtitle: `import { Button } from 'react-restyle-components'`,
-  },
-};
-
-export default meta;
-type Story = StoryObj<typeof Button>;
-
-export const Primary: Story = {
-  // parameters: {
-  //   backgrounds: {
-  //     default: 'dark',
-  //   },
-  // },
-  args: {
-    disable: false,
-    type: 'solid' || 'outline',
-    children: <span>Primary</span>,
-    onClick: fn(),
-  },
-};
-
-// export const Disable: Story = {
-//   args: {
-//     ...Primary.args,
-//     children: <span>Disable</span>,
-//     disable: true,
-//   },
-// };

package/src/core-components/atoms/buttons/buttons.component.tsx

@@ -1,33 +0,0 @@
-import React from 'react';
-interface ButtonProps {
-  type?: 'solid' | 'outline';
-  className?: any;
-  disable?: boolean;
-  onClick: () => void;
-  children: React.ReactNode;
-}
-
-export const Button = ({
-  type = 'solid',
-  className = 'w-40',
-  disable = false,
-  onClick,
-  children,
-}: ButtonProps) => {
-  const buttonColorClass =
-    type === 'solid'
-      ? 'text-white bg-[#007BFF] hover:bg-[#007BFF] hover:shadow-lg text-white'
-      : 'dark:text-white  text-black border border-gray-400 hover:shadow-lg';
-  return (
-    <button
-      data-testid="buttonElement"
-      disabled={disable}
-      className={`${className} rounded-100px px-3 py-1  text-md ${buttonColorClass} pt-2 pb-2 font-nunitoSansRegular ${
-        disable ? 'opacity-50' : 'opacity-100'
-      }`}
-      onClick={() => onClick()}
-    >
-      {children}
-    </button>
-  );
-};

package/src/core-components/atoms/buttons/buttons.test.tsx

@@ -1,13 +0,0 @@
-/* eslint-disable testing-library/render-result-naming-convention */
-import React from 'react';
-import {render} from '@core-utils';
-import {Button} from './buttons.component';
-
-it('render Button correctly', () => {
-  const button = render(
-    <Button className="bg-gray-light w-40" onClick={() => jest.fn()}>
-      Permanent Address
-    </Button>
-  );
-  expect(button).toMatchSnapshot();
-});

package/src/core-components/atoms/check-box/checkBox.component.tsx

@@ -1,54 +0,0 @@
-import React, {useState} from 'react';
-import {UnCheckbox, CheckedBox} from '../../../library/assets/svg';
-import {InputWrapper} from '../form/form.component';
-interface CheckBoxProps {
-  title: string;
-  data: Array<any>;
-  className?: string;
-  disable?: boolean;
-  onChange: (items: any) => void;
-}
-
-export const CheckBox = ({
-  title = 'Banks',
-  data = [{title: 'SBI Bank', checked: false}],
-  className,
-  onChange,
-}: CheckBoxProps) => {
-  const [list, setList] = useState(data);
-  const width = 20;
-
-  return (
-    <InputWrapper label={title}>
-      {list?.map((item, index) => (
-        <div
-          className={`${className} flex flex-row  items-center `}
-          onClick={() => {
-            const result = list?.map((e, i) => {
-              if (i == index) return {...e, checked: !item.checked};
-              else return {...e};
-            });
-            setList(result);
-            onChange(result?.filter((item) => item.checked));
-          }}
-          key={index}
-        >
-          <div className="flex mt-1">
-            {item.checked ? (
-              <CheckedBox
-                width={width}
-                height={width}
-                fill="#E7503D"
-                stroke="E7503D"
-              />
-            ) : (
-              <UnCheckbox width={width} height={width} />
-            )}
-          </div>
-
-          <span>{item?.title}</span>
-        </div>
-      ))}
-    </InputWrapper>
-  );
-};

package/src/core-components/atoms/check-box/checkBox.stories.tsx

@@ -1,29 +0,0 @@
-import React from 'react';
-import type {Meta, StoryObj} from '@storybook/react';
-import {CheckBox} from './checkBox.component';
-
-const meta: Meta<typeof CheckBox> = {
-  title: 'Design System/Atoms/CheckBox',
-  component: CheckBox,
-  tags: ['autodocs'],
-  parameters: {
-    componentSubtitle: `import { CheckBox } from 'react-restyle-components'`,
-  },
-};
-
-export default meta;
-type Story = StoryObj<typeof CheckBox>;
-
-export const Primary1: Story = {
-  args: {
-    title: 'Banks',
-    data: [
-      {title: 'SBI Bank', checked: false},
-      {title: 'ICICI Bank', checked: false},
-    ],
-    disable: false,
-    onChange: (item) => {
-      console.log({item});
-    },
-  },
-};

package/src/core-components/atoms/check-box/checkBox.test.tsx

@@ -1,11 +0,0 @@
-/* eslint-disable testing-library/render-result-naming-convention */
-import React from 'react';
-import {render} from '@core-utils';
-import {CheckBox} from './checkBox.component';
-
-it('render CheckBox correctly', () => {
-  const checkbox = render(
-    <CheckBox title="Title" data={[]} onChange={() => jest.fn()} />
-  );
-  expect(checkbox).toMatchSnapshot();
-});

package/src/core-components/atoms/date-picker/date-picker.component.tsx

@@ -1,60 +0,0 @@
-import React, {useState, forwardRef} from 'react';
-import DatePicker from 'react-datepicker';
-import 'react-datepicker/dist/react-datepicker.css';
-import {DatePickerSvg} from '../../../library/assets/svg';
-import dayjs from 'dayjs';
-import {InputWrapper} from '../form/form.component';
-
-interface DatePickerProps {
-  title: string;
-  value?: string;
-  className?: string;
-  disable?: boolean;
-  showFormat?: string;
-  placeholder?: string;
-}
-
-export const DatePickerComp = ({
-  title = 'Title',
-  className,
-  disable,
-  value,
-  showFormat = 'yyyy-MM-dd',
-  placeholder = 'Select Date',
-}: DatePickerProps) => {
-  const [pickedDate, setPickedDate] = useState(value && dayjs(value).toDate());
-
-  const CustomInput = forwardRef((props: any, ref: any) => {
-    return (
-      <div
-        onClick={!disable && props.onClick}
-        ref={ref}
-        className=" border-gray-light place-items-center  border rounded-md px-2 flex "
-      >
-        <label className="mr-3 font-nunitoSansRegular text-primaryCharcoal text-lg">
-          {props.value || props.placeholder}
-        </label>
-        <DatePickerSvg width={15} height={15} />
-      </div>
-    );
-  });
-  CustomInput.displayName = 'CustomInput';
-
-  const handleChanges = (date) => {
-    setPickedDate(date);
-  };
-
-  return (
-    <InputWrapper label={title}>
-      <div className={`${className} flex zIndex-999`}>
-        <DatePicker
-          selected={pickedDate || new Date()}
-          dateFormat={showFormat}
-          placeholder={placeholder}
-          onChange={handleChanges}
-          customInput={<CustomInput />}
-        />
-      </div>
-    </InputWrapper>
-  );
-};

package/src/core-components/atoms/date-picker/date-picker.stories.tsx

@@ -1,23 +0,0 @@
-import React from 'react';
-import dayjs from 'dayjs';
-import type {Meta, StoryObj} from '@storybook/react';
-import {DatePickerComp} from './date-picker.component';
-
-const meta: Meta<typeof DatePickerComp> = {
-  title: 'Design System/Atoms/DatePicker',
-  component: DatePickerComp,
-  tags: ['autodocs'],
-  parameters: {
-    componentSubtitle: `import { DatePickerComp } from 'react-restyle-components'`,
-  },
-};
-export default meta;
-type Story = StoryObj<typeof DatePickerComp>;
-
-export const Primary: Story = {
-  args: {
-    title: 'Date',
-    value: dayjs().format('YYYY-MM-DD'),
-    showFormat: 'dd-MM-yyyy',
-  },
-};

package/src/core-components/atoms/date-picker/date-picker.test.tsx

@@ -1,17 +0,0 @@
-/* eslint-disable testing-library/render-result-naming-convention */
-import React from 'react';
-import {render} from '@core-utils';
-import {DatePickerComp} from './date-picker.component';
-import dayjs from 'dayjs';
-
-it('render DatePicker correctly', () => {
-  const datepicker = render(
-    <DatePickerComp
-      title="Date"
-      className="mt-6"
-      value={dayjs().format('YYYY-MM-DD')}
-      showFormat={'dd-MM-yyyy'}
-    />
-  );
-  expect(datepicker).toMatchSnapshot();
-});