@licklist/design 0.66.8-dev.2 → 0.66.9-dev.1

package/dist/table/MenuButton.js

@@ -1,8 +1,13 @@
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import clsx from 'clsx';
+import Icon from '../static/Icon.js';
 
 var MenuButton = function(param) {
-    var onClick = param.onClick, name = param.name, className = param.className, icon = param.icon, leftIcon = param.leftIcon, rightIcon = param.rightIcon;
+    var onClick = param.onClick, name = param.name, className = param.className, icon = param.icon, leftIcon = param.leftIcon, rightIcon = param.rightIcon, _param_iconWidth = param.iconWidth, iconWidth = _param_iconWidth === void 0 ? "12" : _param_iconWidth;
+    var iconComponent = icon ? /*#__PURE__*/ jsx(Icon, {
+        type: icon,
+        width: iconWidth
+    }) : null;
     return /*#__PURE__*/ jsx(Fragment, {
         children: /*#__PURE__*/ jsxs("button", {
             type: "button",
@@ -12,12 +17,12 @@ var MenuButton = function(param) {
             },
             className: clsx(className),
             children: [
-                leftIcon && icon,
+                leftIcon && iconComponent,
                 /*#__PURE__*/ jsx("span", {
                     className: clsx(icon && leftIcon && "ml-3", icon && rightIcon && "mr-3"),
                     children: name
                 }),
-                rightIcon && icon
+                rightIcon && iconComponent
             ]
         })
     });

package/dist/table/PaginationHelperComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PaginationHelperComponent.d.ts","sourceRoot":"","sources":["../../src/table/PaginationHelperComponent.tsx"],"names":[],"mappings":"AAIA,OAAO,qBAAqB,MAAM,mEAAmE,CAAC;AAKtG,MAAM,WAAW,8BAA8B;IAC7C,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,SAAS,CAAC,EAAE,qBAAqB,CAAC,GAAG,CAAC,CAAC;IACvC,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAED;;;;GAIG;AACH,iBAAS,yBAAyB,CAAC,EACjC,SAAS,EACT,cAAc,EACd,qBAA4B,GAC7B,EAAE,8BAA8B,2CAoFhC;AAED,OAAO,EAAE,yBAAyB,EAAE,CAAC"}
+{"version":3,"file":"PaginationHelperComponent.d.ts","sourceRoot":"","sources":["../../src/table/PaginationHelperComponent.tsx"],"names":[],"mappings":"AAIA,OAAO,qBAAqB,MAAM,mEAAmE,CAAC;AAMtG,MAAM,WAAW,8BAA8B;IAC7C,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,SAAS,CAAC,EAAE,qBAAqB,CAAC,GAAG,CAAC,CAAC;IACvC,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAED;;;;GAIG;AACH,iBAAS,yBAAyB,CAAC,EACjC,SAAS,EACT,cAAc,EACd,qBAA4B,GAC7B,EAAE,8BAA8B,2CAoFhC;AAED,OAAO,EAAE,yBAAyB,EAAE,CAAC"}

package/dist/table/PaginationHelperComponent.js

@@ -5,7 +5,8 @@ import PageItem, { Ellipsis } from 'react-bootstrap/PageItem';
 import { useTranslation } from 'react-i18next';
 import PaginationService from '@licklist/plugins/dist/services/Table/PaginationService';
 import clsx from 'clsx';
-import { FaArrowLeft, FaArrowRight } from 'react-icons/fa';
+import '../static/index.js';
+import Icon from '../static/Icon.js';
 
 /**
  * PaginationHelperComponent
@@ -61,8 +62,9 @@ import { FaArrowLeft, FaArrowRight } from 'react-icons/fa';
                     onClick: function() {
                         return onPageChange(paginationService.getPrevPage());
                     },
-                    children: /*#__PURE__*/ jsx(FaArrowLeft, {
-                        size: 14,
+                    children: /*#__PURE__*/ jsx(Icon, {
+                        type: "arrow-left",
+                        width: "0.9rem",
                         color: "black"
                     })
                 }),
@@ -89,8 +91,9 @@ import { FaArrowLeft, FaArrowRight } from 'react-icons/fa';
                     onClick: function() {
                         return onPageChange(paginationService.getNextPage());
                     },
-                    children: /*#__PURE__*/ jsx(FaArrowRight, {
-                        size: 14,
+                    children: /*#__PURE__*/ jsx(Icon, {
+                        type: "arrow-right",
+                        width: "0.9rem",
                         color: "black"
                     })
                 })

package/dist/tiptap-editor/TipTapMenu/TipTapMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TipTapMenu.d.ts","sourceRoot":"","sources":["../../../src/tiptap-editor/TipTapMenu/TipTapMenu.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAwBvC,UAAU,cAAc;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,wBAAgB,UAAU,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,cAAc,2CAuHzE"}
+{"version":3,"file":"TipTapMenu.d.ts","sourceRoot":"","sources":["../../../src/tiptap-editor/TipTapMenu/TipTapMenu.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAgBvC,UAAU,cAAc;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,wBAAgB,UAAU,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,cAAc,2CAuHzE"}

package/dist/tiptap-editor/TipTapMenu/TipTapMenu.js

@@ -2,7 +2,6 @@ import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { sample } from 'lodash';
 import { Row } from 'react-bootstrap';
 import clsx from 'clsx';
-import { FaSmile, FaList, FaListOl, FaTasks, FaUndoAlt, FaRedoAlt } from 'react-icons/fa';
 import { ReactComponent as SvgBold } from '../../assets/editor/bold.svg.js';
 import { ReactComponent as SvgItalic } from '../../assets/editor/italic.svg.js';
 import { ReactComponent as SvgStrikethrough } from '../../assets/editor/strikethrough.svg.js';
@@ -28,7 +27,7 @@ function TipTapMenu(param) {
                     return editor.chain().focus().toggleBold().run();
                 },
                 type: "Bold",
-                icon: /*#__PURE__*/ jsx(SvgBold, {}),
+                customIcon: /*#__PURE__*/ jsx(SvgBold, {}),
                 isActive: editor.isActive("bold")
             }),
             /*#__PURE__*/ jsx(TipTapMenuItem, {
@@ -36,7 +35,7 @@ function TipTapMenu(param) {
                     return editor.chain().focus().toggleItalic().run();
                 },
                 type: "Italic",
-                icon: /*#__PURE__*/ jsx(SvgItalic, {}),
+                customIcon: /*#__PURE__*/ jsx(SvgItalic, {}),
                 isActive: editor.isActive("italic")
             }),
             /*#__PURE__*/ jsx(TipTapMenuItem, {
@@ -44,7 +43,7 @@ function TipTapMenu(param) {
                     return editor.chain().focus().toggleStrike().run();
                 },
                 type: "Strike",
-                icon: /*#__PURE__*/ jsx(SvgStrikethrough, {}),
+                customIcon: /*#__PURE__*/ jsx(SvgStrikethrough, {}),
                 isActive: editor.isActive("strike")
             }),
             withEmoji && /*#__PURE__*/ jsxs(Fragment, {
@@ -64,7 +63,7 @@ function TipTapMenu(param) {
                             ])).run();
                         },
                         type: "Emoji",
