@entur/alert 0.9.1 → 0.10.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +14 -0
- package/dist/CopyableText.d.ts +13 -0
- package/dist/alert.cjs.development.js +87 -41
- package/dist/alert.cjs.development.js.map +1 -1
- package/dist/alert.cjs.production.min.js +1 -1
- package/dist/alert.cjs.production.min.js.map +1 -1
- package/dist/alert.esm.js +53 -12
- package/dist/alert.esm.js.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/styles.css +39 -0
- package/package.json +17 -11
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,20 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [0.10.2](https://bitbucket.org/enturas/design-system/compare/@entur/alert@0.10.1...@entur/alert@0.10.2) (2022-03-01)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @entur/alert
|
|
9
|
+
|
|
10
|
+
## [0.10.1](https://bitbucket.org/enturas/design-system/compare/@entur/alert@0.10.0...@entur/alert@0.10.1) (2022-02-09)
|
|
11
|
+
|
|
12
|
+
**Note:** Version bump only for package @entur/alert
|
|
13
|
+
|
|
14
|
+
# [0.10.0](https://bitbucket.org/enturas/design-system/compare/@entur/alert@0.9.1...@entur/alert@0.10.0) (2022-01-21)
|
|
15
|
+
|
|
16
|
+
### Features
|
|
17
|
+
|
|
18
|
+
- **copyable text:** add new CopyableText component ([b793604](https://bitbucket.org/enturas/design-system/commits/b7936040b0fe054e061af4d6a0b56279b3e6ed1c))
|
|
19
|
+
|
|
6
20
|
## [0.9.1](https://bitbucket.org/enturas/design-system/compare/@entur/alert@0.9.0...@entur/alert@0.9.1) (2021-11-17)
|
|
7
21
|
|
|
8
22
|
### Bug Fixes
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './CopyableText.scss';
|
|
3
|
+
export declare type CopyableTextProps = {
|
|
4
|
+
/** Ekstra klassenavn */
|
|
5
|
+
className?: string;
|
|
6
|
+
/** Tekstinnhold som vises og kopieres */
|
|
7
|
+
children: string;
|
|
8
|
+
/** Overskrift i toast-varselet */
|
|
9
|
+
successHeading?: string;
|
|
10
|
+
/** Bekreftelsesmelding i toast-varselet */
|
|
11
|
+
successMessage?: string;
|
|
12
|
+
} & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children'>;
|
|
13
|
+
export declare const CopyableText: ({ children, successHeading, successMessage, className, ...rest }: CopyableTextProps) => JSX.Element;
|
|
@@ -2,14 +2,20 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
|
|
6
|
-
|
|
7
5
|
var utils = require('@entur/utils');
|
|
8
|
-
var React =
|
|
9
|
-
var classNames =
|
|
6
|
+
var React = require('react');
|
|
7
|
+
var classNames = require('classnames');
|
|
10
8
|
var icons = require('@entur/icons');
|
|
9
|
+
var copy = require('copy-text-to-clipboard');
|
|
10
|
+
var typography = require('@entur/typography');
|
|
11
11
|
var _ = require('@entur/expand/');
|
|
12
12
|
|
|
13
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
14
|
+
|
|
15
|
+
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
16
|
+
var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
|
|
17
|
+
var copy__default = /*#__PURE__*/_interopDefaultLegacy(copy);
|
|
18
|
+
|
|
13
19
|
function _extends() {
|
|
14
20
|
_extends = Object.assign || function (target) {
|
|
15
21
|
for (var i = 1; i < arguments.length; i++) {
|
|
@@ -43,6 +49,7 @@ function _objectWithoutPropertiesLoose(source, excluded) {
|
|
|
43
49
|
return target;
|
|
44
50
|
}
|
|
45
51
|
|
|
52
|
+
var _excluded$3 = ["children", "className", "closable", "closeButtonLabel", "variant", "onClose", "size", "title"];
|
|
46
53
|
var iconsMap = {
|
|
47
54
|
success: icons.OutlinedValidationCheckIcon,
|
|
48
55
|
info: icons.OutlinedValidationInfoIcon,
|
|
@@ -63,9 +70,9 @@ var BaseAlertBox = function BaseAlertBox(_ref) {
|
|
|
63
70
|
} : _ref$onClose,
|
|
64
71
|
size = _ref.size,
|
|
65
72
|
title = _ref.title,
|
|
66
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
73
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
|
|
67
74
|
|
|
68
|
-
var _React$useState =
|
|
75
|
+
var _React$useState = React__default["default"].useState(false),
|
|
69
76
|
isClosed = _React$useState[0],
|
|
70
77
|
setClosed = _React$useState[1];
|
|
71
78
|
|
|
@@ -79,38 +86,39 @@ var BaseAlertBox = function BaseAlertBox(_ref) {
|
|
|
79
86
|
};
|
|
80
87
|
|
|
81
88
|
var Icon = iconsMap[variant];
|
|
82
|
-
return
|
|
83
|
-
className:
|
|
84
|
-
}, rest), closable &&
|
|
89
|
+
return React__default["default"].createElement("div", _extends({
|
|
90
|
+
className: classNames__default["default"]('eds-alert-box', "eds-alert-box--" + size, "eds-alert-box--" + variant, className)
|
|
91
|
+
}, rest), closable && React__default["default"].createElement("button", {
|
|
85
92
|
"aria-label": closeButtonLabel,
|
|
86
93
|
className: "eds-alert-box__close-button",
|
|
87
94
|
type: "button",
|
|
88
95
|
onClick: handleClose
|
|
89
|
-
},
|
|
96
|
+
}, React__default["default"].createElement(icons.CloseIcon, null)), React__default["default"].createElement(Icon, {
|
|
90
97
|
className: "eds-alert-box__icon"
|
|
91
|
-
}),
|
|
92
|
-
className:
|
|
98
|
+
}), React__default["default"].createElement("div", {
|
|
99
|
+
className: classNames__default["default"]('eds-alert-box__content', {
|
|
93
100
|
'eds-alert-box__content--no-title': !title,
|
|
94
101
|
'eds-alert-box__content--no-children': !children
|
|
95
102
|
})
|
|
96
|
-
}, title &&
|
|
103
|
+
}, title && React__default["default"].createElement("div", {
|
|
97
104
|
className: "eds-alert-box__title"
|
|
98
105
|
}, title), children && children));
|
|
99
106
|
};
|
|
100
107
|
|
|
101
108
|
var BannerAlertBox = function BannerAlertBox(props) {
|
|
102
|
-
return
|
|
109
|
+
return React__default["default"].createElement(BaseAlertBox, _extends({}, props, {
|
|
103
110
|
size: "banner"
|
|
104
111
|
}));
|
|
105
112
|
};
|
|
106
113
|
|
|
107
114
|
var ToastAlertBox = function ToastAlertBox(props) {
|
|
108
|
-
return
|
|
115
|
+
return React__default["default"].createElement(BaseAlertBox, _extends({}, props, {
|
|
109
116
|
size: "toast",
|
|
110
117
|
role: "status"
|
|
111
118
|
}));
|
|
112
119
|
};
|
|
113
120
|
|
|
121
|
+
var _excluded$2 = ["className", "width", "onClose", "closable", "closeButtonLabel"];
|
|
114
122
|
var SmallAlertBox = function SmallAlertBox(_ref) {
|
|
115
123
|
var className = _ref.className,
|
|
116
124
|
width = _ref.width,
|
|
@@ -118,10 +126,10 @@ var SmallAlertBox = function SmallAlertBox(_ref) {
|
|
|
118
126
|
_ref$closable = _ref.closable,
|
|
119
127
|
closable = _ref$closable === void 0 ? false : _ref$closable,
|
|
120
128
|
closeButtonLabel = _ref.closeButtonLabel,
|
|
121
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
129
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
|
|
122
130
|
|
|
123
|
-
return
|
|
124
|
-
className:
|
|
131
|
+
return React__default["default"].createElement(BaseAlertBox, _extends({
|
|
132
|
+
className: classNames__default["default"](className, {
|
|
125
133
|
'eds-alert-box--fit-content': width === 'fit-content'
|
|
126
134
|
})
|
|
127
135
|
}, rest, {
|
|
@@ -132,7 +140,7 @@ var SmallAlertBox = function SmallAlertBox(_ref) {
|
|
|
132
140
|
}));
|
|
133
141
|
};
|
|
134
142
|
|
|
135
|
-
var ToastContext = /*#__PURE__*/
|
|
143
|
+
var ToastContext = /*#__PURE__*/React__default["default"].createContext(null);
|
|
136
144
|
|
|
137
145
|
var toastReducer = function toastReducer(prevToasts, action) {
|
|
138
146
|
switch (action.type) {
|
|
@@ -174,16 +182,16 @@ var ToastProvider = function ToastProvider(_ref) {
|
|
|
174
182
|
className = _ref.className,
|
|
175
183
|
style = _ref.style;
|
|
176
184
|
|
|
177
|
-
var _React$useReducer =
|
|
185
|
+
var _React$useReducer = React__default["default"].useReducer(toastReducer, []),
|
|
178
186
|
toasts = _React$useReducer[0],
|
|
179
187
|
dispatch = _React$useReducer[1];
|
|
180
188
|
|
|
181
|
-
var _React$useState =
|
|
189
|
+
var _React$useState = React__default["default"].useState(),
|
|
182
190
|
hoveringId = _React$useState[0],
|
|
183
191
|
setHovering = _React$useState[1];
|
|
184
192
|
|
|
185
|
-
var timeoutIdRefs =
|
|
186
|
-
var removeToast =
|
|
193
|
+
var timeoutIdRefs = React__default["default"].useRef({});
|
|
194
|
+
var removeToast = React__default["default"].useCallback(function (id) {
|
|
187
195
|
window.clearTimeout(timeoutIdRefs.current[id]);
|
|
188
196
|
dispatch({
|
|
189
197
|
type: 'REMOVE_TOAST',
|
|
@@ -191,7 +199,7 @@ var ToastProvider = function ToastProvider(_ref) {
|
|
|
191
199
|
});
|
|
192
200
|
delete timeoutIdRefs.current[id];
|
|
193
201
|
}, []);
|
|
194
|
-
var addToast =
|
|
202
|
+
var addToast = React__default["default"].useCallback(function (toast) {
|
|
195
203
|
var id = createUniqueId();
|
|
196
204
|
var payload = createToast(toast, id);
|
|
197
205
|
dispatch({
|
|
@@ -229,20 +237,20 @@ var ToastProvider = function ToastProvider(_ref) {
|
|
|
229
237
|
};
|
|
230
238
|
};
|
|
231
239
|
|
|
232
|
-
var contextValue =
|
|
240
|
+
var contextValue = React__default["default"].useMemo(function () {
|
|
233
241
|
return {
|
|
234
242
|
toasts: toasts,
|
|
235
243
|
addToast: addToast,
|
|
236
244
|
removeToast: removeToast
|
|
237
245
|
};
|
|
238
246
|
}, [addToast, removeToast, toasts]);
|
|
239
|
-
return
|
|
247
|
+
return React__default["default"].createElement(ToastContext.Provider, {
|
|
240
248
|
value: contextValue
|
|
241
|
-
}, toasts.length > 0 &&
|
|
242
|
-
className:
|
|
249
|
+
}, toasts.length > 0 && React__default["default"].createElement("div", {
|
|
250
|
+
className: classNames__default["default"]('eds-toast-container', "eds-toast-container--" + position, className),
|
|
243
251
|
style: style
|
|
244
252
|
}, toasts.slice(0, 3).map(function (toastToShow) {
|
|
245
|
-
return
|
|
253
|
+
return React__default["default"].createElement(ToastAlertBox, {
|
|
246
254
|
variant: toastToShow.variant,
|
|
247
255
|
title: toastToShow.title,
|
|
248
256
|
onClose: handleClose(toastToShow.id),
|
|
@@ -254,7 +262,7 @@ var ToastProvider = function ToastProvider(_ref) {
|
|
|
254
262
|
})), children);
|
|
255
263
|
};
|
|
256
264
|
var useToast = function useToast() {
|
|
257
|
-
var context =
|
|
265
|
+
var context = React__default["default"].useContext(ToastContext);
|
|
258
266
|
|
|
259
267
|
if (!context) {
|
|
260
268
|
throw new Error('You need to wrap your component in a ToastProvider component in ' + 'order to use the useToast hook');
|
|
@@ -266,13 +274,50 @@ var useToast = function useToast() {
|
|
|
266
274
|
};
|
|
267
275
|
};
|
|
268
276
|
|
|
277
|
+
var _excluded$1 = ["children", "successHeading", "successMessage", "className"];
|
|
278
|
+
var CopyableText = function CopyableText(_ref) {
|
|
279
|
+
var children = _ref.children,
|
|
280
|
+
_ref$successHeading = _ref.successHeading,
|
|
281
|
+
successHeading = _ref$successHeading === void 0 ? 'Kopiert!' : _ref$successHeading,
|
|
282
|
+
_ref$successMessage = _ref.successMessage,
|
|
283
|
+
successMessage = _ref$successMessage === void 0 ? 'Innholdet ble kopiert til utklippstavlen.' : _ref$successMessage,
|
|
284
|
+
className = _ref.className,
|
|
285
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
|
|
286
|
+
|
|
287
|
+
var _useToast = useToast(),
|
|
288
|
+
addToast = _useToast.addToast;
|
|
289
|
+
|
|
290
|
+
var buttonRef = React__default["default"].useRef(null);
|
|
291
|
+
|
|
292
|
+
var handleClick = function handleClick() {
|
|
293
|
+
buttonRef.current && copy__default["default"](children, {
|
|
294
|
+
target: buttonRef.current
|
|
295
|
+
}) && addToast({
|
|
296
|
+
title: successHeading,
|
|
297
|
+
content: successMessage
|
|
298
|
+
});
|
|
299
|
+
};
|
|
300
|
+
|
|
301
|
+
return React__default["default"].createElement("button", _extends({
|
|
302
|
+
className: 'copyable-text ' + className,
|
|
303
|
+
style: _extends({}, rest.style),
|
|
304
|
+
type: "button",
|
|
305
|
+
onClick: handleClick,
|
|
306
|
+
ref: buttonRef,
|
|
307
|
+
"aria-label": "Kopier innhold"
|
|
308
|
+
}, rest), React__default["default"].createElement(typography.PreformattedText, null, children), React__default["default"].createElement(icons.ReportsIcon, {
|
|
309
|
+
className: "copyable-text__icon"
|
|
310
|
+
}));
|
|
311
|
+
};
|
|
312
|
+
|
|
313
|
+
var _excluded = ["variant", "title", "children", "size", "className", "openLabel", "closeLabel"];
|
|
269
314
|
var SmallExpandableAlertBox = function SmallExpandableAlertBox(props) {
|
|
270
|
-
return
|
|
315
|
+
return React__default["default"].createElement(ExpandableAlertBox, _extends({
|
|
271
316
|
size: "small"
|
|
272
317
|
}, props));
|
|
273
318
|
};
|
|
274
319
|
var BannerExpandableAlertBox = function BannerExpandableAlertBox(props) {
|
|
275
|
-
return
|
|
320
|
+
return React__default["default"].createElement(ExpandableAlertBox, _extends({
|
|
276
321
|
size: "banner"
|
|
277
322
|
}, props));
|
|
278
323
|
};
|
|
@@ -285,17 +330,17 @@ var ExpandableAlertBox = function ExpandableAlertBox(_ref) {
|
|
|
285
330
|
className = _ref.className,
|
|
286
331
|
openLabel = _ref.openLabel,
|
|
287
332
|
closeLabel = _ref.closeLabel,
|
|
288
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
333
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
289
334
|
|
|
290
|
-
var _React$useState =
|
|
335
|
+
var _React$useState = React__default["default"].useState(false),
|
|
291
336
|
open = _React$useState[0],
|
|
292
337
|
setopen = _React$useState[1];
|
|
293
338
|
|
|
294
|
-
return
|
|
339
|
+
return React__default["default"].createElement(BaseAlertBox, _extends({
|
|
295
340
|
size: size,
|
|
296
341
|
variant: variant,
|
|
297
|
-
className:
|
|
298
|
-
title:
|
|
342
|
+
className: classNames__default["default"]('eds-expandable-alert-box', className),
|
|
343
|
+
title: React__default["default"].createElement(ExpandableAlertBoxTitle, {
|
|
299
344
|
open: open,
|
|
300
345
|
title: title,
|
|
301
346
|
onClick: function onClick() {
|
|
@@ -304,7 +349,7 @@ var ExpandableAlertBox = function ExpandableAlertBox(_ref) {
|
|
|
304
349
|
openLabel: openLabel,
|
|
305
350
|
closeLabel: closeLabel
|
|
306
351
|
})
|
|
307
|
-
}, rest),
|
|
352
|
+
}, rest), React__default["default"].createElement(_.BaseExpand, {
|
|
308
353
|
open: open
|
|
309
354
|
}, children));
|
|
310
355
|
};
|
|
@@ -317,13 +362,13 @@ var ExpandableAlertBoxTitle = function ExpandableAlertBoxTitle(_ref2) {
|
|
|
317
362
|
_ref2$closeLabel = _ref2.closeLabel,
|
|
318
363
|
closeLabel = _ref2$closeLabel === void 0 ? 'Lukk' : _ref2$closeLabel,
|
|
319
364
|
onClick = _ref2.onClick;
|
|
320
|
-
return
|
|
365
|
+
return React__default["default"].createElement("div", {
|
|
321
366
|
className: "eds-expandable-alert-box__title"
|
|
322
|
-
},
|
|
367
|
+
}, React__default["default"].createElement("div", null, title), React__default["default"].createElement("button", {
|
|
323
368
|
className: "eds-expandable-alert-box__button",
|
|
324
369
|
onClick: onClick,
|
|
325
370
|
type: "button"
|
|
326
|
-
}, open ? closeLabel : openLabel,
|
|
371
|
+
}, open ? closeLabel : openLabel, React__default["default"].createElement(_.ExpandArrow, {
|
|
327
372
|
open: open,
|
|
328
373
|
inline: true
|
|
329
374
|
})));
|
|
@@ -333,6 +378,7 @@ utils.warnAboutMissingStyles('alert', 'icons');
|
|
|
333
378
|
|
|
334
379
|
exports.BannerAlertBox = BannerAlertBox;
|
|
335
380
|
exports.BannerExpandableAlertBox = BannerExpandableAlertBox;
|
|
381
|
+
exports.CopyableText = CopyableText;
|
|
336
382
|
exports.SmallAlertBox = SmallAlertBox;
|
|
337
383
|
exports.SmallExpandableAlertBox = SmallExpandableAlertBox;
|
|
338
384
|
exports.ToastAlertBox = ToastAlertBox;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alert.cjs.development.js","sources":["../src/BaseAlertBox.tsx","../src/BannerAlertBox.tsx","../src/ToastAlertBox.tsx","../src/SmallAlertBox.tsx","../src/ToastProvider.tsx","../src/ExpandableAlertBox.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport {\n CloseIcon,\n OutlinedValidationCheckIcon,\n OutlinedValidationExclamationIcon,\n OutlinedValidationInfoIcon,\n OutlinedValidationErrorIcon,\n} from '@entur/icons';\nimport './styles.scss';\n\nconst iconsMap = {\n success: OutlinedValidationCheckIcon,\n info: OutlinedValidationInfoIcon,\n warning: OutlinedValidationExclamationIcon,\n error: OutlinedValidationErrorIcon,\n};\n\ntype BaseAlertBoxProps = {\n /** Innholdet i alert-boksen */\n children?: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises\n * @default \"Lukk\"\n */\n closeButtonLabel?: string;\n /** Callback som kalles når man lukker boksen\n * @default () => {}\n */\n onClose?: () => void;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne\n * @default false\n */\n closable?: boolean;\n /** Tittel på boksen - oppsummer virkning */\n title?: React.ReactNode;\n /** Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n /** Typen boks (internt bruk) */\n size: 'banner' | 'toast' | 'small';\n [key: string]: any;\n};\n\nexport const BaseAlertBox: React.FC<BaseAlertBoxProps> = ({\n children,\n className,\n closable = false,\n closeButtonLabel = 'Lukk',\n variant,\n onClose = () => ({}),\n size,\n title,\n ...rest\n}) => {\n const [isClosed, setClosed] = React.useState(false);\n if (isClosed) {\n return null;\n }\n const handleClose = () => {\n setClosed(true);\n onClose();\n };\n const Icon = iconsMap[variant];\n return (\n <div\n className={classNames(\n 'eds-alert-box',\n `eds-alert-box--${size}`,\n `eds-alert-box--${variant}`,\n className,\n )}\n {...rest}\n >\n {closable && (\n <button\n aria-label={closeButtonLabel}\n className=\"eds-alert-box__close-button\"\n type=\"button\"\n onClick={handleClose}\n >\n <CloseIcon />\n </button>\n )}\n <Icon className=\"eds-alert-box__icon\" />\n <div\n className={classNames('eds-alert-box__content', {\n 'eds-alert-box__content--no-title': !title,\n 'eds-alert-box__content--no-children': !children,\n })}\n >\n {title && <div className=\"eds-alert-box__title\">{title}</div>}\n {children && children}\n </div>\n </div>\n );\n};\n","import React from 'react';\nimport { BaseAlertBox } from './BaseAlertBox';\n\nexport type BannerAlertBoxProps = {\n /** Innholdet i alert-boksen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises */\n closeButtonLabel?: string;\n /** Callback som kalles når man lukker boksen */\n onClose?: () => void;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne\n * @default false\n */\n closable?: boolean;\n /** Tittel på boksen - oppsummer virkning */\n title?: string;\n /** Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n [key: string]: any;\n};\n\nexport const BannerAlertBox: React.FC<BannerAlertBoxProps> = props => (\n <BaseAlertBox {...props} size=\"banner\" />\n);\n","import React from 'react';\nimport { BaseAlertBox } from './BaseAlertBox';\n\nexport type ToastAlertBoxProps = {\n /** Innholdet i toasten */\n children?: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises */\n closeButtonLabel?: string;\n /** Callback som kalles når man lukker boksen */\n onClose?: () => void;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne */\n closable?: boolean;\n /** Tittel på boksen - oppsummer virkning */\n title?: string;\n /** Farge og uttrykk på toasten */\n variant: 'success' | 'info';\n [key: string]: any;\n};\n\nexport const ToastAlertBox: React.FC<ToastAlertBoxProps> = props => (\n <BaseAlertBox {...props} size=\"toast\" role=\"status\" />\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { BaseAlertBox } from './BaseAlertBox';\n\nexport type SmallAlertBoxProps = {\n /** Innholdet i alert-boksen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises */\n closeButtonLabel?: string;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne\n * @default false\n */\n closable?: boolean;\n /** Callback som kalles når man lukker boksen */\n onClose?: () => void;\n /** Tittel på boksen - oppsummer virkning */\n title?: string;\n /** Bredden på boksen - fullbredde eller tilpasset innholdet */\n width?: 'fluid' | 'fit-content';\n /** Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n [key: string]: any;\n};\n\nexport const SmallAlertBox: React.FC<SmallAlertBoxProps> = ({\n className,\n width,\n onClose,\n closable = false,\n closeButtonLabel,\n ...rest\n}) => (\n <BaseAlertBox\n className={classNames(className, {\n 'eds-alert-box--fit-content': width === 'fit-content',\n })}\n {...rest}\n onClose={onClose}\n closable={closable}\n closeButtonLabel={closeButtonLabel}\n size=\"small\"\n />\n);\n","import React from 'react';\nimport { ToastAlertBox } from './ToastAlertBox';\nimport classNames from 'classnames';\n\ntype ToastId = string;\n\ntype ToastVariants = 'success' | 'info';\n\ntype ToastType = {\n title?: string;\n content: React.ReactNode;\n id: ToastId;\n variant: ToastVariants;\n};\n\ntype ToastContextType = {\n addToast: (payload: AddToastPayload) => void;\n removeToast: (id: ToastId) => void;\n toasts: ToastType[];\n};\n\ntype AddToastPayload =\n | { title?: string; content: React.ReactNode; variant?: ToastVariants }\n | string;\n\ntype ToastAction =\n | { type: 'ADD_TOAST'; payload: ToastType }\n | { type: 'REMOVE_TOAST'; payload: ToastId };\n\nconst ToastContext = React.createContext<ToastContextType | null>(null);\n\nconst toastReducer = (\n prevToasts: ToastType[],\n action: ToastAction,\n): ToastType[] => {\n switch (action.type) {\n case 'ADD_TOAST':\n return [action.payload, ...prevToasts];\n case 'REMOVE_TOAST':\n return prevToasts.filter(toast => toast.id !== action.payload);\n }\n};\n\nconst createUniqueId = () => Math.random().toString().substring(2);\n\nconst createToast = (toast: AddToastPayload, id: ToastId): ToastType => {\n if (typeof toast === 'string') {\n return { id, content: toast, variant: 'success' };\n } else {\n return { id, variant: 'success', ...toast };\n }\n};\n\nexport type ToastProviderProps = {\n /** Antall millisekunder før toasts forsvinner av seg selv\n * @default 6000\n */\n delay?: number;\n /** Plasseringen av toasts\n * @default \"bottom-right\"\n */\n position?: 'bottom-right' | 'top-right';\n /** Ekstra klassenavn til ToastProvider-wrapperen */\n className?: string;\n /** Ekstra styling som sendes til ToastProvider-wrapperen */\n style?: React.CSSProperties;\n};\n\nexport const ToastProvider: React.FC<ToastProviderProps> = ({\n delay = 6000,\n children,\n position = 'bottom-right',\n className,\n style,\n}) => {\n const [toasts, dispatch] = React.useReducer(toastReducer, []);\n const [hoveringId, setHovering] = React.useState<string>();\n const timeoutIdRefs = React.useRef<{ [key: string]: number }>({});\n\n const removeToast = React.useCallback((id: ToastId) => {\n window.clearTimeout(timeoutIdRefs.current[id]);\n dispatch({ type: 'REMOVE_TOAST', payload: id });\n delete timeoutIdRefs.current[id];\n }, []);\n\n const addToast = React.useCallback(\n (toast: AddToastPayload) => {\n const id = createUniqueId();\n const payload = createToast(toast, id);\n dispatch({ type: 'ADD_TOAST', payload });\n timeoutIdRefs.current[id] = window.setTimeout(\n () => removeToast(id),\n delay,\n );\n },\n [delay, removeToast],\n );\n\n const handleMouseEnter = (toastId: ToastId) => () => {\n setHovering(toastId);\n Object.values(timeoutIdRefs.current).forEach(timeoutId =>\n window.clearTimeout(timeoutId),\n );\n timeoutIdRefs.current = {};\n };\n\n const handleMouseLeave = () => {\n setHovering(undefined);\n toasts.forEach(toast => {\n timeoutIdRefs.current[toast.id] = window.setTimeout(\n () => removeToast(toast.id),\n delay,\n );\n });\n };\n\n const handleClose = (toastId: ToastId) => () => {\n removeToast(toastId);\n handleMouseLeave();\n };\n\n const contextValue = React.useMemo(\n () => ({ toasts, addToast, removeToast }),\n [addToast, removeToast, toasts],\n );\n\n return (\n <ToastContext.Provider value={contextValue}>\n {toasts.length > 0 && (\n <div\n className={classNames(\n 'eds-toast-container',\n `eds-toast-container--${position}`,\n className,\n )}\n style={style}\n >\n {toasts.slice(0, 3).map(toastToShow => (\n <ToastAlertBox\n variant={toastToShow.variant}\n title={toastToShow.title}\n onClose={handleClose(toastToShow.id)}\n onMouseEnter={handleMouseEnter(toastToShow.id)}\n onMouseLeave={handleMouseLeave}\n closable={hoveringId === toastToShow.id}\n key={toastToShow.id}\n >\n {toastToShow.content}\n </ToastAlertBox>\n ))}\n </div>\n )}\n {children}\n </ToastContext.Provider>\n );\n};\n\nexport const useToast: () => {\n addToast: (payload: AddToastPayload) => void;\n} = () => {\n const context = React.useContext(ToastContext);\n if (!context) {\n throw new Error(\n 'You need to wrap your component in a ToastProvider component in ' +\n 'order to use the useToast hook',\n );\n }\n const { addToast } = context;\n return {\n addToast,\n };\n};\n","import { BaseExpand, ExpandArrow } from '@entur/expand/';\nimport classNames from 'classnames';\nimport React from 'react';\nimport { BannerAlertBoxProps } from './BannerAlertBox';\nimport { BaseAlertBox } from './BaseAlertBox';\nimport './ExpandableAlertBox.scss';\nimport { SmallAlertBoxProps } from './SmallAlertBox';\n\nexport type SmallExpandableAlertBoxProps = ExpandableAlertBoxProps &\n SmallAlertBoxProps;\n\nexport const SmallExpandableAlertBox: React.FC<SmallExpandableAlertBoxProps> = props => {\n return <ExpandableAlertBox size=\"small\" {...props} />;\n};\n\nexport type BannerExpandableAlertBoxProps = ExpandableAlertBoxProps &\n BannerAlertBoxProps;\n\nexport const BannerExpandableAlertBox: React.FC<BannerExpandableAlertBoxProps> = props => {\n return <ExpandableAlertBox size=\"banner\" {...props} />;\n};\n\ntype ExpandableAlertBoxProps = {\n /**Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n /** Tittelen til ExpandableAlertBox */\n title: React.ReactNode;\n /**Innhold som vises ved ekspandering */\n children: React.ReactNode;\n /**Ekstra klassenavn */\n className?: string;\n /** Tekst som vises på ekspanderingsknappen før åpning\n * @default \"Les mer\"\n */\n openLabel?: string;\n /** Tekst som vises på ekspanderingsknappen når den er åpnet\n * @default \"Lukk\"\n */\n closeLabel?: string;\n [key: string]: any;\n};\n\nconst ExpandableAlertBox: React.FC<ExpandableAlertBoxProps> = ({\n variant,\n title,\n children,\n size,\n className,\n openLabel,\n closeLabel,\n ...rest\n}) => {\n const [open, setopen] = React.useState(false);\n return (\n <BaseAlertBox\n size={size}\n variant={variant}\n className={classNames('eds-expandable-alert-box', className)}\n title={\n <ExpandableAlertBoxTitle\n open={open}\n title={title}\n onClick={() => setopen(!open)}\n openLabel={openLabel}\n closeLabel={closeLabel}\n />\n }\n {...rest}\n >\n <BaseExpand open={open}>{children}</BaseExpand>\n </BaseAlertBox>\n );\n};\n\ntype ExpandableAlertBoxTitleProps = {\n title: React.ReactNode;\n open: boolean;\n openLabel?: string;\n closeLabel?: string;\n onClick: (e: React.MouseEvent) => void;\n};\n\nconst ExpandableAlertBoxTitle: React.FC<ExpandableAlertBoxTitleProps> = ({\n title,\n open,\n openLabel = 'Les mer',\n closeLabel = 'Lukk',\n onClick,\n}) => {\n return (\n <div className=\"eds-expandable-alert-box__title\">\n <div>{title}</div>\n <button\n className=\"eds-expandable-alert-box__button\"\n onClick={onClick}\n type=\"button\"\n >\n {open ? closeLabel : openLabel}\n <ExpandArrow open={open} inline />\n </button>\n </div>\n );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('alert', 'icons');\n\nexport { BannerAlertBox } from './BannerAlertBox';\nexport { ToastAlertBox } from './ToastAlertBox';\nexport { SmallAlertBox } from './SmallAlertBox';\nexport { ToastProvider, useToast } from './ToastProvider';\nexport * from './ExpandableAlertBox';\n"],"names":["iconsMap","success","OutlinedValidationCheckIcon","info","OutlinedValidationInfoIcon","warning","OutlinedValidationExclamationIcon","error","OutlinedValidationErrorIcon","BaseAlertBox","children","className","closable","closeButtonLabel","variant","onClose","size","title","rest","React","useState","isClosed","setClosed","handleClose","Icon","classNames","type","onClick","CloseIcon","BannerAlertBox","props","ToastAlertBox","role","SmallAlertBox","width","ToastContext","createContext","toastReducer","prevToasts","action","payload","filter","toast","id","createUniqueId","Math","random","toString","substring","createToast","content","ToastProvider","delay","position","style","useReducer","toasts","dispatch","hoveringId","setHovering","timeoutIdRefs","useRef","removeToast","useCallback","window","clearTimeout","current","addToast","setTimeout","handleMouseEnter","toastId","Object","values","forEach","timeoutId","handleMouseLeave","undefined","contextValue","useMemo","Provider","value","length","slice","map","toastToShow","onMouseEnter","onMouseLeave","key","useToast","context","useContext","Error","SmallExpandableAlertBox","ExpandableAlertBox","BannerExpandableAlertBox","openLabel","closeLabel","open","setopen","ExpandableAlertBoxTitle","BaseExpand","ExpandArrow","inline","warnAboutMissingStyles"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"alert.cjs.development.js","sources":["../src/BaseAlertBox.tsx","../src/BannerAlertBox.tsx","../src/ToastAlertBox.tsx","../src/SmallAlertBox.tsx","../src/ToastProvider.tsx","../src/CopyableText.tsx","../src/ExpandableAlertBox.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport {\n CloseIcon,\n OutlinedValidationCheckIcon,\n OutlinedValidationExclamationIcon,\n OutlinedValidationInfoIcon,\n OutlinedValidationErrorIcon,\n} from '@entur/icons';\nimport './styles.scss';\n\nconst iconsMap = {\n success: OutlinedValidationCheckIcon,\n info: OutlinedValidationInfoIcon,\n warning: OutlinedValidationExclamationIcon,\n error: OutlinedValidationErrorIcon,\n};\n\ntype BaseAlertBoxProps = {\n /** Innholdet i alert-boksen */\n children?: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises\n * @default \"Lukk\"\n */\n closeButtonLabel?: string;\n /** Callback som kalles når man lukker boksen\n * @default () => {}\n */\n onClose?: () => void;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne\n * @default false\n */\n closable?: boolean;\n /** Tittel på boksen - oppsummer virkning */\n title?: React.ReactNode;\n /** Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n /** Typen boks (internt bruk) */\n size: 'banner' | 'toast' | 'small';\n [key: string]: any;\n};\n\nexport const BaseAlertBox: React.FC<BaseAlertBoxProps> = ({\n children,\n className,\n closable = false,\n closeButtonLabel = 'Lukk',\n variant,\n onClose = () => ({}),\n size,\n title,\n ...rest\n}) => {\n const [isClosed, setClosed] = React.useState(false);\n if (isClosed) {\n return null;\n }\n const handleClose = () => {\n setClosed(true);\n onClose();\n };\n const Icon = iconsMap[variant];\n return (\n <div\n className={classNames(\n 'eds-alert-box',\n `eds-alert-box--${size}`,\n `eds-alert-box--${variant}`,\n className,\n )}\n {...rest}\n >\n {closable && (\n <button\n aria-label={closeButtonLabel}\n className=\"eds-alert-box__close-button\"\n type=\"button\"\n onClick={handleClose}\n >\n <CloseIcon />\n </button>\n )}\n <Icon className=\"eds-alert-box__icon\" />\n <div\n className={classNames('eds-alert-box__content', {\n 'eds-alert-box__content--no-title': !title,\n 'eds-alert-box__content--no-children': !children,\n })}\n >\n {title && <div className=\"eds-alert-box__title\">{title}</div>}\n {children && children}\n </div>\n </div>\n );\n};\n","import React from 'react';\nimport { BaseAlertBox } from './BaseAlertBox';\n\nexport type BannerAlertBoxProps = {\n /** Innholdet i alert-boksen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises */\n closeButtonLabel?: string;\n /** Callback som kalles når man lukker boksen */\n onClose?: () => void;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne\n * @default false\n */\n closable?: boolean;\n /** Tittel på boksen - oppsummer virkning */\n title?: string;\n /** Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n [key: string]: any;\n};\n\nexport const BannerAlertBox: React.FC<BannerAlertBoxProps> = props => (\n <BaseAlertBox {...props} size=\"banner\" />\n);\n","import React from 'react';\nimport { BaseAlertBox } from './BaseAlertBox';\n\nexport type ToastAlertBoxProps = {\n /** Innholdet i toasten */\n children?: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises */\n closeButtonLabel?: string;\n /** Callback som kalles når man lukker boksen */\n onClose?: () => void;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne */\n closable?: boolean;\n /** Tittel på boksen - oppsummer virkning */\n title?: string;\n /** Farge og uttrykk på toasten */\n variant: 'success' | 'info';\n [key: string]: any;\n};\n\nexport const ToastAlertBox: React.FC<ToastAlertBoxProps> = props => (\n <BaseAlertBox {...props} size=\"toast\" role=\"status\" />\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { BaseAlertBox } from './BaseAlertBox';\n\nexport type SmallAlertBoxProps = {\n /** Innholdet i alert-boksen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises */\n closeButtonLabel?: string;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne\n * @default false\n */\n closable?: boolean;\n /** Callback som kalles når man lukker boksen */\n onClose?: () => void;\n /** Tittel på boksen - oppsummer virkning */\n title?: string;\n /** Bredden på boksen - fullbredde eller tilpasset innholdet */\n width?: 'fluid' | 'fit-content';\n /** Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n [key: string]: any;\n};\n\nexport const SmallAlertBox: React.FC<SmallAlertBoxProps> = ({\n className,\n width,\n onClose,\n closable = false,\n closeButtonLabel,\n ...rest\n}) => (\n <BaseAlertBox\n className={classNames(className, {\n 'eds-alert-box--fit-content': width === 'fit-content',\n })}\n {...rest}\n onClose={onClose}\n closable={closable}\n closeButtonLabel={closeButtonLabel}\n size=\"small\"\n />\n);\n","import React from 'react';\nimport { ToastAlertBox } from './ToastAlertBox';\nimport classNames from 'classnames';\n\ntype ToastId = string;\n\ntype ToastVariants = 'success' | 'info';\n\ntype ToastType = {\n title?: string;\n content: React.ReactNode;\n id: ToastId;\n variant: ToastVariants;\n};\n\ntype ToastContextType = {\n addToast: (payload: AddToastPayload) => void;\n removeToast: (id: ToastId) => void;\n toasts: ToastType[];\n};\n\ntype AddToastPayload =\n | { title?: string; content: React.ReactNode; variant?: ToastVariants }\n | string;\n\ntype ToastAction =\n | { type: 'ADD_TOAST'; payload: ToastType }\n | { type: 'REMOVE_TOAST'; payload: ToastId };\n\nconst ToastContext = React.createContext<ToastContextType | null>(null);\n\nconst toastReducer = (\n prevToasts: ToastType[],\n action: ToastAction,\n): ToastType[] => {\n switch (action.type) {\n case 'ADD_TOAST':\n return [action.payload, ...prevToasts];\n case 'REMOVE_TOAST':\n return prevToasts.filter(toast => toast.id !== action.payload);\n }\n};\n\nconst createUniqueId = () => Math.random().toString().substring(2);\n\nconst createToast = (toast: AddToastPayload, id: ToastId): ToastType => {\n if (typeof toast === 'string') {\n return { id, content: toast, variant: 'success' };\n } else {\n return { id, variant: 'success', ...toast };\n }\n};\n\nexport type ToastProviderProps = {\n /** Antall millisekunder før toasts forsvinner av seg selv\n * @default 6000\n */\n delay?: number;\n /** Plasseringen av toasts\n * @default \"bottom-right\"\n */\n position?: 'bottom-right' | 'top-right';\n /** Ekstra klassenavn til ToastProvider-wrapperen */\n className?: string;\n /** Ekstra styling som sendes til ToastProvider-wrapperen */\n style?: React.CSSProperties;\n};\n\nexport const ToastProvider: React.FC<ToastProviderProps> = ({\n delay = 6000,\n children,\n position = 'bottom-right',\n className,\n style,\n}) => {\n const [toasts, dispatch] = React.useReducer(toastReducer, []);\n const [hoveringId, setHovering] = React.useState<string>();\n const timeoutIdRefs = React.useRef<{ [key: string]: number }>({});\n\n const removeToast = React.useCallback((id: ToastId) => {\n window.clearTimeout(timeoutIdRefs.current[id]);\n dispatch({ type: 'REMOVE_TOAST', payload: id });\n delete timeoutIdRefs.current[id];\n }, []);\n\n const addToast = React.useCallback(\n (toast: AddToastPayload) => {\n const id = createUniqueId();\n const payload = createToast(toast, id);\n dispatch({ type: 'ADD_TOAST', payload });\n timeoutIdRefs.current[id] = window.setTimeout(\n () => removeToast(id),\n delay,\n );\n },\n [delay, removeToast],\n );\n\n const handleMouseEnter = (toastId: ToastId) => () => {\n setHovering(toastId);\n Object.values(timeoutIdRefs.current).forEach(timeoutId =>\n window.clearTimeout(timeoutId),\n );\n timeoutIdRefs.current = {};\n };\n\n const handleMouseLeave = () => {\n setHovering(undefined);\n toasts.forEach(toast => {\n timeoutIdRefs.current[toast.id] = window.setTimeout(\n () => removeToast(toast.id),\n delay,\n );\n });\n };\n\n const handleClose = (toastId: ToastId) => () => {\n removeToast(toastId);\n handleMouseLeave();\n };\n\n const contextValue = React.useMemo(\n () => ({ toasts, addToast, removeToast }),\n [addToast, removeToast, toasts],\n );\n\n return (\n <ToastContext.Provider value={contextValue}>\n {toasts.length > 0 && (\n <div\n className={classNames(\n 'eds-toast-container',\n `eds-toast-container--${position}`,\n className,\n )}\n style={style}\n >\n {toasts.slice(0, 3).map(toastToShow => (\n <ToastAlertBox\n variant={toastToShow.variant}\n title={toastToShow.title}\n onClose={handleClose(toastToShow.id)}\n onMouseEnter={handleMouseEnter(toastToShow.id)}\n onMouseLeave={handleMouseLeave}\n closable={hoveringId === toastToShow.id}\n key={toastToShow.id}\n >\n {toastToShow.content}\n </ToastAlertBox>\n ))}\n </div>\n )}\n {children}\n </ToastContext.Provider>\n );\n};\n\nexport const useToast: () => {\n addToast: (payload: AddToastPayload) => void;\n} = () => {\n const context = React.useContext(ToastContext);\n if (!context) {\n throw new Error(\n 'You need to wrap your component in a ToastProvider component in ' +\n 'order to use the useToast hook',\n );\n }\n const { addToast } = context;\n return {\n addToast,\n };\n};\n","import React from 'react';\n\nimport copy from 'copy-text-to-clipboard';\n\nimport { useToast } from './ToastProvider';\nimport { ReportsIcon } from '@entur/icons';\nimport { PreformattedText } from '@entur/typography';\n\nimport './CopyableText.scss';\n\nexport type CopyableTextProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Tekstinnhold som vises og kopieres */\n children: string;\n /** Overskrift i toast-varselet */\n successHeading?: string;\n /** Bekreftelsesmelding i toast-varselet */\n successMessage?: string;\n} & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children'>;\n\nexport const CopyableText = ({\n children,\n successHeading = 'Kopiert!',\n successMessage = 'Innholdet ble kopiert til utklippstavlen.',\n className,\n ...rest\n}: CopyableTextProps): JSX.Element => {\n const { addToast } = useToast();\n const buttonRef = React.useRef<HTMLButtonElement>(null);\n const handleClick = () => {\n buttonRef.current &&\n copy(children, {\n target: buttonRef.current,\n }) &&\n addToast({ title: successHeading, content: successMessage });\n };\n return (\n <button\n className={'copyable-text ' + className}\n style={{ ...rest.style }}\n type=\"button\"\n onClick={handleClick}\n ref={buttonRef}\n aria-label=\"Kopier innhold\"\n {...rest}\n >\n <PreformattedText>{children}</PreformattedText>\n <ReportsIcon className=\"copyable-text__icon\" />\n </button>\n );\n};\n","import { BaseExpand, ExpandArrow } from '@entur/expand/';\nimport classNames from 'classnames';\nimport React from 'react';\nimport { BannerAlertBoxProps } from './BannerAlertBox';\nimport { BaseAlertBox } from './BaseAlertBox';\nimport './ExpandableAlertBox.scss';\nimport { SmallAlertBoxProps } from './SmallAlertBox';\n\nexport type SmallExpandableAlertBoxProps = ExpandableAlertBoxProps &\n SmallAlertBoxProps;\n\nexport const SmallExpandableAlertBox: React.FC<SmallExpandableAlertBoxProps> = props => {\n return <ExpandableAlertBox size=\"small\" {...props} />;\n};\n\nexport type BannerExpandableAlertBoxProps = ExpandableAlertBoxProps &\n BannerAlertBoxProps;\n\nexport const BannerExpandableAlertBox: React.FC<BannerExpandableAlertBoxProps> = props => {\n return <ExpandableAlertBox size=\"banner\" {...props} />;\n};\n\ntype ExpandableAlertBoxProps = {\n /**Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n /** Tittelen til ExpandableAlertBox */\n title: React.ReactNode;\n /**Innhold som vises ved ekspandering */\n children: React.ReactNode;\n /**Ekstra klassenavn */\n className?: string;\n /** Tekst som vises på ekspanderingsknappen før åpning\n * @default \"Les mer\"\n */\n openLabel?: string;\n /** Tekst som vises på ekspanderingsknappen når den er åpnet\n * @default \"Lukk\"\n */\n closeLabel?: string;\n [key: string]: any;\n};\n\nconst ExpandableAlertBox: React.FC<ExpandableAlertBoxProps> = ({\n variant,\n title,\n children,\n size,\n className,\n openLabel,\n closeLabel,\n ...rest\n}) => {\n const [open, setopen] = React.useState(false);\n return (\n <BaseAlertBox\n size={size}\n variant={variant}\n className={classNames('eds-expandable-alert-box', className)}\n title={\n <ExpandableAlertBoxTitle\n open={open}\n title={title}\n onClick={() => setopen(!open)}\n openLabel={openLabel}\n closeLabel={closeLabel}\n />\n }\n {...rest}\n >\n <BaseExpand open={open}>{children}</BaseExpand>\n </BaseAlertBox>\n );\n};\n\ntype ExpandableAlertBoxTitleProps = {\n title: React.ReactNode;\n open: boolean;\n openLabel?: string;\n closeLabel?: string;\n onClick: (e: React.MouseEvent) => void;\n};\n\nconst ExpandableAlertBoxTitle: React.FC<ExpandableAlertBoxTitleProps> = ({\n title,\n open,\n openLabel = 'Les mer',\n closeLabel = 'Lukk',\n onClick,\n}) => {\n return (\n <div className=\"eds-expandable-alert-box__title\">\n <div>{title}</div>\n <button\n className=\"eds-expandable-alert-box__button\"\n onClick={onClick}\n type=\"button\"\n >\n {open ? closeLabel : openLabel}\n <ExpandArrow open={open} inline />\n </button>\n </div>\n );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('alert', 'icons');\n\nexport { BannerAlertBox } from './BannerAlertBox';\nexport { ToastAlertBox } from './ToastAlertBox';\nexport { SmallAlertBox } from './SmallAlertBox';\nexport { ToastProvider, useToast } from './ToastProvider';\nexport { CopyableText } from './CopyableText';\nexport * from './ExpandableAlertBox';\n"],"names":["iconsMap","success","OutlinedValidationCheckIcon","info","OutlinedValidationInfoIcon","warning","OutlinedValidationExclamationIcon","error","OutlinedValidationErrorIcon","BaseAlertBox","children","className","closable","closeButtonLabel","variant","onClose","size","title","rest","React","useState","isClosed","setClosed","handleClose","Icon","classNames","type","onClick","CloseIcon","BannerAlertBox","props","ToastAlertBox","role","SmallAlertBox","width","ToastContext","createContext","toastReducer","prevToasts","action","payload","filter","toast","id","createUniqueId","Math","random","toString","substring","createToast","content","ToastProvider","delay","position","style","useReducer","toasts","dispatch","hoveringId","setHovering","timeoutIdRefs","useRef","removeToast","useCallback","window","clearTimeout","current","addToast","setTimeout","handleMouseEnter","toastId","Object","values","forEach","timeoutId","handleMouseLeave","undefined","contextValue","useMemo","Provider","value","length","slice","map","toastToShow","onMouseEnter","onMouseLeave","key","useToast","context","useContext","Error","CopyableText","successHeading","successMessage","buttonRef","handleClick","copy","target","ref","PreformattedText","ReportsIcon","SmallExpandableAlertBox","ExpandableAlertBox","BannerExpandableAlertBox","openLabel","closeLabel","open","setopen","ExpandableAlertBoxTitle","BaseExpand","ExpandArrow","inline","warnAboutMissingStyles"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@entur/utils"),t=require("react"),n=require("classnames"),a=require("@entur/icons"),l=require("copy-text-to-clipboard"),r=require("@entur/typography"),o=require("@entur/expand/");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=s(t),i=s(n),c=s(l);function d(){return d=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},d.apply(this,arguments)}function f(e,t){if(null==e)return{};var n,a,l={},r=Object.keys(e);for(a=0;a<r.length;a++)t.indexOf(n=r[a])>=0||(l[n]=e[n]);return l}var b=["children","className","closable","closeButtonLabel","variant","onClose","size","title"],m={success:a.OutlinedValidationCheckIcon,info:a.OutlinedValidationInfoIcon,warning:a.OutlinedValidationExclamationIcon,error:a.OutlinedValidationErrorIcon},p=function(e){var t=e.children,n=e.className,l=e.closable,r=void 0!==l&&l,o=e.closeButtonLabel,s=void 0===o?"Lukk":o,c=e.variant,p=e.onClose,v=void 0===p?function(){return{}}:p,x=e.size,E=e.title,y=f(e,b),h=u.default.useState(!1),T=h[1];if(h[0])return null;var _=m[c];return u.default.createElement("div",d({className:i.default("eds-alert-box","eds-alert-box--"+x,"eds-alert-box--"+c,n)},y),r&&u.default.createElement("button",{"aria-label":s,className:"eds-alert-box__close-button",type:"button",onClick:function(){T(!0),v()}},u.default.createElement(a.CloseIcon,null)),u.default.createElement(_,{className:"eds-alert-box__icon"}),u.default.createElement("div",{className:i.default("eds-alert-box__content",{"eds-alert-box__content--no-title":!E,"eds-alert-box__content--no-children":!t})},E&&u.default.createElement("div",{className:"eds-alert-box__title"},E),t&&t))},v=function(e){return u.default.createElement(p,d({},e,{size:"toast",role:"status"}))},x=["className","width","onClose","closable","closeButtonLabel"],E=u.default.createContext(null),y=function(e,t){switch(t.type){case"ADD_TOAST":return[t.payload].concat(e);case"REMOVE_TOAST":return e.filter((function(e){return e.id!==t.payload}))}},h=function(){var e=u.default.useContext(E);if(!e)throw new Error("You need to wrap your component in a ToastProvider component in order to use the useToast hook");return{addToast:e.addToast}},T=["children","successHeading","successMessage","className"],_=["variant","title","children","size","className","openLabel","closeLabel"],N=function(e){var t=e.variant,n=e.title,a=e.children,l=e.size,r=e.className,s=e.openLabel,c=e.closeLabel,b=f(e,_),m=u.default.useState(!1),v=m[0],x=m[1];return u.default.createElement(p,d({size:l,variant:t,className:i.default("eds-expandable-alert-box",r),title:u.default.createElement(w,{open:v,title:n,onClick:function(){return x(!v)},openLabel:s,closeLabel:c})},b),u.default.createElement(o.BaseExpand,{open:v},a))},w=function(e){var t=e.open,n=e.openLabel,a=void 0===n?"Les mer":n,l=e.closeLabel,r=void 0===l?"Lukk":l,s=e.onClick;return u.default.createElement("div",{className:"eds-expandable-alert-box__title"},u.default.createElement("div",null,e.title),u.default.createElement("button",{className:"eds-expandable-alert-box__button",onClick:s,type:"button"},t?r:a,u.default.createElement(o.ExpandArrow,{open:t,inline:!0})))};e.warnAboutMissingStyles("alert","icons"),exports.BannerAlertBox=function(e){return u.default.createElement(p,d({},e,{size:"banner"}))},exports.BannerExpandableAlertBox=function(e){return u.default.createElement(N,d({size:"banner"},e))},exports.CopyableText=function(e){var t=e.children,n=e.successHeading,l=void 0===n?"Kopiert!":n,o=e.successMessage,s=void 0===o?"Innholdet ble kopiert til utklippstavlen.":o,i=e.className,b=f(e,T),m=h().addToast,p=u.default.useRef(null);return u.default.createElement("button",d({className:"copyable-text "+i,style:d({},b.style),type:"button",onClick:function(){p.current&&c.default(t,{target:p.current})&&m({title:l,content:s})},ref:p,"aria-label":"Kopier innhold"},b),u.default.createElement(r.PreformattedText,null,t),u.default.createElement(a.ReportsIcon,{className:"copyable-text__icon"}))},exports.SmallAlertBox=function(e){var t=e.className,n=e.width,a=e.onClose,l=e.closable,r=void 0!==l&&l,o=e.closeButtonLabel,s=f(e,x);return u.default.createElement(p,d({className:i.default(t,{"eds-alert-box--fit-content":"fit-content"===n})},s,{onClose:a,closable:r,closeButtonLabel:o,size:"small"}))},exports.SmallExpandableAlertBox=function(e){return u.default.createElement(N,d({size:"small"},e))},exports.ToastAlertBox=v,exports.ToastProvider=function(e){var t=e.delay,n=void 0===t?6e3:t,a=e.children,l=e.position,r=void 0===l?"bottom-right":l,o=e.className,s=e.style,c=u.default.useReducer(y,[]),f=c[0],b=c[1],m=u.default.useState(),p=m[0],x=m[1],h=u.default.useRef({}),T=u.default.useCallback((function(e){window.clearTimeout(h.current[e]),b({type:"REMOVE_TOAST",payload:e}),delete h.current[e]}),[]),_=u.default.useCallback((function(e){var t=Math.random().toString().substring(2),a=function(e,t){return"string"==typeof e?{id:t,content:e,variant:"success"}:d({id:t,variant:"success"},e)}(e,t);b({type:"ADD_TOAST",payload:a}),h.current[t]=window.setTimeout((function(){return T(t)}),n)}),[n,T]),N=function(e){return function(){x(e),Object.values(h.current).forEach((function(e){return window.clearTimeout(e)})),h.current={}}},w=function(){x(void 0),f.forEach((function(e){h.current[e.id]=window.setTimeout((function(){return T(e.id)}),n)}))},C=u.default.useMemo((function(){return{toasts:f,addToast:_,removeToast:T}}),[_,T,f]);return u.default.createElement(E.Provider,{value:C},f.length>0&&u.default.createElement("div",{className:i.default("eds-toast-container","eds-toast-container--"+r,o),style:s},f.slice(0,3).map((function(e){return u.default.createElement(v,{variant:e.variant,title:e.title,onClose:(t=e.id,function(){T(t),w()}),onMouseEnter:N(e.id),onMouseLeave:w,closable:p===e.id,key:e.id},e.content);var t}))),a)},exports.useToast=h;
|
|
2
2
|
//# sourceMappingURL=alert.cjs.production.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alert.cjs.production.min.js","sources":["../src/BaseAlertBox.tsx","../src/ToastAlertBox.tsx","../src/ToastProvider.tsx","../src/ExpandableAlertBox.tsx","../src/index.tsx","../src/BannerAlertBox.tsx","../src/SmallAlertBox.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport {\n CloseIcon,\n OutlinedValidationCheckIcon,\n OutlinedValidationExclamationIcon,\n OutlinedValidationInfoIcon,\n OutlinedValidationErrorIcon,\n} from '@entur/icons';\nimport './styles.scss';\n\nconst iconsMap = {\n success: OutlinedValidationCheckIcon,\n info: OutlinedValidationInfoIcon,\n warning: OutlinedValidationExclamationIcon,\n error: OutlinedValidationErrorIcon,\n};\n\ntype BaseAlertBoxProps = {\n /** Innholdet i alert-boksen */\n children?: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises\n * @default \"Lukk\"\n */\n closeButtonLabel?: string;\n /** Callback som kalles når man lukker boksen\n * @default () => {}\n */\n onClose?: () => void;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne\n * @default false\n */\n closable?: boolean;\n /** Tittel på boksen - oppsummer virkning */\n title?: React.ReactNode;\n /** Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n /** Typen boks (internt bruk) */\n size: 'banner' | 'toast' | 'small';\n [key: string]: any;\n};\n\nexport const BaseAlertBox: React.FC<BaseAlertBoxProps> = ({\n children,\n className,\n closable = false,\n closeButtonLabel = 'Lukk',\n variant,\n onClose = () => ({}),\n size,\n title,\n ...rest\n}) => {\n const [isClosed, setClosed] = React.useState(false);\n if (isClosed) {\n return null;\n }\n const handleClose = () => {\n setClosed(true);\n onClose();\n };\n const Icon = iconsMap[variant];\n return (\n <div\n className={classNames(\n 'eds-alert-box',\n `eds-alert-box--${size}`,\n `eds-alert-box--${variant}`,\n className,\n )}\n {...rest}\n >\n {closable && (\n <button\n aria-label={closeButtonLabel}\n className=\"eds-alert-box__close-button\"\n type=\"button\"\n onClick={handleClose}\n >\n <CloseIcon />\n </button>\n )}\n <Icon className=\"eds-alert-box__icon\" />\n <div\n className={classNames('eds-alert-box__content', {\n 'eds-alert-box__content--no-title': !title,\n 'eds-alert-box__content--no-children': !children,\n })}\n >\n {title && <div className=\"eds-alert-box__title\">{title}</div>}\n {children && children}\n </div>\n </div>\n );\n};\n","import React from 'react';\nimport { BaseAlertBox } from './BaseAlertBox';\n\nexport type ToastAlertBoxProps = {\n /** Innholdet i toasten */\n children?: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises */\n closeButtonLabel?: string;\n /** Callback som kalles når man lukker boksen */\n onClose?: () => void;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne */\n closable?: boolean;\n /** Tittel på boksen - oppsummer virkning */\n title?: string;\n /** Farge og uttrykk på toasten */\n variant: 'success' | 'info';\n [key: string]: any;\n};\n\nexport const ToastAlertBox: React.FC<ToastAlertBoxProps> = props => (\n <BaseAlertBox {...props} size=\"toast\" role=\"status\" />\n);\n","import React from 'react';\nimport { ToastAlertBox } from './ToastAlertBox';\nimport classNames from 'classnames';\n\ntype ToastId = string;\n\ntype ToastVariants = 'success' | 'info';\n\ntype ToastType = {\n title?: string;\n content: React.ReactNode;\n id: ToastId;\n variant: ToastVariants;\n};\n\ntype ToastContextType = {\n addToast: (payload: AddToastPayload) => void;\n removeToast: (id: ToastId) => void;\n toasts: ToastType[];\n};\n\ntype AddToastPayload =\n | { title?: string; content: React.ReactNode; variant?: ToastVariants }\n | string;\n\ntype ToastAction =\n | { type: 'ADD_TOAST'; payload: ToastType }\n | { type: 'REMOVE_TOAST'; payload: ToastId };\n\nconst ToastContext = React.createContext<ToastContextType | null>(null);\n\nconst toastReducer = (\n prevToasts: ToastType[],\n action: ToastAction,\n): ToastType[] => {\n switch (action.type) {\n case 'ADD_TOAST':\n return [action.payload, ...prevToasts];\n case 'REMOVE_TOAST':\n return prevToasts.filter(toast => toast.id !== action.payload);\n }\n};\n\nconst createUniqueId = () => Math.random().toString().substring(2);\n\nconst createToast = (toast: AddToastPayload, id: ToastId): ToastType => {\n if (typeof toast === 'string') {\n return { id, content: toast, variant: 'success' };\n } else {\n return { id, variant: 'success', ...toast };\n }\n};\n\nexport type ToastProviderProps = {\n /** Antall millisekunder før toasts forsvinner av seg selv\n * @default 6000\n */\n delay?: number;\n /** Plasseringen av toasts\n * @default \"bottom-right\"\n */\n position?: 'bottom-right' | 'top-right';\n /** Ekstra klassenavn til ToastProvider-wrapperen */\n className?: string;\n /** Ekstra styling som sendes til ToastProvider-wrapperen */\n style?: React.CSSProperties;\n};\n\nexport const ToastProvider: React.FC<ToastProviderProps> = ({\n delay = 6000,\n children,\n position = 'bottom-right',\n className,\n style,\n}) => {\n const [toasts, dispatch] = React.useReducer(toastReducer, []);\n const [hoveringId, setHovering] = React.useState<string>();\n const timeoutIdRefs = React.useRef<{ [key: string]: number }>({});\n\n const removeToast = React.useCallback((id: ToastId) => {\n window.clearTimeout(timeoutIdRefs.current[id]);\n dispatch({ type: 'REMOVE_TOAST', payload: id });\n delete timeoutIdRefs.current[id];\n }, []);\n\n const addToast = React.useCallback(\n (toast: AddToastPayload) => {\n const id = createUniqueId();\n const payload = createToast(toast, id);\n dispatch({ type: 'ADD_TOAST', payload });\n timeoutIdRefs.current[id] = window.setTimeout(\n () => removeToast(id),\n delay,\n );\n },\n [delay, removeToast],\n );\n\n const handleMouseEnter = (toastId: ToastId) => () => {\n setHovering(toastId);\n Object.values(timeoutIdRefs.current).forEach(timeoutId =>\n window.clearTimeout(timeoutId),\n );\n timeoutIdRefs.current = {};\n };\n\n const handleMouseLeave = () => {\n setHovering(undefined);\n toasts.forEach(toast => {\n timeoutIdRefs.current[toast.id] = window.setTimeout(\n () => removeToast(toast.id),\n delay,\n );\n });\n };\n\n const handleClose = (toastId: ToastId) => () => {\n removeToast(toastId);\n handleMouseLeave();\n };\n\n const contextValue = React.useMemo(\n () => ({ toasts, addToast, removeToast }),\n [addToast, removeToast, toasts],\n );\n\n return (\n <ToastContext.Provider value={contextValue}>\n {toasts.length > 0 && (\n <div\n className={classNames(\n 'eds-toast-container',\n `eds-toast-container--${position}`,\n className,\n )}\n style={style}\n >\n {toasts.slice(0, 3).map(toastToShow => (\n <ToastAlertBox\n variant={toastToShow.variant}\n title={toastToShow.title}\n onClose={handleClose(toastToShow.id)}\n onMouseEnter={handleMouseEnter(toastToShow.id)}\n onMouseLeave={handleMouseLeave}\n closable={hoveringId === toastToShow.id}\n key={toastToShow.id}\n >\n {toastToShow.content}\n </ToastAlertBox>\n ))}\n </div>\n )}\n {children}\n </ToastContext.Provider>\n );\n};\n\nexport const useToast: () => {\n addToast: (payload: AddToastPayload) => void;\n} = () => {\n const context = React.useContext(ToastContext);\n if (!context) {\n throw new Error(\n 'You need to wrap your component in a ToastProvider component in ' +\n 'order to use the useToast hook',\n );\n }\n const { addToast } = context;\n return {\n addToast,\n };\n};\n","import { BaseExpand, ExpandArrow } from '@entur/expand/';\nimport classNames from 'classnames';\nimport React from 'react';\nimport { BannerAlertBoxProps } from './BannerAlertBox';\nimport { BaseAlertBox } from './BaseAlertBox';\nimport './ExpandableAlertBox.scss';\nimport { SmallAlertBoxProps } from './SmallAlertBox';\n\nexport type SmallExpandableAlertBoxProps = ExpandableAlertBoxProps &\n SmallAlertBoxProps;\n\nexport const SmallExpandableAlertBox: React.FC<SmallExpandableAlertBoxProps> = props => {\n return <ExpandableAlertBox size=\"small\" {...props} />;\n};\n\nexport type BannerExpandableAlertBoxProps = ExpandableAlertBoxProps &\n BannerAlertBoxProps;\n\nexport const BannerExpandableAlertBox: React.FC<BannerExpandableAlertBoxProps> = props => {\n return <ExpandableAlertBox size=\"banner\" {...props} />;\n};\n\ntype ExpandableAlertBoxProps = {\n /**Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n /** Tittelen til ExpandableAlertBox */\n title: React.ReactNode;\n /**Innhold som vises ved ekspandering */\n children: React.ReactNode;\n /**Ekstra klassenavn */\n className?: string;\n /** Tekst som vises på ekspanderingsknappen før åpning\n * @default \"Les mer\"\n */\n openLabel?: string;\n /** Tekst som vises på ekspanderingsknappen når den er åpnet\n * @default \"Lukk\"\n */\n closeLabel?: string;\n [key: string]: any;\n};\n\nconst ExpandableAlertBox: React.FC<ExpandableAlertBoxProps> = ({\n variant,\n title,\n children,\n size,\n className,\n openLabel,\n closeLabel,\n ...rest\n}) => {\n const [open, setopen] = React.useState(false);\n return (\n <BaseAlertBox\n size={size}\n variant={variant}\n className={classNames('eds-expandable-alert-box', className)}\n title={\n <ExpandableAlertBoxTitle\n open={open}\n title={title}\n onClick={() => setopen(!open)}\n openLabel={openLabel}\n closeLabel={closeLabel}\n />\n }\n {...rest}\n >\n <BaseExpand open={open}>{children}</BaseExpand>\n </BaseAlertBox>\n );\n};\n\ntype ExpandableAlertBoxTitleProps = {\n title: React.ReactNode;\n open: boolean;\n openLabel?: string;\n closeLabel?: string;\n onClick: (e: React.MouseEvent) => void;\n};\n\nconst ExpandableAlertBoxTitle: React.FC<ExpandableAlertBoxTitleProps> = ({\n title,\n open,\n openLabel = 'Les mer',\n closeLabel = 'Lukk',\n onClick,\n}) => {\n return (\n <div className=\"eds-expandable-alert-box__title\">\n <div>{title}</div>\n <button\n className=\"eds-expandable-alert-box__button\"\n onClick={onClick}\n type=\"button\"\n >\n {open ? closeLabel : openLabel}\n <ExpandArrow open={open} inline />\n </button>\n </div>\n );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('alert', 'icons');\n\nexport { BannerAlertBox } from './BannerAlertBox';\nexport { ToastAlertBox } from './ToastAlertBox';\nexport { SmallAlertBox } from './SmallAlertBox';\nexport { ToastProvider, useToast } from './ToastProvider';\nexport * from './ExpandableAlertBox';\n","import React from 'react';\nimport { BaseAlertBox } from './BaseAlertBox';\n\nexport type BannerAlertBoxProps = {\n /** Innholdet i alert-boksen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises */\n closeButtonLabel?: string;\n /** Callback som kalles når man lukker boksen */\n onClose?: () => void;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne\n * @default false\n */\n closable?: boolean;\n /** Tittel på boksen - oppsummer virkning */\n title?: string;\n /** Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n [key: string]: any;\n};\n\nexport const BannerAlertBox: React.FC<BannerAlertBoxProps> = props => (\n <BaseAlertBox {...props} size=\"banner\" />\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { BaseAlertBox } from './BaseAlertBox';\n\nexport type SmallAlertBoxProps = {\n /** Innholdet i alert-boksen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises */\n closeButtonLabel?: string;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne\n * @default false\n */\n closable?: boolean;\n /** Callback som kalles når man lukker boksen */\n onClose?: () => void;\n /** Tittel på boksen - oppsummer virkning */\n title?: string;\n /** Bredden på boksen - fullbredde eller tilpasset innholdet */\n width?: 'fluid' | 'fit-content';\n /** Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n [key: string]: any;\n};\n\nexport const SmallAlertBox: React.FC<SmallAlertBoxProps> = ({\n className,\n width,\n onClose,\n closable = false,\n closeButtonLabel,\n ...rest\n}) => (\n <BaseAlertBox\n className={classNames(className, {\n 'eds-alert-box--fit-content': width === 'fit-content',\n })}\n {...rest}\n onClose={onClose}\n closable={closable}\n closeButtonLabel={closeButtonLabel}\n size=\"small\"\n />\n);\n"],"names":["iconsMap","success","OutlinedValidationCheckIcon","info","OutlinedValidationInfoIcon","warning","OutlinedValidationExclamationIcon","error","OutlinedValidationErrorIcon","BaseAlertBox","children","className","closable","closeButtonLabel","variant","onClose","size","title","rest","React","useState","setClosed","Icon","classNames","type","onClick","CloseIcon","ToastAlertBox","props","role","ToastContext","createContext","toastReducer","prevToasts","action","payload","filter","toast","id","ExpandableAlertBox","openLabel","closeLabel","open","setopen","ExpandableAlertBoxTitle","BaseExpand","ExpandArrow","inline","warnAboutMissingStyles","width","delay","position","style","useReducer","toasts","dispatch","hoveringId","setHovering","timeoutIdRefs","useRef","removeToast","useCallback","window","clearTimeout","current","addToast","Math","random","toString","substring","content","createToast","setTimeout","handleMouseEnter","toastId","Object","values","forEach","timeoutId","handleMouseLeave","undefined","contextValue","useMemo","Provider","value","length","slice","map","toastToShow","onMouseEnter","onMouseLeave","key","context","useContext","Error"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"alert.cjs.production.min.js","sources":["../src/BaseAlertBox.tsx","../src/ToastAlertBox.tsx","../src/ToastProvider.tsx","../src/ExpandableAlertBox.tsx","../src/index.tsx","../src/BannerAlertBox.tsx","../src/CopyableText.tsx","../src/SmallAlertBox.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport {\n CloseIcon,\n OutlinedValidationCheckIcon,\n OutlinedValidationExclamationIcon,\n OutlinedValidationInfoIcon,\n OutlinedValidationErrorIcon,\n} from '@entur/icons';\nimport './styles.scss';\n\nconst iconsMap = {\n success: OutlinedValidationCheckIcon,\n info: OutlinedValidationInfoIcon,\n warning: OutlinedValidationExclamationIcon,\n error: OutlinedValidationErrorIcon,\n};\n\ntype BaseAlertBoxProps = {\n /** Innholdet i alert-boksen */\n children?: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises\n * @default \"Lukk\"\n */\n closeButtonLabel?: string;\n /** Callback som kalles når man lukker boksen\n * @default () => {}\n */\n onClose?: () => void;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne\n * @default false\n */\n closable?: boolean;\n /** Tittel på boksen - oppsummer virkning */\n title?: React.ReactNode;\n /** Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n /** Typen boks (internt bruk) */\n size: 'banner' | 'toast' | 'small';\n [key: string]: any;\n};\n\nexport const BaseAlertBox: React.FC<BaseAlertBoxProps> = ({\n children,\n className,\n closable = false,\n closeButtonLabel = 'Lukk',\n variant,\n onClose = () => ({}),\n size,\n title,\n ...rest\n}) => {\n const [isClosed, setClosed] = React.useState(false);\n if (isClosed) {\n return null;\n }\n const handleClose = () => {\n setClosed(true);\n onClose();\n };\n const Icon = iconsMap[variant];\n return (\n <div\n className={classNames(\n 'eds-alert-box',\n `eds-alert-box--${size}`,\n `eds-alert-box--${variant}`,\n className,\n )}\n {...rest}\n >\n {closable && (\n <button\n aria-label={closeButtonLabel}\n className=\"eds-alert-box__close-button\"\n type=\"button\"\n onClick={handleClose}\n >\n <CloseIcon />\n </button>\n )}\n <Icon className=\"eds-alert-box__icon\" />\n <div\n className={classNames('eds-alert-box__content', {\n 'eds-alert-box__content--no-title': !title,\n 'eds-alert-box__content--no-children': !children,\n })}\n >\n {title && <div className=\"eds-alert-box__title\">{title}</div>}\n {children && children}\n </div>\n </div>\n );\n};\n","import React from 'react';\nimport { BaseAlertBox } from './BaseAlertBox';\n\nexport type ToastAlertBoxProps = {\n /** Innholdet i toasten */\n children?: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises */\n closeButtonLabel?: string;\n /** Callback som kalles når man lukker boksen */\n onClose?: () => void;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne */\n closable?: boolean;\n /** Tittel på boksen - oppsummer virkning */\n title?: string;\n /** Farge og uttrykk på toasten */\n variant: 'success' | 'info';\n [key: string]: any;\n};\n\nexport const ToastAlertBox: React.FC<ToastAlertBoxProps> = props => (\n <BaseAlertBox {...props} size=\"toast\" role=\"status\" />\n);\n","import React from 'react';\nimport { ToastAlertBox } from './ToastAlertBox';\nimport classNames from 'classnames';\n\ntype ToastId = string;\n\ntype ToastVariants = 'success' | 'info';\n\ntype ToastType = {\n title?: string;\n content: React.ReactNode;\n id: ToastId;\n variant: ToastVariants;\n};\n\ntype ToastContextType = {\n addToast: (payload: AddToastPayload) => void;\n removeToast: (id: ToastId) => void;\n toasts: ToastType[];\n};\n\ntype AddToastPayload =\n | { title?: string; content: React.ReactNode; variant?: ToastVariants }\n | string;\n\ntype ToastAction =\n | { type: 'ADD_TOAST'; payload: ToastType }\n | { type: 'REMOVE_TOAST'; payload: ToastId };\n\nconst ToastContext = React.createContext<ToastContextType | null>(null);\n\nconst toastReducer = (\n prevToasts: ToastType[],\n action: ToastAction,\n): ToastType[] => {\n switch (action.type) {\n case 'ADD_TOAST':\n return [action.payload, ...prevToasts];\n case 'REMOVE_TOAST':\n return prevToasts.filter(toast => toast.id !== action.payload);\n }\n};\n\nconst createUniqueId = () => Math.random().toString().substring(2);\n\nconst createToast = (toast: AddToastPayload, id: ToastId): ToastType => {\n if (typeof toast === 'string') {\n return { id, content: toast, variant: 'success' };\n } else {\n return { id, variant: 'success', ...toast };\n }\n};\n\nexport type ToastProviderProps = {\n /** Antall millisekunder før toasts forsvinner av seg selv\n * @default 6000\n */\n delay?: number;\n /** Plasseringen av toasts\n * @default \"bottom-right\"\n */\n position?: 'bottom-right' | 'top-right';\n /** Ekstra klassenavn til ToastProvider-wrapperen */\n className?: string;\n /** Ekstra styling som sendes til ToastProvider-wrapperen */\n style?: React.CSSProperties;\n};\n\nexport const ToastProvider: React.FC<ToastProviderProps> = ({\n delay = 6000,\n children,\n position = 'bottom-right',\n className,\n style,\n}) => {\n const [toasts, dispatch] = React.useReducer(toastReducer, []);\n const [hoveringId, setHovering] = React.useState<string>();\n const timeoutIdRefs = React.useRef<{ [key: string]: number }>({});\n\n const removeToast = React.useCallback((id: ToastId) => {\n window.clearTimeout(timeoutIdRefs.current[id]);\n dispatch({ type: 'REMOVE_TOAST', payload: id });\n delete timeoutIdRefs.current[id];\n }, []);\n\n const addToast = React.useCallback(\n (toast: AddToastPayload) => {\n const id = createUniqueId();\n const payload = createToast(toast, id);\n dispatch({ type: 'ADD_TOAST', payload });\n timeoutIdRefs.current[id] = window.setTimeout(\n () => removeToast(id),\n delay,\n );\n },\n [delay, removeToast],\n );\n\n const handleMouseEnter = (toastId: ToastId) => () => {\n setHovering(toastId);\n Object.values(timeoutIdRefs.current).forEach(timeoutId =>\n window.clearTimeout(timeoutId),\n );\n timeoutIdRefs.current = {};\n };\n\n const handleMouseLeave = () => {\n setHovering(undefined);\n toasts.forEach(toast => {\n timeoutIdRefs.current[toast.id] = window.setTimeout(\n () => removeToast(toast.id),\n delay,\n );\n });\n };\n\n const handleClose = (toastId: ToastId) => () => {\n removeToast(toastId);\n handleMouseLeave();\n };\n\n const contextValue = React.useMemo(\n () => ({ toasts, addToast, removeToast }),\n [addToast, removeToast, toasts],\n );\n\n return (\n <ToastContext.Provider value={contextValue}>\n {toasts.length > 0 && (\n <div\n className={classNames(\n 'eds-toast-container',\n `eds-toast-container--${position}`,\n className,\n )}\n style={style}\n >\n {toasts.slice(0, 3).map(toastToShow => (\n <ToastAlertBox\n variant={toastToShow.variant}\n title={toastToShow.title}\n onClose={handleClose(toastToShow.id)}\n onMouseEnter={handleMouseEnter(toastToShow.id)}\n onMouseLeave={handleMouseLeave}\n closable={hoveringId === toastToShow.id}\n key={toastToShow.id}\n >\n {toastToShow.content}\n </ToastAlertBox>\n ))}\n </div>\n )}\n {children}\n </ToastContext.Provider>\n );\n};\n\nexport const useToast: () => {\n addToast: (payload: AddToastPayload) => void;\n} = () => {\n const context = React.useContext(ToastContext);\n if (!context) {\n throw new Error(\n 'You need to wrap your component in a ToastProvider component in ' +\n 'order to use the useToast hook',\n );\n }\n const { addToast } = context;\n return {\n addToast,\n };\n};\n","import { BaseExpand, ExpandArrow } from '@entur/expand/';\nimport classNames from 'classnames';\nimport React from 'react';\nimport { BannerAlertBoxProps } from './BannerAlertBox';\nimport { BaseAlertBox } from './BaseAlertBox';\nimport './ExpandableAlertBox.scss';\nimport { SmallAlertBoxProps } from './SmallAlertBox';\n\nexport type SmallExpandableAlertBoxProps = ExpandableAlertBoxProps &\n SmallAlertBoxProps;\n\nexport const SmallExpandableAlertBox: React.FC<SmallExpandableAlertBoxProps> = props => {\n return <ExpandableAlertBox size=\"small\" {...props} />;\n};\n\nexport type BannerExpandableAlertBoxProps = ExpandableAlertBoxProps &\n BannerAlertBoxProps;\n\nexport const BannerExpandableAlertBox: React.FC<BannerExpandableAlertBoxProps> = props => {\n return <ExpandableAlertBox size=\"banner\" {...props} />;\n};\n\ntype ExpandableAlertBoxProps = {\n /**Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n /** Tittelen til ExpandableAlertBox */\n title: React.ReactNode;\n /**Innhold som vises ved ekspandering */\n children: React.ReactNode;\n /**Ekstra klassenavn */\n className?: string;\n /** Tekst som vises på ekspanderingsknappen før åpning\n * @default \"Les mer\"\n */\n openLabel?: string;\n /** Tekst som vises på ekspanderingsknappen når den er åpnet\n * @default \"Lukk\"\n */\n closeLabel?: string;\n [key: string]: any;\n};\n\nconst ExpandableAlertBox: React.FC<ExpandableAlertBoxProps> = ({\n variant,\n title,\n children,\n size,\n className,\n openLabel,\n closeLabel,\n ...rest\n}) => {\n const [open, setopen] = React.useState(false);\n return (\n <BaseAlertBox\n size={size}\n variant={variant}\n className={classNames('eds-expandable-alert-box', className)}\n title={\n <ExpandableAlertBoxTitle\n open={open}\n title={title}\n onClick={() => setopen(!open)}\n openLabel={openLabel}\n closeLabel={closeLabel}\n />\n }\n {...rest}\n >\n <BaseExpand open={open}>{children}</BaseExpand>\n </BaseAlertBox>\n );\n};\n\ntype ExpandableAlertBoxTitleProps = {\n title: React.ReactNode;\n open: boolean;\n openLabel?: string;\n closeLabel?: string;\n onClick: (e: React.MouseEvent) => void;\n};\n\nconst ExpandableAlertBoxTitle: React.FC<ExpandableAlertBoxTitleProps> = ({\n title,\n open,\n openLabel = 'Les mer',\n closeLabel = 'Lukk',\n onClick,\n}) => {\n return (\n <div className=\"eds-expandable-alert-box__title\">\n <div>{title}</div>\n <button\n className=\"eds-expandable-alert-box__button\"\n onClick={onClick}\n type=\"button\"\n >\n {open ? closeLabel : openLabel}\n <ExpandArrow open={open} inline />\n </button>\n </div>\n );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('alert', 'icons');\n\nexport { BannerAlertBox } from './BannerAlertBox';\nexport { ToastAlertBox } from './ToastAlertBox';\nexport { SmallAlertBox } from './SmallAlertBox';\nexport { ToastProvider, useToast } from './ToastProvider';\nexport { CopyableText } from './CopyableText';\nexport * from './ExpandableAlertBox';\n","import React from 'react';\nimport { BaseAlertBox } from './BaseAlertBox';\n\nexport type BannerAlertBoxProps = {\n /** Innholdet i alert-boksen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises */\n closeButtonLabel?: string;\n /** Callback som kalles når man lukker boksen */\n onClose?: () => void;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne\n * @default false\n */\n closable?: boolean;\n /** Tittel på boksen - oppsummer virkning */\n title?: string;\n /** Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n [key: string]: any;\n};\n\nexport const BannerAlertBox: React.FC<BannerAlertBoxProps> = props => (\n <BaseAlertBox {...props} size=\"banner\" />\n);\n","import React from 'react';\n\nimport copy from 'copy-text-to-clipboard';\n\nimport { useToast } from './ToastProvider';\nimport { ReportsIcon } from '@entur/icons';\nimport { PreformattedText } from '@entur/typography';\n\nimport './CopyableText.scss';\n\nexport type CopyableTextProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Tekstinnhold som vises og kopieres */\n children: string;\n /** Overskrift i toast-varselet */\n successHeading?: string;\n /** Bekreftelsesmelding i toast-varselet */\n successMessage?: string;\n} & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children'>;\n\nexport const CopyableText = ({\n children,\n successHeading = 'Kopiert!',\n successMessage = 'Innholdet ble kopiert til utklippstavlen.',\n className,\n ...rest\n}: CopyableTextProps): JSX.Element => {\n const { addToast } = useToast();\n const buttonRef = React.useRef<HTMLButtonElement>(null);\n const handleClick = () => {\n buttonRef.current &&\n copy(children, {\n target: buttonRef.current,\n }) &&\n addToast({ title: successHeading, content: successMessage });\n };\n return (\n <button\n className={'copyable-text ' + className}\n style={{ ...rest.style }}\n type=\"button\"\n onClick={handleClick}\n ref={buttonRef}\n aria-label=\"Kopier innhold\"\n {...rest}\n >\n <PreformattedText>{children}</PreformattedText>\n <ReportsIcon className=\"copyable-text__icon\" />\n </button>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { BaseAlertBox } from './BaseAlertBox';\n\nexport type SmallAlertBoxProps = {\n /** Innholdet i alert-boksen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises */\n closeButtonLabel?: string;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne\n * @default false\n */\n closable?: boolean;\n /** Callback som kalles når man lukker boksen */\n onClose?: () => void;\n /** Tittel på boksen - oppsummer virkning */\n title?: string;\n /** Bredden på boksen - fullbredde eller tilpasset innholdet */\n width?: 'fluid' | 'fit-content';\n /** Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n [key: string]: any;\n};\n\nexport const SmallAlertBox: React.FC<SmallAlertBoxProps> = ({\n className,\n width,\n onClose,\n closable = false,\n closeButtonLabel,\n ...rest\n}) => (\n <BaseAlertBox\n className={classNames(className, {\n 'eds-alert-box--fit-content': width === 'fit-content',\n })}\n {...rest}\n onClose={onClose}\n closable={closable}\n closeButtonLabel={closeButtonLabel}\n size=\"small\"\n />\n);\n"],"names":["iconsMap","success","OutlinedValidationCheckIcon","info","OutlinedValidationInfoIcon","warning","OutlinedValidationExclamationIcon","error","OutlinedValidationErrorIcon","BaseAlertBox","children","className","closable","closeButtonLabel","variant","onClose","size","title","rest","React","useState","setClosed","Icon","classNames","type","onClick","CloseIcon","ToastAlertBox","props","role","ToastContext","createContext","toastReducer","prevToasts","action","payload","filter","toast","id","useToast","context","useContext","Error","addToast","ExpandableAlertBox","openLabel","closeLabel","open","setopen","ExpandableAlertBoxTitle","BaseExpand","ExpandArrow","inline","warnAboutMissingStyles","successHeading","successMessage","buttonRef","useRef","style","current","copy","target","content","ref","PreformattedText","ReportsIcon","width","delay","position","useReducer","toasts","dispatch","hoveringId","setHovering","timeoutIdRefs","removeToast","useCallback","window","clearTimeout","Math","random","toString","substring","createToast","setTimeout","handleMouseEnter","toastId","Object","values","forEach","timeoutId","handleMouseLeave","undefined","contextValue","useMemo","Provider","value","length","slice","map","toastToShow","onMouseEnter","onMouseLeave","key"],"mappings":"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"}
|
package/dist/alert.esm.js
CHANGED
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import { warnAboutMissingStyles } from '@entur/utils';
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import classNames from 'classnames';
|
|
4
|
-
import { CloseIcon, OutlinedValidationCheckIcon, OutlinedValidationInfoIcon, OutlinedValidationExclamationIcon, OutlinedValidationErrorIcon } from '@entur/icons';
|
|
4
|
+
import { CloseIcon, OutlinedValidationCheckIcon, OutlinedValidationInfoIcon, OutlinedValidationExclamationIcon, OutlinedValidationErrorIcon, ReportsIcon } from '@entur/icons';
|
|
5
|
+
import copy from 'copy-text-to-clipboard';
|
|
6
|
+
import { PreformattedText } from '@entur/typography';
|
|
5
7
|
import { BaseExpand, ExpandArrow } from '@entur/expand/';
|
|
6
8
|
|
|
7
9
|
function _extends() {
|
|
@@ -37,6 +39,7 @@ function _objectWithoutPropertiesLoose(source, excluded) {
|
|
|
37
39
|
return target;
|
|
38
40
|
}
|
|
39
41
|
|
|
42
|
+
var _excluded$3 = ["children", "className", "closable", "closeButtonLabel", "variant", "onClose", "size", "title"];
|
|
40
43
|
var iconsMap = {
|
|
41
44
|
success: OutlinedValidationCheckIcon,
|
|
42
45
|
info: OutlinedValidationInfoIcon,
|
|
@@ -57,7 +60,7 @@ var BaseAlertBox = function BaseAlertBox(_ref) {
|
|
|
57
60
|
} : _ref$onClose,
|
|
58
61
|
size = _ref.size,
|
|
59
62
|
title = _ref.title,
|
|
60
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
63
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
|
|
61
64
|
|
|
62
65
|
var _React$useState = React.useState(false),
|
|
63
66
|
isClosed = _React$useState[0],
|
|
@@ -73,7 +76,7 @@ var BaseAlertBox = function BaseAlertBox(_ref) {
|
|
|
73
76
|
};
|
|
74
77
|
|
|
75
78
|
var Icon = iconsMap[variant];
|
|
76
|
-
return React.createElement("div",
|
|
79
|
+
return React.createElement("div", _extends({
|
|
77
80
|
className: classNames('eds-alert-box', "eds-alert-box--" + size, "eds-alert-box--" + variant, className)
|
|
78
81
|
}, rest), closable && React.createElement("button", {
|
|
79
82
|
"aria-label": closeButtonLabel,
|
|
@@ -93,18 +96,19 @@ var BaseAlertBox = function BaseAlertBox(_ref) {
|
|
|
93
96
|
};
|
|
94
97
|
|
|
95
98
|
var BannerAlertBox = function BannerAlertBox(props) {
|
|
96
|
-
return React.createElement(BaseAlertBox,
|
|
99
|
+
return React.createElement(BaseAlertBox, _extends({}, props, {
|
|
97
100
|
size: "banner"
|
|
98
101
|
}));
|
|
99
102
|
};
|
|
100
103
|
|
|
101
104
|
var ToastAlertBox = function ToastAlertBox(props) {
|
|
102
|
-
return React.createElement(BaseAlertBox,
|
|
105
|
+
return React.createElement(BaseAlertBox, _extends({}, props, {
|
|
103
106
|
size: "toast",
|
|
104
107
|
role: "status"
|
|
105
108
|
}));
|
|
106
109
|
};
|
|
107
110
|
|
|
111
|
+
var _excluded$2 = ["className", "width", "onClose", "closable", "closeButtonLabel"];
|
|
108
112
|
var SmallAlertBox = function SmallAlertBox(_ref) {
|
|
109
113
|
var className = _ref.className,
|
|
110
114
|
width = _ref.width,
|
|
@@ -112,9 +116,9 @@ var SmallAlertBox = function SmallAlertBox(_ref) {
|
|
|
112
116
|
_ref$closable = _ref.closable,
|
|
113
117
|
closable = _ref$closable === void 0 ? false : _ref$closable,
|
|
114
118
|
closeButtonLabel = _ref.closeButtonLabel,
|
|
115
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
119
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
|
|
116
120
|
|
|
117
|
-
return React.createElement(BaseAlertBox,
|
|
121
|
+
return React.createElement(BaseAlertBox, _extends({
|
|
118
122
|
className: classNames(className, {
|
|
119
123
|
'eds-alert-box--fit-content': width === 'fit-content'
|
|
120
124
|
})
|
|
@@ -260,13 +264,50 @@ var useToast = function useToast() {
|
|
|
260
264
|
};
|
|
261
265
|
};
|
|
262
266
|
|
|
267
|
+
var _excluded$1 = ["children", "successHeading", "successMessage", "className"];
|
|
268
|
+
var CopyableText = function CopyableText(_ref) {
|
|
269
|
+
var children = _ref.children,
|
|
270
|
+
_ref$successHeading = _ref.successHeading,
|
|
271
|
+
successHeading = _ref$successHeading === void 0 ? 'Kopiert!' : _ref$successHeading,
|
|
272
|
+
_ref$successMessage = _ref.successMessage,
|
|
273
|
+
successMessage = _ref$successMessage === void 0 ? 'Innholdet ble kopiert til utklippstavlen.' : _ref$successMessage,
|
|
274
|
+
className = _ref.className,
|
|
275
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
|
|
276
|
+
|
|
277
|
+
var _useToast = useToast(),
|
|
278
|
+
addToast = _useToast.addToast;
|
|
279
|
+
|
|
280
|
+
var buttonRef = React.useRef(null);
|
|
281
|
+
|
|
282
|
+
var handleClick = function handleClick() {
|
|
283
|
+
buttonRef.current && copy(children, {
|
|
284
|
+
target: buttonRef.current
|
|
285
|
+
}) && addToast({
|
|
286
|
+
title: successHeading,
|
|
287
|
+
content: successMessage
|
|
288
|
+
});
|
|
289
|
+
};
|
|
290
|
+
|
|
291
|
+
return React.createElement("button", _extends({
|
|
292
|
+
className: 'copyable-text ' + className,
|
|
293
|
+
style: _extends({}, rest.style),
|
|
294
|
+
type: "button",
|
|
295
|
+
onClick: handleClick,
|
|
296
|
+
ref: buttonRef,
|
|
297
|
+
"aria-label": "Kopier innhold"
|
|
298
|
+
}, rest), React.createElement(PreformattedText, null, children), React.createElement(ReportsIcon, {
|
|
299
|
+
className: "copyable-text__icon"
|
|
300
|
+
}));
|
|
301
|
+
};
|
|
302
|
+
|
|
303
|
+
var _excluded = ["variant", "title", "children", "size", "className", "openLabel", "closeLabel"];
|
|
263
304
|
var SmallExpandableAlertBox = function SmallExpandableAlertBox(props) {
|
|
264
|
-
return React.createElement(ExpandableAlertBox,
|
|
305
|
+
return React.createElement(ExpandableAlertBox, _extends({
|
|
265
306
|
size: "small"
|
|
266
307
|
}, props));
|
|
267
308
|
};
|
|
268
309
|
var BannerExpandableAlertBox = function BannerExpandableAlertBox(props) {
|
|
269
|
-
return React.createElement(ExpandableAlertBox,
|
|
310
|
+
return React.createElement(ExpandableAlertBox, _extends({
|
|
270
311
|
size: "banner"
|
|
271
312
|
}, props));
|
|
272
313
|
};
|
|
@@ -279,13 +320,13 @@ var ExpandableAlertBox = function ExpandableAlertBox(_ref) {
|
|
|
279
320
|
className = _ref.className,
|
|
280
321
|
openLabel = _ref.openLabel,
|
|
281
322
|
closeLabel = _ref.closeLabel,
|
|
282
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
323
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
283
324
|
|
|
284
325
|
var _React$useState = React.useState(false),
|
|
285
326
|
open = _React$useState[0],
|
|
286
327
|
setopen = _React$useState[1];
|
|
287
328
|
|
|
288
|
-
return React.createElement(BaseAlertBox,
|
|
329
|
+
return React.createElement(BaseAlertBox, _extends({
|
|
289
330
|
size: size,
|
|
290
331
|
variant: variant,
|
|
291
332
|
className: classNames('eds-expandable-alert-box', className),
|
|
@@ -325,5 +366,5 @@ var ExpandableAlertBoxTitle = function ExpandableAlertBoxTitle(_ref2) {
|
|
|
325
366
|
|
|
326
367
|
warnAboutMissingStyles('alert', 'icons');
|
|
327
368
|
|
|
328
|
-
export { BannerAlertBox, BannerExpandableAlertBox, SmallAlertBox, SmallExpandableAlertBox, ToastAlertBox, ToastProvider, useToast };
|
|
369
|
+
export { BannerAlertBox, BannerExpandableAlertBox, CopyableText, SmallAlertBox, SmallExpandableAlertBox, ToastAlertBox, ToastProvider, useToast };
|
|
329
370
|
//# sourceMappingURL=alert.esm.js.map
|
package/dist/alert.esm.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alert.esm.js","sources":["../src/BaseAlertBox.tsx","../src/BannerAlertBox.tsx","../src/ToastAlertBox.tsx","../src/SmallAlertBox.tsx","../src/ToastProvider.tsx","../src/ExpandableAlertBox.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport {\n CloseIcon,\n OutlinedValidationCheckIcon,\n OutlinedValidationExclamationIcon,\n OutlinedValidationInfoIcon,\n OutlinedValidationErrorIcon,\n} from '@entur/icons';\nimport './styles.scss';\n\nconst iconsMap = {\n success: OutlinedValidationCheckIcon,\n info: OutlinedValidationInfoIcon,\n warning: OutlinedValidationExclamationIcon,\n error: OutlinedValidationErrorIcon,\n};\n\ntype BaseAlertBoxProps = {\n /** Innholdet i alert-boksen */\n children?: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises\n * @default \"Lukk\"\n */\n closeButtonLabel?: string;\n /** Callback som kalles når man lukker boksen\n * @default () => {}\n */\n onClose?: () => void;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne\n * @default false\n */\n closable?: boolean;\n /** Tittel på boksen - oppsummer virkning */\n title?: React.ReactNode;\n /** Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n /** Typen boks (internt bruk) */\n size: 'banner' | 'toast' | 'small';\n [key: string]: any;\n};\n\nexport const BaseAlertBox: React.FC<BaseAlertBoxProps> = ({\n children,\n className,\n closable = false,\n closeButtonLabel = 'Lukk',\n variant,\n onClose = () => ({}),\n size,\n title,\n ...rest\n}) => {\n const [isClosed, setClosed] = React.useState(false);\n if (isClosed) {\n return null;\n }\n const handleClose = () => {\n setClosed(true);\n onClose();\n };\n const Icon = iconsMap[variant];\n return (\n <div\n className={classNames(\n 'eds-alert-box',\n `eds-alert-box--${size}`,\n `eds-alert-box--${variant}`,\n className,\n )}\n {...rest}\n >\n {closable && (\n <button\n aria-label={closeButtonLabel}\n className=\"eds-alert-box__close-button\"\n type=\"button\"\n onClick={handleClose}\n >\n <CloseIcon />\n </button>\n )}\n <Icon className=\"eds-alert-box__icon\" />\n <div\n className={classNames('eds-alert-box__content', {\n 'eds-alert-box__content--no-title': !title,\n 'eds-alert-box__content--no-children': !children,\n })}\n >\n {title && <div className=\"eds-alert-box__title\">{title}</div>}\n {children && children}\n </div>\n </div>\n );\n};\n","import React from 'react';\nimport { BaseAlertBox } from './BaseAlertBox';\n\nexport type BannerAlertBoxProps = {\n /** Innholdet i alert-boksen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises */\n closeButtonLabel?: string;\n /** Callback som kalles når man lukker boksen */\n onClose?: () => void;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne\n * @default false\n */\n closable?: boolean;\n /** Tittel på boksen - oppsummer virkning */\n title?: string;\n /** Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n [key: string]: any;\n};\n\nexport const BannerAlertBox: React.FC<BannerAlertBoxProps> = props => (\n <BaseAlertBox {...props} size=\"banner\" />\n);\n","import React from 'react';\nimport { BaseAlertBox } from './BaseAlertBox';\n\nexport type ToastAlertBoxProps = {\n /** Innholdet i toasten */\n children?: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises */\n closeButtonLabel?: string;\n /** Callback som kalles når man lukker boksen */\n onClose?: () => void;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne */\n closable?: boolean;\n /** Tittel på boksen - oppsummer virkning */\n title?: string;\n /** Farge og uttrykk på toasten */\n variant: 'success' | 'info';\n [key: string]: any;\n};\n\nexport const ToastAlertBox: React.FC<ToastAlertBoxProps> = props => (\n <BaseAlertBox {...props} size=\"toast\" role=\"status\" />\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { BaseAlertBox } from './BaseAlertBox';\n\nexport type SmallAlertBoxProps = {\n /** Innholdet i alert-boksen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises */\n closeButtonLabel?: string;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne\n * @default false\n */\n closable?: boolean;\n /** Callback som kalles når man lukker boksen */\n onClose?: () => void;\n /** Tittel på boksen - oppsummer virkning */\n title?: string;\n /** Bredden på boksen - fullbredde eller tilpasset innholdet */\n width?: 'fluid' | 'fit-content';\n /** Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n [key: string]: any;\n};\n\nexport const SmallAlertBox: React.FC<SmallAlertBoxProps> = ({\n className,\n width,\n onClose,\n closable = false,\n closeButtonLabel,\n ...rest\n}) => (\n <BaseAlertBox\n className={classNames(className, {\n 'eds-alert-box--fit-content': width === 'fit-content',\n })}\n {...rest}\n onClose={onClose}\n closable={closable}\n closeButtonLabel={closeButtonLabel}\n size=\"small\"\n />\n);\n","import React from 'react';\nimport { ToastAlertBox } from './ToastAlertBox';\nimport classNames from 'classnames';\n\ntype ToastId = string;\n\ntype ToastVariants = 'success' | 'info';\n\ntype ToastType = {\n title?: string;\n content: React.ReactNode;\n id: ToastId;\n variant: ToastVariants;\n};\n\ntype ToastContextType = {\n addToast: (payload: AddToastPayload) => void;\n removeToast: (id: ToastId) => void;\n toasts: ToastType[];\n};\n\ntype AddToastPayload =\n | { title?: string; content: React.ReactNode; variant?: ToastVariants }\n | string;\n\ntype ToastAction =\n | { type: 'ADD_TOAST'; payload: ToastType }\n | { type: 'REMOVE_TOAST'; payload: ToastId };\n\nconst ToastContext = React.createContext<ToastContextType | null>(null);\n\nconst toastReducer = (\n prevToasts: ToastType[],\n action: ToastAction,\n): ToastType[] => {\n switch (action.type) {\n case 'ADD_TOAST':\n return [action.payload, ...prevToasts];\n case 'REMOVE_TOAST':\n return prevToasts.filter(toast => toast.id !== action.payload);\n }\n};\n\nconst createUniqueId = () => Math.random().toString().substring(2);\n\nconst createToast = (toast: AddToastPayload, id: ToastId): ToastType => {\n if (typeof toast === 'string') {\n return { id, content: toast, variant: 'success' };\n } else {\n return { id, variant: 'success', ...toast };\n }\n};\n\nexport type ToastProviderProps = {\n /** Antall millisekunder før toasts forsvinner av seg selv\n * @default 6000\n */\n delay?: number;\n /** Plasseringen av toasts\n * @default \"bottom-right\"\n */\n position?: 'bottom-right' | 'top-right';\n /** Ekstra klassenavn til ToastProvider-wrapperen */\n className?: string;\n /** Ekstra styling som sendes til ToastProvider-wrapperen */\n style?: React.CSSProperties;\n};\n\nexport const ToastProvider: React.FC<ToastProviderProps> = ({\n delay = 6000,\n children,\n position = 'bottom-right',\n className,\n style,\n}) => {\n const [toasts, dispatch] = React.useReducer(toastReducer, []);\n const [hoveringId, setHovering] = React.useState<string>();\n const timeoutIdRefs = React.useRef<{ [key: string]: number }>({});\n\n const removeToast = React.useCallback((id: ToastId) => {\n window.clearTimeout(timeoutIdRefs.current[id]);\n dispatch({ type: 'REMOVE_TOAST', payload: id });\n delete timeoutIdRefs.current[id];\n }, []);\n\n const addToast = React.useCallback(\n (toast: AddToastPayload) => {\n const id = createUniqueId();\n const payload = createToast(toast, id);\n dispatch({ type: 'ADD_TOAST', payload });\n timeoutIdRefs.current[id] = window.setTimeout(\n () => removeToast(id),\n delay,\n );\n },\n [delay, removeToast],\n );\n\n const handleMouseEnter = (toastId: ToastId) => () => {\n setHovering(toastId);\n Object.values(timeoutIdRefs.current).forEach(timeoutId =>\n window.clearTimeout(timeoutId),\n );\n timeoutIdRefs.current = {};\n };\n\n const handleMouseLeave = () => {\n setHovering(undefined);\n toasts.forEach(toast => {\n timeoutIdRefs.current[toast.id] = window.setTimeout(\n () => removeToast(toast.id),\n delay,\n );\n });\n };\n\n const handleClose = (toastId: ToastId) => () => {\n removeToast(toastId);\n handleMouseLeave();\n };\n\n const contextValue = React.useMemo(\n () => ({ toasts, addToast, removeToast }),\n [addToast, removeToast, toasts],\n );\n\n return (\n <ToastContext.Provider value={contextValue}>\n {toasts.length > 0 && (\n <div\n className={classNames(\n 'eds-toast-container',\n `eds-toast-container--${position}`,\n className,\n )}\n style={style}\n >\n {toasts.slice(0, 3).map(toastToShow => (\n <ToastAlertBox\n variant={toastToShow.variant}\n title={toastToShow.title}\n onClose={handleClose(toastToShow.id)}\n onMouseEnter={handleMouseEnter(toastToShow.id)}\n onMouseLeave={handleMouseLeave}\n closable={hoveringId === toastToShow.id}\n key={toastToShow.id}\n >\n {toastToShow.content}\n </ToastAlertBox>\n ))}\n </div>\n )}\n {children}\n </ToastContext.Provider>\n );\n};\n\nexport const useToast: () => {\n addToast: (payload: AddToastPayload) => void;\n} = () => {\n const context = React.useContext(ToastContext);\n if (!context) {\n throw new Error(\n 'You need to wrap your component in a ToastProvider component in ' +\n 'order to use the useToast hook',\n );\n }\n const { addToast } = context;\n return {\n addToast,\n };\n};\n","import { BaseExpand, ExpandArrow } from '@entur/expand/';\nimport classNames from 'classnames';\nimport React from 'react';\nimport { BannerAlertBoxProps } from './BannerAlertBox';\nimport { BaseAlertBox } from './BaseAlertBox';\nimport './ExpandableAlertBox.scss';\nimport { SmallAlertBoxProps } from './SmallAlertBox';\n\nexport type SmallExpandableAlertBoxProps = ExpandableAlertBoxProps &\n SmallAlertBoxProps;\n\nexport const SmallExpandableAlertBox: React.FC<SmallExpandableAlertBoxProps> = props => {\n return <ExpandableAlertBox size=\"small\" {...props} />;\n};\n\nexport type BannerExpandableAlertBoxProps = ExpandableAlertBoxProps &\n BannerAlertBoxProps;\n\nexport const BannerExpandableAlertBox: React.FC<BannerExpandableAlertBoxProps> = props => {\n return <ExpandableAlertBox size=\"banner\" {...props} />;\n};\n\ntype ExpandableAlertBoxProps = {\n /**Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n /** Tittelen til ExpandableAlertBox */\n title: React.ReactNode;\n /**Innhold som vises ved ekspandering */\n children: React.ReactNode;\n /**Ekstra klassenavn */\n className?: string;\n /** Tekst som vises på ekspanderingsknappen før åpning\n * @default \"Les mer\"\n */\n openLabel?: string;\n /** Tekst som vises på ekspanderingsknappen når den er åpnet\n * @default \"Lukk\"\n */\n closeLabel?: string;\n [key: string]: any;\n};\n\nconst ExpandableAlertBox: React.FC<ExpandableAlertBoxProps> = ({\n variant,\n title,\n children,\n size,\n className,\n openLabel,\n closeLabel,\n ...rest\n}) => {\n const [open, setopen] = React.useState(false);\n return (\n <BaseAlertBox\n size={size}\n variant={variant}\n className={classNames('eds-expandable-alert-box', className)}\n title={\n <ExpandableAlertBoxTitle\n open={open}\n title={title}\n onClick={() => setopen(!open)}\n openLabel={openLabel}\n closeLabel={closeLabel}\n />\n }\n {...rest}\n >\n <BaseExpand open={open}>{children}</BaseExpand>\n </BaseAlertBox>\n );\n};\n\ntype ExpandableAlertBoxTitleProps = {\n title: React.ReactNode;\n open: boolean;\n openLabel?: string;\n closeLabel?: string;\n onClick: (e: React.MouseEvent) => void;\n};\n\nconst ExpandableAlertBoxTitle: React.FC<ExpandableAlertBoxTitleProps> = ({\n title,\n open,\n openLabel = 'Les mer',\n closeLabel = 'Lukk',\n onClick,\n}) => {\n return (\n <div className=\"eds-expandable-alert-box__title\">\n <div>{title}</div>\n <button\n className=\"eds-expandable-alert-box__button\"\n onClick={onClick}\n type=\"button\"\n >\n {open ? closeLabel : openLabel}\n <ExpandArrow open={open} inline />\n </button>\n </div>\n );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('alert', 'icons');\n\nexport { BannerAlertBox } from './BannerAlertBox';\nexport { ToastAlertBox } from './ToastAlertBox';\nexport { SmallAlertBox } from './SmallAlertBox';\nexport { ToastProvider, useToast } from './ToastProvider';\nexport * from './ExpandableAlertBox';\n"],"names":["iconsMap","success","OutlinedValidationCheckIcon","info","OutlinedValidationInfoIcon","warning","OutlinedValidationExclamationIcon","error","OutlinedValidationErrorIcon","BaseAlertBox","children","className","closable","closeButtonLabel","variant","onClose","size","title","rest","React","useState","isClosed","setClosed","handleClose","Icon","classNames","type","onClick","CloseIcon","BannerAlertBox","props","ToastAlertBox","role","SmallAlertBox","width","ToastContext","createContext","toastReducer","prevToasts","action","payload","filter","toast","id","createUniqueId","Math","random","toString","substring","createToast","content","ToastProvider","delay","position","style","useReducer","toasts","dispatch","hoveringId","setHovering","timeoutIdRefs","useRef","removeToast","useCallback","window","clearTimeout","current","addToast","setTimeout","handleMouseEnter","toastId","Object","values","forEach","timeoutId","handleMouseLeave","undefined","contextValue","useMemo","Provider","value","length","slice","map","toastToShow","onMouseEnter","onMouseLeave","key","useToast","context","useContext","Error","SmallExpandableAlertBox","ExpandableAlertBox","BannerExpandableAlertBox","openLabel","closeLabel","open","setopen","ExpandableAlertBoxTitle","BaseExpand","ExpandArrow","inline","warnAboutMissingStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,IAAMA,QAAQ,GAAG;AACfC,EAAAA,OAAO,EAAEC,2BADM;AAEfC,EAAAA,IAAI,EAAEC,0BAFS;AAGfC,EAAAA,OAAO,EAAEC,iCAHM;AAIfC,EAAAA,KAAK,EAAEC;AAJQ,CAAjB;AAiCO,IAAMC,YAAY,GAAgC,SAA5CA,YAA4C;MACvDC,gBAAAA;MACAC,iBAAAA;2BACAC;MAAAA,sCAAW;mCACXC;MAAAA,sDAAmB;MACnBC,eAAAA;0BACAC;MAAAA,oCAAU;AAAA,WAAO,EAAP;AAAA;MACVC,YAAAA;MACAC,aAAAA;MACGC;;wBAE2BC,KAAK,CAACC,QAAN,CAAe,KAAf;MAAvBC;MAAUC;;AACjB,MAAID,QAAJ,EAAc;AACZ,WAAO,IAAP;AACD;;AACD,MAAME,WAAW,GAAG,SAAdA,WAAc;AAClBD,IAAAA,SAAS,CAAC,IAAD,CAAT;AACAP,IAAAA,OAAO;AACR,GAHD;;AAIA,MAAMS,IAAI,GAAGxB,QAAQ,CAACc,OAAD,CAArB;AACA,SACEK,mBAAA,MAAA;AACER,IAAAA,SAAS,EAAEc,UAAU,CACnB,eADmB,sBAEDT,IAFC,sBAGDF,OAHC,EAInBH,SAJmB;KAMjBO,KAPN,EASGN,QAAQ,IACPO,mBAAA,SAAA;kBACcN;AACZF,IAAAA,SAAS,EAAC;AACVe,IAAAA,IAAI,EAAC;AACLC,IAAAA,OAAO,EAAEJ;GAJX,EAMEJ,mBAAA,CAACS,SAAD,MAAA,CANF,CAVJ,EAmBET,mBAAA,CAACK,IAAD;AAAMb,IAAAA,SAAS,EAAC;GAAhB,CAnBF,EAoBEQ,mBAAA,MAAA;AACER,IAAAA,SAAS,EAAEc,UAAU,CAAC,wBAAD,EAA2B;AAC9C,0CAAoC,CAACR,KADS;AAE9C,6CAAuC,CAACP;AAFM,KAA3B;GADvB,EAMGO,KAAK,IAAIE,mBAAA,MAAA;AAAKR,IAAAA,SAAS,EAAC;GAAf,EAAuCM,KAAvC,CANZ,EAOGP,QAAQ,IAAIA,QAPf,CApBF,CADF;AAgCD,CApDM;;ICrBMmB,cAAc,GAAkC,SAAhDA,cAAgD,CAAAC,KAAK;AAAA,SAChEX,mBAAA,CAACV,YAAD,oBAAkBqB;AAAOd,IAAAA,IAAI,EAAC;IAA9B,CADgE;AAAA,CAA3D;;ICFMe,aAAa,GAAiC,SAA9CA,aAA8C,CAAAD,KAAK;AAAA,SAC9DX,mBAAA,CAACV,YAAD,oBAAkBqB;AAAOd,IAAAA,IAAI,EAAC;AAAQgB,IAAAA,IAAI,EAAC;IAA3C,CAD8D;AAAA,CAAzD;;ICKMC,aAAa,GAAiC,SAA9CA,aAA8C;AAAA,MACzDtB,SADyD,QACzDA,SADyD;AAAA,MAEzDuB,KAFyD,QAEzDA,KAFyD;AAAA,MAGzDnB,OAHyD,QAGzDA,OAHyD;AAAA,2BAIzDH,QAJyD;AAAA,MAIzDA,QAJyD,8BAI9C,KAJ8C;AAAA,MAKzDC,gBALyD,QAKzDA,gBALyD;AAAA,MAMtDK,IANsD;;AAAA,SAQzDC,mBAAA,CAACV,YAAD;AACEE,IAAAA,SAAS,EAAEc,UAAU,CAACd,SAAD,EAAY;AAC/B,oCAA8BuB,KAAK,KAAK;AADT,KAAZ;KAGjBhB;AACJH,IAAAA,OAAO,EAAEA;AACTH,IAAAA,QAAQ,EAAEA;AACVC,IAAAA,gBAAgB,EAAEA;AAClBG,IAAAA,IAAI,EAAC;IARP,CARyD;AAAA,CAApD;;ACGP,IAAMmB,YAAY,gBAAGhB,KAAK,CAACiB,aAAN,CAA6C,IAA7C,CAArB;;AAEA,IAAMC,YAAY,GAAG,SAAfA,YAAe,CACnBC,UADmB,EAEnBC,MAFmB;AAInB,UAAQA,MAAM,CAACb,IAAf;AACE,SAAK,WAAL;AACE,cAAQa,MAAM,CAACC,OAAf,SAA2BF,UAA3B;;AACF,SAAK,cAAL;AACE,aAAOA,UAAU,CAACG,MAAX,CAAkB,UAAAC,KAAK;AAAA,eAAIA,KAAK,CAACC,EAAN,KAAaJ,MAAM,CAACC,OAAxB;AAAA,OAAvB,CAAP;AAJJ;AAMD,CAVD;;AAYA,IAAMI,cAAc,GAAG,SAAjBA,cAAiB;AAAA,SAAMC,IAAI,CAACC,MAAL,GAAcC,QAAd,GAAyBC,SAAzB,CAAmC,CAAnC,CAAN;AAAA,CAAvB;;AAEA,IAAMC,WAAW,GAAG,SAAdA,WAAc,CAACP,KAAD,EAAyBC,EAAzB;AAClB,MAAI,OAAOD,KAAP,KAAiB,QAArB,EAA+B;AAC7B,WAAO;AAAEC,MAAAA,EAAE,EAAFA,EAAF;AAAMO,MAAAA,OAAO,EAAER,KAAf;AAAsB5B,MAAAA,OAAO,EAAE;AAA/B,KAAP;AACD,GAFD,MAEO;AACL;AAAS6B,MAAAA,EAAE,EAAFA,EAAT;AAAa7B,MAAAA,OAAO,EAAE;AAAtB,OAAoC4B,KAApC;AACD;AACF,CAND;;AAuBA,IAAaS,aAAa,GAAiC,SAA9CA,aAA8C;wBACzDC;MAAAA,gCAAQ;MACR1C,gBAAAA;2BACA2C;MAAAA,sCAAW;MACX1C,iBAAAA;MACA2C,aAAAA;;0BAE2BnC,KAAK,CAACoC,UAAN,CAAiBlB,YAAjB,EAA+B,EAA/B;MAApBmB;MAAQC;;wBACmBtC,KAAK,CAACC,QAAN;MAA3BsC;MAAYC;;AACnB,MAAMC,aAAa,GAAGzC,KAAK,CAAC0C,MAAN,CAAwC,EAAxC,CAAtB;AAEA,MAAMC,WAAW,GAAG3C,KAAK,CAAC4C,WAAN,CAAkB,UAACpB,EAAD;AACpCqB,IAAAA,MAAM,CAACC,YAAP,CAAoBL,aAAa,CAACM,OAAd,CAAsBvB,EAAtB,CAApB;AACAc,IAAAA,QAAQ,CAAC;AAAE/B,MAAAA,IAAI,EAAE,cAAR;AAAwBc,MAAAA,OAAO,EAAEG;AAAjC,KAAD,CAAR;AACA,WAAOiB,aAAa,CAACM,OAAd,CAAsBvB,EAAtB,CAAP;AACD,GAJmB,EAIjB,EAJiB,CAApB;AAMA,MAAMwB,QAAQ,GAAGhD,KAAK,CAAC4C,WAAN,CACf,UAACrB,KAAD;AACE,QAAMC,EAAE,GAAGC,cAAc,EAAzB;AACA,QAAMJ,OAAO,GAAGS,WAAW,CAACP,KAAD,EAAQC,EAAR,CAA3B;AACAc,IAAAA,QAAQ,CAAC;AAAE/B,MAAAA,IAAI,EAAE,WAAR;AAAqBc,MAAAA,OAAO,EAAPA;AAArB,KAAD,CAAR;AACAoB,IAAAA,aAAa,CAACM,OAAd,CAAsBvB,EAAtB,IAA4BqB,MAAM,CAACI,UAAP,CAC1B;AAAA,aAAMN,WAAW,CAACnB,EAAD,CAAjB;AAAA,KAD0B,EAE1BS,KAF0B,CAA5B;AAID,GATc,EAUf,CAACA,KAAD,EAAQU,WAAR,CAVe,CAAjB;;AAaA,MAAMO,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,OAAD;AAAA,WAAsB;AAC7CX,MAAAA,WAAW,CAACW,OAAD,CAAX;AACAC,MAAAA,MAAM,CAACC,MAAP,CAAcZ,aAAa,CAACM,OAA5B,EAAqCO,OAArC,CAA6C,UAAAC,SAAS;AAAA,eACpDV,MAAM,CAACC,YAAP,CAAoBS,SAApB,CADoD;AAAA,OAAtD;AAGAd,MAAAA,aAAa,CAACM,OAAd,GAAwB,EAAxB;AACD,KANwB;AAAA,GAAzB;;AAQA,MAAMS,gBAAgB,GAAG,SAAnBA,gBAAmB;AACvBhB,IAAAA,WAAW,CAACiB,SAAD,CAAX;AACApB,IAAAA,MAAM,CAACiB,OAAP,CAAe,UAAA/B,KAAK;AAClBkB,MAAAA,aAAa,CAACM,OAAd,CAAsBxB,KAAK,CAACC,EAA5B,IAAkCqB,MAAM,CAACI,UAAP,CAChC;AAAA,eAAMN,WAAW,CAACpB,KAAK,CAACC,EAAP,CAAjB;AAAA,OADgC,EAEhCS,KAFgC,CAAlC;AAID,KALD;AAMD,GARD;;AAUA,MAAM7B,WAAW,GAAG,SAAdA,WAAc,CAAC+C,OAAD;AAAA,WAAsB;AACxCR,MAAAA,WAAW,CAACQ,OAAD,CAAX;AACAK,MAAAA,gBAAgB;AACjB,KAHmB;AAAA,GAApB;;AAKA,MAAME,YAAY,GAAG1D,KAAK,CAAC2D,OAAN,CACnB;AAAA,WAAO;AAAEtB,MAAAA,MAAM,EAANA,MAAF;AAAUW,MAAAA,QAAQ,EAARA,QAAV;AAAoBL,MAAAA,WAAW,EAAXA;AAApB,KAAP;AAAA,GADmB,EAEnB,CAACK,QAAD,EAAWL,WAAX,EAAwBN,MAAxB,CAFmB,CAArB;AAKA,SACErC,mBAAA,CAACgB,YAAY,CAAC4C,QAAd;AAAuBC,IAAAA,KAAK,EAAEH;GAA9B,EACGrB,MAAM,CAACyB,MAAP,GAAgB,CAAhB,IACC9D,mBAAA,MAAA;AACER,IAAAA,SAAS,EAAEc,UAAU,CACnB,qBADmB,4BAEK4B,QAFL,EAGnB1C,SAHmB;AAKrB2C,IAAAA,KAAK,EAAEA;GANT,EAQGE,MAAM,CAAC0B,KAAP,CAAa,CAAb,EAAgB,CAAhB,EAAmBC,GAAnB,CAAuB,UAAAC,WAAW;AAAA,WACjCjE,mBAAA,CAACY,aAAD;AACEjB,MAAAA,OAAO,EAAEsE,WAAW,CAACtE;AACrBG,MAAAA,KAAK,EAAEmE,WAAW,CAACnE;AACnBF,MAAAA,OAAO,EAAEQ,WAAW,CAAC6D,WAAW,CAACzC,EAAb;AACpB0C,MAAAA,YAAY,EAAEhB,gBAAgB,CAACe,WAAW,CAACzC,EAAb;AAC9B2C,MAAAA,YAAY,EAAEX;AACd/D,MAAAA,QAAQ,EAAE8C,UAAU,KAAK0B,WAAW,CAACzC;AACrC4C,MAAAA,GAAG,EAAEH,WAAW,CAACzC;KAPnB,EASGyC,WAAW,CAAClC,OATf,CADiC;AAAA,GAAlC,CARH,CAFJ,EAyBGxC,QAzBH,CADF;AA6BD,CAvFM;AAyFP,IAAa8E,QAAQ,GAEjB,SAFSA,QAET;AACF,MAAMC,OAAO,GAAGtE,KAAK,CAACuE,UAAN,CAAiBvD,YAAjB,CAAhB;;AACA,MAAI,CAACsD,OAAL,EAAc;AACZ,UAAM,IAAIE,KAAJ,CACJ,qEACE,gCAFE,CAAN;AAID;;MACOxB,WAAasB,QAAbtB;AACR,SAAO;AACLA,IAAAA,QAAQ,EAARA;AADK,GAAP;AAGD,CAdM;;IClJMyB,uBAAuB,GAA2C,SAAlEA,uBAAkE,CAAA9D,KAAK;AAClF,SAAOX,mBAAA,CAAC0E,kBAAD;AAAoB7E,IAAAA,IAAI,EAAC;KAAYc,MAArC,CAAP;AACD,CAFM;AAOP,IAAagE,wBAAwB,GAA4C,SAApEA,wBAAoE,CAAAhE,KAAK;AACpF,SAAOX,mBAAA,CAAC0E,kBAAD;AAAoB7E,IAAAA,IAAI,EAAC;KAAac,MAAtC,CAAP;AACD,CAFM;;AAwBP,IAAM+D,kBAAkB,GAAsC,SAAxDA,kBAAwD;MAC5D/E,eAAAA;MACAG,aAAAA;MACAP,gBAAAA;MACAM,YAAAA;MACAL,iBAAAA;MACAoF,iBAAAA;MACAC,kBAAAA;MACG9E;;wBAEqBC,KAAK,CAACC,QAAN,CAAe,KAAf;MAAjB6E;MAAMC;;AACb,SACE/E,mBAAA,CAACV,YAAD;AACEO,IAAAA,IAAI,EAAEA;AACNF,IAAAA,OAAO,EAAEA;AACTH,IAAAA,SAAS,EAAEc,UAAU,CAAC,0BAAD,EAA6Bd,SAA7B;AACrBM,IAAAA,KAAK,EACHE,mBAAA,CAACgF,uBAAD;AACEF,MAAAA,IAAI,EAAEA;AACNhF,MAAAA,KAAK,EAAEA;AACPU,MAAAA,OAAO,EAAE;AAAA,eAAMuE,OAAO,CAAC,CAACD,IAAF,CAAb;AAAA;AACTF,MAAAA,SAAS,EAAEA;AACXC,MAAAA,UAAU,EAAEA;KALd;KAQE9E,KAbN,EAeEC,mBAAA,CAACiF,UAAD;AAAYH,IAAAA,IAAI,EAAEA;GAAlB,EAAyBvF,QAAzB,CAfF,CADF;AAmBD,CA9BD;;AAwCA,IAAMyF,uBAAuB,GAA2C,SAAlEA,uBAAkE;MACtElF,cAAAA;MACAgF,aAAAA;8BACAF;MAAAA,yCAAY;+BACZC;MAAAA,2CAAa;MACbrE,gBAAAA;AAEA,SACER,mBAAA,MAAA;AAAKR,IAAAA,SAAS,EAAC;GAAf,EACEQ,mBAAA,MAAA,MAAA,EAAMF,KAAN,CADF,EAEEE,mBAAA,SAAA;AACER,IAAAA,SAAS,EAAC;AACVgB,IAAAA,OAAO,EAAEA;AACTD,IAAAA,IAAI,EAAC;GAHP,EAKGuE,IAAI,GAAGD,UAAH,GAAgBD,SALvB,EAME5E,mBAAA,CAACkF,WAAD;AAAaJ,IAAAA,IAAI,EAAEA;AAAMK,IAAAA,MAAM;GAA/B,CANF,CAFF,CADF;AAaD,CApBD;;AC/EAC,sBAAsB,CAAC,OAAD,EAAU,OAAV,CAAtB;;;;"}
|
|
1
|
+
{"version":3,"file":"alert.esm.js","sources":["../src/BaseAlertBox.tsx","../src/BannerAlertBox.tsx","../src/ToastAlertBox.tsx","../src/SmallAlertBox.tsx","../src/ToastProvider.tsx","../src/CopyableText.tsx","../src/ExpandableAlertBox.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport {\n CloseIcon,\n OutlinedValidationCheckIcon,\n OutlinedValidationExclamationIcon,\n OutlinedValidationInfoIcon,\n OutlinedValidationErrorIcon,\n} from '@entur/icons';\nimport './styles.scss';\n\nconst iconsMap = {\n success: OutlinedValidationCheckIcon,\n info: OutlinedValidationInfoIcon,\n warning: OutlinedValidationExclamationIcon,\n error: OutlinedValidationErrorIcon,\n};\n\ntype BaseAlertBoxProps = {\n /** Innholdet i alert-boksen */\n children?: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises\n * @default \"Lukk\"\n */\n closeButtonLabel?: string;\n /** Callback som kalles når man lukker boksen\n * @default () => {}\n */\n onClose?: () => void;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne\n * @default false\n */\n closable?: boolean;\n /** Tittel på boksen - oppsummer virkning */\n title?: React.ReactNode;\n /** Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n /** Typen boks (internt bruk) */\n size: 'banner' | 'toast' | 'small';\n [key: string]: any;\n};\n\nexport const BaseAlertBox: React.FC<BaseAlertBoxProps> = ({\n children,\n className,\n closable = false,\n closeButtonLabel = 'Lukk',\n variant,\n onClose = () => ({}),\n size,\n title,\n ...rest\n}) => {\n const [isClosed, setClosed] = React.useState(false);\n if (isClosed) {\n return null;\n }\n const handleClose = () => {\n setClosed(true);\n onClose();\n };\n const Icon = iconsMap[variant];\n return (\n <div\n className={classNames(\n 'eds-alert-box',\n `eds-alert-box--${size}`,\n `eds-alert-box--${variant}`,\n className,\n )}\n {...rest}\n >\n {closable && (\n <button\n aria-label={closeButtonLabel}\n className=\"eds-alert-box__close-button\"\n type=\"button\"\n onClick={handleClose}\n >\n <CloseIcon />\n </button>\n )}\n <Icon className=\"eds-alert-box__icon\" />\n <div\n className={classNames('eds-alert-box__content', {\n 'eds-alert-box__content--no-title': !title,\n 'eds-alert-box__content--no-children': !children,\n })}\n >\n {title && <div className=\"eds-alert-box__title\">{title}</div>}\n {children && children}\n </div>\n </div>\n );\n};\n","import React from 'react';\nimport { BaseAlertBox } from './BaseAlertBox';\n\nexport type BannerAlertBoxProps = {\n /** Innholdet i alert-boksen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises */\n closeButtonLabel?: string;\n /** Callback som kalles når man lukker boksen */\n onClose?: () => void;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne\n * @default false\n */\n closable?: boolean;\n /** Tittel på boksen - oppsummer virkning */\n title?: string;\n /** Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n [key: string]: any;\n};\n\nexport const BannerAlertBox: React.FC<BannerAlertBoxProps> = props => (\n <BaseAlertBox {...props} size=\"banner\" />\n);\n","import React from 'react';\nimport { BaseAlertBox } from './BaseAlertBox';\n\nexport type ToastAlertBoxProps = {\n /** Innholdet i toasten */\n children?: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises */\n closeButtonLabel?: string;\n /** Callback som kalles når man lukker boksen */\n onClose?: () => void;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne */\n closable?: boolean;\n /** Tittel på boksen - oppsummer virkning */\n title?: string;\n /** Farge og uttrykk på toasten */\n variant: 'success' | 'info';\n [key: string]: any;\n};\n\nexport const ToastAlertBox: React.FC<ToastAlertBoxProps> = props => (\n <BaseAlertBox {...props} size=\"toast\" role=\"status\" />\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { BaseAlertBox } from './BaseAlertBox';\n\nexport type SmallAlertBoxProps = {\n /** Innholdet i alert-boksen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Skjermleser-label for lukkeknappen, om den vises */\n closeButtonLabel?: string;\n /** Om denne er true, vil boksen få en lukkeknapp i høyre hjørne\n * @default false\n */\n closable?: boolean;\n /** Callback som kalles når man lukker boksen */\n onClose?: () => void;\n /** Tittel på boksen - oppsummer virkning */\n title?: string;\n /** Bredden på boksen - fullbredde eller tilpasset innholdet */\n width?: 'fluid' | 'fit-content';\n /** Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n [key: string]: any;\n};\n\nexport const SmallAlertBox: React.FC<SmallAlertBoxProps> = ({\n className,\n width,\n onClose,\n closable = false,\n closeButtonLabel,\n ...rest\n}) => (\n <BaseAlertBox\n className={classNames(className, {\n 'eds-alert-box--fit-content': width === 'fit-content',\n })}\n {...rest}\n onClose={onClose}\n closable={closable}\n closeButtonLabel={closeButtonLabel}\n size=\"small\"\n />\n);\n","import React from 'react';\nimport { ToastAlertBox } from './ToastAlertBox';\nimport classNames from 'classnames';\n\ntype ToastId = string;\n\ntype ToastVariants = 'success' | 'info';\n\ntype ToastType = {\n title?: string;\n content: React.ReactNode;\n id: ToastId;\n variant: ToastVariants;\n};\n\ntype ToastContextType = {\n addToast: (payload: AddToastPayload) => void;\n removeToast: (id: ToastId) => void;\n toasts: ToastType[];\n};\n\ntype AddToastPayload =\n | { title?: string; content: React.ReactNode; variant?: ToastVariants }\n | string;\n\ntype ToastAction =\n | { type: 'ADD_TOAST'; payload: ToastType }\n | { type: 'REMOVE_TOAST'; payload: ToastId };\n\nconst ToastContext = React.createContext<ToastContextType | null>(null);\n\nconst toastReducer = (\n prevToasts: ToastType[],\n action: ToastAction,\n): ToastType[] => {\n switch (action.type) {\n case 'ADD_TOAST':\n return [action.payload, ...prevToasts];\n case 'REMOVE_TOAST':\n return prevToasts.filter(toast => toast.id !== action.payload);\n }\n};\n\nconst createUniqueId = () => Math.random().toString().substring(2);\n\nconst createToast = (toast: AddToastPayload, id: ToastId): ToastType => {\n if (typeof toast === 'string') {\n return { id, content: toast, variant: 'success' };\n } else {\n return { id, variant: 'success', ...toast };\n }\n};\n\nexport type ToastProviderProps = {\n /** Antall millisekunder før toasts forsvinner av seg selv\n * @default 6000\n */\n delay?: number;\n /** Plasseringen av toasts\n * @default \"bottom-right\"\n */\n position?: 'bottom-right' | 'top-right';\n /** Ekstra klassenavn til ToastProvider-wrapperen */\n className?: string;\n /** Ekstra styling som sendes til ToastProvider-wrapperen */\n style?: React.CSSProperties;\n};\n\nexport const ToastProvider: React.FC<ToastProviderProps> = ({\n delay = 6000,\n children,\n position = 'bottom-right',\n className,\n style,\n}) => {\n const [toasts, dispatch] = React.useReducer(toastReducer, []);\n const [hoveringId, setHovering] = React.useState<string>();\n const timeoutIdRefs = React.useRef<{ [key: string]: number }>({});\n\n const removeToast = React.useCallback((id: ToastId) => {\n window.clearTimeout(timeoutIdRefs.current[id]);\n dispatch({ type: 'REMOVE_TOAST', payload: id });\n delete timeoutIdRefs.current[id];\n }, []);\n\n const addToast = React.useCallback(\n (toast: AddToastPayload) => {\n const id = createUniqueId();\n const payload = createToast(toast, id);\n dispatch({ type: 'ADD_TOAST', payload });\n timeoutIdRefs.current[id] = window.setTimeout(\n () => removeToast(id),\n delay,\n );\n },\n [delay, removeToast],\n );\n\n const handleMouseEnter = (toastId: ToastId) => () => {\n setHovering(toastId);\n Object.values(timeoutIdRefs.current).forEach(timeoutId =>\n window.clearTimeout(timeoutId),\n );\n timeoutIdRefs.current = {};\n };\n\n const handleMouseLeave = () => {\n setHovering(undefined);\n toasts.forEach(toast => {\n timeoutIdRefs.current[toast.id] = window.setTimeout(\n () => removeToast(toast.id),\n delay,\n );\n });\n };\n\n const handleClose = (toastId: ToastId) => () => {\n removeToast(toastId);\n handleMouseLeave();\n };\n\n const contextValue = React.useMemo(\n () => ({ toasts, addToast, removeToast }),\n [addToast, removeToast, toasts],\n );\n\n return (\n <ToastContext.Provider value={contextValue}>\n {toasts.length > 0 && (\n <div\n className={classNames(\n 'eds-toast-container',\n `eds-toast-container--${position}`,\n className,\n )}\n style={style}\n >\n {toasts.slice(0, 3).map(toastToShow => (\n <ToastAlertBox\n variant={toastToShow.variant}\n title={toastToShow.title}\n onClose={handleClose(toastToShow.id)}\n onMouseEnter={handleMouseEnter(toastToShow.id)}\n onMouseLeave={handleMouseLeave}\n closable={hoveringId === toastToShow.id}\n key={toastToShow.id}\n >\n {toastToShow.content}\n </ToastAlertBox>\n ))}\n </div>\n )}\n {children}\n </ToastContext.Provider>\n );\n};\n\nexport const useToast: () => {\n addToast: (payload: AddToastPayload) => void;\n} = () => {\n const context = React.useContext(ToastContext);\n if (!context) {\n throw new Error(\n 'You need to wrap your component in a ToastProvider component in ' +\n 'order to use the useToast hook',\n );\n }\n const { addToast } = context;\n return {\n addToast,\n };\n};\n","import React from 'react';\n\nimport copy from 'copy-text-to-clipboard';\n\nimport { useToast } from './ToastProvider';\nimport { ReportsIcon } from '@entur/icons';\nimport { PreformattedText } from '@entur/typography';\n\nimport './CopyableText.scss';\n\nexport type CopyableTextProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Tekstinnhold som vises og kopieres */\n children: string;\n /** Overskrift i toast-varselet */\n successHeading?: string;\n /** Bekreftelsesmelding i toast-varselet */\n successMessage?: string;\n} & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children'>;\n\nexport const CopyableText = ({\n children,\n successHeading = 'Kopiert!',\n successMessage = 'Innholdet ble kopiert til utklippstavlen.',\n className,\n ...rest\n}: CopyableTextProps): JSX.Element => {\n const { addToast } = useToast();\n const buttonRef = React.useRef<HTMLButtonElement>(null);\n const handleClick = () => {\n buttonRef.current &&\n copy(children, {\n target: buttonRef.current,\n }) &&\n addToast({ title: successHeading, content: successMessage });\n };\n return (\n <button\n className={'copyable-text ' + className}\n style={{ ...rest.style }}\n type=\"button\"\n onClick={handleClick}\n ref={buttonRef}\n aria-label=\"Kopier innhold\"\n {...rest}\n >\n <PreformattedText>{children}</PreformattedText>\n <ReportsIcon className=\"copyable-text__icon\" />\n </button>\n );\n};\n","import { BaseExpand, ExpandArrow } from '@entur/expand/';\nimport classNames from 'classnames';\nimport React from 'react';\nimport { BannerAlertBoxProps } from './BannerAlertBox';\nimport { BaseAlertBox } from './BaseAlertBox';\nimport './ExpandableAlertBox.scss';\nimport { SmallAlertBoxProps } from './SmallAlertBox';\n\nexport type SmallExpandableAlertBoxProps = ExpandableAlertBoxProps &\n SmallAlertBoxProps;\n\nexport const SmallExpandableAlertBox: React.FC<SmallExpandableAlertBoxProps> = props => {\n return <ExpandableAlertBox size=\"small\" {...props} />;\n};\n\nexport type BannerExpandableAlertBoxProps = ExpandableAlertBoxProps &\n BannerAlertBoxProps;\n\nexport const BannerExpandableAlertBox: React.FC<BannerExpandableAlertBoxProps> = props => {\n return <ExpandableAlertBox size=\"banner\" {...props} />;\n};\n\ntype ExpandableAlertBoxProps = {\n /**Farge og uttrykk på alert-boksen */\n variant: 'success' | 'info' | 'warning' | 'error';\n /** Tittelen til ExpandableAlertBox */\n title: React.ReactNode;\n /**Innhold som vises ved ekspandering */\n children: React.ReactNode;\n /**Ekstra klassenavn */\n className?: string;\n /** Tekst som vises på ekspanderingsknappen før åpning\n * @default \"Les mer\"\n */\n openLabel?: string;\n /** Tekst som vises på ekspanderingsknappen når den er åpnet\n * @default \"Lukk\"\n */\n closeLabel?: string;\n [key: string]: any;\n};\n\nconst ExpandableAlertBox: React.FC<ExpandableAlertBoxProps> = ({\n variant,\n title,\n children,\n size,\n className,\n openLabel,\n closeLabel,\n ...rest\n}) => {\n const [open, setopen] = React.useState(false);\n return (\n <BaseAlertBox\n size={size}\n variant={variant}\n className={classNames('eds-expandable-alert-box', className)}\n title={\n <ExpandableAlertBoxTitle\n open={open}\n title={title}\n onClick={() => setopen(!open)}\n openLabel={openLabel}\n closeLabel={closeLabel}\n />\n }\n {...rest}\n >\n <BaseExpand open={open}>{children}</BaseExpand>\n </BaseAlertBox>\n );\n};\n\ntype ExpandableAlertBoxTitleProps = {\n title: React.ReactNode;\n open: boolean;\n openLabel?: string;\n closeLabel?: string;\n onClick: (e: React.MouseEvent) => void;\n};\n\nconst ExpandableAlertBoxTitle: React.FC<ExpandableAlertBoxTitleProps> = ({\n title,\n open,\n openLabel = 'Les mer',\n closeLabel = 'Lukk',\n onClick,\n}) => {\n return (\n <div className=\"eds-expandable-alert-box__title\">\n <div>{title}</div>\n <button\n className=\"eds-expandable-alert-box__button\"\n onClick={onClick}\n type=\"button\"\n >\n {open ? closeLabel : openLabel}\n <ExpandArrow open={open} inline />\n </button>\n </div>\n );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('alert', 'icons');\n\nexport { BannerAlertBox } from './BannerAlertBox';\nexport { ToastAlertBox } from './ToastAlertBox';\nexport { SmallAlertBox } from './SmallAlertBox';\nexport { ToastProvider, useToast } from './ToastProvider';\nexport { CopyableText } from './CopyableText';\nexport * from './ExpandableAlertBox';\n"],"names":["iconsMap","success","OutlinedValidationCheckIcon","info","OutlinedValidationInfoIcon","warning","OutlinedValidationExclamationIcon","error","OutlinedValidationErrorIcon","BaseAlertBox","children","className","closable","closeButtonLabel","variant","onClose","size","title","rest","React","useState","isClosed","setClosed","handleClose","Icon","classNames","type","onClick","CloseIcon","BannerAlertBox","props","ToastAlertBox","role","SmallAlertBox","width","ToastContext","createContext","toastReducer","prevToasts","action","payload","filter","toast","id","createUniqueId","Math","random","toString","substring","createToast","content","ToastProvider","delay","position","style","useReducer","toasts","dispatch","hoveringId","setHovering","timeoutIdRefs","useRef","removeToast","useCallback","window","clearTimeout","current","addToast","setTimeout","handleMouseEnter","toastId","Object","values","forEach","timeoutId","handleMouseLeave","undefined","contextValue","useMemo","Provider","value","length","slice","map","toastToShow","onMouseEnter","onMouseLeave","key","useToast","context","useContext","Error","CopyableText","successHeading","successMessage","buttonRef","handleClick","copy","target","ref","PreformattedText","ReportsIcon","SmallExpandableAlertBox","ExpandableAlertBox","BannerExpandableAlertBox","openLabel","closeLabel","open","setopen","ExpandableAlertBoxTitle","BaseExpand","ExpandArrow","inline","warnAboutMissingStyles"],"mappings":"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"}
|
package/dist/index.d.ts
CHANGED
|
@@ -3,4 +3,5 @@ export { BannerAlertBox } from './BannerAlertBox';
|
|
|
3
3
|
export { ToastAlertBox } from './ToastAlertBox';
|
|
4
4
|
export { SmallAlertBox } from './SmallAlertBox';
|
|
5
5
|
export { ToastProvider, useToast } from './ToastProvider';
|
|
6
|
+
export { CopyableText } from './CopyableText';
|
|
6
7
|
export * from './ExpandableAlertBox';
|
package/dist/styles.css
CHANGED
|
@@ -2,6 +2,45 @@
|
|
|
2
2
|
--eds-alert: 1;
|
|
3
3
|
}/* DO NOT CHANGE!*/
|
|
4
4
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
5
|
+
.copyable-text {
|
|
6
|
+
appearance: none;
|
|
7
|
+
background: none;
|
|
8
|
+
border: 0;
|
|
9
|
+
border-radius: 0;
|
|
10
|
+
color: inherit;
|
|
11
|
+
cursor: pointer;
|
|
12
|
+
display: block;
|
|
13
|
+
font-size: inherit;
|
|
14
|
+
padding: 0;
|
|
15
|
+
position: relative;
|
|
16
|
+
margin: 0 0 1rem 0;
|
|
17
|
+
text-align: left;
|
|
18
|
+
width: 100%;
|
|
19
|
+
}
|
|
20
|
+
.copyable-text > * {
|
|
21
|
+
margin: 0;
|
|
22
|
+
}
|
|
23
|
+
.copyable-text:focus {
|
|
24
|
+
outline-offset: 0.125rem;
|
|
25
|
+
outline: none;
|
|
26
|
+
box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
|
|
27
|
+
}
|
|
28
|
+
.eds-contrast .copyable-text:focus {
|
|
29
|
+
box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
.copyable-text__icon {
|
|
33
|
+
display: none;
|
|
34
|
+
position: absolute;
|
|
35
|
+
right: 1.5rem;
|
|
36
|
+
top: 1rem;
|
|
37
|
+
bottom: 1rem;
|
|
38
|
+
}
|
|
39
|
+
.copyable-text:hover .copyable-text__icon, .copyable-text:focus .copyable-text__icon {
|
|
40
|
+
display: block;
|
|
41
|
+
color: #181c56;
|
|
42
|
+
}/* DO NOT CHANGE!*/
|
|
43
|
+
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
5
44
|
/* DO NOT CHANGE!*/
|
|
6
45
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
7
46
|
.eds-expandable-alert-box .eds-alert-box__content {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@entur/alert",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.10.2",
|
|
4
4
|
"license": "EUPL-1.2",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/alert.esm.js",
|
|
@@ -17,23 +17,29 @@
|
|
|
17
17
|
"access": "public"
|
|
18
18
|
},
|
|
19
19
|
"scripts": {
|
|
20
|
-
"start": "
|
|
21
|
-
"build": "
|
|
22
|
-
"test": "
|
|
23
|
-
"lint": "
|
|
20
|
+
"start": "dts watch --noClean",
|
|
21
|
+
"build": "dts build",
|
|
22
|
+
"test": "dts test --env=jsdom",
|
|
23
|
+
"lint": "dts lint"
|
|
24
24
|
},
|
|
25
25
|
"peerDependencies": {
|
|
26
26
|
"react": ">=16.8.0",
|
|
27
27
|
"react-dom": ">=16.8.0"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@entur/expand": "^3.3.
|
|
31
|
-
"@entur/icons": "^3.
|
|
32
|
-
"@entur/
|
|
33
|
-
"
|
|
30
|
+
"@entur/expand": "^3.3.8",
|
|
31
|
+
"@entur/icons": "^3.5.0",
|
|
32
|
+
"@entur/typography": "^1.6.11",
|
|
33
|
+
"@entur/utils": "^0.4.3",
|
|
34
|
+
"classnames": "^2.3.1",
|
|
35
|
+
"copy-text-to-clipboard": "2.2"
|
|
34
36
|
},
|
|
35
37
|
"devDependencies": {
|
|
36
|
-
"@entur/tokens": "^3.3.
|
|
38
|
+
"@entur/tokens": "^3.3.1"
|
|
37
39
|
},
|
|
38
|
-
"
|
|
40
|
+
"volta": {
|
|
41
|
+
"node": "14.17.0",
|
|
42
|
+
"yarn": "1.18.0"
|
|
43
|
+
},
|
|
44
|
+
"gitHead": "bf06a9d451cb7f978946c05ce04bb4e6f63379af"
|
|
39
45
|
}
|