@ltht-react/timeline 2.0.198 → 2.0.200

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 (5) hide show
  1. package/lib/molecules/timeline-item.d.ts +1 -0
  2. package/lib/molecules/timeline-item.js +45 -8
  3. package/lib/molecules/timeline-item.js.map +1 -1
  4. package/package.json +11 -10
  5. package/src/molecules/timeline-item.tsx +20 -3
package/lib/molecules/timeline-item.d.ts CHANGED
@@ -11,6 +11,7 @@ export interface ITimelineItem {
11
11
  itemClickHandler?(): void;
12
12
  pointInTimeClickHandler?: (date: Date) => void;
13
13
  buttonText?: string;
14
+ countersignatureClickHandler?(): void;
14
15
  }
15
16
  type TimeLineItemButtonState = 'no-button' | 'selectable-button' | 'selected-button' | 'permission-denied-button';
16
17
  export default TimelineItem;
package/lib/molecules/timeline-item.js CHANGED
@@ -3,6 +3,40 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
3
3
  if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
4
  return cooked;
5
5
  };
6
+ var __assign = (this && this.__assign) || function () {
7
+ __assign = Object.assign || function(t) {
8
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
9
+ s = arguments[i];
10
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
11
+ t[p] = s[p];
12
+ }
13
+ return t;
14
+ };
15
+ return __assign.apply(this, arguments);
16
+ };
17
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
18
+ if (k2 === undefined) k2 = k;
19
+ var desc = Object.getOwnPropertyDescriptor(m, k);
20
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
21
+ desc = { enumerable: true, get: function() { return m[k]; } };
22
+ }
23
+ Object.defineProperty(o, k2, desc);
24
+ }) : (function(o, m, k, k2) {
25
+ if (k2 === undefined) k2 = k;
26
+ o[k2] = m[k];
27
+ }));
28
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
29
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
30
+ }) : function(o, v) {
31
+ o["default"] = v;
32
+ });
33
+ var __importStar = (this && this.__importStar) || function (mod) {
34
+ if (mod && mod.__esModule) return mod;
35
+ var result = {};
36
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
37
+ __setModuleDefault(result, mod);
38
+ return result;
39
+ };
6
40
  var __importDefault = (this && this.__importDefault) || function (mod) {
7
41
  return (mod && mod.__esModule) ? mod : { "default": mod };
8
42
  };
@@ -12,6 +46,7 @@ var styled_1 = __importDefault(require("@emotion/styled"));
12
46
  var styles_1 = require("@ltht-react/styles");
13
47
  var hooks_1 = require("@ltht-react/hooks");
14
48
  var utils_1 = require("@ltht-react/utils");
49
+ var countersignature_1 = __importStar(require("@ltht-react/countersignature"));
15
50
  var timeline_description_1 = __importDefault(require("../atoms/timeline-description"));
16
51
  var timeline_author_1 = __importDefault(require("../atoms/timeline-author"));
17
52
  var timeline_title_1 = __importDefault(require("../atoms/timeline-title"));
@@ -22,17 +57,19 @@ var StyledTimelineItem = styled_1.default.div(templateObject_1 || (templateObjec
22
57
  return (isSelected ? styles_1.HIGHLIGHT_GREEN.VALUE : styles_1.TRANSLUCENT_DARK_BLUE);
23
58
  });
24
59
  var StyledTimelineAuthor = (0, styled_1.default)(timeline_author_1.default)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n flex-grow: 1;\n margin-bottom: 0.5rem;\n"], ["\n flex-grow: 1;\n margin-bottom: 0.5rem;\n"])));
