@alfalab/core-components-time-input 4.0.4 → 4.0.5-alfasans
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/Component.d.ts +5 -5
- package/Component.js.map +1 -1
- package/cssm/Component.d.ts +5 -5
- package/cssm/Component.js.map +1 -1
- package/cssm/utils/format.js.map +1 -1
- package/esm/Component.d.ts +5 -5
- package/esm/Component.js.map +1 -1
- package/esm/utils/format.js.map +1 -1
- package/modern/Component.d.ts +5 -5
- package/modern/Component.js.map +1 -1
- package/modern/utils/format.js.map +1 -1
- package/moderncssm/Component.d.ts +5 -5
- package/moderncssm/Component.js.map +1 -1
- package/moderncssm/utils/format.js.map +1 -1
- package/package.json +4 -4
- package/utils/format.js.map +1 -1
package/Component.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { type ChangeEvent } from 'react';
|
|
2
2
|
import { type InputProps } from '@alfalab/core-components-input';
|
|
3
|
-
export
|
|
3
|
+
export type TimeInputProps = Omit<InputProps, 'onChange'> & {
|
|
4
4
|
/**
|
|
5
5
|
* Обработчик изменения значения
|
|
6
6
|
*/
|
|
@@ -26,17 +26,17 @@ export declare const TimeInput: React.ForwardRefExoticComponent<Omit<InputProps,
|
|
|
26
26
|
/**
|
|
27
27
|
* Обработчик изменения значения
|
|
28
28
|
*/
|
|
29
|
-
onChange?: (
|
|
29
|
+
onChange?: (event: ChangeEvent<HTMLInputElement>, payload: {
|
|
30
30
|
hours: number;
|
|
31
31
|
mins: number;
|
|
32
32
|
value: string;
|
|
33
|
-
}) => void
|
|
33
|
+
}) => void;
|
|
34
34
|
/**
|
|
35
35
|
* Обработчик окончания ввода
|
|
36
36
|
*/
|
|
37
|
-
onComplete?: (
|
|
37
|
+
onComplete?: (event: ChangeEvent<HTMLInputElement>, payload: {
|
|
38
38
|
hours: number;
|
|
39
39
|
mins: number;
|
|
40
40
|
value: string;
|
|
41
|
-
}) => void
|
|
41
|
+
}) => void;
|
|
42
42
|
} & React.RefAttributes<HTMLInputElement>>;
|
package/Component.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.js","sources":["src/Component.tsx"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nimport React, { type ChangeEvent, useState } from 'react';\n\nimport { Input, type InputProps } from '@alfalab/core-components-input';\n\nimport { format, isCompleteTimeInput, isValidInputValue } from './utils';\n\nexport type TimeInputProps = Omit<InputProps, 'onChange'> & {\n /**\n * Обработчик изменения значения\n */\n onChange?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n\n /**\n * Обработчик окончания ввода\n */\n onComplete?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n};\n\n/**\n * @deprecated\n * use UniversalDateInput instead\n */\nexport const TimeInput = React.forwardRef<HTMLInputElement, TimeInputProps>(\n (\n { defaultValue = '', value: propValue, onChange, onComplete, className, ...restProps },\n ref,\n ) => {\n const [value, setValue] = useState(propValue || defaultValue);\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n const { value: newValue } = event.target;\n\n if (newValue.length > 5) return;\n\n // Позволяем вводить только цифры и двоеточия\n if (/[^\\d:]/.test(newValue)) {\n return;\n }\n\n const colon = newValue.match(/\\:/g);\n\n // Не даем вводить больше, чем одно двоеточие\n if (colon && colon.length > 1) {\n return;\n }\n\n const formattedValue = format(newValue);\n\n const formattedValueArr = formattedValue.split(':');\n const hours = Number(formattedValueArr[0]);\n const mins = Number(formattedValueArr[1]);\n\n setValue(formattedValue);\n\n if (onChange) onChange(event, { hours, mins, value: formattedValue });\n\n if (isCompleteTimeInput(formattedValue)) {\n const valid = formattedValue.length > 0 && isValidInputValue(formattedValue);\n\n if (!valid) return;\n\n if (onComplete) {\n onComplete(event, { hours, mins, value: formattedValue });\n }\n }\n };\n\n const handleClearClick = () => {\n setValue('');\n };\n\n return (\n <Input\n {...restProps}\n ref={ref}\n value={value}\n className={className}\n onChange={handleChange}\n onClear={handleClearClick}\n />\n );\n },\n);\n"],"names":["React","__rest","useState","format","isCompleteTimeInput","isValidInputValue","Input","__assign"],"mappings":";;;;;;;;;;;;;AAAA;AA0BA;;;AAGG;AACU,IAAA,SAAS,GAAGA,sBAAK,CAAC,UAAU,CACrC,UACI,EAAsF,EACtF,GAAG,EAAA;IADD,IAAA,EAAA,GAAA,EAAA,CAAA,YAAiB,EAAjB,YAAY,GAAA,EAAA,KAAA,MAAA,GAAG,EAAE,GAAA,EAAA,EAAS,SAAS,GAAA,EAAA,CAAA,KAAA,EAAE,QAAQ,cAAA,EAAE,UAAU,gBAAA,EAAE,SAAS,eAAA,EAAK,SAAS,GAApFC,YAAA,CAAA,EAAA,EAAA,CAAA,cAAA,EAAA,OAAA,EAAA,UAAA,EAAA,YAAA,EAAA,WAAA,CAAsF,CAAF;AAG9E,IAAA,IAAA,EAAoB,GAAAC,cAAQ,CAAC,SAAS,IAAI,YAAY,CAAC,EAAtD,KAAK,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,QAAQ,QAAuC;IAE7D,IAAM,YAAY,GAAG,UAAC,KAAoC,EAAA;AAC9C,QAAA,IAAO,QAAQ,GAAK,KAAK,CAAC,MAAM,MAAjB;AAEvB,QAAA,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC;YAAE;;AAGzB,QAAA,IAAI,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;YACzB
|
|
1
|
+
{"version":3,"file":"Component.js","sources":["src/Component.tsx"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nimport React, { type ChangeEvent, useState } from 'react';\n\nimport { Input, type InputProps } from '@alfalab/core-components-input';\n\nimport { format, isCompleteTimeInput, isValidInputValue } from './utils';\n\nexport type TimeInputProps = Omit<InputProps, 'onChange'> & {\n /**\n * Обработчик изменения значения\n */\n onChange?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n\n /**\n * Обработчик окончания ввода\n */\n onComplete?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n};\n\n/**\n * @deprecated\n * use UniversalDateInput instead\n */\nexport const TimeInput = React.forwardRef<HTMLInputElement, TimeInputProps>(\n (\n { defaultValue = '', value: propValue, onChange, onComplete, className, ...restProps },\n ref,\n ) => {\n const [value, setValue] = useState(propValue || defaultValue);\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n const { value: newValue } = event.target;\n\n if (newValue.length > 5) return;\n\n // Позволяем вводить только цифры и двоеточия\n if (/[^\\d:]/.test(newValue)) {\n return;\n }\n\n const colon = newValue.match(/\\:/g);\n\n // Не даем вводить больше, чем одно двоеточие\n if (colon && colon.length > 1) {\n return;\n }\n\n const formattedValue = format(newValue);\n\n const formattedValueArr = formattedValue.split(':');\n const hours = Number(formattedValueArr[0]);\n const mins = Number(formattedValueArr[1]);\n\n setValue(formattedValue);\n\n if (onChange) onChange(event, { hours, mins, value: formattedValue });\n\n if (isCompleteTimeInput(formattedValue)) {\n const valid = formattedValue.length > 0 && isValidInputValue(formattedValue);\n\n if (!valid) return;\n\n if (onComplete) {\n onComplete(event, { hours, mins, value: formattedValue });\n }\n }\n };\n\n const handleClearClick = () => {\n setValue('');\n };\n\n return (\n <Input\n {...restProps}\n ref={ref}\n value={value}\n className={className}\n onChange={handleChange}\n onClear={handleClearClick}\n />\n );\n },\n);\n"],"names":["React","__rest","useState","format","isCompleteTimeInput","isValidInputValue","Input","__assign"],"mappings":";;;;;;;;;;;;;AAAA;AA0BA;;;AAGG;AACU,IAAA,SAAS,GAAGA,sBAAK,CAAC,UAAU,CACrC,UACI,EAAsF,EACtF,GAAG,EAAA;IADD,IAAA,EAAA,GAAA,EAAA,CAAA,YAAiB,EAAjB,YAAY,GAAA,EAAA,KAAA,MAAA,GAAG,EAAE,GAAA,EAAA,EAAS,SAAS,GAAA,EAAA,CAAA,KAAA,EAAE,QAAQ,cAAA,EAAE,UAAU,gBAAA,EAAE,SAAS,eAAA,EAAK,SAAS,GAApFC,YAAA,CAAA,EAAA,EAAA,CAAA,cAAA,EAAA,OAAA,EAAA,UAAA,EAAA,YAAA,EAAA,WAAA,CAAsF,CAAF;AAG9E,IAAA,IAAA,EAAoB,GAAAC,cAAQ,CAAC,SAAS,IAAI,YAAY,CAAC,EAAtD,KAAK,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,QAAQ,QAAuC;IAE7D,IAAM,YAAY,GAAG,UAAC,KAAoC,EAAA;AAC9C,QAAA,IAAO,QAAQ,GAAK,KAAK,CAAC,MAAM,MAAjB;AAEvB,QAAA,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC;YAAE;;AAGzB,QAAA,IAAI,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;YACzB;;QAGJ,IAAM,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC;;QAGnC,IAAI,KAAK,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;YAC3B;;AAGJ,QAAA,IAAM,cAAc,GAAGC,aAAM,CAAC,QAAQ,CAAC;QAEvC,IAAM,iBAAiB,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG,CAAC;QACnD,IAAM,KAAK,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC;QAC1C,IAAM,IAAI,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC;QAEzC,QAAQ,CAAC,cAAc,CAAC;AAExB,QAAA,IAAI,QAAQ;AAAE,YAAA,QAAQ,CAAC,KAAK,EAAE,EAAE,KAAK,EAAA,KAAA,EAAE,IAAI,EAAA,IAAA,EAAE,KAAK,EAAE,cAAc,EAAE,CAAC;AAErE,QAAA,IAAIC,0BAAmB,CAAC,cAAc,CAAC,EAAE;AACrC,YAAA,IAAM,KAAK,GAAG,cAAc,CAAC,MAAM,GAAG,CAAC,IAAIC,wBAAiB,CAAC,cAAc,CAAC;AAE5E,YAAA,IAAI,CAAC,KAAK;gBAAE;YAEZ,IAAI,UAAU,EAAE;AACZ,gBAAA,UAAU,CAAC,KAAK,EAAE,EAAE,KAAK,EAAA,KAAA,EAAE,IAAI,EAAA,IAAA,EAAE,KAAK,EAAE,cAAc,EAAE,CAAC;;;AAGrE,KAAC;AAED,IAAA,IAAM,gBAAgB,GAAG,YAAA;QACrB,QAAQ,CAAC,EAAE,CAAC;AAChB,KAAC;IAED,QACIL,sBAAC,CAAA,aAAA,CAAAM,yBAAK,EACEC,cAAA,CAAA,EAAA,EAAA,SAAS,EACb,EAAA,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,YAAY,EACtB,OAAO,EAAE,gBAAgB,EAC3B,CAAA,CAAA;AAEV,CAAC;;;;"}
|
package/cssm/Component.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { type ChangeEvent } from 'react';
|
|
2
2
|
import { type InputProps } from '@alfalab/core-components-input/cssm';
|
|
3
|
-
export
|
|
3
|
+
export type TimeInputProps = Omit<InputProps, 'onChange'> & {
|
|
4
4
|
/**
|
|
5
5
|
* Обработчик изменения значения
|
|
6
6
|
*/
|
|
@@ -26,17 +26,17 @@ export declare const TimeInput: React.ForwardRefExoticComponent<Omit<InputProps,
|
|
|
26
26
|
/**
|
|
27
27
|
* Обработчик изменения значения
|
|
28
28
|
*/
|
|
29
|
-
onChange?: (
|
|
29
|
+
onChange?: (event: ChangeEvent<HTMLInputElement>, payload: {
|
|
30
30
|
hours: number;
|
|
31
31
|
mins: number;
|
|
32
32
|
value: string;
|
|
33
|
-
}) => void
|
|
33
|
+
}) => void;
|
|
34
34
|
/**
|
|
35
35
|
* Обработчик окончания ввода
|
|
36
36
|
*/
|
|
37
|
-
onComplete?: (
|
|
37
|
+
onComplete?: (event: ChangeEvent<HTMLInputElement>, payload: {
|
|
38
38
|
hours: number;
|
|
39
39
|
mins: number;
|
|
40
40
|
value: string;
|
|
41
|
-
}) => void
|
|
41
|
+
}) => void;
|
|
42
42
|
} & React.RefAttributes<HTMLInputElement>>;
|
package/cssm/Component.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nimport React, { type ChangeEvent, useState } from 'react';\n\nimport { Input, type InputProps } from '@alfalab/core-components-input';\n\nimport { format, isCompleteTimeInput, isValidInputValue } from './utils';\n\nexport type TimeInputProps = Omit<InputProps, 'onChange'> & {\n /**\n * Обработчик изменения значения\n */\n onChange?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n\n /**\n * Обработчик окончания ввода\n */\n onComplete?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n};\n\n/**\n * @deprecated\n * use UniversalDateInput instead\n */\nexport const TimeInput = React.forwardRef<HTMLInputElement, TimeInputProps>(\n (\n { defaultValue = '', value: propValue, onChange, onComplete, className, ...restProps },\n ref,\n ) => {\n const [value, setValue] = useState(propValue || defaultValue);\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n const { value: newValue } = event.target;\n\n if (newValue.length > 5) return;\n\n // Позволяем вводить только цифры и двоеточия\n if (/[^\\d:]/.test(newValue)) {\n return;\n }\n\n const colon = newValue.match(/\\:/g);\n\n // Не даем вводить больше, чем одно двоеточие\n if (colon && colon.length > 1) {\n return;\n }\n\n const formattedValue = format(newValue);\n\n const formattedValueArr = formattedValue.split(':');\n const hours = Number(formattedValueArr[0]);\n const mins = Number(formattedValueArr[1]);\n\n setValue(formattedValue);\n\n if (onChange) onChange(event, { hours, mins, value: formattedValue });\n\n if (isCompleteTimeInput(formattedValue)) {\n const valid = formattedValue.length > 0 && isValidInputValue(formattedValue);\n\n if (!valid) return;\n\n if (onComplete) {\n onComplete(event, { hours, mins, value: formattedValue });\n }\n }\n };\n\n const handleClearClick = () => {\n setValue('');\n };\n\n return (\n <Input\n {...restProps}\n ref={ref}\n value={value}\n className={className}\n onChange={handleChange}\n onClear={handleClearClick}\n />\n );\n },\n);\n"],"names":["React","__rest","useState","format","isCompleteTimeInput","isValidInputValue","Input","__assign"],"mappings":";;;;;;;;;;;;;AAAA;AA0BA;;;AAGG;AACU,IAAA,SAAS,GAAGA,sBAAK,CAAC,UAAU,CACrC,UACI,EAAsF,EACtF,GAAG,EAAA;IADD,IAAA,EAAA,GAAA,EAAA,CAAA,YAAiB,EAAjB,YAAY,GAAA,EAAA,KAAA,MAAA,GAAG,EAAE,GAAA,EAAA,EAAS,SAAS,GAAA,EAAA,CAAA,KAAA,EAAE,QAAQ,cAAA,EAAE,UAAU,gBAAA,EAAE,SAAS,eAAA,EAAK,SAAS,GAApFC,YAAA,CAAA,EAAA,EAAA,CAAA,cAAA,EAAA,OAAA,EAAA,UAAA,EAAA,YAAA,EAAA,WAAA,CAAsF,CAAF;AAG9E,IAAA,IAAA,EAAoB,GAAAC,cAAQ,CAAC,SAAS,IAAI,YAAY,CAAC,EAAtD,KAAK,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,QAAQ,QAAuC;IAE7D,IAAM,YAAY,GAAG,UAAC,KAAoC,EAAA;AAC9C,QAAA,IAAO,QAAQ,GAAK,KAAK,CAAC,MAAM,MAAjB;AAEvB,QAAA,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC;YAAE;;AAGzB,QAAA,IAAI,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;YACzB
|
|
1
|
+
{"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nimport React, { type ChangeEvent, useState } from 'react';\n\nimport { Input, type InputProps } from '@alfalab/core-components-input';\n\nimport { format, isCompleteTimeInput, isValidInputValue } from './utils';\n\nexport type TimeInputProps = Omit<InputProps, 'onChange'> & {\n /**\n * Обработчик изменения значения\n */\n onChange?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n\n /**\n * Обработчик окончания ввода\n */\n onComplete?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n};\n\n/**\n * @deprecated\n * use UniversalDateInput instead\n */\nexport const TimeInput = React.forwardRef<HTMLInputElement, TimeInputProps>(\n (\n { defaultValue = '', value: propValue, onChange, onComplete, className, ...restProps },\n ref,\n ) => {\n const [value, setValue] = useState(propValue || defaultValue);\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n const { value: newValue } = event.target;\n\n if (newValue.length > 5) return;\n\n // Позволяем вводить только цифры и двоеточия\n if (/[^\\d:]/.test(newValue)) {\n return;\n }\n\n const colon = newValue.match(/\\:/g);\n\n // Не даем вводить больше, чем одно двоеточие\n if (colon && colon.length > 1) {\n return;\n }\n\n const formattedValue = format(newValue);\n\n const formattedValueArr = formattedValue.split(':');\n const hours = Number(formattedValueArr[0]);\n const mins = Number(formattedValueArr[1]);\n\n setValue(formattedValue);\n\n if (onChange) onChange(event, { hours, mins, value: formattedValue });\n\n if (isCompleteTimeInput(formattedValue)) {\n const valid = formattedValue.length > 0 && isValidInputValue(formattedValue);\n\n if (!valid) return;\n\n if (onComplete) {\n onComplete(event, { hours, mins, value: formattedValue });\n }\n }\n };\n\n const handleClearClick = () => {\n setValue('');\n };\n\n return (\n <Input\n {...restProps}\n ref={ref}\n value={value}\n className={className}\n onChange={handleChange}\n onClear={handleClearClick}\n />\n );\n },\n);\n"],"names":["React","__rest","useState","format","isCompleteTimeInput","isValidInputValue","Input","__assign"],"mappings":";;;;;;;;;;;;;AAAA;AA0BA;;;AAGG;AACU,IAAA,SAAS,GAAGA,sBAAK,CAAC,UAAU,CACrC,UACI,EAAsF,EACtF,GAAG,EAAA;IADD,IAAA,EAAA,GAAA,EAAA,CAAA,YAAiB,EAAjB,YAAY,GAAA,EAAA,KAAA,MAAA,GAAG,EAAE,GAAA,EAAA,EAAS,SAAS,GAAA,EAAA,CAAA,KAAA,EAAE,QAAQ,cAAA,EAAE,UAAU,gBAAA,EAAE,SAAS,eAAA,EAAK,SAAS,GAApFC,YAAA,CAAA,EAAA,EAAA,CAAA,cAAA,EAAA,OAAA,EAAA,UAAA,EAAA,YAAA,EAAA,WAAA,CAAsF,CAAF;AAG9E,IAAA,IAAA,EAAoB,GAAAC,cAAQ,CAAC,SAAS,IAAI,YAAY,CAAC,EAAtD,KAAK,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,QAAQ,QAAuC;IAE7D,IAAM,YAAY,GAAG,UAAC,KAAoC,EAAA;AAC9C,QAAA,IAAO,QAAQ,GAAK,KAAK,CAAC,MAAM,MAAjB;AAEvB,QAAA,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC;YAAE;;AAGzB,QAAA,IAAI,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;YACzB;;QAGJ,IAAM,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC;;QAGnC,IAAI,KAAK,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;YAC3B;;AAGJ,QAAA,IAAM,cAAc,GAAGC,aAAM,CAAC,QAAQ,CAAC;QAEvC,IAAM,iBAAiB,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG,CAAC;QACnD,IAAM,KAAK,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC;QAC1C,IAAM,IAAI,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC;QAEzC,QAAQ,CAAC,cAAc,CAAC;AAExB,QAAA,IAAI,QAAQ;AAAE,YAAA,QAAQ,CAAC,KAAK,EAAE,EAAE,KAAK,EAAA,KAAA,EAAE,IAAI,EAAA,IAAA,EAAE,KAAK,EAAE,cAAc,EAAE,CAAC;AAErE,QAAA,IAAIC,0BAAmB,CAAC,cAAc,CAAC,EAAE;AACrC,YAAA,IAAM,KAAK,GAAG,cAAc,CAAC,MAAM,GAAG,CAAC,IAAIC,wBAAiB,CAAC,cAAc,CAAC;AAE5E,YAAA,IAAI,CAAC,KAAK;gBAAE;YAEZ,IAAI,UAAU,EAAE;AACZ,gBAAA,UAAU,CAAC,KAAK,EAAE,EAAE,KAAK,EAAA,KAAA,EAAE,IAAI,EAAA,IAAA,EAAE,KAAK,EAAE,cAAc,EAAE,CAAC;;;AAGrE,KAAC;AAED,IAAA,IAAM,gBAAgB,GAAG,YAAA;QACrB,QAAQ,CAAC,EAAE,CAAC;AAChB,KAAC;IAED,QACIL,sBAAC,CAAA,aAAA,CAAAM,UAAK,EACEC,cAAA,CAAA,EAAA,EAAA,SAAS,EACb,EAAA,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,YAAY,EACtB,OAAO,EAAE,gBAAgB,EAC3B,CAAA,CAAA;AAEV,CAAC;;;;"}
|
package/cssm/utils/format.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"format.js","sources":["../../src/utils/format.ts"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nexport const DATE_MASK = [/\\d/, /\\d/, ':', /\\d/, /\\d/];\n\nexport const isCompleteTimeInput = (input: string) => input.length === DATE_MASK.length;\n\nexport const isValidTimeFormat = (value: string): boolean => {\n const timeArr = value.split(':');\n const hours = timeArr[0];\n const mins = timeArr[1];\n\n if (hours.length !== 2 || Number(hours) > 23) {\n return false;\n }\n\n if (mins.length !== 2 || Number(mins) > 59) {\n return false;\n }\n\n return true;\n};\n\nexport const isValidInputValue = (inputValue?: string) =>\n !inputValue || (isCompleteTimeInput(inputValue) && isValidTimeFormat(inputValue));\n\nexport const format = (value: string): string =>\n value\n .replace(/^(\\d\\d)(\\d)$/, '$1:$2') // 123 => 12:3\n .replace(/^(\\d\\d)(\\d\\d)/, '$1:$2') // 12345 => 12:45 (если вместо двоеточия введена цифра, она обратно заменяется на двоеточие)\n .replace(/^(\\d):(\\d\\d)(\\d)/, '$1:$2') // 1:234 => 1:23\n .replace(/\\:$/, ''); // 12: => 12 || : => void\n"],"names":[],"mappings":";;;;AAAA;AAEO,IAAM,SAAS,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI;AAExC,IAAA,mBAAmB,GAAG,UAAC,KAAa,EAAK,EAAA,OAAA,KAAK,CAAC,MAAM,KAAK,SAAS,CAAC,MAAM,CAAA;AAEhF,IAAM,iBAAiB,GAAG,UAAC,KAAa,EAAA;IAC3C,IAAM,OAAO,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;AAChC,IAAA,IAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC;AACxB,IAAA,IAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC;AAEvB,IAAA,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,GAAG,EAAE,EAAE;AAC1C,QAAA,OAAO,KAAK
|
|
1
|
+
{"version":3,"file":"format.js","sources":["../../src/utils/format.ts"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nexport const DATE_MASK = [/\\d/, /\\d/, ':', /\\d/, /\\d/];\n\nexport const isCompleteTimeInput = (input: string) => input.length === DATE_MASK.length;\n\nexport const isValidTimeFormat = (value: string): boolean => {\n const timeArr = value.split(':');\n const hours = timeArr[0];\n const mins = timeArr[1];\n\n if (hours.length !== 2 || Number(hours) > 23) {\n return false;\n }\n\n if (mins.length !== 2 || Number(mins) > 59) {\n return false;\n }\n\n return true;\n};\n\nexport const isValidInputValue = (inputValue?: string) =>\n !inputValue || (isCompleteTimeInput(inputValue) && isValidTimeFormat(inputValue));\n\nexport const format = (value: string): string =>\n value\n .replace(/^(\\d\\d)(\\d)$/, '$1:$2') // 123 => 12:3\n .replace(/^(\\d\\d)(\\d\\d)/, '$1:$2') // 12345 => 12:45 (если вместо двоеточия введена цифра, она обратно заменяется на двоеточие)\n .replace(/^(\\d):(\\d\\d)(\\d)/, '$1:$2') // 1:234 => 1:23\n .replace(/\\:$/, ''); // 12: => 12 || : => void\n"],"names":[],"mappings":";;;;AAAA;AAEO,IAAM,SAAS,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI;AAExC,IAAA,mBAAmB,GAAG,UAAC,KAAa,EAAK,EAAA,OAAA,KAAK,CAAC,MAAM,KAAK,SAAS,CAAC,MAAM,CAAA;AAEhF,IAAM,iBAAiB,GAAG,UAAC,KAAa,EAAA;IAC3C,IAAM,OAAO,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;AAChC,IAAA,IAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC;AACxB,IAAA,IAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC;AAEvB,IAAA,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,GAAG,EAAE,EAAE;AAC1C,QAAA,OAAO,KAAK;;AAGhB,IAAA,IAAI,IAAI,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG,EAAE,EAAE;AACxC,QAAA,OAAO,KAAK;;AAGhB,IAAA,OAAO,IAAI;AACf;AAEO,IAAM,iBAAiB,GAAG,UAAC,UAAmB,EAAA;AACjD,IAAA,OAAA,CAAC,UAAU,KAAK,mBAAmB,CAAC,UAAU,CAAC,IAAI,iBAAiB,CAAC,UAAU,CAAC,CAAC;AAAjF;AAEG,IAAM,MAAM,GAAG,UAAC,KAAa,EAAA;AAChC,IAAA,OAAA;AACK,SAAA,OAAO,CAAC,cAAc,EAAE,OAAO,CAAC;AAChC,SAAA,OAAO,CAAC,eAAe,EAAE,OAAO,CAAC;AACjC,SAAA,OAAO,CAAC,kBAAkB,EAAE,OAAO,CAAC;AACpC,SAAA,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC;AAJvB,EAIwB;;;;;;;;"}
|
package/esm/Component.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { type ChangeEvent } from 'react';
|
|
2
2
|
import { type InputProps } from '@alfalab/core-components-input/esm';
|
|
3
|
-
export
|
|
3
|
+
export type TimeInputProps = Omit<InputProps, 'onChange'> & {
|
|
4
4
|
/**
|
|
5
5
|
* Обработчик изменения значения
|
|
6
6
|
*/
|
|
@@ -26,17 +26,17 @@ export declare const TimeInput: React.ForwardRefExoticComponent<Omit<InputProps,
|
|
|
26
26
|
/**
|
|
27
27
|
* Обработчик изменения значения
|
|
28
28
|
*/
|
|
29
|
-
onChange?: (
|
|
29
|
+
onChange?: (event: ChangeEvent<HTMLInputElement>, payload: {
|
|
30
30
|
hours: number;
|
|
31
31
|
mins: number;
|
|
32
32
|
value: string;
|
|
33
|
-
}) => void
|
|
33
|
+
}) => void;
|
|
34
34
|
/**
|
|
35
35
|
* Обработчик окончания ввода
|
|
36
36
|
*/
|
|
37
|
-
onComplete?: (
|
|
37
|
+
onComplete?: (event: ChangeEvent<HTMLInputElement>, payload: {
|
|
38
38
|
hours: number;
|
|
39
39
|
mins: number;
|
|
40
40
|
value: string;
|
|
41
|
-
}) => void
|
|
41
|
+
}) => void;
|
|
42
42
|
} & React.RefAttributes<HTMLInputElement>>;
|
package/esm/Component.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nimport React, { type ChangeEvent, useState } from 'react';\n\nimport { Input, type InputProps } from '@alfalab/core-components-input';\n\nimport { format, isCompleteTimeInput, isValidInputValue } from './utils';\n\nexport type TimeInputProps = Omit<InputProps, 'onChange'> & {\n /**\n * Обработчик изменения значения\n */\n onChange?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n\n /**\n * Обработчик окончания ввода\n */\n onComplete?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n};\n\n/**\n * @deprecated\n * use UniversalDateInput instead\n */\nexport const TimeInput = React.forwardRef<HTMLInputElement, TimeInputProps>(\n (\n { defaultValue = '', value: propValue, onChange, onComplete, className, ...restProps },\n ref,\n ) => {\n const [value, setValue] = useState(propValue || defaultValue);\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n const { value: newValue } = event.target;\n\n if (newValue.length > 5) return;\n\n // Позволяем вводить только цифры и двоеточия\n if (/[^\\d:]/.test(newValue)) {\n return;\n }\n\n const colon = newValue.match(/\\:/g);\n\n // Не даем вводить больше, чем одно двоеточие\n if (colon && colon.length > 1) {\n return;\n }\n\n const formattedValue = format(newValue);\n\n const formattedValueArr = formattedValue.split(':');\n const hours = Number(formattedValueArr[0]);\n const mins = Number(formattedValueArr[1]);\n\n setValue(formattedValue);\n\n if (onChange) onChange(event, { hours, mins, value: formattedValue });\n\n if (isCompleteTimeInput(formattedValue)) {\n const valid = formattedValue.length > 0 && isValidInputValue(formattedValue);\n\n if (!valid) return;\n\n if (onComplete) {\n onComplete(event, { hours, mins, value: formattedValue });\n }\n }\n };\n\n const handleClearClick = () => {\n setValue('');\n };\n\n return (\n <Input\n {...restProps}\n ref={ref}\n value={value}\n className={className}\n onChange={handleChange}\n onClear={handleClearClick}\n />\n );\n },\n);\n"],"names":[],"mappings":";;;;;AAAA;AA0BA;;;AAGG;AACU,IAAA,SAAS,GAAG,KAAK,CAAC,UAAU,CACrC,UACI,EAAsF,EACtF,GAAG,EAAA;IADD,IAAA,EAAA,GAAA,EAAA,CAAA,YAAiB,EAAjB,YAAY,GAAA,EAAA,KAAA,MAAA,GAAG,EAAE,GAAA,EAAA,EAAS,SAAS,GAAA,EAAA,CAAA,KAAA,EAAE,QAAQ,cAAA,EAAE,UAAU,gBAAA,EAAE,SAAS,eAAA,EAAK,SAAS,GAApF,MAAA,CAAA,EAAA,EAAA,CAAA,cAAA,EAAA,OAAA,EAAA,UAAA,EAAA,YAAA,EAAA,WAAA,CAAsF,CAAF;AAG9E,IAAA,IAAA,EAAoB,GAAA,QAAQ,CAAC,SAAS,IAAI,YAAY,CAAC,EAAtD,KAAK,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,QAAQ,QAAuC;IAE7D,IAAM,YAAY,GAAG,UAAC,KAAoC,EAAA;AAC9C,QAAA,IAAO,QAAQ,GAAK,KAAK,CAAC,MAAM,MAAjB;AAEvB,QAAA,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC;YAAE;;AAGzB,QAAA,IAAI,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;YACzB
|
|
1
|
+
{"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nimport React, { type ChangeEvent, useState } from 'react';\n\nimport { Input, type InputProps } from '@alfalab/core-components-input';\n\nimport { format, isCompleteTimeInput, isValidInputValue } from './utils';\n\nexport type TimeInputProps = Omit<InputProps, 'onChange'> & {\n /**\n * Обработчик изменения значения\n */\n onChange?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n\n /**\n * Обработчик окончания ввода\n */\n onComplete?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n};\n\n/**\n * @deprecated\n * use UniversalDateInput instead\n */\nexport const TimeInput = React.forwardRef<HTMLInputElement, TimeInputProps>(\n (\n { defaultValue = '', value: propValue, onChange, onComplete, className, ...restProps },\n ref,\n ) => {\n const [value, setValue] = useState(propValue || defaultValue);\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n const { value: newValue } = event.target;\n\n if (newValue.length > 5) return;\n\n // Позволяем вводить только цифры и двоеточия\n if (/[^\\d:]/.test(newValue)) {\n return;\n }\n\n const colon = newValue.match(/\\:/g);\n\n // Не даем вводить больше, чем одно двоеточие\n if (colon && colon.length > 1) {\n return;\n }\n\n const formattedValue = format(newValue);\n\n const formattedValueArr = formattedValue.split(':');\n const hours = Number(formattedValueArr[0]);\n const mins = Number(formattedValueArr[1]);\n\n setValue(formattedValue);\n\n if (onChange) onChange(event, { hours, mins, value: formattedValue });\n\n if (isCompleteTimeInput(formattedValue)) {\n const valid = formattedValue.length > 0 && isValidInputValue(formattedValue);\n\n if (!valid) return;\n\n if (onComplete) {\n onComplete(event, { hours, mins, value: formattedValue });\n }\n }\n };\n\n const handleClearClick = () => {\n setValue('');\n };\n\n return (\n <Input\n {...restProps}\n ref={ref}\n value={value}\n className={className}\n onChange={handleChange}\n onClear={handleClearClick}\n />\n );\n },\n);\n"],"names":[],"mappings":";;;;;AAAA;AA0BA;;;AAGG;AACU,IAAA,SAAS,GAAG,KAAK,CAAC,UAAU,CACrC,UACI,EAAsF,EACtF,GAAG,EAAA;IADD,IAAA,EAAA,GAAA,EAAA,CAAA,YAAiB,EAAjB,YAAY,GAAA,EAAA,KAAA,MAAA,GAAG,EAAE,GAAA,EAAA,EAAS,SAAS,GAAA,EAAA,CAAA,KAAA,EAAE,QAAQ,cAAA,EAAE,UAAU,gBAAA,EAAE,SAAS,eAAA,EAAK,SAAS,GAApF,MAAA,CAAA,EAAA,EAAA,CAAA,cAAA,EAAA,OAAA,EAAA,UAAA,EAAA,YAAA,EAAA,WAAA,CAAsF,CAAF;AAG9E,IAAA,IAAA,EAAoB,GAAA,QAAQ,CAAC,SAAS,IAAI,YAAY,CAAC,EAAtD,KAAK,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,QAAQ,QAAuC;IAE7D,IAAM,YAAY,GAAG,UAAC,KAAoC,EAAA;AAC9C,QAAA,IAAO,QAAQ,GAAK,KAAK,CAAC,MAAM,MAAjB;AAEvB,QAAA,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC;YAAE;;AAGzB,QAAA,IAAI,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;YACzB;;QAGJ,IAAM,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC;;QAGnC,IAAI,KAAK,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;YAC3B;;AAGJ,QAAA,IAAM,cAAc,GAAG,MAAM,CAAC,QAAQ,CAAC;QAEvC,IAAM,iBAAiB,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG,CAAC;QACnD,IAAM,KAAK,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC;QAC1C,IAAM,IAAI,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC;QAEzC,QAAQ,CAAC,cAAc,CAAC;AAExB,QAAA,IAAI,QAAQ;AAAE,YAAA,QAAQ,CAAC,KAAK,EAAE,EAAE,KAAK,EAAA,KAAA,EAAE,IAAI,EAAA,IAAA,EAAE,KAAK,EAAE,cAAc,EAAE,CAAC;AAErE,QAAA,IAAI,mBAAmB,CAAC,cAAc,CAAC,EAAE;AACrC,YAAA,IAAM,KAAK,GAAG,cAAc,CAAC,MAAM,GAAG,CAAC,IAAI,iBAAiB,CAAC,cAAc,CAAC;AAE5E,YAAA,IAAI,CAAC,KAAK;gBAAE;YAEZ,IAAI,UAAU,EAAE;AACZ,gBAAA,UAAU,CAAC,KAAK,EAAE,EAAE,KAAK,EAAA,KAAA,EAAE,IAAI,EAAA,IAAA,EAAE,KAAK,EAAE,cAAc,EAAE,CAAC;;;AAGrE,KAAC;AAED,IAAA,IAAM,gBAAgB,GAAG,YAAA;QACrB,QAAQ,CAAC,EAAE,CAAC;AAChB,KAAC;IAED,QACI,KAAC,CAAA,aAAA,CAAA,KAAK,EACE,QAAA,CAAA,EAAA,EAAA,SAAS,EACb,EAAA,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,YAAY,EACtB,OAAO,EAAE,gBAAgB,EAC3B,CAAA,CAAA;AAEV,CAAC;;;;"}
|
package/esm/utils/format.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"format.js","sources":["../../src/utils/format.ts"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nexport const DATE_MASK = [/\\d/, /\\d/, ':', /\\d/, /\\d/];\n\nexport const isCompleteTimeInput = (input: string) => input.length === DATE_MASK.length;\n\nexport const isValidTimeFormat = (value: string): boolean => {\n const timeArr = value.split(':');\n const hours = timeArr[0];\n const mins = timeArr[1];\n\n if (hours.length !== 2 || Number(hours) > 23) {\n return false;\n }\n\n if (mins.length !== 2 || Number(mins) > 59) {\n return false;\n }\n\n return true;\n};\n\nexport const isValidInputValue = (inputValue?: string) =>\n !inputValue || (isCompleteTimeInput(inputValue) && isValidTimeFormat(inputValue));\n\nexport const format = (value: string): string =>\n value\n .replace(/^(\\d\\d)(\\d)$/, '$1:$2') // 123 => 12:3\n .replace(/^(\\d\\d)(\\d\\d)/, '$1:$2') // 12345 => 12:45 (если вместо двоеточия введена цифра, она обратно заменяется на двоеточие)\n .replace(/^(\\d):(\\d\\d)(\\d)/, '$1:$2') // 1:234 => 1:23\n .replace(/\\:$/, ''); // 12: => 12 || : => void\n"],"names":[],"mappings":"AAAA;AAEO,IAAM,SAAS,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI;AAExC,IAAA,mBAAmB,GAAG,UAAC,KAAa,EAAK,EAAA,OAAA,KAAK,CAAC,MAAM,KAAK,SAAS,CAAC,MAAM,CAAA;AAEhF,IAAM,iBAAiB,GAAG,UAAC,KAAa,EAAA;IAC3C,IAAM,OAAO,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;AAChC,IAAA,IAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC;AACxB,IAAA,IAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC;AAEvB,IAAA,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,GAAG,EAAE,EAAE;AAC1C,QAAA,OAAO,KAAK
|
|
1
|
+
{"version":3,"file":"format.js","sources":["../../src/utils/format.ts"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nexport const DATE_MASK = [/\\d/, /\\d/, ':', /\\d/, /\\d/];\n\nexport const isCompleteTimeInput = (input: string) => input.length === DATE_MASK.length;\n\nexport const isValidTimeFormat = (value: string): boolean => {\n const timeArr = value.split(':');\n const hours = timeArr[0];\n const mins = timeArr[1];\n\n if (hours.length !== 2 || Number(hours) > 23) {\n return false;\n }\n\n if (mins.length !== 2 || Number(mins) > 59) {\n return false;\n }\n\n return true;\n};\n\nexport const isValidInputValue = (inputValue?: string) =>\n !inputValue || (isCompleteTimeInput(inputValue) && isValidTimeFormat(inputValue));\n\nexport const format = (value: string): string =>\n value\n .replace(/^(\\d\\d)(\\d)$/, '$1:$2') // 123 => 12:3\n .replace(/^(\\d\\d)(\\d\\d)/, '$1:$2') // 12345 => 12:45 (если вместо двоеточия введена цифра, она обратно заменяется на двоеточие)\n .replace(/^(\\d):(\\d\\d)(\\d)/, '$1:$2') // 1:234 => 1:23\n .replace(/\\:$/, ''); // 12: => 12 || : => void\n"],"names":[],"mappings":"AAAA;AAEO,IAAM,SAAS,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI;AAExC,IAAA,mBAAmB,GAAG,UAAC,KAAa,EAAK,EAAA,OAAA,KAAK,CAAC,MAAM,KAAK,SAAS,CAAC,MAAM,CAAA;AAEhF,IAAM,iBAAiB,GAAG,UAAC,KAAa,EAAA;IAC3C,IAAM,OAAO,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;AAChC,IAAA,IAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC;AACxB,IAAA,IAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC;AAEvB,IAAA,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,GAAG,EAAE,EAAE;AAC1C,QAAA,OAAO,KAAK;;AAGhB,IAAA,IAAI,IAAI,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG,EAAE,EAAE;AACxC,QAAA,OAAO,KAAK;;AAGhB,IAAA,OAAO,IAAI;AACf;AAEO,IAAM,iBAAiB,GAAG,UAAC,UAAmB,EAAA;AACjD,IAAA,OAAA,CAAC,UAAU,KAAK,mBAAmB,CAAC,UAAU,CAAC,IAAI,iBAAiB,CAAC,UAAU,CAAC,CAAC;AAAjF;AAEG,IAAM,MAAM,GAAG,UAAC,KAAa,EAAA;AAChC,IAAA,OAAA;AACK,SAAA,OAAO,CAAC,cAAc,EAAE,OAAO,CAAC;AAChC,SAAA,OAAO,CAAC,eAAe,EAAE,OAAO,CAAC;AACjC,SAAA,OAAO,CAAC,kBAAkB,EAAE,OAAO,CAAC;AACpC,SAAA,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC;AAJvB,EAIwB;;;;"}
|
package/modern/Component.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { type ChangeEvent } from 'react';
|
|
2
2
|
import { type InputProps } from '@alfalab/core-components-input/modern';
|
|
3
|
-
export
|
|
3
|
+
export type TimeInputProps = Omit<InputProps, 'onChange'> & {
|
|
4
4
|
/**
|
|
5
5
|
* Обработчик изменения значения
|
|
6
6
|
*/
|
|
@@ -26,17 +26,17 @@ export declare const TimeInput: React.ForwardRefExoticComponent<Omit<InputProps,
|
|
|
26
26
|
/**
|
|
27
27
|
* Обработчик изменения значения
|
|
28
28
|
*/
|
|
29
|
-
onChange?: (
|
|
29
|
+
onChange?: (event: ChangeEvent<HTMLInputElement>, payload: {
|
|
30
30
|
hours: number;
|
|
31
31
|
mins: number;
|
|
32
32
|
value: string;
|
|
33
|
-
}) => void
|
|
33
|
+
}) => void;
|
|
34
34
|
/**
|
|
35
35
|
* Обработчик окончания ввода
|
|
36
36
|
*/
|
|
37
|
-
onComplete?: (
|
|
37
|
+
onComplete?: (event: ChangeEvent<HTMLInputElement>, payload: {
|
|
38
38
|
hours: number;
|
|
39
39
|
mins: number;
|
|
40
40
|
value: string;
|
|
41
|
-
}) => void
|
|
41
|
+
}) => void;
|
|
42
42
|
} & React.RefAttributes<HTMLInputElement>>;
|
package/modern/Component.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nimport React, { type ChangeEvent, useState } from 'react';\n\nimport { Input, type InputProps } from '@alfalab/core-components-input';\n\nimport { format, isCompleteTimeInput, isValidInputValue } from './utils';\n\nexport type TimeInputProps = Omit<InputProps, 'onChange'> & {\n /**\n * Обработчик изменения значения\n */\n onChange?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n\n /**\n * Обработчик окончания ввода\n */\n onComplete?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n};\n\n/**\n * @deprecated\n * use UniversalDateInput instead\n */\nexport const TimeInput = React.forwardRef<HTMLInputElement, TimeInputProps>(\n (\n { defaultValue = '', value: propValue, onChange, onComplete, className, ...restProps },\n ref,\n ) => {\n const [value, setValue] = useState(propValue || defaultValue);\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n const { value: newValue } = event.target;\n\n if (newValue.length > 5) return;\n\n // Позволяем вводить только цифры и двоеточия\n if (/[^\\d:]/.test(newValue)) {\n return;\n }\n\n const colon = newValue.match(/\\:/g);\n\n // Не даем вводить больше, чем одно двоеточие\n if (colon && colon.length > 1) {\n return;\n }\n\n const formattedValue = format(newValue);\n\n const formattedValueArr = formattedValue.split(':');\n const hours = Number(formattedValueArr[0]);\n const mins = Number(formattedValueArr[1]);\n\n setValue(formattedValue);\n\n if (onChange) onChange(event, { hours, mins, value: formattedValue });\n\n if (isCompleteTimeInput(formattedValue)) {\n const valid = formattedValue.length > 0 && isValidInputValue(formattedValue);\n\n if (!valid) return;\n\n if (onComplete) {\n onComplete(event, { hours, mins, value: formattedValue });\n }\n }\n };\n\n const handleClearClick = () => {\n setValue('');\n };\n\n return (\n <Input\n {...restProps}\n ref={ref}\n value={value}\n className={className}\n onChange={handleChange}\n onClear={handleClearClick}\n />\n );\n },\n);\n"],"names":[],"mappings":";;;;AAAA;AA0BA;;;AAGG;AACI,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CACrC,CACI,EAAE,YAAY,GAAG,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EACtF,GAAG,KACH;AACA,IAAA,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,SAAS,IAAI,YAAY,CAAC;AAE7D,IAAA,MAAM,YAAY,GAAG,CAAC,KAAoC,KAAI;QAC1D,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC,MAAM;AAExC,QAAA,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC;YAAE;;AAGzB,QAAA,IAAI,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;YACzB
|
|
1
|
+
{"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nimport React, { type ChangeEvent, useState } from 'react';\n\nimport { Input, type InputProps } from '@alfalab/core-components-input';\n\nimport { format, isCompleteTimeInput, isValidInputValue } from './utils';\n\nexport type TimeInputProps = Omit<InputProps, 'onChange'> & {\n /**\n * Обработчик изменения значения\n */\n onChange?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n\n /**\n * Обработчик окончания ввода\n */\n onComplete?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n};\n\n/**\n * @deprecated\n * use UniversalDateInput instead\n */\nexport const TimeInput = React.forwardRef<HTMLInputElement, TimeInputProps>(\n (\n { defaultValue = '', value: propValue, onChange, onComplete, className, ...restProps },\n ref,\n ) => {\n const [value, setValue] = useState(propValue || defaultValue);\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n const { value: newValue } = event.target;\n\n if (newValue.length > 5) return;\n\n // Позволяем вводить только цифры и двоеточия\n if (/[^\\d:]/.test(newValue)) {\n return;\n }\n\n const colon = newValue.match(/\\:/g);\n\n // Не даем вводить больше, чем одно двоеточие\n if (colon && colon.length > 1) {\n return;\n }\n\n const formattedValue = format(newValue);\n\n const formattedValueArr = formattedValue.split(':');\n const hours = Number(formattedValueArr[0]);\n const mins = Number(formattedValueArr[1]);\n\n setValue(formattedValue);\n\n if (onChange) onChange(event, { hours, mins, value: formattedValue });\n\n if (isCompleteTimeInput(formattedValue)) {\n const valid = formattedValue.length > 0 && isValidInputValue(formattedValue);\n\n if (!valid) return;\n\n if (onComplete) {\n onComplete(event, { hours, mins, value: formattedValue });\n }\n }\n };\n\n const handleClearClick = () => {\n setValue('');\n };\n\n return (\n <Input\n {...restProps}\n ref={ref}\n value={value}\n className={className}\n onChange={handleChange}\n onClear={handleClearClick}\n />\n );\n },\n);\n"],"names":[],"mappings":";;;;AAAA;AA0BA;;;AAGG;AACI,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CACrC,CACI,EAAE,YAAY,GAAG,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EACtF,GAAG,KACH;AACA,IAAA,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,SAAS,IAAI,YAAY,CAAC;AAE7D,IAAA,MAAM,YAAY,GAAG,CAAC,KAAoC,KAAI;QAC1D,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC,MAAM;AAExC,QAAA,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC;YAAE;;AAGzB,QAAA,IAAI,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;YACzB;;QAGJ,MAAM,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC;;QAGnC,IAAI,KAAK,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;YAC3B;;AAGJ,QAAA,MAAM,cAAc,GAAG,MAAM,CAAC,QAAQ,CAAC;QAEvC,MAAM,iBAAiB,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG,CAAC;QACnD,MAAM,KAAK,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC;QAC1C,MAAM,IAAI,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC;QAEzC,QAAQ,CAAC,cAAc,CAAC;AAExB,QAAA,IAAI,QAAQ;AAAE,YAAA,QAAQ,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,cAAc,EAAE,CAAC;AAErE,QAAA,IAAI,mBAAmB,CAAC,cAAc,CAAC,EAAE;AACrC,YAAA,MAAM,KAAK,GAAG,cAAc,CAAC,MAAM,GAAG,CAAC,IAAI,iBAAiB,CAAC,cAAc,CAAC;AAE5E,YAAA,IAAI,CAAC,KAAK;gBAAE;YAEZ,IAAI,UAAU,EAAE;AACZ,gBAAA,UAAU,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,cAAc,EAAE,CAAC;;;AAGrE,KAAC;IAED,MAAM,gBAAgB,GAAG,MAAK;QAC1B,QAAQ,CAAC,EAAE,CAAC;AAChB,KAAC;IAED,QACI,KAAC,CAAA,aAAA,CAAA,KAAK,EACE,EAAA,GAAA,SAAS,EACb,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,YAAY,EACtB,OAAO,EAAE,gBAAgB,EAC3B,CAAA;AAEV,CAAC;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"format.js","sources":["../../src/utils/format.ts"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nexport const DATE_MASK = [/\\d/, /\\d/, ':', /\\d/, /\\d/];\n\nexport const isCompleteTimeInput = (input: string) => input.length === DATE_MASK.length;\n\nexport const isValidTimeFormat = (value: string): boolean => {\n const timeArr = value.split(':');\n const hours = timeArr[0];\n const mins = timeArr[1];\n\n if (hours.length !== 2 || Number(hours) > 23) {\n return false;\n }\n\n if (mins.length !== 2 || Number(mins) > 59) {\n return false;\n }\n\n return true;\n};\n\nexport const isValidInputValue = (inputValue?: string) =>\n !inputValue || (isCompleteTimeInput(inputValue) && isValidTimeFormat(inputValue));\n\nexport const format = (value: string): string =>\n value\n .replace(/^(\\d\\d)(\\d)$/, '$1:$2') // 123 => 12:3\n .replace(/^(\\d\\d)(\\d\\d)/, '$1:$2') // 12345 => 12:45 (если вместо двоеточия введена цифра, она обратно заменяется на двоеточие)\n .replace(/^(\\d):(\\d\\d)(\\d)/, '$1:$2') // 1:234 => 1:23\n .replace(/\\:$/, ''); // 12: => 12 || : => void\n"],"names":[],"mappings":"AAAA;AAEO,MAAM,SAAS,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI;AAExC,MAAA,mBAAmB,GAAG,CAAC,KAAa,KAAK,KAAK,CAAC,MAAM,KAAK,SAAS,CAAC;AAEpE,MAAA,iBAAiB,GAAG,CAAC,KAAa,KAAa;IACxD,MAAM,OAAO,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;AAChC,IAAA,MAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC;AACxB,IAAA,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC;AAEvB,IAAA,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,GAAG,EAAE,EAAE;AAC1C,QAAA,OAAO,KAAK
|
|
1
|
+
{"version":3,"file":"format.js","sources":["../../src/utils/format.ts"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nexport const DATE_MASK = [/\\d/, /\\d/, ':', /\\d/, /\\d/];\n\nexport const isCompleteTimeInput = (input: string) => input.length === DATE_MASK.length;\n\nexport const isValidTimeFormat = (value: string): boolean => {\n const timeArr = value.split(':');\n const hours = timeArr[0];\n const mins = timeArr[1];\n\n if (hours.length !== 2 || Number(hours) > 23) {\n return false;\n }\n\n if (mins.length !== 2 || Number(mins) > 59) {\n return false;\n }\n\n return true;\n};\n\nexport const isValidInputValue = (inputValue?: string) =>\n !inputValue || (isCompleteTimeInput(inputValue) && isValidTimeFormat(inputValue));\n\nexport const format = (value: string): string =>\n value\n .replace(/^(\\d\\d)(\\d)$/, '$1:$2') // 123 => 12:3\n .replace(/^(\\d\\d)(\\d\\d)/, '$1:$2') // 12345 => 12:45 (если вместо двоеточия введена цифра, она обратно заменяется на двоеточие)\n .replace(/^(\\d):(\\d\\d)(\\d)/, '$1:$2') // 1:234 => 1:23\n .replace(/\\:$/, ''); // 12: => 12 || : => void\n"],"names":[],"mappings":"AAAA;AAEO,MAAM,SAAS,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI;AAExC,MAAA,mBAAmB,GAAG,CAAC,KAAa,KAAK,KAAK,CAAC,MAAM,KAAK,SAAS,CAAC;AAEpE,MAAA,iBAAiB,GAAG,CAAC,KAAa,KAAa;IACxD,MAAM,OAAO,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;AAChC,IAAA,MAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC;AACxB,IAAA,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC;AAEvB,IAAA,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,GAAG,EAAE,EAAE;AAC1C,QAAA,OAAO,KAAK;;AAGhB,IAAA,IAAI,IAAI,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG,EAAE,EAAE;AACxC,QAAA,OAAO,KAAK;;AAGhB,IAAA,OAAO,IAAI;AACf;MAEa,iBAAiB,GAAG,CAAC,UAAmB,KACjD,CAAC,UAAU,KAAK,mBAAmB,CAAC,UAAU,CAAC,IAAI,iBAAiB,CAAC,UAAU,CAAC;MAEvE,MAAM,GAAG,CAAC,KAAa,KAChC;AACK,KAAA,OAAO,CAAC,cAAc,EAAE,OAAO,CAAC;AAChC,KAAA,OAAO,CAAC,eAAe,EAAE,OAAO,CAAC;AACjC,KAAA,OAAO,CAAC,kBAAkB,EAAE,OAAO,CAAC;AACpC,KAAA,OAAO,CAAC,KAAK,EAAE,EAAE,EAAE;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { type ChangeEvent } from 'react';
|
|
2
2
|
import { type InputProps } from '@alfalab/core-components-input/moderncssm';
|
|
3
|
-
export
|
|
3
|
+
export type TimeInputProps = Omit<InputProps, 'onChange'> & {
|
|
4
4
|
/**
|
|
5
5
|
* Обработчик изменения значения
|
|
6
6
|
*/
|
|
@@ -26,17 +26,17 @@ export declare const TimeInput: React.ForwardRefExoticComponent<Omit<InputProps,
|
|
|
26
26
|
/**
|
|
27
27
|
* Обработчик изменения значения
|
|
28
28
|
*/
|
|
29
|
-
onChange?: (
|
|
29
|
+
onChange?: (event: ChangeEvent<HTMLInputElement>, payload: {
|
|
30
30
|
hours: number;
|
|
31
31
|
mins: number;
|
|
32
32
|
value: string;
|
|
33
|
-
}) => void
|
|
33
|
+
}) => void;
|
|
34
34
|
/**
|
|
35
35
|
* Обработчик окончания ввода
|
|
36
36
|
*/
|
|
37
|
-
onComplete?: (
|
|
37
|
+
onComplete?: (event: ChangeEvent<HTMLInputElement>, payload: {
|
|
38
38
|
hours: number;
|
|
39
39
|
mins: number;
|
|
40
40
|
value: string;
|
|
41
|
-
}) => void
|
|
41
|
+
}) => void;
|
|
42
42
|
} & React.RefAttributes<HTMLInputElement>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nimport React, { type ChangeEvent, useState } from 'react';\n\nimport { Input, type InputProps } from '@alfalab/core-components-input';\n\nimport { format, isCompleteTimeInput, isValidInputValue } from './utils';\n\nexport type TimeInputProps = Omit<InputProps, 'onChange'> & {\n /**\n * Обработчик изменения значения\n */\n onChange?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n\n /**\n * Обработчик окончания ввода\n */\n onComplete?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n};\n\n/**\n * @deprecated\n * use UniversalDateInput instead\n */\nexport const TimeInput = React.forwardRef<HTMLInputElement, TimeInputProps>(\n (\n { defaultValue = '', value: propValue, onChange, onComplete, className, ...restProps },\n ref,\n ) => {\n const [value, setValue] = useState(propValue || defaultValue);\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n const { value: newValue } = event.target;\n\n if (newValue.length > 5) return;\n\n // Позволяем вводить только цифры и двоеточия\n if (/[^\\d:]/.test(newValue)) {\n return;\n }\n\n const colon = newValue.match(/\\:/g);\n\n // Не даем вводить больше, чем одно двоеточие\n if (colon && colon.length > 1) {\n return;\n }\n\n const formattedValue = format(newValue);\n\n const formattedValueArr = formattedValue.split(':');\n const hours = Number(formattedValueArr[0]);\n const mins = Number(formattedValueArr[1]);\n\n setValue(formattedValue);\n\n if (onChange) onChange(event, { hours, mins, value: formattedValue });\n\n if (isCompleteTimeInput(formattedValue)) {\n const valid = formattedValue.length > 0 && isValidInputValue(formattedValue);\n\n if (!valid) return;\n\n if (onComplete) {\n onComplete(event, { hours, mins, value: formattedValue });\n }\n }\n };\n\n const handleClearClick = () => {\n setValue('');\n };\n\n return (\n <Input\n {...restProps}\n ref={ref}\n value={value}\n className={className}\n onChange={handleChange}\n onClear={handleClearClick}\n />\n );\n },\n);\n"],"names":[],"mappings":";;;;AAAA;AA0BA;;;AAGG;AACI,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CACrC,CACI,EAAE,YAAY,GAAG,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EACtF,GAAG,KACH;AACA,IAAA,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,SAAS,IAAI,YAAY,CAAC;AAE7D,IAAA,MAAM,YAAY,GAAG,CAAC,KAAoC,KAAI;QAC1D,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC,MAAM;AAExC,QAAA,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC;YAAE;;AAGzB,QAAA,IAAI,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;YACzB
|
|
1
|
+
{"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nimport React, { type ChangeEvent, useState } from 'react';\n\nimport { Input, type InputProps } from '@alfalab/core-components-input';\n\nimport { format, isCompleteTimeInput, isValidInputValue } from './utils';\n\nexport type TimeInputProps = Omit<InputProps, 'onChange'> & {\n /**\n * Обработчик изменения значения\n */\n onChange?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n\n /**\n * Обработчик окончания ввода\n */\n onComplete?: (\n event: ChangeEvent<HTMLInputElement>,\n payload: { hours: number; mins: number; value: string },\n ) => void;\n};\n\n/**\n * @deprecated\n * use UniversalDateInput instead\n */\nexport const TimeInput = React.forwardRef<HTMLInputElement, TimeInputProps>(\n (\n { defaultValue = '', value: propValue, onChange, onComplete, className, ...restProps },\n ref,\n ) => {\n const [value, setValue] = useState(propValue || defaultValue);\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n const { value: newValue } = event.target;\n\n if (newValue.length > 5) return;\n\n // Позволяем вводить только цифры и двоеточия\n if (/[^\\d:]/.test(newValue)) {\n return;\n }\n\n const colon = newValue.match(/\\:/g);\n\n // Не даем вводить больше, чем одно двоеточие\n if (colon && colon.length > 1) {\n return;\n }\n\n const formattedValue = format(newValue);\n\n const formattedValueArr = formattedValue.split(':');\n const hours = Number(formattedValueArr[0]);\n const mins = Number(formattedValueArr[1]);\n\n setValue(formattedValue);\n\n if (onChange) onChange(event, { hours, mins, value: formattedValue });\n\n if (isCompleteTimeInput(formattedValue)) {\n const valid = formattedValue.length > 0 && isValidInputValue(formattedValue);\n\n if (!valid) return;\n\n if (onComplete) {\n onComplete(event, { hours, mins, value: formattedValue });\n }\n }\n };\n\n const handleClearClick = () => {\n setValue('');\n };\n\n return (\n <Input\n {...restProps}\n ref={ref}\n value={value}\n className={className}\n onChange={handleChange}\n onClear={handleClearClick}\n />\n );\n },\n);\n"],"names":[],"mappings":";;;;AAAA;AA0BA;;;AAGG;AACI,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CACrC,CACI,EAAE,YAAY,GAAG,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EACtF,GAAG,KACH;AACA,IAAA,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,SAAS,IAAI,YAAY,CAAC;AAE7D,IAAA,MAAM,YAAY,GAAG,CAAC,KAAoC,KAAI;QAC1D,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC,MAAM;AAExC,QAAA,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC;YAAE;;AAGzB,QAAA,IAAI,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;YACzB;;QAGJ,MAAM,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC;;QAGnC,IAAI,KAAK,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;YAC3B;;AAGJ,QAAA,MAAM,cAAc,GAAG,MAAM,CAAC,QAAQ,CAAC;QAEvC,MAAM,iBAAiB,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG,CAAC;QACnD,MAAM,KAAK,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC;QAC1C,MAAM,IAAI,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC;QAEzC,QAAQ,CAAC,cAAc,CAAC;AAExB,QAAA,IAAI,QAAQ;AAAE,YAAA,QAAQ,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,cAAc,EAAE,CAAC;AAErE,QAAA,IAAI,mBAAmB,CAAC,cAAc,CAAC,EAAE;AACrC,YAAA,MAAM,KAAK,GAAG,cAAc,CAAC,MAAM,GAAG,CAAC,IAAI,iBAAiB,CAAC,cAAc,CAAC;AAE5E,YAAA,IAAI,CAAC,KAAK;gBAAE;YAEZ,IAAI,UAAU,EAAE;AACZ,gBAAA,UAAU,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,cAAc,EAAE,CAAC;;;AAGrE,KAAC;IAED,MAAM,gBAAgB,GAAG,MAAK;QAC1B,QAAQ,CAAC,EAAE,CAAC;AAChB,KAAC;IAED,QACI,KAAC,CAAA,aAAA,CAAA,KAAK,EACE,EAAA,GAAA,SAAS,EACb,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,YAAY,EACtB,OAAO,EAAE,gBAAgB,EAC3B,CAAA;AAEV,CAAC;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"format.js","sources":["../../src/utils/format.ts"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nexport const DATE_MASK = [/\\d/, /\\d/, ':', /\\d/, /\\d/];\n\nexport const isCompleteTimeInput = (input: string) => input.length === DATE_MASK.length;\n\nexport const isValidTimeFormat = (value: string): boolean => {\n const timeArr = value.split(':');\n const hours = timeArr[0];\n const mins = timeArr[1];\n\n if (hours.length !== 2 || Number(hours) > 23) {\n return false;\n }\n\n if (mins.length !== 2 || Number(mins) > 59) {\n return false;\n }\n\n return true;\n};\n\nexport const isValidInputValue = (inputValue?: string) =>\n !inputValue || (isCompleteTimeInput(inputValue) && isValidTimeFormat(inputValue));\n\nexport const format = (value: string): string =>\n value\n .replace(/^(\\d\\d)(\\d)$/, '$1:$2') // 123 => 12:3\n .replace(/^(\\d\\d)(\\d\\d)/, '$1:$2') // 12345 => 12:45 (если вместо двоеточия введена цифра, она обратно заменяется на двоеточие)\n .replace(/^(\\d):(\\d\\d)(\\d)/, '$1:$2') // 1:234 => 1:23\n .replace(/\\:$/, ''); // 12: => 12 || : => void\n"],"names":[],"mappings":"AAAA;AAEO,MAAM,SAAS,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI;AAExC,MAAA,mBAAmB,GAAG,CAAC,KAAa,KAAK,KAAK,CAAC,MAAM,KAAK,SAAS,CAAC;AAEpE,MAAA,iBAAiB,GAAG,CAAC,KAAa,KAAa;IACxD,MAAM,OAAO,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;AAChC,IAAA,MAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC;AACxB,IAAA,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC;AAEvB,IAAA,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,GAAG,EAAE,EAAE;AAC1C,QAAA,OAAO,KAAK
|
|
1
|
+
{"version":3,"file":"format.js","sources":["../../src/utils/format.ts"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nexport const DATE_MASK = [/\\d/, /\\d/, ':', /\\d/, /\\d/];\n\nexport const isCompleteTimeInput = (input: string) => input.length === DATE_MASK.length;\n\nexport const isValidTimeFormat = (value: string): boolean => {\n const timeArr = value.split(':');\n const hours = timeArr[0];\n const mins = timeArr[1];\n\n if (hours.length !== 2 || Number(hours) > 23) {\n return false;\n }\n\n if (mins.length !== 2 || Number(mins) > 59) {\n return false;\n }\n\n return true;\n};\n\nexport const isValidInputValue = (inputValue?: string) =>\n !inputValue || (isCompleteTimeInput(inputValue) && isValidTimeFormat(inputValue));\n\nexport const format = (value: string): string =>\n value\n .replace(/^(\\d\\d)(\\d)$/, '$1:$2') // 123 => 12:3\n .replace(/^(\\d\\d)(\\d\\d)/, '$1:$2') // 12345 => 12:45 (если вместо двоеточия введена цифра, она обратно заменяется на двоеточие)\n .replace(/^(\\d):(\\d\\d)(\\d)/, '$1:$2') // 1:234 => 1:23\n .replace(/\\:$/, ''); // 12: => 12 || : => void\n"],"names":[],"mappings":"AAAA;AAEO,MAAM,SAAS,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI;AAExC,MAAA,mBAAmB,GAAG,CAAC,KAAa,KAAK,KAAK,CAAC,MAAM,KAAK,SAAS,CAAC;AAEpE,MAAA,iBAAiB,GAAG,CAAC,KAAa,KAAa;IACxD,MAAM,OAAO,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;AAChC,IAAA,MAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC;AACxB,IAAA,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC;AAEvB,IAAA,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,GAAG,EAAE,EAAE;AAC1C,QAAA,OAAO,KAAK;;AAGhB,IAAA,IAAI,IAAI,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG,EAAE,EAAE;AACxC,QAAA,OAAO,KAAK;;AAGhB,IAAA,OAAO,IAAI;AACf;MAEa,iBAAiB,GAAG,CAAC,UAAmB,KACjD,CAAC,UAAU,KAAK,mBAAmB,CAAC,UAAU,CAAC,IAAI,iBAAiB,CAAC,UAAU,CAAC;MAEvE,MAAM,GAAG,CAAC,KAAa,KAChC;AACK,KAAA,OAAO,CAAC,cAAc,EAAE,OAAO,CAAC;AAChC,KAAA,OAAO,CAAC,eAAe,EAAE,OAAO,CAAC;AACjC,KAAA,OAAO,CAAC,kBAAkB,EAAE,OAAO,CAAC;AACpC,KAAA,OAAO,CAAC,KAAK,EAAE,EAAE,EAAE;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@alfalab/core-components-time-input",
|
|
3
|
-
"version": "4.0.
|
|
3
|
+
"version": "4.0.5-alfasans",
|
|
4
4
|
"description": "",
|
|
5
5
|
"keywords": [],
|
|
6
6
|
"license": "MIT",
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
"main": "index.js",
|
|
11
11
|
"module": "./esm/index.js",
|
|
12
12
|
"dependencies": {
|
|
13
|
-
"@alfalab/core-components-input": "
|
|
13
|
+
"@alfalab/core-components-input": "17.1.3-alfasans",
|
|
14
14
|
"tslib": "^2.4.0"
|
|
15
15
|
},
|
|
16
16
|
"peerDependencies": {
|
|
@@ -21,6 +21,6 @@
|
|
|
21
21
|
"access": "public",
|
|
22
22
|
"directory": "dist"
|
|
23
23
|
},
|
|
24
|
-
"themesVersion": "15.0.2",
|
|
25
|
-
"varsVersion": "11.0.
|
|
24
|
+
"themesVersion": "15.0.2-alfasans",
|
|
25
|
+
"varsVersion": "11.0.2-alfasans"
|
|
26
26
|
}
|
package/utils/format.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"format.js","sources":["../src/utils/format.ts"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nexport const DATE_MASK = [/\\d/, /\\d/, ':', /\\d/, /\\d/];\n\nexport const isCompleteTimeInput = (input: string) => input.length === DATE_MASK.length;\n\nexport const isValidTimeFormat = (value: string): boolean => {\n const timeArr = value.split(':');\n const hours = timeArr[0];\n const mins = timeArr[1];\n\n if (hours.length !== 2 || Number(hours) > 23) {\n return false;\n }\n\n if (mins.length !== 2 || Number(mins) > 59) {\n return false;\n }\n\n return true;\n};\n\nexport const isValidInputValue = (inputValue?: string) =>\n !inputValue || (isCompleteTimeInput(inputValue) && isValidTimeFormat(inputValue));\n\nexport const format = (value: string): string =>\n value\n .replace(/^(\\d\\d)(\\d)$/, '$1:$2') // 123 => 12:3\n .replace(/^(\\d\\d)(\\d\\d)/, '$1:$2') // 12345 => 12:45 (если вместо двоеточия введена цифра, она обратно заменяется на двоеточие)\n .replace(/^(\\d):(\\d\\d)(\\d)/, '$1:$2') // 1:234 => 1:23\n .replace(/\\:$/, ''); // 12: => 12 || : => void\n"],"names":[],"mappings":";;;;AAAA;AAEO,IAAM,SAAS,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI;AAExC,IAAA,mBAAmB,GAAG,UAAC,KAAa,EAAK,EAAA,OAAA,KAAK,CAAC,MAAM,KAAK,SAAS,CAAC,MAAM,CAAA;AAEhF,IAAM,iBAAiB,GAAG,UAAC,KAAa,EAAA;IAC3C,IAAM,OAAO,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;AAChC,IAAA,IAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC;AACxB,IAAA,IAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC;AAEvB,IAAA,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,GAAG,EAAE,EAAE;AAC1C,QAAA,OAAO,KAAK
|
|
1
|
+
{"version":3,"file":"format.js","sources":["../src/utils/format.ts"],"sourcesContent":["/* eslint-disable no-useless-escape */\n\nexport const DATE_MASK = [/\\d/, /\\d/, ':', /\\d/, /\\d/];\n\nexport const isCompleteTimeInput = (input: string) => input.length === DATE_MASK.length;\n\nexport const isValidTimeFormat = (value: string): boolean => {\n const timeArr = value.split(':');\n const hours = timeArr[0];\n const mins = timeArr[1];\n\n if (hours.length !== 2 || Number(hours) > 23) {\n return false;\n }\n\n if (mins.length !== 2 || Number(mins) > 59) {\n return false;\n }\n\n return true;\n};\n\nexport const isValidInputValue = (inputValue?: string) =>\n !inputValue || (isCompleteTimeInput(inputValue) && isValidTimeFormat(inputValue));\n\nexport const format = (value: string): string =>\n value\n .replace(/^(\\d\\d)(\\d)$/, '$1:$2') // 123 => 12:3\n .replace(/^(\\d\\d)(\\d\\d)/, '$1:$2') // 12345 => 12:45 (если вместо двоеточия введена цифра, она обратно заменяется на двоеточие)\n .replace(/^(\\d):(\\d\\d)(\\d)/, '$1:$2') // 1:234 => 1:23\n .replace(/\\:$/, ''); // 12: => 12 || : => void\n"],"names":[],"mappings":";;;;AAAA;AAEO,IAAM,SAAS,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI;AAExC,IAAA,mBAAmB,GAAG,UAAC,KAAa,EAAK,EAAA,OAAA,KAAK,CAAC,MAAM,KAAK,SAAS,CAAC,MAAM,CAAA;AAEhF,IAAM,iBAAiB,GAAG,UAAC,KAAa,EAAA;IAC3C,IAAM,OAAO,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;AAChC,IAAA,IAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC;AACxB,IAAA,IAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC;AAEvB,IAAA,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,GAAG,EAAE,EAAE;AAC1C,QAAA,OAAO,KAAK;;AAGhB,IAAA,IAAI,IAAI,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG,EAAE,EAAE;AACxC,QAAA,OAAO,KAAK;;AAGhB,IAAA,OAAO,IAAI;AACf;AAEO,IAAM,iBAAiB,GAAG,UAAC,UAAmB,EAAA;AACjD,IAAA,OAAA,CAAC,UAAU,KAAK,mBAAmB,CAAC,UAAU,CAAC,IAAI,iBAAiB,CAAC,UAAU,CAAC,CAAC;AAAjF;AAEG,IAAM,MAAM,GAAG,UAAC,KAAa,EAAA;AAChC,IAAA,OAAA;AACK,SAAA,OAAO,CAAC,cAAc,EAAE,OAAO,CAAC;AAChC,SAAA,OAAO,CAAC,eAAe,EAAE,OAAO,CAAC;AACjC,SAAA,OAAO,CAAC,kBAAkB,EAAE,OAAO,CAAC;AACpC,SAAA,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC;AAJvB,EAIwB;;;;;;;;"}
|