text-input-guard 0.1.1 → 0.1.3
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/cjs/text-input-guard.cjs +81 -7
- package/dist/cjs/text-input-guard.min.cjs +1 -1
- package/dist/esm/text-input-guard.js +81 -7
- package/dist/esm/text-input-guard.min.js +1 -1
- package/dist/types/text-input-guard.d.ts +25 -1
- package/dist/umd/text-input-guard.js +81 -7
- package/dist/umd/text-input-guard.min.js +1 -1
- package/package.json +1 -1
|
@@ -116,17 +116,30 @@ class SwapState {
|
|
|
116
116
|
"placeholder",
|
|
117
117
|
"inputmode",
|
|
118
118
|
"autocomplete",
|
|
119
|
-
"required",
|
|
120
119
|
"minlength",
|
|
121
120
|
"maxlength",
|
|
122
121
|
"pattern",
|
|
123
122
|
"title",
|
|
124
|
-
"tabindex"
|
|
123
|
+
"tabindex",
|
|
124
|
+
"style",
|
|
125
|
+
"enterkeyhint",
|
|
126
|
+
"spellcheck"
|
|
127
|
+
];
|
|
128
|
+
|
|
129
|
+
const UI_BOOL_ATTRS = [
|
|
130
|
+
"required",
|
|
131
|
+
"readonly",
|
|
132
|
+
"disabled",
|
|
133
|
+
"autofocus"
|
|
125
134
|
];
|
|
126
135
|
|
|
127
136
|
for (const name of UI_ATTRS) {
|
|
128
|
-
this.originalUiAttrs[name] =
|
|
129
|
-
|
|
137
|
+
this.originalUiAttrs[name] = input.hasAttribute(name) ? input.getAttribute(name) : null;
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
for (const name of UI_BOOL_ATTRS) {
|
|
141
|
+
// booleanは「ある/ない」だけ記録
|
|
142
|
+
this.originalUiAttrs[name] = input.hasAttribute(name) ? "" : null;
|
|
130
143
|
}
|
|
131
144
|
|
|
132
145
|
for (const attr of input.attributes) {
|
|
@@ -186,6 +199,7 @@ class SwapState {
|
|
|
186
199
|
if (v == null) {
|
|
187
200
|
display.removeAttribute(name);
|
|
188
201
|
} else {
|
|
202
|
+
// booleanも "" をセットすればOK
|
|
189
203
|
display.setAttribute(name, v);
|
|
190
204
|
}
|
|
191
205
|
}
|
|
@@ -274,6 +288,24 @@ class SwapState {
|
|
|
274
288
|
* @property {any} [detail] - 追加情報(制限値など)
|
|
275
289
|
*/
|
|
276
290
|
|
|
291
|
+
/**
|
|
292
|
+
* setValue で設定できる値型
|
|
293
|
+
* - number は String に変換して設定する
|
|
294
|
+
* - null/undefined は空文字として扱う
|
|
295
|
+
* @typedef {string | number | null | undefined} SetValueInput
|
|
296
|
+
*/
|
|
297
|
+
|
|
298
|
+
/**
|
|
299
|
+
* setValue 実行モード
|
|
300
|
+
* - "commit" 確定評価まで実行 normalize→validate→fix→format
|
|
301
|
+
* - "input" 入力中評価のみ実行 normalize→validate
|
|
302
|
+
* - "none" 評価は実行しない 値だけを反映
|
|
303
|
+
*
|
|
304
|
+
* 既定値は "commit"
|
|
305
|
+
*
|
|
306
|
+
* @typedef {"none"|"input"|"commit"} SetValueMode
|
|
307
|
+
*/
|
|
308
|
+
|
|
277
309
|
/**
|
|
278
310
|
* attach() が返す公開API(利用者が触れる最小インターフェース)
|
|
279
311
|
* @typedef {Object} Guard
|
|
@@ -284,6 +316,9 @@ class SwapState {
|
|
|
284
316
|
* @property {() => string} getDisplayValue - ユーザーが実際に操作している要素の値を取得
|
|
285
317
|
* @property {() => HTMLInputElement|HTMLTextAreaElement} getRawElement - 送信用の正規化済み値の要素
|
|
286
318
|
* @property {() => HTMLInputElement|HTMLTextAreaElement} getDisplayElement - ユーザーが実際に操作している要素(swap時はdisplay専用)
|
|
319
|
+
* @property {() => void} evaluate 入力中評価を手動実行 normalize→validate
|
|
320
|
+
* @property {() => void} commit 確定評価を手動実行 normalize→validate→fix→format
|
|
321
|
+
* @property {(value: SetValueInput, mode?: SetValueMode) => void} setValue
|
|
287
322
|
*/
|
|
288
323
|
|
|
289
324
|
/**
|
|
@@ -1263,6 +1298,42 @@ class InputGuard {
|
|
|
1263
1298
|
return /** @type {HTMLInputElement|HTMLTextAreaElement} */ (this.displayElement).value;
|
|
1264
1299
|
}
|
|
1265
1300
|
|
|
1301
|
+
/**
|
|
1302
|
+
* 表示要素の値をプログラムから設定する
|
|
1303
|
+
*
|
|
1304
|
+
* @param {SetValueInput} value
|
|
1305
|
+
* @param {SetValueMode} [mode="commit"]
|
|
1306
|
+
* @returns {void}
|
|
1307
|
+
*/
|
|
1308
|
+
setValue(value, mode = "commit") {
|
|
1309
|
+
/** @type {string} */
|
|
1310
|
+
let s;
|
|
1311
|
+
|
|
1312
|
+
if (value == null) {
|
|
1313
|
+
s = "";
|
|
1314
|
+
} else if (typeof value === "number") {
|
|
1315
|
+
// NaN/Infinity は事故りやすいので空に寄せる(方針)
|
|
1316
|
+
s = Number.isFinite(value) ? String(value) : "";
|
|
1317
|
+
} else {
|
|
1318
|
+
s = String(value);
|
|
1319
|
+
}
|
|
1320
|
+
|
|
1321
|
+
const display = /** @type {HTMLInputElement|HTMLTextAreaElement} */ (this.displayElement);
|
|
1322
|
+
display.value = s;
|
|
1323
|
+
|
|
1324
|
+
if (mode === "none") {
|
|
1325
|
+
this.syncRaw(s);
|
|
1326
|
+
this.lastAcceptedValue = s;
|
|
1327
|
+
this.lastAcceptedSelection = this.readSelection(display);
|
|
1328
|
+
return;
|
|
1329
|
+
}
|
|
1330
|
+
if (mode === "input") {
|
|
1331
|
+
this.evaluateInput();
|
|
1332
|
+
return;
|
|
1333
|
+
}
|
|
1334
|
+
this.evaluateCommit();
|
|
1335
|
+
}
|
|
1336
|
+
|
|
1266
1337
|
/**
|
|
1267
1338
|
* 外部に公開する Guard API を生成して返す
|
|
1268
1339
|
* - InputGuard 自体を公開せず、最小の操作だけを渡す
|
|
@@ -1276,7 +1347,10 @@ class InputGuard {
|
|
|
1276
1347
|
getRawValue: () => this.getRawValue(),
|
|
1277
1348
|
getDisplayValue: () => this.getDisplayValue(),
|
|
1278
1349
|
getRawElement: () => /** @type {HTMLInputElement|HTMLTextAreaElement} */ (this.hostElement),
|
|
1279
|
-
getDisplayElement: () => /** @type {HTMLInputElement|HTMLTextAreaElement} */ (this.displayElement)
|
|
1350
|
+
getDisplayElement: () => /** @type {HTMLInputElement|HTMLTextAreaElement} */ (this.displayElement),
|
|
1351
|
+
evaluate: () => this.evaluateInput(),
|
|
1352
|
+
commit: () => this.evaluateCommit(),
|
|
1353
|
+
setValue: (value, mode) => this.setValue(value, mode)
|
|
1280
1354
|
};
|
|
1281
1355
|
}
|
|
1282
1356
|
}
|
|
@@ -2341,11 +2415,11 @@ const rules = {
|
|
|
2341
2415
|
|
|
2342
2416
|
/**
|
|
2343
2417
|
* バージョン(ビルド時に置換したいならここを差し替える)
|
|
2344
|
-
* 例: rollup replace で ""0.1.
|
|
2418
|
+
* 例: rollup replace で ""0.1.3"" を package.json の version に置換
|
|
2345
2419
|
*/
|
|
2346
2420
|
// @ts-ignore
|
|
2347
2421
|
// eslint-disable-next-line no-undef
|
|
2348
|
-
const version = "0.1.
|
|
2422
|
+
const version = "0.1.3" ;
|
|
2349
2423
|
|
|
2350
2424
|
exports.attach = attach;
|
|
2351
2425
|
exports.attachAll = attachAll;
|
|
@@ -3,4 +3,4 @@
|
|
|
3
3
|
* AUTHOR: natade (https://github.com/natade-jp/)
|
|
4
4
|
* LICENSE: MIT https://opensource.org/licenses/MIT
|
|
5
5
|
*/
|
|
6
|
-
"use strict";class t{originalType;originalId;originalName;originalClass;originalUiAttrs;originalAriaAttrs;originalDataset;createdDisplay;constructor(t){this.originalType=t.type,this.originalId=t.getAttribute("id"),this.originalName=t.getAttribute("name"),this.originalClass=t.className,this.originalUiAttrs={},this.originalAriaAttrs={},this.originalDataset={},this.createdDisplay=null;const e=["placeholder","inputmode","autocomplete","required","minlength","maxlength","pattern","title","tabindex"];for(const i of e)this.originalUiAttrs[i]=t.hasAttribute(i)?t.getAttribute(i):null;for(const e of t.attributes)e.name.startsWith("aria-")&&(this.originalAriaAttrs[e.name]=e.value??"");for(const[e,i]of Object.entries(t.dataset))e.startsWith("tig")||(this.originalDataset[e]=i)}applyToRaw(t){t.type="hidden",t.removeAttribute("id"),t.className="",t.dataset.tigRole="raw",this.originalId&&(t.dataset.tigOriginalId=this.originalId),this.originalName&&(t.dataset.tigOriginalName=this.originalName)}createDisplay(t){const e=document.createElement("input");e.type="text",e.dataset.tigRole="display",this.originalId&&(e.id=this.originalId),e.className=this.originalClass??"",e.value=t.value;for(const[t,i]of Object.entries(this.originalUiAttrs))null==i?e.removeAttribute(t):e.setAttribute(t,i);for(const[t,i]of Object.entries(this.originalAriaAttrs))e.setAttribute(t,i);for(const[t,i]of Object.entries(this.originalDataset))e.dataset[t]=i;return this.createdDisplay=e,e}removeDisplay(){this.createdDisplay?.parentNode&&this.createdDisplay.parentNode.removeChild(this.createdDisplay),this.createdDisplay=null}restoreRaw(t){t.type=this.originalType,this.originalId?t.setAttribute("id",this.originalId):t.removeAttribute("id"),this.originalName?t.setAttribute("name",this.originalName):t.removeAttribute("name"),t.className=this.originalClass??"",delete t.dataset.tigRole,delete t.dataset.tigOriginalId,delete t.dataset.tigOriginalName}}function e(t,e){e&&console.warn(t)}function i(t,e={}){const i=new n(t,e);return i.init(),i.toGuard()}class n{constructor(t,e){this.originalElement=t,this.options=e;const i=(n=t)instanceof HTMLInputElement?"input":n instanceof HTMLTextAreaElement?"textarea":null;var n;if(!i)throw new TypeError("[text-input-guard] attach() expects an <input> or <textarea> element.");this.kind=i,this.warn=e.warn??!0,this.invalidClass=e.invalidClass??"is-invalid",this.rules=Array.isArray(e.rules)?e.rules:[],this.hostElement=t,this.displayElement=t,this.rawElement=null,this.composing=!1,this.errors=[],this.normalizeCharRules=[],this.normalizeStructureRules=[],this.validateRules=[],this.fixRules=[],this.formatRules=[],this.onCompositionStart=this.onCompositionStart.bind(this),this.onCompositionEnd=this.onCompositionEnd.bind(this),this.onInput=this.onInput.bind(this),this.onBlur=this.onBlur.bind(this),this.onFocus=this.onFocus.bind(this),this.onSelectionChange=this.onSelectionChange.bind(this),this.swapState=null,this.pendingCompositionCommit=!1,this.lastAcceptedValue="",this.lastAcceptedSelection={start:null,end:null,direction:null},this.revertRequest=null}init(){this.buildPipeline(),this.applySeparateValue(),this.bindEvents(),this.evaluateInput()}readSelection(t){return{start:t.selectionStart,end:t.selectionEnd,direction:t.selectionDirection}}writeSelection(t,e){if(null!=e.start&&null!=e.end)try{e.direction?t.setSelectionRange(e.start,e.end,e.direction):t.setSelectionRange(e.start,e.end)}catch(t){}}applySeparateValue(){const i=this.options.separateValue?.mode??"auto";if("swap"!==("auto"===i?this.formatRules.length>0?"swap":"off":i))return;if("input"!==this.kind)return void e('[text-input-guard] separateValue.mode="swap" is not supported for <textarea>. ignored.',this.warn);const n=this.originalElement,s=new t(n);s.applyToRaw(n);const r=s.createDisplay(n);n.after(r),this.swapState=s,this.hostElement=n,this.displayElement=r,this.rawElement=n,this.lastAcceptedValue=r.value,this.lastAcceptedSelection=this.readSelection(r)}restoreSeparateValue(){if(!this.swapState)return;const t=this.swapState,e=this.hostElement,i=t.createdDisplay;if(i)try{e.value=e.value||i.value}catch(t){}t.removeDisplay(),t.restoreRaw(e),this.hostElement=this.originalElement,this.displayElement=this.originalElement,this.rawElement=null,this.swapState=null}detach(){this.unbindEvents(),this.restoreSeparateValue()}buildPipeline(){this.normalizeCharRules=[],this.normalizeStructureRules=[],this.validateRules=[],this.fixRules=[],this.formatRules=[];for(const t of this.rules){"input"===this.kind&&t.targets.includes("input")||"textarea"===this.kind&&t.targets.includes("textarea")?(t.normalizeChar&&this.normalizeCharRules.push(t),t.normalizeStructure&&this.normalizeStructureRules.push(t),t.validate&&this.validateRules.push(t),t.fix&&this.fixRules.push(t),t.format&&this.formatRules.push(t)):e(`[text-input-guard] Rule "${t.name}" is not supported for <${this.kind}>. skipped.`,this.warn)}}bindEvents(){this.displayElement.addEventListener("compositionstart",this.onCompositionStart),this.displayElement.addEventListener("compositionend",this.onCompositionEnd),this.displayElement.addEventListener("input",this.onInput),this.displayElement.addEventListener("blur",this.onBlur),this.displayElement.addEventListener("focus",this.onFocus),this.displayElement.addEventListener("keyup",this.onSelectionChange),this.displayElement.addEventListener("mouseup",this.onSelectionChange),this.displayElement.addEventListener("select",this.onSelectionChange),this.displayElement.addEventListener("focus",this.onSelectionChange)}unbindEvents(){this.displayElement.removeEventListener("compositionstart",this.onCompositionStart),this.displayElement.removeEventListener("compositionend",this.onCompositionEnd),this.displayElement.removeEventListener("input",this.onInput),this.displayElement.removeEventListener("blur",this.onBlur),this.displayElement.removeEventListener("focus",this.onFocus),this.displayElement.removeEventListener("keyup",this.onSelectionChange),this.displayElement.removeEventListener("mouseup",this.onSelectionChange),this.displayElement.removeEventListener("select",this.onSelectionChange),this.displayElement.removeEventListener("focus",this.onSelectionChange)}revertDisplay(t){const e=this.displayElement;e.value=this.lastAcceptedValue,this.writeSelection(e,this.lastAcceptedSelection),this.syncRaw(this.lastAcceptedValue),this.clearErrors(),this.applyInvalidClass(),this.revertRequest=null,this.warn}createCtx(){return{hostElement:this.hostElement,displayElement:this.displayElement,rawElement:this.rawElement,kind:this.kind,warn:this.warn,invalidClass:this.invalidClass,composing:this.composing,pushError:t=>this.errors.push(t),requestRevert:t=>{this.revertRequest||(this.revertRequest=t)}}}clearErrors(){this.errors=[]}runNormalizeChar(t,e){let i=t;for(const t of this.normalizeCharRules)i=t.normalizeChar?t.normalizeChar(i,e):i;return i}runNormalizeStructure(t,e){let i=t;for(const t of this.normalizeStructureRules)i=t.normalizeStructure?t.normalizeStructure(i,e):i;return i}runValidate(t,e){for(const i of this.validateRules)i.validate&&i.validate(t,e)}runFix(t,e){let i=t;for(const t of this.fixRules)i=t.fix?t.fix(i,e):i;return i}runFormat(t,e){let i=t;for(const t of this.formatRules)i=t.format?t.format(i,e):i;return i}applyInvalidClass(){const t=this.displayElement;this.errors.length>0?t.classList.add(this.invalidClass):t.classList.remove(this.invalidClass)}syncRaw(t){this.rawElement&&(this.rawElement.value=t)}syncDisplay(t){(this.displayElement instanceof HTMLInputElement||this.displayElement instanceof HTMLTextAreaElement)&&(this.displayElement.value=t)}onCompositionStart(){this.composing=!0}onCompositionEnd(){this.composing=!1,this.pendingCompositionCommit=!0,queueMicrotask(()=>{this.pendingCompositionCommit&&(this.pendingCompositionCommit=!1,this.evaluateInput())})}onInput(){this.pendingCompositionCommit=!1,this.evaluateInput()}onBlur(){this.evaluateCommit()}onFocus(){if(this.composing)return;const t=this.displayElement,e=t.value,i=this.createCtx();let n=e;n=this.runNormalizeChar(n,i),n=this.runNormalizeStructure(n,i),n!==e&&(this.setDisplayValuePreserveCaret(t,n,i),this.syncRaw(n)),this.lastAcceptedValue=n,this.lastAcceptedSelection=this.readSelection(t),this.onSelectionChange()}onSelectionChange(){if(this.composing)return;const t=this.displayElement;this.lastAcceptedSelection=this.readSelection(t)}setDisplayValuePreserveCaret(t,e,i){const n=t.value;if(n===e)return;const s=t.selectionStart,r=t.selectionEnd;if(null==s||null==r)return void(t.value=e);let a=n.slice(0,s);a=this.runNormalizeChar(a,i),a=this.runNormalizeStructure(a,i),t.value=e;const l=Math.min(a.length,e.length);try{t.setSelectionRange(l,l)}catch(t){}}evaluateInput(){if(this.composing)return;this.clearErrors(),this.revertRequest=null;const t=this.displayElement,e=t.value,i=this.createCtx();let n=e;n=this.runNormalizeChar(n,i),n=this.runNormalizeStructure(n,i),n!==e&&this.setDisplayValuePreserveCaret(t,n,i),this.runValidate(n,i),this.revertRequest?this.revertDisplay(this.revertRequest):(this.syncRaw(n),this.applyInvalidClass(),this.lastAcceptedValue=n,this.lastAcceptedSelection=this.readSelection(t))}evaluateCommit(){if(this.composing)return;this.clearErrors(),this.revertRequest=null;const t=this.displayElement,e=this.createCtx();let i=t.value;if(i=this.runNormalizeChar(i,e),i=this.runNormalizeStructure(i,e),this.runValidate(i,e),this.revertRequest)return void this.revertDisplay(this.revertRequest);if(i=this.runFix(i,e),this.clearErrors(),this.revertRequest=null,this.runValidate(i,e),this.revertRequest)return void this.revertDisplay(this.revertRequest);this.syncRaw(i);let n=i;n=this.runFormat(n,e),this.syncDisplay(n),this.applyInvalidClass(),this.lastAcceptedValue=i,this.lastAcceptedSelection=this.readSelection(t)}isValid(){return 0===this.errors.length}getErrors(){return this.errors.slice()}getRawValue(){return this.hostElement.value}getDisplayValue(){return this.displayElement.value}toGuard(){return{detach:()=>this.detach(),isValid:()=>this.isValid(),getErrors:()=>this.getErrors(),getRawValue:()=>this.getRawValue(),getDisplayValue:()=>this.getDisplayValue(),getRawElement:()=>this.hostElement,getDisplayElement:()=>this.displayElement}}}function s(t){if(null==t)return;const e=String(t).trim().toLowerCase();return""===e||"true"===e||"1"===e||"yes"===e||"on"===e||"false"!==e&&"0"!==e&&"no"!==e&&"off"!==e&&void 0}function r(t){if(null==t)return;const e=String(t).trim();if(""===e)return;const i=Number(e);return Number.isFinite(i)?i:void 0}function a(t,e){if(null==t)return;const i=String(t).trim();return""!==i&&e.includes(i)?i:void 0}function l(t){if(null==t||""===String(t).trim())return"auto";const e=String(t).trim().toLowerCase();return"auto"===e||"swap"===e||"off"===e?e:"auto"}function o(t){if(null!=t.tigSeparate)return!0;if(null!=t.tigWarn)return!0;if(null!=t.tigInvalidClass)return!0;for(const e in t)if(e.startsWith("tigRules"))return!0;return!1}function u(t={}){const e=t.allowFullWidth??!0,i=t.allowMinus??!1,n=t.allowDecimal??!1,s=t.allowEmpty??!0,r=new Set(["ー","-","−","‐","-","‒","–","—","―"]),a=new Set([".","。","。"]);function l(t){if(t>="0"&&t<="9")return t;if(e){const e=function(t){const e=t.charCodeAt(0);return 65296<=e&&e<=65305?String.fromCharCode(e-65296+48):null}(t);if(e)return e}return"."===t||e&&a.has(t)?n?".":"":"-"===t?i?"-":"":e&&r.has(t)&&i?"-":""}return{name:"numeric",targets:["input"],normalizeChar(t){let e=String(t);e=e.replace(/,/g,"");let i="";for(const t of e)i+=l(t);return i},normalizeStructure(t){let e="",s=!1,r=!1;for(const a of String(t))a>="0"&&a<="9"?e+=a:"-"===a&&i?s||0!==e.length||(e+="-",s=!0):"."===a&&n&&(r||(e+=".",r=!0));return e},fix(t){let e=String(t);if(""===e)return s?"":"0";if("-"===e||"."===e||"-."===e)return s?"":"0";e.startsWith("-.")&&(e="-0"+e.slice(1)),e.startsWith(".")&&(e="0"+e),e.endsWith(".")&&(e=e.slice(0,-1));let i="";e.startsWith("-")&&(i="-",e=e.slice(1));const n=e.indexOf(".");let r=n>=0?e.slice(0,n):e;const a=n>=0?e.slice(n+1):"";return r=r.replace(/^0+/,""),""===r&&(r="0"),"-"!==i||"0"!==r||a&&!/^0*$/.test(a)||(i=""),n>=0?`${i}${r}.${a}`:`${i}${r}`},validate(t,e){}}}function c(t){let e="",i=String(t);i.startsWith("-")&&(e="-",i=i.slice(1));const n=i.indexOf(".");if(!(n>=0))return{sign:e,intPart:i,fracPart:"",hasDot:!1};return{sign:e,intPart:i.slice(0,n),fracPart:i.slice(n+1),hasDot:!0}}function h(t){let e=1;const i=t.split("");for(let t=i.length-1;t>=0;t--){const n=i[t].charCodeAt(0)-48+e;if(!(n>=10)){i[t]=String.fromCharCode(48+n),e=0;break}i[t]="0",e=1}return 1===e&&i.unshift("1"),i.join("")}function d(t={}){const e={int:"number"==typeof t.int?t.int:void 0,frac:"number"==typeof t.frac?t.frac:void 0,countLeadingZeros:t.countLeadingZeros??!0,fixIntOnBlur:t.fixIntOnBlur??"none",fixFracOnBlur:t.fixFracOnBlur??"none",overflowInputInt:t.overflowInputInt??"none",overflowInputFrac:t.overflowInputFrac??"none",forceFracOnBlur:t.forceFracOnBlur??!1};return{name:"digits",targets:["input"],validate(t,i){const n=String(t);if(""===n||"-"===n||"."===n||"-."===n)return;const{intPart:s,fracPart:r}=c(n);if("number"==typeof e.int){const t=function(t,e){const i=t??"";if(0===i.length)return 0;if(e)return i.length;const n=i.replace(/^0+/,"");return 0===n.length?1:n.length}(s,e.countLeadingZeros);if(t>e.int){if("block"===e.overflowInputInt)return void i.requestRevert({reason:"digits.int_overflow",detail:{limit:e.int,actual:t}});i.pushError({code:"digits.int_overflow",rule:"digits",phase:"validate",detail:{limit:e.int,actual:t}})}}if("number"==typeof e.frac){const t=(r??"").length;if(t>e.frac){if("block"===e.overflowInputFrac)return void i.requestRevert({reason:"digits.frac_overflow",detail:{limit:e.frac,actual:t}});i.pushError({code:"digits.frac_overflow",rule:"digits",phase:"validate",detail:{limit:e.frac,actual:t}})}}},fix(t,i){const n=String(t);if(""===n||"-"===n||"."===n||"-."===n)return n;const s=c(n);let{intPart:r,fracPart:a}=s;const{sign:l,hasDot:o}=s;if("number"==typeof e.int&&"none"!==e.fixIntOnBlur){(r??"").length>e.int&&("truncateLeft"===e.fixIntOnBlur?r=r.slice(r.length-e.int):"truncateRight"===e.fixIntOnBlur?r=r.slice(0,e.int):"clamp"===e.fixIntOnBlur&&(r="9".repeat(e.int)))}if("number"==typeof e.frac&&"none"!==e.fixFracOnBlur&&o){const t=e.frac,i=a??"";if(i.length>t)if("truncate"===e.fixFracOnBlur)a=i.slice(0,t);else if("round"===e.fixFracOnBlur){const e=function(t,e,i){const n=e??"";if(n.length<=i)return{intPart:t,fracPart:n};const s=n.slice(0,i);if(n.charCodeAt(i)-48<5)return{intPart:t,fracPart:s};if(0===i)return{intPart:h(t.length?t:"0"),fracPart:""};let r=1;const a=s.split("");for(let t=a.length-1;t>=0;t--){const e=a[t].charCodeAt(0)-48+r;if(!(e>=10)){a[t]=String.fromCharCode(48+e),r=0;break}a[t]="0",r=1}const l=a.join("");let o=t;return 1===r&&(o=h(t.length?t:"0")),{intPart:o,fracPart:l}}(r,i,t);r=e.intPart,a=e.fracPart}}if(e.forceFracOnBlur&&"number"==typeof e.frac&&e.frac>0){const t=e.frac;o||(a="");const i=a??"";i.length<t&&(a=i+"0".repeat(t-i.length))}if("number"!=typeof e.frac)return`${l}${r}`;if(0===e.frac)return`${l}${r}`;if(o||e.forceFracOnBlur&&e.frac>0){return`${l}${r}.${a??""}`}return`${l}${r}`}}}function m(){return{name:"comma",targets:["input"],format(t){const e=String(t);if(""===e||"-"===e||"."===e||"-."===e)return e;let i="",n=e;n.startsWith("-")&&(i="-",n=n.slice(1));const s=n.indexOf("."),r=s>=0?n.slice(0,s):n,a=s>=0?n.slice(s+1):null,l=r.replace(/\B(?=(\d{3})+(?!\d))/g,",");return null!=a?`${i}${l}.${a}`:`${i}${l}`}}}u.fromDataset=function(t,e){if(null==t.tigRulesNumeric)return null;const i={},n=s(t.tigRulesNumericAllowFullWidth);null!=n&&(i.allowFullWidth=n);const r=s(t.tigRulesNumericAllowMinus);null!=r&&(i.allowMinus=r);const a=s(t.tigRulesNumericAllowDecimal);null!=a&&(i.allowDecimal=a);const l=s(t.tigRulesNumericAllowEmpty);return null!=l&&(i.allowEmpty=l),u(i)},d.fromDataset=function(t,e){if(null==t.tigRulesDigits)return null;const i={},n=r(t.tigRulesDigitsInt);null!=n&&(i.int=n);const l=r(t.tigRulesDigitsFrac);null!=l&&(i.frac=l);const o=s(t.tigRulesDigitsCountLeadingZeros);null!=o&&(i.countLeadingZeros=o);const u=a(t.tigRulesDigitsFixIntOnBlur,["none","truncateLeft","truncateRight","clamp"]);null!=u&&(i.fixIntOnBlur=u);const c=a(t.tigRulesDigitsFixFracOnBlur,["none","truncate","round"]);null!=c&&(i.fixFracOnBlur=c);const h=a(t.tigRulesDigitsOverflowInputInt,["none","block"]);null!=h&&(i.overflowInputInt=h);const m=a(t.tigRulesDigitsOverflowInputFrac,["none","block"]);null!=m&&(i.overflowInputFrac=m);const p=s(t.tigRulesDigitsForceFracOnBlur);return null!=p&&(i.forceFracOnBlur=p),d(i)},m.fromDataset=function(t,e){return null==t.tigRulesComma?null:m()};const p=new class{constructor(t,e){this.attachFn=t,this.ruleFactories=Array.isArray(e)?e:[]}register(t){this.ruleFactories.push(t)}autoAttach(t=document){const e=[],i=[];if(t.querySelectorAll){const e=t.querySelectorAll("input, textarea");for(const t of e)(t instanceof HTMLInputElement||t instanceof HTMLTextAreaElement)&&i.push(t)}(t instanceof HTMLInputElement||t instanceof HTMLTextAreaElement)&&(i.includes(t)||i.push(t));for(const t of i){const i=t.dataset;if("true"===i.tigAttached)continue;if(!o(i))continue;const n={},r=s(i.tigWarn);null!=r&&(n.warn=r),null!=i.tigInvalidClass&&""!==String(i.tigInvalidClass).trim()&&(n.invalidClass=String(i.tigInvalidClass)),n.separateValue={mode:l(i.tigSeparate)};const a=[];for(const e of this.ruleFactories)try{const n=e.fromDataset(i,t);n&&a.push(n)}catch(t){(n.warn??!0)&&console.warn(`[text-input-guard] autoAttach: rule "${e.name}" fromDataset() threw an error.`,t)}if(a.length>0&&(n.rules=a),!n.rules||0===n.rules.length)continue;const u=this.attachFn(t,n);e.push(u),t.dataset.tigAttached="true"}return{detach:()=>{for(const t of e)t.detach()},isValid:()=>e.every(t=>t.isValid()),getErrors:()=>e.flatMap(t=>t.getErrors()),getGuards:()=>e}}}(i,[{name:"numeric",fromDataset:u.fromDataset},{name:"digits",fromDataset:d.fromDataset},{name:"comma",fromDataset:m.fromDataset}]),f={numeric:u,digits:d,comma:m};exports.attach=i,exports.attachAll=function(t,e={}){const n=[];for(const s of t)n.push(i(s,e));return{detach:()=>{for(const t of n)t.detach()},isValid:()=>n.every(t=>t.isValid()),getErrors:()=>n.flatMap(t=>t.getErrors()),getGuards:()=>n}},exports.autoAttach=t=>p.autoAttach(t),exports.comma=m,exports.digits=d,exports.numeric=u,exports.rules=f,exports.version="0.1.0";
|
|
6
|
+
"use strict";class t{originalType;originalId;originalName;originalClass;originalUiAttrs;originalAriaAttrs;originalDataset;createdDisplay;constructor(t){this.originalType=t.type,this.originalId=t.getAttribute("id"),this.originalName=t.getAttribute("name"),this.originalClass=t.className,this.originalUiAttrs={},this.originalAriaAttrs={},this.originalDataset={},this.createdDisplay=null;const e=["placeholder","inputmode","autocomplete","minlength","maxlength","pattern","title","tabindex","style","enterkeyhint","spellcheck"],i=["required","readonly","disabled","autofocus"];for(const i of e)this.originalUiAttrs[i]=t.hasAttribute(i)?t.getAttribute(i):null;for(const e of i)this.originalUiAttrs[e]=t.hasAttribute(e)?"":null;for(const e of t.attributes)e.name.startsWith("aria-")&&(this.originalAriaAttrs[e.name]=e.value??"");for(const[e,i]of Object.entries(t.dataset))e.startsWith("tig")||(this.originalDataset[e]=i)}applyToRaw(t){t.type="hidden",t.removeAttribute("id"),t.className="",t.dataset.tigRole="raw",this.originalId&&(t.dataset.tigOriginalId=this.originalId),this.originalName&&(t.dataset.tigOriginalName=this.originalName)}createDisplay(t){const e=document.createElement("input");e.type="text",e.dataset.tigRole="display",this.originalId&&(e.id=this.originalId),e.className=this.originalClass??"",e.value=t.value;for(const[t,i]of Object.entries(this.originalUiAttrs))null==i?e.removeAttribute(t):e.setAttribute(t,i);for(const[t,i]of Object.entries(this.originalAriaAttrs))e.setAttribute(t,i);for(const[t,i]of Object.entries(this.originalDataset))e.dataset[t]=i;return this.createdDisplay=e,e}removeDisplay(){this.createdDisplay?.parentNode&&this.createdDisplay.parentNode.removeChild(this.createdDisplay),this.createdDisplay=null}restoreRaw(t){t.type=this.originalType,this.originalId?t.setAttribute("id",this.originalId):t.removeAttribute("id"),this.originalName?t.setAttribute("name",this.originalName):t.removeAttribute("name"),t.className=this.originalClass??"",delete t.dataset.tigRole,delete t.dataset.tigOriginalId,delete t.dataset.tigOriginalName}}function e(t,e){e&&console.warn(t)}function i(t,e={}){const i=new n(t,e);return i.init(),i.toGuard()}class n{constructor(t,e){this.originalElement=t,this.options=e;const i=(n=t)instanceof HTMLInputElement?"input":n instanceof HTMLTextAreaElement?"textarea":null;var n;if(!i)throw new TypeError("[text-input-guard] attach() expects an <input> or <textarea> element.");this.kind=i,this.warn=e.warn??!0,this.invalidClass=e.invalidClass??"is-invalid",this.rules=Array.isArray(e.rules)?e.rules:[],this.hostElement=t,this.displayElement=t,this.rawElement=null,this.composing=!1,this.errors=[],this.normalizeCharRules=[],this.normalizeStructureRules=[],this.validateRules=[],this.fixRules=[],this.formatRules=[],this.onCompositionStart=this.onCompositionStart.bind(this),this.onCompositionEnd=this.onCompositionEnd.bind(this),this.onInput=this.onInput.bind(this),this.onBlur=this.onBlur.bind(this),this.onFocus=this.onFocus.bind(this),this.onSelectionChange=this.onSelectionChange.bind(this),this.swapState=null,this.pendingCompositionCommit=!1,this.lastAcceptedValue="",this.lastAcceptedSelection={start:null,end:null,direction:null},this.revertRequest=null}init(){this.buildPipeline(),this.applySeparateValue(),this.bindEvents(),this.evaluateInput()}readSelection(t){return{start:t.selectionStart,end:t.selectionEnd,direction:t.selectionDirection}}writeSelection(t,e){if(null!=e.start&&null!=e.end)try{e.direction?t.setSelectionRange(e.start,e.end,e.direction):t.setSelectionRange(e.start,e.end)}catch(t){}}applySeparateValue(){const i=this.options.separateValue?.mode??"auto";if("swap"!==("auto"===i?this.formatRules.length>0?"swap":"off":i))return;if("input"!==this.kind)return void e('[text-input-guard] separateValue.mode="swap" is not supported for <textarea>. ignored.',this.warn);const n=this.originalElement,s=new t(n);s.applyToRaw(n);const r=s.createDisplay(n);n.after(r),this.swapState=s,this.hostElement=n,this.displayElement=r,this.rawElement=n,this.lastAcceptedValue=r.value,this.lastAcceptedSelection=this.readSelection(r)}restoreSeparateValue(){if(!this.swapState)return;const t=this.swapState,e=this.hostElement,i=t.createdDisplay;if(i)try{e.value=e.value||i.value}catch(t){}t.removeDisplay(),t.restoreRaw(e),this.hostElement=this.originalElement,this.displayElement=this.originalElement,this.rawElement=null,this.swapState=null}detach(){this.unbindEvents(),this.restoreSeparateValue()}buildPipeline(){this.normalizeCharRules=[],this.normalizeStructureRules=[],this.validateRules=[],this.fixRules=[],this.formatRules=[];for(const t of this.rules){"input"===this.kind&&t.targets.includes("input")||"textarea"===this.kind&&t.targets.includes("textarea")?(t.normalizeChar&&this.normalizeCharRules.push(t),t.normalizeStructure&&this.normalizeStructureRules.push(t),t.validate&&this.validateRules.push(t),t.fix&&this.fixRules.push(t),t.format&&this.formatRules.push(t)):e(`[text-input-guard] Rule "${t.name}" is not supported for <${this.kind}>. skipped.`,this.warn)}}bindEvents(){this.displayElement.addEventListener("compositionstart",this.onCompositionStart),this.displayElement.addEventListener("compositionend",this.onCompositionEnd),this.displayElement.addEventListener("input",this.onInput),this.displayElement.addEventListener("blur",this.onBlur),this.displayElement.addEventListener("focus",this.onFocus),this.displayElement.addEventListener("keyup",this.onSelectionChange),this.displayElement.addEventListener("mouseup",this.onSelectionChange),this.displayElement.addEventListener("select",this.onSelectionChange),this.displayElement.addEventListener("focus",this.onSelectionChange)}unbindEvents(){this.displayElement.removeEventListener("compositionstart",this.onCompositionStart),this.displayElement.removeEventListener("compositionend",this.onCompositionEnd),this.displayElement.removeEventListener("input",this.onInput),this.displayElement.removeEventListener("blur",this.onBlur),this.displayElement.removeEventListener("focus",this.onFocus),this.displayElement.removeEventListener("keyup",this.onSelectionChange),this.displayElement.removeEventListener("mouseup",this.onSelectionChange),this.displayElement.removeEventListener("select",this.onSelectionChange),this.displayElement.removeEventListener("focus",this.onSelectionChange)}revertDisplay(t){const e=this.displayElement;e.value=this.lastAcceptedValue,this.writeSelection(e,this.lastAcceptedSelection),this.syncRaw(this.lastAcceptedValue),this.clearErrors(),this.applyInvalidClass(),this.revertRequest=null,this.warn}createCtx(){return{hostElement:this.hostElement,displayElement:this.displayElement,rawElement:this.rawElement,kind:this.kind,warn:this.warn,invalidClass:this.invalidClass,composing:this.composing,pushError:t=>this.errors.push(t),requestRevert:t=>{this.revertRequest||(this.revertRequest=t)}}}clearErrors(){this.errors=[]}runNormalizeChar(t,e){let i=t;for(const t of this.normalizeCharRules)i=t.normalizeChar?t.normalizeChar(i,e):i;return i}runNormalizeStructure(t,e){let i=t;for(const t of this.normalizeStructureRules)i=t.normalizeStructure?t.normalizeStructure(i,e):i;return i}runValidate(t,e){for(const i of this.validateRules)i.validate&&i.validate(t,e)}runFix(t,e){let i=t;for(const t of this.fixRules)i=t.fix?t.fix(i,e):i;return i}runFormat(t,e){let i=t;for(const t of this.formatRules)i=t.format?t.format(i,e):i;return i}applyInvalidClass(){const t=this.displayElement;this.errors.length>0?t.classList.add(this.invalidClass):t.classList.remove(this.invalidClass)}syncRaw(t){this.rawElement&&(this.rawElement.value=t)}syncDisplay(t){(this.displayElement instanceof HTMLInputElement||this.displayElement instanceof HTMLTextAreaElement)&&(this.displayElement.value=t)}onCompositionStart(){this.composing=!0}onCompositionEnd(){this.composing=!1,this.pendingCompositionCommit=!0,queueMicrotask(()=>{this.pendingCompositionCommit&&(this.pendingCompositionCommit=!1,this.evaluateInput())})}onInput(){this.pendingCompositionCommit=!1,this.evaluateInput()}onBlur(){this.evaluateCommit()}onFocus(){if(this.composing)return;const t=this.displayElement,e=t.value,i=this.createCtx();let n=e;n=this.runNormalizeChar(n,i),n=this.runNormalizeStructure(n,i),n!==e&&(this.setDisplayValuePreserveCaret(t,n,i),this.syncRaw(n)),this.lastAcceptedValue=n,this.lastAcceptedSelection=this.readSelection(t),this.onSelectionChange()}onSelectionChange(){if(this.composing)return;const t=this.displayElement;this.lastAcceptedSelection=this.readSelection(t)}setDisplayValuePreserveCaret(t,e,i){const n=t.value;if(n===e)return;const s=t.selectionStart,r=t.selectionEnd;if(null==s||null==r)return void(t.value=e);let a=n.slice(0,s);a=this.runNormalizeChar(a,i),a=this.runNormalizeStructure(a,i),t.value=e;const l=Math.min(a.length,e.length);try{t.setSelectionRange(l,l)}catch(t){}}evaluateInput(){if(this.composing)return;this.clearErrors(),this.revertRequest=null;const t=this.displayElement,e=t.value,i=this.createCtx();let n=e;n=this.runNormalizeChar(n,i),n=this.runNormalizeStructure(n,i),n!==e&&this.setDisplayValuePreserveCaret(t,n,i),this.runValidate(n,i),this.revertRequest?this.revertDisplay(this.revertRequest):(this.syncRaw(n),this.applyInvalidClass(),this.lastAcceptedValue=n,this.lastAcceptedSelection=this.readSelection(t))}evaluateCommit(){if(this.composing)return;this.clearErrors(),this.revertRequest=null;const t=this.displayElement,e=this.createCtx();let i=t.value;if(i=this.runNormalizeChar(i,e),i=this.runNormalizeStructure(i,e),this.runValidate(i,e),this.revertRequest)return void this.revertDisplay(this.revertRequest);if(i=this.runFix(i,e),this.clearErrors(),this.revertRequest=null,this.runValidate(i,e),this.revertRequest)return void this.revertDisplay(this.revertRequest);this.syncRaw(i);let n=i;n=this.runFormat(n,e),this.syncDisplay(n),this.applyInvalidClass(),this.lastAcceptedValue=i,this.lastAcceptedSelection=this.readSelection(t)}isValid(){return 0===this.errors.length}getErrors(){return this.errors.slice()}getRawValue(){return this.hostElement.value}getDisplayValue(){return this.displayElement.value}setValue(t,e="commit"){let i;i=null==t?"":"number"==typeof t?Number.isFinite(t)?String(t):"":String(t);const n=this.displayElement;if(n.value=i,"none"===e)return this.syncRaw(i),this.lastAcceptedValue=i,void(this.lastAcceptedSelection=this.readSelection(n));"input"!==e?this.evaluateCommit():this.evaluateInput()}toGuard(){return{detach:()=>this.detach(),isValid:()=>this.isValid(),getErrors:()=>this.getErrors(),getRawValue:()=>this.getRawValue(),getDisplayValue:()=>this.getDisplayValue(),getRawElement:()=>this.hostElement,getDisplayElement:()=>this.displayElement,evaluate:()=>this.evaluateInput(),commit:()=>this.evaluateCommit(),setValue:(t,e)=>this.setValue(t,e)}}}function s(t){if(null==t)return;const e=String(t).trim().toLowerCase();return""===e||"true"===e||"1"===e||"yes"===e||"on"===e||"false"!==e&&"0"!==e&&"no"!==e&&"off"!==e&&void 0}function r(t){if(null==t)return;const e=String(t).trim();if(""===e)return;const i=Number(e);return Number.isFinite(i)?i:void 0}function a(t,e){if(null==t)return;const i=String(t).trim();return""!==i&&e.includes(i)?i:void 0}function l(t){if(null==t||""===String(t).trim())return"auto";const e=String(t).trim().toLowerCase();return"auto"===e||"swap"===e||"off"===e?e:"auto"}function o(t){if(null!=t.tigSeparate)return!0;if(null!=t.tigWarn)return!0;if(null!=t.tigInvalidClass)return!0;for(const e in t)if(e.startsWith("tigRules"))return!0;return!1}function u(t={}){const e=t.allowFullWidth??!0,i=t.allowMinus??!1,n=t.allowDecimal??!1,s=t.allowEmpty??!0,r=new Set(["ー","-","−","‐","-","‒","–","—","―"]),a=new Set([".","。","。"]);function l(t){if(t>="0"&&t<="9")return t;if(e){const e=function(t){const e=t.charCodeAt(0);return 65296<=e&&e<=65305?String.fromCharCode(e-65296+48):null}(t);if(e)return e}return"."===t||e&&a.has(t)?n?".":"":"-"===t?i?"-":"":e&&r.has(t)&&i?"-":""}return{name:"numeric",targets:["input"],normalizeChar(t){let e=String(t);e=e.replace(/,/g,"");let i="";for(const t of e)i+=l(t);return i},normalizeStructure(t){let e="",s=!1,r=!1;for(const a of String(t))a>="0"&&a<="9"?e+=a:"-"===a&&i?s||0!==e.length||(e+="-",s=!0):"."===a&&n&&(r||(e+=".",r=!0));return e},fix(t){let e=String(t);if(""===e)return s?"":"0";if("-"===e||"."===e||"-."===e)return s?"":"0";e.startsWith("-.")&&(e="-0"+e.slice(1)),e.startsWith(".")&&(e="0"+e),e.endsWith(".")&&(e=e.slice(0,-1));let i="";e.startsWith("-")&&(i="-",e=e.slice(1));const n=e.indexOf(".");let r=n>=0?e.slice(0,n):e;const a=n>=0?e.slice(n+1):"";return r=r.replace(/^0+/,""),""===r&&(r="0"),"-"!==i||"0"!==r||a&&!/^0*$/.test(a)||(i=""),n>=0?`${i}${r}.${a}`:`${i}${r}`},validate(t,e){}}}function c(t){let e="",i=String(t);i.startsWith("-")&&(e="-",i=i.slice(1));const n=i.indexOf(".");if(!(n>=0))return{sign:e,intPart:i,fracPart:"",hasDot:!1};return{sign:e,intPart:i.slice(0,n),fracPart:i.slice(n+1),hasDot:!0}}function h(t){let e=1;const i=t.split("");for(let t=i.length-1;t>=0;t--){const n=i[t].charCodeAt(0)-48+e;if(!(n>=10)){i[t]=String.fromCharCode(48+n),e=0;break}i[t]="0",e=1}return 1===e&&i.unshift("1"),i.join("")}function d(t={}){const e={int:"number"==typeof t.int?t.int:void 0,frac:"number"==typeof t.frac?t.frac:void 0,countLeadingZeros:t.countLeadingZeros??!0,fixIntOnBlur:t.fixIntOnBlur??"none",fixFracOnBlur:t.fixFracOnBlur??"none",overflowInputInt:t.overflowInputInt??"none",overflowInputFrac:t.overflowInputFrac??"none",forceFracOnBlur:t.forceFracOnBlur??!1};return{name:"digits",targets:["input"],validate(t,i){const n=String(t);if(""===n||"-"===n||"."===n||"-."===n)return;const{intPart:s,fracPart:r}=c(n);if("number"==typeof e.int){const t=function(t,e){const i=t??"";if(0===i.length)return 0;if(e)return i.length;const n=i.replace(/^0+/,"");return 0===n.length?1:n.length}(s,e.countLeadingZeros);if(t>e.int){if("block"===e.overflowInputInt)return void i.requestRevert({reason:"digits.int_overflow",detail:{limit:e.int,actual:t}});i.pushError({code:"digits.int_overflow",rule:"digits",phase:"validate",detail:{limit:e.int,actual:t}})}}if("number"==typeof e.frac){const t=(r??"").length;if(t>e.frac){if("block"===e.overflowInputFrac)return void i.requestRevert({reason:"digits.frac_overflow",detail:{limit:e.frac,actual:t}});i.pushError({code:"digits.frac_overflow",rule:"digits",phase:"validate",detail:{limit:e.frac,actual:t}})}}},fix(t,i){const n=String(t);if(""===n||"-"===n||"."===n||"-."===n)return n;const s=c(n);let{intPart:r,fracPart:a}=s;const{sign:l,hasDot:o}=s;if("number"==typeof e.int&&"none"!==e.fixIntOnBlur){(r??"").length>e.int&&("truncateLeft"===e.fixIntOnBlur?r=r.slice(r.length-e.int):"truncateRight"===e.fixIntOnBlur?r=r.slice(0,e.int):"clamp"===e.fixIntOnBlur&&(r="9".repeat(e.int)))}if("number"==typeof e.frac&&"none"!==e.fixFracOnBlur&&o){const t=e.frac,i=a??"";if(i.length>t)if("truncate"===e.fixFracOnBlur)a=i.slice(0,t);else if("round"===e.fixFracOnBlur){const e=function(t,e,i){const n=e??"";if(n.length<=i)return{intPart:t,fracPart:n};const s=n.slice(0,i);if(n.charCodeAt(i)-48<5)return{intPart:t,fracPart:s};if(0===i)return{intPart:h(t.length?t:"0"),fracPart:""};let r=1;const a=s.split("");for(let t=a.length-1;t>=0;t--){const e=a[t].charCodeAt(0)-48+r;if(!(e>=10)){a[t]=String.fromCharCode(48+e),r=0;break}a[t]="0",r=1}const l=a.join("");let o=t;return 1===r&&(o=h(t.length?t:"0")),{intPart:o,fracPart:l}}(r,i,t);r=e.intPart,a=e.fracPart}}if(e.forceFracOnBlur&&"number"==typeof e.frac&&e.frac>0){const t=e.frac;o||(a="");const i=a??"";i.length<t&&(a=i+"0".repeat(t-i.length))}if("number"!=typeof e.frac)return`${l}${r}`;if(0===e.frac)return`${l}${r}`;if(o||e.forceFracOnBlur&&e.frac>0){return`${l}${r}.${a??""}`}return`${l}${r}`}}}function m(){return{name:"comma",targets:["input"],format(t){const e=String(t);if(""===e||"-"===e||"."===e||"-."===e)return e;let i="",n=e;n.startsWith("-")&&(i="-",n=n.slice(1));const s=n.indexOf("."),r=s>=0?n.slice(0,s):n,a=s>=0?n.slice(s+1):null,l=r.replace(/\B(?=(\d{3})+(?!\d))/g,",");return null!=a?`${i}${l}.${a}`:`${i}${l}`}}}u.fromDataset=function(t,e){if(null==t.tigRulesNumeric)return null;const i={},n=s(t.tigRulesNumericAllowFullWidth);null!=n&&(i.allowFullWidth=n);const r=s(t.tigRulesNumericAllowMinus);null!=r&&(i.allowMinus=r);const a=s(t.tigRulesNumericAllowDecimal);null!=a&&(i.allowDecimal=a);const l=s(t.tigRulesNumericAllowEmpty);return null!=l&&(i.allowEmpty=l),u(i)},d.fromDataset=function(t,e){if(null==t.tigRulesDigits)return null;const i={},n=r(t.tigRulesDigitsInt);null!=n&&(i.int=n);const l=r(t.tigRulesDigitsFrac);null!=l&&(i.frac=l);const o=s(t.tigRulesDigitsCountLeadingZeros);null!=o&&(i.countLeadingZeros=o);const u=a(t.tigRulesDigitsFixIntOnBlur,["none","truncateLeft","truncateRight","clamp"]);null!=u&&(i.fixIntOnBlur=u);const c=a(t.tigRulesDigitsFixFracOnBlur,["none","truncate","round"]);null!=c&&(i.fixFracOnBlur=c);const h=a(t.tigRulesDigitsOverflowInputInt,["none","block"]);null!=h&&(i.overflowInputInt=h);const m=a(t.tigRulesDigitsOverflowInputFrac,["none","block"]);null!=m&&(i.overflowInputFrac=m);const p=s(t.tigRulesDigitsForceFracOnBlur);return null!=p&&(i.forceFracOnBlur=p),d(i)},m.fromDataset=function(t,e){return null==t.tigRulesComma?null:m()};const p=new class{constructor(t,e){this.attachFn=t,this.ruleFactories=Array.isArray(e)?e:[]}register(t){this.ruleFactories.push(t)}autoAttach(t=document){const e=[],i=[];if(t.querySelectorAll){const e=t.querySelectorAll("input, textarea");for(const t of e)(t instanceof HTMLInputElement||t instanceof HTMLTextAreaElement)&&i.push(t)}(t instanceof HTMLInputElement||t instanceof HTMLTextAreaElement)&&(i.includes(t)||i.push(t));for(const t of i){const i=t.dataset;if("true"===i.tigAttached)continue;if(!o(i))continue;const n={},r=s(i.tigWarn);null!=r&&(n.warn=r),null!=i.tigInvalidClass&&""!==String(i.tigInvalidClass).trim()&&(n.invalidClass=String(i.tigInvalidClass)),n.separateValue={mode:l(i.tigSeparate)};const a=[];for(const e of this.ruleFactories)try{const n=e.fromDataset(i,t);n&&a.push(n)}catch(t){(n.warn??!0)&&console.warn(`[text-input-guard] autoAttach: rule "${e.name}" fromDataset() threw an error.`,t)}if(a.length>0&&(n.rules=a),!n.rules||0===n.rules.length)continue;const u=this.attachFn(t,n);e.push(u),t.dataset.tigAttached="true"}return{detach:()=>{for(const t of e)t.detach()},isValid:()=>e.every(t=>t.isValid()),getErrors:()=>e.flatMap(t=>t.getErrors()),getGuards:()=>e}}}(i,[{name:"numeric",fromDataset:u.fromDataset},{name:"digits",fromDataset:d.fromDataset},{name:"comma",fromDataset:m.fromDataset}]),f={numeric:u,digits:d,comma:m};exports.attach=i,exports.attachAll=function(t,e={}){const n=[];for(const s of t)n.push(i(s,e));return{detach:()=>{for(const t of n)t.detach()},isValid:()=>n.every(t=>t.isValid()),getErrors:()=>n.flatMap(t=>t.getErrors()),getGuards:()=>n}},exports.autoAttach=t=>p.autoAttach(t),exports.comma=m,exports.digits=d,exports.numeric=u,exports.rules=f,exports.version="0.1.3";
|
|
@@ -114,17 +114,30 @@ class SwapState {
|
|
|
114
114
|
"placeholder",
|
|
115
115
|
"inputmode",
|
|
116
116
|
"autocomplete",
|
|
117
|
-
"required",
|
|
118
117
|
"minlength",
|
|
119
118
|
"maxlength",
|
|
120
119
|
"pattern",
|
|
121
120
|
"title",
|
|
122
|
-
"tabindex"
|
|
121
|
+
"tabindex",
|
|
122
|
+
"style",
|
|
123
|
+
"enterkeyhint",
|
|
124
|
+
"spellcheck"
|
|
125
|
+
];
|
|
126
|
+
|
|
127
|
+
const UI_BOOL_ATTRS = [
|
|
128
|
+
"required",
|
|
129
|
+
"readonly",
|
|
130
|
+
"disabled",
|
|
131
|
+
"autofocus"
|
|
123
132
|
];
|
|
124
133
|
|
|
125
134
|
for (const name of UI_ATTRS) {
|
|
126
|
-
this.originalUiAttrs[name] =
|
|
127
|
-
|
|
135
|
+
this.originalUiAttrs[name] = input.hasAttribute(name) ? input.getAttribute(name) : null;
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
for (const name of UI_BOOL_ATTRS) {
|
|
139
|
+
// booleanは「ある/ない」だけ記録
|
|
140
|
+
this.originalUiAttrs[name] = input.hasAttribute(name) ? "" : null;
|
|
128
141
|
}
|
|
129
142
|
|
|
130
143
|
for (const attr of input.attributes) {
|
|
@@ -184,6 +197,7 @@ class SwapState {
|
|
|
184
197
|
if (v == null) {
|
|
185
198
|
display.removeAttribute(name);
|
|
186
199
|
} else {
|
|
200
|
+
// booleanも "" をセットすればOK
|
|
187
201
|
display.setAttribute(name, v);
|
|
188
202
|
}
|
|
189
203
|
}
|
|
@@ -272,6 +286,24 @@ class SwapState {
|
|
|
272
286
|
* @property {any} [detail] - 追加情報(制限値など)
|
|
273
287
|
*/
|
|
274
288
|
|
|
289
|
+
/**
|
|
290
|
+
* setValue で設定できる値型
|
|
291
|
+
* - number は String に変換して設定する
|
|
292
|
+
* - null/undefined は空文字として扱う
|
|
293
|
+
* @typedef {string | number | null | undefined} SetValueInput
|
|
294
|
+
*/
|
|
295
|
+
|
|
296
|
+
/**
|
|
297
|
+
* setValue 実行モード
|
|
298
|
+
* - "commit" 確定評価まで実行 normalize→validate→fix→format
|
|
299
|
+
* - "input" 入力中評価のみ実行 normalize→validate
|
|
300
|
+
* - "none" 評価は実行しない 値だけを反映
|
|
301
|
+
*
|
|
302
|
+
* 既定値は "commit"
|
|
303
|
+
*
|
|
304
|
+
* @typedef {"none"|"input"|"commit"} SetValueMode
|
|
305
|
+
*/
|
|
306
|
+
|
|
275
307
|
/**
|
|
276
308
|
* attach() が返す公開API(利用者が触れる最小インターフェース)
|
|
277
309
|
* @typedef {Object} Guard
|
|
@@ -282,6 +314,9 @@ class SwapState {
|
|
|
282
314
|
* @property {() => string} getDisplayValue - ユーザーが実際に操作している要素の値を取得
|
|
283
315
|
* @property {() => HTMLInputElement|HTMLTextAreaElement} getRawElement - 送信用の正規化済み値の要素
|
|
284
316
|
* @property {() => HTMLInputElement|HTMLTextAreaElement} getDisplayElement - ユーザーが実際に操作している要素(swap時はdisplay専用)
|
|
317
|
+
* @property {() => void} evaluate 入力中評価を手動実行 normalize→validate
|
|
318
|
+
* @property {() => void} commit 確定評価を手動実行 normalize→validate→fix→format
|
|
319
|
+
* @property {(value: SetValueInput, mode?: SetValueMode) => void} setValue
|
|
285
320
|
*/
|
|
286
321
|
|
|
287
322
|
/**
|
|
@@ -1261,6 +1296,42 @@ class InputGuard {
|
|
|
1261
1296
|
return /** @type {HTMLInputElement|HTMLTextAreaElement} */ (this.displayElement).value;
|
|
1262
1297
|
}
|
|
1263
1298
|
|
|
1299
|
+
/**
|
|
1300
|
+
* 表示要素の値をプログラムから設定する
|
|
1301
|
+
*
|
|
1302
|
+
* @param {SetValueInput} value
|
|
1303
|
+
* @param {SetValueMode} [mode="commit"]
|
|
1304
|
+
* @returns {void}
|
|
1305
|
+
*/
|
|
1306
|
+
setValue(value, mode = "commit") {
|
|
1307
|
+
/** @type {string} */
|
|
1308
|
+
let s;
|
|
1309
|
+
|
|
1310
|
+
if (value == null) {
|
|
1311
|
+
s = "";
|
|
1312
|
+
} else if (typeof value === "number") {
|
|
1313
|
+
// NaN/Infinity は事故りやすいので空に寄せる(方針)
|
|
1314
|
+
s = Number.isFinite(value) ? String(value) : "";
|
|
1315
|
+
} else {
|
|
1316
|
+
s = String(value);
|
|
1317
|
+
}
|
|
1318
|
+
|
|
1319
|
+
const display = /** @type {HTMLInputElement|HTMLTextAreaElement} */ (this.displayElement);
|
|
1320
|
+
display.value = s;
|
|
1321
|
+
|
|
1322
|
+
if (mode === "none") {
|
|
1323
|
+
this.syncRaw(s);
|
|
1324
|
+
this.lastAcceptedValue = s;
|
|
1325
|
+
this.lastAcceptedSelection = this.readSelection(display);
|
|
1326
|
+
return;
|
|
1327
|
+
}
|
|
1328
|
+
if (mode === "input") {
|
|
1329
|
+
this.evaluateInput();
|
|
1330
|
+
return;
|
|
1331
|
+
}
|
|
1332
|
+
this.evaluateCommit();
|
|
1333
|
+
}
|
|
1334
|
+
|
|
1264
1335
|
/**
|
|
1265
1336
|
* 外部に公開する Guard API を生成して返す
|
|
1266
1337
|
* - InputGuard 自体を公開せず、最小の操作だけを渡す
|
|
@@ -1274,7 +1345,10 @@ class InputGuard {
|
|
|
1274
1345
|
getRawValue: () => this.getRawValue(),
|
|
1275
1346
|
getDisplayValue: () => this.getDisplayValue(),
|
|
1276
1347
|
getRawElement: () => /** @type {HTMLInputElement|HTMLTextAreaElement} */ (this.hostElement),
|
|
1277
|
-
getDisplayElement: () => /** @type {HTMLInputElement|HTMLTextAreaElement} */ (this.displayElement)
|
|
1348
|
+
getDisplayElement: () => /** @type {HTMLInputElement|HTMLTextAreaElement} */ (this.displayElement),
|
|
1349
|
+
evaluate: () => this.evaluateInput(),
|
|
1350
|
+
commit: () => this.evaluateCommit(),
|
|
1351
|
+
setValue: (value, mode) => this.setValue(value, mode)
|
|
1278
1352
|
};
|
|
1279
1353
|
}
|
|
1280
1354
|
}
|
|
@@ -2339,10 +2413,10 @@ const rules = {
|
|
|
2339
2413
|
|
|
2340
2414
|
/**
|
|
2341
2415
|
* バージョン(ビルド時に置換したいならここを差し替える)
|
|
2342
|
-
* 例: rollup replace で ""0.1.
|
|
2416
|
+
* 例: rollup replace で ""0.1.3"" を package.json の version に置換
|
|
2343
2417
|
*/
|
|
2344
2418
|
// @ts-ignore
|
|
2345
2419
|
// eslint-disable-next-line no-undef
|
|
2346
|
-
const version = "0.1.
|
|
2420
|
+
const version = "0.1.3" ;
|
|
2347
2421
|
|
|
2348
2422
|
export { attach, attachAll, autoAttach, comma, digits, numeric, rules, version };
|
|
@@ -3,4 +3,4 @@
|
|
|
3
3
|
* AUTHOR: natade (https://github.com/natade-jp/)
|
|
4
4
|
* LICENSE: MIT https://opensource.org/licenses/MIT
|
|
5
5
|
*/
|
|
6
|
-
class t{originalType;originalId;originalName;originalClass;originalUiAttrs;originalAriaAttrs;originalDataset;createdDisplay;constructor(t){this.originalType=t.type,this.originalId=t.getAttribute("id"),this.originalName=t.getAttribute("name"),this.originalClass=t.className,this.originalUiAttrs={},this.originalAriaAttrs={},this.originalDataset={},this.createdDisplay=null;const e=["placeholder","inputmode","autocomplete","required","minlength","maxlength","pattern","title","tabindex"];for(const i of e)this.originalUiAttrs[i]=t.hasAttribute(i)?t.getAttribute(i):null;for(const e of t.attributes)e.name.startsWith("aria-")&&(this.originalAriaAttrs[e.name]=e.value??"");for(const[e,i]of Object.entries(t.dataset))e.startsWith("tig")||(this.originalDataset[e]=i)}applyToRaw(t){t.type="hidden",t.removeAttribute("id"),t.className="",t.dataset.tigRole="raw",this.originalId&&(t.dataset.tigOriginalId=this.originalId),this.originalName&&(t.dataset.tigOriginalName=this.originalName)}createDisplay(t){const e=document.createElement("input");e.type="text",e.dataset.tigRole="display",this.originalId&&(e.id=this.originalId),e.className=this.originalClass??"",e.value=t.value;for(const[t,i]of Object.entries(this.originalUiAttrs))null==i?e.removeAttribute(t):e.setAttribute(t,i);for(const[t,i]of Object.entries(this.originalAriaAttrs))e.setAttribute(t,i);for(const[t,i]of Object.entries(this.originalDataset))e.dataset[t]=i;return this.createdDisplay=e,e}removeDisplay(){this.createdDisplay?.parentNode&&this.createdDisplay.parentNode.removeChild(this.createdDisplay),this.createdDisplay=null}restoreRaw(t){t.type=this.originalType,this.originalId?t.setAttribute("id",this.originalId):t.removeAttribute("id"),this.originalName?t.setAttribute("name",this.originalName):t.removeAttribute("name"),t.className=this.originalClass??"",delete t.dataset.tigRole,delete t.dataset.tigOriginalId,delete t.dataset.tigOriginalName}}function e(t,e){e&&console.warn(t)}function i(t,e={}){const i=new s(t,e);return i.init(),i.toGuard()}function n(t,e={}){const n=[];for(const s of t)n.push(i(s,e));return{detach:()=>{for(const t of n)t.detach()},isValid:()=>n.every(t=>t.isValid()),getErrors:()=>n.flatMap(t=>t.getErrors()),getGuards:()=>n}}class s{constructor(t,e){this.originalElement=t,this.options=e;const i=(n=t)instanceof HTMLInputElement?"input":n instanceof HTMLTextAreaElement?"textarea":null;var n;if(!i)throw new TypeError("[text-input-guard] attach() expects an <input> or <textarea> element.");this.kind=i,this.warn=e.warn??!0,this.invalidClass=e.invalidClass??"is-invalid",this.rules=Array.isArray(e.rules)?e.rules:[],this.hostElement=t,this.displayElement=t,this.rawElement=null,this.composing=!1,this.errors=[],this.normalizeCharRules=[],this.normalizeStructureRules=[],this.validateRules=[],this.fixRules=[],this.formatRules=[],this.onCompositionStart=this.onCompositionStart.bind(this),this.onCompositionEnd=this.onCompositionEnd.bind(this),this.onInput=this.onInput.bind(this),this.onBlur=this.onBlur.bind(this),this.onFocus=this.onFocus.bind(this),this.onSelectionChange=this.onSelectionChange.bind(this),this.swapState=null,this.pendingCompositionCommit=!1,this.lastAcceptedValue="",this.lastAcceptedSelection={start:null,end:null,direction:null},this.revertRequest=null}init(){this.buildPipeline(),this.applySeparateValue(),this.bindEvents(),this.evaluateInput()}readSelection(t){return{start:t.selectionStart,end:t.selectionEnd,direction:t.selectionDirection}}writeSelection(t,e){if(null!=e.start&&null!=e.end)try{e.direction?t.setSelectionRange(e.start,e.end,e.direction):t.setSelectionRange(e.start,e.end)}catch(t){}}applySeparateValue(){const i=this.options.separateValue?.mode??"auto";if("swap"!==("auto"===i?this.formatRules.length>0?"swap":"off":i))return;if("input"!==this.kind)return void e('[text-input-guard] separateValue.mode="swap" is not supported for <textarea>. ignored.',this.warn);const n=this.originalElement,s=new t(n);s.applyToRaw(n);const r=s.createDisplay(n);n.after(r),this.swapState=s,this.hostElement=n,this.displayElement=r,this.rawElement=n,this.lastAcceptedValue=r.value,this.lastAcceptedSelection=this.readSelection(r)}restoreSeparateValue(){if(!this.swapState)return;const t=this.swapState,e=this.hostElement,i=t.createdDisplay;if(i)try{e.value=e.value||i.value}catch(t){}t.removeDisplay(),t.restoreRaw(e),this.hostElement=this.originalElement,this.displayElement=this.originalElement,this.rawElement=null,this.swapState=null}detach(){this.unbindEvents(),this.restoreSeparateValue()}buildPipeline(){this.normalizeCharRules=[],this.normalizeStructureRules=[],this.validateRules=[],this.fixRules=[],this.formatRules=[];for(const t of this.rules){"input"===this.kind&&t.targets.includes("input")||"textarea"===this.kind&&t.targets.includes("textarea")?(t.normalizeChar&&this.normalizeCharRules.push(t),t.normalizeStructure&&this.normalizeStructureRules.push(t),t.validate&&this.validateRules.push(t),t.fix&&this.fixRules.push(t),t.format&&this.formatRules.push(t)):e(`[text-input-guard] Rule "${t.name}" is not supported for <${this.kind}>. skipped.`,this.warn)}}bindEvents(){this.displayElement.addEventListener("compositionstart",this.onCompositionStart),this.displayElement.addEventListener("compositionend",this.onCompositionEnd),this.displayElement.addEventListener("input",this.onInput),this.displayElement.addEventListener("blur",this.onBlur),this.displayElement.addEventListener("focus",this.onFocus),this.displayElement.addEventListener("keyup",this.onSelectionChange),this.displayElement.addEventListener("mouseup",this.onSelectionChange),this.displayElement.addEventListener("select",this.onSelectionChange),this.displayElement.addEventListener("focus",this.onSelectionChange)}unbindEvents(){this.displayElement.removeEventListener("compositionstart",this.onCompositionStart),this.displayElement.removeEventListener("compositionend",this.onCompositionEnd),this.displayElement.removeEventListener("input",this.onInput),this.displayElement.removeEventListener("blur",this.onBlur),this.displayElement.removeEventListener("focus",this.onFocus),this.displayElement.removeEventListener("keyup",this.onSelectionChange),this.displayElement.removeEventListener("mouseup",this.onSelectionChange),this.displayElement.removeEventListener("select",this.onSelectionChange),this.displayElement.removeEventListener("focus",this.onSelectionChange)}revertDisplay(t){const e=this.displayElement;e.value=this.lastAcceptedValue,this.writeSelection(e,this.lastAcceptedSelection),this.syncRaw(this.lastAcceptedValue),this.clearErrors(),this.applyInvalidClass(),this.revertRequest=null,this.warn}createCtx(){return{hostElement:this.hostElement,displayElement:this.displayElement,rawElement:this.rawElement,kind:this.kind,warn:this.warn,invalidClass:this.invalidClass,composing:this.composing,pushError:t=>this.errors.push(t),requestRevert:t=>{this.revertRequest||(this.revertRequest=t)}}}clearErrors(){this.errors=[]}runNormalizeChar(t,e){let i=t;for(const t of this.normalizeCharRules)i=t.normalizeChar?t.normalizeChar(i,e):i;return i}runNormalizeStructure(t,e){let i=t;for(const t of this.normalizeStructureRules)i=t.normalizeStructure?t.normalizeStructure(i,e):i;return i}runValidate(t,e){for(const i of this.validateRules)i.validate&&i.validate(t,e)}runFix(t,e){let i=t;for(const t of this.fixRules)i=t.fix?t.fix(i,e):i;return i}runFormat(t,e){let i=t;for(const t of this.formatRules)i=t.format?t.format(i,e):i;return i}applyInvalidClass(){const t=this.displayElement;this.errors.length>0?t.classList.add(this.invalidClass):t.classList.remove(this.invalidClass)}syncRaw(t){this.rawElement&&(this.rawElement.value=t)}syncDisplay(t){(this.displayElement instanceof HTMLInputElement||this.displayElement instanceof HTMLTextAreaElement)&&(this.displayElement.value=t)}onCompositionStart(){this.composing=!0}onCompositionEnd(){this.composing=!1,this.pendingCompositionCommit=!0,queueMicrotask(()=>{this.pendingCompositionCommit&&(this.pendingCompositionCommit=!1,this.evaluateInput())})}onInput(){this.pendingCompositionCommit=!1,this.evaluateInput()}onBlur(){this.evaluateCommit()}onFocus(){if(this.composing)return;const t=this.displayElement,e=t.value,i=this.createCtx();let n=e;n=this.runNormalizeChar(n,i),n=this.runNormalizeStructure(n,i),n!==e&&(this.setDisplayValuePreserveCaret(t,n,i),this.syncRaw(n)),this.lastAcceptedValue=n,this.lastAcceptedSelection=this.readSelection(t),this.onSelectionChange()}onSelectionChange(){if(this.composing)return;const t=this.displayElement;this.lastAcceptedSelection=this.readSelection(t)}setDisplayValuePreserveCaret(t,e,i){const n=t.value;if(n===e)return;const s=t.selectionStart,r=t.selectionEnd;if(null==s||null==r)return void(t.value=e);let a=n.slice(0,s);a=this.runNormalizeChar(a,i),a=this.runNormalizeStructure(a,i),t.value=e;const l=Math.min(a.length,e.length);try{t.setSelectionRange(l,l)}catch(t){}}evaluateInput(){if(this.composing)return;this.clearErrors(),this.revertRequest=null;const t=this.displayElement,e=t.value,i=this.createCtx();let n=e;n=this.runNormalizeChar(n,i),n=this.runNormalizeStructure(n,i),n!==e&&this.setDisplayValuePreserveCaret(t,n,i),this.runValidate(n,i),this.revertRequest?this.revertDisplay(this.revertRequest):(this.syncRaw(n),this.applyInvalidClass(),this.lastAcceptedValue=n,this.lastAcceptedSelection=this.readSelection(t))}evaluateCommit(){if(this.composing)return;this.clearErrors(),this.revertRequest=null;const t=this.displayElement,e=this.createCtx();let i=t.value;if(i=this.runNormalizeChar(i,e),i=this.runNormalizeStructure(i,e),this.runValidate(i,e),this.revertRequest)return void this.revertDisplay(this.revertRequest);if(i=this.runFix(i,e),this.clearErrors(),this.revertRequest=null,this.runValidate(i,e),this.revertRequest)return void this.revertDisplay(this.revertRequest);this.syncRaw(i);let n=i;n=this.runFormat(n,e),this.syncDisplay(n),this.applyInvalidClass(),this.lastAcceptedValue=i,this.lastAcceptedSelection=this.readSelection(t)}isValid(){return 0===this.errors.length}getErrors(){return this.errors.slice()}getRawValue(){return this.hostElement.value}getDisplayValue(){return this.displayElement.value}toGuard(){return{detach:()=>this.detach(),isValid:()=>this.isValid(),getErrors:()=>this.getErrors(),getRawValue:()=>this.getRawValue(),getDisplayValue:()=>this.getDisplayValue(),getRawElement:()=>this.hostElement,getDisplayElement:()=>this.displayElement}}}function r(t){if(null==t)return;const e=String(t).trim().toLowerCase();return""===e||"true"===e||"1"===e||"yes"===e||"on"===e||"false"!==e&&"0"!==e&&"no"!==e&&"off"!==e&&void 0}function a(t){if(null==t)return;const e=String(t).trim();if(""===e)return;const i=Number(e);return Number.isFinite(i)?i:void 0}function l(t,e){if(null==t)return;const i=String(t).trim();return""!==i&&e.includes(i)?i:void 0}function o(t){if(null==t||""===String(t).trim())return"auto";const e=String(t).trim().toLowerCase();return"auto"===e||"swap"===e||"off"===e?e:"auto"}function u(t){if(null!=t.tigSeparate)return!0;if(null!=t.tigWarn)return!0;if(null!=t.tigInvalidClass)return!0;for(const e in t)if(e.startsWith("tigRules"))return!0;return!1}function c(t={}){const e=t.allowFullWidth??!0,i=t.allowMinus??!1,n=t.allowDecimal??!1,s=t.allowEmpty??!0,r=new Set(["ー","-","−","‐","-","‒","–","—","―"]),a=new Set([".","。","。"]);function l(t){if(t>="0"&&t<="9")return t;if(e){const e=function(t){const e=t.charCodeAt(0);return 65296<=e&&e<=65305?String.fromCharCode(e-65296+48):null}(t);if(e)return e}return"."===t||e&&a.has(t)?n?".":"":"-"===t?i?"-":"":e&&r.has(t)&&i?"-":""}return{name:"numeric",targets:["input"],normalizeChar(t){let e=String(t);e=e.replace(/,/g,"");let i="";for(const t of e)i+=l(t);return i},normalizeStructure(t){let e="",s=!1,r=!1;for(const a of String(t))a>="0"&&a<="9"?e+=a:"-"===a&&i?s||0!==e.length||(e+="-",s=!0):"."===a&&n&&(r||(e+=".",r=!0));return e},fix(t){let e=String(t);if(""===e)return s?"":"0";if("-"===e||"."===e||"-."===e)return s?"":"0";e.startsWith("-.")&&(e="-0"+e.slice(1)),e.startsWith(".")&&(e="0"+e),e.endsWith(".")&&(e=e.slice(0,-1));let i="";e.startsWith("-")&&(i="-",e=e.slice(1));const n=e.indexOf(".");let r=n>=0?e.slice(0,n):e;const a=n>=0?e.slice(n+1):"";return r=r.replace(/^0+/,""),""===r&&(r="0"),"-"!==i||"0"!==r||a&&!/^0*$/.test(a)||(i=""),n>=0?`${i}${r}.${a}`:`${i}${r}`},validate(t,e){}}}function h(t){let e="",i=String(t);i.startsWith("-")&&(e="-",i=i.slice(1));const n=i.indexOf(".");if(!(n>=0))return{sign:e,intPart:i,fracPart:"",hasDot:!1};return{sign:e,intPart:i.slice(0,n),fracPart:i.slice(n+1),hasDot:!0}}function d(t){let e=1;const i=t.split("");for(let t=i.length-1;t>=0;t--){const n=i[t].charCodeAt(0)-48+e;if(!(n>=10)){i[t]=String.fromCharCode(48+n),e=0;break}i[t]="0",e=1}return 1===e&&i.unshift("1"),i.join("")}function m(t={}){const e={int:"number"==typeof t.int?t.int:void 0,frac:"number"==typeof t.frac?t.frac:void 0,countLeadingZeros:t.countLeadingZeros??!0,fixIntOnBlur:t.fixIntOnBlur??"none",fixFracOnBlur:t.fixFracOnBlur??"none",overflowInputInt:t.overflowInputInt??"none",overflowInputFrac:t.overflowInputFrac??"none",forceFracOnBlur:t.forceFracOnBlur??!1};return{name:"digits",targets:["input"],validate(t,i){const n=String(t);if(""===n||"-"===n||"."===n||"-."===n)return;const{intPart:s,fracPart:r}=h(n);if("number"==typeof e.int){const t=function(t,e){const i=t??"";if(0===i.length)return 0;if(e)return i.length;const n=i.replace(/^0+/,"");return 0===n.length?1:n.length}(s,e.countLeadingZeros);if(t>e.int){if("block"===e.overflowInputInt)return void i.requestRevert({reason:"digits.int_overflow",detail:{limit:e.int,actual:t}});i.pushError({code:"digits.int_overflow",rule:"digits",phase:"validate",detail:{limit:e.int,actual:t}})}}if("number"==typeof e.frac){const t=(r??"").length;if(t>e.frac){if("block"===e.overflowInputFrac)return void i.requestRevert({reason:"digits.frac_overflow",detail:{limit:e.frac,actual:t}});i.pushError({code:"digits.frac_overflow",rule:"digits",phase:"validate",detail:{limit:e.frac,actual:t}})}}},fix(t,i){const n=String(t);if(""===n||"-"===n||"."===n||"-."===n)return n;const s=h(n);let{intPart:r,fracPart:a}=s;const{sign:l,hasDot:o}=s;if("number"==typeof e.int&&"none"!==e.fixIntOnBlur){(r??"").length>e.int&&("truncateLeft"===e.fixIntOnBlur?r=r.slice(r.length-e.int):"truncateRight"===e.fixIntOnBlur?r=r.slice(0,e.int):"clamp"===e.fixIntOnBlur&&(r="9".repeat(e.int)))}if("number"==typeof e.frac&&"none"!==e.fixFracOnBlur&&o){const t=e.frac,i=a??"";if(i.length>t)if("truncate"===e.fixFracOnBlur)a=i.slice(0,t);else if("round"===e.fixFracOnBlur){const e=function(t,e,i){const n=e??"";if(n.length<=i)return{intPart:t,fracPart:n};const s=n.slice(0,i);if(n.charCodeAt(i)-48<5)return{intPart:t,fracPart:s};if(0===i)return{intPart:d(t.length?t:"0"),fracPart:""};let r=1;const a=s.split("");for(let t=a.length-1;t>=0;t--){const e=a[t].charCodeAt(0)-48+r;if(!(e>=10)){a[t]=String.fromCharCode(48+e),r=0;break}a[t]="0",r=1}const l=a.join("");let o=t;return 1===r&&(o=d(t.length?t:"0")),{intPart:o,fracPart:l}}(r,i,t);r=e.intPart,a=e.fracPart}}if(e.forceFracOnBlur&&"number"==typeof e.frac&&e.frac>0){const t=e.frac;o||(a="");const i=a??"";i.length<t&&(a=i+"0".repeat(t-i.length))}if("number"!=typeof e.frac)return`${l}${r}`;if(0===e.frac)return`${l}${r}`;if(o||e.forceFracOnBlur&&e.frac>0){return`${l}${r}.${a??""}`}return`${l}${r}`}}}function f(){return{name:"comma",targets:["input"],format(t){const e=String(t);if(""===e||"-"===e||"."===e||"-."===e)return e;let i="",n=e;n.startsWith("-")&&(i="-",n=n.slice(1));const s=n.indexOf("."),r=s>=0?n.slice(0,s):n,a=s>=0?n.slice(s+1):null,l=r.replace(/\B(?=(\d{3})+(?!\d))/g,",");return null!=a?`${i}${l}.${a}`:`${i}${l}`}}}c.fromDataset=function(t,e){if(null==t.tigRulesNumeric)return null;const i={},n=r(t.tigRulesNumericAllowFullWidth);null!=n&&(i.allowFullWidth=n);const s=r(t.tigRulesNumericAllowMinus);null!=s&&(i.allowMinus=s);const a=r(t.tigRulesNumericAllowDecimal);null!=a&&(i.allowDecimal=a);const l=r(t.tigRulesNumericAllowEmpty);return null!=l&&(i.allowEmpty=l),c(i)},m.fromDataset=function(t,e){if(null==t.tigRulesDigits)return null;const i={},n=a(t.tigRulesDigitsInt);null!=n&&(i.int=n);const s=a(t.tigRulesDigitsFrac);null!=s&&(i.frac=s);const o=r(t.tigRulesDigitsCountLeadingZeros);null!=o&&(i.countLeadingZeros=o);const u=l(t.tigRulesDigitsFixIntOnBlur,["none","truncateLeft","truncateRight","clamp"]);null!=u&&(i.fixIntOnBlur=u);const c=l(t.tigRulesDigitsFixFracOnBlur,["none","truncate","round"]);null!=c&&(i.fixFracOnBlur=c);const h=l(t.tigRulesDigitsOverflowInputInt,["none","block"]);null!=h&&(i.overflowInputInt=h);const d=l(t.tigRulesDigitsOverflowInputFrac,["none","block"]);null!=d&&(i.overflowInputFrac=d);const f=r(t.tigRulesDigitsForceFracOnBlur);return null!=f&&(i.forceFracOnBlur=f),m(i)},f.fromDataset=function(t,e){return null==t.tigRulesComma?null:f()};const p=new class{constructor(t,e){this.attachFn=t,this.ruleFactories=Array.isArray(e)?e:[]}register(t){this.ruleFactories.push(t)}autoAttach(t=document){const e=[],i=[];if(t.querySelectorAll){const e=t.querySelectorAll("input, textarea");for(const t of e)(t instanceof HTMLInputElement||t instanceof HTMLTextAreaElement)&&i.push(t)}(t instanceof HTMLInputElement||t instanceof HTMLTextAreaElement)&&(i.includes(t)||i.push(t));for(const t of i){const i=t.dataset;if("true"===i.tigAttached)continue;if(!u(i))continue;const n={},s=r(i.tigWarn);null!=s&&(n.warn=s),null!=i.tigInvalidClass&&""!==String(i.tigInvalidClass).trim()&&(n.invalidClass=String(i.tigInvalidClass)),n.separateValue={mode:o(i.tigSeparate)};const a=[];for(const e of this.ruleFactories)try{const n=e.fromDataset(i,t);n&&a.push(n)}catch(t){(n.warn??!0)&&console.warn(`[text-input-guard] autoAttach: rule "${e.name}" fromDataset() threw an error.`,t)}if(a.length>0&&(n.rules=a),!n.rules||0===n.rules.length)continue;const l=this.attachFn(t,n);e.push(l),t.dataset.tigAttached="true"}return{detach:()=>{for(const t of e)t.detach()},isValid:()=>e.every(t=>t.isValid()),getErrors:()=>e.flatMap(t=>t.getErrors()),getGuards:()=>e}}}(i,[{name:"numeric",fromDataset:c.fromDataset},{name:"digits",fromDataset:m.fromDataset},{name:"comma",fromDataset:f.fromDataset}]),g=t=>p.autoAttach(t),v={numeric:c,digits:m,comma:f},E="0.1.0";export{i as attach,n as attachAll,g as autoAttach,f as comma,m as digits,c as numeric,v as rules,E as version};
|
|
6
|
+
class t{originalType;originalId;originalName;originalClass;originalUiAttrs;originalAriaAttrs;originalDataset;createdDisplay;constructor(t){this.originalType=t.type,this.originalId=t.getAttribute("id"),this.originalName=t.getAttribute("name"),this.originalClass=t.className,this.originalUiAttrs={},this.originalAriaAttrs={},this.originalDataset={},this.createdDisplay=null;const e=["placeholder","inputmode","autocomplete","minlength","maxlength","pattern","title","tabindex","style","enterkeyhint","spellcheck"],i=["required","readonly","disabled","autofocus"];for(const i of e)this.originalUiAttrs[i]=t.hasAttribute(i)?t.getAttribute(i):null;for(const e of i)this.originalUiAttrs[e]=t.hasAttribute(e)?"":null;for(const e of t.attributes)e.name.startsWith("aria-")&&(this.originalAriaAttrs[e.name]=e.value??"");for(const[e,i]of Object.entries(t.dataset))e.startsWith("tig")||(this.originalDataset[e]=i)}applyToRaw(t){t.type="hidden",t.removeAttribute("id"),t.className="",t.dataset.tigRole="raw",this.originalId&&(t.dataset.tigOriginalId=this.originalId),this.originalName&&(t.dataset.tigOriginalName=this.originalName)}createDisplay(t){const e=document.createElement("input");e.type="text",e.dataset.tigRole="display",this.originalId&&(e.id=this.originalId),e.className=this.originalClass??"",e.value=t.value;for(const[t,i]of Object.entries(this.originalUiAttrs))null==i?e.removeAttribute(t):e.setAttribute(t,i);for(const[t,i]of Object.entries(this.originalAriaAttrs))e.setAttribute(t,i);for(const[t,i]of Object.entries(this.originalDataset))e.dataset[t]=i;return this.createdDisplay=e,e}removeDisplay(){this.createdDisplay?.parentNode&&this.createdDisplay.parentNode.removeChild(this.createdDisplay),this.createdDisplay=null}restoreRaw(t){t.type=this.originalType,this.originalId?t.setAttribute("id",this.originalId):t.removeAttribute("id"),this.originalName?t.setAttribute("name",this.originalName):t.removeAttribute("name"),t.className=this.originalClass??"",delete t.dataset.tigRole,delete t.dataset.tigOriginalId,delete t.dataset.tigOriginalName}}function e(t,e){e&&console.warn(t)}function i(t,e={}){const i=new s(t,e);return i.init(),i.toGuard()}function n(t,e={}){const n=[];for(const s of t)n.push(i(s,e));return{detach:()=>{for(const t of n)t.detach()},isValid:()=>n.every(t=>t.isValid()),getErrors:()=>n.flatMap(t=>t.getErrors()),getGuards:()=>n}}class s{constructor(t,e){this.originalElement=t,this.options=e;const i=(n=t)instanceof HTMLInputElement?"input":n instanceof HTMLTextAreaElement?"textarea":null;var n;if(!i)throw new TypeError("[text-input-guard] attach() expects an <input> or <textarea> element.");this.kind=i,this.warn=e.warn??!0,this.invalidClass=e.invalidClass??"is-invalid",this.rules=Array.isArray(e.rules)?e.rules:[],this.hostElement=t,this.displayElement=t,this.rawElement=null,this.composing=!1,this.errors=[],this.normalizeCharRules=[],this.normalizeStructureRules=[],this.validateRules=[],this.fixRules=[],this.formatRules=[],this.onCompositionStart=this.onCompositionStart.bind(this),this.onCompositionEnd=this.onCompositionEnd.bind(this),this.onInput=this.onInput.bind(this),this.onBlur=this.onBlur.bind(this),this.onFocus=this.onFocus.bind(this),this.onSelectionChange=this.onSelectionChange.bind(this),this.swapState=null,this.pendingCompositionCommit=!1,this.lastAcceptedValue="",this.lastAcceptedSelection={start:null,end:null,direction:null},this.revertRequest=null}init(){this.buildPipeline(),this.applySeparateValue(),this.bindEvents(),this.evaluateInput()}readSelection(t){return{start:t.selectionStart,end:t.selectionEnd,direction:t.selectionDirection}}writeSelection(t,e){if(null!=e.start&&null!=e.end)try{e.direction?t.setSelectionRange(e.start,e.end,e.direction):t.setSelectionRange(e.start,e.end)}catch(t){}}applySeparateValue(){const i=this.options.separateValue?.mode??"auto";if("swap"!==("auto"===i?this.formatRules.length>0?"swap":"off":i))return;if("input"!==this.kind)return void e('[text-input-guard] separateValue.mode="swap" is not supported for <textarea>. ignored.',this.warn);const n=this.originalElement,s=new t(n);s.applyToRaw(n);const r=s.createDisplay(n);n.after(r),this.swapState=s,this.hostElement=n,this.displayElement=r,this.rawElement=n,this.lastAcceptedValue=r.value,this.lastAcceptedSelection=this.readSelection(r)}restoreSeparateValue(){if(!this.swapState)return;const t=this.swapState,e=this.hostElement,i=t.createdDisplay;if(i)try{e.value=e.value||i.value}catch(t){}t.removeDisplay(),t.restoreRaw(e),this.hostElement=this.originalElement,this.displayElement=this.originalElement,this.rawElement=null,this.swapState=null}detach(){this.unbindEvents(),this.restoreSeparateValue()}buildPipeline(){this.normalizeCharRules=[],this.normalizeStructureRules=[],this.validateRules=[],this.fixRules=[],this.formatRules=[];for(const t of this.rules){"input"===this.kind&&t.targets.includes("input")||"textarea"===this.kind&&t.targets.includes("textarea")?(t.normalizeChar&&this.normalizeCharRules.push(t),t.normalizeStructure&&this.normalizeStructureRules.push(t),t.validate&&this.validateRules.push(t),t.fix&&this.fixRules.push(t),t.format&&this.formatRules.push(t)):e(`[text-input-guard] Rule "${t.name}" is not supported for <${this.kind}>. skipped.`,this.warn)}}bindEvents(){this.displayElement.addEventListener("compositionstart",this.onCompositionStart),this.displayElement.addEventListener("compositionend",this.onCompositionEnd),this.displayElement.addEventListener("input",this.onInput),this.displayElement.addEventListener("blur",this.onBlur),this.displayElement.addEventListener("focus",this.onFocus),this.displayElement.addEventListener("keyup",this.onSelectionChange),this.displayElement.addEventListener("mouseup",this.onSelectionChange),this.displayElement.addEventListener("select",this.onSelectionChange),this.displayElement.addEventListener("focus",this.onSelectionChange)}unbindEvents(){this.displayElement.removeEventListener("compositionstart",this.onCompositionStart),this.displayElement.removeEventListener("compositionend",this.onCompositionEnd),this.displayElement.removeEventListener("input",this.onInput),this.displayElement.removeEventListener("blur",this.onBlur),this.displayElement.removeEventListener("focus",this.onFocus),this.displayElement.removeEventListener("keyup",this.onSelectionChange),this.displayElement.removeEventListener("mouseup",this.onSelectionChange),this.displayElement.removeEventListener("select",this.onSelectionChange),this.displayElement.removeEventListener("focus",this.onSelectionChange)}revertDisplay(t){const e=this.displayElement;e.value=this.lastAcceptedValue,this.writeSelection(e,this.lastAcceptedSelection),this.syncRaw(this.lastAcceptedValue),this.clearErrors(),this.applyInvalidClass(),this.revertRequest=null,this.warn}createCtx(){return{hostElement:this.hostElement,displayElement:this.displayElement,rawElement:this.rawElement,kind:this.kind,warn:this.warn,invalidClass:this.invalidClass,composing:this.composing,pushError:t=>this.errors.push(t),requestRevert:t=>{this.revertRequest||(this.revertRequest=t)}}}clearErrors(){this.errors=[]}runNormalizeChar(t,e){let i=t;for(const t of this.normalizeCharRules)i=t.normalizeChar?t.normalizeChar(i,e):i;return i}runNormalizeStructure(t,e){let i=t;for(const t of this.normalizeStructureRules)i=t.normalizeStructure?t.normalizeStructure(i,e):i;return i}runValidate(t,e){for(const i of this.validateRules)i.validate&&i.validate(t,e)}runFix(t,e){let i=t;for(const t of this.fixRules)i=t.fix?t.fix(i,e):i;return i}runFormat(t,e){let i=t;for(const t of this.formatRules)i=t.format?t.format(i,e):i;return i}applyInvalidClass(){const t=this.displayElement;this.errors.length>0?t.classList.add(this.invalidClass):t.classList.remove(this.invalidClass)}syncRaw(t){this.rawElement&&(this.rawElement.value=t)}syncDisplay(t){(this.displayElement instanceof HTMLInputElement||this.displayElement instanceof HTMLTextAreaElement)&&(this.displayElement.value=t)}onCompositionStart(){this.composing=!0}onCompositionEnd(){this.composing=!1,this.pendingCompositionCommit=!0,queueMicrotask(()=>{this.pendingCompositionCommit&&(this.pendingCompositionCommit=!1,this.evaluateInput())})}onInput(){this.pendingCompositionCommit=!1,this.evaluateInput()}onBlur(){this.evaluateCommit()}onFocus(){if(this.composing)return;const t=this.displayElement,e=t.value,i=this.createCtx();let n=e;n=this.runNormalizeChar(n,i),n=this.runNormalizeStructure(n,i),n!==e&&(this.setDisplayValuePreserveCaret(t,n,i),this.syncRaw(n)),this.lastAcceptedValue=n,this.lastAcceptedSelection=this.readSelection(t),this.onSelectionChange()}onSelectionChange(){if(this.composing)return;const t=this.displayElement;this.lastAcceptedSelection=this.readSelection(t)}setDisplayValuePreserveCaret(t,e,i){const n=t.value;if(n===e)return;const s=t.selectionStart,r=t.selectionEnd;if(null==s||null==r)return void(t.value=e);let a=n.slice(0,s);a=this.runNormalizeChar(a,i),a=this.runNormalizeStructure(a,i),t.value=e;const l=Math.min(a.length,e.length);try{t.setSelectionRange(l,l)}catch(t){}}evaluateInput(){if(this.composing)return;this.clearErrors(),this.revertRequest=null;const t=this.displayElement,e=t.value,i=this.createCtx();let n=e;n=this.runNormalizeChar(n,i),n=this.runNormalizeStructure(n,i),n!==e&&this.setDisplayValuePreserveCaret(t,n,i),this.runValidate(n,i),this.revertRequest?this.revertDisplay(this.revertRequest):(this.syncRaw(n),this.applyInvalidClass(),this.lastAcceptedValue=n,this.lastAcceptedSelection=this.readSelection(t))}evaluateCommit(){if(this.composing)return;this.clearErrors(),this.revertRequest=null;const t=this.displayElement,e=this.createCtx();let i=t.value;if(i=this.runNormalizeChar(i,e),i=this.runNormalizeStructure(i,e),this.runValidate(i,e),this.revertRequest)return void this.revertDisplay(this.revertRequest);if(i=this.runFix(i,e),this.clearErrors(),this.revertRequest=null,this.runValidate(i,e),this.revertRequest)return void this.revertDisplay(this.revertRequest);this.syncRaw(i);let n=i;n=this.runFormat(n,e),this.syncDisplay(n),this.applyInvalidClass(),this.lastAcceptedValue=i,this.lastAcceptedSelection=this.readSelection(t)}isValid(){return 0===this.errors.length}getErrors(){return this.errors.slice()}getRawValue(){return this.hostElement.value}getDisplayValue(){return this.displayElement.value}setValue(t,e="commit"){let i;i=null==t?"":"number"==typeof t?Number.isFinite(t)?String(t):"":String(t);const n=this.displayElement;if(n.value=i,"none"===e)return this.syncRaw(i),this.lastAcceptedValue=i,void(this.lastAcceptedSelection=this.readSelection(n));"input"!==e?this.evaluateCommit():this.evaluateInput()}toGuard(){return{detach:()=>this.detach(),isValid:()=>this.isValid(),getErrors:()=>this.getErrors(),getRawValue:()=>this.getRawValue(),getDisplayValue:()=>this.getDisplayValue(),getRawElement:()=>this.hostElement,getDisplayElement:()=>this.displayElement,evaluate:()=>this.evaluateInput(),commit:()=>this.evaluateCommit(),setValue:(t,e)=>this.setValue(t,e)}}}function r(t){if(null==t)return;const e=String(t).trim().toLowerCase();return""===e||"true"===e||"1"===e||"yes"===e||"on"===e||"false"!==e&&"0"!==e&&"no"!==e&&"off"!==e&&void 0}function a(t){if(null==t)return;const e=String(t).trim();if(""===e)return;const i=Number(e);return Number.isFinite(i)?i:void 0}function l(t,e){if(null==t)return;const i=String(t).trim();return""!==i&&e.includes(i)?i:void 0}function o(t){if(null==t||""===String(t).trim())return"auto";const e=String(t).trim().toLowerCase();return"auto"===e||"swap"===e||"off"===e?e:"auto"}function u(t){if(null!=t.tigSeparate)return!0;if(null!=t.tigWarn)return!0;if(null!=t.tigInvalidClass)return!0;for(const e in t)if(e.startsWith("tigRules"))return!0;return!1}function c(t={}){const e=t.allowFullWidth??!0,i=t.allowMinus??!1,n=t.allowDecimal??!1,s=t.allowEmpty??!0,r=new Set(["ー","-","−","‐","-","‒","–","—","―"]),a=new Set([".","。","。"]);function l(t){if(t>="0"&&t<="9")return t;if(e){const e=function(t){const e=t.charCodeAt(0);return 65296<=e&&e<=65305?String.fromCharCode(e-65296+48):null}(t);if(e)return e}return"."===t||e&&a.has(t)?n?".":"":"-"===t?i?"-":"":e&&r.has(t)&&i?"-":""}return{name:"numeric",targets:["input"],normalizeChar(t){let e=String(t);e=e.replace(/,/g,"");let i="";for(const t of e)i+=l(t);return i},normalizeStructure(t){let e="",s=!1,r=!1;for(const a of String(t))a>="0"&&a<="9"?e+=a:"-"===a&&i?s||0!==e.length||(e+="-",s=!0):"."===a&&n&&(r||(e+=".",r=!0));return e},fix(t){let e=String(t);if(""===e)return s?"":"0";if("-"===e||"."===e||"-."===e)return s?"":"0";e.startsWith("-.")&&(e="-0"+e.slice(1)),e.startsWith(".")&&(e="0"+e),e.endsWith(".")&&(e=e.slice(0,-1));let i="";e.startsWith("-")&&(i="-",e=e.slice(1));const n=e.indexOf(".");let r=n>=0?e.slice(0,n):e;const a=n>=0?e.slice(n+1):"";return r=r.replace(/^0+/,""),""===r&&(r="0"),"-"!==i||"0"!==r||a&&!/^0*$/.test(a)||(i=""),n>=0?`${i}${r}.${a}`:`${i}${r}`},validate(t,e){}}}function h(t){let e="",i=String(t);i.startsWith("-")&&(e="-",i=i.slice(1));const n=i.indexOf(".");if(!(n>=0))return{sign:e,intPart:i,fracPart:"",hasDot:!1};return{sign:e,intPart:i.slice(0,n),fracPart:i.slice(n+1),hasDot:!0}}function d(t){let e=1;const i=t.split("");for(let t=i.length-1;t>=0;t--){const n=i[t].charCodeAt(0)-48+e;if(!(n>=10)){i[t]=String.fromCharCode(48+n),e=0;break}i[t]="0",e=1}return 1===e&&i.unshift("1"),i.join("")}function m(t={}){const e={int:"number"==typeof t.int?t.int:void 0,frac:"number"==typeof t.frac?t.frac:void 0,countLeadingZeros:t.countLeadingZeros??!0,fixIntOnBlur:t.fixIntOnBlur??"none",fixFracOnBlur:t.fixFracOnBlur??"none",overflowInputInt:t.overflowInputInt??"none",overflowInputFrac:t.overflowInputFrac??"none",forceFracOnBlur:t.forceFracOnBlur??!1};return{name:"digits",targets:["input"],validate(t,i){const n=String(t);if(""===n||"-"===n||"."===n||"-."===n)return;const{intPart:s,fracPart:r}=h(n);if("number"==typeof e.int){const t=function(t,e){const i=t??"";if(0===i.length)return 0;if(e)return i.length;const n=i.replace(/^0+/,"");return 0===n.length?1:n.length}(s,e.countLeadingZeros);if(t>e.int){if("block"===e.overflowInputInt)return void i.requestRevert({reason:"digits.int_overflow",detail:{limit:e.int,actual:t}});i.pushError({code:"digits.int_overflow",rule:"digits",phase:"validate",detail:{limit:e.int,actual:t}})}}if("number"==typeof e.frac){const t=(r??"").length;if(t>e.frac){if("block"===e.overflowInputFrac)return void i.requestRevert({reason:"digits.frac_overflow",detail:{limit:e.frac,actual:t}});i.pushError({code:"digits.frac_overflow",rule:"digits",phase:"validate",detail:{limit:e.frac,actual:t}})}}},fix(t,i){const n=String(t);if(""===n||"-"===n||"."===n||"-."===n)return n;const s=h(n);let{intPart:r,fracPart:a}=s;const{sign:l,hasDot:o}=s;if("number"==typeof e.int&&"none"!==e.fixIntOnBlur){(r??"").length>e.int&&("truncateLeft"===e.fixIntOnBlur?r=r.slice(r.length-e.int):"truncateRight"===e.fixIntOnBlur?r=r.slice(0,e.int):"clamp"===e.fixIntOnBlur&&(r="9".repeat(e.int)))}if("number"==typeof e.frac&&"none"!==e.fixFracOnBlur&&o){const t=e.frac,i=a??"";if(i.length>t)if("truncate"===e.fixFracOnBlur)a=i.slice(0,t);else if("round"===e.fixFracOnBlur){const e=function(t,e,i){const n=e??"";if(n.length<=i)return{intPart:t,fracPart:n};const s=n.slice(0,i);if(n.charCodeAt(i)-48<5)return{intPart:t,fracPart:s};if(0===i)return{intPart:d(t.length?t:"0"),fracPart:""};let r=1;const a=s.split("");for(let t=a.length-1;t>=0;t--){const e=a[t].charCodeAt(0)-48+r;if(!(e>=10)){a[t]=String.fromCharCode(48+e),r=0;break}a[t]="0",r=1}const l=a.join("");let o=t;return 1===r&&(o=d(t.length?t:"0")),{intPart:o,fracPart:l}}(r,i,t);r=e.intPart,a=e.fracPart}}if(e.forceFracOnBlur&&"number"==typeof e.frac&&e.frac>0){const t=e.frac;o||(a="");const i=a??"";i.length<t&&(a=i+"0".repeat(t-i.length))}if("number"!=typeof e.frac)return`${l}${r}`;if(0===e.frac)return`${l}${r}`;if(o||e.forceFracOnBlur&&e.frac>0){return`${l}${r}.${a??""}`}return`${l}${r}`}}}function p(){return{name:"comma",targets:["input"],format(t){const e=String(t);if(""===e||"-"===e||"."===e||"-."===e)return e;let i="",n=e;n.startsWith("-")&&(i="-",n=n.slice(1));const s=n.indexOf("."),r=s>=0?n.slice(0,s):n,a=s>=0?n.slice(s+1):null,l=r.replace(/\B(?=(\d{3})+(?!\d))/g,",");return null!=a?`${i}${l}.${a}`:`${i}${l}`}}}c.fromDataset=function(t,e){if(null==t.tigRulesNumeric)return null;const i={},n=r(t.tigRulesNumericAllowFullWidth);null!=n&&(i.allowFullWidth=n);const s=r(t.tigRulesNumericAllowMinus);null!=s&&(i.allowMinus=s);const a=r(t.tigRulesNumericAllowDecimal);null!=a&&(i.allowDecimal=a);const l=r(t.tigRulesNumericAllowEmpty);return null!=l&&(i.allowEmpty=l),c(i)},m.fromDataset=function(t,e){if(null==t.tigRulesDigits)return null;const i={},n=a(t.tigRulesDigitsInt);null!=n&&(i.int=n);const s=a(t.tigRulesDigitsFrac);null!=s&&(i.frac=s);const o=r(t.tigRulesDigitsCountLeadingZeros);null!=o&&(i.countLeadingZeros=o);const u=l(t.tigRulesDigitsFixIntOnBlur,["none","truncateLeft","truncateRight","clamp"]);null!=u&&(i.fixIntOnBlur=u);const c=l(t.tigRulesDigitsFixFracOnBlur,["none","truncate","round"]);null!=c&&(i.fixFracOnBlur=c);const h=l(t.tigRulesDigitsOverflowInputInt,["none","block"]);null!=h&&(i.overflowInputInt=h);const d=l(t.tigRulesDigitsOverflowInputFrac,["none","block"]);null!=d&&(i.overflowInputFrac=d);const p=r(t.tigRulesDigitsForceFracOnBlur);return null!=p&&(i.forceFracOnBlur=p),m(i)},p.fromDataset=function(t,e){return null==t.tigRulesComma?null:p()};const f=new class{constructor(t,e){this.attachFn=t,this.ruleFactories=Array.isArray(e)?e:[]}register(t){this.ruleFactories.push(t)}autoAttach(t=document){const e=[],i=[];if(t.querySelectorAll){const e=t.querySelectorAll("input, textarea");for(const t of e)(t instanceof HTMLInputElement||t instanceof HTMLTextAreaElement)&&i.push(t)}(t instanceof HTMLInputElement||t instanceof HTMLTextAreaElement)&&(i.includes(t)||i.push(t));for(const t of i){const i=t.dataset;if("true"===i.tigAttached)continue;if(!u(i))continue;const n={},s=r(i.tigWarn);null!=s&&(n.warn=s),null!=i.tigInvalidClass&&""!==String(i.tigInvalidClass).trim()&&(n.invalidClass=String(i.tigInvalidClass)),n.separateValue={mode:o(i.tigSeparate)};const a=[];for(const e of this.ruleFactories)try{const n=e.fromDataset(i,t);n&&a.push(n)}catch(t){(n.warn??!0)&&console.warn(`[text-input-guard] autoAttach: rule "${e.name}" fromDataset() threw an error.`,t)}if(a.length>0&&(n.rules=a),!n.rules||0===n.rules.length)continue;const l=this.attachFn(t,n);e.push(l),t.dataset.tigAttached="true"}return{detach:()=>{for(const t of e)t.detach()},isValid:()=>e.every(t=>t.isValid()),getErrors:()=>e.flatMap(t=>t.getErrors()),getGuards:()=>e}}}(i,[{name:"numeric",fromDataset:c.fromDataset},{name:"digits",fromDataset:m.fromDataset},{name:"comma",fromDataset:p.fromDataset}]),g=t=>f.autoAttach(t),v={numeric:c,digits:m,comma:p},y="0.1.3";export{i as attach,n as attachAll,g as autoAttach,p as comma,m as digits,c as numeric,v as rules,y as version};
|
|
@@ -66,6 +66,21 @@ type TigError = {
|
|
|
66
66
|
*/
|
|
67
67
|
detail?: any;
|
|
68
68
|
};
|
|
69
|
+
/**
|
|
70
|
+
* setValue で設定できる値型
|
|
71
|
+
* - number は String に変換して設定する
|
|
72
|
+
* - null/undefined は空文字として扱う
|
|
73
|
+
*/
|
|
74
|
+
type SetValueInput = string | number | null | undefined;
|
|
75
|
+
/**
|
|
76
|
+
* setValue 実行モード
|
|
77
|
+
* - "commit" 確定評価まで実行 normalize→validate→fix→format
|
|
78
|
+
* - "input" 入力中評価のみ実行 normalize→validate
|
|
79
|
+
* - "none" 評価は実行しない 値だけを反映
|
|
80
|
+
*
|
|
81
|
+
* 既定値は "commit"
|
|
82
|
+
*/
|
|
83
|
+
type SetValueMode = "none" | "input" | "commit";
|
|
69
84
|
/**
|
|
70
85
|
* attach() が返す公開API(利用者が触れる最小インターフェース)
|
|
71
86
|
*/
|
|
@@ -98,6 +113,15 @@ type Guard = {
|
|
|
98
113
|
* - ユーザーが実際に操作している要素(swap時はdisplay専用)
|
|
99
114
|
*/
|
|
100
115
|
getDisplayElement: () => HTMLInputElement | HTMLTextAreaElement;
|
|
116
|
+
/**
|
|
117
|
+
* 入力中評価を手動実行 normalize→validate
|
|
118
|
+
*/
|
|
119
|
+
evaluate: () => void;
|
|
120
|
+
/**
|
|
121
|
+
* 確定評価を手動実行 normalize→validate→fix→format
|
|
122
|
+
*/
|
|
123
|
+
commit: () => void;
|
|
124
|
+
setValue: (value: SetValueInput, mode?: SetValueMode) => void;
|
|
101
125
|
};
|
|
102
126
|
/**
|
|
103
127
|
* 各ルールに渡される実行コンテキスト
|
|
@@ -239,4 +263,4 @@ type RevertRequest = {
|
|
|
239
263
|
};
|
|
240
264
|
|
|
241
265
|
export { attach, attachAll };
|
|
242
|
-
export type { AttachOptions, ElementKind, Guard, GuardContext, GuardGroup, PhaseName, RevertRequest, Rule, SelectionState, SeparateValueOptions, TigError };
|
|
266
|
+
export type { AttachOptions, ElementKind, Guard, GuardContext, GuardGroup, PhaseName, RevertRequest, Rule, SelectionState, SeparateValueOptions, SetValueInput, SetValueMode, TigError };
|
|
@@ -120,17 +120,30 @@
|
|
|
120
120
|
"placeholder",
|
|
121
121
|
"inputmode",
|
|
122
122
|
"autocomplete",
|
|
123
|
-
"required",
|
|
124
123
|
"minlength",
|
|
125
124
|
"maxlength",
|
|
126
125
|
"pattern",
|
|
127
126
|
"title",
|
|
128
|
-
"tabindex"
|
|
127
|
+
"tabindex",
|
|
128
|
+
"style",
|
|
129
|
+
"enterkeyhint",
|
|
130
|
+
"spellcheck"
|
|
131
|
+
];
|
|
132
|
+
|
|
133
|
+
const UI_BOOL_ATTRS = [
|
|
134
|
+
"required",
|
|
135
|
+
"readonly",
|
|
136
|
+
"disabled",
|
|
137
|
+
"autofocus"
|
|
129
138
|
];
|
|
130
139
|
|
|
131
140
|
for (const name of UI_ATTRS) {
|
|
132
|
-
this.originalUiAttrs[name] =
|
|
133
|
-
|
|
141
|
+
this.originalUiAttrs[name] = input.hasAttribute(name) ? input.getAttribute(name) : null;
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
for (const name of UI_BOOL_ATTRS) {
|
|
145
|
+
// booleanは「ある/ない」だけ記録
|
|
146
|
+
this.originalUiAttrs[name] = input.hasAttribute(name) ? "" : null;
|
|
134
147
|
}
|
|
135
148
|
|
|
136
149
|
for (const attr of input.attributes) {
|
|
@@ -190,6 +203,7 @@
|
|
|
190
203
|
if (v == null) {
|
|
191
204
|
display.removeAttribute(name);
|
|
192
205
|
} else {
|
|
206
|
+
// booleanも "" をセットすればOK
|
|
193
207
|
display.setAttribute(name, v);
|
|
194
208
|
}
|
|
195
209
|
}
|
|
@@ -278,6 +292,24 @@
|
|
|
278
292
|
* @property {any} [detail] - 追加情報(制限値など)
|
|
279
293
|
*/
|
|
280
294
|
|
|
295
|
+
/**
|
|
296
|
+
* setValue で設定できる値型
|
|
297
|
+
* - number は String に変換して設定する
|
|
298
|
+
* - null/undefined は空文字として扱う
|
|
299
|
+
* @typedef {string | number | null | undefined} SetValueInput
|
|
300
|
+
*/
|
|
301
|
+
|
|
302
|
+
/**
|
|
303
|
+
* setValue 実行モード
|
|
304
|
+
* - "commit" 確定評価まで実行 normalize→validate→fix→format
|
|
305
|
+
* - "input" 入力中評価のみ実行 normalize→validate
|
|
306
|
+
* - "none" 評価は実行しない 値だけを反映
|
|
307
|
+
*
|
|
308
|
+
* 既定値は "commit"
|
|
309
|
+
*
|
|
310
|
+
* @typedef {"none"|"input"|"commit"} SetValueMode
|
|
311
|
+
*/
|
|
312
|
+
|
|
281
313
|
/**
|
|
282
314
|
* attach() が返す公開API(利用者が触れる最小インターフェース)
|
|
283
315
|
* @typedef {Object} Guard
|
|
@@ -288,6 +320,9 @@
|
|
|
288
320
|
* @property {() => string} getDisplayValue - ユーザーが実際に操作している要素の値を取得
|
|
289
321
|
* @property {() => HTMLInputElement|HTMLTextAreaElement} getRawElement - 送信用の正規化済み値の要素
|
|
290
322
|
* @property {() => HTMLInputElement|HTMLTextAreaElement} getDisplayElement - ユーザーが実際に操作している要素(swap時はdisplay専用)
|
|
323
|
+
* @property {() => void} evaluate 入力中評価を手動実行 normalize→validate
|
|
324
|
+
* @property {() => void} commit 確定評価を手動実行 normalize→validate→fix→format
|
|
325
|
+
* @property {(value: SetValueInput, mode?: SetValueMode) => void} setValue
|
|
291
326
|
*/
|
|
292
327
|
|
|
293
328
|
/**
|
|
@@ -1267,6 +1302,42 @@
|
|
|
1267
1302
|
return /** @type {HTMLInputElement|HTMLTextAreaElement} */ (this.displayElement).value;
|
|
1268
1303
|
}
|
|
1269
1304
|
|
|
1305
|
+
/**
|
|
1306
|
+
* 表示要素の値をプログラムから設定する
|
|
1307
|
+
*
|
|
1308
|
+
* @param {SetValueInput} value
|
|
1309
|
+
* @param {SetValueMode} [mode="commit"]
|
|
1310
|
+
* @returns {void}
|
|
1311
|
+
*/
|
|
1312
|
+
setValue(value, mode = "commit") {
|
|
1313
|
+
/** @type {string} */
|
|
1314
|
+
let s;
|
|
1315
|
+
|
|
1316
|
+
if (value == null) {
|
|
1317
|
+
s = "";
|
|
1318
|
+
} else if (typeof value === "number") {
|
|
1319
|
+
// NaN/Infinity は事故りやすいので空に寄せる(方針)
|
|
1320
|
+
s = Number.isFinite(value) ? String(value) : "";
|
|
1321
|
+
} else {
|
|
1322
|
+
s = String(value);
|
|
1323
|
+
}
|
|
1324
|
+
|
|
1325
|
+
const display = /** @type {HTMLInputElement|HTMLTextAreaElement} */ (this.displayElement);
|
|
1326
|
+
display.value = s;
|
|
1327
|
+
|
|
1328
|
+
if (mode === "none") {
|
|
1329
|
+
this.syncRaw(s);
|
|
1330
|
+
this.lastAcceptedValue = s;
|
|
1331
|
+
this.lastAcceptedSelection = this.readSelection(display);
|
|
1332
|
+
return;
|
|
1333
|
+
}
|
|
1334
|
+
if (mode === "input") {
|
|
1335
|
+
this.evaluateInput();
|
|
1336
|
+
return;
|
|
1337
|
+
}
|
|
1338
|
+
this.evaluateCommit();
|
|
1339
|
+
}
|
|
1340
|
+
|
|
1270
1341
|
/**
|
|
1271
1342
|
* 外部に公開する Guard API を生成して返す
|
|
1272
1343
|
* - InputGuard 自体を公開せず、最小の操作だけを渡す
|
|
@@ -1280,7 +1351,10 @@
|
|
|
1280
1351
|
getRawValue: () => this.getRawValue(),
|
|
1281
1352
|
getDisplayValue: () => this.getDisplayValue(),
|
|
1282
1353
|
getRawElement: () => /** @type {HTMLInputElement|HTMLTextAreaElement} */ (this.hostElement),
|
|
1283
|
-
getDisplayElement: () => /** @type {HTMLInputElement|HTMLTextAreaElement} */ (this.displayElement)
|
|
1354
|
+
getDisplayElement: () => /** @type {HTMLInputElement|HTMLTextAreaElement} */ (this.displayElement),
|
|
1355
|
+
evaluate: () => this.evaluateInput(),
|
|
1356
|
+
commit: () => this.evaluateCommit(),
|
|
1357
|
+
setValue: (value, mode) => this.setValue(value, mode)
|
|
1284
1358
|
};
|
|
1285
1359
|
}
|
|
1286
1360
|
}
|
|
@@ -2345,11 +2419,11 @@
|
|
|
2345
2419
|
|
|
2346
2420
|
/**
|
|
2347
2421
|
* バージョン(ビルド時に置換したいならここを差し替える)
|
|
2348
|
-
* 例: rollup replace で ""0.1.
|
|
2422
|
+
* 例: rollup replace で ""0.1.3"" を package.json の version に置換
|
|
2349
2423
|
*/
|
|
2350
2424
|
// @ts-ignore
|
|
2351
2425
|
// eslint-disable-next-line no-undef
|
|
2352
|
-
const version = "0.1.
|
|
2426
|
+
const version = "0.1.3" ;
|
|
2353
2427
|
|
|
2354
2428
|
exports.attach = attach;
|
|
2355
2429
|
exports.attachAll = attachAll;
|
|
@@ -3,4 +3,4 @@
|
|
|
3
3
|
* AUTHOR: natade (https://github.com/natade-jp/)
|
|
4
4
|
* LICENSE: MIT https://opensource.org/licenses/MIT
|
|
5
5
|
*/
|
|
6
|
-
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).TextInputGuard={})}(this,function(t){"use strict";class e{originalType;originalId;originalName;originalClass;originalUiAttrs;originalAriaAttrs;originalDataset;createdDisplay;constructor(t){this.originalType=t.type,this.originalId=t.getAttribute("id"),this.originalName=t.getAttribute("name"),this.originalClass=t.className,this.originalUiAttrs={},this.originalAriaAttrs={},this.originalDataset={},this.createdDisplay=null;const e=["placeholder","inputmode","autocomplete","required","minlength","maxlength","pattern","title","tabindex"];for(const i of e)this.originalUiAttrs[i]=t.hasAttribute(i)?t.getAttribute(i):null;for(const e of t.attributes)e.name.startsWith("aria-")&&(this.originalAriaAttrs[e.name]=e.value??"");for(const[e,i]of Object.entries(t.dataset))e.startsWith("tig")||(this.originalDataset[e]=i)}applyToRaw(t){t.type="hidden",t.removeAttribute("id"),t.className="",t.dataset.tigRole="raw",this.originalId&&(t.dataset.tigOriginalId=this.originalId),this.originalName&&(t.dataset.tigOriginalName=this.originalName)}createDisplay(t){const e=document.createElement("input");e.type="text",e.dataset.tigRole="display",this.originalId&&(e.id=this.originalId),e.className=this.originalClass??"",e.value=t.value;for(const[t,i]of Object.entries(this.originalUiAttrs))null==i?e.removeAttribute(t):e.setAttribute(t,i);for(const[t,i]of Object.entries(this.originalAriaAttrs))e.setAttribute(t,i);for(const[t,i]of Object.entries(this.originalDataset))e.dataset[t]=i;return this.createdDisplay=e,e}removeDisplay(){this.createdDisplay?.parentNode&&this.createdDisplay.parentNode.removeChild(this.createdDisplay),this.createdDisplay=null}restoreRaw(t){t.type=this.originalType,this.originalId?t.setAttribute("id",this.originalId):t.removeAttribute("id"),this.originalName?t.setAttribute("name",this.originalName):t.removeAttribute("name"),t.className=this.originalClass??"",delete t.dataset.tigRole,delete t.dataset.tigOriginalId,delete t.dataset.tigOriginalName}}function i(t,e){e&&console.warn(t)}function n(t,e={}){const i=new s(t,e);return i.init(),i.toGuard()}class s{constructor(t,e){this.originalElement=t,this.options=e;const i=(n=t)instanceof HTMLInputElement?"input":n instanceof HTMLTextAreaElement?"textarea":null;var n;if(!i)throw new TypeError("[text-input-guard] attach() expects an <input> or <textarea> element.");this.kind=i,this.warn=e.warn??!0,this.invalidClass=e.invalidClass??"is-invalid",this.rules=Array.isArray(e.rules)?e.rules:[],this.hostElement=t,this.displayElement=t,this.rawElement=null,this.composing=!1,this.errors=[],this.normalizeCharRules=[],this.normalizeStructureRules=[],this.validateRules=[],this.fixRules=[],this.formatRules=[],this.onCompositionStart=this.onCompositionStart.bind(this),this.onCompositionEnd=this.onCompositionEnd.bind(this),this.onInput=this.onInput.bind(this),this.onBlur=this.onBlur.bind(this),this.onFocus=this.onFocus.bind(this),this.onSelectionChange=this.onSelectionChange.bind(this),this.swapState=null,this.pendingCompositionCommit=!1,this.lastAcceptedValue="",this.lastAcceptedSelection={start:null,end:null,direction:null},this.revertRequest=null}init(){this.buildPipeline(),this.applySeparateValue(),this.bindEvents(),this.evaluateInput()}readSelection(t){return{start:t.selectionStart,end:t.selectionEnd,direction:t.selectionDirection}}writeSelection(t,e){if(null!=e.start&&null!=e.end)try{e.direction?t.setSelectionRange(e.start,e.end,e.direction):t.setSelectionRange(e.start,e.end)}catch(t){}}applySeparateValue(){const t=this.options.separateValue?.mode??"auto";if("swap"!==("auto"===t?this.formatRules.length>0?"swap":"off":t))return;if("input"!==this.kind)return void i('[text-input-guard] separateValue.mode="swap" is not supported for <textarea>. ignored.',this.warn);const n=this.originalElement,s=new e(n);s.applyToRaw(n);const r=s.createDisplay(n);n.after(r),this.swapState=s,this.hostElement=n,this.displayElement=r,this.rawElement=n,this.lastAcceptedValue=r.value,this.lastAcceptedSelection=this.readSelection(r)}restoreSeparateValue(){if(!this.swapState)return;const t=this.swapState,e=this.hostElement,i=t.createdDisplay;if(i)try{e.value=e.value||i.value}catch(t){}t.removeDisplay(),t.restoreRaw(e),this.hostElement=this.originalElement,this.displayElement=this.originalElement,this.rawElement=null,this.swapState=null}detach(){this.unbindEvents(),this.restoreSeparateValue()}buildPipeline(){this.normalizeCharRules=[],this.normalizeStructureRules=[],this.validateRules=[],this.fixRules=[],this.formatRules=[];for(const t of this.rules){"input"===this.kind&&t.targets.includes("input")||"textarea"===this.kind&&t.targets.includes("textarea")?(t.normalizeChar&&this.normalizeCharRules.push(t),t.normalizeStructure&&this.normalizeStructureRules.push(t),t.validate&&this.validateRules.push(t),t.fix&&this.fixRules.push(t),t.format&&this.formatRules.push(t)):i(`[text-input-guard] Rule "${t.name}" is not supported for <${this.kind}>. skipped.`,this.warn)}}bindEvents(){this.displayElement.addEventListener("compositionstart",this.onCompositionStart),this.displayElement.addEventListener("compositionend",this.onCompositionEnd),this.displayElement.addEventListener("input",this.onInput),this.displayElement.addEventListener("blur",this.onBlur),this.displayElement.addEventListener("focus",this.onFocus),this.displayElement.addEventListener("keyup",this.onSelectionChange),this.displayElement.addEventListener("mouseup",this.onSelectionChange),this.displayElement.addEventListener("select",this.onSelectionChange),this.displayElement.addEventListener("focus",this.onSelectionChange)}unbindEvents(){this.displayElement.removeEventListener("compositionstart",this.onCompositionStart),this.displayElement.removeEventListener("compositionend",this.onCompositionEnd),this.displayElement.removeEventListener("input",this.onInput),this.displayElement.removeEventListener("blur",this.onBlur),this.displayElement.removeEventListener("focus",this.onFocus),this.displayElement.removeEventListener("keyup",this.onSelectionChange),this.displayElement.removeEventListener("mouseup",this.onSelectionChange),this.displayElement.removeEventListener("select",this.onSelectionChange),this.displayElement.removeEventListener("focus",this.onSelectionChange)}revertDisplay(t){const e=this.displayElement;e.value=this.lastAcceptedValue,this.writeSelection(e,this.lastAcceptedSelection),this.syncRaw(this.lastAcceptedValue),this.clearErrors(),this.applyInvalidClass(),this.revertRequest=null,this.warn}createCtx(){return{hostElement:this.hostElement,displayElement:this.displayElement,rawElement:this.rawElement,kind:this.kind,warn:this.warn,invalidClass:this.invalidClass,composing:this.composing,pushError:t=>this.errors.push(t),requestRevert:t=>{this.revertRequest||(this.revertRequest=t)}}}clearErrors(){this.errors=[]}runNormalizeChar(t,e){let i=t;for(const t of this.normalizeCharRules)i=t.normalizeChar?t.normalizeChar(i,e):i;return i}runNormalizeStructure(t,e){let i=t;for(const t of this.normalizeStructureRules)i=t.normalizeStructure?t.normalizeStructure(i,e):i;return i}runValidate(t,e){for(const i of this.validateRules)i.validate&&i.validate(t,e)}runFix(t,e){let i=t;for(const t of this.fixRules)i=t.fix?t.fix(i,e):i;return i}runFormat(t,e){let i=t;for(const t of this.formatRules)i=t.format?t.format(i,e):i;return i}applyInvalidClass(){const t=this.displayElement;this.errors.length>0?t.classList.add(this.invalidClass):t.classList.remove(this.invalidClass)}syncRaw(t){this.rawElement&&(this.rawElement.value=t)}syncDisplay(t){(this.displayElement instanceof HTMLInputElement||this.displayElement instanceof HTMLTextAreaElement)&&(this.displayElement.value=t)}onCompositionStart(){this.composing=!0}onCompositionEnd(){this.composing=!1,this.pendingCompositionCommit=!0,queueMicrotask(()=>{this.pendingCompositionCommit&&(this.pendingCompositionCommit=!1,this.evaluateInput())})}onInput(){this.pendingCompositionCommit=!1,this.evaluateInput()}onBlur(){this.evaluateCommit()}onFocus(){if(this.composing)return;const t=this.displayElement,e=t.value,i=this.createCtx();let n=e;n=this.runNormalizeChar(n,i),n=this.runNormalizeStructure(n,i),n!==e&&(this.setDisplayValuePreserveCaret(t,n,i),this.syncRaw(n)),this.lastAcceptedValue=n,this.lastAcceptedSelection=this.readSelection(t),this.onSelectionChange()}onSelectionChange(){if(this.composing)return;const t=this.displayElement;this.lastAcceptedSelection=this.readSelection(t)}setDisplayValuePreserveCaret(t,e,i){const n=t.value;if(n===e)return;const s=t.selectionStart,r=t.selectionEnd;if(null==s||null==r)return void(t.value=e);let a=n.slice(0,s);a=this.runNormalizeChar(a,i),a=this.runNormalizeStructure(a,i),t.value=e;const l=Math.min(a.length,e.length);try{t.setSelectionRange(l,l)}catch(t){}}evaluateInput(){if(this.composing)return;this.clearErrors(),this.revertRequest=null;const t=this.displayElement,e=t.value,i=this.createCtx();let n=e;n=this.runNormalizeChar(n,i),n=this.runNormalizeStructure(n,i),n!==e&&this.setDisplayValuePreserveCaret(t,n,i),this.runValidate(n,i),this.revertRequest?this.revertDisplay(this.revertRequest):(this.syncRaw(n),this.applyInvalidClass(),this.lastAcceptedValue=n,this.lastAcceptedSelection=this.readSelection(t))}evaluateCommit(){if(this.composing)return;this.clearErrors(),this.revertRequest=null;const t=this.displayElement,e=this.createCtx();let i=t.value;if(i=this.runNormalizeChar(i,e),i=this.runNormalizeStructure(i,e),this.runValidate(i,e),this.revertRequest)return void this.revertDisplay(this.revertRequest);if(i=this.runFix(i,e),this.clearErrors(),this.revertRequest=null,this.runValidate(i,e),this.revertRequest)return void this.revertDisplay(this.revertRequest);this.syncRaw(i);let n=i;n=this.runFormat(n,e),this.syncDisplay(n),this.applyInvalidClass(),this.lastAcceptedValue=i,this.lastAcceptedSelection=this.readSelection(t)}isValid(){return 0===this.errors.length}getErrors(){return this.errors.slice()}getRawValue(){return this.hostElement.value}getDisplayValue(){return this.displayElement.value}toGuard(){return{detach:()=>this.detach(),isValid:()=>this.isValid(),getErrors:()=>this.getErrors(),getRawValue:()=>this.getRawValue(),getDisplayValue:()=>this.getDisplayValue(),getRawElement:()=>this.hostElement,getDisplayElement:()=>this.displayElement}}}function r(t){if(null==t)return;const e=String(t).trim().toLowerCase();return""===e||"true"===e||"1"===e||"yes"===e||"on"===e||"false"!==e&&"0"!==e&&"no"!==e&&"off"!==e&&void 0}function a(t){if(null==t)return;const e=String(t).trim();if(""===e)return;const i=Number(e);return Number.isFinite(i)?i:void 0}function l(t,e){if(null==t)return;const i=String(t).trim();return""!==i&&e.includes(i)?i:void 0}function o(t){if(null==t||""===String(t).trim())return"auto";const e=String(t).trim().toLowerCase();return"auto"===e||"swap"===e||"off"===e?e:"auto"}function u(t){if(null!=t.tigSeparate)return!0;if(null!=t.tigWarn)return!0;if(null!=t.tigInvalidClass)return!0;for(const e in t)if(e.startsWith("tigRules"))return!0;return!1}function c(t={}){const e=t.allowFullWidth??!0,i=t.allowMinus??!1,n=t.allowDecimal??!1,s=t.allowEmpty??!0,r=new Set(["ー","-","−","‐","-","‒","–","—","―"]),a=new Set([".","。","。"]);function l(t){if(t>="0"&&t<="9")return t;if(e){const e=function(t){const e=t.charCodeAt(0);return 65296<=e&&e<=65305?String.fromCharCode(e-65296+48):null}(t);if(e)return e}return"."===t||e&&a.has(t)?n?".":"":"-"===t?i?"-":"":e&&r.has(t)&&i?"-":""}return{name:"numeric",targets:["input"],normalizeChar(t){let e=String(t);e=e.replace(/,/g,"");let i="";for(const t of e)i+=l(t);return i},normalizeStructure(t){let e="",s=!1,r=!1;for(const a of String(t))a>="0"&&a<="9"?e+=a:"-"===a&&i?s||0!==e.length||(e+="-",s=!0):"."===a&&n&&(r||(e+=".",r=!0));return e},fix(t){let e=String(t);if(""===e)return s?"":"0";if("-"===e||"."===e||"-."===e)return s?"":"0";e.startsWith("-.")&&(e="-0"+e.slice(1)),e.startsWith(".")&&(e="0"+e),e.endsWith(".")&&(e=e.slice(0,-1));let i="";e.startsWith("-")&&(i="-",e=e.slice(1));const n=e.indexOf(".");let r=n>=0?e.slice(0,n):e;const a=n>=0?e.slice(n+1):"";return r=r.replace(/^0+/,""),""===r&&(r="0"),"-"!==i||"0"!==r||a&&!/^0*$/.test(a)||(i=""),n>=0?`${i}${r}.${a}`:`${i}${r}`},validate(t,e){}}}function h(t){let e="",i=String(t);i.startsWith("-")&&(e="-",i=i.slice(1));const n=i.indexOf(".");if(!(n>=0))return{sign:e,intPart:i,fracPart:"",hasDot:!1};return{sign:e,intPart:i.slice(0,n),fracPart:i.slice(n+1),hasDot:!0}}function d(t){let e=1;const i=t.split("");for(let t=i.length-1;t>=0;t--){const n=i[t].charCodeAt(0)-48+e;if(!(n>=10)){i[t]=String.fromCharCode(48+n),e=0;break}i[t]="0",e=1}return 1===e&&i.unshift("1"),i.join("")}function f(t={}){const e={int:"number"==typeof t.int?t.int:void 0,frac:"number"==typeof t.frac?t.frac:void 0,countLeadingZeros:t.countLeadingZeros??!0,fixIntOnBlur:t.fixIntOnBlur??"none",fixFracOnBlur:t.fixFracOnBlur??"none",overflowInputInt:t.overflowInputInt??"none",overflowInputFrac:t.overflowInputFrac??"none",forceFracOnBlur:t.forceFracOnBlur??!1};return{name:"digits",targets:["input"],validate(t,i){const n=String(t);if(""===n||"-"===n||"."===n||"-."===n)return;const{intPart:s,fracPart:r}=h(n);if("number"==typeof e.int){const t=function(t,e){const i=t??"";if(0===i.length)return 0;if(e)return i.length;const n=i.replace(/^0+/,"");return 0===n.length?1:n.length}(s,e.countLeadingZeros);if(t>e.int){if("block"===e.overflowInputInt)return void i.requestRevert({reason:"digits.int_overflow",detail:{limit:e.int,actual:t}});i.pushError({code:"digits.int_overflow",rule:"digits",phase:"validate",detail:{limit:e.int,actual:t}})}}if("number"==typeof e.frac){const t=(r??"").length;if(t>e.frac){if("block"===e.overflowInputFrac)return void i.requestRevert({reason:"digits.frac_overflow",detail:{limit:e.frac,actual:t}});i.pushError({code:"digits.frac_overflow",rule:"digits",phase:"validate",detail:{limit:e.frac,actual:t}})}}},fix(t,i){const n=String(t);if(""===n||"-"===n||"."===n||"-."===n)return n;const s=h(n);let{intPart:r,fracPart:a}=s;const{sign:l,hasDot:o}=s;if("number"==typeof e.int&&"none"!==e.fixIntOnBlur){(r??"").length>e.int&&("truncateLeft"===e.fixIntOnBlur?r=r.slice(r.length-e.int):"truncateRight"===e.fixIntOnBlur?r=r.slice(0,e.int):"clamp"===e.fixIntOnBlur&&(r="9".repeat(e.int)))}if("number"==typeof e.frac&&"none"!==e.fixFracOnBlur&&o){const t=e.frac,i=a??"";if(i.length>t)if("truncate"===e.fixFracOnBlur)a=i.slice(0,t);else if("round"===e.fixFracOnBlur){const e=function(t,e,i){const n=e??"";if(n.length<=i)return{intPart:t,fracPart:n};const s=n.slice(0,i);if(n.charCodeAt(i)-48<5)return{intPart:t,fracPart:s};if(0===i)return{intPart:d(t.length?t:"0"),fracPart:""};let r=1;const a=s.split("");for(let t=a.length-1;t>=0;t--){const e=a[t].charCodeAt(0)-48+r;if(!(e>=10)){a[t]=String.fromCharCode(48+e),r=0;break}a[t]="0",r=1}const l=a.join("");let o=t;return 1===r&&(o=d(t.length?t:"0")),{intPart:o,fracPart:l}}(r,i,t);r=e.intPart,a=e.fracPart}}if(e.forceFracOnBlur&&"number"==typeof e.frac&&e.frac>0){const t=e.frac;o||(a="");const i=a??"";i.length<t&&(a=i+"0".repeat(t-i.length))}if("number"!=typeof e.frac)return`${l}${r}`;if(0===e.frac)return`${l}${r}`;if(o||e.forceFracOnBlur&&e.frac>0){return`${l}${r}.${a??""}`}return`${l}${r}`}}}function m(){return{name:"comma",targets:["input"],format(t){const e=String(t);if(""===e||"-"===e||"."===e||"-."===e)return e;let i="",n=e;n.startsWith("-")&&(i="-",n=n.slice(1));const s=n.indexOf("."),r=s>=0?n.slice(0,s):n,a=s>=0?n.slice(s+1):null,l=r.replace(/\B(?=(\d{3})+(?!\d))/g,",");return null!=a?`${i}${l}.${a}`:`${i}${l}`}}}c.fromDataset=function(t,e){if(null==t.tigRulesNumeric)return null;const i={},n=r(t.tigRulesNumericAllowFullWidth);null!=n&&(i.allowFullWidth=n);const s=r(t.tigRulesNumericAllowMinus);null!=s&&(i.allowMinus=s);const a=r(t.tigRulesNumericAllowDecimal);null!=a&&(i.allowDecimal=a);const l=r(t.tigRulesNumericAllowEmpty);return null!=l&&(i.allowEmpty=l),c(i)},f.fromDataset=function(t,e){if(null==t.tigRulesDigits)return null;const i={},n=a(t.tigRulesDigitsInt);null!=n&&(i.int=n);const s=a(t.tigRulesDigitsFrac);null!=s&&(i.frac=s);const o=r(t.tigRulesDigitsCountLeadingZeros);null!=o&&(i.countLeadingZeros=o);const u=l(t.tigRulesDigitsFixIntOnBlur,["none","truncateLeft","truncateRight","clamp"]);null!=u&&(i.fixIntOnBlur=u);const c=l(t.tigRulesDigitsFixFracOnBlur,["none","truncate","round"]);null!=c&&(i.fixFracOnBlur=c);const h=l(t.tigRulesDigitsOverflowInputInt,["none","block"]);null!=h&&(i.overflowInputInt=h);const d=l(t.tigRulesDigitsOverflowInputFrac,["none","block"]);null!=d&&(i.overflowInputFrac=d);const m=r(t.tigRulesDigitsForceFracOnBlur);return null!=m&&(i.forceFracOnBlur=m),f(i)},m.fromDataset=function(t,e){return null==t.tigRulesComma?null:m()};const p=new class{constructor(t,e){this.attachFn=t,this.ruleFactories=Array.isArray(e)?e:[]}register(t){this.ruleFactories.push(t)}autoAttach(t=document){const e=[],i=[];if(t.querySelectorAll){const e=t.querySelectorAll("input, textarea");for(const t of e)(t instanceof HTMLInputElement||t instanceof HTMLTextAreaElement)&&i.push(t)}(t instanceof HTMLInputElement||t instanceof HTMLTextAreaElement)&&(i.includes(t)||i.push(t));for(const t of i){const i=t.dataset;if("true"===i.tigAttached)continue;if(!u(i))continue;const n={},s=r(i.tigWarn);null!=s&&(n.warn=s),null!=i.tigInvalidClass&&""!==String(i.tigInvalidClass).trim()&&(n.invalidClass=String(i.tigInvalidClass)),n.separateValue={mode:o(i.tigSeparate)};const a=[];for(const e of this.ruleFactories)try{const n=e.fromDataset(i,t);n&&a.push(n)}catch(t){(n.warn??!0)&&console.warn(`[text-input-guard] autoAttach: rule "${e.name}" fromDataset() threw an error.`,t)}if(a.length>0&&(n.rules=a),!n.rules||0===n.rules.length)continue;const l=this.attachFn(t,n);e.push(l),t.dataset.tigAttached="true"}return{detach:()=>{for(const t of e)t.detach()},isValid:()=>e.every(t=>t.isValid()),getErrors:()=>e.flatMap(t=>t.getErrors()),getGuards:()=>e}}}(n,[{name:"numeric",fromDataset:c.fromDataset},{name:"digits",fromDataset:f.fromDataset},{name:"comma",fromDataset:m.fromDataset}]),g={numeric:c,digits:f,comma:m};t.attach=n,t.attachAll=function(t,e={}){const i=[];for(const s of t)i.push(n(s,e));return{detach:()=>{for(const t of i)t.detach()},isValid:()=>i.every(t=>t.isValid()),getErrors:()=>i.flatMap(t=>t.getErrors()),getGuards:()=>i}},t.autoAttach=t=>p.autoAttach(t),t.comma=m,t.digits=f,t.numeric=c,t.rules=g,t.version="0.1.0"});
|
|
6
|
+
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).TextInputGuard={})}(this,function(t){"use strict";class e{originalType;originalId;originalName;originalClass;originalUiAttrs;originalAriaAttrs;originalDataset;createdDisplay;constructor(t){this.originalType=t.type,this.originalId=t.getAttribute("id"),this.originalName=t.getAttribute("name"),this.originalClass=t.className,this.originalUiAttrs={},this.originalAriaAttrs={},this.originalDataset={},this.createdDisplay=null;const e=["placeholder","inputmode","autocomplete","minlength","maxlength","pattern","title","tabindex","style","enterkeyhint","spellcheck"],i=["required","readonly","disabled","autofocus"];for(const i of e)this.originalUiAttrs[i]=t.hasAttribute(i)?t.getAttribute(i):null;for(const e of i)this.originalUiAttrs[e]=t.hasAttribute(e)?"":null;for(const e of t.attributes)e.name.startsWith("aria-")&&(this.originalAriaAttrs[e.name]=e.value??"");for(const[e,i]of Object.entries(t.dataset))e.startsWith("tig")||(this.originalDataset[e]=i)}applyToRaw(t){t.type="hidden",t.removeAttribute("id"),t.className="",t.dataset.tigRole="raw",this.originalId&&(t.dataset.tigOriginalId=this.originalId),this.originalName&&(t.dataset.tigOriginalName=this.originalName)}createDisplay(t){const e=document.createElement("input");e.type="text",e.dataset.tigRole="display",this.originalId&&(e.id=this.originalId),e.className=this.originalClass??"",e.value=t.value;for(const[t,i]of Object.entries(this.originalUiAttrs))null==i?e.removeAttribute(t):e.setAttribute(t,i);for(const[t,i]of Object.entries(this.originalAriaAttrs))e.setAttribute(t,i);for(const[t,i]of Object.entries(this.originalDataset))e.dataset[t]=i;return this.createdDisplay=e,e}removeDisplay(){this.createdDisplay?.parentNode&&this.createdDisplay.parentNode.removeChild(this.createdDisplay),this.createdDisplay=null}restoreRaw(t){t.type=this.originalType,this.originalId?t.setAttribute("id",this.originalId):t.removeAttribute("id"),this.originalName?t.setAttribute("name",this.originalName):t.removeAttribute("name"),t.className=this.originalClass??"",delete t.dataset.tigRole,delete t.dataset.tigOriginalId,delete t.dataset.tigOriginalName}}function i(t,e){e&&console.warn(t)}function n(t,e={}){const i=new s(t,e);return i.init(),i.toGuard()}class s{constructor(t,e){this.originalElement=t,this.options=e;const i=(n=t)instanceof HTMLInputElement?"input":n instanceof HTMLTextAreaElement?"textarea":null;var n;if(!i)throw new TypeError("[text-input-guard] attach() expects an <input> or <textarea> element.");this.kind=i,this.warn=e.warn??!0,this.invalidClass=e.invalidClass??"is-invalid",this.rules=Array.isArray(e.rules)?e.rules:[],this.hostElement=t,this.displayElement=t,this.rawElement=null,this.composing=!1,this.errors=[],this.normalizeCharRules=[],this.normalizeStructureRules=[],this.validateRules=[],this.fixRules=[],this.formatRules=[],this.onCompositionStart=this.onCompositionStart.bind(this),this.onCompositionEnd=this.onCompositionEnd.bind(this),this.onInput=this.onInput.bind(this),this.onBlur=this.onBlur.bind(this),this.onFocus=this.onFocus.bind(this),this.onSelectionChange=this.onSelectionChange.bind(this),this.swapState=null,this.pendingCompositionCommit=!1,this.lastAcceptedValue="",this.lastAcceptedSelection={start:null,end:null,direction:null},this.revertRequest=null}init(){this.buildPipeline(),this.applySeparateValue(),this.bindEvents(),this.evaluateInput()}readSelection(t){return{start:t.selectionStart,end:t.selectionEnd,direction:t.selectionDirection}}writeSelection(t,e){if(null!=e.start&&null!=e.end)try{e.direction?t.setSelectionRange(e.start,e.end,e.direction):t.setSelectionRange(e.start,e.end)}catch(t){}}applySeparateValue(){const t=this.options.separateValue?.mode??"auto";if("swap"!==("auto"===t?this.formatRules.length>0?"swap":"off":t))return;if("input"!==this.kind)return void i('[text-input-guard] separateValue.mode="swap" is not supported for <textarea>. ignored.',this.warn);const n=this.originalElement,s=new e(n);s.applyToRaw(n);const r=s.createDisplay(n);n.after(r),this.swapState=s,this.hostElement=n,this.displayElement=r,this.rawElement=n,this.lastAcceptedValue=r.value,this.lastAcceptedSelection=this.readSelection(r)}restoreSeparateValue(){if(!this.swapState)return;const t=this.swapState,e=this.hostElement,i=t.createdDisplay;if(i)try{e.value=e.value||i.value}catch(t){}t.removeDisplay(),t.restoreRaw(e),this.hostElement=this.originalElement,this.displayElement=this.originalElement,this.rawElement=null,this.swapState=null}detach(){this.unbindEvents(),this.restoreSeparateValue()}buildPipeline(){this.normalizeCharRules=[],this.normalizeStructureRules=[],this.validateRules=[],this.fixRules=[],this.formatRules=[];for(const t of this.rules){"input"===this.kind&&t.targets.includes("input")||"textarea"===this.kind&&t.targets.includes("textarea")?(t.normalizeChar&&this.normalizeCharRules.push(t),t.normalizeStructure&&this.normalizeStructureRules.push(t),t.validate&&this.validateRules.push(t),t.fix&&this.fixRules.push(t),t.format&&this.formatRules.push(t)):i(`[text-input-guard] Rule "${t.name}" is not supported for <${this.kind}>. skipped.`,this.warn)}}bindEvents(){this.displayElement.addEventListener("compositionstart",this.onCompositionStart),this.displayElement.addEventListener("compositionend",this.onCompositionEnd),this.displayElement.addEventListener("input",this.onInput),this.displayElement.addEventListener("blur",this.onBlur),this.displayElement.addEventListener("focus",this.onFocus),this.displayElement.addEventListener("keyup",this.onSelectionChange),this.displayElement.addEventListener("mouseup",this.onSelectionChange),this.displayElement.addEventListener("select",this.onSelectionChange),this.displayElement.addEventListener("focus",this.onSelectionChange)}unbindEvents(){this.displayElement.removeEventListener("compositionstart",this.onCompositionStart),this.displayElement.removeEventListener("compositionend",this.onCompositionEnd),this.displayElement.removeEventListener("input",this.onInput),this.displayElement.removeEventListener("blur",this.onBlur),this.displayElement.removeEventListener("focus",this.onFocus),this.displayElement.removeEventListener("keyup",this.onSelectionChange),this.displayElement.removeEventListener("mouseup",this.onSelectionChange),this.displayElement.removeEventListener("select",this.onSelectionChange),this.displayElement.removeEventListener("focus",this.onSelectionChange)}revertDisplay(t){const e=this.displayElement;e.value=this.lastAcceptedValue,this.writeSelection(e,this.lastAcceptedSelection),this.syncRaw(this.lastAcceptedValue),this.clearErrors(),this.applyInvalidClass(),this.revertRequest=null,this.warn}createCtx(){return{hostElement:this.hostElement,displayElement:this.displayElement,rawElement:this.rawElement,kind:this.kind,warn:this.warn,invalidClass:this.invalidClass,composing:this.composing,pushError:t=>this.errors.push(t),requestRevert:t=>{this.revertRequest||(this.revertRequest=t)}}}clearErrors(){this.errors=[]}runNormalizeChar(t,e){let i=t;for(const t of this.normalizeCharRules)i=t.normalizeChar?t.normalizeChar(i,e):i;return i}runNormalizeStructure(t,e){let i=t;for(const t of this.normalizeStructureRules)i=t.normalizeStructure?t.normalizeStructure(i,e):i;return i}runValidate(t,e){for(const i of this.validateRules)i.validate&&i.validate(t,e)}runFix(t,e){let i=t;for(const t of this.fixRules)i=t.fix?t.fix(i,e):i;return i}runFormat(t,e){let i=t;for(const t of this.formatRules)i=t.format?t.format(i,e):i;return i}applyInvalidClass(){const t=this.displayElement;this.errors.length>0?t.classList.add(this.invalidClass):t.classList.remove(this.invalidClass)}syncRaw(t){this.rawElement&&(this.rawElement.value=t)}syncDisplay(t){(this.displayElement instanceof HTMLInputElement||this.displayElement instanceof HTMLTextAreaElement)&&(this.displayElement.value=t)}onCompositionStart(){this.composing=!0}onCompositionEnd(){this.composing=!1,this.pendingCompositionCommit=!0,queueMicrotask(()=>{this.pendingCompositionCommit&&(this.pendingCompositionCommit=!1,this.evaluateInput())})}onInput(){this.pendingCompositionCommit=!1,this.evaluateInput()}onBlur(){this.evaluateCommit()}onFocus(){if(this.composing)return;const t=this.displayElement,e=t.value,i=this.createCtx();let n=e;n=this.runNormalizeChar(n,i),n=this.runNormalizeStructure(n,i),n!==e&&(this.setDisplayValuePreserveCaret(t,n,i),this.syncRaw(n)),this.lastAcceptedValue=n,this.lastAcceptedSelection=this.readSelection(t),this.onSelectionChange()}onSelectionChange(){if(this.composing)return;const t=this.displayElement;this.lastAcceptedSelection=this.readSelection(t)}setDisplayValuePreserveCaret(t,e,i){const n=t.value;if(n===e)return;const s=t.selectionStart,r=t.selectionEnd;if(null==s||null==r)return void(t.value=e);let a=n.slice(0,s);a=this.runNormalizeChar(a,i),a=this.runNormalizeStructure(a,i),t.value=e;const l=Math.min(a.length,e.length);try{t.setSelectionRange(l,l)}catch(t){}}evaluateInput(){if(this.composing)return;this.clearErrors(),this.revertRequest=null;const t=this.displayElement,e=t.value,i=this.createCtx();let n=e;n=this.runNormalizeChar(n,i),n=this.runNormalizeStructure(n,i),n!==e&&this.setDisplayValuePreserveCaret(t,n,i),this.runValidate(n,i),this.revertRequest?this.revertDisplay(this.revertRequest):(this.syncRaw(n),this.applyInvalidClass(),this.lastAcceptedValue=n,this.lastAcceptedSelection=this.readSelection(t))}evaluateCommit(){if(this.composing)return;this.clearErrors(),this.revertRequest=null;const t=this.displayElement,e=this.createCtx();let i=t.value;if(i=this.runNormalizeChar(i,e),i=this.runNormalizeStructure(i,e),this.runValidate(i,e),this.revertRequest)return void this.revertDisplay(this.revertRequest);if(i=this.runFix(i,e),this.clearErrors(),this.revertRequest=null,this.runValidate(i,e),this.revertRequest)return void this.revertDisplay(this.revertRequest);this.syncRaw(i);let n=i;n=this.runFormat(n,e),this.syncDisplay(n),this.applyInvalidClass(),this.lastAcceptedValue=i,this.lastAcceptedSelection=this.readSelection(t)}isValid(){return 0===this.errors.length}getErrors(){return this.errors.slice()}getRawValue(){return this.hostElement.value}getDisplayValue(){return this.displayElement.value}setValue(t,e="commit"){let i;i=null==t?"":"number"==typeof t?Number.isFinite(t)?String(t):"":String(t);const n=this.displayElement;if(n.value=i,"none"===e)return this.syncRaw(i),this.lastAcceptedValue=i,void(this.lastAcceptedSelection=this.readSelection(n));"input"!==e?this.evaluateCommit():this.evaluateInput()}toGuard(){return{detach:()=>this.detach(),isValid:()=>this.isValid(),getErrors:()=>this.getErrors(),getRawValue:()=>this.getRawValue(),getDisplayValue:()=>this.getDisplayValue(),getRawElement:()=>this.hostElement,getDisplayElement:()=>this.displayElement,evaluate:()=>this.evaluateInput(),commit:()=>this.evaluateCommit(),setValue:(t,e)=>this.setValue(t,e)}}}function r(t){if(null==t)return;const e=String(t).trim().toLowerCase();return""===e||"true"===e||"1"===e||"yes"===e||"on"===e||"false"!==e&&"0"!==e&&"no"!==e&&"off"!==e&&void 0}function a(t){if(null==t)return;const e=String(t).trim();if(""===e)return;const i=Number(e);return Number.isFinite(i)?i:void 0}function l(t,e){if(null==t)return;const i=String(t).trim();return""!==i&&e.includes(i)?i:void 0}function o(t){if(null==t||""===String(t).trim())return"auto";const e=String(t).trim().toLowerCase();return"auto"===e||"swap"===e||"off"===e?e:"auto"}function u(t){if(null!=t.tigSeparate)return!0;if(null!=t.tigWarn)return!0;if(null!=t.tigInvalidClass)return!0;for(const e in t)if(e.startsWith("tigRules"))return!0;return!1}function c(t={}){const e=t.allowFullWidth??!0,i=t.allowMinus??!1,n=t.allowDecimal??!1,s=t.allowEmpty??!0,r=new Set(["ー","-","−","‐","-","‒","–","—","―"]),a=new Set([".","。","。"]);function l(t){if(t>="0"&&t<="9")return t;if(e){const e=function(t){const e=t.charCodeAt(0);return 65296<=e&&e<=65305?String.fromCharCode(e-65296+48):null}(t);if(e)return e}return"."===t||e&&a.has(t)?n?".":"":"-"===t?i?"-":"":e&&r.has(t)&&i?"-":""}return{name:"numeric",targets:["input"],normalizeChar(t){let e=String(t);e=e.replace(/,/g,"");let i="";for(const t of e)i+=l(t);return i},normalizeStructure(t){let e="",s=!1,r=!1;for(const a of String(t))a>="0"&&a<="9"?e+=a:"-"===a&&i?s||0!==e.length||(e+="-",s=!0):"."===a&&n&&(r||(e+=".",r=!0));return e},fix(t){let e=String(t);if(""===e)return s?"":"0";if("-"===e||"."===e||"-."===e)return s?"":"0";e.startsWith("-.")&&(e="-0"+e.slice(1)),e.startsWith(".")&&(e="0"+e),e.endsWith(".")&&(e=e.slice(0,-1));let i="";e.startsWith("-")&&(i="-",e=e.slice(1));const n=e.indexOf(".");let r=n>=0?e.slice(0,n):e;const a=n>=0?e.slice(n+1):"";return r=r.replace(/^0+/,""),""===r&&(r="0"),"-"!==i||"0"!==r||a&&!/^0*$/.test(a)||(i=""),n>=0?`${i}${r}.${a}`:`${i}${r}`},validate(t,e){}}}function h(t){let e="",i=String(t);i.startsWith("-")&&(e="-",i=i.slice(1));const n=i.indexOf(".");if(!(n>=0))return{sign:e,intPart:i,fracPart:"",hasDot:!1};return{sign:e,intPart:i.slice(0,n),fracPart:i.slice(n+1),hasDot:!0}}function d(t){let e=1;const i=t.split("");for(let t=i.length-1;t>=0;t--){const n=i[t].charCodeAt(0)-48+e;if(!(n>=10)){i[t]=String.fromCharCode(48+n),e=0;break}i[t]="0",e=1}return 1===e&&i.unshift("1"),i.join("")}function m(t={}){const e={int:"number"==typeof t.int?t.int:void 0,frac:"number"==typeof t.frac?t.frac:void 0,countLeadingZeros:t.countLeadingZeros??!0,fixIntOnBlur:t.fixIntOnBlur??"none",fixFracOnBlur:t.fixFracOnBlur??"none",overflowInputInt:t.overflowInputInt??"none",overflowInputFrac:t.overflowInputFrac??"none",forceFracOnBlur:t.forceFracOnBlur??!1};return{name:"digits",targets:["input"],validate(t,i){const n=String(t);if(""===n||"-"===n||"."===n||"-."===n)return;const{intPart:s,fracPart:r}=h(n);if("number"==typeof e.int){const t=function(t,e){const i=t??"";if(0===i.length)return 0;if(e)return i.length;const n=i.replace(/^0+/,"");return 0===n.length?1:n.length}(s,e.countLeadingZeros);if(t>e.int){if("block"===e.overflowInputInt)return void i.requestRevert({reason:"digits.int_overflow",detail:{limit:e.int,actual:t}});i.pushError({code:"digits.int_overflow",rule:"digits",phase:"validate",detail:{limit:e.int,actual:t}})}}if("number"==typeof e.frac){const t=(r??"").length;if(t>e.frac){if("block"===e.overflowInputFrac)return void i.requestRevert({reason:"digits.frac_overflow",detail:{limit:e.frac,actual:t}});i.pushError({code:"digits.frac_overflow",rule:"digits",phase:"validate",detail:{limit:e.frac,actual:t}})}}},fix(t,i){const n=String(t);if(""===n||"-"===n||"."===n||"-."===n)return n;const s=h(n);let{intPart:r,fracPart:a}=s;const{sign:l,hasDot:o}=s;if("number"==typeof e.int&&"none"!==e.fixIntOnBlur){(r??"").length>e.int&&("truncateLeft"===e.fixIntOnBlur?r=r.slice(r.length-e.int):"truncateRight"===e.fixIntOnBlur?r=r.slice(0,e.int):"clamp"===e.fixIntOnBlur&&(r="9".repeat(e.int)))}if("number"==typeof e.frac&&"none"!==e.fixFracOnBlur&&o){const t=e.frac,i=a??"";if(i.length>t)if("truncate"===e.fixFracOnBlur)a=i.slice(0,t);else if("round"===e.fixFracOnBlur){const e=function(t,e,i){const n=e??"";if(n.length<=i)return{intPart:t,fracPart:n};const s=n.slice(0,i);if(n.charCodeAt(i)-48<5)return{intPart:t,fracPart:s};if(0===i)return{intPart:d(t.length?t:"0"),fracPart:""};let r=1;const a=s.split("");for(let t=a.length-1;t>=0;t--){const e=a[t].charCodeAt(0)-48+r;if(!(e>=10)){a[t]=String.fromCharCode(48+e),r=0;break}a[t]="0",r=1}const l=a.join("");let o=t;return 1===r&&(o=d(t.length?t:"0")),{intPart:o,fracPart:l}}(r,i,t);r=e.intPart,a=e.fracPart}}if(e.forceFracOnBlur&&"number"==typeof e.frac&&e.frac>0){const t=e.frac;o||(a="");const i=a??"";i.length<t&&(a=i+"0".repeat(t-i.length))}if("number"!=typeof e.frac)return`${l}${r}`;if(0===e.frac)return`${l}${r}`;if(o||e.forceFracOnBlur&&e.frac>0){return`${l}${r}.${a??""}`}return`${l}${r}`}}}function f(){return{name:"comma",targets:["input"],format(t){const e=String(t);if(""===e||"-"===e||"."===e||"-."===e)return e;let i="",n=e;n.startsWith("-")&&(i="-",n=n.slice(1));const s=n.indexOf("."),r=s>=0?n.slice(0,s):n,a=s>=0?n.slice(s+1):null,l=r.replace(/\B(?=(\d{3})+(?!\d))/g,",");return null!=a?`${i}${l}.${a}`:`${i}${l}`}}}c.fromDataset=function(t,e){if(null==t.tigRulesNumeric)return null;const i={},n=r(t.tigRulesNumericAllowFullWidth);null!=n&&(i.allowFullWidth=n);const s=r(t.tigRulesNumericAllowMinus);null!=s&&(i.allowMinus=s);const a=r(t.tigRulesNumericAllowDecimal);null!=a&&(i.allowDecimal=a);const l=r(t.tigRulesNumericAllowEmpty);return null!=l&&(i.allowEmpty=l),c(i)},m.fromDataset=function(t,e){if(null==t.tigRulesDigits)return null;const i={},n=a(t.tigRulesDigitsInt);null!=n&&(i.int=n);const s=a(t.tigRulesDigitsFrac);null!=s&&(i.frac=s);const o=r(t.tigRulesDigitsCountLeadingZeros);null!=o&&(i.countLeadingZeros=o);const u=l(t.tigRulesDigitsFixIntOnBlur,["none","truncateLeft","truncateRight","clamp"]);null!=u&&(i.fixIntOnBlur=u);const c=l(t.tigRulesDigitsFixFracOnBlur,["none","truncate","round"]);null!=c&&(i.fixFracOnBlur=c);const h=l(t.tigRulesDigitsOverflowInputInt,["none","block"]);null!=h&&(i.overflowInputInt=h);const d=l(t.tigRulesDigitsOverflowInputFrac,["none","block"]);null!=d&&(i.overflowInputFrac=d);const f=r(t.tigRulesDigitsForceFracOnBlur);return null!=f&&(i.forceFracOnBlur=f),m(i)},f.fromDataset=function(t,e){return null==t.tigRulesComma?null:f()};const p=new class{constructor(t,e){this.attachFn=t,this.ruleFactories=Array.isArray(e)?e:[]}register(t){this.ruleFactories.push(t)}autoAttach(t=document){const e=[],i=[];if(t.querySelectorAll){const e=t.querySelectorAll("input, textarea");for(const t of e)(t instanceof HTMLInputElement||t instanceof HTMLTextAreaElement)&&i.push(t)}(t instanceof HTMLInputElement||t instanceof HTMLTextAreaElement)&&(i.includes(t)||i.push(t));for(const t of i){const i=t.dataset;if("true"===i.tigAttached)continue;if(!u(i))continue;const n={},s=r(i.tigWarn);null!=s&&(n.warn=s),null!=i.tigInvalidClass&&""!==String(i.tigInvalidClass).trim()&&(n.invalidClass=String(i.tigInvalidClass)),n.separateValue={mode:o(i.tigSeparate)};const a=[];for(const e of this.ruleFactories)try{const n=e.fromDataset(i,t);n&&a.push(n)}catch(t){(n.warn??!0)&&console.warn(`[text-input-guard] autoAttach: rule "${e.name}" fromDataset() threw an error.`,t)}if(a.length>0&&(n.rules=a),!n.rules||0===n.rules.length)continue;const l=this.attachFn(t,n);e.push(l),t.dataset.tigAttached="true"}return{detach:()=>{for(const t of e)t.detach()},isValid:()=>e.every(t=>t.isValid()),getErrors:()=>e.flatMap(t=>t.getErrors()),getGuards:()=>e}}}(n,[{name:"numeric",fromDataset:c.fromDataset},{name:"digits",fromDataset:m.fromDataset},{name:"comma",fromDataset:f.fromDataset}]),g={numeric:c,digits:m,comma:f};t.attach=n,t.attachAll=function(t,e={}){const i=[];for(const s of t)i.push(n(s,e));return{detach:()=>{for(const t of i)t.detach()},isValid:()=>i.every(t=>t.isValid()),getErrors:()=>i.flatMap(t=>t.getErrors()),getGuards:()=>i}},t.autoAttach=t=>p.autoAttach(t),t.comma=f,t.digits=m,t.numeric=c,t.rules=g,t.version="0.1.3"});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "text-input-guard",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.3",
|
|
4
4
|
"description": "A JavaScript input guard library for Japanese web apps, handling full-width digits, numeric rules, digit limits, and formatted display.",
|
|
5
5
|
"keywords": ["input-validation",
|
|
6
6
|
"numeric-input",
|