25
- var StyledTimelineTime = (0, styled_1.default)(timeline_time_1.default)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n color: black;\n"], ["\n color: black;\n"])));
26
- var StyledTimelineItemTop = styled_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: flex;\n color: black;\n padding-bottom: 0.25rem;\n margin: 0.5rem;\n"], ["\n display: flex;\n color: black;\n padding-bottom: 0.25rem;\n margin: 0.5rem;\n"])));
27
- var StyledTimelineItemMiddle = styled_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n color: black;\n padding-bottom: 1rem;\n margin: 0.5rem;\n"], ["\n color: black;\n padding-bottom: 1rem;\n margin: 0.5rem;\n"])));
28
- var StyledTimelineItemBottom = styled_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n color: grey;\n display: flex;\n margin: 0.5rem;\n"], ["\n color: grey;\n display: flex;\n margin: 0.5rem;\n"])));
60
+ var StyledCountersignatureIconAndStatus = (0, styled_1.default)(countersignature_1.default)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n flex-grow: 1;\n margin-bottom: 0.5rem;\n"], ["\n flex-grow: 1;\n margin-bottom: 0.5rem;\n"])));
61
+ var StyledTimelineTime = (0, styled_1.default)(timeline_time_1.default)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n color: black;\n"], ["\n color: black;\n"])));
62
+ var StyledTimelineItemTop = styled_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n display: flex;\n color: black;\n padding-bottom: 0.25rem;\n margin: 0.5rem;\n"], ["\n display: flex;\n color: black;\n padding-bottom: 0.25rem;\n margin: 0.5rem;\n"])));
63
+ var StyledTimelineItemMiddle = styled_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n color: black;\n padding-bottom: 1rem;\n margin: 0.5rem;\n"], ["\n color: black;\n padding-bottom: 1rem;\n margin: 0.5rem;\n"])));
64
+ var StyledTimelineCountersignature = styled_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n color: black;\n margin: 0.5rem;\n"], ["\n color: black;\n margin: 0.5rem;\n"])));
65
+ var StyledTimelineItemBottom = styled_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n color: grey;\n display: flex;\n margin: 0.5rem;\n"], ["\n color: grey;\n display: flex;\n margin: 0.5rem;\n"])));
29
66
  var StyledTimelineTitle = (0, styled_1.default)(timeline_title_1.default, {
30
67
  shouldForwardProp: function (prop) { return prop !== 'isMobile'; },
31
- })(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n flex-grow: 1;\n color: black;\n font-size: ", ";\n font-weight: bold;\n"], ["\n flex-grow: 1;\n color: black;\n font-size: ", ";\n font-weight: bold;\n"])), function (_a) {
68
+ })(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n flex-grow: 1;\n color: black;\n font-size: ", ";\n font-weight: bold;\n"], ["\n flex-grow: 1;\n color: black;\n font-size: ", ";\n font-weight: bold;\n"])), function (_a) {
32
69
  var isMobile = _a.isMobile;
33
70
  return (isMobile ? 'medium' : 'large');
34
71
  });
