🚀 Big News:Socket Has Acquired Secure Annex.Learn More →
Socket
Book a DemoSign in
Socket
Book a DemoSign in

polythene-core-textfield

Package Overview
Dependencies
Maintainers
1
Versions
37
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

polythene-core-textfield - npm Package Compare versions

Comparing version
1.3.3
 to
1.4.0
+1
-343
dist/polythene-core-textfield.js

@@ -1,344 +0,2 @@

(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('polythene-core')) :
typeof define === 'function' && define.amd ? define(['exports', 'polythene-core'], factory) :
(factory((global.polythene = {}),global['polythene-core']));
}(this, (function (exports,polytheneCore) { 'use strict';
var classes = {
component: "pe-textfield",
// elements
counter: "pe-textfield__counter",
error: "pe-textfield__error",
errorPlaceholder: "pe-textfield__error-placeholder",
focusHelp: "pe-textfield__help-focus",
help: "pe-textfield__help",
input: "pe-textfield__input",
inputArea: "pe-textfield__input-area",
label: "pe-textfield__label",
optionalIndicator: "pe-textfield__optional-indicator",
requiredIndicator: "pe-textfield__required-indicator",
// states
hasCounter: "pe-textfield--counter",
hasFloatingLabel: "pe-textfield--floating-label",
hasFullWidth: "pe-textfield--full-width",
hideClear: "pe-textfield--hide-clear",
hideSpinner: "pe-textfield--hide-spinner",
hideValidation: "pe-textfield--hide-validation",
isDense: "pe-textfield--dense",
isRequired: "pe-textfield--required",
stateDirty: "pe-textfield--dirty",
stateDisabled: "pe-textfield--disabled",
stateFocused: "pe-textfield--focused",
stateInvalid: "pe-textfield--invalid",
stateReadonly: "pe-textfield--readonly"
};
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var getElement = function getElement(vnode) {
return vnode.attrs.element || "div";
};
var DEFAULT_VALID_STATE = {
invalid: false,
message: undefined
};
var validateCustom = function validateCustom(state, attrs) {
var el = state.inputEl();
if (!el) {
return DEFAULT_VALID_STATE;
}
var validState = attrs.validate(state.inputEl().value);
return {
invalid: validState && !validState.valid,
message: validState && validState.error
};
};
var validateCounter = function validateCounter(state, attrs) {
return {
invalid: state.inputEl().value.length > attrs.counter,
message: attrs.error
};
};
var validateHTML = function validateHTML(state, attrs) {
return {
invalid: !state.inputEl().checkValidity(),
message: attrs.error
};
};
var getValidStatus = function getValidStatus(state, attrs) {
var status = DEFAULT_VALID_STATE;
// attrs.validateResetOnClear: reset validation when field is cleared
if (state.isTouched() && state.isInvalid() && state.inputEl().value.length === 0 && attrs.validateResetOnClear) {
state.isTouched(false);
state.isInvalid(false);
state.error(undefined);
}
if (!status.invalid && attrs.counter) {
status = validateCounter(state, attrs);
}
if (!status.invalid && state.inputEl() && state.inputEl().checkValidity) {
status = validateHTML(state, attrs);
}
if (!status.invalid && attrs.validate) {
status = validateCustom(state, attrs);
}
return status;
};
var checkValidity = function checkValidity(vnode) {
var state = vnode.state;
var attrs = vnode.attrs;
// default
var status = attrs.valid !== undefined ? {
invalid: !attrs.valid,
message: attrs.error
} : !state.isTouched() && !attrs.validateAtStart ? DEFAULT_VALID_STATE : getValidStatus(state, attrs);
var previousInvalid = state.isInvalid();
state.error(status.message);
if (status.invalid !== previousInvalid) {
state.isInvalid(status.invalid);
}
if (!status.invalid) {
state.error(undefined);
}
};
var notifyState = function notifyState(vnode) {
var state = vnode.state;
var attrs = vnode.attrs;
if (attrs.onChange) {
var status = getValidStatus(state, attrs);
attrs.onChange({
focus: state.hasFocus(),
dirty: state.isDirty(),
el: state.inputEl(),
invalid: status.invalid,
error: status.error,
value: state.inputEl().value,
setInputState: function setInputState(newState) {
var hasNewValue = newState.value !== undefined && newState.value !== state.inputEl().value;
var hasNewFocus = newState.focus !== undefined && newState.focus !== state.hasFocus();
if (hasNewValue || hasNewFocus) {
state.setInputState(_extends({}, newState, { vnode: vnode }));
}
}
});
}
};
var ignoreEvent = function ignoreEvent(attrs, name) {
return attrs.ignoreEvents && attrs.ignoreEvents.indexOf(name) !== -1;
};
var getInitialState = function getInitialState(vnode, createStream, _ref) {
var k = _ref.keys;
var attrs = vnode.attrs;
var defaultValue = attrs.defaultValue !== undefined && attrs.defaultValue !== null ? attrs.defaultValue.toString() : attrs.value !== undefined && attrs.value !== null ? attrs.value.toString() : "";
var el = createStream(null);
var inputEl = createStream(null);
var setInputState = createStream({});
var error = createStream(attrs.error);
var hasFocus = createStream(false);
var isTouched = createStream(false); // true when any change is made
var isDirty = createStream(defaultValue !== ""); // true for any input
var isInvalid = createStream(false);
var previousValue = createStream(undefined);
var didSetFocusTime = 0;
var showErrorPlaceholder = !!(attrs.valid !== undefined || attrs.validate || attrs.min || attrs.max || attrs[k.minlength] || attrs[k.maxlength] || attrs.required || attrs.pattern);
return {
defaultValue: defaultValue,
didSetFocusTime: didSetFocusTime,
el: el,
error: error,
hasFocus: hasFocus,
inputEl: inputEl,
isDirty: isDirty,
isInvalid: isInvalid,
isTouched: isTouched,
previousValue: previousValue,
setInputState: setInputState,
showErrorPlaceholder: showErrorPlaceholder,
redrawOnUpdate: createStream.merge([inputEl, isInvalid, isDirty])
};
};
var onMount = function onMount(vnode) {
if (!vnode.dom) {
return;
}
var dom = vnode.dom;
var state = vnode.state;
var attrs = vnode.attrs;
state.el(dom);
var inputType = attrs.multiLine ? "textarea" : "input";
var inputEl = dom.querySelector(inputType);
vnode.state.inputEl(inputEl);
state.inputEl().value = state.defaultValue;
state.setInputState.map(function (_ref2) {
var vnode = _ref2.vnode,
type = _ref2.type,
focus = _ref2.focus,
value = _ref2.value;
if (vnode) {
value !== undefined ? state.inputEl().value = value : null;
focus !== undefined && (state.hasFocus(focus), focus ? state.inputEl().focus() : state.inputEl().blur());
type === "input" && (attrs.validateOnInput || attrs.counter) && state.isTouched(state.inputEl().value !== state.defaultValue);
type !== "input" && state.isTouched(state.inputEl().value !== state.defaultValue);
type === "onblur" && state.isTouched(true);
state.isDirty(state.inputEl().value !== "");
checkValidity(vnode);
notifyState(vnode);
state.previousValue(state.inputEl().value);
}
});
notifyState(vnode);
};
var onUpdate = function onUpdate(vnode) {
var state = vnode.state;
var attrs = vnode.attrs;
checkValidity(vnode);
var inputEl = state.inputEl();
var value = attrs.value !== undefined && attrs.value !== null ? attrs.value : inputEl ? inputEl.value : state.previousValue();
var valueStr = value === undefined || value === null ? "" : value.toString();
if (inputEl && state.previousValue() !== valueStr) {
inputEl.value = valueStr;
state.previousValue(valueStr);
state.setInputState({ vnode: vnode, type: "input" });
}
};
var createProps = function createProps(vnode, _ref3) {
var k = _ref3.keys;
var state = vnode.state;
var attrs = vnode.attrs;
var isInvalid = state.isInvalid();
return _extends({}, polytheneCore.filterSupportedAttributes(attrs), {
className: [classes.component, isInvalid ? classes.stateInvalid : "", state.hasFocus() ? classes.stateFocused : "", state.isDirty() ? classes.stateDirty : "", attrs.floatingLabel ? classes.hasFloatingLabel : "", attrs.disabled ? classes.stateDisabled : "", attrs.readonly ? classes.stateReadonly : "", attrs.dense ? classes.isDense : "", attrs.required ? classes.isRequired : "", attrs.fullWidth ? classes.hasFullWidth : "", attrs.counter ? classes.hasCounter : "", attrs.hideSpinner !== false && attrs.hideSpinner !== undefined ? classes.hideSpinner : "", attrs.hideClear !== false && attrs.hideClear !== undefined ? classes.hideClear : "", attrs.hideValidation ? classes.hideValidation : "", attrs.tone === "dark" ? "pe-dark-tone" : null, attrs.tone === "light" ? "pe-light-tone" : null, attrs.className || attrs[k.class]].join(" ")
});
};
var createContent = function createContent(vnode, _ref4) {
var h = _ref4.renderer,
k = _ref4.keys;
var state = vnode.state;
var attrs = vnode.attrs;
var inputEl = state.inputEl();
var error = attrs.error || state.error();
var isInvalid = state.isInvalid();
var inputType = attrs.multiLine ? "textarea" : "input";
var type = attrs.multiLine ? null : !attrs.type || attrs.type === "submit" || attrs.type === "search" ? "text" : attrs.type;
var showError = isInvalid && error !== undefined;
var inactive = attrs.disabled || attrs[k.readonly];
var requiredIndicator = attrs.required && attrs.requiredIndicator !== "" ? h("span", {
key: "required",
className: classes.requiredIndicator
}, attrs.requiredIndicator || "*") : null;
var optionalIndicator = !attrs.required && attrs.optionalIndicator ? h("span", {
key: "optional",
className: classes.optionalIndicator
}, attrs.optionalIndicator) : null;
var label = attrs.label ? [attrs.label, requiredIndicator, optionalIndicator] : null;
return [h("div", {
className: classes.inputArea,
key: "input-area"
}, [label ? h("label", {
key: "label",
className: classes.label
}, label) : null, h(inputType, _extends({}, {
key: "input",
className: classes.input,
disabled: attrs.disabled
}, type ? { type: type } : null, attrs.name ? { name: attrs.name } : null, !ignoreEvent(attrs, k.onclick) ? _defineProperty({}, k.onclick, function () {
if (inactive) {
return;
}
// in case the browser does not give the field focus,
// for instance when the user tapped to the current field off screen
state.setInputState({ vnode: vnode, focus: true });
notifyState(vnode);
}) : null, !ignoreEvent(attrs, k.onfocus) ? _defineProperty({}, k.onfocus, function () {
if (inactive) {
return;
}
state.setInputState({ vnode: vnode, focus: true });
// set CSS class manually in case field gets focus but is off screen
// and no redraw is triggered
// at the next redraw state.hasFocus() will be read and the focus class be set
// in the props.class statement
if (state.el()) {
state.el().classList.add(classes.stateFocused);
}
notifyState(vnode);
}) : null, !ignoreEvent(attrs, k.onblur) ? _defineProperty({}, k.onblur, function () {
state.setInputState({ vnode: vnode, type: "onblur", focus: false });
// same principle as onfocus
state.el().classList.remove(classes.stateFocused);
}) : null, !ignoreEvent(attrs, k.oninput) ? _defineProperty({}, k.oninput, function () {
// default input event
// may be overwritten by attrs.events
state.setInputState({ vnode: vnode, type: "input" });
}) : null, !ignoreEvent(attrs, k.onkeydown) ? _defineProperty({}, k.onkeydown, function (e) {
if (e.key === "Enter") {
state.isTouched(true);
} else if (e.key === "Escape" || e.key === "Esc") {
state.setInputState({ vnode: vnode, focus: false });
}
}) : null, attrs.events ? attrs.events : null, // NOTE: may overwrite oninput
attrs.required !== undefined && !!attrs.required ? { required: true } : null, attrs[k.readonly] !== undefined && !!attrs[k.readonly] ? _defineProperty({}, k.readonly, true) : null, attrs.pattern !== undefined ? { pattern: attrs.pattern } : null, attrs[k.maxlength] !== undefined ? _defineProperty({}, k.maxlength, attrs[k.maxlength]) : null, attrs[k.minlength] !== undefined ? _defineProperty({}, k.minlength, attrs[k.minlength]) : null, attrs.max !== undefined ? { max: attrs.max } : null, attrs.min !== undefined ? { min: attrs.min } : null, attrs[k.autofocus] !== undefined ? _defineProperty({}, k.autofocus, attrs[k.autofocus]) : null, attrs[k.tabindex] !== undefined ? _defineProperty({}, k.tabindex, attrs[k.tabindex]) : null, attrs.rows !== undefined ? { rows: attrs.rows } : null))]), attrs.counter ? h("div", {
key: "counter",
className: classes.counter
}, (inputEl && inputEl.value.length || 0) + " / " + attrs.counter) : null, attrs.help && !showError ? h("div", {
key: "help",
className: [classes.help, attrs.focusHelp ? classes.focusHelp : null].join(" ")
}, attrs.help) : null, showError ? h("div", {
key: "error",
className: classes.error
}, error) : state.showErrorPlaceholder && !attrs.help ? h("div", {
key: "error-placeholder",
className: classes.errorPlaceholder
}) : null];
};
var textfield = /*#__PURE__*/Object.freeze({
getElement: getElement,
getInitialState: getInitialState,
onMount: onMount,
onUpdate: onUpdate,
createProps: createProps,
createContent: createContent
});
exports.coreTextField = textfield;
Object.defineProperty(exports, '__esModule', { value: true });
})));
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("polythene-core")):"function"==typeof define&&define.amd?define(["exports","polythene-core"],t):t((e=e||self).polythene={},e["polythene-core"])}(this,function(e,t){"use strict";var l={component:"pe-textfield",counter:"pe-textfield__counter",error:"pe-textfield__error",errorPlaceholder:"pe-textfield__error-placeholder",focusHelp:"pe-textfield__help-focus",help:"pe-textfield__help",input:"pe-textfield__input",inputArea:"pe-textfield__input-area",label:"pe-textfield__label",optionalIndicator:"pe-textfield__optional-indicator",requiredIndicator:"pe-textfield__required-indicator",hasCounter:"pe-textfield--counter",hasFloatingLabel:"pe-textfield--floating-label",hasFullWidth:"pe-textfield--full-width",hideClear:"pe-textfield--hide-clear",hideSpinner:"pe-textfield--hide-spinner",hideValidation:"pe-textfield--hide-validation",isDense:"pe-textfield--dense",isRequired:"pe-textfield--required",stateDirty:"pe-textfield--dirty",stateDisabled:"pe-textfield--disabled",stateFocused:"pe-textfield--focused",stateInvalid:"pe-textfield--invalid",stateReadonly:"pe-textfield--readonly"};const i={invalid:!1,message:void 0},n=(e,t)=>{let l=i;return e.isTouched()&&e.isInvalid()&&0===e.inputEl().value.length&&t.validateResetOnClear&&(e.isTouched(!1),e.isInvalid(!1),e.error(void 0)),!l.invalid&&t.counter&&(l=((e,t)=>({invalid:e.inputEl().value.length>t.counter,message:t.error}))(e,t)),!l.invalid&&e.inputEl()&&e.inputEl().checkValidity&&(l=((e,t)=>({invalid:!e.inputEl().checkValidity(),message:t.error}))(e,t)),!l.invalid&&t.validate&&(l=((e,t)=>{if(!e.inputEl())return i;const l=t.validate(e.inputEl().value);return{invalid:l&&!l.valid,message:l&&l.error}})(e,t)),l},a=e=>{const t=e.state,l=e.attrs,a=void 0!==l.valid?{invalid:!l.valid,message:l.error}:t.isTouched()||l.validateAtStart?n(t,l):i,o=t.isInvalid();t.error(a.message),a.invalid!==o&&t.isInvalid(a.invalid),a.invalid||t.error(void 0)},o=e=>{const t=e.state,l=e.attrs;if(l.onChange){const i=n(t,l);l.onChange({focus:t.hasFocus(),dirty:t.isDirty(),el:t.inputEl(),invalid:i.invalid,error:i.error,value:t.inputEl().value,setInputState:l=>{const i=void 0!==l.value&&l.value!==t.inputEl().value,n=void 0!==l.focus&&l.focus!==t.hasFocus();(i||n)&&t.setInputState(Object.assign({},l,{vnode:e}))}})}},r=(e,t)=>e.ignoreEvents&&-1!==e.ignoreEvents.indexOf(t);var u=Object.freeze({getElement:e=>e.attrs.element||"div",getInitialState:(e,t,{keys:l})=>{const i=e.attrs,n=void 0!==i.defaultValue&&null!==i.defaultValue?i.defaultValue.toString():void 0!==i.value&&null!==i.value?i.value.toString():"",a=t(null),o=t(null),r=t({}),u=t(i.error),d=t(!1),s=t(!1),p=t(""!==n),c=t(!1);return{defaultValue:n,didSetFocusTime:0,el:a,error:u,hasFocus:d,inputEl:o,isDirty:p,isInvalid:c,isTouched:s,previousValue:t(void 0),setInputState:r,showErrorPlaceholder:!!(void 0!==i.valid||i.validate||i.min||i.max||i[l.minlength]||i[l.maxlength]||i.required||i.pattern),redrawOnUpdate:t.merge([o,c,p])}},onMount:e=>{if(!e.dom)return;const t=e.dom,l=e.state,i=e.attrs;l.el(t);const n=i.multiLine?"textarea":"input",r=t.querySelector(n);e.state.inputEl(r),l.inputEl().value=l.defaultValue,l.setInputState.map(({vnode:e,type:t,focus:n,value:r})=>{e&&(void 0!==r&&(l.inputEl().value=r),void 0!==n&&(l.hasFocus(n),n?l.inputEl().focus():l.inputEl().blur()),"input"===t&&(i.validateOnInput||i.counter)&&l.isTouched(l.inputEl().value!==l.defaultValue),"input"!==t&&l.isTouched(l.inputEl().value!==l.defaultValue),"onblur"===t&&l.isTouched(!0),l.isDirty(""!==l.inputEl().value),a(e),o(e),l.previousValue(l.inputEl().value))}),o(e)},onUpdate:e=>{const t=e.state,l=e.attrs;a(e);const i=t.inputEl(),n=void 0!==l.value&&null!==l.value?l.value:i?i.value:t.previousValue(),o=null==n?"":n.toString();i&&t.previousValue()!==o&&(i.value=o,t.previousValue(o),t.setInputState({vnode:e,type:"input"}))},createProps:(e,{keys:i})=>{const n=e.state,a=e.attrs,o=n.isInvalid();return Object.assign({},t.filterSupportedAttributes(a),{className:[l.component,o?l.stateInvalid:"",n.hasFocus()?l.stateFocused:"",n.isDirty()?l.stateDirty:"",a.floatingLabel?l.hasFloatingLabel:"",a.disabled?l.stateDisabled:"",a.readonly?l.stateReadonly:"",a.dense?l.isDense:"",a.required?l.isRequired:"",a.fullWidth?l.hasFullWidth:"",a.counter?l.hasCounter:"",!1!==a.hideSpinner&&void 0!==a.hideSpinner?l.hideSpinner:"",!1!==a.hideClear&&void 0!==a.hideClear?l.hideClear:"",a.hideValidation?l.hideValidation:"","dark"===a.tone?"pe-dark-tone":null,"light"===a.tone?"pe-light-tone":null,a.className||a[i.class]].join(" ")})},createContent:(e,{renderer:t,keys:i})=>{const n=e.state,a=e.attrs,u=n.inputEl();let d=a.error||n.error();const s=n.isInvalid(),p=a.multiLine?"textarea":"input",c=a.multiLine?null:a.type&&"submit"!==a.type&&"search"!==a.type?a.type:"text",v=s&&void 0!==d,h=a.disabled||a[i.readonly],f=a.required&&""!==a.requiredIndicator?t("span",{key:"required",className:l.requiredIndicator},a.requiredIndicator||"*"):null,y=!a.required&&a.optionalIndicator?t("span",{key:"optional",className:l.optionalIndicator},a.optionalIndicator):null,m=a.label?[a.label,f,y]:null;return[t("div",{className:l.inputArea,key:"input-area"},[m?t("label",{key:"label",className:l.label},m):null,t(p,Object.assign({},{key:"input",className:l.input,disabled:a.disabled},c?{type:c}:null,a.name?{name:a.name}:null,r(a,i.onclick)?null:{[i.onclick]:()=>{h||(n.setInputState({vnode:e,focus:!0}),o(e))}},r(a,i.onfocus)?null:{[i.onfocus]:()=>{h||(n.setInputState({vnode:e,focus:!0}),n.el()&&n.el().classList.add(l.stateFocused),o(e))}},r(a,i.onblur)?null:{[i.onblur]:()=>{n.setInputState({vnode:e,type:"onblur",focus:!1}),n.el().classList.remove(l.stateFocused)}},r(a,i.oninput)?null:{[i.oninput]:()=>{n.setInputState({vnode:e,type:"input"})}},r(a,i.onkeydown)?null:{[i.onkeydown]:t=>{"Enter"===t.key?n.isTouched(!0):"Escape"!==t.key&&"Esc"!==t.key||n.setInputState({vnode:e,focus:!1})}},a.events?a.events:null,void 0!==a.required&&a.required?{required:!0}:null,void 0!==a[i.readonly]&&a[i.readonly]?{[i.readonly]:!0}:null,void 0!==a.pattern?{pattern:a.pattern}:null,void 0!==a[i.maxlength]?{[i.maxlength]:a[i.maxlength]}:null,void 0!==a[i.minlength]?{[i.minlength]:a[i.minlength]}:null,void 0!==a.max?{max:a.max}:null,void 0!==a.min?{min:a.min}:null,void 0!==a[i.autofocus]?{[i.autofocus]:a[i.autofocus]}:null,void 0!==a[i.tabindex]?{[i.tabindex]:a[i.tabindex]}:null,void 0!==a.rows?{rows:a.rows}:null))]),a.counter?t("div",{key:"counter",className:l.counter},(u&&u.value.length||0)+" / "+a.counter):null,a.help&&!v?t("div",{key:"help",className:[l.help,a.focusHelp?l.focusHelp:null].join(" ")},a.help):null,v?t("div",{key:"error",className:l.error},d):n.showErrorPlaceholder&&!a.help?t("div",{key:"error-placeholder",className:l.errorPlaceholder}):null]}});e.coreTextField=u,Object.defineProperty(e,"__esModule",{value:!0})});
//# sourceMappingURL=polythene-core-textfield.js.map
+1
-1
dist/polythene-core-textfield.js.map

