pixel-react 1.5.4 → 1.5.5

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/StyleGuide/ColorPalette/ColorPalette.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import StyleGuide from './ColorPalette';
+declare const meta: Meta<typeof StyleGuide>;
+type Story = StoryObj<typeof StyleGuide>;
+export declare const ColorList: Story;
+export default meta;

package/lib/StyleGuide/Typography/Typography.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import Typography from './Typography';
+declare const meta: Meta<typeof Typography>;
+type Story = StoryObj<typeof Typography>;
+export declare const AllFonts: Story;
+export default meta;

package/lib/assets/utils/functionUtils.d.ts

@@ -2,3 +2,10 @@ export declare const isFunction: (functionToCheck: any) => any;
 export declare const convertTo24Hour: (time12h: string) => string;
 export declare const convertTo12Hour: (time24: string) => string;
 export declare const isValid12HourTime: (timeString: string) => boolean;
+export declare const UNIT_MULTIPLIERS: Record<string, number>;
+export declare function normalizeStorageValue(value: string): {
+    normalizedValue: number;
+    unit: string;
+    value: number;
+};
+export declare function formatMemoryValue(valueInBytes: number): string;

package/lib/components/Accordion/Accordion.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import Accordion from './Accordion';
+declare const meta: Meta<typeof Accordion>;
+type Story = StoryObj<typeof Accordion>;
+export declare const SampleAccordion: Story;
+export default meta;

package/lib/components/AddButton/AddButton.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import './AddButton.scss';
+import { AddButtonProps } from './types';
+declare const AddButton: React.FC<AddButtonProps>;
+export default AddButton;

package/lib/components/AddButton/AddButton.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import AddButton from './AddButton';
+declare const meta: Meta<typeof AddButton>;
+type Story = StoryObj<typeof AddButton>;
+export declare const PrimaryAddButton: Story;
+export default meta;

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

@@ -0,0 +1 @@
+export { default } from './AddButton';

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

@@ -0,0 +1,4 @@
+export interface AddButtonProps {
+    name: string;
+    onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+}

package/lib/components/AddResourceButton/AddButton.stories.d.ts

@@ -0,0 +1,8 @@
+import { Meta, StoryObj } from '@storybook/react';
+import AddButton from './AddButton';
+declare const meta: Meta<typeof AddButton>;
+type Story = StoryObj<typeof AddButton>;
+export declare const Default: Story;
+export declare const TwoArrowsButtons: Story;
+export declare const ThreeArrowsButton: Story;
+export default meta;

package/lib/components/AllProjectsDropdown/AllProjectsDropdown.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import AllProjectsDropdown from './AllProjectsDropdown';
+declare const meta: Meta<typeof AllProjectsDropdown>;
+type Story = StoryObj<typeof AllProjectsDropdown>;
+export declare const Default: Story;
+export declare const PrimaryIconButton: Story;
+export default meta;

package/lib/components/AppHeader/AppHeader.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import AppHeader from './AppHeader';
+declare const meta: Meta<typeof AppHeader>;
+type Story = StoryObj<typeof AppHeader>;
+export declare const SampleAppHeader: Story;
+export declare const Controlled: Story;
+export default meta;

package/lib/components/AttachImage/AttachImage.stories.d.ts

@@ -0,0 +1,7 @@
+import { Meta, StoryObj } from '@storybook/react';
+import AttachImage from './AttachImage';
+import { AttachImageProps } from './types';
+declare const meta: Meta<typeof AttachImage>;
+export default meta;
+type Story = StoryObj<AttachImageProps>;
+export declare const Default: Story;

package/lib/components/AttachmentButton/AttachmentButton.stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import AttachmentButton from './AttachmentButton';
+declare const meta: Meta<typeof AttachmentButton>;
+type Story = StoryObj<typeof AttachmentButton>;
+export declare const Default: Story;
+export declare const SmallFileLimit: Story;
+export declare const LargeFileLimit: Story;
+export declare const DisabledUploader: Story;
+export default meta;

package/lib/components/Avatar/Avatar.stories.d.ts

@@ -0,0 +1,10 @@
+import { Meta, StoryObj } from '@storybook/react';
+import Avatar from './Avatar';
+declare const meta: Meta<typeof Avatar>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Small: Story;
+export declare const Medium: Story;
+export declare const Large: Story;
+export declare const CustomAvatarSize: Story;
+export declare const CustomIconSize: Story;

