@nr1e/qwik-ui 0.0.43 → 0.1.0

package/lib/components/dock.qwik.cjs

@@ -9,23 +9,35 @@ const DockLabel = qwik.component$((props) => {
     children: /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {})
   });
 });
-const DockItem = qwik.component$((props) => {
-  const nav = qwikCity.useNavigate();
+const DockButton = qwik.component$((props) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("button", {
+    class: `${props.selected ? "bg-base-200" : ""} ${props.class ?? ""}`,
+    onClick$: async (event) => {
+      if (props.loading) {
+        props.loading.value = true;
+      }
+      await props.onClick$(event);
+      if (props.loading) {
+        props.loading.value = false;
+      }
+    },
+    children: /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {})
+  });
+});
+const DockLink = qwik.component$((props) => {
   return /* @__PURE__ */ jsxRuntime.jsx(qwikCity.Link, {
-    class: `${props.selected ? "bg-base-200" : ""} ${props.linkClass ?? ""}`,
+    class: `${props.selected ? "bg-base-200" : ""} ${props.class ?? ""}`,
     href: props.href,
     prefetch: props.prefetch ?? true,
     onClick$: async (event) => {
+      if (props.loading) {
+        props.loading.value = true;
+      }
       if (props.onClick$) {
         await props.onClick$(event);
-      } else {
-        if (props.loading) {
-          props.loading.value = true;
-        }
-        await nav(props.href);
-        if (props.loading) {
-          props.loading.value = false;
-        }
+      }
+      if (props.loading) {
+        props.loading.value = false;
       }
     },
     children: /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {})
@@ -38,5 +50,6 @@ const Dock = qwik.component$((props) => {
   });
 });
 exports.Dock = Dock;
-exports.DockItem = DockItem;
+exports.DockButton = DockButton;
 exports.DockLabel = DockLabel;
+exports.DockLink = DockLink;

package/lib/components/dock.qwik.mjs

@@ -1,29 +1,41 @@
 import { jsx } from "@builder.io/qwik/jsx-runtime";
 import { component$, Slot } from "@builder.io/qwik";
-import { useNavigate, Link } from "@builder.io/qwik-city";
+import { Link } from "@builder.io/qwik-city";
 const DockLabel = component$((props) => {
   return /* @__PURE__ */ jsx("span", {
     class: `dock-label ${props?.class ?? ""}`,
     children: /* @__PURE__ */ jsx(Slot, {})
   });
 });
-const DockItem = component$((props) => {
-  const nav = useNavigate();
+const DockButton = component$((props) => {
+  return /* @__PURE__ */ jsx("button", {
+    class: `${props.selected ? "bg-base-200" : ""} ${props.class ?? ""}`,
+    onClick$: async (event) => {
+      if (props.loading) {
+        props.loading.value = true;
+      }
+      await props.onClick$(event);
+      if (props.loading) {
+        props.loading.value = false;
+      }
+    },
+    children: /* @__PURE__ */ jsx(Slot, {})
+  });
+});
+const DockLink = component$((props) => {
   return /* @__PURE__ */ jsx(Link, {
-    class: `${props.selected ? "bg-base-200" : ""} ${props.linkClass ?? ""}`,
+    class: `${props.selected ? "bg-base-200" : ""} ${props.class ?? ""}`,
     href: props.href,
     prefetch: props.prefetch ?? true,
     onClick$: async (event) => {
+      if (props.loading) {
+        props.loading.value = true;
+      }
       if (props.onClick$) {
         await props.onClick$(event);
-      } else {
-        if (props.loading) {
-          props.loading.value = true;
-        }
-        await nav(props.href);
-        if (props.loading) {
-          props.loading.value = false;
-        }
+      }
+      if (props.loading) {
+        props.loading.value = false;
       }
     },
     children: /* @__PURE__ */ jsx(Slot, {})
@@ -37,6 +49,7 @@ const Dock = component$((props) => {
 });
 export {
   Dock,
-  DockItem,
-  DockLabel
+  DockButton,
+  DockLabel,
+  DockLink
 };

package/lib/components/menu.qwik.cjs

@@ -3,8 +3,25 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@builder.io/qwik/jsx-runtime");
 const qwik = require("@builder.io/qwik");
 const qwikCity = require("@builder.io/qwik-city");
-const MenuItem = qwik.component$((props) => {
-  const nav = qwikCity.useNavigate();
+const MenuButton = qwik.component$((props) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("li", {
+    class: props.class ?? "",
+    children: /* @__PURE__ */ jsxRuntime.jsx("button", {
+      class: `truncate ${props.selected ? "bg-base-200" : ""} ${props.linkClass ?? ""}`,
+      onClick$: async (event) => {
+        if (props.loading) {
+          props.loading.value = true;
+        }
+        await props.onClick$(event);
+        if (props.loading) {
+          props.loading.value = false;
+        }
+      },
+      children: /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {})
+    })
+  });
+});
+const MenuLink = qwik.component$((props) => {
   return /* @__PURE__ */ jsxRuntime.jsx("li", {
     class: props.class ?? "",
     children: /* @__PURE__ */ jsxRuntime.jsx(qwikCity.Link, {
@@ -12,16 +29,14 @@ const MenuItem = qwik.component$((props) => {
       href: props.href,
       prefetch: props.prefetch ?? true,
       onClick$: async (event) => {
+        if (props.loading) {
+          props.loading.value = true;
+        }
         if (props.onClick$) {
           await props.onClick$(event);
-        } else {
-          if (props.loading) {
-            props.loading.value = true;
-          }
-          await nav(props.href);
-          if (props.loading) {
-            props.loading.value = false;
-          }
+        }
+        if (props.loading) {
+          props.loading.value = false;
         }
       },
       children: /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {})
@@ -61,8 +76,9 @@ const Menu = qwik.component$((props) => {
   });
 });
 exports.Menu = Menu;
+exports.MenuButton = MenuButton;
 exports.MenuDivider = MenuDivider;
 exports.MenuGroup = MenuGroup;
 exports.MenuGroupSummary = MenuGroupSummary;
-exports.MenuItem = MenuItem;
+exports.MenuLink = MenuLink;
 exports.Submenu = Submenu;

package/lib/components/menu.qwik.mjs

@@ -1,8 +1,25 @@
 import { jsx } from "@builder.io/qwik/jsx-runtime";
 import { component$, Slot } from "@builder.io/qwik";
-import { useNavigate, Link } from "@builder.io/qwik-city";
-const MenuItem = component$((props) => {
-  const nav = useNavigate();
+import { Link } from "@builder.io/qwik-city";
+const MenuButton = component$((props) => {
+  return /* @__PURE__ */ jsx("li", {
+    class: props.class ?? "",
+    children: /* @__PURE__ */ jsx("button", {
+      class: `truncate ${props.selected ? "bg-base-200" : ""} ${props.linkClass ?? ""}`,
+      onClick$: async (event) => {
+        if (props.loading) {
+          props.loading.value = true;
+        }
+        await props.onClick$(event);
+        if (props.loading) {
+          props.loading.value = false;
+        }
+      },
+      children: /* @__PURE__ */ jsx(Slot, {})
+    })
+  });
+});
+const MenuLink = component$((props) => {
   return /* @__PURE__ */ jsx("li", {
     class: props.class ?? "",
     children: /* @__PURE__ */ jsx(Link, {
@@ -10,16 +27,14 @@ const MenuItem = component$((props) => {
       href: props.href,
       prefetch: props.prefetch ?? true,
       onClick$: async (event) => {
+        if (props.loading) {
+          props.loading.value = true;
+        }
         if (props.onClick$) {
           await props.onClick$(event);
-        } else {
-          if (props.loading) {
-            props.loading.value = true;
-          }
-          await nav(props.href);
-          if (props.loading) {
-            props.loading.value = false;
-          }
+        }
+        if (props.loading) {
+          props.loading.value = false;
         }
       },
       children: /* @__PURE__ */ jsx(Slot, {})
@@ -60,9 +75,10 @@ const Menu = component$((props) => {
 });
 export {
   Menu,
+  MenuButton,
   MenuDivider,
   MenuGroup,
   MenuGroupSummary,
-  MenuItem,
+  MenuLink,
   Submenu
 };

package/lib/components/theme-selector.qwik.cjs

@@ -0,0 +1,107 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@builder.io/qwik/jsx-runtime");
+const qwik = require("@builder.io/qwik");
+const qwikIcons = require("@nr1e/qwik-icons");
+function capitalizeFirstLetter(input) {
+  return input.charAt(0).toUpperCase() + input.slice(1);
+}
+function themeToName(theme) {
+  return theme.split("-").map(capitalizeFirstLetter).join(" ");
+}
+const THEMES = [
+  "auto",
+  "light",
+  "dark",
+  "abyss",
+  "acid",
+  "aqua",
+  "autumn",
+  "black",
+  "bumblebee",
+  "business",
+  "caramellatte",
+  "cmyk",
+  "coffee",
+  "corporate",
+  "cupcake",
+  "cyberpunk",
+  "dim",
+  "dracula",
+  "emerald",
+  "fantasy",
+  "forest",
+  "garden",
+  "halloween",
+  "lemonade",
+  "lofi",
+  "luxury",
+  "night",
+  "nord",
+  "pastel",
+  "retro",
+  "silk",
+  "sunset",
+  "synthwave",
+  "valentine",
+  "wireframe",
+  "winter"
+];
+const ThemeSelector = qwik.component$((props) => {
+  const currentTheme = qwik.useSignal("auto");
+  qwik.useVisibleTask$(() => {
+    const savedTheme = localStorage.getItem("theme");
+    currentTheme.value = savedTheme ?? "auto";
+  });
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
+    class: "dropdown",
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("button", {
+        role: "button",
+        tabIndex: 0,
+        class: "btn m-1",
+        children: [
+          themeToName(currentTheme.value),
+          /* @__PURE__ */ jsxRuntime.jsx(qwikIcons.MdiChevronDown, {
+            size: 16,
+            class: "fill-current opacity-60"
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", {
+        tabIndex: 0,
+        class: "dropdown-content card bg-base-100 z-1 shadow-md",
+        children: /* @__PURE__ */ jsxRuntime.jsx("div", {
+          class: "card-body rounded-box z-1",
+          children: /* @__PURE__ */ jsxRuntime.jsx("div", {
+            class: "grid min-w-50 grid-cols-1 gap-2 p-2 sm:min-w-100 sm:grid-cols-2 lg:min-w-150 lg:grid-cols-3",
+            children: (props?.themes ?? THEMES).map((theme) => /* @__PURE__ */ jsxRuntime.jsx("input", {
+              type: "radio",
+              name: "theme-dropdown",
+              class: "theme-controller btn btn-sm btn-ghost justify-start",
+              "aria-label": themeToName(theme),
+              value: theme,
+              checked: theme === currentTheme.value,
+              onChange$: () => {
+                currentTheme.value = theme;
+                if (theme === "auto") {
+                  document.documentElement.removeAttribute("data-theme");
+                  localStorage.removeItem("theme");
+                } else {
+                  localStorage.setItem("theme", theme);
+                }
+                const activeElement = document.activeElement;
+                if (activeElement) {
+                  activeElement.blur();
+                }
+              }
+            }, theme))
+          })
+        })
+      })
+    ]
+  });
+});
+exports.THEMES = THEMES;
+exports.ThemeSelector = ThemeSelector;
+exports.themeToName = themeToName;

package/lib/components/theme-selector.qwik.mjs

@@ -0,0 +1,107 @@
+import { jsxs, jsx } from "@builder.io/qwik/jsx-runtime";
+import { component$, useSignal, useVisibleTask$ } from "@builder.io/qwik";
+import { MdiChevronDown } from "@nr1e/qwik-icons";
+function capitalizeFirstLetter(input) {
+  return input.charAt(0).toUpperCase() + input.slice(1);
+}
+function themeToName(theme) {
+  return theme.split("-").map(capitalizeFirstLetter).join(" ");
+}
+const THEMES = [
+  "auto",
+  "light",
+  "dark",
+  "abyss",
+  "acid",
+  "aqua",
+  "autumn",
+  "black",
+  "bumblebee",
+  "business",
+  "caramellatte",
+  "cmyk",
+  "coffee",
+  "corporate",
+  "cupcake",
+  "cyberpunk",
+  "dim",
+  "dracula",
+  "emerald",
+  "fantasy",
+  "forest",
+  "garden",
+  "halloween",
+  "lemonade",
+  "lofi",
+  "luxury",
+  "night",
+  "nord",
+  "pastel",
+  "retro",
+  "silk",
+  "sunset",
+  "synthwave",
+  "valentine",
+  "wireframe",
+  "winter"
+];
+const ThemeSelector = component$((props) => {
+  const currentTheme = useSignal("auto");
+  useVisibleTask$(() => {
+    const savedTheme = localStorage.getItem("theme");
+    currentTheme.value = savedTheme ?? "auto";
+  });
+  return /* @__PURE__ */ jsxs("div", {
+    class: "dropdown",
+    children: [
+      /* @__PURE__ */ jsxs("button", {
+        role: "button",
+        tabIndex: 0,
+        class: "btn m-1",
+        children: [
+          themeToName(currentTheme.value),
+          /* @__PURE__ */ jsx(MdiChevronDown, {
+            size: 16,
+            class: "fill-current opacity-60"
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsx("div", {
+        tabIndex: 0,
+        class: "dropdown-content card bg-base-100 z-1 shadow-md",
+        children: /* @__PURE__ */ jsx("div", {
+          class: "card-body rounded-box z-1",
+          children: /* @__PURE__ */ jsx("div", {
+            class: "grid min-w-50 grid-cols-1 gap-2 p-2 sm:min-w-100 sm:grid-cols-2 lg:min-w-150 lg:grid-cols-3",
+            children: (props?.themes ?? THEMES).map((theme) => /* @__PURE__ */ jsx("input", {
+              type: "radio",
+              name: "theme-dropdown",
+              class: "theme-controller btn btn-sm btn-ghost justify-start",
+              "aria-label": themeToName(theme),
+              value: theme,
+              checked: theme === currentTheme.value,
+              onChange$: () => {
+                currentTheme.value = theme;
+                if (theme === "auto") {
+                  document.documentElement.removeAttribute("data-theme");
+                  localStorage.removeItem("theme");
+                } else {
+                  localStorage.setItem("theme", theme);
+                }
+                const activeElement = document.activeElement;
+                if (activeElement) {
+                  activeElement.blur();
+                }
+              }
+            }, theme))
+          })
+        })
+      })
+    ]
+  });
+});
+export {
+  THEMES,
+  ThemeSelector,
+  themeToName
+};

package/lib/components/time-zone-selector.qwik.cjs

@@ -0,0 +1,130 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@builder.io/qwik/jsx-runtime");
+const qwik = require("@builder.io/qwik");
+const qwikIcons = require("@nr1e/qwik-icons");
+function timeZoneToName(timezone) {
+  if (timezone === "auto") {
+    return "Auto (Browser)";
+  }
+  const parts = timezone.split("/");
+  if (parts.length === 2) {
+    return `${parts[0]}/${parts[1].replace(/_/g, " ")}`;
+  }
+  return timezone.replace(/_/g, " ");
+}
+const TIMEZONES = [
+  "auto",
+  // US & Canada
+  "America/New_York",
+  "America/Chicago",
+  "America/Denver",
+  "America/Los_Angeles",
+  "America/Anchorage",
+  "Pacific/Honolulu",
+  "America/Phoenix",
+  "America/Toronto",
+  "America/Vancouver",
+  // Latin America
+  "America/Mexico_City",
+  "America/Bogota",
+  "America/Lima",
+  "America/Santiago",
+  "America/Buenos_Aires",
+  "America/Sao_Paulo",
+  // Europe
+  "Europe/London",
+  "Europe/Paris",
+  "Europe/Berlin",
+  "Europe/Rome",
+  "Europe/Madrid",
+  "Europe/Amsterdam",
+  "Europe/Brussels",
+  "Europe/Vienna",
+  "Europe/Stockholm",
+  "Europe/Warsaw",
+  "Europe/Athens",
+  "Europe/Moscow",
+  "Europe/Istanbul",
+  // Asia
+  "Asia/Dubai",
+  "Asia/Kolkata",
+  "Asia/Singapore",
+  "Asia/Hong_Kong",
+  "Asia/Shanghai",
+  "Asia/Tokyo",
+  "Asia/Seoul",
+  "Asia/Bangkok",
+  "Asia/Jakarta",
+  "Asia/Manila",
+  // Africa
+  "Africa/Cairo",
+  "Africa/Johannesburg",
+  "Africa/Lagos",
+  "Africa/Nairobi",
+  // Australia & Pacific
+  "Australia/Sydney",
+  "Australia/Melbourne",
+  "Australia/Brisbane",
+  "Australia/Perth",
+  "Pacific/Auckland",
+  "Pacific/Fiji",
+  // Other
+  "UTC"
+];
+const TimeZoneSelector = qwik.component$((props) => {
+  const currentTimeZone = qwik.useSignal("auto");
+  qwik.useVisibleTask$(() => {
+    const savedTimeZone = localStorage.getItem("timezone");
+    currentTimeZone.value = savedTimeZone ?? "auto";
+  });
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
+    class: "dropdown",
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("button", {
+        role: "button",
+        tabIndex: 0,
+        class: "btn m-1",
+        children: [
+          timeZoneToName(currentTimeZone.value),
+          /* @__PURE__ */ jsxRuntime.jsx(qwikIcons.MdiChevronDown, {
+            size: 16,
+            class: "fill-current opacity-60"
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", {
+        tabIndex: 0,
+        class: "dropdown-content card bg-base-100 z-1 shadow-md",
+        children: /* @__PURE__ */ jsxRuntime.jsx("div", {
+          class: "card-body rounded-box z-1",
+          children: /* @__PURE__ */ jsxRuntime.jsx("div", {
+            class: "grid min-w-50 grid-cols-1 gap-2 p-2 sm:min-w-100 sm:grid-cols-2 lg:min-w-150 lg:grid-cols-3",
+            children: (props?.timeZones ?? TIMEZONES).map((timezone) => /* @__PURE__ */ jsxRuntime.jsx("input", {
+              type: "radio",
+              name: "timezone-dropdown",
+              class: "btn btn-sm btn-ghost justify-start",
+              "aria-label": timeZoneToName(timezone),
+              value: timezone,
+              checked: timezone === currentTimeZone.value,
+              onChange$: () => {
+                currentTimeZone.value = timezone;
+                if (timezone === "auto") {
+                  localStorage.removeItem("timezone");
+                } else {
+                  localStorage.setItem("timezone", timezone);
+                }
+                const activeElement = document.activeElement;
+                if (activeElement) {
+                  activeElement.blur();
+                }
+              }
+            }, timezone))
+          })
+        })
+      })
+    ]
+  });
+});
+exports.TimeZoneSelector = TimeZoneSelector;
+exports.timeZoneToName = timeZoneToName;

package/lib/components/time-zone-selector.qwik.mjs

@@ -0,0 +1,130 @@
+import { jsxs, jsx } from "@builder.io/qwik/jsx-runtime";
+import { component$, useSignal, useVisibleTask$ } from "@builder.io/qwik";
+import { MdiChevronDown } from "@nr1e/qwik-icons";
+function timeZoneToName(timezone) {
+  if (timezone === "auto") {
+    return "Auto (Browser)";
+  }
+  const parts = timezone.split("/");
+  if (parts.length === 2) {
+    return `${parts[0]}/${parts[1].replace(/_/g, " ")}`;
+  }
+  return timezone.replace(/_/g, " ");
+}
+const TIMEZONES = [
+  "auto",
+  // US & Canada
+  "America/New_York",
+  "America/Chicago",
+  "America/Denver",
+  "America/Los_Angeles",
+  "America/Anchorage",
+  "Pacific/Honolulu",
+  "America/Phoenix",
+  "America/Toronto",
+  "America/Vancouver",
+  // Latin America
+  "America/Mexico_City",
+  "America/Bogota",
+  "America/Lima",
+  "America/Santiago",
+  "America/Buenos_Aires",
+  "America/Sao_Paulo",
+  // Europe
+  "Europe/London",
+  "Europe/Paris",
+  "Europe/Berlin",
+  "Europe/Rome",
+  "Europe/Madrid",
+  "Europe/Amsterdam",
+  "Europe/Brussels",
+  "Europe/Vienna",
+  "Europe/Stockholm",
+  "Europe/Warsaw",
+  "Europe/Athens",
+  "Europe/Moscow",
+  "Europe/Istanbul",
+  // Asia
+  "Asia/Dubai",
+  "Asia/Kolkata",
+  "Asia/Singapore",
+  "Asia/Hong_Kong",
+  "Asia/Shanghai",
+  "Asia/Tokyo",
+  "Asia/Seoul",
+  "Asia/Bangkok",
+  "Asia/Jakarta",
+  "Asia/Manila",
+  // Africa
+  "Africa/Cairo",
+  "Africa/Johannesburg",
+  "Africa/Lagos",
+  "Africa/Nairobi",
+  // Australia & Pacific
+  "Australia/Sydney",
+  "Australia/Melbourne",
+  "Australia/Brisbane",
+  "Australia/Perth",
+  "Pacific/Auckland",
+  "Pacific/Fiji",
+  // Other
+  "UTC"
+];
+const TimeZoneSelector = component$((props) => {
+  const currentTimeZone = useSignal("auto");
+  useVisibleTask$(() => {
+    const savedTimeZone = localStorage.getItem("timezone");
+    currentTimeZone.value = savedTimeZone ?? "auto";
+  });
+  return /* @__PURE__ */ jsxs("div", {
+    class: "dropdown",
+    children: [
+      /* @__PURE__ */ jsxs("button", {
+        role: "button",
+        tabIndex: 0,
+        class: "btn m-1",
+        children: [
+          timeZoneToName(currentTimeZone.value),
+          /* @__PURE__ */ jsx(MdiChevronDown, {
+            size: 16,
+            class: "fill-current opacity-60"
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsx("div", {
+        tabIndex: 0,
+        class: "dropdown-content card bg-base-100 z-1 shadow-md",
+        children: /* @__PURE__ */ jsx("div", {
+          class: "card-body rounded-box z-1",
+          children: /* @__PURE__ */ jsx("div", {
+            class: "grid min-w-50 grid-cols-1 gap-2 p-2 sm:min-w-100 sm:grid-cols-2 lg:min-w-150 lg:grid-cols-3",
+            children: (props?.timeZones ?? TIMEZONES).map((timezone) => /* @__PURE__ */ jsx("input", {
+              type: "radio",
+              name: "timezone-dropdown",
+              class: "btn btn-sm btn-ghost justify-start",
+              "aria-label": timeZoneToName(timezone),
+              value: timezone,
+              checked: timezone === currentTimeZone.value,
+              onChange$: () => {
+                currentTimeZone.value = timezone;
+                if (timezone === "auto") {
+                  localStorage.removeItem("timezone");
+                } else {
+                  localStorage.setItem("timezone", timezone);
+                }
+                const activeElement = document.activeElement;
+                if (activeElement) {
+                  activeElement.blur();
+                }
+              }
+            }, timezone))
+          })
+        })
+      })
+    ]
+  });
+});
+export {
+  TimeZoneSelector,
+  timeZoneToName
+};

package/lib/index.qwik.cjs

@@ -17,6 +17,8 @@ const microsoftSignInButton = require("./components/microsoft-sign-in-button.qwi
 const paceBar = require("./components/pace-bar.qwik.cjs");
 const selectField = require("./components/select-field.qwik.cjs");
 const textField = require("./components/text-field.qwik.cjs");
+const themeSelector = require("./components/theme-selector.qwik.cjs");
+const timeZoneSelector = require("./components/time-zone-selector.qwik.cjs");
 const universalLayout = require("./components/universal-layout.qwik.cjs");
 exports.AddButton = addButton.AddButton;
 exports.AlertError = alertError.AlertError;
@@ -27,8 +29,9 @@ exports.AutoDismiss = autoDismiss.AutoDismiss;
 exports.CheckboxField = checkboxField.CheckboxField;
 exports.Dialog = dialog.Dialog;
 exports.Dock = dock.Dock;
-exports.DockItem = dock.DockItem;
+exports.DockButton = dock.DockButton;
 exports.DockLabel = dock.DockLabel;
+exports.DockLink = dock.DockLink;
 exports.DropUp = dropUp.DropUp;
 exports.DropUpButtonSelector = dropUp.DropUpButtonSelector;
 exports.DropUpItem = dropUp.DropUpItem;
@@ -37,13 +40,19 @@ exports.GoogleSignInButton = googleSignInButton.GoogleSignInButton;
 exports.GtmBody = gtm.GtmBody;
 exports.GtmHead = gtm.GtmHead;
 exports.Menu = menu.Menu;
+exports.MenuButton = menu.MenuButton;
 exports.MenuDivider = menu.MenuDivider;
 exports.MenuGroup = menu.MenuGroup;
 exports.MenuGroupSummary = menu.MenuGroupSummary;
-exports.MenuItem = menu.MenuItem;
+exports.MenuLink = menu.MenuLink;
 exports.Submenu = menu.Submenu;
 exports.MicrosoftSignInButton = microsoftSignInButton.MicrosoftSignInButton;
 exports.PaceBar = paceBar.PaceBar;
 exports.SelectField = selectField.SelectField;
 exports.TextField = textField.TextField;
+exports.THEMES = themeSelector.THEMES;
+exports.ThemeSelector = themeSelector.ThemeSelector;
+exports.themeToName = themeSelector.themeToName;
+exports.TimeZoneSelector = timeZoneSelector.TimeZoneSelector;
+exports.timeZoneToName = timeZoneSelector.timeZoneToName;
 exports.UniversalLayout = universalLayout.UniversalLayout;

package/lib/index.qwik.mjs

@@ -6,15 +6,17 @@ import { AlertWarning } from "./components/alert-warning.qwik.mjs";
 import { AutoDismiss } from "./components/auto-dismiss.qwik.mjs";
 import { CheckboxField } from "./components/checkbox-field.qwik.mjs";
 import { Dialog } from "./components/dialog.qwik.mjs";
-import { Dock, DockItem, DockLabel } from "./components/dock.qwik.mjs";
+import { Dock, DockButton, DockLabel, DockLink } from "./components/dock.qwik.mjs";
 import { DropUp, DropUpButtonSelector, DropUpItem, DropUpSubmenu } from "./components/drop-up.qwik.mjs";
 import { GoogleSignInButton } from "./components/google-sign-in-button.qwik.mjs";
 import { GtmBody, GtmHead } from "./components/gtm.qwik.mjs";
-import { Menu, MenuDivider, MenuGroup, MenuGroupSummary, MenuItem, Submenu } from "./components/menu.qwik.mjs";
+import { Menu, MenuButton, MenuDivider, MenuGroup, MenuGroupSummary, MenuLink, Submenu } from "./components/menu.qwik.mjs";
 import { MicrosoftSignInButton } from "./components/microsoft-sign-in-button.qwik.mjs";
 import { PaceBar } from "./components/pace-bar.qwik.mjs";
 import { SelectField } from "./components/select-field.qwik.mjs";
 import { TextField } from "./components/text-field.qwik.mjs";
+import { THEMES, ThemeSelector, themeToName } from "./components/theme-selector.qwik.mjs";
+import { TimeZoneSelector, timeZoneToName } from "./components/time-zone-selector.qwik.mjs";
 import { UniversalLayout } from "./components/universal-layout.qwik.mjs";
 export {
   AddButton,
@@ -26,8 +28,9 @@ export {
   CheckboxField,
   Dialog,
   Dock,
-  DockItem,
+  DockButton,
   DockLabel,
+  DockLink,
   DropUp,
   DropUpButtonSelector,
   DropUpItem,
@@ -36,14 +39,20 @@ export {
   GtmBody,
   GtmHead,
   Menu,
+  MenuButton,
   MenuDivider,
   MenuGroup,
   MenuGroupSummary,
-  MenuItem,
+  MenuLink,
   MicrosoftSignInButton,
   PaceBar,
   SelectField,
   Submenu,
+  THEMES,
   TextField,
-  UniversalLayout
+  ThemeSelector,
+  TimeZoneSelector,
+  UniversalLayout,
+  themeToName,
+  timeZoneToName
 };

package/lib-types/components/dock.d.ts

@@ -3,16 +3,22 @@ export interface DockLabelProps {
     class?: string;
 }
 export declare const DockLabel: import("@builder.io/qwik").Component<DockLabelProps | undefined>;
-export interface DockItemProps {
-    href?: string;
+export interface DockButtonProps {
+    class?: string;
+    selected?: boolean;
+    loading?: Signal<boolean>;
+    onClick$: QRL<(event: Event) => void>;
+}
+export declare const DockButton: import("@builder.io/qwik").Component<DockButtonProps>;
+export interface DockLinkProps {
+    href: string;
     prefetch?: boolean;
     class?: string;
     selected?: boolean;
     loading?: Signal<boolean>;
     onClick$?: QRL<(event: Event) => void>;
-    linkClass?: string;
 }
-export declare const DockItem: import("@builder.io/qwik").Component<DockItemProps>;
+export declare const DockLink: import("@builder.io/qwik").Component<DockLinkProps>;
 export interface DockProps {
     class?: string;
 }

package/lib-types/components/menu.d.ts

@@ -1,6 +1,14 @@
 import { QRL, Signal } from '@builder.io/qwik';
-export interface MenuItemProps {
-    href?: string;
+export interface MenuButtonProps {
+    class?: string;
+    loading?: Signal<boolean>;
+    selected?: boolean;
+    onClick$: QRL<(event: Event) => void>;
+    linkClass?: string;
+}
+export declare const MenuButton: import("@builder.io/qwik").Component<MenuButtonProps>;
+export interface MenuLinkProps {
+    href: string;
     prefetch?: boolean;
     selected?: boolean;
     loading?: Signal<boolean>;
@@ -8,7 +16,7 @@ export interface MenuItemProps {
     class?: string;
     linkClass?: string;
 }
-export declare const MenuItem: import("@builder.io/qwik").Component<MenuItemProps>;
+export declare const MenuLink: import("@builder.io/qwik").Component<MenuLinkProps>;
 export interface MenuGroupSummaryProps {
     class?: string;
 }

package/lib-types/components/time-zone-selector.d.ts

@@ -0,0 +1,5 @@
+export declare function timeZoneToName(timezone: string): string;
+export interface TimeZoneSelectorProps {
+    timeZones?: string[];
+}
+export declare const TimeZoneSelector: import("@builder.io/qwik").Component<TimeZoneSelectorProps | undefined>;

package/lib-types/index.d.ts

@@ -15,4 +15,6 @@ export * from './components/microsoft-sign-in-button';
 export * from './components/pace-bar';
 export * from './components/select-field';
 export * from './components/text-field';
+export * from './components/theme-selector';
+export * from './components/time-zone-selector';
 export * from './components/universal-layout';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nr1e/qwik-ui",
-  "version": "0.0.43",
+  "version": "0.1.0",
   "description": "NR1E Qwik UI Library",
   "author": "NR1E, Inc.",
   "publishConfig": {
@@ -36,7 +36,7 @@
   "peerDependencies": {
     "@builder.io/qwik-city": "1.19.0",
     "tailwindcss-animated": "2.0.0",
-    "@nr1e/qwik-icons": "0.0.19"
+    "@nr1e/qwik-icons": "0.0.20"
   },
   "devDependencies": {
     "@builder.io/qwik": "1.19.0",