New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
@leafygreen-ui/text-input
Advanced tools
@leafygreen-ui/text-input - npm Package Compare versions
Comparing version 6.0.3 to 6.0.4
| # @leafygreen-ui/text-input | ||
| ## 6.0.4 | ||
| ### Patch Changes | ||
| - fe542c15: Fixes a bug in TextInput & TextArea where the focus ring was not visible when using the mouse. Also adds functionality to InteractioRing to ignore keyboard context and use the default focus behavior. | ||
| - Updated dependencies [f6e5655a] | ||
| - Updated dependencies [03388ff2] | ||
| - Updated dependencies [fe542c15] | ||
| - Updated dependencies [b8f03aa1] | ||
| - @leafygreen-ui/palette@3.2.2 | ||
| - @leafygreen-ui/icon@11.3.0 | ||
| - @leafygreen-ui/interaction-ring@1.1.0 | ||
| - @leafygreen-ui/lib@9.0.0 | ||
| - @leafygreen-ui/leafygreen-provider@2.1.3 | ||
| - @leafygreen-ui/typography@8.0.4 | ||
| ## 6.0.3 | ||
@@ -4,0 +20,0 @@ |
@@ -1,2 +0,2 @@ | ||
| import r,{useState as e}from"react";import n from"prop-types";import{css as o,cx as t}from"@leafygreen-ui/emotion";import a from"@leafygreen-ui/icon/dist/Checkmark";import i from"@leafygreen-ui/icon/dist/CheckmarkWithCircle";import l from"@leafygreen-ui/icon/dist/Warning";import d from"@leafygreen-ui/interaction-ring";import{useUsingKeyboardContext as u}from"@leafygreen-ui/leafygreen-provider";import{uiColors as c}from"@leafygreen-ui/palette";import{createDataProp as s}from"@leafygreen-ui/lib";import{useIdAllocator as f}from"@leafygreen-ui/hooks";import{Label as p,Description as b}from"@leafygreen-ui/typography";function g(r,e,n){return e in r?Object.defineProperty(r,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):r[e]=n,r}function m(){return(m=Object.assign||function(r){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(r[o]=n[o])}return r}).apply(this,arguments)}function y(r,e){if(null==r)return{};var n,o,t=function(r,e){if(null==r)return{};var n,o,t={},a=Object.keys(r);for(o=0;o<a.length;o++)n=a[o],e.indexOf(n)>=0||(t[n]=r[n]);return t}(r,e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(r);for(o=0;o<a.length;o++)n=a[o],e.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(r,n)&&(t[n]=r[n])}return t}function v(r,e){return e||(e=r.slice(0)),Object.freeze(Object.defineProperties(r,{raw:{value:Object.freeze(e)}}))}function h(r,e){return function(r){if(Array.isArray(r))return r}(r)||function(r,e){if("undefined"==typeof Symbol||!(Symbol.iterator in Object(r)))return;var n=[],o=!0,t=!1,a=void 0;try{for(var i,l=r[Symbol.iterator]();!(o=(i=l.next()).done)&&(n.push(i.value),!e||n.length!==e);o=!0);}catch(r){t=!0,a=r}finally{try{o||null==l.return||l.return()}finally{if(t)throw a}}return n}(r,e)||function(r,e){if(!r)return;if("string"==typeof r)return x(r,e);var n=Object.prototype.toString.call(r).slice(8,-1);"Object"===n&&r.constructor&&(n=r.constructor.name);if("Map"===n||"Set"===n)return Array.from(r);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return x(r,e)}(r,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function x(r,e){(null==e||e>r.length)&&(e=r.length);for(var n=0,o=new Array(e);n<e;n++)o[n]=r[n];return o}var k,C,w,E;function O(){var r=v(["\n color: ",";\n "]);return O=function(){return r},r}function B(){var r=v(["\n color: ",";\n "]);return B=function(){return r},r}function N(){var r=v(["\n color: ",";\n "]);return N=function(){return r},r}function j(){var r=v(["\n &:focus {\n border: 1px solid ",";\n }\n "]);return j=function(){return r},r}function M(){var r=v(["\n color: ",";\n background-color: ",";\n\n &:disabled {\n color: ",";\n background-color: ",";\n\n &:-webkit-autofill {\n &,\n &:hover,\n &:focus {\n appearance: none;\n border: 1px solid ",";\n -webkit-text-fill-color: ",";\n -webkit-box-shadow: 0 0 0px 1000px\n "," inset;\n }\n }\n }\n "]);return M=function(){return r},r}function A(){var r=v(["\n padding-right: ","px;\n border-color: ",";\n "]);return A=function(){return r},r}function z(){var r=v(["\n background-color: #5a3c3b;\n "]);return z=function(){return r},r}function F(){var r=v(["\n padding-right: 30px;\n border-color: ",";\n "]);return F=function(){return r},r}function I(){var r=v(["\n padding-right: 30px;\n border-color: ",";\n "]);return I=function(){return r},r}function S(){var r=v(["\n font-size: 14px;\n min-height: 20px;\n padding-top: 4px;\n font-weight: normal;\n"]);return S=function(){return r},r}function T(){var r=v(["\n color: ",";\n font-size: 12px;\n font-style: italic;\n font-weight: normal;\n"]);return T=function(){return r},r}function P(){var r=v(["\n color: ",";\n"]);return P=function(){return r},r}function V(){var r=v(["\n position: absolute;\n display: flex;\n align-items: center;\n right: 12px;\n z-index: 1;\n"]);return V=function(){return r},r}function D(){var r=v(["\n width: 100%;\n height: 36px;\n border-radius: 4px;\n padding-left: 12px;\n font-size: 14px;\n font-weight: normal;\n font-family: Akzidenz, ‘Helvetica Neue’, Helvetica, Arial, sans-serif;\n border: 1px solid;\n transition: border-color 150ms ease-in-out;\n z-index: 1;\n outline: none;\n\n &::placeholder {\n color: ",";\n }\n\n &:disabled {\n cursor: not-allowed;\n }\n"]);return D=function(){return r},r}function H(){var r=v(["\n position: relative;\n display: flex;\n align-items: center;\n z-index: 0;\n"]);return H=function(){return r},r}function U(){var r=v(["\n display: flex;\n flex-direction: column;\n"]);return U=function(){return r},r}function W(){var r=v(["\n width: 100%;\n"]);return W=function(){return r},r}var q=s("icon-selector"),K={None:"none",Valid:"valid",Error:"error"},R={Email:"email",Password:"password",Search:"search",Text:"text",Url:"url",Tel:"tel"},$="light",G="dark",J=o(W()),L=o(U()),Q=o(H()),X=o(D(),c.gray.base),Y=o(V()),Z=o(P(),c.green.base),_=o(T(),c.gray.dark1),rr=o(S()),er=(g(k={},$,{inputColor:c.gray.dark3,inputBackgroundColor:c.white,disabledColor:c.gray.base,disabledBackgroundColor:c.gray.light2,errorIconColor:c.red.base,errorMessage:c.red.base,errorBorder:c.red.base,optional:c.gray.dark1,defaultBorder:c.gray.base,validBorder:c.green.base}),g(k,G,{inputColor:c.white,inputBackgroundColor:"#394F5A",disabledColor:c.gray.dark1,disabledBackgroundColor:"#263843",errorIconColor:"#EF8D6F",errorMessage:"#EF8D6F",errorBorder:"#5a3c3b",optional:c.gray.light1,defaultBorder:"#394F5A",validBorder:"#394F5A"}),k),nr=(g(E={},$,(g(C={},K.Error,c.red.light3),g(C,K.Valid,c.green.light3),C)),g(E,G,(g(w={},K.Error,c.red.dark2),g(w,K.Valid,c.gray.dark1),w)),E);function or(r){var e=r.state,n=r.optional,a=r.mode,i=r.disabled;switch(e){case K.Valid:return o(I(),i?"inherit":er[a].validBorder);case K.Error:return t(o(F(),i?"inherit":er[a].errorBorder),g({},o(z()),a===G));default:return o(A(),n?60:12,er[a].defaultBorder)}}var tr=r.forwardRef((function(n,c){var s=n.label,v=n.description,x=n.onChange,k=n.placeholder,C=n.errorMessage,w=n.optional,E=void 0!==w&&w,A=n.disabled,z=void 0!==A&&A,F=n.state,I=void 0===F?K.None:F,S=n.type,T=void 0===S?R.Text:S,P=n.id,V=n.value,D=n.className,H=n.darkMode,U=void 0!==H&&H,W=n["aria-labelledby"],tr=y(n,["label","description","onChange","placeholder","errorMessage","optional","disabled","state","type","id","value","className","darkMode","aria-labelledby"]),ar=U?G:$,ir=u().usingKeyboard,lr="string"==typeof V,dr=h(e(""),2),ur=dr[0],cr=dr[1],sr=lr?V:ur,fr=f({prefix:"textinput",id:P});"search"===T||s||W||console.error("For screen-reader accessibility, label or aria-labelledby must be provided to TextInput."),"search"!==T||tr["aria-label"]||console.error("For screen-reader accessibility, aria-label must be provided to TextInput.");var pr=U?i:a;return r.createElement("div",{className:t(L,D)},s&&r.createElement(p,{darkMode:U,htmlFor:fr,disabled:z},s),v&&r.createElement(b,{darkMode:U},v),r.createElement("div",{className:Q},r.createElement(d,{className:J,darkMode:U,disabled:z,color:I===K.Valid||I===K.Error?{hovered:nr[ar][I]}:void 0},r.createElement("input",m({},tr,{"aria-labelledby":W,type:T,className:t(X,o(M(),er[ar].inputColor,er[ar].inputBackgroundColor,er[ar].disabledColor,er[ar].disabledBackgroundColor,er[ar].defaultBorder,er[ar].disabledColor,er[ar].disabledBackgroundColor),or({state:I,optional:E,mode:ar,disabled:z}),g({},o(j(),er[ar].inputBackgroundColor),ir)),value:sr,required:!E,disabled:z,placeholder:k,onChange:function(r){x&&x(r),lr||cr(r.target.value)},ref:c,id:fr,autoComplete:z?"off":(null==tr?void 0:tr.autoComplete)||"on"}))),r.createElement("div",m({},q.prop,{className:Y}),I===K.Valid&&r.createElement(pr,{role:"presentation",className:Z}),I===K.Error&&r.createElement(l,{role:"presentation",className:o(N(),er[ar].errorIconColor)}),I===K.None&&E&&r.createElement("div",{className:t(_,o(B(),er[ar].optional))},r.createElement("p",null,"Optional")))),I===K.Error&&C&&r.createElement("div",{className:t(rr,o(O(),er[ar].errorMessage))},r.createElement("label",null,C)))}));tr.displayName="TextInput",tr.propTypes={id:n.string,label:n.string,description:n.string,optional:n.bool,disabled:n.bool,onChange:n.func,placeholder:n.string,errorMessage:n.string,state:n.oneOf(Object.values(K)),value:n.string,className:n.string};export default tr;export{K as State,R as TextInputType}; | ||
| import r,{useState as e}from"react";import n from"prop-types";import{css as o,cx as t}from"@leafygreen-ui/emotion";import a from"@leafygreen-ui/icon/dist/Checkmark";import i from"@leafygreen-ui/icon/dist/CheckmarkWithCircle";import l from"@leafygreen-ui/icon/dist/Warning";import d from"@leafygreen-ui/interaction-ring";import{uiColors as u}from"@leafygreen-ui/palette";import{createDataProp as c}from"@leafygreen-ui/lib";import{useIdAllocator as s}from"@leafygreen-ui/hooks";import{Label as f,Description as p}from"@leafygreen-ui/typography";import{jsx as b}from"@emotion/react";function g(r,e,n){return e in r?Object.defineProperty(r,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):r[e]=n,r}function m(){return(m=Object.assign||function(r){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(r[o]=n[o])}return r}).apply(this,arguments)}function y(r,e){if(null==r)return{};var n,o,t=function(r,e){if(null==r)return{};var n,o,t={},a=Object.keys(r);for(o=0;o<a.length;o++)n=a[o],e.indexOf(n)>=0||(t[n]=r[n]);return t}(r,e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(r);for(o=0;o<a.length;o++)n=a[o],e.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(r,n)&&(t[n]=r[n])}return t}function v(r,e){return e||(e=r.slice(0)),Object.freeze(Object.defineProperties(r,{raw:{value:Object.freeze(e)}}))}function h(r,e){return function(r){if(Array.isArray(r))return r}(r)||function(r,e){if("undefined"==typeof Symbol||!(Symbol.iterator in Object(r)))return;var n=[],o=!0,t=!1,a=void 0;try{for(var i,l=r[Symbol.iterator]();!(o=(i=l.next()).done)&&(n.push(i.value),!e||n.length!==e);o=!0);}catch(r){t=!0,a=r}finally{try{o||null==l.return||l.return()}finally{if(t)throw a}}return n}(r,e)||function(r,e){if(!r)return;if("string"==typeof r)return x(r,e);var n=Object.prototype.toString.call(r).slice(8,-1);"Object"===n&&r.constructor&&(n=r.constructor.name);if("Map"===n||"Set"===n)return Array.from(r);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return x(r,e)}(r,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function x(r,e){(null==e||e>r.length)&&(e=r.length);for(var n=0,o=new Array(e);n<e;n++)o[n]=r[n];return o}var k,C,w,O;function B(){var r=v(["\n color: ",";\n "]);return B=function(){return r},r}function N(){var r=v(["\n color: ",";\n "]);return N=function(){return r},r}function j(){var r=v(["\n color: ",";\n "]);return j=function(){return r},r}function E(){var r=v(["\n color: ",";\n background-color: ",";\n\n &:focus {\n border: 1px solid ",";\n }\n\n &:disabled {\n color: ",";\n background-color: ",";\n\n &:-webkit-autofill {\n &,\n &:hover,\n &:focus {\n appearance: none;\n border: 1px solid ",";\n -webkit-text-fill-color: ",";\n -webkit-box-shadow: 0 0 0px 1000px\n "," inset;\n }\n }\n }\n "]);return E=function(){return r},r}function M(){var r=v(["\n padding-right: ","px;\n border-color: ",";\n "]);return M=function(){return r},r}function A(){var r=v(["\n background-color: #5a3c3b;\n "]);return A=function(){return r},r}function z(){var r=v(["\n padding-right: 30px;\n border-color: ",";\n "]);return z=function(){return r},r}function F(){var r=v(["\n padding-right: 30px;\n border-color: ",";\n "]);return F=function(){return r},r}function I(){var r=v(["\n font-size: 14px;\n min-height: 20px;\n padding-top: 4px;\n font-weight: normal;\n"]);return I=function(){return r},r}function S(){var r=v(["\n color: ",";\n font-size: 12px;\n font-style: italic;\n font-weight: normal;\n"]);return S=function(){return r},r}function T(){var r=v(["\n color: ",";\n"]);return T=function(){return r},r}function P(){var r=v(["\n position: absolute;\n display: flex;\n align-items: center;\n right: 12px;\n z-index: 1;\n"]);return P=function(){return r},r}function V(){var r=v(["\n width: 100%;\n height: 36px;\n border-radius: 4px;\n padding-left: 12px;\n font-size: 14px;\n font-weight: normal;\n font-family: Akzidenz, ‘Helvetica Neue’, Helvetica, Arial, sans-serif;\n border: 1px solid;\n transition: border-color 150ms ease-in-out;\n z-index: 1;\n outline: none;\n\n &::placeholder {\n color: ",";\n }\n\n &:disabled {\n cursor: not-allowed;\n }\n"]);return V=function(){return r},r}function D(){var r=v(["\n position: relative;\n display: flex;\n align-items: center;\n z-index: 0;\n"]);return D=function(){return r},r}function H(){var r=v(["\n display: flex;\n flex-direction: column;\n"]);return H=function(){return r},r}function U(){var r=v(["\n width: 100%;\n"]);return U=function(){return r},r}var W=c("icon-selector"),q={None:"none",Valid:"valid",Error:"error"},K={Email:"email",Password:"password",Search:"search",Text:"text",Url:"url",Tel:"tel"},R="light",$="dark",G=o(U()),J=o(H()),L=o(D()),Q=o(V(),u.gray.base),X=o(P()),Y=o(T(),u.green.base),Z=o(S(),u.gray.dark1),_=o(I()),rr=(g(k={},R,{inputColor:u.gray.dark3,inputBackgroundColor:u.white,disabledColor:u.gray.base,disabledBackgroundColor:u.gray.light2,errorIconColor:u.red.base,errorMessage:u.red.base,errorBorder:u.red.base,optional:u.gray.dark1,defaultBorder:u.gray.base,validBorder:u.green.base}),g(k,$,{inputColor:u.white,inputBackgroundColor:"#394F5A",disabledColor:u.gray.dark1,disabledBackgroundColor:"#263843",errorIconColor:"#EF8D6F",errorMessage:"#EF8D6F",errorBorder:"#5a3c3b",optional:u.gray.light1,defaultBorder:"#394F5A",validBorder:"#394F5A"}),k),er=(g(O={},R,(g(C={},q.Error,u.red.light3),g(C,q.Valid,u.green.light3),C)),g(O,$,(g(w={},q.Error,u.red.dark2),g(w,q.Valid,u.gray.dark1),w)),O);function nr(r){var e=r.state,n=r.optional,a=r.mode,i=r.disabled;switch(e){case q.Valid:return o(F(),i?"inherit":rr[a].validBorder);case q.Error:return t(o(z(),i?"inherit":rr[a].errorBorder),g({},o(A()),a===$));default:return o(M(),n?60:12,rr[a].defaultBorder)}}var or=r.forwardRef((function(r,n){var u=r.label,c=r.description,g=r.onChange,v=r.placeholder,x=r.errorMessage,k=r.optional,C=void 0!==k&&k,w=r.disabled,O=void 0!==w&&w,M=r.state,A=void 0===M?q.None:M,z=r.type,F=void 0===z?K.Text:z,I=r.id,S=r.value,T=r.className,P=r.darkMode,V=void 0!==P&&P,D=r["aria-labelledby"],H=y(r,["label","description","onChange","placeholder","errorMessage","optional","disabled","state","type","id","value","className","darkMode","aria-labelledby"]),U=V?$:R,or="string"==typeof S,tr=h(e(""),2),ar=tr[0],ir=tr[1],lr=or?S:ar,dr=s({prefix:"textinput",id:I});"search"===F||u||D||console.error("For screen-reader accessibility, label or aria-labelledby must be provided to TextInput."),"search"!==F||H["aria-label"]||console.error("For screen-reader accessibility, aria-label must be provided to TextInput.");var ur=V?i:a;return b("div",{className:t(J,T)},u&&b(f,{darkMode:V,htmlFor:dr,disabled:O},u),c&&b(p,{darkMode:V},c),b("div",{className:L},b(d,{className:G,darkMode:V,disabled:O,ignoreKeyboardContext:!0,color:A===q.Valid||A===q.Error?{hovered:er[U][A]}:void 0},b("input",m({},H,{"aria-labelledby":D,type:F,className:t(Q,o(E(),rr[U].inputColor,rr[U].inputBackgroundColor,rr[U].inputBackgroundColor,rr[U].disabledColor,rr[U].disabledBackgroundColor,rr[U].defaultBorder,rr[U].disabledColor,rr[U].disabledBackgroundColor),nr({state:A,optional:C,mode:U,disabled:O})),value:lr,required:!C,disabled:O,placeholder:v,onChange:function(r){g&&g(r),or||ir(r.target.value)},ref:n,id:dr,autoComplete:O?"off":(null==H?void 0:H.autoComplete)||"on"}))),b("div",m({},W.prop,{className:X}),A===q.Valid&&b(ur,{role:"presentation",className:Y}),A===q.Error&&b(l,{role:"presentation",className:o(j(),rr[U].errorIconColor)}),A===q.None&&C&&b("div",{className:t(Z,o(N(),rr[U].optional))},b("p",null,"Optional")))),A===q.Error&&x&&b("div",{className:t(_,o(B(),rr[U].errorMessage))},b("label",null,x)))}));or.displayName="TextInput",or.propTypes={id:n.string,label:n.string,description:n.string,optional:n.bool,disabled:n.bool,onChange:n.func,placeholder:n.string,errorMessage:n.string,state:n.oneOf(Object.values(q)),value:n.string,className:n.string};export default or;export{q as State,K as TextInputType}; | ||
| //# sourceMappingURL=index.js.map |
@@ -1,2 +0,2 @@ | ||
| !function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("react"),require("prop-types"),require("@leafygreen-ui/emotion"),require("@leafygreen-ui/icon/dist/Checkmark"),require("@leafygreen-ui/icon/dist/CheckmarkWithCircle"),require("@leafygreen-ui/icon/dist/Warning"),require("@leafygreen-ui/interaction-ring"),require("@leafygreen-ui/leafygreen-provider"),require("@leafygreen-ui/palette"),require("@leafygreen-ui/lib"),require("@leafygreen-ui/hooks"),require("@leafygreen-ui/typography")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@leafygreen-ui/emotion","@leafygreen-ui/icon/dist/Checkmark","@leafygreen-ui/icon/dist/CheckmarkWithCircle","@leafygreen-ui/icon/dist/Warning","@leafygreen-ui/interaction-ring","@leafygreen-ui/leafygreen-provider","@leafygreen-ui/palette","@leafygreen-ui/lib","@leafygreen-ui/hooks","@leafygreen-ui/typography"],r):r((e="undefined"!=typeof globalThis?globalThis:e||self)["@leafygreen-ui/text-input"]={},e.React,e.PropTypes,e["@leafygreen-ui/emotion"],e.Checkmark,e.CheckmarkWithCircle,e.Warning,e["@leafygreen-ui/interaction-ring"],e["@leafygreen-ui/leafygreen-provider"],e["@leafygreen-ui/palette"],e["@leafygreen-ui/lib"],e["@leafygreen-ui/hooks"],e["@leafygreen-ui/typography"])}(this,(function(e,r,n,t,o,a,i,l,u,d,s,c,f){"use strict";function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var g,y,b,h,v=p(r),m=p(n),C=p(o),x=p(a),k=p(i),w=p(l);function E(e,r,n){return r in e?Object.defineProperty(e,r,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[r]=n,e}function O(){return(O=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var n=arguments[r];for(var t in n)Object.prototype.hasOwnProperty.call(n,t)&&(e[t]=n[t])}return e}).apply(this,arguments)}function j(e,r){if(null==e)return{};var n,t,o=function(e,r){if(null==e)return{};var n,t,o={},a=Object.keys(e);for(t=0;t<a.length;t++)n=a[t],r.indexOf(n)>=0||(o[n]=e[n]);return o}(e,r);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(t=0;t<a.length;t++)n=a[t],r.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function B(e,r){return r||(r=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(r)}}))}function N(e,r){return function(e){if(Array.isArray(e))return e}(e)||function(e,r){if("undefined"==typeof Symbol||!(Symbol.iterator in Object(e)))return;var n=[],t=!0,o=!1,a=void 0;try{for(var i,l=e[Symbol.iterator]();!(t=(i=l.next()).done)&&(n.push(i.value),!r||n.length!==r);t=!0);}catch(e){o=!0,a=e}finally{try{t||null==l.return||l.return()}finally{if(o)throw a}}return n}(e,r)||function(e,r){if(!e)return;if("string"==typeof e)return q(e,r);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(e);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return q(e,r)}(e,r)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function q(e,r){(null==r||r>e.length)&&(r=e.length);for(var n=0,t=new Array(r);n<r;n++)t[n]=e[n];return t}function M(){var e=B(["\n color: ",";\n "]);return M=function(){return e},e}function T(){var e=B(["\n color: ",";\n "]);return T=function(){return e},e}function A(){var e=B(["\n color: ",";\n "]);return A=function(){return e},e}function I(){var e=B(["\n &:focus {\n border: 1px solid ",";\n }\n "]);return I=function(){return e},e}function S(){var e=B(["\n color: ",";\n background-color: ",";\n\n &:disabled {\n color: ",";\n background-color: ",";\n\n &:-webkit-autofill {\n &,\n &:hover,\n &:focus {\n appearance: none;\n border: 1px solid ",";\n -webkit-text-fill-color: ",";\n -webkit-box-shadow: 0 0 0px 1000px\n "," inset;\n }\n }\n }\n "]);return S=function(){return e},e}function z(){var e=B(["\n padding-right: ","px;\n border-color: ",";\n "]);return z=function(){return e},e}function F(){var e=B(["\n background-color: #5a3c3b;\n "]);return F=function(){return e},e}function P(){var e=B(["\n padding-right: 30px;\n border-color: ",";\n "]);return P=function(){return e},e}function V(){var e=B(["\n padding-right: 30px;\n border-color: ",";\n "]);return V=function(){return e},e}function W(){var e=B(["\n font-size: 14px;\n min-height: 20px;\n padding-top: 4px;\n font-weight: normal;\n"]);return W=function(){return e},e}function D(){var e=B(["\n color: ",";\n font-size: 12px;\n font-style: italic;\n font-weight: normal;\n"]);return D=function(){return e},e}function U(){var e=B(["\n color: ",";\n"]);return U=function(){return e},e}function H(){var e=B(["\n position: absolute;\n display: flex;\n align-items: center;\n right: 12px;\n z-index: 1;\n"]);return H=function(){return e},e}function K(){var e=B(["\n width: 100%;\n height: 36px;\n border-radius: 4px;\n padding-left: 12px;\n font-size: 14px;\n font-weight: normal;\n font-family: Akzidenz, ‘Helvetica Neue’, Helvetica, Arial, sans-serif;\n border: 1px solid;\n transition: border-color 150ms ease-in-out;\n z-index: 1;\n outline: none;\n\n &::placeholder {\n color: ",";\n }\n\n &:disabled {\n cursor: not-allowed;\n }\n"]);return K=function(){return e},e}function R(){var e=B(["\n position: relative;\n display: flex;\n align-items: center;\n z-index: 0;\n"]);return R=function(){return e},e}function _(){var e=B(["\n display: flex;\n flex-direction: column;\n"]);return _=function(){return e},e}function L(){var e=B(["\n width: 100%;\n"]);return L=function(){return e},e}var $=s.createDataProp("icon-selector"),G={None:"none",Valid:"valid",Error:"error"},J={Email:"email",Password:"password",Search:"search",Text:"text",Url:"url",Tel:"tel"},Q="light",X="dark",Y=t.css(L()),Z=t.css(_()),ee=t.css(R()),re=t.css(K(),d.uiColors.gray.base),ne=t.css(H()),te=t.css(U(),d.uiColors.green.base),oe=t.css(D(),d.uiColors.gray.dark1),ae=t.css(W()),ie=(E(g={},Q,{inputColor:d.uiColors.gray.dark3,inputBackgroundColor:d.uiColors.white,disabledColor:d.uiColors.gray.base,disabledBackgroundColor:d.uiColors.gray.light2,errorIconColor:d.uiColors.red.base,errorMessage:d.uiColors.red.base,errorBorder:d.uiColors.red.base,optional:d.uiColors.gray.dark1,defaultBorder:d.uiColors.gray.base,validBorder:d.uiColors.green.base}),E(g,X,{inputColor:d.uiColors.white,inputBackgroundColor:"#394F5A",disabledColor:d.uiColors.gray.dark1,disabledBackgroundColor:"#263843",errorIconColor:"#EF8D6F",errorMessage:"#EF8D6F",errorBorder:"#5a3c3b",optional:d.uiColors.gray.light1,defaultBorder:"#394F5A",validBorder:"#394F5A"}),g),le=(E(h={},Q,(E(y={},G.Error,d.uiColors.red.light3),E(y,G.Valid,d.uiColors.green.light3),y)),E(h,X,(E(b={},G.Error,d.uiColors.red.dark2),E(b,G.Valid,d.uiColors.gray.dark1),b)),h);function ue(e){var r=e.state,n=e.optional,o=e.mode,a=e.disabled;switch(r){case G.Valid:return t.css(V(),a?"inherit":ie[o].validBorder);case G.Error:return t.cx(t.css(P(),a?"inherit":ie[o].errorBorder),E({},t.css(F()),o===X));default:return t.css(z(),n?60:12,ie[o].defaultBorder)}}var de=v.default.forwardRef((function(e,n){var o=e.label,a=e.description,i=e.onChange,l=e.placeholder,d=e.errorMessage,s=e.optional,p=void 0!==s&&s,g=e.disabled,y=void 0!==g&&g,b=e.state,h=void 0===b?G.None:b,m=e.type,B=void 0===m?J.Text:m,q=e.id,z=e.value,F=e.className,P=e.darkMode,V=void 0!==P&&P,W=e["aria-labelledby"],D=j(e,["label","description","onChange","placeholder","errorMessage","optional","disabled","state","type","id","value","className","darkMode","aria-labelledby"]),U=V?X:Q,H=u.useUsingKeyboardContext().usingKeyboard,K="string"==typeof z,R=N(r.useState(""),2),_=R[0],L=R[1],de=K?z:_,se=c.useIdAllocator({prefix:"textinput",id:q});"search"===B||o||W||console.error("For screen-reader accessibility, label or aria-labelledby must be provided to TextInput."),"search"!==B||D["aria-label"]||console.error("For screen-reader accessibility, aria-label must be provided to TextInput.");var ce=V?x.default:C.default;return v.default.createElement("div",{className:t.cx(Z,F)},o&&v.default.createElement(f.Label,{darkMode:V,htmlFor:se,disabled:y},o),a&&v.default.createElement(f.Description,{darkMode:V},a),v.default.createElement("div",{className:ee},v.default.createElement(w.default,{className:Y,darkMode:V,disabled:y,color:h===G.Valid||h===G.Error?{hovered:le[U][h]}:void 0},v.default.createElement("input",O({},D,{"aria-labelledby":W,type:B,className:t.cx(re,t.css(S(),ie[U].inputColor,ie[U].inputBackgroundColor,ie[U].disabledColor,ie[U].disabledBackgroundColor,ie[U].defaultBorder,ie[U].disabledColor,ie[U].disabledBackgroundColor),ue({state:h,optional:p,mode:U,disabled:y}),E({},t.css(I(),ie[U].inputBackgroundColor),H)),value:de,required:!p,disabled:y,placeholder:l,onChange:function(e){i&&i(e),K||L(e.target.value)},ref:n,id:se,autoComplete:y?"off":(null==D?void 0:D.autoComplete)||"on"}))),v.default.createElement("div",O({},$.prop,{className:ne}),h===G.Valid&&v.default.createElement(ce,{role:"presentation",className:te}),h===G.Error&&v.default.createElement(k.default,{role:"presentation",className:t.css(A(),ie[U].errorIconColor)}),h===G.None&&p&&v.default.createElement("div",{className:t.cx(oe,t.css(T(),ie[U].optional))},v.default.createElement("p",null,"Optional")))),h===G.Error&&d&&v.default.createElement("div",{className:t.cx(ae,t.css(M(),ie[U].errorMessage))},v.default.createElement("label",null,d)))}));de.displayName="TextInput",de.propTypes={id:m.default.string,label:m.default.string,description:m.default.string,optional:m.default.bool,disabled:m.default.bool,onChange:m.default.func,placeholder:m.default.string,errorMessage:m.default.string,state:m.default.oneOf(Object.values(G)),value:m.default.string,className:m.default.string},e.State=G,e.TextInputType=J,e.default=de,Object.defineProperty(e,"__esModule",{value:!0})})); | ||
| !function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("react"),require("prop-types"),require("@leafygreen-ui/emotion"),require("@leafygreen-ui/icon/dist/Checkmark"),require("@leafygreen-ui/icon/dist/CheckmarkWithCircle"),require("@leafygreen-ui/icon/dist/Warning"),require("@leafygreen-ui/interaction-ring"),require("@leafygreen-ui/palette"),require("@leafygreen-ui/lib"),require("@leafygreen-ui/hooks"),require("@leafygreen-ui/typography"),require("@emotion/react")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@leafygreen-ui/emotion","@leafygreen-ui/icon/dist/Checkmark","@leafygreen-ui/icon/dist/CheckmarkWithCircle","@leafygreen-ui/icon/dist/Warning","@leafygreen-ui/interaction-ring","@leafygreen-ui/palette","@leafygreen-ui/lib","@leafygreen-ui/hooks","@leafygreen-ui/typography","@emotion/react"],r):r((e="undefined"!=typeof globalThis?globalThis:e||self)["@leafygreen-ui/text-input"]={},e.React,e.PropTypes,e["@leafygreen-ui/emotion"],e.Checkmark,e.CheckmarkWithCircle,e.Warning,e["@leafygreen-ui/interaction-ring"],e["@leafygreen-ui/palette"],e["@leafygreen-ui/lib"],e["@leafygreen-ui/hooks"],e["@leafygreen-ui/typography"],e.react)}(this,(function(e,r,n,o,t,i,a,l,u,s,d,c,f){"use strict";function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var g,b,y,h,v=p(r),x=p(n),m=p(t),C=p(i),k=p(a),j=p(l);function w(e,r,n){return r in e?Object.defineProperty(e,r,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[r]=n,e}function O(){return(O=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var n=arguments[r];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e}).apply(this,arguments)}function B(e,r){if(null==e)return{};var n,o,t=function(e,r){if(null==e)return{};var n,o,t={},i=Object.keys(e);for(o=0;o<i.length;o++)n=i[o],r.indexOf(n)>=0||(t[n]=e[n]);return t}(e,r);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(o=0;o<i.length;o++)n=i[o],r.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(t[n]=e[n])}return t}function N(e,r){return r||(r=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(r)}}))}function q(e,r){return function(e){if(Array.isArray(e))return e}(e)||function(e,r){if("undefined"==typeof Symbol||!(Symbol.iterator in Object(e)))return;var n=[],o=!0,t=!1,i=void 0;try{for(var a,l=e[Symbol.iterator]();!(o=(a=l.next()).done)&&(n.push(a.value),!r||n.length!==r);o=!0);}catch(e){t=!0,i=e}finally{try{o||null==l.return||l.return()}finally{if(t)throw i}}return n}(e,r)||function(e,r){if(!e)return;if("string"==typeof e)return M(e,r);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(e);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return M(e,r)}(e,r)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function M(e,r){(null==r||r>e.length)&&(r=e.length);for(var n=0,o=new Array(r);n<r;n++)o[n]=e[n];return o}function T(){var e=N(["\n color: ",";\n "]);return T=function(){return e},e}function A(){var e=N(["\n color: ",";\n "]);return A=function(){return e},e}function E(){var e=N(["\n color: ",";\n "]);return E=function(){return e},e}function I(){var e=N(["\n color: ",";\n background-color: ",";\n\n &:focus {\n border: 1px solid ",";\n }\n\n &:disabled {\n color: ",";\n background-color: ",";\n\n &:-webkit-autofill {\n &,\n &:hover,\n &:focus {\n appearance: none;\n border: 1px solid ",";\n -webkit-text-fill-color: ",";\n -webkit-box-shadow: 0 0 0px 1000px\n "," inset;\n }\n }\n }\n "]);return I=function(){return e},e}function S(){var e=N(["\n padding-right: ","px;\n border-color: ",";\n "]);return S=function(){return e},e}function z(){var e=N(["\n background-color: #5a3c3b;\n "]);return z=function(){return e},e}function F(){var e=N(["\n padding-right: 30px;\n border-color: ",";\n "]);return F=function(){return e},e}function P(){var e=N(["\n padding-right: 30px;\n border-color: ",";\n "]);return P=function(){return e},e}function V(){var e=N(["\n font-size: 14px;\n min-height: 20px;\n padding-top: 4px;\n font-weight: normal;\n"]);return V=function(){return e},e}function W(){var e=N(["\n color: ",";\n font-size: 12px;\n font-style: italic;\n font-weight: normal;\n"]);return W=function(){return e},e}function D(){var e=N(["\n color: ",";\n"]);return D=function(){return e},e}function H(){var e=N(["\n position: absolute;\n display: flex;\n align-items: center;\n right: 12px;\n z-index: 1;\n"]);return H=function(){return e},e}function R(){var e=N(["\n width: 100%;\n height: 36px;\n border-radius: 4px;\n padding-left: 12px;\n font-size: 14px;\n font-weight: normal;\n font-family: Akzidenz, ‘Helvetica Neue’, Helvetica, Arial, sans-serif;\n border: 1px solid;\n transition: border-color 150ms ease-in-out;\n z-index: 1;\n outline: none;\n\n &::placeholder {\n color: ",";\n }\n\n &:disabled {\n cursor: not-allowed;\n }\n"]);return R=function(){return e},e}function U(){var e=N(["\n position: relative;\n display: flex;\n align-items: center;\n z-index: 0;\n"]);return U=function(){return e},e}function _(){var e=N(["\n display: flex;\n flex-direction: column;\n"]);return _=function(){return e},e}function K(){var e=N(["\n width: 100%;\n"]);return K=function(){return e},e}var L=s.createDataProp("icon-selector"),$={None:"none",Valid:"valid",Error:"error"},G={Email:"email",Password:"password",Search:"search",Text:"text",Url:"url",Tel:"tel"},J="light",Q="dark",X=o.css(K()),Y=o.css(_()),Z=o.css(U()),ee=o.css(R(),u.uiColors.gray.base),re=o.css(H()),ne=o.css(D(),u.uiColors.green.base),oe=o.css(W(),u.uiColors.gray.dark1),te=o.css(V()),ie=(w(g={},J,{inputColor:u.uiColors.gray.dark3,inputBackgroundColor:u.uiColors.white,disabledColor:u.uiColors.gray.base,disabledBackgroundColor:u.uiColors.gray.light2,errorIconColor:u.uiColors.red.base,errorMessage:u.uiColors.red.base,errorBorder:u.uiColors.red.base,optional:u.uiColors.gray.dark1,defaultBorder:u.uiColors.gray.base,validBorder:u.uiColors.green.base}),w(g,Q,{inputColor:u.uiColors.white,inputBackgroundColor:"#394F5A",disabledColor:u.uiColors.gray.dark1,disabledBackgroundColor:"#263843",errorIconColor:"#EF8D6F",errorMessage:"#EF8D6F",errorBorder:"#5a3c3b",optional:u.uiColors.gray.light1,defaultBorder:"#394F5A",validBorder:"#394F5A"}),g),ae=(w(h={},J,(w(b={},$.Error,u.uiColors.red.light3),w(b,$.Valid,u.uiColors.green.light3),b)),w(h,Q,(w(y={},$.Error,u.uiColors.red.dark2),w(y,$.Valid,u.uiColors.gray.dark1),y)),h);function le(e){var r=e.state,n=e.optional,t=e.mode,i=e.disabled;switch(r){case $.Valid:return o.css(P(),i?"inherit":ie[t].validBorder);case $.Error:return o.cx(o.css(F(),i?"inherit":ie[t].errorBorder),w({},o.css(z()),t===Q));default:return o.css(S(),n?60:12,ie[t].defaultBorder)}}var ue=v.default.forwardRef((function(e,n){var t=e.label,i=e.description,a=e.onChange,l=e.placeholder,u=e.errorMessage,s=e.optional,p=void 0!==s&&s,g=e.disabled,b=void 0!==g&&g,y=e.state,h=void 0===y?$.None:y,v=e.type,x=void 0===v?G.Text:v,w=e.id,N=e.value,M=e.className,S=e.darkMode,z=void 0!==S&&S,F=e["aria-labelledby"],P=B(e,["label","description","onChange","placeholder","errorMessage","optional","disabled","state","type","id","value","className","darkMode","aria-labelledby"]),V=z?Q:J,W="string"==typeof N,D=q(r.useState(""),2),H=D[0],R=D[1],U=W?N:H,_=d.useIdAllocator({prefix:"textinput",id:w});"search"===x||t||F||console.error("For screen-reader accessibility, label or aria-labelledby must be provided to TextInput."),"search"!==x||P["aria-label"]||console.error("For screen-reader accessibility, aria-label must be provided to TextInput.");var K=z?C.default:m.default;return f.jsx("div",{className:o.cx(Y,M)},t&&f.jsx(c.Label,{darkMode:z,htmlFor:_,disabled:b},t),i&&f.jsx(c.Description,{darkMode:z},i),f.jsx("div",{className:Z},f.jsx(j.default,{className:X,darkMode:z,disabled:b,ignoreKeyboardContext:!0,color:h===$.Valid||h===$.Error?{hovered:ae[V][h]}:void 0},f.jsx("input",O({},P,{"aria-labelledby":F,type:x,className:o.cx(ee,o.css(I(),ie[V].inputColor,ie[V].inputBackgroundColor,ie[V].inputBackgroundColor,ie[V].disabledColor,ie[V].disabledBackgroundColor,ie[V].defaultBorder,ie[V].disabledColor,ie[V].disabledBackgroundColor),le({state:h,optional:p,mode:V,disabled:b})),value:U,required:!p,disabled:b,placeholder:l,onChange:function(e){a&&a(e),W||R(e.target.value)},ref:n,id:_,autoComplete:b?"off":(null==P?void 0:P.autoComplete)||"on"}))),f.jsx("div",O({},L.prop,{className:re}),h===$.Valid&&f.jsx(K,{role:"presentation",className:ne}),h===$.Error&&f.jsx(k.default,{role:"presentation",className:o.css(E(),ie[V].errorIconColor)}),h===$.None&&p&&f.jsx("div",{className:o.cx(oe,o.css(A(),ie[V].optional))},f.jsx("p",null,"Optional")))),h===$.Error&&u&&f.jsx("div",{className:o.cx(te,o.css(T(),ie[V].errorMessage))},f.jsx("label",null,u)))}));ue.displayName="TextInput",ue.propTypes={id:x.default.string,label:x.default.string,description:x.default.string,optional:x.default.bool,disabled:x.default.bool,onChange:x.default.func,placeholder:x.default.string,errorMessage:x.default.string,state:x.default.oneOf(Object.values($)),value:x.default.string,className:x.default.string},e.State=$,e.TextInputType=G,e.default=ue,Object.defineProperty(e,"__esModule",{value:!0})})); | ||
| //# sourceMappingURL=index.js.map |
| { | ||
| "name": "@leafygreen-ui/text-input", | ||
| "version": "6.0.3", | ||
| "version": "6.0.4", | ||
| "description": "leafyGreen UI Kit Text Input", | ||
@@ -24,11 +24,11 @@ "main": "./dist/index.js", | ||
| "@leafygreen-ui/hooks": "^7.0.0", | ||
| "@leafygreen-ui/icon": "^11.1.1", | ||
| "@leafygreen-ui/interaction-ring": "^1.0.4", | ||
| "@leafygreen-ui/lib": "^8.0.0", | ||
| "@leafygreen-ui/palette": "^3.2.1", | ||
| "@leafygreen-ui/typography": "^8.0.2" | ||
| "@leafygreen-ui/icon": "^11.3.0", | ||
| "@leafygreen-ui/interaction-ring": "^1.1.0", | ||
| "@leafygreen-ui/lib": "^9.0.0", | ||
| "@leafygreen-ui/palette": "^3.2.2", | ||
| "@leafygreen-ui/typography": "^8.0.4" | ||
| }, | ||
| "peerDependencies": { | ||
| "@leafygreen-ui/leafygreen-provider": "^2.1.2" | ||
| "@leafygreen-ui/leafygreen-provider": "^2.1.3" | ||
| } | ||
| } |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
No alert changes
Improved metrics
- Lines of code
- increased by0.59%
850
Worsened metrics
- Total package byte prevSize
- decreased by-2.12%
270861
Dependency changes
- Removed@emotion/cache@10.0.29(transitive)
- Removed@emotion/hash@0.8.0(transitive)
- Removed@emotion/memoize@0.7.4(transitive)
- Removed@emotion/serialize@0.11.16(transitive)
- Removed@emotion/sheet@0.9.4(transitive)
- Removed@emotion/stylis@0.8.5(transitive)
- Removed@emotion/unitless@0.7.5(transitive)
- Removed@emotion/utils@0.11.3(transitive)
- Removed@emotion/weak-memoize@0.2.5(transitive)
- Removed@leafygreen-ui/emotion@3.0.1(transitive)
- Removed@leafygreen-ui/lib@8.0.0(transitive)
- Removedbabel-plugin-emotion@10.2.2(transitive)
- Removedbabel-plugin-macros@2.8.0(transitive)
- Removedbabel-plugin-syntax-jsx@6.18.0(transitive)
- Removedcosmiconfig@6.0.0(transitive)
- Removedcreate-emotion@10.0.27(transitive)
- Removedcreate-emotion-server@10.0.27(transitive)
- Removedcsstype@2.6.21(transitive)
- Removedemotion@10.0.27(transitive)
- Removedescape-string-regexp@1.0.5(transitive)
- Removedfacepaint@1.2.1(transitive)
- Removedpolished@2.3.3(transitive)
- Removedprop-types@15.8.1(transitive)
- Removedreact@16.14.0(transitive)
- Removedreact-is@16.13.1(transitive)
Updated@leafygreen-ui/icon@^11.3.0
Updated@leafygreen-ui/lib@^9.0.0