@bikdotai/bik-component-library 0.0.773-beta.4 → 0.0.773-temp
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/ProgressChecklist/ProgressChecklist.d.ts +0 -2
- package/dist/cjs/components/ProgressChecklist/ProgressChecklist.js +1 -1
- package/dist/cjs/components/TablePagination/TablePagination.d.ts +1 -0
- package/dist/cjs/components/TablePagination/TablePagination.js +1 -1
- package/dist/cjs/components/side-modal/SideModal.style.js +7 -7
- package/dist/esm/components/ProgressChecklist/ProgressChecklist.d.ts +0 -2
- package/dist/esm/components/ProgressChecklist/ProgressChecklist.js +1 -1
- package/dist/esm/components/TablePagination/TablePagination.d.ts +1 -0
- package/dist/esm/components/TablePagination/TablePagination.js +1 -1
- package/dist/esm/components/side-modal/SideModal.style.js +4 -4
- package/package.json +1 -1
|
@@ -32,8 +32,6 @@ export interface SingleChecklistItemType {
|
|
|
32
32
|
buttonDisabled?: boolean;
|
|
33
33
|
hideRedirectButton?: boolean;
|
|
34
34
|
hideSetupButton?: boolean;
|
|
35
|
-
/** Custom node to render in place of the default setup button. */
|
|
36
|
-
customSetupButton?: React.ReactNode;
|
|
37
35
|
}
|
|
38
36
|
export interface MultiChecklistItemType {
|
|
39
37
|
id: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/ActiveChecklistIcon.js"),s=require("../../assets/icons/CompletedChecklistIcon.js"),i=require("../../assets/icons/InactiveChecklistIcon.js");require("../../_virtual/_tslib.js");var r=require("../../assets/icons/chevronRight.svg.js"),l=require("../../assets/icons/info.svg.js"),n=require("react"),o=require("../../constants/Theme.js"),c=require("../alerts/Alert.js"),a=require("../alerts/AlertHelper.js"),d=require("../button/Button.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/ActiveChecklistIcon.js"),s=require("../../assets/icons/CompletedChecklistIcon.js"),i=require("../../assets/icons/InactiveChecklistIcon.js");require("../../_virtual/_tslib.js");var r=require("../../assets/icons/chevronRight.svg.js"),l=require("../../assets/icons/info.svg.js"),n=require("react"),o=require("../../constants/Theme.js"),c=require("../alerts/Alert.js"),a=require("../alerts/AlertHelper.js"),d=require("../button/Button.js"),g=require("../progress-bar-v2/ProgressBarV2.js"),p=require("../tag/Tag.js"),u=require("../tooltips/Tooltip.js"),j=require("../TypographyStyle.js"),h=require("./MultiChecklistItem.js"),x=require("./ProgressChecklist.style.js"),C=require("./ProgressStepper.js");exports.default=v=>{let{header:y,subheader:b,items:m=[],progressBarColor:T,headerAction:f,showProgressBar:S=!0,noBorder:O=!1}=v;const[k,A]=n.useState(m);n.useEffect((()=>{A(m)}),[m]);const I=k.filter((e=>e.isCompleted)).length,q=k.length,B=q>0?I/q*100:0;return e.jsxs(x.ProgressChecklistContainer,Object.assign({noBorder:O},{children:[e.jsxs(x.HeaderSection,{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"space-between",alignItems:"center"}},{children:[e.jsx(j.TitleMedium,{children:y}),f&&e.jsx("div",{children:f})]})),e.jsx(j.BodySecondary,Object.assign({color:o.COLORS.content.secondary},{children:b}))]}),S&&e.jsxs(x.ProgressBarSection,Object.assign({style:{display:"flex",alignItems:"center",gap:"16px"}},{children:[e.jsx("div",Object.assign({style:{flex:1}},{children:e.jsx(g.ProgressBarV2,{progress:Math.round(B),type:g.ProgressBarType.LINE,matchParentWidth:!0,showProgress:!1,color:null!=T?T:o.COLORS.background.positive.vibrant,progressBarThickness:12})})),e.jsx("div",Object.assign({style:{display:"flex",justifyContent:"flex-end",alignItems:"center",minWidth:12}},{children:e.jsxs(j.TitleSmall,Object.assign({style:{color:o.COLORS.content.secondary,textAlign:"right"}},{children:[I," / ",q]}))}))]})),e.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"16px"}},{children:k.map((n=>{var g,j,v,y,b,m,T,f;if("single"===n.type)return e.jsxs(x.SingleChecklistItem,Object.assign({isActive:n.isActive||!1},{children:[e.jsxs(x.SingleChecklistMainRow,{children:[e.jsx(x.SingleChecklistIconWrapper,{children:n.isCompleted?null!==(g=n.completedIcon)&&void 0!==g?g:e.jsx(s.CompletedChecklistIcon,{}):n.isActive?null!==(j=n.activeIcon)&&void 0!==j?j:e.jsx(t.ActiveChecklistIcon,{}):null!==(v=n.icon)&&void 0!==v?v:e.jsx(i.InactiveChecklistIcon,{})}),e.jsxs(x.SingleChecklistContent,{children:[e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",gap:12}},{children:[e.jsx(x.SingleChecklistHeader,Object.assign({completed:!!n.isCompleted,isActive:!!n.isActive},{children:n.header})),(null===(y=n.tag)||void 0===y?void 0:y.tagText)&&(n.tag.tooltip?e.jsx(u.Tooltip,Object.assign({},n.tag.tooltip,{children:e.jsx("span",Object.assign({style:{display:"inline-flex"}},{children:e.jsx(p.Tag,{tagText:n.tag.tagText,variant:n.tag.variant,type:n.tag.type,theme:n.tag.theme})}))})):e.jsx(p.Tag,{tagText:n.tag.tagText,variant:n.tag.variant,type:n.tag.type,theme:n.tag.theme}))]})),e.jsx(x.SingleChecklistSubheader,{children:n.subheader})]}),n.isCompleted&&!n.hideRedirectButton&&e.jsx("div",Object.assign({onClick:n.onSetup,style:{cursor:"pointer"}},{children:e.jsx(r.default,{style:{marginLeft:"12px"},width:12,height:12,color:o.COLORS.content.secondary})})),!n.isCompleted&&n.isActive&&!n.hideSetupButton&&e.jsx(x.SingleChecklistActionWrapper,{children:e.jsx(d.Button,{buttonText:null!==(b=n.buttonText)&&void 0!==b?b:"Setup",buttonType:null!==(m=n.buttonType)&&void 0!==m?m:"primary",onClick:n.onSetup,disabled:null!==(T=n.buttonDisabled)&&void 0!==T&&T})})]}),n.alertText&&e.jsx(x.SingleChecklistAlertRow,{children:e.jsx(c.Alert,{text:n.alertText,type:null!==(f=n.alertType)&&void 0!==f?f:a.ALERT_TYPES.WARNING,contentPosition:a.CONTENT_POSITION.START,textColor:n.alertType===a.ALERT_TYPES.BRAND?"#4B1583":"",icon:t=>e.jsx(l.default,Object.assign({},t))})})]}),n.id);if("multiple"===n.type){const t=n.steps&&n.steps.length>0?n.steps.map(((e,t)=>{var s;return{id:null!==(s=e.id)&&void 0!==s?s:`${n.id}-sub-${t+1}`,text:e.text,label:e.text,onClick:e.onClick,isCompleted:!!e.isCompleted}})):[{id:`${n.id}-sub-1`,text:"Connect",label:"Connect",isCompleted:!1},{id:`${n.id}-sub-2`,text:"Configure",label:"Configure",isCompleted:!1},{id:`${n.id}-sub-3`,text:"Verify",label:"Verify",isCompleted:!1}];return e.jsx(h.default,Object.assign({item:n},{children:e.jsx(C.default,{steps:t,isStepperActive:n.isActive})}),n.id)}}))}))]}))};
|
|
@@ -8,6 +8,7 @@ export type TablePaginationProps = {
|
|
|
8
8
|
updatePageNumber: (pageNumber: number) => void;
|
|
9
9
|
updatePageSize: (option: DropdownOption | DropdownOption[]) => void;
|
|
10
10
|
showTotalText?: boolean;
|
|
11
|
+
showTotalTextLeftAligned?: boolean;
|
|
11
12
|
removeBorder?: boolean;
|
|
12
13
|
containerStyle?: React.CSSProperties;
|
|
13
14
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("../../assets/icons/chevronLeft.svg.js"),o=require("../../assets/icons/chevronRight.svg.js");require("../dropdown/DropdownPopover/index.js");var r=require("../dropdown/Dropdown.js");require("../dropdown/ChipDropdown.js"),require("react"),require("../zeroState/ZeroState.js"),require("lodash/debounce");var t=require("../TypographyStyle.js"),s=require("../../constants/Theme.js");require("../dropdown/OpenedDropdown/components/description/Description.styled.js"),require("../checkBox/CheckBox.styled.js"),require("../list-item/ListItem.js"),require("../dropdown/OpenedDropdown/components/menu/FreeFormMenu.styled.js"),require("../dropdown/OpenedDropdown/components/menu/MenuItem.js"),require("../dropdown/OpenedDropdown/components/menu/MenuList.styled.js"),require("../button/Button.js"),require("../dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js"),require("../dropdown/OpenedDropdown/components/OpennedDropdown.styled.js"),require("../icon-button/IconButton.js"),require("../input/Input.js"),require("../dropdown/MenuItem/MenuItem.js");var i=require("./TablePagination.styled.js");exports.TablePagination=d=>{let{pageNumber:a,pageSize:l,totalRows:c,updatePageNumber:p,updatePageSize:u,hidePageSizeOptions:j,showTotalText:g,containerStyle:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("../../assets/icons/chevronLeft.svg.js"),o=require("../../assets/icons/chevronRight.svg.js");require("../dropdown/DropdownPopover/index.js");var r=require("../dropdown/Dropdown.js");require("../dropdown/ChipDropdown.js"),require("react"),require("../zeroState/ZeroState.js"),require("lodash/debounce");var t=require("../TypographyStyle.js"),s=require("../../constants/Theme.js");require("../dropdown/OpenedDropdown/components/description/Description.styled.js"),require("../checkBox/CheckBox.styled.js"),require("../list-item/ListItem.js"),require("../dropdown/OpenedDropdown/components/menu/FreeFormMenu.styled.js"),require("../dropdown/OpenedDropdown/components/menu/MenuItem.js"),require("../dropdown/OpenedDropdown/components/menu/MenuList.styled.js"),require("../button/Button.js"),require("../dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js"),require("../dropdown/OpenedDropdown/components/OpennedDropdown.styled.js"),require("../icon-button/IconButton.js"),require("../input/Input.js"),require("../dropdown/MenuItem/MenuItem.js");var i=require("./TablePagination.styled.js");exports.TablePagination=d=>{let{pageNumber:a,pageSize:l,totalRows:c,updatePageNumber:p,updatePageSize:u,hidePageSizeOptions:j,showTotalText:g,showTotalTextLeftAligned:h,containerStyle:w={}}=d;const y=s.DEFAULT_THEME.colorsV2,m=(a-1)*l+1,b=(a-1)*l+l,q=Math.ceil(c/l),x=1==q;let v=[];v=q>=5?a===q?[a-4,a-3,a-2,a-1,a]:1===a?[a,a+1,a+2,a+3,a+4]:2===a?[a-1,a,a+1,a+2,a+3]:a===q-1?[a-3,a-2,a-1,a,a+1]:[a-2,a-1,a,a+1,a+2]:Array.from({length:q},((e,n)=>n+1));const S=[{label:"5 rows per page",value:"5",selected:5===l},{label:"10 rows per page",value:"10",selected:10===l},{label:"20 rows per page",value:"20",selected:20===l}];return e.jsxs(i.StyledTablePaginationContainer,Object.assign({style:w},{children:[!j&&e.jsx("div",{children:e.jsx(r.Dropdown,{size:"small",options:S,onSelect:u,width:"162px"})}),e.jsxs("div",Object.assign({className:"paging__container"},{children:[(!j&&c||j&&c&&g&&h)&&e.jsxs(t.BodySecondary,Object.assign({style:{color:y.content.placeholder}},{children:["Showing ",m,"-",b>c?c:b," of"," ",c," results"]})),e.jsxs("div",Object.assign({className:"pages__buttons-container"},{children:[!x&&e.jsx(i.StyledPagingContainer,Object.assign({active:!1,onClick:()=>{1!==a&&p(Math.max(a-1,1))},disabled:1===a},{children:e.jsx(n.default,{color:y.content.secondary,height:14,width:14})})),v.map((n=>e.jsx(i.StyledPagingContainer,Object.assign({active:n==a,onClick:()=>p(n),style:{display:1==n&&c<=l?"none":"flex"}},{children:e.jsx(t.BodySecondary,Object.assign({style:{color:n==a?y.content.primaryInverse:y.content.secondary}},{children:n}))}),n))),!x&&e.jsx(i.StyledPagingContainer,Object.assign({isLast:!0,active:!1,onClick:()=>{a!==q&&p(Math.min(a+1,q))},disabled:a===q},{children:e.jsx(o.default,{color:y.content.secondary,height:14,width:14})}))]})),j&&c&&g&&!h&&e.jsxs(t.BodySecondary,Object.assign({style:{color:y.content.placeholder}},{children:["Showing ",m,"-",b>c?c:b," of"," ",c," results"]}))]}))]}))};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../constants/Theme.js"),o=require("../../constants/zindex.js");function
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../constants/Theme.js"),o=require("../../constants/zindex.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=r(e);const d=i.default.div`
|
|
2
2
|
position: fixed;
|
|
3
3
|
top: 0;
|
|
4
4
|
left: 0;
|
|
@@ -9,14 +9,14 @@
|
|
|
9
9
|
display: flex;
|
|
10
10
|
align-items: center;
|
|
11
11
|
justify-content: flex-end;
|
|
12
|
-
`,n=
|
|
12
|
+
`,n=i.default.div`
|
|
13
13
|
height: 100%;
|
|
14
14
|
width: ${e=>e.width||"566px"};
|
|
15
15
|
background: ${t.COLORS.surface.standard};
|
|
16
16
|
position: relative;
|
|
17
17
|
display: flex;
|
|
18
18
|
flex-direction: column;
|
|
19
|
-
`,a=
|
|
19
|
+
`,a=i.default.div`
|
|
20
20
|
width: 100%;
|
|
21
21
|
height: 60px;
|
|
22
22
|
position: sticky;
|
|
@@ -34,16 +34,16 @@
|
|
|
34
34
|
border-radius: 4px;
|
|
35
35
|
}
|
|
36
36
|
${t=>{let{headerStyle:o}=t;return e.css`
|
|
37
|
-
${Object.keys(o).map((e=>`${e}: ${o[e]};`)).join("\n")}
|
|
37
|
+
${Object.keys(o).map((e=>`${e.replace(/[A-Z]/g,(e=>`-${e.toLowerCase()}`))}: ${o[e]};`)).join("\n")}
|
|
38
38
|
`}}
|
|
39
|
-
`,s=
|
|
39
|
+
`,s=i.default.div`
|
|
40
40
|
overflow-y: auto;
|
|
41
41
|
padding: 24px;
|
|
42
42
|
height: ${e=>e.hideFooter?"calc(100% - 60px)":"calc(100% - 120px)"};
|
|
43
43
|
${t=>{let{bodyStyle:o}=t;return e.css`
|
|
44
44
|
${Object.keys(o).map((e=>`${e}: ${o[e]};`)).join("\n")}
|
|
45
45
|
`}}
|
|
46
|
-
`,p=
|
|
46
|
+
`,p=i.default.div`
|
|
47
47
|
height: 60px;
|
|
48
48
|
width: 100%;
|
|
49
49
|
position: sticky;
|
|
@@ -58,7 +58,7 @@
|
|
|
58
58
|
${t=>{let{footerStyle:o}=t;return e.css`
|
|
59
59
|
${Object.keys(o).map((e=>`${e}: ${o[e]};`)).join("\n")}
|
|
60
60
|
`}}
|
|
61
|
-
`,l=
|
|
61
|
+
`,l=i.default.div`
|
|
62
62
|
display: flex;
|
|
63
63
|
flex-direction: ${e=>e.footerDirection||"row"};
|
|
64
64
|
gap: 8px;
|
|
@@ -32,8 +32,6 @@ export interface SingleChecklistItemType {
|
|
|
32
32
|
buttonDisabled?: boolean;
|
|
33
33
|
hideRedirectButton?: boolean;
|
|
34
34
|
hideSetupButton?: boolean;
|
|
35
|
-
/** Custom node to render in place of the default setup button. */
|
|
36
|
-
customSetupButton?: React.ReactNode;
|
|
37
35
|
}
|
|
38
36
|
export interface MultiChecklistItemType {
|
|
39
37
|
id: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{ActiveChecklistIcon as i}from"../../assets/icons/ActiveChecklistIcon.js";import{CompletedChecklistIcon as s}from"../../assets/icons/CompletedChecklistIcon.js";import{InactiveChecklistIcon as
|
|
1
|
+
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{ActiveChecklistIcon as i}from"../../assets/icons/ActiveChecklistIcon.js";import{CompletedChecklistIcon as s}from"../../assets/icons/CompletedChecklistIcon.js";import{InactiveChecklistIcon as r}from"../../assets/icons/InactiveChecklistIcon.js";import"../../_virtual/_tslib.js";import o from"../../assets/icons/chevronRight.svg.js";import n from"../../assets/icons/info.svg.js";import{useState as l,useEffect as c}from"react";import{COLORS as a}from"../../constants/Theme.js";import{Alert as d}from"../alerts/Alert.js";import{ALERT_TYPES as p,CONTENT_POSITION as m}from"../alerts/AlertHelper.js";import{Button as g}from"../button/Button.js";import{ProgressBarV2 as h,ProgressBarType as u}from"../progress-bar-v2/ProgressBarV2.js";import{Tag as v}from"../tag/Tag.js";import{Tooltip as f}from"../tooltips/Tooltip.js";import{TitleMedium as y,BodySecondary as b,TitleSmall as j}from"../TypographyStyle.js";import x from"./MultiChecklistItem.js";import{ProgressChecklistContainer as C,HeaderSection as T,ProgressBarSection as A,SingleChecklistItem as O,SingleChecklistMainRow as I,SingleChecklistIconWrapper as k,SingleChecklistContent as B,SingleChecklistHeader as S,SingleChecklistSubheader as P,SingleChecklistActionWrapper as w,SingleChecklistAlertRow as R}from"./ProgressChecklist.style.js";import $ from"./ProgressStepper.js";const D=D=>{let{header:N,subheader:V,items:W=[],progressBarColor:L,headerAction:M,showProgressBar:_=!0,noBorder:E=!1}=D;const[G,H]=l(W);c((()=>{H(W)}),[W]);const q=G.filter((e=>e.isCompleted)).length,z=G.length,F=z>0?q/z*100:0;return e(C,Object.assign({noBorder:E},{children:[e(T,{children:[e("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"space-between",alignItems:"center"}},{children:[t(y,{children:N}),M&&t("div",{children:M})]})),t(b,Object.assign({color:a.content.secondary},{children:V}))]}),_&&e(A,Object.assign({style:{display:"flex",alignItems:"center",gap:"16px"}},{children:[t("div",Object.assign({style:{flex:1}},{children:t(h,{progress:Math.round(F),type:u.LINE,matchParentWidth:!0,showProgress:!1,color:null!=L?L:a.background.positive.vibrant,progressBarThickness:12})})),t("div",Object.assign({style:{display:"flex",justifyContent:"flex-end",alignItems:"center",minWidth:12}},{children:e(j,Object.assign({style:{color:a.content.secondary,textAlign:"right"}},{children:[q," / ",z]}))}))]})),t("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"16px"}},{children:G.map((l=>{var c,h,u,y,b,j,C,T;if("single"===l.type)return e(O,Object.assign({isActive:l.isActive||!1},{children:[e(I,{children:[t(k,{children:l.isCompleted?null!==(c=l.completedIcon)&&void 0!==c?c:t(s,{}):l.isActive?null!==(h=l.activeIcon)&&void 0!==h?h:t(i,{}):null!==(u=l.icon)&&void 0!==u?u:t(r,{})}),e(B,{children:[e("div",Object.assign({style:{display:"flex",alignItems:"center",gap:12}},{children:[t(S,Object.assign({completed:!!l.isCompleted,isActive:!!l.isActive},{children:l.header})),(null===(y=l.tag)||void 0===y?void 0:y.tagText)&&(l.tag.tooltip?t(f,Object.assign({},l.tag.tooltip,{children:t("span",Object.assign({style:{display:"inline-flex"}},{children:t(v,{tagText:l.tag.tagText,variant:l.tag.variant,type:l.tag.type,theme:l.tag.theme})}))})):t(v,{tagText:l.tag.tagText,variant:l.tag.variant,type:l.tag.type,theme:l.tag.theme}))]})),t(P,{children:l.subheader})]}),l.isCompleted&&!l.hideRedirectButton&&t("div",Object.assign({onClick:l.onSetup,style:{cursor:"pointer"}},{children:t(o,{style:{marginLeft:"12px"},width:12,height:12,color:a.content.secondary})})),!l.isCompleted&&l.isActive&&!l.hideSetupButton&&t(w,{children:t(g,{buttonText:null!==(b=l.buttonText)&&void 0!==b?b:"Setup",buttonType:null!==(j=l.buttonType)&&void 0!==j?j:"primary",onClick:l.onSetup,disabled:null!==(C=l.buttonDisabled)&&void 0!==C&&C})})]}),l.alertText&&t(R,{children:t(d,{text:l.alertText,type:null!==(T=l.alertType)&&void 0!==T?T:p.WARNING,contentPosition:m.START,textColor:l.alertType===p.BRAND?"#4B1583":"",icon:e=>t(n,Object.assign({},e))})})]}),l.id);if("multiple"===l.type){const e=l.steps&&l.steps.length>0?l.steps.map(((e,t)=>{var i;return{id:null!==(i=e.id)&&void 0!==i?i:`${l.id}-sub-${t+1}`,text:e.text,label:e.text,onClick:e.onClick,isCompleted:!!e.isCompleted}})):[{id:`${l.id}-sub-1`,text:"Connect",label:"Connect",isCompleted:!1},{id:`${l.id}-sub-2`,text:"Configure",label:"Configure",isCompleted:!1},{id:`${l.id}-sub-3`,text:"Verify",label:"Verify",isCompleted:!1}];return t(x,Object.assign({item:l},{children:t($,{steps:e,isStepperActive:l.isActive})}),l.id)}}))}))]}))};export{D as default};
|
|
@@ -8,6 +8,7 @@ export type TablePaginationProps = {
|
|
|
8
8
|
updatePageNumber: (pageNumber: number) => void;
|
|
9
9
|
updatePageSize: (option: DropdownOption | DropdownOption[]) => void;
|
|
10
10
|
showTotalText?: boolean;
|
|
11
|
+
showTotalTextLeftAligned?: boolean;
|
|
11
12
|
removeBorder?: boolean;
|
|
12
13
|
containerStyle?: React.CSSProperties;
|
|
13
14
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as o}from"react/jsx-runtime";import t from"../../assets/icons/chevronLeft.svg.js";import n from"../../assets/icons/chevronRight.svg.js";import"../dropdown/DropdownPopover/index.js";import{Dropdown as s}from"../dropdown/Dropdown.js";import"../dropdown/ChipDropdown.js";import"react";import"../zeroState/ZeroState.js";import"lodash/debounce";import{BodySecondary as r}from"../TypographyStyle.js";import{DEFAULT_THEME as i}from"../../constants/Theme.js";import"../dropdown/OpenedDropdown/components/description/Description.styled.js";import"../checkBox/CheckBox.styled.js";import"../list-item/ListItem.js";import"../dropdown/OpenedDropdown/components/menu/FreeFormMenu.styled.js";import"../dropdown/OpenedDropdown/components/menu/MenuItem.js";import"../dropdown/OpenedDropdown/components/menu/MenuList.styled.js";import"../button/Button.js";import"../dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js";import"../dropdown/OpenedDropdown/components/OpennedDropdown.styled.js";import"../icon-button/IconButton.js";import"../input/Input.js";import"../dropdown/MenuItem/MenuItem.js";import{StyledTablePaginationContainer as p,StyledPagingContainer as d}from"./TablePagination.styled.js";const c=c=>{let{pageNumber:l,pageSize:a,totalRows:m,updatePageNumber:h,updatePageSize:
|
|
1
|
+
import{jsxs as e,jsx as o}from"react/jsx-runtime";import t from"../../assets/icons/chevronLeft.svg.js";import n from"../../assets/icons/chevronRight.svg.js";import"../dropdown/DropdownPopover/index.js";import{Dropdown as s}from"../dropdown/Dropdown.js";import"../dropdown/ChipDropdown.js";import"react";import"../zeroState/ZeroState.js";import"lodash/debounce";import{BodySecondary as r}from"../TypographyStyle.js";import{DEFAULT_THEME as i}from"../../constants/Theme.js";import"../dropdown/OpenedDropdown/components/description/Description.styled.js";import"../checkBox/CheckBox.styled.js";import"../list-item/ListItem.js";import"../dropdown/OpenedDropdown/components/menu/FreeFormMenu.styled.js";import"../dropdown/OpenedDropdown/components/menu/MenuItem.js";import"../dropdown/OpenedDropdown/components/menu/MenuList.styled.js";import"../button/Button.js";import"../dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js";import"../dropdown/OpenedDropdown/components/OpennedDropdown.styled.js";import"../icon-button/IconButton.js";import"../input/Input.js";import"../dropdown/MenuItem/MenuItem.js";import{StyledTablePaginationContainer as p,StyledPagingContainer as d}from"./TablePagination.styled.js";const c=c=>{let{pageNumber:l,pageSize:a,totalRows:m,updatePageNumber:h,updatePageSize:w,hidePageSizeOptions:g,showTotalText:j,showTotalTextLeftAligned:u,containerStyle:y={}}=c;const b=i.colorsV2,O=(l-1)*a+1,v=(l-1)*a+a,f=Math.ceil(m/a),D=1==f;let S=[];S=f>=5?l===f?[l-4,l-3,l-2,l-1,l]:1===l?[l,l+1,l+2,l+3,l+4]:2===l?[l-1,l,l+1,l+2,l+3]:l===f-1?[l-3,l-2,l-1,l,l+1]:[l-2,l-1,l,l+1,l+2]:Array.from({length:f},((e,o)=>o+1));const x=[{label:"5 rows per page",value:"5",selected:5===a},{label:"10 rows per page",value:"10",selected:10===a},{label:"20 rows per page",value:"20",selected:20===a}];return e(p,Object.assign({style:y},{children:[!g&&o("div",{children:o(s,{size:"small",options:x,onSelect:w,width:"162px"})}),e("div",Object.assign({className:"paging__container"},{children:[(!g&&m||g&&m&&j&&u)&&e(r,Object.assign({style:{color:b.content.placeholder}},{children:["Showing ",O,"-",v>m?m:v," of"," ",m," results"]})),e("div",Object.assign({className:"pages__buttons-container"},{children:[!D&&o(d,Object.assign({active:!1,onClick:()=>{1!==l&&h(Math.max(l-1,1))},disabled:1===l},{children:o(t,{color:b.content.secondary,height:14,width:14})})),S.map((e=>o(d,Object.assign({active:e==l,onClick:()=>h(e),style:{display:1==e&&m<=a?"none":"flex"}},{children:o(r,Object.assign({style:{color:e==l?b.content.primaryInverse:b.content.secondary}},{children:e}))}),e))),!D&&o(d,Object.assign({isLast:!0,active:!1,onClick:()=>{l!==f&&h(Math.min(l+1,f))},disabled:l===f},{children:o(n,{color:b.content.secondary,height:14,width:14})}))]})),g&&m&&j&&!u&&e(r,Object.assign({style:{color:b.content.placeholder}},{children:["Showing ",O,"-",v>m?m:v," of"," ",m," results"]}))]}))]}))};export{c as TablePagination};
|
|
@@ -34,16 +34,16 @@ import e,{css as t}from"styled-components";import{COLORS as o}from"../../constan
|
|
|
34
34
|
border-radius: 4px;
|
|
35
35
|
}
|
|
36
36
|
${e=>{let{headerStyle:o}=e;return t`
|
|
37
|
-
${Object.keys(o).map((e=>`${e}: ${o[e]};`)).join("\n")}
|
|
37
|
+
${Object.keys(o).map((e=>`${e.replace(/[A-Z]/g,(e=>`-${e.toLowerCase()}`))}: ${o[e]};`)).join("\n")}
|
|
38
38
|
`}}
|
|
39
|
-
`,
|
|
39
|
+
`,a=e.div`
|
|
40
40
|
overflow-y: auto;
|
|
41
41
|
padding: 24px;
|
|
42
42
|
height: ${e=>e.hideFooter?"calc(100% - 60px)":"calc(100% - 120px)"};
|
|
43
43
|
${e=>{let{bodyStyle:o}=e;return t`
|
|
44
44
|
${Object.keys(o).map((e=>`${e}: ${o[e]};`)).join("\n")}
|
|
45
45
|
`}}
|
|
46
|
-
`,
|
|
46
|
+
`,s=e.div`
|
|
47
47
|
height: 60px;
|
|
48
48
|
width: 100%;
|
|
49
49
|
position: sticky;
|
|
@@ -62,4 +62,4 @@ import e,{css as t}from"styled-components";import{COLORS as o}from"../../constan
|
|
|
62
62
|
display: flex;
|
|
63
63
|
flex-direction: ${e=>e.footerDirection||"row"};
|
|
64
64
|
gap: 8px;
|
|
65
|
-
`;export{p as FooterButtonWrapper,
|
|
65
|
+
`;export{p as FooterButtonWrapper,a as SideModalBody,n as SideModalContainer,s as SideModalFooter,d as SideModalHeader,r as SideModalStyle};
|