@entur/form 5.3.10 → 5.4.2

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 (12) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/dist/BaseFormControl.d.ts +2 -0
  3. package/dist/TextField.d.ts +2 -0
  4. package/dist/form.cjs.development.js +33 -14
  5. package/dist/form.cjs.development.js.map +1 -1
  6. package/dist/form.cjs.production.min.js +1 -1
  7. package/dist/form.cjs.production.min.js.map +1 -1
  8. package/dist/form.esm.js +33 -14
  9. package/dist/form.esm.js.map +1 -1
  10. package/dist/styles.css +114 -114
  11. package/dist/utils.d.ts +1 -1
  12. package/package.json +7 -7
package/dist/form.cjs.production.min.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@entur/utils"),a=require("@entur/tooltip"),t=require("classnames"),l=require("react"),r=require("@entur/icons"),n=require("@entur/typography"),o=require("@entur/tokens");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function s(e){if(e&&e.__esModule)return e;var a=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var l=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,l.get?l:{enumerable:!0,get:function(){return e[t]}})}})),a.default=e,a}var c=d(t),i=d(l),u=s(l);function f(){return f=Object.assign||function(e){for(var a=1;a<arguments.length;a++){var t=arguments[a];for(var l in t)Object.prototype.hasOwnProperty.call(t,l)&&(e[l]=t[l])}return e},f.apply(this,arguments)}function m(e,a){if(null==e)return{};var t,l,r={},n=Object.keys(e);for(l=0;l<n.length;l++)a.indexOf(t=n[l])>=0||(r[t]=e[t]);return r}var p=["children","hideIcon","variant","className"],b=function(e){var a=e.variant,t="eds-feedback-text__icon eds-feedback-text__icon--"+a;switch(a){case"success":return i.default.createElement(r.ValidationCheckIcon,{className:t});case"error":return i.default.createElement(r.ValidationErrorIcon,{className:t});case"info":default:return null;case"warning":return i.default.createElement(r.ValidationExclamationIcon,{className:t})}},h=function(e){var a=e.children,t=e.hideIcon,l=void 0!==t&&t,r=e.variant,o=e.className,d=m(e,p);return i.default.createElement(n.SubLabel,f({className:c.default("eds-feedback-text",{"eds-feedback-text--info":"info"===r},o)},d),!l&&i.default.createElement(b,{variant:r}),i.default.createElement("span",{className:"eds-feedback-text__text"},a))},v=u.createContext({isFilled:!1,setFilled:function(){return null}}),E=function(e){var a=e.children,t=u.useState(!1);return u.createElement(v.Provider,{value:{isFilled:t[0],setFilled:t[1]}},a)},g=function(){return u.useContext(v)},_=["label","required","labelId","staticAnimation"],x=function(e){var a=e.label,t=e.required,l=e.labelId,r=e.staticAnimation,n=void 0!==r&&r,o=m(e,_),d=g(),s=n||d.isFilled;return i.default.createElement("label",f({className:c.default(o.className,{"eds-input-group-label-wrapper--filled":s}),id:l},o),i.default.createElement("span",{className:c.default("eds-input-group__label",{"eds-input-group__label--filled":s})},a," ",t&&i.default.createElement("span",null,"*")))},y=i.default.createContext(null),N=function(){return i.default.useContext(y)},C=["children","className","dark","disabled","readOnly","variant","prepend","append","size","isFilled","label","required","labelTooltip","feedback","labelId","labelProps","style","disableLabelAnimation"],k=i.default.forwardRef((function(e,t){var l=e.children,n=e.className,o=e.dark,d=void 0!==o&&o,s=e.disabled,u=void 0!==s&&s,p=e.readOnly,b=void 0!==p&&p,v=e.variant,g=e.prepend,_=e.append,y=e.size,k=void 0===y?"medium":y,w=e.isFilled,I=e.label,O=e.required,P=e.labelTooltip,z=e.feedback,R=e.labelId,F=e.labelProps,V=e.style,A=e.disableLabelAnimation,L=void 0!==A&&A,T=m(e,C),S=N(),q=v||S;return i.default.createElement(E,null,i.default.createElement("div",f({className:c.default("eds-form-control-wrapper",n,"eds-form-control-wrapper--size-"+k,{"eds-form-control-wrapper--success":"success"===q,"eds-form-control-wrapper--error":"error"===q,"eds-form-control-wrapper--dark":d,"eds-form-control-wrapper--disabled":u,"eds-form-control-wrapper--readonly":b,"eds-form-control-wrapper--is-filled":w}),ref:t,style:V},T),g&&i.default.createElement("div",{className:"eds-form-control__prepend"},g),i.default.createElement(x,f({label:I,required:O,labelId:R,staticAnimation:L},F)),l,_&&i.default.createElement("div",{className:"eds-form-control__append"},_),P&&i.default.createElement("div",{className:"eds-form-control__append eds-form-control__append--tooltip"},i.default.createElement(a.Tooltip,{content:P,placement:"right"},i.default.createElement("span",{className:"eds-input-group__label-tooltip-icon"},i.default.createElement(r.QuestionIcon,null))))),z&&q&&i.default.createElement(h,{variant:q},z))})),w=["checked","className","children","style","disabled","reduceClickArea"],I=i.default.forwardRef((function(e,a){var t=e.checked,l=e.className,r=e.children,o=e.style,d=e.disabled,s=void 0!==d&&d,u=e.reduceClickArea,p=m(e,w),b=i.default.useRef(null);i.default.useImperativeHandle(a,(function(){return b.current}));var h="indeterminate"===t,v=void 0!==t;return i.default.useEffect((function(){b&&b.current&&(b.current.indeterminate=h)}),[h]),i.default.createElement("label",{className:c.default("eds-checkbox__container",l,{"eds-checkbox--disabled":s,"eds-checkbox__container--reduced-click-area":u}),style:o},i.default.createElement("input",f({type:"checkbox",ref:b,checked:v?!0===t:void 0,disabled:s},p)),i.default.createElement("span",{className:c.default("eds-checkbox__icon",{"eds-checkbox__icon--disabled":s,"eds-checkbox__icon--reduced-click-area":u})},i.default.createElement(O,{indeterminate:h})),r&&i.default.createElement(n.Paragraph,{className:"eds-checkbox__label",margin:"none",as:"span"},r))})),O=function(e){var a=e.indeterminate;return i.default.createElement("svg",{className:"eds-checkbox-icon",width:"11px",height:"9px",viewBox:"6 11 37 33"},void 0!==a&&a?i.default.createElement("rect",{x:"10",y:"25",width:"28",height:"5",fill:"white"}):i.default.createElement("path",{className:"eds-checkbox-icon__path",d:"M14.1 27.2l7.1 7.2 14.6-14.8",fill:"none"}))},P=["children","className","label"],z=function(e){var a=e.children,t=e.className,l=e.label,r=m(e,P);return i.default.createElement("fieldset",f({className:c.default("eds-fieldset",t)},r),l&&i.default.createElement(n.Label,{as:"legend",className:"eds-legend"},l),a)},R=i.default.createContext(null),F=R.Provider,V=function(){var e=i.default.useContext(R);if(!e)throw new Error("You need to wrap your RadioButtons in a RadioGroup component");return e},A=["className","children","value","disabled"],L=i.default.forwardRef((function(e,a){var t=e.className,l=e.children,r=e.value,o=e.disabled,d=m(e,A),s=c.default(t,"eds-form-component--radio__radio",{"eds-form-component--radio__radio--disabled":o}),u=V();return i.default.createElement("label",{className:"eds-form-component--radio__container"},i.default.createElement("input",f({type:"radio",name:u.name,ref:a,value:r,checked:u.value===r,onChange:u.onChange,disabled:o},d)),i.default.createElement("span",{className:s},i.default.createElement("span",{className:"eds-form-component--radio__circle"})),l&&i.default.createElement(n.Paragraph,{margin:"none",as:"span",className:"eds-form-component--radio__label"},l))})),T=["name","value","children","onChange","label"],S=["className","children","value","title","secondaryLabel","size","hideCheckbox","style","id","disabled"],q=i.default.forwardRef((function(a,t){var l=a.className,r=a.children,n=a.value,o=a.title,d=a.secondaryLabel,s=a.size,u=void 0===s?"medium":s,p=a.hideCheckbox,b=void 0!==p&&p,h=a.style,v=a.id,E=a.disabled,g=void 0!==E&&E,_=m(a,S),x=c.default(l,"eds-radio-panel__container","eds-radio-panel--"+u,{"eds-radio-panel--disabled":g}),y=V(),N=y.name,C=y.value,k=y.onChange,w=e.useRandomId("eds-radiopanel"),I=v||w;return i.default.createElement("label",{className:"eds-radio-panel__wrapper",htmlFor:I},i.default.createElement("input",f({type:"radio",name:N,ref:t,value:n,checked:C===n,onChange:k,id:I,disabled:g},_)),i.default.createElement("div",{className:x,style:h},i.default.createElement("div",{className:"eds-radio-panel__title-wrapper"},i.default.createElement("div",{className:"eds-radio-panel__title"},o),i.default.createElement("div",{className:"eds-radio-panel__label"},d&&i.default.createElement("span",null,d),!(g||b)&&i.default.createElement("span",{className:"eds-radio-panel__check"},i.default.createElement(M,null)))),r&&i.default.createElement("div",{className:"eds-radio-panel__additional-content"},r)))})),M=function(){return i.default.createElement("svg",{className:"eds-checkbox-icon",width:"22px",height:"16px",viewBox:"6 11 37 33"},i.default.createElement("path",{className:"eds-checkbox-icon__path",d:"M14.1 27.2l7.1 7.2 14.6-14.8",fill:"none"}))},j=["className","children","labelPlacement","icon","hideIcon","color","contrastColor","size"],B=i.default.forwardRef((function(e,a){var t=e.className,l=e.children,n=e.labelPlacement,d=void 0===n?"right":n,s=e.icon,u=e.hideIcon,p=void 0!==u&&u,b=e.color,h=void 0===b?o.colors.validation.mintContrast:b,v=e.contrastColor,E=e.size,g=void 0===E?"medium":E,_=m(e,j),x=v&&v||h;return i.default.createElement("label",{className:c.default("eds-switch","eds-switch--"+d,t),style:f({},_.style)},i.default.createElement("input",f({type:"checkbox",ref:a},_)),i.default.createElement("span",{className:c.default("eds-switch__switch","eds-switch__switch--"+g),style:{"--eds-switch-color":h,"--eds-switch-contrast-color":x}},i.default.createElement("span",{className:"eds-switch__circle"},!p&&(s||i.default.createElement(_.checked?r.CheckIcon:r.CloseSmallIcon,null)))),l&&i.default.createElement("span",{className:c.default("eds-switch__label","eds-switch__label--"+g+"--"+d)},l))})),G=["className","children","labelPlacement","transport","size"];function Y(e){return null!=e&&!(Array.isArray(e)&&0===e.length)}function D(e,a){return void 0===a&&(a=!1),e&&(Y(e.value)&&""!==e.value||a&&Y(e.defaultValue)&&""!==e.defaultValue)}var H=["variant","disabled","readOnly","className","style","label","feedback","labelTooltip","onChange","disableLabelAnimation"],Q=["readOnly","disabled","onChange","value"],J=i.default.forwardRef((function(a,t){var l=a.variant,r=a.disabled,n=void 0!==r&&r,o=a.readOnly,d=void 0!==o&&o,s=a.className,c=a.style,u=a.label,p=a.feedback,b=a.labelTooltip,h=a.onChange,v=a.disableLabelAnimation,E=m(a,H),g=e.useRandomId("eds-textarea");return i.default.createElement(k,{className:s,disabled:n,readOnly:d,variant:l,style:c,label:u,labelId:g,feedback:p,labelTooltip:b,labelProps:{className:"eds-textarea__label"},disableLabelAnimation:v},i.default.createElement(K,f({readOnly:d,disabled:n,ref:t,"aria-labelledby":g,onChange:h},E)))})),K=i.default.forwardRef((function(a,t){var l=a.readOnly,r=a.disabled,n=a.onChange,o=a.value,d=m(a,Q),s=g(),c=s.isFilled,u=s.setFilled;return e.useOnMount((function(){(o||d.defaultValue)&&u&&!c&&u(!0)})),i.default.useEffect((function(){o&&u&&!c&&u(!0)}),[o,u,c]),i.default.createElement("textarea",f({className:"eds-form-control eds-textarea",ref:t,readOnly:l,disabled:r,onChange:function(e){D(e.target)?u&&!c&&u(!0):u&&c&&u(!1),n&&n(e)},value:o},d))})),U=["prepend","append","variant","disabled","readOnly","className","style","size","label","required","labelTooltip","feedback","onChange","disableLabelAnimation","labelProps","clearable","onClear","value"],W=["disabled","readOnly","placeholder","onChange","value","variant"],X=["onClear"],Z=i.default.forwardRef((function(a,t){var l=a.prepend,r=a.append,n=a.variant,o=a.disabled,d=void 0!==o&&o,s=a.readOnly,c=void 0!==s&&s,u=a.className,p=a.style,b=a.size,h=void 0===b?"medium":b,v=a.label,E=a.required,g=a.labelTooltip,_=a.feedback,x=a.onChange,y=a.disableLabelAnimation,N=a.labelProps,C=a.clearable,w=void 0!==C&&C,I=a.onClear,O=a.value,P=m(a,U),z=e.useRandomId("eds-textfield"),R=N&&N.id?N.id:z;return i.default.createElement(k,{disabled:d,readOnly:c,variant:n,prepend:l,append:w&&I?i.default.createElement(ee,{onClear:I}):r,className:u,style:p,size:h,label:v,required:E,labelTooltip:g,labelId:R,feedback:_,disableLabelAnimation:y,labelProps:N},i.default.createElement($,f({disabled:d,readOnly:c,ref:t,"aria-labelledby":R,onChange:x,value:O},P)))})),$=i.default.forwardRef((function(a,t){var l=a.disabled,r=a.readOnly,n=a.placeholder,o=a.onChange,d=a.value,s=a.variant,c=m(a,W),u=N(),p=s||u,b=g(),h=b.isFilled,v=b.setFilled;return e.useOnMount((function(){(d||c.defaultValue)&&v&&!h&&v(!0)})),i.default.useEffect((function(){d&&v&&!h&&v(!0)}),[d,v,h]),i.default.createElement("input",f({"aria-invalid":"error"===p,className:"eds-form-control",disabled:l,readOnly:r,ref:t,placeholder:n,onChange:function(e){D(e.target)?v&&!h&&v(!0):v&&h&&v(!1),o&&o(e)},value:d},c))})),ee=function(e){var a=e.onClear,t=m(e,X),l=g(),n=l.isFilled,o=l.setFilled;return i.default.createElement("div",{className:"eds-textfield__clear-button-wrapper"},n&&i.default.createElement("div",{className:"eds-textfield__divider"}),n&&i.default.createElement("button",f({className:"eds-textfield__clear-button",type:"button",tabIndex:-1,onClick:function(){o(!1),a()}},t),i.default.createElement(r.CloseSmallIcon,null)))},ae=["name","onChange","selectedValue","multiple","size"],te=i.default.createContext(null),le=function(a){var t=a.name,l=a.onChange,r=void 0===l?function(){}:l,n=a.selectedValue,o=a.multiple,d=a.size,s=m(a,ae),c=e.useRandomId("eds-segmented-control"),u=i.default.useMemo((function(){return{name:t||c,onChange:r,multiple:o,selectedValue:n,size:d}}),[c,o,t,r,n,d]);return i.default.createElement(te.Provider,f({value:u},s))},re=["children","className","style","value","name","onChange"],ne=i.default.forwardRef((function(e,a){var t=e.children,l=e.className,r=e.style,n=e.value,o=e.name,d=e.onChange,s=void 0===d?function(){}:d,u=m(e,re),p=function(){var e=i.default.useContext(te);if(!e)throw new Error("You need to wrap your SegmentedChoice in either SegmentedControl or MultipleSegmentedControl");return e}(),b=p.name,h=p.selectedValue,v=p.onChange,E=p.multiple,g=p.size,_=E?h[n]:h===n;return i.default.createElement("label",{className:c.default("eds-segmented-choice",l,{"eds-segmented-choide--large":"large"===g}),style:r},i.default.createElement("input",f({type:E?"checkbox":"radio",name:o||b,checked:_,value:n,onChange:function(e){var a;s(e),E?v(f({},h,((a={})[n]=e.target.checked,a))):e.target.checked&&v(n)},ref:a},u)),i.default.createElement("div",{className:c.default("eds-base-segmented",{"eds-base-segmented--large":"large"===g})},t))})),oe=["children","label","name","onChange","selectedValue","size","className"],de=["children","label","name","onChange","selectedValue"];e.warnAboutMissingStyles("form","icons","typography"),exports.BaseFormControl=k,exports.Checkbox=I,exports.FeedbackText=h,exports.Fieldset=z,exports.InputGroupContextProvider=E,exports.InputGroupLabel=x,exports.MultipleSegmentedControl=function(e){var a=e.children,t=e.label,l=e.name,r=e.onChange,o=e.selectedValue,d=m(e,de);return i.default.createElement(le,{name:l,selectedValue:o,onChange:r,multiple:!0,size:"medium"},i.default.createElement(n.Label,{as:"div"},t),i.default.createElement("div",f({className:"eds-segmented-control"},d),a))},exports.Radio=L,exports.RadioGroup=function(e){var a=e.name,t=e.value,l=e.children,r=e.onChange,n=e.label,o=m(e,T),d=i.default.useMemo((function(){return{name:a,value:t,onChange:r}}),[a,t,r]);return i.default.createElement(F,{value:d},n?i.default.createElement(z,f({label:n},o),l):l)},exports.RadioPanel=q,exports.SegmentedChoice=ne,exports.SegmentedControl=function(e){var a=e.children,t=e.label,l=e.name,r=e.onChange,o=e.selectedValue,d=e.size,s=void 0===d?"medium":d,u=e.className,p=m(e,oe);return i.default.createElement(le,{name:l,selectedValue:o,onChange:r,multiple:!1,size:s},i.default.createElement(n.Label,{as:"div"},t),i.default.createElement("div",f({className:c.default("eds-segmented-control",u)},p),a))},exports.Switch=B,exports.TextArea=J,exports.TextField=Z,exports.TravelSwitch=function(e){var a=e.className,t=e.children,l=e.labelPlacement,n=void 0===l?"right":l,d=e.transport,s=e.size,c=m(e,G),u=function(e){switch(e){case"bus":return{Icon:r.BusIcon,color:o.colors.transport.default.bus,contrast:o.colors.transport.contrast.bus};case"metro":return{Icon:r.SubwayIcon,color:o.colors.transport.default.metro,contrast:o.colors.transport.contrast.metro};case"air":return{Icon:r.PlaneIcon,color:o.colors.transport.default.plane,contrast:o.colors.transport.contrast.plane};case"tram":return{Icon:r.TramIcon,color:o.colors.transport.default.tram,contrast:o.colors.transport.contrast.tram};case"rail":return{Icon:r.TrainIcon,color:o.colors.transport.default.train,contrast:o.colors.transport.contrast.train};case"water":return{Icon:r.FerryIcon,color:o.colors.transport.default.ferry,contrast:o.colors.transport.contrast.ferry};case"bike":return{Icon:r.BicycleIcon,color:o.colors.transport.default.mobility,contrast:o.colors.transport.contrast.mobility};case"scooter":return{Icon:r.ScooterIcon,color:o.colors.transport.default.mobility,contrast:o.colors.transport.contrast.mobility};case"airportLinkBus":return{Icon:r.BusIcon,color:o.colors.transport.default.plane,contrast:o.colors.transport.contrast.plane};case"airportLinkRail":return{Icon:r.TrainIcon,color:o.colors.transport.default.plane,contrast:o.colors.transport.contrast.plane};default:throw Error("Please select a transport for the TravelSwitch.")}}(d);return i.default.createElement(B,f({className:a,labelPlacement:n,color:u.color,contrastColor:u.contrast,icon:i.default.createElement(u.Icon,null),size:s},c),t)},exports.VariantProvider=function(e){var a=e.variant;return i.default.createElement(y.Provider,{value:void 0===a?null:a},e.children)},exports.hasValue=Y,exports.isFilled=D,exports.useInputGroupContext=g,exports.useVariant=N;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@entur/utils"),a=require("@entur/tooltip"),t=require("classnames"),l=require("react"),r=require("@entur/icons"),n=require("@entur/typography"),o=require("@entur/tokens");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function c(e){if(e&&e.__esModule)return e;var a=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var l=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,l.get?l:{enumerable:!0,get:function(){return e[t]}})}})),a.default=e,a}var s=d(t),i=d(l),u=c(l);function f(){return f=Object.assign||function(e){for(var a=1;a<arguments.length;a++){var t=arguments[a];for(var l in t)Object.prototype.hasOwnProperty.call(t,l)&&(e[l]=t[l])}return e},f.apply(this,arguments)}function m(e,a){if(null==e)return{};var t,l,r={},n=Object.keys(e);for(l=0;l<n.length;l++)a.indexOf(t=n[l])>=0||(r[t]=e[t]);return r}var p=["children","hideIcon","variant","className"],b=function(e){var a=e.variant,t="eds-feedback-text__icon eds-feedback-text__icon--"+a;switch(a){case"success":return i.default.createElement(r.ValidationCheckIcon,{className:t});case"error":return i.default.createElement(r.ValidationErrorIcon,{className:t});case"info":default:return null;case"warning":return i.default.createElement(r.ValidationExclamationIcon,{className:t})}},v=function(e){var a=e.children,t=e.hideIcon,l=void 0!==t&&t,r=e.variant,o=e.className,d=m(e,p);return i.default.createElement(n.SubLabel,f({className:s.default("eds-feedback-text",{"eds-feedback-text--info":"info"===r},o)},d),!l&&i.default.createElement(b,{variant:r}),i.default.createElement("span",{className:"eds-feedback-text__text"},a))},h=u.createContext({isFilled:!1,setFilled:function(){return null}}),E=function(e){var a=e.children,t=u.useState(!1);return u.createElement(h.Provider,{value:{isFilled:t[0],setFilled:t[1]}},a)},g=function(){return u.useContext(h)},_=["label","required","labelId","staticAnimation"],x=function(e){var a=e.label,t=e.required,l=e.labelId,r=e.staticAnimation,n=void 0!==r&&r,o=m(e,_),d=g(),c=n||d.isFilled;return i.default.createElement("label",f({className:s.default(o.className,{"eds-input-group-label-wrapper--filled":c}),id:l},o),i.default.createElement("span",{className:s.default("eds-input-group__label",{"eds-input-group__label--filled":c})},a," ",t&&i.default.createElement("span",null,"*")))},y=i.default.createContext(null),N=function(){return i.default.useContext(y)},C=["children","className","dark","disabled","readOnly","variant","prepend","append","size","isFilled","label","required","labelTooltip","feedback","labelId","labelProps","style","disableLabelAnimation","ariaAlertOnFeedback"],k=i.default.forwardRef((function(e,t){var l=e.children,n=e.className,o=e.dark,d=void 0!==o&&o,c=e.disabled,u=void 0!==c&&c,p=e.readOnly,b=void 0!==p&&p,h=e.variant,g=e.prepend,_=e.append,y=e.size,k=void 0===y?"medium":y,w=e.isFilled,I=e.label,O=e.required,P=e.labelTooltip,F=e.feedback,A=e.labelId,z=e.labelProps,R=e.style,V=e.disableLabelAnimation,T=void 0!==V&&V,L=e.ariaAlertOnFeedback,S=void 0!==L&&L,q=m(e,C),M=N(),j=h||M;return i.default.createElement(E,null,i.default.createElement("div",f({className:s.default("eds-form-control-wrapper",n,"eds-form-control-wrapper--size-"+k,{"eds-form-control-wrapper--success":"success"===j,"eds-form-control-wrapper--error":"error"===j,"eds-form-control-wrapper--dark":d,"eds-form-control-wrapper--disabled":u,"eds-form-control-wrapper--readonly":b,"eds-form-control-wrapper--is-filled":w}),ref:t,style:R},q),g&&i.default.createElement("div",{className:"eds-form-control__prepend"},g),i.default.createElement(x,f({label:I,required:O,labelId:A,staticAnimation:T},z)),l,_&&i.default.createElement("div",{className:"eds-form-control__append"},_),P&&i.default.createElement("div",{className:"eds-form-control__append eds-form-control__append--tooltip"},i.default.createElement(a.Tooltip,{content:P,placement:"right"},i.default.createElement("span",{className:"eds-input-group__label-tooltip-icon"},i.default.createElement(r.QuestionIcon,null))))),F&&j&&i.default.createElement(v,{variant:j,role:S?"alert":void 0},F))})),w=["checked","className","children","style","disabled","reduceClickArea"],I=i.default.forwardRef((function(e,a){var t=e.checked,l=e.className,r=e.children,o=e.style,d=e.disabled,c=void 0!==d&&d,u=e.reduceClickArea,p=m(e,w),b=i.default.useRef(null);i.default.useImperativeHandle(a,(function(){return b.current}));var v="indeterminate"===t,h=void 0!==t;return i.default.useEffect((function(){b&&b.current&&(b.current.indeterminate=v)}),[v]),i.default.createElement("label",{className:s.default("eds-checkbox__container",l,{"eds-checkbox--disabled":c,"eds-checkbox__container--reduced-click-area":u}),style:o},i.default.createElement("input",f({type:"checkbox",ref:b,checked:h?!0===t:void 0,disabled:c},p)),i.default.createElement("span",{className:s.default("eds-checkbox__icon",{"eds-checkbox__icon--disabled":c,"eds-checkbox__icon--reduced-click-area":u})},i.default.createElement(O,{indeterminate:v})),r&&i.default.createElement(n.Paragraph,{className:"eds-checkbox__label",margin:"none",as:"span"},r))})),O=function(e){var a=e.indeterminate;return i.default.createElement("svg",{className:"eds-checkbox-icon",width:"11px",height:"9px",viewBox:"6 11 37 33"},void 0!==a&&a?i.default.createElement("rect",{x:"10",y:"25",width:"28",height:"5",fill:"white"}):i.default.createElement("path",{className:"eds-checkbox-icon__path",d:"M14.1 27.2l7.1 7.2 14.6-14.8",fill:"none"}))},P=["children","className","label"],F=function(e){var a=e.children,t=e.className,l=e.label,r=m(e,P);return i.default.createElement("fieldset",f({className:s.default("eds-fieldset",t)},r),l&&i.default.createElement(n.Label,{as:"legend",className:"eds-legend"},l),a)},A=i.default.createContext(null),z=A.Provider,R=function(){var e=i.default.useContext(A);if(!e)throw new Error("You need to wrap your RadioButtons in a RadioGroup component");return e},V=["className","children","value","disabled"],T=i.default.forwardRef((function(e,a){var t=e.className,l=e.children,r=e.value,o=e.disabled,d=m(e,V),c=s.default(t,"eds-form-component--radio__radio",{"eds-form-component--radio__radio--disabled":o}),u=R();return i.default.createElement("label",{className:"eds-form-component--radio__container"},i.default.createElement("input",f({type:"radio",name:u.name,ref:a,value:r,checked:u.value===r,onChange:u.onChange,disabled:o},d)),i.default.createElement("span",{className:c},i.default.createElement("span",{className:"eds-form-component--radio__circle"})),l&&i.default.createElement(n.Paragraph,{margin:"none",as:"span",className:"eds-form-component--radio__label"},l))})),L=["name","value","children","onChange","label"],S=["className","children","value","title","secondaryLabel","size","hideCheckbox","style","id","disabled"],q=i.default.forwardRef((function(a,t){var l=a.className,r=a.children,n=a.value,o=a.title,d=a.secondaryLabel,c=a.size,u=void 0===c?"medium":c,p=a.hideCheckbox,b=void 0!==p&&p,v=a.style,h=a.id,E=a.disabled,g=void 0!==E&&E,_=m(a,S),x=s.default(l,"eds-radio-panel__container","eds-radio-panel--"+u,{"eds-radio-panel--disabled":g}),y=R(),N=y.name,C=y.value,k=y.onChange,w=e.useRandomId("eds-radiopanel"),I=h||w;return i.default.createElement("label",{className:"eds-radio-panel__wrapper",htmlFor:I},i.default.createElement("input",f({type:"radio",name:N,ref:t,value:n,checked:C===n,onChange:k,id:I,disabled:g},_)),i.default.createElement("div",{className:x,style:v},i.default.createElement("div",{className:"eds-radio-panel__title-wrapper"},i.default.createElement("div",{className:"eds-radio-panel__title"},o),i.default.createElement("div",{className:"eds-radio-panel__label"},d&&i.default.createElement("span",null,d),!(g||b)&&i.default.createElement("span",{className:"eds-radio-panel__check"},i.default.createElement(M,null)))),r&&i.default.createElement("div",{className:"eds-radio-panel__additional-content"},r)))})),M=function(){return i.default.createElement("svg",{className:"eds-checkbox-icon",width:"22px",height:"16px",viewBox:"6 11 37 33"},i.default.createElement("path",{className:"eds-checkbox-icon__path",d:"M14.1 27.2l7.1 7.2 14.6-14.8",fill:"none"}))},j=["className","children","labelPlacement","icon","hideIcon","color","contrastColor","size"],B=i.default.forwardRef((function(e,a){var t=e.className,l=e.children,n=e.labelPlacement,d=void 0===n?"right":n,c=e.icon,u=e.hideIcon,p=void 0!==u&&u,b=e.color,v=void 0===b?o.colors.validation.mintContrast:b,h=e.contrastColor,E=e.size,g=void 0===E?"medium":E,_=m(e,j),x=h&&h||v;return i.default.createElement("label",{className:s.default("eds-switch","eds-switch--"+d,t),style:f({},_.style)},i.default.createElement("input",f({type:"checkbox",ref:a},_)),i.default.createElement("span",{className:s.default("eds-switch__switch","eds-switch__switch--"+g),style:{"--eds-switch-color":v,"--eds-switch-contrast-color":x}},i.default.createElement("span",{className:"eds-switch__circle"},!p&&(c||i.default.createElement(_.checked?r.CheckIcon:r.CloseSmallIcon,null)))),l&&i.default.createElement("span",{className:s.default("eds-switch__label","eds-switch__label--"+g+"--"+d)},l))})),G=["className","children","labelPlacement","transport","size"];function Y(e){return null!=e&&!(Array.isArray(e)&&0===e.length)}function D(e,a){return void 0===a&&(a=!1),e&&(Y(e.value)&&""!==e.value||a&&Y(e.defaultValue)&&""!==e.defaultValue)}var H=["variant","disabled","readOnly","className","style","label","feedback","labelTooltip","onChange","disableLabelAnimation"],Q=["readOnly","disabled","onChange","value","variant"],J=i.default.forwardRef((function(a,t){var l=a.variant,r=a.disabled,n=void 0!==r&&r,o=a.readOnly,d=void 0!==o&&o,c=a.className,s=a.style,u=a.label,p=a.feedback,b=a.labelTooltip,v=a.onChange,h=a.disableLabelAnimation,E=m(a,H),g=e.useRandomId("eds-textarea");return i.default.createElement(k,{className:c,disabled:n,readOnly:d,variant:l,style:s,label:u,labelId:g,feedback:p,labelTooltip:b,labelProps:{className:"eds-textarea__label"},disableLabelAnimation:h},i.default.createElement(K,f({readOnly:d,disabled:n,ref:t,"aria-labelledby":g,onChange:v,variant:l},E)))})),K=i.default.forwardRef((function(a,t){var l=a.readOnly,r=a.disabled,n=a.onChange,o=a.value,d=a.variant,c=m(a,Q),s=N(),u=d||s,p=g(),b=p.isFilled,v=p.setFilled;return e.useOnMount((function(){(o||c.defaultValue)&&v&&!b&&v(!0)})),i.default.useEffect((function(){o&&v&&!b&&v(!0)}),[o,v,b]),i.default.createElement("textarea",f({className:"eds-form-control eds-textarea",ref:t,readOnly:l,disabled:r,onChange:function(e){D(e.target)?v&&!b&&v(!0):v&&b&&v(!1),n&&n(e)},value:o,"aria-invalid":"error"===u},c))})),U=["prepend","append","variant","disabled","readOnly","className","style","size","label","required","labelTooltip","feedback","onChange","disableLabelAnimation","labelProps","clearable","onClear","value","ariaAlertOnFeedback"],W=["disabled","readOnly","placeholder","onChange","value","variant"],X=["onClear"],Z=i.default.forwardRef((function(a,t){var l=a.prepend,r=a.append,n=a.variant,o=a.disabled,d=void 0!==o&&o,c=a.readOnly,s=void 0!==c&&c,u=a.className,p=a.style,b=a.size,v=void 0===b?"medium":b,h=a.label,E=a.required,g=a.labelTooltip,_=a.feedback,x=a.onChange,y=a.disableLabelAnimation,N=a.labelProps,C=a.clearable,w=void 0!==C&&C,I=a.onClear,O=a.value,P=a.ariaAlertOnFeedback,F=void 0!==P&&P,A=m(a,U),z=e.useRandomId("eds-textfield"),R=N&&N.id?N.id:z;return i.default.createElement(k,{disabled:d,readOnly:s,variant:n,prepend:l,append:w&&I?i.default.createElement(ee,{onClear:I}):r,className:u,style:p,size:v,label:h,required:E,labelTooltip:g,labelId:R,feedback:_,disableLabelAnimation:y,labelProps:N,ariaAlertOnFeedback:F},i.default.createElement($,f({disabled:d,readOnly:s,ref:t,"aria-labelledby":R,onChange:x,value:O,variant:n},A)))})),$=i.default.forwardRef((function(a,t){var l=a.disabled,r=a.readOnly,n=a.placeholder,o=a.onChange,d=a.value,c=a.variant,s=m(a,W),u=N(),p=c||u,b=g(),v=b.isFilled,h=b.setFilled;return e.useOnMount((function(){(d||s.defaultValue)&&h&&!v&&h(!0)})),i.default.useEffect((function(){d&&h&&!v&&h(!0)}),[d,h,v]),i.default.createElement("input",f({"aria-invalid":"error"===p,className:"eds-form-control",disabled:l,readOnly:r,ref:t,placeholder:n,onChange:function(e){D(e.target)?h&&!v&&h(!0):h&&v&&h(!1),o&&o(e)},value:d},s))})),ee=function(e){var a=e.onClear,t=m(e,X),l=g(),n=l.isFilled,o=l.setFilled;return i.default.createElement("div",{className:"eds-textfield__clear-button-wrapper"},n&&i.default.createElement("div",{className:"eds-textfield__divider"}),n&&i.default.createElement("button",f({className:"eds-textfield__clear-button",type:"button",tabIndex:-1,onClick:function(){o(!1),a()}},t),i.default.createElement(r.CloseSmallIcon,null)))},ae=["name","onChange","selectedValue","multiple","size"],te=i.default.createContext(null),le=function(a){var t=a.name,l=a.onChange,r=void 0===l?function(){}:l,n=a.selectedValue,o=a.multiple,d=a.size,c=m(a,ae),s=e.useRandomId("eds-segmented-control"),u=i.default.useMemo((function(){return{name:t||s,onChange:r,multiple:o,selectedValue:n,size:d}}),[s,o,t,r,n,d]);return i.default.createElement(te.Provider,f({value:u},c))},re=["children","className","style","value","name","onChange"],ne=i.default.forwardRef((function(e,a){var t=e.children,l=e.className,r=e.style,n=e.value,o=e.name,d=e.onChange,c=void 0===d?function(){}:d,u=m(e,re),p=function(){var e=i.default.useContext(te);if(!e)throw new Error("You need to wrap your SegmentedChoice in either SegmentedControl or MultipleSegmentedControl");return e}(),b=p.name,v=p.selectedValue,h=p.onChange,E=p.multiple,g=p.size,_=E?v[n]:v===n;return i.default.createElement("label",{className:s.default("eds-segmented-choice",l,{"eds-segmented-choide--large":"large"===g}),style:r},i.default.createElement("input",f({type:E?"checkbox":"radio",name:o||b,checked:_,value:n,onChange:function(e){var a;c(e),E?h(f({},v,((a={})[n]=e.target.checked,a))):e.target.checked&&h(n)},ref:a},u)),i.default.createElement("div",{className:s.default("eds-base-segmented",{"eds-base-segmented--large":"large"===g})},t))})),oe=["children","label","name","onChange","selectedValue","size","className"],de=["children","label","name","onChange","selectedValue"];e.warnAboutMissingStyles("form","icons","typography"),exports.BaseFormControl=k,exports.Checkbox=I,exports.FeedbackText=v,exports.Fieldset=F,exports.InputGroupContextProvider=E,exports.InputGroupLabel=x,exports.MultipleSegmentedControl=function(e){var a=e.children,t=e.label,l=e.name,r=e.onChange,o=e.selectedValue,d=m(e,de);return i.default.createElement(le,{name:l,selectedValue:o,onChange:r,multiple:!0,size:"medium"},i.default.createElement(n.Label,{as:"div"},t),i.default.createElement("div",f({className:"eds-segmented-control"},d),a))},exports.Radio=T,exports.RadioGroup=function(e){var a=e.name,t=e.value,l=e.children,r=e.onChange,n=e.label,o=m(e,L),d=i.default.useMemo((function(){return{name:a,value:t,onChange:r}}),[a,t,r]);return i.default.createElement(z,{value:d},n?i.default.createElement(F,f({label:n},o),l):l)},exports.RadioPanel=q,exports.SegmentedChoice=ne,exports.SegmentedControl=function(e){var a=e.children,t=e.label,l=e.name,r=e.onChange,n=e.selectedValue,o=e.size,d=void 0===o?"medium":o,c=e.className,u=m(e,oe);return i.default.createElement(le,{name:l,selectedValue:n,onChange:r,multiple:!1,size:d},i.default.createElement(F,{label:t},i.default.createElement("div",f({className:s.default("eds-segmented-control",c)},u),a)))},exports.Switch=B,exports.TextArea=J,exports.TextField=Z,exports.TravelSwitch=function(e){var a=e.className,t=e.children,l=e.labelPlacement,n=void 0===l?"right":l,d=e.transport,c=e.size,s=m(e,G),u=function(e){switch(e){case"bus":return{Icon:r.BusIcon,color:o.colors.transport.default.bus,contrast:o.colors.transport.contrast.bus};case"metro":return{Icon:r.SubwayIcon,color:o.colors.transport.default.metro,contrast:o.colors.transport.contrast.metro};case"air":return{Icon:r.PlaneIcon,color:o.colors.transport.default.plane,contrast:o.colors.transport.contrast.plane};case"tram":return{Icon:r.TramIcon,color:o.colors.transport.default.tram,contrast:o.colors.transport.contrast.tram};case"rail":return{Icon:r.TrainIcon,color:o.colors.transport.default.train,contrast:o.colors.transport.contrast.train};case"water":return{Icon:r.FerryIcon,color:o.colors.transport.default.ferry,contrast:o.colors.transport.contrast.ferry};case"bike":return{Icon:r.BicycleIcon,color:o.colors.transport.default.mobility,contrast:o.colors.transport.contrast.mobility};case"scooter":return{Icon:r.ScooterIcon,color:o.colors.transport.default.mobility,contrast:o.colors.transport.contrast.mobility};case"airportLinkBus":return{Icon:r.BusIcon,color:o.colors.transport.default.plane,contrast:o.colors.transport.contrast.plane};case"airportLinkRail":return{Icon:r.TrainIcon,color:o.colors.transport.default.plane,contrast:o.colors.transport.contrast.plane};default:throw Error("Please select a transport for the TravelSwitch.")}}(d);return i.default.createElement(B,f({className:a,labelPlacement:n,color:u.color,contrastColor:u.contrast,icon:i.default.createElement(u.Icon,null),size:c},s),t)},exports.VariantProvider=function(e){var a=e.variant;return i.default.createElement(y.Provider,{value:void 0===a?null:a},e.children)},exports.hasValue=Y,exports.isFilled=D,exports.useInputGroupContext=g,exports.useVariant=N;
2
2
  //# sourceMappingURL=form.cjs.production.min.js.map
