@entur/form - npm Package Compare versions

Comparing version 1.0.3 to 1.1.0

CHANGELOG.md

@@ -6,2 +6,12 @@ # Change Log
 
+# [1.1.0](https://bitbucket.org/enturas/design-system/compare/@entur/form@1.0.3...@entur/form@1.1.0) (2019-11-18)
+
+### Bug Fixes
+
+- add hover-effect for form elements in contrast sections ([a9da726](https://bitbucket.org/enturas/design-system/commits/a9da7266d9500b39aa69da39b57e50ab55a8a6e4))
+
+### Features
+
+- add readOnly prop to Dropdown, TextField and TextArea components ([ac26116](https://bitbucket.org/enturas/design-system/commits/ac26116338dce15bc23fe0fb9582f95c67c9c6e2))
+
 ## [1.0.3](https://bitbucket.org/enturas/design-system/compare/@entur/form@1.0.2...@entur/form@1.0.3) (2019-11-14)
@@ -8,0 +18,0 @@

dist/form.cjs.development.js

@@ -80,6 +80,8 @@ 'use strict';
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      _ref$readOnly = _ref.readOnly,
+      readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
       variant = _ref.variant,
       prepend = _ref.prepend,
       append = _ref.append,
-      rest = _objectWithoutProperties(_ref, ["children", "className", "dark", "disabled", "variant", "prepend", "append"]);
+      rest = _objectWithoutProperties(_ref, ["children", "className", "dark", "disabled", "readOnly", "variant", "prepend", "append"]);
 
@@ -93,3 +95,4 @@ var variantFromInputGroup = useVariant();
       'eds-form-control-wrapper--dark': dark,
-      'eds-form-control-wrapper--disabled': disabled
+      'eds-form-control-wrapper--disabled': disabled,
+      'eds-form-control-wrapper--readonly': readOnly
     })
@@ -111,8 +114,11 @@ }, rest), prepend && React.createElement("div", {
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      _ref$readOnly = _ref.readOnly,
+      readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
       className = _ref.className,
       style = _ref.style,
-      rest = _objectWithoutProperties(_ref, ["prepend", "append", "variant", "disabled", "className", "style"]);
+      rest = _objectWithoutProperties(_ref, ["prepend", "append", "variant", "disabled", "readOnly", "className", "style"]);
 
   return React.createElement(BaseFormControl, {
     disabled: disabled,
+    readOnly: readOnly,
     variant: variant,
@@ -127,2 +133,3 @@ prepend: prepend,
     disabled: disabled,
+    readOnly: readOnly,
     ref: ref
@@ -138,5 +145,7 @@ }, rest)));
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      _ref$readOnly = _ref.readOnly,
+      readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
       className = _ref.className,
       style = _ref.style,
-      rest = _objectWithoutProperties(_ref, ["variant", "disabled", "className", "style"]);
+      rest = _objectWithoutProperties(_ref, ["variant", "disabled", "readOnly", "className", "style"]);
 
@@ -146,2 +155,3 @@ return React.createElement(BaseFormControl, {
     disabled: disabled,
+    readOnly: readOnly,
     variant: variant,
@@ -151,3 +161,4 @@ style: style
     className: "eds-form-control eds-textarea",
-    ref: ref
+    ref: ref,
+    readOnly: readOnly
   }, rest)));
@@ -161,6 +172,8 @@ });
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      _ref$readOnly = _ref.readOnly,
+      readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
       children = _ref.children,
       prepend = _ref.prepend,
       style = _ref.style,
-      rest = _objectWithoutProperties(_ref, ["className", "variant", "disabled", "children", "prepend", "style"]);
+      rest = _objectWithoutProperties(_ref, ["className", "variant", "disabled", "readOnly", "children", "prepend", "style"]);
 
@@ -170,4 +183,5 @@ return React.createElement(BaseFormControl, {
     disabled: disabled,
+    readOnly: readOnly,
     prepend: prepend,
-    append: React.createElement(icons.DownArrowIcon, {
+    append: disabled || readOnly ? null : React.createElement(icons.DownArrowIcon, {
       inline: true
@@ -181,3 +195,3 @@ }),
     className: "eds-form-control",
-    disabled: disabled
+    disabled: disabled || readOnly
   }, rest), children));
