pixel-react 1.5.2 → 1.5.4

package/.prettierrc.js

@@ -1,13 +1,13 @@
-module.exports = {
-  printWidth: 80, // max 080 chars in line, code is easy to read
-  useTabs: false, // use spaces instead of tabs
-  tabWidth: 2, // "visual width" of of the "tab"
-  trailingComma: 'es5', // add trailing commas in objects, arrays, etc.
-  semi: true, // add ; when needed
-  singleQuote: true, // '' for stings instead of ""
-  bracketSpacing: true, // import { some } ... instead of import {some} ...
-  arrowParens: 'always', // braces even for single param in arrow functions (a) => { }
-  jsxSingleQuote: false, // "" for react props, like in html
-  bracketSameLine: false, // pretty JSX
-  endOfLine: 'lf', // 'lf' for linux, 'crlf' for windows, we need to use 'lf' for git
-};
+module.exports = {
+  printWidth: 80, // max 080 chars in line, code is easy to read
+  useTabs: false, // use spaces instead of tabs
+  tabWidth: 2, // "visual width" of of the "tab"
+  trailingComma: 'es5', // add trailing commas in objects, arrays, etc.
+  semi: true, // add ; when needed
+  singleQuote: true, // '' for stings instead of ""
+  bracketSpacing: true, // import { some } ... instead of import {some} ...
+  arrowParens: 'always', // braces even for single param in arrow functions (a) => { }
+  jsxSingleQuote: false, // "" for react props, like in html
+  bracketSameLine: false, // pretty JSX
+  endOfLine: 'lf', // 'lf' for linux, 'crlf' for windows, we need to use 'lf' for git
+};

package/.storybook/main.ts

@@ -1,26 +1,26 @@
-import type { StorybookConfig } from '@storybook/react-vite';
-
-const config: StorybookConfig = {
-  stories: ['../src/**/*.stories.tsx'],
-
-  addons: [
-    '@storybook/addon-links',
-    '@storybook/addon-essentials',
-    '@storybook/addon-onboarding',
-    '@storybook/addon-interactions',
-    '@chromatic-com/storybook',
-    "storybook-addon-theme-provider",
-  ],
-
-  framework: {
-    name: '@storybook/react-vite',
-    options: {},
-  },
-
-  docs: {},
-
-  typescript: {
-    reactDocgen: 'react-docgen-typescript'
-  }
-};
-export default config;
+import type { StorybookConfig } from '@storybook/react-vite';
+
+const config: StorybookConfig = {
+  stories: ['../src/**/*.stories.tsx'],
+
+  addons: [
+    '@storybook/addon-links',
+    '@storybook/addon-essentials',
+    '@storybook/addon-onboarding',
+    '@storybook/addon-interactions',
+    '@chromatic-com/storybook',
+    "storybook-addon-theme-provider",
+  ],
+
+  framework: {
+    name: '@storybook/react-vite',
+    options: {},
+  },
+
+  docs: {},
+
+  typescript: {
+    reactDocgen: 'react-docgen-typescript'
+  }
+};
+export default config;

package/.storybook/preview.ts

@@ -1,26 +1,26 @@
-import type { Preview } from '@storybook/react';
-import { withThemeProvider } from 'storybook-addon-theme-provider';
-import ThemeProvider from '../src/components/ThemeProvider/ThemeProvider';
-import '../index.scss';
-import '../src/assets/Themes/Theme.scss';
-
-const preview: Preview = {
-  parameters: {
-    actions: {},
-    controls: {
-      matchers: {
-        color: /(background|color)$/i,
-        date: /Date$/i,
-      },
-    },
-    docs: {
-      source: {
-        language: 'tsx',
-      },
-    },
-  },
-  tags: ['autodocs'],
-  decorators: [withThemeProvider(ThemeProvider)],
-};
-
-export default preview;
+import type { Preview } from '@storybook/react';
+import { withThemeProvider } from 'storybook-addon-theme-provider';
+import ThemeProvider from '../src/components/ThemeProvider/ThemeProvider';
+import '../index.scss';
+import '../src/assets/Themes/Theme.scss';
+
+const preview: Preview = {
+  parameters: {
+    actions: {},
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/i,
+      },
+    },
+    docs: {
+      source: {
+        language: 'tsx',
+      },
+    },
+  },
+  tags: ['autodocs'],
+  decorators: [withThemeProvider(ThemeProvider)],
+};
+
+export default preview;

package/.yarnrc.yml

@@ -1 +1 @@
-nodeLinker: node-modules
+nodeLinker: node-modules

package/README.md