package/dist/form.cjs.production.min.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"form.cjs.production.min.js","sources":["../src/FeedbackText.tsx","../src/InputGroupContext.tsx","../src/InputGroupLabel.tsx","../src/VariantProvider.tsx","../src/BaseFormControl.tsx","../src/Checkbox.tsx","../src/Fieldset.tsx","../src/RadioGroupContext.tsx","../src/Radio.tsx","../src/RadioPanel.tsx","../src/Switch.tsx","../src/utils.ts","../src/TextArea.tsx","../src/TextField.tsx","../src/segmented-control/SegmentedContext.tsx","../src/segmented-control/SegmentedChoice.tsx","../src/index.tsx","../src/segmented-control/MultipleSegmentedControl.tsx","../src/RadioGroup.tsx","../src/segmented-control/SegmentedControl.tsx","../src/TravelSwitch.tsx"],"sourcesContent":["import React from 'react';\nimport {\n ValidationCheckIcon,\n ValidationErrorIcon,\n ValidationExclamationIcon,\n} from '@entur/icons';\nimport { SubLabel } from '@entur/typography';\nimport { VariantType } from './VariantProvider';\nimport classNames from 'classnames';\nimport './FeedbackText.scss';\n\nconst AlertIcon: React.FC<{ variant: VariantType }> = ({ variant }) => {\n const iconClass = `eds-feedback-text__icon eds-feedback-text__icon--${variant}`;\n switch (variant) {\n case 'success':\n return <ValidationCheckIcon className={iconClass} />;\n case 'error':\n return <ValidationErrorIcon className={iconClass} />;\n case 'info':\n return null;\n case 'warning':\n return <ValidationExclamationIcon className={iconClass} />;\n default:\n return null;\n }\n};\n\nexport type FeedbackTextProps = {\n /** Teksten som vises */\n children: React.ReactNode;\n /** Skjuler ikonet */\n hideIcon?: boolean;\n /** Feedbackvarianten */\n variant: VariantType;\n /** Ekstra klassenavn */\n className?: string;\n [key: string]: any;\n};\nexport const FeedbackText: React.FC<FeedbackTextProps> = ({\n children,\n hideIcon = false,\n variant,\n className,\n ...rest\n}) => {\n return (\n <SubLabel\n className={classNames(\n 'eds-feedback-text',\n { 'eds-feedback-text--info': variant === 'info' },\n className,\n )}\n {...rest}\n >\n {!hideIcon && <AlertIcon variant={variant} />}\n <span className=\"eds-feedback-text__text\">{children}</span>\n </SubLabel>\n );\n};\n","import * as React from 'react';\n\ntype InputGroupContextType = {\n isFilled: boolean;\n setFilled: (e: boolean) => void;\n};\n\nconst InputGroupContext = React.createContext<InputGroupContextType>({\n isFilled: false,\n setFilled: () => null,\n});\n\nexport const InputGroupContextProvider: React.FC<{\n children: React.ReactNode;\n}> = ({ children }) => {\n const [filled, setFilled] = React.useState(false);\n return (\n <InputGroupContext.Provider\n value={{ isFilled: filled, setFilled: setFilled }}\n >\n {children}\n </InputGroupContext.Provider>\n );\n};\n\nexport const useInputGroupContext: () => InputGroupContextType = () =>\n React.useContext(InputGroupContext);\n","import classNames from 'classnames';\nimport React from 'react';\nimport { useInputGroupContext } from './InputGroupContext';\nimport './InputGroupLabel.scss';\n\nexport type InputGroupLabelProps = {\n label?: React.ReactNode;\n required?: boolean;\n labelTooltip?: string;\n labelId: string;\n staticAnimation?: boolean;\n} & React.DetailedHTMLProps<\n React.LabelHTMLAttributes<HTMLLabelElement>,\n HTMLLabelElement\n>;\n\nexport const InputGroupLabel: React.FC<InputGroupLabelProps> = ({\n label,\n required,\n labelId,\n staticAnimation = false,\n ...rest\n}) => {\n const { isFilled } = useInputGroupContext();\n const filler = staticAnimation || isFilled;\n return (\n <label\n className={classNames(rest.className, {\n 'eds-input-group-label-wrapper--filled': filler,\n })}\n id={labelId}\n {...rest}\n >\n <span\n className={classNames('eds-input-group__label', {\n 'eds-input-group__label--filled': filler,\n })}\n >\n {label} {required && <span>*</span>}\n </span>\n </label>\n );\n};\n","import React from 'react';\n\nexport type VariantType = 'success' | 'error' | 'warning' | 'info';\n\nconst VariantContext = React.createContext<VariantType | null>(null);\n\nexport type VariantProviderProps = {\n variant?: VariantType;\n};\nexport const VariantProvider: React.FC<VariantProviderProps> = ({\n children,\n variant = null,\n}) => {\n return (\n <VariantContext.Provider value={variant}>\n {children}\n </VariantContext.Provider>\n );\n};\n\nexport const useVariant: () => VariantType | null = () => {\n const context = React.useContext(VariantContext);\n return context;\n};\n","import { Tooltip } from '@entur/tooltip';\nimport classNames from 'classnames';\nimport React from 'react';\nimport './BaseFormControl.scss';\nimport { FeedbackText } from './FeedbackText';\nimport { InputGroupContextProvider } from './InputGroupContext';\nimport { InputGroupLabel } from './InputGroupLabel';\nimport { useVariant, VariantType } from './VariantProvider';\nimport { QuestionIcon } from '@entur/icons';\n\nexport type BaseFormControlProps = {\n /** Et skjemaelement med `eds-form-control`-klassen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Sett til true om skjema-elementet skal ha mørkt design i contrast mode */\n dark?: boolean;\n /** Sett til true om skjema-elementet er disabled */\n disabled?: boolean;\n /** Sett til true om skjema-elementet er i read-only modus */\n readOnly?: boolean;\n /** Tekst eller ikon som vises foran skjema-elementet */\n prepend?: React.ReactNode;\n /** Tekst eller ikon som vises etter skjema-elementet */\n append?: React.ReactNode;\n /** Valideringsvariant */\n variant?: VariantType;\n /**Størrelsen på skjemaelementet\n * @default \"medium\"\n */\n size?: 'medium' | 'large';\n /** Label til inputfeltet */\n label: React.ReactNode;\n /** En tooltip som forklarer labelen til inputfeltet */\n labelTooltip?: React.ReactNode;\n /** Illustrerer om inputfeltet er påkrevd eller ikke */\n required?: boolean;\n /** ID som settes på labelen til inputfeltet */\n labelId: string;\n /** Varselmelding, som vil komme under form-komponenten */\n feedback?: string;\n /** Om inputfeltet er fylt med data. Brukes for plassering av label */\n isFilled?: boolean;\n /**Ekstra props som sendes til label */\n labelProps?: { [key: string]: any };\n /** Ekstra styling */\n style?: React.CSSProperties;\n /** Plasserer labelen statisk på toppen av inputfeltet */\n disableLabelAnimation?: boolean;\n};\n\nexport const BaseFormControl = React.forwardRef<\n HTMLDivElement,\n BaseFormControlProps\n>(\n (\n {\n children,\n className,\n dark = false,\n disabled = false,\n readOnly = false,\n variant,\n prepend,\n append,\n size = 'medium',\n isFilled,\n label,\n required,\n labelTooltip,\n feedback,\n labelId,\n labelProps,\n style,\n disableLabelAnimation = false,\n ...rest\n },\n ref,\n ) => {\n const contextVariant = useVariant();\n const currentVariant = variant || contextVariant;\n\n return (\n <InputGroupContextProvider>\n <div\n className={classNames(\n 'eds-form-control-wrapper',\n className,\n `eds-form-control-wrapper--size-${size}`,\n {\n 'eds-form-control-wrapper--success': currentVariant === 'success',\n 'eds-form-control-wrapper--error': currentVariant === 'error',\n 'eds-form-control-wrapper--dark': dark,\n 'eds-form-control-wrapper--disabled': disabled,\n 'eds-form-control-wrapper--readonly': readOnly,\n 'eds-form-control-wrapper--is-filled': isFilled,\n },\n )}\n ref={ref}\n style={style}\n {...rest}\n >\n {prepend && (\n <div className=\"eds-form-control__prepend\">{prepend}</div>\n )}\n <InputGroupLabel\n label={label}\n required={required}\n labelId={labelId}\n staticAnimation={disableLabelAnimation}\n {...labelProps}\n />\n {children}\n {append && <div className=\"eds-form-control__append\">{append}</div>}\n {labelTooltip && (\n <div className=\"eds-form-control__append eds-form-control__append--tooltip\">\n <Tooltip content={labelTooltip} placement=\"right\">\n <span className=\"eds-input-group__label-tooltip-icon\">\n <QuestionIcon />\n </span>\n </Tooltip>\n </div>\n )}\n </div>\n {feedback && currentVariant && (\n <FeedbackText variant={currentVariant}>{feedback}</FeedbackText>\n )}\n </InputGroupContextProvider>\n );\n },\n);\n","import React, { CSSProperties } from 'react';\nimport { Paragraph } from '@entur/typography';\nimport cx from 'classnames';\nimport './Checkbox.scss';\n\nexport type CheckboxProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Label for checkboxen, som vises ved høyre side. */\n children?: React.ReactNode;\n /** Om Checkbox er avmerket, eller om den */\n checked?: 'indeterminate' | boolean;\n /** Callback for Checkbox */\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /** Om checkboxen er disabled eller ikke\n * @default false\n */\n disabled?: boolean;\n /**Ekstra styling til komponenten */\n style?: CSSProperties;\n /** Reduserer klikkflaten for Checkbox'en\n * @default false\n */\n reduceClickArea?: boolean;\n} & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'checked'>;\n\nexport const Checkbox = React.forwardRef<HTMLInputElement, CheckboxProps>(\n (\n {\n checked,\n className,\n children,\n style,\n disabled = false,\n reduceClickArea,\n ...rest\n },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n // Trick to allow using a ref locally, while still allowing for ref forwarding\n // Read more at https://reactjs.org/docs/hooks-reference.html#useimperativehandle\n const innerRef = React.useRef<HTMLInputElement>(null);\n //eslint-disable-next-line\n React.useImperativeHandle(ref, () => innerRef.current!);\n\n const isIndeterminate = checked === 'indeterminate';\n const isControlled = checked !== undefined;\n\n React.useEffect(() => {\n if (innerRef && innerRef.current) {\n innerRef.current.indeterminate = isIndeterminate;\n }\n }, [isIndeterminate]);\n\n return (\n <label\n className={cx('eds-checkbox__container', className, {\n 'eds-checkbox--disabled': disabled,\n 'eds-checkbox__container--reduced-click-area': reduceClickArea,\n })}\n style={style}\n >\n <input\n type=\"checkbox\"\n ref={innerRef}\n checked={isControlled ? checked === true : undefined}\n disabled={disabled}\n {...rest}\n />\n <span\n className={cx('eds-checkbox__icon', {\n 'eds-checkbox__icon--disabled': disabled,\n 'eds-checkbox__icon--reduced-click-area': reduceClickArea,\n })}\n >\n <CheckboxIcon indeterminate={isIndeterminate} />\n </span>\n {children && (\n <Paragraph className=\"eds-checkbox__label\" margin=\"none\" as=\"span\">\n {children}\n </Paragraph>\n )}\n </label>\n );\n },\n);\n\nconst CheckboxIcon: React.FC<{ indeterminate: boolean }> = ({\n indeterminate = false,\n}) => {\n return (\n <svg\n className=\"eds-checkbox-icon\"\n width=\"11px\"\n height=\"9px\"\n viewBox=\"6 11 37 33\"\n >\n {indeterminate ? (\n <rect x=\"10\" y=\"25\" width=\"28\" height=\"5\" fill=\"white\" />\n ) : (\n <path\n className=\"eds-checkbox-icon__path\"\n d=\"M14.1 27.2l7.1 7.2 14.6-14.8\"\n fill=\"none\"\n />\n )}\n </svg>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { Label } from '@entur/typography';\nimport './Fieldset.scss';\n\nexport type FieldsetProps = {\n /** Innholdet i felt-gruppen. */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Labelen til felt-gruppen. */\n label?: React.ReactNode;\n [key: string]: any;\n};\n\nexport const Fieldset: React.FC<FieldsetProps> = ({\n children,\n className,\n label,\n ...rest\n}) => (\n <fieldset className={classNames('eds-fieldset', className)} {...rest}>\n {label && (\n <Label as=\"legend\" className=\"eds-legend\">\n {label}\n </Label>\n )}\n {children}\n </fieldset>\n);\n","import React from 'react';\n\ntype RadioGroupContextProps = {\n name: string;\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n value: string | null;\n};\n\nconst RadioGroupContext = React.createContext<RadioGroupContextProps | null>(\n null,\n);\n\nexport const RadioGroupContextProvider = RadioGroupContext.Provider;\n\nexport const useRadioGroupContext: () => RadioGroupContextProps = () => {\n const context = React.useContext(RadioGroupContext);\n if (!context) {\n throw new Error(\n 'You need to wrap your RadioButtons in a RadioGroup component',\n );\n }\n return context;\n};\n","import React from 'react';\nimport cx from 'classnames';\nimport { Paragraph } from '@entur/typography';\nimport { useRadioGroupContext } from './RadioGroupContext';\nimport './Radio.scss';\n\nexport type RadioProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Label til radio-button. Vises ved høyre side. */\n children?: React.ReactNode;\n /** Verdien til radioknappen */\n value: string;\n} & React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const Radio = React.forwardRef<HTMLInputElement, RadioProps>(\n (\n { className, children, value, disabled, ...rest },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const classList = cx(className, 'eds-form-component--radio__radio', {\n 'eds-form-component--radio__radio--disabled': disabled,\n });\n const { name, value: selectedValue, onChange } = useRadioGroupContext();\n return (\n <label className=\"eds-form-component--radio__container\">\n <input\n type=\"radio\"\n name={name}\n ref={ref}\n value={value}\n checked={selectedValue === value}\n onChange={onChange}\n disabled={disabled}\n {...rest}\n />\n <span className={classList}>\n <span className=\"eds-form-component--radio__circle\"></span>\n </span>\n {children && (\n <Paragraph\n margin=\"none\"\n as=\"span\"\n className=\"eds-form-component--radio__label\"\n >\n {children}\n </Paragraph>\n )}\n </label>\n );\n },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { useRadioGroupContext } from './RadioGroupContext';\nimport './RadioPanel.scss';\nimport { useRandomId } from '@entur/utils';\n\nexport type RadioPanelProps = {\n /** Verdien til RadioPanel */\n value: string;\n /** Hovedtittelen til RadioPanel */\n title: React.ReactNode;\n /** Ektstra label som står høyrestilt mot Checkboxen */\n secondaryLabel?: React.ReactNode;\n /** Ekstra informasjon som legges nederst i RadioPanel */\n children?: React.ReactNode;\n /** Størrelse på RadioPanel\n * @default \"medium\"\n */\n size?: 'medium' | 'large';\n /**Skjuler checkbox-en i RadioPanel\n * @default false\n */\n hideCheckbox?: boolean;\n /** Ekstra klassenavn */\n className?: string;\n /** Om RadioPanel er deaktivert eller ikke\n * @default false\n */\n disabled?: boolean;\n /** */\n style?: React.CSSProperties;\n} & Omit<\n React.DetailedHTMLProps<\n React.InputHTMLAttributes<HTMLInputElement>,\n HTMLInputElement\n >,\n 'title' | 'size'\n>;\n\nexport const RadioPanel = React.forwardRef<HTMLInputElement, RadioPanelProps>(\n (\n {\n className,\n children,\n value,\n title,\n secondaryLabel,\n size = 'medium',\n hideCheckbox = false,\n style,\n id,\n disabled = false,\n ...rest\n },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const classList = classNames(\n className,\n 'eds-radio-panel__container',\n `eds-radio-panel--${size}`,\n { 'eds-radio-panel--disabled': disabled },\n );\n\n const { name, value: selectedValue, onChange } = useRadioGroupContext();\n const randomId = useRandomId('eds-radiopanel');\n const radioPanelId = id || randomId;\n return (\n <label className=\"eds-radio-panel__wrapper\" htmlFor={radioPanelId}>\n <input\n type=\"radio\"\n name={name}\n ref={ref}\n value={value}\n checked={selectedValue === value}\n onChange={onChange}\n id={radioPanelId}\n disabled={disabled}\n {...rest}\n />\n <div className={classList} style={style}>\n <div className=\"eds-radio-panel__title-wrapper\">\n <div className=\"eds-radio-panel__title\">{title}</div>\n <div className=\"eds-radio-panel__label\">\n {secondaryLabel && <span>{secondaryLabel}</span>}\n {!(disabled || hideCheckbox) && (\n <span className=\"eds-radio-panel__check\">\n <RadioPanelCheck />\n </span>\n )}\n </div>\n </div>\n {children && (\n <div className=\"eds-radio-panel__additional-content\">\n {children}\n </div>\n )}\n </div>\n </label>\n );\n },\n);\n\nconst RadioPanelCheck: React.FC = () => {\n return (\n <svg\n className=\"eds-checkbox-icon\"\n width=\"22px\"\n height=\"16px\"\n viewBox=\"6 11 37 33\"\n >\n <path\n className=\"eds-checkbox-icon__path\"\n d=\"M14.1 27.2l7.1 7.2 14.6-14.8\"\n fill=\"none\"\n />\n </svg>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { colors } from '@entur/tokens';\nimport { CheckIcon, CloseSmallIcon } from '@entur/icons';\nimport './Switch.scss';\n\nexport type SwitchProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Label for Switch-en. */\n children?: React.ReactNode;\n /** Posisjonen til label for Switch-en.\n * @default \"right\"\n */\n labelPlacement?: 'right' | 'bottom';\n /** Om switch-en er checked eller ikke */\n checked?: boolean;\n /** Ikonet som skal stå inne i sirkelen på Switch-en */\n icon?: React.ReactNode;\n /** Skjul ikonet inne i sikrelen på Switch-en\n * @default false\n */\n hideIcon?: boolean;\n /** Farge som settes på ikon og bakgrunnen når Switch-en er \"checked\". Default er mint-contrast\n * @default colors.validation .mintContrast\n */\n color?: string;\n /** Lik som color, men når Switch-en står i en kontrast seksjon. Default er samme farge som color. */\n contrastColor?: string;\n /** Størrelsen på Switch-en\n * @default \"medium\"\n */\n size?: 'medium' | 'large';\n /** Callback for når verdien endres */\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n} & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>;\n\nexport const Switch = React.forwardRef<HTMLInputElement, SwitchProps>(\n (\n {\n className,\n children,\n labelPlacement = 'right',\n icon,\n hideIcon = false,\n color = colors.validation.mintContrast,\n contrastColor,\n size = 'medium',\n ...rest\n },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const chosenContrastColor = (contrastColor && contrastColor) || color;\n const displayedIcon = () => {\n if (icon) return icon;\n return rest.checked ? <CheckIcon /> : <CloseSmallIcon />;\n };\n return (\n <label\n className={classNames(\n 'eds-switch',\n `eds-switch--${labelPlacement}`,\n className,\n )}\n style={{ ...rest.style }}\n >\n <input type=\"checkbox\" ref={ref} {...rest} />\n <span\n className={classNames(\n 'eds-switch__switch',\n `eds-switch__switch--${size}`,\n )}\n style={\n {\n '--eds-switch-color': color,\n '--eds-switch-contrast-color': chosenContrastColor,\n } as React.CSSProperties\n }\n >\n <span className=\"eds-switch__circle\">\n {!hideIcon && displayedIcon()}\n </span>\n </span>\n {children && (\n <span\n className={classNames(\n 'eds-switch__label',\n `eds-switch__label--${size}--${labelPlacement}`,\n )}\n >\n {children}\n </span>\n )}\n </label>\n );\n },\n);\n","export function hasValue(value: any) {\n return value != null && !(Array.isArray(value) && value.length === 0);\n}\n\n// Determine if field is empty or filled.\n// Response determines if label is presented above field or as placeholder.\n//\n// @param obj\n// @param SSR\n// @returns {boolean} False when not present or empty string.\n// True when any number or string with length.\nexport function isFilled(obj: any, SSR = false) {\n return (\n obj &&\n ((hasValue(obj.value) && obj.value !== '') ||\n (SSR && hasValue(obj.defaultValue) && obj.defaultValue !== ''))\n );\n}\n","import React from 'react';\nimport { VariantType } from './VariantProvider';\nimport { BaseFormControl } from './BaseFormControl';\nimport './TextArea.scss';\nimport { useInputGroupContext } from './InputGroupContext';\nimport { useRandomId, useOnMount } from '@entur/utils';\nimport { isFilled } from './utils';\n\nexport type TextAreaProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Valideringsvariant */\n variant?: VariantType;\n /** Deaktiverer tekstområdet */\n disabled?: boolean;\n /** Setter tekstområdet i read-only modus */\n readOnly?: boolean;\n /** Label over TextArea */\n label: string;\n /** En tooltip som forklarer labelen til inputfeltet */\n labelTooltip?: React.ReactNode;\n /** Varselmelding, som vil komme under TextArea */\n feedback?: string;\n /** Plasserer labelen statisk på toppen av inputfeltet\n * @default false\n */\n disableLabelAnimation?: boolean;\n} & React.TextareaHTMLAttributes<HTMLTextAreaElement>;\n\nexport const TextArea = React.forwardRef<HTMLTextAreaElement, TextAreaProps>(\n (\n {\n variant,\n disabled = false,\n readOnly = false,\n className,\n style,\n label,\n feedback,\n labelTooltip,\n onChange,\n disableLabelAnimation,\n ...rest\n },\n ref: React.Ref<HTMLTextAreaElement>,\n ) => {\n const textAreaId = useRandomId('eds-textarea');\n return (\n <BaseFormControl\n className={className}\n disabled={disabled}\n readOnly={readOnly}\n variant={variant}\n style={style}\n label={label}\n labelId={textAreaId}\n feedback={feedback}\n labelTooltip={labelTooltip}\n labelProps={{ className: 'eds-textarea__label' }}\n disableLabelAnimation={disableLabelAnimation}\n >\n <TextAreaBase\n readOnly={readOnly}\n disabled={disabled}\n ref={ref}\n aria-labelledby={textAreaId}\n onChange={onChange}\n {...rest}\n />\n </BaseFormControl>\n );\n },\n);\n\ntype TextAreaBaseProps = {\n readOnly?: boolean;\n disabled?: boolean;\n} & React.TextareaHTMLAttributes<HTMLTextAreaElement>;\n\nconst TextAreaBase = React.forwardRef<HTMLTextAreaElement, TextAreaBaseProps>(\n ({ readOnly, disabled, onChange, value, ...rest }, ref) => {\n const { isFilled: isInputFilled, setFilled: setFiller } =\n useInputGroupContext();\n\n useOnMount(() => {\n if (value || rest.defaultValue) {\n setFiller && !isInputFilled && setFiller(true);\n }\n });\n React.useEffect(() => {\n if (value && setFiller && !isInputFilled) {\n setFiller(true);\n }\n }, [value, setFiller, isInputFilled]);\n\n const handleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n if (isFilled(event.target)) {\n setFiller && !isInputFilled && setFiller(true);\n } else {\n setFiller && isInputFilled && setFiller(false);\n }\n if (onChange) {\n onChange(event);\n }\n };\n\n return (\n <textarea\n className=\"eds-form-control eds-textarea\"\n ref={ref}\n readOnly={readOnly}\n disabled={disabled}\n onChange={handleChange}\n value={value}\n {...rest}\n />\n );\n },\n);\n","import { useRandomId, useOnMount } from '@entur/utils';\nimport React from 'react';\nimport { BaseFormControl } from './BaseFormControl';\nimport { useInputGroupContext } from './InputGroupContext';\nimport { useVariant, VariantType } from './VariantProvider';\nimport { isFilled } from './utils';\nimport { CloseSmallIcon } from '@entur/icons';\nimport './TextField.scss';\n\nexport type TextFieldProps = {\n /** Tekst eller ikon som kommer før inputfeltet */\n prepend?: React.ReactNode;\n /** Tekst eller ikon som kommer etter inputfeltet */\n append?: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Label over TextField */\n label: React.ReactNode;\n /** En tooltip som forklarer labelen til inputfeltet */\n labelTooltip?: React.ReactNode;\n /** Varselmelding, som vil komme under TextField */\n feedback?: string;\n /** Hvilken valideringsfarge som vises */\n variant?: VariantType;\n /** Deaktiver inputfeltet */\n disabled?: boolean;\n /** Setter inputfeltet i read-only modus */\n readOnly?: boolean;\n /** Størrelsen på TextField\n * @default \"medium\"\n */\n size?: 'medium' | 'large';\n /** Plasserer labelen statisk på toppen av inputfeltet\n * @default false\n */\n disableLabelAnimation?: boolean;\n /** Ekstra props som sendes til label-elementet */\n labelProps?: React.DetailedHTMLProps<\n React.LabelHTMLAttributes<HTMLLabelElement>,\n HTMLLabelElement\n >;\n /** Om man skal ha muliget for å nullstille TextField. Viser lukkekryss hvis feltet er fylt.\n * @default false\n */\n clearable?: boolean;\n /** Callback for clearable */\n onClear?: () => void;\n} & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'label'>;\n\nexport const TextField = React.forwardRef<HTMLInputElement, TextFieldProps>(\n (\n {\n prepend,\n append,\n variant,\n disabled = false,\n readOnly = false,\n className,\n style,\n size = 'medium',\n label,\n required,\n labelTooltip,\n feedback,\n onChange,\n disableLabelAnimation,\n labelProps,\n clearable = false,\n onClear,\n value,\n ...rest\n },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const randomId = useRandomId('eds-textfield');\n const textFieldId = labelProps && labelProps.id ? labelProps.id : randomId;\n\n return (\n <BaseFormControl\n disabled={disabled}\n readOnly={readOnly}\n variant={variant}\n prepend={prepend}\n append={\n clearable && onClear ? <ClearButton onClear={onClear} /> : append\n }\n className={className}\n style={style}\n size={size}\n label={label}\n required={required}\n labelTooltip={labelTooltip}\n labelId={textFieldId}\n feedback={feedback}\n disableLabelAnimation={disableLabelAnimation}\n labelProps={labelProps}\n >\n <TextFieldBase\n disabled={disabled}\n readOnly={readOnly}\n ref={ref}\n aria-labelledby={textFieldId}\n onChange={onChange}\n value={value}\n {...rest}\n />\n </BaseFormControl>\n );\n },\n);\n\ntype TextFieldBaseProps = {\n /** Deaktiver inputfeltet */\n disabled?: boolean;\n /** Setter inputfeltet i read-only modus */\n readOnly?: boolean;\n variant?: VariantType;\n} & React.DetailedHTMLProps<\n React.InputHTMLAttributes<HTMLInputElement>,\n HTMLInputElement\n>;\n\nconst TextFieldBase = React.forwardRef<HTMLInputElement, TextFieldBaseProps>(\n (\n { disabled, readOnly, placeholder, onChange, value, variant, ...rest },\n forwardRef,\n ) => {\n const contextVariant = useVariant();\n const currentVariant = variant || contextVariant;\n const { isFilled: isInputFilled, setFilled: setFiller } =\n useInputGroupContext();\n\n useOnMount(() => {\n if (value || rest.defaultValue) {\n setFiller && !isInputFilled && setFiller(true);\n }\n });\n React.useEffect(() => {\n if (value && setFiller && !isInputFilled) {\n setFiller(true);\n }\n }, [value, setFiller, isInputFilled]);\n\n const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n if (isFilled(event.target)) {\n setFiller && !isInputFilled && setFiller(true);\n } else {\n setFiller && isInputFilled && setFiller(false);\n }\n if (onChange) {\n onChange(event);\n }\n };\n\n return (\n <input\n aria-invalid={currentVariant === 'error'}\n className=\"eds-form-control\"\n disabled={disabled}\n readOnly={readOnly}\n ref={forwardRef}\n placeholder={placeholder}\n onChange={handleChange}\n value={value}\n {...rest}\n />\n );\n },\n);\n\nconst ClearButton: React.FC<{\n onClear: () => void;\n [key: string]: any;\n}> = ({ onClear, ...props }) => {\n const { isFilled: hasValue, setFilled } = useInputGroupContext();\n return (\n <div className=\"eds-textfield__clear-button-wrapper\">\n {hasValue && <div className=\"eds-textfield__divider\"></div>}\n {hasValue && (\n <button\n className=\"eds-textfield__clear-button\"\n type=\"button\"\n tabIndex={-1}\n onClick={() => {\n setFilled(false);\n onClear();\n }}\n {...props}\n >\n <CloseSmallIcon />\n </button>\n )}\n </div>\n );\n};\n","import React from 'react';\nimport { useRandomId } from '@entur/utils';\n\nexport type SelectedValues = { [key: string]: boolean };\nexport type SelectedValue = string | null;\nexport type SegmentedContextProps =\n | {\n name: string;\n onChange: (value: SelectedValues) => void;\n selectedValue: SelectedValues;\n multiple: true;\n size: 'medium' | 'large';\n }\n | {\n name: string;\n onChange: (value: SelectedValue) => void;\n selectedValue: SelectedValue;\n multiple: false;\n size: 'medium' | 'large';\n };\n\nconst SegmentedContext = React.createContext<SegmentedContextProps | null>(\n null,\n);\n\nexport type SegmentedProviderProps =\n | {\n name?: string;\n onChange?: (value: SelectedValues) => void;\n selectedValue: SelectedValues;\n multiple: true;\n size: 'medium' | 'large';\n }\n | {\n name?: string;\n onChange?: (value: SelectedValue) => void;\n selectedValue: SelectedValue;\n multiple: false;\n size: 'medium' | 'large';\n };\n\nexport const SegmentedProvider: React.FC<SegmentedProviderProps> = ({\n name,\n onChange = () => {},\n selectedValue,\n multiple,\n size,\n ...rest\n}) => {\n const generatedName = useRandomId('eds-segmented-control');\n const contextValue = React.useMemo(\n () => ({\n name: name || generatedName,\n onChange,\n multiple,\n selectedValue,\n size,\n }),\n [generatedName, multiple, name, onChange, selectedValue, size],\n ) as SegmentedContextProps;\n return <SegmentedContext.Provider value={contextValue} {...rest} />;\n};\n\nexport const useSegmentedContext = () => {\n const context = React.useContext(SegmentedContext);\n if (!context) {\n throw new Error(\n 'You need to wrap your SegmentedChoice in either SegmentedControl or MultipleSegmentedControl',\n );\n }\n return context;\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport {\n useSegmentedContext,\n SelectedValues,\n SelectedValue,\n} from './SegmentedContext';\nimport './SegmentedChoice.scss';\n\nexport type SegmentedChoiceProps = {\n /** Verdien til valget */\n value: string;\n /** Innhold som beskriver valget */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Callback som kalles når komponenten endres */\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n} & React.DetailedHTMLProps<\n React.InputHTMLAttributes<HTMLInputElement>,\n HTMLInputElement\n>;\n\nexport const SegmentedChoice = React.forwardRef<\n HTMLInputElement,\n SegmentedChoiceProps\n>(\n (\n { children, className, style, value, name, onChange = () => {}, ...rest },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const {\n name: commonName,\n selectedValue,\n onChange: commonOnChange,\n multiple,\n size,\n } = useSegmentedContext();\n\n const isChecked = multiple\n ? (selectedValue as SelectedValues)[value]\n : (selectedValue as SelectedValue) === value;\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n onChange(e);\n if (multiple) {\n commonOnChange({\n ...(selectedValue as SelectedValues),\n [value]: e.target.checked,\n } as any);\n } else if (e.target.checked) {\n commonOnChange(value as any);\n }\n };\n\n return (\n <label\n className={classNames('eds-segmented-choice', className, {\n 'eds-segmented-choide--large': size === 'large',\n })}\n style={style}\n >\n <input\n type={multiple ? 'checkbox' : 'radio'}\n name={name || commonName}\n checked={isChecked}\n value={value}\n onChange={handleChange}\n ref={ref}\n {...rest}\n />\n <div\n className={classNames('eds-base-segmented', {\n 'eds-base-segmented--large': size === 'large',\n })}\n >\n {children}\n </div>\n </label>\n );\n },\n);\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('form', 'icons', 'typography');\n\nexport * from './BaseFormControl';\nexport * from './Checkbox';\nexport * from './FeedbackText';\nexport * from './Fieldset';\nexport * from './InputGroupLabel';\nexport * from './InputGroupContext';\nexport * from './Radio';\nexport * from './RadioGroup';\nexport * from './RadioPanel';\nexport * from './Switch';\nexport * from './TravelSwitch';\nexport * from './TextArea';\nexport * from './TextField';\nexport * from './VariantProvider';\nexport * from './utils';\nexport * from './segmented-control/SegmentedChoice';\nexport * from './segmented-control/SegmentedControl';\nexport * from './segmented-control/MultipleSegmentedControl';\n","import React from 'react';\nimport { Label } from '@entur/typography';\nimport { SegmentedProvider, SelectedValues } from './SegmentedContext';\nimport './SegmentedControl.scss';\n\nexport type MultipleSegmentedControlProps = {\n /** Navn på input-elementene */\n name?: string;\n /** Beskrivende tekst */\n label?: string;\n /** En eller flere SegmentedChoice-komponenter */\n children: React.ReactNode;\n /** Den eller de valgte verdiene */\n selectedValue: SelectedValues;\n /** Callback for når det gjøres et valg */\n onChange: (value: SelectedValues) => void;\n [key: string]: any;\n};\n\n/**This component is not used by anyone, and is therefore deprecated\n * @deprecated\n */\nexport const MultipleSegmentedControl: React.FC<MultipleSegmentedControlProps> = ({\n children,\n label,\n name,\n onChange,\n selectedValue,\n ...rest\n}) => {\n return (\n <SegmentedProvider\n name={name}\n selectedValue={selectedValue}\n onChange={onChange}\n multiple={true}\n size=\"medium\"\n >\n <Label as=\"div\">{label}</Label>\n <div className=\"eds-segmented-control\" {...rest}>\n {children}\n </div>\n </SegmentedProvider>\n );\n};\n","import React from 'react';\nimport { RadioGroupContextProvider } from './RadioGroupContext';\nimport { Fieldset } from './Fieldset';\n\nexport type RadioGroupProps = {\n /** Navnet til radiogruppen. */\n name: string;\n /** Overskrift over radiogruppen */\n label?: string;\n /** Verdien til den valgte radioknappen */\n value: string | null;\n /** Radioknappene sendes inn som children */\n children: React.ReactNode;\n /** En callback som blir kalles hver gang en radioknapp klikkes på */\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n [key: string]: any;\n};\n\nexport const RadioGroup: React.FC<RadioGroupProps> = ({\n name,\n value,\n children,\n onChange,\n label,\n ...rest\n}) => {\n const contextValue = React.useMemo(() => ({ name, value, onChange }), [\n name,\n value,\n onChange,\n ]);\n return (\n <RadioGroupContextProvider value={contextValue}>\n {label ? (\n <Fieldset label={label} {...rest}>\n {children}\n </Fieldset>\n ) : (\n children\n )}\n </RadioGroupContextProvider>\n );\n};\n","import React from 'react';\nimport { Label } from '@entur/typography';\nimport { SegmentedProvider, SelectedValue } from './SegmentedContext';\nimport './SegmentedControl.scss';\nimport classNames from 'classnames';\n\nexport type SegmentedControlProps = {\n /** Navn på input-elementene */\n name?: string;\n /** Beskrivende tekst */\n label?: string;\n /** En eller flere SegmentedChoice-komponenter */\n children: React.ReactNode;\n /** Den valgte verdien */\n selectedValue: SelectedValue;\n /** Callback for når det gjøres et valg */\n onChange: (value: SelectedValue) => void;\n /** Størrelsen på SegmentedChoice-komponentene */\n size?: 'medium' | 'large';\n /** Ekstra klassenavn */\n className?: string;\n [key: string]: any;\n};\n\nexport const SegmentedControl: React.FC<SegmentedControlProps> = ({\n children,\n label,\n name,\n onChange,\n selectedValue,\n size = 'medium',\n className,\n ...rest\n}) => {\n return (\n <SegmentedProvider\n name={name}\n selectedValue={selectedValue}\n onChange={onChange}\n multiple={false}\n size={size}\n >\n <Label as=\"div\">{label}</Label>\n <div className={classNames('eds-segmented-control', className)} {...rest}>\n {children}\n </div>\n </SegmentedProvider>\n );\n};\n","import React from 'react';\nimport { Switch } from './Switch';\nimport { colors } from '@entur/tokens';\nimport {\n BusIcon,\n FerryIcon,\n TramIcon,\n PlaneIcon,\n TrainIcon,\n BicycleIcon,\n ScooterIcon,\n SubwayIcon,\n} from '@entur/icons';\nimport './Switch.scss';\n\nexport type TravelSwitchProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Om switchen er checked eller ikke */\n checked?: boolean;\n /** Label for TravelSwitch-en. */\n children?: React.ReactNode;\n /** Posisjonen til label for TravelSwitch-en.\n * @default \"right\"\n */\n labelPlacement?: 'right' | 'bottom';\n /** Hvilken type reise som skal vises rikig ikon og farge for */\n transport: // When adding a new submode, check https://enturas.atlassian.net/wiki/spaces/PUBLIC/pages/825393529/Norwegian+submodes+and+their+definitions for names\n | 'bus'\n | 'metro'\n | 'air'\n | 'tram'\n | 'rail'\n | 'water'\n | 'bike'\n | 'airportLinkBus'\n | 'airportLinkRail'\n | 'scooter';\n /** Callback for når verdien endres */\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /** Størrelsen på Switchen\n * @default \"medium\"\n */\n size?: 'medium' | 'large';\n} & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>;\n\nexport const TravelSwitch: React.FC<TravelSwitchProps> = ({\n className,\n children,\n labelPlacement = 'right',\n transport,\n size,\n ...rest\n}) => {\n const { color, contrast, Icon } = modeCalc(transport);\n return (\n <Switch\n className={className}\n labelPlacement={labelPlacement}\n color={color}\n contrastColor={contrast}\n icon={<Icon />}\n size={size}\n {...rest}\n >\n {children}\n </Switch>\n );\n};\n\nfunction modeCalc(mode: string) {\n switch (mode) {\n case 'bus':\n return {\n Icon: BusIcon,\n color: colors.transport.default.bus,\n contrast: colors.transport.contrast.bus,\n };\n case 'metro':\n return {\n Icon: SubwayIcon,\n color: colors.transport.default.metro,\n contrast: colors.transport.contrast.metro,\n };\n case 'air':\n return {\n Icon: PlaneIcon,\n color: colors.transport.default.plane,\n contrast: colors.transport.contrast.plane,\n };\n case 'tram':\n return {\n Icon: TramIcon,\n color: colors.transport.default.tram,\n contrast: colors.transport.contrast.tram,\n };\n case 'rail':\n return {\n Icon: TrainIcon,\n color: colors.transport.default.train,\n contrast: colors.transport.contrast.train,\n };\n case 'water':\n return {\n Icon: FerryIcon,\n color: colors.transport.default.ferry,\n contrast: colors.transport.contrast.ferry,\n };\n case 'bike':\n return {\n Icon: BicycleIcon,\n color: colors.transport.default.mobility,\n contrast: colors.transport.contrast.mobility,\n };\n case 'scooter':\n return {\n Icon: ScooterIcon,\n color: colors.transport.default.mobility,\n contrast: colors.transport.contrast.mobility,\n };\n case 'airportLinkBus':\n return {\n Icon: BusIcon,\n color: colors.transport.default.plane,\n contrast: colors.transport.contrast.plane,\n };\n case 'airportLinkRail':\n return {\n Icon: TrainIcon,\n color: colors.transport.default.plane,\n contrast: colors.transport.contrast.plane,\n };\n default:\n throw Error('Please select a transport for the TravelSwitch.');\n }\n}\n"],"names":["AlertIcon","variant","iconClass","React","ValidationCheckIcon","className","ValidationErrorIcon","ValidationExclamationIcon","FeedbackText","children","hideIcon","rest","SubLabel","classNames","InputGroupContext","createContext","isFilled","setFilled","InputGroupContextProvider","useState","Provider","value","useInputGroupContext","useContext","InputGroupLabel","label","required","labelId","staticAnimation","filler","id","VariantContext","useVariant","BaseFormControl","forwardRef","ref","dark","disabled","readOnly","prepend","append","size","labelTooltip","feedback","labelProps","style","disableLabelAnimation","contextVariant","currentVariant","Tooltip","content","placement","QuestionIcon","Checkbox","checked","reduceClickArea","innerRef","useRef","useImperativeHandle","current","isIndeterminate","isControlled","undefined","useEffect","indeterminate","cx","type","CheckboxIcon","Paragraph","margin","as","width","height","viewBox","x","y","fill","d","Fieldset","Label","RadioGroupContext","RadioGroupContextProvider","useRadioGroupContext","context","Error","Radio","classList","name","onChange","RadioPanel","title","secondaryLabel","hideCheckbox","selectedValue","randomId","useRandomId","radioPanelId","htmlFor","RadioPanelCheck","Switch","labelPlacement","icon","color","colors","validation","mintContrast","contrastColor","chosenContrastColor","CheckIcon","CloseSmallIcon","hasValue","Array","isArray","length","obj","SSR","defaultValue","TextArea","textAreaId","TextAreaBase","isInputFilled","setFiller","useOnMount","event","target","TextField","clearable","onClear","textFieldId","ClearButton","TextFieldBase","placeholder","props","tabIndex","onClick","SegmentedContext","SegmentedProvider","multiple","generatedName","contextValue","useMemo","SegmentedChoice","useSegmentedContext","commonName","commonOnChange","isChecked","e","warnAboutMissingStyles","transport","mode","Icon","BusIcon","bus","contrast","SubwayIcon","metro","PlaneIcon","plane","TramIcon","tram","TrainIcon","train","FerryIcon","ferry","BicycleIcon","mobility","ScooterIcon","modeCalc"],"mappings":"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"}
1
+ {"version":3,"file":"form.cjs.production.min.js","sources":["../src/FeedbackText.tsx","../src/InputGroupContext.tsx","../src/InputGroupLabel.tsx","../src/VariantProvider.tsx","../src/BaseFormControl.tsx","../src/Checkbox.tsx","../src/Fieldset.tsx","../src/RadioGroupContext.tsx","../src/Radio.tsx","../src/RadioPanel.tsx","../src/Switch.tsx","../src/utils.ts","../src/TextArea.tsx","../src/TextField.tsx","../src/segmented-control/SegmentedContext.tsx","../src/segmented-control/SegmentedChoice.tsx","../src/index.tsx","../src/segmented-control/MultipleSegmentedControl.tsx","../src/RadioGroup.tsx","../src/segmented-control/SegmentedControl.tsx","../src/TravelSwitch.tsx"],"sourcesContent":["import React from 'react';\nimport {\n ValidationCheckIcon,\n ValidationErrorIcon,\n ValidationExclamationIcon,\n} from '@entur/icons';\nimport { SubLabel } from '@entur/typography';\nimport { VariantType } from './VariantProvider';\nimport classNames from 'classnames';\nimport './FeedbackText.scss';\n\nconst AlertIcon: React.FC<{ variant: VariantType }> = ({ variant }) => {\n const iconClass = `eds-feedback-text__icon eds-feedback-text__icon--${variant}`;\n switch (variant) {\n case 'success':\n return <ValidationCheckIcon className={iconClass} />;\n case 'error':\n return <ValidationErrorIcon className={iconClass} />;\n case 'info':\n return null;\n case 'warning':\n return <ValidationExclamationIcon className={iconClass} />;\n default:\n return null;\n }\n};\n\nexport type FeedbackTextProps = {\n /** Teksten som vises */\n children: React.ReactNode;\n /** Skjuler ikonet */\n hideIcon?: boolean;\n /** Feedbackvarianten */\n variant: VariantType;\n /** Ekstra klassenavn */\n className?: string;\n [key: string]: any;\n};\nexport const FeedbackText: React.FC<FeedbackTextProps> = ({\n children,\n hideIcon = false,\n variant,\n className,\n ...rest\n}) => {\n return (\n <SubLabel\n className={classNames(\n 'eds-feedback-text',\n { 'eds-feedback-text--info': variant === 'info' },\n className,\n )}\n {...rest}\n >\n {!hideIcon && <AlertIcon variant={variant} />}\n <span className=\"eds-feedback-text__text\">{children}</span>\n </SubLabel>\n );\n};\n","import * as React from 'react';\n\ntype InputGroupContextType = {\n isFilled: boolean;\n setFilled: (e: boolean) => void;\n};\n\nconst InputGroupContext = React.createContext<InputGroupContextType>({\n isFilled: false,\n setFilled: () => null,\n});\n\nexport const InputGroupContextProvider: React.FC<{\n children: React.ReactNode;\n}> = ({ children }) => {\n const [filled, setFilled] = React.useState(false);\n return (\n <InputGroupContext.Provider\n value={{ isFilled: filled, setFilled: setFilled }}\n >\n {children}\n </InputGroupContext.Provider>\n );\n};\n\nexport const useInputGroupContext: () => InputGroupContextType = () =>\n React.useContext(InputGroupContext);\n","import classNames from 'classnames';\nimport React from 'react';\nimport { useInputGroupContext } from './InputGroupContext';\nimport './InputGroupLabel.scss';\n\nexport type InputGroupLabelProps = {\n label?: React.ReactNode;\n required?: boolean;\n labelTooltip?: string;\n labelId: string;\n staticAnimation?: boolean;\n} & React.DetailedHTMLProps<\n React.LabelHTMLAttributes<HTMLLabelElement>,\n HTMLLabelElement\n>;\n\nexport const InputGroupLabel: React.FC<InputGroupLabelProps> = ({\n label,\n required,\n labelId,\n staticAnimation = false,\n ...rest\n}) => {\n const { isFilled } = useInputGroupContext();\n const filler = staticAnimation || isFilled;\n return (\n <label\n className={classNames(rest.className, {\n 'eds-input-group-label-wrapper--filled': filler,\n })}\n id={labelId}\n {...rest}\n >\n <span\n className={classNames('eds-input-group__label', {\n 'eds-input-group__label--filled': filler,\n })}\n >\n {label} {required && <span>*</span>}\n </span>\n </label>\n );\n};\n","import React from 'react';\n\nexport type VariantType = 'success' | 'error' | 'warning' | 'info';\n\nconst VariantContext = React.createContext<VariantType | null>(null);\n\nexport type VariantProviderProps = {\n variant?: VariantType;\n};\nexport const VariantProvider: React.FC<VariantProviderProps> = ({\n children,\n variant = null,\n}) => {\n return (\n <VariantContext.Provider value={variant}>\n {children}\n </VariantContext.Provider>\n );\n};\n\nexport const useVariant: () => VariantType | null = () => {\n const context = React.useContext(VariantContext);\n return context;\n};\n","import { Tooltip } from '@entur/tooltip';\nimport classNames from 'classnames';\nimport React from 'react';\nimport './BaseFormControl.scss';\nimport { FeedbackText } from './FeedbackText';\nimport { InputGroupContextProvider } from './InputGroupContext';\nimport { InputGroupLabel } from './InputGroupLabel';\nimport { useVariant, VariantType } from './VariantProvider';\nimport { QuestionIcon } from '@entur/icons';\n\nexport type BaseFormControlProps = {\n /** Et skjemaelement med `eds-form-control`-klassen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Sett til true om skjema-elementet skal ha mørkt design i contrast mode */\n dark?: boolean;\n /** Sett til true om skjema-elementet er disabled */\n disabled?: boolean;\n /** Sett til true om skjema-elementet er i read-only modus */\n readOnly?: boolean;\n /** Tekst eller ikon som vises foran skjema-elementet */\n prepend?: React.ReactNode;\n /** Tekst eller ikon som vises etter skjema-elementet */\n append?: React.ReactNode;\n /** Valideringsvariant */\n variant?: VariantType;\n /**Størrelsen på skjemaelementet\n * @default \"medium\"\n */\n size?: 'medium' | 'large';\n /** Label til inputfeltet */\n label: React.ReactNode;\n /** En tooltip som forklarer labelen til inputfeltet */\n labelTooltip?: React.ReactNode;\n /** Illustrerer om inputfeltet er påkrevd eller ikke */\n required?: boolean;\n /** ID som settes på labelen til inputfeltet */\n labelId: string;\n /** Varselmelding, som vil komme under form-komponenten */\n feedback?: string;\n /** Om inputfeltet er fylt med data. Brukes for plassering av label */\n isFilled?: boolean;\n /**Ekstra props som sendes til label */\n labelProps?: { [key: string]: any };\n /** Ekstra styling */\n style?: React.CSSProperties;\n /** Plasserer labelen statisk på toppen av inputfeltet */\n disableLabelAnimation?: boolean;\n /** Setter feedbackText sin rolle til \"alert\" */\n ariaAlertOnFeedback?: boolean;\n};\n\nexport const BaseFormControl = React.forwardRef<\n HTMLDivElement,\n BaseFormControlProps\n>(\n (\n {\n children,\n className,\n dark = false,\n disabled = false,\n readOnly = false,\n variant,\n prepend,\n append,\n size = 'medium',\n isFilled,\n label,\n required,\n labelTooltip,\n feedback,\n labelId,\n labelProps,\n style,\n disableLabelAnimation = false,\n ariaAlertOnFeedback = false,\n ...rest\n },\n ref,\n ) => {\n const contextVariant = useVariant();\n const currentVariant = variant || contextVariant;\n\n return (\n <InputGroupContextProvider>\n <div\n className={classNames(\n 'eds-form-control-wrapper',\n className,\n `eds-form-control-wrapper--size-${size}`,\n {\n 'eds-form-control-wrapper--success': currentVariant === 'success',\n 'eds-form-control-wrapper--error': currentVariant === 'error',\n 'eds-form-control-wrapper--dark': dark,\n 'eds-form-control-wrapper--disabled': disabled,\n 'eds-form-control-wrapper--readonly': readOnly,\n 'eds-form-control-wrapper--is-filled': isFilled,\n },\n )}\n ref={ref}\n style={style}\n {...rest}\n >\n {prepend && (\n <div className=\"eds-form-control__prepend\">{prepend}</div>\n )}\n <InputGroupLabel\n label={label}\n required={required}\n labelId={labelId}\n staticAnimation={disableLabelAnimation}\n {...labelProps}\n />\n {children}\n {append && <div className=\"eds-form-control__append\">{append}</div>}\n {labelTooltip && (\n <div className=\"eds-form-control__append eds-form-control__append--tooltip\">\n <Tooltip content={labelTooltip} placement=\"right\">\n <span className=\"eds-input-group__label-tooltip-icon\">\n <QuestionIcon />\n </span>\n </Tooltip>\n </div>\n )}\n </div>\n {feedback && currentVariant && (\n <FeedbackText\n variant={currentVariant}\n role={ariaAlertOnFeedback ? 'alert' : undefined}\n >\n {feedback}\n </FeedbackText>\n )}\n </InputGroupContextProvider>\n );\n },\n);\n","import React, { CSSProperties } from 'react';\nimport { Paragraph } from '@entur/typography';\nimport cx from 'classnames';\nimport './Checkbox.scss';\n\nexport type CheckboxProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Label for checkboxen, som vises ved høyre side. */\n children?: React.ReactNode;\n /** Om Checkbox er avmerket, eller om den */\n checked?: 'indeterminate' | boolean;\n /** Callback for Checkbox */\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /** Om checkboxen er disabled eller ikke\n * @default false\n */\n disabled?: boolean;\n /**Ekstra styling til komponenten */\n style?: CSSProperties;\n /** Reduserer klikkflaten for Checkbox'en\n * @default false\n */\n reduceClickArea?: boolean;\n} & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'checked'>;\n\nexport const Checkbox = React.forwardRef<HTMLInputElement, CheckboxProps>(\n (\n {\n checked,\n className,\n children,\n style,\n disabled = false,\n reduceClickArea,\n ...rest\n },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n // Trick to allow using a ref locally, while still allowing for ref forwarding\n // Read more at https://reactjs.org/docs/hooks-reference.html#useimperativehandle\n const innerRef = React.useRef<HTMLInputElement>(null);\n //eslint-disable-next-line\n React.useImperativeHandle(ref, () => innerRef.current!);\n\n const isIndeterminate = checked === 'indeterminate';\n const isControlled = checked !== undefined;\n\n React.useEffect(() => {\n if (innerRef && innerRef.current) {\n innerRef.current.indeterminate = isIndeterminate;\n }\n }, [isIndeterminate]);\n\n return (\n <label\n className={cx('eds-checkbox__container', className, {\n 'eds-checkbox--disabled': disabled,\n 'eds-checkbox__container--reduced-click-area': reduceClickArea,\n })}\n style={style}\n >\n <input\n type=\"checkbox\"\n ref={innerRef}\n checked={isControlled ? checked === true : undefined}\n disabled={disabled}\n {...rest}\n />\n <span\n className={cx('eds-checkbox__icon', {\n 'eds-checkbox__icon--disabled': disabled,\n 'eds-checkbox__icon--reduced-click-area': reduceClickArea,\n })}\n >\n <CheckboxIcon indeterminate={isIndeterminate} />\n </span>\n {children && (\n <Paragraph className=\"eds-checkbox__label\" margin=\"none\" as=\"span\">\n {children}\n </Paragraph>\n )}\n </label>\n );\n },\n);\n\nconst CheckboxIcon: React.FC<{ indeterminate: boolean }> = ({\n indeterminate = false,\n}) => {\n return (\n <svg\n className=\"eds-checkbox-icon\"\n width=\"11px\"\n height=\"9px\"\n viewBox=\"6 11 37 33\"\n >\n {indeterminate ? (\n <rect x=\"10\" y=\"25\" width=\"28\" height=\"5\" fill=\"white\" />\n ) : (\n <path\n className=\"eds-checkbox-icon__path\"\n d=\"M14.1 27.2l7.1 7.2 14.6-14.8\"\n fill=\"none\"\n />\n )}\n </svg>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { Label } from '@entur/typography';\nimport './Fieldset.scss';\n\nexport type FieldsetProps = {\n /** Innholdet i felt-gruppen. */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Labelen til felt-gruppen. */\n label?: React.ReactNode;\n [key: string]: any;\n};\n\nexport const Fieldset: React.FC<FieldsetProps> = ({\n children,\n className,\n label,\n ...rest\n}) => (\n <fieldset className={classNames('eds-fieldset', className)} {...rest}>\n {label && (\n <Label as=\"legend\" className=\"eds-legend\">\n {label}\n </Label>\n )}\n {children}\n </fieldset>\n);\n","import React from 'react';\n\ntype RadioGroupContextProps = {\n name: string;\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n value: string | null;\n};\n\nconst RadioGroupContext = React.createContext<RadioGroupContextProps | null>(\n null,\n);\n\nexport const RadioGroupContextProvider = RadioGroupContext.Provider;\n\nexport const useRadioGroupContext: () => RadioGroupContextProps = () => {\n const context = React.useContext(RadioGroupContext);\n if (!context) {\n throw new Error(\n 'You need to wrap your RadioButtons in a RadioGroup component',\n );\n }\n return context;\n};\n","import React from 'react';\nimport cx from 'classnames';\nimport { Paragraph } from '@entur/typography';\nimport { useRadioGroupContext } from './RadioGroupContext';\nimport './Radio.scss';\n\nexport type RadioProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Label til radio-button. Vises ved høyre side. */\n children?: React.ReactNode;\n /** Verdien til radioknappen */\n value: string;\n} & React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const Radio = React.forwardRef<HTMLInputElement, RadioProps>(\n (\n { className, children, value, disabled, ...rest },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const classList = cx(className, 'eds-form-component--radio__radio', {\n 'eds-form-component--radio__radio--disabled': disabled,\n });\n const { name, value: selectedValue, onChange } = useRadioGroupContext();\n return (\n <label className=\"eds-form-component--radio__container\">\n <input\n type=\"radio\"\n name={name}\n ref={ref}\n value={value}\n checked={selectedValue === value}\n onChange={onChange}\n disabled={disabled}\n {...rest}\n />\n <span className={classList}>\n <span className=\"eds-form-component--radio__circle\"></span>\n </span>\n {children && (\n <Paragraph\n margin=\"none\"\n as=\"span\"\n className=\"eds-form-component--radio__label\"\n >\n {children}\n </Paragraph>\n )}\n </label>\n );\n },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { useRadioGroupContext } from './RadioGroupContext';\nimport './RadioPanel.scss';\nimport { useRandomId } from '@entur/utils';\n\nexport type RadioPanelProps = {\n /** Verdien til RadioPanel */\n value: string;\n /** Hovedtittelen til RadioPanel */\n title: React.ReactNode;\n /** Ektstra label som står høyrestilt mot Checkboxen */\n secondaryLabel?: React.ReactNode;\n /** Ekstra informasjon som legges nederst i RadioPanel */\n children?: React.ReactNode;\n /** Størrelse på RadioPanel\n * @default \"medium\"\n */\n size?: 'medium' | 'large';\n /**Skjuler checkbox-en i RadioPanel\n * @default false\n */\n hideCheckbox?: boolean;\n /** Ekstra klassenavn */\n className?: string;\n /** Om RadioPanel er deaktivert eller ikke\n * @default false\n */\n disabled?: boolean;\n /** */\n style?: React.CSSProperties;\n} & Omit<\n React.DetailedHTMLProps<\n React.InputHTMLAttributes<HTMLInputElement>,\n HTMLInputElement\n >,\n 'title' | 'size'\n>;\n\nexport const RadioPanel = React.forwardRef<HTMLInputElement, RadioPanelProps>(\n (\n {\n className,\n children,\n value,\n title,\n secondaryLabel,\n size = 'medium',\n hideCheckbox = false,\n style,\n id,\n disabled = false,\n ...rest\n },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const classList = classNames(\n className,\n 'eds-radio-panel__container',\n `eds-radio-panel--${size}`,\n { 'eds-radio-panel--disabled': disabled },\n );\n\n const { name, value: selectedValue, onChange } = useRadioGroupContext();\n const randomId = useRandomId('eds-radiopanel');\n const radioPanelId = id || randomId;\n return (\n <label className=\"eds-radio-panel__wrapper\" htmlFor={radioPanelId}>\n <input\n type=\"radio\"\n name={name}\n ref={ref}\n value={value}\n checked={selectedValue === value}\n onChange={onChange}\n id={radioPanelId}\n disabled={disabled}\n {...rest}\n />\n <div className={classList} style={style}>\n <div className=\"eds-radio-panel__title-wrapper\">\n <div className=\"eds-radio-panel__title\">{title}</div>\n <div className=\"eds-radio-panel__label\">\n {secondaryLabel && <span>{secondaryLabel}</span>}\n {!(disabled || hideCheckbox) && (\n <span className=\"eds-radio-panel__check\">\n <RadioPanelCheck />\n </span>\n )}\n </div>\n </div>\n {children && (\n <div className=\"eds-radio-panel__additional-content\">\n {children}\n </div>\n )}\n </div>\n </label>\n );\n },\n);\n\nconst RadioPanelCheck: React.FC = () => {\n return (\n <svg\n className=\"eds-checkbox-icon\"\n width=\"22px\"\n height=\"16px\"\n viewBox=\"6 11 37 33\"\n >\n <path\n className=\"eds-checkbox-icon__path\"\n d=\"M14.1 27.2l7.1 7.2 14.6-14.8\"\n fill=\"none\"\n />\n </svg>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { colors } from '@entur/tokens';\nimport { CheckIcon, CloseSmallIcon } from '@entur/icons';\nimport './Switch.scss';\n\nexport type SwitchProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Label for Switch-en. */\n children?: React.ReactNode;\n /** Posisjonen til label for Switch-en.\n * @default \"right\"\n */\n labelPlacement?: 'right' | 'bottom';\n /** Om switch-en er checked eller ikke */\n checked?: boolean;\n /** Ikonet som skal stå inne i sirkelen på Switch-en */\n icon?: React.ReactNode;\n /** Skjul ikonet inne i sikrelen på Switch-en\n * @default false\n */\n hideIcon?: boolean;\n /** Farge som settes på ikon og bakgrunnen når Switch-en er \"checked\". Default er mint-contrast\n * @default colors.validation .mintContrast\n */\n color?: string;\n /** Lik som color, men når Switch-en står i en kontrast seksjon. Default er samme farge som color. */\n contrastColor?: string;\n /** Størrelsen på Switch-en\n * @default \"medium\"\n */\n size?: 'medium' | 'large';\n /** Callback for når verdien endres */\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n} & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>;\n\nexport const Switch = React.forwardRef<HTMLInputElement, SwitchProps>(\n (\n {\n className,\n children,\n labelPlacement = 'right',\n icon,\n hideIcon = false,\n color = colors.validation.mintContrast,\n contrastColor,\n size = 'medium',\n ...rest\n },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const chosenContrastColor = (contrastColor && contrastColor) || color;\n const displayedIcon = () => {\n if (icon) return icon;\n return rest.checked ? <CheckIcon /> : <CloseSmallIcon />;\n };\n return (\n <label\n className={classNames(\n 'eds-switch',\n `eds-switch--${labelPlacement}`,\n className,\n )}\n style={{ ...rest.style }}\n >\n <input type=\"checkbox\" ref={ref} {...rest} />\n <span\n className={classNames(\n 'eds-switch__switch',\n `eds-switch__switch--${size}`,\n )}\n style={\n {\n '--eds-switch-color': color,\n '--eds-switch-contrast-color': chosenContrastColor,\n } as React.CSSProperties\n }\n >\n <span className=\"eds-switch__circle\">\n {!hideIcon && displayedIcon()}\n </span>\n </span>\n {children && (\n <span\n className={classNames(\n 'eds-switch__label',\n `eds-switch__label--${size}--${labelPlacement}`,\n )}\n >\n {children}\n </span>\n )}\n </label>\n );\n },\n);\n","// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types -- disabled during Yarn upgrade\nexport function hasValue(value: any): boolean {\n return value != null && !(Array.isArray(value) && value.length === 0);\n}\n\n// Determine if field is empty or filled.\n// Response determines if label is presented above field or as placeholder.\n//\n// @param obj\n// @param SSR\n// @returns {boolean} False when not present or empty string.\n// True when any number or string with length.\n// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types -- disabled during Yarn upgrade\nexport function isFilled(obj: any, SSR = false): boolean {\n return (\n obj &&\n ((hasValue(obj.value) && obj.value !== '') ||\n (SSR && hasValue(obj.defaultValue) && obj.defaultValue !== ''))\n );\n}\n","import React from 'react';\nimport { useVariant, VariantType } from './VariantProvider';\nimport { BaseFormControl } from './BaseFormControl';\nimport './TextArea.scss';\nimport { useInputGroupContext } from './InputGroupContext';\nimport { useRandomId, useOnMount } from '@entur/utils';\nimport { isFilled } from './utils';\n\nexport type TextAreaProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Valideringsvariant */\n variant?: VariantType;\n /** Deaktiverer tekstområdet */\n disabled?: boolean;\n /** Setter tekstområdet i read-only modus */\n readOnly?: boolean;\n /** Label over TextArea */\n label: string;\n /** En tooltip som forklarer labelen til inputfeltet */\n labelTooltip?: React.ReactNode;\n /** Varselmelding, som vil komme under TextArea */\n feedback?: string;\n /** Plasserer labelen statisk på toppen av inputfeltet\n * @default false\n */\n disableLabelAnimation?: boolean;\n} & React.TextareaHTMLAttributes<HTMLTextAreaElement>;\n\nexport const TextArea = React.forwardRef<HTMLTextAreaElement, TextAreaProps>(\n (\n {\n variant,\n disabled = false,\n readOnly = false,\n className,\n style,\n label,\n feedback,\n labelTooltip,\n onChange,\n disableLabelAnimation,\n ...rest\n },\n ref: React.Ref<HTMLTextAreaElement>,\n ) => {\n const textAreaId = useRandomId('eds-textarea');\n return (\n <BaseFormControl\n className={className}\n disabled={disabled}\n readOnly={readOnly}\n variant={variant}\n style={style}\n label={label}\n labelId={textAreaId}\n feedback={feedback}\n labelTooltip={labelTooltip}\n labelProps={{ className: 'eds-textarea__label' }}\n disableLabelAnimation={disableLabelAnimation}\n >\n <TextAreaBase\n readOnly={readOnly}\n disabled={disabled}\n ref={ref}\n aria-labelledby={textAreaId}\n onChange={onChange}\n variant={variant}\n {...rest}\n />\n </BaseFormControl>\n );\n },\n);\n\ntype TextAreaBaseProps = {\n readOnly?: boolean;\n disabled?: boolean;\n variant?: VariantType;\n} & React.TextareaHTMLAttributes<HTMLTextAreaElement>;\n\nconst TextAreaBase = React.forwardRef<HTMLTextAreaElement, TextAreaBaseProps>(\n ({ readOnly, disabled, onChange, value, variant, ...rest }, ref) => {\n const contextVariant = useVariant();\n const currentVariant = variant || contextVariant;\n const { isFilled: isInputFilled, setFilled: setFiller } =\n useInputGroupContext();\n\n useOnMount(() => {\n if (value || rest.defaultValue) {\n setFiller && !isInputFilled && setFiller(true);\n }\n });\n React.useEffect(() => {\n if (value && setFiller && !isInputFilled) {\n setFiller(true);\n }\n }, [value, setFiller, isInputFilled]);\n\n const handleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n if (isFilled(event.target)) {\n setFiller && !isInputFilled && setFiller(true);\n } else {\n setFiller && isInputFilled && setFiller(false);\n }\n if (onChange) {\n onChange(event);\n }\n };\n\n return (\n <textarea\n className=\"eds-form-control eds-textarea\"\n ref={ref}\n readOnly={readOnly}\n disabled={disabled}\n onChange={handleChange}\n value={value}\n aria-invalid={currentVariant === 'error'}\n {...rest}\n />\n );\n },\n);\n","import { useRandomId, useOnMount } from '@entur/utils';\nimport React from 'react';\nimport { BaseFormControl } from './BaseFormControl';\nimport { useInputGroupContext } from './InputGroupContext';\nimport { useVariant, VariantType } from './VariantProvider';\nimport { isFilled } from './utils';\nimport { CloseSmallIcon } from '@entur/icons';\nimport './TextField.scss';\n\nexport type TextFieldProps = {\n /** Tekst eller ikon som kommer før inputfeltet */\n prepend?: React.ReactNode;\n /** Tekst eller ikon som kommer etter inputfeltet */\n append?: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Label over TextField */\n label: React.ReactNode;\n /** En tooltip som forklarer labelen til inputfeltet */\n labelTooltip?: React.ReactNode;\n /** Varselmelding, som vil komme under TextField */\n feedback?: string;\n /** Hvilken valideringsfarge som vises */\n variant?: VariantType;\n /** Deaktiver inputfeltet */\n disabled?: boolean;\n /** Setter inputfeltet i read-only modus */\n readOnly?: boolean;\n /** Størrelsen på TextField\n * @default \"medium\"\n */\n size?: 'medium' | 'large';\n /** Plasserer labelen statisk på toppen av inputfeltet\n * @default false\n */\n disableLabelAnimation?: boolean;\n /** Ekstra props som sendes til label-elementet */\n labelProps?: React.DetailedHTMLProps<\n React.LabelHTMLAttributes<HTMLLabelElement>,\n HTMLLabelElement\n >;\n /** Om man skal ha muliget for å nullstille TextField. Viser lukkekryss hvis feltet er fylt.\n * @default false\n */\n clearable?: boolean;\n /** Callback for clearable */\n onClear?: () => void;\n ariaAlertOnFeedback?: boolean;\n} & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'label'>;\n\nexport const TextField = React.forwardRef<HTMLInputElement, TextFieldProps>(\n (\n {\n prepend,\n append,\n variant,\n disabled = false,\n readOnly = false,\n className,\n style,\n size = 'medium',\n label,\n required,\n labelTooltip,\n feedback,\n onChange,\n disableLabelAnimation,\n labelProps,\n clearable = false,\n onClear,\n value,\n ariaAlertOnFeedback = false,\n ...rest\n },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const randomId = useRandomId('eds-textfield');\n const textFieldId = labelProps && labelProps.id ? labelProps.id : randomId;\n return (\n <BaseFormControl\n disabled={disabled}\n readOnly={readOnly}\n variant={variant}\n prepend={prepend}\n append={\n clearable && onClear ? <ClearButton onClear={onClear} /> : append\n }\n className={className}\n style={style}\n size={size}\n label={label}\n required={required}\n labelTooltip={labelTooltip}\n labelId={textFieldId}\n feedback={feedback}\n disableLabelAnimation={disableLabelAnimation}\n labelProps={labelProps}\n ariaAlertOnFeedback={ariaAlertOnFeedback}\n >\n <TextFieldBase\n disabled={disabled}\n readOnly={readOnly}\n ref={ref}\n aria-labelledby={textFieldId}\n onChange={onChange}\n value={value}\n variant={variant}\n {...rest}\n />\n </BaseFormControl>\n );\n },\n);\n\ntype TextFieldBaseProps = {\n /** Deaktiver inputfeltet */\n disabled?: boolean;\n /** Setter inputfeltet i read-only modus */\n readOnly?: boolean;\n variant?: VariantType;\n} & React.DetailedHTMLProps<\n React.InputHTMLAttributes<HTMLInputElement>,\n HTMLInputElement\n>;\n\nconst TextFieldBase = React.forwardRef<HTMLInputElement, TextFieldBaseProps>(\n (\n { disabled, readOnly, placeholder, onChange, value, variant, ...rest },\n forwardRef,\n ) => {\n const contextVariant = useVariant();\n const currentVariant = variant || contextVariant;\n const { isFilled: isInputFilled, setFilled: setFiller } =\n useInputGroupContext();\n\n useOnMount(() => {\n if (value || rest.defaultValue) {\n setFiller && !isInputFilled && setFiller(true);\n }\n });\n React.useEffect(() => {\n if (value && setFiller && !isInputFilled) {\n setFiller(true);\n }\n }, [value, setFiller, isInputFilled]);\n\n const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n if (isFilled(event.target)) {\n setFiller && !isInputFilled && setFiller(true);\n } else {\n setFiller && isInputFilled && setFiller(false);\n }\n if (onChange) {\n onChange(event);\n }\n };\n\n return (\n <input\n aria-invalid={currentVariant === 'error'}\n className=\"eds-form-control\"\n disabled={disabled}\n readOnly={readOnly}\n ref={forwardRef}\n placeholder={placeholder}\n onChange={handleChange}\n value={value}\n {...rest}\n />\n );\n },\n);\n\nconst ClearButton: React.FC<{\n onClear: () => void;\n [key: string]: any;\n}> = ({ onClear, ...props }) => {\n const { isFilled: hasValue, setFilled } = useInputGroupContext();\n return (\n <div className=\"eds-textfield__clear-button-wrapper\">\n {hasValue && <div className=\"eds-textfield__divider\"></div>}\n {hasValue && (\n <button\n className=\"eds-textfield__clear-button\"\n type=\"button\"\n tabIndex={-1}\n onClick={() => {\n setFilled(false);\n onClear();\n }}\n {...props}\n >\n <CloseSmallIcon />\n </button>\n )}\n </div>\n );\n};\n","import React from 'react';\nimport { useRandomId } from '@entur/utils';\n\nexport type SelectedValues = { [key: string]: boolean };\nexport type SelectedValue = string | null;\nexport type SegmentedContextProps =\n | {\n name: string;\n onChange: (value: SelectedValues) => void;\n selectedValue: SelectedValues;\n multiple: true;\n size: 'medium' | 'large';\n }\n | {\n name: string;\n onChange: (value: SelectedValue) => void;\n selectedValue: SelectedValue;\n multiple: false;\n size: 'medium' | 'large';\n };\n\nconst SegmentedContext = React.createContext<SegmentedContextProps | null>(\n null,\n);\n\nexport type SegmentedProviderProps =\n | {\n name?: string;\n onChange?: (value: SelectedValues) => void;\n selectedValue: SelectedValues;\n multiple: true;\n size: 'medium' | 'large';\n }\n | {\n name?: string;\n onChange?: (value: SelectedValue) => void;\n selectedValue: SelectedValue;\n multiple: false;\n size: 'medium' | 'large';\n };\n\nexport const SegmentedProvider: React.FC<SegmentedProviderProps> = ({\n name,\n onChange = () => undefined,\n selectedValue,\n multiple,\n size,\n ...rest\n}) => {\n const generatedName = useRandomId('eds-segmented-control');\n const contextValue = React.useMemo(\n () => ({\n name: name || generatedName,\n onChange,\n multiple,\n selectedValue,\n size,\n }),\n [generatedName, multiple, name, onChange, selectedValue, size],\n ) as SegmentedContextProps;\n return <SegmentedContext.Provider value={contextValue} {...rest} />;\n};\n\nexport const useSegmentedContext = (): SegmentedContextProps => {\n const context = React.useContext(SegmentedContext);\n if (!context) {\n throw new Error(\n 'You need to wrap your SegmentedChoice in either SegmentedControl or MultipleSegmentedControl',\n );\n }\n return context;\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport {\n useSegmentedContext,\n SelectedValues,\n SelectedValue,\n} from './SegmentedContext';\nimport './SegmentedChoice.scss';\n\nexport type SegmentedChoiceProps = {\n /** Verdien til valget */\n value: string;\n /** Innhold som beskriver valget */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Callback som kalles når komponenten endres */\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n} & React.DetailedHTMLProps<\n React.InputHTMLAttributes<HTMLInputElement>,\n HTMLInputElement\n>;\n\nexport const SegmentedChoice = React.forwardRef<\n HTMLInputElement,\n SegmentedChoiceProps\n>(\n (\n {\n children,\n className,\n style,\n value,\n name,\n onChange = () => undefined,\n ...rest\n },\n ref: React.Ref<HTMLInputElement>,\n ) => {\n const {\n name: commonName,\n selectedValue,\n onChange: commonOnChange,\n multiple,\n size,\n } = useSegmentedContext();\n\n const isChecked = multiple\n ? (selectedValue as SelectedValues)[value]\n : (selectedValue as SelectedValue) === value;\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n onChange(e);\n if (multiple) {\n commonOnChange({\n ...(selectedValue as SelectedValues),\n [value]: e.target.checked,\n } as any);\n } else if (e.target.checked) {\n commonOnChange(value as any);\n }\n };\n\n return (\n <label\n className={classNames('eds-segmented-choice', className, {\n 'eds-segmented-choide--large': size === 'large',\n })}\n style={style}\n >\n <input\n type={multiple ? 'checkbox' : 'radio'}\n name={name || commonName}\n checked={isChecked}\n value={value}\n onChange={handleChange}\n ref={ref}\n {...rest}\n />\n <div\n className={classNames('eds-base-segmented', {\n 'eds-base-segmented--large': size === 'large',\n })}\n >\n {children}\n </div>\n </label>\n );\n },\n);\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('form', 'icons', 'typography');\n\nexport * from './BaseFormControl';\nexport * from './Checkbox';\nexport * from './FeedbackText';\nexport * from './Fieldset';\nexport * from './InputGroupLabel';\nexport * from './InputGroupContext';\nexport * from './Radio';\nexport * from './RadioGroup';\nexport * from './RadioPanel';\nexport * from './Switch';\nexport * from './TravelSwitch';\nexport * from './TextArea';\nexport * from './TextField';\nexport * from './VariantProvider';\nexport * from './utils';\nexport * from './segmented-control/SegmentedChoice';\nexport * from './segmented-control/SegmentedControl';\nexport * from './segmented-control/MultipleSegmentedControl';\n","import React from 'react';\nimport { Label } from '@entur/typography';\nimport { SegmentedProvider, SelectedValues } from './SegmentedContext';\nimport './SegmentedControl.scss';\n\nexport type MultipleSegmentedControlProps = {\n /** Navn på input-elementene */\n name?: string;\n /** Beskrivende tekst */\n label?: string;\n /** En eller flere SegmentedChoice-komponenter */\n children: React.ReactNode;\n /** Den eller de valgte verdiene */\n selectedValue: SelectedValues;\n /** Callback for når det gjøres et valg */\n onChange: (value: SelectedValues) => void;\n [key: string]: any;\n};\n\n/**This component is not used by anyone, and is therefore deprecated\n * @deprecated\n */\nexport const MultipleSegmentedControl: React.FC<MultipleSegmentedControlProps> =\n ({ children, label, name, onChange, selectedValue, ...rest }) => {\n return (\n <SegmentedProvider\n name={name}\n selectedValue={selectedValue}\n onChange={onChange}\n multiple={true}\n size=\"medium\"\n >\n <Label as=\"div\">{label}</Label>\n <div className=\"eds-segmented-control\" {...rest}>\n {children}\n </div>\n </SegmentedProvider>\n );\n };\n","import React from 'react';\nimport { RadioGroupContextProvider } from './RadioGroupContext';\nimport { Fieldset } from './Fieldset';\n\nexport type RadioGroupProps = {\n /** Navnet til radiogruppen. */\n name: string;\n /** Overskrift over radiogruppen */\n label?: string;\n /** Verdien til den valgte radioknappen */\n value: string | null;\n /** Radioknappene sendes inn som children */\n children: React.ReactNode;\n /** En callback som blir kalles hver gang en radioknapp klikkes på */\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n [key: string]: any;\n};\n\nexport const RadioGroup: React.FC<RadioGroupProps> = ({\n name,\n value,\n children,\n onChange,\n label,\n ...rest\n}) => {\n const contextValue = React.useMemo(\n () => ({ name, value, onChange }),\n [name, value, onChange],\n );\n return (\n <RadioGroupContextProvider value={contextValue}>\n {label ? (\n <Fieldset label={label} {...rest}>\n {children}\n </Fieldset>\n ) : (\n children\n )}\n </RadioGroupContextProvider>\n );\n};\n","import React from 'react';\nimport { SegmentedProvider, SelectedValue } from './SegmentedContext';\nimport { Fieldset } from '../Fieldset';\nimport classNames from 'classnames';\nimport './SegmentedControl.scss';\n\nexport type SegmentedControlProps = {\n /** Navn på input-elementene */\n name?: string;\n /** Beskrivende tekst */\n label?: string;\n /** En eller flere SegmentedChoice-komponenter */\n children: React.ReactNode;\n /** Den valgte verdien */\n selectedValue: SelectedValue;\n /** Callback for når det gjøres et valg */\n onChange: (value: SelectedValue) => void;\n /** Størrelsen på SegmentedChoice-komponentene */\n size?: 'medium' | 'large';\n /** Ekstra klassenavn */\n className?: string;\n [key: string]: any;\n};\n\nexport const SegmentedControl: React.FC<SegmentedControlProps> = ({\n children,\n label,\n name,\n onChange,\n selectedValue,\n size = 'medium',\n className,\n ...rest\n}) => {\n return (\n <SegmentedProvider\n name={name}\n selectedValue={selectedValue}\n onChange={onChange}\n multiple={false}\n size={size}\n >\n <Fieldset label={label}>\n <div\n className={classNames('eds-segmented-control', className)}\n {...rest}\n >\n {children}\n </div>\n </Fieldset>\n </SegmentedProvider>\n );\n};\n","import React from 'react';\nimport { Switch } from './Switch';\nimport { colors } from '@entur/tokens';\nimport {\n BusIcon,\n FerryIcon,\n TramIcon,\n PlaneIcon,\n TrainIcon,\n BicycleIcon,\n ScooterIcon,\n SubwayIcon,\n} from '@entur/icons';\nimport './Switch.scss';\n\nexport type TravelSwitchProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Om switchen er checked eller ikke */\n checked?: boolean;\n /** Label for TravelSwitch-en. */\n children?: React.ReactNode;\n /** Posisjonen til label for TravelSwitch-en.\n * @default \"right\"\n */\n labelPlacement?: 'right' | 'bottom';\n /** Hvilken type reise som skal vises rikig ikon og farge for */\n transport: // When adding a new submode, check https://enturas.atlassian.net/wiki/spaces/PUBLIC/pages/825393529/Norwegian+submodes+and+their+definitions for names\n | 'bus'\n | 'metro'\n | 'air'\n | 'tram'\n | 'rail'\n | 'water'\n | 'bike'\n | 'airportLinkBus'\n | 'airportLinkRail'\n | 'scooter';\n /** Callback for når verdien endres */\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /** Størrelsen på Switchen\n * @default \"medium\"\n */\n size?: 'medium' | 'large';\n} & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>;\n\nexport const TravelSwitch: React.FC<TravelSwitchProps> = ({\n className,\n children,\n labelPlacement = 'right',\n transport,\n size,\n ...rest\n}) => {\n const { color, contrast, Icon } = modeCalc(transport);\n return (\n <Switch\n className={className}\n labelPlacement={labelPlacement}\n color={color}\n contrastColor={contrast}\n icon={<Icon />}\n size={size}\n {...rest}\n >\n {children}\n </Switch>\n );\n};\n\nfunction modeCalc(mode: string) {\n switch (mode) {\n case 'bus':\n return {\n Icon: BusIcon,\n color: colors.transport.default.bus,\n contrast: colors.transport.contrast.bus,\n };\n case 'metro':\n return {\n Icon: SubwayIcon,\n color: colors.transport.default.metro,\n contrast: colors.transport.contrast.metro,\n };\n case 'air':\n return {\n Icon: PlaneIcon,\n color: colors.transport.default.plane,\n contrast: colors.transport.contrast.plane,\n };\n case 'tram':\n return {\n Icon: TramIcon,\n color: colors.transport.default.tram,\n contrast: colors.transport.contrast.tram,\n };\n case 'rail':\n return {\n Icon: TrainIcon,\n color: colors.transport.default.train,\n contrast: colors.transport.contrast.train,\n };\n case 'water':\n return {\n Icon: FerryIcon,\n color: colors.transport.default.ferry,\n contrast: colors.transport.contrast.ferry,\n };\n case 'bike':\n return {\n Icon: BicycleIcon,\n color: colors.transport.default.mobility,\n contrast: colors.transport.contrast.mobility,\n };\n case 'scooter':\n return {\n Icon: ScooterIcon,\n color: colors.transport.default.mobility,\n contrast: colors.transport.contrast.mobility,\n };\n case 'airportLinkBus':\n return {\n Icon: BusIcon,\n color: colors.transport.default.plane,\n contrast: colors.transport.contrast.plane,\n };\n case 'airportLinkRail':\n return {\n Icon: TrainIcon,\n color: colors.transport.default.plane,\n contrast: colors.transport.contrast.plane,\n };\n default:\n throw Error('Please select a transport for the TravelSwitch.');\n }\n}\n"],"names":["AlertIcon","variant","iconClass","React","ValidationCheckIcon","className","ValidationErrorIcon","ValidationExclamationIcon","FeedbackText","children","hideIcon","rest","SubLabel","classNames","InputGroupContext","createContext","isFilled","setFilled","InputGroupContextProvider","useState","Provider","value","useInputGroupContext","useContext","InputGroupLabel","label","required","labelId","staticAnimation","filler","id","VariantContext","useVariant","BaseFormControl","forwardRef","ref","dark","disabled","readOnly","prepend","append","size","labelTooltip","feedback","labelProps","style","disableLabelAnimation","ariaAlertOnFeedback","contextVariant","currentVariant","Tooltip","content","placement","QuestionIcon","role","undefined","Checkbox","checked","reduceClickArea","innerRef","useRef","useImperativeHandle","current","isIndeterminate","isControlled","useEffect","indeterminate","cx","type","CheckboxIcon","Paragraph","margin","as","width","height","viewBox","x","y","fill","d","Fieldset","Label","RadioGroupContext","RadioGroupContextProvider","useRadioGroupContext","context","Error","Radio","classList","name","onChange","RadioPanel","title","secondaryLabel","hideCheckbox","selectedValue","randomId","useRandomId","radioPanelId","htmlFor","RadioPanelCheck","Switch","labelPlacement","icon","color","colors","validation","mintContrast","contrastColor","chosenContrastColor","CheckIcon","CloseSmallIcon","hasValue","Array","isArray","length","obj","SSR","defaultValue","TextArea","textAreaId","TextAreaBase","isInputFilled","setFiller","useOnMount","event","target","TextField","clearable","onClear","textFieldId","ClearButton","TextFieldBase","placeholder","props","tabIndex","onClick","SegmentedContext","SegmentedProvider","multiple","generatedName","contextValue","useMemo","SegmentedChoice","useSegmentedContext","commonName","commonOnChange","isChecked","e","warnAboutMissingStyles","transport","mode","Icon","BusIcon","bus","contrast","SubwayIcon","metro","PlaneIcon","plane","TramIcon","tram","TrainIcon","train","FerryIcon","ferry","BicycleIcon","mobility","ScooterIcon","modeCalc"],"mappings":"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"}
package/dist/form.esm.js CHANGED
@@ -152,7 +152,7 @@ var useVariant = function useVariant() {
152
152
  return context;
153
153
  };
