@thx/controls 16.0.0-alpha.27 → 16.0.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/esm/date/DatePicker/styles.css.js +7 -0
- package/dist/esm/date/DatePicker/styles.css.js.map +1 -0
- package/dist/esm/date/LocalDatePicker/LocalDatePicker.js +12 -60
- package/dist/esm/date/LocalDatePicker/LocalDatePicker.js.map +1 -1
- package/dist/esm/date/LocalDatePicker/MaskedDateInput.js +6 -35
- package/dist/esm/date/LocalDatePicker/MaskedDateInput.js.map +1 -1
- package/dist/esm/date/LocalMonthSelect/LocalMonthSelect.js +6 -32
- package/dist/esm/date/LocalMonthSelect/LocalMonthSelect.js.map +1 -1
- package/dist/esm/date/LocalTimePicker/LocalTimePicker.js +12 -57
- package/dist/esm/date/LocalTimePicker/LocalTimePicker.js.map +1 -1
- package/dist/esm/date/LocalTimePicker/MaskedTimeInput.js +7 -33
- package/dist/esm/date/LocalTimePicker/MaskedTimeInput.js.map +1 -1
- package/dist/esm/date/MonthDayPicker/MonthDayPicker.js +12 -57
- package/dist/esm/date/MonthDayPicker/MonthDayPicker.js.map +1 -1
- package/dist/esm/date/MonthYearPicker/MonthYearPicker.js +14 -61
- package/dist/esm/date/MonthYearPicker/MonthYearPicker.js.map +1 -1
- package/dist/esm/date/YearSelect/YearSelect.js +6 -32
- package/dist/esm/date/YearSelect/YearSelect.js.map +1 -1
- package/dist/esm/external/style-inject/dist/style-inject.es.js +29 -0
- package/dist/esm/external/style-inject/dist/style-inject.es.js.map +1 -0
- package/dist/esm/form/TForm/TForm.js +4 -4
- package/dist/esm/form/TForm/TForm.js.map +1 -1
- package/dist/esm/form/TForm/useTForm.js +5 -35
- package/dist/esm/form/TForm/useTForm.js.map +1 -1
- package/dist/esm/index.js +5 -4
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/inputs/CreditCardInput/CreditCardInput.js +3 -2
- package/dist/esm/inputs/CreditCardInput/CreditCardInput.js.map +1 -1
- package/dist/esm/inputs/CreditCardInput/CreditCardNumberInput.js +5 -35
- package/dist/esm/inputs/CreditCardInput/CreditCardNumberInput.js.map +1 -1
- package/dist/esm/inputs/CreditCardInput/styles.css.js +7 -0
- package/dist/esm/inputs/CreditCardInput/styles.css.js.map +1 -0
- package/dist/esm/inputs/MaskedInput/MaskedInput.js +5 -30
- package/dist/esm/inputs/MaskedInput/MaskedInput.js.map +1 -1
- package/dist/esm/inputs/MaskedInput/useMaskedInput.js +13 -32
- package/dist/esm/inputs/MaskedInput/useMaskedInput.js.map +1 -1
- package/dist/esm/inputs/PhoneInput/PhoneInput.js +6 -34
- package/dist/esm/inputs/PhoneInput/PhoneInput.js.map +1 -1
- package/dist/esm/inputs/RadioGroup/RadioGroup.js +6 -32
- package/dist/esm/inputs/RadioGroup/RadioGroup.js.map +1 -1
- package/dist/esm/inputs/Scriptel/Scriptel.js +1 -1
- package/dist/esm/inputs/Scriptel/Scriptel.js.map +1 -1
- package/dist/esm/inputs/Scriptel/ScriptelContext.js.map +1 -1
- package/dist/esm/inputs/Scriptel/scriptel/enums.js.map +1 -1
- package/dist/esm/inputs/Scriptel/scriptel/index.js.map +1 -1
- package/dist/esm/inputs/Scriptel/withScriptel.js +6 -17
- package/dist/esm/inputs/Scriptel/withScriptel.js.map +1 -1
- package/dist/esm/inputs/ScriptelInput/ScriptelInput.js +7 -10
- package/dist/esm/inputs/ScriptelInput/ScriptelInput.js.map +1 -1
- package/dist/esm/inputs/SinInput/SinInput.js +5 -35
- package/dist/esm/inputs/SinInput/SinInput.js.map +1 -1
- package/dist/esm/inputs/TableInput/DropdownCell.js +5 -34
- package/dist/esm/inputs/TableInput/DropdownCell.js.map +1 -1
- package/dist/esm/inputs/TableInput/HoverCell.js +4 -17
- package/dist/esm/inputs/TableInput/HoverCell.js.map +1 -1
- package/dist/esm/inputs/TableInput/MoneyCell.js +2 -1
- package/dist/esm/inputs/TableInput/MoneyCell.js.map +1 -1
- package/dist/esm/inputs/TableInput/MoneyEditCell.js +3 -3
- package/dist/esm/inputs/TableInput/MoneyEditCell.js.map +1 -1
- package/dist/esm/inputs/TableInput/MoneySumFooter.js +1 -0
- package/dist/esm/inputs/TableInput/MoneySumFooter.js.map +1 -1
- package/dist/esm/inputs/TableInput/StringEditCell.js +5 -24
- package/dist/esm/inputs/TableInput/StringEditCell.js.map +1 -1
- package/dist/esm/inputs/TableInput/TableInput.js +24 -27
- package/dist/esm/inputs/TableInput/TableInput.js.map +1 -1
- package/dist/esm/inputs/TableInput/addRowOnTab.js.map +1 -1
- package/dist/esm/money/MoneyCurrencyInput/MoneyCurrencyInput.js +7 -37
- package/dist/esm/money/MoneyCurrencyInput/MoneyCurrencyInput.js.map +1 -1
- package/dist/esm/money/MoneyInput/MoneyInput.js +5 -31
- package/dist/esm/money/MoneyInput/MoneyInput.js.map +1 -1
- package/dist/esm/money/useMoneyInput.js +7 -10
- package/dist/esm/money/useMoneyInput.js.map +1 -1
- package/dist/esm/step/FormStep.js +1 -1
- package/dist/esm/step/FormStep.js.map +1 -1
- package/dist/esm/step/Step.js +1 -0
- package/dist/esm/step/Step.js.map +1 -1
- package/dist/esm/step/StepProvider.js +17 -37
- package/dist/esm/step/StepProvider.js.map +1 -1
- package/dist/esm/step/stepContext.js.map +1 -1
- package/dist/esm/step/useStep.js.map +1 -1
- package/dist/stats.html +2689 -0
- package/dist/stats.txt +94 -0
- package/dist/types/date/LocalDatePicker/LocalDatePicker.d.ts +1 -0
- package/dist/types/inputs/MaskedInput/useMaskedInput.d.ts +1 -1
- package/dist/types/inputs/Scriptel/withScriptel.d.ts +0 -1
- package/dist/types/inputs/TableInput/DropdownCell.d.ts +0 -1
- package/dist/types/inputs/TableInput/HoverCell.d.ts +0 -1
- package/dist/types/inputs/TableInput/MoneyCell.d.ts +0 -1
- package/dist/types/inputs/TableInput/MoneyEditCell.d.ts +0 -1
- package/dist/types/inputs/TableInput/MoneySumFooter.d.ts +0 -1
- package/dist/types/inputs/TableInput/StringEditCell.d.ts +0 -1
- package/package.json +9 -17
|
@@ -1,41 +1,10 @@
|
|
|
1
|
+
import React, { useState, useCallback, useMemo } from 'react';
|
|
1
2
|
import creditCardType from 'credit-card-type';
|
|
2
3
|
import debug from 'debug';
|
|
3
4
|
import { validate } from 'luhn';
|
|
4
|
-
import { useState, useCallback, useMemo } from 'react';
|
|
5
5
|
import { Input, Icon } from 'semantic-ui-react';
|
|
6
6
|
import { useMaskedInput } from '../MaskedInput/useMaskedInput.js';
|
|
7
7
|
|
|
8
|
-
var __defProp = Object.defineProperty;
|
|
9
|
-
var __defProps = Object.defineProperties;
|
|
10
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
11
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
12
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
13
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
14
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
15
|
-
var __spreadValues = (a, b) => {
|
|
16
|
-
for (var prop in b || (b = {}))
|
|
17
|
-
if (__hasOwnProp.call(b, prop))
|
|
18
|
-
__defNormalProp(a, prop, b[prop]);
|
|
19
|
-
if (__getOwnPropSymbols)
|
|
20
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
21
|
-
if (__propIsEnum.call(b, prop))
|
|
22
|
-
__defNormalProp(a, prop, b[prop]);
|
|
23
|
-
}
|
|
24
|
-
return a;
|
|
25
|
-
};
|
|
26
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
27
|
-
var __objRest = (source, exclude) => {
|
|
28
|
-
var target = {};
|
|
29
|
-
for (var prop in source)
|
|
30
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
31
|
-
target[prop] = source[prop];
|
|
32
|
-
if (source != null && __getOwnPropSymbols)
|
|
33
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
34
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
35
|
-
target[prop] = source[prop];
|
|
36
|
-
}
|
|
37
|
-
return target;
|
|
38
|
-
};
|
|
39
8
|
const d = debug("thx.controls.inputs.CreditCardInput.CreditCardNumberInput");
|
|
40
9
|
function getIcon(type) {
|
|
41
10
|
switch (type) {
|
|
@@ -54,7 +23,7 @@ function getIcon(type) {
|
|
|
54
23
|
}
|
|
55
24
|
}
|
|
56
25
|
function CreditCardNumberInput(props) {
|
|
57
|
-
const
|
|
26
|
+
const { value, onChange, ...rest } = props;
|
|
58
27
|
const [icon, setIcon] = useState("credit card");
|
|
59
28
|
const [color, setColor] = useState("black");
|
|
60
29
|
const checkValidation = useCallback((valueArray) => {
|
|
@@ -91,9 +60,10 @@ function CreditCardNumberInput(props) {
|
|
|
91
60
|
onChange && onChange(v);
|
|
92
61
|
}
|
|
93
62
|
});
|
|
94
|
-
return /* @__PURE__ */ React.createElement(Input,
|
|
63
|
+
return /* @__PURE__ */ React.createElement(Input, {
|
|
64
|
+
...rest,
|
|
95
65
|
icon: true
|
|
96
|
-
}
|
|
66
|
+
}, /* @__PURE__ */ React.createElement("input", {
|
|
97
67
|
ref: cardNumberRef
|
|
98
68
|
}), /* @__PURE__ */ React.createElement(Icon, {
|
|
99
69
|
name: icon,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CreditCardNumberInput.js","sources":["../../../../src/inputs/CreditCardInput/CreditCardNumberInput.tsx"],"sourcesContent":["import creditCardType from 'credit-card-type';\nimport debug from 'debug';\nimport {validate} from 'luhn';\nimport {useCallback, useMemo, useState} from 'react';\nimport {Icon, Input, InputProps, SemanticICONS, SemanticCOLORS} from 'semantic-ui-react';\nimport type {MaskedInputProps} from '../MaskedInput';\nimport {useMaskedInput} from '../MaskedInput/useMaskedInput';\n\nconst d = debug('thx.controls.inputs.CreditCardInput.CreditCardNumberInput');\n\ninterface CreditCardNumberInputProps {\n\tonChange?: (value: string | undefined) => void;\n\tvalue?: string;\n}\n\nfunction getIcon(type: string): SemanticICONS {\n\tswitch (type) {\n\t\tcase 'visa':\n\t\t\treturn 'cc visa';\n\t\tcase 'mastercard':\n\t\t\treturn 'cc mastercard';\n\t\tcase 'american-express':\n\t\t\treturn 'cc amex';\n\t\tcase 'diners-club':\n\t\t\treturn 'cc diners club';\n\t\tcase 'jcb':\n\t\t\treturn 'cc jcb';\n\t\tdefault:\n\t\t\treturn 'credit card';\n\t}\n}\n\nexport function CreditCardNumberInput(props: CreditCardNumberInputProps & Omit<InputProps, 'onChange'>) {\n\tconst {value, onChange, ...rest} = props;\n\tconst [icon, setIcon] = useState<SemanticICONS>('credit card');\n\tconst [color, setColor] = useState<SemanticCOLORS>('black');\n\n\tconst checkValidation = useCallback((valueArray: string[]) => {\n\t\tconst num = valueArray.join('').replaceAll(/(_|\\s)/g, '');\n\t\tconst typ = creditCardType(num);\n\t\tconst isValid = validate(num);\n\n\t\tif (typ.length === 1) {\n\t\t\tsetIcon(getIcon(typ[0].type));\n\t\t} else {\n\t\t\tsetIcon('credit card');\n\t\t}\n\n\t\tif (num.length > 0) {\n\t\t\tif (isValid) {\n\t\t\t\tsetColor('green');\n\t\t\t} else {\n\t\t\t\tsetColor('red');\n\t\t\t}\n\t\t} else {\n\t\t\tsetColor('black');\n\t\t}\n\n\t\treturn isValid;\n\t}, []);\n\n\tconst creditCardMask: MaskedInputProps['mask'] = useMemo(\n\t\t() => ({\n\t\t\tmask: '9999 9999 9999 9999',\n\t\t\tisComplete: checkValidation,\n\t\t\tautoUnmask: true,\n\t\t}),\n\t\t[checkValidation],\n\t);\n\n\tconst cardNumberRef = useMaskedInput({\n\t\tmask: creditCardMask,\n\t\tvalue,\n\t\tonChange: v => {\n\t\t\tconst typ = creditCardType(v || '');\n\t\t\td(v, typ);\n\t\t\t// checkValidation([v || '']);\n\t\t\tonChange && onChange(v);\n\t\t},\n\t});\n\n\treturn (\n\t\t<Input {...rest} icon>\n\t\t\t<input ref={cardNumberRef} />\n\t\t\t<Icon name={icon} color={color} size=\"large\" />\n\t\t</Input>\n\t);\n}\n"],"names":[],"mappings":";;;;;;;
|
|
1
|
+
{"version":3,"file":"CreditCardNumberInput.js","sources":["../../../../src/inputs/CreditCardInput/CreditCardNumberInput.tsx"],"sourcesContent":["import creditCardType from 'credit-card-type';\nimport debug from 'debug';\nimport {validate} from 'luhn';\nimport {useCallback, useMemo, useState} from 'react';\nimport {Icon, Input, InputProps, SemanticICONS, SemanticCOLORS} from 'semantic-ui-react';\nimport type {MaskedInputProps} from '../MaskedInput';\nimport {useMaskedInput} from '../MaskedInput/useMaskedInput';\n\nconst d = debug('thx.controls.inputs.CreditCardInput.CreditCardNumberInput');\n\ninterface CreditCardNumberInputProps {\n\tonChange?: (value: string | undefined) => void;\n\tvalue?: string;\n}\n\nfunction getIcon(type: string): SemanticICONS {\n\tswitch (type) {\n\t\tcase 'visa':\n\t\t\treturn 'cc visa';\n\t\tcase 'mastercard':\n\t\t\treturn 'cc mastercard';\n\t\tcase 'american-express':\n\t\t\treturn 'cc amex';\n\t\tcase 'diners-club':\n\t\t\treturn 'cc diners club';\n\t\tcase 'jcb':\n\t\t\treturn 'cc jcb';\n\t\tdefault:\n\t\t\treturn 'credit card';\n\t}\n}\n\nexport function CreditCardNumberInput(props: CreditCardNumberInputProps & Omit<InputProps, 'onChange'>) {\n\tconst {value, onChange, ...rest} = props;\n\tconst [icon, setIcon] = useState<SemanticICONS>('credit card');\n\tconst [color, setColor] = useState<SemanticCOLORS>('black');\n\n\tconst checkValidation = useCallback((valueArray: string[]) => {\n\t\tconst num = valueArray.join('').replaceAll(/(_|\\s)/g, '');\n\t\tconst typ = creditCardType(num);\n\t\tconst isValid = validate(num);\n\n\t\tif (typ.length === 1) {\n\t\t\tsetIcon(getIcon(typ[0].type));\n\t\t} else {\n\t\t\tsetIcon('credit card');\n\t\t}\n\n\t\tif (num.length > 0) {\n\t\t\tif (isValid) {\n\t\t\t\tsetColor('green');\n\t\t\t} else {\n\t\t\t\tsetColor('red');\n\t\t\t}\n\t\t} else {\n\t\t\tsetColor('black');\n\t\t}\n\n\t\treturn isValid;\n\t}, []);\n\n\tconst creditCardMask: MaskedInputProps['mask'] = useMemo(\n\t\t() => ({\n\t\t\tmask: '9999 9999 9999 9999',\n\t\t\tisComplete: checkValidation,\n\t\t\tautoUnmask: true,\n\t\t}),\n\t\t[checkValidation],\n\t);\n\n\tconst cardNumberRef = useMaskedInput({\n\t\tmask: creditCardMask,\n\t\tvalue,\n\t\tonChange: v => {\n\t\t\tconst typ = creditCardType(v || '');\n\t\t\td(v, typ);\n\t\t\t// checkValidation([v || '']);\n\t\t\tonChange && onChange(v);\n\t\t},\n\t});\n\n\treturn (\n\t\t<Input {...rest} icon>\n\t\t\t<input ref={cardNumberRef} />\n\t\t\t<Icon name={icon} color={color} size=\"large\" />\n\t\t</Input>\n\t);\n}\n"],"names":[],"mappings":";;;;;;;AAQA,MAAM,CAAA,GAAI,MAAM,2DAA2D,CAAA,CAAA;AAO3E,SAAA,OAAA,CAAiB,IAA6B,EAAA;AAC7C,EAAQ,QAAA,IAAA;AAAA,IACF,KAAA,MAAA;AACJ,MAAO,OAAA,SAAA,CAAA;AAAA,IACH,KAAA,YAAA;AACJ,MAAO,OAAA,eAAA,CAAA;AAAA,IACH,KAAA,kBAAA;AACJ,MAAO,OAAA,SAAA,CAAA;AAAA,IACH,KAAA,aAAA;AACJ,MAAO,OAAA,gBAAA,CAAA;AAAA,IACH,KAAA,KAAA;AACJ,MAAO,OAAA,QAAA,CAAA;AAAA,IAAA;AAEP,MAAO,OAAA,aAAA,CAAA;AAAA,GAAA;AAEV,CAAA;AAEO,SAAA,qBAAA,CAA+B,KAAkE,EAAA;AACvG,EAAM,MAAA,EAAC,KAAO,EAAA,QAAA,EAAA,GAAa,IAAQ,EAAA,GAAA,KAAA,CAAA;AACnC,EAAA,MAAM,CAAC,IAAA,EAAM,OAAW,CAAA,GAAA,QAAA,CAAwB,aAAa,CAAA,CAAA;AAC7D,EAAA,MAAM,CAAC,KAAA,EAAO,QAAY,CAAA,GAAA,QAAA,CAAyB,OAAO,CAAA,CAAA;AAE1D,EAAM,MAAA,eAAA,GAAkB,WAAY,CAAA,CAAC,UAAyB,KAAA;AAC7D,IAAA,MAAM,MAAM,UAAW,CAAA,IAAA,CAAK,EAAE,CAAE,CAAA,UAAA,CAAW,WAAW,EAAE,CAAA,CAAA;AACxD,IAAM,MAAA,GAAA,GAAM,eAAe,GAAG,CAAA,CAAA;AAC9B,IAAM,MAAA,OAAA,GAAU,SAAS,GAAG,CAAA,CAAA;AAE5B,IAAI,IAAA,GAAA,CAAI,WAAW,CAAG,EAAA;AACrB,MAAA,OAAA,CAAQ,OAAQ,CAAA,GAAA,CAAI,CAAG,CAAA,CAAA,IAAI,CAAC,CAAA,CAAA;AAAA,KACtB,MAAA;AACN,MAAA,OAAA,CAAQ,aAAa,CAAA,CAAA;AAAA,KACtB;AAEA,IAAI,IAAA,GAAA,CAAI,SAAS,CAAG,EAAA;AACnB,MAAA,IAAI,OAAS,EAAA;AACZ,QAAA,QAAA,CAAS,OAAO,CAAA,CAAA;AAAA,OACV,MAAA;AACN,QAAA,QAAA,CAAS,KAAK,CAAA,CAAA;AAAA,OACf;AAAA,KACM,MAAA;AACN,MAAA,QAAA,CAAS,OAAO,CAAA,CAAA;AAAA,KACjB;AAEA,IAAO,OAAA,OAAA,CAAA;AAAA,GACR,EAAG,EAAE,CAAA,CAAA;AAEL,EAAM,MAAA,cAAA,GAA2C,QAChD,OAAO;AAAA,IACN,IAAM,EAAA,qBAAA;AAAA,IACN,UAAY,EAAA,eAAA;AAAA,IACZ,UAAY,EAAA,IAAA;AAAA,GACb,CAAA,EACA,CAAC,eAAe,CACjB,CAAA,CAAA;AAEA,EAAA,MAAM,gBAAgB,cAAe,CAAA;AAAA,IACpC,IAAM,EAAA,cAAA;AAAA,IACN,KAAA;AAAA,IACA,UAAU,CAAK,CAAA,KAAA;AACd,MAAM,MAAA,GAAA,GAAM,cAAe,CAAA,CAAA,IAAK,EAAE,CAAA,CAAA;AAClC,MAAA,CAAA,CAAE,GAAG,GAAG,CAAA,CAAA;AAER,MAAA,QAAA,IAAY,SAAS,CAAC,CAAA,CAAA;AAAA,KACvB;AAAA,GACA,CAAA,CAAA;AAED,EAAA,uBACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAU,GAAA,IAAA;AAAA,IAAM,IAAI,EAAA,IAAA;AAAA,GAAA,kBACnB,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA;AAAA,IAAM,GAAK,EAAA,aAAA;AAAA,GAAe,mBAC1B,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAA,IAAK,IAAM,EAAA,IAAA;AAAA,IAAM,KAAA;AAAA,IAAc,IAAK,EAAA,OAAA;AAAA,GAAQ,CAC9C,CAAA,CAAA;AAEF;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,wBAAwB,uDAAyD;AACjF;AACA;AACA;AACA;AACA;"}
|
|
@@ -1,40 +1,15 @@
|
|
|
1
|
+
import React from 'react';
|
|
1
2
|
import debug from 'debug';
|
|
2
3
|
import { Input } from 'semantic-ui-react';
|
|
3
4
|
import { useMaskedInput } from './useMaskedInput.js';
|
|
4
5
|
|
|
5
|
-
var __defProp = Object.defineProperty;
|
|
6
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
7
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
9
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
10
|
-
var __spreadValues = (a, b) => {
|
|
11
|
-
for (var prop in b || (b = {}))
|
|
12
|
-
if (__hasOwnProp.call(b, prop))
|
|
13
|
-
__defNormalProp(a, prop, b[prop]);
|
|
14
|
-
if (__getOwnPropSymbols)
|
|
15
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
16
|
-
if (__propIsEnum.call(b, prop))
|
|
17
|
-
__defNormalProp(a, prop, b[prop]);
|
|
18
|
-
}
|
|
19
|
-
return a;
|
|
20
|
-
};
|
|
21
|
-
var __objRest = (source, exclude) => {
|
|
22
|
-
var target = {};
|
|
23
|
-
for (var prop in source)
|
|
24
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
25
|
-
target[prop] = source[prop];
|
|
26
|
-
if (source != null && __getOwnPropSymbols)
|
|
27
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
28
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
29
|
-
target[prop] = source[prop];
|
|
30
|
-
}
|
|
31
|
-
return target;
|
|
32
|
-
};
|
|
33
6
|
debug("thx.controls.inputs.MaskedInput");
|
|
34
7
|
function MaskedInput(props) {
|
|
35
|
-
const
|
|
8
|
+
const { name, onBlur, disabled, onChange, mask, value, ...rest } = props;
|
|
36
9
|
const inputRef = useMaskedInput({ mask, value, onChange });
|
|
37
|
-
return /* @__PURE__ */ React.createElement(Input,
|
|
10
|
+
return /* @__PURE__ */ React.createElement(Input, {
|
|
11
|
+
...rest
|
|
12
|
+
}, /* @__PURE__ */ React.createElement("input", {
|
|
38
13
|
disabled,
|
|
39
14
|
name,
|
|
40
15
|
ref: inputRef,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MaskedInput.js","sources":["../../../../src/inputs/MaskedInput/MaskedInput.tsx"],"sourcesContent":["import debug from 'debug';\nimport {Input, InputProps} from 'semantic-ui-react';\nimport {useMaskedInput, UseMaskedInputProps} from './useMaskedInput';\n\nconst d = debug('thx.controls.inputs.MaskedInput');\n\nexport type MaskedInputProps = {\n\tname?: string;\n\tonBlur?: (event: any) => void;\n} & UseMaskedInputProps &\n\tOmit<InputProps, 'onChange'>;\n\nexport function MaskedInput(props: MaskedInputProps) {\n\tconst {name, onBlur, disabled, onChange, mask, value, ...rest} = props;\n\n\tconst inputRef = useMaskedInput({mask, value, onChange});\n\n\treturn (\n\t\t<Input {...rest}>\n\t\t\t<input disabled={disabled} name={name} ref={inputRef} onBlur={onBlur} />\n\t\t</Input>\n\t);\n}\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"MaskedInput.js","sources":["../../../../src/inputs/MaskedInput/MaskedInput.tsx"],"sourcesContent":["import debug from 'debug';\nimport {Input, InputProps} from 'semantic-ui-react';\nimport {useMaskedInput, UseMaskedInputProps} from './useMaskedInput';\n\nconst d = debug('thx.controls.inputs.MaskedInput');\n\nexport type MaskedInputProps = {\n\tname?: string;\n\tonBlur?: (event: any) => void;\n} & UseMaskedInputProps &\n\tOmit<InputProps, 'onChange'>;\n\nexport function MaskedInput(props: MaskedInputProps) {\n\tconst {name, onBlur, disabled, onChange, mask, value, ...rest} = props;\n\n\tconst inputRef = useMaskedInput({mask, value, onChange});\n\n\treturn (\n\t\t<Input {...rest}>\n\t\t\t<input disabled={disabled} name={name} ref={inputRef} onBlur={onBlur} />\n\t\t</Input>\n\t);\n}\n"],"names":[],"mappings":";;;;;AAIU,MAAM,iCAAiC,EAAA;AAQ1C,SAAA,WAAA,CAAqB,KAAyB,EAAA;AACpD,EAAA,MAAM,EAAC,IAAM,EAAA,MAAA,EAAQ,UAAU,QAAU,EAAA,IAAA,EAAM,UAAU,IAAQ,EAAA,GAAA,KAAA,CAAA;AAEjE,EAAA,MAAM,WAAW,cAAe,CAAA,EAAC,IAAM,EAAA,KAAA,EAAO,UAAS,CAAA,CAAA;AAEvD,EAAA,uBACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAU,GAAA,IAAA;AAAA,GAAA,kBACT,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA;AAAA,IAAM,QAAA;AAAA,IAAoB,IAAA;AAAA,IAAY,GAAK,EAAA,QAAA;AAAA,IAAU,MAAA;AAAA,GAAgB,CACvE,CAAA,CAAA;AAEF;;;;"}
|
|
@@ -1,27 +1,9 @@
|
|
|
1
1
|
import debug from 'debug';
|
|
2
|
-
import
|
|
2
|
+
import InputmaskImport from 'inputmask';
|
|
3
3
|
import { useRef, useEffect } from 'react';
|
|
4
4
|
import useDeepCompareEffect from 'use-deep-compare-effect';
|
|
5
5
|
|
|
6
|
-
|
|
7
|
-
var __defProps = Object.defineProperties;
|
|
8
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
9
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
10
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
11
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
12
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
13
|
-
var __spreadValues = (a, b) => {
|
|
14
|
-
for (var prop in b || (b = {}))
|
|
15
|
-
if (__hasOwnProp.call(b, prop))
|
|
16
|
-
__defNormalProp(a, prop, b[prop]);
|
|
17
|
-
if (__getOwnPropSymbols)
|
|
18
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
19
|
-
if (__propIsEnum.call(b, prop))
|
|
20
|
-
__defNormalProp(a, prop, b[prop]);
|
|
21
|
-
}
|
|
22
|
-
return a;
|
|
23
|
-
};
|
|
24
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
6
|
+
const { default: Inputmask } = InputmaskImport;
|
|
25
7
|
const d = debug("thx.controls.inputs.MaskedInput.useMaskedInput");
|
|
26
8
|
function useMaskedInput(props) {
|
|
27
9
|
const { value, onChange, onSet, mask } = props;
|
|
@@ -31,29 +13,29 @@ function useMaskedInput(props) {
|
|
|
31
13
|
if (!inputElement.current)
|
|
32
14
|
throw new Error("Could not get input element");
|
|
33
15
|
d("Creating input mask instance");
|
|
34
|
-
|
|
16
|
+
d(Inputmask);
|
|
17
|
+
maskInstance.current = new Inputmask({
|
|
18
|
+
...mask,
|
|
35
19
|
oncomplete() {
|
|
36
|
-
var _a;
|
|
37
20
|
if (onChange)
|
|
38
|
-
onChange(
|
|
39
|
-
if (mask
|
|
21
|
+
onChange(inputElement.current?.value);
|
|
22
|
+
if (mask?.oncomplete)
|
|
40
23
|
mask.oncomplete();
|
|
41
24
|
},
|
|
42
25
|
oncleared() {
|
|
43
26
|
if (onChange)
|
|
44
27
|
onChange();
|
|
45
|
-
if (mask
|
|
28
|
+
if (mask?.oncleared)
|
|
46
29
|
mask.oncleared();
|
|
47
30
|
},
|
|
48
31
|
onincomplete() {
|
|
49
|
-
var _a;
|
|
50
32
|
if (onChange)
|
|
51
|
-
onChange(
|
|
52
|
-
if (mask
|
|
33
|
+
onChange(inputElement.current?.value);
|
|
34
|
+
if (mask?.onincomplete)
|
|
53
35
|
mask.onincomplete();
|
|
54
36
|
}
|
|
55
|
-
})
|
|
56
|
-
maskInstance.current
|
|
37
|
+
});
|
|
38
|
+
maskInstance.current?.mask(inputElement.current);
|
|
57
39
|
return () => {
|
|
58
40
|
if (maskInstance.current) {
|
|
59
41
|
d("Cleaning up input mask instance");
|
|
@@ -63,8 +45,7 @@ function useMaskedInput(props) {
|
|
|
63
45
|
};
|
|
64
46
|
}, [mask]);
|
|
65
47
|
useEffect(() => {
|
|
66
|
-
|
|
67
|
-
if (inputElement.current && ((_a = inputElement.current) == null ? void 0 : _a.value) !== value && value !== void 0) {
|
|
48
|
+
if (inputElement.current && inputElement.current?.value !== value && value !== void 0) {
|
|
68
49
|
d("Value is changing:", value);
|
|
69
50
|
inputElement.current.value = value;
|
|
70
51
|
onSet && onSet(value);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useMaskedInput.js","sources":["../../../../src/inputs/MaskedInput/useMaskedInput.ts"],"sourcesContent":["import debug from 'debug';\nimport
|
|
1
|
+
{"version":3,"file":"useMaskedInput.js","sources":["../../../../src/inputs/MaskedInput/useMaskedInput.ts"],"sourcesContent":["import debug from 'debug';\nimport InputmaskImport from 'inputmask';\nimport type InputmaskType from 'inputmask';\nimport {useEffect, useRef} from 'react';\nimport useDeepCompareEffect from 'use-deep-compare-effect';\n\n// @ts-ignore\nconst {default: Inputmask} = InputmaskImport;\n\nconst d = debug('thx.controls.inputs.MaskedInput.useMaskedInput');\n\nexport interface UseMaskedInputProps {\n\tvalue?: string;\n\tonChange?: (value?: string) => void;\n\tmask?: Inputmask.Options;\n\tonSet?: (value?: string) => void;\n}\n\nexport function useMaskedInput(props: UseMaskedInputProps) {\n\tconst {value, onChange, onSet, mask} = props;\n\n\tconst inputElement = useRef<HTMLInputElement | null>(null);\n\tconst maskInstance = useRef<InputmaskType.Instance | null>(null);\n\n\tuseDeepCompareEffect(() => {\n\t\tif (!inputElement.current) throw new Error('Could not get input element');\n\n\t\td('Creating input mask instance');\n\t\td(Inputmask);\n\t\tmaskInstance.current = new Inputmask({\n\t\t\t...mask,\n\t\t\toncomplete() {\n\t\t\t\tif (onChange) onChange(inputElement.current?.value);\n\t\t\t\tif (mask?.oncomplete) mask.oncomplete();\n\t\t\t},\n\t\t\toncleared() {\n\t\t\t\tif (onChange) onChange();\n\t\t\t\tif (mask?.oncleared) mask.oncleared();\n\t\t\t},\n\t\t\tonincomplete() {\n\t\t\t\tif (onChange) onChange(inputElement.current?.value);\n\t\t\t\tif (mask?.onincomplete) mask.onincomplete();\n\t\t\t},\n\t\t});\n\t\tmaskInstance.current?.mask(inputElement.current);\n\n\t\treturn () => {\n\t\t\tif (maskInstance.current) {\n\t\t\t\td('Cleaning up input mask instance');\n\t\t\t\tmaskInstance.current.remove();\n\t\t\t\tmaskInstance.current = null;\n\t\t\t}\n\t\t};\n\t}, [mask]);\n\n\t// If we change the value prop we need to sync the DOM value to display the new value\n\tuseEffect(() => {\n\t\tif (inputElement.current && inputElement.current?.value !== value && value !== undefined) {\n\t\t\td('Value is changing:', value);\n\t\t\tinputElement.current.value = value;\n\t\t\tonSet && onSet(value);\n\t\t}\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [value]);\n\n\treturn inputElement;\n}\n"],"names":[],"mappings":";;;;;AAOA,MAAM,EAAC,SAAS,SAAa,EAAA,GAAA,eAAA,CAAA;AAE7B,MAAM,CAAA,GAAI,MAAM,gDAAgD,CAAA,CAAA;AASzD,SAAA,cAAA,CAAwB,KAA4B,EAAA;AAC1D,EAAA,MAAM,EAAC,KAAA,EAAO,QAAU,EAAA,KAAA,EAAO,IAAQ,EAAA,GAAA,KAAA,CAAA;AAEvC,EAAM,MAAA,YAAA,GAAe,OAAgC,IAAI,CAAA,CAAA;AACzD,EAAM,MAAA,YAAA,GAAe,OAAsC,IAAI,CAAA,CAAA;AAE/D,EAAA,oBAAA,CAAqB,MAAM;AAC1B,IAAA,IAAI,CAAC,YAAa,CAAA,OAAA;AAAS,MAAM,MAAA,IAAI,MAAM,6BAA6B,CAAA,CAAA;AAExE,IAAA,CAAA,CAAE,8BAA8B,CAAA,CAAA;AAChC,IAAA,CAAA,CAAE,SAAS,CAAA,CAAA;AACX,IAAa,YAAA,CAAA,OAAA,GAAU,IAAI,SAAU,CAAA;AAAA,MACjC,GAAA,IAAA;AAAA,MACH,UAAa,GAAA;AACZ,QAAI,IAAA,QAAA;AAAU,UAAS,QAAA,CAAA,YAAA,CAAa,SAAS,KAAK,CAAA,CAAA;AAClD,QAAA,IAAI,IAAM,EAAA,UAAA;AAAY,UAAA,IAAA,CAAK,UAAW,EAAA,CAAA;AAAA,OACvC;AAAA,MACA,SAAY,GAAA;AACX,QAAI,IAAA,QAAA;AAAU,UAAS,QAAA,EAAA,CAAA;AACvB,QAAA,IAAI,IAAM,EAAA,SAAA;AAAW,UAAA,IAAA,CAAK,SAAU,EAAA,CAAA;AAAA,OACrC;AAAA,MACA,YAAe,GAAA;AACd,QAAI,IAAA,QAAA;AAAU,UAAS,QAAA,CAAA,YAAA,CAAa,SAAS,KAAK,CAAA,CAAA;AAClD,QAAA,IAAI,IAAM,EAAA,YAAA;AAAc,UAAA,IAAA,CAAK,YAAa,EAAA,CAAA;AAAA,OAC3C;AAAA,KACA,CAAA,CAAA;AACD,IAAa,YAAA,CAAA,OAAA,EAAS,IAAK,CAAA,YAAA,CAAa,OAAO,CAAA,CAAA;AAE/C,IAAA,OAAO,MAAM;AACZ,MAAA,IAAI,aAAa,OAAS,EAAA;AACzB,QAAA,CAAA,CAAE,iCAAiC,CAAA,CAAA;AACnC,QAAA,YAAA,CAAa,QAAQ,MAAO,EAAA,CAAA;AAC5B,QAAA,YAAA,CAAa,OAAU,GAAA,IAAA,CAAA;AAAA,OACxB;AAAA,KACD,CAAA;AAAA,GACD,EAAG,CAAC,IAAI,CAAC,CAAA,CAAA;AAGT,EAAA,SAAA,CAAU,MAAM;AACf,IAAA,IAAI,aAAa,OAAW,IAAA,YAAA,CAAa,SAAS,KAAU,KAAA,KAAA,IAAS,UAAU,KAAW,CAAA,EAAA;AACzF,MAAA,CAAA,CAAE,sBAAsB,KAAK,CAAA,CAAA;AAC7B,MAAA,YAAA,CAAa,QAAQ,KAAQ,GAAA,KAAA,CAAA;AAC7B,MAAA,KAAA,IAAS,MAAM,KAAK,CAAA,CAAA;AAAA,KACrB;AAAA,GAED,EAAG,CAAC,KAAK,CAAC,CAAA,CAAA;AAEV,EAAO,OAAA,YAAA,CAAA;AACR;;;;"}
|
|
@@ -1,48 +1,20 @@
|
|
|
1
|
+
import React from 'react';
|
|
1
2
|
import debug from 'debug';
|
|
2
3
|
import { MaskedInput } from '../MaskedInput/MaskedInput.js';
|
|
4
|
+
import '../MaskedInput/useMaskedInput.js';
|
|
3
5
|
|
|
4
|
-
var __defProp = Object.defineProperty;
|
|
5
|
-
var __defProps = Object.defineProperties;
|
|
6
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
7
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
8
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
9
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
10
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
11
|
-
var __spreadValues = (a, b) => {
|
|
12
|
-
for (var prop in b || (b = {}))
|
|
13
|
-
if (__hasOwnProp.call(b, prop))
|
|
14
|
-
__defNormalProp(a, prop, b[prop]);
|
|
15
|
-
if (__getOwnPropSymbols)
|
|
16
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
17
|
-
if (__propIsEnum.call(b, prop))
|
|
18
|
-
__defNormalProp(a, prop, b[prop]);
|
|
19
|
-
}
|
|
20
|
-
return a;
|
|
21
|
-
};
|
|
22
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
23
|
-
var __objRest = (source, exclude) => {
|
|
24
|
-
var target = {};
|
|
25
|
-
for (var prop in source)
|
|
26
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
27
|
-
target[prop] = source[prop];
|
|
28
|
-
if (source != null && __getOwnPropSymbols)
|
|
29
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
30
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
31
|
-
target[prop] = source[prop];
|
|
32
|
-
}
|
|
33
|
-
return target;
|
|
34
|
-
};
|
|
35
6
|
debug("thx.controls.inputs.PhoneInput");
|
|
36
7
|
function PhoneInput(props) {
|
|
37
|
-
const
|
|
8
|
+
const { extension, ...rest } = props;
|
|
38
9
|
const mask = {
|
|
39
10
|
mask: extension ? "((999) 999-9999[ x9999])|(+9 (999) 999-9999[ x9999])" : "((999) 999-9999)|( +9 (999) 999-9999)",
|
|
40
11
|
greedy: false,
|
|
41
12
|
autoUnmask: true
|
|
42
13
|
};
|
|
43
|
-
return /* @__PURE__ */ React.createElement(MaskedInput,
|
|
14
|
+
return /* @__PURE__ */ React.createElement(MaskedInput, {
|
|
15
|
+
...rest,
|
|
44
16
|
mask
|
|
45
|
-
})
|
|
17
|
+
});
|
|
46
18
|
}
|
|
47
19
|
|
|
48
20
|
export { PhoneInput };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PhoneInput.js","sources":["../../../../src/inputs/PhoneInput/PhoneInput.tsx"],"sourcesContent":["import debug from 'debug';\nimport {MaskedInput, MaskedInputProps} from '../MaskedInput';\n\nconst d = debug('thx.controls.inputs.PhoneInput');\n\nexport interface PhoneInputProps {\n\textension?: boolean;\n\tonChange?: (value?: string) => void;\n}\n\nexport function PhoneInput(props: PhoneInputProps & Omit<MaskedInputProps, 'mask' | 'onChange'>) {\n\tconst {extension, ...rest} = props;\n\tconst mask = {\n\t\tmask: extension ? '((999) 999-9999[ x9999])|(+9 (999) 999-9999[ x9999])' : '((999) 999-9999)|( +9 (999) 999-9999)',\n\t\tgreedy: false,\n\t\tautoUnmask: true,\n\t};\n\n\treturn <MaskedInput {...rest} mask={mask} />;\n}\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"PhoneInput.js","sources":["../../../../src/inputs/PhoneInput/PhoneInput.tsx"],"sourcesContent":["import debug from 'debug';\nimport {MaskedInput, MaskedInputProps} from '../MaskedInput';\n\nconst d = debug('thx.controls.inputs.PhoneInput');\n\nexport interface PhoneInputProps {\n\textension?: boolean;\n\tonChange?: (value?: string) => void;\n}\n\nexport function PhoneInput(props: PhoneInputProps & Omit<MaskedInputProps, 'mask' | 'onChange'>) {\n\tconst {extension, ...rest} = props;\n\tconst mask = {\n\t\tmask: extension ? '((999) 999-9999[ x9999])|(+9 (999) 999-9999[ x9999])' : '((999) 999-9999)|( +9 (999) 999-9999)',\n\t\tgreedy: false,\n\t\tautoUnmask: true,\n\t};\n\n\treturn <MaskedInput {...rest} mask={mask} />;\n}\n"],"names":[],"mappings":";;;;;AAGU,MAAM,gCAAgC,EAAA;AAOzC,SAAA,UAAA,CAAoB,KAAsE,EAAA;AAChG,EAAM,MAAA,EAAC,cAAc,IAAQ,EAAA,GAAA,KAAA,CAAA;AAC7B,EAAA,MAAM,IAAO,GAAA;AAAA,IACZ,IAAA,EAAM,YAAY,sDAAyD,GAAA,uCAAA;AAAA,IAC3E,MAAQ,EAAA,KAAA;AAAA,IACR,UAAY,EAAA,IAAA;AAAA,GACb,CAAA;AAEA,EAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,WAAA,EAAA;AAAA,IAAgB,GAAA,IAAA;AAAA,IAAM,IAAA;AAAA,GAAY,CAAA,CAAA;AAC3C;;;;"}
|
|
@@ -1,40 +1,14 @@
|
|
|
1
|
+
import React, { Children, cloneElement } from 'react';
|
|
1
2
|
import debug from 'debug';
|
|
2
|
-
import { Children, cloneElement } from 'react';
|
|
3
3
|
import { Form, FormRadio, Radio } from 'semantic-ui-react';
|
|
4
4
|
|
|
5
|
-
var __defProp = Object.defineProperty;
|
|
6
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
7
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
9
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
10
|
-
var __spreadValues = (a, b) => {
|
|
11
|
-
for (var prop in b || (b = {}))
|
|
12
|
-
if (__hasOwnProp.call(b, prop))
|
|
13
|
-
__defNormalProp(a, prop, b[prop]);
|
|
14
|
-
if (__getOwnPropSymbols)
|
|
15
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
16
|
-
if (__propIsEnum.call(b, prop))
|
|
17
|
-
__defNormalProp(a, prop, b[prop]);
|
|
18
|
-
}
|
|
19
|
-
return a;
|
|
20
|
-
};
|
|
21
|
-
var __objRest = (source, exclude) => {
|
|
22
|
-
var target = {};
|
|
23
|
-
for (var prop in source)
|
|
24
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
25
|
-
target[prop] = source[prop];
|
|
26
|
-
if (source != null && __getOwnPropSymbols)
|
|
27
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
28
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
29
|
-
target[prop] = source[prop];
|
|
30
|
-
}
|
|
31
|
-
return target;
|
|
32
|
-
};
|
|
33
5
|
debug("thx.controls.inputs.RadioGroup");
|
|
34
6
|
function RadioGroup(props) {
|
|
35
|
-
const
|
|
36
|
-
return /* @__PURE__ */ React.createElement(Form.Group,
|
|
37
|
-
|
|
7
|
+
const { children, onChange, value, ...rest } = props;
|
|
8
|
+
return /* @__PURE__ */ React.createElement(Form.Group, {
|
|
9
|
+
...rest
|
|
10
|
+
}, Children.map(props.children, (child) => {
|
|
11
|
+
if (child?.type === FormRadio || child?.type === Radio || child?.type === Form.Radio) {
|
|
38
12
|
return cloneElement(child, {
|
|
39
13
|
onChange: (ev, args) => {
|
|
40
14
|
if (onChange)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioGroup.js","sources":["../../../../src/inputs/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import debug from 'debug';\nimport {Children, cloneElement} from 'react';\nimport {Form, Radio, FormRadio, FormGroupProps} from 'semantic-ui-react';\n\nconst d = debug('thx.controls.inputs.RadioGroup');\n\nexport interface RadioGroupProps {\n\tchildren?: JSX.Element[] | JSX.Element;\n\tonChange?: (value?: string | number) => void;\n\tvalue?: string | number;\n}\n\nexport function RadioGroup(props: RadioGroupProps & Omit<FormGroupProps, 'children'>) {\n\tconst {children, onChange, value, ...rest} = props;\n\n\treturn (\n\t\t<Form.Group {...rest}>\n\t\t\t{Children.map(props.children, child => {\n\t\t\t\tif (child?.type === FormRadio || child?.type === Radio || child?.type === Form.Radio) {\n\t\t\t\t\treturn cloneElement(child, {\n\t\t\t\t\t\tonChange: (ev: any, args: {value?: string | number}) => {\n\t\t\t\t\t\t\tif (onChange) onChange(args.value);\n\t\t\t\t\t\t},\n\t\t\t\t\t\tchecked: value === child.props.value,\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t\treturn child;\n\t\t\t})}\n\t\t</Form.Group>\n\t);\n}\n"],"names":[],"mappings":";;;;
|
|
1
|
+
{"version":3,"file":"RadioGroup.js","sources":["../../../../src/inputs/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import debug from 'debug';\nimport {Children, cloneElement} from 'react';\nimport {Form, Radio, FormRadio, FormGroupProps} from 'semantic-ui-react';\n\nconst d = debug('thx.controls.inputs.RadioGroup');\n\nexport interface RadioGroupProps {\n\tchildren?: JSX.Element[] | JSX.Element;\n\tonChange?: (value?: string | number) => void;\n\tvalue?: string | number;\n}\n\nexport function RadioGroup(props: RadioGroupProps & Omit<FormGroupProps, 'children'>) {\n\tconst {children, onChange, value, ...rest} = props;\n\n\treturn (\n\t\t<Form.Group {...rest}>\n\t\t\t{Children.map(props.children, child => {\n\t\t\t\tif (child?.type === FormRadio || child?.type === Radio || child?.type === Form.Radio) {\n\t\t\t\t\treturn cloneElement(child, {\n\t\t\t\t\t\tonChange: (ev: any, args: {value?: string | number}) => {\n\t\t\t\t\t\t\tif (onChange) onChange(args.value);\n\t\t\t\t\t\t},\n\t\t\t\t\t\tchecked: value === child.props.value,\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t\treturn child;\n\t\t\t})}\n\t\t</Form.Group>\n\t);\n}\n"],"names":[],"mappings":";;;;AAIU,MAAM,gCAAgC,EAAA;AAQzC,SAAA,UAAA,CAAoB,KAA2D,EAAA;AACrF,EAAA,MAAM,EAAC,QAAA,EAAU,QAAU,EAAA,KAAA,EAAA,GAAU,IAAQ,EAAA,GAAA,KAAA,CAAA;AAE7C,EACC,uBAAA,KAAA,CAAA,aAAA,CAAC,KAAK,KAAL,EAAA;AAAA,IAAe,GAAA,IAAA;AAAA,GAAA,EACd,QAAS,CAAA,GAAA,CAAI,KAAM,CAAA,QAAA,EAAU,CAAS,KAAA,KAAA;AACtC,IAAI,IAAA,KAAA,EAAO,SAAS,SAAa,IAAA,KAAA,EAAO,SAAS,KAAS,IAAA,KAAA,EAAO,IAAS,KAAA,IAAA,CAAK,KAAO,EAAA;AACrF,MAAA,OAAO,aAAa,KAAO,EAAA;AAAA,QAC1B,QAAA,EAAU,CAAC,EAAA,EAAS,IAAoC,KAAA;AACvD,UAAI,IAAA,QAAA;AAAU,YAAA,QAAA,CAAS,KAAK,KAAK,CAAA,CAAA;AAAA,SAClC;AAAA,QACA,OAAA,EAAS,KAAU,KAAA,KAAA,CAAM,KAAM,CAAA,KAAA;AAAA,OAC/B,CAAA,CAAA;AAAA,KACF;AACA,IAAO,OAAA,KAAA,CAAA;AAAA,GACP,CACF,CAAA,CAAA;AAEF;;;;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
+
import React, { useRef, useState, useEffect, useMemo } from 'react';
|
|
1
2
|
import debug from 'debug';
|
|
2
|
-
import { useRef, useState, useEffect, useMemo } from 'react';
|
|
3
3
|
import { ScriptelContext } from './ScriptelContext.js';
|
|
4
4
|
import { ScriptelSocket } from './scriptel/index.js';
|
|
5
5
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Scriptel.js","sources":["../../../../src/inputs/Scriptel/Scriptel.tsx"],"sourcesContent":["import debug from 'debug';\nimport {useEffect, useMemo, useRef, useState} from 'react';\nimport {ScriptelContext} from './ScriptelContext';\nimport {ScriptelSocket} from './scriptel';\nimport type {ScriptelPenStyle} from './scriptel/enums';\nimport type {RenderedImage} from './scriptel/messages';\n\nconst d = debug('thx.controls.inputs.Scriptel');\n\nexport interface ScriptelProps {\n\tomniscriptUrl?: string; // Defaults to 'ws://localhost:8080'\n\timageType?: string; // Defaults to 'image/svg+xml'.\n\tscale?: number; // Defaults to 1\n\tcrop?: boolean; // Defaults to false\n\tpenStyle?: ScriptelPenStyle; // Defaults to 'PlainPenStyle'\n\tchildren: JSX.Element | JSX.Element[];\n}\n\nexport function Scriptel({omniscriptUrl, imageType, scale, crop, penStyle, children}: ScriptelProps) {\n\tconst socket = useRef<ScriptelSocket>();\n\tconst [render, setRender] = useState<RenderedImage>();\n\tconst [loading, setLoading] = useState<boolean>(false);\n\tconst [isSigning, setIsSigning] = useState<boolean>(false);\n\n\tuseEffect(() => {\n\t\tsocket.current = new ScriptelSocket({\n\t\t\tomniscriptUrl,\n\t\t\timageType,\n\t\t\tscale,\n\t\t\tcrop,\n\t\t\tpenStyle,\n\t\t});\n\n\t\tsocket.current.on('render', msg => {\n\t\t\tsetRender(msg);\n\t\t\tsetLoading(false);\n\t\t\tsetRender(undefined); // todo look at this in future\n\t\t});\n\t\tsocket.current.on('okButtonDown', () => {\n\t\t\tsetLoading(true);\n\t\t});\n\t\tsocket.current.on('cancel', () => {\n\t\t\tsetLoading(false);\n\t\t\tsetRender(undefined);\n\t\t});\n\t\tsocket.current.on('penMove', () => {\n\t\t\tsetIsSigning(true);\n\t\t});\n\t\tsocket.current.on('penUp', () => {\n\t\t\tsetIsSigning(false);\n\t\t});\n\n\t\treturn () => {\n\t\t\tif (socket.current) socket.current.close();\n\t\t};\n\t}, [omniscriptUrl, imageType, scale, crop, penStyle]);\n\n\tconst scriptel = useMemo(() => {\n\t\treturn {socket, renderImage: render, loading, isSigning};\n\t}, [isSigning, loading, render]);\n\n\treturn <ScriptelContext.Provider value={scriptel}>{children}</ScriptelContext.Provider>;\n}\n"],"names":[],"mappings":";;;;;
|
|
1
|
+
{"version":3,"file":"Scriptel.js","sources":["../../../../src/inputs/Scriptel/Scriptel.tsx"],"sourcesContent":["import debug from 'debug';\nimport {useEffect, useMemo, useRef, useState} from 'react';\nimport {ScriptelContext} from './ScriptelContext';\nimport {ScriptelSocket} from './scriptel';\nimport type {ScriptelPenStyle} from './scriptel/enums';\nimport type {RenderedImage} from './scriptel/messages';\n\nconst d = debug('thx.controls.inputs.Scriptel');\n\nexport interface ScriptelProps {\n\tomniscriptUrl?: string; // Defaults to 'ws://localhost:8080'\n\timageType?: string; // Defaults to 'image/svg+xml'.\n\tscale?: number; // Defaults to 1\n\tcrop?: boolean; // Defaults to false\n\tpenStyle?: ScriptelPenStyle; // Defaults to 'PlainPenStyle'\n\tchildren: JSX.Element | JSX.Element[];\n}\n\nexport function Scriptel({omniscriptUrl, imageType, scale, crop, penStyle, children}: ScriptelProps) {\n\tconst socket = useRef<ScriptelSocket>();\n\tconst [render, setRender] = useState<RenderedImage>();\n\tconst [loading, setLoading] = useState<boolean>(false);\n\tconst [isSigning, setIsSigning] = useState<boolean>(false);\n\n\tuseEffect(() => {\n\t\tsocket.current = new ScriptelSocket({\n\t\t\tomniscriptUrl,\n\t\t\timageType,\n\t\t\tscale,\n\t\t\tcrop,\n\t\t\tpenStyle,\n\t\t});\n\n\t\tsocket.current.on('render', msg => {\n\t\t\tsetRender(msg);\n\t\t\tsetLoading(false);\n\t\t\tsetRender(undefined); // todo look at this in future\n\t\t});\n\t\tsocket.current.on('okButtonDown', () => {\n\t\t\tsetLoading(true);\n\t\t});\n\t\tsocket.current.on('cancel', () => {\n\t\t\tsetLoading(false);\n\t\t\tsetRender(undefined);\n\t\t});\n\t\tsocket.current.on('penMove', () => {\n\t\t\tsetIsSigning(true);\n\t\t});\n\t\tsocket.current.on('penUp', () => {\n\t\t\tsetIsSigning(false);\n\t\t});\n\n\t\treturn () => {\n\t\t\tif (socket.current) socket.current.close();\n\t\t};\n\t}, [omniscriptUrl, imageType, scale, crop, penStyle]);\n\n\tconst scriptel = useMemo(() => {\n\t\treturn {socket, renderImage: render, loading, isSigning};\n\t}, [isSigning, loading, render]);\n\n\treturn <ScriptelContext.Provider value={scriptel}>{children}</ScriptelContext.Provider>;\n}\n"],"names":[],"mappings":";;;;;AAOU,MAAM,8BAA8B,EAAA;AAWvC,SAAA,QAAA,CAAkB,EAAC,aAAe,EAAA,SAAA,EAAW,KAAO,EAAA,IAAA,EAAM,UAAU,QAA0B,EAAA,EAAA;AACpG,EAAA,MAAM,SAAS,MAAuB,EAAA,CAAA;AACtC,EAAM,MAAA,CAAC,MAAQ,EAAA,SAAA,CAAA,GAAa,QAAwB,EAAA,CAAA;AACpD,EAAA,MAAM,CAAC,OAAA,EAAS,UAAc,CAAA,GAAA,QAAA,CAAkB,KAAK,CAAA,CAAA;AACrD,EAAA,MAAM,CAAC,SAAA,EAAW,YAAgB,CAAA,GAAA,QAAA,CAAkB,KAAK,CAAA,CAAA;AAEzD,EAAA,SAAA,CAAU,MAAM;AACf,IAAO,MAAA,CAAA,OAAA,GAAU,IAAI,cAAe,CAAA;AAAA,MACnC,aAAA;AAAA,MACA,SAAA;AAAA,MACA,KAAA;AAAA,MACA,IAAA;AAAA,MACA,QAAA;AAAA,KACA,CAAA,CAAA;AAED,IAAO,MAAA,CAAA,OAAA,CAAQ,EAAG,CAAA,QAAA,EAAU,CAAO,GAAA,KAAA;AAClC,MAAA,SAAA,CAAU,GAAG,CAAA,CAAA;AACb,MAAA,UAAA,CAAW,KAAK,CAAA,CAAA;AAChB,MAAA,SAAA,CAAU,KAAS,CAAA,CAAA,CAAA;AAAA,KACnB,CAAA,CAAA;AACD,IAAO,MAAA,CAAA,OAAA,CAAQ,EAAG,CAAA,cAAA,EAAgB,MAAM;AACvC,MAAA,UAAA,CAAW,IAAI,CAAA,CAAA;AAAA,KACf,CAAA,CAAA;AACD,IAAO,MAAA,CAAA,OAAA,CAAQ,EAAG,CAAA,QAAA,EAAU,MAAM;AACjC,MAAA,UAAA,CAAW,KAAK,CAAA,CAAA;AAChB,MAAA,SAAA,CAAU,KAAS,CAAA,CAAA,CAAA;AAAA,KACnB,CAAA,CAAA;AACD,IAAO,MAAA,CAAA,OAAA,CAAQ,EAAG,CAAA,SAAA,EAAW,MAAM;AAClC,MAAA,YAAA,CAAa,IAAI,CAAA,CAAA;AAAA,KACjB,CAAA,CAAA;AACD,IAAO,MAAA,CAAA,OAAA,CAAQ,EAAG,CAAA,OAAA,EAAS,MAAM;AAChC,MAAA,YAAA,CAAa,KAAK,CAAA,CAAA;AAAA,KAClB,CAAA,CAAA;AAED,IAAA,OAAO,MAAM;AACZ,MAAA,IAAI,MAAO,CAAA,OAAA;AAAS,QAAA,MAAA,CAAO,QAAQ,KAAM,EAAA,CAAA;AAAA,KAC1C,CAAA;AAAA,KACE,CAAC,aAAA,EAAe,WAAW,KAAO,EAAA,IAAA,EAAM,QAAQ,CAAC,CAAA,CAAA;AAEpD,EAAM,MAAA,QAAA,GAAW,QAAQ,MAAM;AAC9B,IAAA,OAAO,EAAC,MAAA,EAAQ,WAAa,EAAA,MAAA,EAAQ,SAAS,SAAS,EAAA,CAAA;AAAA,GACrD,EAAA,CAAC,SAAW,EAAA,OAAA,EAAS,MAAM,CAAC,CAAA,CAAA;AAE/B,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,gBAAgB,QAAhB,EAAA;AAAA,IAAyB,KAAO,EAAA,QAAA;AAAA,GAAA,EAAW,QAAS,CAAA,CAAA;AAC7D;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScriptelContext.js","sources":["../../../../src/inputs/Scriptel/ScriptelContext.ts"],"sourcesContent":["import {createContext, MutableRefObject} from 'react';\nimport type {ScriptelSocket} from './scriptel';\nimport type {RenderedImage} from './scriptel/messages';\n\nexport const ScriptelContext = createContext<\n\t{socket: MutableRefObject<ScriptelSocket | undefined>; renderImage: RenderedImage | undefined; loading: boolean; isSigning: boolean} | undefined\n>(undefined);\n"],"names":[],"mappings":";;
|
|
1
|
+
{"version":3,"file":"ScriptelContext.js","sources":["../../../../src/inputs/Scriptel/ScriptelContext.ts"],"sourcesContent":["import {createContext, MutableRefObject} from 'react';\nimport type {ScriptelSocket} from './scriptel';\nimport type {RenderedImage} from './scriptel/messages';\n\nexport const ScriptelContext = createContext<\n\t{socket: MutableRefObject<ScriptelSocket | undefined>; renderImage: RenderedImage | undefined; loading: boolean; isSigning: boolean} | undefined\n>(undefined);\n"],"names":[],"mappings":";;AAIa,MAAA,eAAA,GAAkB,cAE7B,KAAS,CAAA;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"enums.js","sources":["../../../../../src/inputs/Scriptel/scriptel/enums.ts"],"sourcesContent":["export enum ScriptelPenStyle {\n\tPlain = 'PlainPenStyle',\n\tChisel = 'ChiselPenStyle',\n\tInkwell = 'InkwellPenStyle',\n}\n\nexport enum ScriptelMessageClass {\n\tConnectionOpen = 'ConnectionOpen',\n\tDeviceOpenRequest = 'DeviceOpenRequest',\n\tDeviceOpenResponse = 'DeviceOpenResponse',\n\tRenderedImage = 'RenderedImage',\n\tScriptelException = 'ScriptelException',\n\tButtonDown = 'ButtonDown',\n\tButtonPress = 'ButtonPress',\n\tPenMove = 'PenMove',\n\tPenUp = 'PenUp',\n}\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"enums.js","sources":["../../../../../src/inputs/Scriptel/scriptel/enums.ts"],"sourcesContent":["export enum ScriptelPenStyle {\n\tPlain = 'PlainPenStyle',\n\tChisel = 'ChiselPenStyle',\n\tInkwell = 'InkwellPenStyle',\n}\n\nexport enum ScriptelMessageClass {\n\tConnectionOpen = 'ConnectionOpen',\n\tDeviceOpenRequest = 'DeviceOpenRequest',\n\tDeviceOpenResponse = 'DeviceOpenResponse',\n\tRenderedImage = 'RenderedImage',\n\tScriptelException = 'ScriptelException',\n\tButtonDown = 'ButtonDown',\n\tButtonPress = 'ButtonPress',\n\tPenMove = 'PenMove',\n\tPenUp = 'PenUp',\n}\n"],"names":[],"mappings":"AAAY,IAAA,gBAAA,qBAAA,iBAAL,KAAA;AACN,EAAQ,iBAAA,CAAA,OAAA,CAAA,GAAA,eAAA,CAAA;AACR,EAAS,iBAAA,CAAA,QAAA,CAAA,GAAA,gBAAA,CAAA;AACT,EAAU,iBAAA,CAAA,SAAA,CAAA,GAAA,iBAAA,CAAA;AAHC,EAAA,OAAA,iBAAA,CAAA;AAAA,CAAA,EAAA,gBAAA,IAAA,EAAA,EAAA;AAMA,IAAA,oBAAA,qBAAA,qBAAL,KAAA;AACN,EAAiB,qBAAA,CAAA,gBAAA,CAAA,GAAA,gBAAA,CAAA;AACjB,EAAoB,qBAAA,CAAA,mBAAA,CAAA,GAAA,mBAAA,CAAA;AACpB,EAAqB,qBAAA,CAAA,oBAAA,CAAA,GAAA,oBAAA,CAAA;AACrB,EAAgB,qBAAA,CAAA,eAAA,CAAA,GAAA,eAAA,CAAA;AAChB,EAAoB,qBAAA,CAAA,mBAAA,CAAA,GAAA,mBAAA,CAAA;AACpB,EAAa,qBAAA,CAAA,YAAA,CAAA,GAAA,YAAA,CAAA;AACb,EAAc,qBAAA,CAAA,aAAA,CAAA,GAAA,aAAA,CAAA;AACd,EAAU,qBAAA,CAAA,SAAA,CAAA,GAAA,SAAA,CAAA;AACV,EAAQ,qBAAA,CAAA,OAAA,CAAA,GAAA,OAAA,CAAA;AATG,EAAA,OAAA,qBAAA,CAAA;AAAA,CAAA,EAAA,oBAAA,IAAA,EAAA;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../../src/inputs/Scriptel/scriptel/index.ts"],"sourcesContent":["/* globals WebSocket: true */\nimport debug from 'debug';\nimport EventEmitter from 'eventemitter3';\nimport {ScriptelMessageClass, ScriptelPenStyle} from './enums';\nimport type {ConnectionOpen, DeviceOpenResponse, Message, RenderedImage} from './messages';\n\nconst d = debug('thx.controls.inputs.Scriptel.scriptel');\n\nexport interface ScriptelSocketArgs {\n\tomniscriptUrl?: string; // Defaults to 'ws://localhost:8080'\n\timageType?: string; // Defaults to 'image/svg+xml'.\n\tscale?: number; // Defaults to 1\n\tcrop?: boolean; // Defaults to false\n\tpenStyle?: ScriptelPenStyle; // Defaults to 'PlainPenStyle'\n\trender?: () => void;\n}\n\nfunction serverConnected(msg: ConnectionOpen, socket: WebSocket) {\n\td('Server connected');\n\tif (msg.serverInfo.devices.length > 0) {\n\t\t// Grab the first available device\n\t\tconst device = msg.serverInfo.devices[0];\n\t\tsocket.send(\n\t\t\tJSON.stringify({\n\t\t\t\t_class: 'DeviceOpenRequest',\n\t\t\t\tuuid: device.uuid,\n\t\t\t}),\n\t\t);\n\t}\n}\n\nfunction deviceConnected(msg: DeviceOpenResponse, socket: WebSocket, args: ScriptelSocketArgs) {\n\td(`Device connected: ${msg.device.uuid}`);\n\tconst {imageType, scale, crop, penStyle} = args;\n\tsocket.send(\n\t\tJSON.stringify({\n\t\t\t_class: 'RenderSettingsUpdateRequest',\n\t\t\trenderSettings: {\n\t\t\t\t_class: 'RenderSettings',\n\t\t\t\ttype: imageType || 'image/svg+xml',\n\t\t\t\tscale: scale || 1,\n\t\t\t\tcrop: crop || false,\n\t\t\t\tpenStyle: penStyle\n\t\t\t\t\t? {\n\t\t\t\t\t\t\trenderFunction: penStyle,\n\t\t\t\t\t }\n\t\t\t\t\t: {\n\t\t\t\t\t\t\trenderFunction: ScriptelPenStyle.Plain,\n\t\t\t\t\t },\n\t\t\t},\n\t\t}),\n\t);\n}\n\nfunction render(msg: RenderedImage, args: ScriptelSocketArgs, eventEmitter: EventEmitter) {\n\td(`Rendered image: ${msg.type} ${msg.width}x${msg.height}`);\n\teventEmitter.emit('render', msg);\n}\n\nexport class ScriptelSocket extends EventEmitter {\n\tprivate socket: WebSocket;\n\tprivate options: ScriptelSocketArgs;\n\n\tconstructor(args: ScriptelSocketArgs) {\n\t\tsuper();\n\n\t\tthis.options = args;\n\n\t\tthis.socket = new WebSocket(args.omniscriptUrl || 'ws://localhost:8080');\n\n\t\tthis.socket.onopen = () => {\n\t\t\td('Socket open');\n\t\t};\n\n\t\tthis.socket.onclose = () => {\n\t\t\td('Socket closed');\n\t\t};\n\n\t\tthis.socket.onmessage = ev => {\n\t\t\tconst msg = JSON.parse(ev.data) as Message;\n\t\t\tif (!msg._class) return; // A message with no class.\n\n\t\t\tswitch (msg._class) {\n\t\t\t\tcase ScriptelMessageClass.ConnectionOpen:\n\t\t\t\t\tserverConnected(msg, this.socket);\n\t\t\t\t\tbreak;\n\t\t\t\tcase ScriptelMessageClass.DeviceOpenResponse:\n\t\t\t\t\tdeviceConnected(msg, this.socket, this.options);\n\t\t\t\t\tbreak;\n\t\t\t\tcase ScriptelMessageClass.RenderedImage:\n\t\t\t\t\trender(msg, this.options, this);\n\t\t\t\t\tbreak;\n\t\t\t\tcase ScriptelMessageClass.ScriptelException:\n\t\t\t\t\td(`Scriptel Exception Error: ${msg.message}`);\n\t\t\t\t\tbreak;\n\n\t\t\t\tcase ScriptelMessageClass.ButtonPress:\n\t\t\t\t\tif (msg.label === 'Cancel') this.emit('cancel');\n\t\t\t\t\tbreak;\n\t\t\t\tcase ScriptelMessageClass.ButtonDown:\n\t\t\t\t\tif (msg.label === 'OK') this.emit('okButtonDown');\n\t\t\t\t\tbreak;\n\t\t\t\tcase ScriptelMessageClass.PenMove:\n\t\t\t\t\tthis.emit('penMove');\n\t\t\t\t\tbreak;\n\t\t\t\tcase ScriptelMessageClass.PenUp:\n\t\t\t\t\tthis.emit('penUp');\n\t\t\t\t\tbreak;\n\t\t\t\tdefault:\n\t\t\t}\n\t\t};\n\t}\n\n\tcalibrate() {\n\t\td('calibrate');\n\t\tthis.socket.send(JSON.stringify({_class: 'ForceRecalibrate'}));\n\t}\n\n\tclose() {\n\t\tthis.socket.close();\n\t}\n}\n"],"names":[],"mappings":";;;;
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../../src/inputs/Scriptel/scriptel/index.ts"],"sourcesContent":["/* globals WebSocket: true */\nimport debug from 'debug';\nimport EventEmitter from 'eventemitter3';\nimport {ScriptelMessageClass, ScriptelPenStyle} from './enums';\nimport type {ConnectionOpen, DeviceOpenResponse, Message, RenderedImage} from './messages';\n\nconst d = debug('thx.controls.inputs.Scriptel.scriptel');\n\nexport interface ScriptelSocketArgs {\n\tomniscriptUrl?: string; // Defaults to 'ws://localhost:8080'\n\timageType?: string; // Defaults to 'image/svg+xml'.\n\tscale?: number; // Defaults to 1\n\tcrop?: boolean; // Defaults to false\n\tpenStyle?: ScriptelPenStyle; // Defaults to 'PlainPenStyle'\n\trender?: () => void;\n}\n\nfunction serverConnected(msg: ConnectionOpen, socket: WebSocket) {\n\td('Server connected');\n\tif (msg.serverInfo.devices.length > 0) {\n\t\t// Grab the first available device\n\t\tconst device = msg.serverInfo.devices[0];\n\t\tsocket.send(\n\t\t\tJSON.stringify({\n\t\t\t\t_class: 'DeviceOpenRequest',\n\t\t\t\tuuid: device.uuid,\n\t\t\t}),\n\t\t);\n\t}\n}\n\nfunction deviceConnected(msg: DeviceOpenResponse, socket: WebSocket, args: ScriptelSocketArgs) {\n\td(`Device connected: ${msg.device.uuid}`);\n\tconst {imageType, scale, crop, penStyle} = args;\n\tsocket.send(\n\t\tJSON.stringify({\n\t\t\t_class: 'RenderSettingsUpdateRequest',\n\t\t\trenderSettings: {\n\t\t\t\t_class: 'RenderSettings',\n\t\t\t\ttype: imageType || 'image/svg+xml',\n\t\t\t\tscale: scale || 1,\n\t\t\t\tcrop: crop || false,\n\t\t\t\tpenStyle: penStyle\n\t\t\t\t\t? {\n\t\t\t\t\t\t\trenderFunction: penStyle,\n\t\t\t\t\t }\n\t\t\t\t\t: {\n\t\t\t\t\t\t\trenderFunction: ScriptelPenStyle.Plain,\n\t\t\t\t\t },\n\t\t\t},\n\t\t}),\n\t);\n}\n\nfunction render(msg: RenderedImage, args: ScriptelSocketArgs, eventEmitter: EventEmitter) {\n\td(`Rendered image: ${msg.type} ${msg.width}x${msg.height}`);\n\teventEmitter.emit('render', msg);\n}\n\nexport class ScriptelSocket extends EventEmitter {\n\tprivate socket: WebSocket;\n\tprivate options: ScriptelSocketArgs;\n\n\tconstructor(args: ScriptelSocketArgs) {\n\t\tsuper();\n\n\t\tthis.options = args;\n\n\t\tthis.socket = new WebSocket(args.omniscriptUrl || 'ws://localhost:8080');\n\n\t\tthis.socket.onopen = () => {\n\t\t\td('Socket open');\n\t\t};\n\n\t\tthis.socket.onclose = () => {\n\t\t\td('Socket closed');\n\t\t};\n\n\t\tthis.socket.onmessage = ev => {\n\t\t\tconst msg = JSON.parse(ev.data) as Message;\n\t\t\tif (!msg._class) return; // A message with no class.\n\n\t\t\tswitch (msg._class) {\n\t\t\t\tcase ScriptelMessageClass.ConnectionOpen:\n\t\t\t\t\tserverConnected(msg, this.socket);\n\t\t\t\t\tbreak;\n\t\t\t\tcase ScriptelMessageClass.DeviceOpenResponse:\n\t\t\t\t\tdeviceConnected(msg, this.socket, this.options);\n\t\t\t\t\tbreak;\n\t\t\t\tcase ScriptelMessageClass.RenderedImage:\n\t\t\t\t\trender(msg, this.options, this);\n\t\t\t\t\tbreak;\n\t\t\t\tcase ScriptelMessageClass.ScriptelException:\n\t\t\t\t\td(`Scriptel Exception Error: ${msg.message}`);\n\t\t\t\t\tbreak;\n\n\t\t\t\tcase ScriptelMessageClass.ButtonPress:\n\t\t\t\t\tif (msg.label === 'Cancel') this.emit('cancel');\n\t\t\t\t\tbreak;\n\t\t\t\tcase ScriptelMessageClass.ButtonDown:\n\t\t\t\t\tif (msg.label === 'OK') this.emit('okButtonDown');\n\t\t\t\t\tbreak;\n\t\t\t\tcase ScriptelMessageClass.PenMove:\n\t\t\t\t\tthis.emit('penMove');\n\t\t\t\t\tbreak;\n\t\t\t\tcase ScriptelMessageClass.PenUp:\n\t\t\t\t\tthis.emit('penUp');\n\t\t\t\t\tbreak;\n\t\t\t\tdefault:\n\t\t\t}\n\t\t};\n\t}\n\n\tcalibrate() {\n\t\td('calibrate');\n\t\tthis.socket.send(JSON.stringify({_class: 'ForceRecalibrate'}));\n\t}\n\n\tclose() {\n\t\tthis.socket.close();\n\t}\n}\n"],"names":[],"mappings":";;;;AAMA,MAAM,CAAA,GAAI,MAAM,uCAAuC,CAAA,CAAA;AAWvD,SAAA,eAAA,CAAyB,KAAqB,MAAmB,EAAA;AAChE,EAAA,CAAA,CAAE,kBAAkB,CAAA,CAAA;AACpB,EAAA,IAAI,GAAI,CAAA,UAAA,CAAW,OAAQ,CAAA,MAAA,GAAS,CAAG,EAAA;AAEtC,IAAM,MAAA,MAAA,GAAS,GAAI,CAAA,UAAA,CAAW,OAAQ,CAAA,CAAA,CAAA,CAAA;AACtC,IAAO,MAAA,CAAA,IAAA,CACN,KAAK,SAAU,CAAA;AAAA,MACd,MAAQ,EAAA,mBAAA;AAAA,MACR,MAAM,MAAO,CAAA,IAAA;AAAA,KACb,CACF,CAAA,CAAA;AAAA,GACD;AACD,CAAA;AAEA,SAAyB,eAAA,CAAA,GAAA,EAAyB,QAAmB,IAA0B,EAAA;AAC9F,EAAE,CAAA,CAAA,CAAA,kBAAA,EAAqB,GAAI,CAAA,MAAA,CAAO,IAAM,CAAA,CAAA,CAAA,CAAA;AACxC,EAAA,MAAM,EAAC,SAAA,EAAW,KAAO,EAAA,IAAA,EAAM,QAAY,EAAA,GAAA,IAAA,CAAA;AAC3C,EAAO,MAAA,CAAA,IAAA,CACN,KAAK,SAAU,CAAA;AAAA,IACd,MAAQ,EAAA,6BAAA;AAAA,IACR,cAAgB,EAAA;AAAA,MACf,MAAQ,EAAA,gBAAA;AAAA,MACR,MAAM,SAAa,IAAA,eAAA;AAAA,MACnB,OAAO,KAAS,IAAA,CAAA;AAAA,MAChB,MAAM,IAAQ,IAAA,KAAA;AAAA,MACd,UAAU,QACP,GAAA;AAAA,QACA,cAAgB,EAAA,QAAA;AAAA,OAEhB,GAAA;AAAA,QACA,gBAAgB,gBAAiB,CAAA,KAAA;AAAA,OACjC;AAAA,KACJ;AAAA,GACA,CACF,CAAA,CAAA;AACD,CAAA;AAEA,SAAgB,MAAA,CAAA,GAAA,EAAoB,MAA0B,YAA4B,EAAA;AACzF,EAAA,CAAA,CAAE,mBAAmB,GAAI,CAAA,IAAA,CAAA,CAAA,EAAQ,GAAI,CAAA,KAAA,CAAA,CAAA,EAAS,IAAI,MAAQ,CAAA,CAAA,CAAA,CAAA;AAC1D,EAAa,YAAA,CAAA,IAAA,CAAK,UAAU,GAAG,CAAA,CAAA;AAChC,CAAA;AAEO,MAAM,uBAAuB,YAAa,CAAA;AAAA,EAIhD,YAAY,IAA0B,EAAA;AACrC,IAAM,KAAA,EAAA,CAAA;AAEN,IAAA,IAAA,CAAK,OAAU,GAAA,IAAA,CAAA;AAEf,IAAA,IAAA,CAAK,MAAS,GAAA,IAAI,SAAU,CAAA,IAAA,CAAK,iBAAiB,qBAAqB,CAAA,CAAA;AAEvE,IAAK,IAAA,CAAA,MAAA,CAAO,SAAS,MAAM;AAC1B,MAAA,CAAA,CAAE,aAAa,CAAA,CAAA;AAAA,KAChB,CAAA;AAEA,IAAK,IAAA,CAAA,MAAA,CAAO,UAAU,MAAM;AAC3B,MAAA,CAAA,CAAE,eAAe,CAAA,CAAA;AAAA,KAClB,CAAA;AAEA,IAAK,IAAA,CAAA,MAAA,CAAO,YAAY,CAAM,EAAA,KAAA;AAC7B,MAAA,MAAM,GAAM,GAAA,IAAA,CAAK,KAAM,CAAA,EAAA,CAAG,IAAI,CAAA,CAAA;AAC9B,MAAA,IAAI,CAAC,GAAI,CAAA,MAAA;AAAQ,QAAA,OAAA;AAEjB,MAAA,QAAQ,GAAI,CAAA,MAAA;AAAA,QAAA,KACN,oBAAqB,CAAA,cAAA;AACzB,UAAgB,eAAA,CAAA,GAAA,EAAK,KAAK,MAAM,CAAA,CAAA;AAChC,UAAA,MAAA;AAAA,QAAA,KACI,oBAAqB,CAAA,kBAAA;AACzB,UAAA,eAAA,CAAgB,GAAK,EAAA,IAAA,CAAK,MAAQ,EAAA,IAAA,CAAK,OAAO,CAAA,CAAA;AAC9C,UAAA,MAAA;AAAA,QAAA,KACI,oBAAqB,CAAA,aAAA;AACzB,UAAO,MAAA,CAAA,GAAA,EAAK,IAAK,CAAA,OAAA,EAAS,IAAI,CAAA,CAAA;AAC9B,UAAA,MAAA;AAAA,QAAA,KACI,oBAAqB,CAAA,iBAAA;AACzB,UAAE,CAAA,CAAA,CAAA,0BAAA,EAA6B,IAAI,OAAS,CAAA,CAAA,CAAA,CAAA;AAC5C,UAAA,MAAA;AAAA,QAAA,KAEI,oBAAqB,CAAA,WAAA;AACzB,UAAA,IAAI,IAAI,KAAU,KAAA,QAAA;AAAU,YAAA,IAAA,CAAK,KAAK,QAAQ,CAAA,CAAA;AAC9C,UAAA,MAAA;AAAA,QAAA,KACI,oBAAqB,CAAA,UAAA;AACzB,UAAA,IAAI,IAAI,KAAU,KAAA,IAAA;AAAM,YAAA,IAAA,CAAK,KAAK,cAAc,CAAA,CAAA;AAChD,UAAA,MAAA;AAAA,QAAA,KACI,oBAAqB,CAAA,OAAA;AACzB,UAAA,IAAA,CAAK,KAAK,SAAS,CAAA,CAAA;AACnB,UAAA,MAAA;AAAA,QAAA,KACI,oBAAqB,CAAA,KAAA;AACzB,UAAA,IAAA,CAAK,KAAK,OAAO,CAAA,CAAA;AACjB,UAAA,MAAA;AAAA,OAAA;AAAA,KAGH,CAAA;AAAA,GACD;AAAA,EAEA,SAAY,GAAA;AACX,IAAA,CAAA,CAAE,WAAW,CAAA,CAAA;AACb,IAAK,IAAA,CAAA,MAAA,CAAO,KAAK,IAAK,CAAA,SAAA,CAAU,EAAC,MAAQ,EAAA,kBAAA,EAAmB,CAAC,CAAA,CAAA;AAAA,GAC9D;AAAA,EAEA,KAAQ,GAAA;AACP,IAAA,IAAA,CAAK,OAAO,KAAM,EAAA,CAAA;AAAA,GACnB;AACD;;;;"}
|
|
@@ -1,24 +1,13 @@
|
|
|
1
|
+
import React from 'react';
|
|
1
2
|
import { Scriptel } from './Scriptel.js';
|
|
2
3
|
|
|
3
|
-
var __defProp = Object.defineProperty;
|
|
4
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
-
var __spreadValues = (a, b) => {
|
|
9
|
-
for (var prop in b || (b = {}))
|
|
10
|
-
if (__hasOwnProp.call(b, prop))
|
|
11
|
-
__defNormalProp(a, prop, b[prop]);
|
|
12
|
-
if (__getOwnPropSymbols)
|
|
13
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
-
if (__propIsEnum.call(b, prop))
|
|
15
|
-
__defNormalProp(a, prop, b[prop]);
|
|
16
|
-
}
|
|
17
|
-
return a;
|
|
18
|
-
};
|
|
19
4
|
function withScriptel(WrappedComponent, scriptelProps) {
|
|
20
5
|
return function withScriptelHoC(props) {
|
|
21
|
-
return /* @__PURE__ */ React.createElement(Scriptel,
|
|
6
|
+
return /* @__PURE__ */ React.createElement(Scriptel, {
|
|
7
|
+
...scriptelProps
|
|
8
|
+
}, /* @__PURE__ */ React.createElement(WrappedComponent, {
|
|
9
|
+
...props
|
|
10
|
+
}));
|
|
22
11
|
};
|
|
23
12
|
}
|
|
24
13
|
|