pixel-react 1.6.5 → 1.6.6

package/src/index.ts

@@ -1,189 +1,193 @@
-import Button from './components/Button';
-import Drawer from './components/Drawer';
-import Icon from './components/Icon';
-import Accordion from './components/Accordion';
-import MultiSelect from './components/MultiSelect';
-import Toaster from './components/Toast/Toast';
-import { Container, Row, Col } from './components/GridLayout/GridLayout';
-import Toggle from './components/Toggle';
-import Chip from './components/Chip';
-import Tooltip from './components/Tooltip';
-import Input from './components/Input';
-import RadialChart from './components/Charts/RadialChart';
-import ExpandableMenu from './components/ExpandableMenu';
-import Select from './components/Select/Select';
-import TextArea from './components/TextArea';
-import StatusButton from './components/StatusButton';
-import MenuOption from './components/MenuOption';
-import Table from './components/Table/Table';
-import AddResourceButton from './components/AddResourceButton';
-import DonutChart from './components/Charts/DonutChart';
-import FileDropzone from './components/FileDropzone';
-import Dropzone from './components/FileDropzone/Dropzone';
-import FilePreview from './components/FileDropzone/FilePreview';
-import LazyLoad from './components/LazyLoad/LazyLoad';
-import ThemeProvider from './components/ThemeProvider';
-import Typography from './components/Typography';
-import useTheme from './hooks/useTheme';
-import Form from './components/Form/Forms';
-import InputWithDropdown from './components/InputWithDropdown';
-import RadioButton from './components/RadioButton';
-import RadioGroup from './components/RadioGroup';
-import MiniModal from './components/MiniModal';
-import TableTree from './components/TableTree';
-import Tabs from './components/Tabs';
-import HighlightText from './components/HighlightText';
-import Checkbox from './components/Checkbox';
-import Search from './components/Search/Search';
-import DatePicker from './components/DatePicker';
-import StateDropdown from './components/StateDropdown';
-import IconButton from './components/IconButton';
-import Modal from './components/Modal';
-import DragAndDrop from './components/DragAndDrop/DragAndDrop';
-import VariableInput from './components/VariableInput';
-import AllProjectsDropdown from './components/AllProjectsDropdown';
-import PieChart from './components/Charts/PieChart';
-import AppHeader from './components/AppHeader';
-import Paper from './components/Paper';
-import DashboardDonutChart from './components/Charts/DashboardDonutChart';
-import Recaptcha from './components/FF_Captcha/Recaptcha';
-import NLPInput from './components/NLPInput';
-import IconRadioGroup from './components/IconRadioGroup';
-import MachineInputField from './components/MachineInputField';
-import SequentialConnectingBranch from './components/SequentialConnectingBranch';
-import AttachmentButton from './components/AttachmentButton';
-import { Toastify, toast } from './components/Toastify/Toastify';
-import ToggleSwitch from './components/ToggleSwitch/ToggleSwitch';
-import Avatar from './components/Avatar/Avatar';
-
-import LabelEditTextField from './components/LabelEditTextField';
-import EditTextField from './components/EditTextField';
-import Excel from './components/Excel';
-import ModuleChip from './components/ModulesChip/ModuleChip';
-import IconRadialChart from './components/Charts/IconRadialChart';
-import AttachImage from './components/AttachImage';
-import StatusCard from './components/StatusCard';
-import VariableDropdown from './components/Editor/VariableDropdown';
-
-import LineChart from './components/Charts/LineChart';
-import DownloadClient from './components/DownloadClient/DownloadClient';
-import FieldSet from './components/FieldSet';
-import CreateVariableSlider from './components/CreateVariable/CreateVariableSlider';
-// Utils imports
-import { checkEmpty } from './utils/checkEmpty/checkEmpty';
-import {
-  getExtension,
-  getExtensionWithPeriod,
-} from './utils/getExtension/getExtension';
-import { findAndInsert } from './utils/findAndInsert/findAndInsert';
-import { ffid } from './utils/ffID/ffid';
-import { debounce } from './utils/debounce/debounce';
-import { compareArrays } from './utils/compareArrays/compareArrays';
-import { compareObjects } from './utils/compareObjects/compareObjects';
-import { getEncryptedData } from './utils/getEncryptedData/getEncryptedData';
-import { throttle } from './utils/throttle/throttle';
-import { truncateText } from './utils/truncateText/truncateText';
-import BarChart from './components/Charts/BarChart';
-import MultiRadialChart from './components/Charts/MultiRadialChart';
-import Editor from './components/Editor/Editor';
-import { getSequentialPayload } from './utils/getSequentialPayload/getSequentialPayload';
-import ConnectingBranch from './components/ConnectingBranch/ConnectingBranch';
-import { saveFileFromBlob } from './utils/downloadFile/saveFileFromBlob';
-import useFileDropzone from './hooks/useFileDropzone';
-import PopUpModal from './components/PopUpModal/PopUpModal';
-
-export {
-  Button,
-  Tooltip,
-  Icon,
-  Accordion,
-  MultiSelect,
-  Toaster,
-  Toggle,
-  Chip,
-  Drawer,
-  Input,
-  RadialChart,
-  ExpandableMenu,
-  Select,
-  TextArea,
-  MenuOption,
-  AddResourceButton,
-  DonutChart,
-  FileDropzone,
-  Dropzone,
-  FilePreview,
-  LazyLoad,
-  ThemeProvider,
-  Typography,
-  useTheme,
-  InputWithDropdown,
-  Table,
-  RadioButton,
-  RadioGroup,
-  Form,
-  MiniModal,
-  Container,
-  Row,
-  Col,
-  HighlightText,
-  TableTree,
-  Tabs,
-  Checkbox,
-  Search,
-  DatePicker,
-  StateDropdown,
-  StatusButton,
-  IconButton,
-  Modal,
-  PieChart,
-  DashboardDonutChart,
-  DragAndDrop,
-  AllProjectsDropdown,
-  AppHeader,
-  VariableInput,
-  Paper,
-  Recaptcha,
-  NLPInput,
-  MachineInputField,
-  SequentialConnectingBranch,
-  Editor,
-  AttachmentButton,
-  LabelEditTextField,
-  Excel,
-  IconRadioGroup,
-  Toastify,
-  toast,
-  ModuleChip,
-  IconRadialChart,
-  LineChart,
-  BarChart,
-  MultiRadialChart,
-  ConnectingBranch,
-  StatusCard,
-  EditTextField,
-  AttachImage,
-  ToggleSwitch,
-  Avatar,
-  VariableDropdown,
-  DownloadClient,
-  FieldSet,
-  PopUpModal,
-  CreateVariableSlider,
-
-  // utils exports
-  checkEmpty,
-  getExtension,
-  getExtensionWithPeriod,
-  findAndInsert,
-  ffid,
-  compareArrays,
-  compareObjects,
-  debounce,
-  throttle,
-  getEncryptedData,
-  truncateText,
-  getSequentialPayload,
-  saveFileFromBlob,
-  useFileDropzone,
-};
+import Button from './components/Button';
+import Drawer from './components/Drawer';
+import Icon from './components/Icon';
+import Accordion from './components/Accordion';
+import MultiSelect from './components/MultiSelect';
+import Toaster from './components/Toast/Toast';
+import { Container, Row, Col } from './components/GridLayout/GridLayout';
+import Toggle from './components/Toggle';
+import Chip from './components/Chip';
+import Tooltip from './components/Tooltip';
+import Input from './components/Input';
+import RadialChart from './components/Charts/RadialChart';
+import ExpandableMenu from './components/ExpandableMenu';
+import Select from './components/Select/Select';
+import TextArea from './components/TextArea';
+import StatusButton from './components/StatusButton';
+import MenuOption from './components/MenuOption';
+import Table from './components/Table/Table';
+import AddResourceButton from './components/AddResourceButton';
+import DonutChart from './components/Charts/DonutChart';
+import FileDropzone from './components/FileDropzone';
+import Dropzone from './components/FileDropzone/Dropzone';
+import FilePreview from './components/FileDropzone/FilePreview';
+import LazyLoad from './components/LazyLoad/LazyLoad';
+import ThemeProvider from './components/ThemeProvider';
+import Typography from './components/Typography';
+import useTheme from './hooks/useTheme';
+import Form from './components/Form/Forms';
+import InputWithDropdown from './components/InputWithDropdown';
+import RadioButton from './components/RadioButton';
+import RadioGroup from './components/RadioGroup';
+import MiniModal from './components/MiniModal';
+import TableTree from './components/TableTree';
+import Tabs from './components/Tabs';
+import HighlightText from './components/HighlightText';
+import Checkbox from './components/Checkbox';
+import Search from './components/Search/Search';
+import DatePicker from './components/DatePicker';
+import StateDropdown from './components/StateDropdown';
+import IconButton from './components/IconButton';
+import Modal from './components/Modal';
+import DragAndDrop from './components/DragAndDrop/DragAndDrop';
+import VariableInput from './components/VariableInput';
+import AllProjectsDropdown from './components/AllProjectsDropdown';
+import PieChart from './components/Charts/PieChart';
+import AppHeader from './components/AppHeader';
+import Paper from './components/Paper';
+import DashboardDonutChart from './components/Charts/DashboardDonutChart';
+import Recaptcha from './components/FF_Captcha/Recaptcha';
+import NLPInput from './components/NLPInput';
+import IconRadioGroup from './components/IconRadioGroup';
+import MachineInputField from './components/MachineInputField';
+import SequentialConnectingBranch from './components/SequentialConnectingBranch';
+import AttachmentButton from './components/AttachmentButton';
+import { Toastify, toast } from './components/Toastify/Toastify';
+import ToggleSwitch from './components/ToggleSwitch/ToggleSwitch';
+import Avatar from './components/Avatar';
+
+import LabelEditTextField from './components/LabelEditTextField';
+import EditTextField from './components/EditTextField';
+import Excel from './components/Excel';
+import ModuleChip from './components/ModulesChip/ModuleChip';
+import IconRadialChart from './components/Charts/IconRadialChart';
+import AttachImage from './components/AttachImage';
+import StatusCard from './components/StatusCard';
+import VariableDropdown from './components/Editor/VariableDropdown';
+
+import LineChart from './components/Charts/LineChart';
+import DownloadClient from './components/DownloadClient/DownloadClient';
+import FieldSet from './components/FieldSet';
+import CreateVariableSlider from './components/CreateVariable/CreateVariableSlider';
+// Utils imports
+import { checkEmpty } from './utils/checkEmpty/checkEmpty';
+import {
+  getExtension,
+  getExtensionWithPeriod,
+} from './utils/getExtension/getExtension';
+import { findAndInsert } from './utils/findAndInsert/findAndInsert';
+import { ffid } from './utils/ffID/ffid';
+import { debounce } from './utils/debounce/debounce';
+import { compareArrays } from './utils/compareArrays/compareArrays';
+import { compareObjects } from './utils/compareObjects/compareObjects';
+import { getEncryptedData } from './utils/getEncryptedData/getEncryptedData';
+import { throttle } from './utils/throttle/throttle';
+import { truncateText } from './utils/truncateText/truncateText';
+import BarChart from './components/Charts/BarChart';
+import MultiRadialChart from './components/Charts/MultiRadialChart';
+import Editor from './components/Editor/Editor';
+import { getSequentialPayload } from './utils/getSequentialPayload/getSequentialPayload';
+import ConnectingBranch from './components/ConnectingBranch/ConnectingBranch';
+import { saveFileFromBlob } from './utils/downloadFile/saveFileFromBlob';
+import useFileDropzone from './hooks/useFileDropzone';
+import PopUpModal from './components/PopUpModal/PopUpModal';
+import AddVariables from './components/AddVariables/AddVariables';
+import { hasDuplicateFile } from './utils/checkDuplicates/checkDuplicates';
+
+export {
+  Button,
+  Tooltip,
+  Icon,
+  Accordion,
+  MultiSelect,
+  Toaster,
+  Toggle,
+  Chip,
+  Drawer,
+  Input,
+  RadialChart,
+  ExpandableMenu,
+  Select,
+  TextArea,
+  MenuOption,
+  AddResourceButton,
+  DonutChart,
+  FileDropzone,
+  Dropzone,
+  FilePreview,
+  LazyLoad,
+  ThemeProvider,
+  Typography,
+  useTheme,
+  InputWithDropdown,
+  Table,
+  RadioButton,
+  RadioGroup,
+  Form,
+  MiniModal,
+  Container,
+  Row,
+  Col,
+  HighlightText,
+  TableTree,
+  Tabs,
+  Checkbox,
+  Search,
+  DatePicker,
+  StateDropdown,
+  StatusButton,
+  IconButton,
+  Modal,
+  PieChart,
+  DashboardDonutChart,
+  DragAndDrop,
+  AllProjectsDropdown,
+  AppHeader,
+  VariableInput,
+  Paper,
+  Recaptcha,
+  NLPInput,
+  MachineInputField,
+  SequentialConnectingBranch,
+  Editor,
+  AttachmentButton,
+  LabelEditTextField,
+  Excel,
+  IconRadioGroup,
+  Toastify,
+  toast,
+  ModuleChip,
+  IconRadialChart,
+  LineChart,
+  BarChart,
+  MultiRadialChart,
+  ConnectingBranch,
+  StatusCard,
+  EditTextField,
+  AttachImage,
+  ToggleSwitch,
+  Avatar,
+  VariableDropdown,
+  DownloadClient,
+  FieldSet,
+  PopUpModal,
+  CreateVariableSlider,
+  AddVariables,
+
+  // utils exports
+  checkEmpty,
+  getExtension,
+  getExtensionWithPeriod,
+  findAndInsert,
+  ffid,
+  compareArrays,
+  compareObjects,
+  debounce,
+  throttle,
+  getEncryptedData,
+  truncateText,
+  getSequentialPayload,
+  saveFileFromBlob,
+  useFileDropzone,
+  hasDuplicateFile,
+};

