hrm_ui_lib 0.0.1-beta.0

package/components/SideSheet/Footer/Footer.d.ts

@@ -0,0 +1,16 @@
+import { ReactElement } from 'react';
+import { TButtonPropTypes } from '../../Button/types';
+import { TCheckboxInfo } from '../types';
+type TProps = {
+    isLoading?: boolean;
+    footerButtons?: {
+        cancel: TButtonPropTypes;
+        confirm: TButtonPropTypes;
+        extraButton?: TButtonPropTypes;
+    };
+    onClose: (e?: TClickEventType) => void;
+    onSubmit?: (isSelected: boolean) => void;
+    checkboxInfo?: TCheckboxInfo;
+};
+export declare const Footer: ({ isLoading, footerButtons, onClose, onSubmit, checkboxInfo }: TProps) => ReactElement | null;
+export {};

package/components/SideSheet/Footer/Footer.js

@@ -0,0 +1,5 @@
+import{jsxs as i,jsx as s}from"react/jsx-runtime";import u,{useCallback as y}from"react";import{Button as t}from"../../Button/Button.js";import{Checkbox as C}from"../../Checkbox/Checkbox.js";const z=({isLoading:e,footerButtons:o,onClose:r,onSubmit:a,checkboxInfo:l})=>{const[n,c]=u.useState((null==l?void 0:l.isChecked)||!1),m=y(()=>{null==a||a(n)},[a,n]);if(!o)return null;const{extraButton:d,confirm:h,cancel:b}=o;/* @__PURE__ */
+return i("div",{className:"side-sheet__footer",children:[l?/* @__PURE__ */s("div",{className:"side-sheet__footer_checkbox",children:/* @__PURE__ */s(C,{label:l.label,selectedValue:n,onClick:c})}):null,
+/* @__PURE__ */i("div",{className:"side-sheet__footer_buttons",children:[d?/* @__PURE__ */s(t,{size:"large",type:"secondary",...o.extraButton,className:"mr-12"}):null,
+/* @__PURE__ */s(t,{type:"secondary",size:"large",className:"mr-12",onClick:r,...b}),
+/* @__PURE__ */s(t,{type:"primary",size:"large",onClick:m,disabled:e,...h})]})]})};export{z as Footer};

package/components/SideSheet/SideSheet.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { TSideSheetPropTypes } from './types';
+export declare const SideSheet: (props: TSideSheetPropTypes) => React.ReactElement | null;

package/components/SideSheet/SideSheet.js

@@ -0,0 +1,8 @@
+import{jsx as i,jsxs as l}from"react/jsx-runtime";import{useState as f,useRef as P,useId as w,useEffect as F,useCallback as L}from"react";import{motion as _}from"motion/react";import $ from"classnames";import"../../consts/index.js";import"../../context/types.js";import{useOnOutsideClick as j}from"../../hooks/useOnOutsideClick.js";import"../../hooks/useScreenSize.js";import{useHideBodyScroll as D}from"../../hooks/useHideBodyScroll.js";import"react-hook-form";import{AnimatePresenceWrapper as H}from"../../helperComponents/AnimatePresenceWrapper/AnimatePresenceWrapper.js";import{Button as s}from"../Button/Button.js";import{Text as A}from"../Text/Text.js";import{useDispatchEventOnScroll as U}from"../../hooks/useDispatchEventOnScroll.js";import{Footer as W}from"./Footer/Footer.js";import q from"../SVGIcons/IconCaretUp.js";import G from"../SVGIcons/IconDismissFilled.js";const ae=e=>{const{size:t="small",isLoading:o,isOpen:r,onClose:a,onSubmit:n,title:c,position:m="right",shouldRemoveCallback:d,className:p="",headerButtons:h,footerButtons:u,scrollToTopOptions:k,children:y,closeOnOutsideClick:v=!0,checkboxInfo:x}=e,[C,S]=f(null),[b,g]=f(!1),N=P(null);j(C,a,r&&v,w(),d),D(r);const O=U();F(()=>{var e;if(r&&k){const s=e=>{O(),r&&g(e.currentTarget.scrollTop>k.onPixel)};null==(e=N.current)||e.addEventListener("scroll",s)}r||z()},[r,k]);const z=L(()=>{var e;g(!1),null==(e=N.current)||e.scrollTo({top:0,behavior:"smooth"})},[]),B="left"===m;/* @__PURE__ */
+return i(H,{children:r?/* @__PURE__ */i(_.div,{className:"side-sheet",initial:{opacity:0},animate:{opacity:1},exit:{opacity:0,transition:{duration:.1,delay:.3}},transition:{duration:.2},children:/* @__PURE__ */l(_.div,{initial:B?{left:"-100%"}:{right:"-100%"},animate:B?{left:0}:{right:0},exit:{...B?{left:"-100%"}:{right:"-100%"},transition:{duration:.5}},transition:{duration:.5},className:$("side-sheet__container",`side-sheet__${m}`,`side-sheet__container--${t}`,p),ref:S,children:[
+/* @__PURE__ */l("div",{className:"side-sheet__header",children:[
+/* @__PURE__ */l("div",{className:"side-sheet__header__left pr-16",children:[null!=h&&h.back?/* @__PURE__ */i(s,{size:"small",type:"tertiary",...h.back,className:"mr-8"}):null,
+/* @__PURE__ */i(A,{className:"side-sheet__title",weight:"bolder",lineHeight:"large",size:"medium",children:c})]}),
+/* @__PURE__ */l("div",{className:"side-sheet__header__right",children:[null!=h&&h.pin?/* @__PURE__ */i(s,{size:"small",type:"tertiary",...h.pin,className:"mr-8"}):null,null!=h&&h.close?/* @__PURE__ */i(s,{size:"small",type:"tertiary",...h.close,onClick:a}):/* @__PURE__ */i(s,{size:"small",type:"tertiary",iconProps:{Component:G},onClick:a})]}),b&&/* @__PURE__ */i(s,{size:"large",type:"secondary",iconProps:{Component:q},className:`side-sheet__header__scroll-top side-sheet__header__scroll-top__${t}`,onClick:z})]}),
+/* @__PURE__ */i("div",{className:"side-sheet__content scrollbar scrollbar--vertical",ref:N,children:y}),
+/* @__PURE__ */i(W,{footerButtons:u,isLoading:o,onClose:a,onSubmit:n,checkboxInfo:x})]})}):null})};export{ae as SideSheet};

