@loadsmart/loadsmart-ui 7.1.0 → 7.2.0

package/dist/components/Select/Select.types.d.ts

@@ -66,6 +66,7 @@ export interface SelectProps extends DropdownProps {
     onChange?: OnChange;
     onCreate?: OnCreate;
     onQueryChange?: OnQueryChange;
+    getInputProps?: () => Partial<TextFieldProps>;
     isValidNewOption?: ((query: string) => boolean) | boolean;
     createOptionPosition?: CreateOptionPosition;
     /**

package/dist/index.js

@@ -2066,7 +2066,7 @@
   border-right-color: ${r.getToken("color-neutral-light")};
   border-right-width: 1px;
   border-right-style: solid;
-`,Os=t.forwardRef((function(n,r){const{className:a}=n,l=e.__rest(n,["className"]),{disabled:i,expanded:s,toggle:c}=t.useContext(Ui),{register:u}=Sl();return d.default.createElement(Ts,{className:a},d.default.createElement(Cs,Object.assign({"data-testid":"select-trigger-search-field"},l,{ref:e=>{o.isFunction(r)&&r(e),u.setReference(e)},type:"search",disabled:i,onClick:function(){s||c()}})),d.default.createElement(js,null),d.default.createElement(ms.Handle,{"data-testid":"select-trigger-handle"}))}));function _s(e){return null==e?[]:Array.from(e.querySelectorAll("button")||[])}function zs(e){const{keys:n,onActivate:r,onDeactivate:o}=e,[a,l]=t.useState(!1),[i,s]=t.useState(-1),c=t.useRef(),[d,u]=t.useState([]);function g(){var e;s(-1),c.current&&(null===(e=c.current)||void 0===e||e.disconnect())}const f=t.useCallback((function(e){null!=e?(u(_s(e)),function(e){c.current=new MutationObserver((function(){u(_s(e))})),c.current.observe(e,{childList:!0})}(e)):g()}),[]);t.useEffect((function(){return function(){g()}}),[]),t.useEffect((function(){function e(e){const t=e,r=[...n||["TAB"]];if(!ls(t).is(r)||Re(d))return;t.preventDefault();const o=function(e,t,n){const r={Tab:e=>e.shiftKey?-1:1,ArrowUp:()=>-1,ArrowDown:()=>1},o=(r[as(e)]||function(){return 0})(e);return-1===t&&-1===o?(o+n)%n:(t+o+n)%n}(t,i,d.length);s(o),d[o].focus()}return a&&document.addEventListener("keydown",e),function(){document.removeEventListener("keydown",e)}}),[a,n,i,d]);const p=t.useCallback((function(){l(!0),null==r||r()}),[r]),h=t.useCallback((function(){l(!1),null==o||o()}),[o]);return{containerRef:f,active:a,activate:p,deactivate:h}}const Ss={getKey:e=>o.lodash_get(e,"value"),getLabel:e=>o.lodash_get(e,"label")};function Rs(e,t){return null==t?Ss:e[t]||Ss}function Ds(e,t){const n=Array.from(e);if(Re(n))return null;if(t){const e=[];for(const[,t]of n)e.push(t);return e}{const[[,e]]=n;return e}}function Ms(e,t,n){var r;if(0==t.size)return"";if(n)return"";{const o=Ds(t,n);return null!==(r=Rs(e,o._type).getLabel(o))&&void 0!==r?r:""}}function As(t,n){return e.__awaiter(this,void 0,void 0,(function*(){const e=new RegExp(String(n||"").replace(/[.*+?^${}()|[\]\\]/g,"\\$&"),"i");const r=[],o=[];for(const a of t)r.push(Promise.resolve(a.fetch({query:n,regex:e}))),o.push(a.type);const a=yield Promise.allSettled(r);let l=[];return a.forEach(((e,t)=>{if("rejected"===e.status)return;const n=o[t];l=l.concat((e.value||[]).map((e=>Object.assign(Object.assign({},e),{_type:n}))))})),l}))}function Fs(e){e.target.select()}function Ls(n){const{datasources:r,adapters:o}=n,[a,l]=t.useState(new Map),[i,s]=t.useState("idle"),c=t.useRef();function d(){null!=c.current&&clearTimeout(c.current)}const u=t.useCallback((function(t){function n(){return e.__awaiter(this,void 0,void 0,(function*(){l(new Map),s("querying");const e=yield As(r,t);l(function(e,t){const n=new Map;return e.forEach((e=>{const r=Rs(t,e._type);n.set(r.getKey(e),e)})),n}(e,o)),s("queried")}))}d(),s("pending-query"),c.current=setTimeout((()=>{n()}),750)}),[o,r]),g=t.useCallback((function(){s("idle"),l(new Map)}),[]),f=t.useCallback((function(){return Array.from(a.values())}),[a]),p=t.useCallback((function(){g(),u("")}),[g,u]),h=t.useCallback((function(e){return a.get(e)}),[a]);return t.useEffect((()=>()=>{d()}),[]),{get:f,fetch:u,clear:g,status:i,getOptionByKey:h,reset:p}}function Ns(n){const r=Dr(),{multiple:l,onQueryChange:i,onChange:s,onCreate:c,id:d,name:u,disabled:g=!1,onBlur:f,isValidNewOption:p=(e=>Boolean(e)),createOptionPosition:h="last"}=n,m=t.useMemo((()=>function(e){let t=[];var n;return t=t.concat(e.datasources||[]),t=t.concat((n=e.options)?[function(){return{type:"generic",adapter:Ss,fetch:function({regex:e}){return n.filter((({label:t})=>e.test(t)))}}}]:[]),t.map((e=>e()))}(n)),[n.datasources,n.options]),b=t.useMemo((()=>function(e){return a.toArray(e).reduce(((e,t)=>Object.assign(Object.assign({},e),{[t.type]:t.adapter})),{})}(m)),[m]),w=xs({selected:(v=n.value,a.toArray(v||[]).filter((e=>!Re(e)))),multiple:l,adapters:b,onChange:t.useCallback((function(e){null==s||s({target:{id:d,name:u,value:Ds(e,l)}})}),[d,l,u,s])});var v;const $=t.useRef(),k=zs({keys:["ARROW_UP","ARROW_DOWN"],onDeactivate(){var e;null===(e=$.current)||void 0===e||e.focus()}}),[y,x]=t.useState(!1),[P,E]=t.useState(Ms(b,w.selected,l)),T=Ls({datasources:m,adapters:b}),C=t.useMemo((()=>!P.length&&Re(T.get())&&Re(w.selected)&&o.isFunction(p)?!p(P):!p),[P,T,w.selected,p]),j=bs(Object.assign(Object.assign({},n),{expandDisabled:C}));t.useEffect((()=>{y&&(T.fetch(P),j.expand())}),[P,y]);const O=t.useCallback((function(e){const t=Rs(b,e._type),n=t.getKey(e);return{label:t.getLabel(e),value:n,checked:w.selected.has(n)}}),[b,w.selected]),_=t.useCallback((function(e){let t=T.getOptionByKey(e);return t||(t=w.selected.get(e)),t}),[T,w.selected]),z=t.useCallback((function(e){w.toggle(e)}),[w]),S=t.useCallback((function(){return{toggle:j.toggle,expanded:j.expanded,onBlur(e){x(!1),E(l?"":Ms(b,w.selected,l)),T.reset(),null==f||f(e)},expandDisabled:C}}),[b,j.expanded,j.toggle,l,T,w.selected,f,C]),R=t.useCallback((function(){return{id:d,ref(e){null!=e&&($.current=e)},value:P,onChange(e){const t=e.target.value.replace(/\s+/,"");x(""!==t),null==i||i(e),E(e.target.value)},onFocus:Fs}}),[d,P,i,j,T,w.selected]),D=t.useCallback((function(){return{onClick(){var e;x(!1),E(""),w.clear(),T.reset(),null===(e=$.current)||void 0===e||e.focus()}}}),[T,w]),M=t.useCallback((function(){return{ref:k.containerRef,role:"listbox"}}),[k.containerRef]),A=t.useCallback((function({option:e}){const{value:t,checked:n,label:r}=O(e);return{role:"option","aria-selected":n,id:String(t),onClick:()=>(x(!1),l||x(!1),z(e),l),tabIndex:-1}}),[O,z,l]),F=t.useCallback((function(){return{onClick:function(){return function(){e.__awaiter(this,void 0,void 0,(function*(){if(!o.isFunction(c))return;const e=c(P);let t;var n;e&&(n=e,t=a.isObject(n)&&o.isFunction(n.then)?yield e:e),T.fetch(P),t&&z(t)}))}(),l},tabIndex:-1}}),[l,c,P,T,z]),L=t.useCallback((function(){const e=e=>O(e).label.toLocaleLowerCase()===P.toLocaleLowerCase();return o.isFunction(c)&&"queried"===T.status&&(o.isFunction(p)?p(P)&&!!a.isNil([...T.get(),...Array.from(w.selected.values())].find(e)):p)}),[O,p,c,T,P,w.selected]);return t.useEffect((function(){T.fetch("")}),[m]),t.useEffect((function(){(n.autoFocus||r)&&(j.expanded?k.activate():k.deactivate())}),[j.expanded]),t.useEffect((function(){l||E(Ms(b,w.selected,l))}),[b,l,w.selected]),{status:T.status,options:T.get(),value:Ds(w.selected,l),query:P,disabled:g,selectable:w,getMenuProps:M,getSelectableOption:O,getOption:_,getOptionProps:A,getTriggerProps:R,getClearProps:D,getDropdownProps:S,getCreatebleProps:F,isCreatable:L,createOptionPosition:h}}const Bs=g.default.span`
+`,Os=t.forwardRef((function(n,r){const{className:a}=n,l=e.__rest(n,["className"]),{disabled:i,expanded:s,toggle:c}=t.useContext(Ui),{register:u}=Sl();return d.default.createElement(Ts,{className:a},d.default.createElement(Cs,Object.assign({},l,{"data-testid":"select-trigger-search-field",ref:e=>{o.isFunction(r)&&r(e),u.setReference(e)},type:"search",disabled:i,onClick:function(){s||c()}})),d.default.createElement(js,null),d.default.createElement(ms.Handle,{"data-testid":"select-trigger-handle"}))}));function _s(e){return null==e?[]:Array.from(e.querySelectorAll("button")||[])}function zs(e){const{keys:n,onActivate:r,onDeactivate:o}=e,[a,l]=t.useState(!1),[i,s]=t.useState(-1),c=t.useRef(),[d,u]=t.useState([]);function g(){var e;s(-1),c.current&&(null===(e=c.current)||void 0===e||e.disconnect())}const f=t.useCallback((function(e){null!=e?(u(_s(e)),function(e){c.current=new MutationObserver((function(){u(_s(e))})),c.current.observe(e,{childList:!0})}(e)):g()}),[]);t.useEffect((function(){return function(){g()}}),[]),t.useEffect((function(){function e(e){const t=e,r=[...n||["TAB"]];if(!ls(t).is(r)||Re(d))return;t.preventDefault();const o=function(e,t,n){const r={Tab:e=>e.shiftKey?-1:1,ArrowUp:()=>-1,ArrowDown:()=>1},o=(r[as(e)]||function(){return 0})(e);return-1===t&&-1===o?(o+n)%n:(t+o+n)%n}(t,i,d.length);s(o),d[o].focus()}return a&&document.addEventListener("keydown",e),function(){document.removeEventListener("keydown",e)}}),[a,n,i,d]);const p=t.useCallback((function(){l(!0),null==r||r()}),[r]),h=t.useCallback((function(){l(!1),null==o||o()}),[o]);return{containerRef:f,active:a,activate:p,deactivate:h}}const Ss={getKey:e=>o.lodash_get(e,"value"),getLabel:e=>o.lodash_get(e,"label")};function Rs(e,t){return null==t?Ss:e[t]||Ss}function Ds(e,t){const n=Array.from(e);if(Re(n))return null;if(t){const e=[];for(const[,t]of n)e.push(t);return e}{const[[,e]]=n;return e}}function Ms(e,t,n){var r;if(0==t.size)return"";if(n)return"";{const o=Ds(t,n);return null!==(r=Rs(e,o._type).getLabel(o))&&void 0!==r?r:""}}function As(t,n){return e.__awaiter(this,void 0,void 0,(function*(){const e=new RegExp(String(n||"").replace(/[.*+?^${}()|[\]\\]/g,"\\$&"),"i");const r=[],o=[];for(const a of t)r.push(Promise.resolve(a.fetch({query:n,regex:e}))),o.push(a.type);const a=yield Promise.allSettled(r);let l=[];return a.forEach(((e,t)=>{if("rejected"===e.status)return;const n=o[t];l=l.concat((e.value||[]).map((e=>Object.assign(Object.assign({},e),{_type:n}))))})),l}))}function Fs(e){e.target.select()}function Ls(n){const{datasources:r,adapters:o}=n,[a,l]=t.useState(new Map),[i,s]=t.useState("idle"),c=t.useRef();function d(){null!=c.current&&clearTimeout(c.current)}const u=t.useCallback((function(t){function n(){return e.__awaiter(this,void 0,void 0,(function*(){l(new Map),s("querying");const e=yield As(r,t);l(function(e,t){const n=new Map;return e.forEach((e=>{const r=Rs(t,e._type);n.set(r.getKey(e),e)})),n}(e,o)),s("queried")}))}d(),s("pending-query"),c.current=setTimeout((()=>{n()}),750)}),[o,r]),g=t.useCallback((function(){s("idle"),l(new Map)}),[]),f=t.useCallback((function(){return Array.from(a.values())}),[a]),p=t.useCallback((function(){g(),u("")}),[g,u]),h=t.useCallback((function(e){return a.get(e)}),[a]);return t.useEffect((()=>()=>{d()}),[]),{get:f,fetch:u,clear:g,status:i,getOptionByKey:h,reset:p}}function Ns(n){const r=Dr(),{multiple:l,onQueryChange:i,onChange:s,onCreate:c,getInputProps:d,id:u,name:g,disabled:f=!1,onBlur:p,isValidNewOption:h=(e=>Boolean(e)),createOptionPosition:m="last"}=n,b=t.useMemo((()=>function(e){let t=[];var n;return t=t.concat(e.datasources||[]),t=t.concat((n=e.options)?[function(){return{type:"generic",adapter:Ss,fetch:function({regex:e}){return n.filter((({label:t})=>e.test(t)))}}}]:[]),t.map((e=>e()))}(n)),[n.datasources,n.options]),w=t.useMemo((()=>function(e){return a.toArray(e).reduce(((e,t)=>Object.assign(Object.assign({},e),{[t.type]:t.adapter})),{})}(b)),[b]),v=xs({selected:($=n.value,a.toArray($||[]).filter((e=>!Re(e)))),multiple:l,adapters:w,onChange:t.useCallback((function(e){null==s||s({target:{id:u,name:g,value:Ds(e,l)}})}),[u,l,g,s])});var $;const k=t.useRef(),y=zs({keys:["ARROW_UP","ARROW_DOWN"],onDeactivate(){var e;null===(e=k.current)||void 0===e||e.focus()}}),[x,P]=t.useState(!1),[E,T]=t.useState(Ms(w,v.selected,l)),C=Ls({datasources:b,adapters:w}),j=t.useMemo((()=>!E.length&&Re(C.get())&&Re(v.selected)&&o.isFunction(h)?!h(E):!h),[E,C,v.selected,h]),O=bs(Object.assign(Object.assign({},n),{expandDisabled:j}));t.useEffect((()=>{x&&(C.fetch(E),O.expand())}),[E,x]);const _=t.useCallback((function(e){const t=Rs(w,e._type),n=t.getKey(e);return{label:t.getLabel(e),value:n,checked:v.selected.has(n)}}),[w,v.selected]),z=t.useCallback((function(e){let t=C.getOptionByKey(e);return t||(t=v.selected.get(e)),t}),[C,v.selected]),S=t.useCallback((function(e){v.toggle(e)}),[v]),R=t.useCallback((function(){return{toggle:O.toggle,expanded:O.expanded,onBlur(e){P(!1),T(l?"":Ms(w,v.selected,l)),C.reset(),null==p||p(e)},expandDisabled:j}}),[w,O.expanded,O.toggle,l,C,v.selected,p,j]),D=t.useCallback((function(){return Object.assign(Object.assign({},null==d?void 0:d()),{id:u,ref(e){null!=e&&(k.current=e)},value:E,onChange(e){const t=e.target.value.replace(/\s+/,"");P(""!==t),null==i||i(e),T(e.target.value)},onFocus:Fs})}),[u,E,i,O,C,v.selected]),M=t.useCallback((function(){return{onClick(){var e;P(!1),T(""),v.clear(),C.reset(),null===(e=k.current)||void 0===e||e.focus()}}}),[C,v]),A=t.useCallback((function(){return{ref:y.containerRef,role:"listbox"}}),[y.containerRef]),F=t.useCallback((function({option:e}){const{value:t,checked:n,label:r}=_(e);return{role:"option","aria-selected":n,id:String(t),onClick:()=>(P(!1),l||P(!1),S(e),l),tabIndex:-1}}),[_,S,l]),L=t.useCallback((function(){return{onClick:function(){return function(){e.__awaiter(this,void 0,void 0,(function*(){if(!o.isFunction(c))return;const e=c(E);let t;var n;e&&(n=e,t=a.isObject(n)&&o.isFunction(n.then)?yield e:e),C.fetch(E),t&&S(t)}))}(),l},tabIndex:-1}}),[l,c,E,C,S]),N=t.useCallback((function(){const e=e=>_(e).label.toLocaleLowerCase()===E.toLocaleLowerCase();return o.isFunction(c)&&"queried"===C.status&&(o.isFunction(h)?h(E)&&!!a.isNil([...C.get(),...Array.from(v.selected.values())].find(e)):h)}),[_,h,c,C,E,v.selected]);return t.useEffect((function(){C.fetch("")}),[b]),t.useEffect((function(){(n.autoFocus||r)&&(O.expanded?y.activate():y.deactivate())}),[O.expanded]),t.useEffect((function(){l||T(Ms(w,v.selected,l))}),[w,l,v.selected]),{status:C.status,options:C.get(),value:Ds(v.selected,l),query:E,disabled:f,selectable:v,getMenuProps:A,getSelectableOption:_,getOption:z,getOptionProps:F,getTriggerProps:D,getClearProps:M,getDropdownProps:R,getCreatebleProps:L,isCreatable:N,createOptionPosition:m}}const Bs=g.default.span`
   /* highlightMatch splits the label into separate HTML elements, thus we need
   to preserve white-spaces, otherwise the browser wouldn't render them. */
   white-space: pre;