@@ -184,0 +198,0 @@ };

dist/form.cjs.production.min.js

@@ -1,2 +0,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}var a=e(require("@babel/runtime/helpers/objectWithoutProperties")),r=e(require("react")),n=e(require("classnames")),t=require("@entur/icons"),s=require("@entur/typography"),l=r.createContext(null);function c(){return r.useContext(l)}var o=function(e){var a=e.level,n="eds-input-group__icon eds-input-group__icon--".concat(a);switch(a){case"success":return r.createElement(t.ValidationCheckIcon,{className:n});case"error":return r.createElement(t.ValidationErrorIcon,{className:n});case"info":return r.createElement(t.ValidationInfoIcon,{className:n});case"warning":return r.createElement(t.ValidationExclamationIcon,{className:n});default:return null}},i=function(e){var t=e.children,s=e.className,l=e.dark,o=void 0!==l&&l,i=e.disabled,d=void 0!==i&&i,m=e.variant,p=e.prepend,u=e.append,f=a(e,["children","className","dark","disabled","variant","prepend","append"]),v=c(),b=m||v;return r.createElement("div",Object.assign({className:n("eds-form-control-wrapper",s,{"eds-form-control-wrapper--success":"success"===b,"eds-form-control-wrapper--error":"error"===b,"eds-form-control-wrapper--dark":o,"eds-form-control-wrapper--disabled":d})},f),p&&r.createElement("div",{className:"eds-form-control__prepend"},p),t,u&&r.createElement("div",{className:"eds-form-control__append"},u))},d=r.forwardRef((function(e,n){var t=e.prepend,s=e.append,l=e.variant,c=e.disabled,o=void 0!==c&&c,d=e.className,m=e.style,p=a(e,["prepend","append","variant","disabled","className","style"]);return r.createElement(i,{disabled:o,variant:l,prepend:t,append:s,className:d,style:m},r.createElement("input",Object.assign({"aria-invalid":"error"===l,className:"eds-form-control",disabled:o,ref:n},p)))})),m=r.forwardRef((function(e,n){var t=e.variant,s=e.disabled,l=void 0!==s&&s,c=e.className,o=e.style,d=a(e,["variant","disabled","className","style"]);return r.createElement(i,{className:c,disabled:l,variant:t,style:o},r.createElement("textarea",Object.assign({className:"eds-form-control eds-textarea",ref:n},d)))})),p=function(e){var t=e.children,l=e.className,c=e.label,o=a(e,["children","className","label"]);return r.createElement("fieldset",Object.assign({className:n("eds-fieldset",l)},o),c&&r.createElement(s.Heading4,{as:"legend",className:"eds-legend"},c),t)},u=r.forwardRef((function(e,l){var c=e.className,o=e.children,i=a(e,["className","width","children"]);return r.createElement("label",{className:n("eds-form-component--checkbox__container",c)},r.createElement("input",Object.assign({type:"checkbox",ref:l},i)),r.createElement("span",{className:"eds-form-component--checkbox__icon"},r.createElement(t.CheckIcon,null)),o&&r.createElement(s.Label,{as:"span"},o))})),f=r.createContext(null),v=f.Provider,b=r.forwardRef((function(e,t){var l=e.className,c=e.children,o=e.value,i=a(e,["className","children","value"]),d=n(l,"eds-form-component--radio__radio"),m=function(){var e=r.useContext(f);if(!e)throw new Error("You need to wrap your RadioButtons in a RadioGroup component");return e}();return r.createElement("label",{className:"eds-form-component--radio__container"},r.createElement("input",Object.assign({type:"radio",name:m.name,ref:t,value:o,checked:m.value===o,onChange:m.onChange},i)),r.createElement("span",{className:d},r.createElement("span",{className:"eds-form-component--radio__circle"})),c&&r.createElement(s.Label,{as:"span"},c))}));exports.Checkbox=u,exports.Dropdown=function(e){var n=e.className,s=e.variant,l=e.disabled,c=void 0!==l&&l,o=e.children,d=e.prepend,m=e.style,p=a(e,["className","variant","disabled","children","prepend","style"]);return r.createElement(i,{dark:!0,disabled:c,prepend:d,append:r.createElement(t.DownArrowIcon,{inline:!0}),variant:s,className:n,style:m},r.createElement("select",Object.assign({"aria-invalid":"error"===s,className:"eds-form-control",disabled:c},p),o))},exports.DropdownItem=function(e){var n=e.children,t=a(e,["children"]);return r.createElement("option",Object.assign({},t),n)},exports.Fieldset=p,exports.InputGroup=function(e){var a=e.feedback,n=e.variant,t=void 0===n?null:n,c=e.children;return r.createElement(l.Provider,{value:t},r.createElement("div",{className:"eds-input-group"},r.createElement(s.Label,{style:{display:"block"}},r.createElement("span",{className:"eds-input-group__label"},e.label),c),a&&t&&r.createElement(s.SmallText,{className:"eds-input-group__feedback-wrapper"},r.createElement(o,{level:t}),r.createElement("span",{className:"eds-input-group__feedback"},a))))},exports.Radio=b,exports.RadioGroup=function(e){var n=e.name,t=e.value,s=e.children,l=e.onChange,c=a(e,["name","value","children","onChange"]),o=r.useMemo((function(){return{name:n,value:t,onChange:l}}),[n,t,l]);return r.createElement(v,{value:o},r.createElement(p,Object.assign({},c),s))},exports.TextArea=m,exports.TextField=d,exports.useVariant=c;
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}var a=e(require("@babel/runtime/helpers/objectWithoutProperties")),r=e(require("react")),n=e(require("classnames")),t=require("@entur/icons"),l=require("@entur/typography"),s=r.createContext(null);function c(){return r.useContext(s)}var o=function(e){var a=e.level,n="eds-input-group__icon eds-input-group__icon--".concat(a);switch(a){case"success":return r.createElement(t.ValidationCheckIcon,{className:n});case"error":return r.createElement(t.ValidationErrorIcon,{className:n});case"info":return r.createElement(t.ValidationInfoIcon,{className:n});case"warning":return r.createElement(t.ValidationExclamationIcon,{className:n});default:return null}},d=function(e){var t=e.children,l=e.className,s=e.dark,o=void 0!==s&&s,d=e.disabled,i=void 0!==d&&d,m=e.readOnly,p=void 0!==m&&m,u=e.variant,f=e.prepend,v=e.append,b=a(e,["children","className","dark","disabled","readOnly","variant","prepend","append"]),E=c(),N=u||E;return r.createElement("div",Object.assign({className:n("eds-form-control-wrapper",l,{"eds-form-control-wrapper--success":"success"===N,"eds-form-control-wrapper--error":"error"===N,"eds-form-control-wrapper--dark":o,"eds-form-control-wrapper--disabled":i,"eds-form-control-wrapper--readonly":p})},b),f&&r.createElement("div",{className:"eds-form-control__prepend"},f),t,v&&r.createElement("div",{className:"eds-form-control__append"},v))},i=r.forwardRef((function(e,n){var t=e.prepend,l=e.append,s=e.variant,c=e.disabled,o=void 0!==c&&c,i=e.readOnly,m=void 0!==i&&i,p=e.className,u=e.style,f=a(e,["prepend","append","variant","disabled","readOnly","className","style"]);return r.createElement(d,{disabled:o,readOnly:m,variant:s,prepend:t,append:l,className:p,style:u},r.createElement("input",Object.assign({"aria-invalid":"error"===s,className:"eds-form-control",disabled:o,readOnly:m,ref:n},f)))})),m=r.forwardRef((function(e,n){var t=e.variant,l=e.disabled,s=void 0!==l&&l,c=e.readOnly,o=void 0!==c&&c,i=e.className,m=e.style,p=a(e,["variant","disabled","readOnly","className","style"]);return r.createElement(d,{className:i,disabled:s,readOnly:o,variant:t,style:m},r.createElement("textarea",Object.assign({className:"eds-form-control eds-textarea",ref:n,readOnly:o},p)))})),p=function(e){var t=e.children,s=e.className,c=e.label,o=a(e,["children","className","label"]);return r.createElement("fieldset",Object.assign({className:n("eds-fieldset",s)},o),c&&r.createElement(l.Heading4,{as:"legend",className:"eds-legend"},c),t)},u=r.forwardRef((function(e,s){var c=e.className,o=e.children,d=a(e,["className","width","children"]);return r.createElement("label",{className:n("eds-form-component--checkbox__container",c)},r.createElement("input",Object.assign({type:"checkbox",ref:s},d)),r.createElement("span",{className:"eds-form-component--checkbox__icon"},r.createElement(t.CheckIcon,null)),o&&r.createElement(l.Label,{as:"span"},o))})),f=r.createContext(null),v=f.Provider,b=r.forwardRef((function(e,t){var s=e.className,c=e.children,o=e.value,d=a(e,["className","children","value"]),i=n(s,"eds-form-component--radio__radio"),m=function(){var e=r.useContext(f);if(!e)throw new Error("You need to wrap your RadioButtons in a RadioGroup component");return e}();return r.createElement("label",{className:"eds-form-component--radio__container"},r.createElement("input",Object.assign({type:"radio",name:m.name,ref:t,value:o,checked:m.value===o,onChange:m.onChange},d)),r.createElement("span",{className:i},r.createElement("span",{className:"eds-form-component--radio__circle"})),c&&r.createElement(l.Label,{as:"span"},c))}));exports.Checkbox=u,exports.Dropdown=function(e){var n=e.className,l=e.variant,s=e.disabled,c=void 0!==s&&s,o=e.readOnly,i=void 0!==o&&o,m=e.children,p=e.prepend,u=e.style,f=a(e,["className","variant","disabled","readOnly","children","prepend","style"]);return r.createElement(d,{dark:!0,disabled:c,readOnly:i,prepend:p,append:c||i?null:r.createElement(t.DownArrowIcon,{inline:!0}),variant:l,className:n,style:u},r.createElement("select",Object.assign({"aria-invalid":"error"===l,className:"eds-form-control",disabled:c||i},f),m))},exports.DropdownItem=function(e){var n=e.children,t=a(e,["children"]);return r.createElement("option",Object.assign({},t),n)},exports.Fieldset=p,exports.InputGroup=function(e){var a=e.feedback,n=e.variant,t=void 0===n?null:n,c=e.children;return r.createElement(s.Provider,{value:t},r.createElement("div",{className:"eds-input-group"},r.createElement(l.Label,{style:{display:"block"}},r.createElement("span",{className:"eds-input-group__label"},e.label),c),a&&t&&r.createElement(l.SmallText,{className:"eds-input-group__feedback-wrapper"},r.createElement(o,{level:t}),r.createElement("span",{className:"eds-input-group__feedback"},a))))},exports.Radio=b,exports.RadioGroup=function(e){var n=e.name,t=e.value,l=e.children,s=e.onChange,c=a(e,["name","value","children","onChange"]),o=r.useMemo((function(){return{name:n,value:t,onChange:s}}),[n,t,s]);return r.createElement(v,{value:o},r.createElement(p,Object.assign({},c),l))},exports.TextArea=m,exports.TextField=i,exports.useVariant=c;
 //# sourceMappingURL=form.cjs.production.min.js.map