package/components/SideSheet/index.d.ts

@@ -0,0 +1 @@
+export * from './SideSheet';

package/components/SideSheet/index.js

@@ -0,0 +1 @@
+import{SideSheet as r}from"./SideSheet.js";export{r as SideSheet};

package/components/SideSheet/types.d.ts

@@ -0,0 +1,34 @@
+import { ReactNode } from 'react';
+import { TButtonPropTypes } from '../Button/types';
+export type TSideSheetSize = 'small' | 'large' | 'mobile';
+export type TCheckboxInfo = {
+    label: string;
+    isChecked: boolean;
+};
+export interface TSideSheetPropTypes {
+    closeOnOutsideClick?: boolean;
+    shouldRemoveCallback?: boolean;
+    size?: TSideSheetSize;
+    isLoading?: boolean;
+    isOpen: boolean;
+    onClose: (e?: TClickEventType | MouseEvent) => void;
+    onSubmit?: (isCheckboxSelected: boolean) => void;
+    position?: 'right' | 'left';
+    title?: string;
+    footerButtons?: {
+        cancel: TButtonPropTypes;
+        confirm: TButtonPropTypes;
+        extraButton?: TButtonPropTypes;
+    };
+    children?: ReactNode;
+    className?: string;
+    headerButtons?: {
+        close?: TButtonPropTypes;
+        pin?: TButtonPropTypes;
+        back?: TButtonPropTypes;
+    };
+    scrollToTopOptions?: {
+        onPixel: number;
+    };
+    checkboxInfo?: TCheckboxInfo;
+}

package/components/Snackbar/Snackbar.d.ts

@@ -0,0 +1,5 @@
+import { ReactElement } from 'react';
+import { TSnackbarProps, TToastProps } from './types';
+import 'react-toastify/dist/ReactToastify.css';
+export declare const notify: (toastProps: TToastProps) => void;
+export declare const Snackbar: (props: TSnackbarProps) => ReactElement;

package/components/Snackbar/Snackbar.js

@@ -0,0 +1,5 @@
+import{jsx as s,jsxs as o}from"react/jsx-runtime";import{toast as m,ToastContainer as l,Slide as d}from"react-toastify";import{Text as c}from"../Text/Text.js";import{Button as u}from"../Button/Button.js";import{DEFAULT_DURATION as f,TYPE_MAPPING as C,ICONS_MAPPING as h}from"./consts.js";import{IconDynamicComponent as N}from"../../helperComponents/IconDynamicComponent/IconDynamicComponent.js";import"react-toastify/dist/ReactToastify.css";const g=({actionProps:t,toastId:a,type:n="information",text:e})=>/* @__PURE__ */o("div",{"data-id":`${n}-toast-message`,className:"snackbar",children:[
+/* @__PURE__ */o("div",{className:"snackbar__content",children:[
+/* @__PURE__ */s(N,{Component:h[n],type:C[n],size:"medium"}),
+/* @__PURE__ */s(c,{className:"snackbar__text pl-16 pr-8",type:"primary",size:"standard",weight:"regular",lineHeight:"large",children:e})]}),t?/* @__PURE__ */s(u,{size:"small",type:"tertiary",...t,onClick:s=>{var o;m.dismiss(a),null==(o=null==t?void 0:t.onClick)||o.call(t,s)}}):null]},a),y=t=>{const{toastId:s,closeSnackbar:o,actionProps:a,duration:n=f}=t;m(g(t),{className:"_container",toastId:s,autoClose:!a&&n}),m.onChange(t=>{"removed"===t.status&&(null==o||o(t.id))})},A=t=>{const{duration:o=1e3,position:a="bottom-center"}=t;/* @__PURE__ */
+return s(l,{className:"snackbar-wrapper",theme:"light",hideProgressBar:!0,transition:d,position:a,autoClose:o,closeButton:()=>null})};export{A as Snackbar,y as notify};

package/components/Snackbar/consts.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { ISVGIconProps, TSVGIconType } from '../../type';
+export declare const TYPE_MAPPING: {
+    [key: string]: TSVGIconType;
+};
+export declare const ICONS_MAPPING: Record<string, React.LazyExoticComponent<React.ComponentType<ISVGIconProps>>>;
+export declare const DEFAULT_DURATION = 6000;

package/components/Snackbar/consts.js

@@ -0,0 +1 @@
+import{lazy as r}from"react";const n={warning:"warning",success:"success",error:"danger",information:"information"},i={warning:r(()=>import("../SVGIcons/IconWarningFilled.js")),success:r(()=>import("../SVGIcons/IconCheckmarkFilled.js")),error:r(()=>import("../SVGIcons/IconErrorCircleFilled.js")),information:r(()=>import("../SVGIcons/IconInfoFilled.js"))},s=6e3;export{s as DEFAULT_DURATION,i as ICONS_MAPPING,n as TYPE_MAPPING};

package/components/Snackbar/index.d.ts

@@ -0,0 +1 @@
+export * from './Snackbar';

package/components/Snackbar/index.js

@@ -0,0 +1 @@
+import{Snackbar as a,notify as f}from"./Snackbar.js";export{a as Snackbar,f as notify};

package/components/Snackbar/types.d.ts

@@ -0,0 +1,14 @@
+import { TButtonPropTypes } from '../Button/types';
+export type TSnackbarTypes = 'success' | 'error' | 'warning' | 'information';
+export interface TToastProps {
+    duration?: number;
+    type?: TSnackbarTypes;
+    toastId: number | string;
+    closeSnackbar?: (id: number | string) => void;
+    text: string | React.ReactElement;
+    actionProps?: TButtonPropTypes;
+}
+export interface TSnackbarProps extends IFormCompProps {
+    duration?: number;
+    position: 'top-center' | 'top-right' | 'top-left' | 'bottom-center' | 'bottom-right' | 'bottom-left';
+}

package/components/Status/Status.d.ts

@@ -0,0 +1,3 @@
+import { ReactElement } from 'react';
+import { TStatusProps } from './types';
+export declare const Status: (props: TStatusProps) => ReactElement;

package/components/Status/Status.js

