@laerdal/life-react-components 6.0.0-dev.27.full → 6.0.0-dev.30

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 (50) hide show
  1. package/README.md +42 -0
  2. package/dist/Button/Button.cjs +469 -0
  3. package/dist/Button/Button.cjs.map +1 -0
  4. package/dist/Button/Button.d.ts +70 -0
  5. package/dist/Button/Button.js +461 -0
  6. package/dist/Button/Button.js.map +1 -0
  7. package/dist/Card/HorizontalCard/__tests__/VerticalCard.test.tsx +124 -0
  8. package/dist/Card/VerticalCard/Card.cjs +187 -0
  9. package/dist/Card/VerticalCard/Card.cjs.map +1 -0
  10. package/dist/Card/VerticalCard/Card.d.ts +25 -0
  11. package/dist/Card/VerticalCard/Card.js +178 -0
  12. package/dist/Card/VerticalCard/Card.js.map +1 -0
  13. package/dist/Card/VerticalCard/CardBottomSection.cjs +261 -0
  14. package/dist/Card/VerticalCard/CardBottomSection.cjs.map +1 -0
  15. package/dist/Card/VerticalCard/CardBottomSection.d.ts +53 -0
  16. package/dist/Card/VerticalCard/CardBottomSection.js +252 -0
  17. package/dist/Card/VerticalCard/CardBottomSection.js.map +1 -0
  18. package/dist/Card/VerticalCard/CardMiddleSection.cjs +145 -0
  19. package/dist/Card/VerticalCard/CardMiddleSection.cjs.map +1 -0
  20. package/dist/Card/VerticalCard/CardMiddleSection.d.ts +42 -0
  21. package/dist/Card/VerticalCard/CardMiddleSection.js +136 -0
  22. package/dist/Card/VerticalCard/CardMiddleSection.js.map +1 -0
  23. package/dist/Card/VerticalCard/CardTopSection.cjs +165 -0
  24. package/dist/Card/VerticalCard/CardTopSection.cjs.map +1 -0
  25. package/dist/Card/VerticalCard/CardTopSection.d.ts +45 -0
  26. package/dist/Card/VerticalCard/CardTopSection.js +156 -0
  27. package/dist/Card/VerticalCard/CardTopSection.js.map +1 -0
  28. package/dist/Card/__tests__/Card.test.tsx +146 -0
  29. package/dist/Footer/Components/FooterNewsletterAndSocialSection.cjs +0 -1
  30. package/dist/Footer/Components/FooterNewsletterAndSocialSection.cjs.map +1 -1
  31. package/dist/Footer/Components/FooterNewsletterAndSocialSection.js +0 -1
  32. package/dist/Footer/Components/FooterNewsletterAndSocialSection.js.map +1 -1
  33. package/dist/Footer/Components/FooterTop.cjs.map +1 -1
  34. package/dist/Footer/Components/FooterTop.js.map +1 -1
  35. package/dist/InputFields/RichTextField.cjs +3 -2
  36. package/dist/InputFields/RichTextField.cjs.map +1 -1
  37. package/dist/InputFields/RichTextField.d.ts +4 -5
  38. package/dist/InputFields/RichTextField.js +2 -1
  39. package/dist/InputFields/RichTextField.js.map +1 -1
  40. package/dist/InputFields/TextField.cjs +2 -5
  41. package/dist/InputFields/TextField.cjs.map +1 -1
  42. package/dist/InputFields/TextField.d.ts +0 -8
  43. package/dist/InputFields/TextField.js +2 -5
  44. package/dist/InputFields/TextField.js.map +1 -1
  45. package/dist/InputFields/styling.cjs +1 -4
  46. package/dist/InputFields/styling.cjs.map +1 -1
  47. package/dist/InputFields/styling.d.ts +0 -1
  48. package/dist/InputFields/styling.js +1 -4
  49. package/dist/InputFields/styling.js.map +1 -1
  50. package/package.json +148 -152