package/lib/components/Button/Button.stories.d.ts

@@ -0,0 +1,13 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import Button from './Button';
+declare const meta: Meta<typeof Button>;
+type Story = StoryObj<typeof Button>;
+export declare const Primary: Story;
+export declare const Secondary: Story;
+export declare const Tertiary: Story;
+export declare const Delete: Story;
+export declare const Warning: Story;
+export declare const PrimaryWithIcon: Story;
+export declare const SecondaryWithIcon: Story;
+export declare const TertiaryWithIcon: Story;
+export default meta;

package/lib/components/Charts/BarChart/BarChart.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, StoryObj } from '@storybook/react';
+import BarChart from './BarChart';
+declare const meta: Meta<typeof BarChart>;
+export default meta;
+type Story = StoryObj<typeof BarChart>;
+export declare const BarChartDashboard: Story;

package/lib/components/Charts/DashboardDonutChart/DashboardDonutChart.stories.d.ts

@@ -0,0 +1,7 @@
+import { Meta, StoryObj } from '@storybook/react/*';
+import DashboardDonutChart from './DashboardDonutChart';
+declare const meta: Meta<typeof DashboardDonutChart>;
+export default meta;
+type Story = StoryObj<typeof DashboardDonutChart>;
+export declare const Default: Story;
+export declare const MemoryLegend: Story;

package/lib/components/Charts/DashboardDonutChart/types.d.ts

@@ -5,9 +5,17 @@ export type StatusValue = {
 };
 export type ChartItem = {
     key: string;
-    value: number;
+    value: string | number;
     color?: string;
 };
+export type NormalizedChartItem = {
+    key: string;
+    value: number | string;
+    color?: string;
+    normalizedValue?: number;
+    unit?: string;
+    labelValue?: number;
+};
 export type LegendType = 'numberLegend' | 'pillLegend' | 'memoryLegend' | 'tableLegend';
 export type DashboardDonutChartProps = {
     radius: number;
@@ -17,7 +25,9 @@ export type DashboardDonutChartProps = {
     isLegendDetails: boolean;
     gapAngle?: number;
     legendType: LegendType;
-    showOnlyLabel: boolean;
+    showOnlyLabel?: boolean;
     unit?: string;
-    showUnit: boolean;
+    showUnit?: boolean;
+    labelFontSize?: number;
+    subLabelFontSize?: number;
 };

package/lib/components/Charts/DonutChart/DonutChart.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, StoryObj } from '@storybook/react/*';
+import DonutChart from './DonutChart';
+declare const meta: Meta<typeof DonutChart>;
+export default meta;
+type Story = StoryObj<typeof DonutChart>;
+export declare const Default: Story;

package/lib/components/Charts/IconRadialChart/IconRadialChart.stories.d.ts

@@ -0,0 +1,8 @@
+import { Meta, StoryObj } from '@storybook/react';
+import IconRadialChart from './IconRadialChart';
+declare const meta: Meta<typeof IconRadialChart>;
+export default meta;
+type Story = StoryObj<typeof IconRadialChart>;
+export declare const Default: Story;
+export declare const Mobile: Story;
+export declare const WithoutIcon: Story;

package/lib/components/Charts/LineChart/LineChart.stories.d.ts

@@ -0,0 +1,7 @@
+import { Meta, StoryObj } from '@storybook/react';
+import LineChart from './LineChart';
+import { LineChartProps } from './types';
+declare const meta: Meta<typeof LineChart>;
+export default meta;
+export declare const DefaultLineChart: StoryObj<LineChartProps>;
+export declare const StatusLineChart: StoryObj<LineChartProps>;

package/lib/components/Charts/MultiRadialChart/MultiRadialChart.stories.d.ts

@@ -0,0 +1,8 @@
+import { Meta, StoryObj } from '@storybook/react';
+import MultiRadialChart from './MultiRadialChart';
+declare const meta: Meta<typeof MultiRadialChart>;
+export default meta;
+type Story = StoryObj<typeof MultiRadialChart>;
+export declare const Default: Story;
+export declare const numberLegend: Story;
+export declare const PillLegend: Story;