@@ -0,0 +1,4 @@
+import{jsxs as i,jsx as e}from"react/jsx-runtime";import{Text as h}from"../Text/Text.js";import c from"classnames";var n=/* @__PURE__ */(s=>(s.large="standard",s.medium="small",s.small="xsmall",s))(n||{});const w=s=>{const{type:t="primary",size:a="large",text:l="",children:r,className:m="",leftIconProps:o,rightIconProps:u,withCircle:d=!0,withBackground:p=!1,dataId:x}=s;/* @__PURE__ */
+return i("div",{className:c(`status status--${a}`,m,{status__withBackground:p,[`status__withBackground--${t}`]:p}),children:[d?/* @__PURE__ */e("span",{className:c("status__circle","mr-6",{[`status__circle--${t}`]:!0})}):null,null!=o&&o.Component?/* @__PURE__ */e(o.Component,{size:"xsmall",type:t,className:"mr-6",...o}):null,
+/* @__PURE__ */i("div",{className:"status__label",children:[
+/* @__PURE__ */e(h,{className:"status__label-text",dataId:`${x}-text`,weight:p?"semibold":"regular",type:!d||p?t:"primary",size:n[a],children:l}),r]}),u]})};export{w as Status};

package/components/Status/index.d.ts

@@ -0,0 +1 @@
+export * from './Status';

package/components/Status/index.js

@@ -0,0 +1 @@
+import{Status as r}from"./Status.js";export{r as Status};

package/components/Status/types.d.ts

@@ -0,0 +1,15 @@
+import { ReactElement, ReactNode } from 'react';
+import { ISVGIconProps } from '../../type';
+export type TStatusTypes = 'primary' | 'disabled' | 'brand' | 'danger' | 'warning' | 'success' | 'information' | 'discovery';
+export interface TStatusProps extends IFormCompProps {
+    text?: string;
+    children?: ReactNode;
+    leftIconProps?: ISVGIconProps;
+    rightIconProps?: ReactElement;
+    type?: TStatusTypes;
+    size?: 'large' | 'medium' | 'small';
+    className?: string;
+    withCircle?: boolean;
+    withBackground?: boolean;
+    dataId?: string;
+}

package/components/Stepper/Stepper.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { TStepperProps } from './types';
+export declare const Stepper: (props: TStepperProps) => React.ReactElement;

package/components/Stepper/Stepper.js

@@ -0,0 +1,2 @@
+import{jsx as x}from"react/jsx-runtime";import{useState as a,useEffect as l}from"react";const v=e=>{const{list:t,activeStep:s=0,setActiveStep:r}=e,[n,i]=a(s);l(()=>{s&&s!==n&&i(s)},[s,n]);const p=t[n];/* @__PURE__ */
+return x(p,{activeStepIndex:n,isNextDisabled:n===t.length-1,isPrevDisabled:0===n,prevHandler:()=>{let e=n;--e,i(e),r&&r(e)},nextHandler:()=>{let e=n;++e,i(e),r&&r(e)},stepCount:t.length})};export{v as Stepper};

package/components/Stepper/index.d.ts

@@ -0,0 +1 @@
+export * from './Stepper';

package/components/Stepper/index.js

@@ -0,0 +1 @@
+import{Stepper as r}from"./Stepper.js";export{r as Stepper};

package/components/Stepper/types.d.ts

@@ -0,0 +1,15 @@
+export interface TStepperContentWrapperProps {
+    isPrevDisabled: boolean;
+    isNextDisabled: boolean;
+    prevHandler: () => void;
+    nextHandler: () => void;
+    activeStepIndex: number;
+    stepCount: number;
+}
+declare type TComp = (props: TStepperContentWrapperProps) => React.ReactElement;
+export interface TStepperProps {
+    list: TComp[];
+    activeStep?: number;
+    setActiveStep?: (step: number) => void;
+}
+export {};

package/components/Switcher/Switcher.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { TSwitcherProps } from './types';
+export declare const Switcher: React.ForwardRefExoticComponent<TSwitcherProps & React.RefAttributes<unknown>>;

package/components/Switcher/Switcher.js

@@ -0,0 +1,5 @@
+import{jsx as e,jsxs as h}from"react/jsx-runtime";import{forwardRef as k,useMemo as C}from"react";import p from"classnames";import{Label as y}from"../../helperComponents/Label/Label.js";const S=k((a,l)=>{const{onClick:s,id:r="",name:t,value:i,disabled:n,label:c,inlineType:o=!1,dataId:d,size:m="large",setFieldValue:b,selectedValue:w,className:_="",labelAddons:N,orientation:f="right",hasSpaceBetween:u=!0}=a,x=!!i||!!w,k=C(()=>/* @__PURE__ */e(y,{text:c,disabled:n,labelAddons:N,size:o?"standard":m,className:"switcher__label"}),[c,n,N,o,m]);/* @__PURE__ */
+return h("div",{className:p("switcher",{"switcher--inline":o,"switcher--space-between":u}),children:[c&&"right"===f&&k,
+/* @__PURE__ */h("label",{id:r,className:p("controller","controller--switch",`controller--switch-${m}`,_,{"controller--disabled":n}),children:[
+/* @__PURE__ */e("input",{"data-id":d,type:"checkbox",tabIndex:0,onChange:()=>{t&&b&&b(t,!x),s&&s(!x)},checked:x,disabled:n}),
+/* @__PURE__ */e("span",{className:"controller__icon",children:/* @__PURE__ */e("span",{className:"controller__icon__inner",children:/* @__PURE__ */e("span",{className:"controller__mark"})})})]}),c&&"left"===f&&k]})});S.displayName="Switcher";export{S as Switcher};

package/components/Switcher/index.d.ts

@@ -0,0 +1 @@
+export * from './Switcher';

package/components/Switcher/index.js

@@ -0,0 +1 @@
+import{Switcher as o}from"./Switcher.js";export{o as Switcher};

package/components/Switcher/types.d.ts

@@ -0,0 +1,13 @@
+export interface TSwitcherProps extends IFormCompProps {
+    onClick?: (isChecked: boolean) => void;
+    className?: string;
+    disabled?: boolean;
+    selectedValue?: boolean;
+    size?: 'large' | 'small';
+    inlineType?: boolean;
+    id?: string;
+    label?: string;
+    labelAddons?: React.ReactElement;
+    orientation?: 'left' | 'right';
+    hasSpaceBetween?: boolean;
+}

