@zohodesk/library-platform 1.0.0-exp.1

package/examples/library/src/table-list/data/empty_data.js

@@ -0,0 +1,47 @@
+export const data = {
+  "headers": [
+    {
+      "id": "textColumn",
+      "text": "Text",
+      "size": "medium",
+      "alignment": "left"
+    },
+    {
+      "id": "emailColumn",
+      "text": "Email",
+      "size": "large",
+      "alignment": "left"
+    },
+    {
+      "id": "switchColumn",
+      "text": "Switch",
+      "size": "medium",
+      "alignment": "center"
+    },
+    {
+      "id": "linkColumn",
+      "text": "Link",
+      "size": "medium",
+      "alignment": "left"
+    },
+    {
+      "id": "checkboxColumn",
+      "text": "Checkbox",
+      "size": "medium",
+      "alignment": "center"
+    },
+    {
+      "id": "avatarColumn",
+      "text": "Avatar",
+      "size": "medium",
+      "alignment": "left"
+    },
+    {
+      "id": "statusboxColumn",
+      "text": "HighlightedValue",
+      "size": "large",
+      "alignment": "left"
+    }
+  ],
+  "rows": []
+};

package/examples/library/src/table-list/data/resizer_data.js

@@ -0,0 +1,62 @@
+function cellModel(name, text) {
+  return { type: 'Text', name, text, style: {} };
+}
+
+function getSingleListData(data) {
+  return {
+    id: data.id,
+    columns: [
+      cellModel('ID', data.id),
+      cellModel('Subject', data.subject),
+      cellModel('First Name', data.firstName),
+      cellModel('First Name1', data.firstName),
+      cellModel('First Name2', data.firstName),
+      cellModel('First Name4', data.firstName),
+      cellModel('Full Name', data.firstName + ' ' + data.lastName),
+      cellModel('Last Name', data.lastName)
+    ],
+    actions: [],
+    clickAction: {
+      name: 'Click',
+      label: 'Detail Page',
+      actionName: 'NAVIGATATION',
+      actionPayload: {
+        url: '/agent/arunalocal/arunalocal/raises/details/' + data.id
+      },
+      buttonType: 'Primary|Secondary',
+      icon: 'ZD-fontedit'
+    }
+  };
+}
+
+const items = '*'
+  .repeat(200)
+  .split('')
+  .map((_, i) => ({
+    id: `list_ ${1 + i}`,
+    subject: `List -  ${1 + i}`,
+    firstName: `firstName- ${1 + i}`,
+    lastName: `lastName- ${1 + i}`
+  }));
+
+function headingModel(text) {
+  return {
+    id: text,
+    text,
+    size: 'large'
+  };
+}
+
+export const data = {
+  headers: [
+    headingModel('ID'),
+    headingModel('Subject'),
+    headingModel('First Name'),
+    headingModel('First Name1'),
+    headingModel('First Name2'),
+    headingModel('First Name4'),
+    headingModel('Full Name'),
+    headingModel('Last Name')
+  ],
+  rows: items.map((item) => getSingleListData(item))
+};

package/examples/library/src/table-list/data/simple_data.js

