@macolmenerori/component-library 1.0.1 → 1.1.0

package/README.md

@@ -4,7 +4,7 @@ A modern React component library built with TypeScript, providing reusable UI co
 
 ## Features
 
-- Built with React 19 and TypeScript
+- Built with React and TypeScript
 - Fully typed components with TypeScript declarations
 - ESM and CommonJS support
 - Tree-shakeable exports
@@ -133,8 +133,8 @@ This section is for contributors working on the library itself.
 
 ### Prerequisites
 
-- Node.js >= 22.0.0 and < 23.0.0
-- pnpm 10.24.0
+- Node.js 24
+- pnpm 10.25.0
 
 ### Setup
 
@@ -174,9 +174,9 @@ To publish a new version:
 
 ## Technology Stack
 
-- **React** 19.0.0 - UI library
-- **TypeScript** 5.7.3 - Type safety
-- **Vite** 7.0.5 - Build tool and dev server
+- **React** 18.0.0 || 19.0.0 - UI library
+- **TypeScript** - Type safety
+- **Vite** - Build tool and dev server
 - **ESLint** - Code linting
 - **Prettier** - Code formatting
 

package/dist/MarkdownRender-C-bSlM80.cjs

@@ -0,0 +1,2 @@
+"use strict";const r=require("react/jsx-runtime"),s=require("react-markdown"),i=require("remark-gfm"),t=({content:e,className:n})=>r.jsx("div",{className:n,children:r.jsx(s,{remarkPlugins:[i],children:e})});exports.MarkdownRender=t;
+//# sourceMappingURL=MarkdownRender-C-bSlM80.cjs.map

package/dist/MarkdownRender-C-bSlM80.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MarkdownRender-C-bSlM80.cjs","sources":["../src/components/MarkdownRender/MarkdownRender.tsx"],"sourcesContent":["import ReactMarkdown from 'react-markdown';\n\nimport remarkGfm from 'remark-gfm';\n\nexport interface MarkdownProps {\n  /** The markdown string to render */\n  content: string;\n  /** Optional CSS class name for the container */\n  className?: string;\n}\n\n/**\n * A component that renders a markdown string as HTML.\n * Supports GitHub Flavored Markdown (GFM) including tables,\n * strikethrough, task lists, and autolinks.\n */\nconst MarkdownRender: React.FC<MarkdownProps> = ({ content, className }) => {\n  return (\n    <div className={className}>\n      <ReactMarkdown remarkPlugins={[remarkGfm]}>{content}</ReactMarkdown>\n    </div>\n  );\n};\n\nexport default MarkdownRender;\n"],"names":["MarkdownRender","content","className","jsx","ReactMarkdown","remarkGfm"],"mappings":"sGAgBMA,EAA0C,CAAC,CAAE,QAAAC,EAAS,UAAAC,KAExDC,EAAAA,IAAC,MAAA,CAAI,UAAAD,EACH,SAAAC,EAAAA,IAACC,EAAA,CAAc,cAAe,CAACC,CAAS,EAAI,SAAAJ,CAAA,CAAQ,CAAA,CACtD"}

package/dist/MarkdownRender-DLY5lZNG.js

@@ -0,0 +1,8 @@
+import { jsx as r } from "react/jsx-runtime";
+import m from "react-markdown";
+import n from "remark-gfm";
+const d = ({ content: o, className: e }) => /* @__PURE__ */ r("div", { className: e, children: /* @__PURE__ */ r(m, { remarkPlugins: [n], children: o }) });
+export {
+  d as M
+};
+//# sourceMappingURL=MarkdownRender-DLY5lZNG.js.map

