@licklist/design 0.66.12-dev.2 → 0.66.13

package/dist/zone/form/utils/dates.js

@@ -1,136 +1 @@
-import { TIME_SEPARATOR } from '@licklist/core/dist/Services/Date';
-import { DateTime } from 'luxon';
-import { TIME_FORMAT } from '@licklist/core/dist/Config';
-
-function _array_like_to_array(arr, len) {
-    if (len == null || len > arr.length) len = arr.length;
-    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
-    return arr2;
-}
-function _array_with_holes(arr) {
-    if (Array.isArray(arr)) return arr;
-}
-function _array_without_holes(arr) {
-    if (Array.isArray(arr)) return _array_like_to_array(arr);
-}
-function _iterable_to_array(iter) {
-    if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
-}
-function _iterable_to_array_limit(arr, i) {
-    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
-    if (_i == null) return;
-    var _arr = [];
-    var _n = true;
-    var _d = false;
-    var _s, _e;
-    try {
-        for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
-            _arr.push(_s.value);
-            if (i && _arr.length === i) break;
-        }
-    } catch (err) {
-        _d = true;
-        _e = err;
-    } finally{
-        try {
-            if (!_n && _i["return"] != null) _i["return"]();
-        } finally{
-            if (_d) throw _e;
-        }
-    }
-    return _arr;
-}
-function _non_iterable_rest() {
-    throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-}
-function _non_iterable_spread() {
-    throw new TypeError("Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-}
-function _sliced_to_array(arr, i) {
-    return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
-}
-function _to_consumable_array(arr) {
-    return _array_without_holes(arr) || _iterable_to_array(arr) || _unsupported_iterable_to_array(arr) || _non_iterable_spread();
-}
-function _unsupported_iterable_to_array(o, minLen) {
-    if (!o) return;
-    if (typeof o === "string") return _array_like_to_array(o, minLen);
-    var n = Object.prototype.toString.call(o).slice(8, -1);
-    if (n === "Object" && o.constructor) n = o.constructor.name;
-    if (n === "Map" || n === "Set") return Array.from(n);
-    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
-}
-var DEFAULT_START_DAY_TIME = "00:00";
-var DEFAULT_END_DAY_TIME = "23:59";
-var getTimeCheckboxRanges = function(startTime, endTime) {
-    var range = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : 5;
-    var today = new Date();
-    var _startTime_split = _sliced_to_array(startTime.split(TIME_SEPARATOR), 2), startHour = _startTime_split[0], startMinutes = _startTime_split[1];
-    var _endTime_split = _sliced_to_array(endTime.split(TIME_SEPARATOR), 2), endHour = _endTime_split[0], endMinutes = _endTime_split[1];
-    var startDate = DateTime.now().setZone("UTC").set({
-        year: today.getFullYear(),
-        month: today.getMonth() + 1,
-        day: today.getDate(),
-        hour: Number(startHour),
-        minute: Number(startMinutes),
-        second: 0
-    });
-    var endDate = DateTime.now().setZone("UTC").set({
-        year: today.getFullYear(),
-        month: today.getMonth() + 1,
-        day: today.getDate(),
-        hour: Number(endHour),
-        minute: Number(endMinutes),
-        second: 0
-    });
-    var checkboxes = [
-        startDate.toFormat(TIME_FORMAT)
-    ];
-    var count = 0;
-    while(endDate.diff(startDate, [
-        "minutes"
-    ]).minutes >= range){
-        startDate = startDate.plus({
-            minutes: range
-        });
-        count += 1;
-        checkboxes[count] = startDate.toFormat(TIME_FORMAT);
-    }
-    return checkboxes;
-};
-var getCheckboxesByWorkHours = function(workHours) {
-    if (!workHours || !workHours.length) return getTimeCheckboxRanges(DEFAULT_START_DAY_TIME, DEFAULT_END_DAY_TIME);
-    var providerWorkHoursByWeek = workHours.reduce(function(workHoursNextArray, currentWorkHour) {
-        var start = currentWorkHour.start, end = currentWorkHour.end;
-        if (start && end) {
-            return _to_consumable_array(workHoursNextArray).concat([
-                {
-                    start: start,
-                    end: end
-                }
-            ]);
-        }
-        return workHoursNextArray;
-    }, []);
-    // If venue has filled only 1 work day from wee
-    // For another days we use default 00:00 and 23:59
-    // So it will be minimal and maximal work hour.
-    if (providerWorkHoursByWeek.length !== 7) {
-        return getTimeCheckboxRanges(DEFAULT_START_DAY_TIME, DEFAULT_END_DAY_TIME);
-    }
-    // Get all of start and end time work venue and
-    // then make locale compare for them. After that we will
-    // have sorted time array by asc direction.
-    var flatProviderWorkHoursByWeek = providerWorkHoursByWeek.reduce(function(flatArray, currentWorkHours) {
-        var start = currentWorkHours.start, end = currentWorkHours.end;
-        return _to_consumable_array(flatArray).concat([
-            start,
-            end
-        ]);
-    }, []).sort(function(prevWorkHour, currentWorkHour) {
-        return prevWorkHour.localeCompare(currentWorkHour);
-    });
-    return getTimeCheckboxRanges(flatProviderWorkHoursByWeek[0] || DEFAULT_START_DAY_TIME, flatProviderWorkHoursByWeek[flatProviderWorkHoursByWeek.length - 1] || DEFAULT_END_DAY_TIME);
-};
-
-export { getCheckboxesByWorkHours, getTimeCheckboxRanges };
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tslib"),r=require("@licklist/core/dist/Config"),t=require("luxon"),n=require("@licklist/core/dist/Services/Date"),a="00:00",o="23:59",u=function(a,o,u){void 0===u&&(u=5);for(var s=new Date,i=e.__read(a.split(n.TIME_SEPARATOR),2),d=i[0],_=i[1],l=e.__read(o.split(n.TIME_SEPARATOR),2),c=l[0],m=l[1],g=t.DateTime.now().setZone("UTC").set({year:s.getFullYear(),month:s.getMonth()+1,day:s.getDate(),hour:Number(d),minute:Number(_),second:0}),T=t.DateTime.now().setZone("UTC").set({year:s.getFullYear(),month:s.getMonth()+1,day:s.getDate(),hour:Number(c),minute:Number(m),second:0}),f=[g.toFormat(r.TIME_FORMAT)],p=0;T.diff(g,["minutes"]).minutes>=u;)g=g.plus({minutes:u}),f[p+=1]=g.toFormat(r.TIME_FORMAT);return f};exports.getCheckboxesByWorkHours=function(r){if(!r||!r.length)return u(a,o);var t=r.reduce((function(r,t){var n=t.start,a=t.end;return n&&a?e.__spreadArray(e.__spreadArray([],e.__read(r),!1),[{start:n,end:a}],!1):r}),[]);if(7!==t.length)return u(a,o);var n=t.reduce((function(r,t){var n=t.start,a=t.end;return e.__spreadArray(e.__spreadArray([],e.__read(r),!1),[n,a],!1)}),[]).sort((function(e,r){return e.localeCompare(r)}));return u(n[0]||a,n[n.length-1]||o)},exports.getTimeCheckboxRanges=u;

package/dist/zone/index.d.ts

@@ -1,3 +1,3 @@
-export * from "./card";
-export * from "./form";
+export * from "./card";
+export * from "./form";
 //# sourceMappingURL=index.d.ts.map

package/package.json

@@ -1,13 +1,12 @@
 {
   "name": "@licklist/design",
-  "version": "0.66.12-dev.2",
+  "version": "0.66.13",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@bitbucket.org/artelogicsoft/licklist_design.git"
   },
   "author": "Yaroslav Havryliv",
   "license": "MIT",
-  "type": "module",
   "homepage": "https://bitbucket.org/artelogicsoft/licklist_design#readme",
   "description": "",
   "scripts": {
@@ -16,19 +15,18 @@
     "type-check": "tsc --noEmit",
     "type-check:watch": "yarn type-check -- --watch",
     "build": "rollup -c",
-    "watch": "rollup -c --watch",
+    "watch": "yarn build -- -w",
     "lint": "eslint --ext .ts,.tsx .",
-    "lint:fix": "yarn run lint --fix",
+    "lint:fix": "yarn run lint -- --fix",
     "lint:format": "prettier \"**/*.{md,json,yml,scss}\" --check",
     "lint:format:fix": "prettier \"**/*.{md,json,yml,scss}\" --write",
     "prepare": "husky install",
     "tests": "yarn tests-staged",
     "prettier-write": "prettier --write",
-    "tsc": "bash -c tsc -p tsconfig.json -b",
-    "vite": "tsc && vite build"
+    "tsc": "bash -c tsc -p tsconfig.json -b"
   },
-  "main": "dist/index.js",
-  "typings": "dist/index.d.ts",
+  "main": "dist/index",
+  "typings": "dist/index",
   "browserslist": {
     "production": [
       ">0.2%",
@@ -41,32 +39,36 @@
       "last 1 safari version"
     ]
   },
-  "peerDependencies": {
-    "@licklist/core": "0.28.6-dev.1",
-    "@licklist/eslint-config": "0.5.5",
-    "@licklist/plugins": "0.30.4-dev.3",
-    "lodash": "4.17.21",
-    "luxon": "1.26.0",
-    "react": "17.0.2",
-    "react-dom": "17.0.2",
-    "react-hook-form": "7.52.2",
-    "react-i18next": "11.8.8",
-    "react-intl": "6.6.8",
-    "react-query": "3.34.12"
-  },
   "dependencies": {
+    "@babel/core": "7.16.0",
+    "@babel/plugin-proposal-private-property-in-object": "7.16.7",
     "@dnd-kit/core": "3.1.1",
     "@dnd-kit/modifiers": "4.0.0",
     "@dnd-kit/sortable": "4.0.0",
     "@dnd-kit/utilities": "2.0.0",
     "@fortawesome/fontawesome-svg-core": "1.2.34",
+    "@fortawesome/free-brands-svg-icons": "5.15.2",
     "@fortawesome/free-solid-svg-icons": "5.15.2",
-    "@licklist/core": "0.28.6-dev.1",
-    "@licklist/eslint-config": "0.5.5",
-    "@licklist/plugins": "0.30.4-dev.3",
+    "@fortawesome/react-fontawesome": "0.1.9",
+    "@licklist/core": "0.28.7",
+    "@licklist/eslint-config": "0.4.5",
+    "@licklist/plugins": "0.31.6",
     "@mdx-js/react": "1.6.22",
     "@popperjs/core": "2.11.8",
     "@react-aria/utils": "3.9.0",
+    "@rollup/plugin-image": "2.0.6",
+    "@rollup/plugin-json": "4.1.0",
+    "@rollup/plugin-node-resolve": "11.2.0",
+    "@storybook/addon-a11y": "6.3.12",
+    "@storybook/addon-actions": "6.3.12",
+    "@storybook/addon-docs": "6.3.12",
+    "@storybook/addon-essentials": "6.3.12",
+    "@storybook/addon-knobs": "6.3.1",
+    "@storybook/addon-links": "6.3.12",
+    "@storybook/preset-scss": "1.0.3",
+    "@storybook/react": "6.3.12",
+    "@svgr/rollup": "5.5.0",
+    "@svgr/webpack": "5.5.0",
     "@tanstack/react-table": "8.10.6",
     "@tiptap/core": "2.0.0-beta.176",
     "@tiptap/extension-blockquote": "2.0.0-beta.29",
@@ -89,33 +91,63 @@
     "@tiptap/pm": "2.0.0-beta.212",
     "@tiptap/react": "2.0.0-beta.109",
     "@tiptap/suggestion": "2.0.0-beta.92",
-    "@wojtekmaj/react-daterange-picker": "4.1.0",
+    "@types/babel__core": "7.1.16",
+    "@types/luxon": "1.26.2",
+    "@types/mdx-js__react": "1.5.3",
+    "@types/react-bootstrap": "1.0.1",
+    "@types/react-date-range": "1.4.9",
+    "@types/react-email-editor": "1.1.7",
+    "@types/react-loader": "2.4.4",
+    "@types/react-phone-number-input": "3.0.6",
+    "@types/react-virtualized": "^9.21.22",
+    "@types/resize-observer-browser": "^0.1.7",
+    "@types/sass": "1.16.0",
+    "@typescript-eslint/eslint-plugin": "5.8.1",
+    "@typescript-eslint/parser": "5.8.1",
+    "@wojtekmaj/react-daterange-picker": "^4.1.0",
+    "babel-loader": "8.2.2",
+    "babel-plugin-inline-react-svg": "2.0.1",
     "bootstrap": "4.6.0",
     "bootstrap-social": "5.1.1",
     "clsx": "1.1.1",
-    "date-fns": "2.29.3",
+    "core-js": "3.9.1",
+    "css-loader": "5.1.1",
+    "date-fns": "^2.29.3",
     "emojibase": "6.1.0",
     "emojibase-data": "7.0.1",
     "emojibase-regex": "6.0.1",
+    "enzyme": "3.11.0",
+    "eslint": "7.32.0",
+    "eslint-config-airbnb": "18.2.1",
+    "eslint-config-prettier": "8.3.0",
+    "eslint-plugin-jsx-a11y": "6.5.1",
+    "eslint-plugin-prettier": "4.0.0",
+    "eslint-plugin-react-hooks": "4.2.0",
     "framer-motion": "4.1.17",
+    "history": "5.3.0",
+    "husky": "7.0.4",
+    "i18next": "19.4.5",
+    "klona": "2.0.4",
     "konva": "6.0.0",
+    "lint-staged": "11.1.2",
     "lodash": "4.17.21",
     "luxon": "1.26.0",
     "moment": "2.29.1",
+    "prettier": "2.5.1",
     "react": "17.0.2",
     "react-bootstrap": "1.6.1",
     "react-color": "2.19.3",
+    "react-copy-to-clipboard": "5.0.3",
     "react-date-range": "1.4.0",
     "react-dom": "17.0.2",
     "react-email-editor": "1.6.1",
     "react-highlighter": "0.4.3",
-    "react-hook-form": "7.52.2",
+    "react-hook-form": "7.13.0",
     "react-i18next": "11.8.8",
-    "react-icons": "5.3.0",
-    "react-intl": "6.6.8",
-    "react-konva": "17.0.2-6",
+    "react-intl": "5.15.8",
+    "react-konva": "^17.0.2-6",
     "react-loader": "2.4.7",
-    "react-loading-skeleton": "3.3.1",
+    "react-loading-skeleton": "^3.3.1",
     "react-overlays": "4.1.1",
     "react-phone-number-input": "3.1.16",
     "react-query": "3.34.12",
@@ -123,82 +155,45 @@
     "react-select": "5.3.0",
     "react-swipeable": "6.2.0",
     "react-use": "17.3.1",
-    "react-virtualized": "9.22.5",
+    "react-virtualized": "^9.22.5",
     "recharts": "2.0.6",
-    "rrule": "2.6.8",
-    "twemoji-parser": "14.0.0",
-    "use-debounce": "7.0.1"
-  },
-  "devDependencies": {
-    "@chromatic-com/storybook": "1.6.1",
-    "@rollup/plugin-image": "3.0.3",
-    "@rollup/plugin-json": "6.1.0",
-    "@storybook/addon-a11y": "6.3.12",
-    "@storybook/addon-actions": "6.3.12",
-    "@storybook/addon-docs": "6.3.12",
-    "@storybook/addon-essentials": "6.3.12",
-    "@storybook/addon-knobs": "6.3.1",
-    "@storybook/addon-links": "6.3.12",
-    "@storybook/preset-scss": "1.0.3",
-    "@storybook/react": "6.3.12",
-    "@svgr/rollup": "8.1.0",
-    "@swc/core": "1.6.5",
-    "@types/lodash": "4.17.5",
-    "@types/luxon": "1.26.2",
-    "@types/mdx-js__react": "1.5.3",
-    "@types/node": "20.9.0",
-    "@types/react": "17.0.80",
-    "@types/react-bootstrap": "1.0.1",
-    "@types/react-date-range": "1.4.9",
-    "@types/react-dom": "17.0.25",
-    "@types/react-email-editor": "1.1.7",
-    "@types/react-loader": "2.4.4",
-    "@types/react-phone-number-input": "3.0.6",
-    "@types/react-virtualized": "9.21.22",
-    "@types/resize-observer-browser": "0.1.7",
-    "@types/sass": "1.16.0",
-    "@typescript-eslint/eslint-plugin": "5.8.1",
-    "@typescript-eslint/parser": "5.8.1",
-    "@vitejs/plugin-react": "4.3.1",
-    "babel-loader": "8.2.2",
-    "css-loader": "5.1.1",
-    "eslint": "7.32.0",
-    "eslint-config-airbnb": "18.2.1",
-    "eslint-config-prettier": "8.3.0",
-    "eslint-plugin-jsx-a11y": "6.5.1",
-    "eslint-plugin-prettier": "5.2.1",
-    "eslint-plugin-react-hooks": "4.2.0",
-    "husky": "7.0.4",
-    "lint-staged": "12.3.2",
-    "prettier": "3.3.3",
-    "rollup": "3.29.4",
+    "rollup": "1.32.1",
     "rollup-plugin-auto-external": "2.0.0",
-    "rollup-plugin-copy": "3.5.0",
+    "rollup-plugin-commonjs": "10.1.0",
+    "rollup-plugin-copy": "3.4.0",
     "rollup-plugin-delete": "2.0.0",
     "rollup-plugin-peer-deps-external": "2.2.4",
-    "rollup-plugin-swc3": "0.11.2",
-    "rollup-plugin-typescript2": "0.31.0",
-    "sass": "1.77.8",
+    "rollup-plugin-terser": "7.0.2",
+    "rollup-plugin-typescript2": "0.30.0",
+    "rollup-plugin-visualizer": "5.8.1",
+    "rrule": "2.6.8",
+    "sass": "1.32.8",
     "sass-loader": "10.1.1",
     "style-loader": "2.0.0",
-    "typescript": "5.5.4",
+    "twemoji-parser": "14.0.0",
+    "typescript": "4.9.5",
     "url-loader": "4.1.1",
-    "vite": "5.3.5",
-    "vite-plugin-dts": "4.0.2",
-    "vite-plugin-svgr": "4.2.0",
-    "vite-tsconfig-paths": "5.0.1"
+    "use-debounce": "7.0.1"
+  },
+  "resolutions": {
+    "@types/react": "17.0.2",
+    "@types/react-dom": "17.0.2",
+    "cheerio": "0.22.0"
   },
   "lint-staged": {
     "*.{ts,tsx}": [
       "yarn prettier-write",
-      "yarn lint:fix",
-      "yarn tsc"
+      "yarn lint:fix"
     ]
   },
-  "packageManager": "yarn@4.4.0",
-  "volta": {
-    "node": "20.9.0",
-    "yarn": "4.4.0"
+  "devDependencies": {
+    "@types/react": "17.0.2",
+    "@types/react-dom": "17.0.2",
+    "@wojtekmaj/enzyme-adapter-react-17": "^0.8.0",
+    "identity-obj-proxy": "^3.0.0"
   },
-  "stableVersion": "0.66.7-dev.5"
-}
+  "volta": {
+    "node": "16.20.2",
+    "yarn": "1.22.18"
+  }
+}

package/rollup.config.js

@@ -2,93 +2,63 @@ import image from "@rollup/plugin-image";
 import svgr from "@svgr/rollup";
 import copy from "rollup-plugin-copy";
 import typescript from "rollup-plugin-typescript2";
+import commonjs from "rollup-plugin-commonjs";
 import external from "rollup-plugin-peer-deps-external";
+import nodeResolve from "@rollup/plugin-node-resolve";
 import autoExternal from "rollup-plugin-auto-external";
 import purge from "rollup-plugin-delete";
 import json from "@rollup/plugin-json";
-import { swc } from "rollup-plugin-swc3";
+import visualizer from "rollup-plugin-visualizer";
+import { terser } from "rollup-plugin-terser";
 
-export default [
-  {
-    input: "src/index.ts",
-    output: {
-      format: "esm",
-      dir: "dist",
-      exports: "named",
-      preserveModules: true,
-      preserveModulesRoot: "src",
-    },
-    plugins: [
-      purge({
-        targets: ["./dist"],
-      }),
-
-      autoExternal(),
-      external(),
-      json(),
-      image(),
-      svgr(),
-
-      copy({
-        targets: [
-          { src: "./src/assets/*", dest: "./dist/assets" },
-          { src: "./src/styles/*", dest: "./dist/styles" },
-        ],
-      }),
-
-      typescript({
-        tsconfig: "./tsconfig.build.json",
-        clean: true,
-      }),
-    ],
-    external: ["tslib", /node_modules/],
+export default {
+  input: "src/index.ts",
+  preserveModules: true,
+  output: {
+    format: "cjs",
+    dir: "dist",
+    exports: "named",
+    preserveModulesRoot: "src",
   },
-  {
-    input: "src/index.ts",
-    output: {
-      format: "esm",
-      dir: "dist",
-      exports: "named",
-      preserveModules: true,
-      preserveModulesRoot: "src",
-    },
-    plugins: [
-      autoExternal(),
-      external(),
-      json(),
-      image(),
-      svgr(),
-
-      swc({
-        jsc: {
-          parser: {
-            syntax: "typescript",
-            tsx: true,
-            dynamicImport: false,
-            privateMethod: false,
-            functionBind: false,
-            exportDefaultFrom: true,
-            exportNamespaceFrom: true,
-            decorators: false,
-            decoratorsBeforeExport: false,
-            topLevelAwait: false,
-            importMeta: false,
-            preserveAllComments: true,
-          },
-          transform: {
-            react: {
-              runtime: "automatic",
-            },
-          },
-          target: "es5",
-          loose: false,
-          externalHelpers: false,
-          // Requires v1.2.50 or upper and requires target to be es2016 or upper.
-          keepClassNames: false,
-        },
-        isModule: true,
-      }),
-    ],
-    external: ["tslib", /node_modules/],
-  },
-];
+  plugins: [
+    purge({
+      targets: ["./dist"],
+    }),
+    autoExternal(),
+    external(),
+    nodeResolve({
+      resolveOnly: [/^\.{0,2}\//],
+    }),
+    json(),
+    image(),
+    svgr(),
+    typescript({
+      tsconfig: "./tsconfig.json",
+      clean: true,
+    }),
+    commonjs({
+      include: ["node_modules/**"],
+      namedExports: {
+        "node_modules/react/react.js": [
+          "Children",
+          "Component",
+          "PropTypes",
+          "createElement",
+        ],
+        "node_modules/react-dom/index.js": ["render"],
+      },
+    }),
+    copy({
+      targets: [
+        { src: "./src/assets/*", dest: "./dist/assets" },
+        { src: "./src/styles/*", dest: "./dist/styles" },
+      ],
+    }),
+    terser(),
+    visualizer({
+      filename: "bundle-analysis.html",
+      open: false,
+    }),
+  ],
+  external: ["tslib", /node_modules/],
+};

package/src/affiliate/card/AffiliateCard.stories.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { Meta, Story } from "@storybook/react";
 import { AffiliateCard, AffiliateCardProps } from "./AffiliateCard";
 

package/src/affiliate/card/AffiliateCard.tsx

@@ -1,11 +1,11 @@
-import { useState } from "react";
+import React, { useState } from "react";
 import { ListGroup, OverlayTrigger, Popover } from "react-bootstrap";
 import { useTranslation } from "react-i18next";
 import clsx from "clsx";
 import { useId } from "@react-aria/utils";
 import { HasPermissionProp } from "@licklist/plugins/dist/types/permission/Permission";
-import { FaEllipsisH, FaEye, FaTrashAlt } from "react-icons/fa";
 import { ConfirmModal } from "../../modals";
+import { Icon } from "../../static";
 import { MenuButton } from "../../table/MenuButton";
 
 export interface AffiliateCardProps extends HasPermissionProp {
@@ -57,7 +57,7 @@ export function AffiliateCard({
           )}
           <div className={["d-flex", isHeader ? "invisible" : ""].join(" ")}>
             <div className="affiliate-card-menu-eye-container">
-              <FaEye color="#0E8CE2" size={20} />
+              <Icon type="eye" color="#0E8CE2" width="20" />
             </div>
 
             <OverlayTrigger
@@ -69,7 +69,7 @@ export function AffiliateCard({
                   id={popoverId}
                   className={clsx(
                     "affiliate-card-popover",
-                    !isOverlayVisibile && "d-none",
+                    !isOverlayVisibile && "d-none"
                   )}
                 >
                   <Popover.Content
@@ -89,7 +89,7 @@ export function AffiliateCard({
                                     confirm(onRemove);
                                   }}
                                   name={t("remove")}
-                                  icon={<FaTrashAlt size={12} />}
+                                  icon="trash-alt"
                                   className="affiliate-card-menu-item-text d-flex w-100 align-items-center"
                                   rightIcon
                                 />
@@ -111,7 +111,7 @@ export function AffiliateCard({
                   setIsOverlayVisible(true);
                 }}
               >
-                <FaEllipsisH />
+                <Icon type="ellipsis-h" />
               </button>
             </OverlayTrigger>
           </div>

package/src/affiliate/form/AffiliateControl.tsx

@@ -1,5 +1,5 @@
 import { useId } from "@react-aria/utils";
-import { useCallback } from "react";
+import React, { useCallback } from "react";
 import { Button, Form } from "react-bootstrap";
 import { useFormContext } from "react-hook-form";
 import { useTranslation } from "react-i18next";

package/src/affiliate/form/AffiliateForm.stories.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { Meta, Story } from "@storybook/react";
 import { AffiliateForm, AffiliateFormProps } from "./AffiliateForm";
 

package/src/affiliate/form/AffiliateForm.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useEffect } from "react";
+import React, { useCallback, useEffect } from "react";
 import { Button, Form } from "react-bootstrap";
 import { FormProvider, useForm } from "react-hook-form";
 import { useTranslation } from "react-i18next";
@@ -43,7 +43,7 @@ export const AffiliateForm = ({
       }
     },
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [isShownDialog],
+    [isShownDialog]
   );
 
   const onApproveDialog = useCallback(() => {

package/src/affiliate/types/index.ts

@@ -10,5 +10,5 @@ export interface GenerateLinkResponse {
 }
 
 export type GenerateLinkFunction = (
-  targetLink: string,
+  targetLink: string
 ) => Promise<void | GenerateLinkResponse | null>;