@@ -1,1 +0,1 @@

{"version":3,"file":"polythene-core-textfield.js","sources":["../../polythene-css-classes/textfield.js","../src/textfield.js"],"sourcesContent":["\nexport default {\n component: \"pe-textfield\",\n\n // elements\n counter: \"pe-textfield__counter\",\n error: \"pe-textfield__error\",\n errorPlaceholder: \"pe-textfield__error-placeholder\",\n focusHelp: \"pe-textfield__help-focus\",\n help: \"pe-textfield__help\",\n input: \"pe-textfield__input\",\n inputArea: \"pe-textfield__input-area\",\n label: \"pe-textfield__label\",\n optionalIndicator: \"pe-textfield__optional-indicator\",\n requiredIndicator: \"pe-textfield__required-indicator\",\n\n // states\n hasCounter: \"pe-textfield--counter\",\n hasFloatingLabel: \"pe-textfield--floating-label\",\n hasFullWidth: \"pe-textfield--full-width\",\n hideClear: \"pe-textfield--hide-clear\",\n hideSpinner: \"pe-textfield--hide-spinner\",\n hideValidation: \"pe-textfield--hide-validation\",\n isDense: \"pe-textfield--dense\",\n isRequired: \"pe-textfield--required\",\n stateDirty: \"pe-textfield--dirty\",\n stateDisabled: \"pe-textfield--disabled\",\n stateFocused: \"pe-textfield--focused\",\n stateInvalid: \"pe-textfield--invalid\",\n stateReadonly: \"pe-textfield--readonly\",\n};\n","import { filterSupportedAttributes } from \"polythene-core\";\nimport classes from \"polythene-css-classes/textfield\";\n\nexport const getElement = vnode =>\n vnode.attrs.element || \"div\";\n\nconst DEFAULT_VALID_STATE = {\n invalid: false,\n message: undefined\n};\n\nconst validateCustom = (state, attrs) => {\n const el = state.inputEl();\n if (!el) {\n return DEFAULT_VALID_STATE;\n }\n const validState = attrs.validate(state.inputEl().value);\n return {\n invalid: validState && !validState.valid,\n message: validState && validState.error\n };\n};\n\nconst validateCounter = (state, attrs) => ({\n invalid: state.inputEl().value.length > attrs.counter,\n message: attrs.error\n});\n\nconst validateHTML = (state, attrs) => ({\n invalid: !state.inputEl().checkValidity(),\n message: attrs.error\n});\n\nconst getValidStatus = (state, attrs) => {\n let status = DEFAULT_VALID_STATE;\n\n // attrs.validateResetOnClear: reset validation when field is cleared\n if (state.isTouched() && state.isInvalid() && state.inputEl().value.length === 0 && attrs.validateResetOnClear) {\n state.isTouched(false);\n state.isInvalid(false);\n state.error(undefined);\n }\n if (!status.invalid && attrs.counter) {\n status = validateCounter(state, attrs);\n }\n if (!status.invalid && state.inputEl() && state.inputEl().checkValidity) {\n status = validateHTML(state, attrs);\n }\n if (!status.invalid && attrs.validate) {\n status = validateCustom(state, attrs);\n }\n return status;\n};\n\nconst checkValidity = vnode => {\n const state = vnode.state;\n const attrs = vnode.attrs;\n // default\n const status = attrs.valid !== undefined\n ? {\n invalid: !attrs.valid,\n message: attrs.error\n }\n : (!state.isTouched() && !attrs.validateAtStart)\n ? DEFAULT_VALID_STATE\n : getValidStatus(state, attrs);\n const previousInvalid = state.isInvalid();\n state.error(status.message);\n if (status.invalid !== previousInvalid) {\n state.isInvalid(status.invalid);\n }\n if (!status.invalid) {\n state.error(undefined);\n }\n};\n\nconst notifyState = vnode => {\n const state = vnode.state;\n const attrs = vnode.attrs;\n if (attrs.onChange) {\n const status = getValidStatus(state, attrs);\n attrs.onChange({\n focus: state.hasFocus(),\n dirty: state.isDirty(),\n el: state.inputEl(),\n invalid: status.invalid,\n error: status.error,\n value: state.inputEl().value,\n setInputState: newState => {\n const hasNewValue = newState.value !== undefined && newState.value !== state.inputEl().value;\n const hasNewFocus = newState.focus !== undefined && newState.focus !== state.hasFocus();\n if (hasNewValue || hasNewFocus) {\n state.setInputState(Object.assign({}, newState, { vnode }));\n }\n },\n });\n }\n};\n\nconst ignoreEvent = (attrs, name) =>\n attrs.ignoreEvents && attrs.ignoreEvents.indexOf(name) !== -1;\n\nexport const getInitialState = (vnode, createStream, { keys: k }) => {\n const attrs = vnode.attrs;\n\n const defaultValue = attrs.defaultValue !== undefined && attrs.defaultValue !== null\n ? attrs.defaultValue.toString()\n : attrs.value !== undefined && attrs.value !== null\n ? attrs.value.toString()\n : \"\";\n\n const el = createStream(null);\n const inputEl = createStream(null);\n const setInputState = createStream({});\n const error = createStream(attrs.error);\n const hasFocus = createStream(false);\n const isTouched = createStream(false); // true when any change is made\n const isDirty = createStream(defaultValue !== \"\"); // true for any input\n const isInvalid = createStream(false);\n const previousValue = createStream(undefined);\n const didSetFocusTime = 0;\n const showErrorPlaceholder = !!(attrs.valid !== undefined || attrs.validate || attrs.min || attrs.max || attrs[k.minlength] || attrs[k.maxlength] || attrs.required || attrs.pattern);\n\n return {\n defaultValue,\n didSetFocusTime,\n el,\n error,\n hasFocus,\n inputEl,\n isDirty,\n isInvalid,\n isTouched,\n previousValue,\n setInputState,\n showErrorPlaceholder,\n redrawOnUpdate: createStream.merge([inputEl, isInvalid, isDirty])\n };\n};\n\nexport const onMount = vnode => {\n if (!vnode.dom) {\n return;\n }\n const dom = vnode.dom;\n const state = vnode.state;\n const attrs = vnode.attrs;\n\n state.el(dom);\n const inputType = attrs.multiLine ? \"textarea\" : \"input\";\n const inputEl = dom.querySelector(inputType);\n vnode.state.inputEl(inputEl);\n state.inputEl().value = state.defaultValue;\n \n state.setInputState.map(({ vnode, type, focus, value }) => {\n if (vnode) {\n value !== undefined ? state.inputEl().value = value : null;\n focus !== undefined && (state.hasFocus(focus), focus ? state.inputEl().focus() : state.inputEl().blur());\n type === \"input\" && (attrs.validateOnInput || attrs.counter) && state.isTouched(state.inputEl().value !== state.defaultValue);\n type !== \"input\" && state.isTouched(state.inputEl().value !== state.defaultValue);\n type === \"onblur\" && state.isTouched(true);\n state.isDirty(state.inputEl().value !== \"\");\n checkValidity(vnode);\n notifyState(vnode);\n state.previousValue(state.inputEl().value);\n }\n });\n notifyState(vnode);\n};\n\nexport const onUpdate = vnode => {\n const state = vnode.state;\n const attrs = vnode.attrs;\n checkValidity(vnode);\n\n const inputEl = state.inputEl();\n const value = (attrs.value !== undefined && attrs.value !== null)\n ? attrs.value\n : inputEl\n ? inputEl.value\n : state.previousValue();\n const valueStr = (value === undefined || value === null)\n ? \"\"\n : value.toString();\n\n if (inputEl && state.previousValue() !== valueStr) {\n inputEl.value = valueStr;\n state.previousValue(valueStr);\n state.setInputState({ vnode, type: \"input\" });\n }\n};\n\nexport const createProps = (vnode, { keys: k }) => {\n const state = vnode.state;\n const attrs = vnode.attrs;\n const isInvalid = state.isInvalid();\n\n return Object.assign(\n {},\n filterSupportedAttributes(attrs),\n {\n className: [\n classes.component,\n isInvalid ? classes.stateInvalid : \"\",\n state.hasFocus() ? classes.stateFocused : \"\",\n state.isDirty() ? classes.stateDirty : \"\",\n attrs.floatingLabel ? classes.hasFloatingLabel : \"\",\n attrs.disabled ? classes.stateDisabled : \"\",\n attrs.readonly ? classes.stateReadonly : \"\",\n attrs.dense ? classes.isDense : \"\",\n attrs.required ? classes.isRequired : \"\",\n attrs.fullWidth ? classes.hasFullWidth : \"\",\n attrs.counter ? classes.hasCounter : \"\",\n attrs.hideSpinner !== false && attrs.hideSpinner !== undefined ? classes.hideSpinner : \"\",\n attrs.hideClear !== false && attrs.hideClear !== undefined ? classes.hideClear : \"\",\n attrs.hideValidation ? classes.hideValidation : \"\",\n attrs.tone === \"dark\" ? \"pe-dark-tone\" : null,\n attrs.tone === \"light\" ? \"pe-light-tone\" : null,\n attrs.className || attrs[k.class],\n ].join(\" \")\n }\n );\n};\n\nexport const createContent = (vnode, { renderer: h, keys: k }) => {\n const state = vnode.state;\n const attrs = vnode.attrs;\n\n const inputEl = state.inputEl();\n let error = attrs.error || state.error();\n const isInvalid = state.isInvalid();\n const inputType = attrs.multiLine ? \"textarea\" : \"input\";\n const type = attrs.multiLine\n ? null\n : !attrs.type || attrs.type === \"submit\" || attrs.type === \"search\"\n ? \"text\"\n : attrs.type;\n const showError = isInvalid && error !== undefined;\n \n \n const inactive = attrs.disabled || attrs[k.readonly];\n\n const requiredIndicator = attrs.required && attrs.requiredIndicator !== \"\"\n ? h(\"span\",\n {\n key: \"required\",\n className: classes.requiredIndicator\n },\n attrs.requiredIndicator || \"*\"\n )\n : null;\n const optionalIndicator = !attrs.required && attrs.optionalIndicator\n ? h(\"span\",\n {\n key: \"optional\",\n className: classes.optionalIndicator\n },\n attrs.optionalIndicator\n )\n : null;\n const label = attrs.label\n ? [attrs.label, requiredIndicator, optionalIndicator]\n : null;\n\n return [\n h(\"div\",\n {\n className: classes.inputArea,\n key: \"input-area\"\n },\n [\n label\n ? h(\"label\",\n {\n key: \"label\",\n className: classes.label,\n },\n label)\n : null,\n h(inputType, Object.assign(\n {},\n {\n key: \"input\",\n className: classes.input,\n disabled: attrs.disabled\n },\n type ? { type } : null,\n attrs.name \n ? { name: attrs.name }\n : null,\n\n !ignoreEvent(attrs, k.onclick)\n ? {\n [k.onclick]: () => {\n if (inactive) {\n return;\n }\n // in case the browser does not give the field focus,\n // for instance when the user tapped to the current field off screen\n state.setInputState({ vnode, focus: true });\n notifyState(vnode);\n }\n }\n : null,\n\n !ignoreEvent(attrs, k.onfocus)\n ? {\n [k.onfocus]: () => {\n if (inactive) {\n return;\n }\n state.setInputState({ vnode, focus: true });\n\n // set CSS class manually in case field gets focus but is off screen\n // and no redraw is triggered\n // at the next redraw state.hasFocus() will be read and the focus class be set\n // in the props.class statement\n if (state.el()) {\n state.el().classList.add(classes.stateFocused);\n }\n notifyState(vnode);\n }\n }\n : null,\n \n !ignoreEvent(attrs, k.onblur)\n ? {\n [k.onblur]: () => {\n state.setInputState({ vnode, type: \"onblur\", focus: false });\n // same principle as onfocus\n state.el().classList.remove(classes.stateFocused);\n }\n }\n : null,\n\n !ignoreEvent(attrs, k.oninput)\n ? {\n [k.oninput]: () => {\n // default input event\n // may be overwritten by attrs.events\n state.setInputState({ vnode, type: \"input\" });\n }\n }\n : null,\n\n !ignoreEvent(attrs, k.onkeydown)\n ? {\n [k.onkeydown]: e => {\n if (e.key === \"Enter\") {\n state.isTouched(true);\n } else if (e.key === \"Escape\" || e.key === \"Esc\") {\n state.setInputState({ vnode, focus: false });\n }\n }\n }\n : null,\n\n attrs.events ? attrs.events : null, // NOTE: may overwrite oninput\n attrs.required !== undefined && !!attrs.required ? { required: true } : null,\n attrs[k.readonly] !== undefined && !!attrs[k.readonly] ? { [k.readonly]: true } : null,\n attrs.pattern !== undefined ? { pattern: attrs.pattern } : null,\n attrs[k.maxlength] !== undefined ? { [k.maxlength]: attrs[k.maxlength] } : null,\n attrs[k.minlength] !== undefined ? { [k.minlength]: attrs[k.minlength] } : null,\n attrs.max !== undefined ? { max: attrs.max } : null,\n attrs.min !== undefined ? { min: attrs.min } : null,\n attrs[k.autofocus] !== undefined ? { [k.autofocus]: attrs[k.autofocus] } : null,\n attrs[k.tabindex] !== undefined ? { [k.tabindex]: attrs[k.tabindex] } : null,\n attrs.rows !== undefined ? { rows: attrs.rows } : null\n ))\n ]\n ),\n attrs.counter\n ? h(\"div\",\n {\n key: \"counter\",\n className: classes.counter\n },\n ((inputEl && inputEl.value.length) || 0) + \" / \" + attrs.counter\n )\n : null,\n attrs.help && !showError\n ? h(\"div\",\n {\n key: \"help\",\n className: [\n classes.help,\n attrs.focusHelp ? classes.focusHelp : null\n ].join(\" \")\n },\n attrs.help\n )\n : null,\n showError\n ? h(\"div\",\n {\n key: \"error\",\n className: classes.error\n },\n error\n )\n : state.showErrorPlaceholder && !attrs.help\n ? h(\"div\",\n {\n key: \"error-placeholder\",\n className: classes.errorPlaceholder\n }\n )\n : null\n ];\n};\n"],"names":["component","counter","error","errorPlaceholder","focusHelp","help","input","inputArea","label","optionalIndicator","requiredIndicator","hasCounter","hasFloatingLabel","hasFullWidth","hideClear","hideSpinner","hideValidation","isDense","isRequired","stateDirty","stateDisabled","stateFocused","stateInvalid","stateReadonly","getElement","vnode","attrs","element","DEFAULT_VALID_STATE","invalid","message","undefined","validateCustom","state","el","inputEl","validState","validate","value","valid","validateCounter","length","validateHTML","checkValidity","getValidStatus","status","isTouched","isInvalid","validateResetOnClear","validateAtStart","previousInvalid","notifyState","onChange","focus","hasFocus","dirty","isDirty","setInputState","hasNewValue","newState","hasNewFocus","ignoreEvent","name","ignoreEvents","indexOf","getInitialState","createStream","k","keys","defaultValue","toString","previousValue","didSetFocusTime","showErrorPlaceholder","min","max","minlength","maxlength","required","pattern","redrawOnUpdate","merge","onMount","dom","inputType","multiLine","querySelector","map","type","blur","validateOnInput","onUpdate","valueStr","createProps","filterSupportedAttributes","className","classes","floatingLabel","disabled","readonly","dense","fullWidth","tone","class","join","createContent","h","renderer","showError","inactive","key","onclick","onfocus","classList","add","onblur","remove","oninput","onkeydown","e","events","autofocus","tabindex","rows"],"mappings":"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"}
{"version":3,"file":"polythene-core-textfield.js","sources":["../../polythene-css-classes/textfield.js","../src/textfield.js"],"sourcesContent":["\nexport default {\n component: \"pe-textfield\",\n\n // elements\n counter: \"pe-textfield__counter\",\n error: \"pe-textfield__error\",\n errorPlaceholder: \"pe-textfield__error-placeholder\",\n focusHelp: \"pe-textfield__help-focus\",\n help: \"pe-textfield__help\",\n input: \"pe-textfield__input\",\n inputArea: \"pe-textfield__input-area\",\n label: \"pe-textfield__label\",\n optionalIndicator: \"pe-textfield__optional-indicator\",\n requiredIndicator: \"pe-textfield__required-indicator\",\n\n // states\n hasCounter: \"pe-textfield--counter\",\n hasFloatingLabel: \"pe-textfield--floating-label\",\n hasFullWidth: \"pe-textfield--full-width\",\n hideClear: \"pe-textfield--hide-clear\",\n hideSpinner: \"pe-textfield--hide-spinner\",\n hideValidation: \"pe-textfield--hide-validation\",\n isDense: \"pe-textfield--dense\",\n isRequired: \"pe-textfield--required\",\n stateDirty: \"pe-textfield--dirty\",\n stateDisabled: \"pe-textfield--disabled\",\n stateFocused: \"pe-textfield--focused\",\n stateInvalid: \"pe-textfield--invalid\",\n stateReadonly: \"pe-textfield--readonly\",\n};\n","import { filterSupportedAttributes } from \"polythene-core\";\nimport classes from \"polythene-css-classes/textfield\";\n\nexport const getElement = vnode =>\n vnode.attrs.element || \"div\";\n\nconst DEFAULT_VALID_STATE = {\n invalid: false,\n message: undefined\n};\n\nconst validateCustom = (state, attrs) => {\n const el = state.inputEl();\n if (!el) {\n return DEFAULT_VALID_STATE;\n }\n const validState = attrs.validate(state.inputEl().value);\n return {\n invalid: validState && !validState.valid,\n message: validState && validState.error\n };\n};\n\nconst validateCounter = (state, attrs) => ({\n invalid: state.inputEl().value.length > attrs.counter,\n message: attrs.error\n});\n\nconst validateHTML = (state, attrs) => ({\n invalid: !state.inputEl().checkValidity(),\n message: attrs.error\n});\n\nconst getValidStatus = (state, attrs) => {\n let status = DEFAULT_VALID_STATE;\n\n // attrs.validateResetOnClear: reset validation when field is cleared\n if (state.isTouched() && state.isInvalid() && state.inputEl().value.length === 0 && attrs.validateResetOnClear) {\n state.isTouched(false);\n state.isInvalid(false);\n state.error(undefined);\n }\n if (!status.invalid && attrs.counter) {\n status = validateCounter(state, attrs);\n }\n if (!status.invalid && state.inputEl() && state.inputEl().checkValidity) {\n status = validateHTML(state, attrs);\n }\n if (!status.invalid && attrs.validate) {\n status = validateCustom(state, attrs);\n }\n return status;\n};\n\nconst checkValidity = vnode => {\n const state = vnode.state;\n const attrs = vnode.attrs;\n // default\n const status = attrs.valid !== undefined\n ? {\n invalid: !attrs.valid,\n message: attrs.error\n }\n : (!state.isTouched() && !attrs.validateAtStart)\n ? DEFAULT_VALID_STATE\n : getValidStatus(state, attrs);\n const previousInvalid = state.isInvalid();\n state.error(status.message);\n if (status.invalid !== previousInvalid) {\n state.isInvalid(status.invalid);\n }\n if (!status.invalid) {\n state.error(undefined);\n }\n};\n\nconst notifyState = vnode => {\n const state = vnode.state;\n const attrs = vnode.attrs;\n if (attrs.onChange) {\n const status = getValidStatus(state, attrs);\n attrs.onChange({\n focus: state.hasFocus(),\n dirty: state.isDirty(),\n el: state.inputEl(),\n invalid: status.invalid,\n error: status.error,\n value: state.inputEl().value,\n setInputState: newState => {\n const hasNewValue = newState.value !== undefined && newState.value !== state.inputEl().value;\n const hasNewFocus = newState.focus !== undefined && newState.focus !== state.hasFocus();\n if (hasNewValue || hasNewFocus) {\n state.setInputState(Object.assign({}, newState, { vnode }));\n }\n },\n });\n }\n};\n\nconst ignoreEvent = (attrs, name) =>\n attrs.ignoreEvents && attrs.ignoreEvents.indexOf(name) !== -1;\n\nexport const getInitialState = (vnode, createStream, { keys: k }) => {\n const attrs = vnode.attrs;\n\n const defaultValue = attrs.defaultValue !== undefined && attrs.defaultValue !== null\n ? attrs.defaultValue.toString()\n : attrs.value !== undefined && attrs.value !== null\n ? attrs.value.toString()\n : \"\";\n\n const el = createStream(null);\n const inputEl = createStream(null);\n const setInputState = createStream({});\n const error = createStream(attrs.error);\n const hasFocus = createStream(false);\n const isTouched = createStream(false); // true when any change is made\n const isDirty = createStream(defaultValue !== \"\"); // true for any input\n const isInvalid = createStream(false);\n const previousValue = createStream(undefined);\n const didSetFocusTime = 0;\n const showErrorPlaceholder = !!(attrs.valid !== undefined || attrs.validate || attrs.min || attrs.max || attrs[k.minlength] || attrs[k.maxlength] || attrs.required || attrs.pattern);\n\n return {\n defaultValue,\n didSetFocusTime,\n el,\n error,\n hasFocus,\n inputEl,\n isDirty,\n isInvalid,\n isTouched,\n previousValue,\n setInputState,\n showErrorPlaceholder,\n redrawOnUpdate: createStream.merge([inputEl, isInvalid, isDirty])\n };\n};\n\nexport const onMount = vnode => {\n if (!vnode.dom) {\n return;\n }\n const dom = vnode.dom;\n const state = vnode.state;\n const attrs = vnode.attrs;\n\n state.el(dom);\n const inputType = attrs.multiLine ? \"textarea\" : \"input\";\n const inputEl = dom.querySelector(inputType);\n vnode.state.inputEl(inputEl);\n state.inputEl().value = state.defaultValue;\n \n state.setInputState.map(({ vnode, type, focus, value }) => {\n if (vnode) {\n value !== undefined ? state.inputEl().value = value : null;\n focus !== undefined && (state.hasFocus(focus), focus ? state.inputEl().focus() : state.inputEl().blur());\n type === \"input\" && (attrs.validateOnInput || attrs.counter) && state.isTouched(state.inputEl().value !== state.defaultValue);\n type !== \"input\" && state.isTouched(state.inputEl().value !== state.defaultValue);\n type === \"onblur\" && state.isTouched(true);\n state.isDirty(state.inputEl().value !== \"\");\n checkValidity(vnode);\n notifyState(vnode);\n state.previousValue(state.inputEl().value);\n }\n });\n notifyState(vnode);\n};\n\nexport const onUpdate = vnode => {\n const state = vnode.state;\n const attrs = vnode.attrs;\n checkValidity(vnode);\n\n const inputEl = state.inputEl();\n const value = (attrs.value !== undefined && attrs.value !== null)\n ? attrs.value\n : inputEl\n ? inputEl.value\n : state.previousValue();\n const valueStr = (value === undefined || value === null)\n ? \"\"\n : value.toString();\n\n if (inputEl && state.previousValue() !== valueStr) {\n inputEl.value = valueStr;\n state.previousValue(valueStr);\n state.setInputState({ vnode, type: \"input\" });\n }\n};\n\nexport const createProps = (vnode, { keys: k }) => {\n const state = vnode.state;\n const attrs = vnode.attrs;\n const isInvalid = state.isInvalid();\n\n return Object.assign(\n {},\n filterSupportedAttributes(attrs),\n {\n className: [\n classes.component,\n isInvalid ? classes.stateInvalid : \"\",\n state.hasFocus() ? classes.stateFocused : \"\",\n state.isDirty() ? classes.stateDirty : \"\",\n attrs.floatingLabel ? classes.hasFloatingLabel : \"\",\n attrs.disabled ? classes.stateDisabled : \"\",\n attrs.readonly ? classes.stateReadonly : \"\",\n attrs.dense ? classes.isDense : \"\",\n attrs.required ? classes.isRequired : \"\",\n attrs.fullWidth ? classes.hasFullWidth : \"\",\n attrs.counter ? classes.hasCounter : \"\",\n attrs.hideSpinner !== false && attrs.hideSpinner !== undefined ? classes.hideSpinner : \"\",\n attrs.hideClear !== false && attrs.hideClear !== undefined ? classes.hideClear : \"\",\n attrs.hideValidation ? classes.hideValidation : \"\",\n attrs.tone === \"dark\" ? \"pe-dark-tone\" : null,\n attrs.tone === \"light\" ? \"pe-light-tone\" : null,\n attrs.className || attrs[k.class],\n ].join(\" \")\n }\n );\n};\n\nexport const createContent = (vnode, { renderer: h, keys: k }) => {\n const state = vnode.state;\n const attrs = vnode.attrs;\n\n const inputEl = state.inputEl();\n let error = attrs.error || state.error();\n const isInvalid = state.isInvalid();\n const inputType = attrs.multiLine ? \"textarea\" : \"input\";\n const type = attrs.multiLine\n ? null\n : !attrs.type || attrs.type === \"submit\" || attrs.type === \"search\"\n ? \"text\"\n : attrs.type;\n const showError = isInvalid && error !== undefined;\n \n \n const inactive = attrs.disabled || attrs[k.readonly];\n\n const requiredIndicator = attrs.required && attrs.requiredIndicator !== \"\"\n ? h(\"span\",\n {\n key: \"required\",\n className: classes.requiredIndicator\n },\n attrs.requiredIndicator || \"*\"\n )\n : null;\n const optionalIndicator = !attrs.required && attrs.optionalIndicator\n ? h(\"span\",\n {\n key: \"optional\",\n className: classes.optionalIndicator\n },\n attrs.optionalIndicator\n )\n : null;\n const label = attrs.label\n ? [attrs.label, requiredIndicator, optionalIndicator]\n : null;\n\n return [\n h(\"div\",\n {\n className: classes.inputArea,\n key: \"input-area\"\n },\n [\n label\n ? h(\"label\",\n {\n key: \"label\",\n className: classes.label,\n },\n label)\n : null,\n h(inputType, Object.assign(\n {},\n {\n key: \"input\",\n className: classes.input,\n disabled: attrs.disabled\n },\n type ? { type } : null,\n attrs.name \n ? { name: attrs.name }\n : null,\n\n !ignoreEvent(attrs, k.onclick)\n ? {\n [k.onclick]: () => {\n if (inactive) {\n return;\n }\n // in case the browser does not give the field focus,\n // for instance when the user tapped to the current field off screen\n state.setInputState({ vnode, focus: true });\n notifyState(vnode);\n }\n }\n : null,\n\n !ignoreEvent(attrs, k.onfocus)\n ? {\n [k.onfocus]: () => {\n if (inactive) {\n return;\n }\n state.setInputState({ vnode, focus: true });\n\n // set CSS class manually in case field gets focus but is off screen\n // and no redraw is triggered\n // at the next redraw state.hasFocus() will be read and the focus class be set\n // in the props.class statement\n if (state.el()) {\n state.el().classList.add(classes.stateFocused);\n }\n notifyState(vnode);\n }\n }\n : null,\n \n !ignoreEvent(attrs, k.onblur)\n ? {\n [k.onblur]: () => {\n state.setInputState({ vnode, type: \"onblur\", focus: false });\n // same principle as onfocus\n state.el().classList.remove(classes.stateFocused);\n }\n }\n : null,\n\n !ignoreEvent(attrs, k.oninput)\n ? {\n [k.oninput]: () => {\n // default input event\n // may be overwritten by attrs.events\n state.setInputState({ vnode, type: \"input\" });\n }\n }\n : null,\n\n !ignoreEvent(attrs, k.onkeydown)\n ? {\n [k.onkeydown]: e => {\n if (e.key === \"Enter\") {\n state.isTouched(true);\n } else if (e.key === \"Escape\" || e.key === \"Esc\") {\n state.setInputState({ vnode, focus: false });\n }\n }\n }\n : null,\n\n attrs.events ? attrs.events : null, // NOTE: may overwrite oninput\n attrs.required !== undefined && !!attrs.required ? { required: true } : null,\n attrs[k.readonly] !== undefined && !!attrs[k.readonly] ? { [k.readonly]: true } : null,\n attrs.pattern !== undefined ? { pattern: attrs.pattern } : null,\n attrs[k.maxlength] !== undefined ? { [k.maxlength]: attrs[k.maxlength] } : null,\n attrs[k.minlength] !== undefined ? { [k.minlength]: attrs[k.minlength] } : null,\n attrs.max !== undefined ? { max: attrs.max } : null,\n attrs.min !== undefined ? { min: attrs.min } : null,\n attrs[k.autofocus] !== undefined ? { [k.autofocus]: attrs[k.autofocus] } : null,\n attrs[k.tabindex] !== undefined ? { [k.tabindex]: attrs[k.tabindex] } : null,\n attrs.rows !== undefined ? { rows: attrs.rows } : null\n ))\n ]\n ),\n attrs.counter\n ? h(\"div\",\n {\n key: \"counter\",\n className: classes.counter\n },\n ((inputEl && inputEl.value.length) || 0) + \" / \" + attrs.counter\n )\n : null,\n attrs.help && !showError\n ? h(\"div\",\n {\n key: \"help\",\n className: [\n classes.help,\n attrs.focusHelp ? classes.focusHelp : null\n ].join(\" \")\n },\n attrs.help\n )\n : null,\n showError\n ? h(\"div\",\n {\n key: \"error\",\n className: classes.error\n },\n error\n )\n : state.showErrorPlaceholder && !attrs.help\n ? h(\"div\",\n {\n key: \"error-placeholder\",\n className: classes.errorPlaceholder\n }\n )\n : null\n ];\n};\n"],"names":["component","counter","error","errorPlaceholder","focusHelp","help","input","inputArea","label","optionalIndicator","requiredIndicator","hasCounter","hasFloatingLabel","hasFullWidth","hideClear","hideSpinner","hideValidation","isDense","isRequired","stateDirty","stateDisabled","stateFocused","stateInvalid","stateReadonly","DEFAULT_VALID_STATE","invalid","message","undefined","getValidStatus","state","attrs","status","isTouched","isInvalid","inputEl","value","length","validateResetOnClear","validateCounter","checkValidity","validateHTML","validate","validState","valid","validateCustom","vnode","validateAtStart","previousInvalid","notifyState","onChange","focus","hasFocus","dirty","isDirty","el","setInputState","newState","hasNewValue","hasNewFocus","Object","assign","ignoreEvent","name","ignoreEvents","indexOf","element","createStream","keys","k","defaultValue","toString","didSetFocusTime","previousValue","showErrorPlaceholder","min","max","minlength","maxlength","required","pattern","redrawOnUpdate","merge","dom","inputType","multiLine","querySelector","map","type","blur","validateOnInput","valueStr","filterSupportedAttributes","className","classes","floatingLabel","disabled","readonly","dense","fullWidth","tone","class","join","renderer","h","showError","inactive","key","onclick","onfocus","classList","add","onblur","remove","oninput","onkeydown","e","events","autofocus","tabindex","rows"],"mappings":"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"}
+201
-162
dist/polythene-core-textfield.mjs