dist/form.esm.js

@@ -76,6 +76,8 @@ import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      _ref$readOnly = _ref.readOnly,
+      readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
       variant = _ref.variant,
       prepend = _ref.prepend,
       append = _ref.append,
-      rest = _objectWithoutProperties(_ref, ["children", "className", "dark", "disabled", "variant", "prepend", "append"]);
+      rest = _objectWithoutProperties(_ref, ["children", "className", "dark", "disabled", "readOnly", "variant", "prepend", "append"]);
 
@@ -89,3 +91,4 @@ var variantFromInputGroup = useVariant();
       'eds-form-control-wrapper--dark': dark,
-      'eds-form-control-wrapper--disabled': disabled
+      'eds-form-control-wrapper--disabled': disabled,
+      'eds-form-control-wrapper--readonly': readOnly
     })
@@ -107,8 +110,11 @@ }, rest), prepend && React.createElement("div", {
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      _ref$readOnly = _ref.readOnly,
+      readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
       className = _ref.className,
       style = _ref.style,
-      rest = _objectWithoutProperties(_ref, ["prepend", "append", "variant", "disabled", "className", "style"]);
+      rest = _objectWithoutProperties(_ref, ["prepend", "append", "variant", "disabled", "readOnly", "className", "style"]);
 
   return React.createElement(BaseFormControl, {
     disabled: disabled,
+    readOnly: readOnly,
     variant: variant,
@@ -123,2 +129,3 @@ prepend: prepend,
     disabled: disabled,
+    readOnly: readOnly,
     ref: ref
@@ -134,5 +141,7 @@ }, rest)));
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      _ref$readOnly = _ref.readOnly,
+      readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
       className = _ref.className,
       style = _ref.style,