package/components/Tab/Tab.d.ts

@@ -0,0 +1,3 @@
+import { ReactElement } from 'react';
+import { TTabProps } from './types';
+export declare const Tab: (props: TTabProps) => ReactElement;

package/components/Tab/Tab.js

@@ -0,0 +1,2 @@
+import{jsx as a}from"react/jsx-runtime";import{TabItem as m}from"./TabItem.js";import t from"classnames";const o=e=>{const{selectedValue:s,tabItems:l,onSelect:d,className:o,...r}=e;/* @__PURE__ */
+return a("div",{className:"tabs-container",children:/* @__PURE__ */a("div",{className:t("tabs-header-container",o),children:l.map(e=>/* @__PURE__ */a(m,{label:e.label,badgeProps:e.badgeProps,onClick:()=>d(e.value),val:e.value,isSelected:s===e.value,dataId:(null==e?void 0:e.dataId)||"",disabled:e.disabled,...r},e.value))})})};export{o as Tab};

package/components/Tab/TabItem.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { TTabItemProps } from './types';
+export declare const TabItem: (props: TTabItemProps) => React.ReactElement | null;

package/components/Tab/TabItem.js

@@ -0,0 +1,3 @@
+import{jsxs as C,jsx as m}from"react/jsx-runtime";import{Badge as N}from"../Badge/Badge.js";import{noop as f}from"../../utils/helpers.js";import x from"classnames";const $=a=>{const{size:l="large",iconProps:s,badgeProps:e,label:o,className:n="",disabled:t=!1,isSelected:i,rightIconProps:c,val:r,onClick:d,dataId:p}=a;/* @__PURE__ */
+return C("div",{onClick:t?f:d,className:x("tab",{[`tab--${l}`]:l},{"tab--disabled":t},{"tab--selected":i},n),children:[null!=s&&s.Component?/* @__PURE__ */m(s.Component,{className:"tab__icon mr-8",size:""+("small"==l?"xsmall":"small"),...s}):null,
+/* @__PURE__ */m("span",{className:"tab__label","data-id":p,children:o}),null!=c&&c.Component?/* @__PURE__ */m(c.Component,{onClick:a=>{null!=c&&c.action&&(a.stopPropagation(),null==c||c.action(r))},className:"tab__icon ml-8",size:""+("small"==l?"xsmall":"small"),...c}):null,null!=e&&e.text?/* @__PURE__ */m(N,{className:"tab__badge ml-8",size:"small",type:"secondary",...e}):null]})};export{$ as TabItem};

package/components/Tab/index.d.ts

@@ -0,0 +1 @@
+export * from './Tab';

package/components/Tab/index.js

@@ -0,0 +1 @@
+import{Tab as a}from"./Tab.js";export{a as Tab};

package/components/Tab/types.d.ts

@@ -0,0 +1,49 @@
+import { TBadgeProps } from '../Badge/types';
+export type TTabItem = {
+    value: number | string;
+    label: string | React.ReactElement;
+    dataId?: string;
+    disabled?: boolean;
+    badgeProps?: TBadgeProps;
+    iconProps?: {
+        alignment?: string;
+        Component?: TSVGIconComponent;
+    };
+    rightIconProps?: {
+        name?: string;
+        alignment?: string;
+        action?: (value: string | number) => void;
+        Component?: TSVGIconComponent;
+    };
+};
+export interface TTabProps extends IFormCompProps {
+    tabItems: TTabItem[];
+    type?: 'primary' | 'secondary';
+    size?: 'large' | 'medium' | 'small';
+    className?: string;
+    disabled?: boolean;
+    selectedValue: number | string;
+    onSelect: (value: string | number) => void;
+}
+export type TTabItemProps = {
+    dataId?: string;
+    label?: string | React.ReactElement;
+    size?: 'large' | 'medium' | 'small';
+    className?: string;
+    iconProps?: {
+        name?: string;
+        alignment?: string;
+        Component?: TSVGIconComponent;
+    };
+    rightIconProps?: {
+        name?: string;
+        alignment?: string;
+        action?: (value: string | number) => void;
+        Component?: TSVGIconComponent;
+    };
+    badgeProps?: TBadgeProps;
+    val: string | number;
+    disabled?: boolean;
+    isSelected: boolean;
+    onClick: () => void;
+};

package/components/Table/Header.d.ts

@@ -0,0 +1,11 @@
+import { ReactElement } from 'react';
+import { HeaderGroup } from 'react-table';
+type Props = {
+    fixedHeader?: boolean;
+    withSelect: boolean;
+    tableWidth: number;
+    headerGroup: HeaderGroup;
+    uniqueKey: string;
+};
+export declare function Header({ headerGroup, tableWidth, withSelect, uniqueKey, fixedHeader }: Props): ReactElement;
+export {};

package/components/Table/Header.js

@@ -0,0 +1,4 @@
+import{jsx as t,jsxs as z}from"react/jsx-runtime";import c from"classnames";import{CHECKBOX_DEFAULT_WIDTH as x,calcColumnWidth as T,CHECKBOX_HEADER_ID as j}from"./utils.js";import{Text as v}from"../Text/Text.js";import o from"../SVGIcons/IconArrowDown.js";import B from"../SVGIcons/IconArrowUp.js";function L({headerGroup:e,tableWidth:r,withSelect:s,uniqueKey:i,fixedHeader:l=!1}){const{key:a,...d}=e.getHeaderGroupProps();/* @__PURE__ */
+return t("tr",{...d,className:c({fixed_header:l}),children:e.headers.map(({id:e,minWidth:l,maxWidth:a,width:d,widthInPercent:m,getHeaderProps:n,fixed:h,columnProps:f,render:u,isSorted:p,isSortedDesc:_,getSortByToggleProps:b},g,w)=>{var H;const I=e===j,N={width:I?x:T(m,r),left:!I&&s&&"left"===h?x:0,...!I&&l?{minWidth:l}:{},...!I&&a?{maxWidth:a}:{},...!I&&d?{width:d}:{}},{key:W,...D}=n(null!=f&&f.sortable?b():void 0);/* @__PURE__ */
+return t("th",{...D,className:c({fixed_column_left:"left"===h,fixed_column_right:"right"===h,fixed_checkbox:I&&"left"===(null==(H=w[g+1])?void 0:H.fixed),pointer:null==f?void 0:f.sortable}),style:N,children:/* @__PURE__ */z("div",{className:"flexbox align-items--center",children:[
+/* @__PURE__ */t(v,{weight:"bold",className:"table-header-title",children:u("Header")}),p&&_&&/* @__PURE__ */t(o,{size:"xsmall",className:"ml-4"}),p&&!_&&/* @__PURE__ */t(B,{size:"xsmall",className:"ml-4"}),!p&&(null==f?void 0:f.sortable)&&/* @__PURE__ */t(o,{size:"xsmall",className:"ml-4 unsorted__icon"})]})},`table_head_${i}_${g}`)})})}export{L as Header};