-                        icon: /*#__PURE__*/ jsx(FaSmile, {})
+                        iconName: "smile"
                     })
                 ]
             }),
@@ -78,7 +77,7 @@ function TipTapMenu(param) {
                     }).run();
                 },
                 type: "Heading 1",
-                icon: /*#__PURE__*/ jsx(SvgH1, {}),
+                customIcon: /*#__PURE__*/ jsx(SvgH1, {}),
                 isActive: editor.isActive("heading", {
                     level: 1
                 })
@@ -90,7 +89,7 @@ function TipTapMenu(param) {
                     }).run();
                 },
                 type: "Heading 2",
-                icon: /*#__PURE__*/ jsx(SvgH2, {}),
+                customIcon: /*#__PURE__*/ jsx(SvgH2, {}),
                 isActive: editor.isActive("heading", {
                     level: 2
                 })
@@ -100,7 +99,7 @@ function TipTapMenu(param) {
                     return editor.chain().focus().setParagraph().run();
                 },
                 type: "Paragraph",
-                icon: /*#__PURE__*/ jsx(SvgParagraph, {}),
+                customIcon: /*#__PURE__*/ jsx(SvgParagraph, {}),
                 isActive: editor.isActive("paragraph")
             }),
             /*#__PURE__*/ jsx(TipTapMenuItem, {
@@ -108,7 +107,7 @@ function TipTapMenu(param) {
                     return editor.chain().focus().toggleOrderedList().run();
                 },
                 type: "Bullet list",
-                icon: /*#__PURE__*/ jsx(FaList, {}),
+                iconName: "list",
                 isActive: editor.isActive("bulletList")
             }),
             /*#__PURE__*/ jsx(TipTapMenuItem, {
@@ -116,7 +115,7 @@ function TipTapMenu(param) {
                     return editor.chain().focus().toggleBulletList().run();
                 },
                 type: "Ordered list",
-                icon: /*#__PURE__*/ jsx(FaListOl, {}),
+                iconName: "list-ol",
                 isActive: editor.isActive("orderedList")
             }),
             /*#__PURE__*/ jsx(TipTapMenuItem, {
@@ -124,7 +123,7 @@ function TipTapMenu(param) {
                     return editor.commands.toggleTaskList();
                 },
                 type: "Task list",
-                icon: /*#__PURE__*/ jsx(FaTasks, {}),
+                iconName: "tasks",
                 isActive: editor.isActive("taskList")
             }),
             /*#__PURE__*/ jsx("div", {
@@ -135,7 +134,7 @@ function TipTapMenu(param) {
                     return editor.chain().focus().toggleBlockquote().run();
                 },
                 type: "Blockquote",
-                icon: /*#__PURE__*/ jsx(SvgDoubleQuotesL, {}),
+                customIcon: /*#__PURE__*/ jsx(SvgDoubleQuotesL, {}),
                 isActive: editor.isActive("blockquote")
             }),
             /*#__PURE__*/ jsx(TipTapMenuItem, {
@@ -143,7 +142,7 @@ function TipTapMenu(param) {
                     return editor.chain().focus().setHorizontalRule().run();
                 },
                 type: "Horizontal Rule",
-                icon: /*#__PURE__*/ jsx(SvgSeparator, {})
+                customIcon: /*#__PURE__*/ jsx(SvgSeparator, {})
             }),
             /*#__PURE__*/ jsx("div", {
                 className: "divider"
@@ -153,14 +152,14 @@ function TipTapMenu(param) {
                     return editor.chain().focus().setHardBreak().run();
                 },
                 type: "Hard Break",
-                icon: /*#__PURE__*/ jsx(SvgTextWrap, {})
+                customIcon: /*#__PURE__*/ jsx(SvgTextWrap, {})
             }),
             /*#__PURE__*/ jsx(TipTapMenuItem, {
                 onClick: function() {
                     return editor.chain().focus().unsetAllMarks().clearNodes().run();
                 },
                 type: "Clear Format",
-                icon: /*#__PURE__*/ jsx(SvgFormatClear, {})
+                customIcon: /*#__PURE__*/ jsx(SvgFormatClear, {})
             }),
             /*#__PURE__*/ jsx("div", {
                 className: "divider"
@@ -170,14 +169,14 @@ function TipTapMenu(param) {
                     return editor.chain().focus().undo().run();
                 },
                 type: "Undo",
-                icon: /*#__PURE__*/ jsx(FaUndoAlt, {})
+                iconName: "undo-alt"
             }),
             /*#__PURE__*/ jsx(TipTapMenuItem, {
                 onClick: function() {
                     return editor.chain().focus().redo().run();
                 },
                 type: "Redo",
-                icon: /*#__PURE__*/ jsx(FaRedoAlt, {})
+                iconName: "redo-alt"
             })
         ]
     });

