@rufous/ui 0.0.1

package/README.md

@@ -0,0 +1,69 @@
+# React + TypeScript + Vite
+
+This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+
+Currently, two official plugins are available:
+
+- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) for Fast Refresh
+- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
+
+## Expanding the ESLint configuration
+
+If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:
+
+```js
+export default tseslint.config([
+  globalIgnores(['dist']),
+  {
+    files: ['**/*.{ts,tsx}'],
+    extends: [
+      // Other configs...
+
+      // Remove tseslint.configs.recommended and replace with this
+      ...tseslint.configs.recommendedTypeChecked,
+      // Alternatively, use this for stricter rules
+      ...tseslint.configs.strictTypeChecked,
+      // Optionally, add this for stylistic rules
+      ...tseslint.configs.stylisticTypeChecked,
+
+      // Other configs...
+    ],
+    languageOptions: {
+      parserOptions: {
+        project: ['./tsconfig.node.json', './tsconfig.app.json'],
+        tsconfigRootDir: import.meta.dirname,
+      },
+      // other options...
+    },
+  },
+])
+```
+
+You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:
+
+```js
+// eslint.config.js
+import reactX from 'eslint-plugin-react-x'
+import reactDom from 'eslint-plugin-react-dom'
+
+export default tseslint.config([
+  globalIgnores(['dist']),
+  {
+    files: ['**/*.{ts,tsx}'],
+    extends: [
+      // Other configs...
+      // Enable lint rules for React
+      reactX.configs['recommended-typescript'],
+      // Enable lint rules for React DOM
+      reactDom.configs.recommended,
+    ],
+    languageOptions: {
+      parserOptions: {
+        project: ['./tsconfig.node.json', './tsconfig.app.json'],
+        tsconfigRootDir: import.meta.dirname,
+      },
+      // other options...
+    },
+  },
+])
+```

package/dist/Buttons/Button.cjs

@@ -0,0 +1,42 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// lib/Buttons/Button.jsx
+var Button_exports = {};
+__export(Button_exports, {
+  Button: () => Button
+});
+module.exports = __toCommonJS(Button_exports);
+var import_react = __toESM(require("react"), 1);
+var Button = ({ children, onClick, ...props }) => {
+  return /* @__PURE__ */ import_react.default.createElement("button", { className: "btn", onClick, ...props }, children);
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Button
+});

package/dist/Buttons/Button.d.cjs

@@ -0,0 +1,17 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+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);
+
+// lib/Buttons/Button.d.ts
+var Button_d_exports = {};
+module.exports = __toCommonJS(Button_d_exports);

package/dist/Buttons/Button.d.cts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+
+interface ButtonProps {
+  children: React.ReactNode;
+  onClick?: () => void;
+}
+
+declare const Button: React.FC<ButtonProps>;
+
+export { Button, type ButtonProps };

package/dist/Buttons/Button.d.d.cts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+
+interface ButtonProps {
+  children: React.ReactNode;
+  onClick?: () => void;
+}
+
+declare const Button: React.FC<ButtonProps>;
+
+export { Button, type ButtonProps };

package/dist/Buttons/Button.d.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+
+interface ButtonProps {
+  children: React.ReactNode;
+  onClick?: () => void;
+}
+
+declare const Button: React.FC<ButtonProps>;
+
+export { Button, type ButtonProps };

package/dist/Buttons/Button.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+
+interface ButtonProps {
+  children: React.ReactNode;
+  onClick?: () => void;
+}
+
+declare const Button: React.FC<ButtonProps>;
+
+export { Button, type ButtonProps };

package/dist/Buttons/Button.js

@@ -0,0 +1,6 @@
+import {
+  Button
+} from "../chunk-ASP3DBRX.js";
+export {
+  Button
+};

package/dist/CheckBoxes/CheckBox.cjs