package/dist/MarkdownRender-DLY5lZNG.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MarkdownRender-DLY5lZNG.js","sources":["../src/components/MarkdownRender/MarkdownRender.tsx"],"sourcesContent":["import ReactMarkdown from 'react-markdown';\n\nimport remarkGfm from 'remark-gfm';\n\nexport interface MarkdownProps {\n  /** The markdown string to render */\n  content: string;\n  /** Optional CSS class name for the container */\n  className?: string;\n}\n\n/**\n * A component that renders a markdown string as HTML.\n * Supports GitHub Flavored Markdown (GFM) including tables,\n * strikethrough, task lists, and autolinks.\n */\nconst MarkdownRender: React.FC<MarkdownProps> = ({ content, className }) => {\n  return (\n    <div className={className}>\n      <ReactMarkdown remarkPlugins={[remarkGfm]}>{content}</ReactMarkdown>\n    </div>\n  );\n};\n\nexport default MarkdownRender;\n"],"names":["MarkdownRender","content","className","jsx","ReactMarkdown","remarkGfm"],"mappings":";;;AAgBA,MAAMA,IAA0C,CAAC,EAAE,SAAAC,GAAS,WAAAC,QAExD,gBAAAC,EAAC,OAAA,EAAI,WAAAD,GACH,UAAA,gBAAAC,EAACC,GAAA,EAAc,eAAe,CAACC,CAAS,GAAI,UAAAJ,EAAA,CAAQ,EAAA,CACtD;"}

package/dist/ThemeSwitch-C7k1_MA4.cjs