@@ -0,0 +1,63 @@
+export const data = {
+  "headers": [
+    {
+      "id": "nameColumn",
+      "text": "Task Name",
+      "size": "large",
+      "alignment": "left"
+    },
+    {
+      "id": "descColumn",
+      "text": "Description",
+      "size": "xlarge",
+      "alignment": "left"
+    }
+  ],
+  "rows": Array.from({length: 4}).map((_, i) => (
+    {
+      "id": "3760000000046024_"+i,
+      "columns": [
+        {
+          "type": "URLField",
+          "value": "https://www.zoho.com"
+        },
+        {
+          "type": "SingleLineField",
+          "value": i === 2 ? "Lorem ipsum dolor sit amet." : i === 0 ? "Testing description" : "-"
+        }
+      ],
+      "rowActions": [
+        {
+          "name": "Edit",
+          "label": "Edit Page",
+          "actionName": "NAVIGATATION",
+          "actionPayload": {
+            "url": "/agent/arunalocal/arunalocal/raises/edit/3760000000046024"
+          },
+          "buttonType": "primary",
+          "icon": "ZD-GN-edit"
+        },
+        {
+          "name": "Delete",
+          "label": "Delete",
+          "actionName": "DELETE",
+          "actionPayload": {
+            "id": "3760000000046024"
+          },
+          "buttonType": "danger",
+          "icon": "ZD-GN-delete"
+        }
+      ],
+      "clickAction": {
+        "name": "Click",
+        "label": "Detail Page",
+        "actionName": "NAVIGATATION",
+        "actionPayload": {
+          "url": "/agent/arunalocal/arunalocal/raises/details/3760000000046024"
+        },
+        "buttonType": "Primary|Secondary",
+        "icon": "ZD-GN-edit"
+      }
+    }
+  ))
+};

package/jsconfig.json

@@ -0,0 +1,13 @@
+{
+  "strict": true,
+  "compilerOptions": {
+    "target": "ESNext",
+    "module": "Preserve",
+    "paths": {
+      "@library/*": ["./src/library/*"],
+      "@platform/*": ["./src/platform/*"],
+      "@cc/*": ["./src/cc/*"],
+      "@bc/*": ["./src/bc/*"]
+    }
+  }
+}

package/lint.config.js

@@ -0,0 +1,29 @@
+const path = require("path");
+
+/**
+ * Configuration object for linting and reporting.
+ * @property {string} ruleConfigurationPath - The path to the ESLint configuration file.
+ * @property {boolean} impactBased - Indicates if the linting is impact-based.
+ * @property {string} lintReportPath - The path to the lint report JSON file.
+ * @property {string} sonar_host_URL - The URL of the SonarQube server.
+ * @property {string} loginName - The username for authentication with the SonarQube server.
+ * @property {string} password - The password for authentication with the SonarQube server.
+ * @property {string} gitEndPoint - API EndPoint for Git Actions
+ * @property {number} projectId - project id of repository
+ * @property {string} token - Encrypted Authentication Token
+ * @property {string} compareBranch - Branch to compare diff
+ */
+
+
+module.exports = {
+  ruleConfigurationPath: path.resolve(process.cwd(), ".eslintrc.js"),
+  impactBased: true,
+  lintReportPath: path.resolve(process.cwd(), "lint-report", "lintReport.json"),
+  sonar_hostURL: "https://client-linters.zohodesk.csez.zohocorpin.com",
+  metric_token: "zxh_9737850jh2l53ml17223929ihii73072j54j2260",
+  branchDiffPath:path.resolve(process.cwd(),"diffBranch.json"),
+  gitEndPoint:"https://zgit.csez.zohocorpin.com",
+  projectId:`18537`,
+  token:"w-OkG3f5OOM1Rkly8phZ",
+  compareBranch:'v2'
+};

package/old-tsconfig.json

@@ -0,0 +1,23 @@
+{
+  "compilerOptions": {
+    "strict": false,
+    "target": "es2019",
+    "module": "ES6",
+    "outDir": "./es",
+    "rootDir": "./src",
+    "lib": ["es2019", "DOM"],
+    "declaration": true,
+    "jsx": "react",
+    "typeRoots": ["node_modules/@types"],
+    "moduleResolution": "node",
+    "allowSyntheticDefaultImports": true
+  },
+  "include": [
+    "src/**/*.tsx",
+    "src/**/*.ts",
+    "src/**/*.js",
+    "../my-app/index.tsx",
+    "../_old/api json.js"
+  ],
+  "exclude": ["node_modules"]
+}

package/package.json

