@sparkstudio/common-ui 1.0.1 → 1.0.3

package/dist/index.cjs

@@ -0,0 +1,88 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  Button: () => Button
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/components/Button.tsx
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+function Button({
+  buttonClassName = "btn btn-primary btn-lg",
+  type = "button",
+  disabled = false,
+  onAction,
+  onClick,
+  onDone,
+  onError,
+  onFinally,
+  children = "Click me",
+  loadingChildren,
+  renderContent,
+  renderLoading,
+  loadingText = "Loading...",
+  showSpinner = true
+}) {
+  const [loading, setLoading] = (0, import_react.useState)(false);
+  const handleClick = async (event) => {
+    if (loading) return;
+    onClick?.(event);
+    if (event.defaultPrevented) return;
+    if (!onAction) return;
+    try {
+      setLoading(true);
+      const result = await onAction();
+      onDone?.(result);
+    } catch (error) {
+      onError?.(error);
+    } finally {
+      setLoading(false);
+      onFinally?.();
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: `w-100 text-center mb-3`, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "button",
+    {
+      type,
+      className: `${buttonClassName} ${loading ? "async-btn--loading" : ""}`,
+      onClick: handleClick,
+      disabled: disabled || loading,
+      children: loading ? renderLoading?.() ?? loadingChildren ?? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+        showSpinner && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "span",
+          {
+            className: "spinner-border spinner-border-sm me-2 async-btn__spinner",
+            role: "status",
+            "aria-hidden": "true"
+          }
+        ),
+        loadingText
+      ] }) : renderContent?.() ?? children
+    }
+  ) });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Button
+});
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +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":[]}

package/dist/index.css

@@ -0,0 +1,70 @@
+: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;
+  }
+}
+
+/*# sourceMappingURL=index.css.map */

package/dist/index.css.map

@@ -0,0 +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"}

package/dist/index.d.cts

@@ -0,0 +1,22 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { MouseEvent, ReactNode } from 'react';
+
+interface ButtonProps {
+    buttonClassName?: string;
+    type?: "button" | "submit" | "reset";
+    disabled?: boolean;
+    onAction?: () => Promise<unknown>;
+    onClick?: (event: MouseEvent<HTMLButtonElement>) => void;
+    onDone?: (result: unknown) => void;
+    onError?: (error: unknown) => void;
+    onFinally?: () => void;
+    children?: ReactNode;
+    loadingChildren?: ReactNode;
+    renderContent?: () => ReactNode;
+    renderLoading?: () => ReactNode;
+    loadingText?: string;
+    showSpinner?: boolean;
+}
+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 };

package/dist/index.d.ts

@@ -0,0 +1,22 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { MouseEvent, ReactNode } from 'react';
+
+interface ButtonProps {
+    buttonClassName?: string;
+    type?: "button" | "submit" | "reset";
+    disabled?: boolean;
+    onAction?: () => Promise<unknown>;
+    onClick?: (event: MouseEvent<HTMLButtonElement>) => void;
+    onDone?: (result: unknown) => void;
+    onError?: (error: unknown) => void;
+    onFinally?: () => void;
+    children?: ReactNode;
+    loadingChildren?: ReactNode;
+    renderContent?: () => ReactNode;
+    renderLoading?: () => ReactNode;
+    loadingText?: string;
+    showSpinner?: boolean;
+}
+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 };

package/dist/index.js

@@ -0,0 +1,61 @@
+// src/components/Button.tsx
+import { useState } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function Button({
+  buttonClassName = "btn btn-primary btn-lg",
+  type = "button",
+  disabled = false,
+  onAction,
+  onClick,
+  onDone,
+  onError,
+  onFinally,
+  children = "Click me",
+  loadingChildren,
+  renderContent,
+  renderLoading,
+  loadingText = "Loading...",
+  showSpinner = true
+}) {
+  const [loading, setLoading] = useState(false);
+  const handleClick = async (event) => {
+    if (loading) return;
+    onClick?.(event);
+    if (event.defaultPrevented) return;
+    if (!onAction) return;
+    try {
+      setLoading(true);
+      const result = await onAction();
+      onDone?.(result);
+    } catch (error) {
+      onError?.(error);
+    } finally {
+      setLoading(false);
+      onFinally?.();
+    }
+  };
+  return /* @__PURE__ */ jsx("div", { className: `w-100 text-center mb-3`, children: /* @__PURE__ */ jsx(
+    "button",
+    {
+      type,
+      className: `${buttonClassName} ${loading ? "async-btn--loading" : ""}`,
+      onClick: handleClick,
+      disabled: disabled || loading,
+      children: loading ? renderLoading?.() ?? loadingChildren ?? /* @__PURE__ */ jsxs(Fragment, { children: [
+        showSpinner && /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: "spinner-border spinner-border-sm me-2 async-btn__spinner",
+            role: "status",
+            "aria-hidden": "true"
+          }
+        ),
+        loadingText
+      ] }) : renderContent?.() ?? children
+    }
+  ) });
+}
+export {
+  Button
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +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":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sparkstudio/common-ui",
-  "version": "1.0.1",
+  "version": "1.0.3",
   "type": "module",
   "main": "dist/index.cjs",
   "module": "dist/index.js",
@@ -37,6 +37,7 @@
     "@fortawesome/fontawesome-free": "^7.1.0",
     "@popperjs/core": "^2.11.8",
     "bootstrap": "^5.3.8",
+    "esbuild-sass-plugin": "^3.3.1",
     "highcharts": "^12.4.0",
     "highcharts-react-official": "^3.2.3"
   },
@@ -50,12 +51,12 @@
     "eslint-plugin-react-hooks": "^5.2.0",
     "eslint-plugin-react-refresh": "^0.4.22",
     "globals": "^16.4.0",
+    "react": "^18.3.0",
+    "react-dom": "^18.3.0",
     "sass": "^1.80.0",
     "tsup": "^8.5.1",
     "typescript": "~5.9.3",
     "typescript-eslint": "^8.45.0",
-    "vite": "^7.1.7",
-    "react": "^18.3.0",
-    "react-dom": "^18.3.0"
+    "vite": "^7.1.7"
   }
 }