@@ -1,75 +1,75 @@
----
-title: PixelReact UI
----
-
-import { Button, Input } from 'pixel-react';
-
-<h1 align="center">PixelReact UI</h1>
-
-<p align="center">
-  <strong>PixelReact UI</strong> is an open-source React component library, designed to offer a sleek, customizable, and easy-to-use collection of components for building modern user interfaces.
-</p>
-
----
-
-## Table of Contents
-
-- [Installation](#installation)
-- [Usage](#usage)
-- [Documentation](#documentation)
-- [Contributing](#contributing)
-- [License](#license)
-
----
-
-## Installation
-
-Install PixelReact UI in your project directory with:
-
-```bash
-npm install pixel-react
-```
-
-or with Yarn:
-
-```bash
-yarn add pixel-react
-```
-
-## Usage
-
-Once installed, you can start importing and using PixelReact components in your React application. Here's a quick example:
-
-```jsx
-import { Button } from 'pixel-react';
-
-function App() {
-  return (
-    <div>
-      <Button label="Button Label" variant="primary" />
-    </div>
-  );
-}
-
-export default App;
-```
-
-## Documentation
-
-For detailed documentation and live examples, [click here](https://main--65d5ca6d09c1eaf0731601fc.chromatic.com/).
-
-## Example
-
-```jsx
-import { Button } from 'pixel-react';
-
-function ExampleComponent() {
-  return <Button label="Click Me!" variant="primary" />;
-}
-```
-
-## License
-
-PixelReact UI is licensed under the [MIT License](LICENSE). Feel free to use it in your projects, both personal and commercial.
-
----
+---
+title: PixelReact UI
+---
+
+import { Button, Input } from 'pixel-react';
+
+<h1 align="center">PixelReact UI</h1>
+
+<p align="center">
+  <strong>PixelReact UI</strong> is an open-source React component library, designed to offer a sleek, customizable, and easy-to-use collection of components for building modern user interfaces.
+</p>
+
+---
+
+## Table of Contents
+
+- [Installation](#installation)
+- [Usage](#usage)
+- [Documentation](#documentation)
+- [Contributing](#contributing)
+- [License](#license)
+
+---
+
+## Installation
+
+Install PixelReact UI in your project directory with:
+
+```bash
+npm install pixel-react
+```
+
+or with Yarn:
+
+```bash
+yarn add pixel-react
+```
+
+## Usage
+
+Once installed, you can start importing and using PixelReact components in your React application. Here's a quick example:
+
+```jsx
+import { Button } from 'pixel-react';
+
+function App() {
+  return (
+    <div>
+      <Button label="Button Label" variant="primary" />
+    </div>
+  );
+}
+
+export default App;
+```
+
+## Documentation
+
+For detailed documentation and live examples, [click here](https://main--65d5ca6d09c1eaf0731601fc.chromatic.com/).
+
+## Example
+
+```jsx
+import { Button } from 'pixel-react';
+
+function ExampleComponent() {
+  return <Button label="Click Me!" variant="primary" />;
+}
+```
+
+## License
+
+PixelReact UI is licensed under the [MIT License](LICENSE). Feel free to use it in your projects, both personal and commercial.
+
+---

package/lib/components/Chip/types.d.ts

@@ -10,7 +10,7 @@ export interface ChipsProps {
     /**
      * The variant of the Chip.
      */
-    variant?: 'primary' | 'success' | 'error' | 'warning' | 'custom';
+    variant?: 'primary' | 'success' | 'error' | 'warning' | 'custom' | 'public' | 'partial-public' | 'private' | 'disabled';
     /**
      * The callback function to be executed when the Chip is clicked.
      */

package/lib/components/DownloadClient/DownloadClient.d.ts

@@ -0,0 +1,4 @@
+import './DownloadClient.scss';
+import { DownloadClientProps } from './type';
+declare const DownloadClient: React.FC<DownloadClientProps>;
+export default DownloadClient;

package/lib/components/DownloadClient/index.d.ts

@@ -0,0 +1 @@
+export * from './DownloadClient';

package/lib/components/DownloadClient/type.d.ts

@@ -0,0 +1,35 @@
+export interface DownloadClientProps {
+    /**
+     * Title of the popup.
+     */
+    title: string;
+    /**
+     * Description or body text of the popup.
+     */
+    description: string;
+    /**
+     * Callback for when the "Cancel" icon is clicked.
+     */
+    onCancel: () => void;
+    /**
+     * Callback for when the "Download for Windows" icon is clicked.
+     */
+    onDownloadWindows: () => void;
+    /**
+     * Callback for when the "Download for macOS" icon is clicked.
+     */
+    onDownloadMac: () => void;
+    /**
+     * Optional flag to control whether to display icons for download actions instead of buttons.
+     * Defaults to `false` for buttons.
+     */
+    showIcons?: boolean;
+}
+export interface DownloadClientProps {
+    onClose?: () => void;
+    onClickWindows: () => void;
+    onClickLinux: () => void;
+    onClickMac: () => void;
+    top?: string;
+    left?: string;
+}

package/lib/components/Editor/types.d.ts

@@ -35,7 +35,7 @@ export interface EditorProps {
     /**
      * onChange function to handle the input changes
      */
-    handleChange: (value: string | undefined, _event: any) => {};
+    handleChange: (value: string | undefined, _event: any) => void;
     /**
      * Theme
      */

package/lib/components/Toast/types.d.ts

@@ -2,7 +2,7 @@ export interface ToasterProps {
     /**Boolean value to handle state of toaster. */
     isOpen: boolean;
     /**Variant for different type of toast message. */
-    variant: 'success' | 'warning' | 'danger' | 'info' | 'confirm';
+    variant: 'success' | 'warning' | 'danger' | 'info' | 'confirm' | 'alert';
     /**Title of the toaster  */
     toastTitle: string;
     /**Message for the toaster. */

package/lib/components/Toastify/Toastify.d.ts

@@ -6,4 +6,5 @@ export declare const toast: {
     error: (arg1: AcceptedType, arg2?: AcceptedType) => void;
     warning: (arg1: AcceptedType, arg2?: AcceptedType) => void;
     info: (arg1: AcceptedType, arg2?: AcceptedType) => void;
+    alert: (arg1: AcceptedType, arg2?: AcceptedType) => void;
 };

package/lib/components/Toastify/types.d.ts

@@ -1,4 +1,4 @@
-export type Variant = 'success' | 'warning' | 'danger' | 'info' | 'confirm';
+export type Variant = 'success' | 'warning' | 'danger' | 'info' | 'alert';
 export interface ToastProps {
     isOpen: boolean;
     variant: Variant;

package/lib/index.d.ts

@@ -307,7 +307,7 @@ interface ToasterProps {
     /**Boolean value to handle state of toaster. */
     isOpen: boolean;
     /**Variant for different type of toast message. */
-    variant: 'success' | 'warning' | 'danger' | 'info' | 'confirm';
+    variant: 'success' | 'warning' | 'danger' | 'info' | 'confirm' | 'alert';
     /**Title of the toaster  */
     toastTitle: string;
     /**Message for the toaster. */
@@ -469,7 +469,7 @@ interface ChipsProps {
     /**
      * The variant of the Chip.
      */
-    variant?: 'primary' | 'success' | 'error' | 'warning' | 'custom';
+    variant?: 'primary' | 'success' | 'error' | 'warning' | 'custom' | 'public' | 'partial-public' | 'private' | 'disabled';
     /**
      * The callback function to be executed when the Chip is clicked.
      */
@@ -1997,6 +1997,7 @@ declare const toast: {
     error: (arg1: AcceptedType, arg2?: AcceptedType) => void;
     warning: (arg1: AcceptedType, arg2?: AcceptedType) => void;
     info: (arg1: AcceptedType, arg2?: AcceptedType) => void;
+    alert: (arg1: AcceptedType, arg2?: AcceptedType) => void;
 };
 
 interface ToggleSwitchProps {
@@ -2204,6 +2205,70 @@ interface CardProps {
 
 declare const StatusCard: React__default.FC<CardProps>;
 
+interface DyanamicObj {
+    [key: string]: any;
+}
+interface EditorProps {
+    /**
+     * Editor Content Type
+     */
+    language: 'javascript' | 'html' | 'json' | 'plain text' | 'xml';
+    /**
+     *
+     *Width of the editor
+     */
+    width: string;
+    /**
+     * Height of the editor
+     */
+    height: string;
+    /**
+     * read only
+     */
+    readOnly?: boolean;
+    /**
+     * Variable options list
+     */
+    variableOptionsList?: [] | DyanamicObj[];
+    /**
+     *Value to set in the editor
+     */
+    value: string;
+    /**
+     *
+     * setter function to set the value for the editor
+     */
+    setValue: (value: string) => void;
+    /**
+     * onChange function to handle the input changes
+     */
+    handleChange: (value: string | undefined, _event: any) => void;
+    /**
+     * Theme
+     */
+    theme?: 'light' | 'vs-dark';
+}
+interface dropdownPositionType {
+    top: number;
+    left: number;
+}
+interface VariableDropdownProps {
+    /**
+     * List of variables
+     */
+    optionsList: {}[];
+    /**
+     * Function to handle click on variable
+     */
+    onSelectVariable: (variable: object) => void;
+    /**
+     * Dropdown postion used for dropdown placement
+     */
+    dropdownPosition: dropdownPositionType;
+}
+
+declare const VariableDropdown: FC<VariableDropdownProps>;
+
 interface LineChartProps {
     data: any[];
     width: number;
@@ -2310,50 +2375,6 @@ interface MultiRadialChartProps {
 
 declare const MultiRadialChart: React__default.FC<MultiRadialChartProps>;
 
-interface DyanamicObj {
-    [key: string]: any;
-}
-interface EditorProps {
-    /**
-     * Editor Content Type
-     */
-    language: 'javascript' | 'html' | 'json' | 'plain text' | 'xml';
-    /**
-     *
-     *Width of the editor
-     */
-    width: string;
-    /**
-     * Height of the editor
-     */
-    height: string;
-    /**
-     * read only
-     */
-    readOnly?: boolean;
-    /**
-     * Variable options list
-     */
-    variableOptionsList?: [] | DyanamicObj[];
-    /**
-     *Value to set in the editor
-     */
-    value: string;
-    /**
-     *
-     * setter function to set the value for the editor
-     */
-    setValue: (value: string) => void;
-    /**
-     * onChange function to handle the input changes
-     */
-    handleChange: (value: string | undefined, _event: any) => {};
-    /**
-     * Theme
-     */
-    theme?: 'light' | 'vs-dark';
-}
-
 declare const Editor: React$1.ForwardRefExoticComponent<EditorProps & React$1.RefAttributes<any>>;
 
 interface OperatingSystemInfo {
@@ -2391,4 +2412,4 @@ declare const ConnectingBranch: React__default.FC;
 
 declare const saveFileFromBlob: (blob: Blob, filename: string) => void;
 
-export { Accordion, AddButton as AddResourceButton, AllProjectsDropdown, AppHeader, AttachImage, AttachmentButton, Avatar, BarChart, Button, Checkbox, Chip, Col, ConnectingBranch, Container, DashboardDonutChart, CustomDatePicker as DatePicker, DonutChart, DragAndDrop, Drawer, EditTextField, Editor, ExcelFile as Excel, ExpandableMenu, FileDropzone, ForwardedForms as Form, HighlightText, Icon, IconButton, IconRadialChart, IconRadioGroup, Input, InputWithDropdown, LabelEditTextField, LineChart, MachineInputField, MenuOption, MiniModal, Modal, ModuleChip, MultiRadialChart, MultiSelect, NlpInput as NLPInput, Paper, PieChart, RadialChart, RadioButton, RadioGroup, Recaptcha, Row, Search, Select, SequentialConnectingBranch, StateDropdown, StatusButton, StatusCard, Table, TableTree, Tabs, Textarea as TextArea, ThemeProvider, Toaster, Toastify, Toggle, ToggleSwitch, Tooltip, Typography, VariableInput, checkEmpty, compareArrays, compareObjects, debounce, ffid, findAndInsert, getEncryptedData, getExtension, getExtensionWithPeriod, getSequentialPayload, saveFileFromBlob, throttle, toast, truncateText, useTheme };
+export { Accordion, AddButton as AddResourceButton, AllProjectsDropdown, AppHeader, AttachImage, AttachmentButton, Avatar, BarChart, Button, Checkbox, Chip, Col, ConnectingBranch, Container, DashboardDonutChart, CustomDatePicker as DatePicker, DonutChart, DragAndDrop, Drawer, EditTextField, Editor, ExcelFile as Excel, ExpandableMenu, FileDropzone, ForwardedForms as Form, HighlightText, Icon, IconButton, IconRadialChart, IconRadioGroup, Input, InputWithDropdown, LabelEditTextField, LineChart, MachineInputField, MenuOption, MiniModal, Modal, ModuleChip, MultiRadialChart, MultiSelect, NlpInput as NLPInput, Paper, PieChart, RadialChart, RadioButton, RadioGroup, Recaptcha, Row, Search, Select, SequentialConnectingBranch, StateDropdown, StatusButton, StatusCard, Table, TableTree, Tabs, Textarea as TextArea, ThemeProvider, Toaster, Toastify, Toggle, ToggleSwitch, Tooltip, Typography, VariableDropdown, VariableInput, checkEmpty, compareArrays, compareObjects, debounce, ffid, findAndInsert, getEncryptedData, getExtension, getExtensionWithPeriod, getSequentialPayload, saveFileFromBlob, throttle, toast, truncateText, useTheme };