@@ -0,0 +1,67 @@
+{
+  "name": "@zohodesk/library-platform",
+  "version": "1.0.0-exp.1",
+  "description": "",
+  "main": "es/index.js",
+  "scripts": {
+    "download": "react-cli clean ./node_modules ./package-lock.json && npm install",
+    "rtl": "react-cli rtl ./src ./es",
+    "cssVariableConvert": "react-cli variableConverter ./es ./es",
+    "build": "react-cli  build:library:es",
+    "build:watch": "react-cli clean ./es && npm run build -- -w",
+    "test": "react-cli test",
+    "prepare": "npm run build && npm run rtl && npm run cssVariableConvert",
+    "publish:alpha": "npm publish --tag alpha",
+    "publish:beta": "npm publish --tag beta",
+    "publish:exp": "npm publish --tag experimental",
+    "postpublish": "node ./post_publish.js",
+    "lint": "eslint -c .eslintrc.js --ext .ts,.js,.tsx",
+    "lint:analytics": "ZDLintingFramework lint",
+    "prettify": "node prettify.js staged"
+  },
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "@types/react": "18.2.55",
+    "@typescript-eslint/parser": "^7.11.0",
+    "@zoho/SecurityJS": "5.0.2",
+    "@zohodesk-private/css-variable-migrator": "^1.0.7",
+    "@zohodesk-private/desk-components": "1.2.0",
+    "@zohodesk-private/node-plugins": "1.1.7",
+    "@zohodesk/a11y": "2.2.3",
+    "@zohodesk/codestandard-analytics": "0.0.1-exp-21",
+    "@zohodesk/codestandard-validator": "0.0.3",
+    "@zohodesk/components": "1.2.39",
+    "@zohodesk/dot": "1.4.18",
+    "@zohodesk/eslint-plugin-architecturerules": "0.0.3",
+    "@zohodesk/hooks": "2.0.4",
+    "@zohodesk/i18n": "1.0.0-beta.26",
+    "@zohodesk/icons": "1.0.50",
+    "@zohodesk/layout": "3.1.0",
+    "@zohodesk/svg": "1.1.15",
+    "@zohodesk/utils": "1.3.13",
+    "@zohodesk/virtualizer": "1.0.13",
+    "color": "4.2.3",
+    "dependency-cruiser": "12.0.1",
+    "eslint": "^8.26.0",
+    "prettier": "3.3.3",
+    "typescript": "^4.9.5"
+  },
+  "peerDependencies": {
+    "color": "4.2.3",
+    "@zohodesk-private/desk-components": "1.2.0",
+    "@zohodesk/a11y": "2.2.3",
+    "@zohodesk/components": "1.2.39",
+    "@zohodesk/dot": "1.4.18",
+    "@zohodesk/hooks": "2.0.4",
+    "@zohodesk/i18n": "1.0.0-beta.26",
+    "@zohodesk/icons": "1.0.50",
+    "@zohodesk/layout": "3.1.0",
+    "@zohodesk/svg": "1.1.15",
+    "@zohodesk/utils": "1.3.13"
+  },
+  "dependencies": {
+    "@zohodesk/redux-modules": "1.2.1",
+    "object-path-immutable": "4.1.2"
+  }
+}

package/post_publish.js

@@ -0,0 +1,13 @@
+const path = require('path');
+const { execSync } = require('child_process');
+
+// eslint-disable-next-line import/no-dynamic-require
+const { version, name } = require(path.join(process.cwd(), 'package.json'));
+const tagName = `${name}@${version}`;
+// const tagName = `${name.replace(/^@/g, "").replace(/\//g, "-")}-v-${version}}@${version}`;
+
+// eslint-disable-next-line no-console
+console.log(`going to add git tag...  ${tagName}`);
+
+execSync(`git tag -a ${tagName} -m "${tagName}" `, { stdio: 'inherit' });
+execSync(`git push origin ${tagName}`, { stdio: 'inherit' });

package/prettify.js