@@ -0,0 +1,261 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.default = exports.CardBottomSectionProgressStyles = exports.CardBottomSectionNotesStyles = exports.CardBottomSectionNoteRightStyles = exports.CardBottomSectionNoteLeftStyles = exports.CardBottomSectionDivider = exports.CardBottomSectionContainer = exports.CardBottomSectionButtonRowContainerStyles = exports.CardBottomSectionAuthorStyles = void 0;
8
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
9
+ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
10
+ var _propTypes = _interopRequireDefault(require("prop-types"));
11
+ var React = _interopRequireWildcard(require("react"));
12
+ var _styledComponents = _interopRequireWildcard(require("styled-components"));
13
+ var _index = require("../../index");
14
+ var _Button = require("../../Button");
15
+ var _jsxRuntime = require("react/jsx-runtime");
16
+ const _excluded = ["buttonText", "onClick"];
17
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
18
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
19
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
20
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
21
+ const CardBottomSectionProgressStyles = exports.CardBottomSectionProgressStyles = _styledComponents.default.div`
22
+ padding: 8px 0;
23
+ `;
24
+ const CardBottomSectionNotesStyles = exports.CardBottomSectionNotesStyles = _styledComponents.default.div`
25
+ height: 48px;
26
+ position: relative;
27
+ color: ${props => _index.COLORS.generateToken({
28
+ componentType: 'text',
29
+ defaultVariant: 'subtle'
30
+ }, props.theme)};
31
+ display: flex;
32
+ flex-direction: row;
33
+ align-items: center;
34
+ `;
35
+ const CardBottomSectionAuthorStyles = exports.CardBottomSectionAuthorStyles = _styledComponents.default.div`
36
+ display: flex;
37
+ flex-direction: row;
38
+ align-items: center;
39
+ height: 48px;
40
+
41
+ div:first-child {
42
+ flex-grow: 2;
43
+ }
44
+
45
+ svg, img {
46
+ width: 80px;
47
+ flex-grow: 0;
48
+ flex-shrink: 0;
49
+ }
50
+
51
+ ${props => props.$disabled ? `
52
+ color: ${_index.COLORS.generateToken({
53
+ componentType: 'text',
54
+ state: 'disabled'
55
+ }, props.theme)};
56
+ svg, img {
57
+ filter: grayscale(100%);
58
+ }
59
+
60
+ ` : ''}
61
+ `;
62
+ const CardBottomSectionDivider = exports.CardBottomSectionDivider = _styledComponents.default.div`
63
+ border-top: 1px;
64
+ border-top-color: ${props => _index.COLORS.generateToken({
65
+ componentType: 'border',
66
+ defaultVariant: 'subtle'
67
+ }, props.theme)};
68
+ border-top-style: solid;
69
+ width: 100%;
70
+ `;
71
+ const CardBottomSectionNoteLeftStyles = exports.CardBottomSectionNoteLeftStyles = _styledComponents.default.div`
72
+ position: absolute;
73
+ left: 0px;
74
+ display: flex;
75
+ flex-direction: row;
76
+ align-items: center;
77
+
78
+ svg {
79
+ margin-right: 4px;
80
+ flex-grow: 0;
81
+ flex-shrink: 0;
82
+ }
83
+ `;
84
+ const CardBottomSectionNoteRightStyles = exports.CardBottomSectionNoteRightStyles = _styledComponents.default.div`
85
+ position: absolute;
86
+ right: 0px;
87
+ display: flex;
88
+ flex-direction: row;
89
+ align-items: center;
90
+
91
+ svg {
92
+ margin-right: 4px;
93
+ flex-grow: 0;
94
+ flex-shrink: 0;
95
+ }
96
+ `;
97
+ const CardBottomSectionButtonRowContainerStyles = exports.CardBottomSectionButtonRowContainerStyles = _styledComponents.default.div`
98
+ display: flex;
99
+ flex-direction: row;
100
+ justify-content: flex-end;
101
+ align-items: center;
102
+ border-top: 1px;
103
+ border-top-color: ${props => _index.COLORS.generateToken({
104
+ componentType: 'border',
105
+ defaultVariant: 'subtle'
106
+ }, props.theme)};
107
+ border-top-style: solid;
108
+
109
+ button:last-child {
110
+ margin: 8px 0px 0px 0px;
111
+ }
112
+
113
+ .card-bottom-section-action-button {
114
+ z-index: 2000;
115
+ }
116
+
117
+ button:not(:last-child) {
118
+ margin: 8px 0px 0px 0px;
119
+ }
120
+
121
+ .card-bottom-section-action-button {
122
+ z-index: 2000;
123
+ }
124
+
125
+ svg {
126
+ color: ${props => _index.COLORS.generateToken({
127
+ componentType: 'icon',
128
+ defaultVariant: 'subtle'
129
+ }, props.theme)};
130
+ }
131
+ `;
132
+ const CardBottomSectionContainer = exports.CardBottomSectionContainer = _styledComponents.default.div`
133
+ padding: 0px 16px 8px 16px;
134
+ width: calc(100% - 32px);
135
+ `;
136
+ const LeftItemContainer = _styledComponents.default.div`
137
+ flex: 1
138
+ `;
139
+ const RightItemContainer = _styledComponents.default.div`
140
+ display: flex;
141
+ flex-direction: row;
142
+ justify-content: flex-end;
143
+ color: ${props => _index.COLORS.getColor('neutral_600', props.theme)};
144
+ `;
145
+ const CardBottomSection = /*#__PURE__*/React.forwardRef((_ref, ref) => {
146
+ let {
147
+ progressLevel,
148
+ progressMax,
149
+ progressType = _index.LinearProgressType.Line,
150
+ noteLeft,
151
+ noteLeftIcon,
152
+ noteRight,
153
+ noteRightIcon,
154
+ leftButton,
155
+ authorName,
156
+ logo,
157
+ actions,
158
+ disabled
159
+ } = _ref;
160
+ const [elRefs, setElRefs] = React.useState([]);
161
+ const theme = (0, _styledComponents.useTheme)();
162
+ const length = actions?.length || 0;
163
+ React.useEffect(() => {
164
+ setElRefs(Array((length || 0) + (leftButton ? 1 : 0)).fill(null).map(() => /*#__PURE__*/React.createRef()));
165
+ }, [length, leftButton]);
166
+ React.useImperativeHandle(ref, () => elRefs, [elRefs]);
167
+ const haveAtLeastSomething = progressLevel != undefined || noteLeft || noteLeftIcon || noteRight || noteRightIcon || authorName || leftButton;
168
+ const renderLeftButton = () => {
169
+ if (leftButton) {
170
+ const {
171
+ buttonText,
172
+ onClick
173
+ } = leftButton,
174
+ rest = (0, _objectWithoutProperties2.default)(leftButton, _excluded);
175
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.Button, _objectSpread(_objectSpread({
176
+ className: "card-bottom-section-action-button",
177
+ ref: elRefs[0],
178
+ size: leftButton.size && [_index.Size.XSmall, _index.Size.XSmall, _index.Size.XXSmall].includes(leftButton.size) ? _index.Size.Small : leftButton.size == _index.Size.Large ? _index.Size.Large : _index.Size.Medium
179
+ }, rest), {}, {
180
+ onClick: e => {
181
+ e.stopPropagation();
182
+ onClick && onClick(e);
183
+ },
184
+ children: buttonText
185
+ }));
186
+ }
187
+ };
188
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(CardBottomSectionContainer, {
189
+ "data-testid": 'card-bottomSection',
190
+ children: [haveAtLeastSomething && /*#__PURE__*/(0, _jsxRuntime.jsx)(CardBottomSectionDivider, {}), progressLevel != undefined && /*#__PURE__*/(0, _jsxRuntime.jsx)(CardBottomSectionProgressStyles, {
191
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.LinearProgress, {
192
+ size: _index.Size.Small,
193
+ type: progressType,
194
+ variant: _index.LinearProgressVariant.Normal,
195
+ value: progressLevel,
196
+ max: progressMax ?? progressLevel
197
+ })
198
+ }), (noteLeft || noteLeftIcon || noteRight || noteRightIcon) && /*#__PURE__*/(0, _jsxRuntime.jsxs)(CardBottomSectionNotesStyles, {
199
+ children: [(noteLeft || noteLeftIcon) && /*#__PURE__*/(0, _jsxRuntime.jsxs)(CardBottomSectionNoteLeftStyles, {
200
+ children: [noteLeftIcon, /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ComponentXXS, {
201
+ color: _index.COLORS.generateToken({
202
+ componentType: 'icon',
203
+ defaultVariant: 'subtle'
204
+ }, theme),
205
+ textStyle: _index.ComponentTextStyle.Bold,
206
+ children: noteLeft
207
+ })]
208
+ }), (noteRight || noteRightIcon) && /*#__PURE__*/(0, _jsxRuntime.jsxs)(CardBottomSectionNoteRightStyles, {
209
+ children: [noteRightIcon, /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ComponentXXS, {
210
+ color: _index.COLORS.generateToken({
211
+ componentType: 'icon',
212
+ defaultVariant: 'subtle'
213
+ }, theme),
214
+ textStyle: _index.ComponentTextStyle.Bold,
215
+ children: noteRight
216
+ })]
217
+ })]
218
+ }), (authorName || logo) && /*#__PURE__*/(0, _jsxRuntime.jsxs)(CardBottomSectionAuthorStyles, {
219
+ $disabled: disabled,
220
+ "data-testid": 'card-bottomSection-author',
221
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ComponentXXS, {
222
+ children: authorName
223
+ }), logo]
224
+ }), (actions || leftButton) && /*#__PURE__*/(0, _jsxRuntime.jsxs)(CardBottomSectionButtonRowContainerStyles, {
225
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(LeftItemContainer, {
226
+ children: leftButton && renderLeftButton()
227
+ }), actions && /*#__PURE__*/(0, _jsxRuntime.jsx)(RightItemContainer, {
228
+ children: actions.map((x, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, {
229
+ ref: elRefs[index + (leftButton ? 1 : 0)],
230
+ className: "card-bottom-section-action-button",
231
+ "z-index": 2000,
232
+ disabled: disabled,
233
+ variant: x.variant ?? "secondary",
234
+ shape: "circular",
235
+ action: e => {
236
+ x.onClick();
237
+ },
238
+ children: x.icon
239
+ }, index))
240
+ })]
241
+ })]
242
+ });
243
+ });
244
+ CardBottomSection.propTypes = {
245
+ progressLevel: _propTypes.default.number,
246
+ progressMax: _propTypes.default.number,
247
+ noteLeft: _propTypes.default.string,
248
+ noteLeftIcon: _propTypes.default.node,
249
+ noteRight: _propTypes.default.string,
250
+ noteRightIcon: _propTypes.default.node,
251
+ authorName: _propTypes.default.string,
252
+ actions: _propTypes.default.arrayOf(_propTypes.default.shape({
253
+ variant: _propTypes.default.oneOf(['primary', 'secondary']),
254
+ icon: _propTypes.default.node.isRequired,
255
+ onClick: _propTypes.default.func.isRequired
256
+ })),
257
+ logo: _propTypes.default.node,
258
+ disabled: _propTypes.default.bool
259
+ };
260
+ var _default = exports.default = CardBottomSection;
261
+ //# sourceMappingURL=CardBottomSection.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CardBottomSection.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_index","_Button","_jsxRuntime","_excluded","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","CardBottomSectionProgressStyles","exports","styled","div","CardBottomSectionNotesStyles","props","COLORS","generateToken","componentType","defaultVariant","theme","CardBottomSectionAuthorStyles","$disabled","state","CardBottomSectionDivider","CardBottomSectionNoteLeftStyles","CardBottomSectionNoteRightStyles","CardBottomSectionButtonRowContainerStyles","CardBottomSectionContainer","LeftItemContainer","RightItemContainer","getColor","CardBottomSection","forwardRef","_ref","ref","progressLevel","progressMax","progressType","LinearProgressType","Line","noteLeft","noteLeftIcon","noteRight","noteRightIcon","leftButton","authorName","logo","actions","disabled","elRefs","setElRefs","useState","useTheme","useEffect","Array","fill","map","createRef","useImperativeHandle","haveAtLeastSomething","undefined","renderLeftButton","buttonText","onClick","rest","_objectWithoutProperties2","jsx","Button","className","size","Size","XSmall","XXSmall","includes","Small","Large","Medium","stopPropagation","children","jsxs","LinearProgress","type","variant","LinearProgressVariant","Normal","value","max","ComponentXXS","color","textStyle","ComponentTextStyle","Bold","x","index","IconButton","shape","action","icon","propTypes","_propTypes","number","string","node","arrayOf","oneOf","isRequired","func","bool","_default"],"sources":["../../../src/Card/VerticalCard/CardBottomSection.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { useTheme } from 'styled-components';\r\nimport {\r\n COLORS,\r\n ComponentTextStyle,\r\n ComponentXXS,\r\n LinearProgress,\r\n LinearProgressType,\r\n LinearProgressVariant,\r\n Size,\r\n} from '../../index';\r\nimport { Button, ButtonProps, IconButton } from '../../Button';\r\n\r\nexport interface ActionItem {\r\n /** Optional. Variant of the action button, defaults to 'secondary'. */\r\n variant?: 'primary' | 'secondary';\r\n /** Icon to be used in the icon button. */\r\n icon: React.ReactNode;\r\n /** Click handler for the action button. */\r\n onClick: () => void;\r\n}\r\n\r\nexport type CardStandardButton = Pick<ButtonProps, 'width' | 'variant' | 'loading' | 'icon' | 'onClick' | 'disabled'> & {\r\n buttonText: string;\r\n size?: Size.Small | Size.Medium | Size.Large;\r\n}\r\n\r\nexport interface CardBottomSectionProps {\r\n /** Optional. Current progress level shown in the progress bar. */\r\n progressLevel?: number;\r\n /** Optional. Maximum level of progress in the progress bar. */\r\n progressMax?: number;\r\n /** Optional. Type of the progress bar. */\r\n progressType?: LinearProgressType;\r\n\r\n /** Optional. Note text shown on the left side of the section. */\r\n noteLeft?: string;\r\n /** Optional. Note icon shown on the left side of the section. */\r\n noteLeftIcon?: React.ReactNode;\r\n /** Optional. Note text shown on the right side of the section. */\r\n noteRight?: string;\r\n /** Optional. Note icon shown on the right side of the section. */\r\n noteRightIcon?: React.ReactNode;\r\n\r\n /** Optional. Note icon/Hyperlink/button shown on the left side of the section. */\r\n leftButton?: CardStandardButton;\r\n\r\n /** Author name shown at the bottom-left part of the section. */\r\n authorName?: string;\r\n /** Array of actions shown on the bottom-right corner of the section. */\r\n actions?: ActionItem[];\r\n /** Logo shown on the right side of the section, in front of AuthorName. */\r\n logo?: React.ReactNode;\r\n /** This property is set by Card component itself and is based on 'disabled' flag of CardProps. */\r\n disabled?: boolean;\r\n}\r\n\r\nexport const CardBottomSectionProgressStyles = styled.div`\r\n padding: 8px 0;\r\n`;\r\n\r\nexport const CardBottomSectionNotesStyles = styled.div`\r\n height: 48px;\r\n position: relative;\r\n color: ${props => COLORS.generateToken({ componentType:'text', defaultVariant:'subtle' }, props.theme)};\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n`;\r\n\r\nexport const CardBottomSectionAuthorStyles = styled.div<{ $disabled?: boolean }>`\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n height: 48px;\r\n\r\n div:first-child {\r\n flex-grow: 2;\r\n }\r\n\r\n svg, img {\r\n width: 80px;\r\n flex-grow: 0;\r\n flex-shrink: 0;\r\n }\r\n\r\n ${props => props.$disabled ? `\r\n color: ${COLORS.generateToken({ componentType: 'text', state: 'disabled' }, props.theme)};\r\n svg, img {\r\n filter: grayscale(100%);\r\n }\r\n \r\n ` : ''}\r\n`;\r\n\r\nexport const CardBottomSectionDivider = styled.div`\r\n border-top: 1px;\r\n border-top-color: ${props => COLORS.generateToken({componentType:'border', defaultVariant:'subtle'}, props.theme)};\r\n border-top-style: solid;\r\n width: 100%;\r\n`;\r\n\r\nexport const CardBottomSectionNoteLeftStyles = styled.div`\r\n position: absolute;\r\n left: 0px;\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n\r\n svg {\r\n margin-right: 4px;\r\n flex-grow: 0;\r\n flex-shrink: 0;\r\n }\r\n`;\r\n\r\nexport const CardBottomSectionNoteRightStyles = styled.div`\r\n position: absolute;\r\n right: 0px;\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n\r\n svg {\r\n margin-right: 4px;\r\n flex-grow: 0;\r\n flex-shrink: 0;\r\n }\r\n`;\r\n\r\nexport const CardBottomSectionButtonRowContainerStyles = styled.div`\r\n display: flex;\r\n flex-direction: row;\r\n justify-content: flex-end;\r\n align-items: center;\r\n border-top: 1px;\r\n border-top-color: ${props => COLORS.generateToken({componentType:'border', defaultVariant:'subtle'}, props.theme)};\r\n border-top-style: solid;\r\n\r\n button:last-child {\r\n margin: 8px 0px 0px 0px;\r\n }\r\n\r\n .card-bottom-section-action-button {\r\n z-index: 2000;\r\n }\r\n\r\n button:not(:last-child) {\r\n margin: 8px 0px 0px 0px;\r\n }\r\n\r\n .card-bottom-section-action-button {\r\n z-index: 2000;\r\n }\r\n\r\n svg {\r\n color: ${props => COLORS.generateToken({componentType:'icon', defaultVariant:'subtle' }, props.theme)};\r\n }\r\n`;\r\n\r\nexport const CardBottomSectionContainer = styled.div`\r\n padding: 0px 16px 8px 16px;\r\n width: calc(100% - 32px);\r\n`;\r\n\r\nconst LeftItemContainer = styled.div`\r\n flex: 1\r\n`;\r\n\r\nconst RightItemContainer = styled.div`\r\n display: flex;\r\n flex-direction: row;\r\n justify-content: flex-end;\r\n color: ${props => COLORS.getColor('neutral_600', props.theme)};\r\n`;\r\n\r\nconst CardBottomSection = React.forwardRef(({\r\n progressLevel,\r\n progressMax,\r\n progressType = LinearProgressType.Line,\r\n noteLeft,\r\n noteLeftIcon,\r\n noteRight,\r\n noteRightIcon,\r\n leftButton,\r\n authorName,\r\n logo,\r\n actions,\r\n disabled\r\n}: CardBottomSectionProps,\r\n ref: React.Ref<React.RefObject<HTMLButtonElement | null>[]>) => {\r\n\r\n const [elRefs, setElRefs] = React.useState<React.RefObject<HTMLButtonElement | null>[]>([]);\r\n const theme = useTheme();\r\n const length = actions?.length || 0;\r\n\r\n React.useEffect(() => {\r\n setElRefs(Array((length || 0) + (leftButton ? 1 : 0)).fill(null).map(() => React.createRef<HTMLButtonElement>()));\r\n }, [length, leftButton]);\r\n\r\n React.useImperativeHandle(ref, () => elRefs, [elRefs]);\r\n\r\n const haveAtLeastSomething = progressLevel != undefined || noteLeft || noteLeftIcon || noteRight || noteRightIcon || authorName || leftButton;\r\n\r\n const renderLeftButton = () => {\r\n if (leftButton){\r\n const {buttonText, onClick, ...rest} = leftButton;\r\n return (<Button className=\"card-bottom-section-action-button\"\r\n ref={elRefs[0]}\r\n size={ leftButton.size && [Size.XSmall, Size.XSmall, Size.XXSmall].includes(leftButton.size) ? Size.Small: \r\n leftButton.size == Size.Large ? Size.Large : Size.Medium}\r\n {...rest}\r\n onClick={(e) => {\r\n e.stopPropagation();\r\n onClick && onClick(e);\r\n }}>\r\n {buttonText}\r\n </Button>)\r\n }\r\n}\r\n\r\n return (\r\n <CardBottomSectionContainer data-testid={'card-bottomSection'}>\r\n {haveAtLeastSomething && <CardBottomSectionDivider/>}\r\n {progressLevel != undefined && <CardBottomSectionProgressStyles>\r\n <LinearProgress size={Size.Small}\r\n type={progressType}\r\n variant={LinearProgressVariant.Normal}\r\n value={progressLevel}\r\n max={progressMax ?? progressLevel}/>\r\n </CardBottomSectionProgressStyles>}\r\n\r\n {(noteLeft || noteLeftIcon || noteRight || noteRightIcon) && <CardBottomSectionNotesStyles>\r\n {(noteLeft || noteLeftIcon) && (\r\n <CardBottomSectionNoteLeftStyles>\r\n {noteLeftIcon}\r\n <ComponentXXS color={COLORS.generateToken({componentType:'icon', defaultVariant:'subtle'}, theme)} textStyle={ComponentTextStyle.Bold}>{noteLeft}</ComponentXXS>\r\n </CardBottomSectionNoteLeftStyles>\r\n )}\r\n {(noteRight || noteRightIcon) && (\r\n <CardBottomSectionNoteRightStyles>\r\n {noteRightIcon}\r\n <ComponentXXS color={COLORS.generateToken({componentType:'icon', defaultVariant:'subtle'}, theme)} textStyle={ComponentTextStyle.Bold}>{noteRight}</ComponentXXS>\r\n </CardBottomSectionNoteRightStyles>\r\n )}\r\n </CardBottomSectionNotesStyles>}\r\n\r\n {(authorName || logo) && <CardBottomSectionAuthorStyles $disabled={disabled} data-testid={'card-bottomSection-author'}>\r\n <ComponentXXS>{authorName}</ComponentXXS>\r\n {logo}\r\n </CardBottomSectionAuthorStyles>}\r\n\r\n {(actions || leftButton) && <CardBottomSectionButtonRowContainerStyles>\r\n <LeftItemContainer>\r\n {leftButton && renderLeftButton()}\r\n </LeftItemContainer>\r\n\r\n { actions && <RightItemContainer>{actions.map((x, index) => (\r\n <IconButton ref={elRefs[index + (leftButton ? 1 : 0)]}\r\n className=\"card-bottom-section-action-button\"\r\n key={index}\r\n z-index={2000}\r\n disabled={disabled}\r\n variant={x.variant ?? \"secondary\"}\r\n shape=\"circular\"\r\n action={(e) => {\r\n x.onClick();\r\n }}>\r\n {x.icon}\r\n </IconButton>\r\n ))}\r\n </RightItemContainer>\r\n }\r\n </CardBottomSectionButtonRowContainerStyles>}\r\n </CardBottomSectionContainer>\r\n );\r\n});\r\n\r\nexport default CardBottomSection;\r\n"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,53 @@
1
+ import * as React from 'react';
2
+ import { LinearProgressType, Size } from '../../index';
3
+ import { ButtonProps } from '../../Button';
4
+ export interface ActionItem {
5
+ /** Optional. Variant of the action button, defaults to 'secondary'. */
6
+ variant?: 'primary' | 'secondary';
7
+ /** Icon to be used in the icon button. */
8
+ icon: React.ReactNode;
9
+ /** Click handler for the action button. */
10
+ onClick: () => void;
11
+ }
12
+ export type CardStandardButton = Pick<ButtonProps, 'width' | 'variant' | 'loading' | 'icon' | 'onClick' | 'disabled'> & {
13
+ buttonText: string;
14
+ size?: Size.Small | Size.Medium | Size.Large;
15
+ };
16
+ export interface CardBottomSectionProps {
17
+ /** Optional. Current progress level shown in the progress bar. */
18
+ progressLevel?: number;
19
+ /** Optional. Maximum level of progress in the progress bar. */
20
+ progressMax?: number;
21
+ /** Optional. Type of the progress bar. */
22
+ progressType?: LinearProgressType;
23
+ /** Optional. Note text shown on the left side of the section. */
24
+ noteLeft?: string;
25
+ /** Optional. Note icon shown on the left side of the section. */
26
+ noteLeftIcon?: React.ReactNode;
27
+ /** Optional. Note text shown on the right side of the section. */
28
+ noteRight?: string;
29
+ /** Optional. Note icon shown on the right side of the section. */
30
+ noteRightIcon?: React.ReactNode;
31
+ /** Optional. Note icon/Hyperlink/button shown on the left side of the section. */
32
+ leftButton?: CardStandardButton;
33
+ /** Author name shown at the bottom-left part of the section. */
34
+ authorName?: string;
35
+ /** Array of actions shown on the bottom-right corner of the section. */
36
+ actions?: ActionItem[];
37
+ /** Logo shown on the right side of the section, in front of AuthorName. */
38
+ logo?: React.ReactNode;
39
+ /** This property is set by Card component itself and is based on 'disabled' flag of CardProps. */
40
+ disabled?: boolean;
41
+ }
42
+ export declare const CardBottomSectionProgressStyles: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
43
+ export declare const CardBottomSectionNotesStyles: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
44
+ export declare const CardBottomSectionAuthorStyles: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
45
+ $disabled?: boolean;
46
+ }>> & string;
47
+ export declare const CardBottomSectionDivider: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
48
+ export declare const CardBottomSectionNoteLeftStyles: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
49
+ export declare const CardBottomSectionNoteRightStyles: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
50
+ export declare const CardBottomSectionButtonRowContainerStyles: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
51
+ export declare const CardBottomSectionContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
52
+ declare const CardBottomSection: React.ForwardRefExoticComponent<CardBottomSectionProps & React.RefAttributes<React.RefObject<HTMLButtonElement | null>[]>>;
53
+ export default CardBottomSection;
@@ -0,0 +1,252 @@
1
+ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
2
+ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
3
+ import _pt from "prop-types";
4
+ const _excluded = ["buttonText", "onClick"];
5
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
6
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
7
+ import * as React from 'react';
8
+ import styled, { useTheme } from 'styled-components';
9
+ import { COLORS, ComponentTextStyle, ComponentXXS, LinearProgress, LinearProgressType, LinearProgressVariant, Size } from '../../index';
10
+ import { Button, IconButton } from '../../Button';
11
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
12
+ export const CardBottomSectionProgressStyles = styled.div`
13
+ padding: 8px 0;
14
+ `;
15
+ export const CardBottomSectionNotesStyles = styled.div`
16
+ height: 48px;
17
+ position: relative;
18
+ color: ${props => COLORS.generateToken({
19
+ componentType: 'text',
20
+ defaultVariant: 'subtle'
21
+ }, props.theme)};
22
+ display: flex;
23
+ flex-direction: row;
24
+ align-items: center;
25
+ `;
26
+ export const CardBottomSectionAuthorStyles = styled.div`
27
+ display: flex;
28
+ flex-direction: row;
29
+ align-items: center;
30
+ height: 48px;
31
+
32
+ div:first-child {
33
+ flex-grow: 2;
34
+ }
35
+
36
+ svg, img {
37
+ width: 80px;
38
+ flex-grow: 0;
39
+ flex-shrink: 0;
40
+ }
41
+
42
+ ${props => props.$disabled ? `
43
+ color: ${COLORS.generateToken({
44
+ componentType: 'text',
45
+ state: 'disabled'
46
+ }, props.theme)};
47
+ svg, img {
48
+ filter: grayscale(100%);
49
+ }
50
+
51
+ ` : ''}
52
+ `;
53
+ export const CardBottomSectionDivider = styled.div`
54
+ border-top: 1px;
55
+ border-top-color: ${props => COLORS.generateToken({
56
+ componentType: 'border',
57
+ defaultVariant: 'subtle'
58
+ }, props.theme)};
59
+ border-top-style: solid;
60
+ width: 100%;
61
+ `;
62
+ export const CardBottomSectionNoteLeftStyles = styled.div`
63
+ position: absolute;
64
+ left: 0px;
65
+ display: flex;
66
+ flex-direction: row;
67
+ align-items: center;
68
+
69
+ svg {
70
+ margin-right: 4px;
71
+ flex-grow: 0;
72
+ flex-shrink: 0;
73
+ }
74
+ `;
75
+ export const CardBottomSectionNoteRightStyles = styled.div`
76
+ position: absolute;
77
+ right: 0px;
78
+ display: flex;
79
+ flex-direction: row;
80
+ align-items: center;
81
+
82
+ svg {
83
+ margin-right: 4px;
84
+ flex-grow: 0;
85
+ flex-shrink: 0;
86
+ }
87
+ `;
88
+ export const CardBottomSectionButtonRowContainerStyles = styled.div`
89
+ display: flex;
90
+ flex-direction: row;
91
+ justify-content: flex-end;
92
+ align-items: center;
93
+ border-top: 1px;
94
+ border-top-color: ${props => COLORS.generateToken({
95
+ componentType: 'border',
96
+ defaultVariant: 'subtle'
97
+ }, props.theme)};
98
+ border-top-style: solid;
99
+
100
+ button:last-child {
101
+ margin: 8px 0px 0px 0px;
102
+ }
103
+
104
+ .card-bottom-section-action-button {
105
+ z-index: 2000;
106
+ }
107
+
108
+ button:not(:last-child) {
109
+ margin: 8px 0px 0px 0px;
110
+ }
111
+
112
+ .card-bottom-section-action-button {
113
+ z-index: 2000;
114
+ }
115
+
116
+ svg {
117
+ color: ${props => COLORS.generateToken({
118
+ componentType: 'icon',
119
+ defaultVariant: 'subtle'
120
+ }, props.theme)};
121
+ }
122
+ `;
123
+ export const CardBottomSectionContainer = styled.div`
124
+ padding: 0px 16px 8px 16px;
125
+ width: calc(100% - 32px);
126
+ `;
127
+ const LeftItemContainer = styled.div`
128
+ flex: 1
129
+ `;
130
+ const RightItemContainer = styled.div`
131
+ display: flex;
132
+ flex-direction: row;
133
+ justify-content: flex-end;
134
+ color: ${props => COLORS.getColor('neutral_600', props.theme)};
135
+ `;
136
+ const CardBottomSection = /*#__PURE__*/React.forwardRef((_ref, ref) => {
137
+ let {
138
+ progressLevel,
139
+ progressMax,
140
+ progressType = LinearProgressType.Line,
141
+ noteLeft,
142
+ noteLeftIcon,
143
+ noteRight,
144
+ noteRightIcon,
145
+ leftButton,
146
+ authorName,
147
+ logo,
148
+ actions,
149
+ disabled
150
+ } = _ref;
151
+ const [elRefs, setElRefs] = React.useState([]);
152
+ const theme = useTheme();
153
+ const length = actions?.length || 0;
154
+ React.useEffect(() => {
155
+ setElRefs(Array((length || 0) + (leftButton ? 1 : 0)).fill(null).map(() => /*#__PURE__*/React.createRef()));
156
+ }, [length, leftButton]);
157
+ React.useImperativeHandle(ref, () => elRefs, [elRefs]);
158
+ const haveAtLeastSomething = progressLevel != undefined || noteLeft || noteLeftIcon || noteRight || noteRightIcon || authorName || leftButton;
159
+ const renderLeftButton = () => {
160
+ if (leftButton) {
161
+ const {
162
+ buttonText,
163
+ onClick
164
+ } = leftButton,
165
+ rest = _objectWithoutProperties(leftButton, _excluded);
166
+ return /*#__PURE__*/_jsx(Button, _objectSpread(_objectSpread({
167
+ className: "card-bottom-section-action-button",
168
+ ref: elRefs[0],
169
+ size: leftButton.size && [Size.XSmall, Size.XSmall, Size.XXSmall].includes(leftButton.size) ? Size.Small : leftButton.size == Size.Large ? Size.Large : Size.Medium
170
+ }, rest), {}, {
171
+ onClick: e => {
172
+ e.stopPropagation();
173
+ onClick && onClick(e);
174
+ },
175
+ children: buttonText
176
+ }));
177
+ }
178
+ };
179
+ return /*#__PURE__*/_jsxs(CardBottomSectionContainer, {
180
+ "data-testid": 'card-bottomSection',
181
+ children: [haveAtLeastSomething && /*#__PURE__*/_jsx(CardBottomSectionDivider, {}), progressLevel != undefined && /*#__PURE__*/_jsx(CardBottomSectionProgressStyles, {
182
+ children: /*#__PURE__*/_jsx(LinearProgress, {
183
+ size: Size.Small,
184
+ type: progressType,
185
+ variant: LinearProgressVariant.Normal,
186
+ value: progressLevel,
187
+ max: progressMax ?? progressLevel
188
+ })
189
+ }), (noteLeft || noteLeftIcon || noteRight || noteRightIcon) && /*#__PURE__*/_jsxs(CardBottomSectionNotesStyles, {
190
+ children: [(noteLeft || noteLeftIcon) && /*#__PURE__*/_jsxs(CardBottomSectionNoteLeftStyles, {
191
+ children: [noteLeftIcon, /*#__PURE__*/_jsx(ComponentXXS, {
192
+ color: COLORS.generateToken({
193
+ componentType: 'icon',
194
+ defaultVariant: 'subtle'
195
+ }, theme),
196
+ textStyle: ComponentTextStyle.Bold,
197
+ children: noteLeft
198
+ })]
199
+ }), (noteRight || noteRightIcon) && /*#__PURE__*/_jsxs(CardBottomSectionNoteRightStyles, {
200
+ children: [noteRightIcon, /*#__PURE__*/_jsx(ComponentXXS, {
201
+ color: COLORS.generateToken({
202
+ componentType: 'icon',
203
+ defaultVariant: 'subtle'
204
+ }, theme),
205
+ textStyle: ComponentTextStyle.Bold,
206
+ children: noteRight
207
+ })]
208
+ })]
209
+ }), (authorName || logo) && /*#__PURE__*/_jsxs(CardBottomSectionAuthorStyles, {
210
+ $disabled: disabled,
211
+ "data-testid": 'card-bottomSection-author',
212
+ children: [/*#__PURE__*/_jsx(ComponentXXS, {
213
+ children: authorName
214
+ }), logo]
215
+ }), (actions || leftButton) && /*#__PURE__*/_jsxs(CardBottomSectionButtonRowContainerStyles, {
216
+ children: [/*#__PURE__*/_jsx(LeftItemContainer, {
217
+ children: leftButton && renderLeftButton()
218
+ }), actions && /*#__PURE__*/_jsx(RightItemContainer, {
219
+ children: actions.map((x, index) => /*#__PURE__*/_jsx(IconButton, {
220
+ ref: elRefs[index + (leftButton ? 1 : 0)],
221
+ className: "card-bottom-section-action-button",
222
+ "z-index": 2000,
223
+ disabled: disabled,
224
+ variant: x.variant ?? "secondary",
225
+ shape: "circular",
226
+ action: e => {
227
+ x.onClick();
228
+ },
229
+ children: x.icon
230
+ }, index))
231
+ })]
232
+ })]
233
+ });
234
+ });
235
+ CardBottomSection.propTypes = {
236
+ progressLevel: _pt.number,
237
+ progressMax: _pt.number,
238
+ noteLeft: _pt.string,
239
+ noteLeftIcon: _pt.node,
240
+ noteRight: _pt.string,
241
+ noteRightIcon: _pt.node,
242
+ authorName: _pt.string,
243
+ actions: _pt.arrayOf(_pt.shape({
244
+ variant: _pt.oneOf(['primary', 'secondary']),
245
+ icon: _pt.node.isRequired,
246
+ onClick: _pt.func.isRequired
247
+ })),
248
+ logo: _pt.node,
249
+ disabled: _pt.bool
250
+ };
251
+ export default CardBottomSection;
252
+ //# sourceMappingURL=CardBottomSection.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CardBottomSection.js","names":["React","styled","useTheme","COLORS","ComponentTextStyle","ComponentXXS","LinearProgress","LinearProgressType","LinearProgressVariant","Size","Button","IconButton","jsx","_jsx","jsxs","_jsxs","CardBottomSectionProgressStyles","div","CardBottomSectionNotesStyles","props","generateToken","componentType","defaultVariant","theme","CardBottomSectionAuthorStyles","$disabled","state","CardBottomSectionDivider","CardBottomSectionNoteLeftStyles","CardBottomSectionNoteRightStyles","CardBottomSectionButtonRowContainerStyles","CardBottomSectionContainer","LeftItemContainer","RightItemContainer","getColor","CardBottomSection","forwardRef","_ref","ref","progressLevel","progressMax","progressType","Line","noteLeft","noteLeftIcon","noteRight","noteRightIcon","leftButton","authorName","logo","actions","disabled","elRefs","setElRefs","useState","length","useEffect","Array","fill","map","createRef","useImperativeHandle","haveAtLeastSomething","undefined","renderLeftButton","buttonText","onClick","rest","_objectWithoutProperties","_excluded","_objectSpread","className","size","XSmall","XXSmall","includes","Small","Large","Medium","e","stopPropagation","children","type","variant","Normal","value","max","color","textStyle","Bold","x","index","shape","action","icon","propTypes","_pt","number","string","node","arrayOf","oneOf","isRequired","func","bool"],"sources":["../../../src/Card/VerticalCard/CardBottomSection.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { useTheme } from 'styled-components';\r\nimport {\r\n COLORS,\r\n ComponentTextStyle,\r\n ComponentXXS,\r\n LinearProgress,\r\n LinearProgressType,\r\n LinearProgressVariant,\r\n Size,\r\n} from '../../index';\r\nimport { Button, ButtonProps, IconButton } from '../../Button';\r\n\r\nexport interface ActionItem {\r\n /** Optional. Variant of the action button, defaults to 'secondary'. */\r\n variant?: 'primary' | 'secondary';\r\n /** Icon to be used in the icon button. */\r\n icon: React.ReactNode;\r\n /** Click handler for the action button. */\r\n onClick: () => void;\r\n}\r\n\r\nexport type CardStandardButton = Pick<ButtonProps, 'width' | 'variant' | 'loading' | 'icon' | 'onClick' | 'disabled'> & {\r\n buttonText: string;\r\n size?: Size.Small | Size.Medium | Size.Large;\r\n}\r\n\r\nexport interface CardBottomSectionProps {\r\n /** Optional. Current progress level shown in the progress bar. */\r\n progressLevel?: number;\r\n /** Optional. Maximum level of progress in the progress bar. */\r\n progressMax?: number;\r\n /** Optional. Type of the progress bar. */\r\n progressType?: LinearProgressType;\r\n\r\n /** Optional. Note text shown on the left side of the section. */\r\n noteLeft?: string;\r\n /** Optional. Note icon shown on the left side of the section. */\r\n noteLeftIcon?: React.ReactNode;\r\n /** Optional. Note text shown on the right side of the section. */\r\n noteRight?: string;\r\n /** Optional. Note icon shown on the right side of the section. */\r\n noteRightIcon?: React.ReactNode;\r\n\r\n /** Optional. Note icon/Hyperlink/button shown on the left side of the section. */\r\n leftButton?: CardStandardButton;\r\n\r\n /** Author name shown at the bottom-left part of the section. */\r\n authorName?: string;\r\n /** Array of actions shown on the bottom-right corner of the section. */\r\n actions?: ActionItem[];\r\n /** Logo shown on the right side of the section, in front of AuthorName. */\r\n logo?: React.ReactNode;\r\n /** This property is set by Card component itself and is based on 'disabled' flag of CardProps. */\r\n disabled?: boolean;\r\n}\r\n\r\nexport const CardBottomSectionProgressStyles = styled.div`\r\n padding: 8px 0;\r\n`;\r\n\r\nexport const CardBottomSectionNotesStyles = styled.div`\r\n height: 48px;\r\n position: relative;\r\n color: ${props => COLORS.generateToken({ componentType:'text', defaultVariant:'subtle' }, props.theme)};\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n`;\r\n\r\nexport const CardBottomSectionAuthorStyles = styled.div<{ $disabled?: boolean }>`\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n height: 48px;\r\n\r\n div:first-child {\r\n flex-grow: 2;\r\n }\r\n\r\n svg, img {\r\n width: 80px;\r\n flex-grow: 0;\r\n flex-shrink: 0;\r\n }\r\n\r\n ${props => props.$disabled ? `\r\n color: ${COLORS.generateToken({ componentType: 'text', state: 'disabled' }, props.theme)};\r\n svg, img {\r\n filter: grayscale(100%);\r\n }\r\n \r\n ` : ''}\r\n`;\r\n\r\nexport const CardBottomSectionDivider = styled.div`\r\n border-top: 1px;\r\n border-top-color: ${props => COLORS.generateToken({componentType:'border', defaultVariant:'subtle'}, props.theme)};\r\n border-top-style: solid;\r\n width: 100%;\r\n`;\r\n\r\nexport const CardBottomSectionNoteLeftStyles = styled.div`\r\n position: absolute;\r\n left: 0px;\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n\r\n svg {\r\n margin-right: 4px;\r\n flex-grow: 0;\r\n flex-shrink: 0;\r\n }\r\n`;\r\n\r\nexport const CardBottomSectionNoteRightStyles = styled.div`\r\n position: absolute;\r\n right: 0px;\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n\r\n svg {\r\n margin-right: 4px;\r\n flex-grow: 0;\r\n flex-shrink: 0;\r\n }\r\n`;\r\n\r\nexport const CardBottomSectionButtonRowContainerStyles = styled.div`\r\n display: flex;\r\n flex-direction: row;\r\n justify-content: flex-end;\r\n align-items: center;\r\n border-top: 1px;\r\n border-top-color: ${props => COLORS.generateToken({componentType:'border', defaultVariant:'subtle'}, props.theme)};\r\n border-top-style: solid;\r\n\r\n button:last-child {\r\n margin: 8px 0px 0px 0px;\r\n }\r\n\r\n .card-bottom-section-action-button {\r\n z-index: 2000;\r\n }\r\n\r\n button:not(:last-child) {\r\n margin: 8px 0px 0px 0px;\r\n }\r\n\r\n .card-bottom-section-action-button {\r\n z-index: 2000;\r\n }\r\n\r\n svg {\r\n color: ${props => COLORS.generateToken({componentType:'icon', defaultVariant:'subtle' }, props.theme)};\r\n }\r\n`;\r\n\r\nexport const CardBottomSectionContainer = styled.div`\r\n padding: 0px 16px 8px 16px;\r\n width: calc(100% - 32px);\r\n`;\r\n\r\nconst LeftItemContainer = styled.div`\r\n flex: 1\r\n`;\r\n\r\nconst RightItemContainer = styled.div`\r\n display: flex;\r\n flex-direction: row;\r\n justify-content: flex-end;\r\n color: ${props => COLORS.getColor('neutral_600', props.theme)};\r\n`;\r\n\r\nconst CardBottomSection = React.forwardRef(({\r\n progressLevel,\r\n progressMax,\r\n progressType = LinearProgressType.Line,\r\n noteLeft,\r\n noteLeftIcon,\r\n noteRight,\r\n noteRightIcon,\r\n leftButton,\r\n authorName,\r\n logo,\r\n actions,\r\n disabled\r\n}: CardBottomSectionProps,\r\n ref: React.Ref<React.RefObject<HTMLButtonElement | null>[]>) => {\r\n\r\n const [elRefs, setElRefs] = React.useState<React.RefObject<HTMLButtonElement | null>[]>([]);\r\n const theme = useTheme();\r\n const length = actions?.length || 0;\r\n\r\n React.useEffect(() => {\r\n setElRefs(Array((length || 0) + (leftButton ? 1 : 0)).fill(null).map(() => React.createRef<HTMLButtonElement>()));\r\n }, [length, leftButton]);\r\n\r\n React.useImperativeHandle(ref, () => elRefs, [elRefs]);\r\n\r\n const haveAtLeastSomething = progressLevel != undefined || noteLeft || noteLeftIcon || noteRight || noteRightIcon || authorName || leftButton;\r\n\r\n const renderLeftButton = () => {\r\n if (leftButton){\r\n const {buttonText, onClick, ...rest} = leftButton;\r\n return (<Button className=\"card-bottom-section-action-button\"\r\n ref={elRefs[0]}\r\n size={ leftButton.size && [Size.XSmall, Size.XSmall, Size.XXSmall].includes(leftButton.size) ? Size.Small: \r\n leftButton.size == Size.Large ? Size.Large : Size.Medium}\r\n {...rest}\r\n onClick={(e) => {\r\n e.stopPropagation();\r\n onClick && onClick(e);\r\n }}>\r\n {buttonText}\r\n </Button>)\r\n }\r\n}\r\n\r\n return (\r\n <CardBottomSectionContainer data-testid={'card-bottomSection'}>\r\n {haveAtLeastSomething && <CardBottomSectionDivider/>}\r\n {progressLevel != undefined && <CardBottomSectionProgressStyles>\r\n <LinearProgress size={Size.Small}\r\n type={progressType}\r\n variant={LinearProgressVariant.Normal}\r\n value={progressLevel}\r\n max={progressMax ?? progressLevel}/>\r\n </CardBottomSectionProgressStyles>}\r\n\r\n {(noteLeft || noteLeftIcon || noteRight || noteRightIcon) && <CardBottomSectionNotesStyles>\r\n {(noteLeft || noteLeftIcon) && (\r\n <CardBottomSectionNoteLeftStyles>\r\n {noteLeftIcon}\r\n <ComponentXXS color={COLORS.generateToken({componentType:'icon', defaultVariant:'subtle'}, theme)} textStyle={ComponentTextStyle.Bold}>{noteLeft}</ComponentXXS>\r\n </CardBottomSectionNoteLeftStyles>\r\n )}\r\n {(noteRight || noteRightIcon) && (\r\n <CardBottomSectionNoteRightStyles>\r\n {noteRightIcon}\r\n <ComponentXXS color={COLORS.generateToken({componentType:'icon', defaultVariant:'subtle'}, theme)} textStyle={ComponentTextStyle.Bold}>{noteRight}</ComponentXXS>\r\n </CardBottomSectionNoteRightStyles>\r\n )}\r\n </CardBottomSectionNotesStyles>}\r\n\r\n {(authorName || logo) && <CardBottomSectionAuthorStyles $disabled={disabled} data-testid={'card-bottomSection-author'}>\r\n <ComponentXXS>{authorName}</ComponentXXS>\r\n {logo}\r\n </CardBottomSectionAuthorStyles>}\r\n\r\n {(actions || leftButton) && <CardBottomSectionButtonRowContainerStyles>\r\n <LeftItemContainer>\r\n {leftButton && renderLeftButton()}\r\n </LeftItemContainer>\r\n\r\n { actions && <RightItemContainer>{actions.map((x, index) => (\r\n <IconButton ref={elRefs[index + (leftButton ? 1 : 0)]}\r\n className=\"card-bottom-section-action-button\"\r\n key={index}\r\n z-index={2000}\r\n disabled={disabled}\r\n variant={x.variant ?? \"secondary\"}\r\n shape=\"circular\"\r\n action={(e) => {\r\n x.onClick();\r\n }}>\r\n {x.icon}\r\n </IconButton>\r\n ))}\r\n </RightItemContainer>\r\n }\r\n </CardBottomSectionButtonRowContainerStyles>}\r\n </CardBottomSectionContainer>\r\n );\r\n});\r\n\r\nexport default CardBottomSection;\r\n"],"mappings":"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","ignoreList":[]}