@@ -0,0 +1,2 @@
+"use strict";require('./ThemeSwitch.css');const e=require("react/jsx-runtime"),l="ThemeSwitch-module__sunCore___tUhud",m="ThemeSwitch-module__small___YlvWo",d="ThemeSwitch-module__medium___Q8Rro",r="ThemeSwitch-module__large___BMOxC",n="ThemeSwitch-module__sunspot1___8RI1V",u="ThemeSwitch-module__sunspot2___U0whF",i="ThemeSwitch-module__sunspot3___kWYEI",h="ThemeSwitch-module__sunRay___t1B4U",w="ThemeSwitch-module__rotateSun___JQByd",S="ThemeSwitch-module__switchContainer___VENjU",T="ThemeSwitch-module__dark___a4vSn",N="ThemeSwitch-module__background___Rpodp",x="ThemeSwitch-module__cloud___OoOyx",j="ThemeSwitch-module__light___ddTa2",v="ThemeSwitch-module__cloud1___aqGNx",g="ThemeSwitch-module__floatCloud1___MdWMj",$="ThemeSwitch-module__cloud2___guY71",C="ThemeSwitch-module__floatCloud2___2x6Sp",p="ThemeSwitch-module__cloud3___7-NhR",R="ThemeSwitch-module__floatCloud3___FJCbV",y="ThemeSwitch-module__star___Z98bU",k="ThemeSwitch-module__star1___rhotb",b="ThemeSwitch-module__star2___pzbNR",f="ThemeSwitch-module__star3___iK7lJ",I="ThemeSwitch-module__star4___t5pqN",F="ThemeSwitch-module__star5___dx42N",J="ThemeSwitch-module__star6___wur-I",K="ThemeSwitch-module__star7___KONgd",U="ThemeSwitch-module__star8___gIYpk",O="ThemeSwitch-module__twinkle___Abun5",V="ThemeSwitch-module__toggle___L5FGS",W="ThemeSwitch-module__sun___s8noI",Y="ThemeSwitch-module__moon___TNpFJ",q="ThemeSwitch-module__moonCore___svwjb",B="ThemeSwitch-module__crater1___swpHc",E="ThemeSwitch-module__crater2___WQVKR",Q="ThemeSwitch-module__crater3___F-KJu",G="ThemeSwitch-module__crater4___ZsIb7",s={sunCore:l,small:m,medium:d,large:r,sunspot1:n,sunspot2:u,sunspot3:i,sunRay:h,rotateSun:w,switchContainer:S,dark:T,background:N,cloud:x,light:j,cloud1:v,floatCloud1:g,cloud2:$,floatCloud2:C,cloud3:p,floatCloud3:R,star:y,star1:k,star2:b,star3:f,star4:I,star5:F,star6:J,star7:K,star8:U,twinkle:O,toggle:V,sun:W,moon:Y,moonCore:q,crater1:B,crater2:E,crater3:Q,crater4:G},Z=({enableDarkMode:t,setEnableDarkMode:a,size:c="large"})=>{const _=()=>{a(!t)};return e.jsxs("div",{className:`${s.switchContainer} ${s[c]} ${t?s.dark:s.light}`,onClick:_,role:"button",tabIndex:0,"aria-label":`Switch to ${t?"light":"dark"} mode`,onKeyDown:o=>{(o.key==="Enter"||o.key===" ")&&_()},children:[e.jsxs("div",{className:s.background,children:[e.jsx("div",{className:`${s.cloud} ${s.cloud1}`}),e.jsx("div",{className:`${s.cloud} ${s.cloud2}`}),e.jsx("div",{className:`${s.cloud} ${s.cloud3}`}),e.jsx("div",{className:`${s.star} ${s.star1}`}),e.jsx("div",{className:`${s.star} ${s.star2}`}),e.jsx("div",{className:`${s.star} ${s.star3}`}),e.jsx("div",{className:`${s.star} ${s.star4}`}),e.jsx("div",{className:`${s.star} ${s.star5}`}),e.jsx("div",{className:`${s.star} ${s.star6}`}),e.jsx("div",{className:`${s.star} ${s.star7}`}),e.jsx("div",{className:`${s.star} ${s.star8}`})]}),e.jsxs("div",{className:s.toggle,children:[e.jsxs("div",{className:s.sun,children:[e.jsxs("div",{className:s.sunCore,children:[e.jsx("div",{className:s.sunspot1}),e.jsx("div",{className:s.sunspot2}),e.jsx("div",{className:s.sunspot3})]}),e.jsx("div",{className:s.sunRay}),e.jsx("div",{className:s.sunRay}),e.jsx("div",{className:s.sunRay}),e.jsx("div",{className:s.sunRay}),e.jsx("div",{className:s.sunRay}),e.jsx("div",{className:s.sunRay}),e.jsx("div",{className:s.sunRay}),e.jsx("div",{className:s.sunRay})]}),e.jsx("div",{className:s.moon,children:e.jsxs("div",{className:s.moonCore,children:[e.jsx("div",{className:s.crater1}),e.jsx("div",{className:s.crater2}),e.jsx("div",{className:s.crater3}),e.jsx("div",{className:s.crater4})]})})]})]})};exports.ThemeSwitch=Z;
+//# sourceMappingURL=ThemeSwitch-C7k1_MA4.cjs.map

