@proprioo/salatim 28.1.0 → 28.1.1

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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,9 @@
1
1
  ## Changelog
2
2
 
3
+ **28.1.1**
4
+
5
+ * Fix(Select): use correctly blur and onMouseDown
6
+
3
7
  **28.1.O**
4
8
 
5
9
  * Feature(Select): make tabulation great again
package/lib/index.js CHANGED
@@ -1040,7 +1040,7 @@ object-assign
1040
1040
  width: 100%;
1041
1041
  height: 100%;
1042
1042
  }
1043
- `,K$=(e,t)=>t===e,Y$=({option:e,value:t,onSelect:r})=>{const n=K$(e.value,t);return c.default.createElement(W$,{"data-test":"option-layout",isSelected:n,onClick:r},c.default.createElement(V$,{"data-test":`option-label-${e.value}`,isSelected:n,title:e.label},e.label,n&&c.default.createElement(G$,{"data-test":`checked-icon-${e.value}`},c.default.createElement(q$,null))))};var Z$;!function(e){e.LEFT="left",e.RIGHT="right"}(Z$||(Z$={}));const J$=f.default.div`
1043
+ `,K$=(e,t)=>t===e,Y$=({option:e,value:t,onSelect:r})=>{const n=K$(e.value,t);return c.default.createElement(W$,{"data-test":"option-layout",isSelected:n,onMouseDown:r},c.default.createElement(V$,{"data-test":`option-label-${e.value}`,isSelected:n,title:e.label},e.label,n&&c.default.createElement(G$,{"data-test":`checked-icon-${e.value}`},c.default.createElement(q$,null))))};var Z$;!function(e){e.LEFT="left",e.RIGHT="right"}(Z$||(Z$={}));const J$=f.default.div`
1044
1044
  position: absolute;
1045
1045
  width: 100%;
1046
1046
  top: ${w(60)};
@@ -1071,7 +1071,7 @@ object-assign
1071
1071
  :first-child {
1072
1072
  margin-top: 0;
1073
1073
  }
1074
- `;class eD extends t.PureComponent{constructor(e){super(e),this.selectItem=this.selectItem.bind(this)}selectItem(e){const{onClose:t,onSelect:r}=this.props;r(e),t()}componentDidUpdate(){const{selectedOptionRef:e}=this.props;e.current&&e.current.scrollIntoView&&e.current.scrollIntoView({behavior:"smooth",block:"nearest",inline:"end"})}render(){const{options:e,value:t,isOpen:r,selectRef:n,selectedOptionRef:o,optionsMinWidth:a,optionsAlign:i}=this.props;return r?c.default.createElement(J$,{optionsMinWidth:a,optionsAlign:i,"data-test":"select-layout",ref:n},c.default.createElement(X$,{role:"list"},e.map(((e,r)=>c.default.createElement(Q$,{"aria-label":e.label,key:r,role:"listitem",ref:K$(e.value,t)?o:void 0},c.default.createElement(Y$,{value:t,option:e,onSelect:()=>this.selectItem(e)})))))):null}}var tD=t.forwardRef(((e,t)=>c.default.createElement(eD,Object.assign({ref:t},e))));const rD=f.default.div`
1074
+ `;class eD extends t.PureComponent{constructor(e){super(e),this.selectItem=this.selectItem.bind(this)}selectItem(e){const{onClose:t,onSelect:r}=this.props;r(e),t()}componentDidUpdate(){const{selectedOptionRef:e}=this.props;e.current&&e.current.scrollIntoView&&e.current.scrollIntoView({behavior:"smooth",block:"nearest",inline:"end"})}render(){const{isOpen:e,options:t,optionsMinWidth:r,optionsAlign:n,selectRef:o,selectedOptionRef:a,value:i}=this.props;return e?c.default.createElement(J$,{optionsMinWidth:r,optionsAlign:n,"data-test":"select-layout",ref:o},c.default.createElement(X$,{role:"list"},t.map(((e,t)=>c.default.createElement(Q$,{"aria-label":e.label,key:t,role:"listitem",ref:K$(e.value,i)?a:void 0},c.default.createElement(Y$,{value:i,option:e,onSelect:()=>this.selectItem(e)})))))):null}}var tD=t.forwardRef(((e,t)=>c.default.createElement(eD,Object.assign({ref:t},e))));const rD=f.default.div`
1075
1075
  position: absolute;
1076
1076
  top: ${w(8)};
1077
1077
  right: ${w(16)};
@@ -1123,7 +1123,7 @@ object-assign
1123
1123
  color: ${m.red.base};
1124
1124
  }
