@conform-to/react
Version:
Conform view adapter for react
148 lines (138 loc) • 4.29 kB
JavaScript
;
Object.defineProperty(exports, '__esModule', { value: true });
var dom = require('@conform-to/dom');
function getFormElement(formRef) {
var _element$form;
if (typeof formRef === 'string') {
return document.forms.namedItem(formRef);
}
var element = formRef === null || formRef === void 0 ? void 0 : formRef.current;
if (element instanceof HTMLFormElement) {
return element;
}
return (_element$form = element === null || element === void 0 ? void 0 : element.form) !== null && _element$form !== void 0 ? _element$form : null;
}
function focusable(element) {
if (!element.hidden && element.type !== 'hidden') {
return;
}
// Style the element to be visually hidden
element.style.position = 'absolute';
element.style.width = '1px';
element.style.height = '1px';
element.style.padding = '0';
element.style.margin = '-1px';
element.style.overflow = 'hidden';
element.style.clip = 'rect(0,0,0,0)';
element.style.whiteSpace = 'nowrap';
element.style.border = '0';
// Hide the element from screen readers
element.setAttribute('aria-hidden', 'true');
// Make sure people won't tab to this element
element.tabIndex = -1;
// Set the element to be visible again so it can be focused
if (element.hidden) {
element.hidden = false;
}
if (element.type === 'hidden') {
element.setAttribute('type', 'text');
}
}
function initializeField(element, options) {
var _options$value;
if (element.dataset.conform) {
return;
}
var defaultValue = typeof (options === null || options === void 0 ? void 0 : options.value) === 'string' || typeof (options === null || options === void 0 ? void 0 : options.defaultChecked) === 'boolean' ? options.defaultChecked ? (_options$value = options.value) !== null && _options$value !== void 0 ? _options$value : 'on' : null : options === null || options === void 0 ? void 0 : options.defaultValue;
// Update the value of the element, including the default value
dom.unstable_updateField(element, {
value: defaultValue,
defaultValue
});
element.dataset.conform = 'initialized';
}
function getRadioGroupValue(inputs) {
for (var input of inputs) {
if (input.type === 'radio' && input.checked) {
return input.value;
}
}
}
function getCheckboxGroupValue(inputs) {
var values;
for (var input of inputs) {
if (input.type === 'checkbox') {
var _values;
(_values = values) !== null && _values !== void 0 ? _values : values = [];
if (input.checked) {
values.push(input.value);
}
}
}
return values;
}
function getInputSnapshot(input) {
if (input instanceof HTMLInputElement) {
switch (input.type) {
case 'file':
return {
files: input.files ? Array.from(input.files) : undefined
};
case 'radio':
case 'checkbox':
return {
value: input.value,
checked: input.checked
};
}
} else if (input instanceof HTMLSelectElement && input.multiple) {
return {
options: Array.from(input.selectedOptions).map(option => option.value)
};
}
return {
value: input.value
};
}
function getDefaultSnapshot(defaultValue, defaultChecked, value) {
if (typeof value === 'string' || typeof defaultChecked === 'boolean') {
return {
value: value !== null && value !== void 0 ? value : 'on',
checked: defaultChecked
};
}
if (typeof defaultValue === 'string') {
return {
value: defaultValue
};
}
if (Array.isArray(defaultValue)) {
if (defaultValue.every(item => typeof item === 'string')) {
return {
options: defaultValue
};
} else {
return {
files: defaultValue
};
}
}
if (dom.isGlobalInstance(defaultValue, 'File')) {
return {
files: [defaultValue]
};
}
if (dom.isGlobalInstance(defaultValue, 'FileList')) {
return {
files: Array.from(defaultValue)
};
}
return {};
}
exports.focusable = focusable;
exports.getCheckboxGroupValue = getCheckboxGroupValue;
exports.getDefaultSnapshot = getDefaultSnapshot;
exports.getFormElement = getFormElement;
exports.getInputSnapshot = getInputSnapshot;
exports.getRadioGroupValue = getRadioGroupValue;
exports.initializeField = initializeField;