package/dist/tiptap-editor/TipTapMenu/components/TipTapMenuItem.d.ts

@@ -1,10 +1,10 @@
-import { ReactElement } from "react";
 interface TipTapMenuItemProps {
     onClick: () => void;
     type: string;
-    icon?: ReactElement;
+    iconName?: string;
+    customIcon?: React.ReactElement;
     isActive?: boolean;
 }
-export declare const TipTapMenuItem: ({ onClick, type, icon, isActive, }: TipTapMenuItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TipTapMenuItem: ({ onClick, type, iconName, customIcon, isActive, }: TipTapMenuItemProps) => import("react/jsx-runtime").JSX.Element;
 export default TipTapMenuItem;
 //# sourceMappingURL=TipTapMenuItem.d.ts.map

package/dist/tiptap-editor/TipTapMenu/components/TipTapMenuItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TipTapMenuItem.d.ts","sourceRoot":"","sources":["../../../../src/tiptap-editor/TipTapMenu/components/TipTapMenuItem.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAErC,UAAU,mBAAmB;IAC3B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,cAAc,uCAKxB,mBAAmB,4CAoBrB,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"TipTapMenuItem.d.ts","sourceRoot":"","sources":["../../../../src/tiptap-editor/TipTapMenu/components/TipTapMenuItem.tsx"],"names":[],"mappings":"AAMA,UAAU,mBAAmB;IAC3B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,cAAc,uDAMxB,mBAAmB,4CAoBrB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/tiptap-editor/TipTapMenu/components/TipTapMenuItem.js

@@ -2,9 +2,11 @@ import { jsx } from 'react/jsx-runtime';
 import { OverlayTrigger, Tooltip } from 'react-bootstrap';
 import { useId } from '@react-aria/utils';
 import clsx from 'clsx';
+import '../../../static/index.js';
+import Icon from '../../../static/Icon.js';
 
 var TipTapMenuItem = function(param) {
-    var onClick = param.onClick, type = param.type, icon = param.icon, isActive = param.isActive;
+    var onClick = param.onClick, type = param.type, iconName = param.iconName, customIcon = param.customIcon, isActive = param.isActive;
     var toltipId = useId();
     return /*#__PURE__*/ jsx(OverlayTrigger, {
         placement: "top",
@@ -22,7 +24,11 @@ var TipTapMenuItem = function(param) {
             className: clsx("icon-btn", isActive && "icon-btn-active"),
             onClick: onClick,
             onKeyPress: function() {},
-            children: icon
+            children: customIcon || /*#__PURE__*/ jsx(Icon, {
+                type: iconName,
+                height: "1rem",
+                color: "black"
+            })
         })
     });
 };

