@bikdotai/bik-component-library 0.0.20-beta12 → 0.0.21-beta.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/assets/icons/chevronDown.svg.js +1 -0
- package/dist/cjs/components/dropdown/Common.styled.d.ts +1 -0
- package/dist/cjs/components/dropdown/Common.styled.js +11 -3
- package/dist/cjs/components/dropdown/Dropdown.d.ts +2 -2
- package/dist/cjs/components/dropdown/Dropdown.js +1 -0
- package/dist/cjs/components/dropdown/UnChildDropdown/UnChildDropdown.d.ts +1 -4
- package/dist/cjs/components/dropdown/UnChildDropdown/UnChildDropdown.js +1 -1
- package/dist/cjs/components/dropdown/index.d.ts +2 -0
- package/dist/cjs/components/dropdown/opennedDropdown/components/OpennedDropdown.js +1 -1
- package/dist/cjs/components/dropdown/opennedDropdown/components/menu/MenuItem.js +3 -1
- package/dist/cjs/components/dropdown/opennedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js +3 -2
- package/dist/cjs/components/dropdown/opennedDropdown/components/searchbox/SearchBox.js +1 -1
- package/dist/cjs/components/dropdown/opennedDropdown/utils/iterationOnOptions.d.ts +13 -13
- package/dist/cjs/components/dropdown/type.d.ts +10 -5
- package/dist/cjs/components/fab-menu/FABMenu.d.ts +2 -2
- package/dist/cjs/components/fab-menu/FABMenu.js +1 -1
- package/dist/cjs/components/list-item/ListItem.d.ts +1 -0
- package/dist/cjs/components/list-item/ListItem.js +1 -1
- package/dist/cjs/index.d.ts +0 -1
- package/dist/cjs/index.js +1 -1
- package/dist/esm/assets/icons/chevronDown.svg.js +1 -0
- package/dist/esm/components/dropdown/Common.styled.d.ts +1 -0
- package/dist/esm/components/dropdown/Common.styled.js +10 -2
- package/dist/esm/components/dropdown/Dropdown.d.ts +2 -2
- package/dist/esm/components/dropdown/Dropdown.js +1 -0
- package/dist/esm/components/dropdown/UnChildDropdown/UnChildDropdown.d.ts +1 -4
- package/dist/esm/components/dropdown/UnChildDropdown/UnChildDropdown.js +1 -1
- package/dist/esm/components/dropdown/index.d.ts +2 -0
- package/dist/esm/components/dropdown/opennedDropdown/components/OpennedDropdown.js +1 -1
- package/dist/esm/components/dropdown/opennedDropdown/components/menu/MenuItem.js +3 -1
- package/dist/esm/components/dropdown/opennedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js +3 -2
- package/dist/esm/components/dropdown/opennedDropdown/components/searchbox/SearchBox.js +1 -1
- package/dist/esm/components/dropdown/opennedDropdown/utils/iterationOnOptions.d.ts +13 -13
- package/dist/esm/components/dropdown/type.d.ts +10 -5
- package/dist/esm/components/fab-menu/FABMenu.d.ts +2 -2
- package/dist/esm/components/fab-menu/FABMenu.js +1 -1
- package/dist/esm/components/list-item/ListItem.d.ts +1 -0
- package/dist/esm/components/list-item/ListItem.js +1 -1
- package/dist/esm/index.d.ts +0 -1
- package/dist/esm/index.js +1 -1
- package/package.json +1 -1
- package/dist/cjs/components/analytics-card/AnalyticsCard.d.ts +0 -9
- package/dist/cjs/components/analytics-card/AnalyticsCard.js +0 -1
- package/dist/cjs/components/analytics-card/AnalyticsCard.styled.d.ts +0 -16
- package/dist/cjs/components/analytics-card/AnalyticsCard.styled.js +0 -1
- package/dist/cjs/components/analytics-card/index.d.ts +0 -2
- package/dist/esm/components/analytics-card/AnalyticsCard.d.ts +0 -9
- package/dist/esm/components/analytics-card/AnalyticsCard.js +0 -1
- package/dist/esm/components/analytics-card/AnalyticsCard.styled.d.ts +0 -16
- package/dist/esm/components/analytics-card/AnalyticsCard.styled.js +0 -1
- package/dist/esm/components/analytics-card/index.d.ts +0 -2
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";function e(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}Object.defineProperty(exports,"__esModule",{value:!0});var t,r=e(require("react"));function n(){return n=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},n.apply(this,arguments)}var a=e=>r.createElement("svg",n({xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24"},e),t||(t=r.createElement("path",{fill:"currentColor",d:"M7.707 10.707C7.077 10.077 7.523 9 8.414 9h7.172c.89 0 1.337 1.077.707 1.707l-3.586 3.586a1 1 0 0 1-1.414 0l-3.586-3.586Z"})));exports.default=a;
|
|
@@ -1,2 +1,3 @@
|
|
|
1
1
|
export declare const OverLapAbs: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
2
2
|
export declare const OpenDropdownContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
3
|
+
export declare const LoadingContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),r=require("../../constants/Theme.js");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=t(e);const i=o.default.div`
|
|
2
2
|
position: absolute;
|
|
3
3
|
left: 0px;
|
|
4
4
|
top: 0px;
|
|
@@ -6,7 +6,15 @@
|
|
|
6
6
|
height: 100%;
|
|
7
7
|
z-index: 2;
|
|
8
8
|
cursor: pointer;
|
|
9
|
-
`,
|
|
9
|
+
`,d=o.default.div`
|
|
10
10
|
margin-top: 8px;
|
|
11
11
|
margin-bottom: 8px;
|
|
12
|
-
`;
|
|
12
|
+
`;o.default.div`
|
|
13
|
+
display: flex;
|
|
14
|
+
flex-direction: row;
|
|
15
|
+
align-items: center;
|
|
16
|
+
padding: 6px 8px;
|
|
17
|
+
background: ${r.COLORS.surface.hovered};
|
|
18
|
+
border: 1px solid ${r.COLORS.stroke.primary};
|
|
19
|
+
border-radius: 4px;
|
|
20
|
+
`,exports.OpenDropdownContainer=d,exports.OverLapAbs=i;
|
|
@@ -3,6 +3,6 @@ import { OpenDropdownProps } from './type';
|
|
|
3
3
|
export type DropdownProps = OpenDropdownProps & {
|
|
4
4
|
placeHolder?: string;
|
|
5
5
|
size?: 'default' | 'small';
|
|
6
|
+
disabled?: boolean;
|
|
6
7
|
};
|
|
7
|
-
declare const Dropdown: React.FC<DropdownProps>;
|
|
8
|
-
export default Dropdown;
|
|
8
|
+
export declare const Dropdown: React.FC<DropdownProps>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),n=require("react"),r=require("../../constants/Theme.js"),o=require("../../assets/icons/chevronDown.svg.js"),i=require("../input/Input.js"),l=require("../input/context/InputStyleProvider.js"),s=require("./UnChildDropdown/UnChildDropdown.js");function a(){}exports.Dropdown=d=>{var u,c,{placeHolder:p,size:h,onSelect:v,defaultOptions:j,disabled:g}=d,f=e.__rest(d,["placeHolder","size","onSelect","defaultOptions","disabled"]);const b=null!=h?h:"default",x=n.useRef(),[w,m]=n.useState(null!=j?j:[]);n.useEffect((()=>{var e;const t=[];null===(e=null==f?void 0:f.options)||void 0===e||e.forEach((e=>{e.options?e.options.forEach((e=>{e.selected&&t.push(Object.assign(Object.assign({},e),{label:e.label}))})):e.selected&&t.push(e)})),m([...t])}),[f.options]);const O=w.length?w.map((e=>e.label)).join(", "):void 0;return t.jsx(l.InputStyleContext.Provider,Object.assign({value:{InputWrapper:{height:"small"===b?32:48,width:null!==(u=f.width)&&void 0!==u?u:"100%",zIndex:1,cursor:"pointer",padding:"6px 8px"},input:{minHeight:"100%"}}},{children:t.jsx(s.UnChildDropdown,Object.assign({ref:x,onSelect:function(e){Array.isArray(e)?m([...e]):m([e]),null==v||v(e)},disabled:g},f,{children:t.jsx(i.Input,{state:g?"disabled":"active",value:O,errorMessage:f.error,variant:b,placeholder:null!=p?p:"Select an option",width:null!==(c=f.width)&&void 0!==c?c:"100%",onChangeText:a,rightIcon:{icon:()=>{var e;return t.jsx(o.default,{style:{transform:(null===(e=null==x?void 0:x.current)||void 0===e?void 0:e.openDropdown)?"rotate(180deg)":"rotate(0deg)"},onClick:a,width:"small"===b?20:24,height:"small"===b?20:24,color:r.COLORS.content.primary})}}})}))}))};
|
|
@@ -1,12 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { OpenDropdownProps } from '../type';
|
|
3
|
-
export type DropdownProps = OpenDropdownProps & {
|
|
4
|
-
isLoading?: boolean;
|
|
5
|
-
children?: React.ReactNode;
|
|
6
|
-
};
|
|
7
3
|
export declare const UnChildDropdown: React.ForwardRefExoticComponent<OpenDropdownProps & {
|
|
8
4
|
isLoading?: boolean | undefined;
|
|
9
5
|
children?: React.ReactNode;
|
|
6
|
+
disabled?: boolean | undefined;
|
|
10
7
|
} & React.RefAttributes<{
|
|
11
8
|
openDropdown: boolean;
|
|
12
9
|
}>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),n=require("react/jsx-runtime"),r=require("react"),t=require("react-popper"),o=require("../Common.styled.js"),s=require("../opennedDropdown/components/OpennedDropdown.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const i=l(r).default.forwardRef(((l,i)=>{var{children:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),n=require("react/jsx-runtime"),r=require("react"),t=require("react-popper"),o=require("../Common.styled.js"),s=require("../opennedDropdown/components/OpennedDropdown.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const i=l(r).default.forwardRef(((l,i)=>{var{children:d}=l,p=e.__rest(l,["children"]);const a=i,[u,c]=r.useState(!1),[j,v]=r.useState(null),[f,b]=r.useState(null),{styles:O,attributes:w}=t.usePopper(j,f,{});return r.useImperativeHandle(a,(()=>({openDropdown:u})),[]),r.useEffect((()=>{(null==a?void 0:a.current)&&(a.current.openDropdown=u)}),[u]),n.jsxs(n.Fragment,{children:[n.jsxs("div",Object.assign({style:{position:"relative"},ref:v},{children:[n.jsx(o.OverLapAbs,{onClick:e=>{u?e.preventDefault():p.disabled||c(!0)}}),d]})),u&&n.jsx(o.OpenDropdownContainer,Object.assign({ref:b,style:Object.assign(Object.assign({},O.popper),{zIndex:3})},w.popper,{children:n.jsx(s.OpennedDropdown,Object.assign({},p,{onSelect:e=>{var n;null===(n=p.onSelect)||void 0===n||n.call(p,e),c(!1)},onClose:function(){var e;c(!1),null===(e=null==p?void 0:p.onClose)||void 0===e||e.call(p)}}))}))]})}));i.displayName="UnChildDropdown",exports.UnChildDropdown=i;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),s=require("../../../../hooks/useOutside.js"),n=require("../utils/iterationOnOptions.js"),i=require("./description/Description.js"),l=require("./menu/FreeFormMenu.js"),o=require("./menu/MenuList.js"),r=require("./menu/SelectAllMenu.js"),u=require("./multiSelect/MultiSelectDropdownBottomBar.js"),c=require("./OpennedDropdown.styled.js"),a=require("./searchbox/SearchBox.js"),d=require("./searchbox/SearchZeroState.js");const p=304,f=290;exports.OpennedDropdown=j=>{let{options:h,isSearchable:S,isMultiSelect:O,width:b,allowFreeForm:x,height:m,onClose:g,onSelect:v}=j;const[q,M]=t.useState(null!=h?h:[]),[F,w]=t.useState(null!=b?b:f),[y,D]=t.useState(""),[A,B]=t.useState(null),C=t.useRef(null);s.useOutside(C,(()=>{B(null),null==g||g()}));const L=null!=m?m:p,E="number"==typeof L?S&&O?L-96:S&&!O||!S&&O?L-48:L:L;function W(e){if(O){const t=n.iterateOnOptions(q,{selected:e.selected},(t=>t.value===e.value));M([...t])}else null==v||v(e)}t.useEffect((()=>{const e=null!=b?b:f;if(null===A)w(e);else if("number"==typeof e)w(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));w(t)}}),[A]);const Z=q.map((e=>{var t;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.includes(y))})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.includes(y))?e:null}return e})).filter((e=>null!==e)),_=!!S&&y&&0===Z.length;return e.jsxs(c.OpennedDropdownContainer,Object.assign({ref:C,style:{maxWidth:A?800:400,width:F}},{children:[e.jsxs("div",Object.assign({style:{width:A?"50%":"100%",display:"flex",flexDirection:"column"}},{children:[!!S&&e.jsx(a.SearchBox,{onSearch:function(e){D(e)}}),e.jsxs(c.MenuListContainer,Object.assign({maxHeight:E},{children:[!!O&&!_&&e.jsx(r.SelectAllMenu,{options:q,onSelect:function(e){if("selectAll"===e){const e=n.iterateOnOptions(q,{selected:!0},(e=>!e.disabled));M([...e])}else if("notSelected"===e){const e=n.iterateOnOptions(q,{selected:!1},(e=>!e.disabled));M([...e])}}}),!x&&_&&e.jsx(d.SearchZeroState,{searchedString:y}),x&&_&&e.jsx(l.FreeFormMenu,{isMultiSelect:O,onSelect:function(e){if(!O)return void W({label:y,value:y,isFreeForm:!0,selected:!0});const t=q.map((t=>t.options?t:Object.assign(Object.assign({},t),{selected:t.label===y&&t.value===y&&e})));e&&(t.some((e=>e.label===y&&e.value===y))||t.unshift({label:y,value:y,isFreeForm:!0,selected:!0})),M([...t])},searchedString:y}),e.jsx(o.MenuList,{onSelect:W,showDescription:function(e,t){B(e&&t?{title:e,description:t}:null)},isMultiSelect:O,options:Z})]})),!!O&&e.jsx(u.default,{onClear:function(){const e=n.iterateOnOptions(q,{selected:!1});M([...e])},onApply:function(){const e=[];q.forEach((t=>{if(t.options){const s=t.options.filter((e=>!0===e.selected));e.push(Object.assign(Object.assign({},t),{options:[...s]}))}else t.selected&&e.push(Object.assign({},t))})),null==v||v([...e])},list:q})]})),!!A&&e.jsx(i.Description,{title:A.title,description:A.description})]}))};
|
|
@@ -1 +1,3 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../../checkBox/CheckBox.js"),s=require("../../../../list-item/ListItem.js"),i=require("../../../../TypographyStyle.js"),r=require("../../../../../constants/Theme.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("styled-components"),n=require("../../../../checkBox/CheckBox.js"),s=require("../../../../list-item/ListItem.js"),i=require("../../../../TypographyStyle.js"),r=require("../../../../../constants/Theme.js"),o=require("./FreeFormMenu.styled.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const c=l(t).default(s.ListItem)`
|
|
2
|
+
padding: 14px 16px !important;
|
|
3
|
+
`;exports.MenuItem=t=>{let{option:s,isMultiSelect:l,showDescription:a,onSelect:u}=t;var d;function m(e){s.disabled||u(Object.assign(Object.assign({},s),{selected:e}))}return e.jsx(c,{onClick:e=>{e.preventDefault(),m(!s.selected)},onMouseOver:function(){s.descriptions?a(s.label,s.descriptions):a()},listItem:{value:s.value,label:s.label},subText:s.subText,leadingIcon:l?e.jsx(n.CheckBox,{isDisabled:null!==(d=s.disabled)&&void 0!==d&&d,isChecked:!!s.selected,onValueChange:m}):e.jsx(e.Fragment,{}),customComponent:s.customComponent,trailingIcon:s.isFreeForm?e.jsx(o.FreeFormContainer,{children:e.jsx(i.BodyCaption,Object.assign({style:{color:r.COLORS.content.secondary}},{children:"Freeform"}))}):s.trailingIcon?e.jsx(e.Fragment,{children:s.trailingIcon}):e.jsx(e.Fragment,{}),variant:s.disabled?"inactive":s.selected?"selected":"default"})};
|
|
@@ -1,8 +1,9 @@
|
|
|
1
|
-
"use strict";
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../../../../constants/Theme.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const r=n(e).default.div`
|
|
2
2
|
display: flex;
|
|
3
3
|
padding: 8px 16px;
|
|
4
4
|
flex-direction: row;
|
|
5
5
|
align-items: center;
|
|
6
6
|
justify-content: end;
|
|
7
7
|
box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.12);
|
|
8
|
-
|
|
8
|
+
background: ${t.COLORS.surface.standard};
|
|
9
|
+
`;exports.BottomBarContainer=r;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("../../../../input/Input.js"),n=require("../../../../input/context/InputStyleProvider.js"),o=require("../../../../../constants/Theme.js"),i=require("../../../../../assets/icons/cross.svg.js"),s=require("../../../../../assets/icons/search.svg.js");exports.SearchBox=c=>{let{onSearch:u}=c;const a=r.createRef();return e.jsx(n.InputStyleContext.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:"1px solid "+o.COLORS.stroke.primary,padding:"
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("../../../../input/Input.js"),n=require("../../../../input/context/InputStyleProvider.js"),o=require("../../../../../constants/Theme.js"),i=require("../../../../../assets/icons/cross.svg.js"),s=require("../../../../../assets/icons/search.svg.js");exports.SearchBox=c=>{let{onSearch:u}=c;const a=r.createRef();return e.jsx(n.InputStyleContext.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:"1px solid "+o.COLORS.stroke.primary,padding:"14px 16px"},IconHolder:{marginLeft:0},input:{marginLeft:4,minHeight:"100%"}}},{children:e.jsx(t.Input,{ref:a,placeholder:"Search",leftIcon:{icon:()=>e.jsx(s.default,{width:24,height:24,color:o.COLORS.content.placeholder})},rightIcon:{icon:()=>{var r;return(null===(r=null==a?void 0:a.current)||void 0===r?void 0:r.value)?e.jsx(i.default,{onClick:()=>{a.current&&(a.current.value=""),u("")},width:24,height:24,color:o.COLORS.content.placeholder}):e.jsx(e.Fragment,{})}},onChangeText:u})}))};
|
|
@@ -1,24 +1,24 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import { DropdownOption, SingleOption } from '../../type';
|
|
2
|
-
export declare function iterateOnOptions(options: DropdownOption[], newVal: SingleOption
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
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;
|
|
3
|
+
export declare function iterateOnOptions(options: DropdownOption[], newVal: Partial<SingleOption>, checkCB?: (optionForValidation: SingleOption) => boolean): ({
|
|
4
|
+
label: string;
|
|
5
|
+
value: string;
|
|
6
|
+
descriptions?: string | null | undefined;
|
|
14
7
|
selected?: boolean | undefined;
|
|
15
8
|
disabled?: boolean | undefined;
|
|
16
9
|
isFreeForm?: boolean | undefined;
|
|
10
|
+
subText?: string | undefined;
|
|
11
|
+
trailingIcon?: JSX.Element | undefined;
|
|
12
|
+
customComponent?: JSX.Element | undefined;
|
|
17
13
|
} | {
|
|
18
14
|
label?: string | undefined;
|
|
19
15
|
value?: string | undefined;
|
|
20
|
-
descriptions?: string | undefined;
|
|
16
|
+
descriptions?: string | null | undefined;
|
|
21
17
|
selected?: boolean | undefined;
|
|
22
18
|
disabled?: boolean | undefined;
|
|
23
19
|
isFreeForm?: boolean | undefined;
|
|
20
|
+
subText?: string | undefined;
|
|
21
|
+
trailingIcon?: JSX.Element | undefined;
|
|
22
|
+
customComponent?: JSX.Element | undefined;
|
|
23
|
+
options: SingleOption[];
|
|
24
24
|
})[];
|
|
@@ -1,25 +1,30 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
export interface OpenDropdownProps {
|
|
3
|
+
defaultOptions?: DropdownOption[];
|
|
2
4
|
options: DropdownOption[];
|
|
3
5
|
isSearchable?: boolean;
|
|
4
6
|
error?: string;
|
|
5
7
|
isMultiSelect?: boolean;
|
|
6
|
-
width?:
|
|
8
|
+
width?: string;
|
|
7
9
|
height?: number | string;
|
|
8
10
|
allowFreeForm?: boolean;
|
|
9
11
|
onClose?: () => void;
|
|
10
|
-
onSelect?: (option:
|
|
12
|
+
onSelect?: (option: DropdownOption | DropdownOption[]) => void;
|
|
11
13
|
}
|
|
12
14
|
export type GroupedOption = {
|
|
13
15
|
label?: string;
|
|
14
16
|
options: (SingleOption | MultiSelectOption)[];
|
|
15
17
|
};
|
|
16
18
|
export type SingleOption = {
|
|
17
|
-
label
|
|
18
|
-
value
|
|
19
|
-
descriptions?: string;
|
|
19
|
+
label: string;
|
|
20
|
+
value: string;
|
|
21
|
+
descriptions?: string | null;
|
|
20
22
|
selected?: boolean;
|
|
21
23
|
disabled?: boolean;
|
|
22
24
|
isFreeForm?: boolean;
|
|
25
|
+
subText?: string;
|
|
26
|
+
trailingIcon?: JSX.Element;
|
|
27
|
+
customComponent?: JSX.Element;
|
|
23
28
|
};
|
|
24
29
|
export type MultiSelectOption = SingleOption;
|
|
25
30
|
export type DropdownOption = MultiSelectOption | SingleOption | GroupedOption;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { DropdownOption
|
|
2
|
+
import { DropdownOption } from '../dropdown/type';
|
|
3
3
|
import { DROP_POSITION, FAB_POSITION, MENU_ALIGNMENT } from '../floating-action-button/FloatingActionButton.styles';
|
|
4
4
|
import { TooltipPlacement } from '../tooltips';
|
|
5
5
|
export declare const FABMenu: React.FC<{
|
|
6
|
-
onSelect: (selected:
|
|
6
|
+
onSelect: (selected: DropdownOption | DropdownOption[]) => void;
|
|
7
7
|
menuOptions: DropdownOption[];
|
|
8
8
|
buttonWidth?: number;
|
|
9
9
|
buttonHeight?: number;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react/jsx-runtime"),o=require("../dropdown/opennedDropdown/components/OpennedDropdown.js"),n=require("../floating-action-button/FloatingActionButton.js");require("../floating-action-button/FloatingActionButton.styles.js");exports.FABMenu=e=>{const{onSelect:i,menuOptions:r,buttonWidth:d,buttonHeight:u,buttonColor:l,buttonPosition:s,menuWidth:c,menuHeight:a,buttonIcon:p,buttonPaddingHorizontal:g,buttonPaddingVertical:b,tooltipPlacement:h,tooltipText:m,zIndex:x,isRound:P,dropPosition:j,menuAligment:w}=e;return t.jsx("div",{children:t.jsx(n.FloatingActionButton,Object.assign({icon:p,width:d,height:u,color:l,position:s,buttonPaddingHorizontal:g,buttonPaddingVertical:b,tooltipPlacement:h,tooltipText:m,zIndex:x,isRound:P,dropPosition:j,menuAligment:w},{children:t.jsx(o.OpennedDropdown,{options:r,height:a||90,width
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react/jsx-runtime"),o=require("../dropdown/opennedDropdown/components/OpennedDropdown.js"),n=require("../floating-action-button/FloatingActionButton.js");require("../floating-action-button/FloatingActionButton.styles.js");exports.FABMenu=e=>{const{onSelect:i,menuOptions:r,buttonWidth:d,buttonHeight:u,buttonColor:l,buttonPosition:s,menuWidth:c,menuHeight:a,buttonIcon:p,buttonPaddingHorizontal:g,buttonPaddingVertical:b,tooltipPlacement:h,tooltipText:m,zIndex:x,isRound:P,dropPosition:j,menuAligment:w}=e;return t.jsx("div",{children:t.jsx(n.FloatingActionButton,Object.assign({icon:p,width:d,height:u,color:l,position:s,buttonPaddingHorizontal:g,buttonPaddingVertical:b,tooltipPlacement:h,tooltipText:m,zIndex:x,isRound:P,dropPosition:j,menuAligment:w},{children:t.jsx(o.OpennedDropdown,{options:r,height:a||90,width:`${c}px`,onSelect:i})}))})};
|
|
@@ -12,5 +12,6 @@ export interface ListItemProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
|
12
12
|
leadingIcon?: JSX.Element;
|
|
13
13
|
trailingIcon?: JSX.Element;
|
|
14
14
|
borderBottom?: string;
|
|
15
|
+
customComponent?: JSX.Element;
|
|
15
16
|
}
|
|
16
17
|
export declare const ListItem: import("react").ForwardRefExoticComponent<ListItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("react"),s=require("./themes.js"),i=require("../TypographyStyle.js"),o=require("../../constants/Theme.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("react"),s=require("./themes.js"),i=require("../TypographyStyle.js"),o=require("../../constants/Theme.js"),n=require("./ListItem.styled.js");const l=r.forwardRef(((r,l)=>{var{id:a,onSelect:c,variant:d="default",trailingIcon:m,leadingIcon:u,subText:j,listItem:x,borderBottom:y,customComponent:g}=r,b=e.__rest(r,["id","onSelect","variant","trailingIcon","leadingIcon","subText","listItem","borderBottom","customComponent"]);return t.jsx(n.ListItem,Object.assign({ref:l,id:a,variant:d,onClick:()=>c&&c(x),borderBottom:y},b,{children:g?t.jsx(t.Fragment,{children:g}):t.jsxs(t.Fragment,{children:[!!u&&u,t.jsxs("div",Object.assign({style:{display:"flex",rowGap:"4px",flexDirection:"column"}},{children:[!!x&&t.jsx(i.BodySecondary,Object.assign({style:{color:s.getColor(d)}},{children:x.label})),!!j&&t.jsx(i.BodyCaption,Object.assign({style:{color:o.COLORS.text.secondary}},{children:j}))]})),!!m&&t.jsx("div",Object.assign({style:{display:"flex",marginLeft:"auto"}},{children:m}))]})}))}));l.displayName="ListItem",exports.ListItem=l;
|
package/dist/cjs/index.d.ts
CHANGED
package/dist/cjs/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./utils/StringUtils.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./utils/StringUtils.js"),o=require("./constants/Theme.js"),t=require("./components/checkBox/CheckBox.js"),r=require("./components/list-item/ListItem.js"),n=require("./components/pagination/Pagination.js"),p=require("./components/radioButton/RadioButton.js"),s=require("./components/toaster/Toaster.js"),i=require("./components/tooltips/Tooltip.js"),a=require("./components/tooltips/CustomisedTooltip.js"),u=require("./components/spinner/Spinner.js"),l=require("./components/stepper/Stepper.js"),d=require("./components/tag/Tag.js"),m=require("./components/icon-button/IconButton.js"),c=require("./components/template-preview/constants/regexPatterns.js"),x=require("./components/template-preview/TemplatePreview.js"),g=require("./components/template-preview/WhatsApp/WhatsAppLikePreview.js"),B=require("./components/template-preview/helpers/SmsTemplateHelper.js"),T=require("./components/template-preview/helpers/WhatsAppFormatToHTML.js"),y=require("./components/fab-menu/FABMenu.js"),S=require("./components/floating-action-button/FloatingActionButton.js"),j=require("./components/floating-action-button/FloatingActionButton.styles.js"),P=require("./components/image-compress/ImageCompress.js"),w=require("./components/TypographyStyle.js"),q=require("./components/button/Button.js"),C=require("./components/progress-bar/ProgressBarComponent.js"),O=require("./components/modals/styledModal.js"),L=require("./components/dropdown/Dropdown.js"),A=require("./components/dropdown/UnChildDropdown/UnChildDropdown.js"),I=require("./components/dropdown/opennedDropdown/components/OpennedDropdown.js"),F=require("./components/input/Input.js");exports.StringUtils=e.default,exports.BASE_COLORS=o.BASE_COLORS,exports.COLORS=o.COLORS,exports.DEFAULT_THEME=o.DEFAULT_THEME,exports.FONTS=o.FONTS,exports.CheckBox=t.CheckBox,exports.ListItem=r.ListItem,exports.Pagination=n.Pagination,exports.RadioButton=p.RadioButton,exports.Toaster=s.Toaster,exports.Tooltip=i.Tooltip,exports.CustomisedTooltip=a.CustomisedTooltip,Object.defineProperty(exports,"TooltipPlacement",{enumerable:!0,get:function(){return a.TooltipPlacement}}),exports.Spinner=u.Spinner,exports.Stepper=l.Stepper,exports.Tag=d.Tag,exports.IconButton=m.IconButton,exports.regexPatterns=c,exports.TemplatePreview=x.TemplatePreview,exports.WhatsappLikePreview=g.WhatsappLikePreview,exports.renderVariableUIForPreview=B.renderVariableUIForPreview,exports.WhatsAppFormatToHTML=T.WhatsAppFormatToHTML,exports.FABMenu=y.FABMenu,exports.FloatingActionButton=S.FloatingActionButton,Object.defineProperty(exports,"DROP_POSITION",{enumerable:!0,get:function(){return j.DROP_POSITION}}),exports.DropdownToggleContainer=j.DropdownToggleContainer,Object.defineProperty(exports,"FAB_POSITION",{enumerable:!0,get:function(){return j.FAB_POSITION}}),exports.FloatingActionButtonContainer=j.FloatingActionButtonContainer,exports.FloatingActionButtonOuterContainer=j.FloatingActionButtonOuterContainer,Object.defineProperty(exports,"MENU_ALIGNMENT",{enumerable:!0,get:function(){return j.MENU_ALIGNMENT}}),exports.StyledDropdown=j.StyledDropdown,exports.ImageService=P.ImageService,exports.BodyCaption=w.BodyCaption,exports.BodyLarge=w.BodyLarge,exports.BodyPrimary=w.BodyPrimary,exports.BodyPrimaryLink=w.BodyPrimaryLink,exports.BodyRegular=w.BodyRegular,exports.BodySecondary=w.BodySecondary,exports.BodySecondaryLink=w.BodySecondaryLink,exports.BodyTiny=w.BodyTiny,exports.ButtonLarge=w.ButtonLarge,exports.ButtonRegular=w.ButtonRegular,exports.Caption=w.Caption,exports.Display=w.Display,exports.SubHeading=w.SubHeading,exports.TitleLarge=w.TitleLarge,exports.TitleMedium=w.TitleMedium,exports.TitleRegular=w.TitleRegular,exports.TitleSmall=w.TitleSmall,exports.Button=q.Button,exports.ProgressBarComponent=C.ProgressBarComponent,exports.ProgressCompletedBar=C.ProgressCompletedBar,exports.StyledModal=O.StyledModal,exports.Dropdown=L.Dropdown,exports.UnChildDropdown=A.UnChildDropdown,exports.OpennedDropdown=I.OpennedDropdown,exports.Input=F.Input;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import*as r from"react";var t;function e(){return e=Object.assign?Object.assign.bind():function(r){for(var t=1;t<arguments.length;t++){var e=arguments[t];for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&(r[a]=e[a])}return r},e.apply(this,arguments)}var a=a=>r.createElement("svg",e({xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24"},a),t||(t=r.createElement("path",{fill:"currentColor",d:"M7.707 10.707C7.077 10.077 7.523 9 8.414 9h7.172c.89 0 1.337 1.077.707 1.707l-3.586 3.586a1 1 0 0 1-1.414 0l-3.586-3.586Z"})));export{a as default};
|
|
@@ -1,2 +1,3 @@
|
|
|
1
1
|
export declare const OverLapAbs: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
2
2
|
export declare const OpenDropdownContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
3
|
+
export declare const LoadingContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import o from"styled-components";const
|
|
1
|
+
import o from"styled-components";import{COLORS as r}from"../../constants/Theme.js";const e=o.div`
|
|
2
2
|
position: absolute;
|
|
3
3
|
left: 0px;
|
|
4
4
|
top: 0px;
|
|
@@ -9,4 +9,12 @@ import o from"styled-components";const t=o.div`
|
|
|
9
9
|
`,i=o.div`
|
|
10
10
|
margin-top: 8px;
|
|
11
11
|
margin-bottom: 8px;
|
|
12
|
-
`;
|
|
12
|
+
`;o.div`
|
|
13
|
+
display: flex;
|
|
14
|
+
flex-direction: row;
|
|
15
|
+
align-items: center;
|
|
16
|
+
padding: 6px 8px;
|
|
17
|
+
background: ${r.surface.hovered};
|
|
18
|
+
border: 1px solid ${r.stroke.primary};
|
|
19
|
+
border-radius: 4px;
|
|
20
|
+
`;export{i as OpenDropdownContainer,e as OverLapAbs};
|
|
@@ -3,6 +3,6 @@ import { OpenDropdownProps } from './type';
|
|
|
3
3
|
export type DropdownProps = OpenDropdownProps & {
|
|
4
4
|
placeHolder?: string;
|
|
5
5
|
size?: 'default' | 'small';
|
|
6
|
+
disabled?: boolean;
|
|
6
7
|
};
|
|
7
|
-
declare const Dropdown: React.FC<DropdownProps>;
|
|
8
|
-
export default Dropdown;
|
|
8
|
+
export declare const Dropdown: React.FC<DropdownProps>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{__rest as o}from"../../_virtual/_tslib.js";import{jsx as t}from"react/jsx-runtime";import{useRef as e,useState as n,useEffect as r}from"react";import{COLORS as i}from"../../constants/Theme.js";import l from"../../assets/icons/chevronDown.svg.js";import{Input as s}from"../input/Input.js";import{InputStyleContext as a}from"../input/context/InputStyleProvider.js";import{UnChildDropdown as d}from"./UnChildDropdown/UnChildDropdown.js";function p(){}const c=c=>{var u,m,{placeHolder:h,size:v,onSelect:f,defaultOptions:g,disabled:b}=c,j=o(c,["placeHolder","size","onSelect","defaultOptions","disabled"]);const w=null!=v?v:"default",x=e(),[O,y]=n(null!=g?g:[]);r((()=>{var o;const t=[];null===(o=null==j?void 0:j.options)||void 0===o||o.forEach((o=>{o.options?o.options.forEach((o=>{o.selected&&t.push(Object.assign(Object.assign({},o),{label:o.label}))})):o.selected&&t.push(o)})),y([...t])}),[j.options]);const I=O.length?O.map((o=>o.label)).join(", "):void 0;return t(a.Provider,Object.assign({value:{InputWrapper:{height:"small"===w?32:48,width:null!==(u=j.width)&&void 0!==u?u:"100%",zIndex:1,cursor:"pointer",padding:"6px 8px"},input:{minHeight:"100%"}}},{children:t(d,Object.assign({ref:x,onSelect:function(o){Array.isArray(o)?y([...o]):y([o]),null==f||f(o)},disabled:b},j,{children:t(s,{state:b?"disabled":"active",value:I,errorMessage:j.error,variant:w,placeholder:null!=h?h:"Select an option",width:null!==(m=j.width)&&void 0!==m?m:"100%",onChangeText:p,rightIcon:{icon:()=>{var o;return t(l,{style:{transform:(null===(o=null==x?void 0:x.current)||void 0===o?void 0:o.openDropdown)?"rotate(180deg)":"rotate(0deg)"},onClick:p,width:"small"===w?20:24,height:"small"===w?20:24,color:i.content.primary})}}})}))}))};export{c as Dropdown};
|
|
@@ -1,12 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { OpenDropdownProps } from '../type';
|
|
3
|
-
export type DropdownProps = OpenDropdownProps & {
|
|
4
|
-
isLoading?: boolean;
|
|
5
|
-
children?: React.ReactNode;
|
|
6
|
-
};
|
|
7
3
|
export declare const UnChildDropdown: React.ForwardRefExoticComponent<OpenDropdownProps & {
|
|
8
4
|
isLoading?: boolean | undefined;
|
|
9
5
|
children?: React.ReactNode;
|
|
6
|
+
disabled?: boolean | undefined;
|
|
10
7
|
} & React.RefAttributes<{
|
|
11
8
|
openDropdown: boolean;
|
|
12
9
|
}>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__rest as
|
|
1
|
+
import{__rest as e}from"../../../_virtual/_tslib.js";import{jsxs as o,Fragment as n,jsx as r}from"react/jsx-runtime";import t,{useState as l,useImperativeHandle as i,useEffect as p}from"react";import{usePopper as s}from"react-popper";import{OverLapAbs as c,OpenDropdownContainer as d}from"../Common.styled.js";import{OpennedDropdown as a}from"../opennedDropdown/components/OpennedDropdown.js";const m=t.forwardRef(((t,m)=>{var{children:u}=t,f=e(t,["children"]);const v=m,[j,b]=l(!1),[h,w]=l(null),[D,O]=l(null),{styles:g,attributes:y}=s(h,D,{});return i(v,(()=>({openDropdown:j})),[]),p((()=>{(null==v?void 0:v.current)&&(v.current.openDropdown=j)}),[j]),o(n,{children:[o("div",Object.assign({style:{position:"relative"},ref:w},{children:[r(c,{onClick:e=>{j?e.preventDefault():f.disabled||b(!0)}}),u]})),j&&r(d,Object.assign({ref:O,style:Object.assign(Object.assign({},g.popper),{zIndex:3})},y.popper,{children:r(a,Object.assign({},f,{onSelect:e=>{var o;null===(o=f.onSelect)||void 0===o||o.call(f,e),b(!1)},onClose:function(){var e;b(!1),null===(e=null==f?void 0:f.onClose)||void 0===e||e.call(f)}}))}))]})}));m.displayName="UnChildDropdown";export{m as UnChildDropdown};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as l,useRef as
|
|
1
|
+
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as l,useRef as n,useEffect as o}from"react";import{useOutside as i}from"../../../../hooks/useOutside.js";import{iterateOnOptions as s}from"../utils/iterationOnOptions.js";import{Description as r}from"./description/Description.js";import{FreeFormMenu as c}from"./menu/FreeFormMenu.js";import{MenuList as u}from"./menu/MenuList.js";import{SelectAllMenu as a}from"./menu/SelectAllMenu.js";import p from"./multiSelect/MultiSelectDropdownBottomBar.js";import{OpennedDropdownContainer as d,MenuListContainer as m}from"./OpennedDropdown.styled.js";import{SearchBox as f}from"./searchbox/SearchBox.js";import{SearchZeroState as h}from"./searchbox/SearchZeroState.js";const b=304,j=290,S=S=>{let{options:g,isSearchable:v,isMultiSelect:O,width:x,allowFreeForm:y,height:F,onClose:w,onSelect:M}=S;const[D,A]=l(null!=g?g:[]),[B,C]=l(null!=x?x:j),[W,k]=l(""),[E,H]=l(null),I=n(null);i(I,(()=>{H(null),null==w||w()}));const L=null!=F?F:b,Z="number"==typeof L?v&&O?L-96:v&&!O||!v&&O?L-48:L:L;function q(e){if(O){const t=s(D,{selected:e.selected},(t=>t.value===e.value));A([...t])}else null==M||M(e)}o((()=>{const e=null!=x?x:j;if(null===E)C(e);else if("number"==typeof e)C(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));C(t)}}),[E]);const z=D.map((e=>{var t;if(W){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.includes(W))})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.includes(W))?e:null}return e})).filter((e=>null!==e)),G=!!v&&W&&0===z.length;return e(d,Object.assign({ref:I,style:{maxWidth:E?800:400,width:B}},{children:[e("div",Object.assign({style:{width:E?"50%":"100%",display:"flex",flexDirection:"column"}},{children:[!!v&&t(f,{onSearch:function(e){k(e)}}),e(m,Object.assign({maxHeight:Z},{children:[!!O&&!G&&t(a,{options:D,onSelect:function(e){if("selectAll"===e){const e=s(D,{selected:!0},(e=>!e.disabled));A([...e])}else if("notSelected"===e){const e=s(D,{selected:!1},(e=>!e.disabled));A([...e])}}}),!y&&G&&t(h,{searchedString:W}),y&&G&&t(c,{isMultiSelect:O,onSelect:function(e){if(!O)return void q({label:W,value:W,isFreeForm:!0,selected:!0});const t=D.map((t=>t.options?t:Object.assign(Object.assign({},t),{selected:t.label===W&&t.value===W&&e})));e&&(t.some((e=>e.label===W&&e.value===W))||t.unshift({label:W,value:W,isFreeForm:!0,selected:!0})),A([...t])},searchedString:W}),t(u,{onSelect:q,showDescription:function(e,t){H(e&&t?{title:e,description:t}:null)},isMultiSelect:O,options:z})]})),!!O&&t(p,{onClear:function(){const e=s(D,{selected:!1});A([...e])},onApply:function(){const e=[];D.forEach((t=>{if(t.options){const l=t.options.filter((e=>!0===e.selected));e.push(Object.assign(Object.assign({},t),{options:[...l]}))}else t.selected&&e.push(Object.assign({},t))})),null==M||M([...e])},list:D})]})),!!E&&t(r,{title:E.title,description:E.description})]}))};export{S as OpennedDropdown};
|
|
@@ -1 +1,3 @@
|
|
|
1
|
-
import{jsx as e,Fragment as t}from"react/jsx-runtime";import{CheckBox as i}from"../../../../checkBox/CheckBox.js";import{ListItem as
|
|
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 n}from"../../../../list-item/ListItem.js";import{BodyCaption as s}from"../../../../TypographyStyle.js";import{COLORS as r}from"../../../../../constants/Theme.js";import{FreeFormContainer as l}from"./FreeFormMenu.styled.js";const c=o(n)`
|
|
2
|
+
padding: 14px 16px !important;
|
|
3
|
+
`,a=o=>{let{option:n,isMultiSelect:a,showDescription:m,onSelect:d}=o;var p;function u(e){n.disabled||d(Object.assign(Object.assign({},n),{selected:e}))}return e(c,{onClick:e=>{e.preventDefault(),u(!n.selected)},onMouseOver:function(){n.descriptions?m(n.label,n.descriptions):m()},listItem:{value:n.value,label:n.label},subText:n.subText,leadingIcon:a?e(i,{isDisabled:null!==(p=n.disabled)&&void 0!==p&&p,isChecked:!!n.selected,onValueChange:u}):e(t,{}),customComponent:n.customComponent,trailingIcon:n.isFreeForm?e(l,{children:e(s,Object.assign({style:{color:r.content.secondary}},{children:"Freeform"}))}):n.trailingIcon?e(t,{children:n.trailingIcon}):e(t,{}),variant:n.disabled?"inactive":n.selected?"selected":"default"})};export{a as MenuItem};
|
|
@@ -1,8 +1,9 @@
|
|
|
1
|
-
import
|
|
1
|
+
import o from"styled-components";import{COLORS as t}from"../../../../../constants/Theme.js";const e=o.div`
|
|
2
2
|
display: flex;
|
|
3
3
|
padding: 8px 16px;
|
|
4
4
|
flex-direction: row;
|
|
5
5
|
align-items: center;
|
|
6
6
|
justify-content: end;
|
|
7
7
|
box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.12);
|
|
8
|
-
|
|
8
|
+
background: ${t.surface.standard};
|
|
9
|
+
`;export{e as BottomBarContainer};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as r,Fragment as o}from"react/jsx-runtime";import{createRef 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 p=p=>{let{onSearch:a}=p;const l=t();return r(n.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:"1px solid "+i.stroke.primary,padding:"
|
|
1
|
+
import{jsx as r,Fragment as o}from"react/jsx-runtime";import{createRef 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 p=p=>{let{onSearch:a}=p;const l=t();return r(n.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:"1px solid "+i.stroke.primary,padding:"14px 16px"},IconHolder:{marginLeft:0},input:{marginLeft:4,minHeight:"100%"}}},{children:r(e,{ref:l,placeholder:"Search",leftIcon:{icon:()=>r(s,{width:24,height:24,color:i.content.placeholder})},rightIcon:{icon:()=>{var t;return(null===(t=null==l?void 0:l.current)||void 0===t?void 0:t.value)?r(c,{onClick:()=>{l.current&&(l.current.value=""),a("")},width:24,height:24,color:i.content.placeholder}):r(o,{})}},onChangeText:a})}))};export{p as SearchBox};
|
|
@@ -1,24 +1,24 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import { DropdownOption, SingleOption } from '../../type';
|
|
2
|
-
export declare function iterateOnOptions(options: DropdownOption[], newVal: SingleOption
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
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;
|
|
3
|
+
export declare function iterateOnOptions(options: DropdownOption[], newVal: Partial<SingleOption>, checkCB?: (optionForValidation: SingleOption) => boolean): ({
|
|
4
|
+
label: string;
|
|
5
|
+
value: string;
|
|
6
|
+
descriptions?: string | null | undefined;
|
|
14
7
|
selected?: boolean | undefined;
|
|
15
8
|
disabled?: boolean | undefined;
|
|
16
9
|
isFreeForm?: boolean | undefined;
|
|
10
|
+
subText?: string | undefined;
|
|
11
|
+
trailingIcon?: JSX.Element | undefined;
|
|
12
|
+
customComponent?: JSX.Element | undefined;
|
|
17
13
|
} | {
|
|
18
14
|
label?: string | undefined;
|
|
19
15
|
value?: string | undefined;
|
|
20
|
-
descriptions?: string | undefined;
|
|
16
|
+
descriptions?: string | null | undefined;
|
|
21
17
|
selected?: boolean | undefined;
|
|
22
18
|
disabled?: boolean | undefined;
|
|
23
19
|
isFreeForm?: boolean | undefined;
|
|
20
|
+
subText?: string | undefined;
|
|
21
|
+
trailingIcon?: JSX.Element | undefined;
|
|
22
|
+
customComponent?: JSX.Element | undefined;
|
|
23
|
+
options: SingleOption[];
|
|
24
24
|
})[];
|
|
@@ -1,25 +1,30 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
export interface OpenDropdownProps {
|
|
3
|
+
defaultOptions?: DropdownOption[];
|
|
2
4
|
options: DropdownOption[];
|
|
3
5
|
isSearchable?: boolean;
|
|
4
6
|
error?: string;
|
|
5
7
|
isMultiSelect?: boolean;
|
|
6
|
-
width?:
|
|
8
|
+
width?: string;
|
|
7
9
|
height?: number | string;
|
|
8
10
|
allowFreeForm?: boolean;
|
|
9
11
|
onClose?: () => void;
|
|
10
|
-
onSelect?: (option:
|
|
12
|
+
onSelect?: (option: DropdownOption | DropdownOption[]) => void;
|
|
11
13
|
}
|
|
12
14
|
export type GroupedOption = {
|
|
13
15
|
label?: string;
|
|
14
16
|
options: (SingleOption | MultiSelectOption)[];
|
|
15
17
|
};
|
|
16
18
|
export type SingleOption = {
|
|
17
|
-
label
|
|
18
|
-
value
|
|
19
|
-
descriptions?: string;
|
|
19
|
+
label: string;
|
|
20
|
+
value: string;
|
|
21
|
+
descriptions?: string | null;
|
|
20
22
|
selected?: boolean;
|
|
21
23
|
disabled?: boolean;
|
|
22
24
|
isFreeForm?: boolean;
|
|
25
|
+
subText?: string;
|
|
26
|
+
trailingIcon?: JSX.Element;
|
|
27
|
+
customComponent?: JSX.Element;
|
|
23
28
|
};
|
|
24
29
|
export type MultiSelectOption = SingleOption;
|
|
25
30
|
export type DropdownOption = MultiSelectOption | SingleOption | GroupedOption;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { DropdownOption
|
|
2
|
+
import { DropdownOption } from '../dropdown/type';
|
|
3
3
|
import { DROP_POSITION, FAB_POSITION, MENU_ALIGNMENT } from '../floating-action-button/FloatingActionButton.styles';
|
|
4
4
|
import { TooltipPlacement } from '../tooltips';
|
|
5
5
|
export declare const FABMenu: React.FC<{
|
|
6
|
-
onSelect: (selected:
|
|
6
|
+
onSelect: (selected: DropdownOption | DropdownOption[]) => void;
|
|
7
7
|
menuOptions: DropdownOption[];
|
|
8
8
|
buttonWidth?: number;
|
|
9
9
|
buttonHeight?: number;
|
|
@@ -1 +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:u,buttonPosition:
|
|
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:u,buttonPosition:p,menuWidth:c,menuHeight:s,buttonIcon:a,buttonPaddingHorizontal:m,buttonPaddingVertical:g,tooltipPlacement:b,tooltipText:h,zIndex:P,isRound:x,dropPosition:f,menuAligment:j}=i;return t("div",{children:t(n,Object.assign({icon:a,width:r,height:l,color:u,position:p,buttonPaddingHorizontal:m,buttonPaddingVertical:g,tooltipPlacement:b,tooltipText:h,zIndex:P,isRound:x,dropPosition:f,menuAligment:j},{children:t(o,{options:d,height:s||90,width:`${c}px`,onSelect:e})}))})};export{i as FABMenu};
|
|
@@ -12,5 +12,6 @@ export interface ListItemProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
|
12
12
|
leadingIcon?: JSX.Element;
|
|
13
13
|
trailingIcon?: JSX.Element;
|
|
14
14
|
borderBottom?: string;
|
|
15
|
+
customComponent?: JSX.Element;
|
|
15
16
|
}
|
|
16
17
|
export declare const ListItem: import("react").ForwardRefExoticComponent<ListItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__rest as t}from"../../_virtual/_tslib.js";import{
|
|
1
|
+
import{__rest as t}from"../../_virtual/_tslib.js";import{jsx as e,Fragment as o,jsxs as i}from"react/jsx-runtime";import{forwardRef as r}from"react";import{getColor as s}from"./themes.js";import{BodySecondary as n,BodyCaption as l}from"../TypographyStyle.js";import{COLORS as a}from"../../constants/Theme.js";import{ListItem as m}from"./ListItem.styled.js";const c=r(((r,c)=>{var{id:d,onSelect:p,variant:f="default",trailingIcon:b,leadingIcon:y,subText:g,listItem:j,borderBottom:h,customComponent:u}=r,x=t(r,["id","onSelect","variant","trailingIcon","leadingIcon","subText","listItem","borderBottom","customComponent"]);return e(m,Object.assign({ref:c,id:d,variant:f,onClick:()=>p&&p(j),borderBottom:h},x,{children:u?e(o,{children:u}):i(o,{children:[!!y&&y,i("div",Object.assign({style:{display:"flex",rowGap:"4px",flexDirection:"column"}},{children:[!!j&&e(n,Object.assign({style:{color:s(f)}},{children:j.label})),!!g&&e(l,Object.assign({style:{color:a.text.secondary}},{children:g}))]})),!!b&&e("div",Object.assign({style:{display:"flex",marginLeft:"auto"}},{children:b}))]})}))}));c.displayName="ListItem";export{c as ListItem};
|
package/dist/esm/index.d.ts
CHANGED
package/dist/esm/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export{default as StringUtils}from"./utils/StringUtils.js";export{BASE_COLORS,COLORS,DEFAULT_THEME,FONTS}from"./constants/Theme.js";export{CheckBox}from"./components/checkBox/CheckBox.js";export{ListItem}from"./components/list-item/ListItem.js";export{Pagination}from"./components/pagination/Pagination.js";export{RadioButton}from"./components/radioButton/RadioButton.js";export{Toaster}from"./components/toaster/Toaster.js";export{Tooltip}from"./components/tooltips/Tooltip.js";export{CustomisedTooltip,TooltipPlacement}from"./components/tooltips/CustomisedTooltip.js";export{Spinner}from"./components/spinner/Spinner.js";export{Stepper}from"./components/stepper/Stepper.js";export{Tag}from"./components/tag/Tag.js";export{IconButton}from"./components/icon-button/IconButton.js";import*as o from"./components/template-preview/constants/regexPatterns.js";export{o as regexPatterns};export{TemplatePreview}from"./components/template-preview/TemplatePreview.js";export{WhatsappLikePreview}from"./components/template-preview/WhatsApp/WhatsAppLikePreview.js";export{renderVariableUIForPreview}from"./components/template-preview/helpers/SmsTemplateHelper.js";export{WhatsAppFormatToHTML}from"./components/template-preview/helpers/WhatsAppFormatToHTML.js";export{FABMenu}from"./components/fab-menu/FABMenu.js";export{FloatingActionButton}from"./components/floating-action-button/FloatingActionButton.js";export{DROP_POSITION,DropdownToggleContainer,FAB_POSITION,FloatingActionButtonContainer,FloatingActionButtonOuterContainer,MENU_ALIGNMENT,StyledDropdown}from"./components/floating-action-button/FloatingActionButton.styles.js";export{ImageService}from"./components/image-compress/ImageCompress.js";export{BodyCaption,BodyLarge,BodyPrimary,BodyPrimaryLink,BodyRegular,BodySecondary,BodySecondaryLink,BodyTiny,ButtonLarge,ButtonRegular,Caption,Display,SubHeading,TitleLarge,TitleMedium,TitleRegular,TitleSmall}from"./components/TypographyStyle.js";export{Button}from"./components/button/Button.js";export{ProgressBarComponent,ProgressCompletedBar}from"./components/progress-bar/ProgressBarComponent.js";export{StyledModal}from"./components/modals/styledModal.js";
|
|
1
|
+
export{default as StringUtils}from"./utils/StringUtils.js";export{BASE_COLORS,COLORS,DEFAULT_THEME,FONTS}from"./constants/Theme.js";export{CheckBox}from"./components/checkBox/CheckBox.js";export{ListItem}from"./components/list-item/ListItem.js";export{Pagination}from"./components/pagination/Pagination.js";export{RadioButton}from"./components/radioButton/RadioButton.js";export{Toaster}from"./components/toaster/Toaster.js";export{Tooltip}from"./components/tooltips/Tooltip.js";export{CustomisedTooltip,TooltipPlacement}from"./components/tooltips/CustomisedTooltip.js";export{Spinner}from"./components/spinner/Spinner.js";export{Stepper}from"./components/stepper/Stepper.js";export{Tag}from"./components/tag/Tag.js";export{IconButton}from"./components/icon-button/IconButton.js";import*as o from"./components/template-preview/constants/regexPatterns.js";export{o as regexPatterns};export{TemplatePreview}from"./components/template-preview/TemplatePreview.js";export{WhatsappLikePreview}from"./components/template-preview/WhatsApp/WhatsAppLikePreview.js";export{renderVariableUIForPreview}from"./components/template-preview/helpers/SmsTemplateHelper.js";export{WhatsAppFormatToHTML}from"./components/template-preview/helpers/WhatsAppFormatToHTML.js";export{FABMenu}from"./components/fab-menu/FABMenu.js";export{FloatingActionButton}from"./components/floating-action-button/FloatingActionButton.js";export{DROP_POSITION,DropdownToggleContainer,FAB_POSITION,FloatingActionButtonContainer,FloatingActionButtonOuterContainer,MENU_ALIGNMENT,StyledDropdown}from"./components/floating-action-button/FloatingActionButton.styles.js";export{ImageService}from"./components/image-compress/ImageCompress.js";export{BodyCaption,BodyLarge,BodyPrimary,BodyPrimaryLink,BodyRegular,BodySecondary,BodySecondaryLink,BodyTiny,ButtonLarge,ButtonRegular,Caption,Display,SubHeading,TitleLarge,TitleMedium,TitleRegular,TitleSmall}from"./components/TypographyStyle.js";export{Button}from"./components/button/Button.js";export{ProgressBarComponent,ProgressCompletedBar}from"./components/progress-bar/ProgressBarComponent.js";export{StyledModal}from"./components/modals/styledModal.js";export{Dropdown}from"./components/dropdown/Dropdown.js";export{UnChildDropdown}from"./components/dropdown/UnChildDropdown/UnChildDropdown.js";export{OpennedDropdown}from"./components/dropdown/opennedDropdown/components/OpennedDropdown.js";export{Input}from"./components/input/Input.js";
|
package/package.json
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../constants/Theme.js"),s=require("../TypographyStyle.js"),r=require("./AnalyticsCard.styled.js");exports.AnalyticsCard=a=>{const{cardInfo:n,width:c,mode:i}=a;return e.jsx(r.AnalyticsContainer,Object.assign({width:c,mode:i,count:Object.keys(n).length},{children:Object.keys(n).map((c=>{const i=n[c],o=c;return e.jsxs(r.CardDataContainer,Object.assign({className:"analytics__card",count:Object.keys(n).length},{children:[e.jsx(s.TitleSmall,Object.assign({className:"statistic",color:"light"==a.mode?t.BASE_COLORS.brand[900]:t.BASE_COLORS.grayscale.white},{children:i})),e.jsx(s.BodyCaption,Object.assign({className:"category",color:"light"==a.mode?t.BASE_COLORS.brand[900]:t.COLORS.content.secondaryInverse},{children:o}))]}),o)}))}))};
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { ModeType } from './AnalyticsCard';
|
|
3
|
-
export declare const AnalyticsContainer: import("@emotion/styled").StyledComponent<{
|
|
4
|
-
theme?: import("@emotion/react").Theme | undefined;
|
|
5
|
-
as?: import("react").ElementType<any> | undefined;
|
|
6
|
-
} & {
|
|
7
|
-
width: string;
|
|
8
|
-
mode?: ModeType | undefined;
|
|
9
|
-
count?: number | undefined;
|
|
10
|
-
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
11
|
-
export declare const CardDataContainer: import("@emotion/styled").StyledComponent<{
|
|
12
|
-
theme?: import("@emotion/react").Theme | undefined;
|
|
13
|
-
as?: import("react").ElementType<any> | undefined;
|
|
14
|
-
} & {
|
|
15
|
-
count: number;
|
|
16
|
-
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var g=require("@emotion/styled/base"),I=require("../../constants/Theme.js");function c(g){return g&&"object"==typeof g&&"default"in g?g:{default:g}}var A=c(g);const C=A.default("div","production"===process.env.NODE_ENV?{target:"ednv6o21"}:{target:"ednv6o21",label:"AnalyticsContainer"})("display:flex;flex-wrap:wrap;row-gap:16px;align-items:center;justify-content:space-evenly;",(g=>g.width?`width: ${g.width}`:"width: 280px"),";background:",(g=>"light"==g.mode?I.BASE_COLORS.grayscale[100]:I.BASE_COLORS.brand[900]),";padding:26px 12px 16px 12px;border-radius:0 0 8px 8px;.analytics__card:nth-child(n + 4){",(g=>5==g.count?"flex-basis: 48%":6==g.count||7==g.count?"flex-basis: 31%":8==g.count?"flex-basis: 23%":""),";}.analytics__card:nth-child(4){",(g=>7==g.count?"flex-basis: 23% !important":""),";}"+("production"===process.env.NODE_ENV?"":"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkFuYWx5dGljc0NhcmQuc3R5bGVkLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFNkMiLCJmaWxlIjoiQW5hbHl0aWNzQ2FyZC5zdHlsZWQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xyXG5pbXBvcnQgeyBCQVNFX0NPTE9SUyB9IGZyb20gXCIuLi8uLi9jb25zdGFudHMvVGhlbWVcIjtcclxuZXhwb3J0IGNvbnN0IEFuYWx5dGljc0NvbnRhaW5lciA9IHN0eWxlZC5kaXYgYFxuXHRkaXNwbGF5OiBmbGV4O1xuXHRmbGV4LXdyYXA6IHdyYXA7XG5cdHJvdy1nYXA6IDE2cHg7XG5cdGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cdGp1c3RpZnktY29udGVudDogc3BhY2UtZXZlbmx5O1xuXG5cdCR7KHByb3BzKSA9PiAocHJvcHMud2lkdGggPyBgd2lkdGg6ICR7cHJvcHMud2lkdGh9YCA6ICd3aWR0aDogMjgwcHgnKX07XG5cdGJhY2tncm91bmQ6ICR7KHByb3BzKSA9PiBwcm9wcy5tb2RlID09ICdsaWdodCdcclxuICAgID8gQkFTRV9DT0xPUlMuZ3JheXNjYWxlWycxMDAnXVxyXG4gICAgOiBCQVNFX0NPTE9SUy5icmFuZFsnOTAwJ119O1xuXHRwYWRkaW5nOiAyNnB4IDEycHggMTZweCAxMnB4O1xuXHRib3JkZXItcmFkaXVzOiAwIDAgOHB4IDhweDtcblxuXHQuYW5hbHl0aWNzX19jYXJkOm50aC1jaGlsZChuICsgNCkge1xuXHRcdCR7KHByb3BzKSA9PiBwcm9wcy5jb3VudCA9PSA1XHJcbiAgICA/ICdmbGV4LWJhc2lzOiA0OCUnXHJcbiAgICA6IHByb3BzLmNvdW50ID09IDYgfHwgcHJvcHMuY291bnQgPT0gN1xyXG4gICAgICAgID8gJ2ZsZXgtYmFzaXM6IDMxJSdcclxuICAgICAgICA6IHByb3BzLmNvdW50ID09IDhcclxuICAgICAgICAgICAgPyAnZmxleC1iYXNpczogMjMlJ1xyXG4gICAgICAgICAgICA6ICcnfTtcblx0fVxuXG5cdC5hbmFseXRpY3NfX2NhcmQ6bnRoLWNoaWxkKDQpIHtcblx0XHQkeyhwcm9wcykgPT4gKHByb3BzLmNvdW50ID09IDcgPyAnZmxleC1iYXNpczogMjMlICFpbXBvcnRhbnQnIDogJycpfVxuXHR9XG5gO1xyXG5leHBvcnQgY29uc3QgQ2FyZERhdGFDb250YWluZXIgPSBzdHlsZWQuZGl2IGBcblx0ZGlzcGxheTogZmxleDtcblx0ZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcblx0YWxpZ24taXRlbXM6IGNlbnRlcjtcblx0anVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG5cdHJvdy1nYXA6IDRweDtcblxuXHRmbGV4LWdyb3c6IDE7XG5cdGZsZXgtc2hyaW5rOiAwO1xuXHRmbGV4LWJhc2lzOiAkeyhwcm9wcykgPT4gcHJvcHMuY291bnQgPT0gMlxyXG4gICAgPyAnNDglJ1xyXG4gICAgOiBwcm9wcy5jb3VudCA9PSAzXHJcbiAgICAgICAgPyAnMzElJ1xyXG4gICAgICAgIDogcHJvcHMuY291bnQgPT0gNFxyXG4gICAgICAgICAgICA/ICcyMyUnXHJcbiAgICAgICAgICAgIDogcHJvcHMuY291bnQgPT0gNVxyXG4gICAgICAgICAgICAgICAgPyAnMzElJ1xyXG4gICAgICAgICAgICAgICAgOiBwcm9wcy5jb3VudCA9PSA2XHJcbiAgICAgICAgICAgICAgICAgICAgPyAnMzElJ1xyXG4gICAgICAgICAgICAgICAgICAgIDogcHJvcHMuY291bnQgPT0gN1xyXG4gICAgICAgICAgICAgICAgICAgICAgICA/ICcyMyUnXHJcbiAgICAgICAgICAgICAgICAgICAgICAgIDogcHJvcHMuY291bnQgPT0gOFxyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgPyAnMjMlJ1xyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgOiAnYXV0byd9O1xuXG5cdC5jYXRlZ29yeSxcblx0LnN0YXRpc3RpYyB7XG5cdFx0bWF4LXdpZHRoOiAxMDAlO1xuXHRcdG92ZXJmbG93OiBoaWRkZW47XG5cdFx0d2hpdGUtc3BhY2U6IG5vd3JhcDtcblx0XHR0ZXh0LW92ZXJmbG93OiBlbGxpcHNpcztcblx0fVxuYDtcclxuLy8jIHNvdXJjZU1hcHBpbmdVUkw9QW5hbHl0aWNzQ2FyZC5zdHlsZWQuanMubWFwIl19 */")),l=A.default("div","production"===process.env.NODE_ENV?{target:"ednv6o20"}:{target:"ednv6o20",label:"CardDataContainer"})("display:flex;flex-direction:column;align-items:center;justify-content:center;row-gap:4px;flex-grow:1;flex-shrink:0;flex-basis:",(g=>2==g.count?"48%":3==g.count?"31%":4==g.count?"23%":5==g.count||6==g.count?"31%":7==g.count||8==g.count?"23%":"auto"),";.category,.statistic{max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}"+("production"===process.env.NODE_ENV?"":"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkFuYWx5dGljc0NhcmQuc3R5bGVkLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE4QjRDIiwiZmlsZSI6IkFuYWx5dGljc0NhcmQuc3R5bGVkLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcclxuaW1wb3J0IHsgQkFTRV9DT0xPUlMgfSBmcm9tIFwiLi4vLi4vY29uc3RhbnRzL1RoZW1lXCI7XHJcbmV4cG9ydCBjb25zdCBBbmFseXRpY3NDb250YWluZXIgPSBzdHlsZWQuZGl2IGBcblx0ZGlzcGxheTogZmxleDtcblx0ZmxleC13cmFwOiB3cmFwO1xuXHRyb3ctZ2FwOiAxNnB4O1xuXHRhbGlnbi1pdGVtczogY2VudGVyO1xuXHRqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWV2ZW5seTtcblxuXHQkeyhwcm9wcykgPT4gKHByb3BzLndpZHRoID8gYHdpZHRoOiAke3Byb3BzLndpZHRofWAgOiAnd2lkdGg6IDI4MHB4Jyl9O1xuXHRiYWNrZ3JvdW5kOiAkeyhwcm9wcykgPT4gcHJvcHMubW9kZSA9PSAnbGlnaHQnXHJcbiAgICA/IEJBU0VfQ09MT1JTLmdyYXlzY2FsZVsnMTAwJ11cclxuICAgIDogQkFTRV9DT0xPUlMuYnJhbmRbJzkwMCddfTtcblx0cGFkZGluZzogMjZweCAxMnB4IDE2cHggMTJweDtcblx0Ym9yZGVyLXJhZGl1czogMCAwIDhweCA4cHg7XG5cblx0LmFuYWx5dGljc19fY2FyZDpudGgtY2hpbGQobiArIDQpIHtcblx0XHQkeyhwcm9wcykgPT4gcHJvcHMuY291bnQgPT0gNVxyXG4gICAgPyAnZmxleC1iYXNpczogNDglJ1xyXG4gICAgOiBwcm9wcy5jb3VudCA9PSA2IHx8IHByb3BzLmNvdW50ID09IDdcclxuICAgICAgICA/ICdmbGV4LWJhc2lzOiAzMSUnXHJcbiAgICAgICAgOiBwcm9wcy5jb3VudCA9PSA4XHJcbiAgICAgICAgICAgID8gJ2ZsZXgtYmFzaXM6IDIzJSdcclxuICAgICAgICAgICAgOiAnJ307XG5cdH1cblxuXHQuYW5hbHl0aWNzX19jYXJkOm50aC1jaGlsZCg0KSB7XG5cdFx0JHsocHJvcHMpID0+IChwcm9wcy5jb3VudCA9PSA3ID8gJ2ZsZXgtYmFzaXM6IDIzJSAhaW1wb3J0YW50JyA6ICcnKX1cblx0fVxuYDtcclxuZXhwb3J0IGNvbnN0IENhcmREYXRhQ29udGFpbmVyID0gc3R5bGVkLmRpdiBgXG5cdGRpc3BsYXk6IGZsZXg7XG5cdGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG5cdGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cdGp1c3RpZnktY29udGVudDogY2VudGVyO1xuXHRyb3ctZ2FwOiA0cHg7XG5cblx0ZmxleC1ncm93OiAxO1xuXHRmbGV4LXNocmluazogMDtcblx0ZmxleC1iYXNpczogJHsocHJvcHMpID0+IHByb3BzLmNvdW50ID09IDJcclxuICAgID8gJzQ4JSdcclxuICAgIDogcHJvcHMuY291bnQgPT0gM1xyXG4gICAgICAgID8gJzMxJSdcclxuICAgICAgICA6IHByb3BzLmNvdW50ID09IDRcclxuICAgICAgICAgICAgPyAnMjMlJ1xyXG4gICAgICAgICAgICA6IHByb3BzLmNvdW50ID09IDVcclxuICAgICAgICAgICAgICAgID8gJzMxJSdcclxuICAgICAgICAgICAgICAgIDogcHJvcHMuY291bnQgPT0gNlxyXG4gICAgICAgICAgICAgICAgICAgID8gJzMxJSdcclxuICAgICAgICAgICAgICAgICAgICA6IHByb3BzLmNvdW50ID09IDdcclxuICAgICAgICAgICAgICAgICAgICAgICAgPyAnMjMlJ1xyXG4gICAgICAgICAgICAgICAgICAgICAgICA6IHByb3BzLmNvdW50ID09IDhcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgID8gJzIzJSdcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDogJ2F1dG8nfTtcblxuXHQuY2F0ZWdvcnksXG5cdC5zdGF0aXN0aWMge1xuXHRcdG1heC13aWR0aDogMTAwJTtcblx0XHRvdmVyZmxvdzogaGlkZGVuO1xuXHRcdHdoaXRlLXNwYWNlOiBub3dyYXA7XG5cdFx0dGV4dC1vdmVyZmxvdzogZWxsaXBzaXM7XG5cdH1cbmA7XHJcbi8vIyBzb3VyY2VNYXBwaW5nVVJMPUFuYWx5dGljc0NhcmQuc3R5bGVkLmpzLm1hcCJdfQ== */"));exports.AnalyticsContainer=C,exports.CardDataContainer=l;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{jsx as t,jsxs as e}from"react/jsx-runtime";import{BASE_COLORS as s,COLORS as c}from"../../constants/Theme.js";import{TitleSmall as r,BodyCaption as n}from"../TypographyStyle.js";import{AnalyticsContainer as o,CardDataContainer as a}from"./AnalyticsCard.styled.js";const i=i=>{const{cardInfo:l,width:m,mode:d}=i;return t(o,Object.assign({width:m,mode:d,count:Object.keys(l).length},{children:Object.keys(l).map((o=>{const m=l[o],d=o;return e(a,Object.assign({className:"analytics__card",count:Object.keys(l).length},{children:[t(r,Object.assign({className:"statistic",color:"light"==i.mode?s.brand[900]:s.grayscale.white},{children:m})),t(n,Object.assign({className:"category",color:"light"==i.mode?s.brand[900]:c.content.secondaryInverse},{children:d}))]}),d)}))}))};export{i as AnalyticsCard};
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { ModeType } from './AnalyticsCard';
|
|
3
|
-
export declare const AnalyticsContainer: import("@emotion/styled").StyledComponent<{
|
|
4
|
-
theme?: import("@emotion/react").Theme | undefined;
|
|
5
|
-
as?: import("react").ElementType<any> | undefined;
|
|
6
|
-
} & {
|
|
7
|
-
width: string;
|
|
8
|
-
mode?: ModeType | undefined;
|
|
9
|
-
count?: number | undefined;
|
|
10
|
-
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
11
|
-
export declare const CardDataContainer: import("@emotion/styled").StyledComponent<{
|
|
12
|
-
theme?: import("@emotion/react").Theme | undefined;
|
|
13
|
-
as?: import("react").ElementType<any> | undefined;
|
|
14
|
-
} & {
|
|
15
|
-
count: number;
|
|
16
|
-
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import g from"@emotion/styled/base";import{BASE_COLORS as I}from"../../constants/Theme.js";const c=g("div","production"===process.env.NODE_ENV?{target:"ednv6o21"}:{target:"ednv6o21",label:"AnalyticsContainer"})("display:flex;flex-wrap:wrap;row-gap:16px;align-items:center;justify-content:space-evenly;",(g=>g.width?`width: ${g.width}`:"width: 280px"),";background:",(g=>"light"==g.mode?I.grayscale[100]:I.brand[900]),";padding:26px 12px 16px 12px;border-radius:0 0 8px 8px;.analytics__card:nth-child(n + 4){",(g=>5==g.count?"flex-basis: 48%":6==g.count||7==g.count?"flex-basis: 31%":8==g.count?"flex-basis: 23%":""),";}.analytics__card:nth-child(4){",(g=>7==g.count?"flex-basis: 23% !important":""),";}"+("production"===process.env.NODE_ENV?"":"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkFuYWx5dGljc0NhcmQuc3R5bGVkLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFNkMiLCJmaWxlIjoiQW5hbHl0aWNzQ2FyZC5zdHlsZWQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xyXG5pbXBvcnQgeyBCQVNFX0NPTE9SUyB9IGZyb20gXCIuLi8uLi9jb25zdGFudHMvVGhlbWVcIjtcclxuZXhwb3J0IGNvbnN0IEFuYWx5dGljc0NvbnRhaW5lciA9IHN0eWxlZC5kaXYgYFxuXHRkaXNwbGF5OiBmbGV4O1xuXHRmbGV4LXdyYXA6IHdyYXA7XG5cdHJvdy1nYXA6IDE2cHg7XG5cdGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cdGp1c3RpZnktY29udGVudDogc3BhY2UtZXZlbmx5O1xuXG5cdCR7KHByb3BzKSA9PiAocHJvcHMud2lkdGggPyBgd2lkdGg6ICR7cHJvcHMud2lkdGh9YCA6ICd3aWR0aDogMjgwcHgnKX07XG5cdGJhY2tncm91bmQ6ICR7KHByb3BzKSA9PiBwcm9wcy5tb2RlID09ICdsaWdodCdcclxuICAgID8gQkFTRV9DT0xPUlMuZ3JheXNjYWxlWycxMDAnXVxyXG4gICAgOiBCQVNFX0NPTE9SUy5icmFuZFsnOTAwJ119O1xuXHRwYWRkaW5nOiAyNnB4IDEycHggMTZweCAxMnB4O1xuXHRib3JkZXItcmFkaXVzOiAwIDAgOHB4IDhweDtcblxuXHQuYW5hbHl0aWNzX19jYXJkOm50aC1jaGlsZChuICsgNCkge1xuXHRcdCR7KHByb3BzKSA9PiBwcm9wcy5jb3VudCA9PSA1XHJcbiAgICA/ICdmbGV4LWJhc2lzOiA0OCUnXHJcbiAgICA6IHByb3BzLmNvdW50ID09IDYgfHwgcHJvcHMuY291bnQgPT0gN1xyXG4gICAgICAgID8gJ2ZsZXgtYmFzaXM6IDMxJSdcclxuICAgICAgICA6IHByb3BzLmNvdW50ID09IDhcclxuICAgICAgICAgICAgPyAnZmxleC1iYXNpczogMjMlJ1xyXG4gICAgICAgICAgICA6ICcnfTtcblx0fVxuXG5cdC5hbmFseXRpY3NfX2NhcmQ6bnRoLWNoaWxkKDQpIHtcblx0XHQkeyhwcm9wcykgPT4gKHByb3BzLmNvdW50ID09IDcgPyAnZmxleC1iYXNpczogMjMlICFpbXBvcnRhbnQnIDogJycpfVxuXHR9XG5gO1xyXG5leHBvcnQgY29uc3QgQ2FyZERhdGFDb250YWluZXIgPSBzdHlsZWQuZGl2IGBcblx0ZGlzcGxheTogZmxleDtcblx0ZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcblx0YWxpZ24taXRlbXM6IGNlbnRlcjtcblx0anVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG5cdHJvdy1nYXA6IDRweDtcblxuXHRmbGV4LWdyb3c6IDE7XG5cdGZsZXgtc2hyaW5rOiAwO1xuXHRmbGV4LWJhc2lzOiAkeyhwcm9wcykgPT4gcHJvcHMuY291bnQgPT0gMlxyXG4gICAgPyAnNDglJ1xyXG4gICAgOiBwcm9wcy5jb3VudCA9PSAzXHJcbiAgICAgICAgPyAnMzElJ1xyXG4gICAgICAgIDogcHJvcHMuY291bnQgPT0gNFxyXG4gICAgICAgICAgICA/ICcyMyUnXHJcbiAgICAgICAgICAgIDogcHJvcHMuY291bnQgPT0gNVxyXG4gICAgICAgICAgICAgICAgPyAnMzElJ1xyXG4gICAgICAgICAgICAgICAgOiBwcm9wcy5jb3VudCA9PSA2XHJcbiAgICAgICAgICAgICAgICAgICAgPyAnMzElJ1xyXG4gICAgICAgICAgICAgICAgICAgIDogcHJvcHMuY291bnQgPT0gN1xyXG4gICAgICAgICAgICAgICAgICAgICAgICA/ICcyMyUnXHJcbiAgICAgICAgICAgICAgICAgICAgICAgIDogcHJvcHMuY291bnQgPT0gOFxyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgPyAnMjMlJ1xyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgOiAnYXV0byd9O1xuXG5cdC5jYXRlZ29yeSxcblx0LnN0YXRpc3RpYyB7XG5cdFx0bWF4LXdpZHRoOiAxMDAlO1xuXHRcdG92ZXJmbG93OiBoaWRkZW47XG5cdFx0d2hpdGUtc3BhY2U6IG5vd3JhcDtcblx0XHR0ZXh0LW92ZXJmbG93OiBlbGxpcHNpcztcblx0fVxuYDtcclxuLy8jIHNvdXJjZU1hcHBpbmdVUkw9QW5hbHl0aWNzQ2FyZC5zdHlsZWQuanMubWFwIl19 */")),A=g("div","production"===process.env.NODE_ENV?{target:"ednv6o20"}:{target:"ednv6o20",label:"CardDataContainer"})("display:flex;flex-direction:column;align-items:center;justify-content:center;row-gap:4px;flex-grow:1;flex-shrink:0;flex-basis:",(g=>2==g.count?"48%":3==g.count?"31%":4==g.count?"23%":5==g.count||6==g.count?"31%":7==g.count||8==g.count?"23%":"auto"),";.category,.statistic{max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}"+("production"===process.env.NODE_ENV?"":"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkFuYWx5dGljc0NhcmQuc3R5bGVkLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE4QjRDIiwiZmlsZSI6IkFuYWx5dGljc0NhcmQuc3R5bGVkLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcclxuaW1wb3J0IHsgQkFTRV9DT0xPUlMgfSBmcm9tIFwiLi4vLi4vY29uc3RhbnRzL1RoZW1lXCI7XHJcbmV4cG9ydCBjb25zdCBBbmFseXRpY3NDb250YWluZXIgPSBzdHlsZWQuZGl2IGBcblx0ZGlzcGxheTogZmxleDtcblx0ZmxleC13cmFwOiB3cmFwO1xuXHRyb3ctZ2FwOiAxNnB4O1xuXHRhbGlnbi1pdGVtczogY2VudGVyO1xuXHRqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWV2ZW5seTtcblxuXHQkeyhwcm9wcykgPT4gKHByb3BzLndpZHRoID8gYHdpZHRoOiAke3Byb3BzLndpZHRofWAgOiAnd2lkdGg6IDI4MHB4Jyl9O1xuXHRiYWNrZ3JvdW5kOiAkeyhwcm9wcykgPT4gcHJvcHMubW9kZSA9PSAnbGlnaHQnXHJcbiAgICA/IEJBU0VfQ09MT1JTLmdyYXlzY2FsZVsnMTAwJ11cclxuICAgIDogQkFTRV9DT0xPUlMuYnJhbmRbJzkwMCddfTtcblx0cGFkZGluZzogMjZweCAxMnB4IDE2cHggMTJweDtcblx0Ym9yZGVyLXJhZGl1czogMCAwIDhweCA4cHg7XG5cblx0LmFuYWx5dGljc19fY2FyZDpudGgtY2hpbGQobiArIDQpIHtcblx0XHQkeyhwcm9wcykgPT4gcHJvcHMuY291bnQgPT0gNVxyXG4gICAgPyAnZmxleC1iYXNpczogNDglJ1xyXG4gICAgOiBwcm9wcy5jb3VudCA9PSA2IHx8IHByb3BzLmNvdW50ID09IDdcclxuICAgICAgICA/ICdmbGV4LWJhc2lzOiAzMSUnXHJcbiAgICAgICAgOiBwcm9wcy5jb3VudCA9PSA4XHJcbiAgICAgICAgICAgID8gJ2ZsZXgtYmFzaXM6IDIzJSdcclxuICAgICAgICAgICAgOiAnJ307XG5cdH1cblxuXHQuYW5hbHl0aWNzX19jYXJkOm50aC1jaGlsZCg0KSB7XG5cdFx0JHsocHJvcHMpID0+IChwcm9wcy5jb3VudCA9PSA3ID8gJ2ZsZXgtYmFzaXM6IDIzJSAhaW1wb3J0YW50JyA6ICcnKX1cblx0fVxuYDtcclxuZXhwb3J0IGNvbnN0IENhcmREYXRhQ29udGFpbmVyID0gc3R5bGVkLmRpdiBgXG5cdGRpc3BsYXk6IGZsZXg7XG5cdGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG5cdGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cdGp1c3RpZnktY29udGVudDogY2VudGVyO1xuXHRyb3ctZ2FwOiA0cHg7XG5cblx0ZmxleC1ncm93OiAxO1xuXHRmbGV4LXNocmluazogMDtcblx0ZmxleC1iYXNpczogJHsocHJvcHMpID0+IHByb3BzLmNvdW50ID09IDJcclxuICAgID8gJzQ4JSdcclxuICAgIDogcHJvcHMuY291bnQgPT0gM1xyXG4gICAgICAgID8gJzMxJSdcclxuICAgICAgICA6IHByb3BzLmNvdW50ID09IDRcclxuICAgICAgICAgICAgPyAnMjMlJ1xyXG4gICAgICAgICAgICA6IHByb3BzLmNvdW50ID09IDVcclxuICAgICAgICAgICAgICAgID8gJzMxJSdcclxuICAgICAgICAgICAgICAgIDogcHJvcHMuY291bnQgPT0gNlxyXG4gICAgICAgICAgICAgICAgICAgID8gJzMxJSdcclxuICAgICAgICAgICAgICAgICAgICA6IHByb3BzLmNvdW50ID09IDdcclxuICAgICAgICAgICAgICAgICAgICAgICAgPyAnMjMlJ1xyXG4gICAgICAgICAgICAgICAgICAgICAgICA6IHByb3BzLmNvdW50ID09IDhcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgID8gJzIzJSdcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDogJ2F1dG8nfTtcblxuXHQuY2F0ZWdvcnksXG5cdC5zdGF0aXN0aWMge1xuXHRcdG1heC13aWR0aDogMTAwJTtcblx0XHRvdmVyZmxvdzogaGlkZGVuO1xuXHRcdHdoaXRlLXNwYWNlOiBub3dyYXA7XG5cdFx0dGV4dC1vdmVyZmxvdzogZWxsaXBzaXM7XG5cdH1cbmA7XHJcbi8vIyBzb3VyY2VNYXBwaW5nVVJMPUFuYWx5dGljc0NhcmQuc3R5bGVkLmpzLm1hcCJdfQ== */"));export{c as AnalyticsContainer,A as CardDataContainer};
|