@@ -0,0 +1,62 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// lib/CheckBoxes/CheckBox.jsx
+var CheckBox_exports = {};
+__export(CheckBox_exports, {
+  Checkbox: () => Checkbox
+});
+module.exports = __toCommonJS(CheckBox_exports);
+var import_react = __toESM(require("react"), 1);
+var Checkbox = ({
+  id,
+  label,
+  checked,
+  onChange,
+  disabled = false,
+  className = "",
+  style
+}) => {
+  const handleChange = (e) => {
+    onChange(e.target.checked);
+  };
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "checkbox-wrapper-13" }, /* @__PURE__ */ import_react.default.createElement("label", { className: `${className}`, style }, /* @__PURE__ */ import_react.default.createElement(
+    "input",
+    {
+      id,
+      type: "checkbox",
+      checked,
+      onChange: handleChange,
+      disabled
+    }
+  ), label && /* @__PURE__ */ import_react.default.createElement("span", { className: "checkbox-label" }, label)));
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Checkbox
+});

package/dist/CheckBoxes/CheckBox.d.cjs

@@ -0,0 +1,17 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+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);
+
+// lib/CheckBoxes/CheckBox.d.ts
+var CheckBox_d_exports = {};
+module.exports = __toCommonJS(CheckBox_d_exports);

package/dist/CheckBoxes/CheckBox.d.cts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+
+interface CheckboxProps {
+  id?: string;
+  label?: string;
+  checked: boolean;
+  onChange: (checked: boolean) => void;
+  disabled?: boolean;
+  className?: string;
+  style?: React.CSSProperties;
+}
+
+declare const Checkbox: React.FC<CheckboxProps>;
+
+export { Checkbox, type CheckboxProps };

package/dist/CheckBoxes/CheckBox.d.d.cts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+
+interface CheckboxProps {
+  id?: string;
+  label?: string;
+  checked: boolean;
+  onChange: (checked: boolean) => void;
+  disabled?: boolean;
+  className?: string;
+  style?: React.CSSProperties;
+}
+
+declare const Checkbox: React.FC<CheckboxProps>;
+
+export { Checkbox, type CheckboxProps };

package/dist/CheckBoxes/CheckBox.d.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+
+interface CheckboxProps {
+  id?: string;
+  label?: string;
+  checked: boolean;
+  onChange: (checked: boolean) => void;
+  disabled?: boolean;
+  className?: string;
+  style?: React.CSSProperties;
+}
+
+declare const Checkbox: React.FC<CheckboxProps>;
+
+export { Checkbox, type CheckboxProps };

package/dist/CheckBoxes/CheckBox.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+
+interface CheckboxProps {
+  id?: string;
+  label?: string;
+  checked: boolean;
+  onChange: (checked: boolean) => void;
+  disabled?: boolean;
+  className?: string;
+  style?: React.CSSProperties;
+}
+
+declare const Checkbox: React.FC<CheckboxProps>;
+
+export { Checkbox, type CheckboxProps };

package/dist/CheckBoxes/CheckBox.js

@@ -0,0 +1,6 @@
+import {
+  Checkbox
+} from "../chunk-QKDJLUKZ.js";
+export {
+  Checkbox
+};

package/dist/Contexts/rufousThemeProvider.cjs