154
154
 
155
- var _excluded$d = ["children", "className", "dark", "disabled", "readOnly", "variant", "prepend", "append", "size", "isFilled", "label", "required", "labelTooltip", "feedback", "labelId", "labelProps", "style", "disableLabelAnimation"];
155
+ var _excluded$d = ["children", "className", "dark", "disabled", "readOnly", "variant", "prepend", "append", "size", "isFilled", "label", "required", "labelTooltip", "feedback", "labelId", "labelProps", "style", "disableLabelAnimation", "ariaAlertOnFeedback"];
156
156
  var BaseFormControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
157
157
  var children = _ref.children,
158
158
  className = _ref.className,
@@ -177,6 +177,8 @@ var BaseFormControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
177
177
  style = _ref.style,
178
178
  _ref$disableLabelAnim = _ref.disableLabelAnimation,
179
179
  disableLabelAnimation = _ref$disableLabelAnim === void 0 ? false : _ref$disableLabelAnim,
180
+ _ref$ariaAlertOnFeedb = _ref.ariaAlertOnFeedback,
181
+ ariaAlertOnFeedback = _ref$ariaAlertOnFeedb === void 0 ? false : _ref$ariaAlertOnFeedb,
180
182
  rest = _objectWithoutPropertiesLoose(_ref, _excluded$d);