-      rest = _objectWithoutProperties(_ref, ["variant", "disabled", "className", "style"]);
+      rest = _objectWithoutProperties(_ref, ["variant", "disabled", "readOnly", "className", "style"]);
 
@@ -142,2 +151,3 @@ return React.createElement(BaseFormControl, {
     disabled: disabled,
+    readOnly: readOnly,
     variant: variant,
@@ -147,3 +157,4 @@ style: style
     className: "eds-form-control eds-textarea",
-    ref: ref
+    ref: ref,
+    readOnly: readOnly
   }, rest)));
@@ -157,6 +168,8 @@ });
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      _ref$readOnly = _ref.readOnly,
+      readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
       children = _ref.children,
       prepend = _ref.prepend,
       style = _ref.style,
-      rest = _objectWithoutProperties(_ref, ["className", "variant", "disabled", "children", "prepend", "style"]);
+      rest = _objectWithoutProperties(_ref, ["className", "variant", "disabled", "readOnly", "children", "prepend", "style"]);
 
@@ -166,4 +179,5 @@ return React.createElement(BaseFormControl, {
     disabled: disabled,
+    readOnly: readOnly,
     prepend: prepend,
-    append: React.createElement(DownArrowIcon, {
+    append: disabled || readOnly ? null : React.createElement(DownArrowIcon, {
       inline: true
@@ -177,3 +191,3 @@ }),
     className: "eds-form-control",
-    disabled: disabled
+    disabled: disabled || readOnly
   }, rest), children));