package/src/utils/TableCell/TableCell.ts

@@ -1,16 +1,16 @@
-export const prepareData = (dataObj: any, columnObj: any) => {
-  let cellData = dataObj[columnObj.accessor];
-  if (columnObj.cell) {
-    return columnObj.cell({
-      value: cellData,
-      row: dataObj,
-      column: columnObj.accessor,
-    });
-  } else if (columnObj.accessor) {
-    return cellData;
-  } else if (cellData && typeof cellData !== 'object') {
-    return cellData;
-  } else {
-    return '--';
-  }
-};
+export const prepareData = (dataObj: any, columnObj: any) => {
+  let cellData = dataObj[columnObj.accessor];
+  if (columnObj.cell) {
+    return columnObj.cell({
+      value: cellData,
+      row: dataObj,
+      column: columnObj.accessor,
+    });
+  } else if (columnObj.accessor) {
+    return cellData;
+  } else if (cellData && typeof cellData !== 'object') {
+    return cellData;
+  } else {
+    return '--';
+  }
+};

package/src/utils/capitalize/capitalize.stories.tsx

@@ -1,44 +1,44 @@
-import React from 'react';
-import { capitalize } from './capitalize';
-
-export default {
-  title: 'Utils/Capitalize', // Organize under the "Utils" category
-  component: capitalize,
-};
-
-export const Default = () => {
-  const examples = [
-    { input: 'hello', output: capitalize('hello') },
-    { input: 'world', output: capitalize('world') },
-    { input: '', output: capitalize('') },
-    { input: 'capitalize', output: capitalize('capitalize') },
-  ];
-
-  return (
-    <div>
-      <h3>Capitalize Function Examples</h3>
-      <table style={{ borderCollapse: 'collapse', width: '100%' }}>
-        <thead>
-          <tr>
-            <th style={{ border: '1px solid black', padding: '8px' }}>Input</th>
-            <th style={{ border: '1px solid black', padding: '8px' }}>
-              Output
-            </th>
-          </tr>
-        </thead>
-        <tbody>
-          {examples.map((example, index) => (
-            <tr key={index}>
-              <td style={{ border: '1px solid black', padding: '8px' }}>
-                {example.input}
-              </td>
-              <td style={{ border: '1px solid black', padding: '8px' }}>
-                {example.output}
-              </td>
-            </tr>
-          ))}
-        </tbody>
-      </table>
-    </div>
-  );
-};
+import React from 'react';
+import { capitalize } from './capitalize';
+
+export default {
+  title: 'Utils/Capitalize', // Organize under the "Utils" category
+  component: capitalize,
+};
+
+export const Default = () => {
+  const examples = [
+    { input: 'hello', output: capitalize('hello') },
+    { input: 'world', output: capitalize('world') },
+    { input: '', output: capitalize('') },
+    { input: 'capitalize', output: capitalize('capitalize') },
+  ];
+
+  return (
+    <div>
+      <h3>Capitalize Function Examples</h3>
+      <table style={{ borderCollapse: 'collapse', width: '100%' }}>
+        <thead>
+          <tr>
+            <th style={{ border: '1px solid black', padding: '8px' }}>Input</th>
+            <th style={{ border: '1px solid black', padding: '8px' }}>
+              Output
+            </th>
+          </tr>
+        </thead>
+        <tbody>
+          {examples.map((example, index) => (
+            <tr key={index}>
+              <td style={{ border: '1px solid black', padding: '8px' }}>
+                {example.input}
+              </td>
+              <td style={{ border: '1px solid black', padding: '8px' }}>
+                {example.output}
+              </td>
+            </tr>
+          ))}
+        </tbody>
+      </table>
+    </div>
+  );
+};