@@ -0,0 +1,177 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// lib/Contexts/rufousThemeProvider.jsx
+var rufousThemeProvider_exports = {};
+__export(rufousThemeProvider_exports, {
+  RufousThemeProvider: () => RufousThemeProvider,
+  useRufousTheme: () => useRufousTheme
+});
+module.exports = __toCommonJS(rufousThemeProvider_exports);
+var import_react = __toESM(require("react"), 1);
+
+// lib/utils/constants.ts
+var APP_THEMES = {
+  default: {
+    name: "Default",
+    primaryColor: "#707070",
+    secondaryColor: "#e0e0e0",
+    backgroundColor: "#f5f5f5",
+    surfaceColor: "#ffffff",
+    iconColor: "#707070",
+    textColor: "#2d2d2d",
+    textSecondaryColor: "#6f6f6f",
+    borderColor: "#dcdcdc",
+    hoverColor: "#d4d4d4",
+    activeColor: "#5a5a5a",
+    button: {
+      background: "#707070",
+      text: "#ffffff",
+      hoverBackground: "#5f5f5f",
+      disabledBackground: "#cfcfcf"
+    },
+    input: {
+      background: "#ffffff",
+      text: "#2d2d2d",
+      border: "#ccc",
+      placeholder: "#999",
+      focusBorder: "#707070"
+    },
+    card: {
+      background: "#ffffff",
+      shadow: "0 1px 3px rgba(0,0,0,0.1)"
+    },
+    sidebar: {
+      background: "#e8e8e8",
+      text: "#2d2d2d",
+      hover: "#dcdcdc"
+    },
+    success: "#4CAF50",
+    warning: "#FFC107",
+    error: "#F44336"
+  },
+  rufous: {
+    name: "Rufous",
+    primaryColor: "#a81c08",
+    secondaryColor: "#f7d4cc",
+    backgroundColor: "#fff8f7",
+    surfaceColor: "#fff",
+    iconColor: "#a81c08",
+    textColor: "#2d2d2d",
+    textSecondaryColor: "#6f6f6f",
+    borderColor: "#e5e5e5",
+    hoverColor: "#f3c2b9",
+    activeColor: "#c01708",
+    button: {
+      background: "#a81c08",
+      text: "#ffffff",
+      hoverBackground: "#8f1907",
+      disabledBackground: "#f4cccc"
+    },
+    input: {
+      background: "#ffffff",
+      text: "#2d2d2d",
+      border: "#ccc",
+      placeholder: "#999",
+      focusBorder: "#a81c08"
+    },
+    card: {
+      background: "#ffffff",
+      shadow: "0 1px 3px rgba(0,0,0,0.1)"
+    },
+    sidebar: {
+      background: "#fff0ed",
+      text: "#2d2d2d",
+      hover: "#f5e0dc"
+    },
+    success: "#4CAF50",
+    warning: "#FFC107",
+    error: "#F44336"
+  }
+};
+
+// lib/Contexts/rufousThemeProvider.jsx
+var RufousThemeContext = (0, import_react.createContext)(null);
+var RufousThemeProvider = ({ children }) => {
+  const [committedThemeKey, setCommittedThemeKey] = (0, import_react.useState)("default");
+  const [previewThemeKey, setPreviewThemeKey] = (0, import_react.useState)("default");
+  const [settings, setSettings] = (0, import_react.useState)(null);
+  const getGeneralSettings = async () => {
+    try {
+      const theme = localStorage.getItem("theme") || "default";
+      setCommittedThemeKey(theme);
+      setPreviewThemeKey(theme);
+    } catch (err) {
+      console.error("Error fetching general settings:", err);
+    }
+  };
+  (0, import_react.useEffect)(() => {
+    getGeneralSettings();
+  }, []);
+  const fullTheme = (0, import_react.useMemo)(() => {
+    return {
+      themeKey: previewThemeKey || settings.theme,
+      customStyles: APP_THEMES[previewThemeKey || settings.theme]
+    };
+  }, [previewThemeKey, settings]);
+  const previewTheme = (key) => setPreviewThemeKey(key);
+  const saveTheme = (inputKey) => {
+    const key = previewThemeKey || settings.theme || inputKey;
+    localStorage.setItem("theme", key);
+    setCommittedThemeKey(key);
+  };
+  const cancelTheme = () => setPreviewThemeKey(committedThemeKey);
+  return /* @__PURE__ */ import_react.default.createElement(
+    RufousThemeContext.Provider,
+    {
+      value: {
+        theme: fullTheme,
+        previewTheme,
+        saveTheme,
+        cancelTheme,
+        currentThemeKey: previewThemeKey,
+        committedThemeKey,
+        settings,
+        updateSettings: (v) => setSettings(v)
+      }
+    },
+    /* @__PURE__ */ import_react.default.createElement(
+      "div",
+      {
+        className: `theme-${previewThemeKey || committedThemeKey || "default"}`
+      },
+      children
+    )
+  );
+};
+var useRufousTheme = () => (0, import_react.useContext)(RufousThemeContext);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  RufousThemeProvider,
+  useRufousTheme
+});