package/dist/venue-map-sets/card/VenueMapSetCard.js

@@ -5,9 +5,10 @@ import { useId } from '@react-aria/utils';
 import { useTranslation } from 'react-i18next';
 import clsx from 'clsx';
 import RouteService from '@licklist/plugins/dist/services/Route/RouteService';
-import { FaEye, FaTrashAlt, FaEllipsisH } from 'react-icons/fa';
 import { MenuButton } from '../../table/MenuButton.js';
 import { ConfirmModal } from '../../modals/confirmation/ConfirmModal.js';
+import '../../static/index.js';
+import Icon from '../../static/Icon.js';
 
 function _array_like_to_array(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
@@ -82,9 +83,10 @@ function VenueMapSetCard(param) {
                     children: [
                         /*#__PURE__*/ jsx("div", {
                             className: "venue-map-set-card-menu-eye-container",
-                            children: /*#__PURE__*/ jsx(FaEye, {
+                            children: /*#__PURE__*/ jsx(Icon, {
+                                type: "eye",
                                 color: "#0E8CE2",
-                                size: 20
+                                width: "20"
                             })
                         }),
                         /*#__PURE__*/ jsx(OverlayTrigger, {
@@ -111,9 +113,7 @@ function VenueMapSetCard(param) {
                                                             confirm(onRemove);
                                                         },
                                                         name: t("remove"),
-                                                        icon: /*#__PURE__*/ jsx(FaTrashAlt, {
-                                                            size: 12
-                                                        }),
+                                                        icon: "trash-alt",
                                                         className: "venue-map-set-card-menu-item-text d-flex w-100 align-items-center",
                                                         rightIcon: true
                                                     });
@@ -130,7 +130,9 @@ function VenueMapSetCard(param) {
                                     e.stopPropagation();
                                     setIsOverlayVisible(true);
                                 },
-                                children: /*#__PURE__*/ jsx(FaEllipsisH, {})
+                                children: /*#__PURE__*/ jsx(Icon, {
+                                    type: "ellipsis-h"
+                                })
                             })
                         })
                     ]