package/src/utils/capitalize/capitalize.tsx

@@ -1,4 +1,4 @@
-export const capitalize = (text: string): string => {
-  if (!text) return '';
-  return text.charAt(0).toUpperCase() + text.slice(1);
-};
+export const capitalize = (text: string): string => {
+  if (!text) return '';
+  return text.charAt(0).toUpperCase() + text.slice(1);
+};

package/src/utils/checkDuplicates/CheckDuplicates.stories.tsx

@@ -0,0 +1,40 @@
+import React from 'react';
+import { Meta, StoryObj } from '@storybook/react';
+import { hasDuplicateFile } from './checkDuplicates';
+
+export default {
+  title: 'Utils/HasDuplicateFile',
+  argTypes: {
+    array: {
+      control: 'object',
+      description: 'Array of objects to check for duplicates.',
+    },
+    property: {
+      control: 'text',
+      description: 'Optional property to check for duplicates.',
+    },
+  },
+} satisfies Meta;
+
+export const Default: StoryObj = {
+  args: {
+    array: [
+      { id: 1, name: 'file1' },
+      { id: 2, name: 'file2' },
+      { id: 1, name: 'file1' },
+    ],
+    property: 'id',
+  },
+  render: (args) => {
+    const result = hasDuplicateFile(args.array, args.property);
+    return (
+      <div>
+        <h3>
+          Duplicate Check Result:{' '}
+          {result ? 'Duplicates Found' : 'No Duplicates'}
+        </h3>
+        <pre>{JSON.stringify(args.array, null, 2)}</pre>
+      </div>
+    );
+  },
+};