package/dist/ThemeSwitch-C7k1_MA4.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeSwitch-C7k1_MA4.cjs","sources":["../src/components/ThemeSwitch/ThemeSwitch.tsx"],"sourcesContent":["import React from 'react';\n\nimport styles from './ThemeSwitch.module.css';\n\n/**\n * Props for the ThemeSwitch component\n */\nexport interface ThemeSwitchProps {\n  /** Whether dark mode is currently enabled */\n  enableDarkMode: boolean;\n  /** Callback function to update the dark mode state */\n  setEnableDarkMode: (value: boolean) => void;\n  /** Size variant of the switch. Defaults to 'large' */\n  size?: 'small' | 'medium' | 'large';\n}\n\n/**\n * ThemeSwitch Component\n *\n * An animated toggle switch for switching between light and dark themes.\n * Features sun/moon icons with animated clouds (light mode) and stars (dark mode).\n *\n * @component\n * @example\n * ```tsx\n * const [darkMode, setDarkMode] = useState(false);\n * <ThemeSwitch\n *   enableDarkMode={darkMode}\n *   setEnableDarkMode={setDarkMode}\n *   size=\"medium\"\n * />\n * ```\n */\nconst ThemeSwitch: React.FC<ThemeSwitchProps> = ({\n  enableDarkMode,\n  setEnableDarkMode,\n  size = 'large'\n}) => {\n  const handleToggle = () => {\n    setEnableDarkMode(!enableDarkMode);\n  };\n\n  return (\n    <div\n      className={`${styles.switchContainer} ${styles[size]} ${\n        enableDarkMode ? styles.dark : styles.light\n      }`}\n      onClick={handleToggle}\n      role=\"button\"\n      tabIndex={0}\n      aria-label={`Switch to ${enableDarkMode ? 'light' : 'dark'} mode`}\n      onKeyDown={(e) => {\n        if (e.key === 'Enter' || e.key === ' ') {\n          handleToggle();\n        }\n      }}\n    >\n      {/* Background elements */}\n      <div className={styles.background}>\n        {/* Clouds for light mode */}\n        <div className={`${styles.cloud} ${styles.cloud1}`}></div>\n        <div className={`${styles.cloud} ${styles.cloud2}`}></div>\n        <div className={`${styles.cloud} ${styles.cloud3}`}></div>\n\n        {/* Stars for dark mode */}\n        <div className={`${styles.star} ${styles.star1}`}></div>\n        <div className={`${styles.star} ${styles.star2}`}></div>\n        <div className={`${styles.star} ${styles.star3}`}></div>\n        <div className={`${styles.star} ${styles.star4}`}></div>\n        <div className={`${styles.star} ${styles.star5}`}></div>\n        <div className={`${styles.star} ${styles.star6}`}></div>\n        <div className={`${styles.star} ${styles.star7}`}></div>\n        <div className={`${styles.star} ${styles.star8}`}></div>\n      </div>\n\n      {/* Toggle circle with sun/moon */}\n      <div className={styles.toggle}>\n        {/* Sun */}\n        <div className={styles.sun}>\n          <div className={styles.sunCore}>\n            <div className={styles.sunspot1}></div>\n            <div className={styles.sunspot2}></div>\n            <div className={styles.sunspot3}></div>\n          </div>\n          <div className={styles.sunRay}></div>\n          <div className={styles.sunRay}></div>\n          <div className={styles.sunRay}></div>\n          <div className={styles.sunRay}></div>\n          <div className={styles.sunRay}></div>\n          <div className={styles.sunRay}></div>\n          <div className={styles.sunRay}></div>\n          <div className={styles.sunRay}></div>\n        </div>\n\n        {/* Moon */}\n        <div className={styles.moon}>\n          <div className={styles.moonCore}>\n            <div className={styles.crater1}></div>\n            <div className={styles.crater2}></div>\n            <div className={styles.crater3}></div>\n            <div className={styles.crater4}></div>\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport default ThemeSwitch;\n"],"names":["ThemeSwitch","enableDarkMode","setEnableDarkMode","size","handleToggle","jsxs","styles","e","jsx"],"mappings":"s4DAiCMA,EAA0C,CAAC,CAC/C,eAAAC,EACA,kBAAAC,EACA,KAAAC,EAAO,OACT,IAAM,CACJ,MAAMC,EAAe,IAAM,CACzBF,EAAkB,CAACD,CAAc,CACnC,EAEA,OACEI,EAAAA,KAAC,MAAA,CACC,UAAW,GAAGC,EAAO,eAAe,IAAIA,EAAOH,CAAI,CAAC,IAClDF,EAAiBK,EAAO,KAAOA,EAAO,KACxC,GACA,QAASF,EACT,KAAK,SACL,SAAU,EACV,aAAY,aAAaH,EAAiB,QAAU,MAAM,QAC1D,UAAYM,GAAM,EACZA,EAAE,MAAQ,SAAWA,EAAE,MAAQ,MACjCH,EAAA,CAEJ,EAGA,SAAA,CAAAC,EAAAA,KAAC,MAAA,CAAI,UAAWC,EAAO,WAErB,SAAA,CAAAE,EAAAA,IAAC,MAAA,CAAI,UAAW,GAAGF,EAAO,KAAK,IAAIA,EAAO,MAAM,EAAA,CAAI,EACpDE,EAAAA,IAAC,OAAI,UAAW,GAAGF,EAAO,KAAK,IAAIA,EAAO,MAAM,EAAA,CAAI,EACpDE,EAAAA,IAAC,OAAI,UAAW,GAAGF,EAAO,KAAK,IAAIA,EAAO,MAAM,EAAA,CAAI,EAGpDE,EAAAA,IAAC,OAAI,UAAW,GAAGF,EAAO,IAAI,IAAIA,EAAO,KAAK,EAAA,CAAI,EAClDE,EAAAA,IAAC,OAAI,UAAW,GAAGF,EAAO,IAAI,IAAIA,EAAO,KAAK,EAAA,CAAI,EAClDE,EAAAA,IAAC,OAAI,UAAW,GAAGF,EAAO,IAAI,IAAIA,EAAO,KAAK,EAAA,CAAI,EAClDE,EAAAA,IAAC,OAAI,UAAW,GAAGF,EAAO,IAAI,IAAIA,EAAO,KAAK,EAAA,CAAI,EAClDE,EAAAA,IAAC,OAAI,UAAW,GAAGF,EAAO,IAAI,IAAIA,EAAO,KAAK,EAAA,CAAI,EAClDE,EAAAA,IAAC,OAAI,UAAW,GAAGF,EAAO,IAAI,IAAIA,EAAO,KAAK,EAAA,CAAI,EAClDE,EAAAA,IAAC,OAAI,UAAW,GAAGF,EAAO,IAAI,IAAIA,EAAO,KAAK,EAAA,CAAI,EAClDE,EAAAA,IAAC,OAAI,UAAW,GAAGF,EAAO,IAAI,IAAIA,EAAO,KAAK,EAAA,CAAI,CAAA,EACpD,EAGAD,EAAAA,KAAC,MAAA,CAAI,UAAWC,EAAO,OAErB,SAAA,CAAAD,EAAAA,KAAC,MAAA,CAAI,UAAWC,EAAO,IACrB,SAAA,CAAAD,EAAAA,KAAC,MAAA,CAAI,UAAWC,EAAO,QACrB,SAAA,CAAAE,EAAAA,IAAC,MAAA,CAAI,UAAWF,EAAO,QAAA,CAAU,EACjCE,EAAAA,IAAC,MAAA,CAAI,UAAWF,EAAO,QAAA,CAAU,EACjCE,EAAAA,IAAC,MAAA,CAAI,UAAWF,EAAO,QAAA,CAAU,CAAA,EACnC,EACAE,EAAAA,IAAC,MAAA,CAAI,UAAWF,EAAO,MAAA,CAAQ,EAC/BE,EAAAA,IAAC,MAAA,CAAI,UAAWF,EAAO,MAAA,CAAQ,EAC/BE,EAAAA,IAAC,MAAA,CAAI,UAAWF,EAAO,MAAA,CAAQ,EAC/BE,EAAAA,IAAC,MAAA,CAAI,UAAWF,EAAO,MAAA,CAAQ,EAC/BE,EAAAA,IAAC,MAAA,CAAI,UAAWF,EAAO,MAAA,CAAQ,EAC/BE,EAAAA,IAAC,MAAA,CAAI,UAAWF,EAAO,MAAA,CAAQ,EAC/BE,EAAAA,IAAC,MAAA,CAAI,UAAWF,EAAO,MAAA,CAAQ,EAC/BE,EAAAA,IAAC,MAAA,CAAI,UAAWF,EAAO,MAAA,CAAQ,CAAA,EACjC,EAGAE,EAAAA,IAAC,OAAI,UAAWF,EAAO,KACrB,SAAAD,EAAAA,KAAC,MAAA,CAAI,UAAWC,EAAO,SACrB,SAAA,CAAAE,EAAAA,IAAC,MAAA,CAAI,UAAWF,EAAO,OAAA,CAAS,EAChCE,EAAAA,IAAC,MAAA,CAAI,UAAWF,EAAO,OAAA,CAAS,EAChCE,EAAAA,IAAC,MAAA,CAAI,UAAWF,EAAO,OAAA,CAAS,EAChCE,EAAAA,IAAC,MAAA,CAAI,UAAWF,EAAO,OAAA,CAAS,CAAA,CAAA,CAClC,CAAA,CACF,CAAA,CAAA,CACF,CAAA,CAAA,CAAA,CAGN"}

