@kemu-io/hs-react 0.3.3 → 0.3.4

package/cjs/components/BaseWidget.js

@@ -1,6 +1,6 @@
-"use strict";var __importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0});const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("@emotion/react"),WidgetContainer_js_1=__importDefault(require("./WidgetContainer.js")),SettingsBar_js_1=__importDefault(require("./SettingsBar.js")),WidgetBody_js_1=__importDefault(require("./WidgetBody.js")),SvgContainer_js_1=__importDefault(require("./SvgContainer.js")),KemuThemeWrapper_js_1=__importDefault(require("./KemuThemeWrapper.js")),BaseWidget=({children:e,showSettings:t=!0,onOpenSettings:i,width:s=84,height:r=134,iconWidth:n=38,iconHeight:_=38,showIcon:a=!0,customIcon:o,settingsIconColor:u="white",customTheme:l,svgContainerClassName:d,widgetContainerClassName:m,widgetBodyClassName:c})=>(0,jsx_runtime_1.jsx)(KemuThemeWrapper_js_1.default,{theme:l,children:(0,jsx_runtime_1.jsxs)(WidgetContainer_js_1.default,{className:m,width:s,height:r,css:react_1.css`
+"use strict";var __importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0});const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("@emotion/react"),WidgetContainer_js_1=__importDefault(require("./WidgetContainer.js")),SettingsBar_js_1=__importDefault(require("./SettingsBar.js")),WidgetBody_js_1=__importDefault(require("./WidgetBody.js")),SvgContainer_js_1=__importDefault(require("./SvgContainer.js")),KemuThemeWrapper_js_1=__importDefault(require("./KemuThemeWrapper.js")),BaseWidget=({children:e,showSettings:t=!0,onOpenSettings:i,width:s=84,height:r=134,iconWidth:n=38,iconHeight:_=38,showIcon:a=!0,customIcon:o,settingsIconColor:u="white",customTheme:d,svgContainerClassName:l,widgetContainerClassName:m,widgetBodyClassName:c})=>(0,jsx_runtime_1.jsx)(KemuThemeWrapper_js_1.default,{theme:d,children:(0,jsx_runtime_1.jsxs)(WidgetContainer_js_1.default,{className:m,width:s,height:r,css:react_1.css`
           display: flex;
           flex-direction: column;
           align-items: center;
           justify-content: center;
-        `,children:[t&&i&&(0,jsx_runtime_1.jsx)(SettingsBar_js_1.default,{iconColor:u,onSettingsClick:i}),(0,jsx_runtime_1.jsxs)(WidgetBody_js_1.default,{className:c,children:[a&&o&&(0,jsx_runtime_1.jsx)(SvgContainer_js_1.default,{width:n,height:_,className:d,children:o}),e]})]})});exports.default=BaseWidget;
+        `,children:[t&&i&&(0,jsx_runtime_1.jsx)(SettingsBar_js_1.default,{iconColor:u,onSettingsClick:i}),(0,jsx_runtime_1.jsxs)(WidgetBody_js_1.default,{className:c,children:[a&&o&&(0,jsx_runtime_1.jsx)(SvgContainer_js_1.default,{width:n,height:_,className:l,marginTop:t?void 0:0,children:o}),e]})]})});exports.default=BaseWidget;

package/cjs/components/SvgContainer.d.ts

@@ -15,9 +15,10 @@ export interface SvgContainerProps {
 	children?: ReactNode;
 	width?: number;
 	height?: number;
+	marginTop?: number;
 	className?: string;
 }
