@abcagency/hc-ui-components 1.3.79 → 1.3.80

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.
Files changed (19) hide show
  1. package/dist/components/modules/list/field-mapper-desktop.js +36 -0
  2. package/dist/components/modules/list/field-mapper-desktop.js.map +1 -0
  3. package/dist/components/modules/list/field-mapper-mobile.js +90 -0
  4. package/dist/components/modules/list/field-mapper-mobile.js.map +1 -0
  5. package/dist/components/modules/list/list-item/list-item-desktop.js +50 -0
  6. package/dist/components/modules/list/list-item/list-item-desktop.js.map +1 -0
  7. package/dist/components/modules/list/list-item/list-item-mobile.js +51 -0
  8. package/dist/components/modules/list/list-item/list-item-mobile.js.map +1 -0
  9. package/dist/components/modules/list/list-item/list-item.js +14 -3
  10. package/dist/components/modules/list/list-item/list-item.js.map +1 -1
  11. package/dist/types/components/modules/list/field-mapper-desktop.d.ts +7 -0
  12. package/dist/types/components/modules/list/field-mapper-mobile.d.ts +10 -0
  13. package/dist/types/components/modules/list/list-item/list-item-desktop.d.ts +12 -0
  14. package/dist/types/components/modules/list/list-item/list-item-mobile.d.ts +15 -0
  15. package/package.json +1 -1
  16. package/src/components/modules/list/field-mapper-desktop.jsx +46 -0
  17. package/src/components/modules/list/field-mapper-mobile.jsx +105 -0
  18. package/src/components/modules/list/list-item/{list-item.js → list-item.jsx} +15 -3
  19. package/src/components/modules/list/field-mapper.js +0 -130
