@sparkstudio/common-ui 1.0.10 → 1.0.11
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/dist/index.cjs +20 -20
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +8 -8
- package/dist/index.d.ts +8 -8
- package/dist/index.js +20 -20
- package/dist/index.js.map +1 -1
- package/package.json +8 -2
package/dist/index.cjs
CHANGED
|
@@ -34,9 +34,19 @@ __export(index_exports, {
|
|
|
34
34
|
});
|
|
35
35
|
module.exports = __toCommonJS(index_exports);
|
|
36
36
|
|
|
37
|
+
// src/components/Body.tsx
|
|
38
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
39
|
+
function Body({ title, description, children }) {
|
|
40
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("main", { className: "col p-4", children: [
|
|
41
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { children: title }),
|
|
42
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { children: description }),
|
|
43
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "card mt-3", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "card-body", children }) })
|
|
44
|
+
] });
|
|
45
|
+
}
|
|
46
|
+
|
|
37
47
|
// src/components/Button.tsx
|
|
38
48
|
var import_react = require("react");
|
|
39
|
-
var
|
|
49
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
40
50
|
function Button({
|
|
41
51
|
buttonClassName = "btn btn-primary btn-lg",
|
|
42
52
|
type = "button",
|
|
@@ -70,15 +80,15 @@ function Button({
|
|
|
70
80
|
onFinally?.();
|
|
71
81
|
}
|
|
72
82
|
};
|
|
73
|
-
return /* @__PURE__ */ (0,
|
|
83
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
74
84
|
"button",
|
|
75
85
|
{
|
|
76
86
|
type,
|
|
77
87
|
className: `${buttonClassName} ${loading ? "async-btn--loading" : ""}`,
|
|
78
88
|
onClick: handleClick,
|
|
79
89
|
disabled: disabled || loading,
|
|
80
|
-
children: loading ? renderLoading?.() ?? loadingChildren ?? /* @__PURE__ */ (0,
|
|
81
|
-
showSpinner && /* @__PURE__ */ (0,
|
|
90
|
+
children: loading ? renderLoading?.() ?? loadingChildren ?? /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
|
|
91
|
+
showSpinner && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
82
92
|
"span",
|
|
83
93
|
{
|
|
84
94
|
className: "spinner-border spinner-border-sm me-2 async-btn__spinner",
|
|
@@ -93,31 +103,21 @@ function Button({
|
|
|
93
103
|
}
|
|
94
104
|
|
|
95
105
|
// src/components/Footer.tsx
|
|
96
|
-
var
|
|
106
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
97
107
|
function Footer({ children }) {
|
|
98
|
-
return /* @__PURE__ */ (0,
|
|
108
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("footer", { className: "bg-dark text-white text-center py-2 mt-auto", children: children ?? "\xA9 2025 Your Site \u2014 All rights reserved" });
|
|
99
109
|
}
|
|
100
110
|
|
|
101
111
|
// src/components/Header.tsx
|
|
102
|
-
var
|
|
112
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
103
113
|
function Header({ children }) {
|
|
104
|
-
return /* @__PURE__ */ (0,
|
|
114
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("nav", { className: "navbar navbar-dark bg-dark px-3 sticky-top", children: children ?? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "navbar-brand mb-0 h4", children: "My Website" }) });
|
|
105
115
|
}
|
|
106
116
|
|
|
107
117
|
// src/components/HeaderText.tsx
|
|
108
|
-
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
109
|
-
function HeaderText({ children }) {
|
|
110
|
-
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "navbar-brand mb-0 h4", children });
|
|
111
|
-
}
|
|
112
|
-
|
|
113
|
-
// src/components/Body.tsx
|
|
114
118
|
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
115
|
-
function
|
|
116
|
-
return /* @__PURE__ */ (0, import_jsx_runtime5.
|
|
117
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("h2", { children: title }),
|
|
118
|
-
description && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { children: description }),
|
|
119
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "card mt-3", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "card-body", children }) })
|
|
120
|
-
] });
|
|
119
|
+
function HeaderText({ children }) {
|
|
120
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "navbar-brand mb-0 h4", children });
|
|
121
121
|
}
|
|
122
122
|
|
|
123
123
|
// src/components/NpmBadge.tsx
|
package/dist/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"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/NpmBadge.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\nexport * from \"./components/NpmBadge\";\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 <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 );\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","// components/NpmBadge.tsx\r\ninterface NpmBadgeProps {\r\n packageLabel: string;\r\n packageName: string;\r\n packageUrl: string; // e.g. \"@sparkstudio/authentication-ui\"\r\n color?: string; // optional (default black)\r\n height?: number; // optional (default 22)\r\n}\r\n\r\nexport function NpmBadge({ packageName, packageLabel, packageUrl, color = \"black\", height = 22 }: NpmBadgeProps) {\r\n const encodedLabel = encodeURIComponent(packageLabel);\r\n const badgeUrl = `https://img.shields.io/npm/v/${packageName}?logo=npm&label=${encodedLabel}&color=${color}`;\r\n const npmUrl = packageUrl;\r\n\r\n return (\r\n <a href={npmUrl} target=\"_blank\" rel=\"noopener noreferrer\">\r\n <img src={badgeUrl} alt={`${packageName} version`} style={{ height }} />\r\n </a>\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":["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","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/components/Body.tsx","../src/components/Button.tsx","../src/components/Footer.tsx","../src/components/Header.tsx","../src/components/HeaderText.tsx","../src/components/NpmBadge.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":["/**\n * @file Automatically generated by barrelsby.\n */\n\nexport * from \"./components/Body\";\nexport * from \"./components/Button\";\nexport * from \"./components/Footer\";\nexport * from \"./components/Header\";\nexport * from \"./components/HeaderText\";\nexport * from \"./components/NpmBadge\";\nexport * from \"./components/navigation/Navigation\";\nexport * from \"./components/navigation/NavigationItem\";\nexport * from \"./components/wrappers/ContentContainer\";\nexport * from \"./components/wrappers/ContentRow\";\nexport * from \"./components/wrappers/LayoutWrapper\";\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 { 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 <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 );\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","// components/NpmBadge.tsx\r\ninterface NpmBadgeProps {\r\n packageLabel: string;\r\n packageName: string;\r\n packageUrl: string; // e.g. \"@sparkstudio/authentication-ui\"\r\n color?: string; // optional (default black)\r\n height?: number; // optional (default 22)\r\n}\r\n\r\nexport function NpmBadge({ packageName, packageLabel, packageUrl, color = \"black\", height = 22 }: NpmBadgeProps) {\r\n const encodedLabel = encodeURIComponent(packageLabel);\r\n const badgeUrl = `https://img.shields.io/npm/v/${packageName}?logo=npm&label=${encodedLabel}&color=${color}`;\r\n const npmUrl = packageUrl;\r\n\r\n return (\r\n <a href={npmUrl} target=\"_blank\" rel=\"noopener noreferrer\">\r\n <img src={badgeUrl} alt={`${packageName} version`} style={{ height }} />\r\n </a>\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":["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","import_jsx_runtime"]}
|
package/dist/index.d.cts
CHANGED
|
@@ -1,5 +1,12 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
-
import {
|
|
2
|
+
import { ReactNode, MouseEvent } from 'react';
|
|
3
|
+
|
|
4
|
+
interface BodyProps {
|
|
5
|
+
title: ReactNode;
|
|
6
|
+
description?: ReactNode;
|
|
7
|
+
children?: ReactNode;
|
|
8
|
+
}
|
|
9
|
+
declare function Body({ title, description, children }: BodyProps): react_jsx_runtime.JSX.Element;
|
|
3
10
|
|
|
4
11
|
interface ButtonProps {
|
|
5
12
|
buttonClassName?: string;
|
|
@@ -34,13 +41,6 @@ interface HeaderBrandProps {
|
|
|
34
41
|
}
|
|
35
42
|
declare function HeaderText({ children }: HeaderBrandProps): react_jsx_runtime.JSX.Element;
|
|
36
43
|
|
|
37
|
-
interface BodyProps {
|
|
38
|
-
title: ReactNode;
|
|
39
|
-
description?: ReactNode;
|
|
40
|
-
children?: ReactNode;
|
|
41
|
-
}
|
|
42
|
-
declare function Body({ title, description, children }: BodyProps): react_jsx_runtime.JSX.Element;
|
|
43
|
-
|
|
44
44
|
interface NpmBadgeProps {
|
|
45
45
|
packageLabel: string;
|
|
46
46
|
packageName: string;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,12 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
-
import {
|
|
2
|
+
import { ReactNode, MouseEvent } from 'react';
|
|
3
|
+
|
|
4
|
+
interface BodyProps {
|
|
5
|
+
title: ReactNode;
|
|
6
|
+
description?: ReactNode;
|
|
7
|
+
children?: ReactNode;
|
|
8
|
+
}
|
|
9
|
+
declare function Body({ title, description, children }: BodyProps): react_jsx_runtime.JSX.Element;
|
|
3
10
|
|
|
4
11
|
interface ButtonProps {
|
|
5
12
|
buttonClassName?: string;
|
|
@@ -34,13 +41,6 @@ interface HeaderBrandProps {
|
|
|
34
41
|
}
|
|
35
42
|
declare function HeaderText({ children }: HeaderBrandProps): react_jsx_runtime.JSX.Element;
|
|
36
43
|
|
|
37
|
-
interface BodyProps {
|
|
38
|
-
title: ReactNode;
|
|
39
|
-
description?: ReactNode;
|
|
40
|
-
children?: ReactNode;
|
|
41
|
-
}
|
|
42
|
-
declare function Body({ title, description, children }: BodyProps): react_jsx_runtime.JSX.Element;
|
|
43
|
-
|
|
44
44
|
interface NpmBadgeProps {
|
|
45
45
|
packageLabel: string;
|
|
46
46
|
packageName: string;
|
package/dist/index.js
CHANGED
|
@@ -1,6 +1,16 @@
|
|
|
1
|
+
// src/components/Body.tsx
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
function Body({ title, description, children }) {
|
|
4
|
+
return /* @__PURE__ */ jsxs("main", { className: "col p-4", children: [
|
|
5
|
+
/* @__PURE__ */ jsx("h2", { children: title }),
|
|
6
|
+
description && /* @__PURE__ */ jsx("p", { children: description }),
|
|
7
|
+
/* @__PURE__ */ jsx("div", { className: "card mt-3", children: /* @__PURE__ */ jsx("div", { className: "card-body", children }) })
|
|
8
|
+
] });
|
|
9
|
+
}
|
|
10
|
+
|
|
1
11
|
// src/components/Button.tsx
|
|
2
12
|
import { useState } from "react";
|
|
3
|
-
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
13
|
+
import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
4
14
|
function Button({
|
|
5
15
|
buttonClassName = "btn btn-primary btn-lg",
|
|
6
16
|
type = "button",
|
|
@@ -34,15 +44,15 @@ function Button({
|
|
|
34
44
|
onFinally?.();
|
|
35
45
|
}
|
|
36
46
|
};
|
|
37
|
-
return /* @__PURE__ */
|
|
47
|
+
return /* @__PURE__ */ jsx2(
|
|
38
48
|
"button",
|
|
39
49
|
{
|
|
40
50
|
type,
|
|
41
51
|
className: `${buttonClassName} ${loading ? "async-btn--loading" : ""}`,
|
|
42
52
|
onClick: handleClick,
|
|
43
53
|
disabled: disabled || loading,
|
|
44
|
-
children: loading ? renderLoading?.() ?? loadingChildren ?? /* @__PURE__ */
|
|
45
|
-
showSpinner && /* @__PURE__ */
|
|
54
|
+
children: loading ? renderLoading?.() ?? loadingChildren ?? /* @__PURE__ */ jsxs2(Fragment, { children: [
|
|
55
|
+
showSpinner && /* @__PURE__ */ jsx2(
|
|
46
56
|
"span",
|
|
47
57
|
{
|
|
48
58
|
className: "spinner-border spinner-border-sm me-2 async-btn__spinner",
|
|
@@ -57,31 +67,21 @@ function Button({
|
|
|
57
67
|
}
|
|
58
68
|
|
|
59
69
|
// src/components/Footer.tsx
|
|
60
|
-
import { jsx as
|
|
70
|
+
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
61
71
|
function Footer({ children }) {
|
|
62
|
-
return /* @__PURE__ */
|
|
72
|
+
return /* @__PURE__ */ jsx3("footer", { className: "bg-dark text-white text-center py-2 mt-auto", children: children ?? "\xA9 2025 Your Site \u2014 All rights reserved" });
|
|
63
73
|
}
|
|
64
74
|
|
|
65
75
|
// src/components/Header.tsx
|
|
66
|
-
import { jsx as
|
|
76
|
+
import { jsx as jsx4 } from "react/jsx-runtime";
|
|
67
77
|
function Header({ children }) {
|
|
68
|
-
return /* @__PURE__ */
|
|
78
|
+
return /* @__PURE__ */ jsx4("nav", { className: "navbar navbar-dark bg-dark px-3 sticky-top", children: children ?? /* @__PURE__ */ jsx4("span", { className: "navbar-brand mb-0 h4", children: "My Website" }) });
|
|
69
79
|
}
|
|
70
80
|
|
|
71
81
|
// src/components/HeaderText.tsx
|
|
72
|
-
import { jsx as
|
|
82
|
+
import { jsx as jsx5 } from "react/jsx-runtime";
|
|
73
83
|
function HeaderText({ children }) {
|
|
74
|
-
return /* @__PURE__ */
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
// src/components/Body.tsx
|
|
78
|
-
import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
79
|
-
function Body({ title, description, children }) {
|
|
80
|
-
return /* @__PURE__ */ jsxs2("main", { className: "col p-4", children: [
|
|
81
|
-
/* @__PURE__ */ jsx5("h2", { children: title }),
|
|
82
|
-
description && /* @__PURE__ */ jsx5("p", { children: description }),
|
|
83
|
-
/* @__PURE__ */ jsx5("div", { className: "card mt-3", children: /* @__PURE__ */ jsx5("div", { className: "card-body", children }) })
|
|
84
|
-
] });
|
|
84
|
+
return /* @__PURE__ */ jsx5("span", { className: "navbar-brand mb-0 h4", children });
|
|
85
85
|
}
|
|
86
86
|
|
|
87
87
|
// src/components/NpmBadge.tsx
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/
|
|
1
|
+
{"version":3,"sources":["../src/components/Body.tsx","../src/components/Button.tsx","../src/components/Footer.tsx","../src/components/Header.tsx","../src/components/HeaderText.tsx","../src/components/NpmBadge.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 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 { 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 <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 );\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","// components/NpmBadge.tsx\r\ninterface NpmBadgeProps {\r\n packageLabel: string;\r\n packageName: string;\r\n packageUrl: string; // e.g. \"@sparkstudio/authentication-ui\"\r\n color?: string; // optional (default black)\r\n height?: number; // optional (default 22)\r\n}\r\n\r\nexport function NpmBadge({ packageName, packageLabel, packageUrl, color = \"black\", height = 22 }: NpmBadgeProps) {\r\n const encodedLabel = encodeURIComponent(packageLabel);\r\n const badgeUrl = `https://img.shields.io/npm/v/${packageName}?logo=npm&label=${encodedLabel}&color=${color}`;\r\n const npmUrl = packageUrl;\r\n\r\n return (\r\n <a href={npmUrl} target=\"_blank\" rel=\"noopener noreferrer\">\r\n <img src={badgeUrl} alt={`${packageName} version`} style={{ height }} />\r\n </a>\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","jsxs","jsx","jsx","jsx","jsx","jsx","jsxs","jsx","jsx","jsx","jsx"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sparkstudio/common-ui",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.11",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "dist/index.cjs",
|
|
6
6
|
"module": "dist/index.js",
|
|
@@ -24,7 +24,8 @@
|
|
|
24
24
|
},
|
|
25
25
|
"scripts": {
|
|
26
26
|
"dev": "vite",
|
|
27
|
-
"
|
|
27
|
+
"generateIndex": "barrelsby --delete --directory src --exclude react-env.d.ts --exclude main.tsx --exclude App.tsx",
|
|
28
|
+
"build": "npm run generateIndex && tsup src/index.ts --format cjs,esm --dts --tsconfig tsconfig.lib.json && sass --load-path=node_modules src/index.scss dist/index.css",
|
|
28
29
|
"lint": "eslint .",
|
|
29
30
|
"preview": "vite preview",
|
|
30
31
|
"start": "vite"
|
|
@@ -35,7 +36,12 @@
|
|
|
35
36
|
},
|
|
36
37
|
"dependencies": {
|
|
37
38
|
"@fortawesome/fontawesome-free": "^7.1.0",
|
|
39
|
+
"@fortawesome/free-brands-svg-icons": "^7.1.0",
|
|
40
|
+
"@fortawesome/free-regular-svg-icons": "^7.1.0",
|
|
41
|
+
"@fortawesome/free-solid-svg-icons": "^7.1.0",
|
|
42
|
+
"@fortawesome/react-fontawesome": "^3.1.1",
|
|
38
43
|
"@popperjs/core": "^2.11.8",
|
|
44
|
+
"barrelsby": "^2.8.1",
|
|
39
45
|
"bootstrap": "^5.3.8",
|
|
40
46
|
"esbuild-sass-plugin": "^3.3.1",
|
|
41
47
|
"highcharts": "^12.4.0",
|