package/src/utils/checkDuplicates/checkDuplicates.ts

@@ -0,0 +1,13 @@
+// Will be used to find duplicate key-value pair in an array of objects.
+
+export const hasDuplicateFile = (array: any[], property: string): boolean => {
+  const seen = new Set();
+  for (const obj of array) {
+    const key = property ? obj[property] : JSON.stringify(obj);
+    if (seen.has(key)) {
+      return true;
+    }
+    seen.add(key);
+  }
+  return false;
+};

package/src/utils/checkEmpty/checkEmpty.stories.tsx

@@ -1,34 +1,34 @@
-import { checkEmpty } from './checkEmpty';
-
-export default {
-  title: 'Utils/checkEmpty',
-  component: checkEmpty,
-};
-
-export const Default = () => {
-  const testCases = [
-    { value: null, expected: true },
-    { value: undefined, expected: true },
-    { value: '', expected: true },
-    { value: [], expected: true },
-    { value: {}, expected: true },
-    { value: 0, expected: true },
-    { value: 'Hello', expected: false },
-    { value: [1, 2, 3], expected: false },
-    { value: { key: 'value' }, expected: false },
-  ];
-
-  return (
-    <div>
-      <h1>
-        <u>checkEmpty(value)</u> - true / false
-      </h1>
-      {testCases.map((test, index) => (
-        <div key={index}>
-          checkEmpty( {JSON.stringify(test.value)} ) -
-          {checkEmpty(test.value) ? 'True' : 'False'}
-        </div>
-      ))}
-    </div>
-  );
-};
+import { checkEmpty } from './checkEmpty';
+
+export default {
+  title: 'Utils/checkEmpty',
+  component: checkEmpty,
+};
+
+export const Default = () => {
+  const testCases = [
+    { value: null, expected: true },
+    { value: undefined, expected: true },
+    { value: '', expected: true },
+    { value: [], expected: true },
+    { value: {}, expected: true },
+    { value: 0, expected: true },
+    { value: 'Hello', expected: false },
+    { value: [1, 2, 3], expected: false },
+    { value: { key: 'value' }, expected: false },
+  ];
+
+  return (
+    <div>
+      <h1>
+        <u>checkEmpty(value)</u> - true / false
+      </h1>
+      {testCases.map((test, index) => (
+        <div key={index}>
+          checkEmpty( {JSON.stringify(test.value)} ) -
+          {checkEmpty(test.value) ? 'True' : 'False'}
+        </div>
+      ))}
+    </div>
+  );
+};