package/dist/ThemeSwitch-DbaEio36.js

@@ -0,0 +1,104 @@
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import './ThemeSwitch.css';const m = "ThemeSwitch-module__sunCore___tUhud", d = "ThemeSwitch-module__small___YlvWo", r = "ThemeSwitch-module__medium___Q8Rro", n = "ThemeSwitch-module__large___BMOxC", u = "ThemeSwitch-module__sunspot1___8RI1V", i = "ThemeSwitch-module__sunspot2___U0whF", h = "ThemeSwitch-module__sunspot3___kWYEI", w = "ThemeSwitch-module__sunRay___t1B4U", S = "ThemeSwitch-module__rotateSun___JQByd", T = "ThemeSwitch-module__switchContainer___VENjU", N = "ThemeSwitch-module__dark___a4vSn", v = "ThemeSwitch-module__background___Rpodp", g = "ThemeSwitch-module__cloud___OoOyx", $ = "ThemeSwitch-module__light___ddTa2", C = "ThemeSwitch-module__cloud1___aqGNx", p = "ThemeSwitch-module__floatCloud1___MdWMj", y = "ThemeSwitch-module__cloud2___guY71", R = "ThemeSwitch-module__floatCloud2___2x6Sp", k = "ThemeSwitch-module__cloud3___7-NhR", b = "ThemeSwitch-module__floatCloud3___FJCbV", f = "ThemeSwitch-module__star___Z98bU", x = "ThemeSwitch-module__star1___rhotb", I = "ThemeSwitch-module__star2___pzbNR", j = "ThemeSwitch-module__star3___iK7lJ", F = "ThemeSwitch-module__star4___t5pqN", J = "ThemeSwitch-module__star5___dx42N", K = "ThemeSwitch-module__star6___wur-I", U = "ThemeSwitch-module__star7___KONgd", O = "ThemeSwitch-module__star8___gIYpk", V = "ThemeSwitch-module__twinkle___Abun5", W = "ThemeSwitch-module__toggle___L5FGS", Y = "ThemeSwitch-module__sun___s8noI", B = "ThemeSwitch-module__moon___TNpFJ", E = "ThemeSwitch-module__moonCore___svwjb", Q = "ThemeSwitch-module__crater1___swpHc", q = "ThemeSwitch-module__crater2___WQVKR", G = "ThemeSwitch-module__crater3___F-KJu", Z = "ThemeSwitch-module__crater4___ZsIb7", s = {
+  sunCore: m,
+  small: d,
+  medium: r,
+  large: n,
+  sunspot1: u,
+  sunspot2: i,
+  sunspot3: h,
+  sunRay: w,
+  rotateSun: S,
+  switchContainer: T,
+  dark: N,
+  background: v,
+  cloud: g,
+  light: $,
+  cloud1: C,
+  floatCloud1: p,
+  cloud2: y,
+  floatCloud2: R,
+  cloud3: k,
+  floatCloud3: b,
+  star: f,
+  star1: x,
+  star2: I,
+  star3: j,
+  star4: F,
+  star5: J,
+  star6: K,
+  star7: U,
+  star8: O,
+  twinkle: V,
+  toggle: W,
+  sun: Y,
+  moon: B,
+  moonCore: E,
+  crater1: Q,
+  crater2: q,
+  crater3: G,
+  crater4: Z
+}, A = ({
+  enableDarkMode: _,
+  setEnableDarkMode: c,
+  size: l = "large"
+}) => {
+  const o = () => {
+    c(!_);
+  };
+  return /* @__PURE__ */ t(
+    "div",
+    {
+      className: `${s.switchContainer} ${s[l]} ${_ ? s.dark : s.light}`,
+      onClick: o,
+      role: "button",
+      tabIndex: 0,
+      "aria-label": `Switch to ${_ ? "light" : "dark"} mode`,
+      onKeyDown: (a) => {
+        (a.key === "Enter" || a.key === " ") && o();
+      },
+      children: [
+        /* @__PURE__ */ t("div", { className: s.background, children: [
+          /* @__PURE__ */ e("div", { className: `${s.cloud} ${s.cloud1}` }),
+          /* @__PURE__ */ e("div", { className: `${s.cloud} ${s.cloud2}` }),
+          /* @__PURE__ */ e("div", { className: `${s.cloud} ${s.cloud3}` }),
+          /* @__PURE__ */ e("div", { className: `${s.star} ${s.star1}` }),
+          /* @__PURE__ */ e("div", { className: `${s.star} ${s.star2}` }),
+          /* @__PURE__ */ e("div", { className: `${s.star} ${s.star3}` }),
+          /* @__PURE__ */ e("div", { className: `${s.star} ${s.star4}` }),
+          /* @__PURE__ */ e("div", { className: `${s.star} ${s.star5}` }),
+          /* @__PURE__ */ e("div", { className: `${s.star} ${s.star6}` }),
+          /* @__PURE__ */ e("div", { className: `${s.star} ${s.star7}` }),
+          /* @__PURE__ */ e("div", { className: `${s.star} ${s.star8}` })
+        ] }),
+        /* @__PURE__ */ t("div", { className: s.toggle, children: [
+          /* @__PURE__ */ t("div", { className: s.sun, children: [
+            /* @__PURE__ */ t("div", { className: s.sunCore, children: [
+              /* @__PURE__ */ e("div", { className: s.sunspot1 }),
+              /* @__PURE__ */ e("div", { className: s.sunspot2 }),
+              /* @__PURE__ */ e("div", { className: s.sunspot3 })
+            ] }),
+            /* @__PURE__ */ e("div", { className: s.sunRay }),
+            /* @__PURE__ */ e("div", { className: s.sunRay }),
+            /* @__PURE__ */ e("div", { className: s.sunRay }),
+            /* @__PURE__ */ e("div", { className: s.sunRay }),
+            /* @__PURE__ */ e("div", { className: s.sunRay }),
+            /* @__PURE__ */ e("div", { className: s.sunRay }),
+            /* @__PURE__ */ e("div", { className: s.sunRay }),
+            /* @__PURE__ */ e("div", { className: s.sunRay })
+          ] }),
+          /* @__PURE__ */ e("div", { className: s.moon, children: /* @__PURE__ */ t("div", { className: s.moonCore, children: [
+            /* @__PURE__ */ e("div", { className: s.crater1 }),
+            /* @__PURE__ */ e("div", { className: s.crater2 }),
+            /* @__PURE__ */ e("div", { className: s.crater3 }),
+            /* @__PURE__ */ e("div", { className: s.crater4 })
+          ] }) })
+        ] })
+      ]
+    }
+  );
+};
+export {
+  A as T
+};
+//# sourceMappingURL=ThemeSwitch-DbaEio36.js.map