@@ -0,0 +1,90 @@
+/* eslint-disable no-console */
+
+const { execSync } = require('child_process');
+const path = require('path');
+const fs = require('fs');
+
+// Get command-line arguments
+const args = process.argv.slice(2);
+const formatStaged = args.includes('staged');
+
+// Helper function to run a command and get the output
+const runCommand = command => execSync(command, { encoding: 'utf-8', stdio: 'pipe' }).trim();
+
+const listFilesAndFolders = (as = 'separate') => {
+  const output = runCommand('ls -p'); // -p appends a slash to directory names
+  if (as === 'combined') {
+    return output;
+  
+  }
+  const items = output.split('\n');
+
+  const files = items.filter(item => !item.endsWith('/'));
+  const folders = items.filter(item => item.endsWith('/')).map(folder => folder.slice(0, -1)); // Remove trailing slash
+
+  return { files, folders };
+};
+
+// Read .gitignore and .prettierignore files
+const readIgnoreFile = filePath => {
+  if (fs.existsSync(filePath)) {
+    return fs
+      .readFileSync(filePath, 'utf-8')
+      .split('\n')
+      .map(line => line.trim())
+      .filter(line => line && !line.startsWith('#'));
+  }
+  return [];
+};
+
+const ignorePatterns = readIgnoreFile(path.join(__dirname, '.prettierignore'));
+
+// Helper function to check if a file should be ignored
+const shouldIgnore = file => {
+  return ignorePatterns.some(pattern => {
+    const regex = new RegExp(
+      pattern
+        .replace(/[\*\?\[\]\(\)\+\.\|\^\$\{\}]/g, '\\$&')
+        .replace(/(\*)+/g, '.*')
+        .replace(/(\?)+/g, '.')
+    );
+    return regex.test(file);
+  });
+};
+
+// Get all files in the current directory that need formatting
+const getAllFiles = () =>
+  listFilesAndFolders('combined')
+    .split('\n')
+    .filter(file => file && !shouldIgnore(file));
+
+// Get all staged files that have changes
+const getStagedFiles = () => {
+  const stagedFiles = runCommand('git diff --cached --name-only --diff-filter=ACMR');
+  return stagedFiles
+    .split('\n')
+    .filter(
+      file =>
+        (file.endsWith('.js') || file.endsWith('.jsx') || file.endsWith('.ts') || file.endsWith('.tsx') || file.endsWith('.json')) &&
+        !shouldIgnore(file)
+    );
+};
+
+// Determine which files to format (default to all if no arguments are provided)
+const filesToFormat = formatStaged ? getStagedFiles() : getAllFiles();
+
+// Format each file
+filesToFormat.forEach(file => {
+  console.log(`Formatting ${file}...`);
+  try {
+    execSync(`npx prettier --write "${path.join(__dirname, file)}"`, { stdio: 'inherit' });
+    if (formatStaged) {
+      execSync(`git add "${path.join(__dirname, file)}"`, { stdio: 'inherit' }); // Re-add the formatted file to staging
+    }
+  } catch (error) {
+    console.error(`Error formatting ${file}:`, error.message);
+    process.exit(1);
+  }
+});
+
+console.log('Formatting complete.');

package/react-cli.config.js

@@ -0,0 +1,15 @@
+exports.config = {
+  enableTypeScript: true,
+  css: {
+    cssVariableReplacementConfig: './node_modules/@zohodesk-private/css-variable-migrator/es/config/cssVariableReplacementOptions.json'
+  },
+  babelCustomizationForLibrary: {
+    babelPlugins: ['@babel/plugin-proposal-optional-chaining', '@babel/plugin-proposal-class-properties']
+  },
+  alias: {
+    '@library': './src/library',
+    '@platform': './src/platform',
+    '@bc': './src/bc',
+    '@cc': './src/cc'
+  }
+};

package/src/bc/list-selection/ActionHandlers.ts

