ConfigProvider.mjs 2.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071
  1. import { createVNode as _createVNode } from "vue";
  2. import { watch, provide, computed, watchEffect, onActivated, onDeactivated, onBeforeUnmount, defineComponent } from "vue";
  3. import { extend, inBrowser, kebabCase, makeStringProp, createNamespace } from "../utils/index.mjs";
  4. import { setGlobalZIndex } from "../composables/use-global-z-index.mjs";
  5. const [name, bem] = createNamespace("config-provider");
  6. const CONFIG_PROVIDER_KEY = Symbol(name);
  7. const configProviderProps = {
  8. tag: makeStringProp("div"),
  9. theme: makeStringProp("light"),
  10. zIndex: Number,
  11. themeVars: Object,
  12. themeVarsDark: Object,
  13. themeVarsLight: Object,
  14. iconPrefix: String
  15. };
  16. function mapThemeVarsToCSSVars(themeVars) {
  17. const cssVars = {};
  18. Object.keys(themeVars).forEach((key) => {
  19. cssVars[`--van-${kebabCase(key)}`] = themeVars[key];
  20. });
  21. return cssVars;
  22. }
  23. var stdin_default = defineComponent({
  24. name,
  25. props: configProviderProps,
  26. setup(props, {
  27. slots
  28. }) {
  29. const style = computed(() => mapThemeVarsToCSSVars(extend({}, props.themeVars, props.theme === "dark" ? props.themeVarsDark : props.themeVarsLight)));
  30. if (inBrowser) {
  31. const addTheme = () => {
  32. document.documentElement.classList.add(`van-theme-${props.theme}`);
  33. };
  34. const removeTheme = (theme = props.theme) => {
  35. document.documentElement.classList.remove(`van-theme-${theme}`);
  36. };
  37. watch(() => props.theme, (newVal, oldVal) => {
  38. if (oldVal) {
  39. removeTheme(oldVal);
  40. }
  41. addTheme();
  42. }, {
  43. immediate: true
  44. });
  45. onActivated(addTheme);
  46. onDeactivated(removeTheme);
  47. onBeforeUnmount(removeTheme);
  48. }
  49. provide(CONFIG_PROVIDER_KEY, props);
  50. watchEffect(() => {
  51. if (props.zIndex !== void 0) {
  52. setGlobalZIndex(props.zIndex);
  53. }
  54. });
  55. return () => _createVNode(props.tag, {
  56. "class": bem(),
  57. "style": style.value
  58. }, {
  59. default: () => {
  60. var _a;
  61. return [(_a = slots.default) == null ? void 0 : _a.call(slots)];
  62. }
  63. });
  64. }
  65. });
  66. export {
  67. CONFIG_PROVIDER_KEY,
  68. configProviderProps,
  69. stdin_default as default
  70. };