linear-react-components-ui 2.1.0-beta.4 → 2.1.0-beta.5
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.
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
+
import _ from "../../../_virtual/lodash.js";
|
|
2
3
|
import hooks from "../../../node_modules/moment/dist/moment.js";
|
|
3
4
|
import { useIMask, IMask } from "react-imask";
|
|
4
5
|
import { getMaskSegments, canSegmentAcceptDigits, getDateFormats } from "../helpers.js";
|
|
@@ -83,13 +84,13 @@ const useDateMask = (params) => {
|
|
|
83
84
|
};
|
|
84
85
|
const {
|
|
85
86
|
value,
|
|
86
|
-
unmaskedValue,
|
|
87
87
|
setValue
|
|
88
88
|
} = useIMask(maskOptions, {
|
|
89
89
|
ref: inputRef,
|
|
90
90
|
defaultValue,
|
|
91
91
|
onAccept: handleAccept
|
|
92
92
|
});
|
|
93
|
+
const unmaskedValue = _.toString(value).replace(/\D/g, "");
|
|
93
94
|
const setMaskValue = (nextValue) => {
|
|
94
95
|
programmaticValueRef.current = nextValue;
|
|
95
96
|
setValue(nextValue);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDateMask.js","sources":["../../../../src/lib/inputs2/date/hooks/useDateMask.ts"],"sourcesContent":["import React from 'react';\nimport moment, { type Moment } from 'moment';\nimport { useIMask, IMask } from 'react-imask';\nimport type { DateVariant } from '../types';\nimport { canSegmentAcceptDigits, getDateFormats, getMaskSegments } from '../helpers';\n\ninterface UseDateMaskParams {\n inputRef: React.RefObject<HTMLInputElement | null>;\n variant?: DateVariant;\n defaultValue?: string;\n undigitable?: boolean;\n readOnly?: boolean;\n onCommit: (date: Moment) => void;\n onPaste?: (event: React.ClipboardEvent<HTMLInputElement>) => void;\n onBeforeInput?: (event: React.InputEvent<HTMLInputElement>) => void;\n}\n\nconst buildMaskOptions = (variant: DateVariant) => {\n const { ptbrFormat } = getDateFormats(variant);\n return {\n mask: Date,\n pattern: variant === 'datetime' ? '`d/`m/`Y `H:`M' : '`d/`m/`Y',\n lazy: false,\n placeholderChar: '_',\n overwrite: true,\n blocks: {\n d: { mask: IMask.MaskedRange, from: 1, to: 31, maxLength: 2, autofix: 'pad' },\n m: { mask: IMask.MaskedRange, from: 1, to: 12, maxLength: 2, autofix: 'pad' },\n Y: { mask: IMask.MaskedRange, from: 1900, to: 2099, maxLength: 4 },\n H: { mask: IMask.MaskedRange, from: 0, to: 23, maxLength: 2, autofix: 'pad' },\n M: { mask: IMask.MaskedRange, from: 0, to: 59, maxLength: 2, autofix: 'pad' },\n },\n format: (date: Date) => moment(date).format(ptbrFormat),\n parse: (value: string) => moment(value, ptbrFormat).toDate(),\n } as any;\n};\n\nexport const useDateMask = (params: UseDateMaskParams) => {\n const {\n inputRef, variant = 'date', defaultValue, undigitable = false, readOnly = false,\n onCommit, onPaste, onBeforeInput,\n } = params;\n const { ptbrFormat } = getDateFormats(variant);\n const maskOptions = React.useMemo(() => buildMaskOptions(variant), [variant]);\n\n const onCommitRef = React.useRef(onCommit);\n onCommitRef.current = onCommit;\n const programmaticValueRef = React.useRef<string | null>(null);\n\n const handleAccept = (acceptedValue: string, mask: any) => {\n if (acceptedValue === programmaticValueRef.current) {\n programmaticValueRef.current = null;\n return;\n }\n if (!mask?.masked?.isComplete) return;\n const date = moment(acceptedValue, ptbrFormat);\n if (date.isValid()) { onCommitRef.current(date); }\n };\n\n const { value,
|
|
1
|
+
{"version":3,"file":"useDateMask.js","sources":["../../../../src/lib/inputs2/date/hooks/useDateMask.ts"],"sourcesContent":["import React from 'react';\nimport _ from 'lodash';\nimport moment, { type Moment } from 'moment';\nimport { useIMask, IMask } from 'react-imask';\nimport type { DateVariant } from '../types';\nimport { canSegmentAcceptDigits, getDateFormats, getMaskSegments } from '../helpers';\n\ninterface UseDateMaskParams {\n inputRef: React.RefObject<HTMLInputElement | null>;\n variant?: DateVariant;\n defaultValue?: string;\n undigitable?: boolean;\n readOnly?: boolean;\n onCommit: (date: Moment) => void;\n onPaste?: (event: React.ClipboardEvent<HTMLInputElement>) => void;\n onBeforeInput?: (event: React.InputEvent<HTMLInputElement>) => void;\n}\n\nconst buildMaskOptions = (variant: DateVariant) => {\n const { ptbrFormat } = getDateFormats(variant);\n return {\n mask: Date,\n pattern: variant === 'datetime' ? '`d/`m/`Y `H:`M' : '`d/`m/`Y',\n lazy: false,\n placeholderChar: '_',\n overwrite: true,\n blocks: {\n d: { mask: IMask.MaskedRange, from: 1, to: 31, maxLength: 2, autofix: 'pad' },\n m: { mask: IMask.MaskedRange, from: 1, to: 12, maxLength: 2, autofix: 'pad' },\n Y: { mask: IMask.MaskedRange, from: 1900, to: 2099, maxLength: 4 },\n H: { mask: IMask.MaskedRange, from: 0, to: 23, maxLength: 2, autofix: 'pad' },\n M: { mask: IMask.MaskedRange, from: 0, to: 59, maxLength: 2, autofix: 'pad' },\n },\n format: (date: Date) => moment(date).format(ptbrFormat),\n parse: (value: string) => moment(value, ptbrFormat).toDate(),\n } as any;\n};\n\nexport const useDateMask = (params: UseDateMaskParams) => {\n const {\n inputRef, variant = 'date', defaultValue, undigitable = false, readOnly = false,\n onCommit, onPaste, onBeforeInput,\n } = params;\n const { ptbrFormat } = getDateFormats(variant);\n const maskOptions = React.useMemo(() => buildMaskOptions(variant), [variant]);\n\n const onCommitRef = React.useRef(onCommit);\n onCommitRef.current = onCommit;\n const programmaticValueRef = React.useRef<string | null>(null);\n\n const handleAccept = (acceptedValue: string, mask: any) => {\n if (acceptedValue === programmaticValueRef.current) {\n programmaticValueRef.current = null;\n return;\n }\n if (!mask?.masked?.isComplete) return;\n const date = moment(acceptedValue, ptbrFormat);\n if (date.isValid()) { onCommitRef.current(date); }\n };\n\n const { value, setValue } = useIMask(maskOptions, {\n ref: inputRef,\n defaultValue,\n onAccept: handleAccept,\n });\n\n const unmaskedValue = _.toString(value).replace(/\\D/g, '');\n\n const setMaskValue = (nextValue: string) => {\n programmaticValueRef.current = nextValue;\n setValue(nextValue);\n };\n\n const handleOnKeyDownCapture = (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (undigitable || readOnly) return;\n if (event.ctrlKey || event.metaKey || event.altKey) return;\n if (event.key.length !== 1 || !/\\d/.test(event.key)) return;\n const input = inputRef.current;\n const start = input?.selectionStart;\n const end = input?.selectionEnd;\n if (!input || start == null || end == null) return;\n const segment = getMaskSegments(ptbrFormat).find(item => start < item.end);\n if (!segment || end > segment.end) return;\n const hasSelection = end > start;\n const caret = hasSelection ? segment.start : Math.max(start, segment.start);\n const typed = hasSelection\n ? event.key\n : input.value.slice(segment.start, caret).replace(/\\D/g, '') + event.key;\n if (!canSegmentAcceptDigits(typed, segment.key)) {\n event.preventDefault();\n return;\n }\n input.setSelectionRange(caret, segment.end);\n };\n\n const handleOnPaste = (event: React.ClipboardEvent<HTMLInputElement>) => {\n if (undigitable) {\n event.preventDefault();\n } else {\n onPaste?.(event);\n }\n };\n\n const handleOnBeforeInput = (event: React.InputEvent<HTMLInputElement>) => {\n if (undigitable) {\n event.preventDefault();\n } else {\n onBeforeInput?.(event);\n }\n };\n\n return {\n maskedValue: value,\n unmaskedValue,\n setMaskValue,\n handleOnPaste,\n handleOnBeforeInput,\n handleOnKeyDownCapture,\n };\n};\n"],"names":["buildMaskOptions","variant","ptbrFormat","getDateFormats","mask","Date","pattern","lazy","placeholderChar","overwrite","blocks","d","IMask","MaskedRange","from","to","maxLength","autofix","m","Y","H","M","format","date","moment","parse","value","toDate","useDateMask","params","inputRef","defaultValue","undigitable","readOnly","onCommit","onPaste","onBeforeInput","maskOptions","React","useMemo","onCommitRef","useRef","current","programmaticValueRef","handleAccept","acceptedValue","masked","isComplete","isValid","setValue","useIMask","ref","onAccept","unmaskedValue","_","toString","replace","setMaskValue","nextValue","handleOnKeyDownCapture","event","ctrlKey","metaKey","altKey","key","length","test","input","start","selectionStart","end","selectionEnd","segment","getMaskSegments","find","item","hasSelection","caret","Math","max","typed","slice","canSegmentAcceptDigits","preventDefault","setSelectionRange","handleOnPaste","handleOnBeforeInput","maskedValue"],"mappings":";;;;;AAkBA,MAAMA,mBAAmBA,CAACC,YAAyB;AACjD,QAAM;AAAA,IAAEC;AAAAA,EAAAA,IAAeC,eAAeF,OAAO;AAC7C,SAAO;AAAA,IACLG,MAAMC;AAAAA,IACNC,SAASL,YAAY,aAAa,mBAAmB;AAAA,IACrDM,MAAM;AAAA,IACNC,iBAAiB;AAAA,IACjBC,WAAW;AAAA,IACXC,QAAQ;AAAA,MACNC,GAAG;AAAA,QAAEP,MAAMQ,MAAMC;AAAAA,QAAaC,MAAM;AAAA,QAAGC,IAAI;AAAA,QAAIC,WAAW;AAAA,QAAGC,SAAS;AAAA,MAAA;AAAA,MACtEC,GAAG;AAAA,QAAEd,MAAMQ,MAAMC;AAAAA,QAAaC,MAAM;AAAA,QAAGC,IAAI;AAAA,QAAIC,WAAW;AAAA,QAAGC,SAAS;AAAA,MAAA;AAAA,MACtEE,GAAG;AAAA,QAAEf,MAAMQ,MAAMC;AAAAA,QAAaC,MAAM;AAAA,QAAMC,IAAI;AAAA,QAAMC,WAAW;AAAA,MAAA;AAAA,MAC/DI,GAAG;AAAA,QAAEhB,MAAMQ,MAAMC;AAAAA,QAAaC,MAAM;AAAA,QAAGC,IAAI;AAAA,QAAIC,WAAW;AAAA,QAAGC,SAAS;AAAA,MAAA;AAAA,MACtEI,GAAG;AAAA,QAAEjB,MAAMQ,MAAMC;AAAAA,QAAaC,MAAM;AAAA,QAAGC,IAAI;AAAA,QAAIC,WAAW;AAAA,QAAGC,SAAS;AAAA,MAAA;AAAA,IAAM;AAAA,IAE9EK,QAAQA,CAACC,SAAeC,MAAOD,IAAI,EAAED,OAAOpB,UAAU;AAAA,IACtDuB,OAAOA,CAACC,UAAkBF,MAAOE,OAAOxB,UAAU,EAAEyB,OAAAA;AAAAA,EAAO;AAE/D;AAEO,MAAMC,cAAcA,CAACC,WAA8B;AACxD,QAAM;AAAA,IACJC;AAAAA,IAAU7B,UAAU;AAAA,IAAQ8B;AAAAA,IAAcC,cAAc;AAAA,IAAOC,WAAW;AAAA,IAC1EC;AAAAA,IAAUC;AAAAA,IAASC;AAAAA,EAAAA,IACjBP;AACJ,QAAM;AAAA,IAAE3B;AAAAA,EAAAA,IAAeC,eAAeF,OAAO;AAC7C,QAAMoC,cAAcC,MAAMC,QAAQ,MAAMvC,iBAAiBC,OAAO,GAAG,CAACA,OAAO,CAAC;AAE5E,QAAMuC,cAAcF,MAAMG,OAAOP,QAAQ;AACzCM,cAAYE,UAAUR;AACtB,QAAMS,uBAAuBL,MAAMG,OAAsB,IAAI;AAE7D,QAAMG,eAAeA,CAACC,eAAuBzC,SAAc;AACzD,QAAIyC,kBAAkBF,qBAAqBD,SAAS;AAClDC,2BAAqBD,UAAU;AAC/B;AAAA,IACF;AACA,QAAI,CAACtC,MAAM0C,QAAQC,WAAY;AAC/B,UAAMxB,OAAOC,MAAOqB,eAAe3C,UAAU;AAC7C,QAAIqB,KAAKyB,WAAW;AAAER,kBAAYE,QAAQnB,IAAI;AAAA,IAAG;AAAA,EACnD;AAEA,QAAM;AAAA,IAAEG;AAAAA,IAAOuB;AAAAA,EAAAA,IAAaC,SAASb,aAAa;AAAA,IAChDc,KAAKrB;AAAAA,IACLC;AAAAA,IACAqB,UAAUR;AAAAA,EAAAA,CACX;AAED,QAAMS,gBAAgBC,EAAEC,SAAS7B,KAAK,EAAE8B,QAAQ,OAAO,EAAE;AAEzD,QAAMC,eAAeA,CAACC,cAAsB;AAC1Cf,yBAAqBD,UAAUgB;AAC/BT,aAASS,SAAS;AAAA,EACpB;AAEA,QAAMC,yBAAyBA,CAACC,UAAiD;AAC/E,QAAI5B,eAAeC,SAAU;AAC7B,QAAI2B,MAAMC,WAAWD,MAAME,WAAWF,MAAMG,OAAQ;AACpD,QAAIH,MAAMI,IAAIC,WAAW,KAAK,CAAC,KAAKC,KAAKN,MAAMI,GAAG,EAAG;AACrD,UAAMG,QAAQrC,SAASY;AACvB,UAAM0B,QAAQD,OAAOE;AACrB,UAAMC,MAAMH,OAAOI;AACnB,QAAI,CAACJ,SAASC,SAAS,QAAQE,OAAO,KAAM;AAC5C,UAAME,UAAUC,gBAAgBvE,UAAU,EAAEwE,KAAKC,CAAAA,SAAQP,QAAQO,KAAKL,GAAG;AACzE,QAAI,CAACE,WAAWF,MAAME,QAAQF,IAAK;AACnC,UAAMM,eAAeN,MAAMF;AAC3B,UAAMS,QAAQD,eAAeJ,QAAQJ,QAAQU,KAAKC,IAAIX,OAAOI,QAAQJ,KAAK;AAC1E,UAAMY,QAAQJ,eACVhB,MAAMI,MACNG,MAAMzC,MAAMuD,MAAMT,QAAQJ,OAAOS,KAAK,EAAErB,QAAQ,OAAO,EAAE,IAAII,MAAMI;AACvE,QAAI,CAACkB,uBAAuBF,OAAOR,QAAQR,GAAG,GAAG;AAC/CJ,YAAMuB,eAAAA;AACN;AAAA,IACF;AACAhB,UAAMiB,kBAAkBP,OAAOL,QAAQF,GAAG;AAAA,EAC5C;AAEA,QAAMe,gBAAgBA,CAACzB,YAAkD;AACvE,QAAI5B,aAAa;AACf4B,cAAMuB,eAAAA;AAAAA,IACR,OAAO;AACLhD,gBAAUyB,OAAK;AAAA,IACjB;AAAA,EACF;AAEA,QAAM0B,sBAAsBA,CAAC1B,YAA8C;AACzE,QAAI5B,aAAa;AACf4B,cAAMuB,eAAAA;AAAAA,IACR,OAAO;AACL/C,sBAAgBwB,OAAK;AAAA,IACvB;AAAA,EACF;AAEA,SAAO;AAAA,IACL2B,aAAa7D;AAAAA,IACb2B;AAAAA,IACAI;AAAAA,IACA4B;AAAAA,IACAC;AAAAA,IACA3B;AAAAA,EAAAA;AAEJ;"}
|