@bikdotai/bik-component-library 0.0.5-beta.0 → 0.0.5-beta.2
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/assets/icons/alert.svg.js +1 -0
- package/dist/cjs/assets/icons/cross.svg.js +1 -1
- package/dist/cjs/assets/icons/question-mark.svg.js +1 -0
- package/dist/cjs/assets/icons/search.svg.js +1 -0
- package/dist/cjs/bundle.css +8 -1
- package/dist/cjs/components/TypographyStyle.js +10 -10
- package/dist/cjs/components/checkBox/CheckBox.js +1 -1
- package/dist/cjs/components/dropdown/Common.styled.d.ts +2 -0
- package/dist/cjs/components/dropdown/Dropdown.d.ts +8 -0
- package/dist/cjs/components/dropdown/UnChildDropdown/UnChildDropdown.d.ts +10 -0
- package/dist/cjs/components/dropdown/index.d.ts +1 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/OpennedDropdown.d.ts +3 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/OpennedDropdown.js +1 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/OpennedDropdown.styled.d.ts +5 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/OpennedDropdown.styled.js +24 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/description/Description.d.ts +6 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/description/Description.js +1 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/description/Description.styled.d.ts +1 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/description/Description.styled.js +5 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/menu/FreeFormMenu.d.ts +6 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/menu/FreeFormMenu.js +1 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/menu/FreeFormMenu.styled.d.ts +1 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/menu/FreeFormMenu.styled.js +6 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/menu/MenuItem.d.ts +8 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/menu/MenuItem.js +1 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/menu/MenuList.d.ts +8 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/menu/MenuList.js +1 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/menu/MenuList.styled.d.ts +1 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/menu/MenuList.styled.js +6 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/menu/SelectAllMenu.d.ts +7 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/menu/SelectAllMenu.js +1 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.d.ts +8 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.js +1 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.d.ts +1 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js +8 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/searchbox/SearchBox.d.ts +4 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/searchbox/SearchBox.js +1 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/searchbox/ZeroState.d.ts +4 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/searchbox/ZeroState.js +1 -0
- package/dist/cjs/components/dropdown/opennedDropdown/index.d.ts +1 -0
- package/dist/cjs/components/dropdown/opennedDropdown/utils/iterationOnOptions.d.ts +31 -0
- package/dist/cjs/components/dropdown/opennedDropdown/utils/iterationOnOptions.js +1 -0
- package/dist/cjs/components/dropdown/type.d.ts +26 -0
- package/dist/cjs/components/fab-menu/FABMenu.d.ts +20 -0
- package/dist/cjs/components/fab-menu/FABMenu.js +1 -0
- package/dist/cjs/components/fab-menu/index.d.ts +1 -0
- package/dist/cjs/components/floating-action-button/FloatingActionButton.d.ts +18 -0
- package/dist/cjs/components/floating-action-button/FloatingActionButton.js +1 -0
- package/dist/cjs/components/floating-action-button/FloatingActionButton.styles.d.ts +34 -0
- package/dist/cjs/components/floating-action-button/FloatingActionButton.styles.js +87 -0
- package/dist/cjs/components/floating-action-button/index.d.ts +2 -0
- package/dist/cjs/components/input/Input.d.ts +1 -0
- package/dist/cjs/components/input/Input.js +1 -0
- package/dist/cjs/components/input/Input.styled.js +1 -0
- package/dist/cjs/components/input/context/InputStyleProvider.d.ts +7 -0
- package/dist/cjs/components/input/context/InputStyleProvider.js +1 -0
- package/dist/cjs/components/list-item/ListItem.js +1 -1
- package/dist/cjs/components/list-item/ListItem.styled.js +1 -1
- package/dist/cjs/components/stepper/WorkingStepper.d.ts +1 -0
- package/dist/cjs/components/tooltips/CustomisedTooltip.d.ts +25 -0
- package/dist/cjs/components/tooltips/CustomisedTooltip.js +1 -0
- package/dist/cjs/components/tooltips/index.d.ts +1 -0
- package/dist/cjs/components/zeroState/ZeroState.d.ts +7 -0
- package/dist/cjs/components/zeroState/ZeroState.js +17 -0
- package/dist/cjs/hooks/useOutside.d.ts +1 -0
- package/dist/cjs/hooks/useOutside.js +1 -0
- package/dist/cjs/index.d.ts +2 -0
- package/dist/cjs/index.js +1 -1
- package/dist/esm/assets/icons/alert.svg.js +1 -0
- package/dist/esm/assets/icons/cross.svg.js +1 -1
- package/dist/esm/assets/icons/question-mark.svg.js +1 -0
- package/dist/esm/assets/icons/search.svg.js +1 -0
- package/dist/esm/bundle.css +8 -1
- package/dist/esm/components/TypographyStyle.js +10 -10
- package/dist/esm/components/checkBox/CheckBox.js +1 -1
- package/dist/esm/components/dropdown/Common.styled.d.ts +2 -0
- package/dist/esm/components/dropdown/Dropdown.d.ts +8 -0
- package/dist/esm/components/dropdown/UnChildDropdown/UnChildDropdown.d.ts +10 -0
- package/dist/esm/components/dropdown/index.d.ts +1 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/OpennedDropdown.d.ts +3 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/OpennedDropdown.js +1 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/OpennedDropdown.styled.d.ts +5 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/OpennedDropdown.styled.js +24 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/description/Description.d.ts +6 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/description/Description.js +1 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/description/Description.styled.d.ts +1 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/description/Description.styled.js +5 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/menu/FreeFormMenu.d.ts +6 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/menu/FreeFormMenu.js +1 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/menu/FreeFormMenu.styled.d.ts +1 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/menu/FreeFormMenu.styled.js +6 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/menu/MenuItem.d.ts +8 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/menu/MenuItem.js +1 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/menu/MenuList.d.ts +8 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/menu/MenuList.js +1 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/menu/MenuList.styled.d.ts +1 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/menu/MenuList.styled.js +6 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/menu/SelectAllMenu.d.ts +7 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/menu/SelectAllMenu.js +1 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.d.ts +8 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.js +1 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.d.ts +1 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js +8 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/searchbox/SearchBox.d.ts +4 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/searchbox/SearchBox.js +1 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/searchbox/ZeroState.d.ts +4 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/searchbox/ZeroState.js +1 -0
- package/dist/esm/components/dropdown/opennedDropdown/index.d.ts +1 -0
- package/dist/esm/components/dropdown/opennedDropdown/utils/iterationOnOptions.d.ts +31 -0
- package/dist/esm/components/dropdown/opennedDropdown/utils/iterationOnOptions.js +1 -0
- package/dist/esm/components/dropdown/type.d.ts +26 -0
- package/dist/esm/components/fab-menu/FABMenu.d.ts +20 -0
- package/dist/esm/components/fab-menu/FABMenu.js +1 -0
- package/dist/esm/components/fab-menu/index.d.ts +1 -0
- package/dist/esm/components/floating-action-button/FloatingActionButton.d.ts +18 -0
- package/dist/esm/components/floating-action-button/FloatingActionButton.js +1 -0
- package/dist/esm/components/floating-action-button/FloatingActionButton.styles.d.ts +34 -0
- package/dist/esm/components/floating-action-button/FloatingActionButton.styles.js +87 -0
- package/dist/esm/components/floating-action-button/index.d.ts +2 -0
- package/dist/esm/components/input/Input.d.ts +1 -0
- package/dist/esm/components/input/Input.js +1 -0
- package/dist/esm/components/input/Input.styled.js +1 -0
- package/dist/esm/components/input/context/InputStyleProvider.d.ts +7 -0
- package/dist/esm/components/input/context/InputStyleProvider.js +1 -0
- package/dist/esm/components/list-item/ListItem.js +1 -1
- package/dist/esm/components/list-item/ListItem.styled.js +1 -1
- package/dist/esm/components/stepper/WorkingStepper.d.ts +1 -0
- package/dist/esm/components/tooltips/CustomisedTooltip.d.ts +25 -0
- package/dist/esm/components/tooltips/CustomisedTooltip.js +1 -0
- package/dist/esm/components/tooltips/index.d.ts +1 -0
- package/dist/esm/components/zeroState/ZeroState.d.ts +7 -0
- package/dist/esm/components/zeroState/ZeroState.js +17 -0
- package/dist/esm/hooks/useOutside.d.ts +1 -0
- package/dist/esm/hooks/useOutside.js +1 -0
- package/dist/esm/index.d.ts +2 -0
- package/dist/esm/index.js +1 -1
- package/package.json +6 -2
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import o from"styled-components";import{COLORS as e}from"../../../../constants/Theme.js";const r=o.div`
|
|
2
|
+
border-radius: 4px;
|
|
3
|
+
border: 1px solid ${e.stroke.primary};
|
|
4
|
+
max-height: 640px;
|
|
5
|
+
overflow: hidden;
|
|
6
|
+
display: flex;
|
|
7
|
+
flex-direction: row;
|
|
8
|
+
position: relative;
|
|
9
|
+
`;o.div`
|
|
10
|
+
padding: 14px 16px 14px 18px;
|
|
11
|
+
flex-direction: row;
|
|
12
|
+
align-items: center;
|
|
13
|
+
border-bottom-width: 1px;
|
|
14
|
+
border-bottom-style: solid;
|
|
15
|
+
border-bottom-color: ${e.stroke.primary};
|
|
16
|
+
width: 100%;
|
|
17
|
+
heigth: 100%;
|
|
18
|
+
`;const t=o.div`
|
|
19
|
+
max-height: ${o=>o.maxHeight}px;
|
|
20
|
+
overflow-y: auto;
|
|
21
|
+
flex: 1;
|
|
22
|
+
display: flex;
|
|
23
|
+
flex-direction: column;
|
|
24
|
+
`;export{t as MenuListContainer,r as OpennedDropdownContainer};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{jsx as t,jsxs as e}from"react/jsx-runtime";import{TitleRegular as r,BodySecondary as i}from"../../../../TypographyStyle.js";import{COLORS as o}from"../../../../../constants/Theme.js";import{DescriptionContainer as n}from"./Description.styled.js";const s=s=>{let{title:c,description:l,visible:m}=s;return t(n,{children:e("div",Object.assign({style:{padding:24}},{children:[t(r,Object.assign({style:{color:o.content.primary,marginBottom:4}},{children:c})),t(i,Object.assign({style:{color:o.content.secondary}},{children:l}))]}))})};export{s as Description};
|
package/dist/esm/components/dropdown/opennedDropdown/components/description/Description.styled.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const DescriptionContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{jsx as e,Fragment as t}from"react/jsx-runtime";import{useState as o}from"react";import r from"styled-components";import{CheckBox as n}from"../../../../checkBox/CheckBox.js";import{ListItem as i}from"../../../../list-item/ListItem.js";import{BodyCaption as m}from"../../../../TypographyStyle.js";import{COLORS as c}from"../../../../../constants/Theme.js";import{FreeFormContainer as s}from"./FreeFormMenu.styled.js";const l=r(i)``,a=r=>{let{searchedString:i,onSelect:a,isMultiSelect:p}=r;const[f,h]=o(!1);function d(){h(!f),a(!f)}return e(l,{onClick:e=>{e.preventDefault(),d()},listItem:{label:i,value:i},trailingIcon:p?e(n,{isChecked:f,onValueChange:d}):e(t,{}),leadingIcon:e(s,{children:e(m,Object.assign({style:{color:c.content.secondary}},{children:"Freeform"}))})})};export{a as FreeFormMenu};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const FreeFormContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { MultiSelectOption, SingleOption } from '../../../type';
|
|
3
|
+
export declare const MenuItem: React.FC<{
|
|
4
|
+
option: SingleOption | MultiSelectOption;
|
|
5
|
+
isMultiSelect?: boolean;
|
|
6
|
+
showDescription: (title?: string, description?: string) => void;
|
|
7
|
+
onSelect: (option: SingleOption) => void;
|
|
8
|
+
}>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{jsx as e,Fragment as t}from"react/jsx-runtime";import o from"styled-components";import{CheckBox as i}from"../../../../checkBox/CheckBox.js";import{ListItem as s}from"../../../../list-item/ListItem.js";import{BodyCaption as r}from"../../../../TypographyStyle.js";import{COLORS as n}from"../../../../../constants/Theme.js";import{FreeFormContainer as c}from"./FreeFormMenu.styled.js";const l=o(s)``,m=o=>{let{option:s,isMultiSelect:m,showDescription:a,onSelect:d}=o;var p;function f(e){s.disabled||d(Object.assign(Object.assign({},s),{selected:e}))}return e(l,{onClick:e=>{e.preventDefault(),f(!s.selected)},onMouseOver:function(){s.descriptions?a(s.label,s.descriptions):a()},listItem:s,trailingIcon:m?e(i,{isDisabled:null!==(p=s.disabled)&&void 0!==p&&p,isChecked:s.selected,onValueChange:f}):e(t,{}),leadingIcon:s.isFreeForm?e(c,{children:e(r,Object.assign({style:{color:n.content.secondary}},{children:"Freeform"}))}):e(t,{}),variant:s.disabled?"inactive":"default"})};export{m as MenuItem};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { DropdownOption, SingleOption } from '../../../type';
|
|
3
|
+
export declare const MenuList: React.FC<{
|
|
4
|
+
options: DropdownOption[];
|
|
5
|
+
isMultiSelect?: boolean;
|
|
6
|
+
showDescription: (title?: string, description?: string) => void;
|
|
7
|
+
onSelect: (optionSelect: SingleOption) => void;
|
|
8
|
+
}>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{jsx as t,Fragment as e,jsxs as o}from"react/jsx-runtime";import{MenuItem as i}from"./MenuItem.js";import{StyledGroupedLabel as n}from"./MenuList.styled.js";const r=r=>{let{options:s,isMultiSelect:l,showDescription:c,onSelect:p}=r;return t(e,{children:s.map(((e,r)=>{if(e.options){const s=e;return o("div",{children:[t(n,{children:s.label}),s.options.map(((e,o)=>t(i,{onSelect:p,showDescription:c,isMultiSelect:l,option:e},o)))]},r)}return t(i,{onSelect:p,showDescription:c,isMultiSelect:l,option:e},r)}))})};export{r as MenuList};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const StyledGroupedLabel: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import o from"styled-components";import{BodyCaption as r}from"../../../../TypographyStyle.js";import{COLORS as t}from"../../../../../constants/Theme.js";const n=o(r)`
|
|
2
|
+
padding: 8px 16px;
|
|
3
|
+
height: 16px;
|
|
4
|
+
color: ${t.content.secondary};
|
|
5
|
+
background-color: ${t.background.base};
|
|
6
|
+
`;export{n as StyledGroupedLabel};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { DropdownOption } from '../../../type';
|
|
3
|
+
export type SelectAllCheckboxState = 'notSelected' | 'selectAll' | 'partiallySelected';
|
|
4
|
+
export declare const SelectAllMenu: React.FC<{
|
|
5
|
+
options: DropdownOption[];
|
|
6
|
+
onSelect: (newState: SelectAllCheckboxState) => void;
|
|
7
|
+
}>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{jsx as e}from"react/jsx-runtime";import{useState as l,useEffect as t}from"react";import n from"styled-components";import{CheckBox as i}from"../../../../checkBox/CheckBox.js";import{ListItem as r}from"../../../../list-item/ListItem.js";const o=n(r)``,a=n=>{let{options:r,onSelect:a}=n;const[c,s]=l("notSelected");function d(){"partiallySelected"===c&&a("notSelected"),"selectAll"===c&&a("notSelected"),"notSelected"===c&&a("selectAll")}return t((()=>{var e;if("all"===(r[0].options?!0===(null===(e=r[0].options)||void 0===e?void 0:e[0].selected)?"all":"none":!0===r[0].selected?"all":"none")){const e=r.filter((e=>!e.disabled)).reduce(((e,l)=>{if("all"===e){if(!l.options)return l.selected?"all":"partial";{const e=l.options.filter((e=>!e.disabled)),t=e.filter((e=>!0===e.selected));if(t.length===e.length)return"all";if(t.length<e.length)return"partial"}}return e}),"all");"all"===e&&s("selectAll"),"partial"===e&&s("partiallySelected")}else{const e=r.filter((e=>!e.disabled)).reduce(((e,l)=>{if("none"===e){if(!l.options)return l.selected?"partial":"none";{const e=l.options.filter((e=>!e.disabled)),t=e.filter((e=>!e.selected));if(t.length===e.length)return"none";if(t.length<e.length)return"partial"}}return e}),"none");"none"===e&&s("notSelected"),"partial"===e&&s("partiallySelected")}}),[r]),e(o,{onClick:e=>{e.preventDefault(),d()},listItem:{label:"Select All",value:"All"},trailingIcon:e(i,{isChecked:"selectAll"===c||"partiallySelected"===c,isPartiallyChecked:"partiallySelected"===c,onValueChange:d}),variant:"default"})};export{a as SelectAllMenu};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{jsxs as t,jsx as e}from"react/jsx-runtime";import{Button as o}from"../../../../button/Button.js";import{BodySecondary as r}from"../../../../TypographyStyle.js";import{COLORS as l}from"../../../../../constants/Theme.js";import{BottomBarContainer as n}from"./MultiSelectDropdownBottomBar.styled.js";const s=s=>{let{onApply:i,onClear:c,list:p}=s;const a=p.reduce(((t,e)=>{if(e.options){return t+e.options.filter((t=>!0===t.selected)).length}return e.selected?t+1:t}),0);return t(n,Object.assign({style:{justifyContent:"space-between"}},{children:[e(r,Object.assign({style:{flex:1,color:l.content.primary}},{children:a?`${a} selected`:""})),t("div",Object.assign({style:{flexDirection:"row",display:"flex",gap:12}},{children:[e(o,{size:"small",buttonType:"tertiaryGray",buttonText:"Clear",onClick:c}),e(o,{size:"small",buttonText:"Apply",onClick:i})]}))]}))};export{s as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const BottomBarContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{jsx as r,Fragment as o}from"react/jsx-runtime";import{useRef as t}from"react";import{Input as e}from"../../../../input/Input.js";import{InputStyleContext as n}from"../../../../input/context/InputStyleProvider.js";import{COLORS as i}from"../../../../../constants/Theme.js";import c from"../../../../../assets/icons/cross.svg.js";import s from"../../../../../assets/icons/search.svg.js";const a=a=>{let{onSearch:l}=a;const p=t();return r(n.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:"1px solid "+i.stroke.primary,padding:"12px 16px"},IconHolder:{marginLeft:0},input:{marginLeft:4,minHeight:"100%"}}},{children:r(e,{ref:p,variant:"small",placeholder:"Search",leftIcon:{icon:()=>r(s,{width:24,height:24,color:i.content.placeholder})},rightIcon:{icon:()=>{var t;return(null===(t=null==p?void 0:p.current)||void 0===t?void 0:t.value)?r(c,{onClick:()=>{p.current.value="",l("")},width:24,height:24,color:i.content.placeholder}):r(o,{})}},onChangeText:l})}))};export{a as SearchBox};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{jsx as t}from"react/jsx-runtime";import{ZeroState as r}from"../../../../zeroState/ZeroState.js";const e=e=>{let{searchedString:o}=e;return t(r,{title:"No results found",subTitle:`\tSorry we could not find any results for "${null!=o?o:""}"`})};export{e as SearchZeroState};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './components/OpennedDropdown';
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { DropdownOption, SingleOption } from '../../type';
|
|
2
|
+
export declare function iterateOnOptions(options: DropdownOption[], newVal: SingleOption, checkCB?: (optionForValidation: SingleOption) => boolean): ({
|
|
3
|
+
options: {
|
|
4
|
+
label?: string | undefined;
|
|
5
|
+
value?: string | undefined;
|
|
6
|
+
descriptions?: string | undefined;
|
|
7
|
+
selected?: boolean | undefined;
|
|
8
|
+
disabled?: boolean | undefined;
|
|
9
|
+
isFreeForm?: boolean | undefined;
|
|
10
|
+
}[];
|
|
11
|
+
label?: string | undefined;
|
|
12
|
+
value?: string | undefined;
|
|
13
|
+
descriptions?: string | undefined;
|
|
14
|
+
selected?: boolean | undefined;
|
|
15
|
+
disabled?: boolean | undefined;
|
|
16
|
+
isFreeForm?: boolean | undefined;
|
|
17
|
+
} | {
|
|
18
|
+
label?: string | undefined;
|
|
19
|
+
value?: string | undefined;
|
|
20
|
+
descriptions?: string | undefined;
|
|
21
|
+
selected?: boolean | undefined;
|
|
22
|
+
disabled?: boolean | undefined;
|
|
23
|
+
isFreeForm?: boolean | undefined;
|
|
24
|
+
} | {
|
|
25
|
+
label?: string | undefined;
|
|
26
|
+
value?: string | undefined;
|
|
27
|
+
descriptions?: string | undefined;
|
|
28
|
+
selected?: boolean | undefined;
|
|
29
|
+
disabled?: boolean | undefined;
|
|
30
|
+
options: (SingleOption | import("../../type").MultiSelectOption)[];
|
|
31
|
+
})[];
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
function s(s,n,t){return s.map((s=>{if(s.options){const i=s.options.map((s=>!t||t(s)?Object.assign(Object.assign({},s),n):Object.assign({},s)));return Object.assign(Object.assign({},s),{options:[...i]})}return!t||t(s)?Object.assign(Object.assign({},s),n):Object.assign({},s)}))}export{s as iterateOnOptions};
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
export interface OpenDropdownProps {
|
|
2
|
+
options: DropdownOption[];
|
|
3
|
+
isSearchable?: boolean;
|
|
4
|
+
error?: string;
|
|
5
|
+
isMultiSelect?: boolean;
|
|
6
|
+
width?: number | string;
|
|
7
|
+
height?: number | string;
|
|
8
|
+
allowFreeForm?: boolean;
|
|
9
|
+
onClose?: () => void;
|
|
10
|
+
onSelect?: (option: SingleOption | SingleOption[]) => void;
|
|
11
|
+
}
|
|
12
|
+
export type GroupedOption = {
|
|
13
|
+
label?: string;
|
|
14
|
+
options: (SingleOption | MultiSelectOption)[];
|
|
15
|
+
};
|
|
16
|
+
export type SingleOption = {
|
|
17
|
+
label?: string;
|
|
18
|
+
value?: string;
|
|
19
|
+
descriptions?: string;
|
|
20
|
+
selected?: boolean;
|
|
21
|
+
disabled?: boolean;
|
|
22
|
+
};
|
|
23
|
+
export type MultiSelectOption = SingleOption & {
|
|
24
|
+
isFreeForm?: boolean;
|
|
25
|
+
};
|
|
26
|
+
export type DropdownOption = MultiSelectOption | SingleOption | GroupedOption;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { DropdownOption, SingleOption } from '../dropdown/type';
|
|
3
|
+
import { FAB_POSITION } from '../floating-action-button/FloatingActionButton.styles';
|
|
4
|
+
import { TooltipPlacement } from '../tooltips';
|
|
5
|
+
export declare const FABMenu: React.FC<{
|
|
6
|
+
onSelect: (selected: SingleOption | SingleOption[]) => void;
|
|
7
|
+
menuOptions: DropdownOption[];
|
|
8
|
+
buttonWidth?: number;
|
|
9
|
+
buttonHeight?: number;
|
|
10
|
+
buttonColor?: string;
|
|
11
|
+
buttonPosition?: FAB_POSITION;
|
|
12
|
+
menuWidth?: number;
|
|
13
|
+
menuHeight?: number;
|
|
14
|
+
buttonIcon?: JSX.Element;
|
|
15
|
+
buttonPaddingHorizontal?: number;
|
|
16
|
+
buttonPaddingVertical?: number;
|
|
17
|
+
tooltipPlacement?: TooltipPlacement;
|
|
18
|
+
tooltipText?: string;
|
|
19
|
+
zIndex?: number;
|
|
20
|
+
}>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{jsx as t}from"react/jsx-runtime";import{OpennedDropdown as o}from"../dropdown/opennedDropdown/components/OpennedDropdown.js";import{FloatingActionButton as n}from"../floating-action-button/FloatingActionButton.js";import"../floating-action-button/FloatingActionButton.styles.js";const i=i=>{const{onSelect:e,menuOptions:d,buttonWidth:r,buttonHeight:l,buttonColor:c,buttonPosition:a,menuWidth:p,menuHeight:u,buttonIcon:s,buttonPaddingHorizontal:m,buttonPaddingVertical:g,tooltipPlacement:b,tooltipText:h,zIndex:P}=i;return t("div",{children:t(n,Object.assign({icon:s,width:r,height:l,color:c,position:a,buttonPaddingHorizontal:m,buttonPaddingVertical:g,tooltipPlacement:b,tooltipText:h,zIndex:P},{children:t(o,{options:d,height:u||90,width:p,onSelect:e})}))})};export{i as FABMenu};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './FABMenu';
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import 'bootstrap/dist/css/bootstrap.min.css';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { TooltipPlacement } from '../tooltips/CustomisedTooltip';
|
|
4
|
+
import { FAB_POSITION } from './FloatingActionButton.styles';
|
|
5
|
+
export declare const FloatingActionButton: React.FC<{
|
|
6
|
+
onClick?: () => void;
|
|
7
|
+
children?: React.ReactNode;
|
|
8
|
+
width?: number;
|
|
9
|
+
height?: number;
|
|
10
|
+
icon?: JSX.Element;
|
|
11
|
+
color?: string;
|
|
12
|
+
position?: FAB_POSITION;
|
|
13
|
+
buttonPaddingHorizontal?: number;
|
|
14
|
+
buttonPaddingVertical?: number;
|
|
15
|
+
tooltipText?: string;
|
|
16
|
+
tooltipPlacement?: TooltipPlacement;
|
|
17
|
+
zIndex?: number;
|
|
18
|
+
}>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{jsx as t,Fragment as o,jsxs as i}from"react/jsx-runtime";import{Dropdown as n}from"react-bootstrap";import{COLORS as e}from"../../constants/Theme.js";import{TooltipPlacement as l,CustomisedTooltip as r}from"../tooltips/CustomisedTooltip.js";import c from"../../assets/icons/question-mark.svg.js";import{FAB_POSITION as h,FloatingActionButtonOuterContainer as d,StyledDropdown as s,DropdownToggleContainer as a,FloatingActionButtonContainer as p}from"./FloatingActionButton.styles.js";const g=i=>{const{width:n,height:e,color:l,onClick:h,icon:d,tooltipPlacement:s,tooltipText:a}=i;return a?t(r,{tooltipContent:t(o,{children:a}),tooltipTriggerContent:t(p,Object.assign({width:n,height:e,color:l,onClick:h},{children:d||t(c,{width:22,height:22})})),tooltipPlacement:s,showOnHover:!0}):t(o,{children:t(p,Object.assign({width:n,height:e,color:l,onClick:h},{children:d||t(c,{width:22,height:22})}))})},m=r=>{const{icon:c,onClick:p,children:m,tooltipText:u}=r,P=r.width?r.width:48,b=r.height?r.height:48,w=r.color?r.color:e.background.inverse,x=r.position?r.position:h.TOP_LEFT,C=r.buttonPaddingHorizontal?r.buttonPaddingHorizontal:20,T=r.buttonPaddingVertical?r.buttonPaddingVertical:20,j=r.zIndex?r.zIndex:1,k=r.tooltipPlacement?r.tooltipPlacement:l.Auto;return t(o,{children:t(d,Object.assign({width:P,height:b,color:w,position:x,buttonPaddingHorizontal:C,buttonPaddingVertical:T,zIndex:j},{children:t(s,{children:m?i(o,{children:[t(a,{children:t(g,{width:P,height:b,color:w,tooltipPlacement:k,onClick:p,tooltipText:u,icon:c,position:x})}),t(n.Menu,{children:m})]}):t(g,{width:P,height:b,color:w,tooltipPlacement:k,onClick:p,tooltipText:u,icon:c,position:x})})}))})};export{m as FloatingActionButton};
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare enum FAB_POSITION {
|
|
3
|
+
TOP_LEFT = "top left",
|
|
4
|
+
TOP_RIGHT = "top right",
|
|
5
|
+
BOTTOM_LEFT = "bottom left",
|
|
6
|
+
BOTTOM_RIGHT = "botton right"
|
|
7
|
+
}
|
|
8
|
+
export declare const FloatingActionButtonContainer: import("styled-components").StyledComponent<"div", any, {
|
|
9
|
+
width: number;
|
|
10
|
+
height: number;
|
|
11
|
+
color: string;
|
|
12
|
+
}, never>;
|
|
13
|
+
export declare const FloatingActionButtonOuterContainer: import("styled-components").StyledComponent<"div", any, {
|
|
14
|
+
width: number;
|
|
15
|
+
height: number;
|
|
16
|
+
color: string;
|
|
17
|
+
position: FAB_POSITION;
|
|
18
|
+
buttonPaddingHorizontal: number;
|
|
19
|
+
buttonPaddingVertical: number;
|
|
20
|
+
zIndex: number;
|
|
21
|
+
}, never>;
|
|
22
|
+
export declare const StyledDropdown: import("styled-components").StyledComponent<import("react-bootstrap/esm/helpers").BsPrefixRefForwardingComponent<"div", import("react-bootstrap").DropdownProps> & {
|
|
23
|
+
Toggle: import("react-bootstrap/esm/helpers").BsPrefixRefForwardingComponent<"button", import("react-bootstrap/esm/DropdownToggle").DropdownToggleProps>;
|
|
24
|
+
Menu: import("react-bootstrap/esm/helpers").BsPrefixRefForwardingComponent<"div", import("react-bootstrap/esm/DropdownMenu").DropdownMenuProps>;
|
|
25
|
+
Item: import("react-bootstrap/esm/helpers").BsPrefixRefForwardingComponent<import("@restart/ui/esm/types").DynamicRefForwardingComponent<import("react").ForwardRefExoticComponent<import("@restart/ui/esm/Button").ButtonProps & import("react").RefAttributes<HTMLElement>>, import("@restart/ui/esm/DropdownItem").DropdownItemProps>, import("react-bootstrap/esm/DropdownItem").DropdownItemProps>;
|
|
26
|
+
ItemText: import("react-bootstrap/esm/helpers").BsPrefixRefForwardingComponent<"span", unknown>;
|
|
27
|
+
Divider: import("react-bootstrap/esm/helpers").BsPrefixRefForwardingComponent<"hr", unknown>;
|
|
28
|
+
Header: import("react-bootstrap/esm/helpers").BsPrefixRefForwardingComponent<"div", unknown>;
|
|
29
|
+
}, any, {
|
|
30
|
+
active?: string | undefined;
|
|
31
|
+
width?: string | undefined;
|
|
32
|
+
height?: string | undefined;
|
|
33
|
+
}, never>;
|
|
34
|
+
export declare const DropdownToggleContainer: import("styled-components").StyledComponent<import("react-bootstrap/esm/helpers").BsPrefixRefForwardingComponent<"button", import("react-bootstrap/esm/DropdownToggle").DropdownToggleProps>, any, {}, never>;
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
import{Dropdown as t}from"react-bootstrap";import o from"styled-components";import{COLORS as i}from"../../constants/Theme.js";var e;!function(t){t.TOP_LEFT="top left",t.TOP_RIGHT="top right",t.BOTTOM_LEFT="bottom left",t.BOTTOM_RIGHT="botton right"}(e||(e={}));const r=o.div`
|
|
2
|
+
width: ${t=>t.width}px;
|
|
3
|
+
height: ${t=>t.height}px;
|
|
4
|
+
background: ${t=>t.color};
|
|
5
|
+
border-radius: 50%;
|
|
6
|
+
justify-content: center;
|
|
7
|
+
align-items: center;
|
|
8
|
+
cursor: pointer;
|
|
9
|
+
display: flex;
|
|
10
|
+
`,n=o.div`
|
|
11
|
+
display: flex;
|
|
12
|
+
border-radius: 50%;
|
|
13
|
+
flex-direction: column;
|
|
14
|
+
align-items: flex-end;
|
|
15
|
+
position: fixed;
|
|
16
|
+
width: ${t=>t.width}px;
|
|
17
|
+
height: ${t=>t.height}px;
|
|
18
|
+
z-index: ${t=>t.zIndex};
|
|
19
|
+
${t=>t.position===e.BOTTOM_RIGHT?`right: ${t.buttonPaddingHorizontal}px; bottom: ${t.buttonPaddingVertical}px`:t.position===e.BOTTOM_LEFT?`left: ${t.buttonPaddingHorizontal}px; bottom: ${t.buttonPaddingVertical}px`:t.position===e.TOP_LEFT?`left: ${t.buttonPaddingHorizontal}px; top: ${t.buttonPaddingVertical}px`:t.position===e.TOP_RIGHT?`right: ${t.buttonPaddingHorizontal}px; top: ${t.buttonPaddingVertical}px`:""};
|
|
20
|
+
`,d=o(t)`
|
|
21
|
+
.filter-container {
|
|
22
|
+
.single-row {
|
|
23
|
+
display: flex;
|
|
24
|
+
flex-direction: row;
|
|
25
|
+
align-items: center;
|
|
26
|
+
justify-content: flex-start;
|
|
27
|
+
gap: 8px;
|
|
28
|
+
padding: 14px;
|
|
29
|
+
border-bottom: 1px solid ${i.stroke.primary};
|
|
30
|
+
|
|
31
|
+
:last-child {
|
|
32
|
+
border-bottom: none !important;
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
button {
|
|
37
|
+
border: 1px solid
|
|
38
|
+
${t=>"true"===t.active?i.stroke.positive.lightAlt:i.stroke.primary};
|
|
39
|
+
border-radius: 4px;
|
|
40
|
+
display: flex;
|
|
41
|
+
flex-direction: row;
|
|
42
|
+
align-items: center;
|
|
43
|
+
justify-content: space-between;
|
|
44
|
+
padding: 6px 8px;
|
|
45
|
+
background: ${t=>"true"===t.active?i.background.positive.light:i.surface.standard};
|
|
46
|
+
color: ${t=>"true"===t.active?i.content.positive:i.content.primary};
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
.btn-primary:hover,
|
|
50
|
+
.btn-primary:active,
|
|
51
|
+
.btn-primary:focus,
|
|
52
|
+
.btn-primary.dropdown-toggle,
|
|
53
|
+
.show > .btn-primary.dropdown-toggle {
|
|
54
|
+
color: ${t=>"true"===t.active?i.content.positive:i.content.primary};
|
|
55
|
+
background-color: ${t=>"true"===t.active?i.background.positive.light:"transparent"};
|
|
56
|
+
border: none;
|
|
57
|
+
}
|
|
58
|
+
.btn:focus {
|
|
59
|
+
outline: 0;
|
|
60
|
+
box-shadow: 0 0 0 0.25rem transparent !important;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
.dropdown-toggle::after {
|
|
64
|
+
border-top: 0.3em solid ${i.content.primary};
|
|
65
|
+
display: none;
|
|
66
|
+
}
|
|
67
|
+
.dropdown-menu {
|
|
68
|
+
min-width: 12rem;
|
|
69
|
+
padding: 0 0;
|
|
70
|
+
}
|
|
71
|
+
.dropdown-item:active,
|
|
72
|
+
.dropdown-item:hover {
|
|
73
|
+
color: ${i.content.positive};
|
|
74
|
+
text-decoration: none;
|
|
75
|
+
background-color: ${i.background.positive.light};
|
|
76
|
+
}
|
|
77
|
+
`,a=o(t.Toggle)`
|
|
78
|
+
border-radius: 4px;
|
|
79
|
+
display: flex;
|
|
80
|
+
flex-direction: row;
|
|
81
|
+
align-items: center;
|
|
82
|
+
justify-content: space-between;
|
|
83
|
+
padding: 6px 8px;
|
|
84
|
+
font-weight: 400;
|
|
85
|
+
font-size: 14px;
|
|
86
|
+
line-height: 20px;
|
|
87
|
+
`;export{a as DropdownToggleContainer,e as FAB_POSITION,r as FloatingActionButtonContainer,n as FloatingActionButtonOuterContainer,d as StyledDropdown};
|
|
@@ -26,6 +26,7 @@ export interface InputProps {
|
|
|
26
26
|
validate: function takes the input and returns boolean + string (error message in case of invalid input)
|
|
27
27
|
**/
|
|
28
28
|
validate: (input?: string | number) => [boolean, string];
|
|
29
|
+
onChangeText: (input: string) => void;
|
|
29
30
|
button?: {
|
|
30
31
|
text: string;
|
|
31
32
|
onClick?: () => void;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{jsxs as e,jsx as t,Fragment as n}from"react/jsx-runtime";import{forwardRef as i,useState as l,useContext as r,useEffect as a}from"react";import{Button as o}from"../button/Button.js";import{BodySecondary as s}from"../TypographyStyle.js";import c from"../../assets/icons/errorInfo.svg.js";import{InputStyleContext as d}from"./context/InputStyleProvider.js";import{RootContainer as u,InputFooter as h,InputWrapper as v,IconHolder as p,PrefixHolder as f,InputContainer as g,InputContainerSmall as m,SuffixHolder as x,InputHeader as y,MaxCharStyle as b}from"./Input.styled.js";const j=e=>e&&"function"==typeof e,C=i(((i,C)=>{var I,O,w;const{placeholder:T,leftIcon:k,rightIcon:L,labelText:S,maxCharLimit:B,isRequired:D,hintText:z,type:A,state:E,validate:F,variant:K,button:M,suffixText:R,prefixText:q,onChangeText:H,value:N}=Object.assign({maxCharLimit:0,type:"text",variant:"default"},i),P=null==k?void 0:k.icon,W=null==L?void 0:L.icon,[G,J]=l(""),[Q,U]=l(!1),[V,X]=l(!1),[Y,Z]=l(),$="small"===K?"18px":"22px",_=r(d);a((()=>{Z(i.errorMessage)}),[i.errorMessage]),a((()=>{U(!1),("invalid"===i.state||Y)&&U(!0)}),[i.state,Y]),a((()=>{U(!!Y)}),[Y]),a((()=>{if(H(G),!j(F))return;const[e,t]=F(G);U(!e),Z(t)}),[G]);const ee=function(e){if(j(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)}},te=e=>{![8].includes(e.which)&&B>0&&e.target.value.length===B&&e.preventDefault()},ne=e=>{J(e.target.value)},ie=()=>{var i;return e(n,{children:["multiline"!==A&&t("input",{style:null!==(i=null==_?void 0:_.input)&&void 0!==i?i:{},ref:C,type:A,value:N,onFocus:()=>X(!0),onBlur:()=>X(!1),placeholder:T||"Enter here",onChange:ne,onKeyDown:e=>te(e)}),"multiline"===A&&t("textarea",{value:N,ref:C,onFocus:()=>X(!0),onBlur:()=>X(!1),placeholder:T||"Enter here",onChange:ne,onKeyDown:e=>te(e)})]})};return e(u,Object.assign({width:i.width,height:i.height,state:E,type:A,style:null!==(I=null==_?void 0:_.RootContainer)&&void 0!==I?I:{}},{children:[(!!z||!!Y)&&e(h,Object.assign({invalid:!!Y},{children:[!!Y&&t(c,{}),Y||z]})),e(v,Object.assign({variant:K,state:E,width:i.width,isActive:"active"===E||V,isInvalid:Q,style:null!==(O=null==_?void 0:_.InputWrapper)&&void 0!==O?O:{}},{children:[!!P&&t(p,Object.assign({variant:K,iconSize:$,onClick:()=>ee(null==k?void 0:k.callback),isLeft:!0,style:null!==(w=null==_?void 0:_.IconHolder)&&void 0!==w?w:{}},{children:t(P,{})})),!!q&&t(f,Object.assign({variant:K},{children:q})),"default"===K&&t(g,{children:ie()}),"small"===K&&t(m,{children:ie()}),!!W&&t(p,Object.assign({variant:K,iconSize:$,onClick:()=>ee(null==k?void 0:k.callback),isLeft:!1},{children:t(W,{})})),!!R&&t(x,Object.assign({variant:K},{children:R})),M&&M.text&&t(o,{buttonText:M.text,onClick:()=>ee(null==M?void 0:M.onClick)})]})),(!!S||!!B)&&"default"===K&&e(y,Object.assign({invalid:Q},{children:[e(s,{children:[S,D?t("span",{children:"*"}):""]}),B>0&&e(b,{children:[G.length,"/",B]})]}))]}))}));C.displayName="Input";export{C as Input};
|