package/dist/Contexts/rufousThemeProvider.d.cjs

@@ -0,0 +1,17 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+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);
+
+// lib/Contexts/rufousThemeProvider.d.ts
+var rufousThemeProvider_d_exports = {};
+module.exports = __toCommonJS(rufousThemeProvider_d_exports);

package/dist/Contexts/rufousThemeProvider.d.cts

@@ -0,0 +1,28 @@
+import { ReactNode } from 'react';
+
+// customThemeProvider.d.ts
+
+
+
+type Theme = {
+  themeKey: string;
+  customStyles: any; // Replace `any` with a proper type if you have a defined theme structure
+};
+
+type RufousThemeContextType = {
+  theme: Theme;
+  previewTheme: (key: string) => void;
+  saveTheme: () => void;
+  cancelTheme: () => void;
+  currentThemeKey: string;
+  committedThemeKey: string;
+  updateSettings: () => void;
+};
+
+declare const RufousThemeProvider: React.FC<{
+  children: ReactNode;
+}>;
+
+declare const useRufousTheme: () => RufousThemeContextType;
+
+export { RufousThemeProvider, useRufousTheme };

package/dist/Contexts/rufousThemeProvider.d.d.cts

@@ -0,0 +1,28 @@
+import { ReactNode } from 'react';
+
+// customThemeProvider.d.ts
+
+
+
+type Theme = {
+  themeKey: string;
+  customStyles: any; // Replace `any` with a proper type if you have a defined theme structure
+};
+
+type RufousThemeContextType = {
+  theme: Theme;
+  previewTheme: (key: string) => void;
+  saveTheme: () => void;
+  cancelTheme: () => void;
+  currentThemeKey: string;
+  committedThemeKey: string;
+  updateSettings: () => void;
+};
+
+declare const RufousThemeProvider: React.FC<{
+  children: ReactNode;
+}>;
+
+declare const useRufousTheme: () => RufousThemeContextType;
+
+export { RufousThemeProvider, useRufousTheme };

package/dist/Contexts/rufousThemeProvider.d.d.ts

@@ -0,0 +1,28 @@
+import { ReactNode } from 'react';
+
+// customThemeProvider.d.ts
+
+
+
+type Theme = {
+  themeKey: string;
+  customStyles: any; // Replace `any` with a proper type if you have a defined theme structure
+};
+
+type RufousThemeContextType = {
+  theme: Theme;
+  previewTheme: (key: string) => void;
+  saveTheme: () => void;
+  cancelTheme: () => void;
+  currentThemeKey: string;
+  committedThemeKey: string;
+  updateSettings: () => void;
+};
+
+declare const RufousThemeProvider: React.FC<{
+  children: ReactNode;
+}>;
+
+declare const useRufousTheme: () => RufousThemeContextType;
+
+export { RufousThemeProvider, useRufousTheme };

package/dist/Contexts/rufousThemeProvider.d.ts

@@ -0,0 +1,28 @@
+import { ReactNode } from 'react';
+
+// customThemeProvider.d.ts
+
+
+
+type Theme = {
+  themeKey: string;
+  customStyles: any; // Replace `any` with a proper type if you have a defined theme structure
+};
+
+type RufousThemeContextType = {
+  theme: Theme;
+  previewTheme: (key: string) => void;
+  saveTheme: () => void;
+  cancelTheme: () => void;
+  currentThemeKey: string;
+  committedThemeKey: string;
+  updateSettings: () => void;
+};
+
+declare const RufousThemeProvider: React.FC<{
+  children: ReactNode;
+}>;
+
+declare const useRufousTheme: () => RufousThemeContextType;
+
+export { RufousThemeProvider, useRufousTheme };

package/dist/Contexts/rufousThemeProvider.js

@@ -0,0 +1,9 @@
+import {
+  RufousThemeProvider,
+  useRufousTheme
+} from "../chunk-5VDW4EZK.js";
+import "../chunk-2FHTGYR4.js";
+export {
+  RufousThemeProvider,
+  useRufousTheme
+};