@entur/expand 3.4.7 → 3.4.9
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/Accordion.d.ts +17 -17
- package/dist/AccordionItem.d.ts +15 -15
- package/dist/BaseExpand.d.ts +10 -10
- package/dist/BaseExpandablePanel.d.ts +19 -19
- package/dist/ExpandArrow.d.ts +13 -13
- package/dist/ExpandablePanel.d.ts +17 -17
- package/dist/ExpandableText.d.ts +24 -24
- package/dist/ExpandableTextButton.d.ts +14 -14
- package/dist/expand.cjs.development.js +26 -31
- package/dist/expand.cjs.development.js.map +1 -1
- package/dist/expand.cjs.production.min.js +1 -1
- package/dist/expand.cjs.production.min.js.map +1 -1
- package/dist/index.d.ts +8 -8
- package/dist/styles.css +65 -65
- package/package.json +5 -5
package/dist/Accordion.d.ts
CHANGED
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
type Id = string | null;
|
|
3
|
-
export type AccordionProps = {
|
|
4
|
-
/** To eller flere AccordionItem-komponenter */
|
|
5
|
-
children: React.ReactNode;
|
|
6
|
-
[key: string]: any;
|
|
7
|
-
};
|
|
8
|
-
export declare const Accordion: React.FC<AccordionProps>;
|
|
9
|
-
type UseAccordionArgs = {
|
|
10
|
-
id: Id;
|
|
11
|
-
defaultOpen?: boolean;
|
|
12
|
-
};
|
|
13
|
-
export declare const useAccordion: ({ id, defaultOpen }: UseAccordionArgs) => {
|
|
14
|
-
isOpen: boolean;
|
|
15
|
-
toggle: () => void;
|
|
16
|
-
};
|
|
17
|
-
export {};
|
|
1
|
+
import React from 'react';
|
|
2
|
+
type Id = string | null;
|
|
3
|
+
export type AccordionProps = {
|
|
4
|
+
/** To eller flere AccordionItem-komponenter */
|
|
5
|
+
children: React.ReactNode;
|
|
6
|
+
[key: string]: any;
|
|
7
|
+
};
|
|
8
|
+
export declare const Accordion: React.FC<AccordionProps>;
|
|
9
|
+
type UseAccordionArgs = {
|
|
10
|
+
id: Id;
|
|
11
|
+
defaultOpen?: boolean;
|
|
12
|
+
};
|
|
13
|
+
export declare const useAccordion: ({ id, defaultOpen }: UseAccordionArgs) => {
|
|
14
|
+
isOpen: boolean;
|
|
15
|
+
toggle: () => void;
|
|
16
|
+
};
|
|
17
|
+
export {};
|
package/dist/AccordionItem.d.ts
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import React, { CSSProperties } from 'react';
|
|
2
|
-
export type AccordionItemProps = {
|
|
3
|
-
/** Teksten som skal stå i panelet */
|
|
4
|
-
title: React.ReactNode;
|
|
5
|
-
/** Innholdet som skal vises under panelet */
|
|
6
|
-
children: React.ReactNode;
|
|
7
|
-
/** Hvilken tilstand AccordionItem skal ha som default
|
|
8
|
-
* @default false
|
|
9
|
-
*/
|
|
10
|
-
defaultOpen?: boolean;
|
|
11
|
-
/** Styling som sendes til innholdet av AccordionItem */
|
|
12
|
-
contentStyle?: CSSProperties;
|
|
13
|
-
[key: string]: any;
|
|
14
|
-
};
|
|
15
|
-
export declare const AccordionItem: React.FC<AccordionItemProps>;
|
|
1
|
+
import React, { CSSProperties } from 'react';
|
|
2
|
+
export type AccordionItemProps = {
|
|
3
|
+
/** Teksten som skal stå i panelet */
|
|
4
|
+
title: React.ReactNode;
|
|
5
|
+
/** Innholdet som skal vises under panelet */
|
|
6
|
+
children: React.ReactNode;
|
|
7
|
+
/** Hvilken tilstand AccordionItem skal ha som default
|
|
8
|
+
* @default false
|
|
9
|
+
*/
|
|
10
|
+
defaultOpen?: boolean;
|
|
11
|
+
/** Styling som sendes til innholdet av AccordionItem */
|
|
12
|
+
contentStyle?: CSSProperties;
|
|
13
|
+
[key: string]: any;
|
|
14
|
+
};
|
|
15
|
+
export declare const AccordionItem: React.FC<AccordionItemProps>;
|
package/dist/BaseExpand.d.ts
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
type BaseExpandProps = {
|
|
3
|
-
/** Innholdet som skal være expandable */
|
|
4
|
-
children: React.ReactNode;
|
|
5
|
-
/** Boolean for om innholdet vises eller ikke */
|
|
6
|
-
open: boolean;
|
|
7
|
-
[key: string]: any;
|
|
8
|
-
};
|
|
9
|
-
export declare const BaseExpand: React.FC<BaseExpandProps>;
|
|
10
|
-
export {};
|
|
1
|
+
import React from 'react';
|
|
2
|
+
type BaseExpandProps = {
|
|
3
|
+
/** Innholdet som skal være expandable */
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
/** Boolean for om innholdet vises eller ikke */
|
|
6
|
+
open: boolean;
|
|
7
|
+
[key: string]: any;
|
|
8
|
+
};
|
|
9
|
+
export declare const BaseExpand: React.FC<BaseExpandProps>;
|
|
10
|
+
export {};
|
|
@@ -1,19 +1,19 @@
|
|
|
1
|
-
import React, { CSSProperties } from 'react';
|
|
2
|
-
import './BaseExpandablePanel.scss';
|
|
3
|
-
type BaseExpandablePanelProps = {
|
|
4
|
-
/** Teksten som skal stå i panelet */
|
|
5
|
-
title: React.ReactNode;
|
|
6
|
-
/** Innholdet som skal vises under panelet */
|
|
7
|
-
children: React.ReactNode;
|
|
8
|
-
/** IDen til expand-panelet */
|
|
9
|
-
id: string;
|
|
10
|
-
/** Prop for om innholdet er åpent */
|
|
11
|
-
open: boolean;
|
|
12
|
-
/** Funksjonen som styrer åpningen av BaseExpandablePanel */
|
|
13
|
-
onToggle: () => void;
|
|
14
|
-
/** Styling som sendes til innholdet av BaseExpandablePanel */
|
|
15
|
-
contentStyle?: CSSProperties;
|
|
16
|
-
[key: string]: any;
|
|
17
|
-
};
|
|
18
|
-
export declare const BaseExpandablePanel: React.FC<BaseExpandablePanelProps>;
|
|
19
|
-
export {};
|
|
1
|
+
import React, { CSSProperties } from 'react';
|
|
2
|
+
import './BaseExpandablePanel.scss';
|
|
3
|
+
type BaseExpandablePanelProps = {
|
|
4
|
+
/** Teksten som skal stå i panelet */
|
|
5
|
+
title: React.ReactNode;
|
|
6
|
+
/** Innholdet som skal vises under panelet */
|
|
7
|
+
children: React.ReactNode;
|
|
8
|
+
/** IDen til expand-panelet */
|
|
9
|
+
id: string;
|
|
10
|
+
/** Prop for om innholdet er åpent */
|
|
11
|
+
open: boolean;
|
|
12
|
+
/** Funksjonen som styrer åpningen av BaseExpandablePanel */
|
|
13
|
+
onToggle: () => void;
|
|
14
|
+
/** Styling som sendes til innholdet av BaseExpandablePanel */
|
|
15
|
+
contentStyle?: CSSProperties;
|
|
16
|
+
[key: string]: any;
|
|
17
|
+
};
|
|
18
|
+
export declare const BaseExpandablePanel: React.FC<BaseExpandablePanelProps>;
|
|
19
|
+
export {};
|
package/dist/ExpandArrow.d.ts
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import './ExpandArrow.scss';
|
|
3
|
-
type ExpandArrowProps = {
|
|
4
|
-
/** Om innholdet er åpent eller ikke, som bestemmer retningen på pila
|
|
5
|
-
* @default false
|
|
6
|
-
*/
|
|
7
|
-
open?: boolean;
|
|
8
|
-
/** Ekstra klassenavn */
|
|
9
|
-
className?: string;
|
|
10
|
-
[key: string]: any;
|
|
11
|
-
};
|
|
12
|
-
export declare const ExpandArrow: React.FC<ExpandArrowProps>;
|
|
13
|
-
export {};
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './ExpandArrow.scss';
|
|
3
|
+
type ExpandArrowProps = {
|
|
4
|
+
/** Om innholdet er åpent eller ikke, som bestemmer retningen på pila
|
|
5
|
+
* @default false
|
|
6
|
+
*/
|
|
7
|
+
open?: boolean;
|
|
8
|
+
/** Ekstra klassenavn */
|
|
9
|
+
className?: string;
|
|
10
|
+
[key: string]: any;
|
|
11
|
+
};
|
|
12
|
+
export declare const ExpandArrow: React.FC<ExpandArrowProps>;
|
|
13
|
+
export {};
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
import React, { CSSProperties } from 'react';
|
|
2
|
-
export type ExpandablePanelProps = {
|
|
3
|
-
/** Teksten som skal stå i panelet */
|
|
4
|
-
title: React.ReactNode;
|
|
5
|
-
/** Innholdet som skal vises under panelet */
|
|
6
|
-
children: React.ReactNode;
|
|
7
|
-
/** Hvilken tilstand ExpandablePanel skal ha som default
|
|
8
|
-
* @default false
|
|
9
|
-
*/
|
|
10
|
-
defaultOpen?: boolean;
|
|
11
|
-
/** Funksjonen som styrer åpningen av ExpandablePanel */
|
|
12
|
-
onToggle?: () => void;
|
|
13
|
-
/** Styling som sendes til innholdet av ExpandablePanel */
|
|
14
|
-
contentStyle?: CSSProperties;
|
|
15
|
-
[key: string]: any;
|
|
16
|
-
};
|
|
17
|
-
export declare const ExpandablePanel: React.FC<ExpandablePanelProps>;
|
|
1
|
+
import React, { CSSProperties } from 'react';
|
|
2
|
+
export type ExpandablePanelProps = {
|
|
3
|
+
/** Teksten som skal stå i panelet */
|
|
4
|
+
title: React.ReactNode;
|
|
5
|
+
/** Innholdet som skal vises under panelet */
|
|
6
|
+
children: React.ReactNode;
|
|
7
|
+
/** Hvilken tilstand ExpandablePanel skal ha som default
|
|
8
|
+
* @default false
|
|
9
|
+
*/
|
|
10
|
+
defaultOpen?: boolean;
|
|
11
|
+
/** Funksjonen som styrer åpningen av ExpandablePanel */
|
|
12
|
+
onToggle?: () => void;
|
|
13
|
+
/** Styling som sendes til innholdet av ExpandablePanel */
|
|
14
|
+
contentStyle?: CSSProperties;
|
|
15
|
+
[key: string]: any;
|
|
16
|
+
};
|
|
17
|
+
export declare const ExpandablePanel: React.FC<ExpandablePanelProps>;
|
package/dist/ExpandableText.d.ts
CHANGED
|
@@ -1,24 +1,24 @@
|
|
|
1
|
-
import React, { CSSProperties } from 'react';
|
|
2
|
-
import './ExpandableText.scss';
|
|
3
|
-
export type ExpandableTextProps = {
|
|
4
|
-
/** Teksten som skal "vises" */
|
|
5
|
-
title: React.ReactNode;
|
|
6
|
-
/** Innholdet som skal vises under linken */
|
|
7
|
-
children: React.ReactNode;
|
|
8
|
-
/** Hvilken tilstand ExpandableText skal ha som default (med mindre den er kontrollert)
|
|
9
|
-
* @default false
|
|
10
|
-
*/
|
|
11
|
-
defaultOpen?: boolean;
|
|
12
|
-
/** Prop for om innholdet er åpent. Brukes hvis du vil kontrollere ExpandableText, sammen med onToggle */
|
|
13
|
-
open?: boolean;
|
|
14
|
-
/** Funksjonen som styrer åpningen av ExpandableText */
|
|
15
|
-
onToggle?: () => void;
|
|
16
|
-
/**Styling som sendes til innholdet av ExpandableText */
|
|
17
|
-
contentStyle?: CSSProperties;
|
|
18
|
-
/** Hvilket typografisk element tittelen er
|
|
19
|
-
* @default "Heading5"
|
|
20
|
-
*/
|
|
21
|
-
titleElement?: 'Heading5' | 'Paragraph' | 'SubParagraph';
|
|
22
|
-
[key: string]: any;
|
|
23
|
-
};
|
|
24
|
-
export declare const ExpandableText: React.FC<ExpandableTextProps>;
|
|
1
|
+
import React, { CSSProperties } from 'react';
|
|
2
|
+
import './ExpandableText.scss';
|
|
3
|
+
export type ExpandableTextProps = {
|
|
4
|
+
/** Teksten som skal "vises" */
|
|
5
|
+
title: React.ReactNode;
|
|
6
|
+
/** Innholdet som skal vises under linken */
|
|
7
|
+
children: React.ReactNode;
|
|
8
|
+
/** Hvilken tilstand ExpandableText skal ha som default (med mindre den er kontrollert)
|
|
9
|
+
* @default false
|
|
10
|
+
*/
|
|
11
|
+
defaultOpen?: boolean;
|
|
12
|
+
/** Prop for om innholdet er åpent. Brukes hvis du vil kontrollere ExpandableText, sammen med onToggle */
|
|
13
|
+
open?: boolean;
|
|
14
|
+
/** Funksjonen som styrer åpningen av ExpandableText */
|
|
15
|
+
onToggle?: () => void;
|
|
16
|
+
/**Styling som sendes til innholdet av ExpandableText */
|
|
17
|
+
contentStyle?: CSSProperties;
|
|
18
|
+
/** Hvilket typografisk element tittelen er
|
|
19
|
+
* @default "Heading5"
|
|
20
|
+
*/
|
|
21
|
+
titleElement?: 'Heading5' | 'Paragraph' | 'SubParagraph';
|
|
22
|
+
[key: string]: any;
|
|
23
|
+
};
|
|
24
|
+
export declare const ExpandableText: React.FC<ExpandableTextProps>;
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
export type ExandableTextButtonProps = {
|
|
3
|
-
children: React.ReactNode;
|
|
4
|
-
/** Prop for om innholdet er åpent */
|
|
5
|
-
open?: boolean;
|
|
6
|
-
/** Funksjonen som styrer åpningen av ExpandableTextButton */
|
|
7
|
-
onToggle: () => void;
|
|
8
|
-
/** Den typografiske komponenten for tittelen
|
|
9
|
-
* @default Heading5
|
|
10
|
-
*/
|
|
11
|
-
as?: React.ElementType;
|
|
12
|
-
[key: string]: any;
|
|
13
|
-
};
|
|
14
|
-
export declare const ExpandableTextButton: React.FC<ExandableTextButtonProps>;
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export type ExandableTextButtonProps = {
|
|
3
|
+
children: React.ReactNode;
|
|
4
|
+
/** Prop for om innholdet er åpent */
|
|
5
|
+
open?: boolean;
|
|
6
|
+
/** Funksjonen som styrer åpningen av ExpandableTextButton */
|
|
7
|
+
onToggle: () => void;
|
|
8
|
+
/** Den typografiske komponenten for tittelen
|
|
9
|
+
* @default Heading5
|
|
10
|
+
*/
|
|
11
|
+
as?: React.ElementType;
|
|
12
|
+
[key: string]: any;
|
|
13
|
+
};
|
|
14
|
+
export declare const ExpandableTextButton: React.FC<ExandableTextButtonProps>;
|
|
@@ -9,11 +9,6 @@ var typography = require('@entur/typography');
|
|
|
9
9
|
var reactCollapse = require('react-collapse');
|
|
10
10
|
var icons = require('@entur/icons');
|
|
11
11
|
|
|
12
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
13
|
-
|
|
14
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
15
|
-
var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
|
|
16
|
-
|
|
17
12
|
function _extends() {
|
|
18
13
|
_extends = Object.assign ? Object.assign.bind() : function (target) {
|
|
19
14
|
for (var i = 1; i < arguments.length; i++) {
|
|
@@ -44,24 +39,24 @@ function _objectWithoutPropertiesLoose(source, excluded) {
|
|
|
44
39
|
return target;
|
|
45
40
|
}
|
|
46
41
|
|
|
47
|
-
var AccordionContext = /*#__PURE__*/
|
|
42
|
+
var AccordionContext = /*#__PURE__*/React.createContext(null);
|
|
48
43
|
var Accordion = function Accordion(_ref) {
|
|
49
44
|
var rest = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
|
|
50
|
-
var currentlyOpenState =
|
|
51
|
-
return
|
|
45
|
+
var currentlyOpenState = React.useState(null);
|
|
46
|
+
return React.createElement(AccordionContext.Provider, _extends({
|
|
52
47
|
value: currentlyOpenState
|
|
53
48
|
}, rest));
|
|
54
49
|
};
|
|
55
50
|
var useAccordion = function useAccordion(_ref2) {
|
|
56
51
|
var id = _ref2.id,
|
|
57
52
|
defaultOpen = _ref2.defaultOpen;
|
|
58
|
-
var contextValue =
|
|
53
|
+
var contextValue = React.useContext(AccordionContext);
|
|
59
54
|
if (!contextValue) {
|
|
60
55
|
throw new Error('You need to wrap your AccordionItem inside an Accordion');
|
|
61
56
|
}
|
|
62
57
|
var openId = contextValue[0],
|
|
63
58
|
setOpenId = contextValue[1];
|
|
64
|
-
|
|
59
|
+
React.useEffect(function () {
|
|
65
60
|
if (defaultOpen) {
|
|
66
61
|
setOpenId(id);
|
|
67
62
|
}
|
|
@@ -79,9 +74,9 @@ var _excluded$6 = ["open"];
|
|
|
79
74
|
var BaseExpand = function BaseExpand(_ref) {
|
|
80
75
|
var open = _ref.open,
|
|
81
76
|
rest = _objectWithoutPropertiesLoose(_ref, _excluded$6);
|
|
82
|
-
return
|
|
77
|
+
return React.createElement(reactCollapse.UnmountClosed, {
|
|
83
78
|
isOpened: open
|
|
84
|
-
},
|
|
79
|
+
}, React.createElement("div", _extends({}, rest)));
|
|
85
80
|
};
|
|
86
81
|
|
|
87
82
|
var _excluded$5 = ["open", "className"];
|
|
@@ -90,8 +85,8 @@ var ExpandArrow = function ExpandArrow(_ref) {
|
|
|
90
85
|
open = _ref$open === void 0 ? false : _ref$open,
|
|
91
86
|
className = _ref.className,
|
|
92
87
|
rest = _objectWithoutPropertiesLoose(_ref, _excluded$5);
|
|
93
|
-
return
|
|
94
|
-
className:
|
|
88
|
+
return React.createElement(icons.DownArrowIcon, _extends({
|
|
89
|
+
className: classNames(className, 'eds-expandable-arrow', {
|
|
95
90
|
'eds-expandable-arrow--open': open
|
|
96
91
|
})
|
|
97
92
|
}, rest, {
|
|
@@ -109,24 +104,24 @@ var BaseExpandablePanel = function BaseExpandablePanel(_ref) {
|
|
|
109
104
|
onToggle = _ref.onToggle,
|
|
110
105
|
contentStyle = _ref.contentStyle,
|
|
111
106
|
rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
|
|
112
|
-
return
|
|
113
|
-
className:
|
|
114
|
-
},
|
|
107
|
+
return React.createElement("div", {
|
|
108
|
+
className: classNames('eds-expandable-panel', className)
|
|
109
|
+
}, React.createElement("button", _extends({
|
|
115
110
|
type: "button",
|
|
116
111
|
className: "eds-expandable-panel__trigger",
|
|
117
112
|
onClick: onToggle,
|
|
118
113
|
"aria-expanded": open,
|
|
119
114
|
"aria-controls": open ? id : undefined
|
|
120
|
-
}, rest),
|
|
115
|
+
}, rest), React.createElement("span", {
|
|
121
116
|
className: "eds-expandable-panel__grid"
|
|
122
|
-
},
|
|
117
|
+
}, React.createElement(typography.Heading5, {
|
|
123
118
|
margin: "none",
|
|
124
119
|
as: "span"
|
|
125
|
-
}, title),
|
|
120
|
+
}, title), React.createElement("span", {
|
|
126
121
|
className: "eds-expandable-panel__icon-container"
|
|
127
|
-
},
|
|
122
|
+
}, React.createElement(ExpandArrow, {
|
|
128
123
|
open: open
|
|
129
|
-
})))),
|
|
124
|
+
})))), React.createElement(BaseExpand, {
|
|
130
125
|
className: "eds-expandable-panel__content",
|
|
131
126
|
id: id,
|
|
132
127
|
open: open,
|
|
@@ -149,7 +144,7 @@ var AccordionItem = function AccordionItem(_ref) {
|
|
|
149
144
|
}),
|
|
150
145
|
isOpen = _useAccordion.isOpen,
|
|
151
146
|
toggle = _useAccordion.toggle;
|
|
152
|
-
return
|
|
147
|
+
return React.createElement(BaseExpandablePanel, _extends({}, rest, {
|
|
153
148
|
contentStyle: contentStyle,
|
|
154
149
|
id: id,
|
|
155
150
|
onToggle: toggle,
|
|
@@ -164,10 +159,10 @@ var ExpandablePanel = function ExpandablePanel(_ref) {
|
|
|
164
159
|
contentStyle = _ref.contentStyle,
|
|
165
160
|
rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
|
|
166
161
|
var randomId = utils.useRandomId('eds-expandable');
|
|
167
|
-
var _React$useState =
|
|
162
|
+
var _React$useState = React.useState(defaultOpen),
|
|
168
163
|
isOpen = _React$useState[0],
|
|
169
164
|
setOpen = _React$useState[1];
|
|
170
|
-
return
|
|
165
|
+
return React.createElement(BaseExpandablePanel, _extends({
|
|
171
166
|
id: randomId,
|
|
172
167
|
open: isOpen,
|
|
173
168
|
onToggle: function onToggle() {
|
|
@@ -187,12 +182,12 @@ var ExpandableTextButton = function ExpandableTextButton(_ref) {
|
|
|
187
182
|
_ref$as = _ref.as,
|
|
188
183
|
Component = _ref$as === void 0 ? typography.Heading5 : _ref$as,
|
|
189
184
|
rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
|
|
190
|
-
return
|
|
185
|
+
return React.createElement("button", _extends({
|
|
191
186
|
className: "eds-expandable-text__trigger",
|
|
192
187
|
"aria-expanded": open,
|
|
193
188
|
type: "button",
|
|
194
189
|
onClick: onToggle
|
|
195
|
-
}, rest),
|
|
190
|
+
}, rest), React.createElement(Component, null, children), React.createElement(ExpandArrow, {
|
|
196
191
|
open: open,
|
|
197
192
|
className: "eds-expandable-text__arrow"
|
|
198
193
|
}));
|
|
@@ -209,13 +204,13 @@ var ExpandableText = function ExpandableText(_ref) {
|
|
|
209
204
|
titleElement = _ref$titleElement === void 0 ? 'Heading5' : _ref$titleElement,
|
|
210
205
|
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
211
206
|
var randomId = utils.useRandomId('eds-expandable-text');
|
|
212
|
-
var _React$useState =
|
|
207
|
+
var _React$useState = React.useState(defaultOpen),
|
|
213
208
|
isOpen = _React$useState[0],
|
|
214
209
|
setOpen = _React$useState[1];
|
|
215
|
-
var Element =
|
|
210
|
+
var Element = React.useMemo(function () {
|
|
216
211
|
return GetTypographyComponent(titleElement);
|
|
217
212
|
}, [titleElement]);
|
|
218
|
-
return
|
|
213
|
+
return React.createElement(React.Fragment, null, React.createElement(ExpandableTextButton, _extends({
|
|
219
214
|
open: isOpen,
|
|
220
215
|
onToggle: function onToggle() {
|
|
221
216
|
return setOpen(function (prev) {
|
|
@@ -224,7 +219,7 @@ var ExpandableText = function ExpandableText(_ref) {
|
|
|
224
219
|
},
|
|
225
220
|
"aria-controls": isOpen ? randomId : undefined,
|
|
226
221
|
as: Element
|
|
227
|
-
}, rest), title),
|
|
222
|
+
}, rest), title), React.createElement(BaseExpand, _extends({
|
|
228
223
|
className: "eds-expandable-text__content",
|
|
229
224
|
id: randomId,
|
|
230
225
|
open: isOpen,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"expand.cjs.development.js","sources":["../src/Accordion.tsx","../src/BaseExpand.tsx","../src/ExpandArrow.tsx","../src/BaseExpandablePanel.tsx","../src/AccordionItem.tsx","../src/ExpandablePanel.tsx","../src/ExpandableTextButton.tsx","../src/ExpandableText.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\n\ntype Id = string | null;\ntype AccordionContextType = [Id, React.Dispatch<React.SetStateAction<Id>>];\nconst AccordionContext = React.createContext<AccordionContextType | null>(null);\n\nexport type AccordionProps = {\n /** To eller flere AccordionItem-komponenter */\n children: React.ReactNode;\n [key: string]: any;\n};\n\nexport const Accordion: React.FC<AccordionProps> = ({ ...rest }) => {\n const currentlyOpenState = React.useState<Id>(null);\n return <AccordionContext.Provider value={currentlyOpenState} {...rest} />;\n};\n\ntype UseAccordionArgs = {\n id: Id;\n defaultOpen?: boolean;\n};\n\nexport const useAccordion: ({ id, defaultOpen }: UseAccordionArgs) => {\n isOpen: boolean;\n toggle: () => void;\n} = ({ id, defaultOpen }: UseAccordionArgs) => {\n const contextValue = React.useContext(AccordionContext);\n if (!contextValue) {\n throw new Error('You need to wrap your AccordionItem inside an Accordion');\n }\n\n const [openId, setOpenId] = contextValue;\n\n React.useEffect(() => {\n if (defaultOpen) {\n setOpenId(id);\n }\n }, [defaultOpen, id, setOpenId]);\n\n const isOpen = openId === id;\n\n return {\n isOpen,\n toggle: () => setOpenId(isOpen ? null : id),\n };\n};\n","import React from 'react';\n\nimport { UnmountClosed } from 'react-collapse';\n\ntype BaseExpandProps = {\n /** Innholdet som skal være expandable */\n children: React.ReactNode;\n /** Boolean for om innholdet vises eller ikke */\n open: boolean;\n [key: string]: any;\n};\nexport const BaseExpand: React.FC<BaseExpandProps> = ({ open, ...rest }) => {\n return (\n <UnmountClosed isOpened={open}>\n <div {...rest} />\n </UnmountClosed>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { DownArrowIcon } from '@entur/icons';\nimport './ExpandArrow.scss';\n\ntype ExpandArrowProps = {\n /** Om innholdet er åpent eller ikke, som bestemmer retningen på pila\n * @default false\n */\n open?: boolean;\n /** Ekstra klassenavn */\n className?: string;\n [key: string]: any;\n};\n\nexport const ExpandArrow: React.FC<ExpandArrowProps> = ({\n open = false,\n className,\n ...rest\n}) => {\n return (\n <DownArrowIcon\n className={classNames(className, 'eds-expandable-arrow', {\n 'eds-expandable-arrow--open': open,\n })}\n {...rest}\n aria-hidden=\"true\"\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport classNames from 'classnames';\nimport { Heading5 } from '@entur/typography';\nimport { BaseExpand } from './BaseExpand';\n\nimport './BaseExpandablePanel.scss';\nimport { ExpandArrow } from './ExpandArrow';\n\ntype BaseExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** IDen til expand-panelet */\n id: string;\n /** Prop for om innholdet er åpent */\n open: boolean;\n /** Funksjonen som styrer åpningen av BaseExpandablePanel */\n onToggle: () => void;\n /** Styling som sendes til innholdet av BaseExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const BaseExpandablePanel: React.FC<BaseExpandablePanelProps> = ({\n title,\n children,\n className,\n id,\n open,\n onToggle,\n contentStyle,\n ...rest\n}) => {\n return (\n <div className={classNames('eds-expandable-panel', className)}>\n <button\n type=\"button\"\n className=\"eds-expandable-panel__trigger\"\n onClick={onToggle}\n aria-expanded={open}\n aria-controls={open ? id : undefined}\n {...rest}\n >\n <span className=\"eds-expandable-panel__grid\">\n <Heading5 margin=\"none\" as=\"span\">\n {title}\n </Heading5>\n <span className=\"eds-expandable-panel__icon-container\">\n <ExpandArrow open={open} />\n </span>\n </span>\n </button>\n <BaseExpand\n className=\"eds-expandable-panel__content\"\n id={id}\n open={open}\n style={contentStyle}\n >\n {children}\n </BaseExpand>\n </div>\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\nimport { useAccordion } from './Accordion';\n\nexport type AccordionItemProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand AccordionItem skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Styling som sendes til innholdet av AccordionItem */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const AccordionItem: React.FC<AccordionItemProps> = ({\n defaultOpen = false,\n id: overrideId,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-accordion-item');\n const id = overrideId || randomId;\n const { isOpen, toggle } = useAccordion({ id, defaultOpen });\n\n return (\n <BaseExpandablePanel\n {...rest}\n contentStyle={contentStyle}\n id={id}\n onToggle={toggle}\n open={isOpen}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\n\nexport type ExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandablePanel skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Funksjonen som styrer åpningen av ExpandablePanel */\n onToggle?: () => void;\n /** Styling som sendes til innholdet av ExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const ExpandablePanel: React.FC<ExpandablePanelProps> = ({\n defaultOpen = false,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable');\n\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n return (\n <BaseExpandablePanel\n id={randomId}\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n contentStyle={contentStyle}\n {...rest}\n />\n );\n};\n","import React from 'react';\nimport { Heading5 } from '@entur/typography';\nimport { ExpandArrow } from './ExpandArrow';\n\nexport type ExandableTextButtonProps = {\n children: React.ReactNode;\n /** Prop for om innholdet er åpent */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableTextButton */\n onToggle: () => void;\n /** Den typografiske komponenten for tittelen\n * @default Heading5\n */\n as?: React.ElementType;\n [key: string]: any;\n};\n\nexport const ExpandableTextButton: React.FC<ExandableTextButtonProps> = ({\n children,\n open,\n onToggle,\n as: Component = Heading5,\n ...rest\n}) => {\n return (\n <button\n className=\"eds-expandable-text__trigger\"\n aria-expanded={open}\n type=\"button\"\n onClick={onToggle}\n {...rest}\n >\n <Component>{children}</Component>\n <ExpandArrow open={open} className=\"eds-expandable-text__arrow\" />\n </button>\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { ExpandableTextButton } from './ExpandableTextButton';\nimport { BaseExpand } from './BaseExpand';\nimport {\n Heading2,\n Heading3,\n Heading4,\n Heading5,\n Paragraph,\n SubParagraph,\n} from '@entur/typography';\nimport './ExpandableText.scss';\n\nexport type ExpandableTextProps = {\n /** Teksten som skal \"vises\" */\n title: React.ReactNode;\n /** Innholdet som skal vises under linken */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandableText skal ha som default (med mindre den er kontrollert)\n * @default false\n */\n defaultOpen?: boolean;\n /** Prop for om innholdet er åpent. Brukes hvis du vil kontrollere ExpandableText, sammen med onToggle */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableText */\n onToggle?: () => void;\n /**Styling som sendes til innholdet av ExpandableText */\n contentStyle?: CSSProperties;\n /** Hvilket typografisk element tittelen er\n * @default \"Heading5\"\n */\n titleElement?: 'Heading5' | 'Paragraph' | 'SubParagraph';\n [key: string]: any;\n};\n\nexport const ExpandableText: React.FC<ExpandableTextProps> = ({\n title,\n children,\n defaultOpen = false,\n contentStyle,\n titleElement = 'Heading5',\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable-text');\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n const Element: React.ElementType = React.useMemo(\n () => GetTypographyComponent(titleElement),\n [titleElement],\n );\n\n return (\n <>\n <ExpandableTextButton\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n aria-controls={isOpen ? randomId : undefined}\n as={Element}\n {...rest}\n >\n {title}\n </ExpandableTextButton>\n <BaseExpand\n className=\"eds-expandable-text__content\"\n id={randomId}\n open={isOpen}\n style={contentStyle}\n {...rest}\n >\n {children}\n </BaseExpand>\n </>\n );\n};\n\nfunction GetTypographyComponent(\n element:\n | 'Heading5'\n | 'Heading4'\n | 'Heading3'\n | 'Heading2'\n | 'Paragraph'\n | 'SubParagraph',\n) {\n switch (element) {\n case 'Heading5':\n return Heading5;\n case 'Heading4':\n return Heading4;\n case 'Heading3':\n return Heading3;\n case 'Heading2':\n return Heading2;\n case 'Paragraph':\n return Paragraph;\n case 'SubParagraph':\n return SubParagraph;\n default:\n return Heading5;\n }\n}\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('expand', 'typography', 'icons');\n\nexport * from './Accordion';\nexport * from './AccordionItem';\nexport * from './ExpandablePanel';\nexport * from './BaseExpand';\nexport * from './ExpandableText';\nexport * from './ExpandableTextButton';\nexport * from './ExpandArrow';\n"],"names":["AccordionContext","React","createContext","Accordion","rest","currentlyOpenState","useState","createElement","Provider","value","useAccordion","id","defaultOpen","contextValue","useContext","Error","openId","setOpenId","useEffect","isOpen","toggle","BaseExpand","open","_excluded","UnmountClosed","isOpened","ExpandArrow","className","DownArrowIcon","classNames","BaseExpandablePanel","title","children","onToggle","contentStyle","type","onClick","undefined","Heading5","margin","as","style","AccordionItem","overrideId","randomId","useRandomId","ExpandablePanel","setOpen","prev","ExpandableTextButton","Component","ExpandableText","titleElement","Element","useMemo","GetTypographyComponent","Fragment","element","Heading4","Heading3","Heading2","Paragraph","SubParagraph","warnAboutMissingStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,IAAMA,gBAAgB,gBAAGC,yBAAK,CAACC,aAAa,CAA8B,IAAI,CAAC,CAAA;AAQlEC,IAAAA,SAAS,GAA6B,SAAtCA,SAAS,CAA6C,IAAA,EAAA;AAAA,EAAA,IAAVC,IAAI,GAAA,QAAA,CAAA,EAAA,GAAA,yBAAA,CAAA,IAAA,CAAA,EAAA,IAAA,EAAA,CAAA;AAC3D,EAAA,IAAMC,kBAAkB,GAAGJ,yBAAK,CAACK,QAAQ,CAAK,IAAI,CAAC,CAAA;AACnD,EAAA,OAAOL,yBAAA,CAAAM,aAAA,CAACP,gBAAgB,CAACQ,QAAQ,EAAA,QAAA,CAAA;AAACC,IAAAA,KAAK,EAAEJ,kBAAAA;AAAkB,GAAA,EAAMD,IAAI,CAAI,CAAA,CAAA;AAC3E,EAAC;AAOYM,IAAAA,YAAY,GAGrB,SAHSA,YAAY,CAGqB,KAAA,EAAA;EAAA,IAAvCC,EAAE,SAAFA,EAAE;AAAEC,IAAAA,WAAW,SAAXA,WAAW,CAAA;AACpB,EAAA,IAAMC,YAAY,GAAGZ,yBAAK,CAACa,UAAU,CAACd,gBAAgB,CAAC,CAAA;EACvD,IAAI,CAACa,YAAY,EAAE;AACjB,IAAA,MAAM,IAAIE,KAAK,CAAC,yDAAyD,CAAC,CAAA;AAC3E,GAAA;EAED,IAAOC,MAAM,GAAeH,YAAY,CAAA,CAAA,CAAA;AAAzBI,IAAAA,SAAS,GAAIJ,YAAY,CAAA,CAAA,CAAA,CAAA;EAExCZ,yBAAK,CAACiB,SAAS,CAAC,YAAK;AACnB,IAAA,IAAIN,WAAW,EAAE;MACfK,SAAS,CAACN,EAAE,CAAC,CAAA;AACd,KAAA;GACF,EAAE,CAACC,WAAW,EAAED,EAAE,EAAEM,SAAS,CAAC,CAAC,CAAA;AAEhC,EAAA,IAAME,MAAM,GAAGH,MAAM,KAAKL,EAAE,CAAA;EAE5B,OAAO;AACLQ,IAAAA,MAAM,EAANA,MAAM;AACNC,IAAAA,MAAM,EAAE,SAAA,MAAA,GAAA;AAAA,MAAA,OAAMH,SAAS,CAACE,MAAM,GAAG,IAAI,GAAGR,EAAE,CAAC,CAAA;AAAA,KAAA;GAC5C,CAAA;AACH;;;AClCaU,IAAAA,UAAU,GAA8B,SAAxCA,UAAU,CAAoD,IAAA,EAAA;EAAA,IAAnBC,IAAI,QAAJA,IAAI;IAAKlB,IAAI,GAAA,6BAAA,CAAA,IAAA,EAAAmB,WAAA,CAAA,CAAA;AACnE,EAAA,OACEtB,yBAAC,CAAAM,aAAA,CAAAiB,2BAAa,EAAC;AAAAC,IAAAA,QAAQ,EAAEH,IAAAA;GAAI,EAC3BrB,yBAAA,CAAAM,aAAA,CAAA,KAAA,EAAA,QAAA,CAAA,EAAA,EAASH,IAAI,CAAA,CAAI,CACH,CAAA;AAEpB;;;ACFasB,IAAAA,WAAW,GAA+B,SAA1CA,WAAW,CAInB,IAAA,EAAA;AAAA,EAAA,IAAA,SAAA,GAAA,IAAA,CAHHJ,IAAI;AAAJA,IAAAA,IAAI,0BAAG,KAAK,GAAA,SAAA;AACZK,IAAAA,SAAS,QAATA,SAAS;IACNvB,IAAI,GAAA,6BAAA,CAAA,IAAA,EAAAmB,WAAA,CAAA,CAAA;AAEP,EAAA,OACEtB,yBAAC,CAAAM,aAAA,CAAAqB,mBAAa,EAAA,QAAA,CAAA;AACZD,IAAAA,SAAS,EAAEE,8BAAU,CAACF,SAAS,EAAE,sBAAsB,EAAE;AACvD,MAAA,4BAA4B,EAAEL,IAAAA;KAC/B,CAAA;AAAC,GAAA,EACElB,IAAI,EAAA;AAAA,IAAA,aAAA,EACI,MAAA;GACZ,CAAA,CAAA,CAAA;AAEN;;;ACNO,IAAM0B,mBAAmB,GAAuC,SAA1DA,mBAAmB,CAS3B,IAAA,EAAA;EAAA,IARHC,KAAK,QAALA,KAAK;AACLC,IAAAA,QAAQ,QAARA,QAAQ;AACRL,IAAAA,SAAS,QAATA,SAAS;AACThB,IAAAA,EAAE,QAAFA,EAAE;AACFW,IAAAA,IAAI,QAAJA,IAAI;AACJW,IAAAA,QAAQ,QAARA,QAAQ;AACRC,IAAAA,YAAY,QAAZA,YAAY;IACT9B,IAAI,GAAA,6BAAA,CAAA,IAAA,EAAAmB,WAAA,CAAA,CAAA;AAEP,EAAA,OACEtB;AAAK0B,IAAAA,SAAS,EAAEE,8BAAU,CAAC,sBAAsB,EAAEF,SAAS,CAAA;AAAC,GAAA,EAC3D1B,yBACE,CAAAM,aAAA,CAAA,QAAA,EAAA,QAAA,CAAA;AAAA4B,IAAAA,IAAI,EAAC,QAAQ;AACbR,IAAAA,SAAS,EAAC,+BAA+B;AACzCS,IAAAA,OAAO,EAAEH,QAAQ;AAAA,IAAA,eAAA,EACFX,IAAI;AACJ,IAAA,eAAA,EAAAA,IAAI,GAAGX,EAAE,GAAG0B,SAAAA;AAAS,GAAA,EAChCjC,IAAI,CAERH,EAAAA,yBAAM,CAAAM,aAAA,CAAA,MAAA,EAAA;AAAAoB,IAAAA,SAAS,EAAC,4BAAA;AAA4B,GAAA,EAC1C1B,yBAAC,CAAAM,aAAA,CAAA+B,mBAAQ,EAAC;AAAAC,IAAAA,MAAM,EAAC,MAAM;AAACC,IAAAA,EAAE,EAAC,MAAA;GACxB,EAAAT,KAAK,CACG,EACX9B,yBAAM,CAAAM,aAAA,CAAA,MAAA,EAAA;AAAAoB,IAAAA,SAAS,EAAC,sCAAA;AAAsC,GAAA,EACpD1B,yBAAC,CAAAM,aAAA,CAAAmB,WAAW;AAACJ,IAAAA,IAAI,EAAEA,IAAAA;GAAQ,CAAA,CACtB,CACF,CACA,EACTrB,yBAAC,CAAAM,aAAA,CAAAc,UAAU;AACTM,IAAAA,SAAS,EAAC,+BAA+B;AACzChB,IAAAA,EAAE,EAAEA,EAAE;AACNW,IAAAA,IAAI,EAAEA,IAAI;AACVmB,IAAAA,KAAK,EAAEP,YAAAA;KAENF,QAAQ,CACE,CACT,CAAA;AAEV,CAAC;;;AC5CYU,IAAAA,aAAa,GAAiC,SAA9CA,aAAa,CAKrB,IAAA,EAAA;AAAA,EAAA,IAAA,gBAAA,GAAA,IAAA,CAJH9B,WAAW;AAAXA,IAAAA,WAAW,iCAAG,KAAK,GAAA,gBAAA;AACf+B,IAAAA,UAAU,QAAdhC,EAAE;AACFuB,IAAAA,YAAY,QAAZA,YAAY;IACT9B,IAAI,GAAA,6BAAA,CAAA,IAAA,EAAAmB,WAAA,CAAA,CAAA;AAEP,EAAA,IAAMqB,QAAQ,GAAGC,iBAAW,CAAC,oBAAoB,CAAC,CAAA;AAClD,EAAA,IAAMlC,EAAE,GAAGgC,UAAU,IAAIC,QAAQ,CAAA;AACjC,EAAA,IAAA,aAAA,GAA2BlC,YAAY,CAAC;AAAEC,MAAAA,EAAE,EAAFA,EAAE;AAAEC,MAAAA,WAAW,EAAXA,WAAAA;AAAW,KAAE,CAAC;AAApDO,IAAAA,MAAM,iBAANA,MAAM;AAAEC,IAAAA,MAAM,iBAANA,MAAM,CAAA;AAEtB,EAAA,OACEnB,wCAAC6B,mBAAmB,eACd1B,IAAI,EAAA;AACR8B,IAAAA,YAAY,EAAEA,YAAY;AAC1BvB,IAAAA,EAAE,EAAEA,EAAE;AACNsB,IAAAA,QAAQ,EAAEb,MAAM;AAChBE,IAAAA,IAAI,EAAEH,MAAAA;GACN,CAAA,CAAA,CAAA;AAEN;;;AClBa2B,IAAAA,eAAe,GAAmC,SAAlDA,eAAe,CAIvB,IAAA,EAAA;AAAA,EAAA,IAAA,gBAAA,GAAA,IAAA,CAHHlC,WAAW;AAAXA,IAAAA,WAAW,iCAAG,KAAK,GAAA,gBAAA;AACnBsB,IAAAA,YAAY,QAAZA,YAAY;IACT9B,IAAI,GAAA,6BAAA,CAAA,IAAA,EAAAmB,WAAA,CAAA,CAAA;AAEP,EAAA,IAAMqB,QAAQ,GAAGC,iBAAW,CAAC,gBAAgB,CAAC,CAAA;AAE9C,EAAA,IAAA,eAAA,GAA0B5C,yBAAK,CAACK,QAAQ,CAACM,WAAW,CAAC;IAA9CO,MAAM,GAAA,eAAA,CAAA,CAAA,CAAA;IAAE4B,OAAO,GAAA,eAAA,CAAA,CAAA,CAAA,CAAA;AAEtB,EAAA,OACE9C,yBAAA,CAAAM,aAAA,CAACuB,mBAAmB,EAAA,QAAA,CAAA;AAClBnB,IAAAA,EAAE,EAAEiC,QAAQ;AACZtB,IAAAA,IAAI,EAAEH,MAAM;AACZc,IAAAA,QAAQ,EAAE,SAAA,QAAA,GAAA;MAAA,OAAMc,OAAO,CAAC,UAAAC,IAAI,EAAA;AAAA,QAAA,OAAI,CAACA,IAAI,CAAA;OAAC,CAAA,CAAA;AAAA,KAAA;AACtCd,IAAAA,YAAY,EAAEA,YAAAA;AAAY,GAAA,EACtB9B,IAAI,CACR,CAAA,CAAA;AAEN;;;ACpBa6C,IAAAA,oBAAoB,GAAuC,SAA3DA,oBAAoB,CAM5B,IAAA,EAAA;EAAA,IALHjB,QAAQ,QAARA,QAAQ;AACRV,IAAAA,IAAI,QAAJA,IAAI;AACJW,IAAAA,QAAQ,QAARA,QAAQ;AAAA,IAAA,OAAA,GAAA,IAAA,CACRO,EAAE;AAAEU,IAAAA,SAAS,wBAAGZ,mBAAQ,GAAA,OAAA;IACrBlC,IAAI,GAAA,6BAAA,CAAA,IAAA,EAAAmB,WAAA,CAAA,CAAA;AAEP,EAAA,OACEtB,yBACE,CAAAM,aAAA,CAAA,QAAA,EAAA,QAAA,CAAA;AAAAoB,IAAAA,SAAS,EAAC,8BAA8B;qBACzBL,IAAI;AACnBa,IAAAA,IAAI,EAAC,QAAQ;AACbC,IAAAA,OAAO,EAAEH,QAAAA;AAAQ,GAAA,EACb7B,IAAI,CAERH,EAAAA,yBAAC,CAAAM,aAAA,CAAA2C,SAAS,EAAE,IAAA,EAAAlB,QAAQ,CAAa,EACjC/B,yBAAA,CAAAM,aAAA,CAACmB,WAAW,EAAA;AAACJ,IAAAA,IAAI,EAAEA,IAAI;AAAEK,IAAAA,SAAS,EAAC,4BAAA;AAA4B,GAAA,CAAG,CAC3D,CAAA;AAEb;;;ACAawB,IAAAA,cAAc,GAAkC,SAAhDA,cAAc,CAOtB,IAAA,EAAA;EAAA,IANHpB,KAAK,QAALA,KAAK;AACLC,IAAAA,QAAQ,QAARA,QAAQ;AAAA,IAAA,gBAAA,GAAA,IAAA,CACRpB,WAAW;AAAXA,IAAAA,WAAW,iCAAG,KAAK,GAAA,gBAAA;AACnBsB,IAAAA,YAAY,QAAZA,YAAY;AAAA,IAAA,iBAAA,GAAA,IAAA,CACZkB,YAAY;AAAZA,IAAAA,YAAY,kCAAG,UAAU,GAAA,iBAAA;IACtBhD,IAAI,GAAA,6BAAA,CAAA,IAAA,EAAA,SAAA,CAAA,CAAA;AAEP,EAAA,IAAMwC,QAAQ,GAAGC,iBAAW,CAAC,qBAAqB,CAAC,CAAA;AACnD,EAAA,IAAA,eAAA,GAA0B5C,yBAAK,CAACK,QAAQ,CAACM,WAAW,CAAC;IAA9CO,MAAM,GAAA,eAAA,CAAA,CAAA,CAAA;IAAE4B,OAAO,GAAA,eAAA,CAAA,CAAA,CAAA,CAAA;AAEtB,EAAA,IAAMM,OAAO,GAAsBpD,yBAAK,CAACqD,OAAO,CAC9C,YAAA;IAAA,OAAMC,sBAAsB,CAACH,YAAY,CAAC,CAAA;GAC1C,EAAA,CAACA,YAAY,CAAC,CACf,CAAA;AAED,EAAA,OACEnD,yBAAA,CAAAM,aAAA,CAAAN,yBAAA,CAAAuD,QAAA,EAAA,IAAA,EACEvD,yBAAA,CAAAM,aAAA,CAAC0C,oBAAoB,EAAA,QAAA,CAAA;AACnB3B,IAAAA,IAAI,EAAEH,MAAM;AACZc,IAAAA,QAAQ,EAAE,SAAA,QAAA,GAAA;MAAA,OAAMc,OAAO,CAAC,UAAAC,IAAI,EAAA;AAAA,QAAA,OAAI,CAACA,IAAI,CAAA;OAAC,CAAA,CAAA;AAAA,KAAA;AAAA,IAAA,eAAA,EACvB7B,MAAM,GAAGyB,QAAQ,GAAGP,SAAS;AAC5CG,IAAAA,EAAE,EAAEa,OAAAA;GACAjD,EAAAA,IAAI,GAEP2B,KAAK,CACe,EACvB9B,yBAAC,CAAAM,aAAA,CAAAc,UAAU,EAAA,QAAA,CAAA;AACTM,IAAAA,SAAS,EAAC,8BAA8B;AACxChB,IAAAA,EAAE,EAAEiC,QAAQ;AACZtB,IAAAA,IAAI,EAAEH,MAAM;AACZsB,IAAAA,KAAK,EAAEP,YAAAA;AAAY,GAAA,EACf9B,IAAI,CAAA,EAEP4B,QAAQ,CACE,CACZ,CAAA;AAEP,EAAC;AAED,SAASuB,sBAAsB,CAC7BE,OAMkB,EAAA;AAElB,EAAA,QAAQA,OAAO;AACb,IAAA,KAAK,UAAU;AACb,MAAA,OAAOnB,mBAAQ,CAAA;AACjB,IAAA,KAAK,UAAU;AACb,MAAA,OAAOoB,mBAAQ,CAAA;AACjB,IAAA,KAAK,UAAU;AACb,MAAA,OAAOC,mBAAQ,CAAA;AACjB,IAAA,KAAK,UAAU;AACb,MAAA,OAAOC,mBAAQ,CAAA;AACjB,IAAA,KAAK,WAAW;AACd,MAAA,OAAOC,oBAAS,CAAA;AAClB,IAAA,KAAK,cAAc;AACjB,MAAA,OAAOC,uBAAY,CAAA;AACrB,IAAA;AACE,MAAA,OAAOxB,mBAAQ,CAAA;AAAC,GAAA;AAEtB;;AClGAyB,4BAAsB,CAAC,QAAQ,EAAE,YAAY,EAAE,OAAO,CAAC;;;;;;;;;;;"}
|
|
1
|
+
{"version":3,"file":"expand.cjs.development.js","sources":["../src/Accordion.tsx","../src/BaseExpand.tsx","../src/ExpandArrow.tsx","../src/BaseExpandablePanel.tsx","../src/AccordionItem.tsx","../src/ExpandablePanel.tsx","../src/ExpandableTextButton.tsx","../src/ExpandableText.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\n\ntype Id = string | null;\ntype AccordionContextType = [Id, React.Dispatch<React.SetStateAction<Id>>];\nconst AccordionContext = React.createContext<AccordionContextType | null>(null);\n\nexport type AccordionProps = {\n /** To eller flere AccordionItem-komponenter */\n children: React.ReactNode;\n [key: string]: any;\n};\n\nexport const Accordion: React.FC<AccordionProps> = ({ ...rest }) => {\n const currentlyOpenState = React.useState<Id>(null);\n return <AccordionContext.Provider value={currentlyOpenState} {...rest} />;\n};\n\ntype UseAccordionArgs = {\n id: Id;\n defaultOpen?: boolean;\n};\n\nexport const useAccordion: ({ id, defaultOpen }: UseAccordionArgs) => {\n isOpen: boolean;\n toggle: () => void;\n} = ({ id, defaultOpen }: UseAccordionArgs) => {\n const contextValue = React.useContext(AccordionContext);\n if (!contextValue) {\n throw new Error('You need to wrap your AccordionItem inside an Accordion');\n }\n\n const [openId, setOpenId] = contextValue;\n\n React.useEffect(() => {\n if (defaultOpen) {\n setOpenId(id);\n }\n }, [defaultOpen, id, setOpenId]);\n\n const isOpen = openId === id;\n\n return {\n isOpen,\n toggle: () => setOpenId(isOpen ? null : id),\n };\n};\n","import React from 'react';\n\nimport { UnmountClosed } from 'react-collapse';\n\ntype BaseExpandProps = {\n /** Innholdet som skal være expandable */\n children: React.ReactNode;\n /** Boolean for om innholdet vises eller ikke */\n open: boolean;\n [key: string]: any;\n};\nexport const BaseExpand: React.FC<BaseExpandProps> = ({ open, ...rest }) => {\n return (\n <UnmountClosed isOpened={open}>\n <div {...rest} />\n </UnmountClosed>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { DownArrowIcon } from '@entur/icons';\nimport './ExpandArrow.scss';\n\ntype ExpandArrowProps = {\n /** Om innholdet er åpent eller ikke, som bestemmer retningen på pila\n * @default false\n */\n open?: boolean;\n /** Ekstra klassenavn */\n className?: string;\n [key: string]: any;\n};\n\nexport const ExpandArrow: React.FC<ExpandArrowProps> = ({\n open = false,\n className,\n ...rest\n}) => {\n return (\n <DownArrowIcon\n className={classNames(className, 'eds-expandable-arrow', {\n 'eds-expandable-arrow--open': open,\n })}\n {...rest}\n aria-hidden=\"true\"\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport classNames from 'classnames';\nimport { Heading5 } from '@entur/typography';\nimport { BaseExpand } from './BaseExpand';\n\nimport './BaseExpandablePanel.scss';\nimport { ExpandArrow } from './ExpandArrow';\n\ntype BaseExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** IDen til expand-panelet */\n id: string;\n /** Prop for om innholdet er åpent */\n open: boolean;\n /** Funksjonen som styrer åpningen av BaseExpandablePanel */\n onToggle: () => void;\n /** Styling som sendes til innholdet av BaseExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const BaseExpandablePanel: React.FC<BaseExpandablePanelProps> = ({\n title,\n children,\n className,\n id,\n open,\n onToggle,\n contentStyle,\n ...rest\n}) => {\n return (\n <div className={classNames('eds-expandable-panel', className)}>\n <button\n type=\"button\"\n className=\"eds-expandable-panel__trigger\"\n onClick={onToggle}\n aria-expanded={open}\n aria-controls={open ? id : undefined}\n {...rest}\n >\n <span className=\"eds-expandable-panel__grid\">\n <Heading5 margin=\"none\" as=\"span\">\n {title}\n </Heading5>\n <span className=\"eds-expandable-panel__icon-container\">\n <ExpandArrow open={open} />\n </span>\n </span>\n </button>\n <BaseExpand\n className=\"eds-expandable-panel__content\"\n id={id}\n open={open}\n style={contentStyle}\n >\n {children}\n </BaseExpand>\n </div>\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\nimport { useAccordion } from './Accordion';\n\nexport type AccordionItemProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand AccordionItem skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Styling som sendes til innholdet av AccordionItem */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const AccordionItem: React.FC<AccordionItemProps> = ({\n defaultOpen = false,\n id: overrideId,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-accordion-item');\n const id = overrideId || randomId;\n const { isOpen, toggle } = useAccordion({ id, defaultOpen });\n\n return (\n <BaseExpandablePanel\n {...rest}\n contentStyle={contentStyle}\n id={id}\n onToggle={toggle}\n open={isOpen}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\n\nexport type ExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandablePanel skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Funksjonen som styrer åpningen av ExpandablePanel */\n onToggle?: () => void;\n /** Styling som sendes til innholdet av ExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const ExpandablePanel: React.FC<ExpandablePanelProps> = ({\n defaultOpen = false,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable');\n\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n return (\n <BaseExpandablePanel\n id={randomId}\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n contentStyle={contentStyle}\n {...rest}\n />\n );\n};\n","import React from 'react';\nimport { Heading5 } from '@entur/typography';\nimport { ExpandArrow } from './ExpandArrow';\n\nexport type ExandableTextButtonProps = {\n children: React.ReactNode;\n /** Prop for om innholdet er åpent */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableTextButton */\n onToggle: () => void;\n /** Den typografiske komponenten for tittelen\n * @default Heading5\n */\n as?: React.ElementType;\n [key: string]: any;\n};\n\nexport const ExpandableTextButton: React.FC<ExandableTextButtonProps> = ({\n children,\n open,\n onToggle,\n as: Component = Heading5,\n ...rest\n}) => {\n return (\n <button\n className=\"eds-expandable-text__trigger\"\n aria-expanded={open}\n type=\"button\"\n onClick={onToggle}\n {...rest}\n >\n <Component>{children}</Component>\n <ExpandArrow open={open} className=\"eds-expandable-text__arrow\" />\n </button>\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { ExpandableTextButton } from './ExpandableTextButton';\nimport { BaseExpand } from './BaseExpand';\nimport {\n Heading2,\n Heading3,\n Heading4,\n Heading5,\n Paragraph,\n SubParagraph,\n} from '@entur/typography';\nimport './ExpandableText.scss';\n\nexport type ExpandableTextProps = {\n /** Teksten som skal \"vises\" */\n title: React.ReactNode;\n /** Innholdet som skal vises under linken */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandableText skal ha som default (med mindre den er kontrollert)\n * @default false\n */\n defaultOpen?: boolean;\n /** Prop for om innholdet er åpent. Brukes hvis du vil kontrollere ExpandableText, sammen med onToggle */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableText */\n onToggle?: () => void;\n /**Styling som sendes til innholdet av ExpandableText */\n contentStyle?: CSSProperties;\n /** Hvilket typografisk element tittelen er\n * @default \"Heading5\"\n */\n titleElement?: 'Heading5' | 'Paragraph' | 'SubParagraph';\n [key: string]: any;\n};\n\nexport const ExpandableText: React.FC<ExpandableTextProps> = ({\n title,\n children,\n defaultOpen = false,\n contentStyle,\n titleElement = 'Heading5',\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable-text');\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n const Element: React.ElementType = React.useMemo(\n () => GetTypographyComponent(titleElement),\n [titleElement],\n );\n\n return (\n <>\n <ExpandableTextButton\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n aria-controls={isOpen ? randomId : undefined}\n as={Element}\n {...rest}\n >\n {title}\n </ExpandableTextButton>\n <BaseExpand\n className=\"eds-expandable-text__content\"\n id={randomId}\n open={isOpen}\n style={contentStyle}\n {...rest}\n >\n {children}\n </BaseExpand>\n </>\n );\n};\n\nfunction GetTypographyComponent(\n element:\n | 'Heading5'\n | 'Heading4'\n | 'Heading3'\n | 'Heading2'\n | 'Paragraph'\n | 'SubParagraph',\n) {\n switch (element) {\n case 'Heading5':\n return Heading5;\n case 'Heading4':\n return Heading4;\n case 'Heading3':\n return Heading3;\n case 'Heading2':\n return Heading2;\n case 'Paragraph':\n return Paragraph;\n case 'SubParagraph':\n return SubParagraph;\n default:\n return Heading5;\n }\n}\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('expand', 'typography', 'icons');\n\nexport * from './Accordion';\nexport * from './AccordionItem';\nexport * from './ExpandablePanel';\nexport * from './BaseExpand';\nexport * from './ExpandableText';\nexport * from './ExpandableTextButton';\nexport * from './ExpandArrow';\n"],"names":["AccordionContext","React","createContext","Accordion","rest","currentlyOpenState","useState","createElement","Provider","value","useAccordion","id","defaultOpen","contextValue","useContext","Error","openId","setOpenId","useEffect","isOpen","toggle","BaseExpand","open","_excluded","UnmountClosed","isOpened","ExpandArrow","className","DownArrowIcon","classNames","BaseExpandablePanel","title","children","onToggle","contentStyle","type","onClick","undefined","Heading5","margin","as","style","AccordionItem","overrideId","randomId","useRandomId","ExpandablePanel","setOpen","prev","ExpandableTextButton","Component","ExpandableText","titleElement","Element","useMemo","GetTypographyComponent","Fragment","element","Heading4","Heading3","Heading2","Paragraph","SubParagraph","warnAboutMissingStyles"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@entur/utils"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@entur/utils"),n=require("react"),t=require("classnames"),a=require("@entur/typography"),r=require("react-collapse"),o=require("@entur/icons");function l(){return l=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e},l.apply(this,arguments)}function i(e,n){if(null==e)return{};var t,a,r={},o=Object.keys(e);for(a=0;a<o.length;a++)n.indexOf(t=o[a])>=0||(r[t]=e[t]);return r}var c=n.createContext(null),d=function(e){var t=e.id,a=e.defaultOpen,r=n.useContext(c);if(!r)throw new Error("You need to wrap your AccordionItem inside an Accordion");var o=r[0],l=r[1];n.useEffect((function(){a&&l(t)}),[a,t,l]);var i=o===t;return{isOpen:i,toggle:function(){return l(i?null:t)}}},s=["open"],u=function(e){var t=e.open,a=i(e,s);return n.createElement(r.UnmountClosed,{isOpened:t},n.createElement("div",l({},a)))},p=["open","className"],g=function(e){var a=e.open,r=void 0!==a&&a,c=e.className,d=i(e,p);return n.createElement(o.DownArrowIcon,l({className:t(c,"eds-expandable-arrow",{"eds-expandable-arrow--open":r})},d,{"aria-hidden":"true"}))},m=["title","children","className","id","open","onToggle","contentStyle"],f=function(e){var r=e.title,o=e.children,c=e.className,d=e.id,s=e.open,p=e.onToggle,f=e.contentStyle,x=i(e,m);return n.createElement("div",{className:t("eds-expandable-panel",c)},n.createElement("button",l({type:"button",className:"eds-expandable-panel__trigger",onClick:p,"aria-expanded":s,"aria-controls":s?d:void 0},x),n.createElement("span",{className:"eds-expandable-panel__grid"},n.createElement(a.Heading5,{margin:"none",as:"span"},r),n.createElement("span",{className:"eds-expandable-panel__icon-container"},n.createElement(g,{open:s})))),n.createElement(u,{className:"eds-expandable-panel__content",id:d,open:s,style:f},o))},x=["defaultOpen","id","contentStyle"],v=["defaultOpen","contentStyle"],E=["children","open","onToggle","as"],b=function(e){var t=e.children,r=e.open,o=e.onToggle,c=e.as,d=void 0===c?a.Heading5:c,s=i(e,E);return n.createElement("button",l({className:"eds-expandable-text__trigger","aria-expanded":r,type:"button",onClick:o},s),n.createElement(d,null,t),n.createElement(g,{open:r,className:"eds-expandable-text__arrow"}))},y=["title","children","defaultOpen","contentStyle","titleElement"];e.warnAboutMissingStyles("expand","typography","icons"),exports.Accordion=function(e){var t=l({},(function(e){if(null==e)throw new TypeError("Cannot destructure "+e)}(e),e)),a=n.useState(null);return n.createElement(c.Provider,l({value:a},t))},exports.AccordionItem=function(t){var a=t.defaultOpen,r=void 0!==a&&a,o=t.id,c=t.contentStyle,s=i(t,x),u=e.useRandomId("eds-accordion-item"),p=o||u,g=d({id:p,defaultOpen:r});return n.createElement(f,l({},s,{contentStyle:c,id:p,onToggle:g.toggle,open:g.isOpen}))},exports.BaseExpand=u,exports.ExpandArrow=g,exports.ExpandablePanel=function(t){var a=t.defaultOpen,r=void 0!==a&&a,o=t.contentStyle,c=i(t,v),d=e.useRandomId("eds-expandable"),s=n.useState(r),u=s[1];return n.createElement(f,l({id:d,open:s[0],onToggle:function(){return u((function(e){return!e}))},contentStyle:o},c))},exports.ExpandableText=function(t){var r=t.title,o=t.children,c=t.defaultOpen,d=void 0!==c&&c,s=t.contentStyle,p=t.titleElement,g=void 0===p?"Heading5":p,m=i(t,y),f=e.useRandomId("eds-expandable-text"),x=n.useState(d),v=x[0],E=x[1],h=n.useMemo((function(){return function(e){switch(e){case"Heading5":default:return a.Heading5;case"Heading4":return a.Heading4;case"Heading3":return a.Heading3;case"Heading2":return a.Heading2;case"Paragraph":return a.Paragraph;case"SubParagraph":return a.SubParagraph}}(g)}),[g]);return n.createElement(n.Fragment,null,n.createElement(b,l({open:v,onToggle:function(){return E((function(e){return!e}))},"aria-controls":v?f:void 0,as:h},m),r),n.createElement(u,l({className:"eds-expandable-text__content",id:f,open:v,style:s},m),o))},exports.ExpandableTextButton=b,exports.useAccordion=d;
|
|
2
2
|
//# sourceMappingURL=expand.cjs.production.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"expand.cjs.production.min.js","sources":["../src/Accordion.tsx","../src/BaseExpand.tsx","../src/ExpandArrow.tsx","../src/BaseExpandablePanel.tsx","../src/ExpandableTextButton.tsx","../src/index.tsx","../src/AccordionItem.tsx","../src/ExpandablePanel.tsx","../src/ExpandableText.tsx"],"sourcesContent":["import React from 'react';\n\ntype Id = string | null;\ntype AccordionContextType = [Id, React.Dispatch<React.SetStateAction<Id>>];\nconst AccordionContext = React.createContext<AccordionContextType | null>(null);\n\nexport type AccordionProps = {\n /** To eller flere AccordionItem-komponenter */\n children: React.ReactNode;\n [key: string]: any;\n};\n\nexport const Accordion: React.FC<AccordionProps> = ({ ...rest }) => {\n const currentlyOpenState = React.useState<Id>(null);\n return <AccordionContext.Provider value={currentlyOpenState} {...rest} />;\n};\n\ntype UseAccordionArgs = {\n id: Id;\n defaultOpen?: boolean;\n};\n\nexport const useAccordion: ({ id, defaultOpen }: UseAccordionArgs) => {\n isOpen: boolean;\n toggle: () => void;\n} = ({ id, defaultOpen }: UseAccordionArgs) => {\n const contextValue = React.useContext(AccordionContext);\n if (!contextValue) {\n throw new Error('You need to wrap your AccordionItem inside an Accordion');\n }\n\n const [openId, setOpenId] = contextValue;\n\n React.useEffect(() => {\n if (defaultOpen) {\n setOpenId(id);\n }\n }, [defaultOpen, id, setOpenId]);\n\n const isOpen = openId === id;\n\n return {\n isOpen,\n toggle: () => setOpenId(isOpen ? null : id),\n };\n};\n","import React from 'react';\n\nimport { UnmountClosed } from 'react-collapse';\n\ntype BaseExpandProps = {\n /** Innholdet som skal være expandable */\n children: React.ReactNode;\n /** Boolean for om innholdet vises eller ikke */\n open: boolean;\n [key: string]: any;\n};\nexport const BaseExpand: React.FC<BaseExpandProps> = ({ open, ...rest }) => {\n return (\n <UnmountClosed isOpened={open}>\n <div {...rest} />\n </UnmountClosed>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { DownArrowIcon } from '@entur/icons';\nimport './ExpandArrow.scss';\n\ntype ExpandArrowProps = {\n /** Om innholdet er åpent eller ikke, som bestemmer retningen på pila\n * @default false\n */\n open?: boolean;\n /** Ekstra klassenavn */\n className?: string;\n [key: string]: any;\n};\n\nexport const ExpandArrow: React.FC<ExpandArrowProps> = ({\n open = false,\n className,\n ...rest\n}) => {\n return (\n <DownArrowIcon\n className={classNames(className, 'eds-expandable-arrow', {\n 'eds-expandable-arrow--open': open,\n })}\n {...rest}\n aria-hidden=\"true\"\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport classNames from 'classnames';\nimport { Heading5 } from '@entur/typography';\nimport { BaseExpand } from './BaseExpand';\n\nimport './BaseExpandablePanel.scss';\nimport { ExpandArrow } from './ExpandArrow';\n\ntype BaseExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** IDen til expand-panelet */\n id: string;\n /** Prop for om innholdet er åpent */\n open: boolean;\n /** Funksjonen som styrer åpningen av BaseExpandablePanel */\n onToggle: () => void;\n /** Styling som sendes til innholdet av BaseExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const BaseExpandablePanel: React.FC<BaseExpandablePanelProps> = ({\n title,\n children,\n className,\n id,\n open,\n onToggle,\n contentStyle,\n ...rest\n}) => {\n return (\n <div className={classNames('eds-expandable-panel', className)}>\n <button\n type=\"button\"\n className=\"eds-expandable-panel__trigger\"\n onClick={onToggle}\n aria-expanded={open}\n aria-controls={open ? id : undefined}\n {...rest}\n >\n <span className=\"eds-expandable-panel__grid\">\n <Heading5 margin=\"none\" as=\"span\">\n {title}\n </Heading5>\n <span className=\"eds-expandable-panel__icon-container\">\n <ExpandArrow open={open} />\n </span>\n </span>\n </button>\n <BaseExpand\n className=\"eds-expandable-panel__content\"\n id={id}\n open={open}\n style={contentStyle}\n >\n {children}\n </BaseExpand>\n </div>\n );\n};\n","import React from 'react';\nimport { Heading5 } from '@entur/typography';\nimport { ExpandArrow } from './ExpandArrow';\n\nexport type ExandableTextButtonProps = {\n children: React.ReactNode;\n /** Prop for om innholdet er åpent */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableTextButton */\n onToggle: () => void;\n /** Den typografiske komponenten for tittelen\n * @default Heading5\n */\n as?: React.ElementType;\n [key: string]: any;\n};\n\nexport const ExpandableTextButton: React.FC<ExandableTextButtonProps> = ({\n children,\n open,\n onToggle,\n as: Component = Heading5,\n ...rest\n}) => {\n return (\n <button\n className=\"eds-expandable-text__trigger\"\n aria-expanded={open}\n type=\"button\"\n onClick={onToggle}\n {...rest}\n >\n <Component>{children}</Component>\n <ExpandArrow open={open} className=\"eds-expandable-text__arrow\" />\n </button>\n );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('expand', 'typography', 'icons');\n\nexport * from './Accordion';\nexport * from './AccordionItem';\nexport * from './ExpandablePanel';\nexport * from './BaseExpand';\nexport * from './ExpandableText';\nexport * from './ExpandableTextButton';\nexport * from './ExpandArrow';\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\nimport { useAccordion } from './Accordion';\n\nexport type AccordionItemProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand AccordionItem skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Styling som sendes til innholdet av AccordionItem */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const AccordionItem: React.FC<AccordionItemProps> = ({\n defaultOpen = false,\n id: overrideId,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-accordion-item');\n const id = overrideId || randomId;\n const { isOpen, toggle } = useAccordion({ id, defaultOpen });\n\n return (\n <BaseExpandablePanel\n {...rest}\n contentStyle={contentStyle}\n id={id}\n onToggle={toggle}\n open={isOpen}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\n\nexport type ExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandablePanel skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Funksjonen som styrer åpningen av ExpandablePanel */\n onToggle?: () => void;\n /** Styling som sendes til innholdet av ExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const ExpandablePanel: React.FC<ExpandablePanelProps> = ({\n defaultOpen = false,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable');\n\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n return (\n <BaseExpandablePanel\n id={randomId}\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n contentStyle={contentStyle}\n {...rest}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { ExpandableTextButton } from './ExpandableTextButton';\nimport { BaseExpand } from './BaseExpand';\nimport {\n Heading2,\n Heading3,\n Heading4,\n Heading5,\n Paragraph,\n SubParagraph,\n} from '@entur/typography';\nimport './ExpandableText.scss';\n\nexport type ExpandableTextProps = {\n /** Teksten som skal \"vises\" */\n title: React.ReactNode;\n /** Innholdet som skal vises under linken */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandableText skal ha som default (med mindre den er kontrollert)\n * @default false\n */\n defaultOpen?: boolean;\n /** Prop for om innholdet er åpent. Brukes hvis du vil kontrollere ExpandableText, sammen med onToggle */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableText */\n onToggle?: () => void;\n /**Styling som sendes til innholdet av ExpandableText */\n contentStyle?: CSSProperties;\n /** Hvilket typografisk element tittelen er\n * @default \"Heading5\"\n */\n titleElement?: 'Heading5' | 'Paragraph' | 'SubParagraph';\n [key: string]: any;\n};\n\nexport const ExpandableText: React.FC<ExpandableTextProps> = ({\n title,\n children,\n defaultOpen = false,\n contentStyle,\n titleElement = 'Heading5',\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable-text');\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n const Element: React.ElementType = React.useMemo(\n () => GetTypographyComponent(titleElement),\n [titleElement],\n );\n\n return (\n <>\n <ExpandableTextButton\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n aria-controls={isOpen ? randomId : undefined}\n as={Element}\n {...rest}\n >\n {title}\n </ExpandableTextButton>\n <BaseExpand\n className=\"eds-expandable-text__content\"\n id={randomId}\n open={isOpen}\n style={contentStyle}\n {...rest}\n >\n {children}\n </BaseExpand>\n </>\n );\n};\n\nfunction GetTypographyComponent(\n element:\n | 'Heading5'\n | 'Heading4'\n | 'Heading3'\n | 'Heading2'\n | 'Paragraph'\n | 'SubParagraph',\n) {\n switch (element) {\n case 'Heading5':\n return Heading5;\n case 'Heading4':\n return Heading4;\n case 'Heading3':\n return Heading3;\n case 'Heading2':\n return Heading2;\n case 'Paragraph':\n return Paragraph;\n case 'SubParagraph':\n return SubParagraph;\n default:\n return Heading5;\n }\n}\n"],"names":["AccordionContext","React","createContext","useAccordion","_ref2","id","defaultOpen","contextValue","useContext","Error","openId","setOpenId","useEffect","isOpen","toggle","BaseExpand","_ref","open","rest","_objectWithoutPropertiesLoose","_excluded","createElement","UnmountClosed","isOpened","_extends","ExpandArrow","_ref$open","className","DownArrowIcon","classNames","BaseExpandablePanel","title","children","onToggle","contentStyle","type","onClick","undefined","Heading5","margin","as","style","ExpandableTextButton","_ref$as","Component","warnAboutMissingStyles","_objectDestructuringEmpty","currentlyOpenState","useState","Provider","value","_ref$defaultOpen","overrideId","randomId","useRandomId","_useAccordion","_React$useState","setOpen","prev","_ref$titleElement","titleElement","Element","useMemo","element","Heading4","Heading3","Heading2","Paragraph","SubParagraph","GetTypographyComponent","Fragment"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"expand.cjs.production.min.js","sources":["../src/Accordion.tsx","../src/BaseExpand.tsx","../src/ExpandArrow.tsx","../src/BaseExpandablePanel.tsx","../src/ExpandableTextButton.tsx","../src/index.tsx","../src/AccordionItem.tsx","../src/ExpandablePanel.tsx","../src/ExpandableText.tsx"],"sourcesContent":["import React from 'react';\n\ntype Id = string | null;\ntype AccordionContextType = [Id, React.Dispatch<React.SetStateAction<Id>>];\nconst AccordionContext = React.createContext<AccordionContextType | null>(null);\n\nexport type AccordionProps = {\n /** To eller flere AccordionItem-komponenter */\n children: React.ReactNode;\n [key: string]: any;\n};\n\nexport const Accordion: React.FC<AccordionProps> = ({ ...rest }) => {\n const currentlyOpenState = React.useState<Id>(null);\n return <AccordionContext.Provider value={currentlyOpenState} {...rest} />;\n};\n\ntype UseAccordionArgs = {\n id: Id;\n defaultOpen?: boolean;\n};\n\nexport const useAccordion: ({ id, defaultOpen }: UseAccordionArgs) => {\n isOpen: boolean;\n toggle: () => void;\n} = ({ id, defaultOpen }: UseAccordionArgs) => {\n const contextValue = React.useContext(AccordionContext);\n if (!contextValue) {\n throw new Error('You need to wrap your AccordionItem inside an Accordion');\n }\n\n const [openId, setOpenId] = contextValue;\n\n React.useEffect(() => {\n if (defaultOpen) {\n setOpenId(id);\n }\n }, [defaultOpen, id, setOpenId]);\n\n const isOpen = openId === id;\n\n return {\n isOpen,\n toggle: () => setOpenId(isOpen ? null : id),\n };\n};\n","import React from 'react';\n\nimport { UnmountClosed } from 'react-collapse';\n\ntype BaseExpandProps = {\n /** Innholdet som skal være expandable */\n children: React.ReactNode;\n /** Boolean for om innholdet vises eller ikke */\n open: boolean;\n [key: string]: any;\n};\nexport const BaseExpand: React.FC<BaseExpandProps> = ({ open, ...rest }) => {\n return (\n <UnmountClosed isOpened={open}>\n <div {...rest} />\n </UnmountClosed>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { DownArrowIcon } from '@entur/icons';\nimport './ExpandArrow.scss';\n\ntype ExpandArrowProps = {\n /** Om innholdet er åpent eller ikke, som bestemmer retningen på pila\n * @default false\n */\n open?: boolean;\n /** Ekstra klassenavn */\n className?: string;\n [key: string]: any;\n};\n\nexport const ExpandArrow: React.FC<ExpandArrowProps> = ({\n open = false,\n className,\n ...rest\n}) => {\n return (\n <DownArrowIcon\n className={classNames(className, 'eds-expandable-arrow', {\n 'eds-expandable-arrow--open': open,\n })}\n {...rest}\n aria-hidden=\"true\"\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport classNames from 'classnames';\nimport { Heading5 } from '@entur/typography';\nimport { BaseExpand } from './BaseExpand';\n\nimport './BaseExpandablePanel.scss';\nimport { ExpandArrow } from './ExpandArrow';\n\ntype BaseExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** IDen til expand-panelet */\n id: string;\n /** Prop for om innholdet er åpent */\n open: boolean;\n /** Funksjonen som styrer åpningen av BaseExpandablePanel */\n onToggle: () => void;\n /** Styling som sendes til innholdet av BaseExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const BaseExpandablePanel: React.FC<BaseExpandablePanelProps> = ({\n title,\n children,\n className,\n id,\n open,\n onToggle,\n contentStyle,\n ...rest\n}) => {\n return (\n <div className={classNames('eds-expandable-panel', className)}>\n <button\n type=\"button\"\n className=\"eds-expandable-panel__trigger\"\n onClick={onToggle}\n aria-expanded={open}\n aria-controls={open ? id : undefined}\n {...rest}\n >\n <span className=\"eds-expandable-panel__grid\">\n <Heading5 margin=\"none\" as=\"span\">\n {title}\n </Heading5>\n <span className=\"eds-expandable-panel__icon-container\">\n <ExpandArrow open={open} />\n </span>\n </span>\n </button>\n <BaseExpand\n className=\"eds-expandable-panel__content\"\n id={id}\n open={open}\n style={contentStyle}\n >\n {children}\n </BaseExpand>\n </div>\n );\n};\n","import React from 'react';\nimport { Heading5 } from '@entur/typography';\nimport { ExpandArrow } from './ExpandArrow';\n\nexport type ExandableTextButtonProps = {\n children: React.ReactNode;\n /** Prop for om innholdet er åpent */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableTextButton */\n onToggle: () => void;\n /** Den typografiske komponenten for tittelen\n * @default Heading5\n */\n as?: React.ElementType;\n [key: string]: any;\n};\n\nexport const ExpandableTextButton: React.FC<ExandableTextButtonProps> = ({\n children,\n open,\n onToggle,\n as: Component = Heading5,\n ...rest\n}) => {\n return (\n <button\n className=\"eds-expandable-text__trigger\"\n aria-expanded={open}\n type=\"button\"\n onClick={onToggle}\n {...rest}\n >\n <Component>{children}</Component>\n <ExpandArrow open={open} className=\"eds-expandable-text__arrow\" />\n </button>\n );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('expand', 'typography', 'icons');\n\nexport * from './Accordion';\nexport * from './AccordionItem';\nexport * from './ExpandablePanel';\nexport * from './BaseExpand';\nexport * from './ExpandableText';\nexport * from './ExpandableTextButton';\nexport * from './ExpandArrow';\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\nimport { useAccordion } from './Accordion';\n\nexport type AccordionItemProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand AccordionItem skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Styling som sendes til innholdet av AccordionItem */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const AccordionItem: React.FC<AccordionItemProps> = ({\n defaultOpen = false,\n id: overrideId,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-accordion-item');\n const id = overrideId || randomId;\n const { isOpen, toggle } = useAccordion({ id, defaultOpen });\n\n return (\n <BaseExpandablePanel\n {...rest}\n contentStyle={contentStyle}\n id={id}\n onToggle={toggle}\n open={isOpen}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\n\nexport type ExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandablePanel skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Funksjonen som styrer åpningen av ExpandablePanel */\n onToggle?: () => void;\n /** Styling som sendes til innholdet av ExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const ExpandablePanel: React.FC<ExpandablePanelProps> = ({\n defaultOpen = false,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable');\n\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n return (\n <BaseExpandablePanel\n id={randomId}\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n contentStyle={contentStyle}\n {...rest}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { ExpandableTextButton } from './ExpandableTextButton';\nimport { BaseExpand } from './BaseExpand';\nimport {\n Heading2,\n Heading3,\n Heading4,\n Heading5,\n Paragraph,\n SubParagraph,\n} from '@entur/typography';\nimport './ExpandableText.scss';\n\nexport type ExpandableTextProps = {\n /** Teksten som skal \"vises\" */\n title: React.ReactNode;\n /** Innholdet som skal vises under linken */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandableText skal ha som default (med mindre den er kontrollert)\n * @default false\n */\n defaultOpen?: boolean;\n /** Prop for om innholdet er åpent. Brukes hvis du vil kontrollere ExpandableText, sammen med onToggle */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableText */\n onToggle?: () => void;\n /**Styling som sendes til innholdet av ExpandableText */\n contentStyle?: CSSProperties;\n /** Hvilket typografisk element tittelen er\n * @default \"Heading5\"\n */\n titleElement?: 'Heading5' | 'Paragraph' | 'SubParagraph';\n [key: string]: any;\n};\n\nexport const ExpandableText: React.FC<ExpandableTextProps> = ({\n title,\n children,\n defaultOpen = false,\n contentStyle,\n titleElement = 'Heading5',\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable-text');\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n const Element: React.ElementType = React.useMemo(\n () => GetTypographyComponent(titleElement),\n [titleElement],\n );\n\n return (\n <>\n <ExpandableTextButton\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n aria-controls={isOpen ? randomId : undefined}\n as={Element}\n {...rest}\n >\n {title}\n </ExpandableTextButton>\n <BaseExpand\n className=\"eds-expandable-text__content\"\n id={randomId}\n open={isOpen}\n style={contentStyle}\n {...rest}\n >\n {children}\n </BaseExpand>\n </>\n );\n};\n\nfunction GetTypographyComponent(\n element:\n | 'Heading5'\n | 'Heading4'\n | 'Heading3'\n | 'Heading2'\n | 'Paragraph'\n | 'SubParagraph',\n) {\n switch (element) {\n case 'Heading5':\n return Heading5;\n case 'Heading4':\n return Heading4;\n case 'Heading3':\n return Heading3;\n case 'Heading2':\n return Heading2;\n case 'Paragraph':\n return Paragraph;\n case 'SubParagraph':\n return SubParagraph;\n default:\n return Heading5;\n }\n}\n"],"names":["AccordionContext","React","createContext","useAccordion","_ref2","id","defaultOpen","contextValue","useContext","Error","openId","setOpenId","useEffect","isOpen","toggle","BaseExpand","_ref","open","rest","_objectWithoutPropertiesLoose","_excluded","createElement","UnmountClosed","isOpened","_extends","ExpandArrow","_ref$open","className","DownArrowIcon","classNames","BaseExpandablePanel","title","children","onToggle","contentStyle","type","onClick","undefined","Heading5","margin","as","style","ExpandableTextButton","_ref$as","Component","warnAboutMissingStyles","_objectDestructuringEmpty","currentlyOpenState","useState","Provider","value","_ref$defaultOpen","overrideId","randomId","useRandomId","_useAccordion","_React$useState","setOpen","prev","_ref$titleElement","titleElement","Element","useMemo","element","Heading4","Heading3","Heading2","Paragraph","SubParagraph","GetTypographyComponent","Fragment"],"mappings":"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"}
|
package/dist/index.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import './index.scss';
|
|
2
|
-
export * from './Accordion';
|
|
3
|
-
export * from './AccordionItem';
|
|
4
|
-
export * from './ExpandablePanel';
|
|
5
|
-
export * from './BaseExpand';
|
|
6
|
-
export * from './ExpandableText';
|
|
7
|
-
export * from './ExpandableTextButton';
|
|
8
|
-
export * from './ExpandArrow';
|
|
1
|
+
import './index.scss';
|
|
2
|
+
export * from './Accordion';
|
|
3
|
+
export * from './AccordionItem';
|
|
4
|
+
export * from './ExpandablePanel';
|
|
5
|
+
export * from './BaseExpand';
|
|
6
|
+
export * from './ExpandableText';
|
|
7
|
+
export * from './ExpandableTextButton';
|
|
8
|
+
export * from './ExpandArrow';
|
package/dist/styles.css
CHANGED
|
@@ -1,68 +1,3 @@
|
|
|
1
|
-
:root {
|
|
2
|
-
--eds-expand: 1;
|
|
3
|
-
}
|
|
4
|
-
/* DO NOT CHANGE!*/
|
|
5
|
-
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
6
|
-
.eds-expandable-text__trigger {
|
|
7
|
-
-webkit-appearance: none;
|
|
8
|
-
-moz-appearance: none;
|
|
9
|
-
appearance: none;
|
|
10
|
-
margin: 0;
|
|
11
|
-
border: none;
|
|
12
|
-
padding: 0.5rem 0;
|
|
13
|
-
cursor: pointer;
|
|
14
|
-
font-family: inherit;
|
|
15
|
-
color: inherit;
|
|
16
|
-
background: inherit;
|
|
17
|
-
font-size: inherit;
|
|
18
|
-
display: flex;
|
|
19
|
-
align-items: center;
|
|
20
|
-
}
|
|
21
|
-
.eds-expandable-text__trigger > h5 {
|
|
22
|
-
margin-top: 0;
|
|
23
|
-
margin-bottom: 0;
|
|
24
|
-
}
|
|
25
|
-
.eds-expandable-text__trigger > h4 {
|
|
26
|
-
margin-top: 0;
|
|
27
|
-
margin-bottom: 0;
|
|
28
|
-
}
|
|
29
|
-
.eds-expandable-text__trigger > h3 {
|
|
30
|
-
margin-top: 0;
|
|
31
|
-
margin-bottom: 0;
|
|
32
|
-
}
|
|
33
|
-
.eds-expandable-text__trigger > h2 {
|
|
34
|
-
margin-top: 0;
|
|
35
|
-
margin-bottom: 0;
|
|
36
|
-
}
|
|
37
|
-
.eds-expandable-text__trigger > p {
|
|
38
|
-
margin-top: 0;
|
|
39
|
-
margin-bottom: 0;
|
|
40
|
-
}
|
|
41
|
-
.eds-expandable-text__trigger:focus {
|
|
42
|
-
outline-offset: 0.125rem;
|
|
43
|
-
outline: none;
|
|
44
|
-
box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
|
|
45
|
-
}
|
|
46
|
-
.eds-contrast .eds-expandable-text__trigger:focus {
|
|
47
|
-
box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
.eds-expandable-text__content {
|
|
51
|
-
width: 100%;
|
|
52
|
-
padding-left: 0.75rem;
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
.eds-expandable-text__arrow {
|
|
56
|
-
margin-left: 0.5rem;
|
|
57
|
-
}
|
|
58
|
-
/* DO NOT CHANGE!*/
|
|
59
|
-
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
60
|
-
.eds-expandable-arrow {
|
|
61
|
-
transition: 0.2s transform ease-out;
|
|
62
|
-
}
|
|
63
|
-
.eds-expandable-arrow--open {
|
|
64
|
-
transform: rotate(-180deg);
|
|
65
|
-
}
|
|
66
1
|
/* DO NOT CHANGE!*/
|
|
67
2
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
68
3
|
.eds-expandable-panel {
|
|
@@ -136,3 +71,68 @@
|
|
|
136
71
|
.ReactCollapse--collapse {
|
|
137
72
|
transition: height 0.5s ease-out;
|
|
138
73
|
}
|
|
74
|
+
/* DO NOT CHANGE!*/
|
|
75
|
+
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
76
|
+
.eds-expandable-arrow {
|
|
77
|
+
transition: 0.2s transform ease-out;
|
|
78
|
+
}
|
|
79
|
+
.eds-expandable-arrow--open {
|
|
80
|
+
transform: rotate(-180deg);
|
|
81
|
+
}
|
|
82
|
+
:root {
|
|
83
|
+
--eds-expand: 1;
|
|
84
|
+
}
|
|
85
|
+
/* DO NOT CHANGE!*/
|
|
86
|
+
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
87
|
+
.eds-expandable-text__trigger {
|
|
88
|
+
-webkit-appearance: none;
|
|
89
|
+
-moz-appearance: none;
|
|
90
|
+
appearance: none;
|
|
91
|
+
margin: 0;
|
|
92
|
+
border: none;
|
|
93
|
+
padding: 0.5rem 0;
|
|
94
|
+
cursor: pointer;
|
|
95
|
+
font-family: inherit;
|
|
96
|
+
color: inherit;
|
|
97
|
+
background: inherit;
|
|
98
|
+
font-size: inherit;
|
|
99
|
+
display: flex;
|
|
100
|
+
align-items: center;
|
|
101
|
+
}
|
|
102
|
+
.eds-expandable-text__trigger > h5 {
|
|
103
|
+
margin-top: 0;
|
|
104
|
+
margin-bottom: 0;
|
|
105
|
+
}
|
|
106
|
+
.eds-expandable-text__trigger > h4 {
|
|
107
|
+
margin-top: 0;
|
|
108
|
+
margin-bottom: 0;
|
|
109
|
+
}
|
|
110
|
+
.eds-expandable-text__trigger > h3 {
|
|
111
|
+
margin-top: 0;
|
|
112
|
+
margin-bottom: 0;
|
|
113
|
+
}
|
|
114
|
+
.eds-expandable-text__trigger > h2 {
|
|
115
|
+
margin-top: 0;
|
|
116
|
+
margin-bottom: 0;
|
|
117
|
+
}
|
|
118
|
+
.eds-expandable-text__trigger > p {
|
|
119
|
+
margin-top: 0;
|
|
120
|
+
margin-bottom: 0;
|
|
121
|
+
}
|
|
122
|
+
.eds-expandable-text__trigger:focus {
|
|
123
|
+
outline-offset: 0.125rem;
|
|
124
|
+
outline: none;
|
|
125
|
+
box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
|
|
126
|
+
}
|
|
127
|
+
.eds-contrast .eds-expandable-text__trigger:focus {
|
|
128
|
+
box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
.eds-expandable-text__content {
|
|
132
|
+
width: 100%;
|
|
133
|
+
padding-left: 0.75rem;
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
.eds-expandable-text__arrow {
|
|
137
|
+
margin-left: 0.5rem;
|
|
138
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@entur/expand",
|
|
3
|
-
"version": "3.4.
|
|
3
|
+
"version": "3.4.9",
|
|
4
4
|
"license": "EUPL-1.2",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/expand.esm.js",
|
|
@@ -27,15 +27,15 @@
|
|
|
27
27
|
"react-dom": ">=16.8.0"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@entur/icons": "^6.
|
|
30
|
+
"@entur/icons": "^6.5.0",
|
|
31
31
|
"@entur/tokens": "^3.10.0",
|
|
32
|
-
"@entur/typography": "^1.8.
|
|
33
|
-
"@entur/utils": "^0.9.
|
|
32
|
+
"@entur/typography": "^1.8.8",
|
|
33
|
+
"@entur/utils": "^0.9.5",
|
|
34
34
|
"classnames": "^2.3.1",
|
|
35
35
|
"react-collapse": "^5.1.0"
|
|
36
36
|
},
|
|
37
37
|
"devDependencies": {
|
|
38
38
|
"@types/react-collapse": "^5.0.1"
|
|
39
39
|
},
|
|
40
|
-
"gitHead": "
|
|
40
|
+
"gitHead": "9b8d4e5d2e6f7a74256371e30ebef43e046c9338"
|
|
41
41
|
}
|