35
- var StyledTimelineDescription = (0, styled_1.default)(timeline_description_1.default)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n color: black;\n font-size: small;\n"], ["\n color: black;\n font-size: small;\n"])));
72
+ var StyledTimelineDescription = (0, styled_1.default)(timeline_description_1.default)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n color: black;\n font-size: small;\n"], ["\n color: black;\n font-size: small;\n"])));
36
73
  var TimelineItem = function (_a) {
37
74
  var timelineItem = _a.timelineItem, domainResourceType = _a.domainResourceType;
38
75
  var width = (0, hooks_1.useWindowSize)().width;
@@ -42,8 +79,8 @@ var TimelineItem = function (_a) {
42
79
  }
43
80
  var domainResource = timelineItem.domainResource, buttonState = timelineItem.buttonState;
44
81
  var itemKey = "timelineItem_".concat(domainResource.id);
45
- return ((0, jsx_runtime_1.jsxs)(StyledTimelineItem, { isSelected: buttonState === 'selected-button', children: [(0, jsx_runtime_1.jsxs)(StyledTimelineItemTop, { children: [(0, jsx_runtime_1.jsx)(StyledTimelineTitle, { isMobile: isMobile, domainResource: domainResource, domainResourceType: domainResourceType }), isMobile && ((0, jsx_runtime_1.jsx)(StyledTimelineTime, { domainResource: timelineItem.domainResource, domainResourceType: domainResourceType }))] }), (0, jsx_runtime_1.jsx)(StyledTimelineItemMiddle, { children: (0, jsx_runtime_1.jsx)(StyledTimelineDescription, { domainResource: timelineItem.domainResource, domainResourceType: domainResourceType }) }), (0, jsx_runtime_1.jsx)(StyledTimelineItemBottom, { children: (0, jsx_runtime_1.jsx)(StyledTimelineAuthor, { domainResource: timelineItem.domainResource, domainResourceType: domainResourceType }) }), (0, jsx_runtime_1.jsx)(timeline_button_1.default, { timelineItem: timelineItem })] }, itemKey));
82
+ return ((0, jsx_runtime_1.jsxs)(StyledTimelineItem, { isSelected: buttonState === 'selected-button', children: [(0, jsx_runtime_1.jsxs)(StyledTimelineItemTop, { children: [(0, jsx_runtime_1.jsx)(StyledTimelineTitle, { isMobile: isMobile, domainResource: domainResource, domainResourceType: domainResourceType }), isMobile && ((0, jsx_runtime_1.jsx)(StyledTimelineTime, { domainResource: timelineItem.domainResource, domainResourceType: domainResourceType }))] }), (0, jsx_runtime_1.jsx)(StyledTimelineItemMiddle, { children: (0, jsx_runtime_1.jsx)(StyledTimelineDescription, { domainResource: timelineItem.domainResource, domainResourceType: domainResourceType }) }), (0, jsx_runtime_1.jsx)(StyledTimelineItemBottom, { children: (0, jsx_runtime_1.jsx)(StyledTimelineAuthor, { domainResource: timelineItem.domainResource, domainResourceType: domainResourceType }) }), (0, jsx_runtime_1.jsx)(StyledTimelineCountersignature, { children: (0, jsx_runtime_1.jsx)(StyledCountersignatureIconAndStatus, __assign({}, (0, countersignature_1.GetCountersignaturePropsFromTimelineItem)(timelineItem.domainResource, domainResourceType), { clickHandler: timelineItem.countersignatureClickHandler })) }), (0, jsx_runtime_1.jsx)(timeline_button_1.default, { timelineItem: timelineItem })] }, itemKey));
46
83
  };
47
84
  exports.default = TimelineItem;
48
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;
85
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10;
49
86
  //# sourceMappingURL=timeline-item.js.map