-declare const SvgContainer: ({ fill, children, width, height, className }: SvgContainerProps) => import("react/jsx-runtime").JSX.Element;
+declare const SvgContainer: ({ fill, children, width, height, className, marginTop }: SvgContainerProps) => import("react/jsx-runtime").JSX.Element;
 
 export {
 	SvgContainer as default,

package/cjs/components/SvgContainer.js

@@ -1,9 +1,9 @@
 "use strict";var __importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0});const jsx_runtime_1=require("react/jsx-runtime"),styled_1=__importDefault(require("@emotion/styled")),StyledSvgContainer=styled_1.default.div`
   fill: ${e=>e.fill||"white"};
-  margin-top: 10px;
+  margin-top: ${e=>e.marginTop||10}px;
 
   svg {
     width: ${e=>e.width||38}px;
     height: ${e=>e.height||38}px;
   }
-`,SvgContainer=({fill:e,children:t,width:i,height:l,className:r})=>(0,jsx_runtime_1.jsx)(StyledSvgContainer,{fill:e,width:i,height:l,className:r,children:t});exports.default=SvgContainer;
+`,SvgContainer=({fill:e,children:t,width:i,height:r,className:l,marginTop:n})=>(0,jsx_runtime_1.jsx)(StyledSvgContainer,{fill:e,width:i,height:r,className:l,marginTop:n,children:t});exports.default=SvgContainer;

package/cjs/components/index.d.ts

@@ -373,9 +373,10 @@ export interface SvgContainerProps {
 	children?: React$1.ReactNode;
 	width?: number;
 	height?: number;
+	marginTop?: number;
 	className?: string;
 }
-export declare const SvgContainer: ({ fill, children, width, height, className }: SvgContainerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SvgContainer: ({ fill, children, width, height, className, marginTop }: SvgContainerProps) => import("react/jsx-runtime").JSX.Element;
 /**
  * A container for widget body content. Provides centered flexbox layout with padding.
  *

package/mjs/components/BaseWidget.js

@@ -3,4 +3,4 @@ import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";import{css}from"@emotio
           flex-direction: column;
           align-items: center;
           justify-content: center;
-        `,children:[t&&i&&_jsx(SettingsBar,{iconColor:c,onSettingsClick:i}),_jsxs(WidgetBody,{className:l,children:[a&&m&&_jsx(SvgContainer,{width:n,height:r,className:g,children:m}),e]})]})});export default BaseWidget;
+        `,children:[t&&i&&_jsx(SettingsBar,{iconColor:c,onSettingsClick:i}),_jsxs(WidgetBody,{className:l,children:[a&&m&&_jsx(SvgContainer,{width:n,height:r,className:g,marginTop:t?void 0:0,children:m}),e]})]})});export default BaseWidget;

package/mjs/components/SvgContainer.d.ts

@@ -15,9 +15,10 @@ export interface SvgContainerProps {
 	children?: ReactNode;
 	width?: number;
 	height?: number;
+	marginTop?: number;
 	className?: string;
 }
-declare const SvgContainer: ({ fill, children, width, height, className }: SvgContainerProps) => import("react/jsx-runtime").JSX.Element;
+declare const SvgContainer: ({ fill, children, width, height, className, marginTop }: SvgContainerProps) => import("react/jsx-runtime").JSX.Element;
 
 export {
 	SvgContainer as default,

package/mjs/components/SvgContainer.js

@@ -1,9 +1,9 @@
 import{jsx as _jsx}from"react/jsx-runtime";import styled from"@emotion/styled";const StyledSvgContainer=styled.div`
-  fill: ${t=>t.fill||"white"};
-  margin-top: 10px;
+  fill: ${i=>i.fill||"white"};
+  margin-top: ${i=>i.marginTop||10}px;
 
   svg {
-    width: ${t=>t.width||38}px;
-    height: ${t=>t.height||38}px;
+    width: ${i=>i.width||38}px;
+    height: ${i=>i.height||38}px;
   }
-`,SvgContainer=({fill:t,children:i,width:e,height:l,className:h})=>_jsx(StyledSvgContainer,{fill:t,width:e,height:l,className:h,children:i});export default SvgContainer;
+`,SvgContainer=({fill:i,children:t,width:e,height:l,className:n,marginTop:r})=>_jsx(StyledSvgContainer,{fill:i,width:e,height:l,className:n,marginTop:r,children:t});export default SvgContainer;

package/mjs/components/index.d.ts

@@ -373,9 +373,10 @@ export interface SvgContainerProps {
 	children?: React$1.ReactNode;
 	width?: number;
 	height?: number;
+	marginTop?: number;
 	className?: string;
 }
-export declare const SvgContainer: ({ fill, children, width, height, className }: SvgContainerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SvgContainer: ({ fill, children, width, height, className, marginTop }: SvgContainerProps) => import("react/jsx-runtime").JSX.Element;
 /**
  * A container for widget body content. Provides centered flexbox layout with padding.
  *

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@kemu-io/hs-react",
   "type": "module",
-  "version": "0.3.3",
+  "version": "0.3.4",
   "description": "Kemu Hub Service library for React",
   "author": "Kemu Pty Ltd",
   "main": "cjs/WidgetWrapper.js",