package/components/Table/IndeterminateCheckbox.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+type IndeterminateCheckboxProps = {
+    indeterminate: boolean;
+    checked: boolean;
+    disabled: boolean;
+    onChange: (e: {
+        target: {
+            checked: boolean;
+        };
+    }) => void;
+};
+export declare const IndeterminateCheckbox: React.ForwardRefExoticComponent<IndeterminateCheckboxProps & React.RefAttributes<HTMLInputElement>>;
+export {};

package/components/Table/IndeterminateCheckbox.js

@@ -0,0 +1 @@
+import{jsx as s}from"react/jsx-runtime";import{forwardRef as l,useRef as d,useEffect as m}from"react";import{Checkbox as h}from"../Checkbox/Checkbox.js";const i=l(({indeterminate:e,checked:t,onChange:r,disabled:a=!1},o)=>{const i=d(null),n=o||i;return m(()=>{n.current.indeterminate=e},[n,e]),/* @__PURE__ */s(h,{disabled:a,value:t,onClick:e=>{r({target:{checked:e}})},ref:n,stopPropagation:!0})});i.displayName="IndeterminateCheckbox";export{i as IndeterminateCheckbox};

package/components/Table/Row.d.ts

@@ -0,0 +1,11 @@
+import { ReactElement } from 'react';
+import { Row as RowType } from 'react-table';
+type Props = {
+    row: RowType;
+    handleRowClick?: (row: any) => void;
+    withSelect: boolean;
+    selectedFlatRows: RowType[];
+    uniqueKey: string;
+};
+export declare function Row({ row, selectedFlatRows, withSelect, uniqueKey, handleRowClick }: Props): ReactElement;
+export {};

package/components/Table/Row.js

@@ -0,0 +1,3 @@
+import{jsx as x}from"react/jsx-runtime";import{useMemo as E}from"react";import l from"classnames";import{CHECKBOX_HEADER_ID as D,CHECKBOX_DEFAULT_WIDTH as H}from"./utils.js";function I({row:e,selectedFlatRows:o,withSelect:i,uniqueKey:t,handleRowClick:n}){const r=E(()=>o.find(l=>l.id===e.id),[o]),{key:s,...c}=e.getRowProps();/* @__PURE__ */
+return x("tr",{...c,className:l({selected:!!r}),onClick:()=>null==n?void 0:n(e.original),children:e.cells.map(({getCellProps:e,column:o,render:n},r,s)=>{var c;const d=o.id===D,{key:a,...f}=e();/* @__PURE__ */
+return x("td",{...f,style:{left:!d&&i&&"left"===(null==o?void 0:o.fixed)?H:0},className:l({fixed_column_left:"left"===(null==o?void 0:o.fixed),fixed_column_right:"right"===(null==o?void 0:o.fixed),fixed_checkbox:d&&"left"===(null==(c=s[r+1].column)?void 0:c.fixed)}),onClick:e=>{d&&e.stopPropagation(),f.onClick&&f.onClick(e)},children:n("Cell")},`table_cell_${t}_${r}`)})})}export{I as Row};

package/components/Table/Table.d.ts

@@ -0,0 +1,3 @@
+import { ReactElement } from 'react';
+import { TTableProps } from './types';
+export declare function Table({ columns, data, onChange, fixedHeader, withSelect, handleRowClick, className, language, containerRefHandler, submitButtons }: TTableProps): ReactElement;

package/components/Table/Table.js

@@ -0,0 +1,6 @@
+import{jsxs as u,jsx as s}from"react/jsx-runtime";import{useRef as W,useState as $,useId as j,useMemo as D,useCallback as T,useEffect as _}from"react";import{useTable as q,useSortBy as B,useRowSelect as F}from"react-table";import{setSelectedRows as G}from"./utils.js";import{Row as J}from"./Row.js";import{Header as K}from"./Header.js";import M from"classnames";import{useDispatchEventOnScroll as V}from"../../hooks/useDispatchEventOnScroll.js";import{Button as v}from"../Button/Button.js";import{TABLE_LOCALIZATION as Z}from"./localization.js";import{setTranslationValue as Q}from"../../utils/helpers.js";import U from"../SVGIcons/IconCheckmark.js";import X from"../SVGIcons/IconDismiss.js";function fe({columns:e,data:t,onChange:r,fixedHeader:o,withSelect:a=!1,handleRowClick:l,className:n,language:i="en",containerRefHandler:c,submitButtons:m}){const d=W(null),[p,f]=$(400),h=j(),w=V(),b=D(()=>{const t=e=>"left"===e.fixed,s=e=>"right"===e.fixed;return e.sort((e,r)=>t(e)&&!t(r)?-1:!t(e)&&t(r)||s(e)&&!s(r)?1:!s(e)&&s(r)?-1:0),[...e]},[e]),{getTableProps:g,getTableBodyProps:S,selectedFlatRows:x,headerGroups:y,rows:R,prepareRow:C,toggleAllRowsSelected:k,state:I}=q({columns:b,data:t},B,F,e=>G(e,a)),L=T(()=>{var e;d.current&&f(null==(e=d.current)?void 0:e.offsetWidth)},[d.current]);_(()=>{null==r||r(I)},[JSON.stringify(I)]),_(()=>{var e;return window.addEventListener("resize",L),d.current&&f(null==(e=d.current)?void 0:e.offsetWidth),()=>{window.removeEventListener("resize",L)}},[d.current]);const z=T(()=>{k(!1)},[]);/* @__PURE__ */
+return u("div",{ref:c,children:[a&&x.length>0&&/* @__PURE__ */u("div",{className:"table-wrapper__selected-rows",children:[
+/* @__PURE__ */s(v,{buttonText:Q(Z[i].n_selected||"",x.length),onClick:z,type:"tertiary",size:"medium",iconProps:{alignment:"left",Component:X}}),null==m?void 0:m.map(({buttonText:e,isLoading:t,onClick:r,iconProps:o})=>/* @__PURE__ */s(v,{iconProps:o||{alignment:"left",Component:U},onClick:e=>{r(e,I,z)},buttonText:e||"Submit",type:"secondary",size:"medium",className:"mr-8",isLoading:t}))]}),
+/* @__PURE__ */s("div",{onScroll:w,className:M("table-wrapper scrollbar scrollbar--horizontal scrollbar--vertical",n,{"table-row-clickable":!!l}),style:{maxHeight:null==o?void 0:o.y},children:/* @__PURE__ */u("table",{...g(),ref:d,children:[
+/* @__PURE__ */s("thead",{children:y.map((e,t)=>/* @__PURE__ */s(K,{withSelect:a,fixedHeader:!!o,headerGroup:e,tableWidth:p,uniqueKey:h},`table_head_${h}_${t}`))}),
+/* @__PURE__ */s("tbody",{...S(),children:R.map(e=>(C(e),/* @__PURE__ */s(J,{handleRowClick:l,withSelect:a,selectedFlatRows:x,row:e,uniqueKey:h},`table_row_${h}_${e.id}`)))})]})})]})}export{fe as Table};