@@ -0,0 +1,10 @@
+import EventHandlers, { EventHandler } from '@cc/component/EventHandlers';
+import { LIST_SELECTION_TOGGLE_ALL, LIST_SELECTION_TOGGLE_ITEMS, LIST_SELECTION_TOGGLE_ITEMS_IN_RANGE } from './Constants';
+
+interface ListSelectionActionHandlers extends EventHandlers {
+  [LIST_SELECTION_TOGGLE_ITEMS]: EventHandler;
+  [LIST_SELECTION_TOGGLE_ALL]: EventHandler;
+  [LIST_SELECTION_TOGGLE_ITEMS_IN_RANGE]: EventHandler;
+}
+
+export default ListSelectionActionHandlers;

package/src/bc/list-selection/Actions.ts

@@ -0,0 +1,45 @@
+import Action from '@cc/component/Action';
+import { LIST_SELECTION_TOGGLE_ALL, LIST_SELECTION_TOGGLE_ITEMS, LIST_SELECTION_TOGGLE_ITEMS_IN_RANGE } from './Constants';
+
+const Actions: Action[] = [
+  {
+    type: LIST_SELECTION_TOGGLE_ITEMS,
+    payload: {
+      selected: {
+        name: 'selected',
+        typeMetadata: {
+          schema: {
+            type: 'array'
+          }
+        }
+      }
+    }
+  },
+  {
+    type: LIST_SELECTION_TOGGLE_ALL,
+    payload: {}
+  },
+  {
+    type: LIST_SELECTION_TOGGLE_ITEMS_IN_RANGE,
+    payload: {
+      startIndex: {
+        name: 'startIndex',
+        typeMetadata: {
+          schema: {
+            type: 'number'
+          }
+        }
+      },
+      endIndex: {
+        name: 'endIndex',
+        typeMetadata: {
+          schema: {
+            type: 'number'
+          }
+        }
+      }
+    }
+  }
+];
+
+export default Actions;

package/src/bc/list-selection/Constants.ts

@@ -0,0 +1,3 @@
+export const LIST_SELECTION_TOGGLE_ITEMS = 'LIST_SELECTION#TOGGLE_ITEMS';
+export const LIST_SELECTION_TOGGLE_ALL = 'LIST_SELECTION#TOGGLE_ALL';
+export const LIST_SELECTION_TOGGLE_ITEMS_IN_RANGE = 'LIST_SELECTION#TOGGLE_ITEMS_IN_RANGE';

package/src/bc/list-selection/Properties.ts

@@ -0,0 +1,17 @@
+export default {
+  type: 'object',
+  properties: {
+    isEnabled: {
+      type: 'boolean',
+      defaultValue: false
+    },
+    maxSelectionCount: {
+      type: 'number',
+      defaultValue: 50
+    },
+    limitExceedAlertMessage: {
+      type: 'string',
+      defaultValue: 'Max records selected'
+    }
+  }
+};

package/src/bc/local-storage/ActionHandlers.ts

@@ -0,0 +1,7 @@
+import ActionHandlers, {
+  ActionHandler
+} from '../../cc/component/ActionHandlers';
+
+export default interface LocalStorageActionHandlers extends ActionHandlers {
+  'LOCAL_STORAGE#UPDATE_REQUESTED': ActionHandler;
+}

package/src/bc/local-storage/Constants.ts

@@ -0,0 +1 @@
+export const UPDATE_REQUESTED: string = 'LOCAL_STORAGE#UPDATE_REQUESTED';

package/src/bc/local-storage/Properties.ts

@@ -0,0 +1,10 @@
+export default {
+  localStorageKey: {
+    required: true,
+    typeMetadata: {
+      schema: {
+        type: "string"
+      }
+    }
+  },
+};

package/src/bc/sort-by/ActionHandlers.ts

@@ -0,0 +1,8 @@
+import EventHandlers, { EventHandler } from '@cc/component/EventHandlers';
+import { SORTBY_SORT } from './Constants';
+
+interface SortByActionHandlers extends EventHandlers {
+  [SORTBY_SORT]: EventHandler;
+}
+
+export default SortByActionHandlers;

