\r\n \r\n {getMode()}\r\n
\r\n \r\n ) : (\r\n {errorMessage}
;\r\n};\r\n\r\nexport default ErrorMessage;\r\n","\n import API from \"!../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\";\n import domAPI from \"!../../node_modules/style-loader/dist/runtime/styleDomAPI.js\";\n import insertFn from \"!../../node_modules/style-loader/dist/runtime/insertBySelector.js\";\n import setAttributes from \"!../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js\";\n import insertStyleElement from \"!../../node_modules/style-loader/dist/runtime/insertStyleElement.js\";\n import styleTagTransformFn from \"!../../node_modules/style-loader/dist/runtime/styleTagTransform.js\";\n import content, * as namedExport from \"!!../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./iconsStyle.css\";\n \n \n\nvar options = {};\n\noptions.styleTagTransform = styleTagTransformFn;\noptions.setAttributes = setAttributes;\n\n options.insert = insertFn.bind(null, \"head\");\n \noptions.domAPI = domAPI;\noptions.insertStyleElement = insertStyleElement;\n\nvar update = API(content, options);\n\n\n\nexport * from \"!!../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./iconsStyle.css\";\n export default content && content.locals ? content.locals : undefined;\n","import React, { useEffect, useLayoutEffect, useRef, useState } from \"react\";\r\nimport \"./iconsStyle.css\";\r\nimport iconsAccess from \"./iconsAccess.json\";\r\nimport * as componentsFunction from \"../helper/CbmisFunction\";\r\nimport useCheckScreenSize from \"../hook/useCheckScreenSize\";\r\nimport { setSxClassName } from \"../helper/convertJsCss\";\r\n\r\nconst Icon = (props) => {\r\n const { icon, color, size, title, sx, hidden, disabled, dir, className, id, ...rest } = props;\r\n\r\n const screenWidth = useCheckScreenSize();\r\n const styleRef = useRef({ strSxClassName: \"\", strSXComponentID: componentsFunction.randomName(\"cbmis-icon\") });\r\n const [isExistIcon, setIsExistIcon] = useState(\"\");\r\n const getID = useRef(id || componentsFunction.randomName(\"icon\"));\r\n\r\n const getRestProps = () => {\r\n const newRest = componentsFunction.filterPaddingAndMargin(rest);\r\n return { ...newRest };\r\n };\r\n\r\n useEffect(() => {}, [title, hidden, disabled, dir, className, id]);\r\n\r\n useLayoutEffect(() => {\r\n const isExist = Object.keys(iconsAccess).filter((item) => String(item).toLowerCase() === String(icon).toLowerCase());\r\n if (icon && isExist?.length > 0) {\r\n setIsExistIcon(isExist[0]);\r\n } else {\r\n setIsExistIcon(\"\");\r\n }\r\n }, [icon]);\r\n\r\n useEffect(() => {\r\n if (isExistIcon && isExistIcon !== \"\") {\r\n let objStyle = {\r\n ...(color ? { color: `${componentsFunction.checkColorReturnValue(color)} !important` } : {}),\r\n ...(sx ? sx : {}),\r\n };\r\n\r\n setSxClassName(styleRef, styleRef.current.strSXComponentID, objStyle, \"cbmis-icon\");\r\n\r\n try {\r\n if(size){\r\n objStyle.width = `${size}`;\r\n objStyle.height = `${size}`;\r\n setSxClassName(styleRef, styleRef.current.strSXComponentID, objStyle, \"cbmis-icon\");\r\n }else if (styleRef.current?.strSxClassName && window?.getComputedStyle(document?.querySelector(\".\" + styleRef.current?.strSxClassName))?.fontSize) {\r\n let IconsContainerFontSize = window.getComputedStyle(document.querySelector(\".\" + styleRef.current?.strSxClassName)).fontSize;\r\n objStyle.width = `${IconsContainerFontSize}`;\r\n objStyle.height = `${IconsContainerFontSize}`;\r\n\r\n setSxClassName(styleRef, styleRef.current.strSXComponentID, objStyle, \"cbmis-icon\");\r\n }\r\n } catch {}\r\n }\r\n }, [sx, screenWidth, color, size, isExistIcon]);\r\n\r\n return (\r\n \r\n \r\n {isExistIcon ? (\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n
\r\n \r\n \r\n \r\n {props.children}\r\n \r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n \r\n {headItem ?
\r\n \r\n {headItem}
: \"\"}\r\n {props.children}
\r\n \r\n {footerItem}\r\n {isDropMenu ?
\r\n \r\n
\r\n \r\n
\r\n \r\n {icon?\r\n
\r\n {initialState?.objLang && Object.keys(initialState?.objLang).length>1?\r\n \r\n :\"\"} \r\n \r\n \r\n
\r\n :adornment?\r\n \r\n \r\n
\r\n :\"\"\r\n }\r\n \r\n {label?.[initialState.currentLangSelected] || label?.default || label?\r\n \r\n :\"\"}\r\n \r\n {endComponent?\r\n endComponent\r\n :initialState?.objLang && Object.keys(initialState?.objLang).length >1?\r\n \r\n {\r\n initialState.currentLangSelected?\r\n \r\n {initialState.objLang?.[initialState.currentLangSelected].label || initialState.objLang?.[initialState.currentLangSelected].label}\r\n \r\n :
\r\n :endIcon?\r\n \r\n
\r\n :endAdornment?\r\n \r\n \r\n
\r\n :\"\"}\r\n \r\n
\r\n \r\n
\r\n \r\n {icon?\r\n
\r\n\r\n \r\n\r\n \r\n \r\n
\r\n :adornment?\r\n \r\n \r\n
\r\n :\"\"\r\n }\r\n \r\n {label?.default || label?\r\n \r\n :\"\"}\r\n {options\r\n ? options.map((option, index) => {\r\n return (\r\n \r\n );\r\n })\r\n : \"\"}\r\n
\r\n {Options}
\r\n {\r\n autocomplete?(\r\n \r\n {initialState.filterOption ? \r\n \r\n :\"\"} \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {icon?\r\n
\r\n\r\n\r\n \r\n \r\n
\r\n :adornment?\r\n \r\n \r\n
\r\n :\"\"\r\n }\r\n \r\n {label?.default || label?\r\n \r\n :\"\"}\r\n {options\r\n ? options.map((option, index) => {\r\n return (\r\n \r\n );\r\n })\r\n : \"\"}\r\n
\r\n {Options}
\r\n {\r\n autocomplete?(\r\n \r\n {initialState.filterOption ? \r\n \r\n :\"\"} \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {icon?\r\n
\r\n {initialState?.objLang && Object.keys(initialState?.objLang).length>1?\r\n \r\n :\"\"} \r\n \r\n \r\n
\r\n :adornment?\r\n \r\n \r\n
\r\n :\"\"\r\n }\r\n \r\n {\r\n initialState.currentLangSelected?\r\n \r\n {initialState.objLang?.[initialState.currentLangSelected].label || initialState.objLang?.[initialState.currentLangSelected].label}\r\n \r\n :
\r\n :endIcon?\r\n \r\n \r\n
\r\n :endAdornment?\r\n \r\n \r\n
\r\n :\"\"}\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n\r\n {showMaxMin ? (\r\n
\r\n \r\n {min ? {min} : \"\"}\r\n {max ? {max} : \"\"}\r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n \r\n
\r\n \r\n \r\n {label?.default || label?\r\n \r\n :\"\"}\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {icon?\r\n
\r\n \r\n \r\n
\r\n :adornment?\r\n \r\n \r\n
\r\n :\"\"\r\n }\r\n \r\n {label?.default || label?\r\n \r\n :\"\"}\r\n
\r\n \r\n {\r\n readOnly?null:(\r\n \r\n )\r\n }\r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n {!label?null:(\r\n \r\n )}\r\n \r\n
\r\n ';\n modalContainer.appendChild(divider);\n ////////////////////////////////////// action ///////////////////////////////////////////////////\n const modalAction = document.createElement(\"div\");\n modalAction.classList.add(\"cbmis-conf-action\");\n modalContainer.appendChild(modalAction);\n\n ////////////////////////////////// no button ////////////////////////////////////////////////\n const noButton = document.createElement(\"div\");\n noButton.classList.add(\"cbmis-conf-no-button\");\n noButton.innerHTML = cancelLabel|| \"No\";\n modalAction.appendChild(noButton);\n noButton.addEventListener(\"click\",async () => {\n if (modal) {\n modal.remove();\n await cancelFunction();\n }\n return;\n });\n ////////////////////////////////// yes button ////////////////////////////////////////////////\n const yesButton = document.createElement(\"div\");\n yesButton.classList.add(\"cbmis-conf-yes-button\");\n yesButton.innerHTML = acceptLabel|| \"Yes\";\n modalAction.appendChild(yesButton);\n yesButton.addEventListener(\"click\", async () => {\n modal.remove();\n await targetFunction();\n });\n\n ////////////////////////////////////// add to body /////////////////////////////////////////////\n document.body.appendChild(modal);\n}\n","import React, { useEffect, useRef } from 'react'\r\nimport \"./Permission.css\"\r\nimport usePermissions from './usePermissions'\r\nimport * as permissionsVariable from \"./PermissionsVariable/PermissionsVariable\"\r\nimport * as permissionsVariableStyle from \"./PermissionsVariable/PermissionsVariableStyle\"\r\n\r\nimport Typography from '../../material/dataDisplay/Typography/Typography'\r\nimport Grid from '../../material/layout/Grid/Grid'\r\nimport CbmisIcon from '../../icon/CbmisIcon'\r\nimport MenuItem from '../../material/navigation/Menu/MenuItem'\r\nimport * as Confirmation from \"../../material/feedback/Confirmation/Confirmation\";\r\n\r\n\r\nfunction PermissionControl(props) {\r\n const {color,lang=\"eng\",blnBackUrl=true, \r\n appPermissionState = permissionsVariable.objPermissionState,viewLst=permissionsVariable.viewLst,\r\n changeAppPermissionState\r\n }=props\r\n const premission = usePermissions(appPermissionState,changeAppPermissionState,lang)\r\n\r\n const handlePermissionEvents=(e,permissionType)=>{\r\n if(e.target.checked){\r\n switch (permissionType) {\r\n case permissionsVariable.objPermissionKey.cameraPermission:\r\n Confirmation.viewConfirmation(permissionsVariable.permissionLangConfirmation[lang][permissionType],\r\n ()=>{premission.handleCameraAllow();},\r\n ()=>{premission.handleRequestDenied(permissionType)},\r\n permissionsVariable.permissionLangConfirmation[lang].yes,\r\n permissionsVariable.permissionLangConfirmation[lang].no\r\n )\r\n\r\n break;\r\n case permissionsVariable.objPermissionKey.locationPermission:\r\n Confirmation.viewConfirmation(permissionsVariable.permissionLangConfirmation[lang][permissionType],\r\n ()=>{premission.handleLocationAllow();},\r\n ()=>{premission.handleRequestDenied(permissionType)},\r\n permissionsVariable.permissionLangConfirmation[lang].yes,\r\n permissionsVariable.permissionLangConfirmation[lang].no\r\n )\r\n break;\r\n case permissionsVariable.objPermissionKey.microphonePermission:\r\n Confirmation.viewConfirmation(permissionsVariable.permissionLangConfirmation[lang][permissionType],\r\n ()=>{premission.handleMicrophoneAllow();},\r\n ()=>{premission.handleRequestDenied(permissionType)},\r\n permissionsVariable.permissionLangConfirmation[lang].yes,\r\n permissionsVariable.permissionLangConfirmation[lang].no\r\n )\r\n break;\r\n case permissionsVariable.objPermissionKey.notificationsPermission:\r\n Confirmation.viewConfirmation(permissionsVariable.permissionLangConfirmation[lang][permissionType],\r\n ()=>{premission.handleNotificationsAllow();},\r\n ()=>{premission.handleRequestDenied(permissionType)},\r\n permissionsVariable.permissionLangConfirmation[lang].yes,\r\n permissionsVariable.permissionLangConfirmation[lang].no\r\n )\r\n break;\r\n default:\r\n break;\r\n }\r\n }else{\r\n e.target.checked=false\r\n premission.handleRequestDenied(permissionType)\r\n }\r\n\r\n }\r\n\r\n useEffect(() => {\r\n premission.checkAllPermission()\r\n\r\n }, [])\r\n \r\n useEffect(() => {\r\n }, [appPermissionState])\r\n \r\n\r\n const arrobjPermissionStateKey = Object.keys(appPermissionState)\r\n return (\r\n
\r\n \r\n \r\n
\r\n \r\n ) : (\r\n {props.children}
\r\n \r\n
\r\n ) : buttonAdornment ? (\r\n {buttonAdornment}
\r\n ) : (\r\n \"\"\r\n )}\r\n {label ? (\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n\r\n {props.children}\r\n\r\n {endIcon ? (\r\n \r\n
\r\n ) : endAdornment ? (\r\n {endAdornment}
\r\n ) : (\r\n \"\"\r\n )}\r\n \r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nexport default Badge;\r\n","import React from 'react'\r\n\r\nimport Grid from '../../../material/layout/Grid/Grid'\r\nimport Badge from '../../../material/dataDisplay/Badge/Badge'\r\nimport Checkbox from '../../../material/inputs/CheckboxGroup/CheckboxGroup'\r\nimport * as ClientFunction from '../../../helper/CbmisFunction'\r\nimport * as categoryVariables from \"../CategoryVariables\"\r\nimport Button from '../../../material/inputs/Button/Button'\r\nimport Icon from '../../../icon/CbmisIcon'\r\n\r\n\r\nfunction RecursiveAccordion(props) {\r\n const {\r\n blnIsSelect,\r\n\r\n category, \r\n objFelidName,\r\n rootID,\r\n\r\n stateInfo,\r\n setStateInfo,\r\n\r\n blnRootHasCheckbox,\r\n lstSelectedID,\r\n\r\n blnAdd,\r\n blnEdit,\r\n blnDelete,\r\n\r\n blnAddUnderTheRoot,\r\n blnEditRoot,\r\n blnDeleteRoot,\r\n\r\n handleOpenAddEdit,\r\n handleAdd,\r\n handleEdit,\r\n handleDelete,\r\n handleChecked,\r\n\r\n color,\r\n objLabels,\r\n objLanguage,\r\n currentLanguage,\r\n }=props\r\n\r\n\r\n const handleShow=(id)=>()=>{\r\n try{\r\n const list= document.querySelector(`#list-${id}`)\r\n if (ClientFunction.hasClass(list, \"hide\")){\r\n ClientFunction.replaceClass(list,\"hide\",\"show\")\r\n }else if (ClientFunction.hasClass(list, \"show\")){\r\n ClientFunction.replaceClass(list,\"show\", \"hide\")\r\n }\r\n } catch {}\r\n }\r\n\r\n const handleCheckBox=(event)=>{\r\n try{\r\n const id = event.target.id\r\n const id_arr = String(id).split(\"-\")\r\n const bigID = Number(id_arr[0])\r\n // const bigParentID =Number(id_arr[1])\r\n var newList = lstSelectedID || []\r\n if(handleChecked){\r\n handleChecked(event)\r\n if(event.target.checked){\r\n newList.push(bigID)\r\n }else{\r\n newList = newList.filter(item=>item ===bigID)\r\n }\r\n handleChecked(event,newList)\r\n\r\n }\r\n }catch(error){}\r\n }\r\n\r\n const handelEventDeleted=(event, categorySelect)=>{\r\n const theTreeLst = stateInfo?.treeList || []\r\n const newList = theTreeLst.filter(item=>item?.[objFelidName?.intID] === categorySelect?.[objFelidName?.intID])\r\n if(handleDelete){\r\n handleDelete(event,newList)\r\n }\r\n stateInfo.treeList = newList\r\n setStateInfo({...stateInfo})\r\n }\r\n return (\r\n \r\n {props.children}\r\n \r\n {content}\r\n
\r\n - \r\n {\r\n category?.children.map(item=>{\r\n return(\r\n
- \r\n {\r\n stateInfo?.readTreeList?.map((category) => {\r\n return (\r\n
\r\n
\r\n )\r\n :null\r\n)\r\n}\r\n\r\nexport default Camera","\n import API from \"!../../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\";\n import domAPI from \"!../../../../node_modules/style-loader/dist/runtime/styleDomAPI.js\";\n import insertFn from \"!../../../../node_modules/style-loader/dist/runtime/insertBySelector.js\";\n import setAttributes from \"!../../../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js\";\n import insertStyleElement from \"!../../../../node_modules/style-loader/dist/runtime/insertStyleElement.js\";\n import styleTagTransformFn from \"!../../../../node_modules/style-loader/dist/runtime/styleTagTransform.js\";\n import content, * as namedExport from \"!!../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./uploadImage.css\";\n \n \n\nvar options = {};\n\noptions.styleTagTransform = styleTagTransformFn;\noptions.setAttributes = setAttributes;\n\n options.insert = insertFn.bind(null, \"head\");\n \noptions.domAPI = domAPI;\noptions.insertStyleElement = insertStyleElement;\n\nvar update = API(content, options);\n\n\n\nexport * from \"!!../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./uploadImage.css\";\n export default content && content.locals ? content.locals : undefined;\n","\n import API from \"!../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\";\n import domAPI from \"!../../../node_modules/style-loader/dist/runtime/styleDomAPI.js\";\n import insertFn from \"!../../../node_modules/style-loader/dist/runtime/insertBySelector.js\";\n import setAttributes from \"!../../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js\";\n import insertStyleElement from \"!../../../node_modules/style-loader/dist/runtime/insertStyleElement.js\";\n import styleTagTransformFn from \"!../../../node_modules/style-loader/dist/runtime/styleTagTransform.js\";\n import content, * as namedExport from \"!!../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./uploader.css\";\n \n \n\nvar options = {};\n\noptions.styleTagTransform = styleTagTransformFn;\noptions.setAttributes = setAttributes;\n\n options.insert = insertFn.bind(null, \"head\");\n \noptions.domAPI = domAPI;\noptions.insertStyleElement = insertStyleElement;\n\nvar update = API(content, options);\n\n\n\nexport * from \"!!../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./uploader.css\";\n export default content && content.locals ? content.locals : undefined;\n","import React from 'react'\r\nimport \"./uploader.css\"\r\nimport {resizeImgKB,resizeImgWH} from \"./rezieImageFun\"\r\n\r\nfunction Uploader({images,setImages, maxFilesNumber,maxSizeKB,maxWidth,maxHeight,quality}) {\r\n\r\n\r\n async function changeImage(e){\r\n let litsFile= []\r\n if(maxSizeKB){\r\n litsFile = await resizeImgKB(Array.from(e.currentTarget.files),maxSizeKB,maxFilesNumber,quality,false)\r\n }else if(maxWidth || maxHeight){\r\n resizeImgWH(Array.from(e.currentTarget.files),maxWidth,maxHeight,quality,maxFilesNumber)\r\n }\r\n else{\r\n litsFile = []\r\n Array.from(e.currentTarget.files).forEach((file,index)=>{\r\n if(index < Number(maxFilesNumber)){\r\n litsFile.push(file);\r\n }\r\n })\r\n }\r\n setImages(litsFile)\r\n }\r\n\r\n return (\r\n \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n ):null\r\n }\r\n \r\n \r\n
\r\n -1 ? 'camera-tookPhoto' : '')}>\r\n 
\r\n showImage(-1)}\r\n />\r\n {showIndex1?\r\n showImage(showIndex+1)}\r\n />\r\n :null}\r\n\r\n {showIndex>0 && imagesList.length>1?\r\n showImage(showIndex-1)}\r\n />\r\n :null}\r\n {\r\n blnChangeName?(\r\n
\r\n \r\n \r\n
\r\n ):null\r\n }\r\n \r\n \r\n {\r\n imagesList.map((img,index)=>{\r\n return(\r\n
\r\n\r\n \r\n
\r\n )\r\n })\r\n }\r\n \r\n 
{showImage(index)}} \r\n alt=\"\" />\r\n
\r\n \r\n {deleteImage(index)}} />\r\n {showImage(index)}} />\r\n
\r\n \r\n
\r\n \r\n { images.length?\r\n })
\r\n :\r\n \r\n }\r\n
\r\n \r\n {\r\n !gallery?null:(\r\n \r\n )\r\n }\r\n {\r\n !camera?null:(\r\n \r\n )\r\n }\r\n
\r\n \r\n
\r\n \r\n {\r\n !gallery?null:(\r\n \r\n )\r\n }\r\n {\r\n !camera?null:(\r\n \r\n )\r\n }\r\n
\r\n \r\n {images.length?\r\n Object.values(images).map((imgFile,index)=>{\r\n return(\r\n )\r\n }\r\n
\r\n \r\n })
\r\n
\r\n )\r\n })\r\n :(\r\n
\r\n \r\n {\r\n !camera?null:(\r\n
\r\n \r\n \r\n
\r\n )\r\n }\r\n \r\n \r\n {\r\n !gallery?null:(\r\n \r\n )\r\n }\r\n \r\n { images.length?\r\n \r\n :\r\n \r\n \r\n \r\n }\r\n
\r\n \r\n
\r\n \r\n {\r\n Object.values(images).map((imgFile,index)=>{\r\n return(\r\n
\r\n\r\n \r\n
\r\n )\r\n })\r\n }\r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n\r\n
\r\n \r\n {\r\n !Object.values(images).length?:(\r\n \r\n )\r\n }\r\n\r\n
\r\n\r\n \r\n {\r\n !gallery?null:(\r\n \r\n )\r\n }\r\n {\r\n !camera?null:(\r\n \r\n )\r\n }\r\n
\r\n \r\n
\r\n \r\n {images.length?\r\n \r\n :\r\n \r\n \r\n \r\n }\r\n
\r\n \r\n {!images.length?(\r\n \r\n ):Object.values(images).map((imgFile,index)=>{\r\n return(\r\n
\r\n \r\n
\r\n )\r\n })\r\n }\r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n\r\n
\r\n \r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nexport default Avatar;\r\n","import React from 'react'\r\nimport Avatar from \"../../../../material/dataDisplay/Avatar/Avatar\"\r\nimport Icon from \"../../../../icon/CbmisIcon\"\r\n\r\nexport default function AgentHeader({handelChatOpen,blnAgentImg=true,icon,iconColor,iconSize,avatarColor,avatarSize}) {\r\n return (\r\n {props.children}
\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n \r\n {/*
\r\n ChatBot
*/}\r\n\r\n
\r\n\r\n \r\n \r\n {/* \r\n
*/}\r\n \r\n \r\n
\r\n */}\r\n \r\n \r\n
...
\r\n \r\n {\r\n conversion[conversion.length-1]?.options?.map((option,index)=>{\r\n return(\r\n \r\n )\r\n })\r\n }\r\n
\r\n\r\n \r\n \r\n \r\n
\r\n \r\n {msg?.text}\r\n {/*
\r\n {\r\n msg?.image?(\r\n \r\n
*/}\r\n {!getIsLoading() ? getTime():\"\"}
\r\n ✓
\r\n ✓
\r\n \r\n 
\r\n
\r\n ):null\r\n }\r\n \r\n \r\n \r\n \r\n
\r\n )\r\n}\r\n\r\nexport default ChatBot","\n import API from \"!../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\";\n import domAPI from \"!../../../node_modules/style-loader/dist/runtime/styleDomAPI.js\";\n import insertFn from \"!../../../node_modules/style-loader/dist/runtime/insertBySelector.js\";\n import setAttributes from \"!../../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js\";\n import insertStyleElement from \"!../../../node_modules/style-loader/dist/runtime/insertStyleElement.js\";\n import styleTagTransformFn from \"!../../../node_modules/style-loader/dist/runtime/styleTagTransform.js\";\n import content, * as namedExport from \"!!../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./CbmisVoiceRecorder.css\";\n \n \n\nvar options = {};\n\noptions.styleTagTransform = styleTagTransformFn;\noptions.setAttributes = setAttributes;\n\n options.insert = insertFn.bind(null, \"head\");\n \noptions.domAPI = domAPI;\noptions.insertStyleElement = insertStyleElement;\n\nvar update = API(content, options);\n\n\n\nexport * from \"!!../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./CbmisVoiceRecorder.css\";\n export default content && content.locals ? content.locals : undefined;\n","import { useEffect, useState } from \"react\";\r\nimport usePermissions from \"../CbmisPermissions/usePermissions\"\r\nimport * as Alert from \"../../material/feedback/Alert/Alert\"\r\n// import * as Confirmation from \"../../material/feedback/Confirmation/Confirmation\"\r\n\r\n\r\nconst useRecorder = (appPermissionState) => {\r\n const [audioURL, setAudioURL] = useState(\"\");\r\n const [isRecording, setIsRecording] = useState(false);\r\n const [recorder, setRecorder] = useState(null);\r\n const permissions = usePermissions(appPermissionState)\r\n\r\n useEffect(() => {\r\n // Lazily obtain recorder first time we're recording.\r\n if (recorder === null) {\r\n if (isRecording) {\r\n requestRecorder().then(setRecorder, console.error);\r\n }\r\n return;\r\n }\r\n\r\n // Manage recorder state.\r\n if (isRecording) {\r\n recorder.start();\r\n } else {\r\n recorder.stop();\r\n }\r\n\r\n // Obtain the audio when ready.\r\n const handleData = e => {\r\n setAudioURL(URL.createObjectURL(e.data));\r\n };\r\n\r\n recorder.addEventListener(\"dataavailable\", handleData);\r\n return () => recorder.removeEventListener(\"dataavailable\", handleData);\r\n }, [recorder, isRecording]);\r\n\r\n const startRecording = () => {\r\n if(appPermissionState){\r\n permissions.checkPermission(\"microphonePermission\")\r\n if(appPermissionState.microphonePermission.user && appPermissionState.microphonePermission.user){\r\n setIsRecording(true);\r\n }else{\r\n Alert.viewAlert(\"Please go to the permission page and turn on the microphone\")\r\n }\r\n }else{\r\n setIsRecording(true);\r\n }\r\n };\r\n\r\n const stopRecording = () => {\r\n setIsRecording(false);\r\n };\r\n\r\n const deleteRecording = () => {\r\n // if(audioURL){\r\n // Confirmation(\"Are you sure to delete this record?\",()=>{\r\n setAudioURL(\"\")\r\n // })\r\n // }\r\n\r\n setAudioURL(\"\")\r\n\r\n };\r\n\r\n \r\n return {audioURL, isRecording, startRecording, stopRecording, deleteRecording};\r\n};\r\n\r\nasync function requestRecorder() {\r\n const stream = await navigator.mediaDevices.getUserMedia({ audio: true });\r\n return new MediaRecorder(stream);\r\n}\r\n\r\n\r\nexport default useRecorder;\r\n","import React, { useEffect } from 'react'\r\nimport \"./CbmisVoiceRecorder.css\"\r\nimport useRecorder from './useRecorder';\r\nimport Grid from '../../material/layout/Grid/Grid';\r\nimport Icon from '../../icon/CbmisIcon';\r\n\r\nfunction CbmisVoiceRecorder({appPermissionState,getAudioURL}) {\r\n let {audioURL, isRecording, startRecording, stopRecording,deleteRecording}= useRecorder(appPermissionState);\r\n\r\n const handelClicked=()=>{\r\n if(!isRecording){\r\n startRecording()\r\n }else{\r\n stopRecording()\r\n deleteRecording()\r\n }\r\n }\r\n\r\n useEffect(() => {\r\n if(audioURL && getAudioURL){\r\n getAudioURL(audioURL)\r\n }\r\n}, [audioURL,getAudioURL])\r\n\r\n\r\n\r\n return (\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {\r\n conversion.map((msg,index)=>{\r\n return(\r\n \r\n \r\n \r\n )\r\n })\r\n }\r\n
\r\n \r\n {audioURL?(\r\n \r\n \r\n \r\n ):(\r\n \r\n )}\r\n \r\n
\r\n {label}
\r\n {endAvatar ? (\r\n \r\n {title ? (\r\n \r\n \r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n \r\n );\r\n};\r\n\r\nexport default Tooltip;\r\n","\n import API from \"!../../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\";\n import domAPI from \"!../../../../node_modules/style-loader/dist/runtime/styleDomAPI.js\";\n import insertFn from \"!../../../../node_modules/style-loader/dist/runtime/insertBySelector.js\";\n import setAttributes from \"!../../../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js\";\n import insertStyleElement from \"!../../../../node_modules/style-loader/dist/runtime/insertStyleElement.js\";\n import styleTagTransformFn from \"!../../../../node_modules/style-loader/dist/runtime/styleTagTransform.js\";\n import content, * as namedExport from \"!!../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./Table.css\";\n \n \n\nvar options = {};\n\noptions.styleTagTransform = styleTagTransformFn;\noptions.setAttributes = setAttributes;\n\n options.insert = insertFn.bind(null, \"head\");\n \noptions.domAPI = domAPI;\noptions.insertStyleElement = insertStyleElement;\n\nvar update = API(content, options);\n\n\n\nexport * from \"!!../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./Table.css\";\n export default content && content.locals ? content.locals : undefined;\n","import React, { useEffect, useRef } from \"react\";\r\nimport \"./Table.css\";\r\nimport \"../../../style/main.css\";\r\nimport * as componentsFunction from \"../../../helper/CbmisFunction\";\r\nimport useCheckScreenSize from \"../../../hook/useCheckScreenSize\";\r\nimport { setSxClassName } from \"../../../helper/convertJsCss\";\r\n\r\nfunction Table(props) {\r\n const { mobileMode, sx, hidden, disabled, dir, className, id, ...rest } = props;\r\n const screenWidth = useCheckScreenSize();\r\n\r\n const styleRef = useRef({ strSxClassName: \"\" });\r\n const getID = useRef(id || componentsFunction.randomName(\"Table\"));\r\n\r\n useEffect(() => {\r\n if (sx) {\r\n setSxClassName(styleRef, getID.current, sx, \"cbmis-table-contenter\");\r\n }\r\n }, [sx, screenWidth]);\r\n\r\n const getRestProps = () => {\r\n const newRest = componentsFunction.filterPaddingAndMargin(rest);\r\n return { ...newRest };\r\n };\r\n\r\n const getTableClassName = () => {\r\n if ((mobileMode === false || mobileMode === \"off\") && typeof mobileMode !== \"undefined\") {\r\n return \"cbmis-mobile-mod-off-contenter\";\r\n } else {\r\n return \"cbmis-table-contenter\";\r\n }\r\n };\r\n\r\n return (\r\n \r\n\t\t\t\r\n\t\t\t\t{reversedYLabels.map((yLabel, rowIndex) => renderTableRow(yLabel, rowIndex))}\r\n\t\t\t\t{renderFooterRow()}\r\n\t\t\t
\r\n\t\t
\r\n\t);\r\n};\r\n\r\nexport default HeatMap;\r\n","\n import API from \"!../../../../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\";\n import domAPI from \"!../../../../../../node_modules/style-loader/dist/runtime/styleDomAPI.js\";\n import insertFn from \"!../../../../../../node_modules/style-loader/dist/runtime/insertBySelector.js\";\n import setAttributes from \"!../../../../../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js\";\n import insertStyleElement from \"!../../../../../../node_modules/style-loader/dist/runtime/insertStyleElement.js\";\n import styleTagTransformFn from \"!../../../../../../node_modules/style-loader/dist/runtime/styleTagTransform.js\";\n import content, * as namedExport from \"!!../../../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./BulletChart.css\";\n \n \n\nvar options = {};\n\noptions.styleTagTransform = styleTagTransformFn;\noptions.setAttributes = setAttributes;\n\n options.insert = insertFn.bind(null, \"head\");\n \noptions.domAPI = domAPI;\noptions.insertStyleElement = insertStyleElement;\n\nvar update = API(content, options);\n\n\n\nexport * from \"!!../../../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./BulletChart.css\";\n export default content && content.locals ? content.locals : undefined;\n","import React from 'react';\r\nimport './BulletChart.css';\r\n\r\nconst BulletChart = ({ objData, colorMapping, showXLabel, showyLabel, showValue = true }) => {\r\n\tconst { xLabels, yLabels, data } = objData;\r\n\tconst reversedYLabels = [...yLabels].reverse();\r\n\r\n\tconst renderTableCell = (xLabel, yLabel, cellIndex) => {\r\n\t\tconst cell = data.find((item) => item.x === xLabel && item.y === yLabel);\r\n\t\tconst value =\r\n\t\t\tshowXLabel && cell ? xLabel : showyLabel && cell ? yLabel : cell?.value ? cell?.value : xLabel ? cell?.x : null;\r\n\t\tconst bulletColor = colorMapping?.[value] !== undefined ? colorMapping[value] : 'black';\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t{showValue && value}
\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t{cell && (\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t)}\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\r\n\t\t\t\t{reversedYLabels.map((yLabel, rowIndex) => renderTableRow(yLabel, rowIndex))}\r\n\t\t\t\t{renderFooterRow()}\r\n\t\t\t
\r\n\t\t
\r\n\t);\r\n};\r\n\r\nexport default BulletChart;\r\n","// src/Histogram.js\r\nimport React from \"react\";\r\n\r\nconst Histogram = ({ objData, width = \"400\", height = 200, barColor = \"#2196f3\", axisColor = \"#000\", padding = 30, labelColor = \"#000\", barLabelColor = \"#000\", tickSize = 5, yAxisTickCount = 5 }) => {\r\n const { data } = objData;\r\n if (!data || data.length === 0) {\r\n return No data provided
;\r\n }\r\n\r\n const values = data.map((d) => d.value);\r\n const value = Math.min(...values);\r\n const maxValue = Math.max(...values);\r\n const minValue = Math.min(...values) - value;\r\n const binWidth = (width - 2 * padding) / data.length;\r\n\r\n const yAxisTickValues = Array.from({ length: yAxisTickCount }, (_, i) => minValue + (i * (maxValue - minValue)) / (yAxisTickCount - 1));\r\n\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default Histogram;\r\n","import React, { useEffect, useRef } from 'react';\r\n\r\nconst PieChart = ({ objData, colorMapping }) => {\r\n\tconst { data } = objData;\r\n\r\n\tconst canvasRef = useRef(null);\r\n\r\n\tconst drawChart = () => {\r\n\t\tconst ctx = canvasRef.current.getContext('2d');\r\n\t\tconst totalValue = data.reduce((acc, curr) => acc + parseFloat(curr.value), 0);\r\n\t\tlet startAngle = 0;\r\n\r\n\t\tdata.forEach((item) => {\r\n\t\t\tconst value = parseFloat(item.value);\r\n\t\t\tconst sliceAngle = (2 * Math.PI * value) / totalValue;\r\n\r\n\t\t\tctx.beginPath();\r\n\t\t\tctx.moveTo(canvasRef.current.width / 2, canvasRef.current.height / 2);\r\n\t\t\tctx.arc(\r\n\t\t\t\tcanvasRef.current.width / 2,\r\n\t\t\t\tcanvasRef.current.height / 2,\r\n\t\t\t\tMath.min(canvasRef.current.width / 2, canvasRef.current.height / 2),\r\n\t\t\t\tstartAngle,\r\n\t\t\t\tstartAngle + sliceAngle\r\n\t\t\t);\r\n\t\t\tctx.closePath();\r\n\r\n\t\t\tctx.fillStyle = colorMapping?.[item.x];\r\n\t\t\tctx.fill();\r\n\r\n\t\t\t// Draw label\r\n\t\t\tconst labelX =\r\n\t\t\t\tcanvasRef.current.width / 2 +\r\n\t\t\t\t(Math.min(canvasRef.current.width / 2, canvasRef.current.height / 2) / 2) * Math.cos(startAngle + sliceAngle / 2);\r\n\t\t\tconst labelY =\r\n\t\t\t\tcanvasRef.current.height / 2 +\r\n\t\t\t\t(Math.min(canvasRef.current.width / 2, canvasRef.current.height / 2) / 2) * Math.sin(startAngle + sliceAngle / 2);\r\n\r\n\t\t\tctx.fillStyle = 'white';\r\n\t\t\tctx.font = '16px Arial';\r\n\t\t\tctx.textAlign = 'center';\r\n\t\t\tctx.textBaseline = 'middle';\r\n\t\t\tctx.fillText(item.x, labelX, labelY);\r\n\r\n\t\t\tstartAngle += sliceAngle;\r\n\t\t});\r\n\t};\r\n\r\n\tuseEffect(() => {\r\n\t\tdrawChart();\r\n\t}, []);\r\n\r\n\treturn (\r\n\t\t<>\r\n\t\t\t\r\n\t\t\r\n\t);\r\n};\r\n\r\nexport default PieChart;\r\n","const __WEBPACK_NAMESPACE_OBJECT__ = require(\"prop-types\");","import React from \"react\";\r\nimport PropTypes from \"prop-types\";\r\n\r\nconst BoxPlot = ({\r\n data = [1, 6, 2, 3, 5],\r\n width,\r\n height,\r\n paddingLeft,\r\n paddingRight,\r\n paddingTop,\r\n paddingBottom,\r\n xLabels = [1, \"B\", \"C\", \"D\", \"E\", \"5\", \"9\"],\r\n}) => {\r\n // Sort the data\r\n const sortedData = data.slice().sort((a, b) => a - b);\r\n\r\n // Calculate quartiles\r\n const q1 = sortedData[Math.floor(sortedData.length * 0.25)];\r\n const q2 = sortedData[Math.floor(sortedData.length * 0.5)];\r\n const q3 = sortedData[Math.floor(sortedData.length * 0.75)];\r\n\r\n // Calculate interquartile range\r\n const iqr = q3 - q1;\r\n\r\n // Calculate whiskers\r\n const lowerWhisker = q1 - 1.5 * iqr;\r\n const upperWhisker = q3 + 1.5 * iqr;\r\n\r\n const innerWidth = width - paddingLeft - paddingRight;\r\n const innerHeight = height - paddingTop - paddingBottom;\r\n\r\n return (\r\n \r\n );\r\n};\r\n\r\nBoxPlot.propTypes = {\r\n data: PropTypes.arrayOf(PropTypes.number).isRequired,\r\n width: PropTypes.number,\r\n height: PropTypes.number,\r\n paddingLeft: PropTypes.number,\r\n paddingRight: PropTypes.number,\r\n paddingTop: PropTypes.number,\r\n paddingBottom: PropTypes.number,\r\n xLabels: PropTypes.arrayOf(PropTypes.string).isRequired,\r\n};\r\n\r\nBoxPlot.defaultProps = {\r\n width: 400,\r\n height: 200,\r\n paddingLeft: 40,\r\n paddingRight: 20,\r\n paddingTop: 20,\r\n paddingBottom: 40,\r\n};\r\n\r\nexport default BoxPlot;\r\n","import React from 'react';\r\nimport HeatMap from './section/HeatMap/HeatMap';\r\nimport BulletChart from './section/bulletCharts/BulletChart';\r\nimport Histogram from './section/Histogram/Histogram';\r\nimport Pie from './section/Pie/Pie';\r\nimport BoxPlot from './section/BoxPlot/BoxPlot';\r\n\r\nexport default function Charts({ mode, ...rest }) {\r\n\treturn (\r\n\t\t<>\r\n\t\t\t{mode === 'heat-map' &&\r\n
\r\n \r\n
\r\n {state.value} %
\r\n \r\n \r\n {eventClose ?
\r\n ) : (\r\n \"\"\r\n )}\r\n {props.children}
\r\n \r\n \r\n );\r\n};\r\n\r\nexport default Drawer;\r\n","\n import API from \"!../../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\";\n import domAPI from \"!../../../../node_modules/style-loader/dist/runtime/styleDomAPI.js\";\n import insertFn from \"!../../../../node_modules/style-loader/dist/runtime/insertBySelector.js\";\n import setAttributes from \"!../../../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js\";\n import insertStyleElement from \"!../../../../node_modules/style-loader/dist/runtime/insertStyleElement.js\";\n import styleTagTransformFn from \"!../../../../node_modules/style-loader/dist/runtime/styleTagTransform.js\";\n import content, * as namedExport from \"!!../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./Pagination.css\";\n \n \n\nvar options = {};\n\noptions.styleTagTransform = styleTagTransformFn;\noptions.setAttributes = setAttributes;\n\n options.insert = insertFn.bind(null, \"head\");\n \noptions.domAPI = domAPI;\noptions.insertStyleElement = insertStyleElement;\n\nvar update = API(content, options);\n\n\n\nexport * from \"!!../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./Pagination.css\";\n export default content && content.locals ? content.locals : undefined;\n","import React, { useEffect, useState } from 'react'\r\nimport './Pagination.css'\r\nimport CbmisIcon from '../../../icon/CbmisIcon'\r\nimport '../../../style/main.css'\r\nimport * as componentsFunction from '../../../helper/CbmisFunction'\r\nimport useCheckScreenSize from '../../../hook/useCheckScreenSize'\r\nimport { setSXStyle } from '../../../helper/convertJsCss'\r\n\r\nconst Pagination=(props) => {\r\n useCheckScreenSize()\r\n const {count,setStyle,color,textColor} =props\r\n const [arrPagination, setArrPagination] = useState([])\r\n const [paginationStyle, setpaginationStyle] = useState(\"cbmis-pagination-filled\")\r\n\r\n useEffect(() => {\r\n const array = [];\r\n for (let index = 1; index <= parseInt(count); index++) {\r\n array.push(index)\r\n }\r\n setArrPagination(array)\r\n }, [count])\r\n\r\n useEffect(() => {\r\n if(setStyle){\r\n const paginationStyle = String(setStyle).toLowerCase()\r\n switch (paginationStyle) {\r\n case \"outlined\":\r\n setpaginationStyle(\"cbmis-pagination-outlined\")\r\n break; \r\n default:\r\n setpaginationStyle(\"cbmis-pagination-filled\")\r\n break;\r\n }\r\n }\r\n }, [setStyle])\r\n\r\n useEffect(() => {\r\n if(paginationStyle === \"cbmis-pagination-filled\"){\r\n componentsFunction.getbgColorReturnClassName(\".cbmis-pagination-filled\",color)\r\n }else if(paginationStyle === \"cbmis-pagination-outlined\"){\r\n componentsFunction.getOutlinedStyleColorReturnClassName(\".cbmis-pagination-outlined\",color)\r\n }\r\n }, [paginationStyle,color])\r\n\r\n useEffect(() => {\r\n componentsFunction.changeItemColor(\".cbmis-pagination\",textColor || \"var(--cbmis-body-color)\")\r\n }, [textColor])\r\n\r\n return (\r\n {icon ? icon :
\r\n {openIcon ? openIcon :
\r\n - {props.children}
\r\n
\r\n );\r\n}\r\n\r\nexport default Step;\r\n","import React, { useEffect, useRef } from 'react'\r\nimport Step from './Step'\r\nimport './Stepper.css'\r\nimport '../../../style/main.css'\r\n\r\nfunction StepperHead(props) {\r\n const {stepperContent,stepClicked,navigateToStepHandler,mode,currentTabIndex,completedColor,sx,className} = props\r\n\t\r\n\tuseEffect(() => {\r\n\t}, [stepperContent,stepClicked,navigateToStepHandler,mode,currentTabIndex,completedColor,sx,className])\r\n\t\r\n\treturn (\r\n \r\n handleStepClicked(index)}\r\n {...rest}\r\n >\r\n {String(mode).toLowerCase() !== \"dot\" ? (\r\n isComplete || isError || isWarning ? (\r\n
\r\n {String(mode).toLowerCase() !== \"dot\" ? {label}
: \"\"}\r\n \r\n
\r\n \r\n );\r\n}\r\n\r\nexport default Stepper;\r\n","\n import API from \"!../../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\";\n import domAPI from \"!../../../../node_modules/style-loader/dist/runtime/styleDomAPI.js\";\n import insertFn from \"!../../../../node_modules/style-loader/dist/runtime/insertBySelector.js\";\n import setAttributes from \"!../../../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js\";\n import insertStyleElement from \"!../../../../node_modules/style-loader/dist/runtime/insertStyleElement.js\";\n import styleTagTransformFn from \"!../../../../node_modules/style-loader/dist/runtime/styleTagTransform.js\";\n import content, * as namedExport from \"!!../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./Slideshow.css\";\n \n \n\nvar options = {};\n\noptions.styleTagTransform = styleTagTransformFn;\noptions.setAttributes = setAttributes;\n\n options.insert = insertFn.bind(null, \"head\");\n \noptions.domAPI = domAPI;\noptions.insertStyleElement = insertStyleElement;\n\nvar update = API(content, options);\n\n\n\nexport * from \"!!../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./Slideshow.css\";\n export default content && content.locals ? content.locals : undefined;\n","import React, { useEffect, useState, useRef } from \"react\";\r\nimport \"./Slideshow.css\";\r\nimport \"../../../style/main.css\";\r\nimport CbmisIcon from \"../../../icon/CbmisIcon\";\r\nimport VideoPlayer from \"../../dataDisplay/videoPlayer/VideoPlayer\";\r\nimport * as componentsFunction from \"../../../helper/CbmisFunction\";\r\nimport useCheckScreenSize from \"../../../hook/useCheckScreenSize\";\r\nimport { setSxClassName, setSXStyle } from \"../../../helper/convertJsCss\";\r\n\r\nfunction Slideshow(props) {\r\n const { slides = [], autoShow, delay, activeColor, dotsShow, slideNumber = 1, sx, hidden, disabled, dir, className, ...rest } = props;\r\n\r\n const screenWidth = useCheckScreenSize();\r\n\r\n const [index, setIndex] = useState(0);\r\n const timeoutRef = useRef(null);\r\n const styleRef = useRef({ strSxClassName: \"\", strSXComponentID: componentsFunction.randomName(\"cbmis-slid-show\") });\r\n const sliderSplitNum = new Array(Math.round(slides.length / slideNumber));\r\n const extraSlide = slides.length % slideNumber;\r\n\r\n const canMove = Math.round(slides.length / slideNumber) > 1;\r\n const isAutoShow = autoShow && canMove;\r\n const timeDelay = delay || 3000;\r\n\r\n useEffect(() => {}, [slides, autoShow, delay, activeColor, dotsShow, sx, hidden, disabled, dir, className]);\r\n\r\n useEffect(() => {\r\n if (isAutoShow) {\r\n resetTimeout();\r\n timeoutRef.current = setTimeout(() => setIndex((prevIndex) => (prevIndex === slides.length - 1 ? 0 : prevIndex + 1)), timeDelay);\r\n\r\n return () => {\r\n resetTimeout();\r\n };\r\n }\r\n }, [index]);\r\n\r\n useEffect(() => {\r\n if (activeColor) {\r\n document.documentElement.style.setProperty(\"--cbmis-slideshow-active-color\", componentsFunction.checkColorReturnValue(activeColor));\r\n }\r\n }, []);\r\n\r\n useEffect(() => {\r\n if (sx) {\r\n setSxClassName(styleRef, styleRef.current.strSXComponentID, sx, \"cbmis-slid-show\");\r\n }\r\n }, [sx, screenWidth]);\r\n\r\n function resetTimeout() {\r\n if (timeoutRef.current) {\r\n clearTimeout(timeoutRef.current);\r\n }\r\n }\r\n\r\n const handelNext = () => {\r\n if (canMove) {\r\n var next = index + 1;\r\n if (next === sliderSplitNum.length) {\r\n next = 0;\r\n }\r\n setIndex(next);\r\n }\r\n };\r\n\r\n const handelPrev = () => {\r\n if (canMove) {\r\n var Prev = index - 1;\r\n if (Prev === -1) {\r\n Prev = sliderSplitNum.length - 1;\r\n }\r\n setIndex(Prev);\r\n }\r\n };\r\n\r\n const getRestProps = () => {\r\n const newRest = componentsFunction.filterPaddingAndMargin(rest);\r\n return { ...newRest };\r\n };\r\n\r\n return (\r\n \r\n {stepperContentArr.map((el, i) => (\r\n {i === currentTabIndex && el.content} \r\n ))}\r\n
\r\n \r\n {slides.map((_, idx) => (\r\n {\r\n setIndex(idx);\r\n }}\r\n >
\r\n ))}\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n\r\n \r\n {!slide.videoMp4 ?
\r\n ))}\r\n {slides.map((slide, index) => { setSXStyle(`cbmis-slide-${index}`, slide.sx);\r\n return index < extraSlide ? (\r\n {slide.content}
: {slide.content}
: \r\n {tabsContent.map((el, i) => (\r\n
\r\n\r\n \r\n\r\n \r\n );\r\n}\r\n\r\nexport default TabsHead;\r\n","import React, { useEffect, useState, Fragment, useRef } from \"react\";\r\nimport * as componentsFunction from \"../../../helper/CbmisFunction\";\r\nimport useCheckScreenSize from \"../../../hook/useCheckScreenSize\";\r\nimport TabsHead from \"./TabsHead\";\r\nimport { setSxClassName } from \"../../../helper/convertJsCss\";\r\n\r\nfunction Tab(props) {\r\n const { tabsContent, currentTab, activeColor, mode, sx, hidden, disabled, dir, className, id, ...rest } = props;\r\n\r\n const screenWidth = useCheckScreenSize();\r\n\r\n const getID = useRef(id || componentsFunction.randomName(\"Tabs\"));\r\n const styleRef = useRef({ strSxClassName: \"\" });\r\n\r\n const [currentTabIndex, setCurrentTabIndex] = useState(0);\r\n const [tabsContentArr, setTabsContentArr] = useState([]);\r\n\r\n useEffect(() => {}, [tabsContent, currentTab, activeColor, mode, sx, hidden, disabled, dir, className, id]);\r\n\r\n useEffect(() => {\r\n if (currentTab && parseInt(currentTab) > 1) {\r\n setCurrentTabIndex(parseInt(currentTab) - 1);\r\n } else {\r\n setCurrentTabIndex(0);\r\n }\r\n }, [currentTab]);\r\n\r\n useEffect(() => {\r\n if (sx) {\r\n setSxClassName(styleRef, getID.current, sx, \"cbmis-tabs-container\");\r\n }\r\n }, [sx, screenWidth]);\r\n\r\n useEffect(() => {\r\n if (tabsContent) {\r\n setTabsContentArr(tabsContent || []);\r\n }\r\n }, [tabsContent]);\r\n\r\n const navigateTotabHandler = (index) => {\r\n if (index !== currentTabIndex) {\r\n setCurrentTabIndex(index);\r\n }\r\n };\r\n const getMode = (mode) => {\r\n switch (String(mode).toLowerCase()) {\r\n case \"nav\":\r\n return \"cbmis-tabs-container-mode-nav\";\r\n case \"box\":\r\n return \"cbmis-tabs-container-mode-box\";\r\n case \"pill\":\r\n return \"cbmis-tabs-container-mode-pill\";\r\n case \"vertical\":\r\n return \"cbmis-tabs-container-mode-vertical\";\r\n default:\r\n return \"cbmis-tabs-container-mode-nav\";\r\n }\r\n };\r\n\r\n // const getPosition=()=>{\r\n // \tswitch (String(mode).toLowerCase() === \"vertical\") {\r\n // \t\tcase \"end\":\r\n // \t\t return(\"cbmis-vertical-tab-position-end\")\r\n // \t\tcase \"top\":\r\n // \t\t return(\"cbmis-vertical-tab-position-top\")\r\n // \t\tcase \"bottom\":\r\n // \t\t return(\"cbmis-vertical-tab-position-bottom\")\r\n // \t\tcase \"start\":\r\n // \t\t\treturn(\"cbmis-vertical-tab-position-start\")\r\n // \t default:\r\n // \t\t return(\"cbmis-vertical-tab-Position-start\")\r\n // }\r\n // }\r\n\r\n return (\r\n \r\n handleTabClicked(e, i, el)}\r\n />\r\n \r\n
\r\n ))}\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default Tab;\r\n","\n import API from \"!../../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\";\n import domAPI from \"!../../../../node_modules/style-loader/dist/runtime/styleDomAPI.js\";\n import insertFn from \"!../../../../node_modules/style-loader/dist/runtime/insertBySelector.js\";\n import setAttributes from \"!../../../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js\";\n import insertStyleElement from \"!../../../../node_modules/style-loader/dist/runtime/insertStyleElement.js\";\n import styleTagTransformFn from \"!../../../../node_modules/style-loader/dist/runtime/styleTagTransform.js\";\n import content, * as namedExport from \"!!../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./ParallaxScrolling.css\";\n \n \n\nvar options = {};\n\noptions.styleTagTransform = styleTagTransformFn;\noptions.setAttributes = setAttributes;\n\n options.insert = insertFn.bind(null, \"head\");\n \noptions.domAPI = domAPI;\noptions.insertStyleElement = insertStyleElement;\n\nvar update = API(content, options);\n\n\n\nexport * from \"!!../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./ParallaxScrolling.css\";\n export default content && content.locals ? content.locals : undefined;\n","import React, { useEffect, useRef } from \"react\";\r\nimport \"./ParallaxScrolling.css\";\r\nimport \"../../../style/main.css\";\r\nimport * as componentsFunction from \"../../../helper/CbmisFunction\";\r\nimport useCheckScreenSize from \"../../../hook/useCheckScreenSize\";\r\nimport { setSxClassName } from \"../../../helper/convertJsCss\";\r\n\r\nfunction ParallaxScrolling(props) {\r\n const { src, id, sx, hidden, disabled, dir, className, ...rest } = props;\r\n\r\n const screenWidth = useCheckScreenSize();\r\n\r\n const getID = useRef(id || componentsFunction.randomName(\"Link\"));\r\n const styleRefContainer = useRef({ strSxClassName: \"\", strSXComponentID: componentsFunction.randomName(\"cbmis-ParallaxScrolling-container\") });\r\n const styleRefImg = useRef({ strSxClassName: \"\" });\r\n\r\n const getRestProps = () => {\r\n const newRest = componentsFunction.filterPaddingAndMargin(rest);\r\n return { ...newRest };\r\n };\r\n\r\n useEffect(() => {}, [src, id, hidden, disabled, dir, className]);\r\n\r\n useEffect(() => {\r\n if (sx) {\r\n setSxClassName(styleRefContainer, styleRefContainer.current.strSXComponentID, sx, \"cbmis-ParallaxScrolling-container\");\r\n setSxClassName(styleRefImg, getID.current, sx, \"cbmis-ParallaxScrolling-image\");\r\n }\r\n }, [sx, screenWidth]);\r\n\r\n return (\r\n \r\n {tabsContentArr.map((el, i) => (\r\n {i === currentTabIndex && el.content} \r\n ))}\r\n
\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default ParallaxScrolling;\r\n","\n import API from \"!../../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\";\n import domAPI from \"!../../../../node_modules/style-loader/dist/runtime/styleDomAPI.js\";\n import insertFn from \"!../../../../node_modules/style-loader/dist/runtime/insertBySelector.js\";\n import setAttributes from \"!../../../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js\";\n import insertStyleElement from \"!../../../../node_modules/style-loader/dist/runtime/insertStyleElement.js\";\n import styleTagTransformFn from \"!../../../../node_modules/style-loader/dist/runtime/styleTagTransform.js\";\n import content, * as namedExport from \"!!../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./AppBar.css\";\n \n \n\nvar options = {};\n\noptions.styleTagTransform = styleTagTransformFn;\noptions.setAttributes = setAttributes;\n\n options.insert = insertFn.bind(null, \"head\");\n \noptions.domAPI = domAPI;\noptions.insertStyleElement = insertStyleElement;\n\nvar update = API(content, options);\n\n\n\nexport * from \"!!../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./AppBar.css\";\n export default content && content.locals ? content.locals : undefined;\n","const __WEBPACK_NAMESPACE_OBJECT__ = require(\"async\");","import React, { useEffect, useRef, useState } from \"react\";\r\nimport \"./AppBar.css\";\r\nimport Drawer from \"../Drawer/Drawer\";\r\nimport BottomBar from \"../BottomBar/BottomBar\";\r\nimport \"../../../style/main.css\";\r\nimport * as componentsFunction from \"../../../helper/CbmisFunction\";\r\nimport useCheckScreenSize from \"../../../hook/useCheckScreenSize\";\r\nimport { setSxClassName } from \"../../../helper/convertJsCss\";\r\nimport { log } from \"async\";\r\n\r\nfunction AppBar(props) {\r\n const {\r\n textColor,\r\n color,\r\n position,\r\n isClose,\r\n justify,\r\n sideBarMode,\r\n sideBarTitle,\r\n sideBarTextColor,\r\n sideBarColor,\r\n sideBarClose,\r\n sideBarPosition,\r\n sx,\r\n hidden,\r\n disabled,\r\n dir,\r\n className,\r\n id,\r\n ...rest\r\n } = props;\r\n\r\n const screenWidth = useCheckScreenSize();\r\n const getID = useRef(id || componentsFunction.randomName(\"AppBar\"));\r\n const styleRef = useRef({ strSxClassName: \"\" });\r\n\r\n var viewport_width = window.innerWidth;\r\n const [openMenu, setOpenMenu] = useState({\r\n sideBarOpen: false,\r\n bottomOpen: false,\r\n bottomBarContent: \"\",\r\n bottomBarTitle: \"\",\r\n });\r\n\r\n useEffect(() => {}, [position, isClose, hidden, disabled, dir, className, id]);\r\n\r\n useEffect(() => {\r\n if (sx) {\r\n setSxClassName(styleRef, getID.current, sx, \"cbmis-app-bar\");\r\n }\r\n }, [sx, screenWidth]);\r\n\r\n const bodyMarginTop = () => {\r\n document.body.style.paddingTop = \"5ram\";\r\n };\r\n\r\n const getPostion = () => {\r\n if (position) {\r\n const positionAppBar = String(position).toLowerCase();\r\n switch (positionAppBar) {\r\n case \"fixed\":\r\n bodyMarginTop();\r\n return \"cbmis-app-bar-position-fixed\";\r\n case \"relative\":\r\n return \"cbmis-app-bar-position-relative\";\r\n case \"static\":\r\n return \"cbmis-app-bar-position-static\";\r\n case \"absolute\":\r\n bodyMarginTop();\r\n return \"cbmis-app-bar-position-absolute\";\r\n case \"sticky\":\r\n return \"cbmis-app-bar-position-sticky\";\r\n default:\r\n return \"\";\r\n }\r\n }\r\n };\r\n\r\n const getJustify = () => {\r\n switch (String(justify).toLowerCase()) {\r\n case \"start\":\r\n return \"cbmis-toolbar-justify-self-flex-start\";\r\n case \"center\":\r\n return \"cbmis-toolbar-justify-self-center\";\r\n case \"end\":\r\n return \"cbmis-toolbar-justify-self-flex-end\";\r\n case \"space-between\":\r\n return \"cbmis-toolbar-justify-self-space-between\";\r\n case \"space-around\":\r\n return \"cbmis-toolbar-justify-self-space-around\";\r\n case \"space-evenly\":\r\n return \"cbmis-toolbar-justify-self-space-evenly\";\r\n default:\r\n return \"cbmis-toolbar-justify-self-space-between\";\r\n }\r\n };\r\n const getRestProps = () => {\r\n const newRest = componentsFunction.filterPaddingAndMargin(rest);\r\n return { ...newRest };\r\n };\r\n\r\n const handelDialogDrawer = () => {\r\n openMenu.sideBarOpen = !openMenu.sideBarOpen;\r\n setOpenMenu({ ...openMenu });\r\n };\r\n const handelDialogBottomMenu =(item = {}) =>\r\n () => {\r\n if (!openMenu.bottomOpen) {\r\n if (item?.props?.menu && String(item?.props?.ssMode).toLowerCase() === \"bottombar\" && viewport_width <= 800) {\r\n openMenu.bottomOpen = true;\r\n openMenu.bottomBarTitle = item?.props?.label;\r\n openMenu.bottomBarContent = item?.props?.menu || \"\";\r\n }\r\n } else {\r\n openMenu.bottomOpen = false;\r\n openMenu.bottomBarContent = \"\";\r\n openMenu.bottomBarTitle = \"\";\r\n }\r\n setOpenMenu({ ...openMenu });\r\n };\r\n\r\n const handelCloseBottomMenu = () => {\r\n openMenu.bottomOpen = false;\r\n openMenu.bottomBarContent = \"\";\r\n setOpenMenu({ ...openMenu });\r\n };\r\n\r\n const checkChildren = (propsChildren) => {\r\n let children = [];\r\n if (propsChildren) {\r\n if (Array.isArray(propsChildren)) {\r\n children = propsChildren;\r\n } else {\r\n children = [propsChildren];\r\n }\r\n }\r\n return children;\r\n };\r\n\r\n const getContent = () => {\r\n const children = checkChildren(props?.children);\r\n let navBar = [];\r\n let sideBar = [];\r\n let bottomBar = [];\r\n let logo = \"\";\r\n\r\n const checkMode = (mode, item, defaultItem) => {\r\n switch (String(mode).toLowerCase()) {\r\n case \"logo\":\r\n logo = item;\r\n break;\r\n case \"sidebar\":\r\n sideBar.push(item);\r\n break;\r\n case \"navbar\":\r\n navBar.push(item);\r\n break;\r\n case \"bottombar\":\r\n const bottomItem = {\r\n icon: item?.props?.icon,\r\n path: item?.props?.path,\r\n label: item.props?.label || item?.props?.children,\r\n onClick: handelDialogBottomMenu(item),\r\n };\r\n if (Number(item.props.bottomBarIndex)) {\r\n bottomBar[Number(item.props.bottomBarIndex)] = bottomItem;\r\n } else {\r\n bottomBar.push(bottomItem);\r\n }\r\n break;\r\n case \"none\":\r\n break;\r\n default:\r\n switch (String(defaultItem).toLowerCase()) {\r\n case \"sidebar\":\r\n sideBar.push(item);\r\n break;\r\n case \"navbar\":\r\n navBar.push(item);\r\n break;\r\n default:\r\n break;\r\n }\r\n break;\r\n }\r\n };\r\n\r\n children.forEach((item) => {\r\n const children2 = checkChildren(item?.props?.children);\r\n\r\n if (viewport_width > 800) {\r\n if (item.props.sxMode) {\r\n checkMode(item.props.sxMode, item, \"navbar\");\r\n } else {\r\n children2.forEach((child) => {\r\n checkMode(child.props.sxMode, child, \"sidebar\");\r\n });\r\n }\r\n } else {\r\n if (item.props.ssMode) {\r\n checkMode(item.props.ssMode, item);\r\n } else {\r\n children2.forEach((child) => {\r\n checkMode(child.props.ssMode, child);\r\n });\r\n }\r\n }\r\n });\r\n\r\n return [navBar, sideBar, bottomBar, logo];\r\n };\r\n\r\n useEffect(() => {\r\n if(sideBarClose === true && viewport_width < 800 ){\r\n handelDialogDrawer()\r\n }\r\n }, [sideBarClose])\r\n \r\n\r\n const [navBar, sideBar, bottomBar, logo] = getContent();\r\n\r\n return (\r\n \r\n
\r\n {props.children}
\r\n {logo}
: null}\r\n\r\n {sideBar.length && String(sideBarMode).toLowerCase() !== \"show-header\" ? (\r\n \r\n \r\n \r\n \r\n
\r\n ) : null}\r\n {navBar}\r\n \r\n \r\n {logo && String(sideBarMode).toLowerCase() === \"show-header\" ?
\r\n \r\n\r\n {viewport_width > 800 ? null : (\r\n {logo}
: null}\r\n {sideBar}\r\n {openMenu.bottomBarContent}
\r\n \r\n
\r\n ) : null}\r\n - \r\n {menu.map((item, index) => {\r\n return
\r\n
\r\n \r\n );\r\n};\r\n\r\nexport default Accordion;\r\n","import React, { useEffect, useRef } from \"react\";\r\nimport \"./Accordion.css\";\r\nimport * as componentsFunction from \"../../../helper/CbmisFunction\";\r\nimport useCheckScreenSize from \"../../../hook/useCheckScreenSize\";\r\nimport { setSxClassName } from \"../../../helper/convertJsCss\";\r\nimport { strTestProps } from \"../../../helper/CbmisVariables\";\r\n\r\nconst AccordionTab = (props) => {\r\n const { children, sx, hidden, disabled, dir, className, id, ...rest } = props;\r\n const screenWidth = useCheckScreenSize();\r\n\r\n if(props?.[strTestProps]){\r\n if(children){\r\n console.log(\"AccordionTab\", \"children\");\r\n }\r\n if(props?.sx){\r\n console.log(\"AccordionTab\", \"sx\",);\r\n }\r\n }\r\n const getID = useRef(id || componentsFunction.randomName(\"AvataAccordionTabr\"));\r\n const styleRef = useRef({ strSxClassName: \"\" });\r\n\r\n const getRestProps = () => {\r\n const newRest = componentsFunction.filterPaddingAndMargin(rest);\r\n return { ...newRest };\r\n };\r\n\r\n useEffect(() => {}, [children, hidden, disabled, dir, className, id]);\r\n\r\n useEffect(() => {\r\n if (sx) {\r\n setSxClassName(styleRef, getID.current, sx, \"cbmis-accordion-tab-summary\");\r\n }\r\n }, [sx, screenWidth]);\r\n\r\n return (\r\n \r\n \r\n {children}\r\n
\r\n {props.children}
\r\n \r\n );\r\n};\r\n\r\nexport default CardFront;\r\n","import React, { useEffect, useRef } from \"react\";\r\nimport \"./Card.css\";\r\nimport \"../../../style/main.css\";\r\nimport * as componentsFunction from \"../../../helper/CbmisFunction\";\r\nimport useCheckScreenSize from \"../../../hook/useCheckScreenSize\";\r\nimport { setSxClassName } from \"../../../helper/convertJsCss\";\r\nimport { strTestProps } from \"../../../helper/CbmisVariables\";\r\n\r\nconst CardBack = (props) => {\r\n const { sx, hidden, disabled, dir, className, id, ...rest } = props;\r\n const screenWidth = useCheckScreenSize();\r\n\r\n if(props?.[strTestProps]){\r\n if(props?.sx){\r\n console.log(\"CardBack\", \"sx\",);\r\n }\r\n }\r\n const getID = useRef(id || componentsFunction.randomName(\"CardBack\"));\r\n const styleRef = useRef({ strSxClassName: \"\" });\r\n\r\n const getRestProps = () => {\r\n const newRest = componentsFunction.filterPaddingAndMargin(rest);\r\n return { ...newRest };\r\n };\r\n\r\n useEffect(() => {}, [hidden, disabled, dir, className, id]);\r\n\r\n useEffect(() => {\r\n if (sx) {\r\n setSxClassName(styleRef, getID.current, sx, \"cbmis-card-back\");\r\n }\r\n }, [sx, screenWidth]);\r\n\r\n return (\r\n {props.children}
\r\n \r\n );\r\n};\r\n\r\nexport default CardBack;\r\n","import React, { useEffect, useRef } from \"react\";\r\nimport \"./Card.css\";\r\nimport \"../../../style/main.css\";\r\nimport * as componentsFunction from \"../../../helper/CbmisFunction\";\r\nimport useCheckScreenSize from \"../../../hook/useCheckScreenSize\";\r\nimport { setSxClassName } from \"../../../helper/convertJsCss\";\r\nimport { strTestProps } from \"../../../helper/CbmisVariables\";\r\n\r\nconst CardImage = (props) => {\r\n const { src, title, hoverContent, sx, hidden, disabled, dir, className, id, ...rest } = props;\r\n const screenWidth = useCheckScreenSize();\r\n\r\n if(props?.[strTestProps]){\r\n if(props?.src){\r\n console.log(\"CardImage\", \"src\",);\r\n }\r\n if(props?.title){\r\n console.log(\"CardImage\", \"title\",);\r\n }\r\n if(props?.hoverContent){\r\n console.log(\"CardImage\", \"hoverContent\",);\r\n }\r\n if(props?.sx){\r\n console.log(\"CardImage\", \"sx\",);\r\n }\r\n }\r\n const getID = useRef(id || componentsFunction.randomName(\"CardImage\"));\r\n const styleRef = useRef({ strSxClassName: \"\" });\r\n\r\n const getRestProps = () => {\r\n const newRest = componentsFunction.filterPaddingAndMargin(rest);\r\n return { ...newRest };\r\n };\r\n\r\n useEffect(() => {}, [src, title, hoverContent, hidden, disabled, dir, className, id]);\r\n\r\n useEffect(() => {\r\n if (sx) {\r\n setSxClassName(styleRef, getID.current, sx, \"cbmis-card-image\");\r\n }\r\n }, [sx, screenWidth]);\r\n\r\n return (\r\n {props.children}
\r\n \r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nexport default CardImage;\r\n","import React, { useEffect, useRef } from \"react\";\r\nimport \"./Card.css\";\r\nimport \"../../../style/main.css\";\r\nimport * as componentsFunction from \"../../../helper/CbmisFunction\";\r\nimport useCheckScreenSize from \"../../../hook/useCheckScreenSize\";\r\nimport { setSxClassName } from \"../../../helper/convertJsCss\";\r\nimport { strTestProps } from \"../../../helper/CbmisVariables\";\r\n\r\nconst CardDetails = (props) => {\r\n const { sx, hidden, disabled, dir, className, id, ...rest } = props;\r\n const screenWidth = useCheckScreenSize();\r\n\r\n if(props?.[strTestProps]){\r\n if(props?.sx){\r\n console.log(\"CardDetails\", \"sx\",);\r\n }\r\n }\r\n const getID = useRef(id || componentsFunction.randomName(\"CardDetails\"));\r\n const styleRef = useRef({ strSxClassName: \"\" });\r\n\r\n const getRestProps = () => {\r\n const newRest = componentsFunction.filterPaddingAndMargin(rest);\r\n return { ...newRest };\r\n };\r\n\r\n useEffect(() => {}, [hidden, disabled, dir, className, id]);\r\n\r\n useEffect(() => {\r\n if (sx) {\r\n setSxClassName(styleRef, getID.current, sx, \"cbmis-card-details\");\r\n }\r\n }, [sx, screenWidth]);\r\n\r\n return (\r\n {hoverContent}
\r\n {props.children}
\r\n \r\n );\r\n};\r\n\r\nexport default CardDetails;\r\n","\n import API from \"!../../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\";\n import domAPI from \"!../../../../node_modules/style-loader/dist/runtime/styleDomAPI.js\";\n import insertFn from \"!../../../../node_modules/style-loader/dist/runtime/insertBySelector.js\";\n import setAttributes from \"!../../../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js\";\n import insertStyleElement from \"!../../../../node_modules/style-loader/dist/runtime/insertStyleElement.js\";\n import styleTagTransformFn from \"!../../../../node_modules/style-loader/dist/runtime/styleTagTransform.js\";\n import content, * as namedExport from \"!!../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./Glass.css\";\n \n \n\nvar options = {};\n\noptions.styleTagTransform = styleTagTransformFn;\noptions.setAttributes = setAttributes;\n\n options.insert = insertFn.bind(null, \"head\");\n \noptions.domAPI = domAPI;\noptions.insertStyleElement = insertStyleElement;\n\nvar update = API(content, options);\n\n\n\nexport * from \"!!../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./Glass.css\";\n export default content && content.locals ? content.locals : undefined;\n","import React, { useEffect, useRef } from \"react\";\r\nimport \"./Glass.css\";\r\nimport \"../../../style/main.css\";\r\nimport * as componentsFunction from \"../../../helper/CbmisFunction\";\r\nimport useCheckScreenSize from \"../../../hook/useCheckScreenSize\";\r\nimport { setSxClassName } from \"../../../helper/convertJsCss\";\r\n\r\nconst Glass = (props) => {\r\n const { color, sx, hidden, disabled, dir, className, id, ...rest } = props;\r\n\r\n const screenWidth = useCheckScreenSize();\r\n const styleRef = useRef({ strSxClassName: \"\", strSXComponentID: id || componentsFunction.randomName(\"cbmis-glass\") });\r\n\r\n useEffect(() => {}, [hidden, disabled, dir, className, id]);\r\n\r\n useEffect(() => {\r\n document.documentElement.style.setProperty(\"--cbmis-glass-color\", componentsFunction.checkColorReturnValue(color || \"#000\"));\r\n }, [color]);\r\n\r\n useEffect(() => {\r\n if (sx) {\r\n setSxClassName(styleRef, styleRef.current.strSXComponentID, sx, \"cbmis-glass\");\r\n }\r\n }, [sx, screenWidth]);\r\n\r\n const getRestProps = () => {\r\n const newRest = componentsFunction.filterPaddingAndMargin(rest);\r\n return { ...newRest };\r\n };\r\n\r\n return (\r\n \r\n \r\n {props.children}\r\n
\r\n \r\n );\r\n};\r\n\r\nexport default Paper;\r\n","import \"./style/var.css\";\r\nimport \"./style/main.css\";\r\n\r\nclass AppStyleConfig {\r\n constructor(intStyleSheetSxIndex, objCSSRuleSxIndex) {\r\n this.intStyleSheetSxIndex = intStyleSheetSxIndex;\r\n this.objCSSRuleSxIndex = objCSSRuleSxIndex;\r\n }\r\n}\r\nexport var appStyleConfig = new AppStyleConfig(-1, {});\r\nexport function updateAppConfig({ intStyleSheetSxIndex = undefined, objCSSRuleSxIndex = undefined }) {\r\n if (intStyleSheetSxIndex !== null && intStyleSheetSxIndex !== undefined) {\r\n appStyleConfig.intStyleSheetSxIndex = intStyleSheetSxIndex;\r\n }\r\n if (objCSSRuleSxIndex !== null && objCSSRuleSxIndex !== undefined) {\r\n appStyleConfig.objCSSRuleSxIndex = objCSSRuleSxIndex;\r\n }\r\n}\r\n\r\n//CbmisRouter\r\nexport {\r\n BrowserRouter,\r\n createBrowserRouter,\r\n HashRouter,\r\n Link,\r\n NavLink,\r\n createHashRouter,\r\n AbortedDeferredError,\r\n Await,\r\n MemoryRouter,\r\n Navigate,\r\n NavigationType,\r\n Outlet,\r\n Route,\r\n Router,\r\n RouterProvider,\r\n Routes,\r\n createMemoryRouter,\r\n createPath,\r\n createRoutesFromChildren,\r\n createRoutesFromElements,\r\n defer,\r\n isRouteErrorResponse,\r\n generatePath,\r\n json,\r\n matchPath,\r\n matchRoutes,\r\n parsePath,\r\n redirect,\r\n renderMatches,\r\n resolvePath,\r\n unstable_useBlocker,\r\n useActionData,\r\n useAsyncError,\r\n useAsyncValue,\r\n useHref,\r\n useInRouterContext,\r\n useLoaderData,\r\n useLocation,\r\n useMatch,\r\n useMatches,\r\n useNavigate,\r\n useNavigation,\r\n useNavigationType,\r\n useOutlet,\r\n useOutletContext,\r\n useParams,\r\n useResolvedPath,\r\n useRevalidator,\r\n useRouteError,\r\n useRouteLoaderData,\r\n useRoutes,\r\n useLinkClickHandler,\r\n useSearchParams,\r\n} from \"react-router-dom\";\r\n\r\n/*** system*start ***/\r\n\r\n//SecureRoute\r\nexport * as SecureRoute from \"./system/cbmisRouter/SecureRoute/SecureRoute\";\r\n\r\n//cbmisFunction\r\nexport * as ClientFunction from \"./system/cbmisFunction\";\r\n\r\n//CbmisTest\r\nexport * as ClientTest from \"./system/cbmisTest/CbmisTest\";\r\n\r\n//CbmisData\r\nexport * as ClientData from \"./system/cbmisData/CbmisData\";\r\n\r\n//CbmisDirection\r\nexport * as ClientDirection from \"./system/cbmisDirection/CbmisDirection\";\r\nexport * as setDirectionByLanguage from \"./system/cbmisDirection/CbmisDirection\";\r\n\r\n//ClientNotification\r\nexport * as ClientNotification from \"./system/cbmisNotification/cbmisNotification\";\r\n\r\n//cbmis CbmisInfiniteScroll\r\nexport { default as InfiniteScroll } from \"./system/CbmisInfiniteScroll/CbmisInfiniteScroll\";\r\n\r\n/*** system*end ***/\r\n\r\n/*** hook*start ***/\r\n\r\nexport { default as ThemeProvider } from \"./api/ThemeProvider/ThemeProvider\";\r\n\r\n//CbmisContextApi\r\nexport { default as AppProvider } from \"./api/cbmisContextApi/AppProvider\";\r\n\r\n//useCheckUserLoginKey\r\nexport { default as useCheckUserLoginKey } from \"./hook/useCheckUserLoginKey\";\r\n\r\n//cbmis formapi\r\nexport { default as FormControl } from \"./api/cbmisFormapi/FormControl\";\r\nexport { default as useForm } from \"./api/cbmisFormapi/useForm\";\r\nexport { default as FormField } from \"./api/cbmisFormapi/FormField\";\r\n\r\n/*** hook*end ***/\r\n\r\n/*** sybSystem*start ***/\r\n//PermissionControl\r\nexport { default as PermissionControl } from \"./api/CbmisPermissions/PermissionControl\";\r\n\r\n//ManageCategories\r\nexport { default as ManageCategories } from \"./api/ManageCategories/ManageCategories\";\r\nexport { default as SelectCategory } from \"./api/ManageCategories/SelectCategory\";\r\n\r\n//cbmis camera\r\nexport { default as Camera } from \"./api/cbmisCamera/camera/Camera\";\r\nexport { default as useCamera } from \"./api/cbmisCamera/useCamera.js\";\r\n\r\nexport { default as FileUploader } from \"./api/cbmisUploader/uploadImage/ImageUploader\";\r\n\r\nexport { default as ChatBot } from \"./api/cbmisChat/ChatBot\";\r\n\r\nexport { default as VoiceRecorder } from \"./api/cbmisVoiceRecorder/CbmisVoiceRecorder\";\r\nexport { default as useRecorder } from \"./api/cbmisVoiceRecorder/useRecorder\";\r\n\r\n// export { default as AppStorage } from \"./api/appStorage/AppStorage\";\r\n\r\n/*** subSystem*end ***/\r\n\r\n//#region cbmis dataDisplay\r\nexport { default as Avatar } from \"./material/dataDisplay/Avatar/Avatar\";\r\nexport { default as Badge } from \"./material/dataDisplay/Badge/Badge\";\r\nexport { default as Chip } from \"./material/dataDisplay/Chip/Chip\";\r\nexport { default as Counter } from \"./material/dataDisplay/Counter/Counter\";\r\nexport { default as Modal } from \"./material/dataDisplay/Modal/Modal\";\r\nexport { default as ModalHeader } from \"./material/dataDisplay/Modal/ModalHeader\";\r\nexport { default as ModalBody } from \"./material/dataDisplay/Modal/ModalBody\";\r\nexport { default as ModalFooter } from \"./material/dataDisplay/Modal/ModalFooter\";\r\nexport { default as Tooltip } from \"./material/dataDisplay/Tooltip/Tooltip\";\r\nexport { default as Typography } from \"./material/dataDisplay/Typography/Typography\";\r\nexport { default as Table } from \"./material/dataDisplay/Table/Table\";\r\nexport { default as TableHead } from \"./material/dataDisplay/Table/TableHead\";\r\nexport { default as TableBody } from \"./material/dataDisplay/Table/TableBody\";\r\nexport { default as TableFooter } from \"./material/dataDisplay/Table/TableFooter\";\r\nexport { default as TableRow } from \"./material/dataDisplay/Table/TableRow\";\r\nexport { default as TableCell } from \"./material/dataDisplay/Table/TableCell\";\r\nexport { default as VideoPlayer } from \"./material/dataDisplay/videoPlayer/VideoPlayer\";\r\nexport { default as Charts } from \"./material/dataDisplay/charts/Charts\";\r\nexport { default as RadialProgressBar } from \"./material/dataDisplay/RadialProgressBar/RadialProgressBar\";\r\n//#endregion\r\n\r\n//#region cbmis feedback\r\nexport * as Alert from \"./material/feedback/Alert/Alert\";\r\nexport * as Confirmation from \"./material/feedback/Confirmation/Confirmation\";\r\nexport { default as Note } from \"./material/feedback/Note/Note\";\r\n//#endregion\r\n\r\n//#region cbmisInput\r\nexport { default as Button } from \"./material/inputs/Button/Button\";\r\nexport { default as Checkbox } from \"./material/inputs/CheckboxGroup/CheckboxGroup\";\r\nexport { default as DatePicker } from \"./material/inputs/DatePicker/DatePicker\";\r\nexport { default as ErrorMessage } from \"./material/inputs/ErrorMessage/ErrorMessage\";\r\nexport { default as List } from \"./material/inputs/List/List\";\r\nexport { default as MultipleList } from \"./material/inputs/MultipleList/MultipleList\";\r\nexport { default as RadioButtons } from \"./material/inputs/RadioButtons/RadioButtons\";\r\nexport { default as Text } from \"./material/inputs/Text/Text\";\r\nexport { default as TextArea } from \"./material/inputs/TextArea/TextArea\";\r\nexport { default as Password } from \"./material/inputs/Password/Password\";\r\nexport { default as Number } from \"./material/inputs/Number/Number\";\r\nexport { default as Rating } from \"./material/inputs/Rating/Rating\";\r\nexport { default as RangeSlider } from \"./material/inputs/RangeSlider/RangeSlider\";\r\nexport { default as Switch } from \"./material/inputs/Switch/Switch\";\r\nexport { default as Color } from \"./material/inputs/Color/Color\";\r\n\r\n//#endregion\r\n\r\n//#region cbmis layout\r\nexport { default as Box } from \"./material/layout/Box/Box\";\r\nexport { default as Container } from \"./material/layout/Container/Container\";\r\nexport { default as Line } from \"./material/layout/Line/Line\";\r\nexport { default as Grid } from \"./material/layout/Grid/Grid\";\r\n\r\n//cbmis navigation\r\nexport { default as BottomBar } from \"./material/navigation/BottomBar/BottomBar\";\r\nexport { default as Breadcrumbs } from \"./material/navigation/Breadcrumbs/Breadcrumbs\";\r\nexport { default as Drawer } from \"./material/navigation/Drawer/Drawer\";\r\nexport { default as Menu } from \"./material/navigation/Menu/Menu\";\r\nexport { default as MenuItem } from \"./material/navigation/Menu/MenuItem\";\r\nexport { default as Pagination } from \"./material/navigation/Pagination/Pagination\";\r\nexport { default as SpeedDial } from \"./material/navigation/SpeedDial/SpeedDial\";\r\nexport { default as SpeedDialAction } from \"./material/navigation/SpeedDial/SpeedDialAction\";\r\nexport { default as Stepper } from \"./material/navigation/Stepper/Stepper\";\r\nexport { default as Slideshow } from \"./material/navigation/Slideshow/Slideshow\";\r\nexport { default as Tabs } from \"./material/navigation/Tabs/Tabs\";\r\nexport { default as ParallaxScrolling } from \"./material/navigation/ParallaxScrolling/ParallaxScrolling\";\r\nexport { default as AppBar } from \"./material/navigation/AppBar/AppBar\";\r\nexport { default as GroupBar } from \"./material/navigation/groupBar/GroupBar\";\r\nexport { default as Nav } from \"./material/navigation/nav/Nav\";\r\nexport { default as BtnGoToTop } from \"./material/navigation/btnGoToTop/BtnGoToTop\";\r\n//#endregion\r\n\r\n//#region cbmis surfaces\r\nexport { default as Accordion } from \"./material/surfaces/Accordion/Accordion\";\r\nexport { default as AccordionTab } from \"./material/surfaces/Accordion/AccordionTab\";\r\nexport { default as AccordionSummary } from \"./material/surfaces/Accordion/AccordionSummary\";\r\nexport { default as AccordionDetails } from \"./material/surfaces/Accordion/AccordionDetails\";\r\nexport { default as Card } from \"./material/surfaces/Card/Card\";\r\nexport { default as CardFront } from \"./material/surfaces/Card/CardFront\";\r\nexport { default as CardBack } from \"./material/surfaces/Card/CardBack\";\r\nexport { default as CardImage } from \"./material/surfaces/Card/CardImage\";\r\nexport { default as CardDetails } from \"./material/surfaces/Card/CardDetails\";\r\nexport { default as Glass } from \"./material/surfaces/Glass/Glass\";\r\nexport { default as Loader } from \"./material/surfaces/Loader/Loader\";\r\nexport { default as Paper } from \"./material/surfaces/Paper/Paper\";\r\n//#endregion\r\n\r\nexport { default as Icon } from \"./icon/CbmisIcon\";\r\n\r\n","(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory();\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"@cbmisorg\"] = factory();\n\telse\n\t\troot[\"@cbmisorg\"] = factory();\n})(this, function() {\nreturn ","// The require scope\nvar __webpack_require__ = {};\n\n","// getDefaultExport function for compatibility with non-harmony modules\n__webpack_require__.n = function(module) {\n\tvar getter = module && module.__esModule ?\n\t\tfunction() { return module['default']; } :\n\t\tfunction() { return module; };\n\t__webpack_require__.d(getter, { a: getter });\n\treturn getter;\n};","// define getter functions for harmony exports\n__webpack_require__.d = function(exports, definition) {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }","// define __esModule on exports\n__webpack_require__.r = function(exports) {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","var __WEBPACK_NAMESPACE_OBJECT__ = require(\"@babel/runtime/helpers/objectWithoutPropertiesLoose\");","var __WEBPACK_NAMESPACE_OBJECT__ = require(\"react\");","//Split variables\r\nexport const Split_Main_Message_Type_Symbol = \"$\"\r\nexport const Split_Message_Symbol = \"~\"\r\nexport const Split_Value_Type_Symbol = \"-\"\r\nexport const Split_Different_Type_Symbol = \"*\"\r\nexport const Split_Same_Message_Type_Symbol = \"/\"\r\n\r\n//#region \r\nexport const Split_validations_Symbol = \"~\"\r\n\r\n//#endregion\r\n\r\n//#region \r\nexport const fieldType = {\r\n text:\"text\",\r\n textArea:\"textarea\",\r\n password:\"password\",\r\n radio:\"radio\",\r\n checkbox:\"checkbox\",\r\n list:\"list\",\r\n multipleList:\"multiplelist\",\r\n date:\"date\",\r\n dateTime:\"datetime\",\r\n number:\"number\",\r\n rangeSlider:\"rangeslider\",\r\n rating:\"rating\",\r\n switch:\"switch\",\r\n color:\"color\",\r\n}\r\n\r\nexport const formValidationsMsg={\r\n required:{eng:\"Required!\",arb:\"الحقل مطلوب\"},\r\n email: {eng:\"The email not valid\",arb:\"البريد اللكتروني غير صحيح\"},\r\n onlynumbers: {eng:\"Only number Required\", arb:\"يجب ان تحتوي القيم فقط أرقام\"},\r\n onlyletters: {eng:\"Only letters Required\", arb:\"يجب ان تحتوي القيم فقط أحرف\"},\r\n maxlength:{eng: \"The digits entered are greater than the allowed limit\", arb: \"عدد الخانات التي تم إدخالها أكبر من الحد المسموح به\"},\r\n minlength:{eng: \"The digits entered are less than the allowed limit\", arb: \"عدد الخانات التي تم إدخالها أقل من الحد المسموح به\"},\r\n maxword:{eng: \"The words entered are greater than the allowed limit\", arb: \"عدد الكلمات التي تم إدخالها أكبر من الحد المسموح به\"},\r\n minword:{eng: \"The words entered are less than the allowed limit\", arb: \"عدد الكلمات التي تم إدخالها أقل من الحد المسموح به\"},\r\n equal:{eng: \"The entered value does not match the required field\", arb: \"القيمة المدخلة غير مطابقة للحقل المطلوب\"},\r\n started: {eng:\"The value entered did not start with the required\", arb:\"لم تبدأ القيمة المدخلة بالمطلوب\"},\r\n ended: {eng:\"The value entered did not end with the required\", arb:\"لم تنتهي القيمة المدخلة بالمطلوب\"},\r\n included: {eng:\"The value you entered did not have the required value\", arb:\"لم تحتوي القيمة المدخلة بالقيمة المطلوبة\"},\r\n password:{\r\n eng:\"The password must be at least 8 characters long including a number, upper and lowercase letters, and one special character\",\r\n arb:\"يجب أن تتكون كلمة المرور من 8 أحرف على الأقل بما في ذلك رقم وأحرف كبيرة وصغيرة وحرف خاص واحد\"}\r\n}\r\n","var __WEBPACK_NAMESPACE_OBJECT__ = require(\"@cbmisorg/material\");","var __WEBPACK_NAMESPACE_OBJECT__ = require(\"react/jsx-runtime\");","import { forwardRef } from \"react\";\r\n\r\nimport * as FormVariables from \"../formHelper/formVariables/FormVariables\";\r\nimport {\r\n Text,\r\n RadioButtons,\r\n List,\r\n CheckboxGroup,\r\n MultipleList,\r\n Password,\r\n TextArea,\r\n DatePicker,\r\n Number,\r\n RangeSlider,\r\n // Rating,\r\n // Color,\r\n Switch,\r\n} from \"@cbmisorg/material\";\r\n\r\nconst fieldsType = FormVariables.fieldType;\r\nconst FormControl = forwardRef((/**@type{any}*/ props, ref) => {\r\n const { handler = {}, defaultValue, children, optionLang, setCurrentLang, funChange, iconColor, iconSize, ...rest } = props;\r\n let value = defaultValue;\r\n if (value?.value) {\r\n value.value = typeof value.value === \"object\" ? JSON?.stringify(value.value) : value.value;\r\n }\r\n value = typeof value === \"object\" ? JSON?.stringify(value) : value;\r\n\r\n const onChangeText = (event) => {\r\n funChange(event, false);\r\n };\r\n const onBlurText = (event) => {\r\n funChange(event, true);\r\n };\r\n switch (String(handler?.control).toLowerCase()) {\r\n case fieldsType.text:\r\n return \r\n {typeof icon === \"string\" ?
\r\n );\r\n});\r\n\r\nexport default Icon;\r\n","const objIconsCategories = {\r\n account: [\"accountbox\", \"accountboxoutlined\", \"accountcircle\", \"accountcircleoutlined\",\"assignmentind\",\"assignmentindoutlined\",\"badge\",\"badgeoutlined\",\"threeoputlined\",\"threep\",\"contactpage\",\"contactpageoutlined\",\"contacts\",\"contactsoutlined\",\"howtoreg\",\"howtoregoutlined\",\"manageaccounts\",\"manageaccountsoutlined\",\"noaccounts\",\"noaccountsoutlined\",\"portrait\",\"portraitoutlined\",\"recentactors\",\"recentactorsoutlined\",\"switchaccount\",\"switchaccountoutlined\"],\r\n accessibility: ['accessibilitynew', 'accessible', 'accessibleforward', 'notaccessible'],\r\n add: [\"add\", \"addcircle\", \"addcircleoutlined\",\"assistant\",\"assistantoutlined\",\"tryoutlined\",\"try\",\"controlpoint\",\"controlpointduplicate\",\"dashboardcustomize\",\"dashboardcustomizeoutlined\",\"datasaveron\",\"libraryadd\",\"libraryaddoutlined\",\"loupe\",\"mapsugc\",\"mapsugcoutlined\",\"more\",\"morehoriz\",\"moreoutlined\",\"morevert\",\"playlistadd\",\"queue\",\"queueoutlined\"],\r\n alert: [\"addalert\", \"addalertoutlined\", \"announcement\", \"announcementoutlined\",\"assignmentlate\",\"assignmentlateoutlined\",\"warningamber\",\"warning\",\"discfluid\",\"discfluidoutlined\",\"error\",\"erroroutlined\",\"feedback\",\"feedbackoutlined\",\"fmdbad\",\"fmdbadoutlined\",\"info\",\"infooutlined\",\"newreleases\",\"newreleasesoutlined\",\"priorityhigh\",\"privacytip\",\"privacytipoutlined\",\"report\",\"reportoff\",\"reportoffoutlined\",\"reportoutlined\",\"reportproblem\",\"reportproblemoutlined\",\"sdcardalert\",\"sdcardalertoutlined\"],\r\n align: [\"alignhorizontalcenter\", \"alignhorizontalcenteroutlined\", \"alignhorizontalleft\", \"alignhorizontalright\", \"alignverticalbottom\", \"alignverticalcenter\", \"alignverticaltop\"],\r\n\r\n attach:[\"attachfile\",\"attachment\",\"uploadfile\",\"filepresent\",\"link\",\"linkoff\",\"share\",\"shareoutlined\"],\r\n art: [\"brush\",\"brushoutlined\"],\r\n activity:[\"downhillskiing\"],\r\n animal:[\"pestcontrolrodent\",\"pestcontrolrodentoutlined\",\"pets\"],\r\n\r\n arrow: [\"subdirectoryarrowleft\",\"subdirectoryarrowright\",\"settingsethernet\",\"settingsbackuprestore\",\"restartalt\",\"restore\",\"repeatone\",\"replay\",\"replay5\",\"replay10\",\"replay30\",\"replaycirclefilled\",\"reply\",\"replyall\",\"repeat\",\"altroute\", \"arrowback\", \"arrowbackios\", \"arrowbackiosnew\", \"arrowbackiosnew\", \"arrowcircledown\", \"arrowcircledownoutlined\", \"arrowcircleup\", \"arrowcircleupoutlined\", \"arrowdownward\", \"arrowdropdown\", \"arrowdropdowncircle\", \"arrowdropdowncircleoutlined\", \"arrowdropup\", \"arrowforward\", \"arrowforwardios\", \"arrowleft\", \"arrowright\", \"arrowupward\",\"assignmentreturn\",\"assignmentreturned\",\"assignmentreturnedoutlined\",\"assignmentreturnoutlined\",\"assistantdirection\",\"assistantdirectionoutlined\",\"autorenew\",\"zoomoutmap\",\"west\",\"verticalaligntop\",\"verticalaligncenter\",\"verticalalignbottom\",\"uploadoutlined\",\"upload\",\"upgrade\",\"updatedisabled\",\"update\",\"trendingup\",\"trendingflat\",\"trendingdown\",\"transitenterexit\",\"transgender\",\"transform\",\"timeline\",\"threesixty\",\"cached\",\"callmade\",\"callmerge\",\"callmissed\",\"callmissedoutgoing\",\"callreceived\",\"callsplit\",\"changecircle\",\"changecircleoutlined\",\"chevronleft\",\"chevronright\",\"closefluidscreen\",\"comparearrows\",\"compress\",\"directions\",\"directionsoff\",\"directionsoutlined\",\"doublearrow\",\"east\",\"exittoapp\",\"expand\",\"expandless\",\"expandmore\",\"fastforward\",\"fastforwardoutlined\",\"fastrewind\",\"fastrewindoutlined\",\"firstpage\",\"forward\",\"forward5\",\"forward10\",\"forward30\",\"forwardoutlined\",\"height\",\"importexport\",\"input\",\"keyboardarrowdown\",\"keyboardarrowleft\",\"keyboardarrowright\",\"keyboardarrowup\",\"keyboardbackspace\",\"keyboardcapslock\",\"keyboardreturn\",\"keyboardtab\",\"label\",\"labelimportant\",\"labeloff\",\"labeloffoutlined\",\"labeloutlined\",\"lastpage\",\"launch\",\"login\",\"logout\",\"loop\",\"lowpriority\",\"mobiledataoff\",\"modeltraining\",\"moving\",\"navigatenext\",\"multiplestop\",\"navigatebefore\",\"navigationoutlined\",\"navigation\",\"nearme\",\"nearmedisabled\",\"nearmedisabledoutlined\",\"nearmeoutlined\",\"nextplan\",\"nextplanoutlined\",\"north\",\"northeast\",\"northwest\",\"openinfull\",\"openinnew\",\"openinnewoff\",\"openwith\",\"outbound\",\"outboundoutlined\",\"playarrow\",\"playarrowoutlined\",\"playcircle\",\"playcircleoutlined\",\"playdisabled\",\"playdisabledoutlined\",\"redo\",\"refresh\",\"rotate90degreesccw\",\"rotateleft\",\"rotateright\",\"schedulesend\",\"schedulesendoutlined\",\"send\",\"sendandarchive\",\"sendandarchiveoutlined\",\"sendoutlined\",\"shortcut\",\"showchart\",\"shuffle\",\"skipnext\",\"skipnextoutlined\",\"skipprevious\",\"skippreviousoutlined\",\"slowmotionvideo\",\"south\",\"southeast\",\"southwest\",\"swapcalls\",\"swaphoriz\",\"swaphorizontalcircle\",\"swaphorizontalcircleoutlined\",\"swapvert\",\"swapverticalcircle\",\"swapverticalcircleoutlined\",\"switchleft\",\"switchright\",\"sync\",\"syncalt\",\"syncdisabled\",\"syncproblem\"],\r\n\r\n box: [\"addbox\",\"addboxoutlined\", \"allinbox\", \"allinboxoutlined\"],\r\n business: [\"addbusiness\", \"addbusinessoutlined\"],\r\n book: [\"autostories\",\"autostoriesoutlined\",\"book\",\"bookoutlined\",\"bookmark\",\"bookmarkoutlined\",\"bookmarkadd\",\"bookmarkaddoutlined\",\"bookmarkadded\",\"bookmarkaddedoutlined\",\"bookmarkremove\",\"bookmarkremoveoutlined\",\"bookmarks\",\"bookmarksoutlined\",\"turnedinnot\",\"turnedin\",\"class\",\"classoutlined\",\"collectionsbookmark\",\"collectionsbookmarkoutlined\",\"commentbank\",\"commentbankoutlined\",\"contentpaste\",\"contentpasteoff\",\"importcontacts\",\"locallibrary\",\"locallibraryoutlined\",\"menubook\"],\r\n baby:[\"aabychangingstation\",\"bedroombaby\",\"bedroombabyoutlined\",\"childcare\",\"childfriendly\",\"childfriendlyoutlined\",\"crib\",\"criboutlined\",\"nostroller\",\"nostrolleroutlined\",\"stroller\",\"strolleroutlined\"],\r\n bag: [\"backpack\",\"backpackoutlined\",\"workoutline\",\"workoffoutlined\",\"workoff\",\"work\",\"businesscenter\",\"businesscenteroutlined\",\"cardtravel\",\"cases\",\"casesoutlined\",\"homerepairservice\",\"homerepairserviceoutlined\",\"integrationinstructions\",\"localmall\",\"localmalloutlined\",\"luggage\",\"luggageoutlined\",\"nextweek\",\"nextweekoutlined\",\"nobackpack\",\"nobackpackoutlined\",\"noluggage\",\"noluggageoutlined\",\"shop\",\"shop2\",\"shop2outlined\",\"shopoutlined\",\"shoppingbag\",\"shoppingbagoutlined\",\"shoppingbasket\",\"shoppingbasketoutlined\"],\r\n block: [\"block\"],\r\n\r\n comment: [\"addcomment\", \"addcommentoutlined\"],\r\n circle: [\"adjust\", \"animation\",\"attribution\",\"blurcircular\",\"brightness1\",\"brightness1outlined\",\"workspacesoutlined\",\"workspaces\",\"triporigin\",\"trackchanges\",\"tonality\",\"toll\",\"timelapse\",\"bubblechart\",\"bubblechartoutlined\",\"circle\",\"circleoutlined\",\"datasaveroff\",\"donutlarge\",\"donutsmall\",\"donutsmalloutlined\",\"dragindicator\",\"fibermanualrecord\",\"fibermanualrecordoutlined\",\"fibersmartrecord\",\"fibersmartrecordoutlined\",\"filtertiltshift\",\"flipcameraandroid\",\"groupwork\",\"groupworkoutlined\",\"hdrweak\",\"hidesource\",\"motionphotosoff\",\"motionphotosoffoutlined\",\"panoramafisheye\",\"panoramaphotosphere\",\"panoramaphotosphereselect\",\"pending\",\"pendingoutlined\",\"radiobuttonchecked\",\"radiobuttonunchecked\",\"runningwitherrors\",\"scatterplot\",\"scatterplotoutlined\",\"stopcircle\",\"stopcircleoutlined\"],\r\n car: [\"airportshuttle\", \"airportshuttleoutlined\",\"bikescooter\",\"bluetoothdrive\",\"bluetoothdriveoutlined\",\"tramoutlined\",\"tram\",\"trainoutlined\",\"train\",\"toysoutlined\",\"toys\",\"twowheeler\",\"timetoleaveoutlined\",\"timetoleave\",\"taxialertoutlined\",\"taxialert\",\"busalert\",\"busalertoutlined\",\"carrental\",\"carrentaloutlined\",\"carrepair\",\"carrepairoutlined\",\"commute\",\"deliverydining\",\"deliverydiningoutlined\",\"departureboard\",\"departureboardoutlined\",\"directionsbike\",\"directionsbus\",\"directionsbusoutlined\",\"directionscar\",\"directionscaroutlined\",\"directionsrailway\",\"directionsrailwayoutlined\",\"directionssubway\",\"directionssubwayoutlined\",\"driveeta\",\"driveetaoutlined\",\"electricbike\",\"electriccar\",\"electriccaroutlined\",\"electricmoped\",\"electricmopedoutlined\",\"electricrickshaw\",\"electricrickshawoutlined\",\"electricscooter\",\"emojitransportation\",\"escalator\",\"escalatoroutlined\",\"evstation\",\"evstationoutlined\",\"garage\",\"garageoutlined\",\"localcarwash\",\"localcarwashoutlined\",\"localgasstation\",\"localgasstationoutlined\",\"localshipping\",\"localshippingoutlined\",\"localtaxi\",\"localtaxioutlined\",\"moped\",\"mopedoutlined\",\"notransfer\",\"notransferoutlined\",\"pedalbike\",\"railwayalert\",\"railwayalertoutlined\",\"rvhookup\",\"speed\",\"subway\",\"subwayoutlined\"],\r\n charts: [\"accounttree\", \"accounttreeoutlined\", \"addchart\", \"analytics\", \"analyticsoutlined\",\"assessment\",\"assessmentoutlined\",\"attractions\",\"autograph\",\"barchart\",\"blurlinear\",\"bluroff\",\"bluron\",\"waterfallchart\",\"tune\",\"devicehub\",\"equalizer\",\"insertchart\",\"insertchartoutlined\",\"leaderboard\",\"leaderboardoutlined\",\"mediation\",\"multilinechart\",\"nat\",\"pivottablechart\",\"poll\",\"polloutlined\",\"querystats\",\"radar\",\"schema\",\"schemaoutlined\",\"stackedbarchart\",\"stackedlinechart\",\"tablechart\",\"tablechartoutlined\"],\r\n check: [\"assignmentturnedin\",\"assignmentturnedinoutlined\",\"beenhere\",\"beenhereoutlined\",\"verifieduseroutlined\",\"verifieduser\",\"verifiedoutlined\",\"verified\",\"taskoutlined\",\"taskalt\",\"task\",\"check\",\"checkbox\",\"checkboxoutlined\",\"checkcircle\",\"checkcircleoutlined\",\"clouddone\",\"clouddoneoutlined\",\"domainverification\",\"done\",\"doneall\",\"doneoutline\",\"downloaddone\",\"editattributes\",\"editattributesoutlined\",\"factcheck\",\"factcheckoutlined\",\"filedownloaddone\",\"filedownloaddoneoutlined\",\"inventoryoutlined\",\"libraryaddcheck\",\"libraryaddcheckoutlined\",\"offlinepin\",\"offlinepinoutlined\",\"playlistaddcheck\",\"publishedwithchanges\",\"removedone\",\"removedoneoutlined\",\"rule\"],\r\n clothes:[\"checkroom\",\"drycleaning\",\"drycleaningoutlined\",\"iron\",\"ironoutlined\",\"locallaundryservice\",\"locallaundryserviceoutlined\"],\r\n celebration:[\"cardgiftcard\",\"celebration\",\"celebrationoutlined\",\"emojievents\",\"emojieventsoutlined\",\"festival\",\"festivaloutlined\",\"redeem\",\"stream\"],\r\n copy:[\"filecopy\",\"filecopyoutlined\"],\r\n color:[\"invertcolors\",\"invertcolorsoff\",\"opacity\",\"palette\",\"paletteoutlined\",\"gradient\",\"salinity\",\"totaldissolvedsolids\"],\r\n\r\n delete: [\"removecircle\",\"removecircleoutlined\",\"autodelete\",\"autodeleteoutlined\",\"backspace\",\"backspaceoutlined\",\"cancel\",\"canceloutlined\",\"cancelpresentation\",\"cancelschedulesend\",\"cancelschedulesendoutlined\",\"clear\",\"close\",\"dangerous\",\"dangerousoutlined\",\"delete\",\"deleteforever\",\"deleteforeveroutlined\",\"deleteoutlined\",\"deleteoutlined\",\"deletesweepoutlined\",\"disabledbydefault\",\"disabledbydefaultoutlined\",\"dodisturb\",\"dodisturbalt\",\"dodisturboff\",\"dodisturboffoutlined\",\"dodisturbon\",\"dodisturbonoutlined\",\"donotdisturb\",\"donotdisturbalt\",\"donotdisturboff\",\"donotdisturboffoutlined\",\"donotdisturbon\",\"donotdisturbonoutlined\",\"donotdisturbontotalsilence\",\"donotstep\",\"donotstepoutlined\",\"donottouch\",\"donottouchoutlined\",\"highlightoff\",\"indeterminatecheckbox\",\"indeterminatecheckboxoutlined\",\"notinterested\",\"restorefromtrash\"],\r\n date:[\"todayoutlined\",\"today\",\"calendartoday\",\"calendartodayoutlined\",\"event\",\"eventoutlined\",\"eventavailable\",\"eventavailableoutlined\",\"eventbusy\",\"eventbusyoutlined\",\"eventnote\",\"eventnoteoutlined\"],\r\n download:[\"downloadforoffline\",\"clouddownload\",\"clouddownloadoutlined\",\"download\",\"downloadforofflineoutlined\",\"downloading\",\"downloadoutlined\",\"filedownload\",\"filedownloadoutlined\",\"filedownloadoff\",\"filedownloadoffoutlined\",\"getapp\",\"getappoutlined\",\"movetoinbox\",\"movetoinboxoutlined\",\"playforwork\",\"savealt\",\"systemupdatealt\"],\r\n dialoug:[\"forum\",\"forumoutlined\",\"markchatread\",\"markchatreadoutlined\",\"markchatunread\",\"markchatunreadoutlined\",\"modecomment\",\"modecommentoutlined\",\"questionanswer\",\"questionansweroutlined\",\"quickreply\",\"quickreplyoutlined\",\"ratereview\",\"ratereviewoutlined\",\"sms\",\"smsfailed\",\"smsfailedoutlined\",\"smsoutlined\"],\r\n\r\n ecommerce: [\"addshoppingcart\",\"basket\",\"localgrocerystore\",\"localgrocerystoreoutlined\",\"productionquantitylimits\",\"receipt\",\"receiptlong\",\"receiptlongoutlined\",\"receiptoutlined\",\"removeshoppingcart\",\"removeshoppingcartoutlined\",\"shoppingcart\",\"shoppingcartoutlined\"],\r\n emoji: [\"addreaction\", \"addreactionoutlined\",\"theatercomedyoutlined\",\"theatercomedy\",\"emojiemotions\",\"emojiemotionsoutlined\",\"outlet\",\"outletoutlined\"],\r\n email: [\"alternateemail\",\"attachemail\",\"attachemailoutlined\",\"contactmail\",\"contactmailoutlined\",\"drafts\",\"draftsoutlined\",\"email\",\"emailoutlined\",\"inbox\",\"inboxoutlined\",\"markasunread\",\"markasunreadoutlined\",\"markemailread\",\"markemailreadoutlined\",\"markemailunread\",\"markemailunreadoutlined\",\"markunread\",\"markunreadoutlined\"],\r\n effect: [\"autofixhigh\",\"autofixhighoutlined\",\"autofixnormal\",\"autofixnormaloutlined\",\"autofixoff\",\"autofixoffoutlined\",\"wbiridescentoutlined\",\"wbiridescent\",\"viewinaroutlined\",\"viewinar\",\"upcomingoutlined\",\"upcoming\",\"touchappoutlined\",\"touchapp\",\"theatersoutlined\",\"theaters\",\"cable\",\"controlcamera\",\"gesture\",\"insights\"],\r\n extension:[\"extension\",\"extensionoff\",\"extensionoffoutlined\",\"extensionoutlined\"],\r\n education:[\"school\",\"schooloutlined\"],\r\n\r\n flag:[\"assistantphoto\",\"assistantphotooutlined\",\"touroutlined\",\"tour\",\"emojiflags\",\"flag\",\"flagoutlined\",\"golfcourse\"],\r\n food:[\"bakerydining\",\"bakerydiningoutlined\",\"blender\",\"blenderoutlined\",\"breakfastdining\",\"breakfastdiningoutlined\",\"winebaroutlined\",\"winebar\",\"tapasoutlined\",\"tapas\",\"takeoutdiningoutlined\",\"takeoutdining\",\"brunchdining\",\"brunchdiningoutlined\",\"cake\",\"cakeoutlined\",\"coffee\",\"coffeemaker\",\"coffeemakeroutlined\",\"coffeeoutlined\",\"dining\",\"diningoutlined\",\"dinnerdining\",\"dinnerdiningoutlined\",\"emojifoodbeverage\",\"emojifoodbeverageoutlined\",\"fastfood\",\"fastfoodoutlined\",\"flatware\",\"foodbank\",\"foodbankoutlined\",\"freebreakfast\",\"freebreakfastoutlined\",\"grain\",\"icecream\",\"icecreamoutlined\",\"localcafe\",\"localcafeoutlined\",\"localdining\",\"localdrink\",\"localdrinkoutlined\",\"localpizza\",\"localpizzaoutlined\",\"lunchdining\",\"lunchdiningoutlined\",\"nodrinks\",\"nodrinksoutlined\",\"nofood\",\"nofoodoutlined\",\"nomeals\",\"outdoorgrill\",\"outdoorgrilloutlined\",\"ramendining\",\"ramendiningoutlined\",\"restaurant\",\"restaurantmenu\",\"ricebowl\",\"ricebowloutlined\",\"roomservice\",\"roomserviceoutlined\",\"setmeal\",\"setmealoutlined\"],\r\n feelings: [\"volunteeractivismoutlined\",\"volunteeractivism\",\"thumbupoutlined\",\"thumbup\",\"thumbsupdownoutlined\",\"thumbsupdown\",\"thumbdownoutlined\",\"thumbdown\",\"favorite\",\"favoriteoutlined\",\"recommend\",\"recommendoutlined\",\"sentimentdissatisfied\",\"sentimentdissatisfiedoutlined\",\"sentimentneutral\",\"sentimentneutraloutlined\",\"sentimentsatisfied\",\"sentimentsatisfiedoutlined\",\"sentimentverydissatisfied\",\"sentimentverydissatisfiedoutlined\",\"sentimentverysatisfied\",\"sentimentverysatisfiedoutlined\"],\r\n folder: [\"createnewfolder\",\"createnewfolderoutlined\",\"folder\",\"folderopen\",\"folderoutlined\",\"foldershared\",\"foldersharedoutlined\",\"folderspecial\",\"folderspecialoutlined\",\"inventory\",\"inventory2\",\"rulefolder\",\"rulefolderoutlined\",\"snippetfolder\",\"snippetfolderoutlined\",\"drivefilemove\",\"drivefilemoveoutlined\",],\r\n file:[\"insertdrivefile\",\"insertdrivefileoutlined\",\"note\",\"noteaddoutlined\",\"notealt\",\"notealtoutlined\",\"noteoutlined\",\"plagiarism\",\"plagiarismoutlined\",\"playlesson\",\"playlessonoutlined\",\"restorepage\",\"restorepageoutlined\",\"save\",\"saveoutlined\",\"summarize\",\"summarizeoutlined\"],\r\n\r\n game:[\"videogameassetoffoutlined\",\"videogameassetoff\",\"videogameassetoutlined\",\"videogameasset\",\"catchingpokemon\",\"games\",\"gamesoutlined\",\"smarttoy\",\"smarttoyoutlined\"],\r\n\r\n home: [\"airlineseatindividualsuite\", \"airlineseatindividualsuiteoutlined\", \"apartment\",\"balcony\",\"bed\",\"bedroomchild\",\"bedroomchildoutlined\",\"bedroomparent\",\"bedroomparentoutlined\",\"weekendoutlined\",\"weekend\",\"wbincandescentoutlined\",\"wbincandescent\",\"waterdamageoutlined\",\"waterdamage\",\"villaoutlined\",\"villa\",\"tungstenoutlined\",\"tungsten\",\"bungalow\",\"bungalowoutlined\",\"business\",\"cabin\",\"chair\",\"chairoutlined\",\"chairalt\",\"chalet\",\"chaletoutlined\",\"corporatefare\",\"cottage\",\"cottageoutlined\",\"countertops\",\"countertopsoutlined\",\"domain\",\"domaindisabled\",\"doorback\",\"doorbell\",\"doorbelloutlined\",\"doorfront\",\"doorfrontoutlined\",\"doorsliding\",\"doorslidingoutlined\",\"eventseat\",\"eventseatoutlined\",\"fence\",\"fireplace\",\"fireplaceoutlined\",\"foundation\",\"gite\",\"holidayvillage\",\"holidayvillageoutlined\",\"home\",\"homemax\",\"homemini\",\"homeoutlined\",\"homework\",\"homeworkoutlined\",\"house\",\"houseboat\",\"houseboatoutlined\",\"houseoutlined\",\"housesiding\",\"hvac\",\"hvacoutlined\",\"kingbed\",\"kingbedoutlined\",\"kitchen\",\"living\",\"livingoutlined\",\"localconveniencestore\",\"localconveniencestoreoutlined\",\"locationcity\",\"mapshomework\",\"mapshomeworkoutlined\",\"meetingroom\",\"microwave\",\"microwaveoutlined\",\"museum\",\"museumoutlined\",\"nightshelter\",\"nightshelteroutlined\",\"nomeetingroom\",\"nomeetingroomoutlined\",\"otherhouses\",\"otherhousesoutlined\",\"roofing\",\"roompreferences\",\"roompreferencesoutlined\",\"sensordoor\",\"sensordooroutlined\",\"shower\",\"showeroutlined\",\"singlebed\",\"stairs\",\"stairsoutlined\",\"store\",\"storefront\",\"storeoutlined\",\"humidityindoor\",\"waterpump\",\"walllamp\",\"windowsensor\",\"tablelamp\",\"movingbeds\"],\r\n health:[\"wheelchairpickup\",\"washoutlined\",\"wash\",\"thermostatauto\",\"thermostat\",\"cleanhands\",\"cleanhandsoutlined\",\"cleaningservices\",\"cleaningservicesoutlined\",\"coronavirus\",\"coronavirusoutlined\",\"devicethermostat\",\"healing\",\"healthandsafety\",\"healthandsafetyoutlined\",\"localpharmacy\",\"localpharmacyoutlined\",\"masks\",\"masksoutlined\",\"medicalservices\",\"medicalservicesoutlined\",\"medication\",\"medicationoutlined\",\"monitorweight\",\"monitorweightoutlined\",\"sanitizer\",\"sanitizeroutlined\",\"sick\",\"sickoutlined\",\"soap\",\"soapoutlined\",\"monitorheart\",\"vaccines\",\"radiology\",\"rheumatology\",\"orthopedics\",\"tibia\",\"skeleton\",\"footbones\",\"cognition\",\"tibiaalt\",\"ulnaradius\",\"neurology\",\"ulnaradiusalt\",\"stethoscope\",\"microbiology\",\"pulmonology\",\"nephrology\",\"stethoscopecheck\",\"bloodpressure\",\"stethoscopearrow\",\"mixturemed\",\"ophthalmology\",\"gastroenterology\",\"gynecology\",\"immunology\",\"oncology\",\"respiratoryrate\",\"syringe\",\"adminmeds\",\"endocrinology\",\"procedure\",\"surgical\",\"fluidmed\",\"medicalmask\",\"outpatientmed\",\"pilloff\",\"urology\"],\r\n hand:[\"dry\",\"dryoutlined\",\"pantool\",\"pantooloutlined\",\"swipe\",\"swipeoutlined\"],\r\n\r\n link: [\"addlink\"],\r\n location: [\"addlocation\", \"addlocationoutlined\", \"addlocationalt\", \"addlocationaltoutlined\",\"wronglocationoutlined\",\"wronglocation\",\"wheretovoteoutlined\",\"wheretovote\",\"editlocation\",\"editlocationalt\",\"editlocationaltoutlined\",\"editlocationoutlined\",\"explore\",\"exploreoff\",\"exploreoffoutlined\",\"exploreoutlined\",\"fmdgood\",\"fmdgoodoutlined\",\"locationoff\",\"locationoffoutlined\",\"locationon\",\"locationonoutlined\",\"map\",\"mapoutlined\",\"notlistedlocationoutlined\",\"notlistedlocation\",\"place\",\"placeoutlined\",\"room\",\"roomoutlined\",\"sharelocation\"],\r\n line:[\"viewheadline\",\"toc\",\"texture\",\"calendarviewday\",\"calendarviewdayoutlined\",\"clearall\",\"draghandle\",\"filterline\",\"filterlist\",\"formataligncenter\",\"formatalignjustify\",\"formatalignleft\",\"formatalignright\",\"formatindentdecrease\",\"formatindentincrease\",\"formatlinespacing\",\"formatlistbulleted\",\"formatlistnumbered\",\"formatlistnumberedrtl\",\"formatstrikethrough\",\"graphiceq\",\"horizontalrule\",\"horizontalsplit\",\"legendtoggle\",\"linearscale\",\"linestyle\",\"lineweight\",\"list\",\"listalt\",\"looks\",\"maximize\",\"menu\",\"menuopen\",\"minimize\",\"playlistplay\",\"powerinput\",\"readmore\",\"segment\",\"sort\",\"storage\",\"subject\",\"tablerows\",\"tablerowsoutlined\"],\r\n language:[\"translate\",\"closedcaption\",\"closedcaptiondisabled\",\"closedcaptiondisabledoutlined\",\"closedcaptionoutlined\",\"emobiledata\",\"explicit\",\"explicitoutlined\",\"fontdownload\",\"fontdownloadoff\",\"fontdownloadoffoutlined\",\"fontdownloadoutlined\",\"formatbold\",\"formatclear\",\"formatcolortext\",\"formatitalic\",\"formatquote\",\"formatquoteoutlined\",\"formatshapes\",\"formatsize\",\"formattextdirectionltor\",\"formattextdirectionltoroutlined\",\"formattextdirectionrtol\",\"formattextdirectionrtoloutlined\",\"formatunderlined\",\"gmobiledata\",\"gtranslate\",\"gtranslateoutlined\",\"hdrauto\",\"hdrautooutlined\",\"hmobiledata\",\"hplusmobiledata\",\"http\",\"localparking\",\"motionphotosauto\",\"motionphotosautooutlined\",\"rmobiledata\",\"rtt\",\"sortbyalpha\",\"spellcheck\",\"strikethroughs\",\"autofpsselect\",\"wbautooutlined\",\"wbauto\",\"brightnessauto\",\"brightnessautooutlined\",\"sortbyalpha\",\"abc\"],\r\n light:[\"flashlightoff\",\"flashlightoffoutlined\",\"flashlighton\",\"flashlightonoutlined\",\"flashoff\",\"flashon\",\"flourescent\",\"flourescentoutlined\",\"highlight\",\"highlightoutlined\",\"light\",\"lightbulb\",\"lightbulboutlined\"],\r\n\r\n money: [\"accounbalance\", \"accountbalanceoutlined\", \"accountbalancewallet\",\"accountbalancewalletoutlined\",\"atm\",\"attachmoney\",\"creditcard\",\"creditcardoff\",\"creditcardoffoutlined\",\"creditscore\",\"euro\",\"localatm\",\"monetizationon\",\"monetizationonoutlined\",\"money\",\"moneyoff\",\"paid\",\"paidoutlined\",\"payment\",\"payments\",\"paymentsoutlined\",\"pointofsale\",\"pricechange\",\"pricechangoutlined\",\"pricecheck\",\"requestpage\",\"requestpageoutlined\",\"requestquote\",\"requestquoteoutlined\",\"savings\",\"savingsoutlined\"],\r\n music: [\"album\", \"albumoutlined\",\"audiotrack\",\"audiotrackoutlined\"],\r\n math: [\"architecture\",\"calculate\",\"calculateoutlined\",\"exposure\",\"exposureoutlined\",\"filter1\",\"filter2\",\"filter3\",\"filter4\",\"filter5\",\"filter6\",\"filter7\",\"filter8\",\"filter9\",\"filter9plus\",\"flaky\",\"functions\",\"iso\",\"looks3\",\"looks3outlined\",\"looks4\",\"looks4outlined\",\"looks5\",\"looks5outlined\",\"looks6\",\"looks6outlined\",\"looksone\",\"looksoneoutlined\",\"lookstwo\",\"lookstwooutlined\",\"password\",\"plusone\",\"straighten\",\"subscript\",\"superscript\"],\r\n media: [\"youtube\",\"whatsapp\",\"twitter\",\"telegram\",\"facebook\",\"facebookoutlined\",\"github\",\"google\",\"instagram\",\"linkedin\",\"x\",\"tiktok\",\"snapchat\",\"threads\",\"messenger\", \"qq\", \"pinterest\", \"myspace\", \"medium\", \"reddit\", \"spotify\", \"slack\", \"skype\", \"teams\", \"twitch\", \"thumbler\", \"viber\", \"wechat\", \"vk\", \"amazon\", \"behance\", \"dribble\", \"discord\", \"deviantart\", \"line\"],\r\n measurnment:[\"eightk\",\"eightkoutlined\",\"eightkplus\",\"eightkplusoutlined\",\"eightmp\",\"eightmpoutlined\",\"eightteenmp\",\"eightteenmpoutlined\",\"elevenmp\",\"elevenmpoutlined\",\"fiberdvr\",\"fiberdvroutlined\",\"fibernew\",\"fibernewoutlined\",\"fiberpin\",\"fiberpinoutlined\",\"fiveg\",\"fivek\",\"fivekoutlined\",\"fivekplus\",\"fivekplusoutlined\",\"fivemp\",\"fivempoutlined\",\"fivteenmp\",\"fivteenmpoutlined\",\"fourgmobiledata\",\"fourgplusmobiledata\",\"fourk\",\"fourkoutlined\",\"fourkplus\",\"fourkplusoutlined\",\"fourmp\",\"fourmpoutlined\",\"fourteenmp\",\"fourteenmpoutlined\",\"gif\",\"hd\",\"hdoutlined\",\"hdrautoselect\",\"hdrenhancedselect\",\"hdroff\",\"hdroffselect\",\"hdron\",\"hdronselect\",\"hdrplus\",\"hdrplusoutlined\",\"hevc\",\"highquality\",\"highqualityoutlined\",\"lteplusmobiledata\",\"mp\",\"mpoutlined\",\"ninek\",\"ninekoutlined\",\"ninekplus\",\"ninekplusoutlined\",\"ninemp\",\"ninempoutlined\",\"nineteenmp\",\"nineteenmpoutlined\",\"onek\",\"onekk\",\"onekkoutlined\",\"onekoutlined\",\"onekplus\",\"onekplusoutlined\",\"rawoff\",\"rawon\",\"rsvp\",\"score\",\"scoreoutlined\",\"sd\",\"sdoutlined\",\"sevenk\",\"sevenkoutlined\",\"sevenkplus\",\"sevenkplusoutlined\",\"sevenmp\",\"sevenmpoutlined\",\"seventeenmp\",\"seventeenmpoutlined\",\"sip\",\"sipoutlined\",\"sixk\",\"sixkoutlined\",\"sixkplus\",\"sixkplusoutlined\",\"sixmp\",\"sixmpoutlined\",\"sixteenmp\",\"sixteenmpoutlined\",\"twompoutlined\",\"twomp\",\"twokplusoutlined\",\"twokplus\",\"twokoutlined\",\"twok\",\"twentyzerompoutlined\",\"twentyzeromp\",\"twentytwompoutlined\",\"twentytwomp\",\"twentythreempoutlined\",\"twentythreemp\",\"twentyonempoutlined\",\"twentyonemp\",\"twentyfourmpoutlined\",\"twentyfourmp\",\"twelvempoutlined\",\"twelvemp\",\"threempoutlined\",\"threemp\",\"threekplusoutlined\",\"threekplus\",\"threekoutlined\",\"threek\",\"thirteenmpoutlined\",\"thirteenmp\",\"tenmpoutlined\",\"tenmp\",],\r\n medal:[\"militarytech\",\"militarytechoutlined\"],\r\n move:[\"moveup\",\"movedown\",\"pinch\"],\r\n\r\n\r\n nature:[\"terrainoutlined\",\"terrain\",\"emojinature\",\"emojinatureoutlined\",\"filterhdr\",\"filterhdroutlined\",\"filtervintageoutlined\",\"grass\",\"landscape\",\"landscapeoutlined\",\"localflorist\",\"localfloristoutlined\",\"nature\",\"natureoutlined\",\"naturepeople\",\"naturepeopleoutlined\",\"park\",\"parkoutlined\",\"satellite\",\"satelliteoutlined\",\"spa\",\"spaoutlined\",\"yardoutlined\",\"yard\",\"agriculture\", \"agricultureoutlined\",\"compost\",\"landslide\",\"psychiatry\",\"nutrition\",\"raven\"],\r\n numbers:[\"timesonemobiledata\",\"timer10select\",\"timer10\",\"timer3select\",\"timer3\",\"threegmobiledata\",\"thirtyfpsselect\",\"thirtyfps\",\"tag\",\"sixtyfps\",\"sixtyfpsselect\"],\r\n notification:[\"circlenotifications\",\"circlenotificationsoutlined\",\"editnotifications\",\"editnotificationsoutlined\",\"notificationadd\",\"notificationaddoutlined\",\"notificationimportant\",\"notificationimportantoutlined\",\"notifications\",\"notificationsactive\",\"notificationsactiveoutlined\",\"notificationsoff\",\"notificationsoffoutlined\",\"notificationsoutlined\",\"notificationspaused\",\"notificationspausedoutlined\"],\r\n\r\n photo: [\"addphoto\",\"addphotooutlined\", \"addphotoalternate\", \"addphotoalternateoutlined\", \"addtophotos\", \"addtophotosoutlined\",\"arttrack\",\"wallpaper\",\"vrpaclassic\",\"vrpano\",\"voicechatoutlined\",\"voicechat\",\"videosettings\",\"videolibraryoutlined\",\"videolibrary\",\"videocamerafrontoutlined\",\"videocamerafront\",\"videocamerabackoutlined\",\"videocameraback\",\"videocamoffoutlined\",\"videocamoff\",\"videocamoutlined\",\"videocam\",\"videocalloutlined\",\"videocall\",\"brokenimage\",\"brokenimageoutlined\",\"burstmode\",\"burstmodeoutlined\",\"camera\",\"cameraalt\",\"cameraaltoutlined\",\"cameraenhance\",\"cameraenhanceoutlined\",\"camerafront\",\"camerafrontoutlined\",\"cameraindoor\",\"cameraindooroutlined\",\"cameraoutdoor\",\"cameraoutdooroutlined\",\"cameraoutlined\",\"camerarear\",\"camerarearoutlined\",\"cameraroll\",\"camerarolloutlined\",\"cameraswitch\",\"cameraswitchoutlined\",\"collections\",\"collectionsoutlined\",\"compare\",\"croporiginal\",\"dirtylens\",\"dirtylensoutlined\",\"duo\",\"filter\",\"flipcameraios\",\"flipcameraiosoutlined\",\"hideimage\",\"hideimageoutlined\",\"image\",\"imagenotsupported\",\"imagenotsupportedoutlined\",\"imageoutlined\",\"imagesearch\",\"linkedcamera\",\"linkedcameraoutlined\",\"localmovies\",\"localmoviesoutlined\",\"missedvideocall\",\"missedvideocalloutlined\",\"mms\",\"mmsoutlined\",\"monochromephotos\",\"movie\",\"movie\",\"moviefilteroutlined\",\"movieoutlined\",\"noflash\",\"noflashoutlined\",\"nophotography\",\"nophotographyoutlined\",\"notstarted\",\"notstartedoutlined\",\"panorama\",\"panoramaoutlined\",\"partymode\",\"partymodeoutlined\",\"pause\",\"pausecircle\",\"pausecircleoutlined\",\"pausepresentation\",\"permcameramic\",\"permcameramicoutlined\",\"permmedia\",\"permmediaoutlined\",\"photo\",\"photoalbum\",\"photoalbumoutlined\",\"photocamera\",\"photocameraback\",\"photocamerabackoutlined\",\"photocamerafront\",\"photocamerafrontoutlined\",\"photocameraoutlined\",\"photofilter\",\"photolibrary\",\"photolibraryoutlined\",\"photooutlined\",\"photosizeselectactual\",\"photosizeselectactualoutlined\",\"photosizeselectlarge\",\"photosizeselectsmall\",\"slideshow\",\"subscriptions\",\"subscriptionsoutlined\",\"switchcamera\",\"switchcameraoutlined\",\"switchvideo\",\"switchvideooutlined\"],\r\n phone: [\"addiccall\", \"addiccalloutlined\", \"addtohomescreen\", \"adunits\",\"adunitsoutlined\", \"aod\", \"aodoutlined\", \"appblocking\", \"appblockingoutlined\", \"appsettingsalt\", \"appsettingsaltoutlined\",\"bookonline\",\"bookonlineoutlined\",\"wificallingoutlined\",\"wificalling3outlined\",\"wificalling3\",\"wificalling\",\"vibration\",\"ttyoutlined\",\"tty\",\"tapandplay\",\"call\",\"calloutlined\",\"chargingstation\",\"chargingstationoutlined\",\"contactphone\",\"contactphoneoutlined\",\"deviceunknown\",\"dialersip\",\"dialersipoutlined\",\"dialpad\",\"dock\",\"edgesensorhigh\",\"edgesensorhighoutlined\",\"edgesensorlow\",\"edgesensorlowoutlined\",\"filtervintage\",\"filtervintageoutlined\",\"hotel\",\"hoteloutlined\",\"hottub\",\"importantdevices\",\"mobilefriendly\",\"mobileoff\",\"mobilescreenshare\",\"nocell\",\"nocelloutlined\",\"offlineshare\",\"offlineshareoutlined\",\"pattern\",\"permdeviceinformation\",\"permdeviceinformationoutlined\",\"permphonemsg\",\"permphonemsgoutlined\",\"phone\",\"phoneandroid\",\"phoneandroidoutlined\",\"phonebluetoothspeaker\",\"phonebluetoothspeakeroutlined\",\"phonecallback\",\"phonecallbackoutlined\",\"phonedisabled\",\"phonedisabledoutlined\",\"phoneenabled\",\"phoneenabledoutlined\",\"phoneforwarded\",\"phoneforwardedoutlined\",\"phoneintalk\",\"phoneintalkoutlined\",\"phoneiphone\",\"phonelink\",\"phonelinkerase\",\"phonelinklock\",\"phonelinkoff\",\"phonelinkring\",\"phonelinksetup\",\"phonelinksetupoutlined\",\"phonelocked\",\"phonelockedoutlined\",\"phonemissed\",\"phonemissedoutlined\",\"phoneoutlined\",\"phonepaused\",\"phonepausedoutlined\",\"rememberme\",\"remembermeoutlined\",\"ringvolume\",\"ringvolumeoutlined\",\"screenlocklandscape\",\"screenlockportrait\",\"screenlockrotation\",\"screenrotation\",\"screenshot\",\"screenshotoutlined\",\"securityupdate\",\"securityupdategood\",\"securityupdategoodoutlined\",\"securityupdateoutlined\",\"securityupdatewarning\",\"securityupdatewarningoutlined\",\"sendtomobile\",\"sendtomobileoutlined\",\"settingscell\",\"settingscelloutlined\",\"settingsphone\",\"settingsphoneoutlined\",\"smartphone\",\"smartscreen\",\"smartscreenoutlined\",\"speakerphone\",\"staycurrentlandscape\",\"staycurrentportrait\",\"style\",\"styleoutlined\",\"systemsecurityupdate\",\"systemsecurityupdategood\",\"systemsecurityupdategoodoutlined\",\"systemsecurityupdateoutlined\",\"systemsecurityupdatewarning\",\"systemsecurityupdatewarningoutlined\",\"systemupdate\",\"tablet\",\"tabletandroid\",\"tabletmac\"],\r\n plane: [\"airlineeeatflat\", \"airlineseatflatoutlined\", \"airlineseatflatangled\", \"airlineseatflatangledoutlined\", \"airplanemodeactive\", \"airplanemodeinactive\", \"airplaneticket\", \"airplaneticketoutlined\",\"flight\",\"flightland\",\"flighttakeoff\"],\r\n politics: [\"ballot\",\"ballotoutlined\",\"howtovote\",\"howtovoteoutlined\"],\r\n person:[\"directionsrun\",\"directionswalk\",\"elderly\",\"elevator\",\"elevatoroutlined\",\"emojipeople\",\"engineering\",\"engineeringoutlined\",\"escalatorwarning\",\"face\",\"faceoutlined\",\"faceretouchingnatural\",\"faceretouchingnaturaloutlined\",\"faceretouchingoff\",\"faceretouchingoffoutlined\",\"familyrestroom\",\"female\",\"fingerprint\",\"followthesigns\",\"group\",\"groupadd\",\"groupaddoutlined\",\"groups\",\"groupsoutlined\",\"hail\",\"male\",\"people\",\"peoplealt\",\"peoplealtoutlined\",\"peopleoutline\",\"peopleoutlined\",\"permcontactcalendar\",\"permcontactcalendaroutlined\",\"person\",\"personadd\",\"personaddalt1\",\"personaddalt1outlined\",\"personadddisabled\",\"personadddisabledoutlined\",\"personaddoutlined\",\"personoutlined\",\"personoff\",\"personoffoutlined\",\"personpin\",\"personpincircle\",\"personpincircleoutlined\",\"personpinoutlined\",\"personremove\",\"personremoveoutlined\",\"personsearch\",\"personsearchoutlined\",\"pregnantwoman\",\"presenttoall\",\"reducecapacity\",\"runcircle\",\"runcircleoutlined\",\"safetydivider\",\"selfimprovement\",\"settingsaccessibility\",\"socialdistance\",\"supervisedusercircle\",\"supervisedusercircleoutlined\",\"supervisoraccount\",\"supervisoraccountoutlined\",\"supportagent\",\"wc\",\"transferwithinastation\",\"zonepersonidle\",\"personraisedhand\"],\r\n pen:[\"edit\",\"editoutlined\",\"editoff\",\"editoffoutlined\"],\r\n print:[\"print\",\"printdisabled\",\"printdisabledoutlined\",\"printoutlined\"],\r\n programming:[],\r\n\r\n question:[\"contactsupport\",\"contactsupportoutlined\",\"help\",\"helpcenter\",\"helpcenteroutlined\",\"helpoutlined\",\"livehelp\",\"livehelpoutlined\",\"quiz\",\"quizoutlined\"],\r\n qr:[\"qrcode\",\"qrcode2\",\"qrcodescanner\"],\r\n\r\n security: [\"addmoderator\", \"addmoderatoroutlined\",\"adminpanelsettings\", \"adminpanelsettingsoutlined\",\"visibilityoutlined\",\"visibilityoffoutlined\",\"visibilityoff\",\"visibility\",\"enhancedencryption\",\"enhancedencryptionoutlined\",\"gppbad\",\"gppbadoutlined\",\"gppgood\",\"gppgoodoutlined\",\"gppmaybe\",\"gppmaybeoutlined\",\"https\",\"httpsoutlined\",\"localpolice\",\"localpoliceoutlined\",\"lock\",\"lockclock\",\"lockclockoutlined\",\"lockopen\",\"lockoutlined\",\"noencryption\",\"noencryptiongmailerrorred\",\"noencryptiongmailerrorredoutlined\",\"noencryptionoutlined\",\"policy\",\"policyoutlined\",\"removemoderator\",\"removemoderatoroutlined\",\"security\",\"shield\",\"shieldoutlined\"],\r\n street: [\"addroad\",\"trafficoutlined\",\"traffic\",\"editroad\",\"nearbyerror\",\"nearbyoff\"],\r\n seat: [\"airlineseatlegroomextra\", \"airlineseatlegroomnormal\", \"airlineseatlegroomreduced\", \"airlineseatreclineextra\", \"airlineseatreclinenormal\", \"airlineseatreclinenormaloutlined\"],\r\n \"shapes\": [\"allinclusive\", \"allout\", \"vignetteoutlined\",\"vignette\",\"category\",\"categoryoutlined\",\"changehistory\",\"details\",\"eject\",\"ejectoutlined\",\"filterbandw\",\"networkcell\",\"networklocked\",\"networklockedoutlined\",\"permdatasetting\",\"permdatasettingoutlined\",\"signalcellular0bar\",\"signalcellular1bar\",\"signalcellular2bar\",\"signalcellular3bar\",\"signalcellular4bar\",\"signalcellularalt\",\"signalcellularconnectednointernet\",\"signalcellularconnectednointernetoutlined\",\"signalcellularnodata\",\"signalcellularnull\",\"squarefoot\",\"squarefootoutlined\",\"stopoutlined\",\"streetview\"],\r\n sea: [\"anchor\",\"beachaccess\",\"beachaccessoutlined\",\"waves\",\"water\",\"directionsboat\",\"directionsboatoutlined\",\"kayaking\",\"pool\",\"sailing\",\"sailingoutlined\",\"support\"],\r\n star: [\"autoawesome\",\"autoawesomeoutlined\",\"bedtime\",\"bedtimeoutlined\",\"brightness2\",\"brightness2outlined\",\"brightness3\",\"brightness3outlined\",\"darkmode\",\"darkmodeoutlined\",\"grade\",\"gradeoutlined\",\"modenight\",\"modenightoutlined\",\"nightlight\",\"nightlightoutlined\",\"nightlightround\",\"nightlightroundoutlined\",\"nightsstay\",\"nightsstayoutlined\",\"offers\",\"settingsinputsvideo\",\"star\",\"starborder\",\"starborderpurple500\",\"starborderpurple500outlined\",\"starhalf\",\"starpurple500\",\"starrate\",\"starrateoutlined\",\"stars\",\"starsoutlined\"],\r\n square: [\"checkboxoutlineblank\",\"viewstream\",\"viewdayoutlined\",\"viewday\",\"viewcompactoutlined\",\"viewcompact\",\"viewcomfyoutlined\",\"viewcomfy\",\"viewcolumnoutlined\",\"viewcolumn\",\"viewcarouseloutlined\",\"viewcarousel\",\"viewarray\",\"viewagendaoutlined\",\"viewagenda\",\"videostableoutlined\",\"videostable\",\"viewsidebaroutlined\",\"viewsidebar\",\"viewquiltoutlined\",\"viewquilt\",\"viewmoduleoutlined\",\"viewmodule\",\"viewlistoutlined\",\"viewlist\",\"viewstreamoutlined\",\"viewweek\",\"viewweekoutlined\",\"autoawesomemosaic\",\"autoawesomemosaicoutlined\",\"autoawesomemotion\",\"autoawesomemotionoutlined\",\"backuptable\",\"bento\",\"bentooutlined\",\"borderall\",\"borderbottom\",\"borderclear\",\"bordercolor\",\"bordercoloroutlined\",\"borderhorizontal\",\"borderinner\",\"borderleft\",\"borderouter\",\"borderright\",\"borderstyle\",\"bordertop\",\"bordervertical\",\"brandingwatermark\",\"brandingwatermarkoutlined\",\"window\",\"widgetsoutlined\",\"widgets\",\"webassetoff\",\"webasset\",\"web\",\"videolabel\",\"verticalsplitoutlined\",\"verticalsplit\",\"tabunselected\",\"tableview\",\"browsernotsupported\",\"calendarviewmonth\",\"calendarviewweek\",\"calltoaction\",\"calltoactionoutlined\",\"cardmembership\",\"casino\",\"centerfocusstrong\",\"centerfocusstrongoutlined\",\"contentcopy\",\"copyall\",\"crop\",\"crop32\",\"crop54\",\"crop75\",\"crop169\",\"cropdin\",\"cropfree\",\"croplandscape\",\"cropportrait\",\"croprotate\",\"cropsquare\",\"dashboard\",\"dashboardoutlined\",\"dns\",\"dnsoutlined\",\"dynamicfeed\",\"dynamicform\",\"dynamicformoutlined\",\"featuredvideo\",\"featuredvideooutlined\",\"filtercenterfocus\",\"filterframes\",\"filterframesoutlined\",\"filternone\",\"fitscreen\",\"fitscreenoutlined\",\"flip\",\"fliptoback\",\"fliptofront\",\"fullscreen\",\"fullscreenexit\",\"grid3x3\",\"grid4x4\",\"gridgoldenratio\",\"gridoff\",\"gridon\",\"gridview\",\"highlightalt\",\"historyedu\",\"imageaspectratio\",\"layers\",\"layersclear\",\"layersclearoutlined\",\"layersoutlined\",\"margin\",\"padding\",\"pages\",\"pagesoutlined\",\"panoramahorizontal\",\"panoramahorizontalselect\",\"panoramavertical\",\"panoramaverticalselect\",\"panoramawideangle\",\"panoramawideangleselect\",\"repeaton\",\"repeatoneon\",\"roundedcorner\",\"selectall\",\"sensorwindow\",\"sensorwindowoutlined\",\"settingsoverscan\",\"shuffleon\",\"smartbutton\",\"spacebar\",\"splitscreen\",\"stop\",\"stopoutlined\",\"subtitles\",\"subtitlesoff\",\"subtitlesoffoutlined\",\"subtitlesoutlined\"],\r\n science: [\"biotech\",\"biotechoutlined\", \"bloodtype\",\"bloodtypeoutlined\",\"psychology\",\"psychologyoutlined\",\"science\",\"scienceoutlined\"],\r\n sound:[\"volumeupoutlined\",\"volumeup\",\"volumeoffoutlined\",\"volumeoff\",\"volumemuteoutlined\",\"volumemute\",\"volumedownoutlined\",\"volumedown\",\"voiceoveroffoutlined\",\"voiceoveroff\",\"voicemail\",\"campaign\",\"campaignoutlined\",\"earbuds\",\"earbudsbattery\",\"earbudsoutlined\",\"headphones\",\"headphonesoutlined\",\"headset\",\"headsetmic\",\"headsetmicoutlined\",\"headsetoff\",\"headsetoffoutlined\",\"headsetoutlined\",\"hearing\",\"hearingdisabled\",\"keyboardvoice\",\"keyboardvoiceoutlined\",\"leakadd\",\"leakremove\",\"librarymusic\",\"librarymusicoutlined\",\"mediabluetoothoff\",\"mediabluetoothon\",\"mic\",\"micexternaloff\",\"micexternaloffoutlined\",\"micexternalon\",\"micexternalonoutlined\",\"micnone\",\"micoff\",\"micoffoutlined\",\"musicnote\",\"musicnoteoutlined\",\"musicoff\",\"musicoffoutlined\",\"musicvideo\",\"podcasts\",\"queuemusic\",\"radio\",\"recordvoiceover\",\"recordvoiceoveroutlined\",\"settingsvoice\",\"settingsvoiceoutlined\",\"speaker\",\"speakeroutlined\",\"speakergroup\",\"speakergroupoutlined\",\"surroundsound\",\"surroundsoundoutlined\"],\r\n safety:[\"fireextinguisher\"],\r\n sport:[\"fitnesscenter\",\"hiking\",\"iceskating\",\"iceskatingoutlined\",\"kitesurfing\",\"nordicwalking\",\"paragliding\",\"paraglidingoutlined\",\"rowing\",\"skateboarding\",\"sledding\",\"snowboarding\",\"snowmobile\",\"snowmobileoutlined\",\"snowshoeing\",\"sports\",\"sportsbaseball\",\"sportsbaseballoutlined\",\"sportsbasketball\",\"sportsbasketballoutlined\",\"sportscricket\",\"sportscricketoutlined\",\"sportsesports\",\"sportsesportsoutlined\",\"sportsfootball\",\"sportsfootballoutlined\",\"sportsgolf\",\"sportshandball\",\"sportshockey\",\"sportskabaddi\",\"sportsmma\",\"sportsmmaoutlined\",\"sportsmotorsports\",\"sportsmotorsportsoutlined\",\"sportsrugby\",\"sportsrugbyoutlined\",\"sportsscore\",\"sportssoccer\",\"sportstennis\",\"sportsvolleyball\",\"sportsvolleyballoutlined\",\"surfing\"],\r\n settings:[\"miscellaneousservices\",\"settings\",\"settingsapplications\",\"settingsapplicationsoutlined\",\"settingsoutlined\",\"settingssuggest\",\"settingssuggestoutlined\"],\r\n smoke:[\"smokefree\",\"smokingrooms\"],\r\n space:[\"rocket\"],\r\n\r\n task: [\"addtask\",\"pendingactions\"],\r\n time: [\"accesstime\", \"accesstimefilled\",\"addalarm\", \"alarm\", \"alarmadd\", \"alarmoff\", \"alarmon\",\"avtimer\",\"watchlateroutlined\",\"watchoutlined\",\"watchlater\",\"watch\",\"timeroff\",\"timer\",\"historytoggleoff\",\"hourglassbottom\",\"hourglassdisabled\",\"hourglassempty\",\"hourglassfull\",\"hourglasstop\",\"moretime\",\"schedule\",\"shutterspeed\",\"snooze\",\"history\"], \r\n tempreature: [\"acnitu\", \"air\", \"airoutlined\",\"bolt\",\"whatshotoutlined\",\"whatshot\",\"wbtwilight\",\"wbsunnyoutlined\",\"wbsunny\",\"wbshade\",\"wbcloudyoutlined\",\"wbcloudy\",\"brightness4\",\"brightness4outlined\",\"brightnesshigh\",\"brightnesshighoutlined\",\"brightnesslow\",\"brightnesslowoutlined\",\"brightnessmedium\",\"brightnessmediumoutlined\",\"cloud\",\"cloudcircle\",\"cloudcircleoutlined\",\"cloudoff\",\"cloudoutlined\",\"filterdrama\",\"flare\",\"flashauto\",\"lightmode\",\"lightmodeoutlined\",\"localfiredepartment\",\"offlinebolt\",\"offlineboltoutlined\",\"settingsbrightness\",\"settingssystemdaydream\",\"settingssystemdaydreamoutlined\",\"storm\",\"modedual\", \"solarpanel\"],\r\n technology: [\"adb\", \"addtodrive\", \"addtodriveoutlined\", \"addtoqueue\", \"airplay\", \"android\", \"api\", \"apple\", \"appregistration\", \"approval\", \"apps\",\"bluetooth\",\"bluetoothaudio\",\"bluetoothconnected\",\"bluetoothdisabled\",\"wifitetheringoff\",\"wifitethering\",\"wifiprotectedsetup\",\"wifioff\",\"wifilock\",\"wifi\",\"vpnkeyoutlined\",\"vpnkey\",\"usboff\",\"usb\",\"tvoff\",\"tv\",\"toggleonoutlined\",\"toggleon\",\"toggleoffoutlined\",\"bugreport\",\"bugreportoutlined\",\"cast\",\"castconnected\",\"castconnectedoutlined\",\"castforeducation\",\"castforeducationoutlined\",\"cellwifi\",\"code\",\"codeoff\",\"computer\",\"connectedtv\",\"connectwithoutcontact\",\"copyright\",\"desktopaccessdisabled\",\"desktopmac\",\"desktopwindows\",\"developerboard\",\"developerboardoff\",\"devices\",\"devicesother\",\"electricalservices\",\"keyboard\",\"keyboardalt\",\"keyboardaltoutlined\",\"keyboardhide\",\"keyboardhideoutlined\",\"memory\",\"mouseoutlined\",\"networkcheck\",\"networkwifi\",\"nosim\",\"nosimoutlined\",\"onlineprediction\",\"permscanwifi\",\"permscanwifioutlined\",\"pestcontrol\",\"pestcontroloutlined\",\"portablewifioff\",\"power\",\"poweroff\",\"poweroffoutlined\",\"poweroutlined\",\"powersettingsnew\",\"reddit\",\"router\",\"routeroutlined\",\"rssfeed\",\"scanner\",\"scanneroutlined\",\"sdcard\",\"sdcardoutlined\",\"sdstorage\",\"sdstorageoutlined\",\"sensors\",\"sensorsoff\",\"settingsinputantenna\",\"settingsinputcomponent\",\"settingsinputcomponentoutlined\",\"settingsinputhdmi\",\"settingsinputhdmioutlined\",\"settingspower\",\"settingsremote\",\"settingsremoteoutlined\",\"signalcellularnosim\",\"signalcellularnosimoutlined\",\"signalcellularoff\",\"signalwifi0bar\",\"signalwifi1bar\",\"signalwifi1barlock\",\"signalwifi2bar\",\"signalwifi2barlock\",\"signalwifi3bar\",\"signalwifi3barlock\",\"signalwifi4bar\",\"signalwifi4barlock\",\"signalwifibad\",\"signalwifioff\",\"signalwifistatusbar4bar\",\"signalwifistatusbarconnectednointernet\",\"signalwifistatusbarnull\",\"simcard\",\"simcardalert\",\"simcardalertoutlined\",\"simcarddownload\",\"simcarddownloadoutlined\",\"simcardoutlined\",\"compasscalibration\",\"compasscalibrationoutlined\",\"confirmationnumber\",\"confirmationnumberoutlined\",\"flutterdash\",\"localactivity\",\"localactivityoutlined\",\"nfc\",\"dynamicform\",\"keyboardcommandkey\",\"php\",\"sendtimeextension\",\"extensionoff\"],\r\n text: [\"article\", \"articleoutlined\",\"assignment\",\"assignmentoutlined\",\"wysiwyg\",\"wraptext\",\"topicoutlined\",\"topic\",\"title\",\"textsnippetoutlined\",\"textsnippet\",\"textsmsoutlined\",\"textsms\",\"textrotationnone\",\"textrotationdown\",\"textrotationangleup\",\"textrotationangledown\",\"textrotatevertical\",\"textrotateup\",\"textformat\",\"textfields\",\"chat\",\"chatoutlined\",\"chatbubble\",\"chatbubbleoutlined\",\"chromereadermode\",\"chromereadermodeoutlined\",\"comment\",\"commentoutlined\",\"description\",\"descriptionoutlined\",\"documentscanneroutlined\",\"documentscannerrounded\",\"dvr\",\"featuredplaylist\",\"featuredplaylistoutlined\",\"feed\",\"feedoutlined\",\"grading\",\"insertcomment\",\"insertcommentoutlined\",\"librarybooks\",\"librarybooksoutlined\",\"message\",\"messageoutlined\",\"postadd\",\"shorttext\",\"source\",\"speakernotes\",\"speakernotesoff\",\"speakernotesoffoutlined\",\"speakernotesoutlined\",\"stickynote2\",\"stickynote2outlined\"],\r\n tool:[\"build\",\"buildoutlined\",\"buildcircle\",\"buildcircleoutlined\",\"carpenter\",\"carpenteroutlined\",\"colorize\",\"colorizeoutlined\",\"construction\",\"contactless\",\"contactlessoutlined\",\"contentcut\",\"create\",\"createoutlined\",\"designservices\",\"designservicesoutlined\",\"drivefilerenameoutline\",\"emojiobjects\",\"emojiobjectsoutlined\",\"emojisymbols\",\"filteralt\",\"filteraltoutlined\",\"formatcolorfill\",\"formatcolorreset\",\"formatcolorresetoutlined\",\"formatpaint\",\"formatpaintoutlined\",\"gavel\",\"handyman\",\"handymanoutlined\",\"hardware\",\"hardwareoutlined\",\"imagesearchroller\",\"imagesearchrolleroutlined\",\"plumbing\",\"precisionmanufacturing\",\"precisionmanufacturingoutlined\",\"pushpin\",\"pushpinoutlined\", \"scissors\"],\r\n target:[\"gpsfixed\",\"gpsnotfixed\",\"gpsoff\"],\r\n tag:[\"localoffer\",\"localofferoutlined\",\"loyalty\",\"loyaltyoutlined\",\"sell\",\"selloutlined\"],\r\n\r\n upload:[\"backup\",\"backupoutlined\",\"drivefolderupload\",\"drivefolderuploadoutlined\",\"cloudupload\",\"clouduploadoutlined\",\"fileupload\",\"fileuploadoutlined\",\"iosshare\",\"openinbrowser\",\"outbox\",\"outboxoutlined\",\"publish\",\"publishoutlined\"],\r\n\r\n view:[\"laptop\",\"laptopchromebook\",\"laptopmac\",\"laptopwindows\",\"livetv\",\"monitor\",\"ondemandvideo\",\"personalvideo\",\"preview\",\"previewoutlined\",\"queueplaynext\",\"removefromqueue\",\"removeredeye\",\"removeredeyeoutlined\",\"resettv\",\"resettvoutlined\",\"screensearchdesktop\",\"screensearchdesktopoutlined\",\"screenshare\",\"screenshareoutlined\",\"smartdisplay\",\"smartdisplayoutlined\",\"stopscreenshare\",\"stopscreenshareoutlined\",\"tab\"],\r\n\r\n world: [\"vpnlock\",\"travelexplore\",\"language\",\"public\",\"publicoff\"],\r\n\r\n zoom: [\"zoomout\",\"zoomin\",\"youtubesearchedfor\",\"findinpage\",\"findinpageoutlined\",\"findreplace\",\"managesearch\",\"pageview\",\"pageviewoutlined\",\"savedsearch\",\"search\",\"searchalt\",\"searchoff\"],\r\n\r\n };\r\n \r\n export default objIconsCategories;\r\n","\"use client\";\r\n\r\nfunction getPkgConfigIcon() {\r\n const initConfig = {\r\n blnIsTestingMode: true,\r\n };\r\n return initConfig;\r\n }\r\n\r\n export var pkgConfigIcon = getPkgConfigIcon();\r\n\r\n export function setPkgConfigIcon({ blnIsTestingMode = false,}) {\r\n pkgConfigIcon.blnIsTestingMode = blnIsTestingMode;\r\n }\r\n\r\n\r\nexport { default as Icon } from './Icon';\r\nexport {default as objIconsCategories} from \"./iconsCategories\"","// Imports\nimport ___CSS_LOADER_API_SOURCEMAP_IMPORT___ from \"../../../../../node_modules/css-loader/dist/runtime/sourceMaps.js\";\nimport ___CSS_LOADER_API_IMPORT___ from \"../../../../../node_modules/css-loader/dist/runtime/api.js\";\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_SOURCEMAP_IMPORT___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, \".overflowContainer {\\r\\n overflow: hidden;\\r\\n width: 100%; \\r\\n height: 100%; \\r\\n position: relative;\\r\\n}\\r\\n\\r\\n.animation-fadeIn {\\r\\n animation: fadeIn 0.3s forwards;\\r\\n}\\r\\n\\r\\n.animation-fadeOut {\\r\\n animation: fadeOut 0.3s forwards;\\r\\n}\\r\\n\\r\\n.animation-grow {\\r\\n animation: grow 0.3s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideIn {\\r\\n animation: slideIn 0.3s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideOut {\\r\\n animation: slideOut 0.3s forwards;\\r\\n}\\r\\n\\r\\n.animation-rotate {\\r\\n animation: rotate 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideInRotate {\\r\\n animation: slideInRotate 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideOutRotate {\\r\\n animation: slideOutRotate 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-fadeInGrow {\\r\\n animation: fadeInGrow 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-fadeOutGrow {\\r\\n animation: fadeOutGrow 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-fadeInSlideIn {\\r\\n animation: fadeInSlideIn 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-fadeOutSlideOut {\\r\\n animation: fadeOutSlideOut 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-bounce {\\r\\n animation: bounce 0.5s forwards;\\r\\n}\\r\\n\\r\\n.animation-pulse {\\r\\n animation: pulse 0.5s forwards;\\r\\n}\\r\\n\\r\\n.animation-shake {\\r\\n animation: shake 0.5s forwards;\\r\\n}\\r\\n\\r\\n.animation-tada {\\r\\n animation: tada 0.5s forwards;\\r\\n}\\r\\n\\r\\n.animation-flash {\\r\\n animation: flash 0.5s forwards;\\r\\n}\\r\\n\\r\\n.animation-rubberBand {\\r\\n animation: rubberBand 1s forwards;\\r\\n}\\r\\n\\r\\n.animation-swing {\\r\\n animation: swing 1s forwards;\\r\\n}\\r\\n\\r\\n.animation-jello {\\r\\n animation: jello 1s forwards;\\r\\n}\\r\\n\\r\\n.animation-wobble {\\r\\n animation: wobble 1s forwards;\\r\\n}\\r\\n\\r\\n.animation-hinge {\\r\\n animation: hinge 2s forwards;\\r\\n}\\r\\n\\r\\n.animation-flip {\\r\\n animation: flip 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-flipInX {\\r\\n animation: flipInX 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-flipOutX {\\r\\n animation: flipOutX 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-flipInY {\\r\\n animation: flipInY 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-flipOutY {\\r\\n animation: flipOutY 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-rollIn {\\r\\n animation: rollIn 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-rollOut {\\r\\n animation: rollOut 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-rotateIn {\\r\\n animation: rotateIn 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-rotateOut {\\r\\n animation: rotateOut 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideInUp {\\r\\n animation: slideInUp 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideInDown {\\r\\n animation: slideInDown 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideInLeft {\\r\\n animation: slideInLeft 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideInRight {\\r\\n animation: slideInRight 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideOutUp {\\r\\n animation: slideOutUp 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideOutDown {\\r\\n animation: slideOutDown 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideOutLeft {\\r\\n animation: slideOutLeft 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideOutRight {\\r\\n animation: slideOutRight 0.6s forwards;\\r\\n}\\r\\n\\r\\n\\r\\n@keyframes fadeIn {\\r\\n 0% { opacity: 0; }\\r\\n 100% { opacity: 1; }\\r\\n}\\r\\n\\r\\n@keyframes fadeOut {\\r\\n 0% { opacity: 1; }\\r\\n 100% { opacity: 0; }\\r\\n}\\r\\n\\r\\n@keyframes grow {\\r\\n 0% { transform: scale(0); }\\r\\n 100% { transform: scale(1); }\\r\\n}\\r\\n\\r\\n@keyframes slideIn {\\r\\n 0% { transform: translateX(-100%); }\\r\\n 100% { transform: translateX(0); }\\r\\n}\\r\\n\\r\\n@keyframes slideOut {\\r\\n 0% { transform: translateX(0); }\\r\\n 100% { transform: translateX(100%); }\\r\\n}\\r\\n\\r\\n@keyframes rotate {\\r\\n 0% { transform: rotate(0deg); }\\r\\n 100% { transform: rotate(360deg); }\\r\\n}\\r\\n\\r\\n@keyframes slideInRotate {\\r\\n 0% {\\r\\n transform: translateX(-100%) rotate(0deg);\\r\\n }\\r\\n 100% {\\r\\n transform: translateX(0) rotate(360deg);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes slideOutRotate {\\r\\n 0% {\\r\\n transform: translateX(0) rotate(0deg);\\r\\n }\\r\\n 100% {\\r\\n transform: translateX(100%) rotate(360deg);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes fadeInGrow {\\r\\n 0% {\\r\\n opacity: 0;\\r\\n transform: scale(0);\\r\\n }\\r\\n 100% {\\r\\n opacity: 1;\\r\\n transform: scale(1);\\r\\n }\\r\\n}\\r\\n\\r\\n\\r\\n@keyframes fadeOutGrow {\\r\\n 0% {\\r\\n opacity: 1;\\r\\n transform: scale(1);\\r\\n }\\r\\n 50% {\\r\\n opacity: 0;\\r\\n }\\r\\n 100% {\\r\\n opacity: 0;\\r\\n transform: scale(0);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes fadeInSlideIn {\\r\\n 0% {\\r\\n opacity: 0;\\r\\n transform: translateX(-100%);\\r\\n }\\r\\n 50% {\\r\\n opacity: 1;\\r\\n }\\r\\n 100% {\\r\\n opacity: 1;\\r\\n transform: translateX(0);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes fadeOutSlideOut {\\r\\n 0% {\\r\\n opacity: 1;\\r\\n transform: translateX(0);\\r\\n }\\r\\n 50% {\\r\\n opacity: 0;\\r\\n }\\r\\n 100% {\\r\\n opacity: 0;\\r\\n transform: translateX(100%);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes bounce {\\r\\n 0%, 20%, 50%, 80%, 100% {\\r\\n transform: translateY(0);\\r\\n }\\r\\n 40% {\\r\\n transform: translateY(-20px);\\r\\n }\\r\\n 60% {\\r\\n transform: translateY(-10px);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes pulse {\\r\\n 50% {\\r\\n transform: scale(1.05);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes shake {\\r\\n 10%, 90% {\\r\\n transform: translateX(-10%);\\r\\n }\\r\\n 20%, 80% {\\r\\n transform: translateX(10%);\\r\\n }\\r\\n 30%, 50%, 70% {\\r\\n transform: translateX(-5%);\\r\\n }\\r\\n 40%, 60% {\\r\\n transform: translateX(5%);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes tada {\\r\\n 10%, 20% {\\r\\n transform: scale(0.9) rotate(-3deg);\\r\\n }\\r\\n 30%, 50%, 70%, 90% {\\r\\n transform: scale(1.1) rotate(3deg);\\r\\n }\\r\\n 40%, 60%, 80% {\\r\\n transform: scale(1.1) rotate(-3deg);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes flash {\\r\\n 50% {\\r\\n opacity: 0.3;\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes rubberBand {\\r\\n 30% {\\r\\n transform: scaleX(1.25) scaleY(0.75);\\r\\n }\\r\\n 40% {\\r\\n transform: scaleX(0.75) scaleY(1.25);\\r\\n }\\r\\n 50% {\\r\\n transform: scaleX(1.15) scaleY(0.85);\\r\\n }\\r\\n 65% {\\r\\n transform: scaleX(0.95) scaleY(1.05);\\r\\n }\\r\\n 75% {\\r\\n transform: scaleX(1.05) scaleY(0.95);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes swing {\\r\\n 20% {\\r\\n transform: rotate(15deg);\\r\\n }\\r\\n 40% {\\r\\n transform: rotate(-10deg);\\r\\n }\\r\\n 60% {\\r\\n transform: rotate(5deg);\\r\\n }\\r\\n 80% {\\r\\n transform: rotate(-5deg);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes jello {\\r\\n 11%, 100% {\\r\\n transform: none;\\r\\n }\\r\\n 22% {\\r\\n transform: skewX(-12.5deg) skewY(-12.5deg);\\r\\n }\\r\\n 33% {\\r\\n transform: skewX(6.25deg) skewY(6.25deg);\\r\\n }\\r\\n 44% {\\r\\n transform: skewX(-3.125deg) skewY(-3.125deg);\\r\\n }\\r\\n 55% {\\r\\n transform: skewX(1.5625deg) skewY(1.5625deg);\\r\\n }\\r\\n 66% {\\r\\n transform: skewX(-0.78125deg) skewY(-0.78125deg);\\r\\n }\\r\\n 77% {\\r\\n transform: skewX(0.390625deg) skewY(0.390625deg);\\r\\n }\\r\\n 88% {\\r\\n transform: skewX(-0.1953125deg) skewY(-0.1953125deg);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes wobble {\\r\\n 0% { transform: translateX(0%); }\\r\\n 15% { transform: translateX(-25%) rotate(-5deg); }\\r\\n 30% { transform: translateX(20%) rotate(3deg); }\\r\\n 45% { transform: translateX(-15%) rotate(-3deg); }\\r\\n 60% { transform: translateX(10%) rotate(2deg); } \\r\\n 75% { transform: translateX(-5%) rotate(-1deg); }\\r\\n 100% { transform: translateX(0%); }\\r\\n}\\r\\n\\r\\n@keyframes hinge {\\r\\n 0% { transform: rotate(0); }\\r\\n 20% { transform: rotate(80deg); transform-origin: top left; }\\r\\n 40% { transform: translate(0, 700px); opacity: 1; }\\r\\n 100% { transform: translate(0, 700px); opacity: 0; }\\r\\n}\\r\\n\\r\\n@keyframes flip {\\r\\n 0% { transform: perspective(400px) rotateY(0); }\\r\\n 100% { transform: perspective(400px) rotateY(1turn); }\\r\\n}\\r\\n\\r\\n@keyframes flipInX {\\r\\n 0% { transform: perspective(400px) rotateX(90deg); opacity: 0; }\\r\\n 100% { transform: perspective(400px) rotateX(0deg); opacity: 1; }\\r\\n}\\r\\n\\r\\n@keyframes flipOutX {\\r\\n 0% { transform: perspective(400px) rotateX(0deg); opacity: 1; }\\r\\n 100% { transform: perspective(400px) rotateX(90deg); opacity: 0; }\\r\\n}\\r\\n\\r\\n@keyframes flipInY {\\r\\n 0% { transform: perspective(400px) rotateY(90deg); opacity: 0; }\\r\\n 100% { transform: perspective(400px) rotateY(0deg); opacity: 1; }\\r\\n}\\r\\n\\r\\n@keyframes flipOutY {\\r\\n 0% { transform: perspective(400px) rotateY(0deg); opacity: 1; }\\r\\n 100% { transform: perspective(400px) rotateY(90deg); opacity: 0; }\\r\\n}\\r\\n\\r\\n@keyframes rollIn {\\r\\n 0% { transform: translateX(-100%) rotate(-120deg); opacity: 0; }\\r\\n 100% { transform: translateX(0%) rotate(0deg); opacity: 1; }\\r\\n}\\r\\n\\r\\n@keyframes rollOut {\\r\\n 0% { transform: translateX(0%) rotate(0deg); opacity: 1; }\\r\\n 100% { transform: translateX(100%) rotate(120deg); opacity: 0; }\\r\\n}\\r\\n\\r\\n@keyframes rotateIn {\\r\\n 0% { transform: rotate(-90deg); opacity: 0; }\\r\\n 100% { transform: rotate(0); opacity: 1; }\\r\\n}\\r\\n\\r\\n@keyframes rotateOut {\\r\\n 0% { transform: rotate(0); opacity: 1; }\\r\\n 100% { transform: rotate(90deg); opacity: 0; }\\r\\n}\\r\\n\\r\\n@keyframes slideInUp {\\r\\n 0% { transform: translateY(100%); opacity: 0; }\\r\\n 100% { transform: translateY(0); opacity: 1; }\\r\\n}\\r\\n\\r\\n@keyframes slideInDown {\\r\\n 0% { transform: translateY(-100%); opacity: 0; }\\r\\n 100% { transform: translateY(0); opacity: 1; }\\r\\n}\\r\\n\\r\\n@keyframes slideInLeft {\\r\\n 0% { transform: translateX(-100%); opacity: 0; }\\r\\n 100% { transform: translateX(0); opacity: 1; }\\r\\n}\\r\\n\\r\\n@keyframes slideInRight {\\r\\n 0% { transform: translateX(100%); opacity: 0; }\\r\\n 100% { transform: translateX(0); opacity: 1; }\\r\\n}\\r\\n\\r\\n@keyframes slideOutUp {\\r\\n 0% { transform: translateY(0); opacity: 1; }\\r\\n 100% { transform: translateY(-100%); opacity: 0; }\\r\\n}\\r\\n\\r\\n@keyframes slideOutDown {\\r\\n 0% { transform: translateY(0); opacity: 1; }\\r\\n 100% { transform: translateY(100%); opacity: 0; }\\r\\n}\\r\\n\\r\\n@keyframes slideOutLeft {\\r\\n 0% { transform: translateX(0); opacity: 1; }\\r\\n 100% { transform: translateX(-100%); opacity: 0; }\\r\\n}\\r\\n\\r\\n@keyframes slideOutRight {\\r\\n 0% { transform: translateX(0); opacity: 1; }\\r\\n 100% { transform: translateX(100%); opacity: 0; }\\r\\n}\", \"\",{\"version\":3,\"sources\":[\"webpack://./material/src/surfaces/AnimationBox/AnimationBox.css\"],\"names\":[],\"mappings\":\"AAAA;EACE,gBAAgB;EAChB,WAAW;EACX,YAAY;EACZ,kBAAkB;AACpB;;AAEA;EACE,+BAA+B;AACjC;;AAEA;EACE,gCAAgC;AAClC;;AAEA;EACE,6BAA6B;AAC/B;;AAEA;EACE,gCAAgC;AAClC;;AAEA;EACE,iCAAiC;AACnC;;AAEA;EACE,+BAA+B;AACjC;;AAEA;EACE,sCAAsC;AACxC;;AAEA;EACE,uCAAuC;AACzC;;AAEA;EACE,mCAAmC;AACrC;;AAEA;EACE,oCAAoC;AACtC;;AAEA;EACE,sCAAsC;AACxC;;AAEA;EACE,wCAAwC;AAC1C;;AAEA;EACE,+BAA+B;AACjC;;AAEA;EACE,8BAA8B;AAChC;;AAEA;EACE,8BAA8B;AAChC;;AAEA;EACE,6BAA6B;AAC/B;;AAEA;EACE,8BAA8B;AAChC;;AAEA;EACE,iCAAiC;AACnC;;AAEA;EACE,4BAA4B;AAC9B;;AAEA;EACE,4BAA4B;AAC9B;;AAEA;EACE,6BAA6B;AAC/B;;AAEA;EACE,4BAA4B;AAC9B;;AAEA;EACE,6BAA6B;AAC/B;;AAEA;EACE,gCAAgC;AAClC;;AAEA;EACE,iCAAiC;AACnC;;AAEA;EACE,gCAAgC;AAClC;;AAEA;EACE,iCAAiC;AACnC;;AAEA;EACE,+BAA+B;AACjC;;AAEA;EACE,gCAAgC;AAClC;;AAEA;EACE,iCAAiC;AACnC;;AAEA;EACE,kCAAkC;AACpC;;AAEA;EACE,kCAAkC;AACpC;;AAEA;EACE,oCAAoC;AACtC;;AAEA;EACE,oCAAoC;AACtC;;AAEA;EACE,qCAAqC;AACvC;;AAEA;EACE,mCAAmC;AACrC;;AAEA;EACE,qCAAqC;AACvC;;AAEA;EACE,qCAAqC;AACvC;;AAEA;EACE,sCAAsC;AACxC;;;AAGA;EACE,KAAK,UAAU,EAAE;EACjB,OAAO,UAAU,EAAE;AACrB;;AAEA;EACE,KAAK,UAAU,EAAE;EACjB,OAAO,UAAU,EAAE;AACrB;;AAEA;EACE,KAAK,mBAAmB,EAAE;EAC1B,OAAO,mBAAmB,EAAE;AAC9B;;AAEA;EACE,KAAK,4BAA4B,EAAE;EACnC,OAAO,wBAAwB,EAAE;AACnC;;AAEA;EACE,KAAK,wBAAwB,EAAE;EAC/B,OAAO,2BAA2B,EAAE;AACtC;;AAEA;EACE,KAAK,uBAAuB,EAAE;EAC9B,OAAO,yBAAyB,EAAE;AACpC;;AAEA;EACE;MACI,yCAAyC;EAC7C;EACA;MACI,uCAAuC;EAC3C;AACF;;AAEA;EACE;MACI,qCAAqC;EACzC;EACA;MACI,0CAA0C;EAC9C;AACF;;AAEA;EACE;MACI,UAAU;MACV,mBAAmB;EACvB;EACA;MACI,UAAU;MACV,mBAAmB;EACvB;AACF;;;AAGA;EACE;MACI,UAAU;MACV,mBAAmB;EACvB;EACA;MACI,UAAU;EACd;EACA;MACI,UAAU;MACV,mBAAmB;EACvB;AACF;;AAEA;EACE;MACI,UAAU;MACV,4BAA4B;EAChC;EACA;MACI,UAAU;EACd;EACA;MACI,UAAU;MACV,wBAAwB;EAC5B;AACF;;AAEA;EACE;MACI,UAAU;MACV,wBAAwB;EAC5B;EACA;MACI,UAAU;EACd;EACA;MACI,UAAU;MACV,2BAA2B;EAC/B;AACF;;AAEA;EACE;IACE,wBAAwB;EAC1B;EACA;IACE,4BAA4B;EAC9B;EACA;IACE,4BAA4B;EAC9B;AACF;;AAEA;EACE;IACE,sBAAsB;EACxB;AACF;;AAEA;EACE;IACE,2BAA2B;EAC7B;EACA;IACE,0BAA0B;EAC5B;EACA;IACE,0BAA0B;EAC5B;EACA;IACE,yBAAyB;EAC3B;AACF;;AAEA;EACE;IACE,mCAAmC;EACrC;EACA;IACE,kCAAkC;EACpC;EACA;IACE,mCAAmC;EACrC;AACF;;AAEA;EACE;IACE,YAAY;EACd;AACF;;AAEA;EACE;IACE,oCAAoC;EACtC;EACA;IACE,oCAAoC;EACtC;EACA;IACE,oCAAoC;EACtC;EACA;IACE,oCAAoC;EACtC;EACA;IACE,oCAAoC;EACtC;AACF;;AAEA;EACE;IACE,wBAAwB;EAC1B;EACA;IACE,yBAAyB;EAC3B;EACA;IACE,uBAAuB;EACzB;EACA;IACE,wBAAwB;EAC1B;AACF;;AAEA;EACE;IACE,eAAe;EACjB;EACA;IACE,0CAA0C;EAC5C;EACA;IACE,wCAAwC;EAC1C;EACA;IACE,4CAA4C;EAC9C;EACA;IACE,4CAA4C;EAC9C;EACA;IACE,gDAAgD;EAClD;EACA;IACE,gDAAgD;EAClD;EACA;IACE,oDAAoD;EACtD;AACF;;AAEA;EACE,KAAK,yBAAyB,EAAE;EAChC,MAAM,yCAAyC,EAAE;EACjD,MAAM,uCAAuC,EAAE;EAC/C,MAAM,yCAAyC,EAAE;EACjD,MAAM,uCAAuC,EAAE;EAC/C,MAAM,wCAAwC,EAAE;EAChD,OAAO,yBAAyB,EAAE;AACpC;;AAEA;EACE,KAAK,oBAAoB,EAAE;EAC3B,MAAM,wBAAwB,EAAE,0BAA0B,EAAE;EAC5D,MAAM,8BAA8B,EAAE,UAAU,EAAE;EAClD,OAAO,8BAA8B,EAAE,UAAU,EAAE;AACrD;;AAEA;EACE,KAAK,wCAAwC,EAAE;EAC/C,OAAO,4CAA4C,EAAE;AACvD;;AAEA;EACE,KAAK,4CAA4C,EAAE,UAAU,EAAE;EAC/D,OAAO,2CAA2C,EAAE,UAAU,EAAE;AAClE;;AAEA;EACE,KAAK,2CAA2C,EAAE,UAAU,EAAE;EAC9D,OAAO,4CAA4C,EAAE,UAAU,EAAE;AACnE;;AAEA;EACE,KAAK,4CAA4C,EAAE,UAAU,EAAE;EAC/D,OAAO,2CAA2C,EAAE,UAAU,EAAE;AAClE;;AAEA;EACE,KAAK,2CAA2C,EAAE,UAAU,EAAE;EAC9D,OAAO,4CAA4C,EAAE,UAAU,EAAE;AACnE;;AAEA;EACE,KAAK,4CAA4C,EAAE,UAAU,EAAE;EAC/D,OAAO,sCAAsC,EAAE,UAAU,EAAE;AAC7D;;AAEA;EACE,KAAK,sCAAsC,EAAE,UAAU,EAAE;EACzD,OAAO,0CAA0C,EAAE,UAAU,EAAE;AACjE;;AAEA;EACE,KAAK,yBAAyB,EAAE,UAAU,EAAE;EAC5C,OAAO,oBAAoB,EAAE,UAAU,EAAE;AAC3C;;AAEA;EACE,KAAK,oBAAoB,EAAE,UAAU,EAAE;EACvC,OAAO,wBAAwB,EAAE,UAAU,EAAE;AAC/C;;AAEA;EACE,KAAK,2BAA2B,EAAE,UAAU,EAAE;EAC9C,OAAO,wBAAwB,EAAE,UAAU,EAAE;AAC/C;;AAEA;EACE,KAAK,4BAA4B,EAAE,UAAU,EAAE;EAC/C,OAAO,wBAAwB,EAAE,UAAU,EAAE;AAC/C;;AAEA;EACE,KAAK,4BAA4B,EAAE,UAAU,EAAE;EAC/C,OAAO,wBAAwB,EAAE,UAAU,EAAE;AAC/C;;AAEA;EACE,KAAK,2BAA2B,EAAE,UAAU,EAAE;EAC9C,OAAO,wBAAwB,EAAE,UAAU,EAAE;AAC/C;;AAEA;EACE,KAAK,wBAAwB,EAAE,UAAU,EAAE;EAC3C,OAAO,4BAA4B,EAAE,UAAU,EAAE;AACnD;;AAEA;EACE,KAAK,wBAAwB,EAAE,UAAU,EAAE;EAC3C,OAAO,2BAA2B,EAAE,UAAU,EAAE;AAClD;;AAEA;EACE,KAAK,wBAAwB,EAAE,UAAU,EAAE;EAC3C,OAAO,4BAA4B,EAAE,UAAU,EAAE;AACnD;;AAEA;EACE,KAAK,wBAAwB,EAAE,UAAU,EAAE;EAC3C,OAAO,2BAA2B,EAAE,UAAU,EAAE;AAClD\",\"sourcesContent\":[\".overflowContainer {\\r\\n overflow: hidden;\\r\\n width: 100%; \\r\\n height: 100%; \\r\\n position: relative;\\r\\n}\\r\\n\\r\\n.animation-fadeIn {\\r\\n animation: fadeIn 0.3s forwards;\\r\\n}\\r\\n\\r\\n.animation-fadeOut {\\r\\n animation: fadeOut 0.3s forwards;\\r\\n}\\r\\n\\r\\n.animation-grow {\\r\\n animation: grow 0.3s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideIn {\\r\\n animation: slideIn 0.3s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideOut {\\r\\n animation: slideOut 0.3s forwards;\\r\\n}\\r\\n\\r\\n.animation-rotate {\\r\\n animation: rotate 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideInRotate {\\r\\n animation: slideInRotate 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideOutRotate {\\r\\n animation: slideOutRotate 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-fadeInGrow {\\r\\n animation: fadeInGrow 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-fadeOutGrow {\\r\\n animation: fadeOutGrow 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-fadeInSlideIn {\\r\\n animation: fadeInSlideIn 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-fadeOutSlideOut {\\r\\n animation: fadeOutSlideOut 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-bounce {\\r\\n animation: bounce 0.5s forwards;\\r\\n}\\r\\n\\r\\n.animation-pulse {\\r\\n animation: pulse 0.5s forwards;\\r\\n}\\r\\n\\r\\n.animation-shake {\\r\\n animation: shake 0.5s forwards;\\r\\n}\\r\\n\\r\\n.animation-tada {\\r\\n animation: tada 0.5s forwards;\\r\\n}\\r\\n\\r\\n.animation-flash {\\r\\n animation: flash 0.5s forwards;\\r\\n}\\r\\n\\r\\n.animation-rubberBand {\\r\\n animation: rubberBand 1s forwards;\\r\\n}\\r\\n\\r\\n.animation-swing {\\r\\n animation: swing 1s forwards;\\r\\n}\\r\\n\\r\\n.animation-jello {\\r\\n animation: jello 1s forwards;\\r\\n}\\r\\n\\r\\n.animation-wobble {\\r\\n animation: wobble 1s forwards;\\r\\n}\\r\\n\\r\\n.animation-hinge {\\r\\n animation: hinge 2s forwards;\\r\\n}\\r\\n\\r\\n.animation-flip {\\r\\n animation: flip 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-flipInX {\\r\\n animation: flipInX 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-flipOutX {\\r\\n animation: flipOutX 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-flipInY {\\r\\n animation: flipInY 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-flipOutY {\\r\\n animation: flipOutY 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-rollIn {\\r\\n animation: rollIn 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-rollOut {\\r\\n animation: rollOut 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-rotateIn {\\r\\n animation: rotateIn 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-rotateOut {\\r\\n animation: rotateOut 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideInUp {\\r\\n animation: slideInUp 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideInDown {\\r\\n animation: slideInDown 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideInLeft {\\r\\n animation: slideInLeft 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideInRight {\\r\\n animation: slideInRight 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideOutUp {\\r\\n animation: slideOutUp 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideOutDown {\\r\\n animation: slideOutDown 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideOutLeft {\\r\\n animation: slideOutLeft 0.6s forwards;\\r\\n}\\r\\n\\r\\n.animation-slideOutRight {\\r\\n animation: slideOutRight 0.6s forwards;\\r\\n}\\r\\n\\r\\n\\r\\n@keyframes fadeIn {\\r\\n 0% { opacity: 0; }\\r\\n 100% { opacity: 1; }\\r\\n}\\r\\n\\r\\n@keyframes fadeOut {\\r\\n 0% { opacity: 1; }\\r\\n 100% { opacity: 0; }\\r\\n}\\r\\n\\r\\n@keyframes grow {\\r\\n 0% { transform: scale(0); }\\r\\n 100% { transform: scale(1); }\\r\\n}\\r\\n\\r\\n@keyframes slideIn {\\r\\n 0% { transform: translateX(-100%); }\\r\\n 100% { transform: translateX(0); }\\r\\n}\\r\\n\\r\\n@keyframes slideOut {\\r\\n 0% { transform: translateX(0); }\\r\\n 100% { transform: translateX(100%); }\\r\\n}\\r\\n\\r\\n@keyframes rotate {\\r\\n 0% { transform: rotate(0deg); }\\r\\n 100% { transform: rotate(360deg); }\\r\\n}\\r\\n\\r\\n@keyframes slideInRotate {\\r\\n 0% {\\r\\n transform: translateX(-100%) rotate(0deg);\\r\\n }\\r\\n 100% {\\r\\n transform: translateX(0) rotate(360deg);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes slideOutRotate {\\r\\n 0% {\\r\\n transform: translateX(0) rotate(0deg);\\r\\n }\\r\\n 100% {\\r\\n transform: translateX(100%) rotate(360deg);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes fadeInGrow {\\r\\n 0% {\\r\\n opacity: 0;\\r\\n transform: scale(0);\\r\\n }\\r\\n 100% {\\r\\n opacity: 1;\\r\\n transform: scale(1);\\r\\n }\\r\\n}\\r\\n\\r\\n\\r\\n@keyframes fadeOutGrow {\\r\\n 0% {\\r\\n opacity: 1;\\r\\n transform: scale(1);\\r\\n }\\r\\n 50% {\\r\\n opacity: 0;\\r\\n }\\r\\n 100% {\\r\\n opacity: 0;\\r\\n transform: scale(0);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes fadeInSlideIn {\\r\\n 0% {\\r\\n opacity: 0;\\r\\n transform: translateX(-100%);\\r\\n }\\r\\n 50% {\\r\\n opacity: 1;\\r\\n }\\r\\n 100% {\\r\\n opacity: 1;\\r\\n transform: translateX(0);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes fadeOutSlideOut {\\r\\n 0% {\\r\\n opacity: 1;\\r\\n transform: translateX(0);\\r\\n }\\r\\n 50% {\\r\\n opacity: 0;\\r\\n }\\r\\n 100% {\\r\\n opacity: 0;\\r\\n transform: translateX(100%);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes bounce {\\r\\n 0%, 20%, 50%, 80%, 100% {\\r\\n transform: translateY(0);\\r\\n }\\r\\n 40% {\\r\\n transform: translateY(-20px);\\r\\n }\\r\\n 60% {\\r\\n transform: translateY(-10px);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes pulse {\\r\\n 50% {\\r\\n transform: scale(1.05);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes shake {\\r\\n 10%, 90% {\\r\\n transform: translateX(-10%);\\r\\n }\\r\\n 20%, 80% {\\r\\n transform: translateX(10%);\\r\\n }\\r\\n 30%, 50%, 70% {\\r\\n transform: translateX(-5%);\\r\\n }\\r\\n 40%, 60% {\\r\\n transform: translateX(5%);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes tada {\\r\\n 10%, 20% {\\r\\n transform: scale(0.9) rotate(-3deg);\\r\\n }\\r\\n 30%, 50%, 70%, 90% {\\r\\n transform: scale(1.1) rotate(3deg);\\r\\n }\\r\\n 40%, 60%, 80% {\\r\\n transform: scale(1.1) rotate(-3deg);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes flash {\\r\\n 50% {\\r\\n opacity: 0.3;\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes rubberBand {\\r\\n 30% {\\r\\n transform: scaleX(1.25) scaleY(0.75);\\r\\n }\\r\\n 40% {\\r\\n transform: scaleX(0.75) scaleY(1.25);\\r\\n }\\r\\n 50% {\\r\\n transform: scaleX(1.15) scaleY(0.85);\\r\\n }\\r\\n 65% {\\r\\n transform: scaleX(0.95) scaleY(1.05);\\r\\n }\\r\\n 75% {\\r\\n transform: scaleX(1.05) scaleY(0.95);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes swing {\\r\\n 20% {\\r\\n transform: rotate(15deg);\\r\\n }\\r\\n 40% {\\r\\n transform: rotate(-10deg);\\r\\n }\\r\\n 60% {\\r\\n transform: rotate(5deg);\\r\\n }\\r\\n 80% {\\r\\n transform: rotate(-5deg);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes jello {\\r\\n 11%, 100% {\\r\\n transform: none;\\r\\n }\\r\\n 22% {\\r\\n transform: skewX(-12.5deg) skewY(-12.5deg);\\r\\n }\\r\\n 33% {\\r\\n transform: skewX(6.25deg) skewY(6.25deg);\\r\\n }\\r\\n 44% {\\r\\n transform: skewX(-3.125deg) skewY(-3.125deg);\\r\\n }\\r\\n 55% {\\r\\n transform: skewX(1.5625deg) skewY(1.5625deg);\\r\\n }\\r\\n 66% {\\r\\n transform: skewX(-0.78125deg) skewY(-0.78125deg);\\r\\n }\\r\\n 77% {\\r\\n transform: skewX(0.390625deg) skewY(0.390625deg);\\r\\n }\\r\\n 88% {\\r\\n transform: skewX(-0.1953125deg) skewY(-0.1953125deg);\\r\\n }\\r\\n}\\r\\n\\r\\n@keyframes wobble {\\r\\n 0% { transform: translateX(0%); }\\r\\n 15% { transform: translateX(-25%) rotate(-5deg); }\\r\\n 30% { transform: translateX(20%) rotate(3deg); }\\r\\n 45% { transform: translateX(-15%) rotate(-3deg); }\\r\\n 60% { transform: translateX(10%) rotate(2deg); } \\r\\n 75% { transform: translateX(-5%) rotate(-1deg); }\\r\\n 100% { transform: translateX(0%); }\\r\\n}\\r\\n\\r\\n@keyframes hinge {\\r\\n 0% { transform: rotate(0); }\\r\\n 20% { transform: rotate(80deg); transform-origin: top left; }\\r\\n 40% { transform: translate(0, 700px); opacity: 1; }\\r\\n 100% { transform: translate(0, 700px); opacity: 0; }\\r\\n}\\r\\n\\r\\n@keyframes flip {\\r\\n 0% { transform: perspective(400px) rotateY(0); }\\r\\n 100% { transform: perspective(400px) rotateY(1turn); }\\r\\n}\\r\\n\\r\\n@keyframes flipInX {\\r\\n 0% { transform: perspective(400px) rotateX(90deg); opacity: 0; }\\r\\n 100% { transform: perspective(400px) rotateX(0deg); opacity: 1; }\\r\\n}\\r\\n\\r\\n@keyframes flipOutX {\\r\\n 0% { transform: perspective(400px) rotateX(0deg); opacity: 1; }\\r\\n 100% { transform: perspective(400px) rotateX(90deg); opacity: 0; }\\r\\n}\\r\\n\\r\\n@keyframes flipInY {\\r\\n 0% { transform: perspective(400px) rotateY(90deg); opacity: 0; }\\r\\n 100% { transform: perspective(400px) rotateY(0deg); opacity: 1; }\\r\\n}\\r\\n\\r\\n@keyframes flipOutY {\\r\\n 0% { transform: perspective(400px) rotateY(0deg); opacity: 1; }\\r\\n 100% { transform: perspective(400px) rotateY(90deg); opacity: 0; }\\r\\n}\\r\\n\\r\\n@keyframes rollIn {\\r\\n 0% { transform: translateX(-100%) rotate(-120deg); opacity: 0; }\\r\\n 100% { transform: translateX(0%) rotate(0deg); opacity: 1; }\\r\\n}\\r\\n\\r\\n@keyframes rollOut {\\r\\n 0% { transform: translateX(0%) rotate(0deg); opacity: 1; }\\r\\n 100% { transform: translateX(100%) rotate(120deg); opacity: 0; }\\r\\n}\\r\\n\\r\\n@keyframes rotateIn {\\r\\n 0% { transform: rotate(-90deg); opacity: 0; }\\r\\n 100% { transform: rotate(0); opacity: 1; }\\r\\n}\\r\\n\\r\\n@keyframes rotateOut {\\r\\n 0% { transform: rotate(0); opacity: 1; }\\r\\n 100% { transform: rotate(90deg); opacity: 0; }\\r\\n}\\r\\n\\r\\n@keyframes slideInUp {\\r\\n 0% { transform: translateY(100%); opacity: 0; }\\r\\n 100% { transform: translateY(0); opacity: 1; }\\r\\n}\\r\\n\\r\\n@keyframes slideInDown {\\r\\n 0% { transform: translateY(-100%); opacity: 0; }\\r\\n 100% { transform: translateY(0); opacity: 1; }\\r\\n}\\r\\n\\r\\n@keyframes slideInLeft {\\r\\n 0% { transform: translateX(-100%); opacity: 0; }\\r\\n 100% { transform: translateX(0); opacity: 1; }\\r\\n}\\r\\n\\r\\n@keyframes slideInRight {\\r\\n 0% { transform: translateX(100%); opacity: 0; }\\r\\n 100% { transform: translateX(0); opacity: 1; }\\r\\n}\\r\\n\\r\\n@keyframes slideOutUp {\\r\\n 0% { transform: translateY(0); opacity: 1; }\\r\\n 100% { transform: translateY(-100%); opacity: 0; }\\r\\n}\\r\\n\\r\\n@keyframes slideOutDown {\\r\\n 0% { transform: translateY(0); opacity: 1; }\\r\\n 100% { transform: translateY(100%); opacity: 0; }\\r\\n}\\r\\n\\r\\n@keyframes slideOutLeft {\\r\\n 0% { transform: translateX(0); opacity: 1; }\\r\\n 100% { transform: translateX(-100%); opacity: 0; }\\r\\n}\\r\\n\\r\\n@keyframes slideOutRight {\\r\\n 0% { transform: translateX(0); opacity: 1; }\\r\\n 100% { transform: translateX(100%); opacity: 0; }\\r\\n}\"],\"sourceRoot\":\"\"}]);\n// Exports\nexport default ___CSS_LOADER_EXPORT___;\n","\"use strict\";\n\n/*\n MIT License http://www.opensource.org/licenses/mit-license.php\n Author Tobias Koppers @sokra\n*/\nmodule.exports = function (cssWithMappingToString) {\n var list = [];\n\n // return the list of modules as css string\n list.toString = function toString() {\n return this.map(function (item) {\n var content = \"\";\n var needLayer = typeof item[5] !== \"undefined\";\n if (item[4]) {\n content += \"@supports (\".concat(item[4], \") {\");\n }\n if (item[2]) {\n content += \"@media \".concat(item[2], \" {\");\n }\n if (needLayer) {\n content += \"@layer\".concat(item[5].length > 0 ? \" \".concat(item[5]) : \"\", \" {\");\n }\n content += cssWithMappingToString(item);\n if (needLayer) {\n content += \"}\";\n }\n if (item[2]) {\n content += \"}\";\n }\n if (item[4]) {\n content += \"}\";\n }\n return content;\n }).join(\"\");\n };\n\n // import a list of modules into the list\n list.i = function i(modules, media, dedupe, supports, layer) {\n if (typeof modules === \"string\") {\n modules = [[null, modules, undefined]];\n }\n var alreadyImportedModules = {};\n if (dedupe) {\n for (var k = 0; k < this.length; k++) {\n var id = this[k][0];\n if (id != null) {\n alreadyImportedModules[id] = true;\n }\n }\n }\n for (var _k = 0; _k < modules.length; _k++) {\n var item = [].concat(modules[_k]);\n if (dedupe && alreadyImportedModules[item[0]]) {\n continue;\n }\n if (typeof layer !== \"undefined\") {\n if (typeof item[5] === \"undefined\") {\n item[5] = layer;\n } else {\n item[1] = \"@layer\".concat(item[5].length > 0 ? \" \".concat(item[5]) : \"\", \" {\").concat(item[1], \"}\");\n item[5] = layer;\n }\n }\n if (media) {\n if (!item[2]) {\n item[2] = media;\n } else {\n item[1] = \"@media \".concat(item[2], \" {\").concat(item[1], \"}\");\n item[2] = media;\n }\n }\n if (supports) {\n if (!item[4]) {\n item[4] = \"\".concat(supports);\n } else {\n item[1] = \"@supports (\".concat(item[4], \") {\").concat(item[1], \"}\");\n item[4] = supports;\n }\n }\n list.push(item);\n }\n };\n return list;\n};","\"use strict\";\n\nmodule.exports = function (item) {\n var content = item[1];\n var cssMapping = item[3];\n if (!cssMapping) {\n return content;\n }\n if (typeof btoa === \"function\") {\n var base64 = btoa(unescape(encodeURIComponent(JSON.stringify(cssMapping))));\n var data = \"sourceMappingURL=data:application/json;charset=utf-8;base64,\".concat(base64);\n var sourceMapping = \"/*# \".concat(data, \" */\");\n return [content].concat([sourceMapping]).join(\"\\n\");\n }\n return [content].join(\"\\n\");\n};","\"use strict\";\n\nvar stylesInDOM = [];\nfunction getIndexByIdentifier(identifier) {\n var result = -1;\n for (var i = 0; i < stylesInDOM.length; i++) {\n if (stylesInDOM[i].identifier === identifier) {\n result = i;\n break;\n }\n }\n return result;\n}\nfunction modulesToDom(list, options) {\n var idCountMap = {};\n var identifiers = [];\n for (var i = 0; i < list.length; i++) {\n var item = list[i];\n var id = options.base ? item[0] + options.base : item[0];\n var count = idCountMap[id] || 0;\n var identifier = \"\".concat(id, \" \").concat(count);\n idCountMap[id] = count + 1;\n var indexByIdentifier = getIndexByIdentifier(identifier);\n var obj = {\n css: item[1],\n media: item[2],\n sourceMap: item[3],\n supports: item[4],\n layer: item[5]\n };\n if (indexByIdentifier !== -1) {\n stylesInDOM[indexByIdentifier].references++;\n stylesInDOM[indexByIdentifier].updater(obj);\n } else {\n var updater = addElementStyle(obj, options);\n options.byIndex = i;\n stylesInDOM.splice(i, 0, {\n identifier: identifier,\n updater: updater,\n references: 1\n });\n }\n identifiers.push(identifier);\n }\n return identifiers;\n}\nfunction addElementStyle(obj, options) {\n var api = options.domAPI(options);\n api.update(obj);\n var updater = function updater(newObj) {\n if (newObj) {\n if (newObj.css === obj.css && newObj.media === obj.media && newObj.sourceMap === obj.sourceMap && newObj.supports === obj.supports && newObj.layer === obj.layer) {\n return;\n }\n api.update(obj = newObj);\n } else {\n api.remove();\n }\n };\n return updater;\n}\nmodule.exports = function (list, options) {\n options = options || {};\n list = list || [];\n var lastIdentifiers = modulesToDom(list, options);\n return function update(newList) {\n newList = newList || [];\n for (var i = 0; i < lastIdentifiers.length; i++) {\n var identifier = lastIdentifiers[i];\n var index = getIndexByIdentifier(identifier);\n stylesInDOM[index].references--;\n }\n var newLastIdentifiers = modulesToDom(newList, options);\n for (var _i = 0; _i < lastIdentifiers.length; _i++) {\n var _identifier = lastIdentifiers[_i];\n var _index = getIndexByIdentifier(_identifier);\n if (stylesInDOM[_index].references === 0) {\n stylesInDOM[_index].updater();\n stylesInDOM.splice(_index, 1);\n }\n }\n lastIdentifiers = newLastIdentifiers;\n };\n};","\"use strict\";\n\nvar memo = {};\n\n/* istanbul ignore next */\nfunction getTarget(target) {\n if (typeof memo[target] === \"undefined\") {\n var styleTarget = document.querySelector(target);\n\n // Special case to return head of iframe instead of iframe itself\n if (window.HTMLIFrameElement && styleTarget instanceof window.HTMLIFrameElement) {\n try {\n // This will throw an exception if access to iframe is blocked\n // due to cross-origin restrictions\n styleTarget = styleTarget.contentDocument.head;\n } catch (e) {\n // istanbul ignore next\n styleTarget = null;\n }\n }\n memo[target] = styleTarget;\n }\n return memo[target];\n}\n\n/* istanbul ignore next */\nfunction insertBySelector(insert, style) {\n var target = getTarget(insert);\n if (!target) {\n throw new Error(\"Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.\");\n }\n target.appendChild(style);\n}\nmodule.exports = insertBySelector;","\"use strict\";\n\n/* istanbul ignore next */\nfunction insertStyleElement(options) {\n var element = document.createElement(\"style\");\n options.setAttributes(element, options.attributes);\n options.insert(element, options.options);\n return element;\n}\nmodule.exports = insertStyleElement;","\"use strict\";\n\n/* istanbul ignore next */\nfunction setAttributesWithoutAttributes(styleElement) {\n var nonce = typeof __webpack_nonce__ !== \"undefined\" ? __webpack_nonce__ : null;\n if (nonce) {\n styleElement.setAttribute(\"nonce\", nonce);\n }\n}\nmodule.exports = setAttributesWithoutAttributes;","\"use strict\";\n\n/* istanbul ignore next */\nfunction apply(styleElement, options, obj) {\n var css = \"\";\n if (obj.supports) {\n css += \"@supports (\".concat(obj.supports, \") {\");\n }\n if (obj.media) {\n css += \"@media \".concat(obj.media, \" {\");\n }\n var needLayer = typeof obj.layer !== \"undefined\";\n if (needLayer) {\n css += \"@layer\".concat(obj.layer.length > 0 ? \" \".concat(obj.layer) : \"\", \" {\");\n }\n css += obj.css;\n if (needLayer) {\n css += \"}\";\n }\n if (obj.media) {\n css += \"}\";\n }\n if (obj.supports) {\n css += \"}\";\n }\n var sourceMap = obj.sourceMap;\n if (sourceMap && typeof btoa !== \"undefined\") {\n css += \"\\n/*# sourceMappingURL=data:application/json;base64,\".concat(btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap)))), \" */\");\n }\n\n // For old IE\n /* istanbul ignore if */\n options.styleTagTransform(css, styleElement, options.options);\n}\nfunction removeStyleElement(styleElement) {\n // istanbul ignore if\n if (styleElement.parentNode === null) {\n return false;\n }\n styleElement.parentNode.removeChild(styleElement);\n}\n\n/* istanbul ignore next */\nfunction domAPI(options) {\n if (typeof document === \"undefined\") {\n return {\n update: function update() {},\n remove: function remove() {}\n };\n }\n var styleElement = options.insertStyleElement(options);\n return {\n update: function update(obj) {\n apply(styleElement, options, obj);\n },\n remove: function remove() {\n removeStyleElement(styleElement);\n }\n };\n}\nmodule.exports = domAPI;","\"use strict\";\n\n/* istanbul ignore next */\nfunction styleTagTransform(css, styleElement) {\n if (styleElement.styleSheet) {\n styleElement.styleSheet.cssText = css;\n } else {\n while (styleElement.firstChild) {\n styleElement.removeChild(styleElement.firstChild);\n }\n styleElement.appendChild(document.createTextNode(css));\n }\n}\nmodule.exports = styleTagTransform;","__webpack_require__.nc = undefined;","import React from \"react\";\r\nimport { pkgConfigMaterial } from \"../../../\";\r\nexport default class ErrorBoundary extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = { error: false };\r\n }\r\n\r\n static getDerivedStateFromError(error) {\r\n // Changing the state to true if some error occurs\r\n if (pkgConfigMaterial?.blnIsTestingMode) {\r\n return {\r\n error: true,\r\n };\r\n }\r\n }\r\n\r\n render() {\r\n if (this.state.error && pkgConfigMaterial?.blnIsTestingMode) {\r\n return (\r\n \r\n Oops! Something is wrong.\r\n
\r\n );\r\n }\r\n return this?.props?.children;\r\n }\r\n}\r\n","import React, { forwardRef, useContext } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport AvatarStyle from \"./AvatarStyle\";\r\nimport ErrorBoundary from \"../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary\";\r\n\r\nconst Avatar = forwardRef((/**@type {any}*/props, ref) => {\r\n const { src, alt, color, mode, sx, hidden, disabled, dir, className, ...rest } = props;\r\n const theTheme = useContext(ContextThemeProvider);\r\n const {classesName, style, styleSx} = AvatarStyle(theTheme);\r\n const classes = style();\r\n const classesSx = styleSx({ sx: props?.sx, src, color });\r\n\r\n const itemClasses = styleFunction.getClassName(classes?.[classesName?.avatar], classesSx?.[classesName?.sx], styleFunction.CheckDirectionItem(dir),styleFunction.CheckDisabledItem(disabled), styleFunction.CheckHiddenItem(hidden),styleFunction.checkExistsMargin(rest),styleFunction.checkExistsPadding(rest), className);\r\n\r\n return (\r\n \r\n
\r\n );\r\n});\r\n\r\nexport default Avatar;\r\n","import {\r\n StyleBuilder,\r\n styleVariables,\r\n cssKeys,\r\n mainTheme,\r\n styleFunction,\r\n} from \"@cbmisorg/styles\";\r\n\r\nexport default(objThemeInfo)=>{\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n\r\n const classesName = {\r\n avatar: `${styleVariables?.prefixDefaultClassName}_avatar`,\r\n avatar_contain: `${styleVariables?.prefixDefaultClassName}_avatar_contain`,\r\n shape_circle: `${styleVariables?.prefixDefaultClassName}_shape_circle`,\r\n sx:`${styleVariables?.prefixDefaultClassName}_avatar_sx`\r\n }\r\n\r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.avatar]: {\r\n display: cssObject?.display?.[cssKeys?.block],\r\n position: cssObject.position?.[cssKeys?.relative],\r\n margin: cssObject.spacing?.[cssKeys?.auto],\r\n padding: cssObject.spacing?.[cssKeys?.auto],\r\n },\r\n [classesName?.avatar_contain]: {\r\n display: cssObject?.display?.flex,\r\n width: cssObject?.size?.full,\r\n height: cssObject?.size?.full,\r\n justifyContent: \"center\",\r\n alignItems: \"center\",\r\n textAlign: \"center\",\r\n verticalAlign: \"middle\",\r\n margin: cssObject.spacing?.auto,\r\n padding: cssObject.spacing?.auto,\r\n position: cssObject.position?.absolute,\r\n top: \"0\",\r\n left: \"0\",\r\n zIndex: \"var(--cbmis-z-index-1)\",\r\n color: cssObject?.color?.currentColor,\r\n },\r\n },\r\n });\r\n\r\n const styleSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName.sx]: (props) => {\r\n const obj ={\r\n color: cssObject?.color?.[cssKeys?.bodyColorBgDark],\r\n width: cssObject.size?.[cssKeys?.item_lg],\r\n height: cssObject.size?.[cssKeys?.item_lg],\r\n fontSize: cssObject?.text?.size?.[cssKeys?.subtitle2],\r\n backgroundColor: styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.[cssKeys?.bodyColorBgDark]),\r\n ...props?.sx\r\n }\r\n if(props?.src){\r\n obj.backgroundImage= `url(${props?.src})`\r\n obj.backgroundPosition= \"center\"\r\n obj.backgroundSize= \"100% 100%\"\r\n obj.backgroundRepeat= \"no-repeat\"\r\n }\r\n return {\r\n ...getAvatarMode(props?.mode),\r\n ...obj\r\n };\r\n },\r\n },\r\n });\r\n\r\n\r\n const getAvatarMode = (mode) => {\r\n switch (String(mode)?.toLowerCase()) {\r\n default:\r\n return {\r\n\r\n borderRadius: cssObject?.border?.[cssKeys?.rounded]?.pill,\r\n WebkitBorderRadius: cssObject?.border?.[cssKeys?.rounded]?.pill,\r\n MozBorderRadius: cssObject?.border?.[cssKeys?.rounded]?.pill,\r\n };\r\n }\r\n };\r\n\r\n return{\r\n classesName,\r\n style,\r\n styleSx,\r\n }\r\n}","import React, { forwardRef, useContext, useId } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport BadgeStyle from \"./BadgeStyle\";\r\nimport ErrorBoundary from \"../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary\";\r\n\r\nconst Badge = forwardRef((/**@type {any}*/props, ref) => {\r\n const { content, mode, vertical, horizontal, color, sx, hidden, id, disabled, dir, className, ...rest } = props;\r\n const theTheme = useContext(ContextThemeProvider);\r\n const {classesName, style, styleSx} = BadgeStyle(theTheme);\r\n const classes = style();\r\n const classesSx = styleSx({...props?.sx, mode, vertical, horizontal, color});\r\n const comID = id || String(useId()).slice(1,-1)\r\n\r\n const classesNamesTag0 = styleFunction?.getClassName(classes?.[classesName?.badge_container], styleFunction.CheckDirectionItem(dir));\r\n const classesNamesTag1 = styleFunction?.getClassName(classes?.[classesName?.badge], classes?.[classesName?.mdl_badge], classesSx?.[classesName?.mdl_badge]);\r\n const classesNamesTag2 = styleFunction?.getClassName(classes?.[classesName?.badge_content], classesSx?.[classesName?.badge_content], classesSx?.[classesName?.sx], styleFunction.CheckDisabledItem(disabled), styleFunction.CheckHiddenItem(hidden), styleFunction.checkExistsMargin(rest), styleFunction.checkExistsPadding(rest), className || \"\");\r\n\r\n return (\r\n \r\n {props.children} \r\n
\r\n \r\n
\r\n );\r\n});\r\n\r\nexport default Badge;\r\n","import {\r\n StyleBuilder,\r\n styleVariables,\r\n cssKeys,\r\n mainTheme,\r\n styleFunction,\r\n} from \"@cbmisorg/styles\";\r\n\r\nexport default(objThemeInfo)=>{\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n const currentBaseSize = objThemeInfo?.currentBaseSize || mainTheme?.currentBaseSize;\r\n\r\n const classesName = {\r\n badge_container: `${styleVariables?.prefixDefaultClassName}_badge_container`,\r\n badge: `${styleVariables?.prefixDefaultClassName}_badge`,\r\n mdl_badge: `${styleVariables?.prefixDefaultClassName}_mdl_badge`,\r\n badge_content:`${styleVariables?.prefixDefaultClassName}_badge_content`,\r\n sx:`${styleVariables?.prefixDefaultClassName}_badge_sx`,\r\n }\r\n\r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.badge_container]: {\r\n position: cssObject.position?.[cssKeys?.relative],\r\n boxSizing: \"inherit\",\r\n display: \"inline-flex\",\r\n verticalAlign: \"middle\",\r\n flexShrink: 0,\r\n margin: 0,\r\n flexDirection: \"column\",\r\n alignItems: \"center\",\r\n },\r\n [classesName?.badge]: {\r\n lineHeight: 1,\r\n display: \"block\",\r\n margin: 0,\r\n },\r\n [classesName?.mdl_badge]: {\r\n display: \"block\",\r\n margin: 0,\r\n position:\"relative\",\r\n },\r\n [classesName?.badge_content]: {\r\n position: \"absolute\",\r\n zIndex: 1,\r\n display: \"flex\",\r\n justifyContent:\"center\",\r\n textAlign:\"center\",\r\n flexFlow: \"row wrap\",\r\n boxPack: \"center\",\r\n WebkitBoxPack: \"center\",\r\n placeContent: \"center\",\r\n boxAlign: \"center\",\r\n WebkitBoxAlign: \"center\",\r\n alignItems: \"center\",\r\n boxSizing: \"border-box\",\r\n fontWeight: cssObject?.fontWeight?.[cssKeys?.fontWeight_md],\r\n lineHeight: 10,\r\n padding: \"auto\",\r\n transition: \"transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms\",\r\n },\r\n },\r\n });\r\n\r\n const styleSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.mdl_badge]: {\r\n fontSize: cssObject?.size?.[cssKeys?.body1]\r\n },\r\n [classesName?.badge_content]:(props)=>{\r\n return {\r\n fontWeight: cssObject?.fontWeight?.[cssKeys?.fontWeight_md],\r\n color:cssObject?.color?.[cssKeys?.light],\r\n border: `${currentBaseSize/5}rem solid ${cssObject?.color?.[cssKeys?.white]}`,\r\n fontSize: `${currentBaseSize*2.7}rem`,\r\n minWidth: `${currentBaseSize*4}rem`,\r\n height: `${currentBaseSize*4}rem`,\r\n borderRadius: cssObject?.border?.[cssKeys?.rounded]?.pill,\r\n backgroundColor: styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.[cssKeys?.primary]),\r\n ...getVertical(props?.vertical),\r\n ...getHorizontal(props?.horizontal),\r\n ...getStyleMode(props?.mode),\r\n }\r\n },\r\n [classesName?.sx]: (props) => {\r\n return {\r\n ...props?.sx,\r\n };\r\n },\r\n },\r\n });\r\n\r\n const getHorizontal = (horizontal) => {\r\n const getHorizontal = String(horizontal).toLowerCase();\r\n switch (getHorizontal) {\r\n case \"left\":\r\n return {\r\n position: \"absolute\",\r\n left: `-${cssObject.spacing?.[cssKeys?.xs]}`,\r\n right: \"auto\",\r\n // transform: \"scale(1) translateX(-50%)\",\r\n // transformOrigin: \"0% 100%\",\r\n }\r\n default:\r\n return {\r\n position: \"absolute\",\r\n right: `-${cssObject.spacing?.[cssKeys?.xs]}`,\r\n left: \"auto\",\r\n // transform: \"scale(1) translateX(-50%)\",\r\n // transformOrigin: \"0% 100%\",\r\n }\r\n }\r\n };\r\n\r\n const getVertical = (vertical) => {\r\n const getVertical = String(vertical).toLowerCase();\r\n switch (getVertical) {\r\n case \"bottom\":\r\n return {\r\n position: \"absolute\",\r\n bottom: `-${cssObject.spacing?.[cssKeys?.xs]}`,\r\n auto: \"auto\",\r\n };\r\n default:\r\n return {\r\n position: \"absolute\",\r\n top: `-${cssObject.spacing?.[cssKeys?.xs]}`,\r\n bottom: \"auto\",\r\n };\r\n }\r\n };\r\n\r\n const getStyleMode = (mode) => {\r\n const getStyle = String(mode).toLowerCase();\r\n switch (getStyle) {\r\n case \"dot\":\r\n return {\r\n minWidth: cssObject.spacing?.[cssKeys?.sm],\r\n padding: \"0px\",\r\n margin: \"0px\",\r\n height:cssObject.spacing?.[cssKeys?.sm],\r\n border: \"none\",\r\n };\r\n default:\r\n return null;\r\n }\r\n };\r\n\r\n return{\r\n classesName,\r\n style,\r\n styleSx,\r\n }\r\n}","var __WEBPACK_NAMESPACE_OBJECT__ = require(\"@cbmisorg/icons\");","import React, { forwardRef, useContext } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport ChipStyle from \"./ChipStyle\";\r\nimport ErrorBoundary from \"../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary\";\r\nimport { Avatar } from \"@cbmisorg/material\";\r\nimport { Icon } from \"@cbmisorg/icons\";\r\n\r\nconst Chip = forwardRef((/**@type {any}*/props, ref) => {\r\n const { label, mode, size, color, avatar, endAvatar,icon, endIcon, sx, hidden, disabled, dir, className, ...rest } = props;\r\n const theTheme = useContext(ContextThemeProvider);\r\n const {classesName, style, styleSx} = ChipStyle(theTheme);\r\n const classes = style();\r\n const classesSx = styleSx({ sx, label, mode, size, color, avatar, endAvatar,icon, endIcon });\r\n\r\n const itemClasses = styleFunction.getClassName(classes?.[classesName?.chip], classesSx?.[classesName?.chip], classesSx?.[classesName?.sx], styleFunction.CheckDirectionItem(dir),styleFunction.CheckDisabledItem(disabled), styleFunction.CheckHiddenItem(hidden),styleFunction.checkExistsMargin(rest),styleFunction.checkExistsPadding(rest), className);\r\n\r\n return (\r\n \r\n {props?.children} \r\n
\r\n \r\n {content}\r\n
\r\n \r\n \r\n {avatar? (\r\n \r\n {avatar?.props?.children}\r\n \r\n ) : icon?(\r\n \r\n {endAvatar?.props?.children}\r\n \r\n ) : endIcon?( \r\n
\r\n );\r\n});\r\n\r\nexport default Chip;\r\n","import {\r\n StyleBuilder,\r\n styleVariables,\r\n cssKeys,\r\n mainTheme,\r\n styleFunction,\r\n} from \"@cbmisorg/styles\";\r\n\r\nexport default(objThemeInfo)=>{\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n\r\n const classesName = {\r\n chip: `${styleVariables?.prefixDefaultClassName}_chip`,\r\n chip_content: `${styleVariables?.prefixDefaultClassName}_chip_content`,\r\n shape_circle: `${styleVariables?.prefixDefaultClassName}_shape_circle`,\r\n sx:`${styleVariables?.prefixDefaultClassName}_chip_sx`\r\n }\r\n\r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.chip]: {\r\n display: \"inline-flex\",\r\n flexDirection: \"row\",\r\n border: \"none\",\r\n cursor: \"default\",\r\n outline: \"none\",\r\n padding: \"0\",\r\n whiteSpace: \"nowrap\",\r\n alignItems: \"center\",\r\n verticalAlign: \"middle\",\r\n textDecoration: \"none\",\r\n justifyContent: \"center\",\r\n },\r\n [classesName?.chip_contain]: {\r\n display: cssObject?.display?.flex,\r\n width: cssObject?.size?.full,\r\n height: cssObject?.size?.full,\r\n justifyContent: \"center\",\r\n alignItems: \"center\",\r\n textAlign: \"center\",\r\n verticalAlign: \"middle\",\r\n margin: cssObject.spacing?.auto,\r\n padding: cssObject.spacing?.auto,\r\n position: cssObject.position?.absolute,\r\n top: \"0\",\r\n left: \"0\",\r\n zIndex: \"var(--cbmis-z-index-1)\",\r\n color: cssObject?.color?.currentColor,\r\n },\r\n },\r\n });\r\n\r\n const styleSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.chip]: (props) => {\r\n return{\r\n borderRadius: cssObject?.border?.[cssKeys?.rounded]?.lg,\r\n margin: cssObject.spacing?.[cssKeys?.xs],\r\n padding: `0 ${cssObject.spacing?.[cssKeys?.xs]}`,\r\n color:String(props?.mode).toLowerCase() === \"outlined\"?cssObject?.color?.[cssKeys?.bodyColor] : cssObject?.color?.[cssKeys?.light],\r\n border: String(props.mode).toLowerCase() !==\"outlined\"?\"none\": `${cssObject?.size?.[cssKeys?.border_xs]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.[cssKeys?.currentColor])}`,\r\n width: \"fitContent\",\r\n backgroundColor:String(props?.mode).toLowerCase() === \"outlined\"?\"transpose\": styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.[cssKeys?.bodyColorBgDark]),\r\n height: cssObject.size?.[cssKeys?.[`item_${props?.size}`]] || cssObject.size?.[cssKeys?.item_sm],\r\n fontSize: \"12px\" || cssObject?.text.size?.[cssKeys?.[props?.size]] || cssObject?.text.size?.[cssKeys?.sm],\r\n \r\n }\r\n },\r\n [classesName.sx]: (props) => {\r\n return {...props?.sx}\r\n },\r\n },\r\n });\r\n\r\n\r\n return{\r\n classesName,\r\n style,\r\n styleSx,\r\n }\r\n}","import { StyleBuilder } from \"@cbmisorg/styles\";\r\n\r\nexport const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n cbmis_counter: {\r\n font: \"700 50px 'Source Code Pro', monospace\",\r\n display: \"block\",\r\n textAlign: \"center\",\r\n },\r\n },\r\n});\r\n\r\nexport const styleSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n cbmis_counter_sx: (props) => {\r\n return props?.sx;\r\n },\r\n },\r\n});\r\n","import React, { forwardRef, useEffect, useState } from \"react\";\r\nimport { styleFunction } from \"@cbmisorg/styles\";\r\nimport { style, styleSx } from \"./CounterStyle\";\r\n\r\nconst Counter = forwardRef((props,ref) =>{\r\n const { intCount=100, intStep=1, intSeconds = 1, sx, blnCountdown, hidden, disabled, dir, className, ...rest } = props;\r\n const classes = style();\r\n const classesSx = styleSx(props);\r\n const count = parseInt(intCount) || 100;\r\n const [counterState, setCounterState] = useState(blnCountdown?count:0);\r\n\r\n const getRestProps = () => {\r\n const newRest = styleFunction.filterPaddingAndMargin(rest);\r\n return { ...newRest };\r\n };\r\n\r\n useEffect(() => {}, [count,sx, blnCountdown, hidden, disabled, dir, className]);\r\n\r\n useEffect(() => {\r\n let myInterval = setInterval(() => {\r\n if(blnCountdown && counterState !==0 ){\r\n setCounterState(counterState - intStep)\r\n }else if(!blnCountdown && counterState < count ){\r\n setCounterState(counterState + intStep)\r\n }\r\n }, intSeconds * 1000)\r\n return () => {\r\n clearInterval(myInterval)\r\n }\r\n });\r\n\r\n return (\r\n {label || props?.children}
\r\n {endAvatar? (\r\n \r\n \r\n
\r\n )\r\n});\r\n\r\nexport default ModalContainer;\r\n","import React, { forwardRef, useContext, useId } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport ModalStyle from \"./ModalStyle\";\r\nimport ErrorBoundary from \"../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary\";\r\nimport ModalContainer from \"./ModalContainer\";\r\n\r\nconst Modal = forwardRef((/**@type {any}*/props, ref) => {\r\n const { open } = props;\r\n \r\n return open ? (\r\n \r\n
\r\n \r\n \r\n {React.Children.map(props.children, child => React.cloneElement(child, { handleClose: eventClose }) )}\r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n );\r\n});\r\n\r\nexport default ModalHeader;\r\n","import React, { forwardRef, useContext } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport ErrorBoundary from \"../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary\";\r\nimport ModalStyle from \"./ModalStyle\";\r\n\r\nconst ModalBody = forwardRef((/**@type {any}*/props, ref) => {\r\n const { sx, hidden, disabled, dir, className,handleClose=null, ...rest } = props;\r\n const theTheme = useContext(ContextThemeProvider);\r\n const {classesName, style, styleModalBodySx} = ModalStyle(theTheme);\r\n const classes = style();\r\n const classesSx = styleModalBodySx({ sx });\r\n\r\n const itemClasses = styleFunction.getClassName(classes?.[classesName?.modal_body], classesSx?.[classesName?.sx], styleFunction.CheckDirectionItem(dir),styleFunction.CheckDisabledItem(disabled), styleFunction.CheckHiddenItem(hidden),styleFunction.checkExistsMargin(rest),styleFunction.checkExistsPadding(rest), className);\r\n\r\n\r\n return (\r\n {props.children}
\r\n \r\n {props.children} \r\n
\r\n );\r\n});\r\n\r\nexport default ModalFooter;\r\n","import React, { forwardRef, useContext } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport TypographyStyle from \"./TypographyStyle\";\r\nimport ErrorBoundary from \"../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary\";\r\n\r\nconst Typography = forwardRef((/**@type {any}*/props, ref) => {\r\n const { as, color, sx, hidden, disabled, dir, className, ...rest } = props;\r\n const theTheme = useContext(ContextThemeProvider);\r\n const {classesName, style, styleSx} = TypographyStyle(theTheme);\r\n const classes = style();\r\n const classesSx = styleSx({as, color, sx});\r\n\r\n const itemClasses = styleFunction.getClassName(classes?.[classesName?.typography], classesSx?.[classesName?.sx], styleFunction.CheckDirectionItem(dir),styleFunction.CheckDisabledItem(disabled), styleFunction.CheckHiddenItem(hidden),styleFunction.checkExistsMargin(rest),styleFunction.checkExistsPadding(rest), className);\r\n\r\n return (\r\n \r\n {props.children} \r\n
\r\n );\r\n});\r\n\r\nexport default Typography;\r\n","import {\r\n StyleBuilder,\r\n styleVariables,\r\n cssKeys,\r\n mainTheme,\r\n styleFunction,\r\n} from \"@cbmisorg/styles\";\r\n\r\nexport default(objThemeInfo)=>{\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n\r\n const classesName = {\r\n typography: `${styleVariables?.prefixDefaultClassName}_typography`,\r\n sx:`${styleVariables?.prefixDefaultClassName}_typography_sx`\r\n }\r\n\r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.typography]: {\r\n display: cssObject?.display?.[cssKeys?.block],\r\n margin: 0,\r\n padding: 0,\r\n whiteSpace: cssObject?.whiteSpace?.[cssKeys?.breakSpaces],\r\n textAlign: cssObject?.side?.[cssKeys?.start],\r\n color: cssObject?.color?.[cssKeys?.bodyColor],\r\n },\r\n },\r\n });\r\n\r\n const styleSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.sx]: (props) => {\r\n return {\r\n ...getFontSizeAsReturnValue(props?.as),\r\n ...props?.sx,\r\n color: styleFunction.checkColorReturnValue(props?.color || props?.sx?.color || \"currentColor\"),\r\n \r\n };\r\n },\r\n }\r\n });\r\n\r\n\r\n const getFontSizeAsReturnValue = (as=\"body1\") => {\r\n const getSize = String(as).toLowerCase();\r\n switch (getSize) {\r\n case \"h1\":\r\n return {\r\n fontSize: cssObject?.text?.size?.[cssKeys?.h1],\r\n fontWeight: cssObject?.text?.fontWeight?.[cssKeys?.fontWeight_xl],\r\n };\r\n case \"h2\":\r\n return {\r\n fontSize: cssObject?.text?.size?.[cssKeys?.h2],\r\n fontWeight: cssObject?.text?.fontWeight?.[cssKeys?.fontWeight_xl],\r\n };\r\n case \"h3\":\r\n return {\r\n fontSize: cssObject?.text?.size?.[cssKeys?.h3],\r\n fontWeight: cssObject?.text?.fontWeight?.[cssKeys?.fontWeight_xl],\r\n };\r\n case \"h4\":\r\n return {\r\n fontSize: cssObject?.text?.size?.[cssKeys?.h4],\r\n fontWeight: cssObject?.text?.fontWeight?.[cssKeys?.fontWeight_lg],\r\n };\r\n case \"h5\":\r\n return {\r\n fontSize: cssObject?.text?.size?.[cssKeys?.h5],\r\n fontWeight: cssObject?.text?.fontWeight?.[cssKeys?.fontWeight_lg],\r\n };\r\n case \"h6\":\r\n return {\r\n fontSize: cssObject?.text?.size?.[cssKeys?.h6],\r\n fontWeight: cssObject?.text?.fontWeight?.[cssKeys?.fontWeight_lg],\r\n };\r\n case \"subtitle1\":\r\n return {\r\n fontSize: cssObject?.text?.size?.[cssKeys?.subtitle1],\r\n fontWeight: cssObject?.text?.fontWeight?.[cssKeys?.fontWeight_md],\r\n };\r\n case \"subtitle2\":\r\n return {\r\n fontSize: cssObject?.text?.size?.[cssKeys?.subtitle2],\r\n fontWeight: cssObject?.text?.fontWeight?.[cssKeys?.fontWeight_md],\r\n };\r\n case \"subtitle3\":\r\n return {\r\n fontSize: cssObject?.text?.size?.[cssKeys?.subtitle3],\r\n fontWeight: cssObject?.text?.fontWeight?.[cssKeys?.fontWeight_md],\r\n };\r\n case \"body1\":\r\n return {\r\n fontSize: cssObject?.text?.size?.[cssKeys?.body1],\r\n fontWeight: cssObject?.text?.fontWeight?.[cssKeys?.fontWeight_xs],\r\n };\r\n case \"body2\":\r\n return {\r\n fontSize: cssObject?.text?.size?.[cssKeys?.body2],\r\n fontWeight: cssObject?.text?.fontWeight?.[cssKeys?.fontWeight_xs],\r\n };\r\n case \"body3\":\r\n return {\r\n fontSize: cssObject?.text?.size?.[cssKeys?.body3],\r\n fontWeight: cssObject?.text?.fontWeight?.[cssKeys?.fontWeight_xs],\r\n };\r\n case \"caption\":\r\n return {\r\n fontSize: cssObject?.text?.size?.[cssKeys?.caption],\r\n fontWeight: cssObject?.text?.fontWeight?.[cssKeys?.fontWeight_xs],\r\n };\r\n case \"overline\":\r\n return {\r\n fontSize:cssObject?.text?.size?.[cssKeys?.overline],\r\n fontWeight: cssObject?.text?.fontWeight?.[cssKeys?.fontWeight_fontWeight_2xs],\r\n letterSpacing: cssObject?.spacing?.[cssKeys?.xs],\r\n textTransform: cssObject?.text?.[cssKeys?.transform]?.uppercase,\r\n };\r\n default:\r\n return {\r\n fontSize: cssObject?.text?.size?.[cssKeys?.body1],\r\n fontWeight: cssObject?.text?.fontWeight?.[cssKeys?.fontWeight_sm],\r\n };\r\n }\r\n };\r\n\r\n return{\r\n classesName,\r\n style,\r\n styleSx,\r\n }\r\n}"," import {\r\n StyleBuilder,\r\n styleVariables,\r\n cssKeys,\r\n mainTheme,\r\n styleFunction,\r\n } from \"@cbmisorg/styles\";\r\n\r\n export default(objThemeInfo)=>{\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n\r\n const classesName = {\r\n table_contenter: `${styleVariables?.prefixDefaultClassName}_table_contenter`,\r\n mobile_mode_contenter: `${styleVariables?.prefixDefaultClassName}_mobile_mode_contenter`,\r\n table: `${styleVariables?.prefixDefaultClassName}_table`,\r\n table_head: `${styleVariables?.prefixDefaultClassName}_table_head`,\r\n table_body: `${styleVariables?.prefixDefaultClassName}_table_body`,\r\n table_footer: `${styleVariables?.prefixDefaultClassName}_table_footer`,\r\n table_row: `${styleVariables?.prefixDefaultClassName}_table_row`,\r\n table_cell: `${styleVariables?.prefixDefaultClassName}_table_cell`,\r\n\r\n sx:`${styleVariables?.prefixDefaultClassName}_table_sx`\r\n }\r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.table_contenter]:{\r\n display:\"block\",\r\n maxHeight: \"100%\",\r\n position: \"relative\",\r\n margin: \"auto\",\r\n width: \"100%\",\r\n overflow:\"auto\"\r\n },\r\n [classesName?.mobile_mode_contenter]:{\r\n maxHeight: \"95%\",\r\n position: \"relative\",\r\n margin: \"auto\",\r\n width: \"99%\",\r\n },\r\n [classesName?.table]:{\r\n width: \"max-content\",\r\n minWidth:\"100%\",\r\n borderCollapse: \"collapse\",\r\n padding: \"0px\",\r\n margin: \"auto\",\r\n textAlign: \"center\",\r\n tableLayout:\"auto\",\r\n borderSpacing: \"0px\",\r\n position: \"relative\",\r\n border:\"none\",\r\n outline:\"none\",\r\n\r\n [`.${classesName?.table_head}`]:{\r\n position: \"sticky\",\r\n top: \"0px\",\r\n },\r\n [`.${classesName?.table_footer}`]:{\r\n position: \"sticky\",\r\n top: \"0px\",\r\n },\r\n },\r\n [classesName?.table_head]:{\r\n [`.${classesName?.table_cell}`]:{\r\n fontWeight: cssObject?.fontWeight?.[cssKeys?.fontWeight_md],\r\n }\r\n },\r\n [classesName?.table_footer]:{\r\n [`.${classesName?.table_cell}`]:{\r\n fontWeight: cssObject?.fontWeight?.[cssKeys?.fontWeight_md],\r\n }\r\n }\r\n },\r\n });\r\n\r\n const styleTableSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.table]:{\r\n borderRadius: cssObject?.border?.[cssKeys?.rounded]?.xs,\r\n [`.${classesName?.table_body}`]:{\r\n [`.${classesName?.table_row}`]:{\r\n background: cssObject?.color?.white,\r\n borderBottom: `1px ${cssObject?.border?.[cssKeys?.border]?.solid} ${styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.borderColor])}`,\r\n padding: cssObject?.spacing?.[cssKeys?.sm],\r\n },\r\n },\r\n [`.${classesName?.table_cell}`]:{\r\n padding:cssObject?.spacing?.[cssKeys?.sm],\r\n height: cssObject?.size?.baseSize,\r\n // border: `${cssObject?.size?.[cssKeys?.border_xs]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.borderColor])}`,\r\n fontSize: cssObject?.text?.size?.[cssKeys?.body1],\r\n fontWeight: cssObject?.fontWeight?.[cssKeys?.fontWeight_sm],\r\n textAlign: \"center\",\r\n }\r\n },\r\n [classesName?.sx]: (props) => {\r\n return {\r\n ...props?.sx,\r\n color: styleFunction.checkColorReturnValue(props?.color || props?.sx?.color || cssObject?.color?.[cssKeys?.bodyColor]),\r\n\r\n };\r\n },\r\n },\r\n });\r\n\r\n const styleTableRowSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.sx]: (props) => {\r\n return props?.sx;\r\n },\r\n },\r\n });\r\n\r\n const styleTableHeadSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.table_head]:{\r\n [`.${classesName?.table_row}`]:{\r\n fontWeight: cssObject?.text?.fontWeight?.[cssKeys?.fontWeight_md],\r\n background: cssObject?.color?.bodyColorBgLight,\r\n },\r\n },\r\n [classesName?.sx]: (props) => {\r\n return props?.sx;\r\n },\r\n },\r\n });\r\n\r\n const styleTableBodySx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.sx]: (props) => {\r\n return props?.sx;\r\n },\r\n },\r\n });\r\n\r\n const styleTableCellSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.sx]: (props) => {\r\n return props?.sx;\r\n },\r\n },\r\n });\r\n\r\n const styleTableFooterSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.table_footer]:{\r\n [`.${classesName?.table_cell}`]:{\r\n fontWeight: cssObject?.fontWeight?.[cssKeys?.fontWeight_md],\r\n }\r\n },\r\n [classesName?.sx]: (props) => {\r\n return props?.sx;\r\n },\r\n },\r\n });\r\n\r\n return{\r\n classesName,\r\n style,\r\n styleTableSx,\r\n styleTableRowSx,\r\n styleTableHeadSx,\r\n styleTableBodySx,\r\n styleTableCellSx,\r\n styleTableFooterSx\r\n }\r\n }","import React, { forwardRef, useContext, useId } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport ErrorBoundary from \"../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary\";\r\nimport TableStyle from \"./TableStyle\";\r\n\r\nconst Table = forwardRef((/**@type {any}*/props,ref) => {\r\n const { blnMobileMode, sx, id, hidden, disabled, dir, className, ...rest } = props;\r\n const theTheme = useContext(ContextThemeProvider);\r\n const {classesName, style, styleTableSx} = TableStyle(theTheme);\r\n const classes = style();\r\n const classesSx = styleTableSx({sx, blnMobileMode:blnMobileMode});\r\n const comID = id || String(useId()).slice(1,-1)\r\n\r\n const itemClasses = styleFunction.getClassName( classes?.[classesName?.table], classesSx?.[classesName?.table], classesSx?.[classesName?.sx], styleFunction.CheckDirectionItem(dir),styleFunction.CheckDisabledItem(disabled), styleFunction.CheckHiddenItem(hidden),styleFunction.checkExistsMargin(rest),styleFunction.checkExistsPadding(rest), className);\r\n\r\n return (\r\n \r\n \r\n
\r\n
\r\n );\r\n});\r\n\r\nexport default Table;\r\n","import React, { forwardRef, useContext, useId } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport TableStyle from \"./TableStyle\";\r\nimport ErrorBoundary from \"../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary\";\r\n\r\nconst TableHead= forwardRef((/**@type {any}*/props,ref) =>{\r\n const { sx,id, hidden, disabled, dir, className, ...rest } = props;\r\n const theTheme = useContext(ContextThemeProvider);\r\n const {classesName, style, styleTableHeadSx} = TableStyle(theTheme);\r\n const classes = style();\r\n const classesSx = styleTableHeadSx({sx});\r\n const comID = id || String(useId()).slice(1,-1)\r\n\r\n const itemClasses = styleFunction.getClassName(classes?.[classesName?.table_head], classesSx?.[classesName?.table_head], classesSx?.[classesName?.sx], styleFunction.CheckDirectionItem(dir),styleFunction.CheckDisabledItem(disabled), styleFunction.CheckHiddenItem(hidden),styleFunction.checkExistsMargin(rest),styleFunction.checkExistsPadding(rest), className);\r\n\r\n return (\r\n \r\n \r\n
\r\n );\r\n});\r\n\r\nexport default Note;\r\n","import { StyleBuilder, styleVariables, cssKeys, mainTheme, styleFunction } from \"@cbmisorg/styles\";\r\n\r\nexport default (objThemeInfo) => {\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n\r\n const classesName = {\r\n note: `${styleVariables?.prefixDefaultClassName}_note`,\r\n note_icon: `${styleVariables?.prefixDefaultClassName}_note_icon`,\r\n note_content: `${styleVariables?.prefixDefaultClassName}_note_content`,\r\n\r\n sx: `${styleVariables?.prefixDefaultClassName}_note_sx`,\r\n };\r\n\r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.note]: {\r\n display: \"flex\",\r\n position: \"relative\",\r\n width: cssObject?.size?.[cssKeys?.full],\r\n maxWidth: cssObject?.size?.[cssKeys?.full],\r\n textAlign: \"start\",\r\n justifyContent:\"flex-start\",\r\n alignItems:\"center\",\r\n },\r\n [classesName?.note_icon]: {\r\n display: \"inline-block\",\r\n position: \"relative\",\r\n fontSize: cssObject?.text?.size?.[cssKeys?.h6],\r\n width: \"max-content\",\r\n margin:0,\r\n\r\n },\r\n [classesName?.note_content]: {\r\n display: \"inline-block\",\r\n position: \"relative\",\r\n width: \"max-content\",\r\n maxWidth: \"90%\",\r\n fontSize: cssObject?.text?.size?.[cssKeys?.body2],\r\n color: styleFunction.checkColorReturnValue(cssObject?.color?.bodyColor),\r\n paddingInline: cssObject?.spacing?.[cssKeys?.sm],\r\n margin:0,\r\n\r\n\r\n },\r\n },\r\n });\r\n\r\n const styleSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.sx]: (props) => {\r\n return {\r\n fontSize: cssObject?.text?.size?.body2,\r\n padding: cssObject?.spacing?.[cssKeys?.sm],\r\n margin: `${cssObject?.spacing?.[cssKeys?.sm]} auto`,\r\n borderRadius: cssObject?.border?.[cssKeys?.rounded]?.md,\r\n color: styleFunction.checkColorReturnValue(props?.mode || cssObject?.color?.bodyColor),\r\n border: `${cssObject?.size?.[cssKeys?.px]} ${cssObject?.border?.[cssKeys?.border]?.dashed} ${styleFunction.checkColorReturnValue(props?.mode|| cssObject?.color?.bodyColor)}`,\r\n background: cssObject?.color?.[cssKeys?.transparent],\r\n ...props?.sx,\r\n };\r\n },\r\n },\r\n });\r\n\r\n return {\r\n classesName,\r\n style,\r\n styleSx,\r\n };\r\n};\r\n","import React, { forwardRef, useContext, useState } from 'react'\r\nimport { styleFunction, ContextThemeProvider } from '@cbmisorg/styles';\r\nimport ButtonStyle from './ButtonStyle';\r\nimport { Icon } from '@cbmisorg/icons';\r\n\r\nconst Button = forwardRef((/**@type {any}*/props, ref) => {\r\n const theTheme = useContext(ContextThemeProvider);\r\n const {classesName, style, styleSx, btnIconSize} = ButtonStyle(theTheme);\r\n const {label, color, size, icon, iconSize, endIcon, iconColor, mode, sx, hidden, disabled, dir, className, id, ...rest}= props\r\n const classes = style();\r\n const classesSx = styleSx({sx, color, size, icon, mode});\r\n const itemClasses = styleFunction.getClassName(classes?.[classesName?.button], classesSx?.[classesName?.sx], styleFunction.CheckDirectionItem(dir),styleFunction.CheckDisabledItem(disabled), styleFunction.CheckHiddenItem(hidden),styleFunction.checkExistsMargin(rest),styleFunction.checkExistsPadding(rest), className);\r\n\r\n\r\n return (\r\n \r\n )\r\n})\r\n\r\nexport default Button","import { StyleBuilder, styleVariables, cssKeys, mainTheme, styleFunction } from \"@cbmisorg/styles\";\r\n\r\nexport default (objThemeInfo) => {\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n\r\n const classesName = {\r\n button_container: `${styleVariables?.prefixDefaultClassName}_button_container`,\r\n button: `${styleVariables?.prefixDefaultClassName}_button`,\r\n btn_icon: `${styleVariables?.prefixDefaultClassName}_btn_icon`,\r\n btn_label: `${styleVariables?.prefixDefaultClassName}_btn_label`,\r\n sxContainer: `${styleVariables?.prefixDefaultClassName}_btn_container_sx`,\r\n sx: `${styleVariables?.prefixDefaultClassName}_btn_sx`,\r\n };\r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.button]: {\r\n position: \"relative\",\r\n width: \"auto\",\r\n height: \"fit-content\",\r\n minHeight: cssObject?.size?.[cssKeys?.item_sm],\r\n fontWeight: cssObject?.fontWeight?.[cssKeys?.fontWeight_md],\r\n fontSize: cssObject?.text?.size?.body1,\r\n letterSpacing: \"0.02857em\",\r\n textTransform: \"capitalize\",\r\n textAlign: \"center\",\r\n outline: \"none\",\r\n display: \"flex\",\r\n justifyContent: \"center\",\r\n alignItems: \"center\",\r\n flexWrap: \"inherit\",\r\n margin: `${cssObject?.spacing?.[cssKeys?.xs]} ${cssObject?.spacing?.[cssKeys?.auto]}`,\r\n cursor: \"pointer\",\r\n transition: \"all .5s ease\",\r\n boxSizing: cssObject?.boxSizing?.[cssKeys?.borderBox],\r\n border: `${cssObject?.size?.[cssKeys?.border_sm]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${cssObject?.color?.[cssKeys?.transparent]}`,\r\n whiteSpace: \"nowrap\",\r\n overflow: \"hidden\",\r\n textOverflow: \"ellipsis\",\r\n },\r\n [classesName?.btn_icon]: {\r\n display: \"flex\",\r\n flexDirection: \"column\",\r\n alignItems: \"center\",\r\n justifyContent: \"center\",\r\n position: \"relative\",\r\n color: cssObject?.color?.[cssKeys?.currentColor],\r\n },\r\n [classesName?.btn_label]: {\r\n cursor: \"pointer\",\r\n color: cssObject?.color?.[cssKeys?.currentColor],\r\n padding: `0 ${cssObject?.spacing?.[cssKeys?.xs]}`,\r\n margin: \"auto\",\r\n },\r\n },\r\n });\r\n\r\n const styleSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.sx]: (props) => {\r\n return {\r\n borderRadius: cssObject?.border?.[cssKeys?.rounded]?.xs,\r\n lineHeight: `${cssObject?.spacing?.[cssKeys?.xs]}`,\r\n ...btnStyleClass(props),\r\n ...btnSize(props),\r\n ...props?.sx,\r\n };\r\n },\r\n },\r\n });\r\n\r\n const defaultStyle = (props) => {\r\n return {\r\n color: props?.color === \"light\" || props?.color === \"#fff\" || props?.color === \"transparent\" ? \"dark\" : \"#fff\",\r\n background: styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.primary),\r\n \"&active\": {\r\n boxShadow: cssObject?.boxShadow?.[cssKeys?.lg],\r\n },\r\n \"&hover\": {\r\n boxShadow: cssObject?.boxShadow?.[cssKeys?.lg],\r\n opacity: 0.9,\r\n },\r\n };\r\n };\r\n const btnStyleClass = (props) => {\r\n const getStyle = String(props?.mode).toLowerCase();\r\n switch (getStyle) {\r\n case \"outlined\":\r\n return {\r\n color: styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.primary),\r\n border: `${cssObject?.size?.[cssKeys?.border_sm]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.primary)}`,\r\n background: cssObject?.color?.[cssKeys?.transparent],\r\n \"&active\": {\r\n boxShadow: cssObject?.boxShadow?.[cssKeys?.lg],\r\n },\r\n \"&hover\": {\r\n boxShadow: cssObject?.boxShadow?.[cssKeys?.lg],\r\n },\r\n };\r\n case \"contained\":\r\n return defaultStyle(props);\r\n case \"link\":\r\n return {\r\n color: styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.primary),\r\n border: `${cssObject?.size?.[cssKeys?.border_sm]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${cssObject?.color?.[cssKeys?.transparent]}`,\r\n background: cssObject?.color?.[cssKeys?.transparent],\r\n \"&active\": {\r\n boxShadow: cssObject?.boxShadow?.[cssKeys?.inner],\r\n },\r\n \"&hover\": {\r\n boxShadow: cssObject?.boxShadow?.[cssKeys?.shadow],\r\n },\r\n };\r\n default:\r\n return defaultStyle(props);\r\n }\r\n };\r\n\r\n const btnSize = (props) => {\r\n const getSize = String(props?.size).toLowerCase();\r\n switch (getSize) {\r\n case \"sm\":\r\n return {\r\n padding: cssObject?.spacing?.[cssKeys?.sm],\r\n fontSize: cssObject?.text?.size?.body3,\r\n \".cbmis_icon_container_in_btn\": {\r\n padding: 0,\r\n margin: 0,\r\n },\r\n };\r\n case \"md\":\r\n return {\r\n padding: `${cssObject?.spacing?.[cssKeys?.md]} ${cssObject?.spacing?.[cssKeys?.lg]}`,\r\n fontSize: cssObject?.text?.size?.body2,\r\n \".cbmis_icon_container_in_btn\": {\r\n fontSize: cssObject?.text?.size?.body2,\r\n },\r\n };\r\n case \"lg\":\r\n return {\r\n padding: `${cssObject?.spacing?.[cssKeys?.lg]} ${cssObject?.spacing?.[cssKeys?.xl]}`,\r\n fontSize: cssObject?.text?.size?.body1,\r\n \".cbmis_icon_container_in_btn\": {\r\n fontSize: cssObject?.text?.size?.body1,\r\n },\r\n };\r\n default:\r\n return {\r\n padding: `${cssObject?.spacing?.[cssKeys?.md]} ${cssObject?.spacing?.[cssKeys?.lg]}`,\r\n fontSize: cssObject?.text?.size?.body1,\r\n \".cbmis_icon_container_in_btn\": {\r\n fontSize: cssObject?.text?.size?.body1,\r\n },\r\n };\r\n }\r\n };\r\n\r\n const btnIconSize = (size, iconSize = null) => {\r\n if (iconSize) {\r\n return iconSize;\r\n } else {\r\n const getSize = String(size).toLowerCase();\r\n switch (getSize) {\r\n case \"sm\":\r\n return cssObject?.text?.size?.body3;\r\n case \"md\":\r\n return cssObject?.text?.size?.body3;\r\n case \"lg\":\r\n return cssObject?.text?.size?.body1;\r\n default:\r\n return cssObject?.text?.size?.body1;\r\n }\r\n }\r\n };\r\n\r\n return {\r\n classesName,\r\n style,\r\n styleSx,\r\n btnIconSize,\r\n };\r\n};\r\n","import { ContextThemeProvider, StyleBuilder, cssKeys, mainTheme, styleFunction, styleVariables } from \"@cbmisorg/styles\";\r\nimport React, { useContext } from \"react\";\r\n\r\nconst className = `${styleVariables?.prefixDefaultClassName}_error_message`\r\nconst errorMsgStyle=(objThemeInfo)=>{\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n\r\n const style = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [className]:(props)=>{\r\n return{\r\n fontSize: cssObject?.text?.size?.[cssKeys?.caption],\r\n padding: `${cssObject?.spacing?.[cssKeys?.px]} ${cssObject?.spacing?.[cssKeys?.sm]}`,\r\n display:\"block\",\r\n position:\"relative\",\r\n width:\"max-content\",\r\n textAlign:\"start\",\r\n margin:0,\r\n color: styleFunction.checkColorReturnValue(props?.blnError?\"error\": \"currentColor\"),\r\n\r\n }\r\n },\r\n }\r\n });\r\n\r\n return {style}\r\n}\r\n\r\nconst ErrorMessage = (props) => {\r\n const { message=null, rest } = props;\r\n if(message){\r\n return \r\n
\r\n \r\n {props.children} \r\n
\r\n \r\n {!label ? null : }\r\n {lstOptions?.map((opt, index) => {\r\n const blnChecked = funOptValue(opt);\r\n\r\n return (\r\n \r\n );\r\n })}\r\n
\r\n );\r\n };\r\n useEffect(() => {}, [currentLang, label, options, children, display, color, mode, sx, hidden, disabled, dir, className, value, defaultValue, id, errorMessage, helperMessage, blnMenuInputList]);\r\n return (\r\n \r\n {!headItem ?null:
\r\n )\r\n});\r\n\r\nexport default MenuItem ","import React, { forwardRef, useContext, useEffect, useId, useRef, useState } from \"react\";\r\nimport { ContextThemeProvider, cssKeys, mainTheme, styleFunction } from \"@cbmisorg/styles\";\r\nimport { Icon } from \"@cbmisorg/icons\";\r\nimport GroupFieldStyle from \"./GroupFieldStyle\";\r\nimport ErrorMessage from \"../ErrorMessage/ErrorMessage\";\r\nimport Typography from \"../../dataDisplay/Typography/Typography\";\r\nimport Menu from \"../../navigation/Menu/Menu\";\r\nimport MenuItem from \"../../navigation/Menu/MenuItem\";\r\nimport Button from \"../Button/Button\";\r\nimport { checkParseObject } from \"../../_helper/functions\";\r\n\r\nconst GroupField = forwardRef((/**@type {any}*/ props, ref) => {\r\n const {\r\n id,\r\n label,\r\n placeholder,\r\n errorMessage = null,\r\n helperMessage,\r\n icon,\r\n adornment,\r\n endIcon,\r\n endAdornment,\r\n mode,\r\n color,\r\n iconColor,\r\n iconSize,\r\n type = \"text\",\r\n value,\r\n defaultValue,\r\n inputDir,\r\n endIconRest = {},\r\n endComponent, // to use in other inputs\r\n onFocus,\r\n onBlur,\r\n onChange,\r\n optionLang = null,\r\n currentLang = \"eng\",\r\n defaultLang = \"eng\",\r\n setCurrentLang, // FORM API\r\n sx,\r\n hidden,\r\n disabled,\r\n dir,\r\n className,\r\n MenuList = null,\r\n ...rest\r\n } = props;\r\n // endIconRest,endComponent, // to use in other inputs\r\n const inputRef = useRef(null);\r\n const theTheme = useContext(ContextThemeProvider);\r\n const { classesName, style, styleSx } = GroupFieldStyle(theTheme);\r\n const classes = style();\r\n const classesSx = styleSx({ sx, color, mode, icon: icon? true: false, adornment, endIcon:endIcon? true: false, endAdornment, dir, inputDir, placeholder, errorMessage, type, menuList: MenuList ? true : false });\r\n const cssObject = theTheme?.cssObject || mainTheme?.cssObject;\r\n const comID = id || String(useId()).slice(1, -1) + \"text\";\r\n const itemClassesContainer = styleFunction.getClassName(\r\n classes?.[classesName?.fieldset_comp_container],\r\n classesSx?.[classesName?.fieldset_comp_container],\r\n styleFunction.CheckDirectionItem(dir),\r\n styleFunction.CheckDisabledItem(disabled),\r\n styleFunction.CheckHiddenItem(hidden),\r\n styleFunction.checkExistsMargin(rest),\r\n styleFunction.checkExistsPadding(rest),\r\n className\r\n );\r\n const itemClasses = styleFunction.getClassName(classes?.[classesName?.fieldset_input], classesSx?.[classesName?.fieldset_input], classesSx?.[classesName?.sx], classesSx?.[classesName?.inputValid]);\r\n const ref_item_container = useRef(null);\r\n const ref_input_action_color = useRef(styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.currentColor]));\r\n\r\n let checkValue = checkParseObject(value || defaultValue);\r\n checkValue = Object?.keys(checkValue)?.length ? checkValue : value || defaultValue || \"\";\r\n\r\n const [initialState, setInitialState] = useState({\r\n currentLangSelected:currentLang || defaultLang,\r\n optionLang: optionLang || {},\r\n openLangMenu: false,\r\n blnIsFull: false,\r\n });\r\n\r\n const handleFocus = (event) => {\r\n ref_item_container.current.style.color = styleFunction.checkColorReturnValue(color ? color :cssObject?.color?.[cssKeys?.primary]);\r\n ref_input_action_color.current = styleFunction.checkColorReturnValue(color ? color : cssObject?.color?.[cssKeys?.primary]);\r\n if (errorMessage) {\r\n ref_item_container.current.style.color = styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.error]);\r\n }\r\n if (onFocus) {\r\n onFocus(event);\r\n }\r\n };\r\n const handleBlur = (event) => {\r\n ref_item_container.current.style.color = styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.borderColor]);\r\n ref_input_action_color.current = styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.borderColor]);\r\n\r\n if (errorMessage) {\r\n ref_item_container.current.style.color = styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.error]);\r\n }\r\n if (onBlur) {\r\n onBlur(event);\r\n }\r\n };\r\n\r\n const handleChange = (event) => {\r\n ref_item_container.current.style.color = styleFunction.checkColorReturnValue(color ? color :cssObject?.color?.[cssKeys?.primary]);\r\n ref_input_action_color.current = styleFunction.checkColorReturnValue(color ? color : cssObject?.color?.[cssKeys?.primary]);\r\n if (errorMessage) {\r\n ref_item_container.current.style.color = styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.error]);\r\n }\r\n ref_item_container.current.style.boxShadow = cssObject?.boxShadow?.input_box_shadow;\r\n if (onChange) {\r\n onChange(event);\r\n }\r\n };\r\n\r\n useEffect(() => {}, [\r\n id,\r\n label,\r\n placeholder,\r\n errorMessage,\r\n helperMessage,\r\n icon,\r\n adornment,\r\n endIcon,\r\n endAdornment,\r\n mode,\r\n color,\r\n iconColor,\r\n iconSize,\r\n type,\r\n inputDir,\r\n endIconRest,\r\n endComponent, // to use in other inputs\r\n onFocus,\r\n onBlur,\r\n onChange,\r\n optionLang,\r\n setCurrentLang, // FORM API\r\n sx,\r\n hidden,\r\n disabled,\r\n dir,\r\n className,\r\n MenuList,\r\n rest,\r\n ]);\r\n\r\n useEffect(() => {\r\n if (errorMessage) {\r\n ref_item_container.current.style.color = styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.error]);\r\n } else {\r\n ref_item_container.current.style.color = ref_input_action_color?.current;\r\n }\r\n }, [errorMessage, ref_input_action_color]);\r\n\r\n useEffect(() => {\r\n if (value || defaultValue) {\r\n inputRef.current.value = Array.isArray(checkValue)\r\n ? checkValue?.map((item) => (typeof item === \"object\" ? item?.[currentLang] || item?.[defaultLang] : item))\r\n : typeof checkValue?.[currentLang] !== \"undefined\"\r\n ? checkValue?.[currentLang]\r\n : String(checkValue);\r\n if (!inputRef.current.value && !optionLang?.[initialState?.currentLangSelected].blnIsMandatory && optionLang?.[initialState?.currentLangSelected].blnIsActive) {\r\n checkValue?.[defaultLang];\r\n }\r\n } else {\r\n inputRef.current.value = \"\";\r\n }\r\n }, [value, defaultValue, currentLang, defaultLang, ref]);\r\n\r\n useEffect(() => {\r\n if(currentLang !== initialState?.currentLangSelected) {\r\n initialState.currentLangSelected = currentLang;\r\n setInitialState({...initialState})\r\n }\r\n },[currentLang]);\r\n\r\n\r\n function openList() {\r\n initialState.openLangMenu = !initialState.openLangMenu;\r\n setInitialState({ ...initialState });\r\n }\r\n\r\n function closeList() {\r\n initialState.openLangMenu = false;\r\n setInitialState({ ...initialState });\r\n }\r\n\r\n const handleChangeLang = (lang) => ()=>{\r\n initialState.currentLangSelected = lang;\r\n initialState.openLangMenu = false;\r\n inputRef.current.value = checkValue?.[lang] || checkValue?.[defaultLang];\r\n // if(ref && ref?.current){\r\n // ref.current.value = inputRef.current.value\r\n // }\r\n setInitialState({ ...initialState });\r\n setCurrentLang(lang);\r\n };\r\n\r\n\r\n return (\r\n {headItem}
}\r\n \r\n {props.children}\r\n
\r\n {!footerItem?null:footerItem}
\r\n \r\n
\r\n ) : null}\r\n \r\n {!MenuList ? null : \r\n {!label ? null : }\r\n {lstOptions?.map((opt, index) => {\r\n const optValue = props?.blnMenuInputList\r\n ? value && typeof value === \"object\"\r\n ? checkParseObject(value)\r\n : defaultValue && typeof defaultValue === \"object\"\r\n ? checkParseObject(defaultValue)\r\n : value || defaultValue || {}\r\n : checkParseObject(value || defaultValue || {});\r\n\r\n return (\r\n \r\n );\r\n })}\r\n
\r\n );\r\n };\r\n\r\n useEffect(() => {}, [\r\n label,\r\n currentLang,\r\n options,\r\n children,\r\n display,\r\n color,\r\n sx,\r\n hidden,\r\n disabled,\r\n dir,\r\n value,\r\n defaultValue,\r\n className,\r\n id,\r\n filterValue,\r\n blnMenuInputList,\r\n errorMessage,\r\n helperMessage,\r\n ]);\r\n\r\n return (\r\n \r\n \r\n \r\n
\r\n );\r\n});\r\n\r\nexport default Rating;\r\n","import { StyleBuilder, styleVariables, cssKeys, mainTheme, styleFunction } from \"@cbmisorg/styles\";\r\n\r\nexport default (objThemeInfo) => {\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n\r\n const classesName = {\r\n rating_container: `${styleVariables?.prefixDefaultClassName}_rating_container`,\r\n rating: `${styleVariables?.prefixDefaultClassName}_rating`,\r\n label: `${styleVariables?.prefixDefaultClassName}_label`,\r\n rating_input: `${styleVariables?.prefixDefaultClassName}_rating_input`,\r\n star: `${styleVariables?.prefixDefaultClassName}_star`,\r\n sx: `${styleVariables?.prefixDefaultClassName}_rating_sx`,\r\n };\r\n\r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.rating_container]: {\r\n display: cssObject?.display?.[cssKeys?.block],\r\n boxSizing: cssObject?.boxSizing?.[cssKeys?.borderBox],\r\n position: cssObject?.position?.[cssKeys?.relative],\r\n margin: \"auto\",\r\n minHeight: \"max-content\",\r\n width: \"max-content\",\r\n maxWidth: cssObject?.size?.[cssKeys?.full],\r\n },\r\n [classesName?.label]: {\r\n display: \"flex\",\r\n alignItems: \"center\",\r\n fontWeight: \"600\",\r\n },\r\n [classesName.rating]: {\r\n display: \"cssObject?.display?.[cssKeys?.flex]\",\r\n flexWrap: \"nowrap\",\r\n alignItems: \"center\",\r\n justifyContent: \"space-around\",\r\n margin: `auto ${cssObject?.spacing?.[cssKeys?.sm]}`,\r\n overflow: \"hidden\",\r\n padding: 0,\r\n },\r\n [classesName.rating_input]: {\r\n opacity: 0,\r\n position: cssObject?.position?.[cssKeys?.relative],\r\n maxWidth: cssObject?.size?.[cssKeys?.px],\r\n margin: 0,\r\n padding: 0,\r\n },\r\n [classesName?.star]: {\r\n color: cssObject?.color?.[cssKeys?.bodyColor],\r\n textDecoration: \"none\",\r\n WebkitTransition: \" color .4s\",\r\n MozTransition: \" color .4s\",\r\n OTransition: \" color .4s\",\r\n transition: \" color .4s\",\r\n display: \"inline-flex\",\r\n },\r\n },\r\n });\r\n\r\n const styleSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.label]: {\r\n fontSize: cssObject?.text?.size?.[cssKeys?.subtitle3],\r\n textAlign: \"start\",\r\n maxWidth: \"fit-content\",\r\n margin: 0,\r\n },\r\n [classesName?.star]: (props) => {\r\n return {\r\n fontSize: cssObject?.text?.size?.[cssKeys?.h6],\r\n \"&hover\": props.readOnly\r\n ? null\r\n : {\r\n cursor: \"pointer\",\r\n opacity: 0.7,\r\n color: styleFunction.checkColorReturnValue(props?.color || props?.sx?.color || \"primary\"),\r\n },\r\n };\r\n },\r\n [classesName?.sx]: (props) => {\r\n return props?.sx;\r\n },\r\n },\r\n });\r\n\r\n return {\r\n classesName,\r\n style,\r\n styleSx,\r\n };\r\n};\r\n","import { ContextThemeProvider, styleFunction } from '@cbmisorg/styles';\r\nimport React, { useEffect, useRef } from 'react'\r\nimport { useContext } from 'react';\r\nimport { forwardRef } from 'react';\r\nimport { useId } from 'react';\r\nimport RangeSliderStyle from './RangeSliderStyle';\r\n\r\nconst RangeSlider = forwardRef((/**@type {any}*/props, ref) => {\r\n const {id,label,errorMessage,helperMessage,\r\n color,currentLang,readOnly,\r\n value,defaultValue, showMaxMin=true, showValue=true,\r\n min=0,max=100, step=1, thumb=true, gauge=\"%\",\r\n sx,hidden,disabled,dir,className,...rest} = props\r\n const comID = String(useId()).slice(1,-1) + \"checkbox\" || id;\r\n const theTheme = useContext(ContextThemeProvider);\r\n const {classesName, style, styleSx} = RangeSliderStyle(theTheme);\r\n const classes = style();\r\n const classesSx = styleSx({sx, color,thumb, showMaxMin, showValue, readOnly});\r\n const itemClasses = styleFunction.getClassName(classes?.[classesName?.range_slider],classesSx?.[classesName?.range_slider], classesSx?.[classesName?.sx], className);\r\n const containerClasses = styleFunction.getClassName(classes?.[classesName?.range_container], styleFunction.CheckDirectionItem(dir),styleFunction.CheckDisabledItem(disabled), styleFunction.CheckHiddenItem(hidden),styleFunction.checkExistsMargin(rest),styleFunction.checkExistsPadding(rest));\r\n\r\n const inputRef = useRef({})\r\n\r\n useEffect(()=>{\r\n // inputRef.current.value = value || defaultValue || 0\r\n // if(ref){\r\n // ref.current.value = value || defaultValue || 0\r\n // }\r\n // setInputValue({\r\n // ...inputValue,\r\n // value: ref?.current?.value || inputRef.current.value || 0,\r\n // })\r\n\r\n },[value, defaultValue])\r\n\r\n return (\r\n \r\n {label ? (\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n
\r\n \r\n {\r\n // !showValue?null:(\r\n //
\r\n )\r\n});\r\n\r\nexport default RangeSlider","import {\r\n StyleBuilder,\r\n styleVariables,\r\n cssKeys,\r\n mainTheme,\r\n styleFunction,\r\n} from \"@cbmisorg/styles\";\r\n\r\nexport default(objThemeInfo)=>{\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n const currentBaseSize = objThemeInfo?.currentBaseSize || mainTheme?.currentBaseSize;\r\n\r\n const classesName = {\r\n container: `${styleVariables?.prefixDefaultClassName}_container`,\r\n\r\n range_container: `${styleVariables?.prefixDefaultClassName}_range_container`,\r\n range_slider: `${styleVariables?.prefixDefaultClassName}_range_slider`,\r\n range_label: `${styleVariables?.prefixDefaultClassName}_range_label`,\r\n range_slider_min_max: `${styleVariables?.prefixDefaultClassName}_range_slider_min_max`,\r\n range_lider_tooltip: `${styleVariables?.prefixDefaultClassName}_range_lider_tooltip`,\r\n range_lider_tooltip_text: `${styleVariables?.prefixDefaultClassName}_range_lider_tooltip_text`,\r\n range_slider_value_output: `${styleVariables?.prefixDefaultClassName}_range_slider_value_output`,\r\n sx: `${styleVariables?.prefixDefaultClassName}_range_sx`,\r\n };\r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles:{\r\n [classesName?.range_container]:{\r\n position: \"relative\",\r\n width: \"100%\",\r\n display:\"block\",\r\n margin:0,\r\n padding:0,\r\n },\r\n [classesName?.range_slider]:{\r\n position: \"relative\",\r\n width: \"100%\",\r\n display:\"flex\",\r\n margin:0,\r\n padding:0,\r\n appearance:\"none\",\r\n WebkitAppearance:\"none\",\r\n MozAppearance:\"none\",\r\n background: \"none\",\r\n alignSelf: \"center\",\r\n cursor: \"grab\",\r\n\r\n \"&focus\":{\r\n boxShadow: \"none\",\r\n outline: \"none\",\r\n },\r\n \"&WebkitSliderRunnableTrack\":{\r\n content: '',\r\n pointerEvents: \"none\",\r\n width: \"100%\",\r\n overflow:\"hidden\",\r\n zIndex:0,\r\n },\r\n \"&WebkitSliderThumb\": {\r\n appearance:\"none\",\r\n WebkitAppearance:\"none\",\r\n MozAppearance:\"none\",\r\n // borderRadius: \"50%\",\r\n width:\"100px\",\r\n height:\"100px\",\r\n backgroundColor: \"currentColor\",\r\n zIndex:2,\r\n padding:0,\r\n },\r\n \"&MozRangeTrack\":{\r\n width: \"100%\",\r\n },\r\n \"&MozRangeThumb\":{\r\n cursor: \"grab\",\r\n borderRadius: \"50%\",\r\n position: \"relative\",\r\n padding:0,\r\n },\r\n \"&MozRangeProgress\": {\r\n border: 0,\r\n marginTop: 0,\r\n },\r\n },\r\n [classesName?.range_label]:{\r\n display: \"flex\",\r\n },\r\n [classesName?.range_slider_min_max]:{\r\n display: \"flex\",\r\n justifyContent:\"space-between\",\r\n margin: 0,\r\n padding: 0,\r\n \"span\":{\r\n display: \"flex\",\r\n margin: 0,\r\n padding: 0,\r\n height: 0,\r\n lineHeight: \"1rem\",\r\n }\r\n },\r\n [classesName?.range_lider_tooltip]:{\r\n zIndex: 2,\r\n position: \"absolute\",\r\n textAlign: \"center\",\r\n opacity: 1,\r\n borderRadius: \"100%\",\r\n background:cssObject?.color?.[cssKeys?.currentColor],\r\n \"&after\":{\r\n content: \"\",\r\n position: \"absolute\",\r\n left: 0,\r\n borderTopColor: cssObject?.color?.[cssKeys?.currentColor],\r\n\r\n }\r\n },\r\n [classesName?.range_slider_value_output]:{\r\n position: \"absolute\",\r\n textAlign: \"center\",\r\n width:\"90%\"\r\n },\r\n }\r\n });\r\n\r\n const styleSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.range_slider]:(props) => {\r\n return{\r\n height: cssObject?.spacing?.[cssKeys?.sm], /* Specified height */\r\n background: cssObject?.color?.[cssKeys?.light],\r\n borderRadius: cssObject?.border?.[cssKeys?.rounded]?.md,\r\n transition: \"box-shadow 0.2s ease-in-out\",\r\n transformOrigin: \"75px 75px\",\r\n progressShadow: \"2px 2px 4px rgba(0, 0, 0, 0.2) inset\",\r\n pointerEvents: !props?.readOnly ? \"none\": \"default\",\r\n \"&WebkitSliderThumb\":{\r\n position:\"relative\",\r\n borderRadius: cssObject?.border?.[cssKeys?.rounded]?.md,\r\n padding:0,\r\n boxShadow: `-1000px 0 0 1000px ${ styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.[cssKeys?.primary])}`,//cssObject?.boxShadow?.[cssKeys?.md],\r\n ...(\r\n props?.thumb?{\r\n height: cssObject?.spacing?.[cssKeys?.md],\r\n width: cssObject?.spacing?.[cssKeys?.md],\r\n cursor: \"grab\",\r\n border: `${cssObject?.size?.[cssKeys?.border_xs]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.light])}`,\r\n background: styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.[cssKeys?.primary]), \r\n }:{\r\n height: 0,\r\n width: 0,\r\n cursor: \"none\",\r\n pointerEvents:\"none\",\r\n border:\"none\",\r\n }\r\n ),\r\n },\r\n \"&WebkitSliderRunnableTrack\":{\r\n background: cssObject?.color?.[cssKeys?.light],\r\n height: cssObject?.spacing?.[cssKeys?.sm],\r\n border: `${cssObject?.size?.[cssKeys?.border_xs]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.[cssKeys?.primary])}`,\r\n },\r\n \"&MozRangeThumb\":{\r\n position:\"relative\",\r\n borderRadius: cssObject?.border?.[cssKeys?.rounded]?.[cssKeys?.md],\r\n ...(\r\n props?.thumb?{\r\n height: cssObject?.spacing?.[cssKeys?.md],\r\n width: cssObject?.spacing?.[cssKeys?.md],\r\n cursor: \"grab\",\r\n border: `${cssObject?.size?.[cssKeys?.border_xs]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.light])}`,\r\n background: styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.[cssKeys?.primary]),\r\n }:{\r\n height: 0,\r\n width: 0,\r\n cursor: \"none\",\r\n border:\"none\",\r\n }\r\n ),\r\n },\r\n \"&MozRangeTrack\":{\r\n height: cssObject?.spacing?.[cssKeys?.sm],\r\n },\r\n \"&MozRangeProgress\": {\r\n height: cssObject?.spacing?.[cssKeys?.sm],\r\n background: styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.[cssKeys?.primary]),\r\n },\r\n\r\n \"&MsTrack\": {\r\n height: cssObject?.spacing?.[cssKeys?.sm],\r\n border: `${cssObject?.size?.[cssKeys?.border_xs]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.primary])}`,\r\n },\r\n \"&MsFillLower\":{\r\n background: styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.primary]),\r\n },\r\n \"&MsFillUpper\": {\r\n background: styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.primary]),\r\n },\r\n }\r\n },\r\n [classesName?.range_lider_tooltip]:(props) =>{\r\n return{\r\n top: `-${cssObject?.size?.[cssKeys?.item_md]}`,\r\n width: cssObject?.size?.[cssKeys?.item_sm],\r\n height: cssObject?.size?.[cssKeys?.item_sm],\r\n color:props?.color? styleFunction?.checkColorReturnValue(props?.color) : cssObject?.color?.[cssKeys?.primary],\r\n \"&after\":{\r\n top: \"19px\",\r\n borderLeft: \"14px solid transparent\",\r\n borderRight: \"14px solid transparent\",\r\n borderTopWidth: \"16px\",\r\n borderTopStyle: \"solid\",\r\n borderRadius: \"16px\",\r\n }\r\n }\r\n },\r\n [classesName?.range_slider_value_output]:(props)=>{\r\n return{\r\n top: `-${cssObject?.size?.[cssKeys?.item_xs]}`,\r\n color:props?.color? styleFunction?.checkColorReturnValue(props?.color) : cssObject?.color?.[cssKeys?.primary],\r\n fontSize: cssObject?.text?.size?.[cssKeys?.subtitle2],\r\n }},\r\n [classesName?.sx]: (props) => {\r\n return {\r\n color:props?.color? styleFunction?.checkColorReturnValue(props?.color) : cssObject?.color?.[cssKeys?.primary],\r\n ...props?.sx,\r\n\r\n };\r\n },\r\n },\r\n });\r\n\r\n\r\n return{\r\n classesName,\r\n style,\r\n styleSx,\r\n }\r\n}","import { ContextThemeProvider, styleFunction } from '@cbmisorg/styles';\r\nimport React, { forwardRef, useContext, useId } from 'react'\r\nimport SwitchStyle from './SwitchStyle';\r\nimport ErrorMessage from '../ErrorMessage/ErrorMessage';\r\n\r\nconst Switch = forwardRef((/**@type {any}*/props, ref) => {\r\n const {id,label,errorMessage,helperMessage,\r\n color,currentLang,\r\n value,defaultValue=false,\r\n sx,hidden,disabled,dir,className,...rest} = props\r\n const comID = String(useId()).slice(1,-1) + \"checkbox\" || id;\r\n const theTheme = useContext(ContextThemeProvider);\r\n const {classesName, style, styleSx} = SwitchStyle(theTheme);\r\n const classes = style();\r\n const classesSx = styleSx({sx, color, dir});\r\n const itemClasses = styleFunction.getClassName(classes?.[classesName?.switch_container], classesSx?.[classesName?.sx], className);\r\n const itemClasses2 = styleFunction.getClassName(classes?.[classesName?.switch], styleFunction.CheckDirectionItem(dir),styleFunction.CheckDisabledItem(disabled), styleFunction.CheckHiddenItem(hidden),styleFunction.checkExistsMargin(rest),styleFunction.checkExistsPadding(rest));\r\n\r\n return (\r\n \r\n // \r\n //
\r\n // )\r\n }\r\n {\r\n !showValue?null:(\r\n \r\n )\r\n }\r\n \r\n \r\n {\r\n // !showValue?null:(\r\n // \r\n // )\r\n }\r\n {!showMaxMin ? null:(\r\n \r\n {min || min ===0 ? {min} : \"\"}\r\n {max ? {max} : \"\"}\r\n
\r\n )}\r\n \r\n
\r\n\r\n )\r\n});\r\n\r\nexport default Switch","import {\r\n StyleBuilder,\r\n styleVariables,\r\n cssKeys,\r\n mainTheme,\r\n styleFunction,\r\n} from \"@cbmisorg/styles\";\r\n\r\nexport default(objThemeInfo)=>{\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n const currentBaseSize = objThemeInfo?.currentBaseSize || mainTheme?.currentBaseSize;\r\n\r\n const classesName = {\r\n container: `${styleVariables?.prefixDefaultClassName}_main_switch_container`,\r\n\r\n switch_container: `${styleVariables?.prefixDefaultClassName}_switch_container`,\r\n switch: `${styleVariables?.prefixDefaultClassName}_switch`,\r\n switch_input: `${styleVariables?.prefixDefaultClassName}_switch_input`,\r\n switch_slider: `${styleVariables?.prefixDefaultClassName}_switch_slider`,\r\n switch_slider_toggle: `${styleVariables?.prefixDefaultClassName}_switch_slider_toggle`,\r\n switch_label: `${styleVariables?.prefixDefaultClassName}_switch_label`,\r\n sx: `${styleVariables?.prefixDefaultClassName}_switch_sx`,\r\n };\r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles:{\r\n [classesName?.container]:{\r\n position: \"relative\", \r\n width: \"auto\",\r\n display:\"flex\",\r\n margin:\"0\",\r\n maxWidth:\"100%\"\r\n },\r\n [classesName?.switch_container]:{\r\n position: \"relative\", \r\n width: \"auto\",\r\n display:\"flex\",\r\n alignItems:\"center\",\r\n margin:\"0\",\r\n maxWidth:\"100%\"\r\n\r\n },\r\n [classesName?.switch]:{\r\n display: \"inline-block\",\r\n position:\"relative\",\r\n margin:\"0\"\r\n },\r\n [classesName?.switch_input]:{\r\n display: \"none\",\r\n \"&focus\":{\r\n \"&+\":{\r\n [`.${classesName?.switch_slider}`]:{\r\n boxShadow: \"0 0 0 1px rgba(0, 0, 0, 0.1)\",\r\n\r\n }\r\n }\r\n },\r\n },\r\n [classesName?.switch_label]:{\r\n display: \"block\",\r\n cursor: \"pointer\",\r\n position:\"relative\",\r\n },\r\n [classesName?.switch]:{\r\n display: \"inline-block\",\r\n position:\"relative\"\r\n },\r\n [classesName?.switch_slider]: {\r\n position: \"relative\",\r\n display:\"block\",\r\n border: 0,\r\n outline: \"none\",\r\n backgroundColor: \"#ccc\",\r\n transition: \".4s\",\r\n cursor: \"pointer\",\r\n padding:\"0px\",\r\n margin:\"auto 0\",\r\n },\r\n [classesName?.switch_slider_toggle]:{\r\n content: \"\",\r\n position: \"absolute\",\r\n display:\"block\",\r\n left: \"1px\",\r\n right: \"1px\",\r\n bottom: \"0px\",\r\n backgroundColor: \"#fff\",\r\n transition: \".4s\",\r\n borderRadius: \"50%\",\r\n margin:\"0\",\r\n }\r\n }\r\n });\r\n\r\n const styleSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.switch_input]:(props)=>{\r\n return { \r\n \"&checked\":{\r\n \"&+\":{\r\n [`.${classesName?.switch_slider}`]:{\r\n background:cssObject?.color?.[cssKeys?.currentColor],\r\n [`.${classesName?.switch_slider_toggle}`]:{\r\n transform:props?.dir === \"rtl\"?`translateX(-${cssObject?.size?.[cssKeys?.item_xs]})`: `translateX(${cssObject?.size?.[cssKeys?.item_xs]})`\r\n }\r\n }\r\n }\r\n }\r\n }\r\n },\r\n [classesName?.switch_label]:{\r\n margin:`auto ${cssObject?.spacing?.[cssKeys?.xs]}`,\r\n color:cssObject?.color?.[cssKeys?.bodyColor],\r\n fontSize:cssObject?.text?.size?.[cssKeys?.body2],\r\n padding: `0 ${cssObject?.spacing?.[cssKeys?.px]}`,\r\n },\r\n [classesName?.switch_slider]: {\r\n width: cssObject?.size?.[cssKeys?.item_lg],\r\n height: cssObject?.size?.[cssKeys?.item_xs],\r\n borderRadius: cssObject?.border?.[cssKeys?.rounded]?.xl,\r\n\r\n },\r\n [classesName?.switch_slider_toggle]:{\r\n height: `${currentBaseSize*5}rem`,\r\n width: `${currentBaseSize*5}rem`,\r\n top:`${currentBaseSize/2}rem`,\r\n },\r\n [classesName?.sx]: (props) => {\r\n return {\r\n color:props?.color? styleFunction?.checkColorReturnValue(props?.color) : cssObject?.color?.[cssKeys?.primary],\r\n ...props?.sx,\r\n\r\n };\r\n },\r\n },\r\n });\r\n\r\n\r\n return{\r\n classesName,\r\n style,\r\n styleSx,\r\n }\r\n}","import React, { forwardRef } from 'react'\r\n\r\n\r\nconst Option = forwardRef((/**@type {any}*/props, ref) => {\r\n const {children, rest} = props\r\n return (\r\n {children}\r\n )\r\n})\r\n\r\nexport default Option\r\n","import React, { useContext } from 'react'\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport GridStyle from './GridStyle';\r\nimport ErrorBoundary from '../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary';\r\n\r\nconst Grid = React?.forwardRef(function Grid(/**@type {any}*/props, ref) {\r\n const theTheme = useContext(ContextThemeProvider);\r\n const {getGridClassName, style, styleSx} = GridStyle(theTheme);\r\n\r\n const {\r\n container,\r\n item,\r\n xs,\r\n sm,\r\n md,\r\n lg,\r\n xl,\r\n spacing,\r\n alignContent,\r\n alignItems,\r\n alignSelf,\r\n justifyContent,\r\n direction,\r\n sx,\r\n hidden,\r\n disabled,\r\n dir,\r\n className,\r\n ...rest\r\n } = props;\r\n\r\n const classes = style()\r\n const classesSx = styleSx({ sx, container, item, xs, sm, md, lg, xl, spacing, alignItems,alignContent, alignSelf, justifyContent, direction });\r\n\r\n const itemClasses = styleFunction.getClassName(getGridClassName({container, item, classes, classesSx}), styleFunction.CheckDirectionItem(dir),styleFunction.CheckDisabledItem(disabled), styleFunction.CheckHiddenItem(hidden),styleFunction.checkExistsMargin(rest),styleFunction.checkExistsPadding(rest), className);\r\n\r\n return(\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {label?.[currentLang] || label}\r\n \r\n\r\n
\r\n \r\n {props?.children} \r\n
\r\n )\r\n});\r\n\r\nexport default Grid","import { StyleBuilder, styleVariables, cssKeys, mainTheme, sizeOneValueSetter, aggregationSizeStyle, sizeValuesSetter } from \"@cbmisorg/styles\";\r\n\r\nexport default (objThemeInfo) => {\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n const currentBaseSize = objThemeInfo?.currentBaseSize || mainTheme?.currentBaseSize;\r\n\r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [`${styleVariables?.prefixDefaultClassName}_grid_container`]: {\r\n width: cssObject?.size?.[cssKeys?.full],\r\n flexWrap: \"wrap\",\r\n flexFlow: \"wrap\",\r\n margin: \"0 auto\",\r\n padding: 0,\r\n boxSizing: cssObject?.boxSizing?.[cssKeys?.borderBox],\r\n position: cssObject?.position?.[cssKeys?.relative],\r\n display: cssObject?.display?.[cssKeys?.flex],\r\n alignContent: \"flex-start\",\r\n alignItems: \"stretch\",\r\n justifyItems: \"stretch\",\r\n },\r\n [`${styleVariables?.prefixDefaultClassName}_grid_item`]: {\r\n margin: 0,\r\n flexWrap: \"wrap\",\r\n flexFlow: \"wrap\",\r\n justifyItems: \"stretch\",\r\n boxSizing: cssObject?.boxSizing?.[cssKeys?.borderBox],\r\n position: cssObject?.position?.[cssKeys?.relative],\r\n display: cssObject?.display?.[cssKeys?.flex],\r\n },\r\n },\r\n });\r\n\r\n const styleSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [`${styleVariables?.prefixDefaultClassName}_grid`]: (props) => {\r\n let objsx = {};\r\n if (props?.item) {\r\n const result = sizeValuesSetter({ xs: props?.xs, sm: props?.sm, md: props?.md, lg: props?.lg, xl:props?.xl }, (size, styleValue) => {\r\n return {\r\n xl: getGridCol(styleValue),\r\n lg: getGridCol(styleValue),\r\n md: getGridCol(styleValue),\r\n sm: getGridCol(styleValue),\r\n xs: getGridCol(styleValue),\r\n default: getGridCol(null),\r\n }?.[size];\r\n }); \r\n\r\n \r\n let objColStyle = { ...getGridCol(null) };\r\n if (props?.xs) {\r\n objColStyle = {\r\n ...objColStyle,\r\n ...getGridCol(props?.xs),\r\n xs: {\r\n ...getGridCol(props?.xs),\r\n },\r\n };\r\n }\r\n if (props?.sm) {\r\n objColStyle = {\r\n ...objColStyle,\r\n ...getGridCol(props?.sm),\r\n sm: {\r\n ...getGridCol(props?.xs),\r\n },\r\n };\r\n }\r\n if (props?.md) {\r\n objColStyle = {\r\n ...objColStyle,\r\n ...getGridCol(props?.md),\r\n md: {\r\n ...getGridCol(props?.md),\r\n },\r\n };\r\n }\r\n if (props?.lg) {\r\n objColStyle = {\r\n ...objColStyle,\r\n ...getGridCol(props?.lg),\r\n lg: {\r\n ...getGridCol(props?.lg),\r\n },\r\n };\r\n }\r\n if (props?.xl) {\r\n objColStyle = {\r\n ...objColStyle,\r\n xl: {\r\n ...getGridCol(props?.xl),\r\n },\r\n };\r\n }\r\n objsx = aggregationSizeStyle(objColStyle,objsx);\r\n }\r\n if (props?.container) {\r\n const spacing = isNaN(parseInt(props?.spacing)) ? 1 : parseInt(props?.spacing);\r\n objsx = {\r\n ...objsx,\r\n \"&>\": {\r\n [`.${styleVariables?.prefixDefaultClassName}_grid_item`]: {\r\n padding: `${currentBaseSize * spacing}rem`,\r\n },\r\n },\r\n };\r\n }\r\n\r\n objsx = {\r\n fontSize: cssObject?.text?.size?.body1,\r\n color: cssObject?.color?.bodyColor,\r\n ...aggregationSizeStyle(\r\n sizeOneValueSetter(\"alignContent\", props?.alignContent),\r\n sizeOneValueSetter(\"alignItems\", props?.alignItems),\r\n sizeOneValueSetter(\"alignSelf\", props?.alignSelf),\r\n sizeOneValueSetter(\"justifyContent\", props?.justifyContent),\r\n sizeOneValueSetter(\"flexDirection\", props?.direction),\r\n objsx\r\n ),\r\n };\r\n\r\n return objsx;\r\n },\r\n [`${styleVariables?.prefixDefaultClassName}_grid_sx`]: (props) => {\r\n return {\r\n ...props?.sx,\r\n };\r\n },\r\n },\r\n });\r\n\r\n const getGridCol = (col) => {\r\n const gridCol = parseInt(col);\r\n switch (gridCol) {\r\n case 0:\r\n return {\r\n flexGrow: 0,\r\n width: \"0\",\r\n flexBasis: 0,\r\n display: \"none\",\r\n };\r\n case 1:\r\n return {\r\n flexGrow: 0,\r\n width: cssObject?.size?.[cssKeys?.[\"1/12\"]],\r\n flexBasis: cssObject?.size?.[cssKeys?.[\"1/12\"]],\r\n display: \"flex\",\r\n };\r\n case 2:\r\n return {\r\n flexGrow: 0,\r\n width: cssObject?.size?.[cssKeys?.[\"2/12\"]],\r\n flexBasis: cssObject?.size?.[cssKeys?.[\"2/12\"]],\r\n display: \"flex\",\r\n };\r\n case 3:\r\n return {\r\n flexGrow: 0,\r\n width: cssObject?.size?.[cssKeys?.[\"3/12\"]],\r\n flexBasis: cssObject?.size?.[cssKeys?.[\"3/12\"]],\r\n display: \"flex\",\r\n };\r\n case 4:\r\n return {\r\n flexGrow: 0,\r\n width: cssObject?.size?.[cssKeys?.[\"4/12\"]],\r\n flexBasis: cssObject?.size?.[cssKeys?.[\"4/12\"]],\r\n display: \"flex\",\r\n };\r\n case 5:\r\n return {\r\n flexGrow: 0,\r\n width: cssObject?.size?.[cssKeys?.[\"5/12\"]],\r\n flexBasis: cssObject?.size?.[cssKeys?.[\"5/12\"]],\r\n display: \"flex\",\r\n };\r\n case 6:\r\n return {\r\n flexGrow: 0,\r\n width: cssObject?.size?.[cssKeys?.[\"6/12\"]],\r\n flexBasis: cssObject?.size?.[cssKeys?.[\"6/12\"]],\r\n display: \"flex\",\r\n };\r\n case 7:\r\n return {\r\n flexGrow: 0,\r\n width: cssObject?.size?.[cssKeys?.[\"7/12\"]],\r\n flexBasis: cssObject?.size?.[cssKeys?.[\"7/12\"]],\r\n display: \"flex\",\r\n };\r\n case 8:\r\n return {\r\n flexGrow: 0,\r\n width: cssObject?.size?.[cssKeys?.[\"8/12\"]],\r\n flexBasis: cssObject?.size?.[cssKeys?.[\"8/12\"]],\r\n display: \"flex\",\r\n };\r\n case 9:\r\n return {\r\n flexGrow: 0,\r\n width: cssObject?.size?.[cssKeys?.[\"9/12\"]],\r\n flexBasis: cssObject?.size?.[cssKeys?.[\"9/12\"]],\r\n display: \"flex\",\r\n };\r\n case 10:\r\n return {\r\n flexGrow: 0,\r\n width: cssObject?.size?.[cssKeys?.[\"10/12\"]],\r\n flexBasis: cssObject?.size?.[cssKeys?.[\"10/12\"]],\r\n display: \"flex\",\r\n };\r\n case 11:\r\n return {\r\n flexGrow: 0,\r\n width: cssObject?.size?.[cssKeys?.[\"11/12\"]],\r\n flexBasis: cssObject?.size?.[cssKeys?.[\"11/12\"]],\r\n display: \"flex\",\r\n };\r\n case 12:\r\n return {\r\n flexGrow: 0,\r\n width: cssObject?.size?.[cssKeys?.full],\r\n flexBasis: cssObject?.size?.[cssKeys?.full],\r\n\r\n display: \"flex\",\r\n };\r\n default:\r\n return {\r\n flexGrow: 0,\r\n width: \"auto\",\r\n display: \"flex\",\r\n flexBasis: \"auto\",\r\n };\r\n }\r\n };\r\n\r\n const getGridClassName = ({ container, item, classes, classesSx }) => {\r\n const isContainer = container ? `${classes?.[`${styleVariables?.prefixDefaultClassName}_grid_container`]}` : \"\";\r\n const isItem = item ? `${classes?.[`${styleVariables?.prefixDefaultClassName}_grid_item`]}` : \"\";\r\n return `${isContainer} ${isItem} ${classesSx?.[`${styleVariables?.prefixDefaultClassName}_grid`]} ${classesSx?.[`${styleVariables?.prefixDefaultClassName}_grid_sx`]}`;\r\n };\r\n\r\n return {\r\n getGridClassName,\r\n style,\r\n styleSx,\r\n };\r\n};\r\n","import React, { useId, useRef } from \"react\";\r\nimport { ClassesBuilder } from \"@cbmisorg/styles\";\r\nimport { Grid } from \"../../index\";\r\nexport default function RadialProgressBar({ onChange = null, value = null, label = \" deg\", readOnly = false }) {\r\n let id = useId().replaceAll(\":\", \"\");\r\n const circleID = \"radial-slider-circle-\" + id;\r\n const dotCircleID = \"radial-slider-dot-circle-\" + id;\r\n const dotCircleClassName = \"radial-slider-dot-\" + id;\r\n const debugCircleID = \"radial-slider-debug-circle-\" + id;\r\n\r\n const style = ClassesBuilder({\r\n container: {\r\n border: \"0\",\r\n margin: \"0\",\r\n padding: \"0\",\r\n boxSizing: \"border-box\",\r\n outline: \"0\",\r\n WebkitUserSelect: \"none\",\r\n MozUserSelect: \"none\",\r\n msUserSelect: \"none\",\r\n userSelect: \"none\",\r\n height: \"100%\",\r\n width: \"100%\",\r\n \"&>\": {\r\n \"&*\": {\r\n WebkitUserSelect: \"none\",\r\n MozUserSelect: \"none\",\r\n msUserSelect: \"none\",\r\n userSelect: \"none\",\r\n border: \"0\",\r\n margin: \"0\",\r\n padding: \"0\",\r\n boxSizing: \"border-box\",\r\n outline: 0,\r\n },\r\n },\r\n },\r\n debug: {\r\n color: \"#2e78b2\",\r\n fontFamily: \"monospace\",\r\n position: \"absolute\",\r\n top: \"50%\",\r\n left: \"50%\",\r\n transform: \"translate3d(-50%, -50%, 0)\",\r\n zIndex: 100,\r\n fontSize: \"18px\",\r\n backgroundColor: \"#ecf0f1\",\r\n },\r\n circle: {\r\n position: \"relative\",\r\n top: \"50%\",\r\n left: \"50%\",\r\n backgroundColor: value && typeof value === \"number\" ? `conic-gradient(#FF3B60 0deg ${value}deg, #2e78b2 ${value + 1}deg ${360 - value}deg)` : \"#2e78b2\",\r\n borderRadius: \"50%\",\r\n width: \"25%\",\r\n height: \"0\",\r\n minWidth: \"50px\",\r\n minHeight: \"50px\",\r\n paddingBottom: \"25%\",\r\n transform: \"translate3d(-50%, -50%, 0)\",\r\n boxShadow: \"0 0 10px rgba(#000, 0.5)\",\r\n \"&before\": {\r\n content: \"''\",\r\n position: \"absolute\",\r\n width: \"90%\",\r\n height: \"90%\",\r\n backgroundColor: \"#ecf0f1\",\r\n borderRadius: \"50%\",\r\n top: \"5%\",\r\n left: \"5%\",\r\n boxShadow: \"inset 0 0 10px rgba(#000, 0.5)\",\r\n },\r\n [\".\" + dotCircleClassName]: {\r\n position: \"absolute\",\r\n width: \"5%\",\r\n height: \"50%\",\r\n left: \"47.5%\",\r\n top: \"0\",\r\n transform: value && typeof value === \"number\" ? `rotate(${value}deg)` : \"rotate(0deg)\",\r\n transformOrigin: \"center bottom\",\r\n \"&before\": {\r\n content: \"''\",\r\n position: \"absolute\",\r\n backgroundColor: \"#fff\",\r\n boxShadow: \"0 0 10px #000\",\r\n width: \"200%\",\r\n transform: \"translate3d(-25%, -25%, 0)\",\r\n height: \"0\",\r\n paddingBottom: \"200%\",\r\n borderRadius: \"50%\",\r\n cursor: \"pointer\",\r\n },\r\n },\r\n },\r\n });\r\n\r\n const inputRef = useRef({ isDragging: false, value: value });\r\n\r\n const onDrag = (event) => {\r\n try {\r\n event.preventDefault();\r\n\r\n if (!inputRef?.current?.isDragging || readOnly) {\r\n return;\r\n }\r\n\r\n let circle = document.getElementById(circleID);\r\n\r\n let rect = circle.getBoundingClientRect();\r\n\r\n let center_x = rect?.width / 2 + rect?.left;\r\n let center_y = rect?.height / 2 + rect?.top;\r\n\r\n let touch = null;\r\n if (circle?.originalEvent && circle?.originalEvent.touches) {\r\n touch = circle?.originalEvent.touches[0];\r\n }\r\n\r\n let pos_x = event?.pageX || touch?.pageX;\r\n let pos_y = event?.pageY || touch?.pageY;\r\n\r\n let delta_y = center_y - pos_y;\r\n let delta_x = center_x - pos_x;\r\n let angle = Math.atan2(delta_y, delta_x) * (180 / Math.PI);\r\n\r\n angle = angle - 90;\r\n\r\n if (angle < 0) {\r\n angle = 360 + angle;\r\n }\r\n\r\n angle = Math.round(angle);\r\n inputRef.current.value = angle;\r\n if (onChange) {\r\n onChange({ ...event, value: angle });\r\n }\r\n\r\n circle.style.background = `conic-gradient(#FF3B60 0deg ${angle}deg, #2e78b2 ${angle + 1}deg ${360 - angle}deg)`;\r\n\r\n let dotEle = document.getElementById(dotCircleID);\r\n if (dotEle) {\r\n dotEle.style.transform = `rotate(${angle}deg)`;\r\n }\r\n let debugEle = document.getElementById(debugCircleID);\r\n if (debugEle) {\r\n debugEle.innerHTML = angle + label;\r\n }\r\n } catch {}\r\n };\r\n\r\n const onDragStart = (event) => {\r\n inputRef.current.isDragging = true;\r\n };\r\n\r\n const onDragEnd = (event) => {\r\n inputRef.current.isDragging = false;\r\n };\r\n\r\n return (\r\n <>\r\n \r\n
\r\n \r\n
\r\n \r\n {value || inputRef.current.value || 0}\r\n {label}\r\n
\r\n {readOnly ? null : }\r\n \r\n {props.children} \r\n
\r\n );\r\n});\r\n\r\nexport default Box;\r\n","import {\r\n StyleBuilder,\r\n styleVariables,\r\n cssKeys,\r\n mainTheme,\r\n styleFunction,\r\n} from \"@cbmisorg/styles\";\r\n\r\n\r\nexport default(objThemeInfo)=>{\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n\r\n const classesName = {\r\n box: `${styleVariables?.prefixDefaultClassName}_box`,\r\n sx: `${styleVariables?.prefixDefaultClassName}_box_sx`,\r\n };\r\n\r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.box]: {\r\n display: \"block\",\r\n position: \"relative\",\r\n overflow: \"auto\",\r\n width: cssObject?.size?.[cssKeys?.full],\r\n maxWidth: cssObject?.size?.[cssKeys?.full],\r\n textAlign: \"center\",\r\n color: cssObject?.color?.bodyColor,\r\n }\r\n },\r\n });\r\n\r\n const styleSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.sx]: (props) => {\r\n return {\r\n fontSize:cssObject?.text?.size?.body1,\r\n padding: cssObject?.spacing?.[cssKeys?.md],\r\n margin: `${cssObject?.spacing?.[cssKeys?.sm]} auto`,\r\n borderRadius: cssObject?.border?.[cssKeys?.rounded]?.sm,\r\n ...getBorder(props),\r\n boxShadow:getShadow(props?.elevation),\r\n ...props?.sx,\r\n \"&hover\":{\r\n cursor:parseInt(props?.hoverElevation)?\"pointer\":\"default\",\r\n ...props?.sx?.[\"&hover\"],\r\n boxShadow:getShadow(props?.hoverElevation)\r\n }\r\n };\r\n },\r\n },\r\n });\r\n\r\n const getBorder = (props) => {\r\n switch (parseInt(props?.outline)) {\r\n case 1:\r\n return {\r\n color: styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.bodyColor),\r\n border: `${cssObject?.size?.[cssKeys?.border_xs]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.bodyColor)}`,\r\n background: cssObject?.color?.[cssKeys?.transparent],\r\n };\r\n case 2:\r\n return {\r\n color: styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.bodyColor),\r\n border: `${cssObject?.size?.[cssKeys?.border_sm]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${styleFunction.checkColorReturnValue(props?.color ||cssObject?.color?.bodyColor)}`,\r\n background: cssObject?.color?.[cssKeys?.transparent],\r\n };\r\n case 3:\r\n return {\r\n color: props?.color || cssObject?.color?.bodyColor,\r\n border: `${cssObject?.size?.[cssKeys?.border_md]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${props?.color ||cssObject?.color?.bodyColor}`,\r\n background: cssObject?.color?.[cssKeys?.transparent],\r\n };\r\n case 4:\r\n return {\r\n color: styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.bodyColor),\r\n border: `${cssObject?.size?.[cssKeys?.border_lg]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${styleFunction.checkColorReturnValue(props?.color ||cssObject?.color?.bodyColor)}`,\r\n background: cssObject?.color?.[cssKeys?.transparent],\r\n };\r\n case 5:\r\n return {\r\n color: styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.bodyColor),\r\n border: `${cssObject?.size?.[cssKeys?.border_xl]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${styleFunction.checkColorReturnValue(props?.color ||cssObject?.color?.bodyColor)}`,\r\n background: cssObject?.color?.[cssKeys?.transparent],\r\n };\r\n case 0:\r\n return {\r\n color: styleFunction.checkColorReturnValue(cssObject?.color?.bodyColor),\r\n background: styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.primary),\r\n };\r\n default:\r\n return {\r\n color: styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.bodyColor),\r\n border: `${cssObject?.size?.[cssKeys?.border_xs]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.bodyColor)}`,\r\n background: cssObject?.color?.[cssKeys?.transparent],\r\n\r\n };\r\n }\r\n };\r\n\r\n const getShadow = (elevation) => {\r\n switch (parseInt(elevation || 0)) {\r\n case 1:\r\n return cssObject?.boxShadow?.[cssKeys?.xs];\r\n case 2:\r\n return cssObject?.boxShadow?.[cssKeys?.sm];\r\n case 3:\r\n return cssObject?.boxShadow?.[cssKeys?.md];\r\n case 4:\r\n return cssObject?.boxShadow?.[cssKeys?.lg];\r\n case 5:\r\n return cssObject?.boxShadow?.[cssKeys?.xl];\r\n default:\r\n return cssObject?.boxShadow?.[cssKeys?.xs];\r\n }\r\n };\r\n\r\n return{\r\n classesName,\r\n style,\r\n styleSx,\r\n }\r\n}","import React, { forwardRef, useContext} from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport ContainerStyle from \"./ContainerStyle\";\r\nimport ErrorBoundary from \"../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary\";\r\n\r\nconst Container = forwardRef((/**@type {any}*/props, ref) => {\r\n const theTheme = useContext(ContextThemeProvider);\r\n const {classesName, style, styleSx} = ContainerStyle(theTheme);\r\n const { width, sx, hidden, disabled, dir, className, ...rest } = props;\r\n const classes = style();\r\n const classesSx = styleSx({sx, width});\r\n\r\n const itemClasses = styleFunction.getClassName(\r\n classes?.[classesName?.drawer],\r\n classesSx?.[classesName?.drawer],\r\n classesSx?.[classesName?.sx],\r\n styleFunction.CheckDirectionItem(dir),\r\n styleFunction.CheckDisabledItem(disabled),\r\n styleFunction.CheckHiddenItem(hidden),\r\n styleFunction.checkExistsMargin(rest),\r\n styleFunction.checkExistsPadding(rest),\r\n className\r\n );\r\n return (\r\n \r\n {props.children} \r\n
\r\n );\r\n});\r\n\r\nexport default Container;","import {\r\n StyleBuilder,\r\n styleVariables,\r\n cssKeys,\r\n mainTheme,\r\n} from \"@cbmisorg/styles\";\r\n\r\n\r\nexport default(objThemeInfo)=>{\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n\r\n const classesName = {\r\n container: `${styleVariables?.prefixDefaultClassName}_container`,\r\n sx:`${styleVariables?.prefixDefaultClassName}_container_sx`\r\n }\r\n\r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.container]: {\r\n display: cssObject?.display?.[cssKeys?.block],\r\n boxSizing: cssObject?.boxSizing?.[cssKeys?.borderBox],\r\n position:cssObject?.position?.[cssKeys?.relative],\r\n margin: \"auto\",\r\n height:\"fit-content\",\r\n }\r\n },\r\n });\r\n\r\n const styleSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.sx]: (props) => {\r\n return {\r\n padding: cssObject?.spacing?.[cssKeys?.xs],\r\n borderRadius: cssObject?.border?.[cssKeys?.rounded]?.xs,\r\n width: getWidth(props?.width)?.width,\r\n height:\"fit-content\",\r\n ...props?.sx,\r\n sm:{\r\n width: getWidth(props?.width)?.sm?.width,\r\n padding: cssObject?.spacing?.[cssKeys?.xs],\r\n height:\"fit-content\",\r\n ...props?.sx?.sm,\r\n },\r\n xs:{\r\n width: cssObject?.size?.[cssKeys?.full],\r\n padding: cssObject?.spacing?.[cssKeys?.px],\r\n height:\"fit-content\",\r\n ...props?.sx?.sm,\r\n },\r\n };\r\n },\r\n },\r\n });\r\n\r\n const getWidth = (width) => {\r\n switch (String(width).toLowerCase()) {\r\n case \"xl\":\r\n return {\r\n width: cssObject?.size?.[cssKeys?.xl]\r\n }\r\n case \"lg\":\r\n return {\r\n width: cssObject?.size?.[cssKeys?.lg]\r\n }\r\n case \"md\":\r\n return {\r\n width: cssObject?.size?.[cssKeys?.md]\r\n }\r\n case \"sm\":\r\n return {\r\n width: cssObject?.size?.[cssKeys?.sm]\r\n }\r\n case \"xm\":\r\n return {\r\n width: cssObject?.size?.[cssKeys?.xs]\r\n }\r\n case \"fluid\":\r\n return {\r\n width: cssObject?.size?.[cssKeys?.full]\r\n }\r\n case \"half\":\r\n return {\r\n width: cssObject?.size?.[cssKeys?.half]\r\n }\r\n default:\r\n return {\r\n width: cssObject?.size?.[cssKeys?.[\"11/12\"]],\r\n sm:{\r\n width: cssObject?.size?.[cssKeys?.[\"12/12\"]],\r\n padding:cssObject?.spacing?.[cssKeys?.xs]\r\n }\r\n }\r\n }\r\n };\r\n\r\n return{\r\n classesName,\r\n style,\r\n styleSx,\r\n }\r\n}","import React, { useContext } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport LineStyle from \"./LineStyle\";\r\nimport ErrorBoundary from \"../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary\";\r\n\r\nconst Line = React?.forwardRef(function Line (/**@type {any}*/props, ref) {\r\n const theTheme = useContext(ContextThemeProvider);\r\n const {classesName, style, styleSx} = LineStyle(theTheme);\r\n const { sx, color, hidden, disabled, dir, className, label, mode, ...rest } = props;\r\n const classes = style();\r\n const classesSx = styleSx({sx,color,mode});\r\n\r\n const itemClasses = styleFunction.getClassName(classes?.[classesName?.line_container], classesSx?.[classesName?.sx], styleFunction.CheckDirectionItem(dir),styleFunction.CheckDisabledItem(disabled), styleFunction.CheckHiddenItem(hidden),styleFunction.checkExistsMargin(rest),styleFunction.checkExistsPadding(rest), className);\r\n\r\n return(\r\n \r\n \r\n {label ? : \"\"}\r\n
\r\n )\r\n});\r\n\r\nexport default Line","import {\r\n StyleBuilder,\r\n styleVariables,\r\n cssKeys,\r\n mainTheme,\r\n styleFunction,\r\n} from \"@cbmisorg/styles\";\r\n\r\n\r\nexport default(objThemeInfo)=>{\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n\r\n const classesName = {\r\n line_container: `${styleVariables?.prefixDefaultClassName}_line_container`,\r\n line_label: `${styleVariables?.prefixDefaultClassName}_line_Label`,\r\n line: `${styleVariables?.prefixDefaultClassName}_line`,\r\n line_fade: `${styleVariables?.prefixDefaultClassName}_line_fade`,\r\n sx:`${styleVariables?.prefixDefaultClassName}_line_sx`\r\n };\r\n\r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.line_container]:{\r\n display: cssObject?.size?.[cssKeys?.flex],\r\n justifyContent: \"center\",\r\n position:cssObject?.position?.[cssKeys?.relative],\r\n alignItems: \"center\",\r\n flexWrap: \"wrap\",\r\n width: \"95%\",\r\n [`.${classesName?.line_label}`]:{\r\n position:cssObject?.position?.[cssKeys?.absolute],\r\n top: \"-50%\",\r\n left: \"50%\",\r\n transform: \"translateX(-50%) translateY(-50%)\",\r\n color: cssObject?.color?.currentColor,\r\n },\r\n [`.${classesName?.line}`]:{\r\n display: cssObject?.size?.[cssKeys?.flex],\r\n position:cssObject?.position?.[cssKeys?.relative],\r\n height: cssObject?.spacing?.[cssKeys?.xs],\r\n padding: \"0px\",\r\n margin:\"auto\",\r\n outline: \"none\",\r\n border: \"none\",\r\n flex:1,\r\n backgroundColor: cssObject?.color?.currentColor,\r\n\r\n },\r\n [`.${classesName?.line_fade}`]:{\r\n background: `linear-gradient(to left, ${cssObject?.color?.transparent}, ${cssObject?.color?.currentColor}, ${cssObject?.color?.transparent})`,\r\n },\r\n },\r\n },\r\n });\r\n\r\n const styleSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.sx]: (props) => {\r\n return {\r\n color: styleFunction.checkColorReturnValue(props?.color || cssObject?.color?.borderColor),\r\n fontSize:cssObject?.text?.size?.[cssKeys?.subtitle2],\r\n [`.${classesName?.line_label}`]:{\r\n padding: `0 ${cssObject?.spacing?.[cssKeys?.sm]}`,\r\n background: cssObject?.color?.bodyColorBg,\r\n },\r\n [`.${classesName?.line}`]:{\r\n height: cssObject?.spacing?.[cssKeys?.[\"3xs\"]],\r\n },\r\n ...props?.sx,\r\n };\r\n },\r\n },\r\n });\r\n\r\n return{\r\n classesName,\r\n style,\r\n styleSx,\r\n }\r\n}","import React, { forwardRef, useContext } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport BreadcrumbsStyle from \"./BreadcrumbsStyle\";\r\nimport ErrorBoundary from \"../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary\";\r\n\r\nconst Breadcrumbs = forwardRef((/**@type {any}*/ props, ref) => {\r\n const theTheme = useContext(ContextThemeProvider);\r\n const { classesName, style, styleSx } = BreadcrumbsStyle(theTheme);\r\n const { separator, breadcrumbs, color, sx, hidden, disabled, dir, className, id, ...rest } = props;\r\n const classes = style();\r\n const classesSx = styleSx({ sx, separator, breadcrumbs, color });\r\n\r\n const itemClasses = styleFunction.getClassName(\r\n classes?.[classesName?.breadcrumbs],\r\n classesSx?.[classesName?.sx],\r\n styleFunction.CheckDirectionItem(dir),\r\n styleFunction.CheckDisabledItem(disabled),\r\n styleFunction.CheckHiddenItem(hidden),\r\n styleFunction.checkExistsMargin(rest),\r\n styleFunction.checkExistsPadding(rest),\r\n className\r\n );\r\n\r\n return (\r\n - \r\n
- {}}>\r\n
\r\n {open ?
\r\n {\r\n // !blnSwap ? null : (\r\n // \r\n // )\r\n }\r\n \r\n );\r\n});\r\n\r\nconst DrawerChild = forwardRef(function Drawer(/**@type {any}*/ props, ref) {\r\n const { open, position, eventClose, color, title, blnHaveTitle = true, mode, textColor, width, sx, hidden, disabled, dir, className, id, ...rest } = props;\r\n const classes = style();\r\n const classesSx = styleSx({ sx, open });\r\n const itemClasses = styleFunction.getClassName(\r\n classes?.[classesName?.drawer],\r\n classesSx?.[classesName?.drawer],\r\n classesSx?.[classesName?.sx],\r\n styleFunction.CheckDirectionItem(dir),\r\n styleFunction.CheckDisabledItem(disabled),\r\n styleFunction.CheckHiddenItem(hidden),\r\n styleFunction.checkExistsMargin(rest),\r\n styleFunction.checkExistsPadding(rest),\r\n className\r\n );\r\n\r\n const comID = id || String(useId()).slice(1, -1);\r\n\r\n return (\r\n \r\n {props?.children} \r\n
\r\n \r\n {props.children} \r\n
\r\n );\r\n});\r\n\r\nexport default Stepper;\r\n","import React, { forwardRef, useContext, useId } from 'react'\r\nimport {ContextThemeProvider, styleFunction} from \"@cbmisorg/styles\";\r\nimport ErrorBoundary from '../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary';\r\nimport GroupBarStyle from './GroupBarStyle';\r\n\r\nconst GroupBar = forwardRef(function GroupBar(/**@type {any}*/props,ref) {\r\n const theTheme = useContext(ContextThemeProvider);\r\n const { sx, hidden, disabled, dir, className, id, position={xl:\"\",lg:\"\",md:\"\",sm:\"\",xs:\"\"}, ...rest } = props;\r\n const {classesName, style, styleSx} = GroupBarStyle(theTheme);\r\n const classes = style();\r\n const classesSx = styleSx({sx});\r\n const itemClasses = styleFunction.getClassName(classes?.[classesName?.groupBar], classesSx?.[classesName?.sx], styleFunction.CheckDirectionItem(dir),styleFunction.CheckDisabledItem(disabled), styleFunction.CheckHiddenItem(hidden),styleFunction.checkExistsMargin(rest),styleFunction.checkExistsPadding(rest), className);\r\n\r\n const comID = id || String(useId()).slice(1,-1)\r\n\r\n return (\r\n \r\n {stepperContentArr.map((el, i) => (\r\n \r\n \r\n \r\n ))}\r\n
\r\n\r\n = i? styleFunction.checkColorReturnValue(activeColor || \"primary\") :null}}>\r\n \r\n \r\n
\r\n \r\n {stepperContentArr?.[currentTabIndex]?.content} \r\n\r\n
\r\n \r\n {props.children} \r\n
\r\n )\r\n})\r\n\r\nexport default GroupBar","import { StyleBuilder, styleVariables, cssKeys, mainTheme } from \"@cbmisorg/styles\";\r\n\r\nexport default (objThemeInfo) => {\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n\r\n const classesName = {\r\n stepper: `${styleVariables?.prefixDefaultClassName}_stepper`,\r\n stepper_head: `${styleVariables?.prefixDefaultClassName}_stepper_head`,\r\n stepper_label: `${styleVariables?.prefixDefaultClassName}_stepper_label`,\r\n stepper_body: `${styleVariables?.prefixDefaultClassName}_stepper_body`,\r\n stepper_steps: `${styleVariables?.prefixDefaultClassName}_stepper_steps`,\r\n stepper_step: `${styleVariables?.prefixDefaultClassName}_stepper_step`,\r\n stepper_step_input: `${styleVariables?.prefixDefaultClassName}_stepper_step_input`,\r\n\r\n sx: `${styleVariables?.prefixDefaultClassName}_stepper_sx`,\r\n };\r\n\r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.stepper]: {\r\n display: cssObject?.display?.[cssKeys?.block],\r\n boxSizing: cssObject?.boxSizing?.[cssKeys?.borderBox],\r\n position: cssObject?.position?.[cssKeys?.relative],\r\n margin: \"auto\",\r\n minHeight: \"max-content\",\r\n width: \"100%\",\r\n \">*\": {\r\n boxSizing: cssObject?.boxSizing?.[cssKeys?.borderBox],\r\n position: cssObject?.position?.[cssKeys?.relative],\r\n },\r\n },\r\n [classesName?.stepper_body]: {\r\n flex: 1,\r\n padding: 0,\r\n position: cssObject?.position?.[cssKeys?.relative],\r\n },\r\n [classesName?.stepper_head]: {\r\n display: \"flex\",\r\n justifyContent:\"space-between\",\r\n position: \"relative\",\r\n width: \"100%\",\r\n userSelect: \"none\",\r\n counterReset: \"current-step\", \r\n gridTemplateColumns: \"repeat( auto-fit, minmax(1px, 1fr) )\",\r\n zIndex: 1,\r\n \"&after\":{\r\n content:\"' '\",\r\n display: cssObject?.display?.[cssKeys?.block],\r\n position: \"absolute\",\r\n top:\"37%\",\r\n left:\"0\",\r\n margin: \"auto\",\r\n width: \"100%\",\r\n minHeight: \"1px\",\r\n maxHeight: \"1px\",\r\n background:\"currentColor\",\r\n zIndex: -1,\r\n }\r\n },\r\n [classesName?.stepper_step_input]: {\r\n position: \"absolute\",\r\n display: \"initial\",\r\n top: \"-2rem\",\r\n opacity:0,\r\n },\r\n [classesName?.stepper_steps]: {\r\n position: \"relative\",\r\n display: \"block\",\r\n margin: \"0\",\r\n cursor:\"pointer\",\r\n fontSize: cssObject?.text?.size?.[cssKeys?.subtitle3],\r\n fontWeight: cssObject?.text?.fontWeight?.[cssKeys?.fontWeight_md],\r\n\r\n },\r\n [classesName?.stepper_step]: {\r\n position: \"relative\",\r\n display: \"flex\",\r\n width:\"35px\",\r\n height:\"35px\",\r\n border:`1px solid currentColor`,\r\n borderRadius:\"100%\",\r\n textAlign:\"center\",\r\n fontSize: cssObject?.text?.size?.[cssKeys?.h6],\r\n cursor:\"pointer\",\r\n justifyContent:\"center\",\r\n alignItems:\"center\",\r\n },\r\n [classesName?.stepper_label]: {\r\n position: \"relative\",\r\n display: \"block\",\r\n margin: \"0.5rem 0\",\r\n zIndex: 2,\r\n cursor:\"pointer\",\r\n\r\n },\r\n },\r\n });\r\n\r\n const styleSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n // [classesName?.stepper_head]: (props) => {\r\n // if (String(props?.mode).toLowerCase() === \"isvertical\") {\r\n // return {\r\n // flexDirection: \"column\",\r\n // width: \"auto\",\r\n // [`.${classesName?.stepper_step}`]: {\r\n // display: \"flex\",\r\n // alignItems: \"center\",\r\n // textAlign: \"start\",\r\n // \"&after\": {\r\n // content: \" \",\r\n // position: \"absolute\",\r\n // margin: \"auto 1rem\",\r\n // top: \"2rem\",\r\n // bottom: \"-0.5rem\",\r\n // width: 0,\r\n // height: \"auto\",\r\n // borderLeft: \"0.125rem solid #ccc\",\r\n // },\r\n // },\r\n // [`.${classesName?.stepper_label}`]: {\r\n // paddingInlineStart: \"1rem\"\r\n // },\r\n // \"&+\": {\r\n // [`.${classesName?.stepper_body}`]: {\r\n // marginInlineStart: \" 3.5rem\",\r\n // },\r\n // },\r\n // };\r\n // }else{\r\n // return {\r\n // flexDirection: \"row\",\r\n // width: \"100%\",\r\n // [`.${classesName?.stepper_step}`]: {\r\n // display: \"flex\",\r\n // alignItems: \"center\",\r\n // textAlign: \"start\",\r\n // \"&after\": {\r\n // content: \" \",\r\n // position: \"absolute\",\r\n // margin: \"auto 1rem\",\r\n // top: \"50%\",\r\n // transform: \"translateY(-50%)\",\r\n // },\r\n // },\r\n // [`.${classesName?.stepper_label}`]: {\r\n // paddingInlineStart: \"1rem\"\r\n // },\r\n // \"&+\": {\r\n // [`.${classesName?.stepper_body}`]: {\r\n // marginInlineStart: \" 3.5rem\",\r\n // },\r\n // },\r\n // };\r\n // }\r\n // },\r\n [classesName?.sx]: (props) => {\r\n return props?.sx;\r\n },\r\n },\r\n });\r\n\r\n return {\r\n classesName,\r\n style,\r\n styleSx,\r\n };\r\n};\r\n","import { StyleBuilder, styleVariables, cssKeys, mainTheme, styleFunction } from \"@cbmisorg/styles\";\r\n\r\nexport default (objThemeInfo) => {\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n\r\n const classesName = {\r\n slideshow: `${styleVariables?.prefixDefaultClassName}_slideshow`,\r\n slideshowSlider: `${styleVariables?.prefixDefaultClassName}_slideshowSlider`,\r\n slide: `${styleVariables?.prefixDefaultClassName}_slide`,\r\n slide_containt: `${styleVariables?.prefixDefaultClassName}_slide_containt`,\r\n slide_showDots: `${styleVariables?.prefixDefaultClassName}_slide_showDots`,\r\n slide_showDot: `${styleVariables?.prefixDefaultClassName}_slide_showDot`,\r\n slide_showDot_active: `${styleVariables?.prefixDefaultClassName}_slide_showDot_active`,\r\n slide_btn: `${styleVariables?.prefixDefaultClassName}_slide_btn`,\r\n slide_btn_prev: `${styleVariables?.prefixDefaultClassName}_slide_btn_prev`,\r\n slide_btn_next: `${styleVariables?.prefixDefaultClassName}_slide_btn_next`,\r\n\r\n sx: `${styleVariables?.prefixDefaultClassName}_slideshow_sx`,\r\n sx_slide: `${styleVariables?.prefixDefaultClassName}_slide_sx`,\r\n };\r\n\r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.slideshow]: {\r\n display: cssObject?.display?.[cssKeys?.block],\r\n boxSizing: cssObject?.boxSizing?.[cssKeys?.borderBox],\r\n position: cssObject?.position?.[cssKeys?.relative],\r\n minHeight: \"max-content\",\r\n margin: 0,\r\n overflowY: \"visible\",\r\n overflowX: \"clip\",\r\n width: \"100%\",\r\n },\r\n [classesName?.slideshowSlider]: {\r\n whiteSpace: \"nowrap\",\r\n transition: \"ease 1000ms\",\r\n position: cssObject?.position?.[cssKeys?.relative],\r\n direction: \"inherit\",\r\n display: \"flex\",\r\n },\r\n [classesName?.slide]: {\r\n display: cssObject?.display?.[cssKeys?.block],\r\n minHeight: \"250px\",\r\n height: \"100%\",\r\n borderRadius: cssObject?.border?.[cssKeys?.rounded]?.xs,\r\n background: styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.light]),\r\n position: cssObject?.position?.[cssKeys?.relative],\r\n margin: \"0 auto\",\r\n backgroundPosition: \"center\",\r\n backgroundSize: \"100% 100%\",\r\n backgroundRepeat: \"no-repeat\",\r\n },\r\n [classesName?.slide_containt]: {\r\n position: cssObject?.position?.[cssKeys?.relative],\r\n top: 0,\r\n left: 0,\r\n right: 0,\r\n bottom: 0,\r\n display: cssObject?.display?.[cssKeys?.block],\r\n padding: \"1px\",\r\n width: \"100%\",\r\n height: \"100%\",\r\n },\r\n [classesName?.slide_showDots]: {\r\n textAlign: \"center\",\r\n width: \"100%\",\r\n position: cssObject?.position?.[cssKeys?.absolute],\r\n bottom: 0,\r\n zIndex: 1,\r\n },\r\n [classesName?.slide_showDot]: {\r\n position: \"relative\",\r\n display: \"inline-block\",\r\n height: \"7px\",\r\n width: \"7px\",\r\n borderRadius: \"50%\",\r\n cursor: \"pointer\",\r\n margin: \"10px 7px\",\r\n background: styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.bodyColor]),\r\n border: `2px solid ${styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.bodyColor])}`,\r\n \"&hover\": {\r\n opacity: 0.9,\r\n background: \"transparent\",\r\n },\r\n },\r\n [classesName?.slide_btn]: {\r\n position: \"absolute\",\r\n width: \"25px\",\r\n height: \"25px\",\r\n background: \"transparent\",\r\n border: `1px solid ${styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.bodyColor])}`,\r\n cursor: \"pointer\",\r\n overflow: \"hidden\",\r\n zIndex: 10,\r\n display: \"flex\",\r\n justifyContent: \"center\",\r\n alignItems: \"center\",\r\n color: styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.bodyColor]),\r\n fontSize: \"18px\",\r\n borderRadius: \"100%\",\r\n top: \"50%\",\r\n transform: \"translateY(-60%)\",\r\n },\r\n [classesName?.slide_btn_prev]: {\r\n left: \"20px\",\r\n },\r\n [classesName?.slide_btn_next]: {\r\n right: \"20px\",\r\n },\r\n },\r\n });\r\n\r\n const styleSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.slide_showDot_active]: (props) => {\r\n return {\r\n background: styleFunction.checkColorReturnValue(props?.activeColor || cssObject?.color?.[cssKeys?.primary]),\r\n borderColor: styleFunction.checkColorReturnValue(props?.activeColor || cssObject?.color?.[cssKeys?.primary]),\r\n };\r\n },\r\n [classesName?.sx]: (props) => {\r\n return {\r\n ...props?.sx,\r\n };\r\n },\r\n [classesName?.slideshowSlider]: (props) => {\r\n if (props.slideNumber) {\r\n return {\r\n [`.${classesName?.slide}`]: {\r\n flex: ` 1 0 ${100 / (Number(props.slideNumber) || 1)}%`,\r\n },\r\n };\r\n }\r\n return {\r\n [`.${classesName?.slide}`]: {\r\n flex: ` 1 0 100%`,\r\n },\r\n };\r\n },\r\n [classesName?.slide]: (props) => {\r\n if (props.image) {\r\n return {\r\n backgroundImage: `url(${props.image})`,\r\n };\r\n }\r\n return null;\r\n },\r\n [classesName?.sx_slide]: (props) => {\r\n return {\r\n ...props?.sx,\r\n };\r\n },\r\n },\r\n });\r\n\r\n return {\r\n classesName,\r\n style,\r\n styleSx,\r\n };\r\n};\r\n","import React, { forwardRef, useContext, useEffect, useRef, useState } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport SlideshowStyle from \"./SlideshowStyle\";\r\nimport ErrorBoundary from \"../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary\";\r\nimport { Icon } from \"@cbmisorg/icons\";\r\n\r\nconst Slideshow = forwardRef((/**@type {any}*/ props, ref) => {\r\n const theTheme = useContext(ContextThemeProvider);\r\n const { classesName, style, styleSx } = SlideshowStyle(theTheme);\r\n const { blnAutoShow=true, delay, activeColor, blnDotsShow = true, blnArrow = true, slideNumber = 1, sx, hidden, disabled, dir, className, ...rest } = props;\r\n const slides = props?.children || [];\r\n const classes = style();\r\n const classesSx = styleSx({ sx, activeColor, slideNumber });\r\n\r\n const [index, setIndex] = useState(0);\r\n const timeoutRef = useRef(null);\r\n // const sliderSplitNum = new Array(Math.round(slides.length / slideNumber));\r\n\r\n const canMove = Math.round(slides.length / slideNumber) > 1;\r\n const isAutoShow = blnAutoShow && canMove;\r\n const timeDelay = delay || 3000;\r\n\r\n useEffect(() => {}, [slides, blnAutoShow, delay, activeColor, blnDotsShow, blnArrow, sx, hidden, disabled, dir, className]);\r\n\r\n useEffect(() => {\r\n if (isAutoShow) {\r\n resetTimeout();\r\n timeoutRef.current = setTimeout(() => setIndex((prevIndex) => (prevIndex === slides.length - 1 ? 0 : prevIndex + 1)), timeDelay);\r\n\r\n return () => {\r\n resetTimeout();\r\n };\r\n }\r\n }, [index]);\r\n\r\n const itemClasses = styleFunction.getClassName(\r\n classes?.[classesName?.slideshow],\r\n classesSx?.[classesName?.sx],\r\n styleFunction.CheckDirectionItem(dir),\r\n styleFunction.CheckDisabledItem(disabled),\r\n styleFunction.CheckHiddenItem(hidden),\r\n styleFunction.checkExistsMargin(rest),\r\n styleFunction.checkExistsPadding(rest),\r\n className\r\n );\r\n\r\n function resetTimeout() {\r\n if (timeoutRef.current) {\r\n clearTimeout(timeoutRef.current);\r\n }\r\n }\r\n\r\n const handleNext = () => {\r\n if (canMove && blnArrow) {\r\n var next = index + 1;\r\n // if (next === sliderSplitNum.length) {\r\n // next = 0;\r\n // }\r\n setIndex(next);\r\n }\r\n };\r\n\r\n const handlePrev = () => {\r\n if (canMove && blnArrow) {\r\n var Prev = index - 1;\r\n if (Prev === -1) {\r\n // Prev = sliderSplitNum.length - 1;\r\n }\r\n setIndex(Prev);\r\n }\r\n };\r\n\r\n return (\r\n \r\n \r\n \r\n {props.children}\r\n
\r\n \r\n {canMove && blnArrow ? (\r\n \r\n {(props.children || []).map((_, idx) => (\r\n {\r\n setIndex(idx);\r\n }}\r\n >
\r\n ))}\r\n \r\n ) : (\r\n \"\"\r\n )}\r\n \r\n );\r\n});\r\n\r\nexport default Slideshow;\r\n","import React, { forwardRef, useContext } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport SlideshowStyle from \"./SlideshowStyle\";\r\nimport ErrorBoundary from \"../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary\";\r\nimport { useId } from \"react\";\r\n\r\nconst Slide = forwardRef((/**@type {any}*/ props, ref) => {\r\n const theTheme = useContext(ContextThemeProvider);\r\n const { classesName, style, styleSx } = SlideshowStyle(theTheme);\r\n const { image, sx, hidden, disabled, dir, className, id, ...rest } = props;\r\n const classes = style();\r\n const classesSx = styleSx({ sx, image });\r\n const comID = id || String(useId()).slice(1, -1) + \"slide\";\r\n\r\n const itemClasses = styleFunction.getClassName(\r\n classes?.[classesName?.slide],\r\n classesSx?.[classesName?.slide],\r\n classesSx?.[classesName?.sx],\r\n styleFunction.CheckDirectionItem(dir),\r\n styleFunction.CheckDisabledItem(disabled),\r\n styleFunction.CheckHiddenItem(hidden),\r\n styleFunction.checkExistsMargin(rest),\r\n styleFunction.checkExistsPadding(rest),\r\n className\r\n );\r\n\r\n return (\r\n \r\n \r\n \r\n
\r\n );\r\n});\r\n\r\nexport default Slide;\r\n","/* eslint-disable no-fallthrough */\r\nimport React, { forwardRef, useContext, useId, useState } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport TabsStyle from \"./TabsStyle\";\r\nimport ErrorBoundary from \"../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary\";\r\nimport { useEffect } from \"react\";\r\n\r\nconst Tabs = forwardRef((/**@type {any}*/ props, ref) => {\r\n const theTheme = useContext(ContextThemeProvider);\r\n const { classesName, style, styleSx } = TabsStyle(theTheme);\r\n const { tabsContent, currentTab = 1, activeColor = \"primary\", mode = \"nav\", sx, hidden, disabled, dir, className, id, ...rest } = props;\r\n const [tab, setTab] = useState(currentTab || 1)\r\n const classes = style();\r\n const classesSx = styleSx({ sx, activeColor, mode });\r\n const itemClasses = styleFunction.getClassName(\r\n classes?.[classesName?.tabs],\r\n classesSx?.[classesName?.tabs],\r\n classesSx?.[classesName?.sx],\r\n styleFunction.CheckDirectionItem(dir),\r\n styleFunction.CheckDisabledItem(disabled),\r\n styleFunction.CheckHiddenItem(hidden),\r\n styleFunction.checkExistsMargin(rest),\r\n styleFunction.checkExistsPadding(rest),\r\n className\r\n );\r\n const comID = id || String(useId()).slice(1, -1) + \"tab\";\r\n\r\n const handleClick = (funClick, ind) => {\r\n if (funClick) {\r\n funClick();\r\n }else{\r\n setTab(ind + 1)\r\n }\r\n };\r\n useEffect(() => {\r\n }, [props]);\r\n\r\n useEffect(() => {\r\n if (tab != currentTab) {\r\n setTab(currentTab)\r\n }\r\n }, [currentTab]);\r\n\r\n return (\r\n {props.children}
\r\n \r\n \r\n {tabsContent?.map((item, ind) => {\r\n return (\r\n \r\n handleClick(item?.onClick || item?.onChange || null, ind)}\r\n key={String(comID + ind + 3)}\r\n >\r\n {item?.tab || item?.tabLabel || null}\r\n \r\n \r\n );\r\n })}\r\n \r\n
\r\n\r\n \r\n {tabsContent?.[tab-1]?.content} \r\n
\r\n \r\n \r\n {!(getContent?.sideBar?.length && blnBurgerBar) ? null : openMenuSidebar ? (\r\n \r\n
\r\n {mode === \"dashboard\" && (\r\n setOpenMenuSidebar(!openMenuSidebar)}>\r\n \r\n \r\n \r\n
\r\n ) : (\r\n setOpenMenuSidebar(true)}>\r\n \r\n \r\n \r\n
\r\n )}\r\n\r\n{getContent?.navBar}
\r\n \r\n 0}\r\n eventClose={() => setOpenMenuSidebar(!openMenuSidebar)}\r\n mode={mode}\r\n key={comID + \"_Drawer\"}\r\n className={`${classes?.[classesName?.appBar_sidebarDb]} ${classesSx?.[classesName?.appBar_sidebarDb]}`}\r\n >\r\n {getContent?.sideBar} \r\n \r\n
\r\n )}\r\n {mode !== \"dashboard\" && (\r\n \r\n {!breadcrumbs ? null : (\r\n
\r\n \r\n \r\n \r\n
\r\n )}\r\n {outlet}\r\n {headItem}
}\r\n \r\n {label || props?.children}\r\n
\r\n {!footerItem && !menu ? null : (\r\n \r\n {footerItem ? footerItem : menu ?
\r\n )}\r\n \r\n \r\n \r\n );\r\n});\r\n\r\nexport default Nav;\r\n\r\n// // if(to){\r\n// // if(typeof window !==\"undefined\"){\r\n// // if(replace){\r\n// // window.history.replaceState(state, \"\", path);\r\n// // }else{\r\n// // window.history.pushState(state, \"\", path);\r\n// // }\r\n// // }\r\n// // }\r\n// console.log(open);\r\n// // event.preventDefault()\r\n// // if(open){\r\n// // }else{\r\n// // if(menu?.length){\r\n// // setOpen(true);\r\n// // }\r\n// // }\r\n\r\n// alert(cmp_ID)\r\n// if(!open?.cmp_ID && menu && menu?.length>0){\r\n// setOpen(true);\r\n// }else{\r\n// setOpen({cmp_ID: !open?.cmp_ID});\r\n// }\r\n","import {\r\n StyleBuilder,\r\n styleVariables,\r\n cssKeys,\r\n mainTheme,\r\n styleFunction,\r\n} from \"@cbmisorg/styles\";\r\n\r\nexport default(objThemeInfo)=>{\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n const currentBaseSize = objThemeInfo?.currentBaseSize || mainTheme?.currentBaseSize;\r\n\r\n const classesName = {\r\n nav: `${styleVariables?.prefixDefaultClassName}_nav_item`,\r\n nav_menu: `${styleVariables?.prefixDefaultClassName}_nav_menu`,\r\n nav_nav_container: `${styleVariables?.prefixDefaultClassName}_nav_nav_container`,\r\n nav_item_head: `${styleVariables?.prefixDefaultClassName}_nav_item_head`,\r\n nav_item_item_content: `${styleVariables?.prefixDefaultClassName}_nav_item_item_content`,\r\n nav_item_footer: `${styleVariables?.prefixDefaultClassName}_nav_item_footer`,\r\n \r\n sx:`${styleVariables?.prefixDefaultClassName}_nav_sx`\r\n };\r\n\r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.nav_nav_container]: {\r\n margin: \"auto\",\r\n cursor: \"pointer\",\r\n position:\"relative\",\r\n textAlign:\"center\",\r\n display: cssObject?.display?.[cssKeys?.block],\r\n width:\"100%\",\r\n flexBasis:\"1\"\r\n\r\n },\r\n [classesName?.nav]: {\r\n transition: \"all ease-in-out 350ms\",\r\n margin: \"auto\",\r\n cursor: \"pointer\",\r\n // listStyle: \"none\",\r\n // display: \"flex\",\r\n // justifyContent:\"start\",\r\n // alignContent:\"center\",\r\n position:\"relative\",\r\n textAlign:\"center\",\r\n display: cssObject?.display?.[cssKeys?.flex],\r\n flex:1,\r\n justifyContent:\"space-between\",\r\n alignItems: \"flex-start\",\r\n width:\"max-content\",\r\n\r\n\r\n },\r\n [classesName?.nav_item_head]:{\r\n justifyContent: \"center\",\r\n textAlign: \"center\",\r\n // padding:cssObject?.spacing?.[cssKeys?.xs],\r\n background: \"transparent\",\r\n display: \"flex\",\r\n width: \"max-content\",\r\n margin:cssObject?.spacing?.[cssKeys?.xs],\r\n },\r\n [classesName?.nav_item_item_content]:{\r\n textAlign: \"start\",\r\n background: \"transparent\",\r\n // padding:cssObject?.spacing?.[cssKeys?.xs],\r\n display: \"flex\",\r\n alignItems: \"center\",\r\n minWidth: \"max-content\",\r\n justifyContent: \"flex-start\",\r\n width:\"100%\"\r\n },\r\n [classesName?.nav_item_footer]:{\r\n display: \"flex\",\r\n alignSelf: \"center\",\r\n justifyContent: \"center\",\r\n textAlign: \"center\",\r\n width: \"max-content\",\r\n margin:cssObject?.spacing?.[cssKeys?.xs],\r\n background: \"transparent\",\r\n },\r\n },\r\n });\r\n\r\n const styleSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.nav]: (props) => {\r\n return{\r\n padding: `${cssObject?.spacing?.[cssKeys?.xs]}`,\r\n minHeight: `${cssObject?.size?.[cssKeys?.item_sm]}`,\r\n \"&hover\":{\r\n background: cssObject?.color?.[cssKeys?.bodyColorLight],\r\n cursor:\"pointer\"\r\n }\r\n }\r\n },\r\n [classesName?.nav_menu]: (props) => {\r\n return{\r\n boxSizing: \"border-content\",\r\n minWidth: `max-content`,\r\n maxHeight: \"75%\",\r\n width:\"100%\",\r\n padding: props?.hasContent?`${cssObject?.spacing?.[cssKeys?.xs]}`: \"0px\",\r\n [`.${classesName?.nav}`]:{\r\n minWidth:\"90% !important\"\r\n }\r\n\r\n }\r\n },\r\n [classesName?.sx]: (props) => {\r\n return {\r\n ...props?.sx\r\n };\r\n },\r\n },\r\n });\r\n\r\n\r\n return{\r\n classesName,\r\n style,\r\n styleSx,\r\n }\r\n}","import { StyleBuilder, cssKeys, mainTheme, styleFunction, styleVariables } from \"@cbmisorg/styles\";\r\n\r\n export default(objThemeInfo)=>{\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n \r\n const classesName = {\r\n accordion_row: `${styleVariables?.prefixDefaultClassName}_accordion_row`,\r\n accordion_col: `${styleVariables?.prefixDefaultClassName}_accordion_col`,\r\n accordion_tabs: `${styleVariables?.prefixDefaultClassName}_accordion_tabs`,\r\n accordion_tab: `${styleVariables?.prefixDefaultClassName}_accordion_tab`,\r\n accordion_tab_summary_label: `${styleVariables?.prefixDefaultClassName}_accordion_tab_summary_label`,\r\n accordion_tab_summary_label_content: `${styleVariables?.prefixDefaultClassName}_accordion_tab_summary_label_content`,\r\n accordion_tab_summary_label_arrowIcon: `${styleVariables?.prefixDefaultClassName}_accordion_tab_summary_label_arrowIcon`,\r\n accordion_tab_summary_icon: `${styleVariables?.prefixDefaultClassName}_accordion_tab_summary_icon`,\r\n accordion_tab_summary_icon_arrowIcon: `${styleVariables?.prefixDefaultClassName}_accordion_tab_summary_icon_arrowIcon`,\r\n accordion_tab_summary_label_content_children: `${styleVariables?.prefixDefaultClassName}_accordion_tab_summary_label_content_children`,\r\n accordion_tab_summary_input: `${styleVariables?.prefixDefaultClassName}_accordion_tab_summary_input`,\r\n accordion_tab_details: `${styleVariables?.prefixDefaultClassName}_accordion_tab_details`,\r\n accordion_tab_summary_input_dontOpen: `${styleVariables?.prefixDefaultClassName}_accordion_tab_summary_input_dontOpen`,\r\n accordion_horizontal_tabs: `${styleVariables?.prefixDefaultClassName}_accordion_horizontal_tabs`,\r\n sx: `${styleVariables?.prefixDefaultClassName}_accordion_sx`,\r\n };\r\n \r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.accordion_row]:{\r\n width: \"100%\",\r\n display:\"flex\",\r\n },\r\n [classesName?.accordion_col]:{\r\n width: \"100%\",\r\n display:\"block\",\r\n },\r\n [classesName?.accordion_tabs]:{\r\n overflow: \"hidden\",\r\n position: \"relative\",\r\n padding: cssObject?.spacing?.xs,\r\n backgroundColor: \"transparent\",\r\n },\r\n [classesName?.accordion_tab]:{\r\n borderRadius: 0,\r\n width:\"auto\",\r\n overflow: \"hidden\",\r\n position: \"relative\",\r\n background: \"transparent\",\r\n cursor: \"pointer\",\r\n display:\"block\",\r\n backgroundColor:cssObject?.color?.[cssKeys?.white]\r\n\r\n },\r\n [classesName?.accordion_tab_summary_label]:{\r\n display: \"flex\",\r\n justifyContent: \"space-between\",\r\n verticalAlign: \"middle\",\r\n position: \"relative\",\r\n cursor: \"pointer\",\r\n // \"&before\":{\r\n // content: \"&rangle\",\r\n // textAlign: \"end\",\r\n // transition: \"all .35s\",\r\n // transform: \"rotate(90deg)\",\r\n // position: \"absolute\",\r\n // right:\"0\"\r\n // }\r\n },\r\n [classesName?.accordion_tab_summary_label_content]:{\r\n width: \"100%\",\r\n display: \"flex\",\r\n },\r\n [classesName?.accordion_tab_summary_label_arrowIcon]:{\r\n \"&after\":{\r\n content: \"\",\r\n width: 0,\r\n height: 0,\r\n padding: 0,\r\n }\r\n },\r\n [classesName?.accordion_tab_summary_icon]:{\r\n margin: \"auto\",\r\n },\r\n [classesName?.accordion_tab_summary_icon_arrowIcon]:{\r\n transition: \"transform .5s\"\r\n },\r\n [classesName?.accordion_tab_summary_label_content_children]:{\r\n width: \"99%\",\r\n margin: \"auto\",\r\n },\r\n [classesName?.accordion_tab_summary_input]:{\r\n position: \"absolute\",\r\n top: 0,\r\n left: 0,\r\n width: \"100%\",\r\n minHeight: cssObject?.size?.[cssKeys?.item_lg],\r\n background: \"#fff\",\r\n cursor: \"pointer\",\r\n opacity: 0,\r\n // zIndex:1,\r\n \"&checked\":{\r\n \"&~\":{\r\n [`.${classesName?.accordion_tab_details}`]:{\r\n // zIndex: 2,\r\n visibility: \"visible\",\r\n opacity: \"1\",\r\n \"&*\":{\r\n // zIndex: 2,\r\n }\r\n }},\r\n \"&+\":{\r\n [`.${classesName?.accordion_tab_summary_label}`]:{\r\n \"&after\":{\r\n marginTop: cssObject?.spacing?.sm,\r\n transform: \"rotate(270deg) translateY(-50%)\",\r\n },\r\n [`.${classesName?.accordion_tab_summary_icon_arrowIcon}`]:{\r\n transform: \"rotateZ(180deg)\",\r\n \r\n }\r\n }\r\n }\r\n }\r\n },\r\n [classesName?.accordion_tab_summary_input_dontOpen]:{\r\n pointerEvents:\"none\",\r\n },\r\n [classesName?.accordion_tab_details]:{\r\n display: \"none\",\r\n // maxHeight: \"0px\",\r\n position: \"relative\",\r\n transition: \"height 1s\"\r\n },\r\n [classesName?.accordion_horizontal_tabs]:{\r\n display: \"flex\",\r\n flexWrap: \"nowrap\",\r\n overflow: \"hidden\",\r\n position: \"relative\",\r\n width: \"auto\",\r\n [`.${classesName?.accordion_tab}`]:{\r\n display: \"flex\",\r\n flexWrap: \"nowrap\",\r\n position: \"relative\",\r\n transition: \"all .5s\",\r\n height: \"auto\",\r\n width: \"auto\",\r\n },\r\n [`.${classesName?.accordion_tab_details}`]:{\r\n padding:`0 ${cssObject?.spacing?.xs}`,\r\n color:cssObject?.color?.bodyColor,\r\n },\r\n [`.${classesName?.accordion_tab_summary_input}`]:{\r\n \"&checked\":{\r\n \"&~\":{\r\n [`.${classesName?.accordion_tab_details}`]:{\r\n // width: \"auto\",\r\n // minWidth: \"10vw\",\r\n // maxWidth: \"75vw\",\r\n // visibility: \"visible\",\r\n // opacity: \"1\",\r\n // maxHeight: \"100%\",\r\n // padding: `0 ${cssObject?.spacing?.xs}`,\r\n // boxShadow: \"0 0 0 0 transparent\",\r\n // zIndex: \"2\",\r\n // overflowY: \"auto\",\r\n \r\n\r\n padding: cssObject?.spacing?.xs,\r\n boxShadow: cssObject?.boxShadow?.sm,\r\n },\r\n },\r\n \"&+\":{\r\n [`.${classesName?.accordion_tab_summary_label}`]:{\r\n \"&after\":{\r\n marginTop: \"0\",\r\n transform: \"rotate(180deg) translateY(-100%)\",\r\n }\r\n },\r\n }\r\n }\r\n },\r\n [`.${classesName?.accordion_tab_summary_label}`]:{\r\n maxWidth: \"500px !important\",\r\n minWidth: \"110px !important\",\r\n \"&after\":{\r\n transform: \"rotate(0deg)\"\r\n }\r\n }\r\n }\r\n },\r\n });\r\n \r\n const styleSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles:{\r\n [classesName?.sx]: (props) => {\r\n if(props?.color){\r\n return{\r\n color: props?.color || \"#000\",\r\n ...props?.sx\r\n }\r\n }\r\n return props?.sx;\r\n },\r\n \r\n },\r\n });\r\n \r\n const styleTabSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n className:\"\",\r\n objStyles:{\r\n [classesName?.sx]: (props) => {\r\n if(props?.color){\r\n return{\r\n color: props?.color || \"#000\",\r\n ...props?.sx\r\n }\r\n }\r\n return props?.sx;\r\n },\r\n \r\n },\r\n });\r\n \r\n \r\n const styleDetailsSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles:{\r\n [classesName?.sx]: (props) => {\r\n const objCss={}\r\n if(props?.color){\r\n objCss.color= props?.color || \"#000\";\r\n }\r\n if(props?.openDetails){\r\n objCss.display= \"block\";\r\n }\r\n return {...props?.sx, ...objCss};\r\n },\r\n },\r\n });\r\n \r\n const styleSummarySx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles:{\r\n [classesName?.accordion_tab_summary_label]:{\r\n padding: `${cssObject?.spacing?.xs} ${cssObject?.spacing?.xs}`,\r\n fontWeight: cssObject?.text?.fontWeight?.fontWeight_lg,\r\n fontSize:cssObject?.text?.size?.subtitle2,\r\n minHeight: cssObject?.size?.[cssKeys?.item_lg],\r\n borderBottom: `${cssObject?.size?.[cssKeys?.border_xs]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${styleFunction.checkColorReturnValue(cssObject?.color?.[cssKeys?.currentColor])}`,\r\n },\r\n [classesName?.accordion_tab_summary_label_content]:{\r\n maxWidth: \"90%\",\r\n minHeight: cssObject?.size?.[cssKeys?.item_sm],\r\n display: \"flex\",\r\n },\r\n [classesName?.accordion_tab_summary_icon_arrowIcon]:{\r\n fontSize:cssObject?.text?.size?.h6,\r\n },\r\n [classesName?.sx]: (props) => {\r\n if(props?.color){\r\n return{\r\n color:styleFunction?.checkColorReturnValue(cssObject?.color?.[cssKeys?.bodyColor]),\r\n ...props?.sx\r\n }\r\n }\r\n return props?.sx;\r\n },\r\n },\r\n });\r\n \r\n return{\r\n classesName,\r\n style,\r\n styleSx,\r\n styleTabSx,\r\n styleDetailsSx,\r\n styleSummarySx\r\n }\r\n }","import React, { forwardRef, useContext, useId } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport AccordionStyle from \"./AccordionStyle\";\r\n\r\nconst Accordion = forwardRef((/**@type {any}*/props, ref) => {\r\n const { children, ariaControl, sx, hidden, disabled, dir, className, id,mode, ...rest } = props;\r\n const theTheme = useContext(ContextThemeProvider);\r\n const {classesName, style, styleSx} = AccordionStyle(theTheme);\r\n const classes = style();\r\n const classesSx = styleSx({sx,mode});\r\n const comID = id || String(useId()).slice(1,-1) + \"_accordion\";\r\n\r\n const itemClasses = styleFunction.getClassName(classes?.[classesName?.accordion_tabs], classesSx?.[classesName?.sx], styleFunction.CheckDirectionItem(dir),styleFunction.CheckDisabledItem(disabled), styleFunction.CheckHiddenItem(hidden),styleFunction.checkExistsMargin(rest),styleFunction.checkExistsPadding(rest), className);\r\n\r\n return (\r\n \r\n
\r\n );\r\n});\r\n\r\nexport default Accordion;\r\n","import React, { forwardRef, useContext, useId, useState } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport AccordionStyle from \"./AccordionStyle\";\r\n\r\nconst AccordionTab = forwardRef((/**@type {any}*/ props, ref) => {\r\n const { children, open = false, blnOpenOne = false, sx, hidden, disabled, id, dir, className, ...rest } = props;\r\n const theTheme = useContext(ContextThemeProvider);\r\n const { classesName, style, styleTabSx } = AccordionStyle(theTheme);\r\n const classes = style();\r\n const classesSx = styleTabSx({ sx });\r\n const comID = id || String(useId()).slice(1, -1);\r\n const [openDetails, setOpenDetails] = useState(open);\r\n\r\n const itemClasses = styleFunction.getClassName(\r\n classes?.[classesName?.accordion_tab],\r\n classesSx?.[classesName?.sx],\r\n styleFunction.CheckDirectionItem(dir),\r\n styleFunction.CheckDisabledItem(disabled),\r\n styleFunction.CheckHiddenItem(hidden),\r\n styleFunction.checkExistsMargin(rest),\r\n styleFunction.checkExistsPadding(rest),\r\n className\r\n );\r\n\r\n const handleChangeInput = (event) => {\r\n setOpenDetails(event?.target?.checked);\r\n };\r\n return (\r\n \r\n
\r\n \r\n {children}\r\n
\r\n \r\n {!children[0] ? null : React.cloneElement(children[0], { open: openDetails, blnOpenOne: blnOpenOne, tabID: comID, handleChangeInput: handleChangeInput })}\r\n {!children[1] ? null : React.cloneElement(children[1], { openDetails: openDetails, tabID: comID, })}\r\n
\r\n );\r\n});\r\n\r\nexport default AccordionTab;\r\n","import React, { forwardRef, useContext, useEffect, useId } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport { Icon } from \"@cbmisorg/icons\";\r\nimport AccordionStyle from \"./AccordionStyle\";\r\n\r\nconst AccordionSummary = forwardRef((/**@type {any}*/ props, ref) => {\r\n const {\r\n id,\r\n children,\r\n onChange,\r\n handleChangeInput,\r\n inputRef,\r\n expandIcon,\r\n tabID,\r\n open = false,\r\n blnOpenOne = false,\r\n arrowIcon = \"expandMore\",\r\n iconSize,\r\n sx,\r\n hidden,\r\n disabled,\r\n dir,\r\n className,\r\n ...rest\r\n } = props;\r\n const theTheme = useContext(ContextThemeProvider);\r\n const { classesName, style, styleSummarySx } = AccordionStyle(theTheme);\r\n const classes = style();\r\n const classesSx = styleSummarySx({ sx });\r\n const comID = tabID ? tabID + \"_inputAccordion\" : id || String(useId()).slice(1, -1) + \"accordion\";\r\n\r\n const itemClasses = styleFunction.getClassName(\r\n classes?.[classesName?.accordion_tab_summary_label],\r\n classesSx?.[classesName?.accordion_tab_summary_label],\r\n classesSx?.[classesName?.sx],\r\n styleFunction.CheckDirectionItem(dir),\r\n styleFunction.CheckDisabledItem(disabled),\r\n styleFunction.CheckHiddenItem(hidden),\r\n styleFunction.checkExistsMargin(rest),\r\n styleFunction.checkExistsPadding(rest),\r\n className\r\n );\r\n\r\n const handleChangeInputSummary = (event) => {\r\n if (handleChangeInput) {\r\n handleChangeInput(event);\r\n }\r\n if (onChange) {\r\n onChange(event);\r\n }\r\n };\r\n return (\r\n \r\n {blnAddToDomClose || openDetails? children : null}\r\n
\r\n );\r\n});\r\n\r\nexport default AccordionDetails;\r\n","import {\r\n StyleBuilder,\r\n styleVariables,\r\n cssKeys,\r\n mainTheme,\r\n} from \"@cbmisorg/styles\";\r\n\r\nexport default(objThemeInfo)=>{\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n\r\n const classesName = {\r\n card_container: `${styleVariables?.prefixDefaultClassName}_card_container`,\r\n card: `${styleVariables?.prefixDefaultClassName}_card`,\r\n card_have_back: `${styleVariables?.prefixDefaultClassName}_card_have_back`,\r\n card_image: `${styleVariables?.prefixDefaultClassName}_card_image`,\r\n card_frame: `${styleVariables?.prefixDefaultClassName}_card_frame`,\r\n card_image_hover: `${styleVariables?.prefixDefaultClassName}_card_image_hover`,\r\n card_frame_bg: `${styleVariables?.prefixDefaultClassName}_card_frame_bg`,\r\n card_frame_content: `${styleVariables?.prefixDefaultClassName}_card_frame_content`,\r\n card_front: `${styleVariables?.prefixDefaultClassName}_card_front`,\r\n card_back: `${styleVariables?.prefixDefaultClassName}_card_back`,\r\n card_content: `${styleVariables?.prefixDefaultClassName}_card_content`,\r\n card_details: `${styleVariables?.prefixDefaultClassName}_card_details`,\r\n\r\n sx: `${styleVariables?.prefixDefaultClassName}_card_sx`,\r\n };\r\n\r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.card_container]: {\r\n display: \"flex\",\r\n boxOrient: \"horizontal\",\r\n WebkitBoxDirection :\"normal\",\r\n boxPack: \"center\",\r\n WebkitBoxPack: \"center\",\r\n MozBoxPack: \"center\",\r\n justifyContent: \"center\",\r\n width:\"100%\",\r\n height:\"100%\",\r\n margin: \"auto\",\r\n padding: 0,\r\n position: \"relative\",\r\n },\r\n [classesName?.card]:{\r\n width: \"100%\",\r\n borderRadius: \"5px\",\r\n position: \"relative\",\r\n transition: \"transform 0.5s\",\r\n transformStyle: \"preserve-3d\",\r\n margin: \"auto\",\r\n padding: 0,\r\n maxHeight: \"500vh\",\r\n display: \"block\",\r\n [`.${classesName?.card_front}`]:{\r\n position:\"relative\",\r\n width: \"100%\",\r\n top: 0,\r\n left: 0,\r\n backfaceVisibility: \"hidden\",\r\n MozBackfaceVisibility: \"hidden\",\r\n WebkitBackfaceVisibility: \"hidden\",\r\n transition: \"all 0.5s\",\r\n zIndex: 3,\r\n transform: \"rotateY( 0deg )\",\r\n boxShadow: cssObject?.boxShadow?.[cssKeys?.sm]\r\n },\r\n [`.${classesName?.card_back}`]:{\r\n position:\"absolute\",\r\n width: \"100%\",\r\n top: 0,\r\n left: 0,\r\n backfaceVisibility: \"hidden\",\r\n MozBackfaceVisibility: \"hidden\",\r\n WebkitBackfaceVisibility: \"hidden\",\r\n transition: \"all 0.5s\",\r\n zIndex:2,\r\n transform: \"rotateY( 180deg )\",\r\n boxShadow: cssObject?.boxShadow?.[cssKeys?.sm]\r\n\r\n },\r\n [`.${classesName?.card_content}`]:{\r\n position: \"relative\",\r\n top: \"0px\",\r\n width: \"auto\",\r\n margin: \"auto\",\r\n // boxShadow: \"var(--cbmis-box-shadow-1)\" ,\r\n borderRadius: \"5px\",\r\n padding: \"0.25rem\",\r\n background: \"#fff\",\r\n display: \"block\",\r\n },\r\n [`.${classesName?.card_details}`] :{\r\n position: \"relative\",\r\n background: \"#fff\",\r\n padding: \"0.5rem\",\r\n display:\"block\",\r\n zIndex:1,\r\n }\r\n },\r\n [classesName?.card_have_back]:{\r\n \"&hover\":{\r\n [`.${classesName?.card}`]:{\r\n cursor: \"pointer\",\r\n },\r\n [`.${classesName?.card_front}`]:{\r\n transform: \"rotateY(180deg)\",\r\n },\r\n [`.${classesName?.card_back}`]:{\r\n transform: \"rotateY(0deg)\",\r\n }\r\n }\r\n },\r\n [classesName?.card_image]:{\r\n width: \"100%\",\r\n height: \"175px\",\r\n maxHeight: \"calc(45.1977vw)\",\r\n display: \"block;\",\r\n transformStyle: \"preserve-3d\",\r\n border: \"0px\",\r\n backgroundPosition: \"center\",\r\n backgroundRepeat: \"no-repeat\",\r\n backgroundSize: \"100% 100%\",\r\n position: \"relative\",\r\n color: \"#fff\",\r\n padding: \"0PX\",\r\n zIndex:1,\r\n },\r\n [classesName?.card_frame]:{\r\n opacity: \"0\",\r\n width: \"0%\",\r\n height: \"0%\",\r\n display: \"block\",\r\n position: \"absolute\",\r\n top: \"0px\",\r\n left: \"0px\",\r\n zIndex: \"var( --cbmis-z-index-10)\",\r\n transition: \"height .12s\",\r\n },\r\n [classesName?.card_image_hover]:{\r\n \"&hover\":{\r\n [`.${classesName?.card_frame}`]:{\r\n opacity: 1,\r\n height: \"100%\",\r\n width: \"100%\",\r\n }\r\n }\r\n },\r\n [classesName?.card_frame_bg]: {\r\n width: \"100%\",\r\n height: \"100%\",\r\n display: \"block\",\r\n position: \"absolute\",\r\n left: \"50%\",\r\n top: \"50%\",\r\n transform: \"translate(-50%,-50%)\",\r\n background: \"#000\",\r\n backdropFilter: \"blur(50px)\",\r\n opacity: \".88\",\r\n zIndex: \"0\",\r\n },\r\n [classesName?.card_frame_content]:{\r\n width: \"100%\",\r\n height: \"100%\",\r\n display: \"block\",\r\n position: \"absolute\",\r\n left: \"50%\",\r\n top: \"50%\",\r\n transform: \"translate(-50%,-50%)\",\r\n opacity: \"1\",\r\n zIndex: \"var( --cbmis-z-index-1)\",\r\n },\r\n },\r\n });\r\n\r\n const styleCardSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles:{\r\n [classesName?.sx]: (props) => {\r\n return props?.sx;\r\n },\r\n },\r\n });\r\n\r\n const styleCardFrontSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles:{\r\n [classesName?.sx]: (props) => {\r\n return props?.sx;\r\n },\r\n },\r\n });\r\n\r\n const styleCardBackSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles:{\r\n [classesName?.sx]: (props) => {\r\n return props?.sx;\r\n },\r\n },\r\n });\r\n\r\n const styleCardImageSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles:{\r\n [classesName?.sx]: (props) => {\r\n return props?.sx;\r\n },\r\n },\r\n });\r\n\r\n const styleCardDetailsSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles:{\r\n [classesName?.sx]: (props) => {\r\n return props?.sx;\r\n },\r\n },\r\n });\r\n\r\n\r\n return{\r\n classesName,\r\n style,\r\n styleCardSx,\r\n styleCardFrontSx,\r\n styleCardBackSx,\r\n styleCardImageSx,\r\n styleCardDetailsSx\r\n }\r\n}","import React, { forwardRef, useContext, useId } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport CardStyle from \"./CardStyle\";\r\nimport ErrorBoundary from \"../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary\";\r\n\r\nconst Card = forwardRef((/**@type {any}*/props, ref) => {\r\n const { sx,id, hidden, disabled, dir, className, ...rest } = props;\r\n const theTheme = useContext(ContextThemeProvider);\r\n const {classesName, style, styleCardSx} = CardStyle(theTheme);\r\n const classes = style();\r\n const classesSx = styleCardSx({sx});\r\n const itemClasses = styleFunction.getClassName(classes?.[classesName?.card], classesSx?.[classesName?.sx], styleFunction.CheckDirectionItem(dir),styleFunction.CheckDisabledItem(disabled), styleFunction.CheckHiddenItem(hidden),styleFunction.checkExistsMargin(rest),styleFunction.checkExistsPadding(rest), className);\r\n const comID = id || String(useId()).slice(1,-1)\r\n\r\n return (\r\n \r\n
\r\n );\r\n});\r\n\r\nexport default Card;\r\n","import React, { forwardRef, useContext, useId } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport CardStyle from \"./CardStyle\";\r\nimport ErrorBoundary from \"../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary\";\r\n\r\nconst CardFront = forwardRef((/**@type {any}*/props, ref) => {\r\n const { sx, id, hidden, disabled, dir, className, ...rest } = props;\r\n const theTheme = useContext(ContextThemeProvider);\r\n const {\r\n classesName,\r\n // style,\r\n styleCardFrontSx} = CardStyle(theTheme);\r\n // const classes = style();\r\n const classesSx = styleCardFrontSx({sx});\r\n const itemClasses = styleFunction.getClassName(classesName?.card_front, classesSx?.[classesName?.sx], styleFunction.CheckDirectionItem(dir),styleFunction.CheckDisabledItem(disabled), styleFunction.CheckHiddenItem(hidden),styleFunction.checkExistsMargin(rest),styleFunction.checkExistsPadding(rest), className);\r\n\r\n const comID = id || String(useId()).slice(1,-1)\r\n\r\n return (\r\n \r\n {props.children} \r\n
\r\n \r\n
\r\n );\r\n});\r\n\r\nexport default CardFront;\r\n","import React, { forwardRef, useContext, useId } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport CardStyle from \"./CardStyle\";\r\nimport ErrorBoundary from \"../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary\";\r\n\r\nconst CardBack = forwardRef((/**@type {any}*/props, ref) => {\r\n const { sx,id, hidden, disabled, dir, className, ...rest } = props;\r\n const theTheme = useContext(ContextThemeProvider);\r\n const {\r\n classesName,\r\n // style,\r\n styleCardBackSx} = CardStyle(theTheme);\r\n // const classes = style();\r\n const classesSx = styleCardBackSx({sx});\r\n const itemClasses = styleFunction.getClassName(classesName?.card_back, classesSx?.[classesName?.sx], styleFunction.CheckDirectionItem(dir),styleFunction.CheckDisabledItem(disabled), styleFunction.CheckHiddenItem(hidden),styleFunction.checkExistsMargin(rest),styleFunction.checkExistsPadding(rest), className);\r\n\r\n const comID = id || String(useId()).slice(1,-1)\r\n\r\n return (\r\n \r\n {props.children} \r\n
\r\n \r\n
\r\n );\r\n});\r\n\r\nexport default CardBack;\r\n","import React, { forwardRef, useContext, useId } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport CardStyle from \"./CardStyle\";\r\n\r\nconst CardImage = forwardRef((/**@type {any}*/props, ref) => {\r\n const { src, title, hoverContent, sx, id, hidden, disabled, dir, className, ...rest } = props;\r\n const theTheme = useContext(ContextThemeProvider);\r\n const {classesName,style, styleCardImageSx} = CardStyle(theTheme);\r\n const classes = style();\r\n const classesSx = styleCardImageSx({sx});\r\n const itemClasses = styleFunction.getClassName(classesName?.card_image, hoverContent ? classes?.[classesName?.card_image_hover] : \"\", classesSx?.[classesName?.sx], styleFunction.CheckDirectionItem(dir),styleFunction.CheckDisabledItem(disabled), styleFunction.CheckHiddenItem(hidden),styleFunction.checkExistsMargin(rest),styleFunction.checkExistsPadding(rest), className);\r\n\r\n const comID = id || String(useId()).slice(1,-1)\r\n\r\n return (\r\n \r\n {props.children} \r\n
\r\n \r\n
\r\n );\r\n});\r\n\r\nexport default CardImage;\r\n","import React, { forwardRef, useContext, useId } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport CardStyle from \"./CardStyle\";\r\nimport ErrorBoundary from \"../../_helper/errorHandeling/ErrorBoundary/ErrorBoundary\";\r\n\r\nconst CardDetails = forwardRef((/**@type {any}*/props, ref) => {\r\n const { sx, id, hidden, disabled, dir, className, ...rest } = props;\r\n const theTheme = useContext(ContextThemeProvider);\r\n const {\r\n classesName,\r\n // style, \r\n styleCardDetailsSx} = CardStyle(theTheme);\r\n // const classes = style();\r\n const classesSx = styleCardDetailsSx({sx});\r\n const itemClasses = styleFunction.getClassName(classesName?.card_details, classesSx?.[classesName?.sx], styleFunction.CheckDirectionItem(dir),styleFunction.CheckDisabledItem(disabled), styleFunction.CheckHiddenItem(hidden),styleFunction.checkExistsMargin(rest),styleFunction.checkExistsPadding(rest), className);\r\n\r\n const comID = id || String(useId()).slice(1,-1)\r\n\r\n return (\r\n {props.children}
\r\n \r\n \r\n
\r\n {hoverContent}
\r\n \r\n {props.children} \r\n
\r\n );\r\n});\r\n\r\nexport default CardDetails;\r\n","/* eslint-disable no-fallthrough */\r\nimport React, { forwardRef, useContext } from \"react\";\r\nimport { ContextThemeProvider, styleFunction } from \"@cbmisorg/styles\";\r\nimport LoaderStyle from \"./LoaderStyle\";\r\nimport Container from \"../../layout/Container/Container\";\r\n\r\nconst Loader = forwardRef((/**@type {any}*/ props, ref) => {\r\n const theTheme = useContext(ContextThemeProvider);\r\n const { classesName, style, styleSx } = LoaderStyle(theTheme);\r\n const { mode, color, backdrop, sx, hidden, disabled, dir, className, id, ...rest } = props;\r\n const classes = style();\r\n const classesSx = styleSx({ sx, color, backdrop });\r\n const itemClasses = styleFunction.getClassName(\r\n classes?.[classesName?.loader_container],\r\n classesSx?.[classesName?.sx],\r\n styleFunction.CheckDirectionItem(dir),\r\n styleFunction.CheckDisabledItem(disabled),\r\n styleFunction.CheckHiddenItem(hidden),\r\n styleFunction.checkExistsMargin(rest),\r\n styleFunction.checkExistsPadding(rest),\r\n className\r\n );\r\n\r\n return backdrop ? (\r\n \r\n \r\n
\r\n \r\n {props?.children} \r\n
\r\n );\r\n});\r\n\r\nexport default Paper;\r\n","import {\r\n StyleBuilder,\r\n styleVariables,\r\n cssKeys,\r\n mainTheme,\r\n styleFunction,\r\n} from \"@cbmisorg/styles\";\r\n\r\n\r\nexport default(objThemeInfo)=>{\r\n const cssObject = objThemeInfo?.cssObject || mainTheme?.cssObject;\r\n\r\n const classesName = {\r\n paper: `${styleVariables?.prefixDefaultClassName}_paper`,\r\n sx: `${styleVariables?.prefixDefaultClassName}_paper_sx`,\r\n };\r\n\r\n const style = StyleBuilder({\r\n blnRandomPrefix: false,\r\n blnIsDefaultStyle: true,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.paper]: {\r\n display: \"block\",\r\n margin: \"auto\",\r\n position: \"relative\",\r\n overflow: \"auto\",\r\n boxSizing: cssObject?.boxSizing?.[cssKeys?.borderBox],\r\n\r\n }\r\n },\r\n });\r\n\r\n const styleSx = StyleBuilder({\r\n blnRandomPrefix: true,\r\n blnIsDefaultStyle: false,\r\n blnCbmisStyle: true,\r\n objStyles: {\r\n [classesName?.sx]: (props) => {\r\n const {elevation=null, width=null, outline=null, sx={sm:null}} = props\r\n return {\r\n fontSize:cssObject?.text?.size?.body1,\r\n color: cssObject?.color?.bodyColor,\r\n padding: cssObject?.spacing?.[cssKeys?.md],\r\n borderRadius: cssObject?.border?.[cssKeys?.rounded]?.sm,\r\n ...getBorder(props),\r\n ...getWidth(props),\r\n ...getShadow(props),\r\n ...props?.sx,\r\n sm:{\r\n padding: cssObject?.spacing?.[cssKeys?.sm],\r\n ...props?.sx?.sm,\r\n },\r\n };\r\n },\r\n },\r\n });\r\n\r\n const getWidth = (props) => {\r\n switch (String(props?.width).toLowerCase()) {\r\n case \"xl\":\r\n return {\r\n width: cssObject?.size?.[cssKeys?.xl]\r\n }\r\n case \"lg\":\r\n return {\r\n width: cssObject?.size?.[cssKeys?.lg]\r\n }\r\n case \"md\":\r\n return {\r\n width: cssObject?.size?.[cssKeys?.md]\r\n }\r\n case \"sm\":\r\n return {\r\n width: cssObject?.size?.[cssKeys?.sm]\r\n }\r\n case \"sm\":\r\n return {\r\n width: cssObject?.size?.[cssKeys?.xs]\r\n }\r\n case \"fluid\":\r\n return {\r\n width: cssObject?.size?.[cssKeys?.full]\r\n }\r\n case \"half\":\r\n return {\r\n width: cssObject?.size?.[cssKeys?.half]\r\n }\r\n default:\r\n return {\r\n width: cssObject?.size?.[cssKeys?.full]\r\n }\r\n }\r\n };\r\n const getBorder = (props) => {\r\n switch (parseInt(props?.outline)) {\r\n case 0:\r\n return {\r\n color: styleFunction.checkColorReturnValue(cssObject?.color?.bodyColor),\r\n border: \"none\",\r\n };\r\n case 1:\r\n return {\r\n color: styleFunction.checkColorReturnValue(cssObject?.color?.bodyColor),\r\n border: `${cssObject?.size?.[cssKeys?.border_xs]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${styleFunction.checkColorReturnValue(cssObject?.color?.bodyColor)}`,\r\n };\r\n case 2:\r\n return {\r\n border: `${cssObject?.size?.[cssKeys?.border_sm]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${styleFunction.checkColorReturnValue(cssObject?.color?.bodyColor)}`,\r\n };\r\n case 3:\r\n return {\r\n border: `${cssObject?.size?.[cssKeys?.border_md]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${styleFunction.checkColorReturnValue(cssObject?.color?.bodyColor)}`,\r\n };\r\n case 4:\r\n return {\r\n border: `${cssObject?.size?.[cssKeys?.border_lg]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${styleFunction.checkColorReturnValue(cssObject?.color?.bodyColor)}`,\r\n };\r\n case 5:\r\n return {\r\n border: `${cssObject?.size?.[cssKeys?.border_xl]} ${cssObject?.border?.[cssKeys?.border]?.solid} ${styleFunction.checkColorReturnValue(cssObject?.color?.bodyColor)}`,\r\n };\r\n default:\r\n return {\r\n width: cssObject?.border?.size?.[cssKeys?.none]\r\n };\r\n }\r\n };\r\n\r\n const getShadow = (props) => {\r\n switch (parseInt(props?.elevation)) {\r\n case 0:\r\n return {\r\n boxShadow: \"none\",\r\n };\r\n case 1:\r\n return {\r\n boxShadow: cssObject?.boxShadow?.[cssKeys?.xs],\r\n };\r\n case 2:\r\n return {\r\n boxShadow: cssObject?.boxShadow?.[cssKeys?.sm],\r\n };\r\n case 3:\r\n return {\r\n boxShadow: cssObject?.boxShadow?.[cssKeys?.md],\r\n };\r\n case 4:\r\n return {\r\n boxShadow: cssObject?.boxShadow?.[cssKeys?.lg],\r\n };\r\n case 5:\r\n return {\r\n boxShadow: cssObject?.boxShadow?.[cssKeys?.xl],\r\n };\r\n default:\r\n return {\r\n boxShadow: cssObject?.boxShadow?.[cssKeys?.sm],\r\n };\r\n }\r\n };\r\n\r\n return{\r\n classesName,\r\n style,\r\n styleSx,\r\n }\r\n}","\n import API from \"!../../../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\";\n import domAPI from \"!../../../../../node_modules/style-loader/dist/runtime/styleDomAPI.js\";\n import insertFn from \"!../../../../../node_modules/style-loader/dist/runtime/insertBySelector.js\";\n import setAttributes from \"!../../../../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js\";\n import insertStyleElement from \"!../../../../../node_modules/style-loader/dist/runtime/insertStyleElement.js\";\n import styleTagTransformFn from \"!../../../../../node_modules/style-loader/dist/runtime/styleTagTransform.js\";\n import content, * as namedExport from \"!!../../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./AnimationBox.css\";\n \n \n\nvar options = {};\n\noptions.styleTagTransform = styleTagTransformFn;\noptions.setAttributes = setAttributes;\noptions.insert = insertFn.bind(null, \"head\");\noptions.domAPI = domAPI;\noptions.insertStyleElement = insertStyleElement;\n\nvar update = API(content, options);\n\n\n\nexport * from \"!!../../../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./AnimationBox.css\";\n export default content && content.locals ? content.locals : undefined;\n","import React, { useState, useEffect, useRef } from \"react\";\r\nimport \"./AnimationBox.css\";\r\n/**\r\n * AnimationBox Component.\r\n *\r\n * @param {{\r\n * type: 'fadeIn' | 'fadeOut' | 'fadeInGrow' | 'fadeOutGrow' | 'slideIn' | 'slideOut' | 'grow' |\r\n * 'slideInRotate' | 'slideOutRotate' | 'fadeOutSlideOut' | 'wobble' | 'hinge' | 'flip' | 'flipInX' |\r\n * 'flipOutX' | 'flipInY' | 'flipOutY' | 'rollIn' | 'rollOut' | 'rotateIn' | 'rotateOut' | 'slideInUp' |\r\n * 'slideInDown' | 'slideInLeft' | 'slideInRight' | 'slideOutUp' | 'slideOutDown' | 'slideOutLeft' | 'slideOutRight',\r\n * easing: 'linear' | 'ease-in' | 'ease-out' | 'ease-in-out' | [other CSS timing functions],\r\n * trigger: 'auto' | 'manual',\r\n * forceTrigger: boolean,\r\n * animationMode: 'forward' | 'loop' | 'reverse'\r\n * }} props The properties.\r\n */\r\n\r\n\r\n\r\nconst AnimationBox = ({\r\n children,\r\n type,\r\n duration = \"1s\",\r\n delay = \"1s\",\r\n easing = \"linear\",\r\n trigger = \"auto\",\r\n forceTrigger = false,\r\n animationMode = \"forward\",\r\n}) => {\r\n const [active, setActive] = useState(false);\r\n const [shouldRender, setShouldRender] = useState(true);\r\n const animationRef = useRef(null);\r\n\r\n useEffect(() => {\r\n if (trigger === \"manual\" && forceTrigger) {\r\n setActive(true);\r\n }\r\n }, [forceTrigger, trigger]);\r\n\r\n const computedClass = active ?`animation-${type}`: \"\";\r\n\r\n let initialStyles = {};\r\n if (\r\n type.includes(\"fadeIn\") ||\r\n type.includes(\"flash\") ||\r\n type === \"rotateIn\"\r\n ) {\r\n initialStyles.opacity = 0;\r\n }\r\n if (\r\n type.includes(\"slideIn\") ||\r\n type.includes(\"swing\") ||\r\n type.includes(\"jello\") ||\r\n type.includes(\"flipIn\") ||\r\n type.includes(\"rollIn\")\r\n ) {\r\n initialStyles.transform = \"translateX(-100%)\";\r\n }\r\n if (type.includes(\"grow\") || type.includes(\"rubberBand\")) {\r\n initialStyles.transform = \"scale(0)\";\r\n }\r\n if (type.includes(\"bounce\") || type.includes(\"pulse\")) {\r\n initialStyles = {};\r\n }\r\n\r\n let animationDirection = \"normal\";\r\n let animationIterationCount = \"1\";\r\n\r\n if (animationMode === \"loop\") {\r\n animationIterationCount = \"infinite\";\r\n } else if (animationMode === \"reverse\") {\r\n animationDirection = \"alternate\";\r\n animationIterationCount = \"infinite\";\r\n }\r\n\r\n useEffect(() => {\r\n const node = animationRef.current;\r\n if (node) {\r\n node.addEventListener(\"animationend\", handleAnimationEnd);\r\n return () => {\r\n node.removeEventListener(\"animationend\", handleAnimationEnd);\r\n };\r\n }\r\n }, [type, animationMode]);\r\n\r\n const handleAnimationEnd = (e) => {\r\n if (\r\n (type.includes(\"slideOut\") ||\r\n type.includes(\"SlideOut\") ||\r\n type.includes(\"fadeOut\") ||\r\n type.includes(\"flash\") ||\r\n type.includes(\"swing\") ||\r\n type.includes(\"rubberBand\") ||\r\n type.includes(\"hinge\") ||\r\n type.includes(\"flipOut\") ||\r\n type.includes(\"rollOut\") ||\r\n type.includes(\"rotateOut\")) &&\r\n animationMode === \"forward\"\r\n ) {\r\n setShouldRender(false);\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n const handleIntersection = (entries) => {\r\n entries.forEach((entry) => {\r\n if (trigger === \"auto\") {\r\n if (entry.isIntersecting) {\r\n setActive(true);\r\n } else {\r\n setActive(false);\r\n }\r\n } else if (\r\n trigger === \"manual\" &&\r\n forceTrigger &&\r\n entry.isIntersecting\r\n ) {\r\n setActive(true);\r\n }\r\n });\r\n };\r\n\r\n const observer = new IntersectionObserver(handleIntersection, {\r\n threshold: [0, 1],\r\n });\r\n\r\n if (animationRef.current) {\r\n observer.observe(animationRef.current);\r\n }\r\n\r\n return () => {\r\n if (animationRef.current) {\r\n observer.unobserve(animationRef.current);\r\n }\r\n };\r\n }, [animationRef, trigger, forceTrigger]);\r\n\r\n return (\r\n