@plusscommunities/pluss-icons 1.0.0-beta.4 → 1.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +63 -7
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -22,14 +22,38 @@ var getIconList = pack => Object.keys(pack).filter(key => key.startsWith("fa") &
|
|
|
22
22
|
library.add(...getIconList(solidIcons), ...getIconList(regularIcons), ...getIconList(lightIcons), ...getIconList(duotoneIcons));
|
|
23
23
|
|
|
24
24
|
/**
|
|
25
|
+
* FontAwesome icon type/style.
|
|
26
|
+
*
|
|
25
27
|
* @typedef {'solid' | 'regular' | 'light' | 'duotone'} IconType
|
|
26
|
-
*
|
|
28
|
+
*
|
|
29
|
+
* @property {string} solid - Filled icons (default) - prefix: `fas`
|
|
30
|
+
* @property {string} regular - Outlined icons - prefix: `far`
|
|
31
|
+
* @property {string} light - Thinner outlined icons - prefix: `fal`
|
|
32
|
+
* @property {string} duotone - Two-color icons - prefix: `fad`
|
|
33
|
+
*
|
|
34
|
+
* @example
|
|
35
|
+
* // Solid (default - filled style)
|
|
36
|
+
* <Icon icon="house" type="solid" />
|
|
37
|
+
*
|
|
38
|
+
* @example
|
|
39
|
+
* // Regular (outline style)
|
|
40
|
+
* <Icon icon="user" type="regular" />
|
|
41
|
+
*
|
|
42
|
+
* @example
|
|
43
|
+
* // Light (thinner outline)
|
|
44
|
+
* <Icon icon="heart" type="light" />
|
|
45
|
+
*
|
|
46
|
+
* @example
|
|
47
|
+
* // Duotone (two-color)
|
|
48
|
+
* <Icon icon="star" type="duotone" />
|
|
27
49
|
*/
|
|
28
50
|
|
|
29
51
|
/**
|
|
52
|
+
* Props for the Icon component.
|
|
53
|
+
*
|
|
30
54
|
* @typedef {Object} IconProps
|
|
31
55
|
* @property {string} icon - The icon name (e.g., "house", "spinner", "user")
|
|
32
|
-
* @property {IconType} [type='solid'] - The icon type: "solid", "regular", "light",
|
|
56
|
+
* @property {IconType} [type='solid'] - The icon type: "solid", "regular", "light", or "duotone"
|
|
33
57
|
* @property {boolean} [pulse] - Whether the icon should pulse (animate)
|
|
34
58
|
* @property {boolean} [fixedWidth] - Whether the icon should have fixed width
|
|
35
59
|
* @property {boolean} [spin] - Whether the icon should spin
|
|
@@ -39,8 +63,6 @@ library.add(...getIconList(solidIcons), ...getIconList(regularIcons), ...getIcon
|
|
|
39
63
|
|
|
40
64
|
/**
|
|
41
65
|
* Type to prefix mapping for FontAwesome
|
|
42
|
-
* Note: Only solid, regular, light, and duotone are currently installed.
|
|
43
|
-
* Add @fortawesome/pro-thin-svg-icons and @fortawesome/free-brands-svg-icons if needed.
|
|
44
66
|
* @type {Object.<string, string>}
|
|
45
67
|
*/
|
|
46
68
|
var TYPE_TO_PREFIX = {
|
|
@@ -48,8 +70,39 @@ var TYPE_TO_PREFIX = {
|
|
|
48
70
|
regular: "far",
|
|
49
71
|
light: "fal",
|
|
50
72
|
duotone: "fad"
|
|
51
|
-
|
|
52
|
-
|
|
73
|
+
};
|
|
74
|
+
|
|
75
|
+
/**
|
|
76
|
+
* Mapping of custom Pluss icon names to FontAwesome icon names
|
|
77
|
+
* @type {Object.<string, string>}
|
|
78
|
+
*/
|
|
79
|
+
var PLUSS_ICON_MAP = {
|
|
80
|
+
// Navigation & UI
|
|
81
|
+
dashboard: "house",
|
|
82
|
+
settings: "gear",
|
|
83
|
+
"triangle-exclamation": "triangle-exclamation",
|
|
84
|
+
"folder-image": "folder-open",
|
|
85
|
+
lock: "lock",
|
|
86
|
+
people: "users",
|
|
87
|
+
bolt: "bolt",
|
|
88
|
+
"pie-chart": "chart-pie",
|
|
89
|
+
stethoscope: "stethoscope",
|
|
90
|
+
// Features
|
|
91
|
+
news: "newspaper",
|
|
92
|
+
event: "calendar-days",
|
|
93
|
+
facility: "building",
|
|
94
|
+
maintenance: "screwdriver-wrench",
|
|
95
|
+
form: "file-lines",
|
|
96
|
+
tool: "screwdriver-wrench",
|
|
97
|
+
signin: "right-to-bracket",
|
|
98
|
+
// Common aliases
|
|
99
|
+
cog: "gear",
|
|
100
|
+
calendar: "calendar-days",
|
|
101
|
+
// Legacy Pluss icon mappings
|
|
102
|
+
audience: "users-rectangle",
|
|
103
|
+
"pencil-o": "pen-to-square",
|
|
104
|
+
"user-card": "address-card",
|
|
105
|
+
attachments: "paperclip"
|
|
53
106
|
};
|
|
54
107
|
|
|
55
108
|
/**
|
|
@@ -95,8 +148,11 @@ function Icon(_ref) {
|
|
|
95
148
|
// Convert type to prefix
|
|
96
149
|
var prefix = TYPE_TO_PREFIX[type] || TYPE_TO_PREFIX.solid;
|
|
97
150
|
|
|
151
|
+
// Map custom Pluss icon names to FontAwesome names
|
|
152
|
+
var mappedIcon = PLUSS_ICON_MAP[icon] || icon;
|
|
153
|
+
|
|
98
154
|
// Build the icon definition for FontAwesome
|
|
99
|
-
var iconDef = [prefix,
|
|
155
|
+
var iconDef = [prefix, mappedIcon];
|
|
100
156
|
return /*#__PURE__*/jsx(FontAwesomeIcon, _objectSpread({
|
|
101
157
|
icon: iconDef,
|
|
102
158
|
pulse: pulse,
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../src/components/Icon.js"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../src/components/Icon.js"],"sourcesContent":["/**\n * @fileoverview Universal icon component for Pluss Communities platform.\n * Uses FontAwesome Pro icons with support for multiple icon styles.\n *\n * @module @plusscommunities/pluss-icons\n * @author Pluss Communities\n * @version 1.0.0-beta.4\n *\n * @requires @fortawesome/react-fontawesome\n * @requires @fortawesome/fontawesome-svg-core\n * @requires @fortawesome/pro-solid-svg-icons\n * @requires @fortawesome/pro-regular-svg-icons\n * @requires @fortawesome/pro-light-svg-icons\n * @requires @fortawesome/pro-duotone-svg-icons\n */\n\nimport React from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { library, config } from \"@fortawesome/fontawesome-svg-core\";\nimport \"@fortawesome/fontawesome-svg-core/styles.css\";\n\n// Disable auto-adding CSS - we import it manually above\nconfig.autoAddCss = false;\n\n// ============================================================================\n// ICON LIBRARY SETUP\n// ============================================================================\n// All icon packs are loaded into the library to support the `type` prop.\n// This increases bundle size but provides flexibility across the platform.\n//\n// TODO: Consider tree-shaking or dynamic imports if bundle size becomes an issue.\n// Alternative: Let consumers import only the packs they need.\n// ============================================================================\nimport * as solidIcons from \"@fortawesome/pro-solid-svg-icons\";\nimport * as regularIcons from \"@fortawesome/pro-regular-svg-icons\";\nimport * as lightIcons from \"@fortawesome/pro-light-svg-icons\";\nimport * as duotoneIcons from \"@fortawesome/pro-duotone-svg-icons\";\n\n// Helper to extract icon definitions from a pack\nconst getIconList = (pack) =>\n\tObject.keys(pack)\n\t\t.filter((key) => key.startsWith(\"fa\") && typeof pack[key] === \"object\")\n\t\t.map((key) => pack[key]);\n\n// Add all icon packs to the library\nlibrary.add(\n\t...getIconList(solidIcons),\n\t...getIconList(regularIcons),\n\t...getIconList(lightIcons),\n\t...getIconList(duotoneIcons),\n);\n\n/**\n * FontAwesome icon type/style.\n *\n * @typedef {'solid' | 'regular' | 'light' | 'duotone'} IconType\n *\n * @property {string} solid - Filled icons (default) - prefix: `fas`\n * @property {string} regular - Outlined icons - prefix: `far`\n * @property {string} light - Thinner outlined icons - prefix: `fal`\n * @property {string} duotone - Two-color icons - prefix: `fad`\n *\n * @example\n * // Solid (default - filled style)\n * <Icon icon=\"house\" type=\"solid\" />\n *\n * @example\n * // Regular (outline style)\n * <Icon icon=\"user\" type=\"regular\" />\n *\n * @example\n * // Light (thinner outline)\n * <Icon icon=\"heart\" type=\"light\" />\n *\n * @example\n * // Duotone (two-color)\n * <Icon icon=\"star\" type=\"duotone\" />\n */\n\n/**\n * Props for the Icon component.\n *\n * @typedef {Object} IconProps\n * @property {string} icon - The icon name (e.g., \"house\", \"spinner\", \"user\")\n * @property {IconType} [type='solid'] - The icon type: \"solid\", \"regular\", \"light\", or \"duotone\"\n * @property {boolean} [pulse] - Whether the icon should pulse (animate)\n * @property {boolean} [fixedWidth] - Whether the icon should have fixed width\n * @property {boolean} [spin] - Whether the icon should spin\n * @property {string} [className] - Additional CSS classes\n * @property {Object} [rest] - Additional props passed to FontAwesomeIcon\n */\n\n/**\n * Type to prefix mapping for FontAwesome\n * @type {Object.<string, string>}\n */\nconst TYPE_TO_PREFIX = {\n\tsolid: \"fas\",\n\tregular: \"far\",\n\tlight: \"fal\",\n\tduotone: \"fad\",\n};\n\n/**\n * Mapping of custom Pluss icon names to FontAwesome icon names\n * @type {Object.<string, string>}\n */\nconst PLUSS_ICON_MAP = {\n\t// Navigation & UI\n\tdashboard: \"house\",\n\tsettings: \"gear\",\n\t\"triangle-exclamation\": \"triangle-exclamation\",\n\t\"folder-image\": \"folder-open\",\n\tlock: \"lock\",\n\tpeople: \"users\",\n\tbolt: \"bolt\",\n\t\"pie-chart\": \"chart-pie\",\n\tstethoscope: \"stethoscope\",\n\n\t// Features\n\tnews: \"newspaper\",\n\tevent: \"calendar-days\",\n\tfacility: \"building\",\n\tmaintenance: \"screwdriver-wrench\",\n\tform: \"file-lines\",\n\ttool: \"screwdriver-wrench\",\n\tsignin: \"right-to-bracket\",\n\n\t// Common aliases\n\tcog: \"gear\",\n\tcalendar: \"calendar-days\",\n\n\t// Legacy Pluss icon mappings\n\taudience: \"users-rectangle\",\n\t\"pencil-o\": \"pen-to-square\",\n\t\"user-card\": \"address-card\",\n\tattachments: \"paperclip\",\n};\n\n/**\n * Universal icon component for the Pluss Communities platform.\n * Uses FontAwesome Pro icons.\n *\n * @param {IconProps} props - The properties passed to the Icon component\n * @returns {JSX.Element} The rendered icon\n *\n * @example\n * // Basic usage with solid icon (default)\n * <Icon icon=\"house\" />\n *\n * @example\n * // Different icon types\n * <Icon icon=\"user\" type=\"regular\" />\n * <Icon icon=\"facebook\" type=\"brands\" />\n *\n * @example\n * // With animations\n * <Icon icon=\"spinner\" spin />\n * <Icon icon=\"heart\" pulse />\n *\n * @example\n * // With custom styling\n * <Icon icon=\"star\" style={{ color: 'gold' }} className=\"large-icon\" />\n */\nfunction Icon({\n\ticon,\n\ttype = \"solid\",\n\tpulse,\n\tfixedWidth,\n\tspin,\n\tclassName,\n\t...rest\n}) {\n\t// Return null if icon is undefined or null\n\tif (!icon) {\n\t\treturn null;\n\t}\n\n\t// Convert type to prefix\n\tconst prefix = TYPE_TO_PREFIX[type] || TYPE_TO_PREFIX.solid;\n\n\t// Map custom Pluss icon names to FontAwesome names\n\tconst mappedIcon = PLUSS_ICON_MAP[icon] || icon;\n\n\t// Build the icon definition for FontAwesome\n\tconst iconDef = [prefix, mappedIcon];\n\n\treturn (\n\t\t<FontAwesomeIcon\n\t\t\ticon={iconDef}\n\t\t\tpulse={pulse}\n\t\t\tfixedWidth={fixedWidth}\n\t\t\tspin={spin}\n\t\t\tclassName={className}\n\t\t\t{...rest}\n\t\t/>\n\t);\n}\n\nexport { Icon };\n"],"names":["config","autoAddCss","getIconList","pack","Object","keys","filter","key","startsWith","map","library","add","solidIcons","regularIcons","lightIcons","duotoneIcons","TYPE_TO_PREFIX","solid","regular","light","duotone","PLUSS_ICON_MAP","dashboard","settings","lock","people","bolt","stethoscope","news","event","facility","maintenance","form","tool","signin","cog","calendar","audience","attachments","Icon","_ref","icon","type","pulse","fixedWidth","spin","className","rest","_objectWithoutProperties","_excluded","prefix","mappedIcon","iconDef","_jsx","FontAwesomeIcon","_objectSpread"],"mappings":"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"}
|