@bikdotai/bik-component-library 0.0.643-zero.2 → 0.0.643
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/bik-layout/MockMenus.d.ts +0 -1
- package/dist/cjs/components/dropdown/DropdownPopover/index.d.ts +0 -6
- 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/type.d.ts +1 -6
- package/dist/cjs/components/zeroState/ZeroState.d.ts +0 -2
- package/dist/cjs/components/zeroState/ZeroState.js +3 -3
- 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/bik-layout/MockMenus.d.ts +0 -1
- package/dist/esm/components/dropdown/DropdownPopover/index.d.ts +0 -6
- 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/type.d.ts +1 -6
- package/dist/esm/components/zeroState/ZeroState.d.ts +0 -2
- package/dist/esm/components/zeroState/ZeroState.js +5 -5
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const EventsTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default EventsTrigger;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const IGTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default IGTrigger;
|
package/dist/cjs/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
package/dist/cjs/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { DropdownOption } from "../../../dropdown/type";
|
|
3
|
-
import { QueryBuilderProperty } from "../../
|
|
4
|
-
import { QueryBuilderNodeProps } from "../../
|
|
3
|
+
import { QueryBuilderProperty } from "../../types/QueryBuilder.type";
|
|
4
|
+
import { QueryBuilderNodeProps } from "../../types/QueryBuilderNodeProps.type";
|
|
5
5
|
declare const BaseTriggerQueryBuilderNode: React.FC<QueryBuilderNodeProps & {
|
|
6
6
|
cacheKey: string;
|
|
7
7
|
propertyAddBtnText: string;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { ButtonProps } from "../../button/model";
|
|
3
2
|
import { Placement } from "../../tooltips";
|
|
4
3
|
import { OpenDropdownProps } from '../type';
|
|
5
4
|
export declare const DropdownPopover: React.ForwardRefExoticComponent<OpenDropdownProps & {
|
|
@@ -13,11 +12,6 @@ export declare const DropdownPopover: React.ForwardRefExoticComponent<OpenDropdo
|
|
|
13
12
|
showTooltipArrow?: boolean | undefined;
|
|
14
13
|
allowEvents?: boolean | undefined;
|
|
15
14
|
'data-test'?: string | undefined;
|
|
16
|
-
zeroState?: {
|
|
17
|
-
actionButton?: ButtonProps | undefined;
|
|
18
|
-
title: string;
|
|
19
|
-
subTitle?: string | undefined;
|
|
20
|
-
} | undefined;
|
|
21
15
|
} & React.RefAttributes<{
|
|
22
16
|
openDropdown: boolean;
|
|
23
17
|
}>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),o=require("react/jsx-runtime"),t=require("react"),n=require("react-popper"),r=require("../../dropShadow/DropShadow.js"),l=require("../../tooltips/Tooltip.js"),s=require("../Common.styled.js"),i=require("../OpenedDropdown/components/OpennedDropdown.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const d=a(t).default.forwardRef(((a,d)=>{var{children:p,onDropdownVisbilityChange:c,version:u="1.0",tooltipContent:v,tooltipDirection:j,showTooltipArrow:w}=a,b=e.__rest(a,["children","onDropdownVisbilityChange","version","tooltipContent","tooltipDirection","showTooltipArrow"]);const h=d,[f,D]=t.useState(!1),[O,g]=t.useState(null),[x,y]=t.useState(null),m=t.useRef(null),{styles:S,attributes:C}=n.usePopper(O,x,{placement:b.placement,strategy:b.strategy}),q=e=>{var o,t;"2.0"===u&&b.isMultiSelect&&e&&(null===(o=b.onSelect)||void 0===o||o.call(b,[...e])),D(!1),null===(t=null==b?void 0:b.onClose)||void 0===t||t.call(b)};t.useImperativeHandle(h,(()=>({openDropdown:f})),[]),t.useEffect((()=>{(null==h?void 0:h.current)&&(h.current.openDropdown=f)}),[f]),t.useEffect((()=>{null==c||c(f)}),[f]);const E=()=>o.jsxs(o.Fragment,{children:[o.jsxs("div",Object.assign({style:{position:"relative"},ref:g},{children:[o.jsx(s.OverLapAbs,Object.assign({ref:m,allowEvents:b.allowEvents,disabled:b.disabled,onClick:e=>{var o;null===(o=b.onDropdownOpen)||void 0===o||o.call(b),f?(D(!1),e.preventDefault()):b.disabled||D(!0)}},{children:b.allowEvents?p:null})),b.allowEvents?null:p]})),f&&o.jsx(s.OpenDropdownContainer,Object.assign({ref:y,style:Object.assign(Object.assign({},S.popper),{zIndex:3})},C.popper,{"data-test":b["data-test"]},{children:o.jsx(r.DropShadow,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:o.jsx(i.OpenedDropdown,Object.assign({},b,{onSelect:e=>{var o;"2.0"===u&&b.isMultiSelect||(null===(o=b.onSelect)||void 0===o||o.call(b,e),D(!1))},onClose:q,version:u,headerRef:m}))}))}))]});return o.jsx(o.Fragment,{children:f||void 0===v?E():o.jsx(l.Tooltip,Object.assign({body:v,placement:j,hideArrow:!w},{children:o.jsx("div",Object.assign({"data-test":b["data-test"]},{children:E()}))}))})}));d.displayName="DropdownPopover",exports.DropdownPopover=d;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("../../../zeroState/ZeroState.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("../../../zeroState/ZeroState.js"),r=require("../../../../hooks/useOutside.js"),s=require("../../hooks/useDropdown.js"),o=require("./description/Description.js"),i=require("./menu/FreeFormMenu.js"),l=require("./menu/MenuList.js"),u=require("./menu/SelectAllMenu.js"),a=require("./multiSelect/MultiSelectDropdownBottomBar.js"),c=require("./OpennedDropdown.styled.js"),d=require("./searchbox/SearchBox.js"),p=require("./searchbox/SearchZeroState.js");const h=304,S=290;exports.OpenedDropdown=f=>{let{options:j,isSearchable:x,isMultiSelect:g,width:b,allowFreeForm:w,height:v,onClose:O,onSelect:m,onSearch:y,version:C,skipSorting:D,headerRef:M,hideSelectAll:q,primaryButtonText:L,onInfiniteScroll:F,onMultiSelectClear:k,onDropdownItemClick:A,buttonOptions:B,isSearchLoading:I,disableSearchOptions:H,disableSearchedOptionExcept:R,useDefaultCursor:Z,containerStyle:T={}}=f;const{dropdownOptions:E,search:P,searchedString:_,searchedOptions:z,onApplyHandler:K,selectAllHandler:N,onMultiSelectClear:W,onFreeFormSelect:G,onMultiSelectApply:J,latestDropdownOptionsRef:Q,getSelectedOptions:U}=s.useDropdown(C,j,m,D,g,y,H,R),[V,X]=t.useState(null!=b?b:S),[Y,$]=t.useState(null),ee=t.useRef(null),te=t.useRef([]);r.useOutside(ee,(()=>{if($(null),g&&"2.0"===C){const e=U(Q.current);null==O||O(e)}else null==O||O(E)}),[M,te]);const ne=null!=v?v:h,re="number"==typeof ne?x&&g?ne-96:x&&!g||!x&&g?ne-48:ne:ne;t.useEffect((()=>{const e=null!=b?b:S;if(null===Y)X(e);else if("number"==typeof e)X(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));X(t)}}),[Y]);const se=[],oe=(_&&y?z:E).map((e=>{var t,n;if(_&&!y){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(_.toLowerCase()))&&(se.push(!_||e.label===_),!0)})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(_.toLowerCase()))||(null===(n=e.searchKey)||void 0===n?void 0:n.toLowerCase().includes(_.toLowerCase()))?(se.push(!_||e.label===_),e):null}return e})).filter((e=>null!==e)),ie=!!x&&_&&0===oe.length;return e.jsxs(c.OpennedDropdownContainer,Object.assign({version:C,ref:ee,style:Object.assign({width:V},T)},{children:[e.jsxs("div",Object.assign({style:{width:Y?"50%":"100%",display:"flex",flexDirection:"column",background:"white"}},{children:[!!x&&e.jsx(d.SearchBox,{onSearch:P,version:C}),oe.length||_?e.jsxs(c.MenuListContainer,Object.assign({minHeight:ne,maxHeight:re},{children:[!!g&&!ie&&!q&&e.jsx(u.SelectAllMenu,{version:C,options:_&&y?z:E,onSelect:N}),!w&&ie&&e.jsx(p.SearchZeroState,{isLoading:I,height:re,searchedString:_}),w&&(ie||!!se.length&&se.every((e=>!1===e)))&&e.jsx(i.FreeFormMenu,{version:C,isMultiSelect:g,onSelect:G,searchedString:_}),e.jsx(l.MenuList,{onInfiniteScroll:F,onDropdownItemClick:A,version:C,onSelect:K,showDescription:function(e,t){$(e&&t?{title:e,description:t}:null)},isMultiSelect:g,options:oe,useDefaultCursor:Z,ref:te})]})):e.jsx("div",Object.assign({style:{height:ne,display:"flex"}},{children:e.jsx(n.ZeroState,{title:"No results found",subTitle:"Please try again later or contact us at support@bik.ai if you require further assistance."})})),!!g&&!(!oe.length&&!_)&&"2.0"!==C&&e.jsx(a.default,{onClear:()=>{W(),null==k||k()},onApply:J,list:_&&y?z:E,buttonText:L,buttonOptions:B})]})),!!Y&&e.jsx(o.Description,{title:Y.title,description:Y.description,version:C})]}))};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { Placement, PositioningStrategy } from '@popperjs/core';
|
|
3
|
-
import {
|
|
3
|
+
import { Type } from '../button/model';
|
|
4
4
|
export interface OpenDropdownProps {
|
|
5
5
|
defaultOptions?: DropdownOption[];
|
|
6
6
|
options: DropdownOption[];
|
|
@@ -30,11 +30,6 @@ export interface OpenDropdownProps {
|
|
|
30
30
|
useDefaultCursor?: boolean;
|
|
31
31
|
'data-test'?: string;
|
|
32
32
|
containerStyle?: React.CSSProperties;
|
|
33
|
-
zeroState?: {
|
|
34
|
-
actionButton?: ButtonProps;
|
|
35
|
-
title: string;
|
|
36
|
-
subTitle?: string;
|
|
37
|
-
};
|
|
38
33
|
}
|
|
39
34
|
export type GroupedOption = {
|
|
40
35
|
label?: string;
|
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { ButtonProps } from '../button/model';
|
|
3
2
|
export declare const ZeroState: React.FC<{
|
|
4
3
|
isLoading?: boolean;
|
|
5
4
|
title: string;
|
|
6
5
|
subTitle?: string;
|
|
7
6
|
IconHolderStyle?: React.CSSProperties;
|
|
8
7
|
style?: React.CSSProperties /** now this component is extendable through styled-component */;
|
|
9
|
-
actionButton?: ButtonProps;
|
|
10
8
|
}>;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("styled-components"),r=require("../spinner/Spinner.js"),n=require("../TypographyStyle.js"),s=require("../../constants/Theme.js"),i=require("../../assets/icons/alert.svg.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=l(t);const a=o.default.div`
|
|
2
2
|
background: ${s.COLORS.surface.standard};
|
|
3
3
|
display: flex;
|
|
4
4
|
flex-direction: column;
|
|
5
5
|
align-items: center;
|
|
6
6
|
justify-content: center;
|
|
7
7
|
flex: 1;
|
|
8
|
-
`,
|
|
8
|
+
`,c=o.default.div`
|
|
9
9
|
background: ${s.COLORS.background.base};
|
|
10
10
|
width: 48px;
|
|
11
11
|
height: 48px;
|
|
@@ -14,4 +14,4 @@
|
|
|
14
14
|
align-items: center;
|
|
15
15
|
justify-content: center;
|
|
16
16
|
border-radius: 24px;
|
|
17
|
-
`;exports.ZeroState=
|
|
17
|
+
`;exports.ZeroState=t=>{let{subTitle:l,title:o,IconHolderStyle:d,style:u,isLoading:g}=t;return e.jsxs(a,Object.assign({style:null!=u?u:{}},{children:[g?e.jsx(r.Spinner,{size:"large",color:s.COLORS.stroke.brand}):e.jsx(c,Object.assign({style:null!=d?d:{}},{children:e.jsx(i.default,{color:s.COLORS.content.placeholder,height:24,width:24})})),e.jsx(n.TitleRegular,Object.assign({style:{marginTop:8,color:s.COLORS.content.primary}},{children:g?"Loading...":o||"No results found"})),!!l&&!g&&e.jsx(n.BodyCaption,Object.assign({style:{marginTop:4,color:s.COLORS.content.secondary,textAlign:"center",maxWidth:184}},{children:l}))]}))};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const EventsTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default EventsTrigger;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const IGTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default IGTrigger;
|
package/dist/esm/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
package/dist/esm/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { DropdownOption } from "../../../dropdown/type";
|
|
3
|
-
import { QueryBuilderProperty } from "../../
|
|
4
|
-
import { QueryBuilderNodeProps } from "../../
|
|
3
|
+
import { QueryBuilderProperty } from "../../types/QueryBuilder.type";
|
|
4
|
+
import { QueryBuilderNodeProps } from "../../types/QueryBuilderNodeProps.type";
|
|
5
5
|
declare const BaseTriggerQueryBuilderNode: React.FC<QueryBuilderNodeProps & {
|
|
6
6
|
cacheKey: string;
|
|
7
7
|
propertyAddBtnText: string;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { ButtonProps } from "../../button/model";
|
|
3
2
|
import { Placement } from "../../tooltips";
|
|
4
3
|
import { OpenDropdownProps } from '../type';
|
|
5
4
|
export declare const DropdownPopover: React.ForwardRefExoticComponent<OpenDropdownProps & {
|
|
@@ -13,11 +12,6 @@ export declare const DropdownPopover: React.ForwardRefExoticComponent<OpenDropdo
|
|
|
13
12
|
showTooltipArrow?: boolean | undefined;
|
|
14
13
|
allowEvents?: boolean | undefined;
|
|
15
14
|
'data-test'?: string | undefined;
|
|
16
|
-
zeroState?: {
|
|
17
|
-
actionButton?: ButtonProps | undefined;
|
|
18
|
-
title: string;
|
|
19
|
-
subTitle?: string | undefined;
|
|
20
|
-
} | undefined;
|
|
21
15
|
} & React.RefAttributes<{
|
|
22
16
|
openDropdown: boolean;
|
|
23
17
|
}>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__rest as o}from"../../../_virtual/_tslib.js";import{jsx as e,Fragment as t,jsxs as l}from"react/jsx-runtime";import n,{useState as r,useRef as i,useImperativeHandle as s,useEffect as a}from"react";import{usePopper as d}from"react-popper";import{DropShadow as p}from"../../dropShadow/DropShadow.js";import{Tooltip as c}from"../../tooltips/Tooltip.js";import{OverLapAbs as v,OpenDropdownContainer as m}from"../Common.styled.js";import{OpenedDropdown as u}from"../OpenedDropdown/components/OpennedDropdown.js";const w=n.forwardRef(((n,w)=>{var{children:b,onDropdownVisbilityChange:h,version:f="1.0",tooltipContent:j,tooltipDirection:g,showTooltipArrow:D}=n,O=o(n,["children","onDropdownVisbilityChange","version","tooltipContent","tooltipDirection","showTooltipArrow"]);const y=w,[S
|
|
1
|
+
import{__rest as o}from"../../../_virtual/_tslib.js";import{jsx as e,Fragment as t,jsxs as l}from"react/jsx-runtime";import n,{useState as r,useRef as i,useImperativeHandle as s,useEffect as a}from"react";import{usePopper as d}from"react-popper";import{DropShadow as p}from"../../dropShadow/DropShadow.js";import{Tooltip as c}from"../../tooltips/Tooltip.js";import{OverLapAbs as v,OpenDropdownContainer as m}from"../Common.styled.js";import{OpenedDropdown as u}from"../OpenedDropdown/components/OpennedDropdown.js";const w=n.forwardRef(((n,w)=>{var{children:b,onDropdownVisbilityChange:h,version:f="1.0",tooltipContent:j,tooltipDirection:g,showTooltipArrow:D}=n,O=o(n,["children","onDropdownVisbilityChange","version","tooltipContent","tooltipDirection","showTooltipArrow"]);const y=w,[C,S]=r(!1),[E,x]=r(null),[A,R]=r(null),T=i(null),{styles:z,attributes:M}=d(E,A,{placement:O.placement,strategy:O.strategy}),V=o=>{var e,t;"2.0"===f&&O.isMultiSelect&&o&&(null===(e=O.onSelect)||void 0===e||e.call(O,[...o])),S(!1),null===(t=null==O?void 0:O.onClose)||void 0===t||t.call(O)};s(y,(()=>({openDropdown:C})),[]),a((()=>{(null==y?void 0:y.current)&&(y.current.openDropdown=C)}),[C]),a((()=>{null==h||h(C)}),[C]);const _=()=>l(t,{children:[l("div",Object.assign({style:{position:"relative"},ref:x},{children:[e(v,Object.assign({ref:T,allowEvents:O.allowEvents,disabled:O.disabled,onClick:o=>{var e;null===(e=O.onDropdownOpen)||void 0===e||e.call(O),C?(S(!1),o.preventDefault()):O.disabled||S(!0)}},{children:O.allowEvents?b:null})),O.allowEvents?null:b]})),C&&e(m,Object.assign({ref:R,style:Object.assign(Object.assign({},z.popper),{zIndex:3})},M.popper,{"data-test":O["data-test"]},{children:e(p,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:e(u,Object.assign({},O,{onSelect:o=>{var e;"2.0"===f&&O.isMultiSelect||(null===(e=O.onSelect)||void 0===e||e.call(O,o),S(!1))},onClose:V,version:f,headerRef:T}))}))}))]});return e(t,{children:C||void 0===j?_():e(c,Object.assign({body:j,placement:g,hideArrow:!D},{children:e("div",Object.assign({"data-test":O["data-test"]},{children:_()}))}))})}));w.displayName="DropdownPopover";export{w as DropdownPopover};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as o,useRef as n,useEffect as i}from"react";import{ZeroState as
|
|
1
|
+
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as o,useRef as n,useEffect as i}from"react";import{ZeroState as r}from"../../../zeroState/ZeroState.js";import{useOutside as l}from"../../../../hooks/useOutside.js";import{useDropdown as s}from"../../hooks/useDropdown.js";import{Description as c}from"./description/Description.js";import{FreeFormMenu as a}from"./menu/FreeFormMenu.js";import{MenuList as u}from"./menu/MenuList.js";import{SelectAllMenu as p}from"./menu/SelectAllMenu.js";import d from"./multiSelect/MultiSelectDropdownBottomBar.js";import{OpennedDropdownContainer as h,MenuListContainer as m}from"./OpennedDropdown.styled.js";import{SearchBox as f}from"./searchbox/SearchBox.js";import{SearchZeroState as S}from"./searchbox/SearchZeroState.js";const g=304,b=290,w=w=>{let{options:j,isSearchable:v,isMultiSelect:y,width:O,allowFreeForm:x,height:C,onClose:D,onSelect:M,onSearch:L,version:k,skipSorting:A,headerRef:F,hideSelectAll:I,primaryButtonText:B,onInfiniteScroll:H,onMultiSelectClear:T,onDropdownItemClick:R,buttonOptions:Z,isSearchLoading:q,disableSearchOptions:z,disableSearchedOptionExcept:E,useDefaultCursor:K,containerStyle:N={}}=w;const{dropdownOptions:P,search:W,searchedString:G,searchedOptions:J,onApplyHandler:Q,selectAllHandler:U,onMultiSelectClear:V,onFreeFormSelect:X,onMultiSelectApply:Y,latestDropdownOptionsRef:$,getSelectedOptions:_}=s(k,j,M,A,y,L,z,E),[ee,te]=o(null!=O?O:b),[oe,ne]=o(null),ie=n(null),re=n([]);l(ie,(()=>{if(ne(null),y&&"2.0"===k){const e=_($.current);null==D||D(e)}else null==D||D(P)}),[F,re]);const le=null!=C?C:g,se="number"==typeof le?v&&y?le-96:v&&!y||!v&&y?le-48:le:le;i((()=>{const e=null!=O?O:b;if(null===oe)te(e);else if("number"==typeof e)te(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));te(t)}}),[oe]);const ce=[],ae=(G&&L?J:P).map((e=>{var t,o;if(G&&!L){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(G.toLowerCase()))&&(ce.push(!G||e.label===G),!0)})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(G.toLowerCase()))||(null===(o=e.searchKey)||void 0===o?void 0:o.toLowerCase().includes(G.toLowerCase()))?(ce.push(!G||e.label===G),e):null}return e})).filter((e=>null!==e)),ue=!!v&&G&&0===ae.length;return e(h,Object.assign({version:k,ref:ie,style:Object.assign({width:ee},N)},{children:[e("div",Object.assign({style:{width:oe?"50%":"100%",display:"flex",flexDirection:"column",background:"white"}},{children:[!!v&&t(f,{onSearch:W,version:k}),ae.length||G?e(m,Object.assign({minHeight:le,maxHeight:se},{children:[!!y&&!ue&&!I&&t(p,{version:k,options:G&&L?J:P,onSelect:U}),!x&&ue&&t(S,{isLoading:q,height:se,searchedString:G}),x&&(ue||!!ce.length&&ce.every((e=>!1===e)))&&t(a,{version:k,isMultiSelect:y,onSelect:X,searchedString:G}),t(u,{onInfiniteScroll:H,onDropdownItemClick:R,version:k,onSelect:Q,showDescription:function(e,t){ne(e&&t?{title:e,description:t}:null)},isMultiSelect:y,options:ae,useDefaultCursor:K,ref:re})]})):t("div",Object.assign({style:{height:le,display:"flex"}},{children:t(r,{title:"No results found",subTitle:"Please try again later or contact us at support@bik.ai if you require further assistance."})})),!!y&&!(!ae.length&&!G)&&"2.0"!==k&&t(d,{onClear:()=>{V(),null==T||T()},onApply:Y,list:G&&L?J:P,buttonText:B,buttonOptions:Z})]})),!!oe&&t(c,{title:oe.title,description:oe.description,version:k})]}))};export{w as OpenedDropdown};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { Placement, PositioningStrategy } from '@popperjs/core';
|
|
3
|
-
import {
|
|
3
|
+
import { Type } from '../button/model';
|
|
4
4
|
export interface OpenDropdownProps {
|
|
5
5
|
defaultOptions?: DropdownOption[];
|
|
6
6
|
options: DropdownOption[];
|
|
@@ -30,11 +30,6 @@ export interface OpenDropdownProps {
|
|
|
30
30
|
useDefaultCursor?: boolean;
|
|
31
31
|
'data-test'?: string;
|
|
32
32
|
containerStyle?: React.CSSProperties;
|
|
33
|
-
zeroState?: {
|
|
34
|
-
actionButton?: ButtonProps;
|
|
35
|
-
title: string;
|
|
36
|
-
subTitle?: string;
|
|
37
|
-
};
|
|
38
33
|
}
|
|
39
34
|
export type GroupedOption = {
|
|
40
35
|
label?: string;
|
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { ButtonProps } from '../button/model';
|
|
3
2
|
export declare const ZeroState: React.FC<{
|
|
4
3
|
isLoading?: boolean;
|
|
5
4
|
title: string;
|
|
6
5
|
subTitle?: string;
|
|
7
6
|
IconHolderStyle?: React.CSSProperties;
|
|
8
7
|
style?: React.CSSProperties /** now this component is extendable through styled-component */;
|
|
9
|
-
actionButton?: ButtonProps;
|
|
10
8
|
}>;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import{
|
|
2
|
-
background: ${
|
|
1
|
+
import{jsxs as e,jsx as t}from"react/jsx-runtime";import n from"styled-components";import{Spinner as r}from"../spinner/Spinner.js";import{TitleRegular as o,BodyCaption as i}from"../TypographyStyle.js";import{COLORS as s}from"../../constants/Theme.js";import l from"../../assets/icons/alert.svg.js";const c=n.div`
|
|
2
|
+
background: ${s.surface.standard};
|
|
3
3
|
display: flex;
|
|
4
4
|
flex-direction: column;
|
|
5
5
|
align-items: center;
|
|
6
6
|
justify-content: center;
|
|
7
7
|
flex: 1;
|
|
8
|
-
`,
|
|
9
|
-
background: ${
|
|
8
|
+
`,a=n.div`
|
|
9
|
+
background: ${s.background.base};
|
|
10
10
|
width: 48px;
|
|
11
11
|
height: 48px;
|
|
12
12
|
display: flex;
|
|
@@ -14,4 +14,4 @@ import{__rest as t}from"../../_virtual/_tslib.js";import{jsxs as e,jsx as n}from
|
|
|
14
14
|
align-items: center;
|
|
15
15
|
justify-content: center;
|
|
16
16
|
border-radius: 24px;
|
|
17
|
-
`,
|
|
17
|
+
`,d=n=>{let{subTitle:d,title:m,IconHolderStyle:p,style:g,isLoading:u}=n;return e(c,Object.assign({style:null!=g?g:{}},{children:[u?t(r,{size:"large",color:s.stroke.brand}):t(a,Object.assign({style:null!=p?p:{}},{children:t(l,{color:s.content.placeholder,height:24,width:24})})),t(o,Object.assign({style:{marginTop:8,color:s.content.primary}},{children:u?"Loading...":m||"No results found"})),!!d&&!u&&t(i,Object.assign({style:{marginTop:4,color:s.content.secondary,textAlign:"center",maxWidth:184}},{children:d}))]}))};export{d as ZeroState};
|