@bouku/core 0.0.9 → 0.1.0

package/dist/components/layout/section.d.ts

@@ -1,15 +1,17 @@
-import { ReactNode } from "react";
+type Props = {
+    style?: string;
+    title: string;
+    children: React.ReactNode;
+};
 /**
- * Settings Section Component.
+ * Layout Section Component.
  *
- * Generic layout wrapper used to group related settings or content
- * under a titled section with a visual separator for consistency.
+ * Generic layout wrapper used to group related content under
+ * a titled section with a visual separator for consistency.
  *
- * @param {string} title - The section title displayed at top.
- * @param {ReactNode} content - Rendered below the separator.
+ * @param style - Custom classes for the content container.
+ * @param title - The section title displayed at top.
+ * @param content - Element(s) rendered below the separator.
 **/
-declare const Section: ({ title, content }: {
-    title: string;
-    content: ReactNode;
-}) => import("react").JSX.Element;
+declare const Section: ({ style, title, children }: Props) => import("react").JSX.Element;
 export default Section;

package/dist/components/layout/section.js

@@ -2,18 +2,22 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
 const flex_1 = require("./flex");
+const separator_1 = require("./separator");
+const style_1 = require("@bouko/style");
 /**
- * Settings Section Component.
+ * Layout Section Component.
  *
- * Generic layout wrapper used to group related settings or content
- * under a titled section with a visual separator for consistency.
+ * Generic layout wrapper used to group related content under
+ * a titled section with a visual separator for consistency.
  *
- * @param {string} title - The section title displayed at top.
- * @param {ReactNode} content - Rendered below the separator.
+ * @param style - Custom classes for the content container.
+ * @param title - The section title displayed at top.
+ * @param content - Element(s) rendered below the separator.
 **/
-const Section = ({ title, content }) => ((0, jsx_runtime_1.jsxs)(flex_1.ColumnBox, { style: styles.container, children: [title, (0, jsx_runtime_1.jsx)("hr", { className: styles.separator }), content] }));
-const styles = {
-    container: "gap-2 items-start text-primary",
-    separator: "mb-2 w-full text-border-dark"
+const Section = ({ style, title, children }) => ((0, jsx_runtime_1.jsxs)(flex_1.ColumnBox, { style: s.container, children: [(0, jsx_runtime_1.jsx)("span", { className: s.title, children: title }), (0, jsx_runtime_1.jsx)(separator_1.Separator, { style: "mb-2" }), (0, jsx_runtime_1.jsx)("div", { className: (0, style_1.cn)(s.content, style), children: children })] }));
+const s = {
+    container: "gap-3 w-full",
+    title: "text-xl font-bold text-primary",
+    content: "w-full"
 };
 exports.default = Section;

package/dist/components/layout/separator.d.ts

@@ -1,3 +1,4 @@
-export default function Separator({ style }: {
+export declare function Separator({ style }: {
     style?: string;
 }): import("react").JSX.Element;
+export default Separator;

package/dist/components/layout/separator.js

@@ -1,8 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = Separator;
+exports.Separator = Separator;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const style_1 = require("@bouko/style");
 function Separator({ style }) {
     return (0, jsx_runtime_1.jsx)("hr", { className: (0, style_1.cn)("w-full text-border-dark", style) });
 }
+exports.default = Separator;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bouku/core",
-  "version": "0.0.9",
+  "version": "0.1.0",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "license": "MIT",