@greenbone/ui-lib 1.3.0 → 1.3.1-alpha0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cjs/components/Layout/SimplePageLayout/SimpleGrid.js +1 -1
- package/lib/cjs/components/Layout/SimplePageLayout/SimpleGrid.js.map +1 -1
- package/lib/cjs/components/Layout/SimplePageLayout/SimpleGrid.module.css +1 -1
- package/lib/cjs/components/Layout/SimplePageLayout/index.js +1 -1
- package/lib/cjs/components/Layout/SimplePageLayout/index.js.map +1 -1
- package/lib/esm/components/Layout/SimplePageLayout/SimpleGrid.js +1 -1
- package/lib/esm/components/Layout/SimplePageLayout/SimpleGrid.js.map +1 -1
- package/lib/esm/components/Layout/SimplePageLayout/SimpleGrid.module.css +1 -1
- package/lib/esm/components/Layout/SimplePageLayout/index.js +1 -1
- package/lib/esm/components/Layout/SimplePageLayout/index.js.map +1 -1
- package/package.json +1 -1
- package/types/src/components/Layout/SimplePageLayout/SimpleGrid.d.ts +1 -0
- package/types/src/components/Layout/SimplePageLayout/SimpleGrid.d.ts.map +1 -1
- package/types/src/components/Layout/SimplePageLayout/index.d.ts.map +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"SimpleGrid",{enumerable:true,get:function(){return SimpleGrid}});const _jsxruntime=require("react/jsx-runtime");const _react=/*#__PURE__*/_interop_require_default(require("react"));const _SimpleGridmodulecss=/*#__PURE__*/_interop_require_default(require("./SimpleGrid.module.css"));function _interop_require_default(obj){return obj&&obj.__esModule?obj:{default:obj}}function _object_without_properties(source,excluded){if(source==null)return{};var target=_object_without_properties_loose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}const SimpleGrid=_param=>{var{config}=_param,styleProps=_object_without_properties(_param,["config"]);return(0,_jsxruntime.jsx)("div",{className
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"SimpleGrid",{enumerable:true,get:function(){return SimpleGrid}});const _jsxruntime=require("react/jsx-runtime");const _react=/*#__PURE__*/_interop_require_default(require("react"));const _SimpleGridmodulecss=/*#__PURE__*/_interop_require_default(require("./SimpleGrid.module.css"));function _interop_require_default(obj){return obj&&obj.__esModule?obj:{default:obj}}function _object_without_properties(source,excluded){if(source==null)return{};var target=_object_without_properties_loose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}const SimpleGrid=_param=>{var{config}=_param,styleProps=_object_without_properties(_param,["config"]);return(0,_jsxruntime.jsx)("div",{className:`${_SimpleGridmodulecss.default["grid-container"]} ${styleProps.hScroll?_SimpleGridmodulecss.default.hScroll:""}`,style:{padding:styleProps.padding||`0 var(--mantine-spacing-md)`,margin:styleProps.margin||"",gridTemplateAreas:`"${styleProps.gridTemplateAreas.join('" "')}"`,gridTemplateColumns:styleProps.gridTemplateColumns,gridTemplateRows:styleProps.gridTemplateRows,gap:styleProps.gap||""},children:Object.entries(config).map(([gridArea,element])=>(0,_jsxruntime.jsx)("div",{className:_SimpleGridmodulecss.default.area,style:{gridArea},children:element},gridArea))})};
|
|
2
2
|
//# sourceMappingURL=SimpleGrid.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/components/Layout/SimplePageLayout/SimpleGrid.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport React, { ReactNode } from \"react\"\nimport classes from \"./SimpleGrid.module.css\"\nexport type TSimpleGridStyling = {\n gridTemplateAreas: string[]\n gridTemplateColumns: string\n gridTemplateRows: string\n gap?: string\n margin?: string\n padding?: string\n}\n\ntype TSimpleGridProps = TSimpleGridStyling & {\n config: Record<string, ReactNode>\n}\n\nexport const SimpleGrid: React.FC<TSimpleGridProps> = ({ config, ...styleProps }) => {\n return (\n <div\n className={classes[\"grid-container\"]}\n style={{\n padding: styleProps.padding || `0 var(--mantine-spacing-md)`,\n margin: styleProps.margin || \"\",\n gridTemplateAreas: `\"${styleProps.gridTemplateAreas.join('\" \"')}\"`,\n gridTemplateColumns: styleProps.gridTemplateColumns,\n gridTemplateRows: styleProps.gridTemplateRows,\n gap: styleProps.gap || \"\",\n }}\n >\n {Object.entries(config).map(([gridArea, element]: [string, ReactNode]) => (\n <div key={gridArea} className={classes.area} style={{ gridArea }}>\n {element}\n </div>\n ))}\n </div>\n )\n}\n"],"names":["SimpleGrid","config","styleProps","div","className","classes","style","padding","margin","gridTemplateAreas","join","gridTemplateColumns","gridTemplateRows","gap","Object","entries","map","gridArea","element","area"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../../../src/components/Layout/SimplePageLayout/SimpleGrid.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport React, { ReactNode } from \"react\"\nimport classes from \"./SimpleGrid.module.css\"\nexport type TSimpleGridStyling = {\n gridTemplateAreas: string[]\n gridTemplateColumns: string\n gridTemplateRows: string\n gap?: string\n margin?: string\n padding?: string\n hScroll?: boolean\n}\n\ntype TSimpleGridProps = TSimpleGridStyling & {\n config: Record<string, ReactNode>\n}\n\n/**\n * Generic grid wrapper that renders areas from a config map.\n * Supports spacing props and optional horizontal scrolling.\n * @param config Mapping of grid-area names to React nodes.\n * @param gridTemplateAreas Array describing grid-template-areas rows.\n * @param gridTemplateColumns CSS grid-template-columns value.\n * @param gridTemplateRows CSS grid-template-rows value.\n * @param gap Optional CSS gap between grid areas.\n * @param margin Optional CSS margin for the grid container.\n * @param padding Optional CSS padding for the grid container.\n * @param hScroll When true, applies a min-width to enable horizontal scrolling on narrow viewports.\n */\nexport const SimpleGrid: React.FC<TSimpleGridProps> = ({ config, ...styleProps }) => {\n return (\n <div\n className={`${classes[\"grid-container\"]} ${styleProps.hScroll ? classes.hScroll : \"\"}`}\n style={{\n padding: styleProps.padding || `0 var(--mantine-spacing-md)`,\n margin: styleProps.margin || \"\",\n gridTemplateAreas: `\"${styleProps.gridTemplateAreas.join('\" \"')}\"`,\n gridTemplateColumns: styleProps.gridTemplateColumns,\n gridTemplateRows: styleProps.gridTemplateRows,\n gap: styleProps.gap || \"\",\n }}\n >\n {Object.entries(config).map(([gridArea, element]: [string, ReactNode]) => (\n <div key={gridArea} className={classes.area} style={{ gridArea }}>\n {element}\n </div>\n ))}\n </div>\n )\n}\n"],"names":["SimpleGrid","config","styleProps","div","className","classes","hScroll","style","padding","margin","gridTemplateAreas","join","gridTemplateColumns","gridTemplateRows","gap","Object","entries","map","gridArea","element","area"],"mappings":"oGAgCaA,oDAAAA,wHA5BoB,mFACb,4zBA2Bb,MAAMA,WAAyC,YAAC,CAAEC,MAAM,CAAiB,QAAZC,8CAAXD,WACvD,MACE,oBAACE,OACCC,UAAW,CAAC,EAAEC,4BAAO,CAAC,iBAAiB,CAAC,CAAC,EAAEH,WAAWI,OAAO,CAAGD,4BAAO,CAACC,OAAO,CAAG,GAAG,CAAC,CACtFC,MAAO,CACLC,QAASN,WAAWM,OAAO,EAAI,CAAC,2BAA2B,CAAC,CAC5DC,OAAQP,WAAWO,MAAM,EAAI,GAC7BC,kBAAmB,CAAC,CAAC,EAAER,WAAWQ,iBAAiB,CAACC,IAAI,CAAC,OAAO,CAAC,CAAC,CAClEC,oBAAqBV,WAAWU,mBAAmB,CACnDC,iBAAkBX,WAAWW,gBAAgB,CAC7CC,IAAKZ,WAAWY,GAAG,EAAI,EACzB,WAECC,OAAOC,OAAO,CAACf,QAAQgB,GAAG,CAAC,CAAC,CAACC,SAAUC,QAA6B,GACnE,oBAAChB,OAAmBC,UAAWC,4BAAO,CAACe,IAAI,CAAEb,MAAO,CAAEW,QAAS,WAC5DC,SADOD,YAMlB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.grid-container{display:grid;height:max-content;padding:var(--grid-container-padding,0 var(--mantine-spacing-md))}.area{height:100%;min-height:max-content;position:relative;width:100%}
|
|
1
|
+
.grid-container{display:grid;height:max-content;padding:var(--grid-container-padding,0 var(--mantine-spacing-md))}.grid-container.hScroll{min-width:calc(60.5625rem*var(--mantine-scale))}.area{height:100%;min-height:max-content;position:relative;width:100%}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:true});function _export(target,all){for(var name in all)Object.defineProperty(target,name,{enumerable:true,get:Object.getOwnPropertyDescriptor(all,name).get})}_export(exports,{get SimplePageLayout(){return SimplePageLayout},get SimplePageLayoutComplex(){return SimplePageLayoutComplex}});const _jsxruntime=require("react/jsx-runtime");const _react=/*#__PURE__*/_interop_require_default(require("react"));const _SimpleGrid=require("./SimpleGrid");const _Typo=require("../../Typo");const _indexmodulecss=/*#__PURE__*/_interop_require_default(require("./index.module.css"));function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _interop_require_default(obj){return obj&&obj.__esModule?obj:{default:obj}}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _object_without_properties(source,excluded){if(source==null)return{};var target=_object_without_properties_loose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}const SimplePageLayout=_param=>{var{children,title,Button,Breadcrumbs}=_param,gridProps=_object_without_properties(_param,["children","title","Button","Breadcrumbs"]);return(0,_jsxruntime.jsx)(_SimpleGrid.SimpleGrid,{config:{title:(0,_jsxruntime.jsx)("div",{className:_indexmodulecss.default.title,children:(0,_jsxruntime.jsx)(_Typo.Typo,{type:"heading2",children:title})}),button:Button?(0,_jsxruntime.jsx)("div",{className:_indexmodulecss.default.button,children:Button}):null,content:(0,_jsxruntime.jsx)("div",{className:_indexmodulecss.default.content,children:children}),breadcrumbs:Breadcrumbs?(0,_jsxruntime.jsx)("div",{className:_indexmodulecss.default.breadcrumbs,children:Breadcrumbs}):null},gridTemplateAreas:[...Breadcrumbs?["breadcrumbs breadcrumbs breadcrumbs"]:[],"title . button","content content content"],gridTemplateColumns:"1fr 1fr 1fr",gridTemplateRows:`${Breadcrumbs?"35px":""} 66px 1fr`,gap:gridProps.gap,margin:"-1rem -1rem 0 -1rem",padding:gridProps.padding})};const SimplePageLayoutComplex=props=>{return(0,_jsxruntime.jsx)(SimplePageLayout,{title:props.title,Button:props.Button,children:(0,_jsxruntime.jsx)(_SimpleGrid.SimpleGrid,_object_spread_props(_object_spread({},props),{padding:props.padding||"0"}))})};
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:true});function _export(target,all){for(var name in all)Object.defineProperty(target,name,{enumerable:true,get:Object.getOwnPropertyDescriptor(all,name).get})}_export(exports,{get SimplePageLayout(){return SimplePageLayout},get SimplePageLayoutComplex(){return SimplePageLayoutComplex}});const _jsxruntime=require("react/jsx-runtime");const _react=/*#__PURE__*/_interop_require_default(require("react"));const _SimpleGrid=require("./SimpleGrid");const _Typo=require("../../Typo");const _indexmodulecss=/*#__PURE__*/_interop_require_default(require("./index.module.css"));function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _interop_require_default(obj){return obj&&obj.__esModule?obj:{default:obj}}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _object_without_properties(source,excluded){if(source==null)return{};var target=_object_without_properties_loose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}const SimplePageLayout=_param=>{var{children,title,Button,Breadcrumbs}=_param,gridProps=_object_without_properties(_param,["children","title","Button","Breadcrumbs"]);return(0,_jsxruntime.jsx)(_SimpleGrid.SimpleGrid,{config:{title:(0,_jsxruntime.jsx)("div",{className:_indexmodulecss.default.title,children:(0,_jsxruntime.jsx)(_Typo.Typo,{type:"heading2",children:title})}),button:Button?(0,_jsxruntime.jsx)("div",{className:_indexmodulecss.default.button,children:Button}):null,content:(0,_jsxruntime.jsx)("div",{className:_indexmodulecss.default.content,children:children}),breadcrumbs:Breadcrumbs?(0,_jsxruntime.jsx)("div",{className:_indexmodulecss.default.breadcrumbs,children:Breadcrumbs}):null},gridTemplateAreas:[...Breadcrumbs?["breadcrumbs breadcrumbs breadcrumbs"]:[],"title . button","content content content"],gridTemplateColumns:"1fr 1fr 1fr",gridTemplateRows:`${Breadcrumbs?"35px":""} 66px 1fr`,gap:gridProps.gap,margin:"-1rem -1rem 0 -1rem",padding:gridProps.padding,hScroll:gridProps.hScroll})};const SimplePageLayoutComplex=props=>{return(0,_jsxruntime.jsx)(SimplePageLayout,{title:props.title,Button:props.Button,hScroll:props.hScroll,children:(0,_jsxruntime.jsx)(_SimpleGrid.SimpleGrid,_object_spread_props(_object_spread({},props),{padding:props.padding||"0"}))})};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/components/Layout/SimplePageLayout/index.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport React, { ReactNode } from \"react\"\nimport { SimpleGrid, TSimpleGridStyling } from \"./SimpleGrid\"\nimport { Typo } from \"../../Typo\"\nimport classes from \"./index.module.css\"\n\nexport type TSimplePageLayoutProps = Partial<TSimpleGridStyling> & {\n title: string\n Button?: ReactNode\n children?: ReactNode\n Breadcrumbs?: ReactNode\n}\n\nexport const SimplePageLayout: React.FC<TSimplePageLayoutProps> = ({\n children,\n title,\n Button,\n Breadcrumbs,\n ...gridProps\n}) => {\n return (\n <SimpleGrid\n config={{\n title: (\n <div className={classes.title}>\n <Typo type=\"heading2\">{title}</Typo>\n </div>\n ),\n button: Button ? <div className={classes.button}>{Button}</div> : null,\n content: <div className={classes.content}>{children}</div>,\n breadcrumbs: Breadcrumbs ? <div className={classes.breadcrumbs}>{Breadcrumbs}</div> : null,\n }}\n gridTemplateAreas={[\n ...(Breadcrumbs ? [\"breadcrumbs breadcrumbs breadcrumbs\"] : []),\n \"title . button\",\n \"content content content\",\n ]}\n gridTemplateColumns={\"1fr 1fr 1fr\"}\n gridTemplateRows={`${Breadcrumbs ? \"35px\" : \"\"} 66px 1fr`}\n gap={gridProps.gap}\n margin={\"-1rem -1rem 0 -1rem\"}\n padding={gridProps.padding}\n />\n )\n}\n\nexport type TSimplePageLayoutComplex = TSimpleGridStyling & {\n title: string\n Button?: ReactNode\n config: Record<string, ReactNode>\n}\n\nexport const SimplePageLayoutComplex = (props: TSimplePageLayoutComplex) => {\n return (\n <SimplePageLayout title={props.title} Button={props.Button}>\n <SimpleGrid {...props} padding={props.padding || \"0\"} />\n </SimplePageLayout>\n )\n}\n"],"names":["SimplePageLayout","SimplePageLayoutComplex","children","title","Button","Breadcrumbs","gridProps","SimpleGrid","config","div","className","classes","Typo","type","button","content","breadcrumbs","gridTemplateAreas","gridTemplateColumns","gridTemplateRows","gap","margin","padding","props"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../../../src/components/Layout/SimplePageLayout/index.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport React, { ReactNode } from \"react\"\nimport { SimpleGrid, TSimpleGridStyling } from \"./SimpleGrid\"\nimport { Typo } from \"../../Typo\"\nimport classes from \"./index.module.css\"\n\nexport type TSimplePageLayoutProps = Partial<TSimpleGridStyling> & {\n title: string\n Button?: ReactNode\n children?: ReactNode\n Breadcrumbs?: ReactNode\n}\n\n/**\n * Renders a simple page layout with title, optional breadcrumbs and action button.\n * Uses a 3-column grid and exposes styling props for spacing and horizontal scroll.\n * @param title Page title displayed as heading2.\n * @param Button Optional action element rendered in the header's right side.\n * @param Breadcrumbs Optional breadcrumbs rendered above the title.\n * @param children Main content area.\n * @param gap Optional CSS gap between grid areas.\n * @param padding Optional padding for the grid container.\n * @param hScroll When true, enforces a min-width to allow horizontal scrolling on smaller viewports.\n */\nexport const SimplePageLayout: React.FC<TSimplePageLayoutProps> = ({\n children,\n title,\n Button,\n Breadcrumbs,\n ...gridProps\n}) => {\n return (\n <SimpleGrid\n config={{\n title: (\n <div className={classes.title}>\n <Typo type=\"heading2\">{title}</Typo>\n </div>\n ),\n button: Button ? <div className={classes.button}>{Button}</div> : null,\n content: <div className={classes.content}>{children}</div>,\n breadcrumbs: Breadcrumbs ? <div className={classes.breadcrumbs}>{Breadcrumbs}</div> : null,\n }}\n gridTemplateAreas={[\n ...(Breadcrumbs ? [\"breadcrumbs breadcrumbs breadcrumbs\"] : []),\n \"title . button\",\n \"content content content\",\n ]}\n gridTemplateColumns={\"1fr 1fr 1fr\"}\n gridTemplateRows={`${Breadcrumbs ? \"35px\" : \"\"} 66px 1fr`}\n gap={gridProps.gap}\n margin={\"-1rem -1rem 0 -1rem\"}\n padding={gridProps.padding}\n hScroll={gridProps.hScroll}\n />\n )\n}\n\nexport type TSimplePageLayoutComplex = TSimpleGridStyling & {\n title: string\n Button?: ReactNode\n config: Record<string, ReactNode>\n}\n\n/**\n * Complex variant that composes SimplePageLayout with a configurable SimpleGrid.\n * Forwards styling props (including hScroll) and renders additional grid areas via config.\n * @param title Page title.\n * @param Button Optional action element rendered in the header's right side.\n * @param config Mapping of grid-area names to React nodes.\n * @param gridTemplateAreas CSS grid-template-areas definition.\n * @param gridTemplateColumns CSS grid-template-columns definition.\n * @param gridTemplateRows CSS grid-template-rows definition.\n * @param gap Optional CSS gap between grid areas.\n * @param margin Optional CSS margin for the grid container.\n * @param padding Optional CSS padding for the grid container (defaults to \"0\" for inner grid).\n * @param hScroll When true, enforces a min-width to allow horizontal scrolling on smaller viewports.\n */\nexport const SimplePageLayoutComplex = (props: TSimplePageLayoutComplex) => {\n return (\n <SimplePageLayout title={props.title} Button={props.Button} hScroll={props.hScroll}>\n <SimpleGrid {...props} padding={props.padding || \"0\"} />\n </SimplePageLayout>\n )\n}\n"],"names":["SimplePageLayout","SimplePageLayoutComplex","children","title","Button","Breadcrumbs","gridProps","SimpleGrid","config","div","className","classes","Typo","type","button","content","breadcrumbs","gridTemplateAreas","gridTemplateColumns","gridTemplateRows","gap","margin","padding","hScroll","props"],"mappings":"mPA2BaA,0BAAAA,sBAsDAC,iCAAAA,qIA7EoB,oCACc,oCAC1B,kFACD,8hEAoBb,MAAMD,iBAAqD,YAAC,CACjEE,QAAQ,CACRC,KAAK,CACLC,MAAM,CACNC,WAAW,CAEZ,QADIC,6CAJHJ,WACAC,QACAC,SACAC,gBAGA,MACE,oBAACE,sBAAU,EACTC,OAAQ,CACNL,MACE,oBAACM,OAAIC,UAAWC,uBAAO,CAACR,KAAK,UAC3B,oBAACS,UAAI,EAACC,KAAK,oBAAYV,UAG3BW,OAAQV,OAAS,oBAACK,OAAIC,UAAWC,uBAAO,CAACG,MAAM,UAAGV,SAAgB,KAClEW,QAAS,oBAACN,OAAIC,UAAWC,uBAAO,CAACI,OAAO,UAAGb,WAC3Cc,YAAaX,YAAc,oBAACI,OAAIC,UAAWC,uBAAO,CAACK,WAAW,UAAGX,cAAqB,IACxF,EACAY,kBAAmB,IACbZ,YAAc,CAAC,sCAAsC,CAAG,EAAE,CAC9D,iBACA,0BACD,CACDa,oBAAqB,cACrBC,iBAAkB,CAAC,EAAEd,YAAc,OAAS,GAAG,SAAS,CAAC,CACzDe,IAAKd,UAAUc,GAAG,CAClBC,OAAQ,sBACRC,QAAShB,UAAUgB,OAAO,CAC1BC,QAASjB,UAAUiB,OAAO,EAGhC,EAsBO,MAAMtB,wBAA0B,AAACuB,QACtC,MACE,oBAACxB,kBAAiBG,MAAOqB,MAAMrB,KAAK,CAAEC,OAAQoB,MAAMpB,MAAM,CAAEmB,QAASC,MAAMD,OAAO,UAChF,oBAAChB,sBAAU,wCAAKiB,QAAOF,QAASE,MAAMF,OAAO,EAAI,QAGvD"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
function _object_without_properties(source,excluded){if(source==null)return{};var target=_object_without_properties_loose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}import{jsx as _jsx}from"react/jsx-runtime";import React from"react";import classes from"./SimpleGrid.module.css";export const SimpleGrid=_param=>{var{config}=_param,styleProps=_object_without_properties(_param,["config"]);return _jsx("div",{className
|
|
1
|
+
function _object_without_properties(source,excluded){if(source==null)return{};var target=_object_without_properties_loose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}import{jsx as _jsx}from"react/jsx-runtime";import React from"react";import classes from"./SimpleGrid.module.css";export const SimpleGrid=_param=>{var{config}=_param,styleProps=_object_without_properties(_param,["config"]);return _jsx("div",{className:`${classes["grid-container"]} ${styleProps.hScroll?classes.hScroll:""}`,style:{padding:styleProps.padding||`0 var(--mantine-spacing-md)`,margin:styleProps.margin||"",gridTemplateAreas:`"${styleProps.gridTemplateAreas.join('" "')}"`,gridTemplateColumns:styleProps.gridTemplateColumns,gridTemplateRows:styleProps.gridTemplateRows,gap:styleProps.gap||""},children:Object.entries(config).map(([gridArea,element])=>_jsx("div",{className:classes.area,style:{gridArea},children:element},gridArea))})};
|
|
2
2
|
//# sourceMappingURL=SimpleGrid.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/components/Layout/SimplePageLayout/SimpleGrid.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport React, { ReactNode } from \"react\"\nimport classes from \"./SimpleGrid.module.css\"\nexport type TSimpleGridStyling = {\n gridTemplateAreas: string[]\n gridTemplateColumns: string\n gridTemplateRows: string\n gap?: string\n margin?: string\n padding?: string\n}\n\ntype TSimpleGridProps = TSimpleGridStyling & {\n config: Record<string, ReactNode>\n}\n\nexport const SimpleGrid: React.FC<TSimpleGridProps> = ({ config, ...styleProps }) => {\n return (\n <div\n className={classes[\"grid-container\"]}\n style={{\n padding: styleProps.padding || `0 var(--mantine-spacing-md)`,\n margin: styleProps.margin || \"\",\n gridTemplateAreas: `\"${styleProps.gridTemplateAreas.join('\" \"')}\"`,\n gridTemplateColumns: styleProps.gridTemplateColumns,\n gridTemplateRows: styleProps.gridTemplateRows,\n gap: styleProps.gap || \"\",\n }}\n >\n {Object.entries(config).map(([gridArea, element]: [string, ReactNode]) => (\n <div key={gridArea} className={classes.area} style={{ gridArea }}>\n {element}\n </div>\n ))}\n </div>\n )\n}\n"],"names":["React","classes","SimpleGrid","config","styleProps","div","className","style","padding","margin","gridTemplateAreas","join","gridTemplateColumns","gridTemplateRows","gap","Object","entries","map","gridArea","element","area"],"mappings":"svBAIA,QAAOA,UAA0B,OAAO,AACxC,QAAOC,YAAa,yBAAyB,
|
|
1
|
+
{"version":3,"sources":["../../../../../src/components/Layout/SimplePageLayout/SimpleGrid.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport React, { ReactNode } from \"react\"\nimport classes from \"./SimpleGrid.module.css\"\nexport type TSimpleGridStyling = {\n gridTemplateAreas: string[]\n gridTemplateColumns: string\n gridTemplateRows: string\n gap?: string\n margin?: string\n padding?: string\n hScroll?: boolean\n}\n\ntype TSimpleGridProps = TSimpleGridStyling & {\n config: Record<string, ReactNode>\n}\n\n/**\n * Generic grid wrapper that renders areas from a config map.\n * Supports spacing props and optional horizontal scrolling.\n * @param config Mapping of grid-area names to React nodes.\n * @param gridTemplateAreas Array describing grid-template-areas rows.\n * @param gridTemplateColumns CSS grid-template-columns value.\n * @param gridTemplateRows CSS grid-template-rows value.\n * @param gap Optional CSS gap between grid areas.\n * @param margin Optional CSS margin for the grid container.\n * @param padding Optional CSS padding for the grid container.\n * @param hScroll When true, applies a min-width to enable horizontal scrolling on narrow viewports.\n */\nexport const SimpleGrid: React.FC<TSimpleGridProps> = ({ config, ...styleProps }) => {\n return (\n <div\n className={`${classes[\"grid-container\"]} ${styleProps.hScroll ? classes.hScroll : \"\"}`}\n style={{\n padding: styleProps.padding || `0 var(--mantine-spacing-md)`,\n margin: styleProps.margin || \"\",\n gridTemplateAreas: `\"${styleProps.gridTemplateAreas.join('\" \"')}\"`,\n gridTemplateColumns: styleProps.gridTemplateColumns,\n gridTemplateRows: styleProps.gridTemplateRows,\n gap: styleProps.gap || \"\",\n }}\n >\n {Object.entries(config).map(([gridArea, element]: [string, ReactNode]) => (\n <div key={gridArea} className={classes.area} style={{ gridArea }}>\n {element}\n </div>\n ))}\n </div>\n )\n}\n"],"names":["React","classes","SimpleGrid","config","styleProps","div","className","hScroll","style","padding","margin","gridTemplateAreas","join","gridTemplateColumns","gridTemplateRows","gap","Object","entries","map","gridArea","element","area"],"mappings":"svBAIA,QAAOA,UAA0B,OAAO,AACxC,QAAOC,YAAa,yBAAyB,AA2B7C,QAAO,MAAMC,WAAyC,YAAC,CAAEC,MAAM,CAAiB,QAAZC,8CAAXD,WACvD,OACE,KAACE,OACCC,UAAW,CAAC,EAAEL,OAAO,CAAC,iBAAiB,CAAC,CAAC,EAAEG,WAAWG,OAAO,CAAGN,QAAQM,OAAO,CAAG,GAAG,CAAC,CACtFC,MAAO,CACLC,QAASL,WAAWK,OAAO,EAAI,CAAC,2BAA2B,CAAC,CAC5DC,OAAQN,WAAWM,MAAM,EAAI,GAC7BC,kBAAmB,CAAC,CAAC,EAAEP,WAAWO,iBAAiB,CAACC,IAAI,CAAC,OAAO,CAAC,CAAC,CAClEC,oBAAqBT,WAAWS,mBAAmB,CACnDC,iBAAkBV,WAAWU,gBAAgB,CAC7CC,IAAKX,WAAWW,GAAG,EAAI,EACzB,WAECC,OAAOC,OAAO,CAACd,QAAQe,GAAG,CAAC,CAAC,CAACC,SAAUC,QAA6B,GACnE,KAACf,OAAmBC,UAAWL,QAAQoB,IAAI,CAAEb,MAAO,CAAEW,QAAS,WAC5DC,SADOD,YAMlB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.grid-container{display:grid;height:max-content;padding:var(--grid-container-padding,0 var(--mantine-spacing-md))}.area{height:100%;min-height:max-content;position:relative;width:100%}
|
|
1
|
+
.grid-container{display:grid;height:max-content;padding:var(--grid-container-padding,0 var(--mantine-spacing-md))}.grid-container.hScroll{min-width:calc(60.5625rem*var(--mantine-scale))}.area{height:100%;min-height:max-content;position:relative;width:100%}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _object_without_properties(source,excluded){if(source==null)return{};var target=_object_without_properties_loose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}import{jsx as _jsx}from"react/jsx-runtime";import React from"react";import{SimpleGrid}from"./SimpleGrid";import{Typo}from"../../Typo";import classes from"./index.module.css";export const SimplePageLayout=_param=>{var{children,title,Button,Breadcrumbs}=_param,gridProps=_object_without_properties(_param,["children","title","Button","Breadcrumbs"]);return _jsx(SimpleGrid,{config:{title:_jsx("div",{className:classes.title,children:_jsx(Typo,{type:"heading2",children:title})}),button:Button?_jsx("div",{className:classes.button,children:Button}):null,content:_jsx("div",{className:classes.content,children:children}),breadcrumbs:Breadcrumbs?_jsx("div",{className:classes.breadcrumbs,children:Breadcrumbs}):null},gridTemplateAreas:[...Breadcrumbs?["breadcrumbs breadcrumbs breadcrumbs"]:[],"title . button","content content content"],gridTemplateColumns:"1fr 1fr 1fr",gridTemplateRows:`${Breadcrumbs?"35px":""} 66px 1fr`,gap:gridProps.gap,margin:"-1rem -1rem 0 -1rem",padding:gridProps.padding})};export const SimplePageLayoutComplex=props=>{return _jsx(SimplePageLayout,{title:props.title,Button:props.Button,children:_jsx(SimpleGrid,_object_spread_props(_object_spread({},props),{padding:props.padding||"0"}))})};
|
|
1
|
+
function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _object_without_properties(source,excluded){if(source==null)return{};var target=_object_without_properties_loose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}import{jsx as _jsx}from"react/jsx-runtime";import React from"react";import{SimpleGrid}from"./SimpleGrid";import{Typo}from"../../Typo";import classes from"./index.module.css";export const SimplePageLayout=_param=>{var{children,title,Button,Breadcrumbs}=_param,gridProps=_object_without_properties(_param,["children","title","Button","Breadcrumbs"]);return _jsx(SimpleGrid,{config:{title:_jsx("div",{className:classes.title,children:_jsx(Typo,{type:"heading2",children:title})}),button:Button?_jsx("div",{className:classes.button,children:Button}):null,content:_jsx("div",{className:classes.content,children:children}),breadcrumbs:Breadcrumbs?_jsx("div",{className:classes.breadcrumbs,children:Breadcrumbs}):null},gridTemplateAreas:[...Breadcrumbs?["breadcrumbs breadcrumbs breadcrumbs"]:[],"title . button","content content content"],gridTemplateColumns:"1fr 1fr 1fr",gridTemplateRows:`${Breadcrumbs?"35px":""} 66px 1fr`,gap:gridProps.gap,margin:"-1rem -1rem 0 -1rem",padding:gridProps.padding,hScroll:gridProps.hScroll})};export const SimplePageLayoutComplex=props=>{return _jsx(SimplePageLayout,{title:props.title,Button:props.Button,hScroll:props.hScroll,children:_jsx(SimpleGrid,_object_spread_props(_object_spread({},props),{padding:props.padding||"0"}))})};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/components/Layout/SimplePageLayout/index.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport React, { ReactNode } from \"react\"\nimport { SimpleGrid, TSimpleGridStyling } from \"./SimpleGrid\"\nimport { Typo } from \"../../Typo\"\nimport classes from \"./index.module.css\"\n\nexport type TSimplePageLayoutProps = Partial<TSimpleGridStyling> & {\n title: string\n Button?: ReactNode\n children?: ReactNode\n Breadcrumbs?: ReactNode\n}\n\nexport const SimplePageLayout: React.FC<TSimplePageLayoutProps> = ({\n children,\n title,\n Button,\n Breadcrumbs,\n ...gridProps\n}) => {\n return (\n <SimpleGrid\n config={{\n title: (\n <div className={classes.title}>\n <Typo type=\"heading2\">{title}</Typo>\n </div>\n ),\n button: Button ? <div className={classes.button}>{Button}</div> : null,\n content: <div className={classes.content}>{children}</div>,\n breadcrumbs: Breadcrumbs ? <div className={classes.breadcrumbs}>{Breadcrumbs}</div> : null,\n }}\n gridTemplateAreas={[\n ...(Breadcrumbs ? [\"breadcrumbs breadcrumbs breadcrumbs\"] : []),\n \"title . button\",\n \"content content content\",\n ]}\n gridTemplateColumns={\"1fr 1fr 1fr\"}\n gridTemplateRows={`${Breadcrumbs ? \"35px\" : \"\"} 66px 1fr`}\n gap={gridProps.gap}\n margin={\"-1rem -1rem 0 -1rem\"}\n padding={gridProps.padding}\n />\n )\n}\n\nexport type TSimplePageLayoutComplex = TSimpleGridStyling & {\n title: string\n Button?: ReactNode\n config: Record<string, ReactNode>\n}\n\nexport const SimplePageLayoutComplex = (props: TSimplePageLayoutComplex) => {\n return (\n <SimplePageLayout title={props.title} Button={props.Button}>\n <SimpleGrid {...props} padding={props.padding || \"0\"} />\n </SimplePageLayout>\n )\n}\n"],"names":["React","SimpleGrid","Typo","classes","SimplePageLayout","children","title","Button","Breadcrumbs","gridProps","config","div","className","type","button","content","breadcrumbs","gridTemplateAreas","gridTemplateColumns","gridTemplateRows","gap","margin","padding","SimplePageLayoutComplex","props"],"mappings":"69DAIA,QAAOA,UAA0B,OAAO,AACxC,QAASC,UAAU,KAA4B,cAAc,AAC7D,QAASC,IAAI,KAAQ,YAAY,AACjC,QAAOC,YAAa,oBAAoB,
|
|
1
|
+
{"version":3,"sources":["../../../../../src/components/Layout/SimplePageLayout/index.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport React, { ReactNode } from \"react\"\nimport { SimpleGrid, TSimpleGridStyling } from \"./SimpleGrid\"\nimport { Typo } from \"../../Typo\"\nimport classes from \"./index.module.css\"\n\nexport type TSimplePageLayoutProps = Partial<TSimpleGridStyling> & {\n title: string\n Button?: ReactNode\n children?: ReactNode\n Breadcrumbs?: ReactNode\n}\n\n/**\n * Renders a simple page layout with title, optional breadcrumbs and action button.\n * Uses a 3-column grid and exposes styling props for spacing and horizontal scroll.\n * @param title Page title displayed as heading2.\n * @param Button Optional action element rendered in the header's right side.\n * @param Breadcrumbs Optional breadcrumbs rendered above the title.\n * @param children Main content area.\n * @param gap Optional CSS gap between grid areas.\n * @param padding Optional padding for the grid container.\n * @param hScroll When true, enforces a min-width to allow horizontal scrolling on smaller viewports.\n */\nexport const SimplePageLayout: React.FC<TSimplePageLayoutProps> = ({\n children,\n title,\n Button,\n Breadcrumbs,\n ...gridProps\n}) => {\n return (\n <SimpleGrid\n config={{\n title: (\n <div className={classes.title}>\n <Typo type=\"heading2\">{title}</Typo>\n </div>\n ),\n button: Button ? <div className={classes.button}>{Button}</div> : null,\n content: <div className={classes.content}>{children}</div>,\n breadcrumbs: Breadcrumbs ? <div className={classes.breadcrumbs}>{Breadcrumbs}</div> : null,\n }}\n gridTemplateAreas={[\n ...(Breadcrumbs ? [\"breadcrumbs breadcrumbs breadcrumbs\"] : []),\n \"title . button\",\n \"content content content\",\n ]}\n gridTemplateColumns={\"1fr 1fr 1fr\"}\n gridTemplateRows={`${Breadcrumbs ? \"35px\" : \"\"} 66px 1fr`}\n gap={gridProps.gap}\n margin={\"-1rem -1rem 0 -1rem\"}\n padding={gridProps.padding}\n hScroll={gridProps.hScroll}\n />\n )\n}\n\nexport type TSimplePageLayoutComplex = TSimpleGridStyling & {\n title: string\n Button?: ReactNode\n config: Record<string, ReactNode>\n}\n\n/**\n * Complex variant that composes SimplePageLayout with a configurable SimpleGrid.\n * Forwards styling props (including hScroll) and renders additional grid areas via config.\n * @param title Page title.\n * @param Button Optional action element rendered in the header's right side.\n * @param config Mapping of grid-area names to React nodes.\n * @param gridTemplateAreas CSS grid-template-areas definition.\n * @param gridTemplateColumns CSS grid-template-columns definition.\n * @param gridTemplateRows CSS grid-template-rows definition.\n * @param gap Optional CSS gap between grid areas.\n * @param margin Optional CSS margin for the grid container.\n * @param padding Optional CSS padding for the grid container (defaults to \"0\" for inner grid).\n * @param hScroll When true, enforces a min-width to allow horizontal scrolling on smaller viewports.\n */\nexport const SimplePageLayoutComplex = (props: TSimplePageLayoutComplex) => {\n return (\n <SimplePageLayout title={props.title} Button={props.Button} hScroll={props.hScroll}>\n <SimpleGrid {...props} padding={props.padding || \"0\"} />\n </SimplePageLayout>\n )\n}\n"],"names":["React","SimpleGrid","Typo","classes","SimplePageLayout","children","title","Button","Breadcrumbs","gridProps","config","div","className","type","button","content","breadcrumbs","gridTemplateAreas","gridTemplateColumns","gridTemplateRows","gap","margin","padding","hScroll","SimplePageLayoutComplex","props"],"mappings":"69DAIA,QAAOA,UAA0B,OAAO,AACxC,QAASC,UAAU,KAA4B,cAAc,AAC7D,QAASC,IAAI,KAAQ,YAAY,AACjC,QAAOC,YAAa,oBAAoB,AAoBxC,QAAO,MAAMC,iBAAqD,YAAC,CACjEC,QAAQ,CACRC,KAAK,CACLC,MAAM,CACNC,WAAW,CAEZ,QADIC,6CAJHJ,WACAC,QACAC,SACAC,gBAGA,OACE,KAACP,YACCS,OAAQ,CACNJ,MACE,KAACK,OAAIC,UAAWT,QAAQG,KAAK,UAC3B,KAACJ,MAAKW,KAAK,oBAAYP,UAG3BQ,OAAQP,OAAS,KAACI,OAAIC,UAAWT,QAAQW,MAAM,UAAGP,SAAgB,KAClEQ,QAAS,KAACJ,OAAIC,UAAWT,QAAQY,OAAO,UAAGV,WAC3CW,YAAaR,YAAc,KAACG,OAAIC,UAAWT,QAAQa,WAAW,UAAGR,cAAqB,IACxF,EACAS,kBAAmB,IACbT,YAAc,CAAC,sCAAsC,CAAG,EAAE,CAC9D,iBACA,0BACD,CACDU,oBAAqB,cACrBC,iBAAkB,CAAC,EAAEX,YAAc,OAAS,GAAG,SAAS,CAAC,CACzDY,IAAKX,UAAUW,GAAG,CAClBC,OAAQ,sBACRC,QAASb,UAAUa,OAAO,CAC1BC,QAASd,UAAUc,OAAO,EAGhC,CAAC,AAsBD,QAAO,MAAMC,wBAA0B,AAACC,QACtC,OACE,KAACrB,kBAAiBE,MAAOmB,MAAMnB,KAAK,CAAEC,OAAQkB,MAAMlB,MAAM,CAAEgB,QAASE,MAAMF,OAAO,UAChF,KAACtB,kDAAewB,QAAOH,QAASG,MAAMH,OAAO,EAAI,QAGvD,CAAC"}
|
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SimpleGrid.d.ts","sourceRoot":"","sources":["../../../../../src/components/Layout/SimplePageLayout/SimpleGrid.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAExC,MAAM,MAAM,kBAAkB,GAAG;IAC/B,iBAAiB,EAAE,MAAM,EAAE,CAAA;IAC3B,mBAAmB,EAAE,MAAM,CAAA;IAC3B,gBAAgB,EAAE,MAAM,CAAA;IACxB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,OAAO,CAAC,EAAE,MAAM,CAAA;
|
|
1
|
+
{"version":3,"file":"SimpleGrid.d.ts","sourceRoot":"","sources":["../../../../../src/components/Layout/SimplePageLayout/SimpleGrid.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAExC,MAAM,MAAM,kBAAkB,GAAG;IAC/B,iBAAiB,EAAE,MAAM,EAAE,CAAA;IAC3B,mBAAmB,EAAE,MAAM,CAAA;IAC3B,gBAAgB,EAAE,MAAM,CAAA;IACxB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAA;AAED,KAAK,gBAAgB,GAAG,kBAAkB,GAAG;IAC3C,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAA;CAClC,CAAA;AAcD,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAoBjD,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Layout/SimplePageLayout/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACxC,OAAO,EAAc,kBAAkB,EAAE,MAAM,cAAc,CAAA;AAI7D,MAAM,MAAM,sBAAsB,GAAG,OAAO,CAAC,kBAAkB,CAAC,GAAG;IACjE,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,WAAW,CAAC,EAAE,SAAS,CAAA;CACxB,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Layout/SimplePageLayout/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACxC,OAAO,EAAc,kBAAkB,EAAE,MAAM,cAAc,CAAA;AAI7D,MAAM,MAAM,sBAAsB,GAAG,OAAO,CAAC,kBAAkB,CAAC,GAAG;IACjE,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,WAAW,CAAC,EAAE,SAAS,CAAA;CACxB,CAAA;AAaD,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAgC7D,CAAA;AAED,MAAM,MAAM,wBAAwB,GAAG,kBAAkB,GAAG;IAC1D,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAA;CAClC,CAAA;AAgBD,eAAO,MAAM,uBAAuB,GAAI,OAAO,wBAAwB,4CAMtE,CAAA"}
|