package/components/Table/index.d.ts

@@ -0,0 +1 @@
+export * from './Table';

package/components/Table/index.js

@@ -0,0 +1 @@
+import{Table as r}from"./Table.js";export{r as Table};

package/components/Table/localization.d.ts

@@ -0,0 +1,5 @@
+export declare const TABLE_LOCALIZATION: {
+    [key: string]: {
+        [key: string]: string;
+    };
+};

package/components/Table/localization.js

@@ -0,0 +1 @@
+const e={en:{n_selected:"%s selected"},ru:{n_selected:"%s выбранно"},hy:{n_selected:"%s ընտրված"}};export{e as TABLE_LOCALIZATION};

package/components/Table/types.d.ts

@@ -0,0 +1,42 @@
+import { Column, TableState } from 'react-table';
+import { TButtonPropTypes } from '../Button/types';
+type Enumerate<N extends number, Acc extends number[] = []> = Acc['length'] extends N ? Acc[number] : Enumerate<N, [...Acc, Acc['length']]>;
+export type IntRange<F extends number, T extends number> = Exclude<Enumerate<T>, Enumerate<F>>;
+export type TColumnProps = {
+    sortable?: boolean;
+};
+export type TFixedSide = 'left' | 'right';
+export type TColumnFields = {
+    columnProps?: TColumnProps;
+    fixed?: TFixedSide;
+    widthInPercent?: IntRange<0, 100>;
+};
+export type TColumn = Column & TColumnFields;
+export interface IButtonPropTypes extends Omit<TButtonPropTypes, 'onClick'> {
+    onClick: (event: TClickEventType, data: any, clearRowSelection?: () => void) => void;
+}
+export type TTableProps = {
+    className?: string;
+    columns: TColumn[];
+    data: any[];
+    withSelect?: boolean;
+    fixedHeader?: {
+        y: number;
+    };
+    handleRowClick?: (row: any) => void;
+    onChange?: (state: TableState) => void;
+    containerRefHandler?: (ref: HTMLDivElement) => void;
+    language?: string;
+    submitButtons?: IButtonPropTypes[];
+};
+export type SortBy = {
+    id: string;
+    desc: boolean;
+};
+export interface TTableState extends TableState {
+    selectedRowIds?: Record<string, number>;
+    pageSize?: number;
+    pageIndex?: number;
+    sortBy?: SortBy[];
+}
+export {};

package/components/Table/utils.d.ts

@@ -0,0 +1,5 @@
+import { Hooks } from 'react-table';
+export declare const CHECKBOX_HEADER_ID = "selection";
+export declare const CHECKBOX_DEFAULT_WIDTH = 48;
+export declare function setSelectedRows(hooks: Hooks, withSelect: boolean): void;
+export declare function calcColumnWidth(percent: number, tableWidth: number): number;

package/components/Table/utils.js

@@ -0,0 +1,3 @@
+import{jsx as s}from"react/jsx-runtime";import{IndeterminateCheckbox as r}from"./IndeterminateCheckbox.js";const u="selection",S=48;function E(e,t){t&&e.visibleColumns.push(e=>[{id:u,Header:({getToggleAllRowsSelectedProps:e,rows:t,state:o,toggleRowSelected:n})=>{const i=t.filter(e=>!("enableSelection"in e.original)||e.original.enableSelection),l=i.every(e=>o.selectedRowIds[e.id]),c=i.some(e=>o.selectedRowIds[e.id]);/* @__PURE__ */
+return s(r,{...e({checked:l,indeterminate:!l&&c,disabled:0===i.length}),onChange:e=>{const t=e.target.checked;i.forEach(e=>{n(e.id,t)})}})},Cell:({row:e})=>{const t="enableSelection"in e.original&&!e.original.enableSelection;/* @__PURE__ */
+return s(r,{...e.getToggleRowSelectedProps({disabled:t})})}},...e])}function R(e,t){return e*t/100}export{S as CHECKBOX_DEFAULT_WIDTH,u as CHECKBOX_HEADER_ID,R as calcColumnWidth,E as setSelectedRows};

package/components/TableV2/AdvancedPagination.d.ts

@@ -0,0 +1,8 @@
+import type { Table } from '@tanstack/react-table';
+interface PaginationProps<T> {
+    table: Table<T>;
+    totalCount: number;
+    buttonText?: string;
+}
+export declare function AdvancedPagination<TData>({ table, totalCount, buttonText }: PaginationProps<TData>): import("react/jsx-runtime").JSX.Element;
+export {};

package/components/TableV2/AdvancedPagination.js