1125
1125
  `}
1126
- `,aD={value:"",label:""},iD=(e,t)=>{const r=e.find((({value:e})=>e===t));return r?r.label:""},lD=({label:e,disabled:r,error:n,onChange:o,onFocus:a,onBlur:i,onSelect:l,zIndex:u=0,value:s,option:d,options:f,dataTest:p,outline:h,optionsMinWidth:y,optionsAlign:g,native:b=!1,isAutocomplete:v=!1})=>{const m=t.useRef(null),w=t.useRef(null),x=t.useRef(null),[O,_]=t.useState({isFocused:!1,isOpen:!1}),{isFocused:E,isOpen:k}=O,P=()=>{_({isFocused:!1,isOpen:!1})},S=e=>{e.target!==w.current&&(k||a&&a(),k&&i&&i(),E||_({isOpen:!k,isFocused:!E}))},C=()=>{k&&P()};z$(m,C);const $=Object.assign(Object.assign({},aD),d);return c.default.createElement(nD,{ref:m,"data-test":p?`select-wrapper-${p}`:"select-wrapper",isOpen:k,error:n,onClick:e=>{r||S(e)}},c.default.createElement(ie,Object.assign({outline:h,zIndex:k?10:u,label:e,disabled:r,error:n,focused:E,selectOnFocus:v,value:v&&s?s:$.label,dataTest:p?`input-select-wrapper-${p}`:"input-select-wrapper",field:b&&!r?c.default.createElement(H$,{label:e,displayOption:$,onChange:e=>{if(!r){const t=e.target.value,r={label:iD(f,t),value:t};S(e),l(r)}},onClickOutside:C,options:f}):c.default.createElement(tD,{"data-test":"select",isOpen:k,onClose:P,value:$.value,onSelect:l,options:f,selectRef:w,selectedOptionRef:x,optionsMinWidth:y,optionsAlign:g})},v&&o&&{onChange:o},!v&&{displayField:c.default.createElement(t.Fragment,null,c.default.createElement(oD,{readOnly:!0,"aria-label":e,value:$.label,isOpen:k,disabled:r,error:n,"data-test":p?`${p}-value`:"select-wrapper-value",onFocus:()=>{_({isOpen:!0,isFocused:!0}),a&&a()}}),!r&&c.default.createElement(rD,{isOpen:k},c.default.createElement(O$,null)))})))},uD=f.default.div`
1126
+ `,aD={value:"",label:""},iD=(e,t)=>{const r=e.find((({value:e})=>e===t));return r?r.label:""},lD=({label:e,disabled:r,error:n,onChange:o,onFocus:a,onBlur:i,onSelect:l,zIndex:u=0,value:s,option:d,options:f,dataTest:p,outline:h,optionsMinWidth:y,optionsAlign:g,native:b=!1,isAutocomplete:v=!1})=>{const m=t.useRef(null),w=t.useRef(null),x=t.useRef(null),[O,_]=t.useState({isFocused:!1,isOpen:!1}),{isFocused:E,isOpen:k}=O,P=()=>{_({isFocused:!1,isOpen:!1})},S=e=>{e.target!==w.current&&(k||a&&a(),k&&i&&i(),_(Object.assign(Object.assign({},O),{isOpen:!k})))},C=()=>{k&&P()};z$(m,C);const $=Object.assign(Object.assign({},aD),d);return c.default.createElement(nD,{ref:m,"data-test":p?`select-wrapper-${p}`:"select-wrapper",isOpen:k,error:n,onBlur:()=>{_({isOpen:!1,isFocused:!1}),i&&i()},onFocus:()=>{_({isOpen:!0,isFocused:!0}),a&&a()},onMouseDown:e=>{r||S(e)}},c.default.createElement(ie,Object.assign({dataTest:p?`input-select-wrapper-${p}`:"input-select-wrapper",disabled:r,error:n,label:e,field:b&&!r?c.default.createElement(H$,{label:e,displayOption:$,options:f,onChange:e=>{if(!r){const t=e.target.value,r={label:iD(f,t),value:t};S(e),l(r)}},onClickOutside:C}):c.default.createElement(tD,{isOpen:k,options:f,optionsMinWidth:y,optionsAlign:g,selectRef:w,selectedOptionRef:x,value:$.value,onClose:P,onSelect:l}),focused:E,outline:h,selectOnFocus:v,value:v&&s?s:$.label,zIndex:k?10:u},v&&o&&{onChange:o},!v&&{displayField:c.default.createElement(t.Fragment,null,c.default.createElement(oD,{readOnly:!0,"aria-label":e,value:$.label,isOpen:k,disabled:r,error:n,"data-test":p?`${p}-value`:"select-wrapper-value"}),!r&&c.default.createElement(rD,{isOpen:k},c.default.createElement(O$,null)))})))},uD=f.default.div`
1127
1127
  padding: ${w(24)} ${w(16)};
1128
1128
  width: 100%;
1129
1129