package/lib/components/Charts/PieChart/PieChart.stories.d.ts

@@ -0,0 +1,7 @@
+import { Meta, StoryObj } from '@storybook/react';
+import PieChart from './PieChart';
+declare const meta: Meta<typeof PieChart>;
+export default meta;
+type Story = StoryObj<typeof PieChart>;
+export declare const PieChartDashBoard: Story;
+export declare const PieChartDashBoardWithBorder: Story;

package/lib/components/Charts/RadialChart/RadialChart.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, StoryObj } from '@storybook/react';
+import RadialChart from './RadialChart';
+declare const meta: Meta<typeof RadialChart>;
+export default meta;
+type Story = StoryObj<typeof RadialChart>;
+export declare const ChartWithStatus: Story;

package/lib/components/Checkbox/Checkbox.stories.d.ts

@@ -0,0 +1,8 @@
+import { Meta, StoryObj } from '@storybook/react';
+import Checkbox from './Checkbox';
+declare const meta: Meta<typeof Checkbox>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const Partial: Story;
+export declare const Controlled: Story;

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

@@ -0,0 +1,14 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import Chip from './Chip';
+import '../../assets/styles/_colors.scss';
+import './Chip.scss';
+declare const meta: Meta<typeof Chip>;
+type Story = StoryObj<typeof Chip>;
+export declare const Primary: Story;
+export declare const withoutExpand: Story;
+export declare const Group: Story;
+export declare const CustomChip: Story;
+export declare const Success: Story;
+export declare const Errors: Story;
+export declare const Warning: Story;
+export default meta;

package/lib/components/ConnectingBranch/ConnectingBranch.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import ConnectingBranch from './ConnectingBranch';
+declare const meta: Meta<typeof ConnectingBranch>;
+export default meta;
+type Story = StoryObj<typeof ConnectingBranch>;
+export declare const Default: Story;

package/lib/components/DatePicker/DatePicker.stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import CustomDatePicker from './DatePicker';
+declare const meta: Meta<typeof CustomDatePicker>;
+export default meta;
+type Story = StoryObj<typeof CustomDatePicker>;
+export declare const Default: Story;
+export declare const StartDateFilter: Story;
+export declare const EndDateInput: Story;
+export declare const ScheduleDateInput: Story;

package/lib/components/DragAndDrop/DragAndDrop.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, StoryObj } from '@storybook/react';
+import DragAndDropList from './DragAndDropList';
+declare const meta: Meta<typeof DragAndDropList>;
+type Story = StoryObj<typeof DragAndDropList>;
+export declare const Primary: Story;
+export default meta;

package/lib/components/Drawer/Drawer.stories.d.ts

@@ -0,0 +1,12 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import Drawer from './Drawer';
+declare const meta: Meta<typeof Drawer>;
+export default meta;
+type Story = StoryObj<typeof Drawer>;
+export declare const Default: Story;
+export declare const WithoutHeader: Story;
+export declare const WithCustomHeader: Story;
+export declare const WithCustomFooter: Story;
+export declare const WithTertiaryButtons: Story;
+export declare const WithCustomZIndex: Story;
+export declare const Controlled: Story;

package/lib/components/EditTextField/EditTextField.stories.d.ts

@@ -0,0 +1,10 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import EditTextField from './EditTextField';
+import '../../assets/styles/_colors.scss';
+import './EditTextField.scss';
+declare const meta: Meta<typeof EditTextField>;
+type Story = StoryObj<typeof EditTextField>;
+export declare const textFieldWithLabel: Story;
+export declare const textFieldWithOutLabel: Story;
+export declare const openTextField: Story;
+export default meta;

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

@@ -0,0 +1,6 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { EditorProps } from './types';
+declare const meta: Meta<EditorProps>;
+export default meta;
+type Story = StoryObj<EditorProps>;
+export declare const Default: Story;

package/lib/components/Excel/ContextMenu/ContextMenu.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import './ContextMenu.scss';
+declare const ContextMenu: React.FC<ContextMenuProps>;
+export default ContextMenu;

package/lib/components/Excel/ExcelFile.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import ExcelFile from './ExcelFile/ExcelFile';
+declare const meta: Meta<typeof ExcelFile>;
+type Story = StoryObj<typeof ExcelFile>;
+export declare const Default: Story;
+export default meta;