@bbl-digital/snorre 4.0.37 → 4.0.38
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/bundle.js +6 -6
- package/esm/core/BoxedTable/TableBody/index.js +10 -0
- package/esm/core/BoxedTable/TableBody/styles.js +16 -0
- package/esm/globals/validation/regularExpressions.js +1 -1
- package/esm/illustrations/MySite/IllustrationMySiteBenefits.js +2 -2
- package/lib/core/BoxedTable/TableBody/index.d.ts +7 -0
- package/lib/core/BoxedTable/TableBody/index.d.ts.map +1 -0
- package/lib/core/BoxedTable/TableBody/index.js +10 -0
- package/lib/core/BoxedTable/TableBody/styles.d.ts +6 -0
- package/lib/core/BoxedTable/TableBody/styles.d.ts.map +1 -0
- package/lib/core/BoxedTable/TableBody/styles.js +16 -0
- package/lib/globals/validation/regularExpressions.js +1 -1
- package/lib/illustrations/MySite/IllustrationMySiteBenefits.d.ts.map +1 -1
- package/lib/illustrations/MySite/IllustrationMySiteBenefits.js +2 -2
- package/package.json +1 -1
- package/esm/core/Autocomplete/utils/useHandleOptionsHeight.js +0 -16
- package/esm/core/CheckboxController/index.js +0 -22
- package/esm/core/Datepicker/yearMonthForm.js +0 -56
- package/esm/core/EditorOld/config.js +0 -69
- package/esm/core/EditorOld/index.js +0 -147
- package/esm/core/EditorOld/styles.js +0 -65
- package/esm/core/ImageCarousel/index.js +0 -70
- package/esm/core/ImageCarousel/styles.js +0 -58
- package/esm/enums/ModifierKey.js +0 -13
- package/lib/core/Autocomplete/utils/useHandleOptionsHeight.d.ts +0 -7
- package/lib/core/Autocomplete/utils/useHandleOptionsHeight.d.ts.map +0 -1
- package/lib/core/Autocomplete/utils/useHandleOptionsHeight.js +0 -16
- package/lib/core/CheckboxController/index.d.ts +0 -1
- package/lib/core/CheckboxController/index.d.ts.map +0 -1
- package/lib/core/CheckboxController/index.js +0 -22
- package/lib/core/Datepicker/yearMonthForm.d.ts +0 -10
- package/lib/core/Datepicker/yearMonthForm.d.ts.map +0 -1
- package/lib/core/Datepicker/yearMonthForm.js +0 -56
- package/lib/core/EditorOld/config.d.ts +0 -56
- package/lib/core/EditorOld/config.d.ts.map +0 -1
- package/lib/core/EditorOld/config.js +0 -69
- package/lib/core/EditorOld/index.d.ts +0 -39
- package/lib/core/EditorOld/index.d.ts.map +0 -1
- package/lib/core/EditorOld/index.js +0 -147
- package/lib/core/EditorOld/styles.d.ts +0 -23
- package/lib/core/EditorOld/styles.d.ts.map +0 -1
- package/lib/core/EditorOld/styles.js +0 -65
- package/lib/core/ImageCarousel/index.d.ts +0 -11
- package/lib/core/ImageCarousel/index.d.ts.map +0 -1
- package/lib/core/ImageCarousel/index.js +0 -70
- package/lib/core/ImageCarousel/styles.d.ts +0 -26
- package/lib/core/ImageCarousel/styles.d.ts.map +0 -1
- package/lib/core/ImageCarousel/styles.js +0 -58
- package/lib/enums/ModifierKey.d.ts +0 -12
- package/lib/enums/ModifierKey.d.ts.map +0 -1
- package/lib/enums/ModifierKey.js +0 -13
package/dist/bundle.js
CHANGED
@@ -4170,7 +4170,7 @@
|
|
4170
4170
|
};
|
4171
4171
|
}
|
4172
4172
|
|
4173
|
-
const IllustrationHouse
|
4173
|
+
const IllustrationHouse = props => {
|
4174
4174
|
return /*#__PURE__*/jsxRuntime$1.jsx("svg", {
|
4175
4175
|
viewBox: "0 0 80 44",
|
4176
4176
|
...props,
|
@@ -4242,7 +4242,7 @@
|
|
4242
4242
|
})
|
4243
4243
|
});
|
4244
4244
|
};
|
4245
|
-
var IllustrationHouse$
|
4245
|
+
var IllustrationHouse$1 = withIllustration()(IllustrationHouse);
|
4246
4246
|
|
4247
4247
|
const IllustrationHighHouseComposition = props => {
|
4248
4248
|
return /*#__PURE__*/jsxRuntime$1.jsx("svg", {
|
@@ -24727,7 +24727,7 @@
|
|
24727
24727
|
};
|
24728
24728
|
var IllustrationMySiteLetterSent$1 = withIllustration()(IllustrationMySiteLetterSent);
|
24729
24729
|
|
24730
|
-
const
|
24730
|
+
const IllustrationMySiteBenefits = props => {
|
24731
24731
|
return /*#__PURE__*/jsxRuntime$1.jsxs("svg", {
|
24732
24732
|
viewBox: " 0 0 125 85",
|
24733
24733
|
...props,
|
@@ -24903,7 +24903,7 @@
|
|
24903
24903
|
})]
|
24904
24904
|
});
|
24905
24905
|
};
|
24906
|
-
var IllustrationMySiteBenefits = withIllustration()(
|
24906
|
+
var IllustrationMySiteBenefits$1 = withIllustration()(IllustrationMySiteBenefits);
|
24907
24907
|
|
24908
24908
|
function _EMOTION_STRINGIFIED_CSS_ERROR__$W() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
|
24909
24909
|
const styles$l = {
|
@@ -34786,7 +34786,7 @@ to {top: 100vh;}
|
|
34786
34786
|
exports.IllustrationErrorGeneric = IllustrationErrorGeneric$1;
|
34787
34787
|
exports.IllustrationHighHouse = IllustrationHighHouse$1;
|
34788
34788
|
exports.IllustrationHighHouseComposition = IllustrationHighHouseComposition$1;
|
34789
|
-
exports.IllustrationHouse = IllustrationHouse$
|
34789
|
+
exports.IllustrationHouse = IllustrationHouse$1;
|
34790
34790
|
exports.IllustrationHouseComposition = IllustrationHouseComposition$1;
|
34791
34791
|
exports.IllustrationHouseMissing = IllustrationHouseMissing$1;
|
34792
34792
|
exports.IllustrationHousesBackground = IllustrationHousesBackground$1;
|
@@ -34794,7 +34794,7 @@ to {top: 100vh;}
|
|
34794
34794
|
exports.IllustrationLowHouse = IllustrationLowHouse$1;
|
34795
34795
|
exports.IllustrationLowHouseComposition = IllustrationLowHouseComposition$1;
|
34796
34796
|
exports.IllustrationMySiteAssociation = IllustrationMySiteAssociation$1;
|
34797
|
-
exports.IllustrationMySiteBenefits = IllustrationMySiteBenefits;
|
34797
|
+
exports.IllustrationMySiteBenefits = IllustrationMySiteBenefits$1;
|
34798
34798
|
exports.IllustrationMySiteBuilding = IllustrationMySiteBuilding$1;
|
34799
34799
|
exports.IllustrationMySiteCoffeeBook = IllustrationMySiteCoffeeBook$1;
|
34800
34800
|
exports.IllustrationMySiteComputer = IllustrationMySiteComputer$1;
|
@@ -0,0 +1,16 @@
|
|
1
|
+
import _styled from "@emotion/styled/base";
|
2
|
+
function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
|
3
|
+
export const BodyWrapper = /*#__PURE__*/_styled("tbody", process.env.NODE_ENV === "production" ? {
|
4
|
+
target: "e1u8g1t20"
|
5
|
+
} : {
|
6
|
+
target: "e1u8g1t20",
|
7
|
+
label: "BodyWrapper"
|
8
|
+
})(process.env.NODE_ENV === "production" ? {
|
9
|
+
name: "ixi98c",
|
10
|
+
styles: "display:flex;flex-direction:column;grid-row-gap:1em"
|
11
|
+
} : {
|
12
|
+
name: "ixi98c",
|
13
|
+
styles: "display:flex;flex-direction:column;grid-row-gap:1em",
|
14
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9jb3JlL0JveGVkVGFibGUvVGFibGVCb2R5L3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFdUMiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL3BhY2thZ2VzL2NvcmUvQm94ZWRUYWJsZS9UYWJsZUJvZHkvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5cbmV4cG9ydCBjb25zdCBCb2R5V3JhcHBlciA9IHN0eWxlZC50Ym9keWBcbiAgZGlzcGxheTogZmxleDtcbiAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgZ3JpZC1yb3ctZ2FwOiAxZW07XG5gXG4iXX0= */",
|
15
|
+
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
16
|
+
});
|
@@ -3,7 +3,7 @@ const regularExpressions = {
|
|
3
3
|
mobilenumber: new RegExp(/(?:^((?!00|[+])|(?:(?:00|[+])47))([49]\d{7})$)|(?:^(?:00|[+])(?!47)([49]\d{7,15})$)/),
|
4
4
|
exclusiveNumbers: new RegExp(/^\d+$/),
|
5
5
|
date: new RegExp(/^(0[1-9]|[12][0-9]|3[01])[\.](0[1-9]|1[012])[\.]\d{4}|(0[1-9]|[1-2][0-9]|31(?!(?:0[2469]|11))|30(?!02))(0[1-9]|1[0-2])([12]\d{3})|([01][0-9]|2[0-8])(0[0-9]|1[0-2])[0-9][0-9]|30(0[013-9]|1[0-2])[0-9][0-9]|31(0[13578]|1[02])[0-9][0-9]|29((0[013-9]|1[0-2])[0-9][0-9]|02([0246][048]|[13579][26]))|(0[1-9]|[12][0-9]|3[01])[\.](0[1-9]|1[012])[\.]\d{2}$/),
|
6
|
-
email: new RegExp(
|
6
|
+
email: new RegExp(/(?:[^<>()\[\]\\.,;:\s@"]+(?:\.[^<>()\[\]\\.,;:\s@"]+)*@(?:[a-zA-ZæÆøØåÅ0-9-]+\.)+[a-zA-Z]{2,}(?:\s?[;,:\s]\s?)?)+/),
|
7
7
|
year: new RegExp(/^[12][0-9]{3}$/),
|
8
8
|
url: new RegExp(/https?:\/\/(www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{2,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/)
|
9
9
|
};
|
@@ -2,7 +2,7 @@ import React from 'react';
|
|
2
2
|
import withIllustration from '../withIllustration';
|
3
3
|
import { jsx as _jsx } from "react/jsx-runtime";
|
4
4
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
5
|
-
const
|
5
|
+
const IllustrationMySiteBenefits = props => {
|
6
6
|
return /*#__PURE__*/_jsxs("svg", {
|
7
7
|
viewBox: " 0 0 125 85",
|
8
8
|
...props,
|
@@ -178,4 +178,4 @@ const IllustrationHouse = props => {
|
|
178
178
|
})]
|
179
179
|
});
|
180
180
|
};
|
181
|
-
export default withIllustration('
|
181
|
+
export default withIllustration('IllustrationMySiteBenefits')(IllustrationMySiteBenefits);
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/packages/core/BoxedTable/TableBody/index.tsx"],"names":[],"mappings":";AAEA,aAAK,KAAK,GAAG;IACX,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,CAAA;AACD,QAAA,MAAM,SAAS,iBAAkB,KAAK,gCAErC,CAAA;AACD,eAAe,SAAS,CAAA"}
|
@@ -0,0 +1,6 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
export declare const BodyWrapper: import("@emotion/styled").StyledComponent<{
|
3
|
+
theme?: import("@emotion/react").Theme | undefined;
|
4
|
+
as?: import("react").ElementType<any> | undefined;
|
5
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, {}>;
|
6
|
+
//# sourceMappingURL=styles.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/packages/core/BoxedTable/TableBody/styles.ts"],"names":[],"mappings":";AAEA,eAAO,MAAM,WAAW;;;2HAIvB,CAAA"}
|
@@ -0,0 +1,16 @@
|
|
1
|
+
import _styled from "@emotion/styled/base";
|
2
|
+
function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
|
3
|
+
export const BodyWrapper = /*#__PURE__*/_styled("tbody", process.env.NODE_ENV === "production" ? {
|
4
|
+
target: "e1u8g1t20"
|
5
|
+
} : {
|
6
|
+
target: "e1u8g1t20",
|
7
|
+
label: "BodyWrapper"
|
8
|
+
})(process.env.NODE_ENV === "production" ? {
|
9
|
+
name: "ixi98c",
|
10
|
+
styles: "display:flex;flex-direction:column;grid-row-gap:1em"
|
11
|
+
} : {
|
12
|
+
name: "ixi98c",
|
13
|
+
styles: "display:flex;flex-direction:column;grid-row-gap:1em",
|
14
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9jb3JlL0JveGVkVGFibGUvVGFibGVCb2R5L3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFdUMiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL3BhY2thZ2VzL2NvcmUvQm94ZWRUYWJsZS9UYWJsZUJvZHkvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5cbmV4cG9ydCBjb25zdCBCb2R5V3JhcHBlciA9IHN0eWxlZC50Ym9keWBcbiAgZGlzcGxheTogZmxleDtcbiAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgZ3JpZC1yb3ctZ2FwOiAxZW07XG5gXG4iXX0= */",
|
15
|
+
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
16
|
+
});
|
@@ -3,7 +3,7 @@ const regularExpressions = {
|
|
3
3
|
mobilenumber: new RegExp(/(?:^((?!00|[+])|(?:(?:00|[+])47))([49]\d{7})$)|(?:^(?:00|[+])(?!47)([49]\d{7,15})$)/),
|
4
4
|
exclusiveNumbers: new RegExp(/^\d+$/),
|
5
5
|
date: new RegExp(/^(0[1-9]|[12][0-9]|3[01])[\.](0[1-9]|1[012])[\.]\d{4}|(0[1-9]|[1-2][0-9]|31(?!(?:0[2469]|11))|30(?!02))(0[1-9]|1[0-2])([12]\d{3})|([01][0-9]|2[0-8])(0[0-9]|1[0-2])[0-9][0-9]|30(0[013-9]|1[0-2])[0-9][0-9]|31(0[13578]|1[02])[0-9][0-9]|29((0[013-9]|1[0-2])[0-9][0-9]|02([0246][048]|[13579][26]))|(0[1-9]|[12][0-9]|3[01])[\.](0[1-9]|1[012])[\.]\d{2}$/),
|
6
|
-
email: new RegExp(
|
6
|
+
email: new RegExp(/(?:[^<>()\[\]\\.,;:\s@"]+(?:\.[^<>()\[\]\\.,;:\s@"]+)*@(?:[a-zA-ZæÆøØåÅ0-9-]+\.)+[a-zA-Z]{2,}(?:\s?[;,:\s]\s?)?)+/),
|
7
7
|
year: new RegExp(/^[12][0-9]{3}$/),
|
8
8
|
url: new RegExp(/https?:\/\/(www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{2,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/)
|
9
9
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"IllustrationMySiteBenefits.d.ts","sourceRoot":"","sources":["../../../src/packages/illustrations/MySite/IllustrationMySiteBenefits.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;;AAoLzB,
|
1
|
+
{"version":3,"file":"IllustrationMySiteBenefits.d.ts","sourceRoot":"","sources":["../../../src/packages/illustrations/MySite/IllustrationMySiteBenefits.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;;AAoLzB,wBAEC"}
|
@@ -2,7 +2,7 @@ import React from 'react';
|
|
2
2
|
import withIllustration from '../withIllustration';
|
3
3
|
import { jsx as _jsx } from "react/jsx-runtime";
|
4
4
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
5
|
-
const
|
5
|
+
const IllustrationMySiteBenefits = props => {
|
6
6
|
return /*#__PURE__*/_jsxs("svg", {
|
7
7
|
viewBox: " 0 0 125 85",
|
8
8
|
...props,
|
@@ -178,4 +178,4 @@ const IllustrationHouse = props => {
|
|
178
178
|
})]
|
179
179
|
});
|
180
180
|
};
|
181
|
-
export default withIllustration('
|
181
|
+
export default withIllustration('IllustrationMySiteBenefits')(IllustrationMySiteBenefits);
|
package/package.json
CHANGED
@@ -1,16 +0,0 @@
|
|
1
|
-
import { createRef, useEffect, useState } from 'react';
|
2
|
-
|
3
|
-
const useHandleOptionsHeight = () => {
|
4
|
-
const [optionsHeight, setOptionsHeight] = useState(0);
|
5
|
-
const optionsRef = /*#__PURE__*/createRef();
|
6
|
-
useEffect(() => {
|
7
|
-
const rect = optionsRef.current?.getBoundingClientRect();
|
8
|
-
setOptionsHeight(rect?.height || 0); // eslint-disable-next-line react-hooks/exhaustive-deps
|
9
|
-
}, [optionsRef.current]);
|
10
|
-
return {
|
11
|
-
optionsHeight,
|
12
|
-
optionsRef
|
13
|
-
};
|
14
|
-
};
|
15
|
-
|
16
|
-
export default useHandleOptionsHeight;
|
@@ -1,22 +0,0 @@
|
|
1
|
-
// import React from 'react'
|
2
|
-
// interface IProps {
|
3
|
-
// /** Function children in which CheckBox components can be rendered. */
|
4
|
-
// children: (component: React.ComponentType, values: string[], id: string) => void;
|
5
|
-
// /** Unique name of the field. */
|
6
|
-
// name: string,;
|
7
|
-
// /** Callback that is triggered when a child CheckBox is clicked. */
|
8
|
-
// onChange: (values: string[], event: React.ChangeEvent<HTMLInputElement>) => void;
|
9
|
-
// /** Default checked values. */
|
10
|
-
// value?: string,[];
|
11
|
-
// }
|
12
|
-
// const CheckboxController: React.FC<IProps> = props => {
|
13
|
-
// const type: string = 'checkbox'
|
14
|
-
// const onChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
15
|
-
// if (props.onChange) {
|
16
|
-
// props.onChange(e.target.checked)
|
17
|
-
// }
|
18
|
-
// }
|
19
|
-
// return (
|
20
|
-
// )
|
21
|
-
// }
|
22
|
-
// export default Checkbox
|
@@ -1,56 +0,0 @@
|
|
1
|
-
import React from 'react';
|
2
|
-
import { MONTHS } from '../../utils/dates';
|
3
|
-
import { StyledSelect, Div } from './styles';
|
4
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
5
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
6
|
-
|
7
|
-
const YearMonthForm = ({
|
8
|
-
onChange,
|
9
|
-
date,
|
10
|
-
fromDate,
|
11
|
-
toDate
|
12
|
-
}) => {
|
13
|
-
const months = MONTHS;
|
14
|
-
const years = [];
|
15
|
-
|
16
|
-
for (let i = fromDate.getFullYear(); i <= toDate.getFullYear(); i += 1) {
|
17
|
-
years.push(i);
|
18
|
-
}
|
19
|
-
|
20
|
-
const changeMonth = e => {
|
21
|
-
let newDate = date;
|
22
|
-
newDate.setMonth(e.target.value);
|
23
|
-
if (newDate > toDate) newDate = toDate;
|
24
|
-
onChange(newDate);
|
25
|
-
};
|
26
|
-
|
27
|
-
const changeYear = e => {
|
28
|
-
let newDate = date;
|
29
|
-
newDate.setFullYear(e.target.value);
|
30
|
-
if (newDate > toDate) newDate = toDate;
|
31
|
-
onChange(newDate);
|
32
|
-
};
|
33
|
-
|
34
|
-
return /*#__PURE__*/_jsxs(Div, {
|
35
|
-
className: "DayPicker-Caption",
|
36
|
-
children: [/*#__PURE__*/_jsx(StyledSelect, {
|
37
|
-
name: "month",
|
38
|
-
onChange: changeMonth,
|
39
|
-
value: date.getMonth(),
|
40
|
-
children: months.map((month, i) => /*#__PURE__*/_jsx("option", {
|
41
|
-
value: i,
|
42
|
-
children: month
|
43
|
-
}, month))
|
44
|
-
}), /*#__PURE__*/_jsx(StyledSelect, {
|
45
|
-
name: "year",
|
46
|
-
onChange: changeYear,
|
47
|
-
value: date.getFullYear(),
|
48
|
-
children: years.map(year => /*#__PURE__*/_jsx("option", {
|
49
|
-
value: year,
|
50
|
-
children: year
|
51
|
-
}, year))
|
52
|
-
})]
|
53
|
-
});
|
54
|
-
};
|
55
|
-
|
56
|
-
export default YearMonthForm;
|
@@ -1,69 +0,0 @@
|
|
1
|
-
export const basicToolbar = {
|
2
|
-
options: ['inline', 'list'],
|
3
|
-
inline: {
|
4
|
-
options: ['bold', 'italic', 'underline']
|
5
|
-
}
|
6
|
-
};
|
7
|
-
export const richToolbar = {
|
8
|
-
options: ['blockType', 'inline', 'list', 'textAlign', 'link'],
|
9
|
-
inline: {
|
10
|
-
options: ['bold', 'italic', 'underline']
|
11
|
-
},
|
12
|
-
textAlign: {
|
13
|
-
options: ['left', 'center', 'right', 'justify']
|
14
|
-
},
|
15
|
-
blockType: {
|
16
|
-
inDropdown: true,
|
17
|
-
options: ['Normal', 'H1', 'H2', 'H3', 'H4', 'H5', 'H6']
|
18
|
-
},
|
19
|
-
link: {
|
20
|
-
showOpenOptionOnHover: true,
|
21
|
-
defaultTargetOption: '_blank',
|
22
|
-
options: ['link', 'unlink']
|
23
|
-
}
|
24
|
-
};
|
25
|
-
export const htmlToEntity = (nodeName, node, createEntity) => {
|
26
|
-
if (nodeName === 'a') {
|
27
|
-
return createEntity('LINK', 'MUTABLE', {
|
28
|
-
url: node.href
|
29
|
-
});
|
30
|
-
}
|
31
|
-
};
|
32
|
-
export const getStrippedHtml = html => {
|
33
|
-
return html.replace(/<img[^>]*>/g, '');
|
34
|
-
};
|
35
|
-
export const editorLabels = {
|
36
|
-
// Generic
|
37
|
-
'generic.add': 'Legg til',
|
38
|
-
'generic.cancel': 'Avbryt',
|
39
|
-
// Inline
|
40
|
-
'components.controls.inline.bold': 'Fet',
|
41
|
-
'components.controls.inline.italic': 'Kursiv',
|
42
|
-
'components.controls.inline.underline': 'Understrek',
|
43
|
-
// List
|
44
|
-
'components.controls.list.unordered': 'Punktliste',
|
45
|
-
'components.controls.list.ordered': 'Nummerliste',
|
46
|
-
'components.controls.list.indent': 'Innrykk',
|
47
|
-
'components.controls.list.outdent': 'Utrykk',
|
48
|
-
// Text align
|
49
|
-
'components.controls.textAlign.left': 'Venstrejuster',
|
50
|
-
'components.controls.textAlign.center': 'Midtstill',
|
51
|
-
'components.controls.textAlign.right': 'Høyrejuster',
|
52
|
-
'components.controls.textAlign.justify': 'Blokkjuster',
|
53
|
-
// Block type
|
54
|
-
'components.controls.blocktype.normal': 'Avsnitt',
|
55
|
-
'components.controls.blocktype.h1': 'Overskrift 1',
|
56
|
-
'components.controls.blocktype.h2': 'Overskrift 2',
|
57
|
-
'components.controls.blocktype.h3': 'Overskrift 3',
|
58
|
-
'components.controls.blocktype.h4': 'Overskrift 4',
|
59
|
-
'components.controls.blocktype.h5': 'Overskrift 5',
|
60
|
-
'components.controls.blocktype.h6': 'Overskrift 6',
|
61
|
-
// Link
|
62
|
-
'components.controls.link.linkTitle': 'Tittel',
|
63
|
-
'components.controls.link.linkTarget': 'URL',
|
64
|
-
'components.controls.link.linkTargetOption': 'Åpne i ny fane',
|
65
|
-
'components.controls.link.link': 'Legg til lenke',
|
66
|
-
'components.controls.link.unlink': 'Fjern lenke',
|
67
|
-
// Remove
|
68
|
-
'components.controls.remove.remove': 'Fjern'
|
69
|
-
};
|
@@ -1,147 +0,0 @@
|
|
1
|
-
/** @jsxImportSource @emotion/react */
|
2
|
-
import React, { useState } from 'react';
|
3
|
-
import { Editor as Wysiwyg } from 'react-draft-wysiwyg';
|
4
|
-
import { convertToRaw, EditorState, Modifier } from 'draft-js';
|
5
|
-
import { stateFromHTML } from 'draft-js-import-html';
|
6
|
-
import 'react-draft-wysiwyg/dist/react-draft-wysiwyg.css';
|
7
|
-
import { CounterWrapper, ErrorWrapper, Label, RelativeDiv, styles } from './styles';
|
8
|
-
import { basicToolbar, editorLabels, getStrippedHtml, htmlToEntity, richToolbar } from './config';
|
9
|
-
import { convertToHTML, convertFromHTML } from 'draft-convert';
|
10
|
-
import Text from '../Text';
|
11
|
-
import { useTheme } from '@emotion/react';
|
12
|
-
import IconErrorOutline from '../../icons/General/IconErrorOutline';
|
13
|
-
import draftToHtml from 'draftjs-to-html';
|
14
|
-
import { jsxs as _jsxs } from "@emotion/react/jsx-runtime";
|
15
|
-
import { jsx as _jsx } from "@emotion/react/jsx-runtime";
|
16
|
-
|
17
|
-
/**
|
18
|
-
*
|
19
|
-
* TODO: REMOVE AND CLEANUP PACKAGES
|
20
|
-
*
|
21
|
-
*/
|
22
|
-
const EditorOld = ({
|
23
|
-
initialValue,
|
24
|
-
height = 300,
|
25
|
-
maxHeight,
|
26
|
-
maxlength,
|
27
|
-
maxlengthType = 'plaintext',
|
28
|
-
maxlengthText,
|
29
|
-
withCounter,
|
30
|
-
invalidMessage,
|
31
|
-
label,
|
32
|
-
customToolbar,
|
33
|
-
type = 'basic',
|
34
|
-
onChange,
|
35
|
-
onBlur
|
36
|
-
}) => {
|
37
|
-
const theme = useTheme();
|
38
|
-
const [maxlengthError, setMaxlengthError] = useState(null);
|
39
|
-
const [charCount, setCharCount] = useState(0);
|
40
|
-
const [editorState, setEditorState] = useState(initialValue ? EditorState.createWithContent(convertFromHTML({
|
41
|
-
htmlToEntity
|
42
|
-
})(initialValue)) : EditorState.createEmpty());
|
43
|
-
|
44
|
-
const handleEditorChange = state => {
|
45
|
-
handleValidity(state);
|
46
|
-
setEditorState(state);
|
47
|
-
const plainText = state.getCurrentContent().getPlainText();
|
48
|
-
const html = draftToHtml(convertToRaw(state.getCurrentContent()));
|
49
|
-
onChange(plainText.length > 0 ? html : ''); // return empty if no content
|
50
|
-
|
51
|
-
if (withCounter && maxlength) {
|
52
|
-
setCharCount(maxlengthType === 'html' ? html.length : plainText.length);
|
53
|
-
}
|
54
|
-
};
|
55
|
-
|
56
|
-
const handleValidity = state => {
|
57
|
-
if (!maxlength) {
|
58
|
-
setMaxlengthError(null);
|
59
|
-
return;
|
60
|
-
}
|
61
|
-
|
62
|
-
const plaintext = state.getCurrentContent().getPlainText();
|
63
|
-
const html = convertToHTML(state.getCurrentContent());
|
64
|
-
|
65
|
-
if (maxlengthType === 'html' && html.length > maxlength) {
|
66
|
-
setMaxlengthError(maxlengthText ? maxlengthText : 'Text is too long');
|
67
|
-
return;
|
68
|
-
}
|
69
|
-
|
70
|
-
if (maxlengthType === 'plaintext' && plaintext.length > maxlength) {
|
71
|
-
setMaxlengthError(maxlengthText ? maxlengthText : 'Text is too long');
|
72
|
-
return;
|
73
|
-
}
|
74
|
-
|
75
|
-
setMaxlengthError(null);
|
76
|
-
};
|
77
|
-
|
78
|
-
const Counter = _jsx(CounterWrapper, {
|
79
|
-
children: _jsxs(Text, {
|
80
|
-
children: [charCount, "/", maxlength]
|
81
|
-
})
|
82
|
-
});
|
83
|
-
|
84
|
-
const handlePaste = (text, html, editorState, onChange) => {
|
85
|
-
if (!html) return false;
|
86
|
-
const strippedHtml = getStrippedHtml(html);
|
87
|
-
const blockMap = stateFromHTML(strippedHtml).blockMap;
|
88
|
-
const newState = Modifier.replaceWithFragment(editorState.getCurrentContent(), editorState.getSelection(), blockMap);
|
89
|
-
onChange(EditorState.push(editorState, newState, 'insert-fragment'));
|
90
|
-
return true;
|
91
|
-
};
|
92
|
-
|
93
|
-
const getToolbar = () => {
|
94
|
-
switch (type) {
|
95
|
-
case 'basic':
|
96
|
-
return basicToolbar;
|
97
|
-
|
98
|
-
case 'rich':
|
99
|
-
return richToolbar;
|
100
|
-
|
101
|
-
case 'custom':
|
102
|
-
return customToolbar;
|
103
|
-
|
104
|
-
default:
|
105
|
-
return undefined;
|
106
|
-
}
|
107
|
-
};
|
108
|
-
|
109
|
-
return _jsxs("div", {
|
110
|
-
css: theme => [styles.default(theme, height), maxHeight && styles.maxHeight(maxHeight)],
|
111
|
-
children: [label && _jsx(Label, {
|
112
|
-
children: label
|
113
|
-
}), _jsxs(RelativeDiv, {
|
114
|
-
children: [_jsx(Wysiwyg, {
|
115
|
-
editorState: editorState,
|
116
|
-
toolbarClassName: "toolbar-wrapper",
|
117
|
-
wrapperClassName: "editor-wrapper",
|
118
|
-
editorClassName: "content-wrapper",
|
119
|
-
onEditorStateChange: handleEditorChange,
|
120
|
-
toolbar: getToolbar(),
|
121
|
-
localization: {
|
122
|
-
locale: 'nb_NO',
|
123
|
-
translations: editorLabels
|
124
|
-
},
|
125
|
-
stripPastedStyles: type !== 'rich',
|
126
|
-
onBlur: () => onBlur && onBlur(),
|
127
|
-
handlePastedText: handlePaste
|
128
|
-
}), maxlength && withCounter && Counter]
|
129
|
-
}), (maxlengthError || invalidMessage) && _jsxs(ErrorWrapper, {
|
130
|
-
children: [maxlengthError && _jsxs(Text, {
|
131
|
-
color: theme.alert,
|
132
|
-
children: [_jsx(IconErrorOutline, {
|
133
|
-
size: "16px",
|
134
|
-
color: theme.alert
|
135
|
-
}), ' ', maxlengthError]
|
136
|
-
}), invalidMessage && _jsxs(Text, {
|
137
|
-
color: theme.alert,
|
138
|
-
children: [_jsx(IconErrorOutline, {
|
139
|
-
size: "16px",
|
140
|
-
color: theme.alert
|
141
|
-
}), ' ', invalidMessage]
|
142
|
-
})]
|
143
|
-
})]
|
144
|
-
});
|
145
|
-
};
|
146
|
-
|
147
|
-
export default EditorOld;
|