@bizhermit/react-sdk/elements/group-box.js

React SDK

"use strict";var __createBinding=this&&this.__createBinding||(Object.create?function(e,n,t,r){void 0===r&&(r=t);var a=Object.getOwnPropertyDescriptor(n,t);a&&!("get"in a?!n.__esModule:a.writable||a.configurable)||(a={enumerable:!0,get:function(){return n[t]}}),Object.defineProperty(e,r,a)}:function(e,n,t,r){void 0===r&&(r=t),e[r]=n[t]}),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?function(e,n){Object.defineProperty(e,"default",{enumerable:!0,value:n})}:function(e,n){e.default=n}),__importStar=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var n={};if(null!=e)for(var t in e)"default"!==t&&Object.prototype.hasOwnProperty.call(e,t)&&__createBinding(n,e,t);return __setModuleDefault(n,e),n},__importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0});const react_1=__importDefault(require("react")),core_style_1=require("../styles/core-style"),css_var_1=__importStar(require("../styles/css-var")),jsx_style_1=__importDefault(require("../styles/jsx-style")),attributes_1=require("../utils/attributes"),cn="bh-grp",GroupBox=react_1.default.forwardRef(((e,n)=>react_1.default.createElement("div",{...(0,attributes_1.attributesWithoutChildren)(e,cn),ref:n,"data-signal":e.$signal},react_1.default.createElement("div",{className:`${cn}-cap`},react_1.default.createElement("div",{className:`${cn}-cap_prefix`}),react_1.default.createElement("div",{className:`${cn}-cap_cont`},e.$caption),react_1.default.createElement("div",{className:`${cn}-cap_suffix`})),react_1.default.createElement("div",{className:`${cn}-cont ${core_style_1.sbCn}`,"data-padding":e.$padding},e.children),Style))),Style=react_1.default.createElement(jsx_style_1.default,{id:cn,depsDesign:!0},(({design:e})=>`\n.${cn} {\n  ${css_var_1.CssPV.flex}\n  flex-flow: column nowrap;\n  justify-content: flex-start;\n  align-items: flex-start;\n  overflow: hidden;\n  flex: none;\n}\n.${cn}-cap {\n  ${css_var_1.CssPV.flex}\n  flex-flow: row nowrap;\n  justify-content: flex-start;\n  align-items: flex-end;\n  flex: none;\n  overflow: hidden;\n  width: 100%;\n  font-weight: bold;\n${(0,css_var_1.switchDesign)(e,{c:`min-height: ${css_var_1.default.size};`,neumorphism:`\n  border-radius: ${css_var_1.default.bdr} ${css_var_1.default.bdr} 0 0;\n  box-shadow: ${css_var_1.CssPV.cvxSdS};\n`})}\n}\n.${cn}-cap_prefix,\n.${cn}-cap_suffix {\n  box-sizing: border-box;\n  position: relative;\n  min-height: 0px;\n  height: 50%;\n}\n.${cn}-cap_prefix {\n  flex: none;\n  ${(0,css_var_1.switchDesign)(e,{fm:`\n  border-top: 1.5px solid ${css_var_1.default.bdc};\n  border-left: 1.5px solid ${css_var_1.default.bdc};\n  border-radius: ${css_var_1.default.bdr} 0 0 0;\n  width: 10px;\n`})}\n}\n.${cn}-cap_suffix {\n  flex: 1;\n${(0,css_var_1.switchDesign)(e,{fm:`\n  border-top: 1.5px solid ${css_var_1.default.bdc};\n  border-right: 1.5px solid ${css_var_1.default.bdc};\n  border-radius: 0 ${css_var_1.default.bdr} 0 0;\n  min-width: 10px;\n`})}\n}\n.${cn}-cap_cont {\n  padding: 0px 5px;\n}\n.${cn}-cont {\n  ${css_var_1.CssPV.flex}\n  flex-flow: column nowrap;\n  justify-content: flex-start;\n  align-items: flex-start;\n  flex: 1;\n  min-height: 0px;\n  width: 100%;\n${(0,css_var_1.switchDesign)(e,{fm:`\n  border-left: 1.5px solid ${css_var_1.default.bdc};\n  border-right: 1.5px solid ${css_var_1.default.bdc};\n  border-bottom: 1.5px solid ${css_var_1.default.bdc};\n  border-radius: 0 0 ${css_var_1.default.bdr} ${css_var_1.default.bdr};\n`,neumorphism:`\n  box-shadow: ${css_var_1.CssPV.ccvSdS};\n  border-radius: 0 0 ${css_var_1.default.bdr} ${css_var_1.default.bdr};\n`})}\n}\n.${cn}-cont[data-padding="true"] {\n  padding: ${css_var_1.default.pdy} ${css_var_1.default.pdx};\n}\n${(0,css_var_1.switchDesign)(e,{fm:`\n${(0,css_var_1.signalIterator)(((e,n,t)=>`\n.${cn}${t} > .${cn}-cap > .${cn}-cap_prefix,\n.${cn}${t} > .${cn}-cap > .${cn}-cap_suffix,\n.${cn}${t} > .${cn}-cont {\n  border-color: ${n.bdc};\n}\n.${cn}${t} > .${cn}-cap {\n  color: ${n.fc};\n}\n`)).join("")}\n`,neumorphism:`\n${(0,css_var_1.signalIterator)(((e,n,t)=>`\n.${cn}${t} > .${cn}-cap {\n  background: ${n.head.bgc};\n  color: ${n.head.fc};\n}\n`)).join("")}`})}\n`));exports.default=GroupBox;