package/src/bc/sort-by/Constants.ts

@@ -0,0 +1,2 @@
+export const SORTBY_SORT = 'SORT_BY#SORT';
+export const SORTBY_SORTED = 'SORT_BY#SORTED';

package/src/bc/sort-by/Properties.ts

@@ -0,0 +1,22 @@
+import SortOrder from './SortOrderEnum';
+
+export default {
+  required: false,
+  defaultValue: {
+    id: '',
+    type: 'none'
+  },
+  typeMetadata: {
+    schema: {
+      id: {
+        required: true,
+        type: 'string'
+      },
+      order: {
+        type: 'string',
+        enum: Object.values(SortOrder),
+        defaultValue: 'none'
+      }
+    }
+  }
+};

package/src/bc/sort-by/SortOrderEnum.ts

@@ -0,0 +1,7 @@
+enum SortOrder {
+  NONE = 'none',
+  ASC = 'ascending',
+  DES = 'descending'
+}
+
+export default SortOrder;

package/src/bc/table-column-resizer/ActionHandlers.ts

@@ -0,0 +1,12 @@
+import ActionHandlers, {
+  ActionHandler
+} from '../../cc/component/ActionHandlers';
+
+export default interface TableColumnResizerActionHandlers
+  extends ActionHandlers {
+  'TABLE_COLUMN_RESIZER#RESIZE_STARTED': ActionHandler;
+  'TABLE_COLUMN_RESIZER#RESIZE_MOUSE_MOVED': ActionHandler;
+  'TABLE_COLUMN_RESIZER#RESIZE_SCROLL_MOVED': ActionHandler;
+  'TABLE_COLUMN_RESIZER#RESIZE_ENDED': ActionHandler;
+  'TABLE_COLUMN_RESIZER#RESIZE_FINISHED': ActionHandler;
+}

package/src/bc/table-column-resizer/Constants.ts

@@ -0,0 +1,9 @@
+export const RESIZE_STARTED: string = 'TABLE_COLUMN_RESIZER#RESIZE_STARTED';
+
+export const RESIZE_MOUSE_MOVED: string = 'TABLE_COLUMN_RESIZER#RESIZE_MOUSE_MOVED';
+
+export const RESIZE_SCROLL_MOVED: string = 'TABLE_COLUMN_RESIZER#RESIZE_SCROLL_MOVED';
+
+export const RESIZE_ENDED: string = 'TABLE_COLUMN_RESIZER#RESIZE_ENDED';
+
+export const RESIZE_FINISHED: string = 'TABLE_COLUMN_RESIZER#RESIZE_FINISHED';

package/src/bc/table-column-resizer/Properties.ts

@@ -0,0 +1,18 @@
+export default {
+  type: 'object',
+  properties: {
+    isEnabled: {
+      type: 'boolean',
+      defaultValue: false
+    },
+    minWidth: {
+      type: 'number',
+      defaultValue: 120
+    },
+    maxWidth: {
+      type: 'number',
+      defaultValue: 1000
+    }
+  },
+  required: ['isEnabled']
+};

package/src/bc/zfield/ActionHandlers.ts

@@ -0,0 +1,13 @@
+import ActionHandlers, { ActionHandler } from '@cc/component/ActionHandlers';
+import { FIELD_EXECUTE, FIELD_REFETCH } from './Constants';
+import { FETCH_FAILED, FETCH_SUCCESS, FETCH_SUCCESS_NO_CONTENT } from '@bc/zhttp/Constants';
+
+interface ZFieldActionHandlers extends ActionHandlers {
+  [FIELD_REFETCH]: ActionHandler;
+  [FIELD_EXECUTE]: ActionHandler;
+  [FETCH_SUCCESS]: ActionHandler;
+  [FETCH_SUCCESS_NO_CONTENT]: ActionHandler;
+  [FETCH_FAILED]: ActionHandler;
+}
+
+export default ZFieldActionHandlers;