@pie-lib/text-select 0.1.0
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/index.d.ts +16 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +7 -0
- package/dist/legend.d.ts +13 -0
- package/dist/legend.d.ts.map +1 -0
- package/dist/legend.js +64 -0
- package/dist/text-select.d.ts +35 -0
- package/dist/text-select.d.ts.map +1 -0
- package/dist/text-select.js +53 -0
- package/dist/token-select/index.d.ts +39 -0
- package/dist/token-select/index.d.ts.map +1 -0
- package/dist/token-select/index.js +102 -0
- package/dist/token-select/token.d.ts +33 -0
- package/dist/token-select/token.d.ts.map +1 -0
- package/dist/token-select/token.js +134 -0
- package/dist/tokenizer/builder.d.ts +28 -0
- package/dist/tokenizer/builder.d.ts.map +1 -0
- package/dist/tokenizer/builder.js +124 -0
- package/dist/tokenizer/controls.d.ts +24 -0
- package/dist/tokenizer/controls.d.ts.map +1 -0
- package/dist/tokenizer/controls.js +68 -0
- package/dist/tokenizer/index.d.ts +36 -0
- package/dist/tokenizer/index.d.ts.map +1 -0
- package/dist/tokenizer/index.js +91 -0
- package/dist/tokenizer/selection-utils.d.ts +11 -0
- package/dist/tokenizer/selection-utils.d.ts.map +1 -0
- package/dist/tokenizer/selection-utils.js +18 -0
- package/dist/tokenizer/token-text.d.ts +28 -0
- package/dist/tokenizer/token-text.d.ts.map +1 -0
- package/dist/tokenizer/token-text.js +85 -0
- package/dist/utils.d.ts +13 -0
- package/dist/utils.d.ts.map +1 -0
- package/dist/utils.js +21 -0
- package/package.json +39 -0
- package/src/index.ts +18 -0
- package/src/legend.tsx +112 -0
- package/src/text-select.tsx +89 -0
- package/src/token-select/index.tsx +181 -0
- package/src/token-select/token.tsx +233 -0
- package/src/tokenizer/builder.ts +268 -0
- package/src/tokenizer/controls.tsx +81 -0
- package/src/tokenizer/index.tsx +154 -0
- package/src/tokenizer/selection-utils.ts +59 -0
- package/src/tokenizer/token-text.tsx +145 -0
- package/src/utils.tsx +66 -0
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @synced-from pie-lib/packages/text-select/src/index.js
|
|
3
|
+
* @auto-generated
|
|
4
|
+
*
|
|
5
|
+
* This file is automatically synced from pie-elements and converted to TypeScript.
|
|
6
|
+
* Manual edits will be overwritten on next sync.
|
|
7
|
+
* To make changes, edit the upstream JavaScript file and run sync again.
|
|
8
|
+
*/
|
|
9
|
+
import Tokenizer from './tokenizer/index.js';
|
|
10
|
+
import TokenSelect, { TokenTypes } from './token-select/index.js';
|
|
11
|
+
import TextSelect from './text-select.js';
|
|
12
|
+
import { Legend } from './legend.js';
|
|
13
|
+
import Token from './token-select/token.js';
|
|
14
|
+
import { prepareText } from './utils.js';
|
|
15
|
+
export { TextSelect, TokenTypes, Tokenizer, TokenSelect, Token, prepareText, Legend };
|
|
16
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA;;;;;;;GAOG;AAEH,OAAO,SAAS,MAAM,sBAAsB,CAAC;AAC7C,OAAO,WAAW,EAAE,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAClE,OAAO,UAAU,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,KAAK,MAAM,yBAAyB,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAEzC,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,WAAW,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,EAAE,CAAC"}
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import e from "./tokenizer/index.js";
|
|
2
|
+
import t, { TokenTypes as n } from "./token-select/token.js";
|
|
3
|
+
import r from "./token-select/index.js";
|
|
4
|
+
import i from "./text-select.js";
|
|
5
|
+
import { Legend as a } from "./legend.js";
|
|
6
|
+
import { prepareText as o } from "./utils.js";
|
|
7
|
+
export { a as Legend, i as TextSelect, t as Token, r as TokenSelect, n as TokenTypes, e as Tokenizer, o as prepareText };
|
package/dist/legend.d.ts
ADDED
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @synced-from pie-lib/packages/text-select/src/legend.js
|
|
3
|
+
* @auto-generated
|
|
4
|
+
*
|
|
5
|
+
* This file is automatically synced from pie-elements and converted to TypeScript.
|
|
6
|
+
* Manual edits will be overwritten on next sync.
|
|
7
|
+
* To make changes, edit the upstream JavaScript file and run sync again.
|
|
8
|
+
*/
|
|
9
|
+
export declare const Legend: ({ language, showOnlyCorrect }: {
|
|
10
|
+
language: any;
|
|
11
|
+
showOnlyCorrect: any;
|
|
12
|
+
}) => JSX.Element;
|
|
13
|
+
//# sourceMappingURL=legend.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"legend.d.ts","sourceRoot":"","sources":["../src/legend.tsx"],"names":[],"mappings":"AACA;;;;;;;GAOG;AAqEH,eAAO,MAAM,MAAM,GAAI;;;CAA6B,gBAkCnD,CAAC"}
|
package/dist/legend.js
ADDED
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
import "react";
|
|
2
|
+
import { styled as e } from "@mui/material/styles";
|
|
3
|
+
import { color as t } from "@pie-lib/render-ui";
|
|
4
|
+
import { jsx as n, jsxs as r } from "react/jsx-runtime";
|
|
5
|
+
import i from "@mui/icons-material/Check";
|
|
6
|
+
import a from "@mui/icons-material/Close";
|
|
7
|
+
import o from "@pie-lib/translator";
|
|
8
|
+
//#region src/legend.tsx
|
|
9
|
+
var { translator: s } = o, c = e("div")(({ theme: e }) => ({
|
|
10
|
+
display: "flex",
|
|
11
|
+
flexDirection: "row",
|
|
12
|
+
alignItems: "center",
|
|
13
|
+
gap: e.spacing(2),
|
|
14
|
+
borderBottom: "1px solid lightgrey",
|
|
15
|
+
borderTop: "1px solid lightgrey",
|
|
16
|
+
paddingBottom: e.spacing(1),
|
|
17
|
+
paddingTop: e.spacing(1),
|
|
18
|
+
marginBottom: e.spacing(1)
|
|
19
|
+
})), l = e("span")(({ theme: e }) => ({
|
|
20
|
+
fontSize: "14px",
|
|
21
|
+
fontWeight: "bold",
|
|
22
|
+
color: t.black(),
|
|
23
|
+
marginLeft: e.spacing(1)
|
|
24
|
+
})), u = e("div")(() => ({
|
|
25
|
+
position: "relative",
|
|
26
|
+
padding: "4px",
|
|
27
|
+
fontSize: "14px",
|
|
28
|
+
borderRadius: "4px"
|
|
29
|
+
})), d = e(u)(() => ({ border: `${t.correctTertiary()} solid 2px` })), f = e(u)(() => ({ border: `${t.incorrectWithIcon()} solid 2px` })), p = e(u)(() => ({ border: `${t.incorrectWithIcon()} dashed 2px` })), m = {
|
|
30
|
+
color: t.white(),
|
|
31
|
+
position: "absolute",
|
|
32
|
+
top: "-8px",
|
|
33
|
+
left: "-8px",
|
|
34
|
+
borderRadius: "50%",
|
|
35
|
+
fontSize: "12px",
|
|
36
|
+
padding: "2px"
|
|
37
|
+
}, h = e(i)(() => ({
|
|
38
|
+
...m,
|
|
39
|
+
backgroundColor: t.correctTertiary()
|
|
40
|
+
})), g = e(a)(() => ({
|
|
41
|
+
...m,
|
|
42
|
+
backgroundColor: t.incorrectWithIcon()
|
|
43
|
+
})), _ = ({ language: e, showOnlyCorrect: t }) => {
|
|
44
|
+
let i = [
|
|
45
|
+
{
|
|
46
|
+
Icon: h,
|
|
47
|
+
label: s.t("selectText.correctAnswerSelected", { lng: e }),
|
|
48
|
+
Container: d
|
|
49
|
+
},
|
|
50
|
+
{
|
|
51
|
+
Icon: g,
|
|
52
|
+
label: s.t("selectText.incorrectSelection", { lng: e }),
|
|
53
|
+
Container: f
|
|
54
|
+
},
|
|
55
|
+
{
|
|
56
|
+
Icon: g,
|
|
57
|
+
label: s.t("selectText.correctAnswerNotSelected", { lng: e }),
|
|
58
|
+
Container: p
|
|
59
|
+
}
|
|
60
|
+
];
|
|
61
|
+
return t && i.splice(1, 2), /* @__PURE__ */ r(c, { children: [/* @__PURE__ */ n(l, { children: s.t("selectText.key", { lng: e }) }), i.map(({ Icon: e, label: t, Container: i }, a) => /* @__PURE__ */ r(i, { children: [/* @__PURE__ */ n(e, {}), /* @__PURE__ */ n("span", { children: t })] }, a))] });
|
|
62
|
+
};
|
|
63
|
+
//#endregion
|
|
64
|
+
export { _ as Legend };
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @synced-from pie-lib/packages/text-select/src/text-select.jsx
|
|
3
|
+
* @auto-generated
|
|
4
|
+
*
|
|
5
|
+
* This file is automatically synced from pie-elements and converted to TypeScript.
|
|
6
|
+
* Manual edits will be overwritten on next sync.
|
|
7
|
+
* To make changes, edit the upstream JavaScript file and run sync again.
|
|
8
|
+
*/
|
|
9
|
+
import React from 'react';
|
|
10
|
+
import PropTypes from 'prop-types';
|
|
11
|
+
/**
|
|
12
|
+
* Built on TokenSelect uses build.normalize to build the token set.
|
|
13
|
+
*/
|
|
14
|
+
export default class TextSelect extends React.Component {
|
|
15
|
+
static propTypes: {
|
|
16
|
+
onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
|
17
|
+
disabled: PropTypes.Requireable<boolean>;
|
|
18
|
+
tokens: PropTypes.Validator<(PropTypes.InferProps<{
|
|
19
|
+
text: PropTypes.Requireable<string>;
|
|
20
|
+
selectable: PropTypes.Requireable<boolean>;
|
|
21
|
+
}> | null | undefined)[]>;
|
|
22
|
+
selectedTokens: PropTypes.Validator<(PropTypes.InferProps<{
|
|
23
|
+
text: PropTypes.Requireable<string>;
|
|
24
|
+
selectable: PropTypes.Requireable<boolean>;
|
|
25
|
+
}> | null | undefined)[]>;
|
|
26
|
+
text: PropTypes.Validator<string>;
|
|
27
|
+
className: PropTypes.Requireable<string>;
|
|
28
|
+
highlightChoices: PropTypes.Requireable<boolean>;
|
|
29
|
+
animationsDisabled: PropTypes.Requireable<boolean>;
|
|
30
|
+
maxNoOfSelections: PropTypes.Requireable<number>;
|
|
31
|
+
};
|
|
32
|
+
change: any;
|
|
33
|
+
render(): JSX.Element;
|
|
34
|
+
}
|
|
35
|
+
//# sourceMappingURL=text-select.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"text-select.d.ts","sourceRoot":"","sources":["../src/text-select.tsx"],"names":[],"mappings":"AACA;;;;;;;GAOG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,YAAY,CAAC;AAQnC;;GAEG;AACH,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,KAAK,CAAC,SAAS;IACrD,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;;MAUd;IAEF,MAAM,EAAE,GAAG,CAST;IAEF,MAAM;CA0CP"}
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import { normalize as e } from "./tokenizer/builder.js";
|
|
2
|
+
import { TokenTypes as t } from "./token-select/token.js";
|
|
3
|
+
import n from "./token-select/index.js";
|
|
4
|
+
import r from "react";
|
|
5
|
+
import i from "prop-types";
|
|
6
|
+
import { jsx as a } from "react/jsx-runtime";
|
|
7
|
+
import o from "debug";
|
|
8
|
+
//#region src/text-select.tsx
|
|
9
|
+
var s = o("@pie-lib:text-select"), c = class extends r.Component {
|
|
10
|
+
static propTypes = {
|
|
11
|
+
onChange: i.func,
|
|
12
|
+
disabled: i.bool,
|
|
13
|
+
tokens: i.arrayOf(i.shape(t)).isRequired,
|
|
14
|
+
selectedTokens: i.arrayOf(i.shape(t)).isRequired,
|
|
15
|
+
text: i.string.isRequired,
|
|
16
|
+
className: i.string,
|
|
17
|
+
highlightChoices: i.bool,
|
|
18
|
+
animationsDisabled: i.bool,
|
|
19
|
+
maxNoOfSelections: i.number
|
|
20
|
+
};
|
|
21
|
+
change = (e) => {
|
|
22
|
+
let { onChange: t } = this.props;
|
|
23
|
+
t && t(e.filter((e) => e.selected).map((e) => ({
|
|
24
|
+
start: e.start,
|
|
25
|
+
end: e.end
|
|
26
|
+
})));
|
|
27
|
+
};
|
|
28
|
+
render() {
|
|
29
|
+
let { text: t, disabled: r, tokens: i, selectedTokens: o, className: c, highlightChoices: l, maxNoOfSelections: u, animationsDisabled: d } = this.props, f = e(t, i);
|
|
30
|
+
s("normalized: ", f);
|
|
31
|
+
let p = f.map((e) => {
|
|
32
|
+
let t = o.findIndex((t) => t.start === e.start && t.end === e.end) !== -1, n = t ? e.correct : void 0, i = e.isMissing;
|
|
33
|
+
return {
|
|
34
|
+
...e,
|
|
35
|
+
selectable: !r && e.predefined,
|
|
36
|
+
selected: t,
|
|
37
|
+
correct: n,
|
|
38
|
+
isMissing: i
|
|
39
|
+
};
|
|
40
|
+
});
|
|
41
|
+
return /* @__PURE__ */ a(n, {
|
|
42
|
+
highlightChoices: !r && l,
|
|
43
|
+
className: c,
|
|
44
|
+
tokens: p,
|
|
45
|
+
disabled: r,
|
|
46
|
+
onChange: this.change,
|
|
47
|
+
maxNoOfSelections: u,
|
|
48
|
+
animationsDisabled: d
|
|
49
|
+
});
|
|
50
|
+
}
|
|
51
|
+
};
|
|
52
|
+
//#endregion
|
|
53
|
+
export { c as default };
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @synced-from pie-lib/packages/text-select/src/token-select/index.jsx
|
|
3
|
+
* @auto-generated
|
|
4
|
+
*
|
|
5
|
+
* This file is automatically synced from pie-elements and converted to TypeScript.
|
|
6
|
+
* Manual edits will be overwritten on next sync.
|
|
7
|
+
* To make changes, edit the upstream JavaScript file and run sync again.
|
|
8
|
+
*/
|
|
9
|
+
import React from 'react';
|
|
10
|
+
import PropTypes from 'prop-types';
|
|
11
|
+
import { TokenTypes } from './token.js';
|
|
12
|
+
export declare class TokenSelect extends React.Component {
|
|
13
|
+
static propTypes: {
|
|
14
|
+
tokens: PropTypes.Validator<(PropTypes.InferProps<{
|
|
15
|
+
text: PropTypes.Requireable<string>;
|
|
16
|
+
selectable: PropTypes.Requireable<boolean>;
|
|
17
|
+
}> | null | undefined)[]>;
|
|
18
|
+
className: PropTypes.Requireable<string>;
|
|
19
|
+
onChange: PropTypes.Validator<(...args: any[]) => any>;
|
|
20
|
+
disabled: PropTypes.Requireable<boolean>;
|
|
21
|
+
highlightChoices: PropTypes.Requireable<boolean>;
|
|
22
|
+
animationsDisabled: PropTypes.Requireable<boolean>;
|
|
23
|
+
maxNoOfSelections: PropTypes.Requireable<number>;
|
|
24
|
+
};
|
|
25
|
+
static defaultProps: {
|
|
26
|
+
highlightChoices: boolean;
|
|
27
|
+
maxNoOfSelections: number;
|
|
28
|
+
tokens: never[];
|
|
29
|
+
};
|
|
30
|
+
selectedCount: () => any;
|
|
31
|
+
canSelectMore: any;
|
|
32
|
+
toggleToken: any;
|
|
33
|
+
/** Build a React tree instead of an HTML string so Emotion can inject CSS */
|
|
34
|
+
generateTokensNodes: any;
|
|
35
|
+
render(): JSX.Element;
|
|
36
|
+
}
|
|
37
|
+
export default TokenSelect;
|
|
38
|
+
export { TokenTypes };
|
|
39
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/token-select/index.tsx"],"names":[],"mappings":"AACA;;;;;;;GAOG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAc,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AA2B/C,qBAAa,WAAY,SAAQ,KAAK,CAAC,SAAS;IAC9C,MAAM,CAAC,SAAS;;;;;;;;;;;MAQd;IAEF,MAAM,CAAC,YAAY;;;;MAIjB;IAEF,aAAa,YAA4D;IAEzE,aAAa,EAAE,GAAG,CAOhB;IAEF,WAAW,EAAE,GAAG,CAoCd;IAEF,6EAA6E;IAC7E,mBAAmB,EAAE,GAAG,CA2DtB;IAEF,MAAM;CAUP;AAED,eAAe,WAAW,CAAC;AAC3B,OAAO,EAAE,UAAU,EAAE,CAAC"}
|
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
import e, { TokenTypes as t } from "./token.js";
|
|
2
|
+
import n from "react";
|
|
3
|
+
import r from "prop-types";
|
|
4
|
+
import { styled as i } from "@mui/material/styles";
|
|
5
|
+
import { jsx as a } from "react/jsx-runtime";
|
|
6
|
+
import { clone as o, isEqual as s } from "lodash-es";
|
|
7
|
+
import { noSelect as c } from "@pie-lib/style-utils";
|
|
8
|
+
import l from "debug";
|
|
9
|
+
//#region src/token-select/index.tsx
|
|
10
|
+
var u = l("@pie-lib:text-select:token-select"), d = i("div")(() => ({
|
|
11
|
+
backgroundColor: "none",
|
|
12
|
+
whiteSpace: "pre",
|
|
13
|
+
...c(),
|
|
14
|
+
"& p": {
|
|
15
|
+
whiteSpace: "break-spaces",
|
|
16
|
+
margin: 0
|
|
17
|
+
}
|
|
18
|
+
})), f = (e) => e && e.replace(/<[^>]+>/g, ""), p = class extends n.Component {
|
|
19
|
+
static propTypes = {
|
|
20
|
+
tokens: r.arrayOf(r.shape(t)).isRequired,
|
|
21
|
+
className: r.string,
|
|
22
|
+
onChange: r.func.isRequired,
|
|
23
|
+
disabled: r.bool,
|
|
24
|
+
highlightChoices: r.bool,
|
|
25
|
+
animationsDisabled: r.bool,
|
|
26
|
+
maxNoOfSelections: r.number
|
|
27
|
+
};
|
|
28
|
+
static defaultProps = {
|
|
29
|
+
highlightChoices: !1,
|
|
30
|
+
maxNoOfSelections: 0,
|
|
31
|
+
tokens: []
|
|
32
|
+
};
|
|
33
|
+
selectedCount = () => this.props.tokens.filter((e) => e.selected).length;
|
|
34
|
+
canSelectMore = (e) => {
|
|
35
|
+
let { maxNoOfSelections: t } = this.props;
|
|
36
|
+
return t === 1 ? !0 : (u("[canSelectMore] maxNoOfSelections: ", t, "selectedCount: ", e), t <= 0 || isFinite(t) && e < t);
|
|
37
|
+
};
|
|
38
|
+
toggleToken = (t) => {
|
|
39
|
+
let { target: n } = t, { tokens: r, animationsDisabled: i } = this.props, a = o(r), c = (n.closest?.(`.${e.rootClassName}`))?.dataset?.indexkey, l = c === void 0 ? void 0 : a[c];
|
|
40
|
+
if (l && l.correct === void 0 && !i && !l.isMissing) {
|
|
41
|
+
let { onChange: e, maxNoOfSelections: t } = this.props, n = !l.selected;
|
|
42
|
+
if (t === 1 && this.selectedCount() === 1) {
|
|
43
|
+
let t = (r || []).filter((e) => e.selected), i = a.map((e) => s(e, t[0]) ? {
|
|
44
|
+
...e,
|
|
45
|
+
selected: !1
|
|
46
|
+
} : {
|
|
47
|
+
...e,
|
|
48
|
+
selectable: !0
|
|
49
|
+
}), o = {
|
|
50
|
+
...l,
|
|
51
|
+
selected: n
|
|
52
|
+
};
|
|
53
|
+
i.splice(c, 1, o), e(i);
|
|
54
|
+
} else {
|
|
55
|
+
if (n && t > 0 && this.selectedCount() >= t) {
|
|
56
|
+
u("skip toggle max reached");
|
|
57
|
+
return;
|
|
58
|
+
}
|
|
59
|
+
let r = {
|
|
60
|
+
...l,
|
|
61
|
+
selected: n
|
|
62
|
+
};
|
|
63
|
+
a.splice(c, 1, r), e(a);
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
};
|
|
67
|
+
generateTokensNodes = () => {
|
|
68
|
+
let { tokens: t, disabled: r, highlightChoices: i, animationsDisabled: o } = this.props, s = this.selectedCount(), c = (e) => e === "\n", l = (e) => e === "\n\n", u = [], d = [], p = () => {
|
|
69
|
+
u.push(/* @__PURE__ */ a("p", { children: d }, `p-${u.length}`)), d = [];
|
|
70
|
+
};
|
|
71
|
+
return (t || []).forEach((t, u) => {
|
|
72
|
+
let m = t.selected || t.selectable && this.canSelectMore(s), h = t.correct !== void 0 && (t.selectable || t.selected);
|
|
73
|
+
if (l(t.text)) {
|
|
74
|
+
p();
|
|
75
|
+
return;
|
|
76
|
+
}
|
|
77
|
+
if (c(t.text)) {
|
|
78
|
+
d.push(/* @__PURE__ */ a("br", {}, `br-${u}`));
|
|
79
|
+
return;
|
|
80
|
+
}
|
|
81
|
+
m && !r || h || t.selected || t.isMissing || o && t.predefined ? d.push(/* @__PURE__ */ a(e, {
|
|
82
|
+
disabled: r,
|
|
83
|
+
index: u,
|
|
84
|
+
...t,
|
|
85
|
+
text: f(t.text),
|
|
86
|
+
selectable: m,
|
|
87
|
+
highlight: i,
|
|
88
|
+
animationsDisabled: o
|
|
89
|
+
}, u)) : d.push(/* @__PURE__ */ a(n.Fragment, { children: f(t.text) }, u));
|
|
90
|
+
}), p(), u;
|
|
91
|
+
};
|
|
92
|
+
render() {
|
|
93
|
+
let { className: e } = this.props, t = this.generateTokensNodes();
|
|
94
|
+
return /* @__PURE__ */ a(d, {
|
|
95
|
+
className: e,
|
|
96
|
+
onClick: this.toggleToken,
|
|
97
|
+
children: t
|
|
98
|
+
});
|
|
99
|
+
}
|
|
100
|
+
};
|
|
101
|
+
//#endregion
|
|
102
|
+
export { p as default };
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @synced-from pie-lib/packages/text-select/src/token-select/token.jsx
|
|
3
|
+
* @auto-generated
|
|
4
|
+
*
|
|
5
|
+
* This file is automatically synced from pie-elements and converted to TypeScript.
|
|
6
|
+
* Manual edits will be overwritten on next sync.
|
|
7
|
+
* To make changes, edit the upstream JavaScript file and run sync again.
|
|
8
|
+
*/
|
|
9
|
+
import React from 'react';
|
|
10
|
+
import PropTypes from 'prop-types';
|
|
11
|
+
export declare const TokenTypes: {
|
|
12
|
+
text: PropTypes.Requireable<string>;
|
|
13
|
+
selectable: PropTypes.Requireable<boolean>;
|
|
14
|
+
};
|
|
15
|
+
export declare class Token extends React.Component {
|
|
16
|
+
static rootClassName: string;
|
|
17
|
+
static propTypes: {
|
|
18
|
+
text: PropTypes.Validator<string>;
|
|
19
|
+
className: PropTypes.Requireable<string>;
|
|
20
|
+
disabled: PropTypes.Requireable<boolean>;
|
|
21
|
+
highlight: PropTypes.Requireable<boolean>;
|
|
22
|
+
correct: PropTypes.Requireable<boolean>;
|
|
23
|
+
selectable: PropTypes.Requireable<boolean>;
|
|
24
|
+
};
|
|
25
|
+
static defaultProps: {
|
|
26
|
+
selectable: boolean;
|
|
27
|
+
text: string;
|
|
28
|
+
};
|
|
29
|
+
getClassAndIconConfig: any;
|
|
30
|
+
render(): JSX.Element;
|
|
31
|
+
}
|
|
32
|
+
export default Token;
|
|
33
|
+
//# sourceMappingURL=token.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"token.d.ts","sourceRoot":"","sources":["../../src/token-select/token.tsx"],"names":[],"mappings":"AACA;;;;;;;GAOG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,YAAY,CAAC;AA0HnC,eAAO,MAAM,UAAU;;;CAGtB,CAAC;AAEF,qBAAa,KAAM,SAAQ,KAAK,CAAC,SAAS;IACxC,MAAM,CAAC,aAAa,SAAoB;IAExC,MAAM,CAAC,SAAS;;;;;;;MAOd;IAEF,MAAM,CAAC,YAAY;;;MAGjB;IAEF,qBAAqB,EAAE,GAAG,CAyDxB;IAEF,MAAM;CAgBP;AAED,eAAe,KAAK,CAAC"}
|
|
@@ -0,0 +1,134 @@
|
|
|
1
|
+
import e from "react";
|
|
2
|
+
import t from "prop-types";
|
|
3
|
+
import { styled as n } from "@mui/material/styles";
|
|
4
|
+
import { color as r } from "@pie-lib/render-ui";
|
|
5
|
+
import { jsx as i, jsxs as a } from "react/jsx-runtime";
|
|
6
|
+
import o from "classnames";
|
|
7
|
+
import s from "@mui/icons-material/Check";
|
|
8
|
+
import c from "@mui/icons-material/Close";
|
|
9
|
+
//#region src/token-select/token.tsx
|
|
10
|
+
var l = 3.2, u = 3.4, d = 2, f = n("span")(({ theme: e }) => ({
|
|
11
|
+
cursor: "pointer",
|
|
12
|
+
textIndent: 0,
|
|
13
|
+
"&.disabled": {
|
|
14
|
+
cursor: "inherit",
|
|
15
|
+
color: r.disabled()
|
|
16
|
+
},
|
|
17
|
+
"&.disabledBlack": {
|
|
18
|
+
cursor: "inherit",
|
|
19
|
+
pointerEvents: "none"
|
|
20
|
+
},
|
|
21
|
+
"&.disabledAndSelected": { backgroundColor: r.blueGrey100() },
|
|
22
|
+
[`@media (min-width: ${e.breakpoints.values.md}px)`]: { "&.selectable:hover": {
|
|
23
|
+
backgroundColor: r.blueGrey300(),
|
|
24
|
+
color: e.palette.common.black,
|
|
25
|
+
"& > *": { backgroundColor: r.blueGrey300() }
|
|
26
|
+
} },
|
|
27
|
+
"&.selected": {
|
|
28
|
+
backgroundColor: r.blueGrey100(),
|
|
29
|
+
color: e.palette.common.black,
|
|
30
|
+
lineHeight: `${parseFloat(e.spacing(1)) * l}px`,
|
|
31
|
+
border: `solid 2px ${r.blueGrey900()}`,
|
|
32
|
+
borderRadius: "4px",
|
|
33
|
+
"& > *": { backgroundColor: r.blueGrey100() }
|
|
34
|
+
},
|
|
35
|
+
"&.highlight": {
|
|
36
|
+
border: `dashed 2px ${r.blueGrey600()}`,
|
|
37
|
+
borderRadius: "4px",
|
|
38
|
+
lineHeight: `${parseFloat(e.spacing(1)) * l}px`
|
|
39
|
+
},
|
|
40
|
+
"&.print": {
|
|
41
|
+
border: `dashed 2px ${r.blueGrey600()}`,
|
|
42
|
+
borderRadius: "4px",
|
|
43
|
+
lineHeight: `${parseFloat(e.spacing(1)) * l}px`,
|
|
44
|
+
color: r.text()
|
|
45
|
+
},
|
|
46
|
+
"&.custom": { display: "initial" }
|
|
47
|
+
})), p = n("span")(({ theme: e }) => ({
|
|
48
|
+
position: "relative",
|
|
49
|
+
borderRadius: "4px",
|
|
50
|
+
color: e.palette.common.black,
|
|
51
|
+
lineHeight: `${parseFloat(e.spacing(1)) * u + d}px`,
|
|
52
|
+
padding: `${d}px`
|
|
53
|
+
})), m = n(p)(() => ({ border: `${r.correctTertiary()} solid 2px` })), h = n(p)(() => ({ border: `${r.incorrectWithIcon()} solid 2px` })), g = n(p)(() => ({ border: `${r.incorrectWithIcon()} dashed 2px` })), _ = {
|
|
54
|
+
color: r.white(),
|
|
55
|
+
position: "absolute",
|
|
56
|
+
top: "-8px",
|
|
57
|
+
left: "-8px",
|
|
58
|
+
borderRadius: "50%",
|
|
59
|
+
fontSize: "12px",
|
|
60
|
+
padding: "2px",
|
|
61
|
+
display: "inline-block"
|
|
62
|
+
}, v = n(s)(() => ({
|
|
63
|
+
..._,
|
|
64
|
+
backgroundColor: r.correctTertiary()
|
|
65
|
+
})), y = n(c)(() => ({
|
|
66
|
+
..._,
|
|
67
|
+
backgroundColor: r.incorrectWithIcon()
|
|
68
|
+
})), b = ({ useWrapper: e, children: t, Container: n, Icon: r }) => e ? /* @__PURE__ */ a(n, { children: [t, r ? /* @__PURE__ */ i(r, {}) : null] }) : t;
|
|
69
|
+
b.propTypes = {
|
|
70
|
+
useWrapper: t.bool,
|
|
71
|
+
Container: t.elementType,
|
|
72
|
+
Icon: t.elementType,
|
|
73
|
+
children: t.node
|
|
74
|
+
};
|
|
75
|
+
var x = {
|
|
76
|
+
text: t.string,
|
|
77
|
+
selectable: t.bool
|
|
78
|
+
}, S = class n extends e.Component {
|
|
79
|
+
static rootClassName = "tokenRootClass";
|
|
80
|
+
static propTypes = {
|
|
81
|
+
...x,
|
|
82
|
+
text: t.string.isRequired,
|
|
83
|
+
className: t.string,
|
|
84
|
+
disabled: t.bool,
|
|
85
|
+
highlight: t.bool,
|
|
86
|
+
correct: t.bool
|
|
87
|
+
};
|
|
88
|
+
static defaultProps = {
|
|
89
|
+
selectable: !1,
|
|
90
|
+
text: ""
|
|
91
|
+
};
|
|
92
|
+
getClassAndIconConfig = () => {
|
|
93
|
+
let { selectable: e, selected: t, className: r, disabled: i, highlight: a, correct: s, animationsDisabled: c, isMissing: l } = this.props, u = "ontouchstart" in window || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0, d = n.rootClassName;
|
|
94
|
+
if (s === void 0 && t && i) return {
|
|
95
|
+
className: o(d, "selected", "disabledBlack", r),
|
|
96
|
+
Component: f
|
|
97
|
+
};
|
|
98
|
+
if (s !== void 0) {
|
|
99
|
+
let e = s === !0;
|
|
100
|
+
return {
|
|
101
|
+
className: o(d, "custom", r),
|
|
102
|
+
Component: f,
|
|
103
|
+
Container: e ? m : h,
|
|
104
|
+
Icon: e ? v : y
|
|
105
|
+
};
|
|
106
|
+
}
|
|
107
|
+
return l ? {
|
|
108
|
+
className: o(d, "custom", "missing", r),
|
|
109
|
+
Component: f,
|
|
110
|
+
Container: g,
|
|
111
|
+
Icon: y
|
|
112
|
+
} : {
|
|
113
|
+
className: o(d, i && "disabled", e && !i && !u && "selectable", t && !i && "selected", t && i && "disabledAndSelected", a && e && !i && !t && "highlight", c && "print", r),
|
|
114
|
+
Component: f,
|
|
115
|
+
Container: void 0,
|
|
116
|
+
Icon: void 0
|
|
117
|
+
};
|
|
118
|
+
};
|
|
119
|
+
render() {
|
|
120
|
+
let { text: e, index: t, correct: n, isMissing: r } = this.props, { className: a, Component: o, Container: s, Icon: c } = this.getClassAndIconConfig();
|
|
121
|
+
return /* @__PURE__ */ i(b, {
|
|
122
|
+
useWrapper: n !== void 0 || r,
|
|
123
|
+
Container: s,
|
|
124
|
+
Icon: c,
|
|
125
|
+
children: /* @__PURE__ */ i(o || f, {
|
|
126
|
+
className: a,
|
|
127
|
+
dangerouslySetInnerHTML: { __html: (e || "").replace(/\n/g, "<br>") },
|
|
128
|
+
"data-indexkey": t
|
|
129
|
+
})
|
|
130
|
+
});
|
|
131
|
+
}
|
|
132
|
+
};
|
|
133
|
+
//#endregion
|
|
134
|
+
export { x as TokenTypes, S as default };
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @synced-from pie-lib/packages/text-select/src/tokenizer/builder.js
|
|
3
|
+
* @auto-generated
|
|
4
|
+
*
|
|
5
|
+
* This file is automatically synced from pie-elements and converted to TypeScript.
|
|
6
|
+
* Manual edits will be overwritten on next sync.
|
|
7
|
+
* To make changes, edit the upstream JavaScript file and run sync again.
|
|
8
|
+
*/
|
|
9
|
+
export declare const paragraphs: (text: any) => any;
|
|
10
|
+
export declare const handleSentence: (child: any, acc: any) => any;
|
|
11
|
+
export declare const sentences: (text: any) => any;
|
|
12
|
+
export declare const words: (text: any) => any;
|
|
13
|
+
declare class Intersection {
|
|
14
|
+
constructor(results: any);
|
|
15
|
+
get hasOverlap(): boolean;
|
|
16
|
+
get surroundedTokens(): any;
|
|
17
|
+
}
|
|
18
|
+
/**
|
|
19
|
+
* get intersection info for the selection in relation to tokens.
|
|
20
|
+
* @param {{start: number, end: number}} selection
|
|
21
|
+
* @param {{start: number, end: number}[]} tokens
|
|
22
|
+
* @return {tokens: [], type: 'overlap|no-overlap|contains'}
|
|
23
|
+
*/
|
|
24
|
+
export declare const intersection: (selection: any, tokens: any) => Intersection;
|
|
25
|
+
export declare const sort: (tokens: any) => any;
|
|
26
|
+
export declare const normalize: (textToNormalize: any, tokens: any) => any;
|
|
27
|
+
export {};
|
|
28
|
+
//# sourceMappingURL=builder.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"builder.d.ts","sourceRoot":"","sources":["../../src/tokenizer/builder.ts"],"names":[],"mappings":"AACA;;;;;;;GAOG;AAqBH,eAAO,MAAM,UAAU,GAAI,SAAI,QAkB9B,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,UAAK,EAAE,QAAG,QA4CxC,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,SAAI,QAoB7B,CAAC;AACF,eAAO,MAAM,KAAK,GAAI,SAAI,QA6BzB,CAAC;AAEF,cAAM,YAAY;gBACJ,OAAO,KAAA;IAInB,IAAI,UAAU,YAEb;IAED,IAAI,gBAAgB,QAEnB;CACF;AACD;;;;;GAKG;AACH,eAAO,MAAM,YAAY,GAAI,cAAS,EAAE,WAAM,iBAgB7C,CAAC;AAEF,eAAO,MAAM,IAAI,GAAI,WAAM,QAe1B,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,oBAAe,EAAE,WAAM,QAkEhD,CAAC"}
|
|
@@ -0,0 +1,124 @@
|
|
|
1
|
+
import { clone as e, compact as t } from "lodash-es";
|
|
2
|
+
import n from "@pie-framework/parse-english";
|
|
3
|
+
//#region src/tokenizer/builder.ts
|
|
4
|
+
var r = (e, t) => t.children ? t.children.reduce(r, e) : t.value ? e + t.value : e, i = (e) => r("", e), a = (e) => r("", e), o = (e) => r("", e), s = (e) => new n().parse(e).children.reduce((e, t) => {
|
|
5
|
+
if (t.type === "ParagraphNode") {
|
|
6
|
+
let n = {
|
|
7
|
+
text: i(t),
|
|
8
|
+
start: t.position.start.offset,
|
|
9
|
+
end: t.position.end.offset
|
|
10
|
+
};
|
|
11
|
+
return e.concat([n]);
|
|
12
|
+
} else return e;
|
|
13
|
+
}, []), c = (e, t) => {
|
|
14
|
+
let n = [], r = e.children.reduce(function(e, t) {
|
|
15
|
+
if (t.type === "WhiteSpaceNode" && t.value === "\n") {
|
|
16
|
+
if (n.length) {
|
|
17
|
+
let r = n[0], i = {
|
|
18
|
+
text: n.map((e) => a(e)).join(""),
|
|
19
|
+
start: r.position.start.offset,
|
|
20
|
+
end: t.position.start.offset
|
|
21
|
+
};
|
|
22
|
+
return n.splice(0, n.length), e.concat([i]);
|
|
23
|
+
}
|
|
24
|
+
} else n.push(t);
|
|
25
|
+
return e;
|
|
26
|
+
}, t);
|
|
27
|
+
if (n.length) {
|
|
28
|
+
let e = n[0], t = n[n.length - 1], i = {
|
|
29
|
+
text: n.map((e) => a(e)).join(""),
|
|
30
|
+
start: e.position.start.offset,
|
|
31
|
+
end: t.position.end.offset
|
|
32
|
+
};
|
|
33
|
+
r = r.concat([i]), n.splice(0, n.length);
|
|
34
|
+
}
|
|
35
|
+
return r;
|
|
36
|
+
}, l = (e) => new n().parse(e).children.reduce((e, t) => t.type === "ParagraphNode" ? t.children.reduce((e, t) => t.type === "SentenceNode" && c(t, e) || e, e) : e, []), u = (e) => new n().parse(e).children.reduce((e, t) => t.type === "ParagraphNode" ? t.children.reduce((e, t) => t.type === "SentenceNode" ? t.children.reduce((e, t) => {
|
|
37
|
+
if (t.type === "WordNode") {
|
|
38
|
+
let n = {
|
|
39
|
+
text: o(t),
|
|
40
|
+
start: t.position.start.offset,
|
|
41
|
+
end: t.position.end.offset
|
|
42
|
+
};
|
|
43
|
+
return e.concat([n]);
|
|
44
|
+
} else return e;
|
|
45
|
+
}, e) : e, e) : e, []), d = class {
|
|
46
|
+
constructor(e) {
|
|
47
|
+
this.results = e;
|
|
48
|
+
}
|
|
49
|
+
get hasOverlap() {
|
|
50
|
+
return this.results.filter((e) => e.type === "overlap").length > 0;
|
|
51
|
+
}
|
|
52
|
+
get surroundedTokens() {
|
|
53
|
+
return this.results.filter((e) => e.type === "within-selection").map((e) => e.token);
|
|
54
|
+
}
|
|
55
|
+
}, f = (e, n) => {
|
|
56
|
+
let { start: r, end: i } = e, a = (e) => r >= e.start && r < e.end, o = (e) => i > e.start && i <= e.end;
|
|
57
|
+
return new d(t(n.map((e) => {
|
|
58
|
+
if (r === e.start && i === e.end) return {
|
|
59
|
+
token: e,
|
|
60
|
+
type: "exact-fit"
|
|
61
|
+
};
|
|
62
|
+
if (r <= e.start && i >= e.end) return {
|
|
63
|
+
token: e,
|
|
64
|
+
type: "within-selection"
|
|
65
|
+
};
|
|
66
|
+
if (a(e) || o(e)) return {
|
|
67
|
+
token: e,
|
|
68
|
+
type: "overlap"
|
|
69
|
+
};
|
|
70
|
+
})));
|
|
71
|
+
}, p = (t) => {
|
|
72
|
+
if (Array.isArray(t)) {
|
|
73
|
+
let n = e(t);
|
|
74
|
+
return n.sort((e, t) => {
|
|
75
|
+
let n = e.start < t.start ? -1 : e.start > t.start ? 1 : 0, r = e.end < t.end ? -1 : e.end > t.end ? 1 : 0;
|
|
76
|
+
if (n === -1 && r !== -1) throw Error(`sort does not support intersecting tokens. a: ${e.start}-${e.end}, b: ${t.start}-${t.end}`);
|
|
77
|
+
return n;
|
|
78
|
+
}), n;
|
|
79
|
+
} else return t;
|
|
80
|
+
}, m = (e, t) => {
|
|
81
|
+
let n = e || "";
|
|
82
|
+
return !Array.isArray(t) || t.length === 0 ? [{
|
|
83
|
+
text: n,
|
|
84
|
+
start: 0,
|
|
85
|
+
end: n.length
|
|
86
|
+
}] : p(t).reduce((e, t, r, i) => {
|
|
87
|
+
let a = [], o = e.lastIndex;
|
|
88
|
+
if (t.start === o ? a = [{
|
|
89
|
+
text: n.substring(o, t.end),
|
|
90
|
+
start: o,
|
|
91
|
+
end: t.end,
|
|
92
|
+
predefined: !0,
|
|
93
|
+
correct: t.correct,
|
|
94
|
+
isMissing: t.isMissing
|
|
95
|
+
}] : o < t.start && (a = [{
|
|
96
|
+
text: n.substring(o, t.start),
|
|
97
|
+
start: o,
|
|
98
|
+
end: t.start
|
|
99
|
+
}, {
|
|
100
|
+
text: n.substring(t.start, t.end),
|
|
101
|
+
start: t.start,
|
|
102
|
+
end: t.end,
|
|
103
|
+
predefined: !0,
|
|
104
|
+
correct: t.correct,
|
|
105
|
+
isMissing: t.isMissing
|
|
106
|
+
}]), r === i.length - 1 && t.end < n.length) {
|
|
107
|
+
let e = {
|
|
108
|
+
text: n.substring(t.end),
|
|
109
|
+
start: t.end,
|
|
110
|
+
end: n.length
|
|
111
|
+
};
|
|
112
|
+
a.push(e);
|
|
113
|
+
}
|
|
114
|
+
return {
|
|
115
|
+
lastIndex: a.length ? a[a.length - 1].end : o,
|
|
116
|
+
result: e.result.concat(a)
|
|
117
|
+
};
|
|
118
|
+
}, {
|
|
119
|
+
result: [],
|
|
120
|
+
lastIndex: 0
|
|
121
|
+
}).result;
|
|
122
|
+
};
|
|
123
|
+
//#endregion
|
|
124
|
+
export { f as intersection, m as normalize, s as paragraphs, l as sentences, u as words };
|