@bizhermit/react-sdk
Version:
React SDK
1 lines • 3.14 kB
JavaScript
;var __createBinding=this&&this.__createBinding||(Object.create?function(t,e,a,n){void 0===n&&(n=a);var r=Object.getOwnPropertyDescriptor(e,a);r&&!("get"in r?!e.__esModule:r.writable||r.configurable)||(r={enumerable:!0,get:function(){return e[a]}}),Object.defineProperty(t,n,r)}:function(t,e,a,n){void 0===n&&(n=a),t[n]=e[a]}),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),__importStar=this&&this.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(null!=t)for(var a in t)"default"!==a&&Object.prototype.hasOwnProperty.call(t,a)&&__createBinding(e,t,a);return __setModuleDefault(e,t),e},__importDefault=this&&this.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.flexBoxCn=void 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-fbx";exports.flexBoxCn=cn;const FlexBox=react_1.default.forwardRef(((t,e)=>react_1.default.createElement(react_1.default.Fragment,null,react_1.default.createElement("div",{...(0,attributes_1.attributes)(t,cn,(0,attributes_1.ftoCn)(t.$fto),t.$scroll?core_style_1.sbCn:""),ref:e,"data-flow":t.$row?"row":"col","data-wrap":(0,attributes_1.dBool)(t.$wrap),"data-posx":(0,attributes_1.dPosX)(t.$left,t.$center,t.$right)??"l","data-posy":(0,attributes_1.dPosY)(t.$top,t.$middle,t.$bottom)??"t","data-border":t.$border,"data-shadow":t.$shadow,"data-radius":t.$radius,"data-padding":t.$padding}),Style))),colCn=`${cn}[data-flow="col"]`,rowCn=`${cn}[data-flow="row"]`,Style=react_1.default.createElement(jsx_style_1.default,{id:cn,depsDesign:!0},(({design:t})=>`\n.${cn} {\n ${css_var_1.CssPV.flex}\n flex: none;\n}\n.${colCn} {\n flex-direction: column;\n}\n.${rowCn} {\n flex-direction: row;\n}\n.${cn}[data-wrap="true"] {\n flex-wrap: wrap;\n}\n.${cn}[data-wrap="false"] {\n flex-wrap: nowrap;\n}\n.${colCn}[data-posx="l"],\n.${rowCn}[data-posy="t"] {\n align-items: flex-start;\n}\n.${colCn}[data-posx="c"],\n.${rowCn}[data-posy="m"] {\n align-items: center;\n}\n.${colCn}[data-posx="r"],\n.${rowCn}[data-posy="b"] {\n align-items: flex-end;\n}\n.${colCn}[data-posy="t"],\n.${rowCn}[data-posx="l"] {\n justify-content: flex-start;\n}\n.${colCn}[data-posy="m"],\n.${rowCn}[data-posx="c"] {\n justify-content: center;\n}\n.${colCn}[data-posy="b"],\n.${rowCn}[data-posx="r"] {\n justify-content: flex-end;\n}\n.${cn}[data-border="true"] {\n border: 1px solid ${css_var_1.default.bdc};\n}\n.${cn}[data-shadow="true"] {\n${(0,css_var_1.switchDesign)(t,{fm:`box-shadow: 0px 3px 3px -2px ${css_var_1.default.sdw.c};`,neumorphism:`box-shadow: ${css_var_1.CssPV.cvxSd};`})}\n}\n.${cn}[data-radius="true"] {\n border-radius: ${css_var_1.default.bdr};\n}\n.${cn}[data-padding="true"] {\n padding: ${css_var_1.default.pdy} ${css_var_1.default.pdx};\n}`));exports.default=FlexBox;