@entur/alert 0.17.13-beta.8 → 0.17.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/alert.esm.js CHANGED
@@ -1,399 +1,372 @@
1
- import { warnAboutMissingStyles } from '@entur/utils';
2
- import React from 'react';
3
- import classNames from 'classnames';
4
- import { CloseIcon, ValidationSuccessIcon, ValidationInfoIcon, ValidationExclamationIcon, ValidationErrorIcon, CopyIcon } from '@entur/icons';
5
- import { IconButton } from '@entur/button';
6
- import { Tooltip } from '@entur/tooltip';
7
- import copy from 'copy-text-to-clipboard';
8
- import { PreformattedText } from '@entur/typography';
9
- import { BaseExpand, ExpandArrow } from '@entur/expand/';
10
-
11
- function _extends() {
12
- return _extends = Object.assign ? Object.assign.bind() : function (n) {
13
- for (var e = 1; e < arguments.length; e++) {
14
- var t = arguments[e];
15
- for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
16
- }
17
- return n;
18
- }, _extends.apply(null, arguments);
19
- }
20
- function _objectWithoutPropertiesLoose(r, e) {
21
- if (null == r) return {};
22
- var t = {};
23
- for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
24
- if (-1 !== e.indexOf(n)) continue;
25
- t[n] = r[n];
26
- }
27
- return t;
28
- }
29
-
30
- var _excluded$3 = ["children", "className", "closable", "closeButtonLabel", "variant", "onClose", "size", "title", "toastIsBeingRemoved"];
31
- var iconsMap = {
1
+ import { warnAboutMissingStyles } from "@entur/utils";
2
+ import { jsxs, jsx } from "react/jsx-runtime";
3
+ import React from "react";
4
+ import classNames from "classnames";
5
+ import { ValidationErrorIcon, ValidationInfoIcon, ValidationExclamationIcon, ValidationSuccessIcon, CloseIcon, CopyIcon } from "@entur/icons";
6
+ import { IconButton } from "@entur/button";
7
+ import { Tooltip } from "@entur/tooltip";
8
+ import copy from "copy-text-to-clipboard";
9
+ import { PreformattedText } from "@entur/typography";
10
+ import { BaseExpand, ExpandArrow } from "@entur/expand";
11
+ const iconsMap = {
32
12
  success: {
33
13
  icon: ValidationSuccessIcon,
34
- description: 'Suksessmelding'
35
- },
36
- information: {
37
- icon: ValidationInfoIcon,
38
- description: 'Infomelding'
14
+ description: "Suksessmelding"
39
15
  },
16
+ information: { icon: ValidationInfoIcon, description: "Infomelding" },
40
17
  warning: {
41
18
  icon: ValidationExclamationIcon,
42
- description: 'Varselmelding'
43
- },
44
- negative: {
45
- icon: ValidationErrorIcon,
46
- description: 'Feilmelding'
19
+ description: "Varselmelding"
47
20
  },
21
+ negative: { icon: ValidationErrorIcon, description: "Feilmelding" },
48
22
  //deprecated
49
- info: {
50
- icon: ValidationInfoIcon,
51
- description: 'Infomelding'
52
- },
53
- error: {
54
- icon: ValidationErrorIcon,
55
- description: 'Feilmelding'
56
- }
23
+ info: { icon: ValidationInfoIcon, description: "Infomelding" },
24
+ error: { icon: ValidationErrorIcon, description: "Feilmelding" }
57
25
  };
58
- var BaseAlertBox = function BaseAlertBox(_ref) {
59
- var children = _ref.children,
60
- className = _ref.className,
61
- _ref$closable = _ref.closable,
62
- closable = _ref$closable === void 0 ? false : _ref$closable,
63
- _ref$closeButtonLabel = _ref.closeButtonLabel,
64
- closeButtonLabel = _ref$closeButtonLabel === void 0 ? 'Lukk' : _ref$closeButtonLabel,
65
- variant = _ref.variant,
66
- _ref$onClose = _ref.onClose,
67
- onClose = _ref$onClose === void 0 ? function () {
68
- return {};
69
- } : _ref$onClose,
70
- size = _ref.size,
71
- title = _ref.title,
72
- toastIsBeingRemoved = _ref.toastIsBeingRemoved,
73
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
74
- var _React$useState = React.useState(false),
75
- isClosed = _React$useState[0],
76
- setClosed = _React$useState[1];
26
+ const BaseAlertBox = ({
27
+ children,
28
+ className,
29
+ closable = false,
30
+ closeButtonLabel = "Lukk",
31
+ variant,
32
+ onClose = () => ({}),
33
+ size,
34
+ title,
35
+ toastIsBeingRemoved,
36
+ ...rest
37
+ }) => {
38
+ const [isClosed, setClosed] = React.useState(false);
77
39
  if (isClosed) {
78
40
  return null;
79
41
  }
80
- var handleClose = function handleClose() {
42
+ const handleClose = () => {
81
43
  setClosed(true);
82
44
  onClose();
83
45
  };
84
- var Icon = iconsMap[variant].icon;
85
- return React.createElement("div", _extends({
86
- className: classNames('eds-alert-box', "eds-alert-box--" + size, "eds-alert-box--" + variant, {
87
- 'eds-alert-box--toast--exit-animation': toastIsBeingRemoved,
88
- 'eds-alert-box--no-title': !title
89
- }, className)
90
- }, rest), React.createElement(Icon, {
91
- role: "img",
92
- className: "eds-alert-box__icon",
93
- "aria-label": iconsMap[variant].description
94
- }), React.createElement("div", {
95
- className: classNames('eds-alert-box__content', {
96
- 'eds-alert-box__content--no-children': !children
97
- })
98
- }, title && React.createElement("div", {
99
- className: "eds-alert-box__title"
100
- }, title), children && children), closable && React.createElement(Tooltip, {
101
- className: "eds-alert-box__tooltip",
102
- "aria-hidden": true,
103
- placement: "bottom",
104
- content: "Lukk"
105
- }, React.createElement(IconButton, {
106
- className: "eds-alert-box__close-button",
107
- "aria-label": closeButtonLabel,
108
- onClick: handleClose,
109
- type: "button"
110
- }, React.createElement(CloseIcon, null))));
111
- };
112
-
113
- var BannerAlertBox = function BannerAlertBox(props) {
114
- return React.createElement(BaseAlertBox, _extends({}, props, {
115
- size: "banner"
116
- }));
117
- };
118
-
119
- var ToastAlertBox = function ToastAlertBox(props) {
120
- return React.createElement(BaseAlertBox, _extends({}, props, {
121
- size: "toast",
122
- role: "status"
123
- }));
46
+ const Icon = iconsMap[variant].icon;
47
+ return /* @__PURE__ */ jsxs(
48
+ "div",
49
+ {
50
+ className: classNames(
51
+ "eds-alert-box",
52
+ `eds-alert-box--${size}`,
53
+ `eds-alert-box--${variant}`,
54
+ {
55
+ "eds-alert-box--toast--exit-animation": toastIsBeingRemoved,
56
+ "eds-alert-box--no-title": !title
57
+ },
58
+ className
59
+ ),
60
+ ...rest,
61
+ children: [
62
+ /* @__PURE__ */ jsx(
63
+ Icon,
64
+ {
65
+ role: "img",
66
+ className: "eds-alert-box__icon",
67
+ "aria-label": iconsMap[variant].description
68
+ }
69
+ ),
70
+ /* @__PURE__ */ jsxs(
71
+ "div",
72
+ {
73
+ className: classNames("eds-alert-box__content", {
74
+ "eds-alert-box__content--no-children": !children
75
+ }),
76
+ children: [
77
+ title && /* @__PURE__ */ jsx("div", { className: "eds-alert-box__title", children: title }),
78
+ children && children
79
+ ]
80
+ }
81
+ ),
82
+ closable && /* @__PURE__ */ jsx(
83
+ Tooltip,
84
+ {
85
+ className: "eds-alert-box__tooltip",
86
+ "aria-hidden": true,
87
+ placement: "bottom",
88
+ content: "Lukk",
89
+ children: /* @__PURE__ */ jsx(
90
+ IconButton,
91
+ {
92
+ className: "eds-alert-box__close-button",
93
+ "aria-label": closeButtonLabel,
94
+ onClick: handleClose,
95
+ type: "button",
96
+ children: /* @__PURE__ */ jsx(CloseIcon, {})
97
+ }
98
+ )
99
+ }
100
+ )
101
+ ]
102
+ }
103
+ );
124
104
  };
125
-
126
- var _excluded$2 = ["className", "width", "onClose", "closable", "closeButtonLabel"];
127
- var SmallAlertBox = function SmallAlertBox(_ref) {
128
- var className = _ref.className,
129
- width = _ref.width,
130
- onClose = _ref.onClose,
131
- _ref$closable = _ref.closable,
132
- closable = _ref$closable === void 0 ? false : _ref$closable,
133
- closeButtonLabel = _ref.closeButtonLabel,
134
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
135
- return React.createElement(BaseAlertBox, _extends({
105
+ const BannerAlertBox = (props) => /* @__PURE__ */ jsx(BaseAlertBox, { ...props, size: "banner" });
106
+ const ToastAlertBox = (props) => /* @__PURE__ */ jsx(BaseAlertBox, { ...props, size: "toast", role: "status" });
107
+ const SmallAlertBox = ({
108
+ className,
109
+ width,
110
+ onClose,
111
+ closable = false,
112
+ closeButtonLabel,
113
+ ...rest
114
+ }) => /* @__PURE__ */ jsx(
115
+ BaseAlertBox,
116
+ {
136
117
  className: classNames(className, {
137
- 'eds-alert-box--fit-content': width === 'fit-content'
138
- })
139
- }, rest, {
140
- onClose: onClose,
141
- closable: closable,
142
- closeButtonLabel: closeButtonLabel,
118
+ "eds-alert-box--fit-content": width === "fit-content"
119
+ }),
120
+ ...rest,
121
+ onClose,
122
+ closable,
123
+ closeButtonLabel,
143
124
  size: "small"
144
- }));
145
- };
146
-
147
- var EXIT_ANIMATION_TIME = 400;
148
- var ToastContext = /*#__PURE__*/React.createContext(null);
149
- var toastReducer = function toastReducer(prevToasts, action) {
125
+ }
126
+ );
127
+ const EXIT_ANIMATION_TIME = 400;
128
+ const ToastContext = React.createContext(null);
129
+ const toastReducer = (prevToasts, action) => {
150
130
  switch (action.type) {
151
- case 'ADD_TOAST':
152
- return [action.payload].concat(prevToasts);
153
- case 'PLAY_EXIT_ANIMATION':
154
- return prevToasts.map(function (toast) {
155
- if (toast.id === action.payload) return _extends({}, toast, {
156
- isBeingRemoved: true
157
- });
131
+ case "ADD_TOAST":
132
+ return [action.payload, ...prevToasts];
133
+ case "PLAY_EXIT_ANIMATION":
134
+ return prevToasts.map((toast) => {
135
+ if (toast.id === action.payload)
136
+ return { ...toast, isBeingRemoved: true };
158
137
  return toast;
159
138
  });
160
- case 'REMOVE_TOAST':
161
- return prevToasts.filter(function (toast) {
162
- return toast.id !== action.payload;
163
- });
139
+ case "REMOVE_TOAST":
140
+ return prevToasts.filter((toast) => toast.id !== action.payload);
164
141
  }
165
142
  };
166
- var createUniqueId = function createUniqueId() {
167
- return Math.random().toString().substring(2);
168
- };
169
- var createToast = function createToast(toast, id) {
170
- if (typeof toast === 'string') {
171
- return {
172
- id: id,
173
- content: toast,
174
- variant: 'success',
175
- isBeingRemoved: false
176
- };
143
+ const createUniqueId = () => Math.random().toString().substring(2);
144
+ const createToast = (toast, id) => {
145
+ if (typeof toast === "string") {
146
+ return { id, content: toast, variant: "success", isBeingRemoved: false };
177
147
  } else {
178
- return _extends({
179
- id: id,
180
- variant: 'success',
181
- isBeingRemoved: false
182
- }, toast);
148
+ return { id, variant: "success", isBeingRemoved: false, ...toast };
183
149
  }
184
150
  };
185
- var ToastProvider = function ToastProvider(_ref) {
186
- var _ref$delay = _ref.delay,
187
- delay = _ref$delay === void 0 ? 6000 : _ref$delay,
188
- children = _ref.children,
189
- _ref$position = _ref.position,
190
- position = _ref$position === void 0 ? 'bottom-right' : _ref$position,
191
- className = _ref.className,
192
- style = _ref.style;
193
- var _React$useReducer = React.useReducer(toastReducer, []),
194
- toasts = _React$useReducer[0],
195
- dispatch = _React$useReducer[1];
196
- var _React$useState = React.useState(),
197
- hoveringId = _React$useState[0],
198
- setHovering = _React$useState[1];
199
- var timeoutIdRefs = React.useRef({});
200
- var removeToast = React.useCallback(function (id) {
151
+ const ToastProvider = ({
152
+ delay = 6e3,
153
+ children,
154
+ position = "bottom-right",
155
+ className,
156
+ style
157
+ }) => {
158
+ const [toasts, dispatch] = React.useReducer(toastReducer, []);
159
+ const [hoveringId, setHovering] = React.useState();
160
+ const timeoutIdRefs = React.useRef({});
161
+ const removeToast = React.useCallback((id) => {
201
162
  window.clearTimeout(timeoutIdRefs.current[id]);
202
- dispatch({
203
- type: 'REMOVE_TOAST',
204
- payload: id
205
- });
163
+ dispatch({ type: "REMOVE_TOAST", payload: id });
206
164
  delete timeoutIdRefs.current[id];
207
165
  }, []);
208
- var playExitAnimation = React.useCallback(function (id) {
209
- window.clearTimeout(timeoutIdRefs.current[id + 'animation']);
210
- dispatch({
211
- type: 'PLAY_EXIT_ANIMATION',
212
- payload: id
213
- });
214
- delete timeoutIdRefs.current[id + 'animation'];
166
+ const playExitAnimation = React.useCallback((id) => {
167
+ window.clearTimeout(timeoutIdRefs.current[id + "animation"]);
168
+ dispatch({ type: "PLAY_EXIT_ANIMATION", payload: id });
169
+ delete timeoutIdRefs.current[id + "animation"];
215
170
  }, []);
216
- var removeToastWithAnimationAfterDelay = React.useCallback(function (id, delay) {
217
- timeoutIdRefs.current[id + 'animation'] = window.setTimeout(function () {
218
- return playExitAnimation(id);
219
- }, delay - EXIT_ANIMATION_TIME);
220
- timeoutIdRefs.current[id] = window.setTimeout(function () {
221
- return removeToast(id);
222
- }, delay);
223
- }, [timeoutIdRefs, playExitAnimation, removeToast]);
224
- var addToast = React.useCallback(function (toast) {
225
- var id = createUniqueId();
226
- var payload = createToast(toast, id);
227
- dispatch({
228
- type: 'ADD_TOAST',
229
- payload: payload
171
+ const removeToastWithAnimationAfterDelay = React.useCallback(
172
+ (id, delay2) => {
173
+ timeoutIdRefs.current[id + "animation"] = window.setTimeout(
174
+ () => playExitAnimation(id),
175
+ delay2 - EXIT_ANIMATION_TIME
176
+ );
177
+ timeoutIdRefs.current[id] = window.setTimeout(
178
+ () => removeToast(id),
179
+ delay2
180
+ );
181
+ },
182
+ [timeoutIdRefs, playExitAnimation, removeToast]
183
+ );
184
+ const addToast = React.useCallback(
185
+ (toast) => {
186
+ const id = createUniqueId();
187
+ const payload = createToast(toast, id);
188
+ dispatch({ type: "ADD_TOAST", payload });
189
+ removeToastWithAnimationAfterDelay(id, delay);
190
+ },
191
+ [delay, removeToastWithAnimationAfterDelay]
192
+ );
193
+ const handleMouseEnter = (toast) => () => {
194
+ if (toast.isBeingRemoved) return;
195
+ setHovering(toast.id);
196
+ Object.values(timeoutIdRefs.current).forEach((timeoutId) => {
197
+ window.clearTimeout(timeoutId);
230
198
  });
231
- removeToastWithAnimationAfterDelay(id, delay);
232
- }, [delay, removeToastWithAnimationAfterDelay]);
233
- var handleMouseEnter = function handleMouseEnter(toast) {
234
- return function () {
235
- if (toast.isBeingRemoved) return;
236
- setHovering(toast.id);
237
- Object.values(timeoutIdRefs.current).forEach(function (timeoutId) {
238
- window.clearTimeout(timeoutId);
239
- });
240
- timeoutIdRefs.current = {};
241
- };
199
+ timeoutIdRefs.current = {};
242
200
  };
243
- var handleMouseLeave = function handleMouseLeave() {
244
- setHovering(undefined);
245
- toasts.forEach(function (toast) {
201
+ const handleMouseLeave = () => {
202
+ setHovering(void 0);
203
+ toasts.forEach((toast) => {
246
204
  removeToastWithAnimationAfterDelay(toast.id, delay);
247
205
  });
248
206
  };
249
- var handleClose = function handleClose(toastId) {
250
- return function () {
251
- removeToast(toastId);
252
- handleMouseLeave();
253
- };
207
+ const handleClose = (toastId) => () => {
208
+ removeToast(toastId);
209
+ handleMouseLeave();
254
210
  };
255
- var contextValue = React.useMemo(function () {
256
- return {
257
- toasts: toasts,
258
- addToast: addToast,
259
- removeToast: removeToast
260
- };
261
- }, [addToast, removeToast, toasts]);
262
- return React.createElement(ToastContext.Provider, {
263
- value: contextValue
264
- }, toasts.length > 0 && React.createElement("div", {
265
- className: classNames('eds-toast-container', "eds-toast-container--" + position, className),
266
- style: style
267
- }, toasts.slice(0, 3).map(function (toastToShow) {
268
- return React.createElement(ToastAlertBox, {
269
- variant: toastToShow.variant,
270
- title: toastToShow.title,
271
- onClose: handleClose(toastToShow.id),
272
- onMouseEnter: handleMouseEnter(toastToShow),
273
- onMouseLeave: handleMouseLeave,
274
- closable: hoveringId === toastToShow.id,
275
- toastIsBeingRemoved: toastToShow.isBeingRemoved,
276
- key: toastToShow.id
277
- }, toastToShow.content);
278
- })), children);
211
+ const contextValue = React.useMemo(
212
+ () => ({ toasts, addToast, removeToast }),
213
+ [addToast, removeToast, toasts]
214
+ );
215
+ return /* @__PURE__ */ jsxs(ToastContext.Provider, { value: contextValue, children: [
216
+ toasts.length > 0 && /* @__PURE__ */ jsx(
217
+ "div",
218
+ {
219
+ className: classNames(
220
+ "eds-toast-container",
221
+ `eds-toast-container--${position}`,
222
+ className
223
+ ),
224
+ style,
225
+ children: toasts.slice(0, 3).map((toastToShow) => /* @__PURE__ */ jsx(
226
+ ToastAlertBox,
227
+ {
228
+ variant: toastToShow.variant,
229
+ title: toastToShow.title,
230
+ onClose: handleClose(toastToShow.id),
231
+ onMouseEnter: handleMouseEnter(toastToShow),
232
+ onMouseLeave: handleMouseLeave,
233
+ closable: hoveringId === toastToShow.id,
234
+ toastIsBeingRemoved: toastToShow.isBeingRemoved,
235
+ children: toastToShow.content
236
+ },
237
+ toastToShow.id
238
+ ))
239
+ }
240
+ ),
241
+ children
242
+ ] });
279
243
  };
280
- var useToast = function useToast() {
281
- var context = React.useContext(ToastContext);
244
+ const useToast = () => {
245
+ const context = React.useContext(ToastContext);
282
246
  if (!context) {
283
- throw new Error('You need to wrap your component in a ToastProvider component in ' + 'order to use the useToast hook');
247
+ throw new Error(
248
+ "You need to wrap your component in a ToastProvider component in order to use the useToast hook"
249
+ );
284
250
  }
285
- var addToast = context.addToast;
251
+ const { addToast } = context;
286
252
  return {
287
- addToast: addToast
253
+ addToast
288
254
  };
289
255
  };
290
-
291
- var _excluded$1 = ["children", "successHeading", "successMessage", "textToCopy", "className", "aria-label"];
292
- var CopyableText = function CopyableText(_ref) {
293
- var children = _ref.children,
294
- _ref$successHeading = _ref.successHeading,
295
- successHeading = _ref$successHeading === void 0 ? 'Kopiert!' : _ref$successHeading,
296
- successMessage = _ref.successMessage,
297
- textToCopy = _ref.textToCopy,
298
- className = _ref.className,
299
- _ref$ariaLabel = _ref['aria-label'],
300
- ariaLabel = _ref$ariaLabel === void 0 ? "Kopier " + (textToCopy != null ? textToCopy : children) + " til utklippstavlen" : _ref$ariaLabel,
301
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
302
- var _useToast = useToast(),
303
- addToast = _useToast.addToast;
304
- var buttonRef = React.useRef(null);
305
- var _textToCopy = textToCopy != null ? textToCopy : children;
306
- var _successMessage = successMessage != null ? successMessage : _textToCopy + " ble kopiert til utklippstavlen.";
307
- var handleClick = function handleClick() {
256
+ const CopyableText = ({
257
+ children,
258
+ successHeading = "Kopiert!",
259
+ successMessage,
260
+ textToCopy,
261
+ className,
262
+ "aria-label": ariaLabel = `Kopier ${textToCopy ?? children} til utklippstavlen`,
263
+ ...rest
264
+ }) => {
265
+ const { addToast } = useToast();
266
+ const buttonRef = React.useRef(null);
267
+ const _textToCopy = textToCopy ?? children;
268
+ const _successMessage = successMessage ?? `${_textToCopy} ble kopiert til utklippstavlen.`;
269
+ const handleClick = () => {
308
270
  buttonRef.current && copy(_textToCopy, {
309
271
  target: buttonRef.current
310
- }) && addToast({
311
- title: successHeading,
312
- content: _successMessage
313
- });
272
+ }) && addToast({ title: successHeading, content: _successMessage });
314
273
  };
315
- return React.createElement("div", _extends({
316
- className: 'eds-copyable-text ' + className,
317
- style: _extends({}, rest.style),
318
- type: "button",
319
- onClick: handleClick,
320
- tabIndex: -1,
321
- "aria-label": ""
322
- }, rest), React.createElement(PreformattedText, {
323
- className: "eds-copyable-text__preformatted-text"
324
- }, React.createElement("span", {
325
- className: "eds-copyable-text__displayed-text"
326
- }, children), React.createElement(IconButton, {
327
- className: "eds-copyable-text__button",
328
- "aria-label": ariaLabel,
329
- type: "button",
330
- ref: buttonRef
331
- }, React.createElement(CopyIcon, {
332
- className: 'eds-copyable-text__button__icon'
333
- }))));
274
+ return /* @__PURE__ */ jsx(
275
+ "div",
276
+ {
277
+ className: "eds-copyable-text " + className,
278
+ style: { ...rest.style },
279
+ type: "button",
280
+ onClick: handleClick,
281
+ tabIndex: -1,
282
+ "aria-label": "",
283
+ ...rest,
284
+ children: /* @__PURE__ */ jsxs(PreformattedText, { className: "eds-copyable-text__preformatted-text", children: [
285
+ /* @__PURE__ */ jsx("span", { className: "eds-copyable-text__displayed-text", children }),
286
+ /* @__PURE__ */ jsx(
287
+ IconButton,
288
+ {
289
+ className: "eds-copyable-text__button",
290
+ "aria-label": ariaLabel,
291
+ type: "button",
292
+ ref: buttonRef,
293
+ children: /* @__PURE__ */ jsx(CopyIcon, { className: "eds-copyable-text__button__icon" })
294
+ }
295
+ )
296
+ ] })
297
+ }
298
+ );
334
299
  };
335
-
336
- var _excluded = ["variant", "title", "children", "size", "className", "openLabel", "closeLabel"];
337
- var SmallExpandableAlertBox = function SmallExpandableAlertBox(props) {
338
- return React.createElement(ExpandableAlertBox, _extends({
339
- size: "small"
340
- }, props));
300
+ const SmallExpandableAlertBox = (props) => {
301
+ return /* @__PURE__ */ jsx(ExpandableAlertBox, { size: "small", ...props });
341
302
  };
342
- var BannerExpandableAlertBox = function BannerExpandableAlertBox(props) {
343
- return React.createElement(ExpandableAlertBox, _extends({
344
- size: "banner"
345
- }, props));
303
+ const BannerExpandableAlertBox = (props) => {
304
+ return /* @__PURE__ */ jsx(ExpandableAlertBox, { size: "banner", ...props });
305
+ };
306
+ const ExpandableAlertBox = ({
307
+ variant,
308
+ title,
309
+ children,
310
+ size,
311
+ className,
312
+ openLabel,
313
+ closeLabel,
314
+ ...rest
315
+ }) => {
316
+ const [open, setopen] = React.useState(false);
317
+ return /* @__PURE__ */ jsx(
318
+ BaseAlertBox,
319
+ {
320
+ size,
321
+ variant,
322
+ className: classNames("eds-expandable-alert-box", className),
323
+ title: /* @__PURE__ */ jsx(
324
+ ExpandableAlertBoxTitle,
325
+ {
326
+ open,
327
+ title,
328
+ onClick: () => setopen(!open),
329
+ openLabel,
330
+ closeLabel
331
+ }
332
+ ),
333
+ ...rest,
334
+ children: /* @__PURE__ */ jsx(BaseExpand, { open, children })
335
+ }
336
+ );
346
337
  };
347
- var ExpandableAlertBox = function ExpandableAlertBox(_ref) {
348
- var variant = _ref.variant,
349
- title = _ref.title,
350
- children = _ref.children,
351
- size = _ref.size,
352
- className = _ref.className,
353
- openLabel = _ref.openLabel,
354
- closeLabel = _ref.closeLabel,
355
- rest = _objectWithoutPropertiesLoose(_ref, _excluded);
356
- var _React$useState = React.useState(false),
357
- open = _React$useState[0],
358
- setopen = _React$useState[1];
359
- return React.createElement(BaseAlertBox, _extends({
360
- size: size,
361
- variant: variant,
362
- className: classNames('eds-expandable-alert-box', className),
363
- title: React.createElement(ExpandableAlertBoxTitle, {
364
- open: open,
365
- title: title,
366
- onClick: function onClick() {
367
- return setopen(!open);
368
- },
369
- openLabel: openLabel,
370
- closeLabel: closeLabel
371
- })
372
- }, rest), React.createElement(BaseExpand, {
373
- open: open
374
- }, children));
338
+ const ExpandableAlertBoxTitle = ({
339
+ title,
340
+ open,
341
+ openLabel = "Les mer",
342
+ closeLabel = "Lukk",
343
+ onClick
344
+ }) => {
345
+ return /* @__PURE__ */ jsxs("div", { className: "eds-expandable-alert-box__title", children: [
346
+ /* @__PURE__ */ jsx("div", { children: title }),
347
+ /* @__PURE__ */ jsxs(
348
+ "button",
349
+ {
350
+ className: "eds-expandable-alert-box__button",
351
+ onClick,
352
+ type: "button",
353
+ children: [
354
+ open ? closeLabel : openLabel,
355
+ /* @__PURE__ */ jsx(ExpandArrow, { open, inline: true })
356
+ ]
357
+ }
358
+ )
359
+ ] });
375
360
  };
376
- var ExpandableAlertBoxTitle = function ExpandableAlertBoxTitle(_ref2) {
377
- var title = _ref2.title,
378
- open = _ref2.open,
379
- _ref2$openLabel = _ref2.openLabel,
380
- openLabel = _ref2$openLabel === void 0 ? 'Les mer' : _ref2$openLabel,
381
- _ref2$closeLabel = _ref2.closeLabel,
382
- closeLabel = _ref2$closeLabel === void 0 ? 'Lukk' : _ref2$closeLabel,
383
- onClick = _ref2.onClick;
384
- return React.createElement("div", {
385
- className: "eds-expandable-alert-box__title"
386
- }, React.createElement("div", null, title), React.createElement("button", {
387
- className: "eds-expandable-alert-box__button",
388
- onClick: onClick,
389
- type: "button"
390
- }, open ? closeLabel : openLabel, React.createElement(ExpandArrow, {
391
- open: open,
392
- inline: true
393
- })));
361
+ warnAboutMissingStyles("alert", "icons");
362
+ export {
363
+ BannerAlertBox,
364
+ BannerExpandableAlertBox,
365
+ CopyableText,
366
+ SmallAlertBox,
367
+ SmallExpandableAlertBox,
368
+ ToastAlertBox,
369
+ ToastProvider,
370
+ useToast
394
371
  };
395
-
396
- warnAboutMissingStyles('alert', 'icons');
397
-
398
- export { BannerAlertBox, BannerExpandableAlertBox, CopyableText, SmallAlertBox, SmallExpandableAlertBox, ToastAlertBox, ToastProvider, useToast };
399
372
  //# sourceMappingURL=alert.esm.js.map