pixel-react 1.1.9 → 1.2.1

package/src/components/Table/Types.ts

@@ -1,108 +1,124 @@
 import { ReactNode } from 'react';
 
 export interface ColumnsProps {
-    /**
-     * column name
-     */
-    header: string;
-    /**
-     * data key for particular column
-     */
-    accessor: string;
-    /**
-     * className for a column
-     */
-    className?: string;
-    /**
-     * width of a column
-     */
-    width?: number;
-    /**
-     * data for the column
-     */
-    cell?: (e: any) => JSX.Element | string | ReactNode;
-  
-    onClick?: (colum: string, row: DataProps) => void;
-  }
-  export interface DataProps {
-    /**
-     * data for each row
-     */
-    [key: string]: any;
-  }
-  export interface SelectedItemProps {
-    /**
-     * selected row object | All selected flag
-     */
-    [key: string]: string | number | boolean;
-  }
-  export interface TableProps {
-    /**
-     * Data for table
-     */
-    data: Array<number | string | DataProps>;
-    /**
-     * Column details for table
-     */
-    columns: Array<any>;
-    /**
-     * Header type to have different background color
-     */
-    headerType: 'default' | 'primary' | 'secondary';
-    /**
-     * withFixedHeader prop to have non-scrollable fixed table header
-     */
-    withFixedHeader?: boolean;
-    /**
-     * borderWithRadius prop to have table with border 1px and borderRadius 5px
-     */
-    borderWithRadius?: boolean;
-    /**
-     * Check box feature to select the row
-     */
-    withCheckbox?: boolean;
-    /**
-     * Event for checkbox onClick
-     */
-    onSelect?: (e: object, arg: SelectedItemProps) => void;
-    /**
-     * Check box feature to select the row
-     */
-    allSelected?: boolean;
-    /**
-     * send true to show partial checkbox in the header
-     */
-    partialSelected?: boolean;
-    /**
-     * send true to disable the checkbox in the header
-     */
-    headerCheckboxDisabled?: boolean;
-    /**
-     * The content that to be displayed if no data not found
-     */
-    noDataContent: string | ReactNode;
-    /**
-     * Image that to be displayed if you don't have data
-     */
-    noDataImage?: string;
-    /**
-     * Size of the image that to be displayed if you don't have data
-     */
-    noDataImageSize?: 'x-large' | 'large' | 'medium' | 'small' | 'x-small';
-    /**
-     *  Height of the table in string
-     */
-    height?: string;
-    /**
-     *  classNames for the table container
-     */
-    className?: string;
-    /**
-     *  classNames for the table Header container
-     */
-    tableHeadClass?:string;
-    /**
-     *  classNames for the table Row container
-     */
-    tableBodyRowClass?:string;
-  }
+  /**
+   * column name
+   */
+  header: string;
+  /**
+   * data key for particular column
+   */
+  accessor: string;
+  /**
+   * className for a column
+   */
+  className?: string;
+  /**
+   * width of a column
+   */
+  width?: number;
+  /**
+   * data for the column
+   */
+  cell?: (e: any) => JSX.Element | string | ReactNode;
+
+  onClick?: (colum: string, row: DataProps) => void;
+}
+export interface DataProps {
+  /**
+   * data for each row
+   */
+  [key: string]: any;
+}
+export interface SelectedItemProps {
+  /**
+   * selected row object | All selected flag
+   */
+  [key: string]: string | number | boolean;
+}
+export interface TableProps {
+  /**
+   * Data for table
+   */
+  data: Array<number | string | DataProps>;
+  /**
+   * Column details for table
+   */
+  columns: Array<any>;
+  /**
+   * Header type to have different background color
+   */
+  headerType: 'default' | 'primary' | 'secondary';
+  /**
+   * withFixedHeader prop to have non-scrollable fixed table header
+   */
+  withFixedHeader?: boolean;
+  /**
+   * borderWithRadius prop to have table with border 1px and borderRadius 5px
+   */
+  borderWithRadius?: boolean;
+  /**
+   * Check box feature to select the row
+   */
+  withCheckbox?: boolean;
+  /**
+   * Event for checkbox onClick
+   */
+  onSelect?: (e: object, arg: SelectedItemProps) => void;
+  /**
+   * Check box feature to select the row
+   */
+  allSelected?: boolean;
+  /**
+   * send true to show partial checkbox in the header
+   */
+  partialSelected?: boolean;
+  /**
+   * send true to disable the checkbox in the header
+   */
+  headerCheckboxDisabled?: boolean;
+  /**
+   * The content that to be displayed if no data not found
+   */
+  noDataContent: string | ReactNode;
+  /**
+   * Image that to be displayed if you don't have data
+   */
+  noDataImage?: string;
+  /**
+   * Size of the image that to be displayed if you don't have data
+   */
+  noDataImageSize?: 'x-large' | 'large' | 'medium' | 'small' | 'x-small';
+  /**
+   *  Height of the table in string
+   */
+  height?: string;
+  /**
+   *  classNames for the table container
+   */
+  className?: string;
+  /**
+   *  classNames for the table Header container
+   */
+  tableHeadClass?: string;
+  /**
+   *  classNames for the table Row container
+   */
+  tableBodyRowClass?: string;
+  /**
+   * custom color for the column text
+   */
+  headerTextColor?: 'default' | 'primary';
+  /**
+   * custom color for the row text
+   */
+  tableDataTextColor?: string;
+  /**
+   * icon for the table header, for expand or other purposes
+   */
+  headerIconName?: string;
+  /**
+   * handle function for the table header icon
+   */
+  headerIconOnClick?: () => void;
+}

package/src/index.ts

@@ -50,6 +50,7 @@ import IconRadioGroup from './components/IconRadioGroup';
 import MachineInputField from './components/MachineInputField';
 import SequentialConnectingBranch from './components/SequentialConnectingBranch';
 import AttachmentButton from './components/AttachmentButton';
+import LabelEditTextField from './components/LabelEditTextField';
 
 // Utils imports
 import { checkEmpty } from './utils/checkEmpty/checkEmpty';
@@ -120,6 +121,7 @@ export {
   MachineInputField,
   SequentialConnectingBranch,
   AttachmentButton,
+  LabelEditTextField,
   IconRadioGroup,
 
   // utils exports

package/src/utils/getSelectOptionValue/getSelectOptionValue.ts

@@ -0,0 +1,31 @@
+type DynamicValues = any;
+
+interface dynamicObject {
+  [key: string]: DynamicValues;
+}
+
+type accessorType = string | undefined;
+
+export const getLabel = (
+  option: dynamicObject,
+  accessor: accessorType = ''
+) => {
+  if (!accessor) {
+    if (option.hasOwnProperty('label')) {
+      return option.label;
+    }
+  }
+  return option[accessor];
+};
+
+export const getValue = (
+  option: dynamicObject,
+  accessor: accessorType = ''
+) => {
+  if (!accessor) {
+    if (option.hasOwnProperty('value')) {
+      return option.label;
+    }
+  }
+  return option[accessor];
+};