Socket
Socket
Sign inDemoInstall

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.0.0-rc.9 to 1.0.0-rc.10

399

dist/polythene-core-textfield.js

@@ -1,2 +0,399 @@

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("polythene-core"),require("polythene-theme")):"function"==typeof define&&define.amd?define(["exports","polythene-core","polythene-theme"],t):t(e.polythene={},e["polythene-core"],e["polythene-theme"])}(this,function(e,t,r){"use strict";function l(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}var i={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"},o=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var l in r)Object.prototype.hasOwnProperty.call(r,l)&&(e[l]=r[l])}return e},n=function(e){return e.attrs.element||"div"},a=function(e,t){var r=t.validate(e.inputEl().value);return{invalid:r&&!r.valid,message:r&&r.error}},d=function(e,t){return{invalid:e.inputEl().value.length>t.counter,message:t.error}},u=function(e,t){return{invalid:!e.inputEl().checkValidity(),message:t.error}},_=function(e,t){var r={invalid:!1,message:void 0};return e.isTouched()&&e.isInvalid()&&0===e.inputEl().value.length&&t.validateResetOnClear&&(e.isTouched(!1),e.isInvalid(!1),e.error(void 0)),!r.invalid&&t.counter&&(r=d(e,t)),!r.invalid&&e.inputEl()&&e.inputEl().checkValidity&&(r=u(e,t)),!r.invalid&&t.validate&&(r=a(e,t)),r},s=function(e){var t=e.state,r=e.attrs,l=t.isTouched()||r.validateAtStart?_(t,r):{invalid:!1,message:void 0},i=t.isInvalid();t.error(l.message),l.invalid!==i&&t.isInvalid(l.invalid),l.invalid||t.error(void 0)},c=function(e){var t=e.state,r=e.attrs;if(r.onChange){var l=_(t,r);r.onChange({focus:t.hasFocus(),dirty:t.isDirty(),el:t.inputEl(),invalid:l.invalid,error:l.error,value:t.inputEl().value})}},p=function(e,t){return e.ignoreEvents&&-1!==e.ignoreEvents.indexOf(t)},v=function(e,t){var r=e.attrs,l=void 0!==r.defaultValue?r.defaultValue:void 0!==r.value?r.value:"",i=t(null),o=t(null),n=t({}),a=t(r.error),d=t(r.focus||!1),u=t(!1),_=t(!1),s=t(""!==l),c=t(!1);return{defaultValue:l,didSetFocusTime:0,el:i,error:a,hasFocus:d,inputEl:o,isDirty:s,isInvalid:c,isTouched:_,previousValue:t(void 0),setFocus:u,setValue:n,redrawOnUpdate:t.merge([o,c,s])}},h=function(e){var t=e.dom,r=e.state,l=e.attrs;r.el(t);var i=l.multiLine?"textarea":"input",o=t.querySelector(i);e.state.inputEl(o),r.inputEl().value=r.defaultValue,r.setValue.map(function(t){var i=t.type,o=t.focus;return void 0!==o&&r.setFocus(o),"input"===i&&(l.validateOnInput||l.counter)&&r.isTouched(""!==r.inputEl().value),"input"!==i&&r.isTouched(""!==r.inputEl().value),"onblur"===i&&r.isTouched(!0),r.isDirty(""!==r.inputEl().value),s(e),c(e),r.previousValue(r.inputEl().value)}),r.setFocus.map(function(e){r.didSetFocusTime+150>(new Date).getTime()||(r.hasFocus(e),e&&r.inputEl()&&setTimeout(function(){return r.inputEl()&&r.inputEl().focus&&r.inputEl().focus(),r.didSetFocusTime=(new Date).getTime()},0))}),c(e)},f=function(e,r){var l=r.keys,n=e.state,a=e.attrs,d=n.isInvalid();return o({},t.filterSupportedAttributes(a),{className:[i.component,d?i.stateInvalid:"",n.hasFocus()?i.stateFocused:"",n.isDirty()?i.stateDirty:"",a.floatingLabel?i.hasFloatingLabel:"",a.disabled?i.stateDisabled:"",a.readonly?i.stateReadonly:"",a.dense?i.isDense:"",a.required?i.isRequired:"",a.fullWidth?i.hasFullWidth:"",a.counter?i.hasCounter:"",!1!==a.hideSpinner&&void 0!==a.hideSpinner?i.hideSpinner:"",!1!==a.hideClear&&void 0!==a.hideClear?i.hideClear:"",a.hideValidation?i.hideValidation:"","dark"===a.tone?"pe-dark-tone":null,"light"===a.tone?"pe-light-tone":null,a.className||a[l.class]].join(" ")})},g=function(e,r){var n=r.renderer,a=r.keys,d=e.state,u=e.attrs,_=d.inputEl(),s=d.isInvalid(),v=u.multiLine?"textarea":"input",h=u.multiLine?null:u.type&&"submit"!==u.type&&"search"!==u.type?u.type:"text",f=s&&void 0!==d.error(),g=u.validate||u.min||u.max||u[a.minlength]||u[a.maxlength]||u.required||u.pattern,b=u.disabled||u[a.readonly];!u.focus||d.hasFocus()||b||d.setFocus(!0);var m=void 0!==u.value&&null!==u.value?u.value:_?_.value:d.previousValue(),y=void 0===m||null===m?"":m.toString();_&&d.previousValue()!==y&&(_.value=y,d.previousValue(y),setTimeout(function(){return d.setValue({type:"input"})},0));var x=u.required&&""!==u.requiredIndicator?n("span",{key:"required",className:i.requiredIndicator},u.requiredIndicator||"*"):null,k=!u.required&&u.optionalIndicator?n("span",{key:"optional",className:i.optionalIndicator},u.optionalIndicator):null,E=u.label?[u.label,x,k]:null;return[n("div",{className:i.inputArea,key:"input-area"},[E?n("label",l({key:"label",className:i.label},a["on"+t.pointerStartEvent],function(){b||setTimeout(function(){d.inputEl.focus()},0)}),E):null,n(v,o({},{key:"input",className:i.input,disabled:u.disabled},h?{type:h}:null,u.name?{name:u.name}:null,p(u,a.onclick)?null:l({},a.onclick,function(){b||(d.setFocus(!0),c(e))}),p(u,a.onfocus)?null:l({},a.onfocus,function(){b||(d.setFocus(!0),d.el()&&d.el().classList.add(i.stateFocused),c(e))}),p(u,a.onblur)?null:l({},a.onblur,function(){d.setValue({type:"onblur",focus:!1}),d.el().classList.remove(i.stateFocused)}),p(u,a.oninput)?null:l({},a.oninput,function(){d.setValue({type:"input"})}),p(u,a.onkeydown)?null:l({},a.onkeydown,function(e){"Enter"===e.key?d.isTouched(!0):"Escape"===e.key&&_.blur(e)}),u.events?u.events:null,void 0!==u.required&&u.required?{required:!0}:null,void 0!==u[a.readonly]&&u[a.readonly]?l({},a.readonly,!0):null,void 0!==u.pattern?{pattern:u.pattern}:null,void 0!==u[a.maxlength]?l({},a.maxlength,u[a.maxlength]):null,void 0!==u[a.minlength]?l({},a.minlength,u[a.minlength]):null,void 0!==u.max?{max:u.max}:null,void 0!==u.min?{min:u.min}:null,void 0!==u[a.autofocus]?l({},a.autofocus,u[a.autofocus]):null,void 0!==u[a.tabindex]?l({},a.tabindex,u[a.tabindex]):null,void 0!==u.rows?{rows:u.rows}:null))]),u.counter?n("div",{key:"counter",className:i.counter},(_&&_.value.length||0)+" / "+u.counter):null,u.help&&!f?n("div",{key:"help",className:[i.help,u.focusHelp?i.focusHelp:null].join(" ")},u.help):null,f?n("div",{key:"error",className:i.error},d.error()):g&&!u.help?n("div",{key:"error-placeholder",className:i.errorPlaceholder}):null]},b=Object.freeze({getElement:n,getInitialState:v,onMount:h,createProps:f,createContent:g}),m=function(e){return"rgba("+e+", "+(arguments.length>1&&void 0!==arguments[1]?arguments[1]:1)+")"},y={vertical_spacing_top:6,vertical_spacing_bottom:7,input_focus_border_width:2,input_focus_border_animation_duration:r.vars.animation_duration,floating_label_vertical_spacing_top:30,floating_label_vertical_spacing_bottom:7,floating_label_top:14,floating_label_animation_duration:".12s",input_padding_h:0,input_padding_v:7,input_border_width:1,margin_top_error_message:6,font_size_input:16,font_size_error:12,font_size_floating_label:12,line_height_input:20,dense_floating_label_vertical_spacing_top:23,dense_floating_label_vertical_spacing_bottom:4,dense_floating_label_top:10,dense_font_size_input:13,dense_font_size_floating_label:13,full_width_input_padding_h:20,full_width_input_padding_v:18,dense_full_width_input_padding_h:16,dense_full_width_input_padding_v:15,dense_full_width_font_size_input:13,color_light_input_text:m(r.vars.color_light_foreground,r.vars.blend_light_text_primary),color_light_input_background:"transparent",color_light_highlight_text:m(r.vars.color_primary,r.vars.blend_light_text_primary),color_light_input_bottom_border:m(r.vars.color_light_foreground,r.vars.blend_light_border_light),color_light_input_error_text:m("221, 44, 0"),color_light_input_error_border:m("221, 44, 0"),color_light_input_placeholder:m(r.vars.color_light_foreground,r.vars.blend_light_text_tertiary),color_light_label_text:m(r.vars.color_light_foreground,r.vars.blend_light_text_tertiary),color_light_disabled_label_text:m(r.vars.color_light_foreground,r.vars.blend_light_text_disabled),color_light_readonly_label_text:m(r.vars.color_light_foreground,r.vars.blend_light_text_tertiary),color_light_help_text:m(r.vars.color_light_foreground,r.vars.blend_light_text_tertiary),color_light_required_symbol:m("221, 44, 0"),color_light_focus_border:m(r.vars.color_primary),color_light_counter_ok_border:m(r.vars.color_primary),color_dark_input_text:m(r.vars.color_dark_foreground,r.vars.blend_dark_text_primary),color_dark_input_background:"transparent",color_dark_highlight_text:m(r.vars.color_primary,r.vars.blend_dark_text_primary),color_dark_input_bottom_border:m(r.vars.color_dark_foreground,r.vars.blend_dark_border_light),color_dark_input_error_text:m("222, 50, 38"),color_dark_input_error_border:m("222, 50, 38"),color_dark_input_placeholder:m(r.vars.color_dark_foreground,r.vars.blend_dark_text_tertiary),color_dark_label_text:m(r.vars.color_dark_foreground,r.vars.blend_dark_text_tertiary),color_dark_disabled_label_text:m(r.vars.color_dark_foreground,r.vars.blend_dark_text_disabled),color_dark_readonly_label_text:m(r.vars.color_dark_foreground,r.vars.blend_dark_text_tertiary),color_dark_help_text:m(r.vars.color_dark_foreground,r.vars.blend_dark_text_tertiary),color_dark_required_symbol:m("221, 44, 0"),color_dark_focus_border:m(r.vars.color_primary),color_dark_counter_ok_border:m(r.vars.color_primary)};e.coreTextField=b,e.vars=y,Object.defineProperty(e,"__esModule",{value:!0})});
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('polythene-core'), require('polythene-theme')) :
typeof define === 'function' && define.amd ? define(['exports', 'polythene-core', 'polythene-theme'], factory) :
(factory((global.polythene = {}),global['polythene-core'],global['polythene-theme']));
}(this, (function (exports,polytheneCore,polytheneTheme) { '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) {
return state.setInputState(newState);
}
});
}
};
var ignoreEvent = function ignoreEvent(attrs, name) {
return attrs.ignoreEvents && attrs.ignoreEvents.indexOf(name) !== -1;
};
var getInitialState = function getInitialState(vnode, createStream) {
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;
return {
defaultValue: defaultValue,
didSetFocusTime: didSetFocusTime,
el: el,
error: error,
hasFocus: hasFocus,
inputEl: inputEl,
isDirty: isDirty,
isInvalid: isInvalid,
isTouched: isTouched,
previousValue: previousValue,
setInputState: setInputState,
redrawOnUpdate: createStream.merge([inputEl, isInvalid, isDirty])
};
};
var onMount = function onMount(vnode) {
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 (_ref) {
var type = _ref.type,
focus = _ref.focus,
value = _ref.value;
return 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({ type: "input" });
}
};
var createProps = function createProps(vnode, _ref2) {
var k = _ref2.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, _ref3) {
var h = _ref3.renderer,
k = _ref3.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 validates = !!(attrs.valid !== undefined || attrs.validate || attrs.min || attrs.max || attrs[k.minlength] || attrs[k.maxlength] || attrs.required || attrs.pattern);
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({ focus: true });
notifyState(vnode);
}) : null, !ignoreEvent(attrs, k.onfocus) ? _defineProperty({}, k.onfocus, function () {
if (inactive) {
return;
}
state.setInputState({ 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({ 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({ 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({ 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) : validates && !attrs.help ? h("div", {
key: "error-placeholder",
className: classes.errorPlaceholder
}) : null];
};
var textfield = Object.freeze({
getElement: getElement,
getInitialState: getInitialState,
onMount: onMount,
onUpdate: onUpdate,
createProps: createProps,
createContent: createContent
});
var rgba = function rgba(colorStr) {
var opacity = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
return "rgba(" + colorStr + ", " + opacity + ")";
};
var line_height_input = 20;
var input_padding_v = 7;
var vars$1 = {
vertical_spacing_top: 6, // 8 minus natural label height padding (1)
vertical_spacing_bottom: 7, // 8 minus natural label height padding (1)
input_focus_border_width: 2,
input_focus_border_animation_duration: polytheneTheme.vars.animation_duration,
floating_label_vertical_spacing_top: 30, // 16 + 8 + 8 minus natural label height padding (2)
floating_label_vertical_spacing_bottom: 7, // 8 minus natural label height padding (1)
floating_label_top: 14,
floating_label_animation_duration: ".12s",
input_padding_h: 0,
input_padding_v: input_padding_v,
input_border_width: 1,
margin_top_error_message: 6,
font_size_input: 16,
font_size_error: 12,
font_size_floating_label: 12,
line_height_input: line_height_input,
dense_floating_label_vertical_spacing_top: 23, // 12 + 8 + 4 minus natural label height padding (1)
dense_floating_label_vertical_spacing_bottom: 4, // 8 minus natural label height padding (1)
dense_floating_label_top: 10,
dense_font_size_input: 13,
dense_font_size_floating_label: 13,
full_width_input_padding_h: 20,
full_width_input_padding_v: 18, // 20 minus natural label height padding (2)
dense_full_width_input_padding_h: 16,
dense_full_width_input_padding_v: 15, // 16 minus natural label height padding (1)
dense_full_width_font_size_input: 13,
color_light_input_text: rgba(polytheneTheme.vars.color_light_foreground, polytheneTheme.vars.blend_light_text_primary),
color_light_input_background: "transparent", // only used to "remove" autofill color
color_light_highlight_text: rgba(polytheneTheme.vars.color_primary, polytheneTheme.vars.blend_light_text_primary),
color_light_input_bottom_border: rgba(polytheneTheme.vars.color_light_foreground, polytheneTheme.vars.blend_light_border_light),
color_light_input_error_text: rgba("221, 44, 0"),
color_light_input_error_border: rgba("221, 44, 0"),
color_light_input_placeholder: rgba(polytheneTheme.vars.color_light_foreground, polytheneTheme.vars.blend_light_text_tertiary),
color_light_label_text: rgba(polytheneTheme.vars.color_light_foreground, polytheneTheme.vars.blend_light_text_tertiary),
color_light_disabled_label_text: rgba(polytheneTheme.vars.color_light_foreground, polytheneTheme.vars.blend_light_text_disabled),
color_light_readonly_label_text: rgba(polytheneTheme.vars.color_light_foreground, polytheneTheme.vars.blend_light_text_tertiary),
color_light_help_text: rgba(polytheneTheme.vars.color_light_foreground, polytheneTheme.vars.blend_light_text_tertiary),
color_light_required_symbol: rgba("221, 44, 0"),
color_light_focus_border: rgba(polytheneTheme.vars.color_primary),
color_light_counter_ok_border: rgba(polytheneTheme.vars.color_primary),
color_dark_input_text: rgba(polytheneTheme.vars.color_dark_foreground, polytheneTheme.vars.blend_dark_text_primary),
color_dark_input_background: "transparent", // only used to "remove" autofill color
color_dark_highlight_text: rgba(polytheneTheme.vars.color_primary, polytheneTheme.vars.blend_dark_text_primary),
color_dark_input_bottom_border: rgba(polytheneTheme.vars.color_dark_foreground, polytheneTheme.vars.blend_dark_border_light),
color_dark_input_error_text: rgba("222, 50, 38"),
color_dark_input_error_border: rgba("222, 50, 38"),
color_dark_input_placeholder: rgba(polytheneTheme.vars.color_dark_foreground, polytheneTheme.vars.blend_dark_text_tertiary),
color_dark_label_text: rgba(polytheneTheme.vars.color_dark_foreground, polytheneTheme.vars.blend_dark_text_tertiary),
color_dark_disabled_label_text: rgba(polytheneTheme.vars.color_dark_foreground, polytheneTheme.vars.blend_dark_text_disabled),
color_dark_readonly_label_text: rgba(polytheneTheme.vars.color_dark_foreground, polytheneTheme.vars.blend_dark_text_tertiary),
color_dark_help_text: rgba(polytheneTheme.vars.color_dark_foreground, polytheneTheme.vars.blend_dark_text_tertiary),
color_dark_required_symbol: rgba("221, 44, 0"),
color_dark_focus_border: rgba(polytheneTheme.vars.color_primary),
color_dark_counter_ok_border: rgba(polytheneTheme.vars.color_primary)
};
exports.coreTextField = textfield;
exports.vars = vars$1;
Object.defineProperty(exports, '__esModule', { value: true });
})));
//# sourceMappingURL=polythene-core-textfield.js.map

8

package.json
{
"name": "polythene-core-textfield",
"version": "1.0.0-rc.9",
"version": "1.0.0-rc.10",
"description": "",

@@ -17,5 +17,5 @@ "main": "dist/polythene-core-textfield.js",

"dependencies": {
"polythene-core": "^1.0.0-rc.9",
"polythene-css-classes": "^1.0.0-rc.9",
"polythene-theme": "^1.0.0-rc.9"
"polythene-core": "^1.0.0-rc.10",
"polythene-css-classes": "^1.0.0-rc.10",
"polythene-theme": "^1.0.0-rc.10"
},

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

dist/polythene-core-textfield.js.map

Sorry, the diff of this file is not supported yet

dist/polythene-core-textfield.mjs

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc