npm - fictoan-react - Versions diffs - 0.41.6 → 0.41.7 - Mend

fictoan-react 0.41.6 → 0.41.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -1,3 +1,6 @@
+### 0.41.7
+- Add different letter spacing values for empty and filled `input[type=password]`
 ### 0.41.6
 - Fix `InputField` text colour dark theme bug

package/dist/cjs/components/Form/InputField/InputField.styled.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";function i(i){return i&&"object"==typeof i&&"default"in i?i:{default:i}}Object.defineProperty(exports,"__esModule",{value:!0});const t=/*#__PURE__*/i(require("styled-components")).default.input.withConfig({displayName:"InputFieldStyled",componentId:"-18egqfl"})`position:relative;width:100%;flex:1 1 auto;font-family:${i=>i.theme.text.font.sans};color:${i=>i.theme.inputField.default.text};background-color:${i=>i.theme.inputField.default.bg};border:1px solid ${i=>i.theme.inputField.default.border};border-radius:${i=>i.theme.inputField.default.borderRadius};padding:12px;line-height:1;&:active,&:focus{background-color:${i=>i.theme.inputField.onFocus.bg};border:2px solid ${i=>i.theme.inputField.onFocus.border};color:${i=>i.theme.inputField.onFocus.text};padding:11px;}&[type=password]{letter-spacing:4px;}&.with-icon-left{padding-left:40px;}&.with-icon-right{padding-right:40px;}span.icon-left,span.icon-right{position:absolute;bottom:12px;width:24px;height:24px;}span.icon-left svg,span.icon-right svg{fill:${i=>i.theme.inputField.icons.default.fill};transition:all 0.2s;width:24px;height:24px;}span.icon-left{left:8px;}span.icon-right{right:8px;opacity:0.24;}&.with-icon-left:focus ~ span.icon-left svg{fill:${i=>i.theme.inputField.icons.onFocus.fill};}&.validate-this{padding-right:40px;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8cG9seWxpbmUgcG9pbnRzPSIzLjUgMTIuNSA4LjUgMTcuNSAyMC41IDUuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZTJlMmUyIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);background-repeat:no-repeat;background-position:right 12px top 56%;background-size:24px;&:focus{background-position:right 11px top 56%;}}&.validate-this ~ span.icon-right{display:none;}&.validate-this:valid:not(:placeholder-shown){background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8cG9seWxpbmUgcG9pbnRzPSIzLjUgMTIuNSA4LjUgMTcuNSAyMC41IDUuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMGVjMDVjIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);}&:invalid:not(:focus):not(:placeholder-shown){border:1px solid ${i=>i.theme.inputField.icons.isValid.border};background-color:${i=>i.theme.inputField.isInvalid.bg};background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8bGluZSB4MT0iNi41IiB5MT0iMTcuNSIgeDI9IjE4LjUiIHkyPSI1LjUiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2VmNDM0MyIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiLz4gIDxsaW5lIHgxPSI2LjUiIHkxPSI1LjUiIHgyPSIxOC41IiB5Mj0iMTcuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZWY0MzQzIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);background-repeat:no-repeat;background-position:98%;background-size:24px;}`;exports.InputFieldStyled=t;
+"use strict";function i(i){return i&&"object"==typeof i&&"default"in i?i:{default:i}}Object.defineProperty(exports,"__esModule",{value:!0});const e=/*#__PURE__*/i(require("styled-components")).default.input.withConfig({displayName:"InputFieldStyled",componentId:"-18egqfl"})`position:relative;width:100%;flex:1 1 auto;font-family:${i=>i.theme.text.font.sans};color:${i=>i.theme.inputField.default.text};background-color:${i=>i.theme.inputField.default.bg};border:1px solid ${i=>i.theme.inputField.default.border};border-radius:${i=>i.theme.inputField.default.borderRadius};padding:12px;line-height:1;&:active,&:focus{background-color:${i=>i.theme.inputField.onFocus.bg};border:2px solid ${i=>i.theme.inputField.onFocus.border};color:${i=>i.theme.inputField.onFocus.text};padding:11px;}&[type=password]{letter-spacing:4px;}&[type=password]:placeholder-shown{letter-spacing:unset;}&.with-icon-left{padding-left:40px;}&.with-icon-right{padding-right:40px;}span.icon-left,span.icon-right{position:absolute;bottom:12px;width:24px;height:24px;}span.icon-left svg,span.icon-right svg{fill:${i=>i.theme.inputField.icons.default.fill};transition:all 0.2s;width:24px;height:24px;}span.icon-left{left:8px;}span.icon-right{right:8px;opacity:0.24;}&.with-icon-left:focus ~ span.icon-left svg{fill:${i=>i.theme.inputField.icons.onFocus.fill};}&.validate-this{padding-right:40px;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8cG9seWxpbmUgcG9pbnRzPSIzLjUgMTIuNSA4LjUgMTcuNSAyMC41IDUuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZTJlMmUyIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);background-repeat:no-repeat;background-position:right 12px top 56%;background-size:24px;&:focus{background-position:right 11px top 56%;}}&.validate-this ~ span.icon-right{display:none;}&.validate-this:valid:not(:placeholder-shown){background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8cG9seWxpbmUgcG9pbnRzPSIzLjUgMTIuNSA4LjUgMTcuNSAyMC41IDUuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMGVjMDVjIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);}&:invalid:not(:focus):not(:placeholder-shown){border:1px solid ${i=>i.theme.inputField.icons.isValid.border};background-color:${i=>i.theme.inputField.isInvalid.bg};background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8bGluZSB4MT0iNi41IiB5MT0iMTcuNSIgeDI9IjE4LjUiIHkyPSI1LjUiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2VmNDM0MyIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiLz4gIDxsaW5lIHgxPSI2LjUiIHkxPSI1LjUiIHgyPSIxOC41IiB5Mj0iMTcuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZWY0MzQzIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);background-repeat:no-repeat;background-position:98%;background-size:24px;}`;exports.InputFieldStyled=e;
 //# sourceMappingURL=InputField.styled.js.map

package/dist/cjs/components/Form/InputField/InputField.styled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InputField.styled.js","sources":["../../../../../src/components/Form/InputField/InputField.styled.tsx"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { InputFieldProps } from \"./InputField\";\n\n\nexport const InputFieldStyled = styled.input`\n position : relative;\n width : 100%;\n flex : 1 1 auto;\n font-family : ${(props: InputFieldProps) => props.theme.text.font.sans};\n color : ${(props: InputFieldProps) => props.theme.inputField.default.text};\n background-color : ${(props: InputFieldProps) => props.theme.inputField.default.bg};\n border : 1px solid ${(props: InputFieldProps) => props.theme.inputField.default.border};\n border-radius : ${(props : InputFieldProps) => props.theme.inputField.default.borderRadius};\n padding : 12px;\n line-height : 1;\n\n &:active,\n &:focus {\n background-color : ${(props: InputFieldProps) => props.theme.inputField.onFocus.bg};\n border : 2px solid ${(props : InputFieldProps) => props.theme.inputField.onFocus.border};\n color : ${(props: InputFieldProps) => props.theme.inputField.onFocus.text};\n padding : 11px;\n }\n\n &[type=password] { letter-spacing : 4px; }\n\n /* LEFT AND RIGHT ICONS ============================================ /\n &.with-icon-left { padding-left : 40px; }\n &.with-icon-right { padding-right : 40px; }\n\n span.icon-left,\n span.icon-right {\n position : absolute;\n bottom : 12px;\n width : 24px;\n height : 24px;\n }\n\n span.icon-left svg,\n span.icon-right svg {\n fill : ${(props: InputFieldProps) => props.theme.inputField.icons.default.fill};\n transition : all 0.2s;\n width : 24px;\n height : 24px;\n }\n\n span.icon-left { left : 8px; }\n\n span.icon-right {\n right : 8px;\n opacity : 0.24;\n }\n\n &.with-icon-left:focus ~ span.icon-left svg {\n fill : ${(props: InputFieldProps) => props.theme.inputField.icons.onFocus.fill};\n }\n\n / Grey check mark /\n &.validate-this {\n padding-right : 40px;\n background-image : url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8cG9seWxpbmUgcG9pbnRzPSIzLjUgMTIuNSA4LjUgMTcuNSAyMC41IDUuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZTJlMmUyIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);\n background-repeat : no-repeat;\n background-position : right 12px top 56%;\n background-size : 24px;\n\n &:focus {\n background-position : right 11px top 56%;\n }\n }\n\n &.validate-this ~ span.icon-right { display : none; }\n\n / Green check mark /\n &.validate-this:valid:not(:placeholder-shown) {\n background-image : url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8cG9seWxpbmUgcG9pbnRzPSIzLjUgMTIuNSA4LjUgMTcuNSAyMC41IDUuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMGVjMDVjIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);\n }\n\n / Red cross */\n &:invalid:not(:focus):not(:placeholder-shown) {\n border : 1px solid ${(props: InputFieldProps) => props.theme.inputField.icons.isValid.border};\n background-color : ${(props: InputFieldProps) => props.theme.inputField.isInvalid.bg};\n background-image : url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8bGluZSB4MT0iNi41IiB5MT0iMTcuNSIgeDI9IjE4LjUiIHkyPSI1LjUiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2VmNDM0MyIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiLz4gIDxsaW5lIHgxPSI2LjUiIHkxPSI1LjUiIHgyPSIxOC41IiB5Mj0iMTcuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZWY0MzQzIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);\n background-repeat : no-repeat;\n background-position : 98%;\n background-size : 24px;\n }\n`;\n"],"names":["InputFieldStyled","input","props","theme","text","font","sans","inputField","default","bg","border","borderRadius","onFocus","icons","fill","isValid","isInvalid"],"mappings":"kJAKaA,uDAA0BC,mIAIbC,GAA2BA,EAAMC,MAAMC,KAAKC,KAAKC,cACjDJ,GAA2BA,EAAMC,MAAMI,WAAWC,QAAQJ,yBAC1DF,GAA2BA,EAAMC,MAAMI,WAAWC,QAAQC,uBAChDP,GAA2BA,EAAMC,MAAMI,WAAWC,QAAQE,wBACpER,GAA4BA,EAAMC,MAAMI,WAAWC,QAAQG,6EAMvDT,GAA2BA,EAAMC,MAAMI,WAAWK,QAAQH,uBAChDP,GAA4BA,EAAMC,MAAMI,WAAWK,QAAQF,gBACrER,GAA2BA,EAAMC,MAAMI,WAAWK,QAAQR,~~sQAoBhEF,~~GAA2BA,EAAMC,MAAMI,WAAWM,MAAML,QAAQM,sKActEZ,GAA2BA,EAAMC,MAAMI,WAAWM,MAAMD,QAAQE,q6BAyBvCZ,GAA2BA,EAAMC,MAAMI,WAAWM,MAAME,QAAQL,2BAC1ER,GAA2BA,EAAMC,MAAMI,WAAWS,UAAUP"}
1	+ {"version":3,"file":"InputField.styled.js","sources":["../../../../../src/components/Form/InputField/InputField.styled.tsx"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { InputFieldProps } from \"./InputField\";\n\n\nexport const InputFieldStyled = styled.input`\n position : relative;\n width : 100%;\n flex : 1 1 auto;\n font-family : ${(props: InputFieldProps) => props.theme.text.font.sans};\n color : ${(props: InputFieldProps) => props.theme.inputField.default.text};\n background-color : ${(props: InputFieldProps) => props.theme.inputField.default.bg};\n border : 1px solid ${(props: InputFieldProps) => props.theme.inputField.default.border};\n border-radius : ${(props : InputFieldProps) => props.theme.inputField.default.borderRadius};\n padding : 12px;\n line-height : 1;\n\n &:active,\n &:focus {\n background-color : ${(props: InputFieldProps) => props.theme.inputField.onFocus.bg};\n border : 2px solid ${(props : InputFieldProps) => props.theme.inputField.onFocus.border};\n color : ${(props: InputFieldProps) => props.theme.inputField.onFocus.text};\n padding : 11px;\n }\n\n &[type=password] { letter-spacing : 4px; }\n\n &[type=password]:placeholder-shown { letter-spacing : unset; }\n\n /* LEFT AND RIGHT ICONS ============================================ /\n &.with-icon-left { padding-left : 40px; }\n &.with-icon-right { padding-right : 40px; }\n\n span.icon-left,\n span.icon-right {\n position : absolute;\n bottom : 12px;\n width : 24px;\n height : 24px;\n }\n\n span.icon-left svg,\n span.icon-right svg {\n fill : ${(props: InputFieldProps) => props.theme.inputField.icons.default.fill};\n transition : all 0.2s;\n width : 24px;\n height : 24px;\n }\n\n span.icon-left { left : 8px; }\n\n span.icon-right {\n right : 8px;\n opacity : 0.24;\n }\n\n &.with-icon-left:focus ~ span.icon-left svg {\n fill : ${(props: InputFieldProps) => props.theme.inputField.icons.onFocus.fill};\n }\n\n / Grey check mark /\n &.validate-this {\n padding-right : 40px;\n background-image : url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8cG9seWxpbmUgcG9pbnRzPSIzLjUgMTIuNSA4LjUgMTcuNSAyMC41IDUuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZTJlMmUyIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);\n background-repeat : no-repeat;\n background-position : right 12px top 56%;\n background-size : 24px;\n\n &:focus {\n background-position : right 11px top 56%;\n }\n }\n\n &.validate-this ~ span.icon-right { display : none; }\n\n / Green check mark /\n &.validate-this:valid:not(:placeholder-shown) {\n background-image : url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8cG9seWxpbmUgcG9pbnRzPSIzLjUgMTIuNSA4LjUgMTcuNSAyMC41IDUuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMGVjMDVjIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);\n }\n\n / Red cross */\n &:invalid:not(:focus):not(:placeholder-shown) {\n border : 1px solid ${(props: InputFieldProps) => props.theme.inputField.icons.isValid.border};\n background-color : ${(props: InputFieldProps) => props.theme.inputField.isInvalid.bg};\n background-image : url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8bGluZSB4MT0iNi41IiB5MT0iMTcuNSIgeDI9IjE4LjUiIHkyPSI1LjUiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2VmNDM0MyIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiLz4gIDxsaW5lIHgxPSI2LjUiIHkxPSI1LjUiIHgyPSIxOC41IiB5Mj0iMTcuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZWY0MzQzIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);\n background-repeat : no-repeat;\n background-position : 98%;\n background-size : 24px;\n }\n`;\n"],"names":["InputFieldStyled","input","props","theme","text","font","sans","inputField","default","bg","border","borderRadius","onFocus","icons","fill","isValid","isInvalid"],"mappings":"kJAKaA,uDAA0BC,mIAIbC,GAA2BA,EAAMC,MAAMC,KAAKC,KAAKC,cACjDJ,GAA2BA,EAAMC,MAAMI,WAAWC,QAAQJ,yBAC1DF,GAA2BA,EAAMC,MAAMI,WAAWC,QAAQC,uBAChDP,GAA2BA,EAAMC,MAAMI,WAAWC,QAAQE,wBACpER,GAA4BA,EAAMC,MAAMI,WAAWC,QAAQG,6EAMvDT,GAA2BA,EAAMC,MAAMI,WAAWK,QAAQH,uBAChDP,GAA4BA,EAAMC,MAAMI,WAAWK,QAAQF,gBACrER,GAA2BA,EAAMC,MAAMI,WAAWK,QAAQR,+TAsBhEF,GAA2BA,EAAMC,MAAMI,WAAWM,MAAML,QAAQM,sKActEZ,GAA2BA,EAAMC,MAAMI,WAAWM,MAAMD,QAAQE,q6BAyBvCZ,GAA2BA,EAAMC,MAAMI,WAAWM,MAAME,QAAQL,2BAC1ER,GAA2BA,EAAMC,MAAMI,WAAWS,UAAUP"}

package/dist/es/components/Form/InputField/InputField.styled.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import i from"styled-components";const t=i.input.withConfig({displayName:"InputFieldStyled",componentId:"-18egqfl"})`position:relative;width:100%;flex:1 1 auto;font-family:${i=>i.theme.text.font.sans};color:${i=>i.theme.inputField.default.text};background-color:${i=>i.theme.inputField.default.bg};border:1px solid ${i=>i.theme.inputField.default.border};border-radius:${i=>i.theme.inputField.default.borderRadius};padding:12px;line-height:1;&:active,&:focus{background-color:${i=>i.theme.inputField.onFocus.bg};border:2px solid ${i=>i.theme.inputField.onFocus.border};color:${i=>i.theme.inputField.onFocus.text};padding:11px;}&[type=password]{letter-spacing:4px;}&.with-icon-left{padding-left:40px;}&.with-icon-right{padding-right:40px;}span.icon-left,span.icon-right{position:absolute;bottom:12px;width:24px;height:24px;}span.icon-left svg,span.icon-right svg{fill:${i=>i.theme.inputField.icons.default.fill};transition:all 0.2s;width:24px;height:24px;}span.icon-left{left:8px;}span.icon-right{right:8px;opacity:0.24;}&.with-icon-left:focus ~ span.icon-left svg{fill:${i=>i.theme.inputField.icons.onFocus.fill};}&.validate-this{padding-right:40px;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8cG9seWxpbmUgcG9pbnRzPSIzLjUgMTIuNSA4LjUgMTcuNSAyMC41IDUuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZTJlMmUyIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);background-repeat:no-repeat;background-position:right 12px top 56%;background-size:24px;&:focus{background-position:right 11px top 56%;}}&.validate-this ~ span.icon-right{display:none;}&.validate-this:valid:not(:placeholder-shown){background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8cG9seWxpbmUgcG9pbnRzPSIzLjUgMTIuNSA4LjUgMTcuNSAyMC41IDUuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMGVjMDVjIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);}&:invalid:not(:focus):not(:placeholder-shown){border:1px solid ${i=>i.theme.inputField.icons.isValid.border};background-color:${i=>i.theme.inputField.isInvalid.bg};background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8bGluZSB4MT0iNi41IiB5MT0iMTcuNSIgeDI9IjE4LjUiIHkyPSI1LjUiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2VmNDM0MyIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiLz4gIDxsaW5lIHgxPSI2LjUiIHkxPSI1LjUiIHgyPSIxOC41IiB5Mj0iMTcuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZWY0MzQzIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);background-repeat:no-repeat;background-position:98%;background-size:24px;}`;export{t as InputFieldStyled};
+import i from"styled-components";const t=i.input.withConfig({displayName:"InputFieldStyled",componentId:"-18egqfl"})`position:relative;width:100%;flex:1 1 auto;font-family:${i=>i.theme.text.font.sans};color:${i=>i.theme.inputField.default.text};background-color:${i=>i.theme.inputField.default.bg};border:1px solid ${i=>i.theme.inputField.default.border};border-radius:${i=>i.theme.inputField.default.borderRadius};padding:12px;line-height:1;&:active,&:focus{background-color:${i=>i.theme.inputField.onFocus.bg};border:2px solid ${i=>i.theme.inputField.onFocus.border};color:${i=>i.theme.inputField.onFocus.text};padding:11px;}&[type=password]{letter-spacing:4px;}&[type=password]:placeholder-shown{letter-spacing:unset;}&.with-icon-left{padding-left:40px;}&.with-icon-right{padding-right:40px;}span.icon-left,span.icon-right{position:absolute;bottom:12px;width:24px;height:24px;}span.icon-left svg,span.icon-right svg{fill:${i=>i.theme.inputField.icons.default.fill};transition:all 0.2s;width:24px;height:24px;}span.icon-left{left:8px;}span.icon-right{right:8px;opacity:0.24;}&.with-icon-left:focus ~ span.icon-left svg{fill:${i=>i.theme.inputField.icons.onFocus.fill};}&.validate-this{padding-right:40px;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8cG9seWxpbmUgcG9pbnRzPSIzLjUgMTIuNSA4LjUgMTcuNSAyMC41IDUuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZTJlMmUyIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);background-repeat:no-repeat;background-position:right 12px top 56%;background-size:24px;&:focus{background-position:right 11px top 56%;}}&.validate-this ~ span.icon-right{display:none;}&.validate-this:valid:not(:placeholder-shown){background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8cG9seWxpbmUgcG9pbnRzPSIzLjUgMTIuNSA4LjUgMTcuNSAyMC41IDUuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMGVjMDVjIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);}&:invalid:not(:focus):not(:placeholder-shown){border:1px solid ${i=>i.theme.inputField.icons.isValid.border};background-color:${i=>i.theme.inputField.isInvalid.bg};background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8bGluZSB4MT0iNi41IiB5MT0iMTcuNSIgeDI9IjE4LjUiIHkyPSI1LjUiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2VmNDM0MyIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiLz4gIDxsaW5lIHgxPSI2LjUiIHkxPSI1LjUiIHgyPSIxOC41IiB5Mj0iMTcuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZWY0MzQzIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);background-repeat:no-repeat;background-position:98%;background-size:24px;}`;export{t as InputFieldStyled};
 //# sourceMappingURL=InputField.styled.js.map

package/dist/es/components/Form/InputField/InputField.styled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InputField.styled.js","sources":["../../../../../src/components/Form/InputField/InputField.styled.tsx"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { InputFieldProps } from \"./InputField\";\n\n\nexport const InputFieldStyled = styled.input`\n position : relative;\n width : 100%;\n flex : 1 1 auto;\n font-family : ${(props: InputFieldProps) => props.theme.text.font.sans};\n color : ${(props: InputFieldProps) => props.theme.inputField.default.text};\n background-color : ${(props: InputFieldProps) => props.theme.inputField.default.bg};\n border : 1px solid ${(props: InputFieldProps) => props.theme.inputField.default.border};\n border-radius : ${(props : InputFieldProps) => props.theme.inputField.default.borderRadius};\n padding : 12px;\n line-height : 1;\n\n &:active,\n &:focus {\n background-color : ${(props: InputFieldProps) => props.theme.inputField.onFocus.bg};\n border : 2px solid ${(props : InputFieldProps) => props.theme.inputField.onFocus.border};\n color : ${(props: InputFieldProps) => props.theme.inputField.onFocus.text};\n padding : 11px;\n }\n\n &[type=password] { letter-spacing : 4px; }\n\n /* LEFT AND RIGHT ICONS ============================================ /\n &.with-icon-left { padding-left : 40px; }\n &.with-icon-right { padding-right : 40px; }\n\n span.icon-left,\n span.icon-right {\n position : absolute;\n bottom : 12px;\n width : 24px;\n height : 24px;\n }\n\n span.icon-left svg,\n span.icon-right svg {\n fill : ${(props: InputFieldProps) => props.theme.inputField.icons.default.fill};\n transition : all 0.2s;\n width : 24px;\n height : 24px;\n }\n\n span.icon-left { left : 8px; }\n\n span.icon-right {\n right : 8px;\n opacity : 0.24;\n }\n\n &.with-icon-left:focus ~ span.icon-left svg {\n fill : ${(props: InputFieldProps) => props.theme.inputField.icons.onFocus.fill};\n }\n\n / Grey check mark /\n &.validate-this {\n padding-right : 40px;\n background-image : url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8cG9seWxpbmUgcG9pbnRzPSIzLjUgMTIuNSA4LjUgMTcuNSAyMC41IDUuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZTJlMmUyIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);\n background-repeat : no-repeat;\n background-position : right 12px top 56%;\n background-size : 24px;\n\n &:focus {\n background-position : right 11px top 56%;\n }\n }\n\n &.validate-this ~ span.icon-right { display : none; }\n\n / Green check mark /\n &.validate-this:valid:not(:placeholder-shown) {\n background-image : url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8cG9seWxpbmUgcG9pbnRzPSIzLjUgMTIuNSA4LjUgMTcuNSAyMC41IDUuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMGVjMDVjIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);\n }\n\n / Red cross */\n &:invalid:not(:focus):not(:placeholder-shown) {\n border : 1px solid ${(props: InputFieldProps) => props.theme.inputField.icons.isValid.border};\n background-color : ${(props: InputFieldProps) => props.theme.inputField.isInvalid.bg};\n background-image : url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8bGluZSB4MT0iNi41IiB5MT0iMTcuNSIgeDI9IjE4LjUiIHkyPSI1LjUiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2VmNDM0MyIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiLz4gIDxsaW5lIHgxPSI2LjUiIHkxPSI1LjUiIHgyPSIxOC41IiB5Mj0iMTcuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZWY0MzQzIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);\n background-repeat : no-repeat;\n background-position : 98%;\n background-size : 24px;\n }\n`;\n"],"names":["InputFieldStyled","styled","input","props","theme","text","font","sans","inputField","default","bg","border","borderRadius","onFocus","icons","fill","isValid","isInvalid"],"mappings":"uCAKaA,EAAmBC,EAAOC,mIAIbC,GAA2BA,EAAMC,MAAMC,KAAKC,KAAKC,cACjDJ,GAA2BA,EAAMC,MAAMI,WAAWC,QAAQJ,yBAC1DF,GAA2BA,EAAMC,MAAMI,WAAWC,QAAQC,uBAChDP,GAA2BA,EAAMC,MAAMI,WAAWC,QAAQE,wBACpER,GAA4BA,EAAMC,MAAMI,WAAWC,QAAQG,6EAMvDT,GAA2BA,EAAMC,MAAMI,WAAWK,QAAQH,uBAChDP,GAA4BA,EAAMC,MAAMI,WAAWK,QAAQF,gBACrER,GAA2BA,EAAMC,MAAMI,WAAWK,QAAQR,~~sQAoBhEF,~~GAA2BA,EAAMC,MAAMI,WAAWM,MAAML,QAAQM,sKActEZ,GAA2BA,EAAMC,MAAMI,WAAWM,MAAMD,QAAQE,q6BAyBvCZ,GAA2BA,EAAMC,MAAMI,WAAWM,MAAME,QAAQL,2BAC1ER,GAA2BA,EAAMC,MAAMI,WAAWS,UAAUP"}
1	+ {"version":3,"file":"InputField.styled.js","sources":["../../../../../src/components/Form/InputField/InputField.styled.tsx"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { InputFieldProps } from \"./InputField\";\n\n\nexport const InputFieldStyled = styled.input`\n position : relative;\n width : 100%;\n flex : 1 1 auto;\n font-family : ${(props: InputFieldProps) => props.theme.text.font.sans};\n color : ${(props: InputFieldProps) => props.theme.inputField.default.text};\n background-color : ${(props: InputFieldProps) => props.theme.inputField.default.bg};\n border : 1px solid ${(props: InputFieldProps) => props.theme.inputField.default.border};\n border-radius : ${(props : InputFieldProps) => props.theme.inputField.default.borderRadius};\n padding : 12px;\n line-height : 1;\n\n &:active,\n &:focus {\n background-color : ${(props: InputFieldProps) => props.theme.inputField.onFocus.bg};\n border : 2px solid ${(props : InputFieldProps) => props.theme.inputField.onFocus.border};\n color : ${(props: InputFieldProps) => props.theme.inputField.onFocus.text};\n padding : 11px;\n }\n\n &[type=password] { letter-spacing : 4px; }\n\n &[type=password]:placeholder-shown { letter-spacing : unset; }\n\n /* LEFT AND RIGHT ICONS ============================================ /\n &.with-icon-left { padding-left : 40px; }\n &.with-icon-right { padding-right : 40px; }\n\n span.icon-left,\n span.icon-right {\n position : absolute;\n bottom : 12px;\n width : 24px;\n height : 24px;\n }\n\n span.icon-left svg,\n span.icon-right svg {\n fill : ${(props: InputFieldProps) => props.theme.inputField.icons.default.fill};\n transition : all 0.2s;\n width : 24px;\n height : 24px;\n }\n\n span.icon-left { left : 8px; }\n\n span.icon-right {\n right : 8px;\n opacity : 0.24;\n }\n\n &.with-icon-left:focus ~ span.icon-left svg {\n fill : ${(props: InputFieldProps) => props.theme.inputField.icons.onFocus.fill};\n }\n\n / Grey check mark /\n &.validate-this {\n padding-right : 40px;\n background-image : url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8cG9seWxpbmUgcG9pbnRzPSIzLjUgMTIuNSA4LjUgMTcuNSAyMC41IDUuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZTJlMmUyIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);\n background-repeat : no-repeat;\n background-position : right 12px top 56%;\n background-size : 24px;\n\n &:focus {\n background-position : right 11px top 56%;\n }\n }\n\n &.validate-this ~ span.icon-right { display : none; }\n\n / Green check mark /\n &.validate-this:valid:not(:placeholder-shown) {\n background-image : url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8cG9seWxpbmUgcG9pbnRzPSIzLjUgMTIuNSA4LjUgMTcuNSAyMC41IDUuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMGVjMDVjIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);\n }\n\n / Red cross */\n &:invalid:not(:focus):not(:placeholder-shown) {\n border : 1px solid ${(props: InputFieldProps) => props.theme.inputField.icons.isValid.border};\n background-color : ${(props: InputFieldProps) => props.theme.inputField.isInvalid.bg};\n background-image : url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICA8bGluZSB4MT0iNi41IiB5MT0iMTcuNSIgeDI9IjE4LjUiIHkyPSI1LjUiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2VmNDM0MyIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiLz4gIDxsaW5lIHgxPSI2LjUiIHkxPSI1LjUiIHgyPSIxOC41IiB5Mj0iMTcuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZWY0MzQzIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==);\n background-repeat : no-repeat;\n background-position : 98%;\n background-size : 24px;\n }\n`;\n"],"names":["InputFieldStyled","styled","input","props","theme","text","font","sans","inputField","default","bg","border","borderRadius","onFocus","icons","fill","isValid","isInvalid"],"mappings":"uCAKaA,EAAmBC,EAAOC,mIAIbC,GAA2BA,EAAMC,MAAMC,KAAKC,KAAKC,cACjDJ,GAA2BA,EAAMC,MAAMI,WAAWC,QAAQJ,yBAC1DF,GAA2BA,EAAMC,MAAMI,WAAWC,QAAQC,uBAChDP,GAA2BA,EAAMC,MAAMI,WAAWC,QAAQE,wBACpER,GAA4BA,EAAMC,MAAMI,WAAWC,QAAQG,6EAMvDT,GAA2BA,EAAMC,MAAMI,WAAWK,QAAQH,uBAChDP,GAA4BA,EAAMC,MAAMI,WAAWK,QAAQF,gBACrER,GAA2BA,EAAMC,MAAMI,WAAWK,QAAQR,+TAsBhEF,GAA2BA,EAAMC,MAAMI,WAAWM,MAAML,QAAQM,sKActEZ,GAA2BA,EAAMC,MAAMI,WAAWM,MAAMD,QAAQE,q6BAyBvCZ,GAA2BA,EAAMC,MAAMI,WAAWM,MAAME,QAAQL,2BAC1ER,GAA2BA,EAAMC,MAAMI,WAAWS,UAAUP"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
     "name" : "fictoan-react",
-    "version" : "0.41.6",
+    "version" : "0.41.7",
     "private" : false,
     "main" : "dist/cjs/index.js",
     "module" : "dist/es/index.js",