diff --git a/example/.vitepress/theme/frappe.css b/example/.vitepress/theme/frappe.css
deleted file mode 100644
index 7702037..0000000
--- a/example/.vitepress/theme/frappe.css
+++ /dev/null
@@ -1,183 +0,0 @@
-/* https://github.com/vuejs/vitepress/blob/main/src/client/theme-default/styles/vars.css */
-/* https://catppuccin.com/palette */
-
-/* Example: Brand Customization */
-
-:root {
-  --vp-c-brand-1: var(--ctp-latte-red);
-  --vp-c-brand-2: var(--ctp-latte-lavender);
-  --vp-c-brand-3: var(--ctp-latte-mauve);
-}
-.dark {
-  --vp-c-brand-1: var(--ctp-frappe-red);
-  --vp-c-brand-2: var(--ctp-frappe-lavender);
-  --vp-c-brand-3: var(--ctp-frappe-mauve);
-}
-
-:root {
-  /* Solid Colors and Sponsor Color */
-  --vp-c-white: #eff1f5;
-  --vp-c-black: #4c4f69;
-  --vp-c-sponsor: #d20f39;
-
-  /* Background Colors */
-  --vp-c-bg: #eff1f5;
-  --vp-c-bg-alt: #e6e9ef;
-  --vp-c-bg-elv: #dce0e8;
-  --vp-c-bg-soft: #ccd0da;
-
-  /* Border Colors */
-  --vp-c-border: #ccd0da;
-  --vp-c-divider: #ccd0da;
-  --vp-c-gutter: #bcc0cc;
-
-  /* Text Colors */
-  --vp-c-text-1: #4c4f69;
-  --vp-c-text-2: #5c5f77;
-  --vp-c-text-3: #6c6f85;
-
-  /* Catppuccin Accents */
-  --ctp-latte-rosewater: #dc8a78;
-  --ctp-latte-flamingo: #dd7878;
-  --ctp-latte-pink: #ea76cb;
-  --ctp-latte-mauve: #8839ef;
-  --ctp-latte-red: #d20f39;
-  --ctp-latte-maroon: #e64553;
-  --ctp-latte-peach: #fe640b;
-  --ctp-latte-yellow: #df8e1d;
-  --ctp-latte-green: #40a02b;
-  --ctp-latte-teal: #179299;
-  --ctp-latte-sky: #04a5e5;
-  --ctp-latte-sapphire: #209fb5;
-  --ctp-latte-blue: #1e66f5;
-  --ctp-latte-lavender: #7287fd;
-  --ctp-latte-text: #4c4f69;
-  --ctp-latte-subtext1: #5c5f77;
-  --ctp-latte-subtext0: #6c6f85;
-  --ctp-latte-overlay2: #7c7f93;
-  --ctp-latte-overlay1: #8c8fa1;
-  --ctp-latte-overlay0: #9ca0b0;
-  --ctp-latte-surface2: #acb0be;
-  --ctp-latte-surface1: #bcc0cc;
-  --ctp-latte-surface0: #ccd0da;
-  --ctp-latte-base: #eff1f5;
-  --ctp-latte-mantle: #e6e9ef;
-  --ctp-latte-crust: #dce0e8;
-
-  /* Color Palette */
-  --vp-c-gray-1: rgb(188, 192, 204);
-  --vp-c-gray-2: rgb(204, 208, 218);
-  --vp-c-gray-3: rgb(239, 241, 245);
-  --vp-c-gray-soft: hsla(220, 23%, 65%, 0.14);
-
-  --vp-c-indigo-1: rgb(30, 102, 245);
-  --vp-c-indigo-2: rgb(21, 99, 255);
-  --vp-c-indigo-3: rgb(39, 77, 158);
-  --vp-c-indigo-soft: hsla(220, 91%, 34%, 0.14);
-
-  --vp-c-purple-1: rgb(136, 57, 239);
-  --vp-c-purple-2: rgb(134, 46, 250);
-  --vp-c-purple-3: rgb(92, 55, 155);
-  --vp-c-purple-soft: hsla(266, 85%, 38%, 0.14);
-
-  --vp-c-green-1: rgb(64, 160, 43);
-  --vp-c-green-2: rgb(58, 171, 33);
-  --vp-c-green-3: rgb(56, 106, 57);
-  --vp-c-green-soft: hsla(109, 58%, 20%, 0.14);
-
-  --vp-c-yellow-1: rgb(223, 142, 29);
-  --vp-c-yellow-2: rgb(236, 144, 16);
-  --vp-c-yellow-3: rgb(136, 97, 50);
-  --vp-c-yellow-soft: hsla(35, 77%, 29%, 0.14);
-
-  --vp-c-red-1: rgb(210, 15, 57);
-  --vp-c-red-2: rgb(222, 4, 51);
-  --vp-c-red-3: rgb(129, 34, 64);
-  --vp-c-red-soft: hsla(347, 87%, 24%, 0.14);
-}
-
-.dark {
-  /* Fix button text color */
-  --vp-button-brand-text: var(--ctp-frappe-crust) !important;
-  --vp-button-brand-hover-text: var(--ctp-frappe-crust) !important;
-
-  /* Solid Colors and Sponsor Color */
-  --vp-c-white: #c6d0f5;
-  --vp-c-black: #303446;
-  --vp-c-sponsor: #e78284;
-
-  /* Background Colors */
-  --vp-c-bg: #303446;
-  --vp-c-bg-alt: #292c3c;
-  --vp-c-bg-elv: #232634;
-  --vp-c-bg-soft: #414559;
-
-  /* Border Colors */
-  --vp-c-border: #414559;
-  --vp-c-divider: #414559;
-  --vp-c-gutter: #51576d;
-
-  /* Text Colors */
-  --vp-c-text-1: #c6d0f5;
-  --vp-c-text-2: #b5bfe2;
-  --vp-c-text-3: #a5adce;
-
-  /* Catppuccin Accents */
-  --ctp-frappe-rosewater: #f2d5cf;
-  --ctp-frappe-flamingo: #eebebe;
-  --ctp-frappe-pink: #f4b8e4;
-  --ctp-frappe-mauve: #ca9ee6;
-  --ctp-frappe-red: #e78284;
-  --ctp-frappe-maroon: #ea999c;
-  --ctp-frappe-peach: #ef9f76;
-  --ctp-frappe-yellow: #e5c890;
-  --ctp-frappe-green: #a6d189;
-  --ctp-frappe-teal: #81c8be;
-  --ctp-frappe-sky: #99d1db;
-  --ctp-frappe-sapphire: #85c1dc;
-  --ctp-frappe-blue: #8caaee;
-  --ctp-frappe-lavender: #babbf1;
-  --ctp-frappe-text: #c6d0f5;
-  --ctp-frappe-subtext1: #b5bfe2;
-  --ctp-frappe-subtext0: #a5adce;
-  --ctp-frappe-overlay2: #949cbb;
-  --ctp-frappe-overlay1: #838ba7;
-  --ctp-frappe-overlay0: #737994;
-  --ctp-frappe-surface2: #626880;
-  --ctp-frappe-surface1: #51576d;
-  --ctp-frappe-surface0: #414559;
-  --ctp-frappe-base: #303446;
-  --ctp-frappe-mantle: #292c3c;
-  --ctp-frappe-crust: #232634;
-
-  /* Color Palette */
-  --vp-c-gray-1: rgb(81, 87, 109);
-  --vp-c-gray-2: rgb(65, 69, 89);
-  --vp-c-gray-3: rgb(48, 52, 70);
-  --vp-c-gray-soft: hsla(229, 19%, 53%, 0.14);
-
-  --vp-c-indigo-1: rgb(140, 170, 238);
-  --vp-c-indigo-2: rgb(133, 167, 245);
-  --vp-c-indigo-3: rgb(94, 111, 154);
-  --vp-c-indigo-soft: hsla(222, 74%, 54%, 0.14);
-
-  --vp-c-purple-1: rgb(202, 158, 230);
-  --vp-c-purple-2: rgb(204, 152, 236);
-  --vp-c-purple-3: rgb(125, 105, 150);
-  --vp-c-purple-soft: hsla(277, 59%, 56%, 0.14);
-
-  --vp-c-green-1: rgb(166, 209, 137);
-  --vp-c-green-2: rgb(164, 217, 129);
-  --vp-c-green-3: rgb(107, 131, 104);
-  --vp-c-green-soft: hsla(96, 44%, 48%, 0.14);
-
-  --vp-c-yellow-1: rgb(229, 200, 144);
-  --vp-c-yellow-2: rgb(236, 203, 138);
-  --vp-c-yellow-3: rgb(139, 126, 107);
-  --vp-c-yellow-soft: hsla(40, 62%, 53%, 0.14);
-
-  --vp-c-red-1: rgb(231, 130, 132);
-  --vp-c-red-2: rgb(239, 123, 125);
-  --vp-c-red-3: rgb(140, 91, 101);
-  --vp-c-red-soft: hsla(359, 68%, 51%, 0.14);
-}
diff --git a/example/.vitepress/theme/index.js b/example/.vitepress/theme/index.js
deleted file mode 100644
index 90d4917..0000000
--- a/example/.vitepress/theme/index.js
+++ /dev/null
@@ -1,6 +0,0 @@
-import DefaultTheme from "vitepress/theme";
-// import "./frappe.css"
-// import "./macchiato.css"
-import "./mocha.css";
-
-export default DefaultTheme;
diff --git a/example/.vitepress/theme/index.ts b/example/.vitepress/theme/index.ts
new file mode 100644
index 0000000..bb7c866
--- /dev/null
+++ b/example/.vitepress/theme/index.ts
@@ -0,0 +1,4 @@
+import DefaultTheme from "vitepress/theme";
+import '@catppuccin/vitepress/theme/mocha.css';
+
+export default DefaultTheme;
diff --git a/example/.vitepress/theme/macchiato.css b/example/.vitepress/theme/macchiato.css
deleted file mode 100644
index b2acca6..0000000
--- a/example/.vitepress/theme/macchiato.css
+++ /dev/null
@@ -1,184 +0,0 @@
-/* https://github.com/vuejs/vitepress/blob/main/src/client/theme-default/styles/vars.css */
-/* https://catppuccin.com/palette */
-
-/* Example: Brand Customization */
-
-:root {
-  --vp-c-brand-1: var(--ctp-latte-red);
-  --vp-c-brand-2: var(--ctp-latte-lavender);
-  --vp-c-brand-3: var(--ctp-latte-mauve);
-}
-.dark {
-  --vp-c-brand-1: var(--ctp-macchiato-red);
-  --vp-c-brand-2: var(--ctp-macchiato-lavender);
-  --vp-c-brand-3: var(--ctp-macchiato-mauve);
-}
-
-:root {
-  /* Solid Colors and Sponsor Color */
-  --vp-c-white: #eff1f5;
-  --vp-c-black: #4c4f69;
-  --vp-c-sponsor: #d20f39;
-
-  /* Background Colors */
-  --vp-c-bg: #eff1f5;
-  --vp-c-bg-alt: #e6e9ef;
-  --vp-c-bg-elv: #dce0e8;
-  --vp-c-bg-soft: #ccd0da;
-
-  /* Border Colors */
-  --vp-c-border: #ccd0da;
-  --vp-c-divider: #ccd0da;
-  --vp-c-gutter: #bcc0cc;
-
-  /* Text Colors */
-  --vp-c-text-1: #4c4f69;
-  --vp-c-text-2: #5c5f77;
-  --vp-c-text-3: #6c6f85;
-
-  /* Catppuccin Accents */
-  --ctp-latte-rosewater: #dc8a78;
-  --ctp-latte-flamingo: #dd7878;
-  --ctp-latte-pink: #ea76cb;
-  --ctp-latte-mauve: #8839ef;
-  --ctp-latte-red: #d20f39;
-  --ctp-latte-maroon: #e64553;
-  --ctp-latte-peach: #fe640b;
-  --ctp-latte-yellow: #df8e1d;
-  --ctp-latte-green: #40a02b;
-  --ctp-latte-teal: #179299;
-  --ctp-latte-sky: #04a5e5;
-  --ctp-latte-sapphire: #209fb5;
-  --ctp-latte-blue: #1e66f5;
-  --ctp-latte-lavender: #7287fd;
-  --ctp-latte-text: #4c4f69;
-  --ctp-latte-subtext1: #5c5f77;
-  --ctp-latte-subtext0: #6c6f85;
-  --ctp-latte-overlay2: #7c7f93;
-  --ctp-latte-overlay1: #8c8fa1;
-  --ctp-latte-overlay0: #9ca0b0;
-  --ctp-latte-surface2: #acb0be;
-  --ctp-latte-surface1: #bcc0cc;
-  --ctp-latte-surface0: #ccd0da;
-  --ctp-latte-base: #eff1f5;
-  --ctp-latte-mantle: #e6e9ef;
-  --ctp-latte-crust: #dce0e8;
-
-  /* Color Palette */
-  --vp-c-gray-1: rgb(188, 192, 204);
-  --vp-c-gray-2: rgb(204, 208, 218);
-  --vp-c-gray-3: rgb(239, 241, 245);
-  --vp-c-gray-soft: hsla(220, 23%, 65%, 0.14);
-
-  --vp-c-indigo-1: rgb(30, 102, 245);
-  --vp-c-indigo-2: rgb(21, 99, 255);
-  --vp-c-indigo-3: rgb(33, 70, 152);
-  --vp-c-indigo-soft: hsla(220, 91%, 34%, 0.14);
-
-  --vp-c-purple-1: rgb(136, 57, 239);
-  --vp-c-purple-2: rgb(134, 46, 250);
-  --vp-c-purple-3: rgb(86, 48, 149);
-  --vp-c-purple-soft: hsla(266, 85%, 38%, 0.14);
-
-  --vp-c-green-1: rgb(64, 160, 43);
-  --vp-c-green-2: rgb(58, 171, 33);
-  --vp-c-green-3: rgb(50, 99, 51);
-  --vp-c-green-soft: hsla(109, 58%, 20%, 0.14);
-
-  --vp-c-yellow-1: rgb(223, 142, 29);
-  --vp-c-yellow-2: rgb(236, 144, 16);
-  --vp-c-yellow-3: rgb(130, 90, 44);
-  --vp-c-yellow-soft: hsla(35, 77%, 29%, 0.14);
-
-  --vp-c-red-1: rgb(210, 15, 57);
-  --vp-c-red-2: rgb(222, 4, 51);
-  --vp-c-red-3: rgb(123, 27, 58);
-  --vp-c-red-soft: hsla(347, 87%, 24%, 0.14);
-}
-
-.dark {
-  /* Fix button text color */
-  --vp-button-brand-text: var(--ctp-macchiato-crust) !important;
-  --vp-button-brand-hover-text: var(--ctp-macchiato-crust) !important;
-  --vp-button-brand-active-text: var(--ctp-macchiato-crust) !important;
-
-  /* Solid Colors and Sponsor Color */
-  --vp-c-white: #cad3f5;
-  --vp-c-black: #24273a;
-  --vp-c-sponsor: #ed8796;
-
-  /* Background Colors */
-  --vp-c-bg: #24273a;
-  --vp-c-bg-alt: #1e2030;
-  --vp-c-bg-elv: #181926;
-  --vp-c-bg-soft: #363a4f;
-
-  /* Border Colors */
-  --vp-c-border: #363a4f;
-  --vp-c-divider: #363a4f;
-  --vp-c-gutter: #494d64;
-
-  /* Text Colors */
-  --vp-c-text-1: #cad3f5;
-  --vp-c-text-2: #b8c0e0;
-  --vp-c-text-3: #a5adcb;
-
-  /* Catppuccin Accents */
-  --ctp-macchiato-rosewater: #f4dbd6;
-  --ctp-macchiato-flamingo: #f0c6c6;
-  --ctp-macchiato-pink: #f5bde6;
-  --ctp-macchiato-mauve: #c6a0f6;
-  --ctp-macchiato-red: #ed8796;
-  --ctp-macchiato-maroon: #ee99a0;
-  --ctp-macchiato-peach: #f5a97f;
-  --ctp-macchiato-yellow: #eed49f;
-  --ctp-macchiato-green: #a6da95;
-  --ctp-macchiato-teal: #8bd5ca;
-  --ctp-macchiato-sky: #91d7e3;
-  --ctp-macchiato-sapphire: #7dc4e4;
-  --ctp-macchiato-blue: #8aadf4;
-  --ctp-macchiato-lavender: #b7bdf8;
-  --ctp-macchiato-text: #cad3f5;
-  --ctp-macchiato-subtext1: #b8c0e0;
-  --ctp-macchiato-subtext0: #a5adcb;
-  --ctp-macchiato-overlay2: #939ab7;
-  --ctp-macchiato-overlay1: #8087a2;
-  --ctp-macchiato-overlay0: #6e738d;
-  --ctp-macchiato-surface2: #5b6078;
-  --ctp-macchiato-surface1: #494d64;
-  --ctp-macchiato-surface0: #363a4f;
-  --ctp-macchiato-base: #24273a;
-  --ctp-macchiato-mantle: #1e2030;
-  --ctp-macchiato-crust: #181926;
-
-  /* Color Palette */
-  --vp-c-gray-1: rgb(73, 77, 100);
-  --vp-c-gray-2: rgb(54, 58, 79);
-  --vp-c-gray-3: rgb(36, 39, 58);
-  --vp-c-gray-soft: hsla(232, 24%, 49%, 0.14);
-
-  --vp-c-indigo-1: rgb(138, 173, 244);
-  --vp-c-indigo-2: rgb(132, 171, 250);
-  --vp-c-indigo-3: rgb(87, 106, 151);
-  --vp-c-indigo-soft: hsla(220, 83%, 55%, 0.14);
-
-  --vp-c-purple-1: rgb(198, 160, 246);
-  --vp-c-purple-2: rgb(198, 155, 251);
-  --vp-c-purple-3: rgb(117, 99, 152);
-  --vp-c-purple-soft: hsla(267, 83%, 60%, 0.14);
-
-  --vp-c-green-1: rgb(166, 218, 149);
-  --vp-c-green-2: rgb(163, 225, 143);
-  --vp-c-green-3: rgb(101, 128, 104);
-  --vp-c-green-soft: hsla(105, 48%, 52%, 0.14);
-
-  --vp-c-yellow-1: rgb(238, 212, 159);
-  --vp-c-yellow-2: rgb(244, 214, 154);
-  --vp-c-yellow-3: rgb(137, 125, 109);
-  --vp-c-yellow-soft: hsla(40, 70%, 58%, 0.14);
-
-  --vp-c-red-1: rgb(237, 135, 150);
-  --vp-c-red-2: rgb(244, 128, 145);
-  --vp-c-red-3: rgb(137, 87, 104);
-  --vp-c-red-soft: hsla(351, 74%, 53%, 0.14);
-}
diff --git a/example/.vitepress/theme/mocha.css b/example/.vitepress/theme/mocha.css
deleted file mode 100644
index ac158e2..0000000
--- a/example/.vitepress/theme/mocha.css
+++ /dev/null
@@ -1,183 +0,0 @@
-/* https://github.com/vuejs/vitepress/blob/main/src/client/theme-default/styles/vars.css */
-/* https://catppuccin.com/palette */
-
-/* Example: Brand Customization */
-
-:root {
-  --vp-c-brand-1: var(--ctp-latte-red);
-  --vp-c-brand-2: var(--ctp-latte-lavender);
-  --vp-c-brand-3: var(--ctp-latte-mauve);
-}
-.dark {
-  --vp-c-brand-1: var(--ctp-mocha-red);
-  --vp-c-brand-2: var(--ctp-mocha-lavender);
-  --vp-c-brand-3: var(--ctp-mocha-mauve);
-}
-
-:root {
-  /* Solid Colors and Sponsor Color */
-  --vp-c-white: #eff1f5;
-  --vp-c-black: #4c4f69;
-  --vp-c-sponsor: #d20f39;
-
-  /* Background Colors */
-  --vp-c-bg: #eff1f5;
-  --vp-c-bg-alt: #e6e9ef;
-  --vp-c-bg-elv: #dce0e8;
-  --vp-c-bg-soft: #ccd0da;
-
-  /* Border Colors */
-  --vp-c-border: #ccd0da;
-  --vp-c-divider: #ccd0da;
-  --vp-c-gutter: #bcc0cc;
-
-  /* Text Colors */
-  --vp-c-text-1: #4c4f69;
-  --vp-c-text-2: #5c5f77;
-  --vp-c-text-3: #6c6f85;
-
-  /* Catppuccin Accents */
-  --ctp-latte-rosewater: #dc8a78;
-  --ctp-latte-flamingo: #dd7878;
-  --ctp-latte-pink: #ea76cb;
-  --ctp-latte-mauve: #8839ef;
-  --ctp-latte-red: #d20f39;
-  --ctp-latte-maroon: #e64553;
-  --ctp-latte-peach: #fe640b;
-  --ctp-latte-yellow: #df8e1d;
-  --ctp-latte-green: #40a02b;
-  --ctp-latte-teal: #179299;
-  --ctp-latte-sky: #04a5e5;
-  --ctp-latte-sapphire: #209fb5;
-  --ctp-latte-blue: #1e66f5;
-  --ctp-latte-lavender: #7287fd;
-  --ctp-latte-text: #4c4f69;
-  --ctp-latte-subtext1: #5c5f77;
-  --ctp-latte-subtext0: #6c6f85;
-  --ctp-latte-overlay2: #7c7f93;
-  --ctp-latte-overlay1: #8c8fa1;
-  --ctp-latte-overlay0: #9ca0b0;
-  --ctp-latte-surface2: #acb0be;
-  --ctp-latte-surface1: #bcc0cc;
-  --ctp-latte-surface0: #ccd0da;
-  --ctp-latte-base: #eff1f5;
-  --ctp-latte-mantle: #e6e9ef;
-  --ctp-latte-crust: #dce0e8;
-
-  /* Color Palette */
-  --vp-c-gray-1: rgb(188, 192, 204);
-  --vp-c-gray-2: rgb(204, 208, 218);
-  --vp-c-gray-3: rgb(239, 241, 245);
-  --vp-c-gray-soft: hsla(220, 23%, 65%, 0.14);
-
-  --vp-c-indigo-1: rgb(30, 102, 245);
-  --vp-c-indigo-2: rgb(21, 99, 255);
-  --vp-c-indigo-3: rgb(30, 66, 146);
-  --vp-c-indigo-soft: hsla(220, 91%, 34%, 0.14);
-
-  --vp-c-purple-1: rgb(136, 57, 239);
-  --vp-c-purple-2: rgb(134, 46, 250);
-  --vp-c-purple-3: rgb(83, 44, 143);
-  --vp-c-purple-soft: hsla(266, 85%, 38%, 0.14);
-
-  --vp-c-green-1: rgb(64, 160, 43);
-  --vp-c-green-2: rgb(58, 171, 33);
-  --vp-c-green-3: rgb(47, 95, 45);
-  --vp-c-green-soft: hsla(109, 58%, 20%, 0.14);
-
-  --vp-c-yellow-1: rgb(223, 142, 29);
-  --vp-c-yellow-2: rgb(236, 144, 16);
-  --vp-c-yellow-3: rgb(127, 86, 38);
-  --vp-c-yellow-soft: hsla(35, 77%, 29%, 0.14);
-
-  --vp-c-red-1: rgb(210, 15, 57);
-  --vp-c-red-2: rgb(222, 4, 51);
-  --vp-c-red-3: rgb(120, 23, 52);
-  --vp-c-red-soft: hsla(347, 87%, 24%, 0.14);
-}
-
-.dark {
-  /* Fix button text color */
-  --vp-button-brand-text: var(--ctp-mocha-crust) !important;
-  --vp-button-brand-hover-text: var(--ctp-mocha-crust) !important;
-
-  /* Solid Colors and Sponsor Color */
-  --vp-c-white: #cdd6f4;
-  --vp-c-black: #1e1e2e;
-  --vp-c-sponsor: #f38ba8;
-
-  /* Background Colors */
-  --vp-c-bg: #1e1e2e;
-  --vp-c-bg-alt: #181825;
-  --vp-c-bg-elv: #11111b;
-  --vp-c-bg-soft: #313244;
-
-  /* Border Colors */
-  --vp-c-border: #313244;
-  --vp-c-divider: #313244;
-  --vp-c-gutter: #45475a;
-
-  /* Text Colors */
-  --vp-c-text-1: #cdd6f4;
-  --vp-c-text-2: #bac2de;
-  --vp-c-text-3: #a6adc8;
-
-  /* Catppuccin Accents */
-  --ctp-mocha-rosewater: #f5e0dc;
-  --ctp-mocha-flamingo: #f2cdcd;
-  --ctp-mocha-pink: #f5c2e7;
-  --ctp-mocha-mauve: #cba6f7;
-  --ctp-mocha-red: #f38ba8;
-  --ctp-mocha-maroon: #eba0ac;
-  --ctp-mocha-peach: #fab387;
-  --ctp-mocha-yellow: #f9e2af;
-  --ctp-mocha-green: #a6e3a1;
-  --ctp-mocha-teal: #94e2d5;
-  --ctp-mocha-sky: #89dceb;
-  --ctp-mocha-sapphire: #74c7ec;
-  --ctp-mocha-blue: #89b4fa;
-  --ctp-mocha-lavender: #b4befe;
-  --ctp-mocha-text: #cdd6f4;
-  --ctp-mocha-subtext1: #bac2de;
-  --ctp-mocha-subtext0: #a6adc8;
-  --ctp-mocha-overlay2: #9399b2;
-  --ctp-mocha-overlay1: #7f849c;
-  --ctp-mocha-overlay0: #6c7086;
-  --ctp-mocha-surface2: #585b70;
-  --ctp-mocha-surface1: #45475a;
-  --ctp-mocha-surface0: #313244;
-  --ctp-mocha-base: #1e1e2e;
-  --ctp-mocha-mantle: #181825;
-  --ctp-mocha-crust: #11111b;
-
-  /* Color Palette */
-  --vp-c-gray-1: rgb(69, 71, 90);
-  --vp-c-gray-2: rgb(49, 50, 68);
-  --vp-c-gray-3: rgb(30, 30, 46);
-  --vp-c-gray-soft: hsla(240, 21%, 45%, 0.14);
-
-  --vp-c-indigo-1: rgb(137, 180, 250);
-  --vp-c-indigo-2: rgb(133, 180, 255);
-  --vp-c-indigo-3: rgb(84, 105, 148);
-  --vp-c-indigo-soft: hsla(217, 92%, 56%, 0.14);
-
-  --vp-c-purple-1: rgb(203, 166, 247);
-  --vp-c-purple-2: rgb(203, 162, 252);
-  --vp-c-purple-3: rgb(117, 98, 147);
-  --vp-c-purple-soft: hsla(267, 84%, 61%, 0.14);
-
-  --vp-c-green-1: rgb(166, 227, 161);
-  --vp-c-green-2: rgb(161, 233, 155);
-  --vp-c-green-3: rgb(98, 129, 104);
-  --vp-c-green-soft: hsla(115, 54%, 56%, 0.14);
-
-  --vp-c-yellow-1: rgb(249, 226, 175);
-  --vp-c-yellow-2: rgb(253, 227, 171);
-  --vp-c-yellow-3: rgb(140, 128, 111);
-  --vp-c-yellow-soft: hsla(41, 86%, 63%, 0.14);
-
-  --vp-c-red-1: rgb(243, 139, 168);
-  --vp-c-red-2: rgb(249, 133, 166);
-  --vp-c-red-3: rgb(137, 85, 107);
-  --vp-c-red-soft: hsla(343, 81%, 55%, 0.14);
-}
diff --git a/example/bun.lockb b/example/bun.lockb
new file mode 100755
index 0000000..2677b83
Binary files /dev/null and b/example/bun.lockb differ
diff --git a/example/package.json b/example/package.json
new file mode 100644
index 0000000..6f3e8a7
--- /dev/null
+++ b/example/package.json
@@ -0,0 +1,20 @@
+{
+  "description": "📝 Soothing pastel theme for VitePress",
+  "author": "willow <42willow@pm.me>",
+  "license": "MIT",
+  "scripts": {
+    "build": "vitepress build",
+    "dev": "vitepress dev",
+    "preview": "vitepress preview"
+  },
+  "devDependencies": {
+    "@types/bun": "latest",
+    "vitepress": "^1.2.3"
+  },
+  "peerDependencies": {
+    "typescript": "^5.0.0"
+  },
+  "dependencies": {
+    "@catppuccin/vitepress": "../"
+  }
+}
diff --git a/package.json b/package.json
index e8774f0..60e588b 100644
--- a/package.json
+++ b/package.json
@@ -5,10 +5,10 @@
   "description": "📝 Soothing pastel theme for VitePress",
   "author": "willow <42willow@pm.me>",
   "license": "MIT",
+  "files": [
+    "theme/"
+  ],
   "scripts": {
-    "example:build": "vitepress build example",
-    "example:dev": "vitepress dev example",
-    "example:preview": "vitepress preview example",
     "format": "prettier --write ."
   },
   "devDependencies": {
diff --git a/theme/index.js b/theme/index.ts
similarity index 100%
rename from theme/index.js
rename to theme/index.ts