@opensig/opendesign

Version:
19 lines (18 loc) • 658 B
JavaScript
import { useCssVar, useEventListener, useDebounceFn } from "@vueuse/core";
import { toValue, computed } from "vue";
import { getCssVariable } from "../_utils/dom.mjs";
function useResponseCssVar(prop, target, options) {
  const { debounce = 100, transform, ...cssVarOptions } = options ?? {};
  const cssVar = useCssVar(prop, target, cssVarOptions);
  useEventListener("resize", useDebounceFn(() => {
    const el = toValue(target) ?? document.documentElement;
    cssVar.value = getCssVariable(toValue(prop), el);
  }, debounce));
  if (transform) {
    return computed(() => transform(cssVar.value));
  }
  return cssVar;
}
export {
  useResponseCssVar
};