package/dist/components/modules/list/field-mapper-desktop.js ADDED
@@ -0,0 +1,36 @@
1
+ import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
2
+ import React__default from 'react';
3
+ import Grid from '../grid.js';
4
+ import { PillWrapper } from '../buttons/pill-wrapper.js';
5
+ import { capitalize } from '../../../util/stringUtils.js';
6
+
7
+ var FieldMapperDesktop = function FieldMapperDesktop(_ref) {
8
+ var item = _ref.item,
9
+ fieldsShown = _ref.fieldsShown,
10
+ specialFeatures = _ref.specialFeatures;
11
+ var orderedFields = fieldsShown.filter(function (field) {
12
+ return field in item.fields;
13
+ });
14
+ var specialFeaturePills = function specialFeaturePills(field) {
15
+ return field === 'position' && specialFeatures && Object.entries(specialFeatures).map(function (_ref2) {
16
+ var _ref3 = _slicedToArray(_ref2, 2),
17
+ featureKey = _ref3[0],
18
+ featureLabel = _ref3[1];
19
+ return item.fields[featureKey] == 1 && /*#__PURE__*/React__default.createElement(PillWrapper, {
20
+ key: featureKey
21
+ }, featureLabel);
22
+ });
23
+ };
24
+ return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, orderedFields.map(function (field, index) {
25
+ var value = item.fields[field];
26
+ return /*#__PURE__*/React__default.createElement(Grid.Item, {
27
+ key: field,
28
+ className: "\n hc-hidden md:hc-block hc-px-2\n ".concat(index === 0 ? "hc-pl-7" : "", "\n ").concat(field.toLowerCase() === "position" ? "hc-col-span-4 hc-text-balance hc-font-semibold" : field.toLowerCase() === "state" || field.toLowerCase() == "favorite" ? "hc-col-span-1" : "hc-col-span-2", "\n ")
29
+ }, /*#__PURE__*/React__default.createElement("span", {
30
+ className: "hc-sr-only"
31
+ }, capitalize(field)), value, /*#__PURE__*/React__default.createElement("br", null), specialFeaturePills(field));
32
+ }));
33
+ };
34
+
35
+ export { FieldMapperDesktop as default };
36
+ //# sourceMappingURL=field-mapper-desktop.js.map
package/dist/components/modules/list/field-mapper-desktop.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"field-mapper-desktop.js","sources":["../../../../src/components/modules/list/field-mapper-desktop.jsx"],"sourcesContent":["import React from 'react';\nimport Grid from '~/components/modules/grid';\nimport PillWrapper from '~/components/modules/buttons/pill-wrapper';\nimport { capitalize } from '~/util/stringUtils';\n\nconst FieldMapperDesktop = ({\n\titem,\n\tfieldsShown,\n\tspecialFeatures\n}) => {\n\tconst orderedFields = fieldsShown.filter(field => field in item.fields);\n\n\tconst specialFeaturePills = field => {\n\t\treturn field === 'position' && specialFeatures &&\n Object.entries(specialFeatures).map(([featureKey, featureLabel]) => {\n \treturn item.fields[featureKey] == 1 && (\n \t\t<PillWrapper key={featureKey}>{featureLabel}</PillWrapper>\n \t);\n });\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t{orderedFields.map((field, index) => {\n\t\t\t\tlet value = item.fields[field];\n\t\t\t\treturn (\n\t\t\t\t\t<Grid.Item\n\t\t\t\t\t\tkey={field}\n\t\t\t\t\t\tclassName={`\n hc-hidden md:hc-block hc-px-2\n ${index === 0 ? \"hc-pl-7\" : \"\"}\n ${field.toLowerCase() === \"position\" ? \"hc-col-span-4 hc-text-balance hc-font-semibold\" : (field.toLowerCase() === \"state\" || field.toLowerCase() == \"favorite\") ? \"hc-col-span-1\" : \"hc-col-span-2\"}\n `}\n\t\t\t\t\t>\n\t\t\t\t\t\t<span className=\"hc-sr-only\">{capitalize(field)}</span>\n\t\t\t\t\t\t{value}\n\t\t\t\t\t\t<br />\n\t\t\t\t\t\t{specialFeaturePills(field)}\n\t\t\t\t\t</Grid.Item>\n\t\t\t\t);\n\t\t\t})}\n\t\t</>\n\t);\n};\n\nexport default FieldMapperDesktop;"],"names":["FieldMapperDesktop","_ref","item","fieldsShown","specialFeatures","orderedFields","filter","field","fields","specialFeaturePills","Object","entries","map","_ref2","_ref3","_slicedToArray","featureKey","featureLabel","React","createElement","PillWrapper","key","Fragment","index","value","Grid","Item","className","concat","toLowerCase","capitalize"],"mappings":";;;;;;AAKA,IAAMA,kBAAkB,GAAG,SAArBA,kBAAkBA,CAAAC,IAAA,EAIlB;AAAA,EAAA,IAHLC,IAAI,GAAAD,IAAA,CAAJC,IAAI;IACJC,WAAW,GAAAF,IAAA,CAAXE,WAAW;IACXC,eAAe,GAAAH,IAAA,CAAfG,eAAe,CAAA;AAEf,EAAA,IAAMC,aAAa,GAAGF,WAAW,CAACG,MAAM,CAAC,UAAAC,KAAK,EAAA;AAAA,IAAA,OAAIA,KAAK,IAAIL,IAAI,CAACM,MAAM,CAAA;GAAC,CAAA,CAAA;AAEvE,EAAA,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAGF,KAAK,EAAI;AACpC,IAAA,OAAOA,KAAK,KAAK,UAAU,IAAIH,eAAe,IAC1CM,MAAM,CAACC,OAAO,CAACP,eAAe,CAAC,CAACQ,GAAG,CAAC,UAAAC,KAAA,EAAgC;AAAA,MAAA,IAAAC,KAAA,GAAAC,cAAA,CAAAF,KAAA,EAAA,CAAA,CAAA;AAA9BG,QAAAA,UAAU,GAAAF,KAAA,CAAA,CAAA,CAAA;AAAEG,QAAAA,YAAY,GAAAH,KAAA,CAAA,CAAA,CAAA,CAAA;AAC7D,MAAA,OAAOZ,IAAI,CAACM,MAAM,CAACQ,UAAU,CAAC,IAAI,CAAC,iBAClCE,cAAA,CAAAC,aAAA,CAACC,WAAW,EAAA;AAACC,QAAAA,GAAG,EAAEL,UAAAA;AAAW,OAAA,EAAEC,YAA0B,CACzD,CAAA;AACF,KAAC,CAAC,CAAA;GACN,CAAA;AAED,EAAA,oBACCC,cAAA,CAAAC,aAAA,CAAAD,cAAA,CAAAI,QAAA,EAAA,IAAA,EACEjB,aAAa,CAACO,GAAG,CAAC,UAACL,KAAK,EAAEgB,KAAK,EAAK;AACpC,IAAA,IAAIC,KAAK,GAAGtB,IAAI,CAACM,MAAM,CAACD,KAAK,CAAC,CAAA;AAC9B,IAAA,oBACCW,cAAA,CAAAC,aAAA,CAACM,IAAI,CAACC,IAAI,EAAA;AACTL,MAAAA,GAAG,EAAEd,KAAM;AACXoB,MAAAA,SAAS,kEAAAC,MAAA,CAECL,KAAK,KAAK,CAAC,GAAG,SAAS,GAAG,EAAE,EAAA,kBAAA,CAAA,CAAAK,MAAA,CAC5BrB,KAAK,CAACsB,WAAW,EAAE,KAAK,UAAU,GAAG,gDAAgD,GAAItB,KAAK,CAACsB,WAAW,EAAE,KAAK,OAAO,IAAItB,KAAK,CAACsB,WAAW,EAAE,IAAI,UAAU,GAAI,eAAe,GAAG,eAAe,EAAA,gBAAA,CAAA;KAG5MX,eAAAA,cAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;AAAMQ,MAAAA,SAAS,EAAC,YAAA;AAAY,KAAA,EAAEG,UAAU,CAACvB,KAAK,CAAQ,CAAC,EACtDiB,KAAK,eACNN,cAAA,CAAAC,aAAA,WAAK,CAAC,EACLV,mBAAmB,CAACF,KAAK,CAChB,CAAC,CAAA;AAEd,GAAC,CACA,CAAC,CAAA;AAEL;;;;"}
package/dist/components/modules/list/field-mapper-mobile.js ADDED
@@ -0,0 +1,90 @@
1
+ import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
2
+ import React__default from 'react';
3
+ import Grid from '../grid.js';
4
+ import IconContained from '../icon.js';
5
+ import { PillWrapper } from '../buttons/pill-wrapper.js';
6
+
7
+ var FieldMapperMobile = function FieldMapperMobile(_ref) {
8
+ var item = _ref.item,
9
+ fieldsShown = _ref.fieldsShown,
10
+ specialFeatures = _ref.specialFeatures,
11
+ handleFavouriteClick = _ref.handleFavouriteClick,
12
+ isFavorite = _ref.isFavorite,
13
+ _ref$includeFavorite = _ref.includeFavorite,
14
+ includeFavorite = _ref$includeFavorite === void 0 ? true : _ref$includeFavorite;
15
+ var specialFeaturePills = function specialFeaturePills(field) {
16
+ return field === 'position' && specialFeatures && Object.entries(specialFeatures).map(function (_ref2) {
17
+ var _ref3 = _slicedToArray(_ref2, 2),
18
+ featureKey = _ref3[0],
19
+ featureLabel = _ref3[1];
20
+ return item.fields[featureKey] == 1 && /*#__PURE__*/React__default.createElement(PillWrapper, {
21
+ key: featureKey
22
+ }, featureLabel);
23
+ });
24
+ };
25
+ return /*#__PURE__*/React__default.createElement(Grid.Item, {
26
+ className: "md:hc-hidden"
27
+ }, fieldsShown.includes("position") && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
28
+ className: "hc-flex hc-items-start"
29
+ }, /*#__PURE__*/React__default.createElement("div", {
30
+ className: "hc-flex hc-justify-between hc-items-center hc-min-w-[100%]"
31
+ }, /*#__PURE__*/React__default.createElement("h3", {
32
+ className: "hc-font-bold hc-mb-3 hc-flex-1"
33
+ }, item.fields.position), includeFavorite && /*#__PURE__*/React__default.createElement("div", {
34
+ className: "hc-flex hc-justify-end hc-pb-2"
35
+ }, /*#__PURE__*/React__default.createElement(IconContained, {
36
+ icon: isFavorite ? "mdi:heart" : "mdi:heart-outline",
37
+ size: "hc-size-3.5",
38
+ iconClasses: isFavorite ? "hc-text-primary" : "",
39
+ className: "hc-transition-opacity hc-duration-300 hc-cursor-pointer\n ".concat(isFavorite ? "hc-opacity-100" : "hc-text-uiText/60 group-hover:hc-opacity-100", "\n "),
40
+ onClick: function onClick(e) {
41
+ return handleFavouriteClick(e, item);
42
+ }
43
+ })))), specialFeatures && /*#__PURE__*/React__default.createElement("div", {
44
+ className: "hc-pb-4"
45
+ }, specialFeaturePills("position"), " ")), /*#__PURE__*/React__default.createElement("ul", {
46
+ className: "hc-space-y-2 hc-text-xs"
47
+ }, [{
48
+ field: "categoryClass",
49
+ name: "categoryClass",
50
+ icon: "icon-park-solid:tree-list"
51
+ }, {
52
+ field: "category",
53
+ name: "Category",
54
+ icon: "icon-park-solid:tree-list"
55
+ }, {
56
+ field: "schedule",
57
+ name: "Schedule",
58
+ icon: "gravity-ui:clock-fill"
59
+ }, {
60
+ field: "city",
61
+ name: "Location",
62
+ icon: "fluent:location-16-filled"
63
+ }, {
64
+ field: "state",
65
+ name: "Location",
66
+ icon: "fluent:location-16-filled"
67
+ }, {
68
+ field: "cityState",
69
+ name: "Location",
70
+ icon: "fluent:location-16-filled"
71
+ }, {
72
+ field: "travelTime",
73
+ name: "Commute",
74
+ icon: "ri:pin-distance-fill"
75
+ }].map(function (listItem) {
76
+ return fieldsShown.includes(listItem.field) && item.fields[listItem.field] && /*#__PURE__*/React__default.createElement("li", {
77
+ key: listItem.field,
78
+ className: "hc-flex hc-gap-2"
79
+ }, /*#__PURE__*/React__default.createElement(IconContained, {
80
+ icon: listItem.icon,
81
+ size: "hc-size-3.5",
82
+ className: "hc-text-uiAccent/30"
83
+ }), /*#__PURE__*/React__default.createElement("span", {
84
+ className: "hc-sr-only"
85
+ }, listItem.name), item.fields[listItem.field]);
86
+ })));
87
+ };
88
+
89
+ export { FieldMapperMobile as default };
90
+ //# sourceMappingURL=field-mapper-mobile.js.map
package/dist/components/modules/list/field-mapper-mobile.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"field-mapper-mobile.js","sources":["../../../../src/components/modules/list/field-mapper-mobile.jsx"],"sourcesContent":["import React from 'react';\nimport Grid from '~/components/modules/grid';\nimport Icon from '~/components/modules/icon';\nimport PillWrapper from '~/components/modules/buttons/pill-wrapper';\n\nconst FieldMapperMobile = ({\n item,\n fieldsShown,\n specialFeatures,\n handleFavouriteClick,\n isFavorite,\n includeFavorite = true\n}) => {\n const specialFeaturePills = field => {\n return field === 'position' && specialFeatures &&\n Object.entries(specialFeatures).map(([featureKey, featureLabel]) => {\n return item.fields[featureKey] == 1 && (\n <PillWrapper key={featureKey}>{featureLabel}</PillWrapper>\n );\n });\n };\n\n return (\n <Grid.Item className=\"md:hc-hidden\">\n {fieldsShown.includes(\"position\") &&\n <>\n <div className=\"hc-flex hc-items-start\">\n <div className=\"hc-flex hc-justify-between hc-items-center hc-min-w-[100%]\">\n <h3 className=\"hc-font-bold hc-mb-3 hc-flex-1\">{item.fields.position}</h3>\n {includeFavorite && <div className=\"hc-flex hc-justify-end hc-pb-2\">\n <Icon\n icon={isFavorite ? \"mdi:heart\" : \"mdi:heart-outline\"}\n size=\"hc-size-3.5\"\n iconClasses={isFavorite ? \"hc-text-primary\" : \"\"}\n className={`hc-transition-opacity hc-duration-300 hc-cursor-pointer\n ${isFavorite ? \"hc-opacity-100\" : \"hc-text-uiText/60 group-hover:hc-opacity-100\"}\n `}\n onClick={e => handleFavouriteClick(e, item)}\n />\n </div>\n }\n </div>\n </div>\n {specialFeatures && <div className='hc-pb-4'>{specialFeaturePills(\"position\", true)} </div>}\n </>\n }\n\n <ul className=\"hc-space-y-2 hc-text-xs\">\n {[\n {\n field: \"categoryClass\",\n name: \"categoryClass\",\n icon: \"icon-park-solid:tree-list\"\n },\n {\n field: \"category\",\n name: \"Category\",\n icon: \"icon-park-solid:tree-list\"\n },\n {\n field: \"schedule\",\n name: \"Schedule\",\n icon: \"gravity-ui:clock-fill\"\n },\n {\n field: \"city\",\n name: \"Location\",\n icon: \"fluent:location-16-filled\"\n },\n {\n field: \"state\",\n name: \"Location\",\n icon: \"fluent:location-16-filled\"\n },\n {\n field: \"cityState\",\n name: \"Location\",\n icon: \"fluent:location-16-filled\"\n },\n {\n field: \"travelTime\",\n name: \"Commute\",\n icon: \"ri:pin-distance-fill\"\n }\n ].map(listItem => (\n (fieldsShown.includes(listItem.field) && item.fields[listItem.field]) &&\n <li\n key={listItem.field}\n className=\"hc-flex hc-gap-2\"\n >\n <Icon\n icon={listItem.icon}\n size=\"hc-size-3.5\"\n className=\"hc-text-uiAccent/30\"\n />\n <span className=\"hc-sr-only\">{listItem.name}</span>\n {item.fields[listItem.field]}\n </li>\n ))}\n </ul>\n </Grid.Item>\n );\n};\n\nexport default FieldMapperMobile;"],"names":["FieldMapperMobile","_ref","item","fieldsShown","specialFeatures","handleFavouriteClick","isFavorite","_ref$includeFavorite","includeFavorite","specialFeaturePills","field","Object","entries","map","_ref2","_ref3","_slicedToArray","featureKey","featureLabel","fields","React","createElement","PillWrapper","key","Grid","Item","className","includes","Fragment","position","Icon","icon","size","iconClasses","concat","onClick","e","name","listItem"],"mappings":"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"}
package/dist/components/modules/list/list-item/list-item-desktop.js ADDED
@@ -0,0 +1,50 @@
1
+ import React__default from 'react';
2
+ import Grid from '../../grid.js';
3
+ import IconContained from '../../icon.js';
4
+ import FieldMapper from '../field-mapper-desktop.js';
5
+
6
+ var ListItemDesktop = function ListItemDesktop(_ref) {
7
+ var isActive = _ref.isActive,
8
+ bodyClassName = _ref.bodyClassName,
9
+ item = _ref.item,
10
+ fieldsShown = _ref.fieldsShown,
11
+ specialFeatures = _ref.specialFeatures,
12
+ isFavorite = _ref.isFavorite,
13
+ includeFavorite = _ref.includeFavorite,
14
+ handleFavouriteClick = _ref.handleFavouriteClick;
15
+ return /*#__PURE__*/React__default.createElement(Grid, {
16
+ columns: "hc-pl-2 hc-md-pl-0 hc-grid-flow-col hc-auto-cols-fr",
17
+ gap: "hc-gap-0",
18
+ className: "\n hc-hidden md:hc-grid hc-py-2 hc-w-full hc-grow hc-leading-tight hc-text-sm md:hc-text-xs lg:hc-text-sm\n ".concat(bodyClassName !== null && bodyClassName !== void 0 ? bodyClassName : "", "\n ")
19
+ }, /*#__PURE__*/React__default.createElement(Grid.Item, {
20
+ className: "md:hc-absolute md:hc-left-1.5 hc-top-1.5"
21
+ }, /*#__PURE__*/React__default.createElement("span", {
22
+ className: "hc-sr-only"
23
+ }, "Expand row"), /*#__PURE__*/React__default.createElement(IconContained, {
24
+ icon: "fluent-emoji-high-contrast:plus",
25
+ size: "hc-size-2.5",
26
+ className: "\n hc-opacity-0 hc-text-uiText/60 hc-transition group-hover:hc-opacity-100 group-active:hc-opacity-100\n ".concat(isActive ? "hc-opacity-100 hc-rotate-45" : "", "\n ")
27
+ })), /*#__PURE__*/React__default.createElement(FieldMapper, {
28
+ item: item,
29
+ fieldsShown: fieldsShown,
30
+ specialFeatures: specialFeatures,
31
+ isFavorite: isFavorite,
32
+ includeFavorite: includeFavorite,
33
+ handleFavouriteClick: handleFavouriteClick
34
+ }), includeFavorite && /*#__PURE__*/React__default.createElement(Grid.Item, {
35
+ key: "favorites",
36
+ className: "hc-col-span-1 hc-px-2"
37
+ }, /*#__PURE__*/React__default.createElement(IconContained, {
38
+ icon: isFavorite ? "mdi:heart" : "mdi:heart-outline",
39
+ size: "hc-size-3.5",
40
+ iconClasses: isFavorite ? "hc-text-primary" : "",
41
+ title: !isFavorite ? 'Add job to favorites' : 'Remove job from favorites',
42
+ className: "hc-pr-2 hc-transition-opacity hc-duration-300 hc-cursor-pointer hc-opacity-100",
43
+ onClick: function onClick(e) {
44
+ handleFavouriteClick(e, item);
45
+ }
46
+ })));
47
+ };
48
+
49
+ export { ListItemDesktop as default };
50
+ //# sourceMappingURL=list-item-desktop.js.map
package/dist/components/modules/list/list-item/list-item-desktop.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"list-item-desktop.js","sources":["../../../../../src/components/modules/list/list-item/list-item-desktop.jsx"],"sourcesContent":["import React from 'react';\nimport Grid from '~/components/modules/grid';\nimport Icon from '~/components/modules/icon';\nimport FieldMapper from '~/components/modules/list/field-mapper-desktop';\n\nconst ListItemDesktop = ({\n\tisActive,\n\tbodyClassName,\n\titem,\n\tfieldsShown,\n\tspecialFeatures,\n\tisFavorite,\n\tincludeFavorite,\n\thandleFavouriteClick\n}) => {\n\treturn (\n\t\t<Grid\n\t\t\tcolumns=\"hc-pl-2 hc-md-pl-0 hc-grid-flow-col hc-auto-cols-fr\"\n\t\t\tgap=\"hc-gap-0\"\n\t\t\tclassName={`\n hc-hidden md:hc-grid hc-py-2 hc-w-full hc-grow hc-leading-tight hc-text-sm md:hc-text-xs lg:hc-text-sm\n ${bodyClassName ?? \"\"}\n `}\n\t\t>\n\t\t\t<Grid.Item className=\"md:hc-absolute md:hc-left-1.5 hc-top-1.5\">\n\t\t\t\t<span className=\"hc-sr-only\">Expand row</span>\n\t\t\t\t<Icon\n\t\t\t\t\ticon=\"fluent-emoji-high-contrast:plus\"\n\t\t\t\t\tsize=\"hc-size-2.5\"\n\t\t\t\t\tclassName={`\n hc-opacity-0 hc-text-uiText/60 hc-transition group-hover:hc-opacity-100 group-active:hc-opacity-100\n ${isActive ? \"hc-opacity-100 hc-rotate-45\" : \"\"}\n `}\n\t\t\t\t/>\n\t\t\t</Grid.Item>\n\t\t\t<FieldMapper\n\t\t\t\titem={item}\n\t\t\t\tfieldsShown={fieldsShown}\n\t\t\t\tspecialFeatures={specialFeatures}\n\t\t\t\tisFavorite={isFavorite}\n\t\t\t\tincludeFavorite={includeFavorite}\n\t\t\t\thandleFavouriteClick={handleFavouriteClick}\n\t\t\t/>\n\t\t\t{includeFavorite &&\n <Grid.Item\n \tkey={\"favorites\"}\n \tclassName=\"hc-col-span-1 hc-px-2\"\n >\n \t<Icon\n \t\ticon={isFavorite ? \"mdi:heart\" : \"mdi:heart-outline\"}\n \t\tsize=\"hc-size-3.5\"\n \t\ticonClasses={isFavorite ? \"hc-text-primary\" : \"\"}\n \t\ttitle={!isFavorite ? 'Add job to favorites' : 'Remove job from favorites'}\n \t\tclassName=\"hc-pr-2 hc-transition-opacity hc-duration-300 hc-cursor-pointer hc-opacity-100\"\n \t\tonClick={e => {handleFavouriteClick(e, item);}}\n \t/>\n </Grid.Item>\n\t\t\t}\n\t\t</Grid>\n\t);\n};\n\nexport default ListItemDesktop;"],"names":["ListItemDesktop","_ref","isActive","bodyClassName","item","fieldsShown","specialFeatures","isFavorite","includeFavorite","handleFavouriteClick","React","createElement","Grid","columns","gap","className","concat","Item","Icon","icon","size","FieldMapper","key","iconClasses","title","onClick","e"],"mappings":";;;;;AAKA,IAAMA,eAAe,GAAG,SAAlBA,eAAeA,CAAAC,IAAA,EASf;AAAA,EAAA,IARLC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRC,aAAa,GAAAF,IAAA,CAAbE,aAAa;IACbC,IAAI,GAAAH,IAAA,CAAJG,IAAI;IACJC,WAAW,GAAAJ,IAAA,CAAXI,WAAW;IACXC,eAAe,GAAAL,IAAA,CAAfK,eAAe;IACfC,UAAU,GAAAN,IAAA,CAAVM,UAAU;IACVC,eAAe,GAAAP,IAAA,CAAfO,eAAe;IACfC,oBAAoB,GAAAR,IAAA,CAApBQ,oBAAoB,CAAA;AAEpB,EAAA,oBACCC,cAAA,CAAAC,aAAA,CAACC,IAAI,EAAA;AACJC,IAAAA,OAAO,EAAC,qDAAqD;AAC7DC,IAAAA,GAAG,EAAC,UAAU;IACdC,SAAS,EAAA,4HAAA,CAAAC,MAAA,CAEFb,aAAa,aAAbA,aAAa,KAAA,KAAA,CAAA,GAAbA,aAAa,GAAI,EAAE,EAAA,UAAA,CAAA;AACrB,GAAA,eAELO,cAAA,CAAAC,aAAA,CAACC,IAAI,CAACK,IAAI,EAAA;AAACF,IAAAA,SAAS,EAAC,0CAAA;GACpBL,eAAAA,cAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;AAAMI,IAAAA,SAAS,EAAC,YAAA;AAAY,GAAA,EAAC,YAAgB,CAAC,eAC9CL,cAAA,CAAAC,aAAA,CAACO,aAAI,EAAA;AACJC,IAAAA,IAAI,EAAC,iCAAiC;AACtCC,IAAAA,IAAI,EAAC,aAAa;AAClBL,IAAAA,SAAS,oIAAAC,MAAA,CAEAd,QAAQ,GAAG,6BAA6B,GAAG,EAAE,EAAA,cAAA,CAAA;AAC/C,GACP,CACS,CAAC,eACZQ,cAAA,CAAAC,aAAA,CAACU,WAAW,EAAA;AACXjB,IAAAA,IAAI,EAAEA,IAAK;AACXC,IAAAA,WAAW,EAAEA,WAAY;AACzBC,IAAAA,eAAe,EAAEA,eAAgB;AACjCC,IAAAA,UAAU,EAAEA,UAAW;AACvBC,IAAAA,eAAe,EAAEA,eAAgB;AACjCC,IAAAA,oBAAoB,EAAEA,oBAAAA;GACtB,CAAC,EACDD,eAAe,iBACXE,cAAA,CAAAC,aAAA,CAACC,IAAI,CAACK,IAAI,EAAA;AACTK,IAAAA,GAAG,EAAE,WAAY;AACjBP,IAAAA,SAAS,EAAC,uBAAA;AAAuB,GAAA,eAEjCL,cAAA,CAAAC,aAAA,CAACO,aAAI,EAAA;AACJC,IAAAA,IAAI,EAAEZ,UAAU,GAAG,WAAW,GAAG,mBAAoB;AACrDa,IAAAA,IAAI,EAAC,aAAa;AAClBG,IAAAA,WAAW,EAAEhB,UAAU,GAAG,iBAAiB,GAAG,EAAG;AACjDiB,IAAAA,KAAK,EAAE,CAACjB,UAAU,GAAG,sBAAsB,GAAG,2BAA4B;AAC1EQ,IAAAA,SAAS,EAAC,gFAAgF;AAC1FU,IAAAA,OAAO,EAAE,SAAAA,OAAAC,CAAAA,CAAC,EAAI;AAACjB,MAAAA,oBAAoB,CAACiB,CAAC,EAAEtB,IAAI,CAAC,CAAA;AAAC,KAAA;GAC7C,CACS,CAEX,CAAC,CAAA;AAET;;;;"}
package/dist/components/modules/list/list-item/list-item-mobile.js ADDED
@@ -0,0 +1,51 @@
1
+ import React__default from 'react';
2
+ import Grid from '../../grid.js';
3
+ import FieldMapperMobile from '../field-mapper-mobile.js';
4
+
5
+ /* eslint-disable jsx-a11y/no-static-element-interactions */
6
+ /* eslint-disable jsx-a11y/click-events-have-key-events */
7
+ var ListItemMobile = function ListItemMobile(_ref) {
8
+ var _item$mapDetails, _item$mapDetails2, _item$mapDetails3, _item$mapDetails4;
9
+ var bodyClassName = _ref.bodyClassName,
10
+ item = _ref.item,
11
+ fieldsShown = _ref.fieldsShown,
12
+ specialFeatures = _ref.specialFeatures,
13
+ isFavorite = _ref.isFavorite,
14
+ includeFavorite = _ref.includeFavorite,
15
+ handleFavouriteClick = _ref.handleFavouriteClick,
16
+ showMap = _ref.showMap,
17
+ setMobileTab = _ref.setMobileTab,
18
+ onItemSelected = _ref.onItemSelected,
19
+ siteConfig = _ref.siteConfig;
20
+ var mapPinColor = !showMap ? null : siteConfig.colors.primary.replace("#", "");
21
+ var handleClick = function handleClick() {
22
+ if (onItemSelected) {
23
+ onItemSelected(item);
24
+ }
25
+ };
26
+ return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Grid, {
27
+ columns: "hc-pl-2 hc-grid-flow-col hc-auto-cols-fr",
28
+ gap: "hc-gap-0",
29
+ className: "\n hc-block md:hc-hidden hc-py-2 hc-w-full hc-grow hc-leading-tight hc-text-sm\n ".concat(bodyClassName !== null && bodyClassName !== void 0 ? bodyClassName : "", "\n ")
30
+ }, /*#__PURE__*/React__default.createElement(FieldMapperMobile, {
31
+ item: item,
32
+ fieldsShown: fieldsShown,
33
+ specialFeatures: specialFeatures,
34
+ isFavorite: isFavorite,
35
+ includeFavorite: includeFavorite,
36
+ handleFavouriteClick: handleFavouriteClick
37
+ })), showMap && /*#__PURE__*/React__default.createElement("div", {
38
+ onClick: function onClick() {
39
+ setMobileTab("mapTab");
40
+ handleClick();
41
+ },
42
+ className: "md:hc-hidden hc-w-2/5 sm:hc-w-1/3 hc-p-1.5 hc-my-1 hc-bg-uiAccent/5 hc-border hc-border-uiAccent/10 hc-rounded-sm"
43
+ }, /*#__PURE__*/React__default.createElement("img", {
44
+ src: "https://maps.googleapis.com/maps/api/staticmap?scale=2&center=".concat((_item$mapDetails = item.mapDetails) === null || _item$mapDetails === void 0 ? void 0 : _item$mapDetails.latitude, ",").concat((_item$mapDetails2 = item.mapDetails) === null || _item$mapDetails2 === void 0 ? void 0 : _item$mapDetails2.longitude, "&zoom=10&size=240x180&maptype=roadmap&markers=color:0x").concat(mapPinColor, "%7Clabel:\u2022%7C").concat((_item$mapDetails3 = item.mapDetails) === null || _item$mapDetails3 === void 0 ? void 0 : _item$mapDetails3.latitude, ",").concat((_item$mapDetails4 = item.mapDetails) === null || _item$mapDetails4 === void 0 ? void 0 : _item$mapDetails4.longitude, "&key=", "AIzaSyAXPlfaoMCrmjNV1u-vFYdLBi7GkGeh4S4"),
45
+ alt: "Map of location for ".concat(item.fields.position),
46
+ className: "hc-w-full hc-h-full hc-object-cover"
47
+ })));
48
+ };
49
+
50
+ export { ListItemMobile as default };
51
+ //# sourceMappingURL=list-item-mobile.js.map
package/dist/components/modules/list/list-item/list-item-mobile.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"list-item-mobile.js","sources":["../../../../../src/components/modules/list/list-item/list-item-mobile.jsx"],"sourcesContent":["/* eslint-disable jsx-a11y/no-static-element-interactions */\n/* eslint-disable jsx-a11y/click-events-have-key-events */\nimport React from 'react';\nimport Grid from '~/components/modules/grid';\nimport FieldMapper from '~/components/modules/list/field-mapper-mobile';\n\nconst ListItemMobile = ({\n\tbodyClassName,\n\titem,\n\tfieldsShown,\n\tspecialFeatures,\n\tisFavorite,\n\tincludeFavorite,\n\thandleFavouriteClick,\n\tshowMap,\n\tsetMobileTab,\n\tonItemSelected,\n\tsiteConfig\n}) => {\n\tconst mapPinColor = !showMap ? null : siteConfig.colors.primary.replace(\"#\", \"\");\n\n\tconst handleClick = () => {\n\t\tif (onItemSelected) {\n\t\t\tonItemSelected(item);\n\t\t}\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<Grid\n\t\t\t\tcolumns=\"hc-pl-2 hc-grid-flow-col hc-auto-cols-fr\"\n\t\t\t\tgap=\"hc-gap-0\"\n\t\t\t\tclassName={`\n hc-block md:hc-hidden hc-py-2 hc-w-full hc-grow hc-leading-tight hc-text-sm\n ${bodyClassName ?? \"\"}\n `}\n\t\t\t>\n\t\t\t\t<FieldMapper\n\t\t\t\t\titem={item}\n\t\t\t\t\tfieldsShown={fieldsShown}\n\t\t\t\t\tspecialFeatures={specialFeatures}\n\t\t\t\t\tisFavorite={isFavorite}\n\t\t\t\t\tincludeFavorite={includeFavorite}\n\t\t\t\t\thandleFavouriteClick={handleFavouriteClick}\n\t\t\t\t/>\n\t\t\t</Grid>\n\n\t\t\t{showMap && (\n\t\t\t\t<div\n\t\t\t\t\tonClick={() => { setMobileTab(\"mapTab\"); handleClick(); }}\n\t\t\t\t\tclassName=\"md:hc-hidden hc-w-2/5 sm:hc-w-1/3 hc-p-1.5 hc-my-1 hc-bg-uiAccent/5 hc-border hc-border-uiAccent/10 hc-rounded-sm\"\n\t\t\t\t>\n\t\t\t\t\t<img\n\t\t\t\t\t\tsrc={`https://maps.googleapis.com/maps/api/staticmap?scale=2&center=${item.mapDetails?.latitude},${item.mapDetails?.longitude}&zoom=10&size=240x180&maptype=roadmap&markers=color:0x${mapPinColor}%7Clabel:•%7C${item.mapDetails?.latitude},${item.mapDetails?.longitude}&key=${process.env.GOOGLE_MAPS_API_KEY}`}\n\t\t\t\t\t\talt={`Map of location for ${item.fields.position}`}\n\t\t\t\t\t\tclassName=\"hc-w-full hc-h-full hc-object-cover\"\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</>\n\t);\n};\n\nexport default ListItemMobile;"],"names":["ListItemMobile","_ref","_item$mapDetails","_item$mapDetails2","_item$mapDetails3","_item$mapDetails4","bodyClassName","item","fieldsShown","specialFeatures","isFavorite","includeFavorite","handleFavouriteClick","showMap","setMobileTab","onItemSelected","siteConfig","mapPinColor","colors","primary","replace","handleClick","React","createElement","Fragment","Grid","columns","gap","className","concat","FieldMapper","onClick","src","mapDetails","latitude","longitude","alt","fields","position"],"mappings":"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"}
package/dist/components/modules/list/list-item/list-item.js CHANGED
@@ -2,7 +2,8 @@ import { objectWithoutProperties as _objectWithoutProperties, extends as _extend
2
2
  import React__default, { forwardRef } from 'react';
3
3
  import Grid from '../../grid.js';
4
4
  import IconContained from '../../icon.js';
5
- import FieldMapper from '../field-mapper.js';
5
+ import FieldMapperDesktop from '../field-mapper-desktop.js';
6
+ import FieldMapperMobile from '../field-mapper-mobile.js';
6
7
 
7
8
  var _excluded = ["isActive", "bodyClassName", "className", "item", "fieldsShown", "specialFeatures", "onItemSelected", "showMap", "setMobileTab", "handleSettingFavorites", "favorites", "includeFavorite", "siteConfig"];
8
9
  var ListItem = /*#__PURE__*/forwardRef(function (_ref, ref) {
@@ -61,14 +62,24 @@ var ListItem = /*#__PURE__*/forwardRef(function (_ref, ref) {
61
62
  icon: "fluent-emoji-high-contrast:plus",
62
63
  size: "hc-size-2.5",
63
64
  className: "\n hc-opacity-0 hc-text-uiText/60 hc-transition group-hover:hc-opacity-100 group-active:hc-opacity-100\n ".concat(isActive ? "hc-opacity-100 hc-rotate-45" : "", "\n ")
64
- })), /*#__PURE__*/React__default.createElement(FieldMapper, {
65
+ })), /*#__PURE__*/React__default.createElement(FieldMapperDesktop, {
65
66
  item: item,
66
67
  fieldsShown: fieldsShown,
67
68
  specialFeatures: specialFeatures,
68
69
  isFavorite: isFavorite,
69
70
  includeFavorite: includeFavorite,
70
71
  handleFavouriteClick: handleFavouriteClick
71
- }), includeFavorite && /*#__PURE__*/React__default.createElement(Grid.Item, {
72
+ }), /*#__PURE__*/React__default.createElement(FieldMapperMobile, {
73
+ item: item,
74
+ fieldsShown: fieldsShown,
75
+ specialFeatures: specialFeatures,
76
+ isFavorite: isFavorite,
77
+ includeFavorite: includeFavorite,
78
+ handleFavouriteClick: handleFavouriteClick
79
+ }), includeFavorite &&
80
+ /*#__PURE__*/
81
+ /* DESKTOP ONLY: This favorites icon is hidden on mobile (hc-hidden) and visible on desktop (md:hc-block) */
82
+ React__default.createElement(Grid.Item, {
72
83
  key: "favorites",
73
84
  className: "hc-hidden md:hc-block hc-col-span-1 hc-px-2"
74
85
  }, /*#__PURE__*/React__default.createElement(IconContained, {
package/dist/components/modules/list/list-item/list-item.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"list-item.js","sources":["../../../../../src/components/modules/list/list-item/list-item.js"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport Grid from '~/components/modules/grid';\nimport Icon from '~/components/modules/icon';\nimport FieldMapper from '~/components/modules/list/field-mapper';\n\nconst ListItem = forwardRef(\n\t(\n\t\t{\n\t\t\tisActive,\n\t\t\tbodyClassName,\n\t\t\tclassName,\n\t\t\titem,\n\t\t\tfieldsShown,\n\t\t\tspecialFeatures,\n\t\t\tonItemSelected,\n\t\t\tshowMap,\n\t\t\tsetMobileTab,\n\t\t\thandleSettingFavorites,\n\t\t\tfavorites,\n\t\t\tincludeFavorite = true,\n\t\t\tsiteConfig,\n\t\t\t...props\n\t\t},\n\t\tref\n\t) => {\n\t\tconst mapPinColor = !showMap ? null : siteConfig.colors.primary.replace(\"#\", \"\");\n\n\t\tconst handleClick = () => {\n\t\t\tif (onItemSelected) {\n\t\t\t\tonItemSelected(item);\n\t\t\t}\n\t\t};\n\t\tlet isFavorite = favorites.includes(item.id);\n\n\t\tconst handleFavouriteClick = (event, item) => {\n\t\t\tif(!includeFavorite)return;\n\t\t\tevent.stopPropagation();\n\t\t\tlet updatedFavorites;\n\t\t\tif (isFavorite) {\n\t\t\t\tupdatedFavorites = favorites.filter(fav => fav !== item.id);\n\t\t\t} else {\n\t\t\t\tupdatedFavorites = [...favorites, item.id];\n\t\t\t}\n\t\t\tisFavorite = !isFavorite;\n\t\t\thandleSettingFavorites(updatedFavorites);\n\t\t};\n\t\treturn (\n\t\t\t<button\n\t\t\t\tref={ref}\n\t\t\t\tonClick={() => { handleClick(); }}\n\t\t\t\tclassName={`\n\t\t\t\thc-group hc-relative hc-flex md:hc-flex-col hc-w-full hc-text-left hc-bg-clip-border hc-border hc-border-transparent hc-break-words hc-overflow-hidden hc-cursor-pointer hc-transition-colors hover:hc-bg-uiAccent/5 focus:hover:hc-bg-uiAccent/5\n\t\t\t\t${isActive ? \"hc-bg-uiAccent/5 hc-border-secondary hc-border\" : \"hc-text-uiText hc-bg-white\"}\n\t\t\t\t${className ?? \"\"}\n\t\t\t\t`}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<Grid\n\t\t\t\t\tcolumns=\"hc-pl-2 hc-md-pl-0 hc-grid-flow-col hc-auto-cols-fr\"\n\t\t\t\t\tgap=\"hc-gap-0\"\n\t\t\t\t\tclassName={`\n hc-block md:hc-grid hc-py-2 hc-w-full hc-grow hc-leading-tight hc-text-sm md:hc-text-xs lg:hc-text-sm\n ${bodyClassName ?? \"\"}\n `}\n\t\t\t\t>\n\t\t\t\t\t<Grid.Item className=\"hc-hidden md:hc-block md:hc-absolute md:hc-left-1.5 hc-top-1.5\">\n\t\t\t\t\t\t<span className=\"hc-sr-only\">Expand row</span>\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\ticon=\"fluent-emoji-high-contrast:plus\"\n\t\t\t\t\t\t\tsize=\"hc-size-2.5\"\n\t\t\t\t\t\t\tclassName={`\n hc-opacity-0 hc-text-uiText/60 hc-transition group-hover:hc-opacity-100 group-active:hc-opacity-100\n ${isActive ? \"hc-opacity-100 hc-rotate-45\" : \"\"}\n `}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Grid.Item>\n\t\t\t\t\t<FieldMapper\n\t\t\t\t\t\titem={item}\n\t\t\t\t\t\tfieldsShown={fieldsShown}\n\t\t\t\t\t\tspecialFeatures={specialFeatures}\n\t\t\t\t\t\tisFavorite={isFavorite}\n\t\t\t\t\t\tincludeFavorite={includeFavorite}\n\t\t\t\t\t\thandleFavouriteClick={handleFavouriteClick}\n\t\t\t\t\t/>\n\t\t\t\t\t{includeFavorite &&\n\t\t\t\t\t<Grid.Item\n\t\t\t\t\t\tkey={\"favorites\"}\n\t\t\t\t\t\tclassName=\"hc-hidden md:hc-block hc-col-span-1 hc-px-2\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\ticon={isFavorite ? \"mdi:heart\" : \"mdi:heart-outline\"}\n\t\t\t\t\t\t\tsize=\"hc-size-3.5\"\n\t\t\t\t\t\t\ticonClasses={isFavorite ? \"hc-text-primary\" : \"\"}\n\t\t\t\t\t\t\ttitle={!isFavorite ? 'Add job to favorites' : 'Remove job from favorites'}\n\t\t\t\t\t\t\tclassName=\"hc-pr-2 hc-transition-opacity hc-duration-300 hc-cursor-pointer hc-opacity-100\"\n\t\t\t\t\t\t\tonClick={e => {handleFavouriteClick(e, item);}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Grid.Item>\n\t\t\t\t\t}\n\t\t\t\t</Grid>\n\t\t\t\t{showMap && (\n\t\t\t\t\t<div onClick={() => { setMobileTab(\"mapTab\"); handleClick(); }} className=\"md:hc-hidden hc-w-2/5 sm:hc-w-1/3 hc-p-1.5 hc-my-1 hc-bg-uiAccent/5 hc-border hc-border-uiAccent/10 hc-rounded-sm\">\n\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tsrc={`https://maps.googleapis.com/maps/api/staticmap?scale=2&center=${item.mapDetails?.latitude},${item.mapDetails?.longitude}&zoom=10&size=240x180&maptype=roadmap&markers=color:0x${mapPinColor}%7Clabel:•%7C${item.mapDetails?.latitude},${item.mapDetails?.longitude}&key=${process.env.GOOGLE_MAPS_API_KEY}`}\n\t\t\t\t\t\t\talt={`Map of location for ${item.fields.position}`}\n\t\t\t\t\t\t\tclassName=\"hc-w-full hc-h-full hc-object-cover\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</button>\n\t\t);\n\t}\n);\n\nListItem.displayName = \"ListItem\";\n\nexport default React.memo(ListItem, (prevProps, nextProps) => {\n\treturn (\n\t\tprevProps.isActive === nextProps.isActive &&\n\t\tprevProps.favorites === nextProps.favorites &&\n prevProps.item.id === nextProps.item.id &&\n\tprevProps.item.fields.travelTime === nextProps.item.fields.travelTime &&\n prevProps.fieldsShown === nextProps.fieldsShown &&\n prevProps.bodyClassName === nextProps.bodyClassName &&\n prevProps.className === nextProps.className\n\t);\n});\n"],"names":["ListItem","forwardRef","_ref","ref","_item$mapDetails","_item$mapDetails2","_item$mapDetails3","_item$mapDetails4","isActive","bodyClassName","className","item","fieldsShown","specialFeatures","onItemSelected","showMap","setMobileTab","handleSettingFavorites","favorites","_ref$includeFavorite","includeFavorite","siteConfig","props","_objectWithoutProperties","_excluded","mapPinColor","colors","primary","replace","handleClick","isFavorite","includes","id","handleFavouriteClick","event","stopPropagation","updatedFavorites","filter","fav","concat","_toConsumableArray","React","createElement","_extends","onClick","Grid","columns","gap","Item","Icon","icon","size","FieldMapper","key","iconClasses","title","e","src","mapDetails","latitude","longitude","alt","fields","position","displayName","memo","prevProps","nextProps","travelTime"],"mappings":";;;;;;;AAKA,IAAMA,QAAQ,gBAAGC,UAAU,CAC1B,UAAAC,IAAA,EAiBCC,GAAG,EACC;AAAA,EAAA,IAAAC,gBAAA,EAAAC,iBAAA,EAAAC,iBAAA,EAAAC,iBAAA,CAAA;AAAA,EAAA,IAhBHC,QAAQ,GAAAN,IAAA,CAARM,QAAQ;IACRC,aAAa,GAAAP,IAAA,CAAbO,aAAa;IACbC,SAAS,GAAAR,IAAA,CAATQ,SAAS;IACTC,IAAI,GAAAT,IAAA,CAAJS,IAAI;IACJC,WAAW,GAAAV,IAAA,CAAXU,WAAW;IACXC,eAAe,GAAAX,IAAA,CAAfW,eAAe;IACfC,cAAc,GAAAZ,IAAA,CAAdY,cAAc;IACdC,OAAO,GAAAb,IAAA,CAAPa,OAAO;IACPC,YAAY,GAAAd,IAAA,CAAZc,YAAY;IACZC,sBAAsB,GAAAf,IAAA,CAAtBe,sBAAsB;IACtBC,SAAS,GAAAhB,IAAA,CAATgB,SAAS;IAAAC,oBAAA,GAAAjB,IAAA,CACTkB,eAAe;AAAfA,IAAAA,eAAe,GAAAD,oBAAA,KAAG,KAAA,CAAA,GAAA,IAAI,GAAAA,oBAAA;IACtBE,UAAU,GAAAnB,IAAA,CAAVmB,UAAU;AACPC,IAAAA,KAAK,GAAAC,wBAAA,CAAArB,IAAA,EAAAsB,SAAA,CAAA,CAAA;AAIT,EAAA,IAAMC,WAAW,GAAG,CAACV,OAAO,GAAG,IAAI,GAAGM,UAAU,CAACK,MAAM,CAACC,OAAO,CAACC,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC,CAAA;AAEhF,EAAA,IAAMC,WAAW,GAAG,SAAdA,WAAWA,GAAS;AACzB,IAAA,IAAIf,cAAc,EAAE;MACnBA,cAAc,CAACH,IAAI,CAAC,CAAA;AACrB,KAAA;GACA,CAAA;EACD,IAAImB,UAAU,GAAGZ,SAAS,CAACa,QAAQ,CAACpB,IAAI,CAACqB,EAAE,CAAC,CAAA;EAE5C,IAAMC,oBAAoB,GAAG,SAAvBA,oBAAoBA,CAAIC,KAAK,EAAEvB,IAAI,EAAK;IAC7C,IAAG,CAACS,eAAe,EAAC,OAAA;IACpBc,KAAK,CAACC,eAAe,EAAE,CAAA;AACvB,IAAA,IAAIC,gBAAgB,CAAA;AACpB,IAAA,IAAIN,UAAU,EAAE;AACfM,MAAAA,gBAAgB,GAAGlB,SAAS,CAACmB,MAAM,CAAC,UAAAC,GAAG,EAAA;AAAA,QAAA,OAAIA,GAAG,KAAK3B,IAAI,CAACqB,EAAE,CAAA;OAAC,CAAA,CAAA;AAC5D,KAAC,MAAM;MACNI,gBAAgB,GAAA,EAAA,CAAAG,MAAA,CAAAC,kBAAA,CAAOtB,SAAS,CAAEP,EAAAA,CAAAA,IAAI,CAACqB,EAAE,CAAC,CAAA,CAAA;AAC3C,KAAA;IACAF,UAAU,GAAG,CAACA,UAAU,CAAA;IACxBb,sBAAsB,CAACmB,gBAAgB,CAAC,CAAA;GACxC,CAAA;AACD,EAAA,oBACCK,cAAA,CAAAC,aAAA,CAAA,QAAA,EAAAC,QAAA,CAAA;AACCxC,IAAAA,GAAG,EAAEA,GAAI;IACTyC,OAAO,EAAE,SAAAA,OAAAA,GAAM;AAAEf,MAAAA,WAAW,EAAE,CAAA;KAAI;AAClCnB,IAAAA,SAAS,0QAAA6B,MAAA,CAEP/B,QAAQ,GAAG,gDAAgD,GAAG,4BAA4B,EAAA+B,YAAAA,CAAAA,CAAAA,MAAA,CAC1F7B,SAAS,KAAA,IAAA,IAATA,SAAS,KAATA,KAAAA,CAAAA,GAAAA,SAAS,GAAI,EAAE,EAAA,YAAA,CAAA;AACf,GAAA,EACEY,KAAK,CAETmB,eAAAA,cAAA,CAAAC,aAAA,CAACG,IAAI,EAAA;AACJC,IAAAA,OAAO,EAAC,qDAAqD;AAC7DC,IAAAA,GAAG,EAAC,UAAU;IACdrC,SAAS,EAAA,mIAAA,CAAA6B,MAAA,CAEA9B,aAAa,aAAbA,aAAa,KAAA,KAAA,CAAA,GAAbA,aAAa,GAAI,EAAE,EAAA,cAAA,CAAA;AACrB,GAAA,eAEPgC,cAAA,CAAAC,aAAA,CAACG,IAAI,CAACG,IAAI,EAAA;AAACtC,IAAAA,SAAS,EAAC,gEAAA;GACpB+B,eAAAA,cAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;AAAMhC,IAAAA,SAAS,EAAC,YAAA;AAAY,GAAA,EAAC,YAAgB,CAAC,eAC9C+B,cAAA,CAAAC,aAAA,CAACO,aAAI,EAAA;AACJC,IAAAA,IAAI,EAAC,iCAAiC;AACtCC,IAAAA,IAAI,EAAC,aAAa;AAClBzC,IAAAA,SAAS,4IAAA6B,MAAA,CAEE/B,QAAQ,GAAG,6BAA6B,GAAG,EAAE,EAAA,kBAAA,CAAA;AAC/C,GACT,CACS,CAAC,eACZiC,cAAA,CAAAC,aAAA,CAACU,WAAW,EAAA;AACXzC,IAAAA,IAAI,EAAEA,IAAK;AACXC,IAAAA,WAAW,EAAEA,WAAY;AACzBC,IAAAA,eAAe,EAAEA,eAAgB;AACjCiB,IAAAA,UAAU,EAAEA,UAAW;AACvBV,IAAAA,eAAe,EAAEA,eAAgB;AACjCa,IAAAA,oBAAoB,EAAEA,oBAAAA;GACtB,CAAC,EACDb,eAAe,iBAChBqB,cAAA,CAAAC,aAAA,CAACG,IAAI,CAACG,IAAI,EAAA;AACTK,IAAAA,GAAG,EAAE,WAAY;AACjB3C,IAAAA,SAAS,EAAC,8CAAA;AAA8C,GAAA,eAExD+B,cAAA,CAAAC,aAAA,CAACO,aAAI,EAAA;AACJC,IAAAA,IAAI,EAAEpB,UAAU,GAAG,WAAW,GAAG,mBAAoB;AACrDqB,IAAAA,IAAI,EAAC,aAAa;AAClBG,IAAAA,WAAW,EAAExB,UAAU,GAAG,iBAAiB,GAAG,EAAG;AACjDyB,IAAAA,KAAK,EAAE,CAACzB,UAAU,GAAG,sBAAsB,GAAG,2BAA4B;AAC1EpB,IAAAA,SAAS,EAAC,gFAAgF;AAC1FkC,IAAAA,OAAO,EAAE,SAAAA,OAAAY,CAAAA,CAAC,EAAI;AAACvB,MAAAA,oBAAoB,CAACuB,CAAC,EAAE7C,IAAI,CAAC,CAAA;AAAC,KAAA;GAC7C,CACS,CAEN,CAAC,EACNI,OAAO,iBACP0B,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IAAKE,OAAO,EAAE,SAAAA,OAAAA,GAAM;MAAE5B,YAAY,CAAC,QAAQ,CAAC,CAAA;AAAEa,MAAAA,WAAW,EAAE,CAAA;KAAI;AAACnB,IAAAA,SAAS,EAAC,mHAAA;GACzE+B,eAAAA,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACCe,IAAAA,GAAG,EAAAlB,gEAAAA,CAAAA,MAAA,CAAAnC,CAAAA,gBAAA,GAAmEO,IAAI,CAAC+C,UAAU,MAAAtD,IAAAA,IAAAA,gBAAA,KAAfA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,gBAAA,CAAiBuD,QAAQ,EAAApB,GAAAA,CAAAA,CAAAA,MAAA,CAAAlC,CAAAA,iBAAA,GAAIM,IAAI,CAAC+C,UAAU,MAAArD,IAAAA,IAAAA,iBAAA,KAAfA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,iBAAA,CAAiBuD,SAAS,4DAAArB,MAAA,CAAyDd,WAAW,EAAA,oBAAA,CAAA,CAAAc,MAAA,CAAA,CAAAjC,iBAAA,GAAgBK,IAAI,CAAC+C,UAAU,MAAA,IAAA,IAAApD,iBAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAfA,iBAAA,CAAiBqD,QAAQ,EAAA,GAAA,CAAA,CAAApB,MAAA,CAAA,CAAAhC,iBAAA,GAAII,IAAI,CAAC+C,UAAU,MAAA,IAAA,IAAAnD,iBAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAfA,iBAAA,CAAiBqD,SAAS,EAAA,OAAA,EAAQ,yCAA+B,CAAG;IAClTC,GAAG,EAAA,sBAAA,CAAAtB,MAAA,CAAyB5B,IAAI,CAACmD,MAAM,CAACC,QAAQ,CAAG;AACnDrD,IAAAA,SAAS,EAAC,qCAAA;GACV,CACG,CAEC,CAAC,CAAA;AAEX,CACD,CAAC,CAAA;AAEDV,QAAQ,CAACgE,WAAW,GAAG,UAAU,CAAA;AAEjC,iBAAevB,aAAAA,cAAK,CAACwB,IAAI,CAACjE,QAAQ,EAAE,UAACkE,SAAS,EAAEC,SAAS,EAAK;AAC7D,EAAA,OACCD,SAAS,CAAC1D,QAAQ,KAAK2D,SAAS,CAAC3D,QAAQ,IACzC0D,SAAS,CAAChD,SAAS,KAAKiD,SAAS,CAACjD,SAAS,IACzCgD,SAAS,CAACvD,IAAI,CAACqB,EAAE,KAAKmC,SAAS,CAACxD,IAAI,CAACqB,EAAE,IAC1CkC,SAAS,CAACvD,IAAI,CAACmD,MAAM,CAACM,UAAU,KAAKD,SAAS,CAACxD,IAAI,CAACmD,MAAM,CAACM,UAAU,IAClEF,SAAS,CAACtD,WAAW,KAAKuD,SAAS,CAACvD,WAAW,IAC/CsD,SAAS,CAACzD,aAAa,KAAK0D,SAAS,CAAC1D,aAAa,IACnDyD,SAAS,CAACxD,SAAS,KAAKyD,SAAS,CAACzD,SAAS,CAAA;AAE/C,CAAC,CAAC;;;;"}
1
+ {"version":3,"file":"list-item.js","sources":["../../../../../src/components/modules/list/list-item/list-item.jsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport Grid from '~/components/modules/grid';\nimport Icon from '~/components/modules/icon';\nimport FieldMapper from '~/components/modules/list/field-mapper-desktop';\nimport FieldMapperMobile from '~/components/modules/list/field-mapper-mobile';\nconst ListItem = forwardRef(\n\t(\n\t\t{\n\t\t\tisActive,\n\t\t\tbodyClassName,\n\t\t\tclassName,\n\t\t\titem,\n\t\t\tfieldsShown,\n\t\t\tspecialFeatures,\n\t\t\tonItemSelected,\n\t\t\tshowMap,\n\t\t\tsetMobileTab,\n\t\t\thandleSettingFavorites,\n\t\t\tfavorites,\n\t\t\tincludeFavorite = true,\n\t\t\tsiteConfig,\n\t\t\t...props\n\t\t},\n\t\tref\n\t) => {\n\t\tconst mapPinColor = !showMap ? null : siteConfig.colors.primary.replace(\"#\", \"\");\n\n\t\tconst handleClick = () => {\n\t\t\tif (onItemSelected) {\n\t\t\t\tonItemSelected(item);\n\t\t\t}\n\t\t};\n\t\tlet isFavorite = favorites.includes(item.id);\n\n\t\tconst handleFavouriteClick = (event, item) => {\n\t\t\tif(!includeFavorite)return;\n\t\t\tevent.stopPropagation();\n\t\t\tlet updatedFavorites;\n\t\t\tif (isFavorite) {\n\t\t\t\tupdatedFavorites = favorites.filter(fav => fav !== item.id);\n\t\t\t} else {\n\t\t\t\tupdatedFavorites = [...favorites, item.id];\n\t\t\t}\n\t\t\tisFavorite = !isFavorite;\n\t\t\thandleSettingFavorites(updatedFavorites);\n\t\t};\n\t\treturn (\n\t\t\t<button\n\t\t\t\tref={ref}\n\t\t\t\tonClick={() => { handleClick(); }}\n\t\t\t\tclassName={`\n\t\t\t\thc-group hc-relative hc-flex md:hc-flex-col hc-w-full hc-text-left hc-bg-clip-border hc-border hc-border-transparent hc-break-words hc-overflow-hidden hc-cursor-pointer hc-transition-colors hover:hc-bg-uiAccent/5 focus:hover:hc-bg-uiAccent/5\n\t\t\t\t${isActive ? \"hc-bg-uiAccent/5 hc-border-secondary hc-border\" : \"hc-text-uiText hc-bg-white\"}\n\t\t\t\t${className ?? \"\"}\n\t\t\t\t`}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{/* This Grid is displayed as block on mobile and grid on desktop */}\n\t\t\t\t<Grid\n\t\t\t\t\tcolumns=\"hc-pl-2 hc-md-pl-0 hc-grid-flow-col hc-auto-cols-fr\"\n\t\t\t\t\tgap=\"hc-gap-0\"\n\t\t\t\t\tclassName={`\n hc-block md:hc-grid hc-py-2 hc-w-full hc-grow hc-leading-tight hc-text-sm md:hc-text-xs lg:hc-text-sm\n ${bodyClassName ?? \"\"}\n `}\n\t\t\t\t>\n\t\t\t\t\t{/* DESKTOP ONLY: This expand icon is hidden on mobile (hc-hidden) and visible on desktop (md:hc-block) */}\n\t\t\t\t\t<Grid.Item className=\"hc-hidden md:hc-block md:hc-absolute md:hc-left-1.5 hc-top-1.5\">\n\t\t\t\t\t\t<span className=\"hc-sr-only\">Expand row</span>\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\ticon=\"fluent-emoji-high-contrast:plus\"\n\t\t\t\t\t\t\tsize=\"hc-size-2.5\"\n\t\t\t\t\t\t\tclassName={`\n hc-opacity-0 hc-text-uiText/60 hc-transition group-hover:hc-opacity-100 group-active:hc-opacity-100\n ${isActive ? \"hc-opacity-100 hc-rotate-45\" : \"\"}\n `}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Grid.Item>\n\t\t\t\t\t<FieldMapper\n\t\t\t\t\t\titem={item}\n\t\t\t\t\t\tfieldsShown={fieldsShown}\n\t\t\t\t\t\tspecialFeatures={specialFeatures}\n\t\t\t\t\t\tisFavorite={isFavorite}\n\t\t\t\t\t\tincludeFavorite={includeFavorite}\n\t\t\t\t\t\thandleFavouriteClick={handleFavouriteClick}\n\t\t\t\t\t/>\n\t\t\t\t\t<FieldMapperMobile\n\t\t\t\t\t\titem={item}\n\t\t\t\t\t\tfieldsShown={fieldsShown}\n\t\t\t\t\t\tspecialFeatures={specialFeatures}\n\t\t\t\t\t\tisFavorite={isFavorite}\n\t\t\t\t\t\tincludeFavorite={includeFavorite}\n\t\t\t\t\t\thandleFavouriteClick={handleFavouriteClick}\n\t\t\t\t\t/>\n\t\t\t\t\t{includeFavorite &&\n\t\t\t\t\t/* DESKTOP ONLY: This favorites icon is hidden on mobile (hc-hidden) and visible on desktop (md:hc-block) */\n\t\t\t\t\t<Grid.Item\n\t\t\t\t\t\tkey={\"favorites\"}\n\t\t\t\t\t\tclassName=\"hc-hidden md:hc-block hc-col-span-1 hc-px-2\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\ticon={isFavorite ? \"mdi:heart\" : \"mdi:heart-outline\"}\n\t\t\t\t\t\t\tsize=\"hc-size-3.5\"\n\t\t\t\t\t\t\ticonClasses={isFavorite ? \"hc-text-primary\" : \"\"}\n\t\t\t\t\t\t\ttitle={!isFavorite ? 'Add job to favorites' : 'Remove job from favorites'}\n\t\t\t\t\t\t\tclassName=\"hc-pr-2 hc-transition-opacity hc-duration-300 hc-cursor-pointer hc-opacity-100\"\n\t\t\t\t\t\t\tonClick={e => {handleFavouriteClick(e, item);}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Grid.Item>\n\t\t\t\t\t}\n\t\t\t\t</Grid>\n\t\t\t\t{/* MOBILE ONLY: This map section is visible on mobile and hidden on desktop (md:hc-hidden) */}\n\t\t\t\t{showMap && (\n\t\t\t\t\t<div onClick={() => { setMobileTab(\"mapTab\"); handleClick(); }} className=\"md:hc-hidden hc-w-2/5 sm:hc-w-1/3 hc-p-1.5 hc-my-1 hc-bg-uiAccent/5 hc-border hc-border-uiAccent/10 hc-rounded-sm\">\n\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tsrc={`https://maps.googleapis.com/maps/api/staticmap?scale=2&center=${item.mapDetails?.latitude},${item.mapDetails?.longitude}&zoom=10&size=240x180&maptype=roadmap&markers=color:0x${mapPinColor}%7Clabel:•%7C${item.mapDetails?.latitude},${item.mapDetails?.longitude}&key=${process.env.GOOGLE_MAPS_API_KEY}`}\n\t\t\t\t\t\t\talt={`Map of location for ${item.fields.position}`}\n\t\t\t\t\t\t\tclassName=\"hc-w-full hc-h-full hc-object-cover\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</button>\n\t\t);\n\t}\n);\n\nListItem.displayName = \"ListItem\";\n\nexport default React.memo(ListItem, (prevProps, nextProps) => {\n\treturn (\n\t\tprevProps.isActive === nextProps.isActive &&\n\t\tprevProps.favorites === nextProps.favorites &&\n prevProps.item.id === nextProps.item.id &&\n\tprevProps.item.fields.travelTime === nextProps.item.fields.travelTime &&\n prevProps.fieldsShown === nextProps.fieldsShown &&\n prevProps.bodyClassName === nextProps.bodyClassName &&\n prevProps.className === nextProps.className\n\t);\n});"],"names":["ListItem","forwardRef","_ref","ref","_item$mapDetails","_item$mapDetails2","_item$mapDetails3","_item$mapDetails4","isActive","bodyClassName","className","item","fieldsShown","specialFeatures","onItemSelected","showMap","setMobileTab","handleSettingFavorites","favorites","_ref$includeFavorite","includeFavorite","siteConfig","props","_objectWithoutProperties","_excluded","mapPinColor","colors","primary","replace","handleClick","isFavorite","includes","id","handleFavouriteClick","event","stopPropagation","updatedFavorites","filter","fav","concat","_toConsumableArray","React","createElement","_extends","onClick","Grid","columns","gap","Item","Icon","icon","size","FieldMapper","FieldMapperMobile","key","iconClasses","title","e","src","mapDetails","latitude","longitude","alt","fields","position","displayName","memo","prevProps","nextProps","travelTime"],"mappings":"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"}
package/dist/types/components/modules/list/field-mapper-desktop.d.ts ADDED
@@ -0,0 +1,7 @@
1
+ export default FieldMapperDesktop;
2
+ declare function FieldMapperDesktop({ item, fieldsShown, specialFeatures }: {
3
+ item: any;
4
+ fieldsShown: any;
5
+ specialFeatures: any;
6
+ }): React.JSX.Element;
7
+ import React from "react";
package/dist/types/components/modules/list/field-mapper-mobile.d.ts ADDED
@@ -0,0 +1,10 @@
1
+ export default FieldMapperMobile;
2
+ declare function FieldMapperMobile({ item, fieldsShown, specialFeatures, handleFavouriteClick, isFavorite, includeFavorite }: {
3
+ item: any;
4
+ fieldsShown: any;
5
+ specialFeatures: any;
6
+ handleFavouriteClick: any;
7
+ isFavorite: any;
8
+ includeFavorite?: boolean | undefined;
9
+ }): React.JSX.Element;
10
+ import React from "react";
package/dist/types/components/modules/list/list-item/list-item-desktop.d.ts ADDED
@@ -0,0 +1,12 @@
1
+ export default ListItemDesktop;
2
+ declare function ListItemDesktop({ isActive, bodyClassName, item, fieldsShown, specialFeatures, isFavorite, includeFavorite, handleFavouriteClick }: {
3
+ isActive: any;
4
+ bodyClassName: any;
5
+ item: any;
6
+ fieldsShown: any;
7
+ specialFeatures: any;
8
+ isFavorite: any;
9
+ includeFavorite: any;
10
+ handleFavouriteClick: any;
11
+ }): React.JSX.Element;
12
+ import React from "react";
package/dist/types/components/modules/list/list-item/list-item-mobile.d.ts ADDED
@@ -0,0 +1,15 @@
1
+ export default ListItemMobile;
2
+ declare function ListItemMobile({ bodyClassName, item, fieldsShown, specialFeatures, isFavorite, includeFavorite, handleFavouriteClick, showMap, setMobileTab, onItemSelected, siteConfig }: {
3
+ bodyClassName: any;
4
+ item: any;
5
+ fieldsShown: any;
6
+ specialFeatures: any;
7
+ isFavorite: any;
8
+ includeFavorite: any;
9
+ handleFavouriteClick: any;
10
+ showMap: any;
11
+ setMobileTab: any;
12
+ onItemSelected: any;
13
+ siteConfig: any;
14
+ }): React.JSX.Element;
15
+ import React from "react";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@abcagency/hc-ui-components",
3
- "version": "1.3.79",
3
+ "version": "1.3.80",
4
4
  "description": "UI Components for HireControl",
5
5
  "main": "dist/index.js",
6
6
  "files": [
package/src/components/modules/list/field-mapper-desktop.jsx ADDED
@@ -0,0 +1,46 @@
1
+ import React from 'react';
2
+ import Grid from '~/components/modules/grid';
3
+ import PillWrapper from '~/components/modules/buttons/pill-wrapper';
4
+ import { capitalize } from '~/util/stringUtils';
5
+
6
+ const FieldMapperDesktop = ({
7
+ item,
8
+ fieldsShown,
9
+ specialFeatures
10
+ }) => {
11
+ const orderedFields = fieldsShown.filter(field => field in item.fields);
12
+
13
+ const specialFeaturePills = field => {
14
+ return field === 'position' && specialFeatures &&
15
+ Object.entries(specialFeatures).map(([featureKey, featureLabel]) => {
16
+ return item.fields[featureKey] == 1 && (
17
+ <PillWrapper key={featureKey}>{featureLabel}</PillWrapper>
18
+ );
19
+ });
20
+ };
21
+
22
+ return (
23
+ <>
24
+ {orderedFields.map((field, index) => {
25
+ let value = item.fields[field];
26
+ return (
27
+ <Grid.Item
28
+ key={field}
29
+ className={`
30
+ hc-hidden md:hc-block hc-px-2
31
+ ${index === 0 ? "hc-pl-7" : ""}
32
+ ${field.toLowerCase() === "position" ? "hc-col-span-4 hc-text-balance hc-font-semibold" : (field.toLowerCase() === "state" || field.toLowerCase() == "favorite") ? "hc-col-span-1" : "hc-col-span-2"}
33
+ `}
34
+ >
35
+ <span className="hc-sr-only">{capitalize(field)}</span>
36
+ {value}
37
+ <br />
38
+ {specialFeaturePills(field)}
39
+ </Grid.Item>
40
+ );
41
+ })}
42
+ </>
43
+ );
44
+ };
45
+
46
+ export default FieldMapperDesktop;
package/src/components/modules/list/field-mapper-mobile.jsx ADDED
@@ -0,0 +1,105 @@
1
+ import React from 'react';
2
+ import Grid from '~/components/modules/grid';
3
+ import Icon from '~/components/modules/icon';
4
+ import PillWrapper from '~/components/modules/buttons/pill-wrapper';
5
+
6
+ const FieldMapperMobile = ({
7
+ item,
8
+ fieldsShown,
9
+ specialFeatures,
10
+ handleFavouriteClick,
11
+ isFavorite,
12
+ includeFavorite = true
13
+ }) => {
14
+ const specialFeaturePills = field => {
15
+ return field === 'position' && specialFeatures &&
16
+ Object.entries(specialFeatures).map(([featureKey, featureLabel]) => {
17
+ return item.fields[featureKey] == 1 && (
18
+ <PillWrapper key={featureKey}>{featureLabel}</PillWrapper>
19
+ );
20
+ });
21
+ };
22
+
23
+ return (
24
+ <Grid.Item className="md:hc-hidden">
25
+ {fieldsShown.includes("position") &&
26
+ <>
27
+ <div className="hc-flex hc-items-start">
28
+ <div className="hc-flex hc-justify-between hc-items-center hc-min-w-[100%]">
29
+ <h3 className="hc-font-bold hc-mb-3 hc-flex-1">{item.fields.position}</h3>
30
+ {includeFavorite && <div className="hc-flex hc-justify-end hc-pb-2">
31
+ <Icon
32
+ icon={isFavorite ? "mdi:heart" : "mdi:heart-outline"}
33
+ size="hc-size-3.5"
34
+ iconClasses={isFavorite ? "hc-text-primary" : ""}
35
+ className={`hc-transition-opacity hc-duration-300 hc-cursor-pointer
36
+ ${isFavorite ? "hc-opacity-100" : "hc-text-uiText/60 group-hover:hc-opacity-100"}
37
+ `}
38
+ onClick={e => handleFavouriteClick(e, item)}
39
+ />
40
+ </div>
41
+ }
42
+ </div>
43
+ </div>
44
+ {specialFeatures && <div className='hc-pb-4'>{specialFeaturePills("position", true)} </div>}
45
+ </>
46
+ }
47
+
48
+ <ul className="hc-space-y-2 hc-text-xs">
49
+ {[
50
+ {
51
+ field: "categoryClass",
52
+ name: "categoryClass",
53
+ icon: "icon-park-solid:tree-list"
54
+ },
55
+ {
56
+ field: "category",
57
+ name: "Category",
58
+ icon: "icon-park-solid:tree-list"
59
+ },
60
+ {
61
+ field: "schedule",
62
+ name: "Schedule",
63
+ icon: "gravity-ui:clock-fill"
64
+ },
65
+ {
66
+ field: "city",
67
+ name: "Location",
68
+ icon: "fluent:location-16-filled"
69
+ },
70
+ {
71
+ field: "state",
72
+ name: "Location",
73
+ icon: "fluent:location-16-filled"
74
+ },
75
+ {
76
+ field: "cityState",
77
+ name: "Location",
78
+ icon: "fluent:location-16-filled"
79
+ },
80
+ {
81
+ field: "travelTime",
82
+ name: "Commute",
83
+ icon: "ri:pin-distance-fill"
84
+ }
85
+ ].map(listItem => (
86
+ (fieldsShown.includes(listItem.field) && item.fields[listItem.field]) &&
87
+ <li
88
+ key={listItem.field}
89
+ className="hc-flex hc-gap-2"
90
+ >
91
+ <Icon
92
+ icon={listItem.icon}
93
+ size="hc-size-3.5"
94
+ className="hc-text-uiAccent/30"
95
+ />
96
+ <span className="hc-sr-only">{listItem.name}</span>
97
+ {item.fields[listItem.field]}
98
+ </li>
99
+ ))}
100
+ </ul>
101
+ </Grid.Item>
102
+ );
103
+ };
104
+
105
+ export default FieldMapperMobile;
package/src/components/modules/list/list-item/{list-item.js → list-item.jsx} RENAMED
@@ -1,8 +1,8 @@
1
1
  import React, { forwardRef } from 'react';
2
2
  import Grid from '~/components/modules/grid';
3
3
  import Icon from '~/components/modules/icon';
4
- import FieldMapper from '~/components/modules/list/field-mapper';
5
-
4
+ import FieldMapper from '~/components/modules/list/field-mapper-desktop';
5
+ import FieldMapperMobile from '~/components/modules/list/field-mapper-mobile';
6
6
  const ListItem = forwardRef(
7
7
  (
8
8
  {
@@ -55,6 +55,7 @@ const ListItem = forwardRef(
55
55
  `}
56
56
  {...props}
57
57
  >
58
+ {/* This Grid is displayed as block on mobile and grid on desktop */}
58
59
  <Grid
59
60
  columns="hc-pl-2 hc-md-pl-0 hc-grid-flow-col hc-auto-cols-fr"
60
61
  gap="hc-gap-0"
@@ -63,6 +64,7 @@ const ListItem = forwardRef(
63
64
  ${bodyClassName ?? ""}
64
65
  `}
65
66
  >
67
+ {/* DESKTOP ONLY: This expand icon is hidden on mobile (hc-hidden) and visible on desktop (md:hc-block) */}
66
68
  <Grid.Item className="hc-hidden md:hc-block md:hc-absolute md:hc-left-1.5 hc-top-1.5">
67
69
  <span className="hc-sr-only">Expand row</span>
68
70
  <Icon
@@ -82,7 +84,16 @@ const ListItem = forwardRef(
82
84
  includeFavorite={includeFavorite}
83
85
  handleFavouriteClick={handleFavouriteClick}
84
86
  />
87
+ <FieldMapperMobile
88
+ item={item}
89
+ fieldsShown={fieldsShown}
90
+ specialFeatures={specialFeatures}
91
+ isFavorite={isFavorite}
92
+ includeFavorite={includeFavorite}
93
+ handleFavouriteClick={handleFavouriteClick}
94
+ />
85
95
  {includeFavorite &&
96
+ /* DESKTOP ONLY: This favorites icon is hidden on mobile (hc-hidden) and visible on desktop (md:hc-block) */
86
97
  <Grid.Item
87
98
  key={"favorites"}
88
99
  className="hc-hidden md:hc-block hc-col-span-1 hc-px-2"
@@ -98,6 +109,7 @@ const ListItem = forwardRef(
98
109
  </Grid.Item>
99
110
  }
100
111
  </Grid>
112
+ {/* MOBILE ONLY: This map section is visible on mobile and hidden on desktop (md:hc-hidden) */}
101
113
  {showMap && (
102
114
  <div onClick={() => { setMobileTab("mapTab"); handleClick(); }} className="md:hc-hidden hc-w-2/5 sm:hc-w-1/3 hc-p-1.5 hc-my-1 hc-bg-uiAccent/5 hc-border hc-border-uiAccent/10 hc-rounded-sm">
103
115
  <img
@@ -124,4 +136,4 @@ export default React.memo(ListItem, (prevProps, nextProps) => {
124
136
  prevProps.bodyClassName === nextProps.bodyClassName &&
125
137
  prevProps.className === nextProps.className
126
138
  );
127
- });
139
+ });
package/src/components/modules/list/field-mapper.js DELETED
@@ -1,130 +0,0 @@
1
- import React from 'react';
2
-
3
- import Grid from '~/components/modules/grid';
4
- import Icon from '~/components/modules/icon';
5
- import PillWrapper from '~/components/modules/buttons/pill-wrapper';
6
-
7
- import { capitalize } from '~/util/stringUtils';
8
-
9
- const FieldMapper = ({
10
- item,
11
- fieldsShown,
12
- specialFeatures,
13
- handleFavouriteClick,
14
- isFavorite,
15
- includeFavorite = true
16
- }) => {
17
- const orderedFields = fieldsShown.filter(field => field in item.fields);
18
-
19
- const specialFeaturePills = field => {
20
- return field === 'position' && specialFeatures &&
21
- Object.entries(specialFeatures).map(([featureKey, featureLabel]) => {
22
- return item.fields[featureKey] == 1 && (
23
- <PillWrapper key={featureKey}>{featureLabel}</PillWrapper>
24
- );
25
- });
26
- };
27
-
28
- return (
29
- <>
30
- {orderedFields.map((field, index) => {
31
- let value = item.fields[field];
32
- return (
33
- <Grid.Item
34
- key={field}
35
- className={`
36
- hc-hidden md:hc-block hc-px-2
37
- ${index === 0 ? "hc-pl-7" : ""}
38
- ${field.toLowerCase() === "position" ? "hc-col-span-4 hc-text-balance hc-font-semibold" : (field.toLowerCase() === "state" || field.toLowerCase() == "favorite") ? "hc-col-span-1" : "hc-col-span-2"}
39
- `}
40
- >
41
- <span className="hc-sr-only">{capitalize(field)}</span>
42
- {value}
43
- <br />
44
- {specialFeaturePills(field)}
45
- </Grid.Item>
46
- );
47
- })}
48
- <Grid.Item className="md:hc-hidden">
49
- {fieldsShown.includes("position") &&
50
- <>
51
- <div className="hc-flex hc-items-start">
52
- <div className="hc-flex hc-justify-between hc-items-center hc-min-w-[100%]"> {}
53
- <h3 className="hc-font-bold hc-mb-3 hc-flex-1">{item.fields.position}</h3>
54
- {includeFavorite && <div className="hc-flex hc-justify-end hc-pb-2">
55
- <Icon
56
- icon={isFavorite ? "mdi:heart" : "mdi:heart-outline"}
57
- size="hc-size-3.5"
58
- iconClasses={isFavorite ? "hc-text-primary" : ""}
59
- className={`hc-transition-opacity hc-duration-300 hc-cursor-pointer
60
- ${isFavorite ? "hc-opacity-100" : "hc-text-uiText/60 group-hover:hc-opacity-100"}
61
- `}
62
- onClick={e => handleFavouriteClick(e, item)}
63
- />
64
- </div>
65
- }
66
- </div>
67
- </div>
68
- {specialFeatures && <div className='hc-pb-4'>{specialFeaturePills("position", true)} </div>}
69
- </>
70
- }
71
-
72
- <ul className="hc-space-y-2 hc-text-xs">
73
- {[
74
- {
75
- field: "categoryClass",
76
- name: "categoryClass",
77
- icon: "icon-park-solid:tree-list"
78
- },
79
- {
80
- field: "category",
81
- name: "Category",
82
- icon: "icon-park-solid:tree-list"
83
- },
84
- {
85
- field: "schedule",
86
- name: "Schedule",
87
- icon: "gravity-ui:clock-fill"
88
- },
89
- {
90
- field: "city",
91
- name: "Location",
92
- icon: "fluent:location-16-filled"
93
- },
94
- {
95
- field: "state",
96
- name: "Location",
97
- icon: "fluent:location-16-filled"
98
- },
99
- {
100
- field: "cityState",
101
- name: "Location",
102
- icon: "fluent:location-16-filled"
103
- },
104
- {
105
- field: "travelTime",
106
- name: "Commute",
107
- icon: "ri:pin-distance-fill"
108
- }
109
- ].map(listItem => (
110
- (fieldsShown.includes(listItem.field) && item.fields[listItem.field]) &&
111
- <li
112
- key={listItem.field}
113
- className="hc-flex hc-gap-2"
114
- >
115
- <Icon
116
- icon={listItem.icon}
117
- size="hc-size-3.5"
118
- className="hc-text-uiAccent/30"
119
- />
120
- <span className="hc-sr-only">{listItem.name}</span>
121
- {item.fields[listItem.field]}
122
- </li>
123
- ))}
124
- </ul>
125
- </Grid.Item>
126
- </>
127
- );
128
- };
129
-
130
- export default FieldMapper;