package/lib/molecules/timeline-item.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"timeline-item.js","sourceRoot":"","sources":["../../src/molecules/timeline-item.tsx"],"names":[],"mappings":";;;;;;;;;;AACA,2DAAoC;AACpC,6CAA2E;AAQ3E,2CAAiD;AACjD,2CAAgD;AAChD,uFAA+D;AAC/D,6EAAqD;AACrD,2EAAmD;AACnD,yEAAiD;AACjD,6EAAqD;AAErD,IAAM,kBAAkB,GAAG,gBAAM,CAAC,GAAG,0HAAqB,wBACpC,EAAgF,6BAErG,KAFqB,UAAC,EAAc;QAAZ,UAAU,gBAAA;IAAO,OAAA,CAAC,UAAU,CAAC,CAAC,CAAC,wBAAe,CAAC,KAAK,CAAC,CAAC,CAAC,8BAAqB,CAAC;AAA5D,CAA4D,CAErG,CAAA;AAED,IAAM,oBAAoB,GAAG,IAAA,gBAAM,EAAC,yBAAc,CAAC,kHAAA,+CAGlD,IAAA,CAAA;AAED,IAAM,kBAAkB,GAAG,IAAA,gBAAM,EAAC,uBAAY,CAAC,wFAAA,qBAE9C,IAAA,CAAA;AAED,IAAM,qBAAqB,GAAG,gBAAM,CAAC,GAAG,yJAAA,sFAKvC,IAAA,CAAA;AAED,IAAM,wBAAwB,GAAG,gBAAM,CAAC,GAAG,oIAAA,iEAI1C,IAAA,CAAA;AAED,IAAM,wBAAwB,GAAG,gBAAM,CAAC,GAAG,4HAAA,yDAI1C,IAAA,CAAA;AAED,IAAM,mBAAmB,GAAG,IAAA,gBAAM,EAAC,wBAAa,EAAE;IAChD,iBAAiB,EAAE,UAAC,IAAI,IAAK,OAAA,IAAI,KAAK,UAAU,EAAnB,CAAmB;CACjD,CAAC,mJAAe,mDAGF,EAAiD,2BAE/D,KAFc,UAAC,EAAY;QAAV,QAAQ,cAAA;IAAO,OAAA,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC;AAA/B,CAA+B,CAE/D,CAAA;AAED,IAAM,yBAAyB,GAAG,IAAA,gBAAM,EAAC,8BAAmB,CAAC,6GAAA,0CAG5D,IAAA,CAAA;AAED,IAAM,YAAY,GAAe,UAAC,EAAoC;QAAlC,YAAY,kBAAA,EAAE,kBAAkB,wBAAA;IAC1D,IAAA,KAAK,GAAK,IAAA,qBAAa,GAAE,MAApB,CAAoB;IACjC,IAAM,QAAQ,GAAG,IAAA,oBAAY,EAAC,KAAK,CAAC,CAAA;IAEpC,IAAI,CAAC,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,cAAc,CAAA,EAAE,CAAC;QAClC,OAAO,kDAAK,CAAA;IACd,CAAC;IAEO,IAAA,cAAc,GAAkB,YAAY,eAA9B,EAAE,WAAW,GAAK,YAAY,YAAjB,CAAiB;IAEpD,IAAM,OAAO,GAAG,uBAAgB,cAAc,CAAC,EAAE,CAAE,CAAA;IAEnD,OAAO,CACL,wBAAC,kBAAkB,IAAC,UAAU,EAAE,WAAW,KAAK,iBAAiB,aAC/D,wBAAC,qBAAqB,eACpB,uBAAC,mBAAmB,IAClB,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,kBAAkB,EAAE,kBAAkB,GACtC,EACD,QAAQ,IAAI,CACX,uBAAC,kBAAkB,IAAC,cAAc,EAAE,YAAY,CAAC,cAAc,EAAE,kBAAkB,EAAE,kBAAkB,GAAI,CAC5G,IACqB,EAExB,uBAAC,wBAAwB,cACvB,uBAAC,yBAAyB,IACxB,cAAc,EAAE,YAAY,CAAC,cAAc,EAC3C,kBAAkB,EAAE,kBAAkB,GACtC,GACuB,EAE3B,uBAAC,wBAAwB,cACvB,uBAAC,oBAAoB,IAAC,cAAc,EAAE,YAAY,CAAC,cAAc,EAAE,kBAAkB,EAAE,kBAAkB,GAAI,GACpF,EAE3B,uBAAC,yBAAc,IAAC,YAAY,EAAE,YAAY,GAAI,KAvBwB,OAAO,CAwB1D,CACtB,CAAA;AACH,CAAC,CAAA;AAyBD,kBAAe,YAAY,CAAA"}
1
+ {"version":3,"file":"timeline-item.js","sourceRoot":"","sources":["../../src/molecules/timeline-item.tsx"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ltht-react/timeline",
3
- "version": "2.0.198",
3
+ "version": "2.0.200",
4
4
  "description": "> TODO: description",
5
5
  "author": "Jonny Dyson",
6
6
  "homepage": "",
@@ -24,16 +24,17 @@
24
24
  },
25
25
  "dependencies": {
26
26
  "@emotion/styled": "^11.0.0",
27
- "@ltht-react/banner": "^2.0.198",
28
- "@ltht-react/button": "^2.0.198",
29
- "@ltht-react/hooks": "^2.0.198",
30
- "@ltht-react/icon": "^2.0.198",
31
- "@ltht-react/select": "^2.0.198",
32
- "@ltht-react/styles": "^2.0.198",
33
- "@ltht-react/types": "^2.0.198",
34
- "@ltht-react/utils": "^2.0.198",
27
+ "@ltht-react/banner": "^2.0.200",
28
+ "@ltht-react/button": "^2.0.200",
29
+ "@ltht-react/countersignature": "^2.0.200",
30
+ "@ltht-react/hooks": "^2.0.200",
31
+ "@ltht-react/icon": "^2.0.200",
32
+ "@ltht-react/select": "^2.0.200",
33
+ "@ltht-react/styles": "^2.0.200",
34
+ "@ltht-react/types": "^2.0.200",
35
+ "@ltht-react/utils": "^2.0.200",
35
36
  "html-react-parser": "^5.0.6",
36
37
  "react": "^18.2.0"
37
38
  },
38
- "gitHead": "c7731510acff36963dbb25779862543886ab39da"
39
+ "gitHead": "9212c67eff361deff55fac5de3869501276fe5a8"
39
40
  }
