@sparkstudio/common-ui 1.0.4 → 1.0.6

package/dist/index.cjs

@@ -20,7 +20,16 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
-  Button: () => Button
+  Body: () => Body,
+  Button: () => Button,
+  ContentContainer: () => ContentContainer,
+  ContentRow: () => ContentRow,
+  Footer: () => Footer,
+  Header: () => Header,
+  HeaderText: () => HeaderText,
+  LayoutWrapper: () => LayoutWrapper,
+  Navigation: () => Navigation,
+  NavigationItem: () => NavigationItem
 });
 module.exports = __toCommonJS(index_exports);
 
@@ -81,8 +90,86 @@ function Button({
     }
   ) });
 }
+
+// src/components/Footer.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function Footer({ children }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("footer", { className: "bg-dark text-white text-center py-2 mt-auto", children: children ?? "\xA9 2025 Your Site \u2014 All rights reserved" });
+}
+
+// src/components/Header.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+function Header({ children }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("nav", { className: "navbar navbar-dark bg-dark px-3 sticky-top", children: children ?? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "navbar-brand mb-0 h4", children: "My Website" }) });
+}
+
+// src/components/HeaderText.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+function HeaderText({ children }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "navbar-brand mb-0 h4", children });
+}
+
+// src/components/Body.tsx
+var import_jsx_runtime5 = require("react/jsx-runtime");
+function Body({ title, description, children }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("main", { className: "col p-4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("h2", { children: title }),
+    description && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { children: description }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "card mt-3", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "card-body", children }) })
+  ] });
+}
+
+// src/components/navigation/Navigation.tsx
+var import_jsx_runtime6 = require("react/jsx-runtime");
+function Navigation({ title = "Navigation", children }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("nav", { className: "col-auto p-3 h-100 d-flex flex-column", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("h6", { className: "text-muted text-uppercase", children: title }),
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("ul", { className: "nav nav-pills flex-column gap-2 mt-3", children })
+  ] });
+}
+
+// src/components/navigation/NavigationItem.tsx
+var import_jsx_runtime7 = require("react/jsx-runtime");
+function NavigationItem({ title, type, active, onClick }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("li", { className: "nav-item", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    "button",
+    {
+      type: "button",
+      className: `nav-link text-start w-100 ${active ? "active" : ""}`,
+      onClick: () => onClick?.(type),
+      children: title
+    }
+  ) });
+}
+
+// src/components/wrappers/ContentContainer.tsx
+var import_jsx_runtime8 = require("react/jsx-runtime");
+function ContentContainer({ children }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "container-fluid flex-grow-1", children });
+}
+
+// src/components/wrappers/ContentRow.tsx
+var import_jsx_runtime9 = require("react/jsx-runtime");
+function ContentRow({ children }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "row h-100 flex-nowrap", children });
+}
+
+// src/components/wrappers/LayoutWrapper.tsx
+var import_jsx_runtime10 = require("react/jsx-runtime");
+function LayoutWrapper({ children }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "d-flex flex-column min-vh-100", children });
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  Button
+  Body,
+  Button,
+  ContentContainer,
+  ContentRow,
+  Footer,
+  Header,
+  HeaderText,
+  LayoutWrapper,
+  Navigation,
+  NavigationItem
 });
 //# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/components/Button.tsx"],"sourcesContent":["export * from \"./components/Button\";","import { useState, type ReactNode, type MouseEvent } from \"react\";\r\nimport \"./Button.scss\";\r\n\r\nexport interface ButtonProps {\r\n  buttonClassName?: string;\r\n  type?: \"button\" | \"submit\" | \"reset\";\r\n  disabled?: boolean;\r\n\r\n  onAction?: () => Promise<unknown>;\r\n  onClick?: (event: MouseEvent<HTMLButtonElement>) => void;\r\n  onDone?: (result: unknown) => void;\r\n  onError?: (error: unknown) => void;\r\n  onFinally?: () => void;\r\n\r\n  children?: ReactNode;\r\n  loadingChildren?: ReactNode;\r\n\r\n  renderContent?: () => ReactNode;\r\n  renderLoading?: () => ReactNode;\r\n\r\n  loadingText?: string;\r\n  showSpinner?: boolean;\r\n}\r\n\r\nexport function Button({\r\n  buttonClassName = \"btn btn-primary btn-lg\",\r\n  type = \"button\",\r\n  disabled = false,\r\n\r\n  onAction,\r\n  onClick,\r\n  onDone,\r\n  onError,\r\n  onFinally,\r\n\r\n  children = \"Click me\",\r\n\r\n  loadingChildren,\r\n  renderContent,\r\n  renderLoading,\r\n\r\n  loadingText = \"Loading...\",\r\n  showSpinner = true,\r\n}: ButtonProps) {\r\n  const [loading, setLoading] = useState(false);\r\n\r\n  const handleClick = async (event: MouseEvent<HTMLButtonElement>) => {\r\n    if (loading) return;\r\n\r\n    onClick?.(event);\r\n    if (event.defaultPrevented) return;\r\n    if (!onAction) return;\r\n\r\n    try {\r\n      setLoading(true);\r\n      const result = await onAction();\r\n      onDone?.(result);\r\n    } catch (error) {\r\n      onError?.(error);\r\n    } finally {\r\n      setLoading(false);\r\n      onFinally?.();\r\n    }\r\n  };\r\n\r\n  return (\r\n    <div className={`w-100 text-center mb-3`}>\r\n      <button\r\n        type={type}\r\n        className={`${buttonClassName} ${loading ? \"async-btn--loading\" : \"\"}`}\r\n        onClick={handleClick}\r\n        disabled={disabled || loading}\r\n      >\r\n        {loading ? (\r\n          renderLoading?.() ??\r\n          loadingChildren ?? (\r\n            <>\r\n              {showSpinner && (\r\n                <span\r\n                  className=\"spinner-border spinner-border-sm me-2 async-btn__spinner\"\r\n                  role=\"status\"\r\n                  aria-hidden=\"true\"\r\n                />\r\n              )}\r\n              {loadingText}\r\n            </>\r\n          )\r\n        ) : (\r\n          renderContent?.() ?? children\r\n        )}\r\n      </button>\r\n    </div>\r\n  );\r\n}\r\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAA0D;AA4E9C;AApDL,SAAS,OAAO;AAAA,EACrB,kBAAkB;AAAA,EAClB,OAAO;AAAA,EACP,WAAW;AAAA,EAEX;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAEA,WAAW;AAAA,EAEX;AAAA,EACA;AAAA,EACA;AAAA,EAEA,cAAc;AAAA,EACd,cAAc;AAChB,GAAgB;AACd,QAAM,CAAC,SAAS,UAAU,QAAI,uBAAS,KAAK;AAE5C,QAAM,cAAc,OAAO,UAAyC;AAClE,QAAI,QAAS;AAEb,cAAU,KAAK;AACf,QAAI,MAAM,iBAAkB;AAC5B,QAAI,CAAC,SAAU;AAEf,QAAI;AACF,iBAAW,IAAI;AACf,YAAM,SAAS,MAAM,SAAS;AAC9B,eAAS,MAAM;AAAA,IACjB,SAAS,OAAO;AACd,gBAAU,KAAK;AAAA,IACjB,UAAE;AACA,iBAAW,KAAK;AAChB,kBAAY;AAAA,IACd;AAAA,EACF;AAEA,SACE,4CAAC,SAAI,WAAW,0BACd;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW,GAAG,eAAe,IAAI,UAAU,uBAAuB,EAAE;AAAA,MACpE,SAAS;AAAA,MACT,UAAU,YAAY;AAAA,MAErB,oBACC,gBAAgB,KAChB,mBACE,4EACG;AAAA,uBACC;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,MAAK;AAAA,YACL,eAAY;AAAA;AAAA,QACd;AAAA,QAED;AAAA,SACH,IAGF,gBAAgB,KAAK;AAAA;AAAA,EAEzB,GACF;AAEJ;","names":[]}