@@ -5,3 +5,2 @@ import { filterSupportedAttributes } from 'polythene-core';

component: "pe-textfield",
// elements

@@ -18,3 +17,2 @@ counter: "pe-textfield__counter",

requiredIndicator: "pe-textfield__required-indicator",
// states

@@ -36,11 +34,4 @@ hasCounter: "pe-textfield--counter",

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var getElement = function getElement(vnode) {
return vnode.attrs.element || "div";
};
var DEFAULT_VALID_STATE = {
const getElement = vnode => vnode.attrs.element || "div";
const DEFAULT_VALID_STATE = {
invalid: false,

@@ -50,8 +41,10 @@ message: undefined

var validateCustom = function validateCustom(state, attrs) {
var el = state.inputEl();
const validateCustom = (state, attrs) => {
const el = state.inputEl();
if (!el) {
return DEFAULT_VALID_STATE;
}
var validState = attrs.validate(state.inputEl().value);
const validState = attrs.validate(state.inputEl().value);
return {

@@ -63,20 +56,15 @@ invalid: validState && !validState.valid,

var validateCounter = function validateCounter(state, attrs) {
return {
invalid: state.inputEl().value.length > attrs.counter,
message: attrs.error
};
};
const validateCounter = (state, attrs) => ({
invalid: state.inputEl().value.length > attrs.counter,
message: attrs.error
});
var validateHTML = function validateHTML(state, attrs) {
return {
invalid: !state.inputEl().checkValidity(),
message: attrs.error
};
};
const validateHTML = (state, attrs) => ({
invalid: !state.inputEl().checkValidity(),
message: attrs.error
});
var getValidStatus = function getValidStatus(state, attrs) {
var status = DEFAULT_VALID_STATE;
const getValidStatus = (state, attrs) => {
let status = DEFAULT_VALID_STATE; // attrs.validateResetOnClear: reset validation when field is cleared
// attrs.validateResetOnClear: reset validation when field is cleared
if (state.isTouched() && state.isInvalid() && state.inputEl().value.length === 0 && attrs.validateResetOnClear) {

@@ -87,27 +75,33 @@ state.isTouched(false);

}
if (!status.invalid && attrs.counter) {
status = validateCounter(state, attrs);
}
if (!status.invalid && state.inputEl() && state.inputEl().checkValidity) {
status = validateHTML(state, attrs);
}
if (!status.invalid && attrs.validate) {
status = validateCustom(state, attrs);
}
return status;
};
var checkValidity = function checkValidity(vnode) {
var state = vnode.state;
var attrs = vnode.attrs;
// default
var status = attrs.valid !== undefined ? {
const checkValidity = vnode => {
const state = vnode.state;
const attrs = vnode.attrs; // default
const status = attrs.valid !== undefined ? {
invalid: !attrs.valid,
message: attrs.error
} : !state.isTouched() && !attrs.validateAtStart ? DEFAULT_VALID_STATE : getValidStatus(state, attrs);
var previousInvalid = state.isInvalid();
const previousInvalid = state.isInvalid();
state.error(status.message);
if (status.invalid !== previousInvalid) {
state.isInvalid(status.invalid);
}
if (!status.invalid) {

@@ -118,7 +112,8 @@ state.error(undefined);

var notifyState = function notifyState(vnode) {
var state = vnode.state;
var attrs = vnode.attrs;
const notifyState = vnode => {
const state = vnode.state;
const attrs = vnode.attrs;
if (attrs.onChange) {
var status = getValidStatus(state, attrs);
const status = getValidStatus(state, attrs);
attrs.onChange({

@@ -131,7 +126,10 @@ focus: state.hasFocus(),

value: state.inputEl().value,
setInputState: function setInputState(newState) {
var hasNewValue = newState.value !== undefined && newState.value !== state.inputEl().value;
var hasNewFocus = newState.focus !== undefined && newState.focus !== state.hasFocus();
setInputState: newState => {
const hasNewValue = newState.value !== undefined && newState.value !== state.inputEl().value;
const hasNewFocus = newState.focus !== undefined && newState.focus !== state.hasFocus();
if (hasNewValue || hasNewFocus) {
state.setInputState(_extends({}, newState, { vnode: vnode }));
state.setInputState(Object.assign({}, newState, {
vnode
}));
}

@@ -143,62 +141,57 @@ }

var ignoreEvent = function ignoreEvent(attrs, name) {
return attrs.ignoreEvents && attrs.ignoreEvents.indexOf(name) !== -1;
};
const ignoreEvent = (attrs, name) => attrs.ignoreEvents && attrs.ignoreEvents.indexOf(name) !== -1;
var getInitialState = function getInitialState(vnode, createStream, _ref) {
var k = _ref.keys;
const getInitialState = (vnode, createStream, {
keys: k
}) => {
const attrs = vnode.attrs;
const defaultValue = attrs.defaultValue !== undefined && attrs.defaultValue !== null ? attrs.defaultValue.toString() : attrs.value !== undefined && attrs.value !== null ? attrs.value.toString() : "";
const el = createStream(null);
const inputEl = createStream(null);
const setInputState = createStream({});
const error = createStream(attrs.error);
const hasFocus = createStream(false);
const isTouched = createStream(false); // true when any change is made
var attrs = vnode.attrs;
const isDirty = createStream(defaultValue !== ""); // true for any input
var defaultValue = attrs.defaultValue !== undefined && attrs.defaultValue !== null ? attrs.defaultValue.toString() : attrs.value !== undefined && attrs.value !== null ? attrs.value.toString() : "";
var el = createStream(null);
var inputEl = createStream(null);
var setInputState = createStream({});
var error = createStream(attrs.error);
var hasFocus = createStream(false);
var isTouched = createStream(false); // true when any change is made
var isDirty = createStream(defaultValue !== ""); // true for any input
var isInvalid = createStream(false);
var previousValue = createStream(undefined);
var didSetFocusTime = 0;
var showErrorPlaceholder = !!(attrs.valid !== undefined || attrs.validate || attrs.min || attrs.max || attrs[k.minlength] || attrs[k.maxlength] || attrs.required || attrs.pattern);
const isInvalid = createStream(false);
const previousValue = createStream(undefined);
const didSetFocusTime = 0;
const showErrorPlaceholder = !!(attrs.valid !== undefined || attrs.validate || attrs.min || attrs.max || attrs[k.minlength] || attrs[k.maxlength] || attrs.required || attrs.pattern);
return {
defaultValue: defaultValue,
didSetFocusTime: didSetFocusTime,
el: el,
error: error,
hasFocus: hasFocus,
inputEl: inputEl,
isDirty: isDirty,
isInvalid: isInvalid,
isTouched: isTouched,
previousValue: previousValue,
setInputState: setInputState,
showErrorPlaceholder: showErrorPlaceholder,
defaultValue,
didSetFocusTime,
el,
error,
hasFocus,
inputEl,
isDirty,
isInvalid,
isTouched,
previousValue,
setInputState,
showErrorPlaceholder,
redrawOnUpdate: createStream.merge([inputEl, isInvalid, isDirty])
};
};
var onMount = function onMount(vnode) {
const onMount = vnode => {
if (!vnode.dom) {
return;
}
var dom = vnode.dom;
var state = vnode.state;
var attrs = vnode.attrs;
const dom = vnode.dom;
const state = vnode.state;
const attrs = vnode.attrs;
state.el(dom);
var inputType = attrs.multiLine ? "textarea" : "input";
var inputEl = dom.querySelector(inputType);
const inputType = attrs.multiLine ? "textarea" : "input";
const inputEl = dom.querySelector(inputType);
vnode.state.inputEl(inputEl);
state.inputEl().value = state.defaultValue;
state.setInputState.map(function (_ref2) {
var vnode = _ref2.vnode,
type = _ref2.type,
focus = _ref2.focus,
value = _ref2.value;
state.setInputState.map(({
vnode,
type,
focus,
value
}) => {
if (vnode) {

@@ -218,57 +211,51 @@ value !== undefined ? state.inputEl().value = value : null;

};
var onUpdate = function onUpdate(vnode) {
var state = vnode.state;
var attrs = vnode.attrs;
const onUpdate = vnode => {
const state = vnode.state;
const attrs = vnode.attrs;
checkValidity(vnode);
const inputEl = state.inputEl();
const value = attrs.value !== undefined && attrs.value !== null ? attrs.value : inputEl ? inputEl.value : state.previousValue();
const valueStr = value === undefined || value === null ? "" : value.toString();
var inputEl = state.inputEl();
var value = attrs.value !== undefined && attrs.value !== null ? attrs.value : inputEl ? inputEl.value : state.previousValue();
var valueStr = value === undefined || value === null ? "" : value.toString();
if (inputEl && state.previousValue() !== valueStr) {
inputEl.value = valueStr;
state.previousValue(valueStr);
state.setInputState({ vnode: vnode, type: "input" });
state.setInputState({
vnode,
type: "input"
});
}
};
var createProps = function createProps(vnode, _ref3) {
var k = _ref3.keys;
var state = vnode.state;
var attrs = vnode.attrs;
var isInvalid = state.isInvalid();
return _extends({}, filterSupportedAttributes(attrs), {
const createProps = (vnode, {
keys: k
}) => {
const state = vnode.state;
const attrs = vnode.attrs;
const isInvalid = state.isInvalid();
return Object.assign({}, filterSupportedAttributes(attrs), {
className: [classes.component, isInvalid ? classes.stateInvalid : "", state.hasFocus() ? classes.stateFocused : "", state.isDirty() ? classes.stateDirty : "", attrs.floatingLabel ? classes.hasFloatingLabel : "", attrs.disabled ? classes.stateDisabled : "", attrs.readonly ? classes.stateReadonly : "", attrs.dense ? classes.isDense : "", attrs.required ? classes.isRequired : "", attrs.fullWidth ? classes.hasFullWidth : "", attrs.counter ? classes.hasCounter : "", attrs.hideSpinner !== false && attrs.hideSpinner !== undefined ? classes.hideSpinner : "", attrs.hideClear !== false && attrs.hideClear !== undefined ? classes.hideClear : "", attrs.hideValidation ? classes.hideValidation : "", attrs.tone === "dark" ? "pe-dark-tone" : null, attrs.tone === "light" ? "pe-light-tone" : null, attrs.className || attrs[k.class]].join(" ")
});
};
var createContent = function createContent(vnode, _ref4) {
var h = _ref4.renderer,
k = _ref4.keys;
var state = vnode.state;
var attrs = vnode.attrs;
var inputEl = state.inputEl();
var error = attrs.error || state.error();
var isInvalid = state.isInvalid();
var inputType = attrs.multiLine ? "textarea" : "input";
var type = attrs.multiLine ? null : !attrs.type || attrs.type === "submit" || attrs.type === "search" ? "text" : attrs.type;
var showError = isInvalid && error !== undefined;
var inactive = attrs.disabled || attrs[k.readonly];
var requiredIndicator = attrs.required && attrs.requiredIndicator !== "" ? h("span", {
const createContent = (vnode, {
renderer: h,
keys: k
}) => {
const state = vnode.state;
const attrs = vnode.attrs;
const inputEl = state.inputEl();
let error = attrs.error || state.error();
const isInvalid = state.isInvalid();
const inputType = attrs.multiLine ? "textarea" : "input";
const type = attrs.multiLine ? null : !attrs.type || attrs.type === "submit" || attrs.type === "search" ? "text" : attrs.type;
const showError = isInvalid && error !== undefined;
const inactive = attrs.disabled || attrs[k.readonly];
const requiredIndicator = attrs.required && attrs.requiredIndicator !== "" ? h("span", {
key: "required",
className: classes.requiredIndicator
}, attrs.requiredIndicator || "*") : null;
var optionalIndicator = !attrs.required && attrs.optionalIndicator ? h("span", {
const optionalIndicator = !attrs.required && attrs.optionalIndicator ? h("span", {
key: "optional",
className: classes.optionalIndicator
}, attrs.optionalIndicator) : null;
var label = attrs.label ? [attrs.label, requiredIndicator, optionalIndicator] : null;
const label = attrs.label ? [attrs.label, requiredIndicator, optionalIndicator] : null;
return [h("div", {

@@ -280,44 +267,96 @@ className: classes.inputArea,

className: classes.label
}, label) : null, h(inputType, _extends({}, {
}, label) : null, h(inputType, Object.assign({}, {
key: "input",
className: classes.input,
disabled: attrs.disabled
}, type ? { type: type } : null, attrs.name ? { name: attrs.name } : null, !ignoreEvent(attrs, k.onclick) ? _defineProperty({}, k.onclick, function () {
if (inactive) {
return;
}, type ? {
type
} : null, attrs.name ? {
name: attrs.name
} : null, !ignoreEvent(attrs, k.onclick) ? {
[k.onclick]: () => {
if (inactive) {
return;
} // in case the browser does not give the field focus,
// for instance when the user tapped to the current field off screen
state.setInputState({
vnode,
focus: true
});
notifyState(vnode);
}
// in case the browser does not give the field focus,
// for instance when the user tapped to the current field off screen
state.setInputState({ vnode: vnode, focus: true });
notifyState(vnode);
}) : null, !ignoreEvent(attrs, k.onfocus) ? _defineProperty({}, k.onfocus, function () {
if (inactive) {
return;
} : null, !ignoreEvent(attrs, k.onfocus) ? {
[k.onfocus]: () => {
if (inactive) {
return;
}
state.setInputState({
vnode,
focus: true
}); // set CSS class manually in case field gets focus but is off screen
// and no redraw is triggered
// at the next redraw state.hasFocus() will be read and the focus class be set
// in the props.class statement
if (state.el()) {
state.el().classList.add(classes.stateFocused);
}
notifyState(vnode);
}
state.setInputState({ vnode: vnode, focus: true });
} : null, !ignoreEvent(attrs, k.onblur) ? {
[k.onblur]: () => {
state.setInputState({
vnode,
type: "onblur",
focus: false
}); // same principle as onfocus
// set CSS class manually in case field gets focus but is off screen
// and no redraw is triggered
// at the next redraw state.hasFocus() will be read and the focus class be set
// in the props.class statement
if (state.el()) {
state.el().classList.add(classes.stateFocused);
state.el().classList.remove(classes.stateFocused);
}
notifyState(vnode);
}) : null, !ignoreEvent(attrs, k.onblur) ? _defineProperty({}, k.onblur, function () {
state.setInputState({ vnode: vnode, type: "onblur", focus: false });
// same principle as onfocus
state.el().classList.remove(classes.stateFocused);
}) : null, !ignoreEvent(attrs, k.oninput) ? _defineProperty({}, k.oninput, function () {
// default input event
// may be overwritten by attrs.events
state.setInputState({ vnode: vnode, type: "input" });
}) : null, !ignoreEvent(attrs, k.onkeydown) ? _defineProperty({}, k.onkeydown, function (e) {
if (e.key === "Enter") {
state.isTouched(true);
} else if (e.key === "Escape" || e.key === "Esc") {
state.setInputState({ vnode: vnode, focus: false });
} : null, !ignoreEvent(attrs, k.oninput) ? {
[k.oninput]: () => {
// default input event
// may be overwritten by attrs.events
state.setInputState({
vnode,
type: "input"
});
}
}) : null, attrs.events ? attrs.events : null, // NOTE: may overwrite oninput
attrs.required !== undefined && !!attrs.required ? { required: true } : null, attrs[k.readonly] !== undefined && !!attrs[k.readonly] ? _defineProperty({}, k.readonly, true) : null, attrs.pattern !== undefined ? { pattern: attrs.pattern } : null, attrs[k.maxlength] !== undefined ? _defineProperty({}, k.maxlength, attrs[k.maxlength]) : null, attrs[k.minlength] !== undefined ? _defineProperty({}, k.minlength, attrs[k.minlength]) : null, attrs.max !== undefined ? { max: attrs.max } : null, attrs.min !== undefined ? { min: attrs.min } : null, attrs[k.autofocus] !== undefined ? _defineProperty({}, k.autofocus, attrs[k.autofocus]) : null, attrs[k.tabindex] !== undefined ? _defineProperty({}, k.tabindex, attrs[k.tabindex]) : null, attrs.rows !== undefined ? { rows: attrs.rows } : null))]), attrs.counter ? h("div", {
} : null, !ignoreEvent(attrs, k.onkeydown) ? {
[k.onkeydown]: e => {
if (e.key === "Enter") {
state.isTouched(true);
} else if (e.key === "Escape" || e.key === "Esc") {
state.setInputState({
vnode,
focus: false
});
}
}
} : null, attrs.events ? attrs.events : null, // NOTE: may overwrite oninput
attrs.required !== undefined && !!attrs.required ? {
required: true
} : null, attrs[k.readonly] !== undefined && !!attrs[k.readonly] ? {
[k.readonly]: true
} : null, attrs.pattern !== undefined ? {
pattern: attrs.pattern
} : null, attrs[k.maxlength] !== undefined ? {
[k.maxlength]: attrs[k.maxlength]
} : null, attrs[k.minlength] !== undefined ? {
[k.minlength]: attrs[k.minlength]
} : null, attrs.max !== undefined ? {
max: attrs.max
} : null, attrs.min !== undefined ? {
min: attrs.min
} : null, attrs[k.autofocus] !== undefined ? {
[k.autofocus]: attrs[k.autofocus]
} : null, attrs[k.tabindex] !== undefined ? {
[k.tabindex]: attrs[k.tabindex]
} : null, attrs.rows !== undefined ? {
rows: attrs.rows
} : null))]), attrs.counter ? h("div", {
key: "counter",

@@ -324,0 +363,0 @@ className: classes.counter

+5
-5
package.json
{
"name": "polythene-core-textfield",
"version": "1.3.3",
"version": "1.4.0",
"description": "",

@@ -9,3 +9,3 @@ "main": "dist/polythene-core-textfield",

"clean": "rm -rf dist/*",
"rollup": "../../node_modules/rollup/bin/rollup -c ../../scripts/rollup.umd.js && ../../node_modules/rollup/bin/rollup -c ../../scripts/rollup.es.js",
"rollup": "../../node_modules/rollup/bin/rollup -c ../../scripts/bundling/rollup.umd.js && ../../node_modules/rollup/bin/rollup -c ../../scripts/bundling/rollup.es.js",
"build": "npm run clean && npm run rollup"

@@ -18,5 +18,5 @@ },

"dependencies": {
"polythene-core": "^1.3.2",
"polythene-css-classes": "^1.3.2",
"polythene-theme": "^1.3.2"
"polythene-core": "^1.4.0",
"polythene-css-classes": "^1.4.0",
"polythene-theme": "^1.4.0"
},

@@ -23,0 +23,0 @@ "author": "Arthur Clemens <arthurclemens@gmail.com> (http://arthurclemens.com)",