package/src/molecules/timeline-item.tsx CHANGED
@@ -10,6 +10,9 @@ import {
10
10
  } from '@ltht-react/types'
11
11
  import { useWindowSize } from '@ltht-react/hooks'
12
12
  import { isMobileView } from '@ltht-react/utils'
13
+ import CountersignatureIconAndStatusBadge, {
14
+ GetCountersignaturePropsFromTimelineItem,
15
+ } from '@ltht-react/countersignature'
13
16
  import TimelineDescription from '../atoms/timeline-description'
14
17
  import TimelineAuthor from '../atoms/timeline-author'
15
18
  import TimelineTitle from '../atoms/timeline-title'
@@ -26,6 +29,11 @@ const StyledTimelineAuthor = styled(TimelineAuthor)`
26
29
  margin-bottom: 0.5rem;
27
30
  `
28
31
 
32
+ const StyledCountersignatureIconAndStatus = styled(CountersignatureIconAndStatusBadge)`
33
+ flex-grow: 1;
34
+ margin-bottom: 0.5rem;
35
+ `
36
+
29
37
  const StyledTimelineTime = styled(TimelineTime)`
30
38
  color: black;
31
39
  `
@@ -43,6 +51,11 @@ const StyledTimelineItemMiddle = styled.div`
43
51
  margin: 0.5rem;
44
52
  `
45
53
 
54
+ const StyledTimelineCountersignature = styled.div`
55
+ color: black;
56
+ margin: 0.5rem;
57
+ `
58
+
46
59
  const StyledTimelineItemBottom = styled.div`
47
60
  color: grey;
48
61
  display: flex;
@@ -87,18 +100,21 @@ const TimelineItem: FC<IProps> = ({ timelineItem, domainResourceType }) => {
87
100
  <StyledTimelineTime domainResource={timelineItem.domainResource} domainResourceType={domainResourceType} />
88
101
  )}
89
102
  </StyledTimelineItemTop>
90
-
91
103
  <StyledTimelineItemMiddle>
92
104
  <StyledTimelineDescription
93
105
  domainResource={timelineItem.domainResource}
94
106
  domainResourceType={domainResourceType}
95
107
  />
96
108
  </StyledTimelineItemMiddle>
97
-
98
109
  <StyledTimelineItemBottom>
99
110
  <StyledTimelineAuthor domainResource={timelineItem.domainResource} domainResourceType={domainResourceType} />
100
111
  </StyledTimelineItemBottom>
101
-
112
+ <StyledTimelineCountersignature>
113
+ <StyledCountersignatureIconAndStatus
114
+ {...GetCountersignaturePropsFromTimelineItem(timelineItem.domainResource, domainResourceType)}
115
+ clickHandler={timelineItem.countersignatureClickHandler}
116
+ />
117
+ </StyledTimelineCountersignature>
102
118
  <TimelineButton timelineItem={timelineItem} />
103
119
  </StyledTimelineItem>
104
120
  )
@@ -115,6 +131,7 @@ export interface ITimelineItem {
115
131
  itemClickHandler?(): void
116
132
  pointInTimeClickHandler?: (date: Date) => void
117
133
  buttonText?: string
134
+ countersignatureClickHandler?(): void
118
135
  }
119
136
 
120
137
  type TimeLineItemButtonState = 'no-button' | 'selectable-button' | 'selected-button' | 'permission-denied-button'