+{"version":3,"sources":["../src/index.ts","../src/components/Button.tsx","../src/components/Footer.tsx","../src/components/Header.tsx","../src/components/HeaderText.tsx","../src/components/Body.tsx","../src/components/navigation/Navigation.tsx","../src/components/navigation/NavigationItem.tsx","../src/components/wrappers/ContentContainer.tsx","../src/components/wrappers/ContentRow.tsx","../src/components/wrappers/LayoutWrapper.tsx"],"sourcesContent":["export * from \"./components/Button\";\r\nexport * from \"./components/Footer\";\r\nexport * from \"./components/Header\";\r\nexport * from \"./components/HeaderText\";\r\nexport * from \"./components/Body\";\r\n\r\nexport * from \"./components/navigation/Navigation\";\r\nexport * from \"./components/navigation/NavigationItem\";\r\n\r\nexport * from \"./components/wrappers/ContentContainer\";\r\nexport * from \"./components/wrappers/ContentRow\";\r\nexport * from \"./components/wrappers/LayoutWrapper\";","import { useState, type ReactNode, type MouseEvent } from \"react\";\r\n\r\nexport interface ButtonProps {\r\n  buttonClassName?: string;\r\n  type?: \"button\" | \"submit\" | \"reset\";\r\n  disabled?: boolean;\r\n\r\n  onAction?: () => Promise<unknown>;\r\n  onClick?: (event: MouseEvent<HTMLButtonElement>) => void;\r\n  onDone?: (result: unknown) => void;\r\n  onError?: (error: unknown) => void;\r\n  onFinally?: () => void;\r\n\r\n  children?: ReactNode;\r\n  loadingChildren?: ReactNode;\r\n\r\n  renderContent?: () => ReactNode;\r\n  renderLoading?: () => ReactNode;\r\n\r\n  loadingText?: string;\r\n  showSpinner?: boolean;\r\n}\r\n\r\nexport function Button({\r\n  buttonClassName = \"btn btn-primary btn-lg\",\r\n  type = \"button\",\r\n  disabled = false,\r\n\r\n  onAction,\r\n  onClick,\r\n  onDone,\r\n  onError,\r\n  onFinally,\r\n\r\n  children = \"Click me\",\r\n\r\n  loadingChildren,\r\n  renderContent,\r\n  renderLoading,\r\n\r\n  loadingText = \"Loading...\",\r\n  showSpinner = true,\r\n}: ButtonProps) {\r\n  const [loading, setLoading] = useState(false);\r\n\r\n  const handleClick = async (event: MouseEvent<HTMLButtonElement>) => {\r\n    if (loading) return;\r\n\r\n    onClick?.(event);\r\n    if (event.defaultPrevented) return;\r\n    if (!onAction) return;\r\n\r\n    try {\r\n      setLoading(true);\r\n      const result = await onAction();\r\n      onDone?.(result);\r\n    } catch (error) {\r\n      onError?.(error);\r\n    } finally {\r\n      setLoading(false);\r\n      onFinally?.();\r\n    }\r\n  };\r\n\r\n  return (\r\n    <div className={`w-100 text-center mb-3`}>\r\n      <button\r\n        type={type}\r\n        className={`${buttonClassName} ${loading ? \"async-btn--loading\" : \"\"}`}\r\n        onClick={handleClick}\r\n        disabled={disabled || loading}\r\n      >\r\n        {loading ? (\r\n          renderLoading?.() ??\r\n          loadingChildren ?? (\r\n            <>\r\n              {showSpinner && (\r\n                <span\r\n                  className=\"spinner-border spinner-border-sm me-2 async-btn__spinner\"\r\n                  role=\"status\"\r\n                  aria-hidden=\"true\"\r\n                />\r\n              )}\r\n              {loadingText}\r\n            </>\r\n          )\r\n        ) : (\r\n          renderContent?.() ?? children\r\n        )}\r\n      </button>\r\n    </div>\r\n  );\r\n}\r\n","import type { ReactNode } from \"react\";\r\n\r\ninterface FooterProps {\r\n  children?: ReactNode;\r\n}\r\n\r\nexport function Footer({ children }: FooterProps) {\r\n  return (\r\n    <footer className=\"bg-dark text-white text-center py-2 mt-auto\">\r\n      {children ?? \"© 2025 Your Site — All rights reserved\"}\r\n    </footer>\r\n  );\r\n}\r\n","import type { ReactNode } from \"react\";\r\n\r\ninterface HeaderProps {\r\n  children?: ReactNode;\r\n}\r\n\r\nexport function Header({ children }: HeaderProps) {\r\n  return (\r\n    <nav className=\"navbar navbar-dark bg-dark px-3 sticky-top\">\r\n      {children ?? (\r\n        <span className=\"navbar-brand mb-0 h4\">My Website</span>\r\n      )}\r\n    </nav>\r\n  );\r\n}\r\n","import type { ReactNode } from \"react\";\r\n\r\ninterface HeaderBrandProps {\r\n  children: ReactNode;\r\n}\r\n\r\nexport function HeaderText({ children }: HeaderBrandProps) {\r\n  return (\r\n    <span className=\"navbar-brand mb-0 h4\">\r\n      {children}\r\n    </span>\r\n  );\r\n}\r\n","import type { ReactNode } from \"react\";\r\n\r\ninterface BodyProps {\r\n  title: ReactNode;\r\n  description?: ReactNode;\r\n  children?: ReactNode;\r\n}\r\n\r\nexport function Body({ title, description, children }: BodyProps) {\r\n  return (\r\n    <main className=\"col p-4\">\r\n      <h2>{title}</h2>\r\n\r\n      {description && <p>{description}</p>}\r\n\r\n      <div className=\"card mt-3\">\r\n        <div className=\"card-body\">\r\n          {children}\r\n        </div>\r\n      </div>\r\n    </main>\r\n  );\r\n}\r\n","import type { ReactNode } from \"react\";\r\n\r\ninterface NavigationProps {\r\n  title?: ReactNode;\r\n  children: ReactNode;\r\n}\r\n\r\nexport function Navigation({ title = \"Navigation\", children }: NavigationProps) {\r\n  return (\r\n    <nav className=\"col-auto p-3 h-100 d-flex flex-column\">\r\n      <h6 className=\"text-muted text-uppercase\">{title}</h6>\r\n\r\n      <ul className=\"nav nav-pills flex-column gap-2 mt-3\">\r\n        {children}\r\n      </ul>\r\n    </nav>\r\n  );\r\n}\r\n","import type { ReactNode } from \"react\";\r\n\r\ninterface NavigationItemProps {\r\n  title: ReactNode;\r\n  type: string;\r\n  active?: boolean;\r\n  onClick?: (type: string) => void;\r\n}\r\n\r\nexport function NavigationItem({ title, type, active, onClick }: NavigationItemProps) {\r\n  return (\r\n    <li className=\"nav-item\">\r\n      <button\r\n        type=\"button\"\r\n        className={`nav-link text-start w-100 ${active ? \"active\" : \"\"}`}\r\n        onClick={() => onClick?.(type)}\r\n      >\r\n        {title}\r\n      </button>\r\n    </li>\r\n  );\r\n}\r\n","export function ContentContainer({ children }: React.PropsWithChildren) {\r\n  return <div className=\"container-fluid flex-grow-1\">{children}</div>;\r\n}\r\n","export function ContentRow({ children }: React.PropsWithChildren) {\r\n  return <div className=\"row h-100 flex-nowrap\">{children}</div>;\r\n}\r\n","export function LayoutWrapper({ children }: React.PropsWithChildren) {\r\n  return <div className=\"d-flex flex-column min-vh-100\">{children}</div>;\r\n}\r\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAA0D;AA2E9C;AApDL,SAAS,OAAO;AAAA,EACrB,kBAAkB;AAAA,EAClB,OAAO;AAAA,EACP,WAAW;AAAA,EAEX;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAEA,WAAW;AAAA,EAEX;AAAA,EACA;AAAA,EACA;AAAA,EAEA,cAAc;AAAA,EACd,cAAc;AAChB,GAAgB;AACd,QAAM,CAAC,SAAS,UAAU,QAAI,uBAAS,KAAK;AAE5C,QAAM,cAAc,OAAO,UAAyC;AAClE,QAAI,QAAS;AAEb,cAAU,KAAK;AACf,QAAI,MAAM,iBAAkB;AAC5B,QAAI,CAAC,SAAU;AAEf,QAAI;AACF,iBAAW,IAAI;AACf,YAAM,SAAS,MAAM,SAAS;AAC9B,eAAS,MAAM;AAAA,IACjB,SAAS,OAAO;AACd,gBAAU,KAAK;AAAA,IACjB,UAAE;AACA,iBAAW,KAAK;AAChB,kBAAY;AAAA,IACd;AAAA,EACF;AAEA,SACE,4CAAC,SAAI,WAAW,0BACd;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW,GAAG,eAAe,IAAI,UAAU,uBAAuB,EAAE;AAAA,MACpE,SAAS;AAAA,MACT,UAAU,YAAY;AAAA,MAErB,oBACC,gBAAgB,KAChB,mBACE,4EACG;AAAA,uBACC;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,MAAK;AAAA,YACL,eAAY;AAAA;AAAA,QACd;AAAA,QAED;AAAA,SACH,IAGF,gBAAgB,KAAK;AAAA;AAAA,EAEzB,GACF;AAEJ;;;ACpFI,IAAAA,sBAAA;AAFG,SAAS,OAAO,EAAE,SAAS,GAAgB;AAChD,SACE,6CAAC,YAAO,WAAU,+CACf,sBAAY,kDACf;AAEJ;;;ACFQ,IAAAC,sBAAA;AAJD,SAAS,OAAO,EAAE,SAAS,GAAgB;AAChD,SACE,6CAAC,SAAI,WAAU,8CACZ,sBACC,6CAAC,UAAK,WAAU,wBAAuB,wBAAU,GAErD;AAEJ;;;ACNI,IAAAC,sBAAA;AAFG,SAAS,WAAW,EAAE,SAAS,GAAqB;AACzD,SACE,6CAAC,UAAK,WAAU,wBACb,UACH;AAEJ;;;ACFI,IAAAC,sBAAA;AAFG,SAAS,KAAK,EAAE,OAAO,aAAa,SAAS,GAAc;AAChE,SACE,8CAAC,UAAK,WAAU,WACd;AAAA,iDAAC,QAAI,iBAAM;AAAA,IAEV,eAAe,6CAAC,OAAG,uBAAY;AAAA,IAEhC,6CAAC,SAAI,WAAU,aACb,uDAAC,SAAI,WAAU,aACZ,UACH,GACF;AAAA,KACF;AAEJ;;;ACbI,IAAAC,sBAAA;AAFG,SAAS,WAAW,EAAE,QAAQ,cAAc,SAAS,GAAoB;AAC9E,SACE,8CAAC,SAAI,WAAU,yCACb;AAAA,iDAAC,QAAG,WAAU,6BAA6B,iBAAM;AAAA,IAEjD,6CAAC,QAAG,WAAU,wCACX,UACH;AAAA,KACF;AAEJ;;;ACLM,IAAAC,sBAAA;AAHC,SAAS,eAAe,EAAE,OAAO,MAAM,QAAQ,QAAQ,GAAwB;AACpF,SACE,6CAAC,QAAG,WAAU,YACZ;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAW,6BAA6B,SAAS,WAAW,EAAE;AAAA,MAC9D,SAAS,MAAM,UAAU,IAAI;AAAA,MAE5B;AAAA;AAAA,EACH,GACF;AAEJ;;;ACpBS,IAAAC,sBAAA;AADF,SAAS,iBAAiB,EAAE,SAAS,GAA4B;AACtE,SAAO,6CAAC,SAAI,WAAU,+BAA+B,UAAS;AAChE;;;ACDS,IAAAC,sBAAA;AADF,SAAS,WAAW,EAAE,SAAS,GAA4B;AAChE,SAAO,6CAAC,SAAI,WAAU,yBAAyB,UAAS;AAC1D;;;ACDS,IAAAC,uBAAA;AADF,SAAS,cAAc,EAAE,SAAS,GAA4B;AACnE,SAAO,8CAAC,SAAI,WAAU,iCAAiC,UAAS;AAClE;","names":["import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime"]}

package/dist/index.css

@@ -1,70 +1,3 @@
-:root {
-  font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
-  line-height: 1.5;
-  font-weight: 400;
-  color-scheme: light dark;
-  color: rgba(255, 255, 255, 0.87);
-  background-color: #242424;
-  font-synthesis: none;
-  text-rendering: optimizeLegibility;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-@media (prefers-color-scheme: light) {
-  :root {
-    color: #213547;
-    background-color: #ffffff;
-  }
-}
-
-a {
-  font-weight: 500;
-  color: #646cff;
-  text-decoration: inherit;
-}
-a:hover {
-  color: #535bf2;
-}
-@media (prefers-color-scheme: light) {
-  a:hover {
-    color: rgb(151, 156.3677419355, 255);
-  }
-}
-
-body {
-  margin: 0;
-  display: flex;
-  place-items: center;
-  min-width: 320px;
-  min-height: 100vh;
-}
-
-h1 {
-  font-size: 3.2em;
-  line-height: 1.1;
-}
-
-button {
-  border-radius: 8px;
-  border: 1px solid transparent;
-  padding: 0.6em 1.2em;
-  font-size: 1em;
-  font-weight: 500;
-  font-family: inherit;
-  background-color: #1a1a1a;
-  cursor: pointer;
-  transition: border-color 0.25s;
-}
-button:hover {
-  border-color: #646cff;
-}
-button:focus, button:focus-visible {
-  outline: 4px auto -webkit-focus-ring-color;
-}
-@media (prefers-color-scheme: light) {
-  button {
-    background-color: #f9f9f9;
-  }
-}
+@import "/node_modules/bootstrap/dist/css/bootstrap.css";
 
 /*# sourceMappingURL=index.css.map */

package/dist/index.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../src/index.scss"],"names":[],"mappings":"AAgCA;EACE,aA3BW;EA4BX;EACA;EAEA;EACA,OAxBiB;EAyBjB,kBA5Bc;EA8Bd;EACA;EACA;EACA;;AAGA;EAfF;IAgBI,OAjCc;IAkCd,kBArCa;;;;AA6CjB;EACE;EACA,OAnDc;EAoDd;;AAEA;EACE,OAtDkB;;AAyDpB;EACE;IACE;;;;AASN;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAOF;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBApFe;EAqFf;EACA;;AAEA;EACE,cAlGY;;AAqGd;EApFA;;AAyFA;EApBF;IAqBI,kBAjGc","file":"index.css"}
+{"version":3,"sourceRoot":"","sources":["../src/index.scss"],"names":[],"mappings":"AAAQ","file":"index.css"}

package/dist/index.d.cts

@@ -19,4 +19,46 @@ interface ButtonProps {
 }
 declare function Button({ buttonClassName, type, disabled, onAction, onClick, onDone, onError, onFinally, children, loadingChildren, renderContent, renderLoading, loadingText, showSpinner, }: ButtonProps): react_jsx_runtime.JSX.Element;
 
-export { Button, type ButtonProps };
+interface FooterProps {
+    children?: ReactNode;
+}
+declare function Footer({ children }: FooterProps): react_jsx_runtime.JSX.Element;
+
+interface HeaderProps {
+    children?: ReactNode;
+}
+declare function Header({ children }: HeaderProps): react_jsx_runtime.JSX.Element;
+
+interface HeaderBrandProps {
+    children: ReactNode;
+}
+declare function HeaderText({ children }: HeaderBrandProps): react_jsx_runtime.JSX.Element;
+
+interface BodyProps {
+    title: ReactNode;
+    description?: ReactNode;
+    children?: ReactNode;
+}
+declare function Body({ title, description, children }: BodyProps): react_jsx_runtime.JSX.Element;
+
+interface NavigationProps {
+    title?: ReactNode;
+    children: ReactNode;
+}
+declare function Navigation({ title, children }: NavigationProps): react_jsx_runtime.JSX.Element;
+
+interface NavigationItemProps {
+    title: ReactNode;
+    type: string;
+    active?: boolean;
+    onClick?: (type: string) => void;
+}
+declare function NavigationItem({ title, type, active, onClick }: NavigationItemProps): react_jsx_runtime.JSX.Element;
+
+declare function ContentContainer({ children }: React.PropsWithChildren): react_jsx_runtime.JSX.Element;
+
+declare function ContentRow({ children }: React.PropsWithChildren): react_jsx_runtime.JSX.Element;
+
+declare function LayoutWrapper({ children }: React.PropsWithChildren): react_jsx_runtime.JSX.Element;
+
+export { Body, Button, type ButtonProps, ContentContainer, ContentRow, Footer, Header, HeaderText, LayoutWrapper, Navigation, NavigationItem };

package/dist/index.d.ts

@@ -19,4 +19,46 @@ interface ButtonProps {
 }
 declare function Button({ buttonClassName, type, disabled, onAction, onClick, onDone, onError, onFinally, children, loadingChildren, renderContent, renderLoading, loadingText, showSpinner, }: ButtonProps): react_jsx_runtime.JSX.Element;
 
-export { Button, type ButtonProps };
+interface FooterProps {
+    children?: ReactNode;
+}
+declare function Footer({ children }: FooterProps): react_jsx_runtime.JSX.Element;
+
+interface HeaderProps {
+    children?: ReactNode;
+}
+declare function Header({ children }: HeaderProps): react_jsx_runtime.JSX.Element;
+
+interface HeaderBrandProps {
+    children: ReactNode;
+}
+declare function HeaderText({ children }: HeaderBrandProps): react_jsx_runtime.JSX.Element;
+
+interface BodyProps {
+    title: ReactNode;
+    description?: ReactNode;
+    children?: ReactNode;
+}
+declare function Body({ title, description, children }: BodyProps): react_jsx_runtime.JSX.Element;
+
+interface NavigationProps {
+    title?: ReactNode;
+    children: ReactNode;
+}
+declare function Navigation({ title, children }: NavigationProps): react_jsx_runtime.JSX.Element;
+
+interface NavigationItemProps {
+    title: ReactNode;
+    type: string;
+    active?: boolean;
+    onClick?: (type: string) => void;
+}
+declare function NavigationItem({ title, type, active, onClick }: NavigationItemProps): react_jsx_runtime.JSX.Element;
+
+declare function ContentContainer({ children }: React.PropsWithChildren): react_jsx_runtime.JSX.Element;
+
+declare function ContentRow({ children }: React.PropsWithChildren): react_jsx_runtime.JSX.Element;
+
+declare function LayoutWrapper({ children }: React.PropsWithChildren): react_jsx_runtime.JSX.Element;
+
+export { Body, Button, type ButtonProps, ContentContainer, ContentRow, Footer, Header, HeaderText, LayoutWrapper, Navigation, NavigationItem };

package/dist/index.js

@@ -55,7 +55,85 @@ function Button({
     }
   ) });
 }
