@bikdotai/bik-component-library 0.0.795 → 0.0.796-beta.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/dist/cjs/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
- package/dist/cjs/components/avatar/Avatar.d.ts +2 -1
- package/dist/cjs/components/avatar/Avatar.js +1 -1
- package/dist/cjs/components/avatar/AvatarHelper.d.ts +2 -0
- package/dist/cjs/components/avatar/AvatarHelper.js +1 -1
- package/dist/cjs/components/bik-layout/BikSidebarV2/BikSidebarV2.d.ts +33 -0
- package/dist/cjs/components/bik-layout/BikSidebarV2/BikSidebarV2.js +1 -0
- package/dist/cjs/components/bik-layout/BikSidebarV2/SidebarV2.model.d.ts +27 -0
- package/dist/cjs/components/bik-layout/BikSidebarV2/SidebarV2Popup.d.ts +13 -0
- package/dist/cjs/components/bik-layout/BikSidebarV2/SidebarV2Popup.js +1 -0
- package/dist/cjs/components/bik-layout/BikSidebarV2/SidebarV2Styles.d.ts +44 -0
- package/dist/cjs/components/bik-layout/BikSidebarV2/SidebarV2Styles.js +287 -0
- package/dist/cjs/components/bik-layout/BikSidebarV2/SimpleSidebarV2.d.ts +3 -0
- package/dist/cjs/components/bik-layout/BikSidebarV2/SimpleSidebarV2.js +1 -0
- package/dist/cjs/components/bik-layout/index.d.ts +2 -0
- package/dist/cjs/components/button/Button.styled.d.ts +1 -1
- package/dist/cjs/components/button/model.d.ts +1 -1
- package/dist/cjs/components/button/themes.d.ts +1 -1
- package/dist/cjs/components/country-code-picker/CountryCodePicker.d.ts +1 -1
- package/dist/cjs/components/country-code-picker/CountryPicker.d.ts +1 -1
- package/dist/cjs/components/dropdown/Dropdown.js +1 -1
- package/dist/cjs/components/dropdown/DropdownPopover/index.js +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/OpennedDropdown.js +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.d.ts +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.js +6 -5
- package/dist/cjs/components/dropdown/OpenedDropdown/components/description/Description.d.ts +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/description/Description.styled.d.ts +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/FreeFormMenu.d.ts +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/MenuItem.d.ts +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/MenuItem.js +7 -7
- package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/MenuList.d.ts +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/MenuList.styled.d.ts +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/SelectAllMenu.d.ts +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.d.ts +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.js +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.d.ts +1 -0
- package/dist/cjs/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.js +1 -1
- package/dist/cjs/components/dropdown/type.d.ts +1 -1
- package/dist/cjs/components/fab-menu/FABMenu.d.ts +1 -1
- package/dist/cjs/components/icon-button/IconButton.js +1 -1
- package/dist/cjs/components/icon-button/IconButton.styled.d.ts +1 -0
- package/dist/cjs/components/icon-button/IconButton.styled.js +3 -3
- package/dist/cjs/components/icon-button/model.d.ts +5 -0
- package/dist/cjs/components/input/Input.js +1 -1
- package/dist/cjs/components/input/Input.model.d.ts +2 -1
- package/dist/cjs/components/input/Input.styled.d.ts +16 -1
- package/dist/cjs/components/input/Input.styled.js +1 -1
- package/dist/cjs/components/list-item/List.model.d.ts +1 -1
- package/dist/cjs/components/list-item/ListItem.js +1 -1
- package/dist/cjs/components/list-item/ListItem.styled.d.ts +1 -1
- package/dist/cjs/components/list-item/ListItem.styled.js +1 -1
- package/dist/cjs/components/list-item/themes.d.ts +2 -2
- package/dist/cjs/components/list-item/themes.js +1 -1
- package/dist/cjs/components/multi-level-dropdown/GroupedMenuList.d.ts +1 -0
- package/dist/cjs/components/multi-level-dropdown/GroupedMenuList.js +1 -1
- package/dist/cjs/components/multi-level-dropdown/MenuItem.d.ts +1 -0
- package/dist/cjs/components/multi-level-dropdown/MenuItem.js +1 -1
- package/dist/cjs/components/multi-level-dropdown/MenuList.d.ts +1 -0
- package/dist/cjs/components/multi-level-dropdown/MenuList.js +1 -1
- package/dist/cjs/components/multi-level-dropdown/MultiLevelDropdown.js +1 -1
- package/dist/cjs/components/multi-level-dropdown/MultiLevelDropdown.styled.d.ts +13 -3
- package/dist/cjs/components/multi-level-dropdown/MultiLevelDropdown.styled.js +33 -30
- package/dist/cjs/components/multi-level-dropdown/type.d.ts +1 -0
- package/dist/cjs/components/tag/Tag.js +1 -1
- package/dist/cjs/components/tag/Tag.styled.d.ts +1 -1
- package/dist/cjs/components/tag/Tag.styled.js +1 -1
- package/dist/cjs/components/tag/model.d.ts +1 -1
- package/dist/cjs/components/whats-new/WhatsNew.d.ts +2 -0
- package/dist/cjs/components/whats-new/WhatsNew.js +1 -1
- package/dist/cjs/components/whats-new/WhatsNew.types.d.ts +2 -0
- package/dist/cjs/components/whats-new/WhatsNewButton.js +1 -1
- package/dist/cjs/constants/Theme.d.ts +6 -0
- package/dist/cjs/constants/Theme.js +1 -1
- package/dist/cjs/icons/Arrows/Chevron/ChevronUp.d.ts +1 -2
- package/dist/cjs/icons/Arrows/Chevron/ChevronUp.js +1 -1
- package/dist/cjs/index.js +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
- package/dist/esm/components/avatar/Avatar.d.ts +2 -1
- package/dist/esm/components/avatar/Avatar.js +1 -1
- package/dist/esm/components/avatar/AvatarHelper.d.ts +2 -0
- package/dist/esm/components/avatar/AvatarHelper.js +1 -1
- package/dist/esm/components/bik-layout/BikSidebarV2/BikSidebarV2.d.ts +33 -0
- package/dist/esm/components/bik-layout/BikSidebarV2/BikSidebarV2.js +1 -0
- package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2.model.d.ts +27 -0
- package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Popup.d.ts +13 -0
- package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Popup.js +1 -0
- package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Styles.d.ts +44 -0
- package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Styles.js +287 -0
- package/dist/esm/components/bik-layout/BikSidebarV2/SimpleSidebarV2.d.ts +3 -0
- package/dist/esm/components/bik-layout/BikSidebarV2/SimpleSidebarV2.js +1 -0
- package/dist/esm/components/bik-layout/index.d.ts +2 -0
- package/dist/esm/components/button/Button.styled.d.ts +1 -1
- package/dist/esm/components/button/model.d.ts +1 -1
- package/dist/esm/components/button/themes.d.ts +1 -1
- package/dist/esm/components/country-code-picker/CountryCodePicker.d.ts +1 -1
- package/dist/esm/components/country-code-picker/CountryPicker.d.ts +1 -1
- package/dist/esm/components/dropdown/Dropdown.js +1 -1
- package/dist/esm/components/dropdown/DropdownPopover/index.js +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/OpennedDropdown.js +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.d.ts +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.js +3 -2
- package/dist/esm/components/dropdown/OpenedDropdown/components/description/Description.d.ts +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/description/Description.styled.d.ts +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/menu/FreeFormMenu.d.ts +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuItem.d.ts +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuItem.js +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.d.ts +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.styled.d.ts +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/menu/SelectAllMenu.d.ts +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.d.ts +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.js +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.d.ts +1 -0
- package/dist/esm/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.js +1 -1
- package/dist/esm/components/dropdown/type.d.ts +1 -1
- package/dist/esm/components/fab-menu/FABMenu.d.ts +1 -1
- package/dist/esm/components/icon-button/IconButton.js +1 -1
- package/dist/esm/components/icon-button/IconButton.styled.d.ts +1 -0
- package/dist/esm/components/icon-button/IconButton.styled.js +1 -1
- package/dist/esm/components/icon-button/model.d.ts +5 -0
- package/dist/esm/components/input/Input.js +1 -1
- package/dist/esm/components/input/Input.model.d.ts +2 -1
- package/dist/esm/components/input/Input.styled.d.ts +16 -1
- package/dist/esm/components/input/Input.styled.js +1 -1
- package/dist/esm/components/list-item/List.model.d.ts +1 -1
- package/dist/esm/components/list-item/ListItem.js +1 -1
- package/dist/esm/components/list-item/ListItem.styled.d.ts +1 -1
- package/dist/esm/components/list-item/ListItem.styled.js +1 -1
- package/dist/esm/components/list-item/themes.d.ts +2 -2
- package/dist/esm/components/list-item/themes.js +1 -1
- package/dist/esm/components/multi-level-dropdown/GroupedMenuList.d.ts +1 -0
- package/dist/esm/components/multi-level-dropdown/GroupedMenuList.js +1 -1
- package/dist/esm/components/multi-level-dropdown/MenuItem.d.ts +1 -0
- package/dist/esm/components/multi-level-dropdown/MenuItem.js +1 -1
- package/dist/esm/components/multi-level-dropdown/MenuList.d.ts +1 -0
- package/dist/esm/components/multi-level-dropdown/MenuList.js +1 -1
- package/dist/esm/components/multi-level-dropdown/MultiLevelDropdown.js +1 -1
- package/dist/esm/components/multi-level-dropdown/MultiLevelDropdown.styled.d.ts +13 -3
- package/dist/esm/components/multi-level-dropdown/MultiLevelDropdown.styled.js +32 -29
- package/dist/esm/components/multi-level-dropdown/type.d.ts +1 -0
- package/dist/esm/components/tag/Tag.js +1 -1
- package/dist/esm/components/tag/Tag.styled.d.ts +1 -1
- package/dist/esm/components/tag/Tag.styled.js +1 -1
- package/dist/esm/components/tag/model.d.ts +1 -1
- package/dist/esm/components/whats-new/WhatsNew.d.ts +2 -0
- package/dist/esm/components/whats-new/WhatsNew.js +1 -1
- package/dist/esm/components/whats-new/WhatsNew.types.d.ts +2 -0
- package/dist/esm/components/whats-new/WhatsNewButton.js +1 -1
- package/dist/esm/constants/Theme.d.ts +6 -0
- package/dist/esm/constants/Theme.js +1 -1
- package/dist/esm/icons/Arrows/Chevron/ChevronUp.d.ts +1 -2
- package/dist/esm/icons/Arrows/Chevron/ChevronUp.js +1 -1
- package/dist/esm/index.js +1 -1
- package/package.json +1 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),o=require("react/jsx-runtime"),t=require("react"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),o=require("react/jsx-runtime"),t=require("react"),r=require("react-popper"),n=require("../../dropShadow/DropShadow.js"),s=require("../../tooltips/Tooltip.js"),i=require("../../../constants/Theme.js"),l=require("../Common.styled.js"),a=require("../OpenedDropdown/components/OpennedDropdown.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const p=d(t).default.forwardRef(((d,p)=>{var{children:c,onDropdownVisbilityChange:u,version:v="1.0",tooltipContent:b,tooltipDirection:j,showTooltipArrow:w,isChildLoading:g,forceOpen:h}=d,O=e.__rest(d,["children","onDropdownVisbilityChange","version","tooltipContent","tooltipDirection","showTooltipArrow","isChildLoading","forceOpen"]);const f=p,[D,x]=t.useState(!1),[S,C]=t.useState(!1),[y,m]=t.useState(null),[q,R]=t.useState(null),E=t.useRef(null),{styles:L,attributes:_}=r.usePopper(y,q,{placement:O.placement,strategy:O.strategy}),M=e=>{var o,t;"2.0"===v&&O.isMultiSelect&&e&&(null===(o=O.onSelect)||void 0===o||o.call(O,[...e])),x(!1),null===(t=null==O?void 0:O.onClose)||void 0===t||t.call(O)};t.useImperativeHandle(f,(()=>({openDropdown:D})),[]),t.useEffect((()=>{(null==f?void 0:f.current)&&(f.current.openDropdown=D)}),[D]),t.useEffect((()=>{null==u||u(D)}),[D]);const T=()=>{var e;return o.jsxs(o.Fragment,{children:[o.jsxs("div",Object.assign({style:Object.assign({position:"relative"},"3.0"===v&&{backgroundColor:D||S?i.COLORS.surface.hovered:i.COLORS.surface.standard,transition:"background-color 0.3s ease",borderRadius:4}),ref:m,onMouseEnter:"3.0"===v?()=>C(!0):void 0,onMouseLeave:"3.0"===v?()=>C(!1):void 0},{children:[o.jsx(l.OverLapAbs,Object.assign({ref:E,allowEvents:O.allowEvents,disabled:O.disabled,onClick:e=>{var o;null===(o=O.onDropdownOpen)||void 0===o||o.call(O),D?(x(!1),e.preventDefault()):O.disabled||x(!0)},isChildLoading:g},{children:O.allowEvents?c:null})),O.allowEvents?null:c]})),(D||h)&&o.jsx(l.OpenDropdownContainer,Object.assign({ref:R,style:Object.assign(Object.assign({},L.popper),{zIndex:null!==(e=O.dropdownZIndex)&&void 0!==e?e:3})},_.popper,{"data-test":O["data-test"]},{children:o.jsx(n.DropShadow,Object.assign({level:"z2",position:"down",style:{borderRadius:"3.0"===v?4:8,boxShadow:"0 2px 8px 0 rgba(0, 0, 0, 0.12)"}},{children:o.jsx(a.OpenedDropdown,Object.assign({},O,{onSelect:e=>{var o;"2.0"===v&&O.isMultiSelect||(null===(o=O.onSelect)||void 0===o||o.call(O,e),x(!1))},onClose:M,version:v,headerRef:E,zeroState:null==O?void 0:O.zeroState,isDraggable:O.isDraggable,onOptionsReorder:O.onOptionsReorder}))}))}))]})};return o.jsx(o.Fragment,{children:D||h||void 0===b?T():o.jsx(s.Tooltip,Object.assign({body:b,placement:j,hideArrow:!w},{children:o.jsx("div",Object.assign({"data-test":O["data-test"]},{children:T()}))}))})}));p.displayName="DropdownPopover",exports.DropdownPopover=p;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../../assets/icons/errorInfo.svg.js"),n=require("../../../../assets/icons/refresh-purple.svg.js"),o=require("react"),s=require("../../../zeroState/ZeroState.js"),r=require("../../../../hooks/useOutside.js"),i=require("../../../../constants/Theme.js"),l=require("../../hooks/useDropdown.js"),u=require("./description/Description.js"),c=require("./menu/FreeFormMenu.js"),a=require("./menu/MenuList.js"),d=require("./menu/SelectAllMenu.js"),p=require("./multiSelect/MultiSelectDropdownBottomBar.js"),h=require("./OpennedDropdown.styled.js"),f=require("./searchbox/SearchBox.js"),g=require("./searchbox/SearchZeroState.js");const b=304,S=290;exports.OpenedDropdown=v=>{let{options:j,isSearchable:O,isMultiSelect:x,maxSelections:m,width:w,allowFreeForm:C,height:y,onClose:k,onSelect:L,onSearch:D,version:q,skipSorting:E,headerRef:M,hideSelectAll:R,primaryButtonText:I,onInfiniteScroll:T,onMultiSelectClear:F,onDropdownItemClick:A,buttonOptions:B,isSearchLoading:H,isOptionsLoading:Z,optionsErrorState:z,disableSearchOptions:P,disableSearchedOptionExcept:V,useDefaultCursor:W,containerStyle:$={},zeroState:_,isDraggable:K=!1,onOptionsReorder:N,hideClearButton:U=!1,showCheckboxForCustomElement:G=!1}=v;var J;const Q=o.useCallback((e=>{if(!K||!x)return e;const t=[],n=[];return e.forEach((e=>{if(e.options)n.push(e);else{e.selected?t.push(e):n.push(e)}})),[...t,...n]}),[K,x]),[X,Y]=o.useState((()=>Q(j))),ee=o.useRef(X),te=o.useRef(!1),ne=o.useRef(N);o.useEffect((()=>{Y(Q(j))}),[j,Q]),o.useEffect((()=>{ee.current=X}),[X]),o.useEffect((()=>{ne.current=N}),[N]),o.useEffect((()=>()=>{te.current&&ne.current&&ne.current(ee.current)}),[]);const oe=o.useCallback((e=>{Y(e),"2.0"===q?null==N||N(e):te.current=!0}),[N,q]),se=K?X:j,{dropdownOptions:re,search:ie,searchedString:le,searchedOptions:ue,searchError:ce,retrySearch:ae,onApplyHandler:de,selectAllHandler:pe,onMultiSelectClear:he,onFreeFormSelect:fe,onMultiSelectApply:ge,latestDropdownOptionsRef:be,getSelectedOptions:Se,getCurrentSelectionCount:ve}=l.useDropdown(q,se,L,E||K,x,D,P,V,m),[je,Oe]=o.useState(null!=w?w:S),[xe,me]=o.useState(null),[we,Ce]=o.useState(-1),ye=o.useRef(null),ke=o.useRef([]),Le=o.useRef(null);r.useOutside(ye,(()=>{if(me(null),x&&"2.0"===q){const e=Se(be.current);null==k||k(e)}else null==k||k(re)}),[M,ke]),o.useEffect((()=>{const e=setTimeout((()=>{ye.current&&ye.current.focus({preventScroll:!0})}),0);return()=>clearTimeout(e)}),[]);o.useEffect((()=>{const e=e=>{const t=(e=>{const t=[];return e.forEach((e=>{if(e.options)e.options.forEach((e=>{e.disabled||t.push(e)}));else{const n=e;n.disabled||t.push(n)}})),t})(le&&D?ue:re);if(0!==t.length)if("ArrowDown"===e.key)e.preventDefault(),Ce((e=>{const n=e<t.length-1?e+1:0;return setTimeout((()=>{var e;const t=null===(e=Le.current)||void 0===e?void 0:e.querySelector(`[data-option-index="${n}"]`);t&&t.scrollIntoView({block:"nearest",behavior:"smooth"})}),0),n}));else if("ArrowUp"===e.key)e.preventDefault(),Ce((e=>{const n=e>0?e-1:t.length-1;return setTimeout((()=>{var e;const t=null===(e=Le.current)||void 0===e?void 0:e.querySelector(`[data-option-index="${n}"]`);t&&t.scrollIntoView({block:"nearest",behavior:"smooth"})}),0),n}));else if("Enter"===e.key&&we>=0){e.preventDefault();const n=t[we];n&&(de(Object.assign(Object.assign({},n),{selected:!n.selected})),A&&A(n))}},t=ye.current;if(t)return t.addEventListener("keydown",e),()=>{t.removeEventListener("keydown",e)}}),[we,le,ue,re,D,de,A]);const De=null!=y?y:b,qe="number"==typeof De?O&&x?De-96:O&&!x||!O&&x?De-48:De:De;o.useEffect((()=>{const e=null!=w?w:S;if(null===xe)Oe(e);else if("number"==typeof e)Oe(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));Oe(t)}}),[xe]);const Ee=[],Me=(e=>{if(!x||!m&&0!==m)return e;const t=ve(re)>=m;return t?e.map((e=>{if(e.options)return Object.assign(Object.assign({},e),{options:e.options.map((e=>Object.assign(Object.assign({},e),{disabled:e.disabled||!e.selected&&t})))});{const n=e;return Object.assign(Object.assign({},n),{disabled:n.disabled||!n.selected&&t})}})):e})((le&&D?ue:re).map((e=>{var t,n;if(le&&!D){if(e.options){const t=Object.assign({},e);return t.options=t.options.filter((e=>{var t;return!!(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(le.toLowerCase()))&&(Ee.push(!le||e.label===le),!0)})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(le.toLowerCase()))||(null===(n=e.searchKey)||void 0===n?void 0:n.toLowerCase().includes(le.toLowerCase()))?(Ee.push(!le||e.label===le),e):null}return e})).filter((e=>null!==e))),Re=!!O&&le&&0===Me.length,Ie=!le&&!!Z,Te=!le&&!!z&&!Ie,Fe=!(le||Me.length||Ie||Te),Ae=Ie||Te||Fe,Be=(null==_?void 0:_.title)||"No results found",He=(null==_?void 0:_.subTitle)||"Please try again later or contact us at support@bik.ai if you require further assistance.",Ze=(null==z?void 0:z.title)||"Failed to load options",ze=(null==z?void 0:z.subTitle)||"Something went wrong while fetching the list. Please try again",Pe={buttonText:"Try again",buttonType:"text",size:"small",buttonTextColor:i.COLORS.background.inverseLight,customIconColor:i.COLORS.background.inverseLight,LeadingIcon:n.default},Ve=Object.assign({IconHolderStyle:{background:i.COLORS.background.negative.light},Icon:e.jsx(t.default,{color:i.COLORS.content.negative,width:24,height:24})},z);Ve.actionButton=Object.assign(Object.assign({},Pe),null!==(J=null==z?void 0:z.actionButton)&&void 0!==J?J:{});const We=Ie?void 0:Te?Ve:_;return e.jsxs(h.OpennedDropdownContainer,Object.assign({version:q,ref:ye,tabIndex:-1,style:Object.assign(Object.assign({width:je},$),{outline:"none"})},{children:[e.jsxs("div",Object.assign({style:{width:xe?"50%":"100%",display:"flex",flexDirection:"column",background:"white"}},{children:[!!O&&e.jsx(f.SearchBox,{onSearch:ie,version:q}),Ae?e.jsx("div",Object.assign({style:{height:De,display:"flex",background:i.COLORS.background.base}},{children:e.jsx(s.ZeroState,Object.assign({},null!=We?We:{},{isLoading:Ie,title:Te?Ze:Be,subTitle:Te?ze:He}))})):e.jsxs(h.MenuListContainer,Object.assign({minHeight:De,maxHeight:qe,ref:Le},{children:[!!x&&!Re&&!R&&e.jsx(d.SelectAllMenu,{version:q,options:le&&D?ue:re,onSelect:pe}),!C&&Re&&e.jsx(g.SearchZeroState,{isLoading:H,errorMessage:ce,onRetry:ae,height:qe,searchedString:le,containerWidth:w}),C&&(Re||!!Ee.length&&Ee.every((e=>!1===e)))&&e.jsx(c.FreeFormMenu,{version:q,isMultiSelect:x,onSelect:fe,searchedString:le}),e.jsx(a.MenuList,{onInfiniteScroll:T,onDropdownItemClick:A,version:q,onSelect:de,showDescription:function(e,t){me(e&&t?{title:e,description:t}:null)},isMultiSelect:x,options:Me,useDefaultCursor:W,ref:ke,focusedIndex:we,isDraggable:K,onOptionsReorder:oe,showCheckboxForCustomElement:G})]})),!!x&&!Ae&&"2.0"!==q&&e.jsx(p.default,{onClear:()=>{he(),null==F||F()},onApply:ge,list:le&&D?ue:re,buttonText:I,buttonOptions:B,hideClearButton:U})]})),!!xe&&e.jsx(u.Description,{title:xe.title,description:xe.description,version:q})]}))};
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../../assets/icons/errorInfo.svg.js"),n=require("../../../../assets/icons/refresh-purple.svg.js"),o=require("react"),s=require("../../../zeroState/ZeroState.js"),r=require("../../../../hooks/useOutside.js"),i=require("../../../../constants/Theme.js"),l=require("../../hooks/useDropdown.js"),u=require("./description/Description.js"),c=require("./menu/FreeFormMenu.js"),a=require("./menu/MenuList.js"),d=require("./menu/SelectAllMenu.js"),p=require("./multiSelect/MultiSelectDropdownBottomBar.js"),h=require("./OpennedDropdown.styled.js"),f=require("./searchbox/SearchBox.js"),g=require("./searchbox/SearchZeroState.js");const b=304,S=290;exports.OpenedDropdown=v=>{let{options:j,isSearchable:O,isMultiSelect:x,maxSelections:m,width:w,allowFreeForm:C,height:y,onClose:k,onSelect:L,onSearch:D,version:q,skipSorting:E,headerRef:M,hideSelectAll:R,primaryButtonText:I,onInfiniteScroll:T,onMultiSelectClear:F,onDropdownItemClick:A,buttonOptions:B,isSearchLoading:H,isOptionsLoading:Z,optionsErrorState:z,disableSearchOptions:P,disableSearchedOptionExcept:V,useDefaultCursor:W,containerStyle:$={},zeroState:_,isDraggable:K=!1,onOptionsReorder:N,hideClearButton:U=!1,showCheckboxForCustomElement:G=!1}=v;var J;const Q=o.useCallback((e=>{if(!K||!x)return e;const t=[],n=[];return e.forEach((e=>{if(e.options)n.push(e);else{e.selected?t.push(e):n.push(e)}})),[...t,...n]}),[K,x]),[X,Y]=o.useState((()=>Q(j))),ee=o.useRef(X),te=o.useRef(!1),ne=o.useRef(N);o.useEffect((()=>{Y(Q(j))}),[j,Q]),o.useEffect((()=>{ee.current=X}),[X]),o.useEffect((()=>{ne.current=N}),[N]),o.useEffect((()=>()=>{te.current&&ne.current&&ne.current(ee.current)}),[]);const oe=o.useCallback((e=>{Y(e),"2.0"===q?null==N||N(e):te.current=!0}),[N,q]),se=K?X:j,{dropdownOptions:re,search:ie,searchedString:le,searchedOptions:ue,searchError:ce,retrySearch:ae,onApplyHandler:de,selectAllHandler:pe,onMultiSelectClear:he,onFreeFormSelect:fe,onMultiSelectApply:ge,latestDropdownOptionsRef:be,getSelectedOptions:Se,getCurrentSelectionCount:ve}=l.useDropdown(q,se,L,E||K,x,D,P,V,m),[je,Oe]=o.useState(null!=w?w:S),[xe,me]=o.useState(null),[we,Ce]=o.useState(-1),ye=o.useRef(null),ke=o.useRef([]),Le=o.useRef(null);r.useOutside(ye,(()=>{if(me(null),x&&"2.0"===q){const e=Se(be.current);null==k||k(e)}else null==k||k(re)}),[M,ke]),o.useEffect((()=>{const e=setTimeout((()=>{ye.current&&ye.current.focus({preventScroll:!0})}),0);return()=>clearTimeout(e)}),[]);o.useEffect((()=>{const e=e=>{const t=(e=>{const t=[];return e.forEach((e=>{if(e.options)e.options.forEach((e=>{e.disabled||t.push(e)}));else{const n=e;n.disabled||t.push(n)}})),t})(le&&D?ue:re);if(0!==t.length)if("ArrowDown"===e.key)e.preventDefault(),Ce((e=>{const n=e<t.length-1?e+1:0;return setTimeout((()=>{var e;const t=null===(e=Le.current)||void 0===e?void 0:e.querySelector(`[data-option-index="${n}"]`);t&&t.scrollIntoView({block:"nearest",behavior:"smooth"})}),0),n}));else if("ArrowUp"===e.key)e.preventDefault(),Ce((e=>{const n=e>0?e-1:t.length-1;return setTimeout((()=>{var e;const t=null===(e=Le.current)||void 0===e?void 0:e.querySelector(`[data-option-index="${n}"]`);t&&t.scrollIntoView({block:"nearest",behavior:"smooth"})}),0),n}));else if("Enter"===e.key&&we>=0){e.preventDefault();const n=t[we];n&&(de(Object.assign(Object.assign({},n),{selected:!n.selected})),A&&A(n))}},t=ye.current;if(t)return t.addEventListener("keydown",e),()=>{t.removeEventListener("keydown",e)}}),[we,le,ue,re,D,de,A]);const De=null!=y?y:b,qe="number"==typeof De?O&&x?De-96:O&&!x||!O&&x?De-48:De:De;o.useEffect((()=>{const e=null!=w?w:S;if(null===xe)Oe(e);else if("number"==typeof e)Oe(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));Oe(t)}}),[xe]);const Ee=[],Me=(e=>{if(!x||!m&&0!==m)return e;const t=ve(re)>=m;return t?e.map((e=>{if(e.options)return Object.assign(Object.assign({},e),{options:e.options.map((e=>Object.assign(Object.assign({},e),{disabled:e.disabled||!e.selected&&t})))});{const n=e;return Object.assign(Object.assign({},n),{disabled:n.disabled||!n.selected&&t})}})):e})((le&&D?ue:re).map((e=>{var t,n;if(le&&!D){if(e.options){const t=Object.assign({},e);return t.options=t.options.filter((e=>{var t;return!!(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(le.toLowerCase()))&&(Ee.push(!le||e.label===le),!0)})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(le.toLowerCase()))||(null===(n=e.searchKey)||void 0===n?void 0:n.toLowerCase().includes(le.toLowerCase()))?(Ee.push(!le||e.label===le),e):null}return e})).filter((e=>null!==e))),Re=!!O&&le&&0===Me.length,Ie=!le&&!!Z,Te=!le&&!!z&&!Ie,Fe=!(le||Me.length||Ie||Te),Ae=Ie||Te||Fe,Be=(null==_?void 0:_.title)||"No results found",He=(null==_?void 0:_.subTitle)||"Please try again later or contact us at support@bik.ai if you require further assistance.",Ze=(null==z?void 0:z.title)||"Failed to load options",ze=(null==z?void 0:z.subTitle)||"Something went wrong while fetching the list. Please try again",Pe={buttonText:"Try again",buttonType:"text",size:"small",buttonTextColor:i.COLORS.background.inverseLight,customIconColor:i.COLORS.background.inverseLight,LeadingIcon:n.default},Ve=Object.assign({IconHolderStyle:{background:i.COLORS.background.negative.light},Icon:e.jsx(t.default,{color:i.COLORS.content.negative,width:24,height:24})},z);Ve.actionButton=Object.assign(Object.assign({},Pe),null!==(J=null==z?void 0:z.actionButton)&&void 0!==J?J:{});const We=Ie?void 0:Te?Ve:_;return e.jsxs(h.OpennedDropdownContainer,Object.assign({version:q,ref:ye,tabIndex:-1,style:Object.assign(Object.assign({width:je},$),{outline:"none"})},{children:[e.jsxs("div",Object.assign({style:{width:xe?"50%":"100%",display:"flex",flexDirection:"column",background:"white"}},{children:[!!O&&e.jsx(f.SearchBox,{onSearch:ie,version:q}),Ae?e.jsx("div",Object.assign({style:{height:De,display:"flex",background:i.COLORS.background.base}},{children:e.jsx(s.ZeroState,Object.assign({},null!=We?We:{},{isLoading:Ie,title:Te?Ze:Be,subTitle:Te?ze:He}))})):e.jsxs(h.MenuListContainer,Object.assign({minHeight:De,maxHeight:qe,ref:Le},{children:[!!x&&!Re&&!R&&e.jsx(d.SelectAllMenu,{version:q,options:le&&D?ue:re,onSelect:pe}),!C&&Re&&e.jsx(g.SearchZeroState,{isLoading:H,errorMessage:ce,onRetry:ae,height:qe,searchedString:le,containerWidth:w,version:q}),C&&(Re||!!Ee.length&&Ee.every((e=>!1===e)))&&e.jsx(c.FreeFormMenu,{version:q,isMultiSelect:x,onSelect:fe,searchedString:le}),e.jsx(a.MenuList,{onInfiniteScroll:T,onDropdownItemClick:A,version:q,onSelect:de,showDescription:function(e,t){me(e&&t?{title:e,description:t}:null)},isMultiSelect:x,options:Me,useDefaultCursor:W,ref:ke,focusedIndex:we,isDraggable:K,onOptionsReorder:oe,showCheckboxForCustomElement:G})]})),!!x&&!Ae&&"2.0"!==q&&e.jsx(p.default,{onClear:()=>{he(),null==F||F()},onApply:ge,list:le&&D?ue:re,buttonText:I,buttonOptions:B,hideClearButton:U})]})),!!xe&&e.jsx(u.Description,{title:xe.title,description:xe.description,version:q})]}))};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export declare const OpennedDropdownContainer: import("styled-components").StyledComponent<"div", any, {
|
|
2
|
-
version?: "1.0" | "2.0" | undefined;
|
|
2
|
+
version?: "1.0" | "2.0" | "3.0" | undefined;
|
|
3
3
|
}, never>;
|
|
4
4
|
export declare const ItemContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
5
5
|
export declare const MenuListContainer: import("styled-components").StyledComponent<"div", any, {
|
|
@@ -1,21 +1,22 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),o=require("../../../../constants/Theme.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var t=r(e);const i=t.default.div`
|
|
2
2
|
border-radius: ${e=>"2.0"===e.version?8:4}px;
|
|
3
|
-
border: ${e=>"2.0"===e.version?0:1}px
|
|
4
|
-
${
|
|
3
|
+
border: ${e=>"2.0"===e.version||"3.0"===e.version?0:1}px
|
|
4
|
+
solid ${o.COLORS.stroke.primary};
|
|
5
|
+
box-shadow: ${e=>"3.0"===e.version?"0px 2px 8px 0px rgba(0, 0, 0, 0.12)":"none"};
|
|
5
6
|
max-height: 480px;
|
|
6
7
|
overflow: hidden;
|
|
7
8
|
display: flex;
|
|
8
9
|
flex-direction: row;
|
|
9
10
|
position: relative;
|
|
10
11
|
padding: ${e=>"2.0"===e.version?4:0}px;
|
|
11
|
-
background-color: ${
|
|
12
|
+
background-color: ${o.COLORS.surface.standard};
|
|
12
13
|
`;t.default.div`
|
|
13
14
|
padding: 14px 16px 14px 18px;
|
|
14
15
|
flex-direction: row;
|
|
15
16
|
align-items: center;
|
|
16
17
|
border-bottom-width: 1px;
|
|
17
18
|
border-bottom-style: solid;
|
|
18
|
-
border-bottom-color: ${
|
|
19
|
+
border-bottom-color: ${o.COLORS.stroke.primary};
|
|
19
20
|
width: 100%;
|
|
20
21
|
height: 100%;
|
|
21
22
|
`;const d=t.default.div`
|
|
@@ -7,7 +7,7 @@ interface MenuItemProps {
|
|
|
7
7
|
onSelect: (option: SingleOption) => void;
|
|
8
8
|
onDropdownItemClick?: (option: SingleOption) => void;
|
|
9
9
|
last?: boolean;
|
|
10
|
-
version?: '1.0' | '2.0';
|
|
10
|
+
version?: '1.0' | '2.0' | '3.0';
|
|
11
11
|
useDefaultCursor?: boolean;
|
|
12
12
|
isFocused?: boolean;
|
|
13
13
|
dataIndex?: number;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../../../assets/icons/chevronRight.svg.js"),n=require("react"),r=require("styled-components"),o=require("../../../../checkBox/CheckBox.js"),i=require("../../../../list-item/ListItem.js"),s=require("../../../../tooltips/Tooltip.js"),a=require("../../../../TypographyStyle.js"),l=require("../../../../../constants/Theme.js"),d=require("./FreeFormMenu.styled.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=c(r);const
|
|
2
|
-
padding: ${e=>"2.0"===e.version?"8px 12px":"14px 16px"} !important;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../../../assets/icons/chevronRight.svg.js"),n=require("react"),r=require("styled-components"),o=require("../../../../checkBox/CheckBox.js"),i=require("../../../../list-item/ListItem.js"),s=require("../../../../tooltips/Tooltip.js"),a=require("../../../../TypographyStyle.js"),l=require("../../../../../constants/Theme.js"),d=require("./FreeFormMenu.styled.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=c(r);const p=u.default(i.ListItem)`
|
|
2
|
+
padding: ${e=>"3.0"===e.version?"8px":"2.0"===e.version?"8px 12px":"14px 16px"} !important;
|
|
3
3
|
cursor: pointer;
|
|
4
4
|
margin-top: ${e=>"2.0"===e.version?"2px":"0"};
|
|
5
|
-
`,
|
|
5
|
+
`,g=u.default.div`
|
|
6
6
|
box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.12);
|
|
7
7
|
border-radius: ${e=>{let{version:t}=e;return"1.0"===t?"0":"8px"}};
|
|
8
8
|
padding: ${e=>{let{version:t}=e;return"1.0"===t?"0":"4px"}};
|
|
@@ -28,16 +28,16 @@
|
|
|
28
28
|
border-radius: 50%;
|
|
29
29
|
background-color: ${l.COLORS.content.inactive};
|
|
30
30
|
flex-shrink: 0;
|
|
31
|
-
`,
|
|
31
|
+
`,v=u.default.div`
|
|
32
32
|
display: flex;
|
|
33
33
|
align-content: center;
|
|
34
34
|
justify-content: center;
|
|
35
35
|
gap: 8px;
|
|
36
|
-
`,
|
|
36
|
+
`,j=u.default.div`
|
|
37
37
|
margin-right: -4px;
|
|
38
|
-
`,
|
|
38
|
+
`,m=u.default.div`
|
|
39
39
|
display: flex;
|
|
40
40
|
align-items: center;
|
|
41
41
|
flex-direction: column;
|
|
42
42
|
flex: 1;
|
|
43
|
-
`,b=t=>{let{onDragStart:n,onDragEnd:r}=t;return e.jsxs(x,Object.assign({draggable:!0,onDragStart:n,onDragEnd:r},{children:[e.jsx(h,{}),e.jsx(h,{}),e.jsx(h,{}),e.jsx(h,{}),e.jsx(h,{}),e.jsx(h,{})]}))},f=n.forwardRef(((r,i)=>{let{option:c,isMultiSelect:u,showDescription:x,onSelect:h,last:f,version:D,onDropdownItemClick:C,useDefaultCursor:O,isFocused:y=!1,dataIndex:I=-1,isDraggable:F=!1,onDragStart:E,onDragOver:S,onDrop:T,onDragEnd:k,isDraggedOver:L=!1,showCheckboxForCustomElement:w=!1}=r;var M,q;const[$,A]=n.useState(c.selected),B=(e,t)=>{if(!e.children){R(!e.selected);const n=t?Object.assign(Object.assign({},e),{parent:t}):e;null==C||C(n)}},R=e=>{c.disabled||h(Object.assign(Object.assign({},c),{selected:e}))},U=O?{cursor:"default"}:{};return e.jsx(e.Fragment,{children:e.jsx(s.Tooltip,Object.assign({body:"",tooltipContent:c.children?e.jsx("div",Object.assign({style:{backgroundColor:l.DEFAULT_THEME.colorsV2.surface.standard},ref:i,onMouseEnter:()=>A(!0),onMouseLeave:()=>A(!1)},{children:e.jsx(
|
|
43
|
+
`,b=t=>{let{onDragStart:n,onDragEnd:r}=t;return e.jsxs(x,Object.assign({draggable:!0,onDragStart:n,onDragEnd:r},{children:[e.jsx(h,{}),e.jsx(h,{}),e.jsx(h,{}),e.jsx(h,{}),e.jsx(h,{}),e.jsx(h,{})]}))},f=n.forwardRef(((r,i)=>{let{option:c,isMultiSelect:u,showDescription:x,onSelect:h,last:f,version:D,onDropdownItemClick:C,useDefaultCursor:O,isFocused:y=!1,dataIndex:I=-1,isDraggable:F=!1,onDragStart:E,onDragOver:S,onDrop:T,onDragEnd:k,isDraggedOver:L=!1,showCheckboxForCustomElement:w=!1}=r;var M,q;const[$,A]=n.useState(c.selected),B=(e,t)=>{if(!e.children){R(!e.selected);const n=t?Object.assign(Object.assign({},e),{parent:t}):e;null==C||C(n)}},R=e=>{c.disabled||h(Object.assign(Object.assign({},c),{selected:e}))},U=O?{cursor:"default"}:{};return e.jsx(e.Fragment,{children:e.jsx(s.Tooltip,Object.assign({body:"",tooltipContent:c.children?e.jsx("div",Object.assign({style:{backgroundColor:l.DEFAULT_THEME.colorsV2.surface.standard},ref:i,onMouseEnter:()=>A(!0),onMouseLeave:()=>A(!1)},{children:e.jsx(g,Object.assign({version:null!=D?D:"2.0"},{children:c.children.map((t=>{var n;return e.jsx(p,{version:D,style:"1.0"!==D&&(null!==(n=null==c?void 0:c.children)&&void 0!==n?n:[]).length-1?{borderBottom:0}:{},onClick:e=>{e.preventDefault(),B(t,c)},listItem:{value:t.value,label:t.label},subText:t.subText,leadingIcon:t.leadingIcon||void 0,customComponent:t.customComponent,trailingIcon:t.trailingIcon||void 0,variant:c.disabled?"inactive":t.selected?"selected":"default"},t.value)}))}))})):e.jsx(e.Fragment,{}),placement:"right-start",hideArrow:!0},{children:e.jsx(p,{version:D,style:f?Object.assign(Object.assign({borderBottom:0},U),L?{borderTop:`2px solid ${l.COLORS.content.brand}`,opacity:.5}:{}):Object.assign(Object.assign({},U),L?{borderTop:`2px solid ${l.COLORS.content.brand}`,opacity:.5}:{}),onClick:e=>{e.preventDefault(),B(c)},onMouseOver:()=>{c.description?x(c.label,c.description):x()},listItem:{value:c.value,label:c.label},subText:c.subText,"data-option-index":I,role:"option",id:`dropdown-option-${I}`,"aria-selected":!!c.selected,onDragOver:F?S:void 0,onDrop:F?T:void 0,leadingIcon:!u||w&&c.customComponent?F?e.jsxs(m,{children:[e.jsx(b,{onDragStart:E,onDragEnd:k}),c.leadingIcon&&e.jsx("div",{children:c.leadingIcon})]}):c.leadingIcon?e.jsx(e.Fragment,{children:c.leadingIcon}):void 0:e.jsxs(v,{children:[F&&e.jsx(b,{onDragStart:E,onDragEnd:k}),e.jsx(o.CheckBox,{size:"2.0"===D?"SMALL":"DEFAULT",isDisabled:null!==(M=c.disabled)&&void 0!==M&&M,isChecked:!!c.selected,onValueChange:R}),e.jsx(j,{children:c.leadingIcon})]}),customComponent:u&&w&&c.customComponent?e.jsxs(v,{children:[F&&e.jsx(b,{onDragStart:E,onDragEnd:k}),e.jsx(o.CheckBox,{size:"2.0"===D?"SMALL":"DEFAULT",isDisabled:null!==(q=c.disabled)&&void 0!==q&&q,isChecked:!!c.selected,onValueChange:R}),c.customComponent]}):c.customComponent,trailingIcon:c.isFreeForm?e.jsx(d.FreeFormContainer,{children:e.jsx(a.BodyCaption,Object.assign({style:{color:l.COLORS.content.secondary}},{children:"Freeform"}))}):c.children?e.jsx(t.default,{width:12,height:12}):c.trailingIcon?e.jsx(e.Fragment,{children:c.trailingIcon}):void 0,variant:c.disabled?"inactive":y||c.selected||!u&&$?"selected":"default"})}))})}));exports.MenuItem=f;
|
|
@@ -5,7 +5,7 @@ interface MenuListProps {
|
|
|
5
5
|
isMultiSelect?: boolean;
|
|
6
6
|
showDescription: (title?: string, description?: string) => void;
|
|
7
7
|
onSelect: (optionSelect: SingleOption) => void;
|
|
8
|
-
version?: '1.0' | '2.0';
|
|
8
|
+
version?: '1.0' | '2.0' | '3.0';
|
|
9
9
|
onInfiniteScroll?: () => void;
|
|
10
10
|
onDropdownItemClick?: (option: DropdownOption) => void;
|
|
11
11
|
useDefaultCursor?: boolean;
|
|
@@ -4,5 +4,5 @@ export type SelectAllCheckboxState = 'notSelected' | 'selectAll' | 'partiallySel
|
|
|
4
4
|
export declare const SelectAllMenu: React.FC<{
|
|
5
5
|
options: DropdownOption[];
|
|
6
6
|
onSelect: (newState: SelectAllCheckboxState) => void;
|
|
7
|
-
version?: '1.0' | '2.0';
|
|
7
|
+
version?: '1.0' | '2.0' | '3.0';
|
|
8
8
|
}>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("../../../../icon-button/IconButton.js"),n=require("../../../../input/Input.js"),o=require("../../../../input/context/InputStyleProvider.js"),s=require("../../../../../constants/Theme.js"),i=require("../../../../../assets/icons/cross.svg.js"),c=require("../../../../../assets/icons/search.svg.js");exports.SearchBox=a=>{let{onSearch:u,version:l}=a;const[p,d]=t.useState(""),[h,x]=t.useState(!1);return e.jsx(o.InputStyleContext.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:`${"2.0"===l?.5:1}px solid ${s.COLORS.stroke.primary}`,padding:""+("2.0"===l?"6px 8px":"14px 16px")},IconHolder:{marginLeft:0},input:{marginLeft:4,minHeight:"100%"}}},{children:e.jsx(n.Input,{noKeyDownChange:!0,skipFocus:!0,placeholder:"Search",variant:"2.0"===l?"small":"default",leftIcon:{icon:()=>e.jsx(c.default,{width:"2.0"===l?18:24,height:"2.0"===l?18:24,color:s.COLORS.content.placeholder})},rightIcon:{icon:()=>p?e.jsx(r.IconButton,{onClick:()=>{x(!0),u(""),d("")},Icon:i.default,width:"2.0"===l?18:24,height:"2.0"===l?18:24,iconColor:s.COLORS.content.placeholder}):e.jsx(e.Fragment,{})},reset:h,onChangeText:e=>{x(!1),d(e),u(e)}})}))};
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("../../../../icon-button/IconButton.js"),n=require("../../../../input/Input.js"),o=require("../../../../input/context/InputStyleProvider.js"),s=require("../../../../../constants/Theme.js"),i=require("../../../../../assets/icons/cross.svg.js"),c=require("../../../../../assets/icons/search.svg.js");exports.SearchBox=a=>{let{onSearch:u,version:l}=a;const[p,d]=t.useState(""),[h,x]=t.useState(!1);return e.jsx(o.InputStyleContext.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:`${"2.0"===l||"3.0"===l?.5:1}px solid ${s.COLORS.stroke.primary}`,padding:""+("2.0"===l||"3.0"===l?"6px 8px":"14px 16px")},IconHolder:{marginLeft:0},input:{marginLeft:4,minHeight:"100%"}}},{children:e.jsx(n.Input,{noKeyDownChange:!0,skipFocus:!0,placeholder:"Search",variant:"2.0"===l||"3.0"===l?"small":"default",leftIcon:{icon:()=>e.jsx(c.default,{width:"2.0"===l||"3.0"===l?18:24,height:"2.0"===l||"3.0"===l?18:24,color:s.COLORS.content.placeholder})},rightIcon:{icon:()=>p?e.jsx(r.IconButton,{onClick:()=>{x(!0),u(""),d("")},Icon:i.default,width:"2.0"===l||"3.0"===l?18:24,height:"2.0"===l||"3.0"===l?18:24,iconColor:s.COLORS.content.placeholder}):e.jsx(e.Fragment,{})},reset:h,onChangeText:e=>{x(!1),d(e),u(e)}})}))};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../../zeroState/ZeroState.js");exports.SearchZeroState=
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../../zeroState/ZeroState.js"),n=require("../../../../../constants/Theme.js");exports.SearchZeroState=i=>{let{searchedString:r,height:o,isLoading:s,containerWidth:a,errorMessage:l,onRetry:c,version:d}=i;const u=!!l&&!s;return"3.0"!==d||u||s?e.jsx("div",Object.assign({style:{height:o,display:"flex",alignItems:"center"}},{children:e.jsx(t.ZeroState,{isLoading:s,title:u?"Failed to load options":"No results found",subTitle:u?l:`Sorry we could not find any results for "${null!=r?r:""}"`,actionButton:u?{buttonText:"Try again",buttonType:"text",onClick:c}:void 0,containerWidth:a})})):e.jsx("div",Object.assign({style:{height:o,display:"flex",alignItems:"center",justifyContent:"center"}},{children:e.jsx("span",Object.assign({style:{fontFamily:"Inter",fontSize:"12px",fontWeight:400,lineHeight:"16px",color:n.COLORS.content.placeholder,whiteSpace:"nowrap"}},{children:"No results found!"}))}))};
|
|
@@ -17,7 +17,7 @@ export interface OpenDropdownProps {
|
|
|
17
17
|
placement?: Placement;
|
|
18
18
|
strategy?: PositioningStrategy;
|
|
19
19
|
onSearch?: (key: string) => Promise<DropdownOption[]>;
|
|
20
|
-
version?: '1.0' | '2.0';
|
|
20
|
+
version?: '1.0' | '2.0' | '3.0';
|
|
21
21
|
skipSorting?: boolean;
|
|
22
22
|
headerRef?: any;
|
|
23
23
|
hideSelectAll?: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),o=require("react"),i=require("../tooltips/Tooltip.js"),r=require("./IconButton.styled.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),o=require("react"),i=require("../tooltips/Tooltip.js"),r=require("./IconButton.styled.js"),d=require("./theme.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=l(o);const s=o.forwardRef(((o,l)=>{var{id:s,iconButtonType:c="default",Icon:a,height:u=20,width:b=20,bordered:y,disabled:p,isSelected:j,style:g,svgStyle:h,iconColor:f,iconPadding:v,disabledTooltip:B}=o,I=e.__rest(o,["id","iconButtonType","Icon","height","width","bordered","disabled","isSelected","style","svgStyle","iconColor","iconPadding","disabledTooltip"]);const T=d.getIconColor(c,p,j),q=t.jsx(r.IconButton,Object.assign({id:s,ref:l,style:g,iconButtonType:c,bordered:y,disabled:p,isSelected:j,iconPadding:v},I,{children:n.default.createElement(a,{height:u,width:b,color:f||T,style:Object.assign({display:"block"},null!=h?h:{})})}));return p&&B?t.jsx(i.Tooltip,Object.assign({body:B},{children:t.jsx("span",Object.assign({style:{display:"inline-block",cursor:"not-allowed"}},{children:q}))})):q}));s.displayName="IconButton",exports.IconButton=s;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("styled-components"),
|
|
2
|
-
${t=>`\n\tall: unset;\n\tcursor: pointer;\n\tpadding:
|
|
3
|
-
`;exports.IconButton=
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("styled-components"),n=require("../../constants/Theme.js"),e=require("./theme.js");function o(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}const r=o(t).default.button`
|
|
2
|
+
${t=>`\n\tall: unset;\n\tcursor: pointer;\n\tpadding: ${void 0!==t.iconPadding?t.iconPadding:6}px;\n\tborder-radius: 4px;\n\tflex-wrap: wrap;\n\t${t.bordered&&"ai"!==t.iconButtonType?`border: 1px solid ${n.COLORS.stroke.primary};`:""}\n\t${t.isSelected?`\n\t\t\tbackground: ${e.generateBackgroundColor(t.iconButtonType)};\n\t\t\t\t`:"\n\t\t\t\t:hover {\n\t\t\t\t\tbackground-color: rgba(0, 0, 0, 0.03);\n\t\t\t\t}\n\t\t\t"}\n\t${t.disabled&&"\n\t\t\tcursor: not-allowed !important;\n\t\t\tbackground-color: rgba(0, 0, 0, 0.03);\n\t\t"}\n\n\t`}
|
|
3
|
+
`;exports.IconButton=r;
|
|
@@ -40,5 +40,10 @@ export interface IconButtonProps extends React.ButtonHTMLAttributes<HTMLButtonEl
|
|
|
40
40
|
*/
|
|
41
41
|
isSelected?: boolean;
|
|
42
42
|
iconColor?: string;
|
|
43
|
+
/**
|
|
44
|
+
* Custom padding for the icon button container
|
|
45
|
+
* @default 6
|
|
46
|
+
*/
|
|
47
|
+
iconPadding?: number;
|
|
43
48
|
disabledTooltip?: string;
|
|
44
49
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/info.svg.js"),n=require("react"),i=require("../button/Button.js"),l=require("./Input-helper.js"),s=require("../tooltips/Tooltip.js"),r=require("../TypographyStyle.js"),a=require("../../constants/Theme.js"),o=require("../../assets/icons/errorInfo.svg.js"),u=require("./context/InputStyleProvider.js"),c=require("./Input.styled.js");const
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/info.svg.js"),n=require("react"),i=require("../button/Button.js"),l=require("./Input-helper.js"),s=require("../tooltips/Tooltip.js"),r=require("../TypographyStyle.js"),a=require("../../constants/Theme.js"),o=require("../../assets/icons/errorInfo.svg.js"),u=require("./context/InputStyleProvider.js"),c=require("./Input.styled.js");const h=n.forwardRef(((h,d)=>{var g,p,v,x,j,f,m,b;const{placeholder:y,leftIcon:C,rightIcon:O,labelText:T,maxCharLimit:I,isRequired:S,hintText:w,type:E,state:k,validate:H,variant:q,button:B,suffixText:L,prefixText:F,onChangeText:M,value:P,noErrorHint:A,reset:R,rangeValidation:z,noKeyDownChange:D,version:K,noMaxCharCheck:N,labelElement:_,autoGrow:W,minHeight:G,maxHeight:U,labelTextBold:V,truncateText:X,maxCharLimitPosition:$,hightlightInputColor:J,onKeyDownEvent:Q,hideInputHeader:Y,hideBorder:Z,inputWrapperStyles:ee,minCharsToTrigger:te,maxCharAlignment:ne,isDisabled:ie=!1,allowUnsafeInput:le,leftIconStyle:se}=Object.assign({maxCharLimit:0,type:"text",variant:"default",maxCharLimitPosition:"TOP",minCharsToTrigger:0,maxCharAlignment:!1},h),re=null==C?void 0:C.icon,ae=null==O?void 0:O.icon,[oe,ue]=n.useState(!1),[ce,he]=n.useState(!1),[de,ge]=n.useState(),pe="x-small"===q?"12px":"small"===q?"18px":"22px",ve=n.useContext(u.InputStyleContext),[xe,je]=n.useState(""),fe=n.useRef(null),me=null!=d?d:fe;n.useEffect((()=>{je(P||""),!P&&W&&(me.current.style.height=G||"48px")}),[P]),n.useEffect((()=>{var e;me.current&&(null===(e=h.onReferenceInit)||void 0===e||e.call(h,me.current))}),[me]),n.useEffect((()=>{const e=me.current;if(e&&["phonenumber","zip","number"].includes(E))return e.addEventListener("wheel",Oe,{passive:!1}),()=>{e.removeEventListener("wheel",Oe)}}),[]),n.useEffect((()=>{R&&je("")}),[R]),n.useEffect((()=>{var e;he(!!h.isActive),h.isActive&&(null===(e=me.current)||void 0===e||e.focus())}),[h.isActive]),n.useEffect((()=>{ge(h.errorMessage)}),[h.errorMessage]),n.useEffect((()=>{var e;ue(!1),("invalid"===h.state||de||"disabled-invalid"===h.state)&&ue(!0),"active"===h.state&&(null===(e=me.current)||void 0===e||e.focus())}),[h.state,de]),n.useEffect((()=>{ue(!!de||"invalid"===h.state)}),[de,h.state]);const be=function(e){if(l.isFunction(e)){for(var t=arguments.length,n=new Array(t>1?t-1:0),i=1;i<t;i++)n[i-1]=arguments[i];e(...n)}},ye=()=>"zip"===E?6:2e3,Ce=e=>{const t=0!==I?I:ye(),n=te,i=e.target.value;Q&&(!i.length||i.length>=n)&&Q(e),D||i.length&&!(i.length>=n)||M(P||"",e),N||![8].includes(e.which)&&t>0&&i.length>=t&&e.preventDefault()},Oe=e=>{e.preventDefault()},Te=e=>{let t=e.target.value;const n=0!==I?I+1:ye(),i=te;if(!le&&l.shouldSanitizeForType(E)&&(t=l.sanitizeUnsafeInput(t)),!N&&n>0&&t.length>=n&&(t=t.substring(0,n-1)),h.textControl||je(t||""),i&&t&&t.length<i)return;M(t,e),W&&(me.current.style.height=`${me.current.scrollHeight}px`,t||(me.current.style.height=G||"48px"));const s=H||l.validateInput;if(!s||!l.isFunction(s))return;const[r,a]=s(t,E,z);ue(!r),ge(h.errorMessage?h.errorMessage:a)},Ie=e=>{var t;h.skipFocus||he(!0),be(null===(t=h.onFocus)||void 0===t?void 0:t.call(h,e))},Se=e=>{var t;h.skipFocus||he(!1),be(null===(t=h.onBlur)||void 0===t?void 0:t.call(h,e))},we=()=>{var t;return e.jsxs(e.Fragment,{children:["multiline"!==E&&e.jsx("input",{className:X?"truncate-class":"","data-test":h["data-test"],id:h.id,style:null!==(t=null==ve?void 0:ve.input)&&void 0!==t?t:{},ref:me,disabled:ie,type:["phonenumber","zip","number"].includes(E)?"number":E,value:xe,onFocus:e=>Ie(e),onBlur:e=>Se(e),placeholder:y||"Enter here",onChange:Te,onClick:e=>be(h.onClick),onKeyDown:e=>Ce(e)}),"multiline"===E&&e.jsx("textarea",{"data-test":h["data-test"],value:xe,ref:me,onFocus:e=>Ie(e),onBlur:e=>Se(e),onClick:e=>be(h.onClick),disabled:ie,placeholder:y||"Enter here",onChange:Te,onKeyDown:e=>Ce(e),maxLength:I>0?I:void 0})]})};return e.jsxs(c.RootContainer,Object.assign({width:h.width,height:h.height,state:k,type:E,style:null!==(g=null==ve?void 0:ve.RootContainer)&&void 0!==g?g:{}},{children:[e.jsxs("div",Object.assign({className:"flex-align-center"},{children:[!A&&(!!w||!!de)&&e.jsxs(c.InputFooter,Object.assign({invalid:!!de},{children:[!!de&&e.jsx(o.default,{width:16,height:16}),de||w]})),I>0&&"BOTTOM"===$&&e.jsxs(c.MaxCharStyle,Object.assign({position:"BOTTOM"},{children:[null!==(v=null===(p=(null!=P?P:"").toString())||void 0===p?void 0:p.length)&&void 0!==v?v:0,"/",I]}))]})),e.jsxs(c.InputWrapper,Object.assign({variant:q,state:k,width:h.width,isActive:"active"===k||ce,isInvalid:oe,style:null!==(j=null!==(x=null==ve?void 0:ve.InputWrapper)&&void 0!==x?x:ee)&&void 0!==j?j:{},version:K,height:h.height,hightlightInputColor:J,hideBorder:Z},{children:[!!re&&e.jsx(c.IconHolder,Object.assign({variant:q,iconSize:pe,onClick:()=>be(null==C?void 0:C.callback),isLeft:!0,style:Object.assign(Object.assign({},null!==(f=null==ve?void 0:ve.IconHolder)&&void 0!==f?f:{}),se)},{children:e.jsx(re,{})})),!!F&&e.jsx(c.PrefixHolder,Object.assign({variant:q},{children:F})),"default"===q&&e.jsx(c.InputContainer,Object.assign({height:h.height,type:h.type,minHeight:G,maxHeight:U,autoGrow:W},{children:we()})),"small"===q&&e.jsx(c.InputContainerSmall,Object.assign({height:h.height,type:h.type},{children:we()})),"x-small"===q&&e.jsx(c.InputContainerXSmall,Object.assign({height:h.height,type:h.type},{children:we()})),!!ae&&e.jsx(c.IconHolder,Object.assign({variant:q,iconSize:pe,onClick:()=>be(null==O?void 0:O.callback),isLeft:!1},{children:e.jsx(ae,{})})),!!L&&e.jsx(c.SuffixHolder,Object.assign({variant:q},{children:L})),B&&B.text&&e.jsx(i.Button,{buttonText:B.text,buttonType:B.buttonType,onClick:()=>be(null==B?void 0:B.onClick)}),B&&B.buttonProps&&e.jsx(i.Button,Object.assign({},B.buttonProps))]})),!Y&&(!!T||!!I)&&e.jsxs(c.InputHeader,Object.assign({invalid:oe,maxCharAlignment:ne},{children:[_&&_,e.jsxs("div",Object.assign({className:"label__container"},{children:[V?e.jsxs(r.TitleSmall,{children:[T,S?e.jsx("span",{children:"*"}):""]}):e.jsxs(r.BodySecondary,{children:[T,S?e.jsx("span",{children:"*"}):""]}),h.tooltipText&&e.jsx(s.Tooltip,Object.assign({body:h.tooltipText,placement:"top"},{children:e.jsx("span",{children:e.jsx(t.default,{style:{marginTop:-3},width:18,height:18,color:oe?a.COLORS.content.negative:a.COLORS.content.primary})})}))]})),I>0&&"TOP"===$&&e.jsxs(c.MaxCharStyle,{children:[null!==(b=null===(m=(null!=P?P:"").toString())||void 0===m?void 0:m.length)&&void 0!==b?b:0,"/",I]})]}))]}))}));h.displayName="Input",exports.Input=h;
|
|
@@ -15,6 +15,7 @@ export interface InputProps {
|
|
|
15
15
|
icon: React.FC;
|
|
16
16
|
callback?: () => void;
|
|
17
17
|
};
|
|
18
|
+
leftIconStyle?: React.CSSProperties;
|
|
18
19
|
rightIcon?: {
|
|
19
20
|
icon: React.FC;
|
|
20
21
|
callback?: () => void;
|
|
@@ -54,7 +55,7 @@ export interface InputProps {
|
|
|
54
55
|
};
|
|
55
56
|
noKeyDownChange?: boolean;
|
|
56
57
|
skipFocus?: boolean;
|
|
57
|
-
version?: '1.0' | '2.0';
|
|
58
|
+
version?: '1.0' | '2.0' | '3.0';
|
|
58
59
|
textControl?: boolean;
|
|
59
60
|
noMaxCharCheck?: boolean;
|
|
60
61
|
tooltipText?: string;
|
|
@@ -10,7 +10,7 @@ export declare const InputWrapper: import("@emotion/styled").StyledComponent<{
|
|
|
10
10
|
isInvalid?: boolean | undefined;
|
|
11
11
|
state?: InputStateI | undefined;
|
|
12
12
|
variant?: InputVariant | undefined;
|
|
13
|
-
version?: "1.0" | "2.0" | undefined;
|
|
13
|
+
version?: "1.0" | "2.0" | "3.0" | undefined;
|
|
14
14
|
hightlightInputColor?: string | undefined;
|
|
15
15
|
hideBorder?: boolean | undefined;
|
|
16
16
|
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
@@ -55,6 +55,21 @@ export declare const InputContainerSmall: import("@emotion/styled").StyledCompon
|
|
|
55
55
|
height?: string | undefined;
|
|
56
56
|
type?: InputTypeI | undefined;
|
|
57
57
|
}, {}, {}>;
|
|
58
|
+
export declare const InputContainerXSmall: import("@emotion/styled").StyledComponent<{
|
|
59
|
+
[x: string]: any;
|
|
60
|
+
[x: number]: any;
|
|
61
|
+
[x: symbol]: any;
|
|
62
|
+
} & {
|
|
63
|
+
theme?: any;
|
|
64
|
+
} & {
|
|
65
|
+
as?: string | import("react").ComponentType<any> | undefined;
|
|
66
|
+
forwardedAs?: string | import("react").ComponentType<any> | undefined;
|
|
67
|
+
} & {
|
|
68
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
69
|
+
} & {
|
|
70
|
+
height?: string | undefined;
|
|
71
|
+
type?: InputTypeI | undefined;
|
|
72
|
+
}, {}, {}>;
|
|
58
73
|
export declare const InputHeader: import("@emotion/styled").StyledComponent<{
|
|
59
74
|
theme?: import("@emotion/react").Theme | undefined;
|
|
60
75
|
as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
|