@henriquepetrelli/hp-design-system 1.1.4 → 1.1.5

package/dist/hp-design-system.es.js

@@ -1286,7 +1286,7 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
 const ToggleSwitch = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-14c54b46"]]);
 
 const _hoisted_1$4 = { class: "theme-switcher-container" };
-const _hoisted_2$4 = ["id", "aria-checked"];
+const _hoisted_2$4 = ["id", "checked", "aria-checked"];
 const _hoisted_3$4 = ["for", "onKeydown"];
 
 
@@ -1324,37 +1324,6 @@ const props = __props;
 
 const isDarkMode = ref(false);
 
-// Função para pegar variáveis CSS do projeto
-const getCSSVariable = (name, fallback) => {
-  return (
-    getComputedStyle(document.documentElement).getPropertyValue(name).trim() ||
-    fallback
-  )
-};
-
-// Computed para cores do switcher
-const computedLightBackgroundColor = computed(() => {
-  return (
-    props.lightBackgroundColor ||
-    getCSSVariable('--color-background', '#96dcee')
-  )
-});
-
-const computedLightBorderColor = computed(() => {
-  return props.lightBorderColor || getCSSVariable('--color-primary', '#72cce3')
-});
-
-const computedDarkBackgroundColor = computed(() => {
-  return (
-    props.darkBackgroundColor || getCSSVariable('--color-background', '#1261a0')
-  )
-});
-
-const computedDarkBorderColor = computed(() => {
-  return props.darkBorderColor || getCSSVariable('--color-primary', '#072f5f')
-});
-
-// Alterna tema baseado no valor atual de isDarkMode
 const toggleTheme = () => {
   if (isDarkMode.value) {
     document.documentElement.classList.remove('light');
@@ -1367,13 +1336,11 @@ const toggleTheme = () => {
   }
 };
 
-// Alterna tema via teclado
 const handleKeydown = () => {
   isDarkMode.value = !isDarkMode.value;
   toggleTheme();
 };
 
-// Inicializa o tema baseado no localStorage ou preferência do sistema
 onMounted(() => {
   const savedTheme =
     localStorage.getItem('theme') ||
@@ -1387,6 +1354,22 @@ onMounted(() => {
     document.documentElement.classList.add('light');
   }
 });
+
+const computedLightBorderColor = computed(() => {
+  return props.lightBorderColor || '#72cce3'
+});
+
+const computedLightBackgroundColor = computed(() => {
+  return props.lightBackgroundColor || '#96dcee'
+});
+
+const computedDarkBorderColor = computed(() => {
+  return props.darkBorderColor || '#072f5f'
+});
+
+const computedDarkBackgroundColor = computed(() => {
+  return props.darkBackgroundColor || '#1261a0'
+});
 
 return (_ctx, _cache) => {
   return (openBlock(), createElementBlock("div", _hoisted_1$4, [
@@ -1395,6 +1378,7 @@ return (_ctx, _cache) => {
       id: __props.id,
       class: "toggle--checkbox",
       "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => ((isDarkMode).value = $event)),
+      checked: __props.modelValue,
       onChange: toggleTheme,
       role: "switch",
       "aria-checked": isDarkMode.value,
@@ -1426,7 +1410,7 @@ return (_ctx, _cache) => {
 }
 
 };
-const ThemeSwitcher = /*#__PURE__*/_export_sfc(_sfc_main$4, [['__scopeId',"data-v-d1afbbb3"]]);
+const ThemeSwitcher = /*#__PURE__*/_export_sfc(_sfc_main$4, [['__scopeId',"data-v-08fdca46"]]);
 
 const _hoisted_1$3 = { class: "input__fieldset" };
 const _hoisted_2$3 = {