181
183
 
182
184
  var contextVariant = useVariant();
@@ -209,7 +211,8 @@ var BaseFormControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
209
211
  }, React__default.createElement("span", {
210
212
  className: "eds-input-group__label-tooltip-icon"
211
213
  }, React__default.createElement(QuestionIcon, null))))), feedback && currentVariant && React__default.createElement(FeedbackText, {
212
- variant: currentVariant
214
+ variant: currentVariant,
215
+ role: ariaAlertOnFeedback ? 'alert' : undefined
213
216
  }, feedback));
214
217
  });
215
218
 
@@ -585,6 +588,7 @@ function modeCalc(mode) {
585
588
  }
586
589
  }
587
590
 
591
+ // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types -- disabled during Yarn upgrade
588
592
  function hasValue(value) {
589
593
  return value != null && !(Array.isArray(value) && value.length === 0);
590
594
  } // Determine if field is empty or filled.
@@ -594,6 +598,7 @@ function hasValue(value) {
594
598
  // @param SSR
595
599
  // @returns {boolean} False when not present or empty string.
596
600
  // True when any number or string with length.
601
+ // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types -- disabled during Yarn upgrade
597
602
 
598
603
  function isFilled(obj, SSR) {
599
604
  if (SSR === void 0) {
@@ -604,7 +609,7 @@ function isFilled(obj, SSR) {
604
609
  }
605
610
 
606
611
  var _excluded$5 = ["variant", "disabled", "readOnly", "className", "style", "label", "feedback", "labelTooltip", "onChange", "disableLabelAnimation"],
607
- _excluded2$1 = ["readOnly", "disabled", "onChange", "value"];
612
+ _excluded2$1 = ["readOnly", "disabled", "onChange", "value", "variant"];
608
613
  var TextArea = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
609
614
  var variant = _ref.variant,
610
615
  _ref$disabled = _ref.disabled,
@@ -640,7 +645,8 @@ var TextArea = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
640
645
  disabled: disabled,
641
646
  ref: ref,
642
647
  "aria-labelledby": textAreaId,
643
- onChange: onChange
648
+ onChange: onChange,
649
+ variant: variant
644
650
  }, rest)));