@@ -0,0 +1,12 @@
+import{jsxs as r,jsx as i}from"react/jsx-runtime";import{useState as v,useEffect as C}from"react";import{Input as x}from"../Input/Input.js";import{Button as N}from"../Button/Button.js";import{Select as _}from"../Select/Select/Select.js";import"../Select/MultiSelect/MultiSelect.js";import I from"classnames";import{Text as z}from"../Text/Text.js";import"../../consts/index.js";import"../../context/types.js";import"../../hooks/useScreenSize.js";import"react-hook-form";import"dayjs";import"../../helperComponents/ErrorMessage/consts.js";import"../FileUpload/DropzoneFileUpload/DropzoneFileUpload.js";import"../Checkbox/Checkbox.js";import"react-dom";import"motion/react";import S from"../SVGIcons/IconChevronRight.js";import"../Collapse/CollapseGroup/CollapseGroup.js";import m from"../SVGIcons/IconMore.js";import"../Select/SharedComponents/ContentTop.js";import{OPTIONS as k}from"./constants/index.js";import $ from"../SVGIcons/IconChevronLeft.js";import y from"../SVGIcons/IconChevronDoubleLeft.js";import T from"../SVGIcons/IconChevronDoubleRight.js";function oe({table:e,totalCount:t,buttonText:o}){const[a,n]=v("1"),s=e.getState().pagination.pageIndex,l=e.getState().pagination.pageSize;return C(()=>{e.getPageCount()<Number(a)&&n("1")},[e.getPageCount(),e.getState().pagination]),/* @__PURE__ */r("div",{className:"advanced-table__pagination",children:[
+/* @__PURE__ */i(_,{setSelectedItem:t=>(t=>{t&&e.setPagination({pageIndex:0,pageSize:Number(t)})})(t),selectedItem:`${l}`,className:"no-border",options:k}),
+/* @__PURE__ */r("div",{className:"advanced-table__pagination__right",children:[
+/* @__PURE__ */r(z,{type:"tertiary",children:[s*l+1," - ",(s+1)*l," / ",t]}),
+/* @__PURE__ */r("div",{className:"flexbox align-items--center",children:[
+/* @__PURE__ */i(x,{currentValue:a,size:"small",onChange:t=>(t=>{(!t||/^[1-9]\d*$/.test(t)&&e.getPageCount()>=Number(t))&&n(t)})(t.target.value),className:"advanced-table__pagination__right__input mr-8"}),
+/* @__PURE__ */i(N,{onClick:()=>{const t=a?Number(a)-1:0;e.setPageIndex(t)},type:"secondary",size:"medium",buttonText:o??"Go to page"})]}),
+/* @__PURE__ */r("ul",{className:"pagination",children:[
+/* @__PURE__ */i("li",{className:"previous "+(e.getCanPreviousPage()?"":"disabled"),children:/* @__PURE__ */i("a",{rel:"prev",role:"button",onClick:()=>e.firstPage(),children:/* @__PURE__ */i(y,{size:"small"})})}),
+/* @__PURE__ */i("li",{className:"previous "+(e.getCanPreviousPage()?"":"disabled"),children:/* @__PURE__ */i("a",{rel:"prev",role:"button",onClick:()=>e.previousPage(),children:/* @__PURE__ */i($,{size:"small"})})}),(()=>{const t=s,o=e.getPageCount(),i=[];return o<=7?Array.from({length:o},(e,t)=>t+1):(i.push(1),t<=3?i.push(2,3,4,5,"+++",o):t>o-5?i.push("---",o-4,o-3,o-2,o-1,o):i.push("---",t,t+1,t+2,"+++",o),i)})().map((t,o)=>"---"===t?/* @__PURE__ */i("li",{className:"pagination__more",children:/* @__PURE__ */i("a",{role:"button",onClick:()=>e.setPageIndex(+s-3),children:/* @__PURE__ */i(m,{size:"small"})})},`ellipsis-${o}`):"+++"===t?/* @__PURE__ */i("li",{className:"pagination__more",children:/* @__PURE__ */i("a",{role:"button",onClick:()=>e.setPageIndex(+s+3),children:/* @__PURE__ */i(m,{size:"small"})})},`ellipsis-${o}`):/* @__PURE__ */i("li",{className:I({active:t===s+1}),children:/* @__PURE__ */i("a",{role:"button",onClick:()=>e.setPageIndex(+t-1),children:t})},t)),
+/* @__PURE__ */i("li",{className:"next "+(e.getCanNextPage()?"":"disabled"),children:/* @__PURE__ */i("a",{rel:"next",role:"button",onClick:()=>e.nextPage(),children:/* @__PURE__ */i(S,{size:"small"})})}),
+/* @__PURE__ */i("li",{className:"next "+(e.getCanNextPage()?"":"disabled"),children:/* @__PURE__ */i("a",{rel:"next",role:"button",onClick:()=>e.lastPage(),children:/* @__PURE__ */i(T,{size:"small"})})})]})]})]})}export{oe as AdvancedPagination};

package/components/TableV2/ColumnHeader.d.ts

@@ -0,0 +1,9 @@
+import type { CSSProperties } from 'react';
+import type { Header } from '@tanstack/react-table';
+interface DraggableColumnHeaderProps<TData> {
+    header: Header<TData, unknown>;
+    isPinned?: boolean;
+    pinnedStyles: CSSProperties;
+}
+export declare function ColumnHeader<TData>({ header, pinnedStyles }: DraggableColumnHeaderProps<TData>): import("react/jsx-runtime").JSX.Element;
+export {};

package/components/TableV2/ColumnHeader.js

@@ -0,0 +1,6 @@
+import{jsxs as i,jsx as t}from"react/jsx-runtime";import{flexRender as g}from"@tanstack/react-table";import{useSortable as u}from"@dnd-kit/sortable";import x from"../SVGIcons/IconArrowDown.js";import f from"../SVGIcons/IconArrowSort.js";import d from"../SVGIcons/IconArrowUp.js";import{Text as p}from"../Text/Text.js";import z from"classnames";function H({header:e,pinnedStyles:o}){const{attributes:n,listeners:s,setNodeRef:r,transform:a,transition:l,isDragging:c}=u({id:e.id}),m=a?{transform:`translate3d(${a.x}px, ${a.y}px, 0)`,transition:l,minWidth:e.getSize(),position:"relative",zIndex:c?1:0}:{minWidth:e.getSize(),position:"relative",zIndex:c?1:0};/* @__PURE__ */
+return i("th",{ref:r,style:{...m,...o},className:z("select-none",{"with-checkbox":"select"===e.column.id,"actions-header":"actions"===e.column.id,"cursor-pointer":e.column.getCanSort()}),...n,children:[
+/* @__PURE__ */i("div",{onClick:e.column.getToggleSortingHandler(),className:"flexbox align-items--center",children:[
+/* @__PURE__ */t("div",{...s,children:/* @__PURE__ */t(p,{className:"text-left",weight:"bold",children:g(e.column.columnDef.header,e.getContext())})}),
+/* @__PURE__ */t("span",{className:"ml-4",children:e.column.getCanSort()&&("asc"===e.column.getIsSorted()?/* @__PURE__ */t(d,{size:"xsmall"}):"desc"===e.column.getIsSorted()?/* @__PURE__ */t(x,{size:"xsmall"}):/* @__PURE__ */t(f,{size:"xsmall"}))})]}),
+/* @__PURE__ */t("div",{onMouseDown:e.getResizeHandler(),onTouchStart:e.getResizeHandler(),className:"resize-icon select-none touch-none"})]})}export{H as ColumnHeader};