package/dist/venue-map-sets/form/components/VenueMapControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VenueMapControl.d.ts","sourceRoot":"","sources":["../../../../src/venue-map-sets/form/components/VenueMapControl.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIlC,KAAK,gBAAgB,GAAG;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB,CAAC;AAEF,KAAK,4BAA4B,GAAG,gBAAgB,GAAG;IACrD,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB,CAAC;AAEF,KAAK,+BAA+B,GAAG,gBAAgB,GAAG;IACxD,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,WAAW,CAAC,EAAE,KAAK,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAC5B,4BAA4B,GAC5B,+BAA+B,CAAC;AAEpC,eAAO,MAAM,eAAe,4EAQzB,oBAAoB,4CAoCtB,CAAC"}
+{"version":3,"file":"VenueMapControl.d.ts","sourceRoot":"","sources":["../../../../src/venue-map-sets/form/components/VenueMapControl.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIlC,KAAK,gBAAgB,GAAG;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB,CAAC;AAEF,KAAK,4BAA4B,GAAG,gBAAgB,GAAG;IACrD,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB,CAAC;AAEF,KAAK,+BAA+B,GAAG,gBAAgB,GAAG;IACxD,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,WAAW,CAAC,EAAE,KAAK,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAC5B,4BAA4B,GAC5B,+BAA+B,CAAC;AAEpC,eAAO,MAAM,eAAe,4EAQzB,oBAAoB,4CAyCtB,CAAC"}

package/dist/venue-map-sets/form/components/VenueMapControl.js

@@ -1,6 +1,6 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
-import { FaPlus, FaEllipsisH } from 'react-icons/fa';
+import Icon from '../../../static/Icon.js';
 
 var VenueMapControl = function(param) {
     var onClick = param.onClick, disabled = param.disabled, showMenu = param.showMenu, title = param.title, onMenuClick = param.onMenuClick, isInvalid = param.isInvalid, errors = param.errors;
@@ -15,8 +15,10 @@ var VenueMapControl = function(param) {
                     /*#__PURE__*/ jsxs("div", {
                         className: "overflow-hidden name-wrapper w-100",
                         children: [
-                            !showMenu && /*#__PURE__*/ jsx(FaPlus, {
-                                size: 20,
+                            !showMenu && /*#__PURE__*/ jsx(Icon, {
+                                type: "plus",
+                                height: "1.25rem",
+                                width: "1.25rem",
                                 className: "rounded venue-map-zone-item-icon"
                             }),
                             /*#__PURE__*/ jsx("span", {
@@ -36,9 +38,10 @@ var VenueMapControl = function(param) {
                         onKeyDown: function(e) {
                             return e.stopPropagation();
                         },
-                        children: /*#__PURE__*/ jsx(FaEllipsisH, {
+                        children: /*#__PURE__*/ jsx(Icon, {
+                            type: "ellipsis-h",
                             color: "#0E8CE2",
-                            size: 16
+                            height: "1rem"
                         })
                     })
                 ]

package/dist/venue-map-sets/form/components/VenueMapModal.js

@@ -4,8 +4,8 @@ import { useTranslation } from 'react-i18next';
 import clsx from 'clsx';
 import { useFormContext } from 'react-hook-form';
 import HookFormService from '@licklist/plugins/dist/services/Form/HookFormService';
-import { FaTrashAlt } from 'react-icons/fa';
 import { ConfirmModal } from '../../../modals/confirmation/ConfirmModal.js';
+import Icon from '../../../static/Icon.js';
 import { VenueMapImageControl } from './VenueMapImageControl.js';
 import { getVenueMapsRequiredKeys } from '../utils/index.js';
 
@@ -332,8 +332,9 @@ var VenueMapModal = function(param) {
                                             variant: "outline-danger",
                                             className: "d-flex align-items-center",
                                             children: [
-                                                /*#__PURE__*/ jsx(FaTrashAlt, {
-                                                    size: 16
+                                                /*#__PURE__*/ jsx(Icon, {
+                                                    type: "trash",
+                                                    height: "1rem"
                                                 }),
                                                 "\xa0",
                                                 /*#__PURE__*/ jsx("span", {

package/dist/zone/card/ZoneCard.js

@@ -5,9 +5,10 @@ import { useTranslation } from 'react-i18next';
 import clsx from 'clsx';
 import { useId } from '@react-aria/utils';
 import RouteService from '@licklist/plugins/dist/services/Route/RouteService';
-import { FaEye, FaTrashAlt, FaEllipsisH } from 'react-icons/fa';
 import { ConfirmModal } from '../../modals/confirmation/ConfirmModal.js';
+import '../../static/index.js';
 import { MenuButton } from '../../table/MenuButton.js';
+import Icon from '../../static/Icon.js';
 
 function _array_like_to_array(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
@@ -83,9 +84,10 @@ function ZoneCard(param) {
                     children: [
                         /*#__PURE__*/ jsx("div", {
                             className: "zone-card-menu-eye-container",
-                            children: /*#__PURE__*/ jsx(FaEye, {
+                            children: /*#__PURE__*/ jsx(Icon, {
+                                type: "eye",
                                 color: "#0E8CE2",
-                                size: 20
+                                width: "20"
                             })
                         }),
                         /*#__PURE__*/ jsx(OverlayTrigger, {
@@ -112,9 +114,7 @@ function ZoneCard(param) {
                                                             confirm(onRemove);
                                                         },
                                                         name: t("remove"),
-                                                        icon: /*#__PURE__*/ jsx(FaTrashAlt, {
-                                                            size: 12
-                                                        }),
+                                                        icon: "trash-alt",
                                                         className: "zone-card-menu-item-text d-flex w-100 align-items-center",
                                                         rightIcon: true
                                                     });
@@ -131,7 +131,9 @@ function ZoneCard(param) {
                                     e.stopPropagation();
                                     setIsOverlayVisible(true);
                                 },
-                                children: /*#__PURE__*/ jsx(FaEllipsisH, {})
+                                children: /*#__PURE__*/ jsx(Icon, {
+                                    type: "ellipsis-h"
+                                })
                             })
                         })
                     ]

package/dist/zone/form/components/ZoneRecurrenceControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ZoneRecurrenceControl.d.ts","sourceRoot":"","sources":["../../../../src/zone/form/components/ZoneRecurrenceControl.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,EAAE,MAAM,kEAAkE,CAAC;AAMlG,MAAM,WAAW,0BAA0B;IACzC,cAAc,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAA;KAAE,GAAG,OAAO,CAAC,cAAc,CAAC,CAAC;IAC3D,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;CACpD;AAED,eAAO,MAAM,qBAAqB,gCAG/B,0BAA0B,4CA0D5B,CAAC"}
+{"version":3,"file":"ZoneRecurrenceControl.d.ts","sourceRoot":"","sources":["../../../../src/zone/form/components/ZoneRecurrenceControl.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,EAAE,MAAM,kEAAkE,CAAC;AAMlG,MAAM,WAAW,0BAA0B;IACzC,cAAc,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAA;KAAE,GAAG,OAAO,CAAC,cAAc,CAAC,CAAC;IAC3D,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;CACpD;AAED,eAAO,MAAM,qBAAqB,gCAG/B,0BAA0B,4CAkE5B,CAAC"}

package/dist/zone/form/components/ZoneRecurrenceControl.js

@@ -4,7 +4,8 @@ import { useIntl } from 'react-intl';
 import RRule from 'rrule';
 import { useSortable } from '@dnd-kit/sortable';
 import { CSS } from '@dnd-kit/utilities';
-import { FaCalendar, FaEllipsisH } from 'react-icons/fa';
+import '../../../static/index.js';
+import Icon from '../../../static/Icon.js';
 
 function _define_property(obj, key, value) {
     if (key in obj) {
@@ -85,8 +86,9 @@ var ZoneRecurrenceControl = function(param) {
                 /*#__PURE__*/ jsxs("span", {
                     className: "d-flex flex-row align-items-center",
                     children: [
-                        /*#__PURE__*/ jsx(FaCalendar, {
-                            size: 16,
+                        /*#__PURE__*/ jsx(Icon, {
+                            type: "calendar",
+                            height: "1rem",
                             className: "zone-recurrence-icon-calendar"
                         }),
                         /*#__PURE__*/ jsxs("span", {
@@ -115,8 +117,9 @@ var ZoneRecurrenceControl = function(param) {
                             onKeyDown: function() {
                                 return onEdit(zoneRecurrence);
                             },
-                            children: /*#__PURE__*/ jsx(FaEllipsisH, {
-                                size: 16,
+                            children: /*#__PURE__*/ jsx(Icon, {
+                                type: "ellipsis-h",
+                                height: "1rem",
                                 className: "zone-recurrence-icon-more"
                             })
                         })

package/dist/zone/form/components/ZoneRecurrencesControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ZoneRecurrencesControl.d.ts","sourceRoot":"","sources":["../../../../src/zone/form/components/ZoneRecurrencesControl.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,cAAc,EAAE,MAAM,kEAAkE,CAAC;AAMlG,OAAO,EAAE,QAAQ,EAAE,MAAM,4DAA4D,CAAC;AAWtF,MAAM,WAAW,4BAA4B;IAC3C,eAAe,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,EAAE,CAAC;CAC7C;AAED,KAAK,0BAA0B,GAAG;IAChC,SAAS,EAAE,QAAQ,EAAE,GAAG,SAAS,CAAC;CACnC,CAAC;AAEF,eAAO,MAAM,sBAAsB,mBAEhC,0BAA0B,4CAmM5B,CAAC"}
+{"version":3,"file":"ZoneRecurrencesControl.d.ts","sourceRoot":"","sources":["../../../../src/zone/form/components/ZoneRecurrencesControl.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,cAAc,EAAE,MAAM,kEAAkE,CAAC;AAMlG,OAAO,EAAE,QAAQ,EAAE,MAAM,4DAA4D,CAAC;AAWtF,MAAM,WAAW,4BAA4B;IAC3C,eAAe,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,EAAE,CAAC;CAC7C;AAED,KAAK,0BAA0B,GAAG;IAChC,SAAS,EAAE,QAAQ,EAAE,GAAG,SAAS,CAAC;CACnC,CAAC;AAEF,eAAO,MAAM,sBAAsB,mBAEhC,0BAA0B,4CAuM5B,CAAC"}

package/dist/zone/form/components/ZoneRecurrencesControl.js

@@ -7,11 +7,12 @@ import { useTranslation } from 'react-i18next';
 import { useClickAway } from 'react-use';
 import { SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable';
 import { DndContext } from '@dnd-kit/core';
-import { FaPlusCircle } from 'react-icons/fa';
 import { CONFIRM_MODAL_ACTIONS } from '../../../modals/confirmation/ConfirmModal.js';
+import '../../../static/index.js';
 import { RecurringDatePickerInput } from '../../../recurring-date-picker-input/RecurringDatePickerInput.js';
 import { ZoneRecurrenceControl } from './ZoneRecurrenceControl.js';
 import { sameWidthPopperModifier } from '../../../product-set/control/DateAndRecurrenceInput.js';
+import Icon from '../../../static/Icon.js';
 
 function _array_like_to_array(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
@@ -388,8 +389,9 @@ var ZoneRecurrencesControl = function(param) {
                             onClick: handleOnAdd,
                             onKeyDown: handleOnAdd,
                             children: [
-                                /*#__PURE__*/ jsx(FaPlusCircle, {
-                                    size: 16,
+                                /*#__PURE__*/ jsx(Icon, {
+                                    type: "plus-circle",
+                                    height: "1rem",
                                     className: "zone-recurrence-icon-add mr-2"
                                 }),
                                 t("addDates")

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@licklist/design",
-  "version": "0.66.8-dev.2",
+  "version": "0.66.9-dev.1",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@bitbucket.org/artelogicsoft/licklist_design.git"
@@ -43,7 +43,7 @@
   },
   "peerDependencies": {
     "@licklist/core": "0.28.3-dev.5",
-    "@licklist/eslint-config": "0.5.5",
+    "@licklist/eslint-config": "0.5.4",
     "@licklist/plugins": "0.30.4-dev.3",
     "lodash": "4.17.21",
     "luxon": "1.26.0",
@@ -60,9 +60,11 @@
     "@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",
+    "@fortawesome/react-fontawesome": "0.1.9",
     "@licklist/core": "0.28.3-dev.5",
-    "@licklist/eslint-config": "0.5.5",
+    "@licklist/eslint-config": "0.5.4",
     "@licklist/plugins": "0.30.4-dev.3",
     "@mdx-js/react": "1.6.22",
     "@popperjs/core": "2.11.8",
@@ -111,7 +113,6 @@
     "react-highlighter": "0.4.3",
     "react-hook-form": "7.52.2",
     "react-i18next": "11.8.8",
-    "react-icons": "5.3.0",
     "react-intl": "6.6.8",
     "react-konva": "17.0.2-6",
     "react-loader": "2.4.7",

package/src/affiliate/card/AffiliateCard.tsx

@@ -4,8 +4,8 @@ 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
@@ -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/auth/AccessDenied/AccessDenied.tsx

@@ -2,7 +2,7 @@ import { Button } from "react-bootstrap";
 import { useTranslation } from "react-i18next";
 import RouteService from "@licklist/plugins/dist/services/Route/RouteService";
 import useUser from "@licklist/plugins/dist/context/user/hooks/useUser";
-import { FaLock } from "react-icons/fa";
+import { Icon } from "../../static";
 
 export const AccessDenied = () => {
   const { t } = useTranslation("App");
@@ -21,7 +21,7 @@ export const AccessDenied = () => {
     <div className="d-flex align-items-center justify-content-center flex-column text-center access-denied h-100">
       <div className="col-8">
         <div className="icon-wrapper mb-5">
-          <FaLock size={80} />
+          <Icon type="lock" width="5rem" height="5rem" />
         </div>
         <h3 className="mb-3">{t("accessDenied")}</h3>
         <h6 className="mb-3">{t("youDontHavePermissions")}</h6>

package/src/auth/Social/SocialFormComponent.tsx

@@ -74,6 +74,7 @@ function SocialFormComponent(props: SocialFormComponentProps) {
           <SocialButton
             className={["btn-social-lg", "pl-5", "pr-1"].join(" ")}
             type="facebook"
+            icon="facebook-f"
             onClick={handleFacebookClick}
             disabled={isLoading}
           >

package/src/collapsible-input-group/CollapsibleInputGroup.tsx

@@ -7,7 +7,7 @@ import {
   Form,
 } from "react-bootstrap";
 import clsx from "clsx";
-import { FaChevronUp, FaChevronDown } from "react-icons/fa";
+import Icon from "../static/Icon";
 
 export type CollapsibleInputGroupProps = {
   label: ReactNode;
@@ -27,7 +27,8 @@ export function CollapsibleInputGroup({
   error,
 }: CollapsibleInputGroupProps) {
   const currentEventKey = useContext(AccordionContext);
-
+  const accordionIcon =
+    currentEventKey === eventKey ? "chevron-up" : "chevron-down";
   const isInvalid = Boolean(error);
 
   return (
@@ -41,11 +42,7 @@ export function CollapsibleInputGroup({
       >
         <div className="accordion-form-control-header">
           <h5 className="mb-0 pl-3">{label}</h5>
-          {currentEventKey === eventKey ? (
-            <FaChevronUp size={20} />
-          ) : (
-            <FaChevronDown size={20} />
-          )}
+          <Icon type={accordionIcon} height="1.25rem" />
         </div>
         <Collapse in={currentEventKey !== eventKey}>
           <div className="pl-3">{description}</div>