645
651
  });
646
652
  var TextAreaBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref) {
@@ -648,8 +654,12 @@ var TextAreaBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref)
648
654
  disabled = _ref2.disabled,
649
655
  onChange = _ref2.onChange,
650
656
  value = _ref2.value,
657
+ variant = _ref2.variant,
651
658
  rest = _objectWithoutPropertiesLoose(_ref2, _excluded2$1);
652
659
 
660
+ var contextVariant = useVariant();
661
+ var currentVariant = variant || contextVariant;
662
+
653
663
  var _useInputGroupContext = useInputGroupContext(),
654
664
  isInputFilled = _useInputGroupContext.isFilled,
655
665
  setFiller = _useInputGroupContext.setFilled;
@@ -683,11 +693,12 @@ var TextAreaBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref)
683
693
  readOnly: readOnly,
684
694
  disabled: disabled,
685
695
  onChange: handleChange,
686
- value: value
696
+ value: value,
697
+ "aria-invalid": currentVariant === 'error'
687
698
  }, rest));
688
699
  });
689
700
 
690
- var _excluded$4 = ["prepend", "append", "variant", "disabled", "readOnly", "className", "style", "size", "label", "required", "labelTooltip", "feedback", "onChange", "disableLabelAnimation", "labelProps", "clearable", "onClear", "value"],
701
+ var _excluded$4 = ["prepend", "append", "variant", "disabled", "readOnly", "className", "style", "size", "label", "required", "labelTooltip", "feedback", "onChange", "disableLabelAnimation", "labelProps", "clearable", "onClear", "value", "ariaAlertOnFeedback"],
691
702
  _excluded2 = ["disabled", "readOnly", "placeholder", "onChange", "value", "variant"],