package/components/TableV2/ColumnSettings.d.ts

@@ -0,0 +1,9 @@
+import type { Table } from '@tanstack/react-table';
+interface ColumnSettingsProps<T> {
+    table: Table<T>;
+    tooltipText?: string;
+    hiddenColumns?: string[];
+    allToggleText?: string;
+}
+export declare function ColumnSettings<T>({ table, tooltipText, hiddenColumns, allToggleText }: ColumnSettingsProps<T>): import("react/jsx-runtime").JSX.Element;
+export {};

package/components/TableV2/ColumnSettings.js

@@ -0,0 +1,8 @@
+import{jsxs as n,jsx as i}from"react/jsx-runtime";import{useState as d}from"react";import{Button as h}from"../Button/Button.js";import _ from"../SVGIcons/IconSettings.js";import{Switcher as a}from"../Switcher/Switcher.js";import{Menu as b}from"../Menu/Menu.js";import"react-dom";import{Positions as v}from"../Tooltip/types.js";import"../../consts/index.js";import"../../context/types.js";import"../../hooks/useScreenSize.js";import"react-hook-form";import"classnames";import"motion/react";import"dayjs";import"../Collapse/CollapseGroup/CollapseGroup.js";import"../../helperComponents/ErrorMessage/consts.js";import"../FileUpload/DropzoneFileUpload/DropzoneFileUpload.js";import{Tooltip as y}from"../Tooltip/Tooltip.js";import"../Checkbox/Checkbox.js";const N=["select","actions","expand"];function q({table:e,tooltipText:o,hiddenColumns:t=[],allToggleText:s="All"}){const[l,r]=d(null),[c,m]=d(!1),p=N.concat(t);/* @__PURE__ */
+return n("div",{ref:r,children:[
+/* @__PURE__ */i(h,{type:"secondary",iconProps:{Component:_},onClick:()=>m(e=>!e)}),
+/* @__PURE__ */i(b,{className:"settings-menu",position:"top-left",onClose:()=>{m(!1)},isOpen:c,parentRef:l,children:/* @__PURE__ */n("div",{className:"settings-menu__dropdown",children:[
+/* @__PURE__ */i("div",{className:"relative",children:/* @__PURE__ */i("div",{className:"settings-menu__dropdown__option sticky",children:/* @__PURE__ */i(a,{label:s,selectedValue:e.getIsAllColumnsVisible(),onClick:()=>e.toggleAllColumnsVisible(),inlineType:!0,size:"small"})})}),
+/* @__PURE__ */i("div",{className:"scrollbar--content scrollbar scrollbar--vertical",children:e.getAllLeafColumns().map(e=>{if(null==p||!p.includes(e.id)){const t="string"==typeof e.columnDef.header?e.columnDef.header:e.columnDef.id;/* @__PURE__ */
+return n("div",{className:"settings-menu__dropdown__option",children:[o&&!e.getCanHide()&&/* @__PURE__ */i(y,{position:v.TOP_CENTER,text:o,id:e.columnDef.id}),
+/* @__PURE__ */i(a,{label:t,id:e.columnDef.id,selectedValue:e.getIsVisible(),onClick:()=>(e=>{const o=e.getToggleVisibilityHandler();o&&o({target:{checked:!e.getIsVisible()}})})(e),disabled:!e.getCanHide(),inlineType:!0,size:"small"})]},e.id)}})})]})})]})}export{q as ColumnSettings};

package/components/TableV2/IndeterminateCheckbox.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+type IndeterminateCheckboxProps = {
+    indeterminate: boolean;
+    checked: boolean;
+    onChange: (e: {
+        target: {
+            checked: boolean;
+        };
+    }) => void;
+    disabled?: boolean;
+};
+export declare const IndeterminateCheckbox: React.ForwardRefExoticComponent<IndeterminateCheckboxProps & React.RefAttributes<HTMLInputElement>>;
+export {};

package/components/TableV2/IndeterminateCheckbox.js

@@ -0,0 +1,2 @@
+import{jsx as c}from"react/jsx-runtime";import{forwardRef as m,useRef as f,useEffect as d}from"react";import{Checkbox as h}from"../Checkbox/Checkbox.js";import u from"classnames";const x=m(({indeterminate:e,checked:a,onChange:t,disabled:s},r)=>{const o=f(null),i=r??o;d(()=>{i.current.indeterminate=e},[i,e]);/* @__PURE__ */
+return c("div",{className:"actions-list",children:/* @__PURE__ */c(h,{className:u("actions-list__checkbox",{"active-checkbox":a}),value:a,disabled:s,onClick:e=>{t({target:{checked:e}})},ref:i})})});x.displayName="IndeterminateCheckbox";export{x as IndeterminateCheckbox};

package/components/TableV2/Table.d.ts

@@ -0,0 +1,3 @@
+import type { TTableProps } from './types';
+import 'react-loading-skeleton/dist/skeleton.css';
+export declare function Table<TData>({ data, columns, isLoading, hasError, isActionsVisible, totalCount, emptyTitle, emptySubTitle, emptyIllustration, withSelect, withBorder, defaultPageIndex, defaultPageSize, defaultHiddenColumns, collapsibleRows, renderExpandedContent, renderHeader, renderFooter, onSortChange, onRowClick, tableSettings, onRowSelection, onColumnSizing, onPaginationChange }: TTableProps<TData>): import("react/jsx-runtime").JSX.Element;