@@ -180,0 +194,0 @@ };

dist/index.d.ts

@@ -24,4 +24,6 @@ import React from "react";
     variant?: VariantType;
-    /** Deaktiver tekstfeltet */
+    /** Deaktiver inputfeltet */
     disabled?: boolean;
+    /** Setter inputfeltet i read-only modus */
+    readOnly?: boolean;
     [key: string]: any;
@@ -37,2 +39,4 @@ };
     disabled?: boolean;
+    /** Setter tekstområdet i read-only modus */
+    readOnly?: boolean;
     [key: string]: any;
@@ -48,2 +52,4 @@ };
     disabled?: boolean;
+    /** Setter dropdownen i read-only modus */
+    readOnly?: boolean;
     /** Den valgte verdien */
@@ -50,0 +56,0 @@ value: string;

package.json

 {
   "name": "@entur/form",
-  "version": "1.0.3",
+  "version": "1.1.0",
   "license": "EUPL-1.2",
@@ -32,6 +32,6 @@ "main": "dist/index.js",
     "@entur/tokens": "^1.0.1",
-    "@entur/typography": "^0.4.4",
+    "@entur/typography": "^0.4.5",
     "classnames": "^2.2.6"
   },
-  "gitHead": "f474568d4572a715c5800781e34d42999d7c22ba"
+  "gitHead": "636c2b374cdfcd69a5faa02224b85616bc4aca2b"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

120829

increased by4.75%

Lines of code

987

increased by5.11%

Dependency changes

• Updated@entur/typography@^0.4.5