@bikdotai/bik-component-library 0.0.796-beta.11 → 0.0.796-beta.3
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/components/Connectors/Components/InTheLast.js +1 -1
- package/dist/cjs/components/QueryBuilder/components/Connectors/Components/InTwoLast.js +1 -1
- package/dist/cjs/components/QueryBuilder/constants/connector.js +1 -1
- package/dist/cjs/components/QueryBuilder/types/QueryBuilderEnum.type.d.ts +2 -1
- package/dist/cjs/components/QueryBuilder/types/QueryBuilderEnum.type.js +1 -1
- package/dist/cjs/components/analytics-chips-and-dropdowns/index.d.ts +1 -0
- package/dist/cjs/components/avatar/Avatar.d.ts +1 -2
- package/dist/cjs/components/avatar/Avatar.js +1 -1
- package/dist/cjs/components/avatar/AvatarHelper.d.ts +0 -2
- package/dist/cjs/components/avatar/AvatarHelper.js +1 -1
- package/dist/cjs/components/bik-layout/index.d.ts +1 -2
- 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 +5 -6
- 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 +0 -1
- 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 +0 -1
- package/dist/cjs/components/icon-button/IconButton.styled.js +3 -3
- package/dist/cjs/components/icon-button/model.d.ts +0 -5
- package/dist/cjs/components/input/Input.js +1 -1
- package/dist/cjs/components/input/Input.model.d.ts +1 -2
- package/dist/cjs/components/input/Input.styled.d.ts +1 -16
- package/dist/cjs/components/input/Input.styled.js +1 -1
- package/dist/cjs/components/input/index.d.ts +1 -0
- 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 +0 -1
- package/dist/cjs/components/multi-level-dropdown/GroupedMenuList.js +1 -1
- package/dist/cjs/components/multi-level-dropdown/MenuItem.d.ts +0 -1
- package/dist/cjs/components/multi-level-dropdown/MenuItem.js +1 -1
- package/dist/cjs/components/multi-level-dropdown/MenuList.d.ts +0 -1
- 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 +3 -13
- package/dist/cjs/components/multi-level-dropdown/MultiLevelDropdown.styled.js +30 -33
- package/dist/cjs/components/multi-level-dropdown/type.d.ts +0 -1
- package/dist/cjs/components/tag/Tag.d.ts +1 -1
- package/dist/cjs/components/tag/Tag.js +1 -1
- package/dist/cjs/components/tag/Tag.stories.d.ts +5 -5
- package/dist/cjs/components/tag/Tag.styled.d.ts +1 -3
- package/dist/cjs/components/tag/Tag.styled.js +1 -1
- package/dist/cjs/components/tag/model.d.ts +1 -5
- package/dist/cjs/components/template-context-mapper/index.d.ts +1 -0
- package/dist/cjs/components/whats-new/WhatsNew.d.ts +0 -2
- package/dist/cjs/components/whats-new/WhatsNew.js +1 -1
- package/dist/cjs/components/whats-new/WhatsNew.types.d.ts +0 -2
- package/dist/cjs/components/whats-new/WhatsNewButton.js +1 -1
- package/dist/cjs/constants/Theme.d.ts +0 -6
- package/dist/cjs/constants/Theme.js +1 -1
- package/dist/cjs/icons/Arrows/Chevron/ChevronUp.d.ts +2 -1
- package/dist/cjs/icons/Arrows/Chevron/ChevronUp.js +1 -1
- package/dist/cjs/index.js +1 -1
- package/dist/esm/components/QueryBuilder/components/Connectors/Components/InTheLast.js +1 -1
- package/dist/esm/components/QueryBuilder/components/Connectors/Components/InTwoLast.js +1 -1
- package/dist/esm/components/QueryBuilder/constants/connector.js +1 -1
- package/dist/esm/components/QueryBuilder/types/QueryBuilderEnum.type.d.ts +2 -1
- package/dist/esm/components/QueryBuilder/types/QueryBuilderEnum.type.js +1 -1
- package/dist/esm/components/analytics-chips-and-dropdowns/index.d.ts +1 -0
- package/dist/esm/components/avatar/Avatar.d.ts +1 -2
- package/dist/esm/components/avatar/Avatar.js +1 -1
- package/dist/esm/components/avatar/AvatarHelper.d.ts +0 -2
- package/dist/esm/components/avatar/AvatarHelper.js +1 -1
- package/dist/esm/components/bik-layout/index.d.ts +1 -2
- 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 +2 -3
- 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 +0 -1
- 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 +0 -1
- package/dist/esm/components/icon-button/IconButton.styled.js +1 -1
- package/dist/esm/components/icon-button/model.d.ts +0 -5
- package/dist/esm/components/input/Input.js +1 -1
- package/dist/esm/components/input/Input.model.d.ts +1 -2
- package/dist/esm/components/input/Input.styled.d.ts +1 -16
- package/dist/esm/components/input/Input.styled.js +1 -1
- package/dist/esm/components/input/index.d.ts +1 -0
- 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 +0 -1
- package/dist/esm/components/multi-level-dropdown/GroupedMenuList.js +1 -1
- package/dist/esm/components/multi-level-dropdown/MenuItem.d.ts +0 -1
- package/dist/esm/components/multi-level-dropdown/MenuItem.js +1 -1
- package/dist/esm/components/multi-level-dropdown/MenuList.d.ts +0 -1
- 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 +3 -13
- package/dist/esm/components/multi-level-dropdown/MultiLevelDropdown.styled.js +29 -32
- package/dist/esm/components/multi-level-dropdown/type.d.ts +0 -1
- package/dist/esm/components/tag/Tag.d.ts +1 -1
- package/dist/esm/components/tag/Tag.js +1 -1
- package/dist/esm/components/tag/Tag.stories.d.ts +5 -5
- package/dist/esm/components/tag/Tag.styled.d.ts +1 -3
- package/dist/esm/components/tag/Tag.styled.js +1 -1
- package/dist/esm/components/tag/model.d.ts +1 -5
- package/dist/esm/components/template-context-mapper/index.d.ts +1 -0
- package/dist/esm/components/whats-new/WhatsNew.d.ts +0 -2
- package/dist/esm/components/whats-new/WhatsNew.js +1 -1
- package/dist/esm/components/whats-new/WhatsNew.types.d.ts +0 -2
- package/dist/esm/components/whats-new/WhatsNewButton.js +1 -1
- package/dist/esm/constants/Theme.d.ts +0 -6
- package/dist/esm/constants/Theme.js +1 -1
- package/dist/esm/icons/Arrows/Chevron/ChevronUp.d.ts +2 -1
- package/dist/esm/icons/Arrows/Chevron/ChevronUp.js +1 -1
- package/dist/esm/index.js +1 -1
- package/package.json +2 -1
- package/dist/cjs/components/bik-layout/BikSidebarV2/BikSidebarV2.d.ts +0 -33
- package/dist/cjs/components/bik-layout/BikSidebarV2/BikSidebarV2.js +0 -1
- package/dist/cjs/components/bik-layout/BikSidebarV2/SidebarV2.model.d.ts +0 -27
- package/dist/cjs/components/bik-layout/BikSidebarV2/SidebarV2Popup.d.ts +0 -13
- package/dist/cjs/components/bik-layout/BikSidebarV2/SidebarV2Popup.js +0 -1
- package/dist/cjs/components/bik-layout/BikSidebarV2/SidebarV2Styles.d.ts +0 -44
- package/dist/cjs/components/bik-layout/BikSidebarV2/SidebarV2Styles.js +0 -293
- package/dist/cjs/components/bik-layout/BikSidebarV2/SimpleSidebarV2.d.ts +0 -3
- package/dist/cjs/components/bik-layout/BikSidebarV2/SimpleSidebarV2.js +0 -1
- package/dist/esm/components/bik-layout/BikSidebarV2/BikSidebarV2.d.ts +0 -33
- package/dist/esm/components/bik-layout/BikSidebarV2/BikSidebarV2.js +0 -1
- package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2.model.d.ts +0 -27
- package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Popup.d.ts +0 -13
- package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Popup.js +0 -1
- package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Styles.d.ts +0 -44
- package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Styles.js +0 -293
- package/dist/esm/components/bik-layout/BikSidebarV2/SimpleSidebarV2.d.ts +0 -3
- package/dist/esm/components/bik-layout/BikSidebarV2/SimpleSidebarV2.js +0 -1
|
@@ -2,9 +2,8 @@ export * from './BikHeader';
|
|
|
2
2
|
export * from './BikLayout';
|
|
3
3
|
export * from './BikProfile';
|
|
4
4
|
export * from './SimpleSidebar';
|
|
5
|
+
export * from './Sidebar.model';
|
|
5
6
|
export * from './BikSidebar';
|
|
6
|
-
export * from './BikSidebarV2/BikSidebarV2';
|
|
7
|
-
export * from './BikSidebarV2/SidebarV2.model';
|
|
8
7
|
export * from './FeatureModal';
|
|
9
8
|
export * from './SidebarSkeleton';
|
|
10
9
|
export * from './ShowShopifyRestrictedModal';
|
|
@@ -10,7 +10,7 @@ export declare const Button: import("@emotion/styled").StyledComponent<{
|
|
|
10
10
|
inverse?: boolean | undefined;
|
|
11
11
|
disabled?: boolean | undefined;
|
|
12
12
|
matchParentWidth?: boolean | undefined;
|
|
13
|
-
version?: "1.0" | "2.0" |
|
|
13
|
+
version?: "1.0" | "2.0" | undefined;
|
|
14
14
|
darkMode?: boolean | undefined;
|
|
15
15
|
activated?: boolean | undefined;
|
|
16
16
|
error?: boolean | undefined;
|
|
@@ -66,7 +66,7 @@ export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElemen
|
|
|
66
66
|
*/
|
|
67
67
|
matchParentWidth?: boolean;
|
|
68
68
|
subtitle?: string;
|
|
69
|
-
version?: '1.0' | '2.0'
|
|
69
|
+
version?: '1.0' | '2.0';
|
|
70
70
|
darkMode?: boolean;
|
|
71
71
|
activated?: boolean;
|
|
72
72
|
error?: boolean;
|
|
@@ -8,7 +8,7 @@ export declare const GetButtonTextComponent: (size: Size, type: Type, disabled?:
|
|
|
8
8
|
color?: string | undefined;
|
|
9
9
|
}, never>;
|
|
10
10
|
export declare const getBorderColor: (type: Type, inverse?: boolean, error?: boolean) => string;
|
|
11
|
-
export declare const getBorder: (version: '1.0' | '2.0'
|
|
11
|
+
export declare const getBorder: (version: '1.0' | '2.0', type: Type, size: Size, inverse?: boolean, error?: boolean) => string;
|
|
12
12
|
export declare const getLinearGradientValue: (size: Size) => string;
|
|
13
13
|
/**
|
|
14
14
|
* Adjusts the brightness of a given hex color by a specified percentage.
|
|
@@ -2,7 +2,7 @@ import { Placement, PositioningStrategy } from '@popperjs/core';
|
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import { CountryCode } from "./CountryCodePicker.modal";
|
|
4
4
|
export declare const CountryCodePicker: React.FC<{
|
|
5
|
-
version: '1.0' | '2.0'
|
|
5
|
+
version: '1.0' | '2.0';
|
|
6
6
|
onCountrySelect: (country: CountryCode) => void;
|
|
7
7
|
selectedCountry: CountryCode;
|
|
8
8
|
popoverWidth?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__rest as e}from"../../_virtual/_tslib.js";import{jsx as o,Fragment as n,jsxs as t}from"react/jsx-runtime";import{useState as i,useRef as
|
|
1
|
+
import{__rest as e}from"../../_virtual/_tslib.js";import{jsx as o,Fragment as n,jsxs as t}from"react/jsx-runtime";import{useState as i,useRef as l,useEffect as r}from"react";import{COLORS as s}from"../../constants/Theme.js";import a from"../../assets/icons/chevronDown.svg.js";import{Input as d}from"../input/Input.js";import{InputStyleContext as c}from"../input/context/InputStyleProvider.js";import p from"./ChipInput.js";import{DropdownPopover as h}from"./DropdownPopover/index.js";import{getSelectedOptionsAsText as u}from"./OpenedDropdown/utils/iterationOnOptions.js";function v(){}const m=m=>{var g,f,w,b,x,{placeHolder:j,size:O,onSelect:I,defaultOptions:y,disabled:S,noErrorHint:H,placeHolderHeight:T,showPlaceholderWhenSelected:D=!1,inputStyle:E={},inputType:P="default",onDeleteChip:C,truncatedText:M,showLeadingIconInPlaceholder:W=!1,showTrailingIconPlaceholder:L=!1,showLabelsOnMoreHover:k=!1,value:z,showSelected:A=!1}=m,_=e(m,["placeHolder","size","onSelect","defaultOptions","disabled","noErrorHint","placeHolderHeight","showPlaceholderWhenSelected","inputStyle","inputType","onDeleteChip","truncatedText","showLeadingIconInPlaceholder","showTrailingIconPlaceholder","showLabelsOnMoreHover","value","showSelected"]);const[N,U]=i(!1),[V,q]=i(!1),B=null!=O?O:"default",F=l(),[G,J]=i(null!=y?y:[]);r((()=>{var e;const o=[];null===(e=null==_?void 0:_.options)||void 0===e||e.forEach((e=>{e.options?e.options.forEach((e=>{e.selected&&o.push(Object.assign(Object.assign({},e),{label:e.label}))})):e.selected&&o.push(e)})),J([...o])}),[_.options]),r((()=>{y&&J([...y])}),[y]);const K=u(G),Q=D?j:null!==(g=null!=K?K:j)&&void 0!==g?g:"Select an option",R=_.buttonWidth,X=null!==(f=null!=R?R:_.width)&&void 0!==f?f:"100%",Y=null!==(w=_.dropdownWidth)&&void 0!==w?w:X;return o(n,{children:o(c.Provider,Object.assign({value:{InputWrapper:Object.assign(Object.assign(Object.assign({height:T||("x-small"===B?24:"small"===B?32:48),width:X},R?{maxWidth:R}:{}),{zIndex:1,cursor:"pointer",padding:"x-small"===B?"4px 8px":"6px 8px",backgroundColor:A&&void 0!==z?s.background.positive.light:V?"#E0E0E0":"#ffffff",transition:"background-color 0.3s ease"}),E),input:{minHeight:"100%",maxWidth:"100%",color:A&&void 0!==z?s.content.positive:"inherit"}}},{children:o("div",Object.assign({onMouseEnter:()=>q(!0),onMouseLeave:()=>q(!1),style:_.width?{width:_.width}:void 0},{children:t(h,Object.assign({"data-test":_["data-test"],ref:F,onSelect:function(e){Array.isArray(e)?J([...e]):J([e]),null==I||I(e)},disabled:S,onDropdownVisbilityChange:e=>U(e)},_,{width:Y},{children:["default"==P&&o(d,{version:_.version,noErrorHint:H,state:S?"disabled":"none",value:void 0===z?Q:z,errorMessage:_.error,variant:B,placeholder:null!=j?j:"Select an option",onChangeText:v,leftIcon:W&&(null===(b=G[0])||void 0===b?void 0:b.leadingIcon)?{icon:()=>{var e;return o(n,{children:null===(e=G[0])||void 0===e?void 0:e.leadingIcon})}}:void 0,rightIcon:{icon:()=>{var e;return t("div",Object.assign({style:{display:"flex"}},{children:[L&&(null===(e=G[0])||void 0===e?void 0:e.trailingIcon),o(a,{style:{transform:N?"rotate(180deg)":"rotate(0deg)"},onClick:v,width:"x-small"===B?16:"small"===B?20:24,height:"x-small"===B?16:"small"===B?20:24,color:A?s.content.positive:s.content.primary})]}))}},truncateText:null==M||M}),"chip"==P&&o(p,{placeholder:null!=j?j:"Select options",chips:G,onDeleteChip:e=>{null==C||C(e)},errorMessage:_.error,isDropdownOpened:N,sizeToUse:B,containerStyle:{width:null!==(x=_.width)&&void 0!==x?x:"100%",cursor:"pointer"},showLabelsOnMoreHover:k})]}))}))}))})};m.displayName="Dropdown";export{m as Dropdown};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__rest as o}from"../../../_virtual/_tslib.js";import{jsx as e,Fragment as
|
|
1
|
+
import{__rest as o}from"../../../_virtual/_tslib.js";import{jsx as e,Fragment as t,jsxs as n}from"react/jsx-runtime";import l,{useState as r,useRef as i,useImperativeHandle as s,useEffect as d}from"react";import{usePopper as a}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 u}from"../Common.styled.js";import{OpenedDropdown as m}from"../OpenedDropdown/components/OpennedDropdown.js";const w=l.forwardRef(((l,w)=>{var{children:h,onDropdownVisbilityChange:b,version:g="1.0",tooltipContent:f,tooltipDirection:O,showTooltipArrow:j,isChildLoading:D,forceOpen:y}=l,C=o(l,["children","onDropdownVisbilityChange","version","tooltipContent","tooltipDirection","showTooltipArrow","isChildLoading","forceOpen"]);const S=w,[R,x]=r(!1),[z,E]=r(null),[A,L]=r(null),T=i(null),{styles:I,attributes:M}=a(z,A,{placement:C.placement,strategy:C.strategy}),V=o=>{var e,t;"2.0"===g&&C.isMultiSelect&&o&&(null===(e=C.onSelect)||void 0===e||e.call(C,[...o])),x(!1),null===(t=null==C?void 0:C.onClose)||void 0===t||t.call(C)};s(S,(()=>({openDropdown:R})),[]),d((()=>{(null==S?void 0:S.current)&&(S.current.openDropdown=R)}),[R]),d((()=>{null==b||b(R)}),[R]);const _=()=>{var o;return n(t,{children:[n("div",Object.assign({style:{position:"relative"},ref:E},{children:[e(v,Object.assign({ref:T,allowEvents:C.allowEvents,disabled:C.disabled,onClick:o=>{var e;null===(e=C.onDropdownOpen)||void 0===e||e.call(C),R?(x(!1),o.preventDefault()):C.disabled||x(!0)},isChildLoading:D},{children:C.allowEvents?h:null})),C.allowEvents?null:h]})),(R||y)&&e(u,Object.assign({ref:L,style:Object.assign(Object.assign({},I.popper),{zIndex:null!==(o=C.dropdownZIndex)&&void 0!==o?o:3})},M.popper,{"data-test":C["data-test"]},{children:e(p,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:e(m,Object.assign({},C,{onSelect:o=>{var e;"2.0"===g&&C.isMultiSelect||(null===(e=C.onSelect)||void 0===e||e.call(C,o),x(!1))},onClose:V,version:g,headerRef:T,zeroState:null==C?void 0:C.zeroState,isDraggable:C.isDraggable,onOptionsReorder:C.onOptionsReorder}))}))}))]})};return e(t,{children:R||y||void 0===f?_():e(c,Object.assign({body:f,placement:O,hideArrow:!j},{children:e("div",Object.assign({"data-test":C["data-test"]},{children:_()}))}))})}));w.displayName="DropdownPopover";export{w as DropdownPopover};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as t}from"react/jsx-runtime";import o from"../../../../assets/icons/errorInfo.svg.js";import n from"../../../../assets/icons/refresh-purple.svg.js";import{useCallback as r,useState as i,useRef as s,useEffect as l}from"react";import{ZeroState as c}from"../../../zeroState/ZeroState.js";import{useOutside as a}from"../../../../hooks/useOutside.js";import{COLORS as u}from"../../../../constants/Theme.js";import{useDropdown as d}from"../../hooks/useDropdown.js";import{Description as p}from"./description/Description.js";import{FreeFormMenu as h}from"./menu/FreeFormMenu.js";import{MenuList as g}from"./menu/MenuList.js";import{SelectAllMenu as m}from"./menu/SelectAllMenu.js";import f from"./multiSelect/MultiSelectDropdownBottomBar.js";import{OpennedDropdownContainer as b,MenuListContainer as v}from"./OpennedDropdown.styled.js";import{SearchBox as S}from"./searchbox/SearchBox.js";import{SearchZeroState as j}from"./searchbox/SearchZeroState.js";const w=304,O=290,y=y=>{let{options:x,isSearchable:C,isMultiSelect:k,maxSelections:D,width:L,allowFreeForm:I,height:T,onClose:E,onSelect:M,onSearch:F,version:A,skipSorting:B,headerRef:H,hideSelectAll:R,primaryButtonText:q,onInfiniteScroll:z,onMultiSelectClear:P,onDropdownItemClick:V,buttonOptions:W,isSearchLoading:Z,isOptionsLoading:$,optionsErrorState:K,disableSearchOptions:N,disableSearchedOptionExcept:U,useDefaultCursor:G,containerStyle:J={},zeroState:Q,isDraggable:X=!1,onOptionsReorder:Y,hideClearButton:_=!1,showCheckboxForCustomElement:ee=!1}=y;var te;const oe=r((e=>{if(!X||!k)return e;const t=[],o=[];return e.forEach((e=>{if(e.options)o.push(e);else{e.selected?t.push(e):o.push(e)}})),[...t,...o]}),[X,k]),[ne,re]=i((()=>oe(x))),ie=s(ne),se=s(!1),le=s(Y);l((()=>{re(oe(x))}),[x,oe]),l((()=>{ie.current=ne}),[ne]),l((()=>{le.current=Y}),[Y]),l((()=>()=>{se.current&&le.current&&le.current(ie.current)}),[]);const ce=r((e=>{re(e),"2.0"===A?null==Y||Y(e):se.current=!0}),[Y,A]),ae=X?ne:x,{dropdownOptions:ue,search:de,searchedString:pe,searchedOptions:he,searchError:ge,retrySearch:me,onApplyHandler:fe,selectAllHandler:be,onMultiSelectClear:ve,onFreeFormSelect:Se,onMultiSelectApply:je,latestDropdownOptionsRef:we,getSelectedOptions:Oe,getCurrentSelectionCount:ye}=d(A,ae,M,B||X,k,F,N,U,D),[xe,Ce]=i(null!=L?L:O),[ke,De]=i(null),[Le,Ie]=i(-1),Te=s(null),Ee=s([]),Me=s(null);a(Te,(()=>{if(De(null),k&&"2.0"===A){const e=Oe(we.current);null==E||E(e)}else null==E||E(ue)}),[H,Ee]),l((()=>{const e=setTimeout((()=>{Te.current&&Te.current.focus({preventScroll:!0})}),0);return()=>clearTimeout(e)}),[]);l((()=>{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 o=e;o.disabled||t.push(o)}})),t})(pe&&F?he:ue);if(0!==t.length)if("ArrowDown"===e.key)e.preventDefault(),Ie((e=>{const o=e<t.length-1?e+1:0;return setTimeout((()=>{var e;const t=null===(e=Me.current)||void 0===e?void 0:e.querySelector(`[data-option-index="${o}"]`);t&&t.scrollIntoView({block:"nearest",behavior:"smooth"})}),0),o}));else if("ArrowUp"===e.key)e.preventDefault(),Ie((e=>{const o=e>0?e-1:t.length-1;return setTimeout((()=>{var e;const t=null===(e=Me.current)||void 0===e?void 0:e.querySelector(`[data-option-index="${o}"]`);t&&t.scrollIntoView({block:"nearest",behavior:"smooth"})}),0),o}));else if("Enter"===e.key&&Le>=0){e.preventDefault();const o=t[Le];o&&(fe(Object.assign(Object.assign({},o),{selected:!o.selected})),V&&V(o))}},t=Te.current;if(t)return t.addEventListener("keydown",e),()=>{t.removeEventListener("keydown",e)}}),[Le,pe,he,ue,F,fe,V]);const Fe=null!=T?T:w,Ae="number"==typeof Fe?C&&k?Fe-96:C&&!k||!C&&k?Fe-48:Fe:Fe;l((()=>{const e=null!=L?L:O;if(null===ke)Ce(e);else if("number"==typeof e)Ce(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));Ce(t)}}),[ke]);const Be=[],He=(e=>{if(!k||!D&&0!==D)return e;const t=ye(ue)>=D;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 o=e;return Object.assign(Object.assign({},o),{disabled:o.disabled||!o.selected&&t})}})):e})((pe&&F?he:ue).map((e=>{var t,o;if(pe&&!F){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(pe.toLowerCase()))&&(Be.push(!pe||e.label===pe),!0)})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(pe.toLowerCase()))||(null===(o=e.searchKey)||void 0===o?void 0:o.toLowerCase().includes(pe.toLowerCase()))?(Be.push(!pe||e.label===pe),e):null}return e})).filter((e=>null!==e))),Re=!!C&&pe&&0===He.length,qe=!pe&&!!$,ze=!pe&&!!K&&!qe,Pe=!(pe||He.length||qe||ze),Ve=qe||ze||Pe,We=(null==Q?void 0:Q.title)||"No results found",Ze=(null==Q?void 0:Q.subTitle)||"Please try again later or contact us at support@bik.ai if you require further assistance.",$e=(null==K?void 0:K.title)||"Failed to load options",Ke=(null==K?void 0:K.subTitle)||"Something went wrong while fetching the list. Please try again",Ne={buttonText:"Try again",buttonType:"text",size:"small",buttonTextColor:u.background.inverseLight,customIconColor:u.background.inverseLight,LeadingIcon:n},Ue=Object.assign({IconHolderStyle:{background:u.background.negative.light},Icon:e(o,{color:u.content.negative,width:24,height:24})},K);Ue.actionButton=Object.assign(Object.assign({},Ne),null!==(te=null==K?void 0:K.actionButton)&&void 0!==te?te:{});const Ge=qe?void 0:ze?Ue:Q;return t(b,Object.assign({version:A,ref:Te,tabIndex:-1,style:Object.assign(Object.assign({width:xe},J),{outline:"none"})},{children:[t("div",Object.assign({style:{width:ke?"50%":"100%",display:"flex",flexDirection:"column",background:"white"}},{children:[!!C&&e(S,{onSearch:de,version:A}),Ve?e("div",Object.assign({style:{height:Fe,display:"flex",background:u.background.base}},{children:e(c,Object.assign({},null!=Ge?Ge:{},{isLoading:qe,title:ze?$e:We,subTitle:ze?Ke:Ze}))})):t(v,Object.assign({minHeight:Fe,maxHeight:Ae,ref:Me},{children:[!!k&&!Re&&!R&&e(m,{version:A,options:pe&&F?he:ue,onSelect:be}),!I&&Re&&e(j,{isLoading:Z,errorMessage:ge,onRetry:me,height:Ae,searchedString:pe,containerWidth:L
|
|
1
|
+
import{jsx as e,jsxs as t}from"react/jsx-runtime";import o from"../../../../assets/icons/errorInfo.svg.js";import n from"../../../../assets/icons/refresh-purple.svg.js";import{useCallback as r,useState as i,useRef as s,useEffect as l}from"react";import{ZeroState as c}from"../../../zeroState/ZeroState.js";import{useOutside as a}from"../../../../hooks/useOutside.js";import{COLORS as u}from"../../../../constants/Theme.js";import{useDropdown as d}from"../../hooks/useDropdown.js";import{Description as p}from"./description/Description.js";import{FreeFormMenu as h}from"./menu/FreeFormMenu.js";import{MenuList as g}from"./menu/MenuList.js";import{SelectAllMenu as m}from"./menu/SelectAllMenu.js";import f from"./multiSelect/MultiSelectDropdownBottomBar.js";import{OpennedDropdownContainer as b,MenuListContainer as v}from"./OpennedDropdown.styled.js";import{SearchBox as S}from"./searchbox/SearchBox.js";import{SearchZeroState as j}from"./searchbox/SearchZeroState.js";const w=304,O=290,y=y=>{let{options:x,isSearchable:C,isMultiSelect:k,maxSelections:D,width:L,allowFreeForm:I,height:T,onClose:E,onSelect:M,onSearch:F,version:A,skipSorting:B,headerRef:H,hideSelectAll:R,primaryButtonText:q,onInfiniteScroll:z,onMultiSelectClear:P,onDropdownItemClick:V,buttonOptions:W,isSearchLoading:Z,isOptionsLoading:$,optionsErrorState:K,disableSearchOptions:N,disableSearchedOptionExcept:U,useDefaultCursor:G,containerStyle:J={},zeroState:Q,isDraggable:X=!1,onOptionsReorder:Y,hideClearButton:_=!1,showCheckboxForCustomElement:ee=!1}=y;var te;const oe=r((e=>{if(!X||!k)return e;const t=[],o=[];return e.forEach((e=>{if(e.options)o.push(e);else{e.selected?t.push(e):o.push(e)}})),[...t,...o]}),[X,k]),[ne,re]=i((()=>oe(x))),ie=s(ne),se=s(!1),le=s(Y);l((()=>{re(oe(x))}),[x,oe]),l((()=>{ie.current=ne}),[ne]),l((()=>{le.current=Y}),[Y]),l((()=>()=>{se.current&&le.current&&le.current(ie.current)}),[]);const ce=r((e=>{re(e),"2.0"===A?null==Y||Y(e):se.current=!0}),[Y,A]),ae=X?ne:x,{dropdownOptions:ue,search:de,searchedString:pe,searchedOptions:he,searchError:ge,retrySearch:me,onApplyHandler:fe,selectAllHandler:be,onMultiSelectClear:ve,onFreeFormSelect:Se,onMultiSelectApply:je,latestDropdownOptionsRef:we,getSelectedOptions:Oe,getCurrentSelectionCount:ye}=d(A,ae,M,B||X,k,F,N,U,D),[xe,Ce]=i(null!=L?L:O),[ke,De]=i(null),[Le,Ie]=i(-1),Te=s(null),Ee=s([]),Me=s(null);a(Te,(()=>{if(De(null),k&&"2.0"===A){const e=Oe(we.current);null==E||E(e)}else null==E||E(ue)}),[H,Ee]),l((()=>{const e=setTimeout((()=>{Te.current&&Te.current.focus({preventScroll:!0})}),0);return()=>clearTimeout(e)}),[]);l((()=>{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 o=e;o.disabled||t.push(o)}})),t})(pe&&F?he:ue);if(0!==t.length)if("ArrowDown"===e.key)e.preventDefault(),Ie((e=>{const o=e<t.length-1?e+1:0;return setTimeout((()=>{var e;const t=null===(e=Me.current)||void 0===e?void 0:e.querySelector(`[data-option-index="${o}"]`);t&&t.scrollIntoView({block:"nearest",behavior:"smooth"})}),0),o}));else if("ArrowUp"===e.key)e.preventDefault(),Ie((e=>{const o=e>0?e-1:t.length-1;return setTimeout((()=>{var e;const t=null===(e=Me.current)||void 0===e?void 0:e.querySelector(`[data-option-index="${o}"]`);t&&t.scrollIntoView({block:"nearest",behavior:"smooth"})}),0),o}));else if("Enter"===e.key&&Le>=0){e.preventDefault();const o=t[Le];o&&(fe(Object.assign(Object.assign({},o),{selected:!o.selected})),V&&V(o))}},t=Te.current;if(t)return t.addEventListener("keydown",e),()=>{t.removeEventListener("keydown",e)}}),[Le,pe,he,ue,F,fe,V]);const Fe=null!=T?T:w,Ae="number"==typeof Fe?C&&k?Fe-96:C&&!k||!C&&k?Fe-48:Fe:Fe;l((()=>{const e=null!=L?L:O;if(null===ke)Ce(e);else if("number"==typeof e)Ce(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));Ce(t)}}),[ke]);const Be=[],He=(e=>{if(!k||!D&&0!==D)return e;const t=ye(ue)>=D;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 o=e;return Object.assign(Object.assign({},o),{disabled:o.disabled||!o.selected&&t})}})):e})((pe&&F?he:ue).map((e=>{var t,o;if(pe&&!F){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(pe.toLowerCase()))&&(Be.push(!pe||e.label===pe),!0)})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(pe.toLowerCase()))||(null===(o=e.searchKey)||void 0===o?void 0:o.toLowerCase().includes(pe.toLowerCase()))?(Be.push(!pe||e.label===pe),e):null}return e})).filter((e=>null!==e))),Re=!!C&&pe&&0===He.length,qe=!pe&&!!$,ze=!pe&&!!K&&!qe,Pe=!(pe||He.length||qe||ze),Ve=qe||ze||Pe,We=(null==Q?void 0:Q.title)||"No results found",Ze=(null==Q?void 0:Q.subTitle)||"Please try again later or contact us at support@bik.ai if you require further assistance.",$e=(null==K?void 0:K.title)||"Failed to load options",Ke=(null==K?void 0:K.subTitle)||"Something went wrong while fetching the list. Please try again",Ne={buttonText:"Try again",buttonType:"text",size:"small",buttonTextColor:u.background.inverseLight,customIconColor:u.background.inverseLight,LeadingIcon:n},Ue=Object.assign({IconHolderStyle:{background:u.background.negative.light},Icon:e(o,{color:u.content.negative,width:24,height:24})},K);Ue.actionButton=Object.assign(Object.assign({},Ne),null!==(te=null==K?void 0:K.actionButton)&&void 0!==te?te:{});const Ge=qe?void 0:ze?Ue:Q;return t(b,Object.assign({version:A,ref:Te,tabIndex:-1,style:Object.assign(Object.assign({width:xe},J),{outline:"none"})},{children:[t("div",Object.assign({style:{width:ke?"50%":"100%",display:"flex",flexDirection:"column",background:"white"}},{children:[!!C&&e(S,{onSearch:de,version:A}),Ve?e("div",Object.assign({style:{height:Fe,display:"flex",background:u.background.base}},{children:e(c,Object.assign({},null!=Ge?Ge:{},{isLoading:qe,title:ze?$e:We,subTitle:ze?Ke:Ze}))})):t(v,Object.assign({minHeight:Fe,maxHeight:Ae,ref:Me},{children:[!!k&&!Re&&!R&&e(m,{version:A,options:pe&&F?he:ue,onSelect:be}),!I&&Re&&e(j,{isLoading:Z,errorMessage:ge,onRetry:me,height:Ae,searchedString:pe,containerWidth:L}),I&&(Re||!!Be.length&&Be.every((e=>!1===e)))&&e(h,{version:A,isMultiSelect:k,onSelect:Se,searchedString:pe}),e(g,{onInfiniteScroll:z,onDropdownItemClick:V,version:A,onSelect:fe,showDescription:function(e,t){De(e&&t?{title:e,description:t}:null)},isMultiSelect:k,options:He,useDefaultCursor:G,ref:Ee,focusedIndex:Le,isDraggable:X,onOptionsReorder:ce,showCheckboxForCustomElement:ee})]})),!!k&&!Ve&&"2.0"!==A&&e(f,{onClear:()=>{ve(),null==P||P()},onApply:je,list:pe&&F?he:ue,buttonText:q,buttonOptions:W,hideClearButton:_})]})),!!ke&&e(p,{title:ke.title,description:ke.description,version:A})]}))};export{y as OpenedDropdown};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export declare const OpennedDropdownContainer: import("styled-components").StyledComponent<"div", any, {
|
|
2
|
-
version?: "1.0" | "2.0" |
|
|
2
|
+
version?: "1.0" | "2.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,8 +1,7 @@
|
|
|
1
1
|
import o from"styled-components";import{COLORS as r}from"../../../../constants/Theme.js";const e=o.div`
|
|
2
2
|
border-radius: ${o=>"2.0"===o.version?8:4}px;
|
|
3
|
-
border: ${o=>"2.0"===o.version
|
|
4
|
-
|
|
5
|
-
box-shadow: ${o=>"3.0"===o.version?"0px 2px 8px 0px rgba(0, 0, 0, 0.12)":"none"};
|
|
3
|
+
border: ${o=>"2.0"===o.version?0:1}px solid
|
|
4
|
+
${r.stroke.primary};
|
|
6
5
|
max-height: 480px;
|
|
7
6
|
overflow: hidden;
|
|
8
7
|
display: flex;
|
|
@@ -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';
|
|
11
11
|
useDefaultCursor?: boolean;
|
|
12
12
|
isFocused?: boolean;
|
|
13
13
|
dataIndex?: number;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import{jsx as e,Fragment as o,jsxs as n}from"react/jsx-runtime";import t from"../../../../../assets/icons/chevronRight.svg.js";import{forwardRef as r,useState as i}from"react";import s from"styled-components";import{CheckBox as l}from"../../../../checkBox/CheckBox.js";import{ListItem as a}from"../../../../list-item/ListItem.js";import{Tooltip as d}from"../../../../tooltips/Tooltip.js";import{BodyCaption as c}from"../../../../TypographyStyle.js";import{DEFAULT_THEME as p,COLORS as g}from"../../../../../constants/Theme.js";import{FreeFormContainer as m}from"./FreeFormMenu.styled.js";const u=s(a)`
|
|
2
|
-
padding: ${e=>"
|
|
2
|
+
padding: ${e=>"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
|
`,h=s.div`
|
|
@@ -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';
|
|
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';
|
|
8
8
|
}>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as o,Fragment as r}from"react/jsx-runtime";import{useState as t}from"react";import{IconButton as e}from"../../../../icon-button/IconButton.js";import{Input as n}from"../../../../input/Input.js";import{InputStyleContext as i}from"../../../../input/context/InputStyleProvider.js";import{COLORS as s}from"../../../../../constants/Theme.js";import c from"../../../../../assets/icons/cross.svg.js";import p from"../../../../../assets/icons/search.svg.js";const a=a=>{let{onSearch:m,version:l}=a;const[h,d]=t(""),[u,f]=t(!1);return o(i.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:`${"2.0"===l
|
|
1
|
+
import{jsx as o,Fragment as r}from"react/jsx-runtime";import{useState as t}from"react";import{IconButton as e}from"../../../../icon-button/IconButton.js";import{Input as n}from"../../../../input/Input.js";import{InputStyleContext as i}from"../../../../input/context/InputStyleProvider.js";import{COLORS as s}from"../../../../../constants/Theme.js";import c from"../../../../../assets/icons/cross.svg.js";import p from"../../../../../assets/icons/search.svg.js";const a=a=>{let{onSearch:m,version:l}=a;const[h,d]=t(""),[u,f]=t(!1);return o(i.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:`${"2.0"===l?.5:1}px solid ${s.stroke.primary}`,padding:""+("2.0"===l?"6px 8px":"14px 16px")},IconHolder:{marginLeft:0},input:{marginLeft:4,minHeight:"100%"}}},{children:o(n,{noKeyDownChange:!0,skipFocus:!0,placeholder:"Search",variant:"2.0"===l?"small":"default",leftIcon:{icon:()=>o(p,{width:"2.0"===l?18:24,height:"2.0"===l?18:24,color:s.content.placeholder})},rightIcon:{icon:()=>h?o(e,{onClick:()=>{f(!0),m(""),d("")},Icon:c,width:"2.0"===l?18:24,height:"2.0"===l?18:24,iconColor:s.content.placeholder}):o(r,{})},reset:u,onChangeText:o=>{f(!1),d(o),m(o)}})}))};export{a as SearchBox};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as t}from"react/jsx-runtime";import{ZeroState as e}from"../../../../zeroState/ZeroState.js";
|
|
1
|
+
import{jsx as t}from"react/jsx-runtime";import{ZeroState as e}from"../../../../zeroState/ZeroState.js";const o=o=>{let{searchedString:i,height:n,isLoading:r,containerWidth:s,errorMessage:a,onRetry:l}=o;const d=!!a&&!r;return t("div",Object.assign({style:{height:n,display:"flex",alignItems:"center"}},{children:t(e,{isLoading:r,title:d?"Failed to load options":"No results found",subTitle:d?a:`Sorry we could not find any results for "${null!=i?i:""}"`,actionButton:d?{buttonText:"Try again",buttonType:"text",onClick:l}:void 0,containerWidth:s})}))};export{o as SearchZeroState};
|
|
@@ -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';
|
|
21
21
|
skipSorting?: boolean;
|
|
22
22
|
headerRef?: any;
|
|
23
23
|
hideSelectAll?: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__rest as t}from"../../_virtual/_tslib.js";import{jsx as e}from"react/jsx-runtime";import o,{forwardRef as i}from"react";import{Tooltip as
|
|
1
|
+
import{__rest as t}from"../../_virtual/_tslib.js";import{jsx as e}from"react/jsx-runtime";import o,{forwardRef as i}from"react";import{Tooltip as l}from"../tooltips/Tooltip.js";import{IconButton as s}from"./IconButton.styled.js";import{getIconColor as r}from"./theme.js";const d=i(((i,d)=>{var{id:n,iconButtonType:c="default",Icon:a,height:p=20,width:b=20,bordered:m,disabled:y,isSelected:h,style:u,svgStyle:g,iconColor:j,disabledTooltip:f}=i,B=t(i,["id","iconButtonType","Icon","height","width","bordered","disabled","isSelected","style","svgStyle","iconColor","disabledTooltip"]);const T=r(c,y,h),I=e(s,Object.assign({id:n,ref:d,style:u,iconButtonType:c,bordered:m,disabled:y,isSelected:h},B,{children:o.createElement(a,{height:p,width:b,color:j||T,style:Object.assign({display:"block"},null!=g?g:{})})}));return y&&f?e(l,Object.assign({body:f},{children:e("span",Object.assign({style:{display:"inline-block",cursor:"not-allowed"}},{children:I}))})):I}));d.displayName="IconButton";export{d as IconButton};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import t from"styled-components";import{COLORS as n}from"../../constants/Theme.js";import{generateBackgroundColor as o}from"./theme.js";const r=t.button`
|
|
2
|
-
${t=>`\n\tall: unset;\n\tcursor: pointer;\n\tpadding:
|
|
2
|
+
${t=>`\n\tall: unset;\n\tcursor: pointer;\n\tpadding: 6px;\n\tborder-radius: 4px;\n\tflex-wrap: wrap;\n\t${t.bordered&&"ai"!==t.iconButtonType?`border: 1px solid ${n.stroke.primary};`:""}\n\t${t.isSelected?`\n\t\t\tbackground: ${o(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
3
|
`;export{r as IconButton};
|
|
@@ -40,10 +40,5 @@ 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;
|
|
48
43
|
disabledTooltip?: string;
|
|
49
44
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t,Fragment as n}from"react/jsx-runtime";import i from"../../assets/icons/info.svg.js";import{forwardRef as l,useState as r,useContext as o,useRef as a,useEffect as s}from"react";import{Button as c}from"../button/Button.js";import{isFunction as h,shouldSanitizeForType as d,sanitizeUnsafeInput as u,validateInput as g}from"./Input-helper.js";import{Tooltip as
|
|
1
|
+
import{jsxs as e,jsx as t,Fragment as n}from"react/jsx-runtime";import i from"../../assets/icons/info.svg.js";import{forwardRef as l,useState as r,useContext as o,useRef as a,useEffect as s}from"react";import{Button as c}from"../button/Button.js";import{isFunction as h,shouldSanitizeForType as d,sanitizeUnsafeInput as u,validateInput as g}from"./Input-helper.js";import{Tooltip as v}from"../tooltips/Tooltip.js";import{TitleSmall as p,BodySecondary as m}from"../TypographyStyle.js";import{COLORS as b}from"../../constants/Theme.js";import x from"../../assets/icons/errorInfo.svg.js";import{InputStyleContext as f}from"./context/InputStyleProvider.js";import{RootContainer as y,InputFooter as C,MaxCharStyle as j,InputWrapper as T,IconHolder as O,PrefixHolder as w,InputContainer as I,InputContainerSmall as k,SuffixHolder as B,InputHeader as L}from"./Input.styled.js";const A=l(((l,A)=>{var H,D,E,M,P,S,z,F;const{placeholder:K,leftIcon:N,rightIcon:R,labelText:G,maxCharLimit:W,isRequired:_,hintText:q,type:U,state:V,validate:$,variant:J,button:Q,suffixText:X,prefixText:Y,onChangeText:Z,value:ee,noErrorHint:te,reset:ne,rangeValidation:ie,noKeyDownChange:le,version:re,noMaxCharCheck:oe,labelElement:ae,autoGrow:se,minHeight:ce,maxHeight:he,labelTextBold:de,truncateText:ue,maxCharLimitPosition:ge,hightlightInputColor:ve,onKeyDownEvent:pe,hideInputHeader:me,hideBorder:be,inputWrapperStyles:xe,minCharsToTrigger:fe,maxCharAlignment:ye,isDisabled:Ce=!1,allowUnsafeInput:je}=Object.assign({maxCharLimit:0,type:"text",variant:"default",maxCharLimitPosition:"TOP",minCharsToTrigger:0,maxCharAlignment:!1},l),Te=null==N?void 0:N.icon,Oe=null==R?void 0:R.icon,[we,Ie]=r(!1),[ke,Be]=r(!1),[Le,Ae]=r(),He="x-small"===J?"12px":"small"===J?"18px":"22px",De=o(f),[Ee,Me]=r(""),Pe=a(null),Se=null!=A?A:Pe;s((()=>{Me(ee||""),!ee&&se&&(Se.current.style.height=ce||"48px")}),[ee]),s((()=>{var e;Se.current&&(null===(e=l.onReferenceInit)||void 0===e||e.call(l,Se.current))}),[Se]),s((()=>{const e=Se.current;if(e&&["phonenumber","zip","number"].includes(U))return e.addEventListener("wheel",Ne,{passive:!1}),()=>{e.removeEventListener("wheel",Ne)}}),[]),s((()=>{ne&&Me("")}),[ne]),s((()=>{var e;Be(!!l.isActive),l.isActive&&(null===(e=Se.current)||void 0===e||e.focus())}),[l.isActive]),s((()=>{Ae(l.errorMessage)}),[l.errorMessage]),s((()=>{var e;Ie(!1),("invalid"===l.state||Le||"disabled-invalid"===l.state)&&Ie(!0),"active"===l.state&&(null===(e=Se.current)||void 0===e||e.focus())}),[l.state,Le]),s((()=>{Ie(!!Le||"invalid"===l.state)}),[Le,l.state]);const ze=function(e){if(h(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)}},Fe=()=>"zip"===U?6:2e3,Ke=e=>{const t=0!==W?W:Fe(),n=fe,i=e.target.value;pe&&(!i.length||i.length>=n)&&pe(e),le||i.length&&!(i.length>=n)||Z(ee||"",e),oe||![8].includes(e.which)&&t>0&&i.length>=t&&e.preventDefault()},Ne=e=>{e.preventDefault()},Re=e=>{let t=e.target.value;const n=0!==W?W+1:Fe(),i=fe;if(!je&&d(U)&&(t=u(t)),!oe&&n>0&&t.length>=n&&(t=t.substring(0,n-1)),l.textControl||Me(t||""),i&&t&&t.length<i)return;Z(t,e),se&&(Se.current.style.height=`${Se.current.scrollHeight}px`,t||(Se.current.style.height=ce||"48px"));const r=$||g;if(!r||!h(r))return;const[o,a]=r(t,U,ie);Ie(!o),Ae(l.errorMessage?l.errorMessage:a)},Ge=e=>{var t;l.skipFocus||Be(!0),ze(null===(t=l.onFocus)||void 0===t?void 0:t.call(l,e))},We=e=>{var t;l.skipFocus||Be(!1),ze(null===(t=l.onBlur)||void 0===t?void 0:t.call(l,e))},_e=()=>{var i;return e(n,{children:["multiline"!==U&&t("input",{className:ue?"truncate-class":"","data-test":l["data-test"],id:l.id,style:null!==(i=null==De?void 0:De.input)&&void 0!==i?i:{},ref:Se,disabled:Ce,type:["phonenumber","zip","number"].includes(U)?"number":U,value:Ee,onFocus:e=>Ge(e),onBlur:e=>We(e),placeholder:K||"Enter here",onChange:Re,onClick:e=>ze(l.onClick),onKeyDown:e=>Ke(e)}),"multiline"===U&&t("textarea",{"data-test":l["data-test"],value:Ee,ref:Se,onFocus:e=>Ge(e),onBlur:e=>We(e),onClick:e=>ze(l.onClick),disabled:Ce,placeholder:K||"Enter here",onChange:Re,onKeyDown:e=>Ke(e),maxLength:W>0?W:void 0})]})};return e(y,Object.assign({width:l.width,height:l.height,state:V,type:U,style:null!==(H=null==De?void 0:De.RootContainer)&&void 0!==H?H:{}},{children:[e("div",Object.assign({className:"flex-align-center"},{children:[!te&&(!!q||!!Le)&&e(C,Object.assign({invalid:!!Le},{children:[!!Le&&t(x,{width:16,height:16}),Le||q]})),W>0&&"BOTTOM"===ge&&e(j,Object.assign({position:"BOTTOM"},{children:[null!==(E=null===(D=(null!=ee?ee:"").toString())||void 0===D?void 0:D.length)&&void 0!==E?E:0,"/",W]}))]})),e(T,Object.assign({variant:J,state:V,width:l.width,isActive:"active"===V||ke,isInvalid:we,style:null!==(P=null!==(M=null==De?void 0:De.InputWrapper)&&void 0!==M?M:xe)&&void 0!==P?P:{},version:re,height:l.height,hightlightInputColor:ve,hideBorder:be},{children:[!!Te&&t(O,Object.assign({variant:J,iconSize:He,onClick:()=>ze(null==N?void 0:N.callback),isLeft:!0,style:null!==(S=null==De?void 0:De.IconHolder)&&void 0!==S?S:{}},{children:t(Te,{})})),!!Y&&t(w,Object.assign({variant:J},{children:Y})),"default"===J&&t(I,Object.assign({height:l.height,type:l.type,minHeight:ce,maxHeight:he,autoGrow:se},{children:_e()})),["x-small","small"].includes(J)&&t(k,Object.assign({height:l.height,type:l.type},{children:_e()})),!!Oe&&t(O,Object.assign({variant:J,iconSize:He,onClick:()=>ze(null==R?void 0:R.callback),isLeft:!1},{children:t(Oe,{})})),!!X&&t(B,Object.assign({variant:J},{children:X})),Q&&Q.text&&t(c,{buttonText:Q.text,buttonType:Q.buttonType,onClick:()=>ze(null==Q?void 0:Q.onClick)}),Q&&Q.buttonProps&&t(c,Object.assign({},Q.buttonProps))]})),!me&&(!!G||!!W)&&e(L,Object.assign({invalid:we,maxCharAlignment:ye},{children:[ae&&ae,e("div",Object.assign({className:"label__container"},{children:[e(de?p:m,{children:[G,_?t("span",{children:"*"}):""]}),l.tooltipText&&t(v,Object.assign({body:l.tooltipText,placement:"top"},{children:t("span",{children:t(i,{style:{marginTop:-3},width:18,height:18,color:we?b.content.negative:b.content.primary})})}))]})),W>0&&"TOP"===ge&&e(j,{children:[null!==(F=null===(z=(null!=ee?ee:"").toString())||void 0===z?void 0:z.length)&&void 0!==F?F:0,"/",W]})]}))]}))}));A.displayName="Input";export{A as Input};
|
|
@@ -15,7 +15,6 @@ export interface InputProps {
|
|
|
15
15
|
icon: React.FC;
|
|
16
16
|
callback?: () => void;
|
|
17
17
|
};
|
|
18
|
-
leftIconStyle?: React.CSSProperties;
|
|
19
18
|
rightIcon?: {
|
|
20
19
|
icon: React.FC;
|
|
21
20
|
callback?: () => void;
|
|
@@ -55,7 +54,7 @@ export interface InputProps {
|
|
|
55
54
|
};
|
|
56
55
|
noKeyDownChange?: boolean;
|
|
57
56
|
skipFocus?: boolean;
|
|
58
|
-
version?: '1.0' | '2.0'
|
|
57
|
+
version?: '1.0' | '2.0';
|
|
59
58
|
textControl?: boolean;
|
|
60
59
|
noMaxCharCheck?: boolean;
|
|
61
60
|
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" |
|
|
13
|
+
version?: "1.0" | "2.0" | undefined;
|
|
14
14
|
hightlightInputColor?: string | undefined;
|
|
15
15
|
hideBorder?: boolean | undefined;
|
|
16
16
|
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
@@ -55,21 +55,6 @@ 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
|
-
}, {}, {}>;
|
|
73
58
|
export declare const InputHeader: import("@emotion/styled").StyledComponent<{
|
|
74
59
|
theme?: import("@emotion/react").Theme | undefined;
|
|
75
60
|
as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
|