+
+// src/components/Footer.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+function Footer({ children }) {
+  return /* @__PURE__ */ jsx2("footer", { className: "bg-dark text-white text-center py-2 mt-auto", children: children ?? "\xA9 2025 Your Site \u2014 All rights reserved" });
+}
+
+// src/components/Header.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+function Header({ children }) {
+  return /* @__PURE__ */ jsx3("nav", { className: "navbar navbar-dark bg-dark px-3 sticky-top", children: children ?? /* @__PURE__ */ jsx3("span", { className: "navbar-brand mb-0 h4", children: "My Website" }) });
+}
+
+// src/components/HeaderText.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+function HeaderText({ children }) {
+  return /* @__PURE__ */ jsx4("span", { className: "navbar-brand mb-0 h4", children });
+}
+
+// src/components/Body.tsx
+import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
+function Body({ title, description, children }) {
+  return /* @__PURE__ */ jsxs2("main", { className: "col p-4", children: [
+    /* @__PURE__ */ jsx5("h2", { children: title }),
+    description && /* @__PURE__ */ jsx5("p", { children: description }),
+    /* @__PURE__ */ jsx5("div", { className: "card mt-3", children: /* @__PURE__ */ jsx5("div", { className: "card-body", children }) })
+  ] });
+}
+
+// src/components/navigation/Navigation.tsx
+import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
+function Navigation({ title = "Navigation", children }) {
+  return /* @__PURE__ */ jsxs3("nav", { className: "col-auto p-3 h-100 d-flex flex-column", children: [
+    /* @__PURE__ */ jsx6("h6", { className: "text-muted text-uppercase", children: title }),
+    /* @__PURE__ */ jsx6("ul", { className: "nav nav-pills flex-column gap-2 mt-3", children })
+  ] });
+}
+
+// src/components/navigation/NavigationItem.tsx
+import { jsx as jsx7 } from "react/jsx-runtime";
+function NavigationItem({ title, type, active, onClick }) {
+  return /* @__PURE__ */ jsx7("li", { className: "nav-item", children: /* @__PURE__ */ jsx7(
+    "button",
+    {
+      type: "button",
+      className: `nav-link text-start w-100 ${active ? "active" : ""}`,
+      onClick: () => onClick?.(type),
+      children: title
+    }
+  ) });
+}
+
+// src/components/wrappers/ContentContainer.tsx
+import { jsx as jsx8 } from "react/jsx-runtime";
+function ContentContainer({ children }) {
+  return /* @__PURE__ */ jsx8("div", { className: "container-fluid flex-grow-1", children });
+}
+
+// src/components/wrappers/ContentRow.tsx
+import { jsx as jsx9 } from "react/jsx-runtime";
+function ContentRow({ children }) {
+  return /* @__PURE__ */ jsx9("div", { className: "row h-100 flex-nowrap", children });
+}
+
+// src/components/wrappers/LayoutWrapper.tsx
+import { jsx as jsx10 } from "react/jsx-runtime";
+function LayoutWrapper({ children }) {
+  return /* @__PURE__ */ jsx10("div", { className: "d-flex flex-column min-vh-100", children });
+}
 export {
-  Button
+  Body,
+  Button,
+  ContentContainer,
+  ContentRow,
+  Footer,
+  Header,
+  HeaderText,
+  LayoutWrapper,
+  Navigation,
+  NavigationItem
 };
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Button.tsx"],"sourcesContent":["import { useState, type ReactNode, type MouseEvent } from \"react\";\r\nimport \"./Button.scss\";\r\n\r\nexport interface ButtonProps {\r\n  buttonClassName?: string;\r\n  type?: \"button\" | \"submit\" | \"reset\";\r\n  disabled?: boolean;\r\n\r\n  onAction?: () => Promise<unknown>;\r\n  onClick?: (event: MouseEvent<HTMLButtonElement>) => void;\r\n  onDone?: (result: unknown) => void;\r\n  onError?: (error: unknown) => void;\r\n  onFinally?: () => void;\r\n\r\n  children?: ReactNode;\r\n  loadingChildren?: ReactNode;\r\n\r\n  renderContent?: () => ReactNode;\r\n  renderLoading?: () => ReactNode;\r\n\r\n  loadingText?: string;\r\n  showSpinner?: boolean;\r\n}\r\n\r\nexport function Button({\r\n  buttonClassName = \"btn btn-primary btn-lg\",\r\n  type = \"button\",\r\n  disabled = false,\r\n\r\n  onAction,\r\n  onClick,\r\n  onDone,\r\n  onError,\r\n  onFinally,\r\n\r\n  children = \"Click me\",\r\n\r\n  loadingChildren,\r\n  renderContent,\r\n  renderLoading,\r\n\r\n  loadingText = \"Loading...\",\r\n  showSpinner = true,\r\n}: ButtonProps) {\r\n  const [loading, setLoading] = useState(false);\r\n\r\n  const handleClick = async (event: MouseEvent<HTMLButtonElement>) => {\r\n    if (loading) return;\r\n\r\n    onClick?.(event);\r\n    if (event.defaultPrevented) return;\r\n    if (!onAction) return;\r\n\r\n    try {\r\n      setLoading(true);\r\n      const result = await onAction();\r\n      onDone?.(result);\r\n    } catch (error) {\r\n      onError?.(error);\r\n    } finally {\r\n      setLoading(false);\r\n      onFinally?.();\r\n    }\r\n  };\r\n\r\n  return (\r\n    <div className={`w-100 text-center mb-3`}>\r\n      <button\r\n        type={type}\r\n        className={`${buttonClassName} ${loading ? \"async-btn--loading\" : \"\"}`}\r\n        onClick={handleClick}\r\n        disabled={disabled || loading}\r\n      >\r\n        {loading ? (\r\n          renderLoading?.() ??\r\n          loadingChildren ?? (\r\n            <>\r\n              {showSpinner && (\r\n                <span\r\n                  className=\"spinner-border spinner-border-sm me-2 async-btn__spinner\"\r\n                  role=\"status\"\r\n                  aria-hidden=\"true\"\r\n                />\r\n              )}\r\n              {loadingText}\r\n            </>\r\n          )\r\n        ) : (\r\n          renderContent?.() ?? children\r\n        )}\r\n      </button>\r\n    </div>\r\n  );\r\n}\r\n"],"mappings":";AAAA,SAAS,gBAAiD;AA4E9C,mBAEI,KAFJ;AApDL,SAAS,OAAO;AAAA,EACrB,kBAAkB;AAAA,EAClB,OAAO;AAAA,EACP,WAAW;AAAA,EAEX;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAEA,WAAW;AAAA,EAEX;AAAA,EACA;AAAA,EACA;AAAA,EAEA,cAAc;AAAA,EACd,cAAc;AAChB,GAAgB;AACd,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAE5C,QAAM,cAAc,OAAO,UAAyC;AAClE,QAAI,QAAS;AAEb,cAAU,KAAK;AACf,QAAI,MAAM,iBAAkB;AAC5B,QAAI,CAAC,SAAU;AAEf,QAAI;AACF,iBAAW,IAAI;AACf,YAAM,SAAS,MAAM,SAAS;AAC9B,eAAS,MAAM;AAAA,IACjB,SAAS,OAAO;AACd,gBAAU,KAAK;AAAA,IACjB,UAAE;AACA,iBAAW,KAAK;AAChB,kBAAY;AAAA,IACd;AAAA,EACF;AAEA,SACE,oBAAC,SAAI,WAAW,0BACd;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW,GAAG,eAAe,IAAI,UAAU,uBAAuB,EAAE;AAAA,MACpE,SAAS;AAAA,MACT,UAAU,YAAY;AAAA,MAErB,oBACC,gBAAgB,KAChB,mBACE,iCACG;AAAA,uBACC;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,MAAK;AAAA,YACL,eAAY;AAAA;AAAA,QACd;AAAA,QAED;AAAA,SACH,IAGF,gBAAgB,KAAK;AAAA;AAAA,EAEzB,GACF;AAEJ;","names":[]}
+{"version":3,"sources":["../src/components/Button.tsx","../src/components/Footer.tsx","../src/components/Header.tsx","../src/components/HeaderText.tsx","../src/components/Body.tsx","../src/components/navigation/Navigation.tsx","../src/components/navigation/NavigationItem.tsx","../src/components/wrappers/ContentContainer.tsx","../src/components/wrappers/ContentRow.tsx","../src/components/wrappers/LayoutWrapper.tsx"],"sourcesContent":["import { useState, type ReactNode, type MouseEvent } from \"react\";\r\n\r\nexport interface ButtonProps {\r\n  buttonClassName?: string;\r\n  type?: \"button\" | \"submit\" | \"reset\";\r\n  disabled?: boolean;\r\n\r\n  onAction?: () => Promise<unknown>;\r\n  onClick?: (event: MouseEvent<HTMLButtonElement>) => void;\r\n  onDone?: (result: unknown) => void;\r\n  onError?: (error: unknown) => void;\r\n  onFinally?: () => void;\r\n\r\n  children?: ReactNode;\r\n  loadingChildren?: ReactNode;\r\n\r\n  renderContent?: () => ReactNode;\r\n  renderLoading?: () => ReactNode;\r\n\r\n  loadingText?: string;\r\n  showSpinner?: boolean;\r\n}\r\n\r\nexport function Button({\r\n  buttonClassName = \"btn btn-primary btn-lg\",\r\n  type = \"button\",\r\n  disabled = false,\r\n\r\n  onAction,\r\n  onClick,\r\n  onDone,\r\n  onError,\r\n  onFinally,\r\n\r\n  children = \"Click me\",\r\n\r\n  loadingChildren,\r\n  renderContent,\r\n  renderLoading,\r\n\r\n  loadingText = \"Loading...\",\r\n  showSpinner = true,\r\n}: ButtonProps) {\r\n  const [loading, setLoading] = useState(false);\r\n\r\n  const handleClick = async (event: MouseEvent<HTMLButtonElement>) => {\r\n    if (loading) return;\r\n\r\n    onClick?.(event);\r\n    if (event.defaultPrevented) return;\r\n    if (!onAction) return;\r\n\r\n    try {\r\n      setLoading(true);\r\n      const result = await onAction();\r\n      onDone?.(result);\r\n    } catch (error) {\r\n      onError?.(error);\r\n    } finally {\r\n      setLoading(false);\r\n      onFinally?.();\r\n    }\r\n  };\r\n\r\n  return (\r\n    <div className={`w-100 text-center mb-3`}>\r\n      <button\r\n        type={type}\r\n        className={`${buttonClassName} ${loading ? \"async-btn--loading\" : \"\"}`}\r\n        onClick={handleClick}\r\n        disabled={disabled || loading}\r\n      >\r\n        {loading ? (\r\n          renderLoading?.() ??\r\n          loadingChildren ?? (\r\n            <>\r\n              {showSpinner && (\r\n                <span\r\n                  className=\"spinner-border spinner-border-sm me-2 async-btn__spinner\"\r\n                  role=\"status\"\r\n                  aria-hidden=\"true\"\r\n                />\r\n              )}\r\n              {loadingText}\r\n            </>\r\n          )\r\n        ) : (\r\n          renderContent?.() ?? children\r\n        )}\r\n      </button>\r\n    </div>\r\n  );\r\n}\r\n","import type { ReactNode } from \"react\";\r\n\r\ninterface FooterProps {\r\n  children?: ReactNode;\r\n}\r\n\r\nexport function Footer({ children }: FooterProps) {\r\n  return (\r\n    <footer className=\"bg-dark text-white text-center py-2 mt-auto\">\r\n      {children ?? \"© 2025 Your Site — All rights reserved\"}\r\n    </footer>\r\n  );\r\n}\r\n","import type { ReactNode } from \"react\";\r\n\r\ninterface HeaderProps {\r\n  children?: ReactNode;\r\n}\r\n\r\nexport function Header({ children }: HeaderProps) {\r\n  return (\r\n    <nav className=\"navbar navbar-dark bg-dark px-3 sticky-top\">\r\n      {children ?? (\r\n        <span className=\"navbar-brand mb-0 h4\">My Website</span>\r\n      )}\r\n    </nav>\r\n  );\r\n}\r\n","import type { ReactNode } from \"react\";\r\n\r\ninterface HeaderBrandProps {\r\n  children: ReactNode;\r\n}\r\n\r\nexport function HeaderText({ children }: HeaderBrandProps) {\r\n  return (\r\n    <span className=\"navbar-brand mb-0 h4\">\r\n      {children}\r\n    </span>\r\n  );\r\n}\r\n","import type { ReactNode } from \"react\";\r\n\r\ninterface BodyProps {\r\n  title: ReactNode;\r\n  description?: ReactNode;\r\n  children?: ReactNode;\r\n}\r\n\r\nexport function Body({ title, description, children }: BodyProps) {\r\n  return (\r\n    <main className=\"col p-4\">\r\n      <h2>{title}</h2>\r\n\r\n      {description && <p>{description}</p>}\r\n\r\n      <div className=\"card mt-3\">\r\n        <div className=\"card-body\">\r\n          {children}\r\n        </div>\r\n      </div>\r\n    </main>\r\n  );\r\n}\r\n","import type { ReactNode } from \"react\";\r\n\r\ninterface NavigationProps {\r\n  title?: ReactNode;\r\n  children: ReactNode;\r\n}\r\n\r\nexport function Navigation({ title = \"Navigation\", children }: NavigationProps) {\r\n  return (\r\n    <nav className=\"col-auto p-3 h-100 d-flex flex-column\">\r\n      <h6 className=\"text-muted text-uppercase\">{title}</h6>\r\n\r\n      <ul className=\"nav nav-pills flex-column gap-2 mt-3\">\r\n        {children}\r\n      </ul>\r\n    </nav>\r\n  );\r\n}\r\n","import type { ReactNode } from \"react\";\r\n\r\ninterface NavigationItemProps {\r\n  title: ReactNode;\r\n  type: string;\r\n  active?: boolean;\r\n  onClick?: (type: string) => void;\r\n}\r\n\r\nexport function NavigationItem({ title, type, active, onClick }: NavigationItemProps) {\r\n  return (\r\n    <li className=\"nav-item\">\r\n      <button\r\n        type=\"button\"\r\n        className={`nav-link text-start w-100 ${active ? \"active\" : \"\"}`}\r\n        onClick={() => onClick?.(type)}\r\n      >\r\n        {title}\r\n      </button>\r\n    </li>\r\n  );\r\n}\r\n","export function ContentContainer({ children }: React.PropsWithChildren) {\r\n  return <div className=\"container-fluid flex-grow-1\">{children}</div>;\r\n}\r\n","export function ContentRow({ children }: React.PropsWithChildren) {\r\n  return <div className=\"row h-100 flex-nowrap\">{children}</div>;\r\n}\r\n","export function LayoutWrapper({ children }: React.PropsWithChildren) {\r\n  return <div className=\"d-flex flex-column min-vh-100\">{children}</div>;\r\n}\r\n"],"mappings":"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","names":["jsx","jsx","jsx","jsx","jsxs","jsx","jsxs","jsx","jsx","jsx","jsx"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sparkstudio/common-ui",
-  "version": "1.0.4",
+  "version": "1.0.6",
   "type": "module",
   "main": "dist/index.cjs",
   "module": "dist/index.js",
@@ -24,7 +24,7 @@
   },
   "scripts": {
     "dev": "vite",
-    "build": "tsup && sass src/index.scss dist/index.css",
+    "build": "tsup src/index.ts --format cjs,esm --dts --tsconfig tsconfig.lib.json && sass --load-path=node_modules src/index.scss dist/index.css",
     "lint": "eslint .",
     "preview": "vite preview",
     "start": "vite"