692
703
  _excluded3 = ["onClear"];
693
704
  var TextField = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
@@ -713,6 +724,8 @@ var TextField = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
713
724
  clearable = _ref$clearable === void 0 ? false : _ref$clearable,
714
725
  onClear = _ref.onClear,
715
726
  value = _ref.value,
727
+ _ref$ariaAlertOnFeedb = _ref.ariaAlertOnFeedback,
728
+ ariaAlertOnFeedback = _ref$ariaAlertOnFeedb === void 0 ? false : _ref$ariaAlertOnFeedb,
716
729
  rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
717
730
 
718
731
  var randomId = useRandomId('eds-textfield');
@@ -734,14 +747,16 @@ var TextField = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
734
747
  labelId: textFieldId,
735
748
  feedback: feedback,
736
749
  disableLabelAnimation: disableLabelAnimation,
737
- labelProps: labelProps
750
+ labelProps: labelProps,
751
+ ariaAlertOnFeedback: ariaAlertOnFeedback
738
752
  }, React__default.createElement(TextFieldBase, _extends({
739
753
  disabled: disabled,
740
754
  readOnly: readOnly,
741
755
  ref: ref,
742
756
  "aria-labelledby": textFieldId,
743
757
  onChange: onChange,
744
- value: value
758
+ value: value,
759
+ variant: variant
745
760
  }, rest)));