package/dist/ThemeSwitch-DbaEio36.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeSwitch-DbaEio36.js","sources":["../src/components/ThemeSwitch/ThemeSwitch.tsx"],"sourcesContent":["import React from 'react';\n\nimport styles from './ThemeSwitch.module.css';\n\n/**\n * Props for the ThemeSwitch component\n */\nexport interface ThemeSwitchProps {\n  /** Whether dark mode is currently enabled */\n  enableDarkMode: boolean;\n  /** Callback function to update the dark mode state */\n  setEnableDarkMode: (value: boolean) => void;\n  /** Size variant of the switch. Defaults to 'large' */\n  size?: 'small' | 'medium' | 'large';\n}\n\n/**\n * ThemeSwitch Component\n *\n * An animated toggle switch for switching between light and dark themes.\n * Features sun/moon icons with animated clouds (light mode) and stars (dark mode).\n *\n * @component\n * @example\n * ```tsx\n * const [darkMode, setDarkMode] = useState(false);\n * <ThemeSwitch\n *   enableDarkMode={darkMode}\n *   setEnableDarkMode={setDarkMode}\n *   size=\"medium\"\n * />\n * ```\n */\nconst ThemeSwitch: React.FC<ThemeSwitchProps> = ({\n  enableDarkMode,\n  setEnableDarkMode,\n  size = 'large'\n}) => {\n  const handleToggle = () => {\n    setEnableDarkMode(!enableDarkMode);\n  };\n\n  return (\n    <div\n      className={`${styles.switchContainer} ${styles[size]} ${\n        enableDarkMode ? styles.dark : styles.light\n      }`}\n      onClick={handleToggle}\n      role=\"button\"\n      tabIndex={0}\n      aria-label={`Switch to ${enableDarkMode ? 'light' : 'dark'} mode`}\n      onKeyDown={(e) => {\n        if (e.key === 'Enter' || e.key === ' ') {\n          handleToggle();\n        }\n      }}\n    >\n      {/* Background elements */}\n      <div className={styles.background}>\n        {/* Clouds for light mode */}\n        <div className={`${styles.cloud} ${styles.cloud1}`}></div>\n        <div className={`${styles.cloud} ${styles.cloud2}`}></div>\n        <div className={`${styles.cloud} ${styles.cloud3}`}></div>\n\n        {/* Stars for dark mode */}\n        <div className={`${styles.star} ${styles.star1}`}></div>\n        <div className={`${styles.star} ${styles.star2}`}></div>\n        <div className={`${styles.star} ${styles.star3}`}></div>\n        <div className={`${styles.star} ${styles.star4}`}></div>\n        <div className={`${styles.star} ${styles.star5}`}></div>\n        <div className={`${styles.star} ${styles.star6}`}></div>\n        <div className={`${styles.star} ${styles.star7}`}></div>\n        <div className={`${styles.star} ${styles.star8}`}></div>\n      </div>\n\n      {/* Toggle circle with sun/moon */}\n      <div className={styles.toggle}>\n        {/* Sun */}\n        <div className={styles.sun}>\n          <div className={styles.sunCore}>\n            <div className={styles.sunspot1}></div>\n            <div className={styles.sunspot2}></div>\n            <div className={styles.sunspot3}></div>\n          </div>\n          <div className={styles.sunRay}></div>\n          <div className={styles.sunRay}></div>\n          <div className={styles.sunRay}></div>\n          <div className={styles.sunRay}></div>\n          <div className={styles.sunRay}></div>\n          <div className={styles.sunRay}></div>\n          <div className={styles.sunRay}></div>\n          <div className={styles.sunRay}></div>\n        </div>\n\n        {/* Moon */}\n        <div className={styles.moon}>\n          <div className={styles.moonCore}>\n            <div className={styles.crater1}></div>\n            <div className={styles.crater2}></div>\n            <div className={styles.crater3}></div>\n            <div className={styles.crater4}></div>\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport default ThemeSwitch;\n"],"names":["ThemeSwitch","enableDarkMode","setEnableDarkMode","size","handleToggle","jsxs","styles","e","jsx"],"mappings":"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"}