@redradix/components.select
Advanced tools
Comparing version 1.2.0 to 1.3.0
@@ -36,2 +36,4 @@ import React from 'react' | ||
isDisabled: PropTypes.bool, | ||
/** Boolean that defines whether the <select> is required */ | ||
isRequired: PropTypes.bool, | ||
/** Boolean that specifies whether the <select> field has been modified */ | ||
@@ -38,0 +40,0 @@ isTouched: PropTypes.bool, |
@@ -1,2 +0,2 @@ | ||
!function(e,r){"object"==typeof exports&&"object"==typeof module?module.exports=r(require("react"),require("classnames"),require("react-select")):"function"==typeof define&&define.amd?define(["react","classnames","react-select"],r):"object"==typeof exports?exports.select=r(require("react"),require("classnames"),require("react-select")):(e.components=e.components||{},e.components.select=r(e.react,e.classnames,e["react-select"]))}(window,function(e,r,n){return function(e){var r={};function n(t){if(r[t])return r[t].exports;var a=r[t]={i:t,l:!1,exports:{}};return e[t].call(a.exports,a,a.exports,n),a.l=!0,a.exports}return n.m=e,n.c=r,n.d=function(e,r,t){n.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,r){if(1&r&&(e=n(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(n.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var a in e)n.d(t,a,function(r){return e[r]}.bind(null,a));return t},n.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(r,"a",r),r},n.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},n.p="",n(n.s=3)}([function(r,n){r.exports=e},function(e,n){e.exports=r},function(e,r){e.exports=n},function(e,r,n){e.exports=n(4)},function(e,r,n){"use strict";n.r(r);var t=n(0),a=n.n(t),o=n(2),i=n.n(o);function l(e,r){if(null==e)return{};var n,t,a=function(e,r){if(null==e)return{};var n,t,a={},o=Object.keys(e);for(t=0;t<o.length;t++)n=o[t],r.indexOf(n)>=0||(a[n]=e[n]);return a}(e,r);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(t=0;t<o.length;t++)n=o[t],r.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(a[n]=e[n])}return a}function s(e,r,n){return r in e?Object.defineProperty(e,r,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[r]=n,e}function c(e){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{},t=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(t=t.concat(Object.getOwnPropertySymbols(n).filter(function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),t.forEach(function(r){s(e,r,n[r])})}return e}var u=n(1),d=n.n(u);function p(){return(p=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var n=arguments[r];for(var t in n)Object.prototype.hasOwnProperty.call(n,t)&&(e[t]=n[t])}return e}).apply(this,arguments)}var f=a.a.createElement("title",{id:"close-title"},"Close icon"),m=a.a.createElement("desc",{id:"close-description"},"Close icon in svg"),h=a.a.createElement("path",{d:"M12 10.586l5.293-5.293a1 1 0 0 1 1.414 1.414L13.414 12l5.293 5.293a1 1 0 0 1-1.414 1.414L12 13.414l-5.293 5.293a1 1 0 1 1-1.414-1.414L10.586 12 5.293 6.707a1 1 0 0 1 1.414-1.414L12 10.586z"}),v=function(e){return a.a.createElement("svg",p({width:24,height:24,viewBox:"0 0 24 24","aria-labelledby":"close-title close-description",role:"img"},e),f,m,h)},b=function(e){for(var r=arguments.length,n=new Array(r>1?r-1:0),t=1;t<r;t++)n[t-1]=arguments[t];return"function"==typeof e&&e.apply(void 0,n)},x=function(e){return!(e&&Object.keys(e).length)},w=function(e){return"dynamic"===e.componentsProps.behaviour&&x(e.value)},P=function(e){return e.placeholder!==e.componentsProps.label&&w(e)},g={ClearIndicator:function(e){var r=e.innerProps,n=e.selectProps;return b(n.componentsProps.renderClearIcon,c({},r,{className:"".concat("rdx-icon"," rdx-select-field-icon-clear")}))},Control:function(e){var r=e.selectProps,n=e.innerProps,t=e.innerRef,o=e.children;return a.a.createElement("div",Object.assign({"aria-expanded":r.menuIsOpen,className:"rdx-select-field-wrapper",ref:t},n),o,r.componentsProps.label&&a.a.createElement("label",{className:"rdx-select-field-label",htmlFor:r.id},r.componentsProps.label))},DropdownIndicator:function(e){var r=e.selectProps,n=e.innerProps;return b(r.componentsProps.renderDownIcon,c({},n,{className:"".concat("rdx-icon"," rdx-select-field-icon-open")}))},IndicatorsContainer:function(e){var r=e.children;return a.a.createElement("div",{className:"rdx-select-field-icons-wrapper"},r)},IndicatorSeparator:function(){return null},Input:function(e){var r=e.selectProps,n=e.innerRef,t=e.isDisabled,o=l(e,["selectProps","innerRef","isDisabled"]),i=!x(r.value)&&r.componentsProps.searchHint,s=d()("rdx-select-field-select",{"is-hidden":!r.isMulti&&r.value});return a.a.createElement("input",Object.assign({className:s,disabled:t,ref:n},o,{placeholder:i?r.componentsProps.searchHint:void 0}))},Menu:function(e){var r=e.innerRef,n=e.innerProps,t=e.children;return a.a.createElement("div",Object.assign({className:"rdx-select-field-items",ref:r},n),t)},MenuList:function(e){var r=e.innerRef,n=e.children;return a.a.createElement("ul",{"aria-label":"submenu",ref:r},n)},MultiValue:function(e){var r=e.children,n=e.data,t=e.removeProps,o=e.isFocused,i=d()("rdx-select-field-tag",{"is-fixed":n.isFixed,"is-focused":o});return a.a.createElement("button",{className:i,tabIndex:-1},a.a.createElement("p",null,r),!n.isFixed&&a.a.createElement("div",Object.assign({className:"rdx-select-field-icon-close",role:"button"},t),a.a.createElement(v,{className:"rdx-icon rdx-icon-close"})))},Option:function(e){var r=e.data,n=e.selectProps,t=e.isFocused,o=e.innerRef,i=e.innerProps,l=e.label,s=e.value,c=!n.isMulti&&n.value&&s===n.value.value&&!n.isDisabled,u=d()("rdx-select-field-option",{"is-disabled":r.isDisabled,"is-focused":t,"is-selected":c});return a.a.createElement("li",Object.assign({ref:o,className:u,"aria-selected":c,role:"option"},i),r.imgPath&&a.a.createElement("span",{className:"rdx-select-option-icon-wrapper"},a.a.createElement("img",{className:"rdx-select-option-icon",src:r.imgPath,alt:r.imgAlt})),a.a.createElement("span",null,l))},Placeholder:function(e){var r=e.children,n=e.selectProps;return w(n)&&!P(n)?null:a.a.createElement("div",{className:"rdx-select-field-placeholder"},r)},SelectContainer:function(e){var r=e.selectProps,n=e.innerProps,t=e.children,o=e.isFocused,i=d()("rdx-select-field rdx-select-field-".concat(r.componentsProps.appearance," is-custom"),{"has-error":r.componentsProps.hasError,"has-label":r.componentsProps.label,"has-width-fixed":"fixed"===r.componentsProps.widthBehaviour,"has-width-adaptative":"adaptative"===r.componentsProps.widthBehaviour,"has-height-fixed":"fixed"===r.componentsProps.heightBehaviour,"has-height-adaptative":"adaptative"===r.componentsProps.heightBehaviour,"has-width-full":"full"===r.componentsProps.widthBehaviour,"is-disabled":r.isDisabled,"is-dynamic":w(r),"is-fading":P(r),"is-focused":o,"is-multi":r.isMulti,"is-open-down":r.menuIsOpen&&"down"===r.componentsProps.dropDownPos,"is-open-up":r.menuIsOpen&&"up"===r.componentsProps.dropDownPos,"is-searchable":r.isSearchable,"is-touched":r.componentsProps.isTouched});return a.a.createElement("div",Object.assign({className:i},n),t,r.componentsProps.helperText&&!r.componentsProps.errorText?a.a.createElement("div",{className:"rdx-select-field-helper"},r.componentsProps.helperText):null,r.componentsProps.hasError&&!r.isDisabled?a.a.createElement("div",{className:"rdx-select-field-helper"},r.componentsProps.errorText):null)},SingleValue:function(e){var r=e.selectProps,n=e.children;return a.a.createElement(a.a.Fragment,null,r.options.map(function(e){return e.label===n&&e.imgPath?a.a.createElement("span",{className:"rdx-select-option-icon-wrapper"},a.a.createElement("img",{className:"rdx-select-option-icon",src:e.imgPath,alt:e.imgAlt})):null}),a.a.createElement("div",{className:"rdx-select-field-value"},n))},ValueContainer:function(e){return e.children}};function y(){return(y=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var n=arguments[r];for(var t in n)Object.prototype.hasOwnProperty.call(n,t)&&(e[t]=n[t])}return e}).apply(this,arguments)}var E=a.a.createElement("title",{id:"chevron-down-title"},"Chevron down icon"),O=a.a.createElement("desc",{id:"chevron-down-description"},"Chevron down icon in svg"),j=a.a.createElement("path",{d:"M19.293 7.293a1 1 0 0 1 1.414 1.414l-8 8a1 1 0 0 1-1.414 0l-8-8a1 1 0 0 1 1.414-1.414L12 14.586l7.293-7.293z"}),C=function(e){return a.a.createElement("svg",y({width:24,height:24,viewBox:"0 0 24 24","aria-labelledby":"chevron-down-title chevron-down-description",role:"img"},e),E,O,j)};function B(){return(B=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var n=arguments[r];for(var t in n)Object.prototype.hasOwnProperty.call(n,t)&&(e[t]=n[t])}return e}).apply(this,arguments)}var D=a.a.createElement("title",{id:"delete-title"},"Delete icon"),N=a.a.createElement("desc",{id:"delete-description"},"Delete icon in svg"),S=a.a.createElement("path",{d:"M20.182 4C21.73 4 23 5.222 23 6.75v10.5c0 1.528-1.27 2.75-2.818 2.75H8.364a1 1 0 0 1-.74-.327l-6.364-7a1 1 0 0 1 0-1.346l6.364-7A1 1 0 0 1 8.364 4h11.818zM8.806 18h11.376c.46 0 .818-.345.818-.75V6.75c0-.405-.358-.75-.818-.75H8.806l-5.455 6 5.455 6zm9.912-3.697a1 1 0 1 1-1.415 1.415L15 13.414l-2.303 2.304a1 1 0 1 1-1.415-1.415L13.586 12l-2.293-2.293a1 1 0 1 1 1.414-1.414L15 10.586l2.293-2.293a1 1 0 0 1 1.414 1.414L16.414 12l2.304 2.303z"}),M=function(e){return a.a.createElement("svg",B({width:24,height:24,viewBox:"0 0 24 24","aria-labelledby":"delete-title delete-description",role:"img"},e),D,N,S)},I=function(e){var r=e.appearance,n=e.ariaLabel,t=e.autoFocus,o=e.behaviour,l=e.defaultIsOpen,s=e.dropDownPos,c=e.errorText,u=e.heightBehaviour,d=e.helperText,p=e.id,f=e.isDisabled,m=e.isMulti,h=e.isSearchable,v=e.isTouched,b=e.label,x=e.name,w=e.onBlur,P=e.onChange,y=e.onClose,E=e.onFocus,O=e.onInputChange,j=e.onKeyDown,C=e.onOpen,B=e.options,D=e.placeholder,N=e.renderClearIcon,S=e.renderDownIcon,M=e.searchHint,I=e.value,F=e.widthBehaviour,T=c&&v;return a.a.createElement(i.a,{id:p,ariaLabel:n||b||p,autoFocus:t,defaultMenuIsOpen:l,placeholder:D,isDisabled:f,isMulti:m,isSearchable:h,name:x,options:B,value:I,isClearable:m&&I&&I.some(function(e){return!e.isFixed}),onBlur:w,onChange:function(e,r){var n=r.action,t=r.removedValue;switch(n){case"remove-value":case"pop-value":if(t.isFixed)return;break;case"clear":e=B.filter(function(e){return e.isFixed})}P(e,{action:n,removedValue:t})},onClose:y,onFocus:E,onInputChange:O,onKeyDown:j,onOpen:C,components:g,componentsProps:{renderClearIcon:N,renderDownIcon:S,label:b,hasError:T,behaviour:o,isTouched:v,heightBehaviour:u,widthBehaviour:F,appearance:r,dropDownPos:s,errorText:c,helperText:d,searchHint:M}})};I.defaultProps={appearance:"box",behaviour:"static",dropDownPos:"down",defaultIsOpen:!1,isSearchable:!0,renderDownIcon:function(e){return a.a.createElement(C,e)},renderClearIcon:function(e){return a.a.createElement(M,e)}};var F=I,T=function(e){return a.a.createElement(F,Object.assign({},e,{isSearchable:!1,isMulti:!0,behaviour:"static"}))};T.defaultProps={appearance:"box",dropDownPos:"down",defaultIsOpen:!1,renderClearIcon:function(){return null}};var L=T,A=function(e){return a.a.createElement(F,Object.assign({},e,{isSearchable:!1,isMulti:!1,behaviour:"static"}))};A.defaultProps={appearance:"box",dropDownPos:"down",defaultIsOpen:!1};var k=A;function V(e){return function(e){if(Array.isArray(e)){for(var r=0,n=new Array(e.length);r<e.length;r++)n[r]=e[r];return n}}(e)||function(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance")}()}var q=function(e){var r=e.ariaLabel,n=e.autoComplete,t=e.autoFocus,o=e.hasError,i=e.id,l=e.isDisabled,s=(e.isTouched,e.name),c=e.onBlur,u=e.onChange,d=e.onFocus,p=e.options,f=e.placeholder,m=e.value,h=f?[{label:f,isDisabled:!0,selected:!0}].concat(V(p)):p;return a.a.createElement("select",{"aria-invalid":o,"aria-label":r,autoComplete:n,autoFocus:t,className:"rdx-select-field-select",disabled:l,id:i,name:s,onBlur:c,onChange:function(e){return u(p.find(function(r){return r.value===e.target.value}))},onFocus:d,value:m&&m.value},h.map(function(e,r){var n=e.value,t=e.label,o=e.isDisabled,i=e.selected;return a.a.createElement("option",{key:r,selected:void 0!==m&&n===m.value||i,value:n,disabled:o},t)}))};q.defaultProps={appearance:"box",autoComplete:"off"};var z=q,H=function(e){var r=e.appearance,n=e.ariaLabel,t=e.autoComplete,o=e.autoFocus,i=e.errorText,l=e.heightBehaviour,s=e.helperText,c=e.id,u=e.isDisabled,p=e.isTouched,f=e.label,m=e.name,h=e.options,v=e.onBlur,x=e.onChange,w=e.onFocus,P=e.placeholder,g=e.renderDownIcon,y=e.value,E=e.widthBehaviour,O=Boolean(i&&p),j="rdx-icon rdx-select-field-icon-open",B=d()("rdx-select-field rdx-select-field-".concat(r," is-native"),{"has-error":O,"has-label":f,"has-width-adaptative":"adaptative"===E,"has-width-fixed":"fixed"===E,"has-width-full":"full"===E,"has-height-adaptative":"adaptative"===l,"has-height-fixed":"fixed"===l,"is-disabled":u,"is-touched":p});return a.a.createElement("div",{className:B},a.a.createElement("div",{className:"rdx-select-field-wrapper"},a.a.createElement(z,{appearance:r,ariaLabel:n||f||m||c,autoComplete:t,autoFocus:o,hasError:O,id:c,isDisabled:u,isTouched:p,name:m,onBlur:v,onChange:x,onFocus:w,options:h,placeholder:P,value:y}),f&&a.a.createElement("label",{className:"rdx-select-field-label",htmlFor:c},f),a.a.createElement("div",{className:"rdx-select-field-icons-wrapper"},b(g,{className:j})||a.a.createElement(C,{className:j}))),s&&!i?a.a.createElement("div",{className:"rdx-select-field-helper"},s):null,O&&!u?a.a.createElement("div",{className:"rdx-select-field-helper"},i):null)};H.defaultProps={appearance:"box",autoComplete:"off"};var R=H,_=function(e){return void 0!==e.useNative?e.useNative:/Mobi|Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Opera Mobile|Kindle|Windows Phone|PSP|AvantGo|Atomic Web Browser|Blazer|Chrome Mobile|Dolphin|Dolfin|Doris|GO Browser|Jasmine|MicroB|Mobile Firefox|Mobile Safari|Mobile Silk|Motorola Internet Browser|NetFront|NineSky|Nokia Web Browser|Obigo|Openwave Mobile Browser|Palm Pre web browser|Polaris|PS Vita browser|Puffin|QQbrowser|SEMC Browser|Skyfire|Tear|TeaShark|UC Browser|uZard Web|wOSBrowser|Yandex.Browser mobile/i.test(navigator.userAgent)},W=function(e){return _(e)?a.a.createElement(R,e):a.a.createElement(k,e)};n.d(r,"SelectMultiple",function(){return L}),n.d(r,"SelectSimple",function(){return W})}])}); | ||
!function(e,r){"object"==typeof exports&&"object"==typeof module?module.exports=r(require("react"),require("classnames"),require("react-select")):"function"==typeof define&&define.amd?define(["react","classnames","react-select"],r):"object"==typeof exports?exports.select=r(require("react"),require("classnames"),require("react-select")):(e.components=e.components||{},e.components.select=r(e.react,e.classnames,e["react-select"]))}(window,function(e,r,n){return function(e){var r={};function n(t){if(r[t])return r[t].exports;var a=r[t]={i:t,l:!1,exports:{}};return e[t].call(a.exports,a,a.exports,n),a.l=!0,a.exports}return n.m=e,n.c=r,n.d=function(e,r,t){n.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,r){if(1&r&&(e=n(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(n.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var a in e)n.d(t,a,function(r){return e[r]}.bind(null,a));return t},n.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(r,"a",r),r},n.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},n.p="",n(n.s=3)}([function(r,n){r.exports=e},function(e,n){e.exports=r},function(e,r){e.exports=n},function(e,r,n){e.exports=n(4)},function(e,r,n){"use strict";n.r(r);var t=n(0),a=n.n(t),o=n(2),i=n.n(o);function l(e,r){if(null==e)return{};var n,t,a=function(e,r){if(null==e)return{};var n,t,a={},o=Object.keys(e);for(t=0;t<o.length;t++)n=o[t],r.indexOf(n)>=0||(a[n]=e[n]);return a}(e,r);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(t=0;t<o.length;t++)n=o[t],r.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(a[n]=e[n])}return a}function s(e,r,n){return r in e?Object.defineProperty(e,r,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[r]=n,e}function c(e){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{},t=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(t=t.concat(Object.getOwnPropertySymbols(n).filter(function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),t.forEach(function(r){s(e,r,n[r])})}return e}var u=n(1),d=n.n(u);function p(){return(p=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var n=arguments[r];for(var t in n)Object.prototype.hasOwnProperty.call(n,t)&&(e[t]=n[t])}return e}).apply(this,arguments)}var f=a.a.createElement("title",{id:"close-title"},"Close icon"),m=a.a.createElement("desc",{id:"close-description"},"Close icon in svg"),h=a.a.createElement("path",{d:"M12 10.586l5.293-5.293a1 1 0 0 1 1.414 1.414L13.414 12l5.293 5.293a1 1 0 0 1-1.414 1.414L12 13.414l-5.293 5.293a1 1 0 1 1-1.414-1.414L10.586 12 5.293 6.707a1 1 0 0 1 1.414-1.414L12 10.586z"}),v=function(e){return a.a.createElement("svg",p({width:24,height:24,viewBox:"0 0 24 24","aria-labelledby":"close-title close-description",role:"img"},e),f,m,h)},b=function(e){for(var r=arguments.length,n=new Array(r>1?r-1:0),t=1;t<r;t++)n[t-1]=arguments[t];return"function"==typeof e&&e.apply(void 0,n)},x=function(e){return!(e&&Object.keys(e).length)},P=function(e){return"dynamic"===e.componentsProps.behaviour&&x(e.value)},w=function(e){return e.placeholder!==e.componentsProps.label&&P(e)},g=a.a.createElement("span",{className:"rdx-icon--require"},"*"),y={ClearIndicator:function(e){var r=e.innerProps,n=e.selectProps;return b(n.componentsProps.renderClearIcon,c({},r,{className:"".concat("rdx-icon rdx-select-field-icon"," rdx-select-field-icon-clear")}))},Control:function(e){var r=e.selectProps,n=e.innerProps,t=e.innerRef,o=e.children;return a.a.createElement("div",Object.assign({"aria-expanded":r.menuIsOpen,className:"rdx-select-field-wrapper",ref:t},n),o,r.componentsProps.label&&a.a.createElement("label",{className:"rdx-select-field-label",htmlFor:r.id},r.componentsProps.label,r.componentsProps.isRequired?g:null))},DropdownIndicator:function(e){var r=e.selectProps,n=e.innerProps;return b(r.componentsProps.renderDownIcon,c({},n,{className:"".concat("rdx-icon rdx-select-field-icon"," rdx-select-field-icon-open")}))},IndicatorsContainer:function(e){var r=e.children;return a.a.createElement("div",{className:"rdx-select-field-icons-wrapper"},r)},IndicatorSeparator:function(){return null},Input:function(e){var r=e.selectProps,n=e.innerRef,t=e.isDisabled,o=l(e,["selectProps","innerRef","isDisabled"]),i=!x(r.value)&&r.componentsProps.searchHint,s=d()("rdx-select-field-select",{"is-hidden":!r.isMulti&&r.value});return a.a.createElement("input",Object.assign({className:s,disabled:t,ref:n},o,{placeholder:i?r.componentsProps.searchHint:void 0}))},Menu:function(e){var r=e.innerRef,n=e.innerProps,t=e.children;return a.a.createElement("div",Object.assign({className:"rdx-select-field-items",ref:r},n),t)},MenuList:function(e){var r=e.innerRef,n=e.children;return a.a.createElement("ul",{"aria-label":"submenu",ref:r},n)},MultiValue:function(e){var r=e.children,n=e.data,t=e.removeProps,o=e.isFocused,i=d()("rdx-select-field-tag",{"is-fixed":n.isFixed,"is-focused":o});return a.a.createElement("button",{className:i,tabIndex:-1},a.a.createElement("p",null,r),!n.isFixed&&a.a.createElement("div",Object.assign({className:"rdx-select-field-icon-close",role:"button"},t),a.a.createElement(v,{className:"rdx-icon rdx-icon-close"})))},Option:function(e){var r=e.data,n=e.selectProps,t=e.isFocused,o=e.innerRef,i=e.innerProps,l=e.label,s=e.value,c=(e.onOptionClick,!n.isMulti&&n.value&&s===n.value.value&&!n.isDisabled),u=d()("rdx-select-field-option",{"is-disabled":r.isDisabled,"is-link":r.isLink,"is-focused":t,"is-selected":c});return a.a.createElement("li",Object.assign({ref:o,className:u,"aria-selected":c,role:"option"},i),r.imgPath&&a.a.createElement("span",{className:"rdx-select-option-image-wrapper"},a.a.createElement("img",{className:"rdx-select-option-image",src:r.imgPath,alt:r.imgAlt})),r.iconPath&&a.a.createElement("span",{className:"rdx-select-option-icon-wrapper"},b(r.iconPath,{className:"rdx-select-option-icon"})),a.a.createElement("span",null,l))},Placeholder:function(e){var r=e.children,n=e.selectProps;return P(n)&&!w(n)?null:a.a.createElement("div",{className:"rdx-select-field-placeholder"},r,n.componentsProps.isRequired&&!n.componentsProps.label?g:null)},SelectContainer:function(e){var r=e.selectProps,n=e.innerProps,t=e.children,o=e.isFocused,i=d()("rdx-select-field rdx-select-field-".concat(r.componentsProps.appearance," is-custom"),{"has-error":r.componentsProps.hasError,"has-label":r.componentsProps.label,"has-width-fixed":"fixed"===r.componentsProps.widthBehaviour,"has-width-adaptative":"adaptative"===r.componentsProps.widthBehaviour,"has-height-fixed":"fixed"===r.componentsProps.heightBehaviour,"has-height-adaptative":"adaptative"===r.componentsProps.heightBehaviour,"has-width-full":"full"===r.componentsProps.widthBehaviour,"is-disabled":r.isDisabled,"is-dynamic":P(r),"is-fading":w(r),"is-focused":o,"is-multi":r.isMulti,"is-open-down":r.menuIsOpen&&"down"===r.componentsProps.dropDownPos,"is-open-up":r.menuIsOpen&&"up"===r.componentsProps.dropDownPos,"is-required":r.componentsProps.isRequired,"is-searchable":r.isSearchable,"is-touched":r.componentsProps.isTouched});return a.a.createElement("div",Object.assign({className:i},n),t,r.componentsProps.helperText&&!r.componentsProps.errorText?a.a.createElement("div",{className:"rdx-select-field-helper"},r.componentsProps.helperText):null,r.componentsProps.hasError&&!r.isDisabled?a.a.createElement("div",{className:"rdx-select-field-helper"},r.componentsProps.errorText):null)},SingleValue:function(e){var r=e.selectProps,n=e.children;return a.a.createElement(t.Fragment,null,r.options.map(function(e){return e.label===n?e.imgPath?a.a.createElement("span",{className:"rdx-select-option-image-wrapper",key:e.value},a.a.createElement("img",{className:"rdx-select-option-image",src:e.imgPath,alt:e.imgAlt})):e.iconPath?a.a.createElement("span",{className:"rdx-select-option-icon-wrapper",key:e.value},b(e.iconPath,{className:"rdx-icon rdx-select-option-icon"})):null:null}),a.a.createElement("div",{className:"rdx-select-field-value"},n))},ValueContainer:function(e){return e.children}};function E(){return(E=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var n=arguments[r];for(var t in n)Object.prototype.hasOwnProperty.call(n,t)&&(e[t]=n[t])}return e}).apply(this,arguments)}var O=a.a.createElement("title",{id:"chevron-down-title"},"Chevron down icon"),N=a.a.createElement("desc",{id:"chevron-down-description"},"Chevron down icon in svg"),j=a.a.createElement("path",{d:"M19.293 7.293a1 1 0 0 1 1.414 1.414l-8 8a1 1 0 0 1-1.414 0l-8-8a1 1 0 0 1 1.414-1.414L12 14.586l7.293-7.293z"}),C=function(e){return a.a.createElement("svg",E({width:24,height:24,viewBox:"0 0 24 24","aria-labelledby":"chevron-down-title chevron-down-description",role:"img"},e),O,N,j)};function B(){return(B=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var n=arguments[r];for(var t in n)Object.prototype.hasOwnProperty.call(n,t)&&(e[t]=n[t])}return e}).apply(this,arguments)}var D=a.a.createElement("title",{id:"delete-title"},"Delete icon"),S=a.a.createElement("desc",{id:"delete-description"},"Delete icon in svg"),M=a.a.createElement("path",{d:"M20.182 4C21.73 4 23 5.222 23 6.75v10.5c0 1.528-1.27 2.75-2.818 2.75H8.364a1 1 0 0 1-.74-.327l-6.364-7a1 1 0 0 1 0-1.346l6.364-7A1 1 0 0 1 8.364 4h11.818zM8.806 18h11.376c.46 0 .818-.345.818-.75V6.75c0-.405-.358-.75-.818-.75H8.806l-5.455 6 5.455 6zm9.912-3.697a1 1 0 1 1-1.415 1.415L15 13.414l-2.303 2.304a1 1 0 1 1-1.415-1.415L13.586 12l-2.293-2.293a1 1 0 1 1 1.414-1.414L15 10.586l2.293-2.293a1 1 0 0 1 1.414 1.414L16.414 12l2.304 2.303z"}),I=function(e){return a.a.createElement("svg",B({width:24,height:24,viewBox:"0 0 24 24","aria-labelledby":"delete-title delete-description",role:"img"},e),D,S,M)},F=function(e){var r=e.appearance,n=e.ariaLabel,t=e.autoFocus,o=e.behaviour,l=e.defaultIsOpen,s=e.dropDownPos,c=e.errorText,u=e.heightBehaviour,d=e.helperText,p=e.id,f=e.isDisabled,m=e.isMulti,h=e.isRequired,v=e.isSearchable,b=e.isTouched,x=e.label,P=e.name,w=e.onBlur,g=e.onChange,E=e.onClose,O=e.onFocus,N=e.onInputChange,j=e.onKeyDown,C=e.onOpen,B=e.options,D=e.placeholder,S=e.renderClearIcon,M=e.renderDownIcon,I=e.searchHint,F=e.value,T=e.widthBehaviour,q=c&&b;return a.a.createElement(i.a,{id:p,ariaLabel:n||x||p,autoFocus:t,defaultMenuIsOpen:l,placeholder:D,isDisabled:f,isMulti:m,isSearchable:v,name:P,options:B,value:F,isClearable:m&&F&&F.some(function(e){return!e.isFixed}),onBlur:w,onChange:function(e,r){var n=r.action,t=r.removedValue;switch(n){case"remove-value":case"pop-value":if(t.isFixed)return;break;case"clear":e=B.filter(function(e){return e.isFixed})}g(e,{action:n,removedValue:t})},onClose:E,onFocus:O,onInputChange:N,onKeyDown:j,onOpen:C,components:y,componentsProps:{renderClearIcon:S,renderDownIcon:M,label:x,isRequired:h,hasError:q,behaviour:o,isTouched:b,heightBehaviour:u,widthBehaviour:T,appearance:r,dropDownPos:s,errorText:c,helperText:d,searchHint:I}})};F.defaultProps={appearance:"box",behaviour:"static",dropDownPos:"down",defaultIsOpen:!1,isSearchable:!0,renderDownIcon:function(e){return a.a.createElement(C,e)},renderClearIcon:function(e){return a.a.createElement(I,e)}};var T=F,q=function(e){return a.a.createElement(T,Object.assign({},e,{isSearchable:!1,isMulti:!0,behaviour:"static"}))};q.defaultProps={appearance:"box",dropDownPos:"down",defaultIsOpen:!1,renderClearIcon:function(){return null}};var k=q,L=function(e){return a.a.createElement(T,Object.assign({},e,{isSearchable:!1,isMulti:!1,behaviour:"static"}))};L.defaultProps={appearance:"box",dropDownPos:"down",defaultIsOpen:!1};var R=L;function A(e){return function(e){if(Array.isArray(e)){for(var r=0,n=new Array(e.length);r<e.length;r++)n[r]=e[r];return n}}(e)||function(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance")}()}var V=function(e){var r=e.ariaLabel,n=e.autoComplete,t=e.autoFocus,o=e.hasError,i=e.id,l=e.isDisabled,s=e.isRequired,c=e.name,u=e.onBlur,d=e.onChange,p=e.onFocus,f=e.options,m=e.placeholder,h=e.value,v=m?[{label:m,isDisabled:!0,selected:!0}].concat(A(f)):f;return a.a.createElement("select",{"aria-invalid":o,"aria-label":r,autoComplete:n,autoFocus:t,className:"rdx-select-field-select",disabled:l,id:i,name:c,onBlur:u,onChange:function(e){return d(f.find(function(r){return r.value===e.target.value}))},onFocus:p,required:s,value:h&&h.value},v.map(function(e,r){var n=e.value,t=e.label,o=e.isDisabled,i=e.selected;return a.a.createElement("option",{key:r,selected:void 0!==h&&n===h.value||i,value:n,disabled:o},t)}))};V.defaultProps={appearance:"box",autoComplete:"off"};var z=V,H=function(e){var r=e.appearance,n=e.ariaLabel,t=e.autoComplete,o=e.autoFocus,i=e.errorText,l=e.heightBehaviour,s=e.helperText,c=e.id,u=e.isDisabled,p=e.isRequired,f=e.isTouched,m=e.label,h=e.name,v=e.options,x=e.onBlur,P=e.onChange,w=e.onFocus,g=e.placeholder,y=e.renderDownIcon,E=e.value,O=e.widthBehaviour,N=Boolean(i&&f),j="rdx-icon rdx-select-field-icon-open",B=d()("rdx-select-field rdx-select-field-".concat(r," is-native"),{"has-error":N,"has-label":m,"has-width-adaptative":"adaptative"===O,"has-width-fixed":"fixed"===O,"has-width-full":"full"===O,"has-height-adaptative":"adaptative"===l,"has-height-fixed":"fixed"===l,"is-disabled":u,"is-required":p,"is-touched":f});return a.a.createElement("div",{className:B},a.a.createElement("div",{className:"rdx-select-field-wrapper"},a.a.createElement(z,{appearance:r,ariaLabel:n||m||h||c,autoComplete:t,autoFocus:o,hasError:N,id:c,isDisabled:u,isRequired:p,isTouched:f,name:h,onBlur:x,onChange:P,onFocus:w,options:v,placeholder:g,value:E}),m&&a.a.createElement("label",{className:"rdx-select-field-label",htmlFor:c},m),a.a.createElement("div",{className:"rdx-select-field-icons-wrapper"},b(y,{className:j})||a.a.createElement(C,{className:j}))),s&&!i?a.a.createElement("div",{className:"rdx-select-field-helper"},s):null,N&&!u?a.a.createElement("div",{className:"rdx-select-field-helper"},i):null)};H.defaultProps={appearance:"box",autoComplete:"off"};var _=H,W=function(e){return void 0!==e.useNative?e.useNative:/Mobi|Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Opera Mobile|Kindle|Windows Phone|PSP|AvantGo|Atomic Web Browser|Blazer|Chrome Mobile|Dolphin|Dolfin|Doris|GO Browser|Jasmine|MicroB|Mobile Firefox|Mobile Safari|Mobile Silk|Motorola Internet Browser|NetFront|NineSky|Nokia Web Browser|Obigo|Openwave Mobile Browser|Palm Pre web browser|Polaris|PS Vita browser|Puffin|QQbrowser|SEMC Browser|Skyfire|Tear|TeaShark|UC Browser|uZard Web|wOSBrowser|Yandex.Browser mobile/i.test(navigator.userAgent)},K=function(e){return W(e)?a.a.createElement(_,e):a.a.createElement(R,e)};n.d(r,"SelectMultiple",function(){return k}),n.d(r,"SelectSimple",function(){return K})}])}); | ||
//# sourceMappingURL=index.js.map |
@@ -18,2 +18,3 @@ import React from 'react' | ||
isDisabled, | ||
isRequired, | ||
isTouched, | ||
@@ -45,2 +46,3 @@ label, | ||
'is-disabled': isDisabled, | ||
'is-required': isRequired, | ||
'is-touched': isTouched, | ||
@@ -62,2 +64,3 @@ } | ||
isDisabled, | ||
isRequired, | ||
isTouched, | ||
@@ -119,3 +122,9 @@ name, | ||
isDisabled: PropTypes.bool, | ||
/** Boolean that defines whether the <select> is required */ | ||
isRequired: PropTypes.bool, | ||
/** String that specifies the name of an <select> */ | ||
isTouched: PropTypes.bool, | ||
/** String with the text of <label> related to the <select> */ | ||
label: PropTypes.string, | ||
/** Array of pairs label, value with the options of the <select> */ | ||
name: PropTypes.string, | ||
@@ -129,4 +138,2 @@ /** Function that is triggered when the component loses focus */ | ||
/** Boolean that specifies whether the <select> field has been modified */ | ||
isTouched: PropTypes.bool, | ||
/** Array of pairs label, value with the options of the <select> */ | ||
options: PropTypes.arrayOf( | ||
@@ -139,4 +146,2 @@ PropTypes.shape({ | ||
), | ||
/** String with the text of <label> related to the <select> */ | ||
label: PropTypes.string, | ||
/** String with the expected value of the <select> */ | ||
@@ -143,0 +148,0 @@ placeholder: PropTypes.string, |
import React from 'react' | ||
import PropTypes from 'prop-types' | ||
import cx from 'classnames' | ||
@@ -12,3 +11,3 @@ const SelectSimpleNative = ({ | ||
isDisabled, | ||
isTouched, | ||
isRequired, | ||
name, | ||
@@ -43,2 +42,3 @@ onBlur, | ||
onFocus, | ||
required: isRequired, | ||
value: value && value.value, | ||
@@ -81,2 +81,4 @@ }}> | ||
isDisabled: PropTypes.bool, | ||
/** Boolean that defines whether the <select> is disabled */ | ||
isRequired: PropTypes.bool, | ||
/** String that specifies the name of an <select> */ | ||
@@ -83,0 +85,0 @@ name: PropTypes.string, |
{ | ||
"name": "@redradix/components.select", | ||
"version": "1.2.0", | ||
"version": "1.3.0", | ||
"description": "", | ||
@@ -26,3 +26,3 @@ "publishConfig": { | ||
}, | ||
"gitHead": "73b72b6aab719072ebe8b5e8382fa04039a20b6d" | ||
"gitHead": "c0cf88a736a35f89f74f56c280388e63d0d212e5" | ||
} |
@@ -1,2 +0,2 @@ | ||
import React from 'react' | ||
import React, { Fragment } from 'react' | ||
import cx from 'classnames' | ||
@@ -17,3 +17,4 @@ import { ReactComponent as Remove } from '../../styles/icons/close.svg' | ||
const iconClasses = 'rdx-icon' | ||
const iconClasses = 'rdx-icon rdx-select-field-icon' | ||
const requiredIcon = <span className="rdx-icon--require">*</span> | ||
@@ -37,2 +38,3 @@ const ClearIndicator = ({ innerProps, selectProps }) => | ||
{selectProps.componentsProps.label} | ||
{selectProps.componentsProps.isRequired ? requiredIcon : null} | ||
</label> | ||
@@ -93,3 +95,2 @@ )} | ||
}) | ||
return ( | ||
@@ -119,2 +120,3 @@ <button className={classes} tabIndex={-1}> | ||
value, | ||
onOptionClick, | ||
}) => { | ||
@@ -128,2 +130,3 @@ const singleAndSelected = | ||
'is-disabled': data.isDisabled, | ||
'is-link': data.isLink, | ||
'is-focused': isFocused, | ||
@@ -141,5 +144,5 @@ 'is-selected': isSelected, | ||
{data.imgPath && ( | ||
<span className="rdx-select-option-icon-wrapper"> | ||
<span className="rdx-select-option-image-wrapper"> | ||
<img | ||
className="rdx-select-option-icon" | ||
className="rdx-select-option-image" | ||
src={data.imgPath} | ||
@@ -150,2 +153,9 @@ alt={data.imgAlt} | ||
)} | ||
{data.iconPath && ( | ||
<span className="rdx-select-option-icon-wrapper"> | ||
{safelyRender(data.iconPath, { | ||
className: 'rdx-select-option-icon', | ||
})} | ||
</span> | ||
)} | ||
@@ -184,2 +194,3 @@ <span>{label}</span> | ||
selectProps.componentsProps.dropDownPos === 'up', | ||
'is-required': selectProps.componentsProps.isRequired, | ||
'is-searchable': selectProps.isSearchable, | ||
@@ -207,21 +218,45 @@ 'is-touched': selectProps.componentsProps.isTouched, | ||
const Placeholder = ({ children, selectProps }) => | ||
isDynamic(selectProps) && !shouldUseFadeAnimation(selectProps) ? null : ( | ||
<div className="rdx-select-field-placeholder">{children}</div> | ||
const Placeholder = ({ children, selectProps }) => { | ||
return isDynamic(selectProps) && | ||
!shouldUseFadeAnimation(selectProps) ? null : ( | ||
<div className="rdx-select-field-placeholder"> | ||
{children} | ||
{selectProps.componentsProps.isRequired && | ||
!selectProps.componentsProps.label | ||
? requiredIcon | ||
: null} | ||
</div> | ||
) | ||
} | ||
const SingleValue = ({ selectProps, children }) => { | ||
return ( | ||
<> | ||
<Fragment> | ||
{selectProps.options.map(option => { | ||
if (option.label === children) { | ||
return option.imgPath ? ( | ||
<span className="rdx-select-option-icon-wrapper"> | ||
<img | ||
className="rdx-select-option-icon" | ||
src={option.imgPath} | ||
alt={option.imgAlt} | ||
/> | ||
</span> | ||
) : null | ||
if (option.imgPath) { | ||
return ( | ||
<span | ||
className="rdx-select-option-image-wrapper" | ||
key={option.value}> | ||
<img | ||
className="rdx-select-option-image" | ||
src={option.imgPath} | ||
alt={option.imgAlt} | ||
/> | ||
</span> | ||
) | ||
} | ||
if (option.iconPath) { | ||
return ( | ||
<span | ||
className="rdx-select-option-icon-wrapper" | ||
key={option.value}> | ||
{safelyRender(option.iconPath, { | ||
className: 'rdx-icon rdx-select-option-icon', | ||
})} | ||
</span> | ||
) | ||
} | ||
return null | ||
} | ||
@@ -231,3 +266,3 @@ return null | ||
<div className="rdx-select-field-value">{children}</div> | ||
</> | ||
</Fragment> | ||
) | ||
@@ -234,0 +269,0 @@ } |
@@ -6,3 +6,2 @@ import React from 'react' | ||
import { ReactComponent as IconDefaultDown } from '../../styles/icons/chevron-down.svg' | ||
import { ReactComponent as IconDefaultUp } from '../../styles/icons/chevron-up.svg' | ||
import { ReactComponent as ClearIconDefault } from '../../styles/icons/delete.svg' | ||
@@ -23,2 +22,3 @@ | ||
isMulti, | ||
isRequired, | ||
isSearchable, | ||
@@ -90,2 +90,3 @@ isTouched, | ||
label, | ||
isRequired, | ||
hasError, | ||
@@ -143,2 +144,4 @@ behaviour, | ||
/** Boolean that defines whether the <select> is autocomplete */ | ||
isRequired: PropTypes.bool, | ||
/** Boolean that defines whether the <select> is required */ | ||
isSearchable: PropTypes.bool, | ||
@@ -145,0 +148,0 @@ /** Boolean that specifies whether the <select> field has been modified */ |
@@ -37,2 +37,4 @@ import React from 'react' | ||
isDisabled: PropTypes.bool, | ||
/** Boolean that defines whether the <select> is required */ | ||
isRequired: PropTypes.bool, | ||
/** Boolean that specifies whether the <select> field has been modified */ | ||
@@ -39,0 +41,0 @@ isTouched: PropTypes.bool, |
@@ -43,2 +43,4 @@ import React from 'react' | ||
isDisabled: PropTypes.bool, | ||
/** Boolean that defines whether the <select> is required */ | ||
isRequired: PropTypes.bool, | ||
/** Boolean that specifies whether the <select> field has been modified */ | ||
@@ -45,0 +47,0 @@ isTouched: PropTypes.bool, |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
139754
1315