746
761
  });
747
762
  var TextFieldBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, forwardRef) {
@@ -823,7 +838,9 @@ var SegmentedContext = /*#__PURE__*/React__default.createContext(null);
823
838
  var SegmentedProvider = function SegmentedProvider(_ref) {
824
839
  var name = _ref.name,
825
840
  _ref$onChange = _ref.onChange,
826
- onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange,
841
+ onChange = _ref$onChange === void 0 ? function () {
842
+ return undefined;
843
+ } : _ref$onChange,
827
844
  selectedValue = _ref.selectedValue,
828
845
  multiple = _ref.multiple,
829
846
  size = _ref.size,
@@ -861,7 +878,9 @@ var SegmentedChoice = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
861
878
  value = _ref.value,
862
879
  name = _ref.name,
863
880
  _ref$onChange = _ref.onChange,
864
- onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange,
881
+ onChange = _ref$onChange === void 0 ? function () {
882
+ return undefined;
883
+ } : _ref$onChange,
865
884
  rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
866
885
 
867
886
  var _useSegmentedContext = useSegmentedContext(),
@@ -922,11 +941,11 @@ var SegmentedControl = function SegmentedControl(_ref) {
922
941
  onChange: onChange,
923
942
  multiple: false,
924
943
  size: size
925
- }, React__default.createElement(Label, {
926
- as: "div"
927
- }, label), React__default.createElement("div", _extends({
944
+ }, React__default.createElement(Fieldset, {
945
+ label: label
946
+ }, React__default.createElement("div", _extends({
928
947
  className: classNames('eds-segmented-control', className)
929
- }, rest), children));
948
+ }, rest), children)));
930
949
  };
931
950
 
932
951
  var _excluded = ["children", "label", "name", "onChange", "selectedValue"];