yuyeon 0.3.1-rc.6 → 0.3.2-rc.1

package/lib/composables/theme/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["computed","effectScope","getCurrentInstance","inject","provide","reactive","readonly","ref","unref","watch","bindThemeClass","propsFactory","createPalette","createThemes","cssClass","cssVariables","configureOptions","Y_THEME_PREFIX","YUYEON_THEME_KEY","Symbol","for","pressThemePropsOptions","theme","String","isDarkMode","window","matchMedia","matches","isSupportAutoScheme","media","createThemeModule","options","appMountedScope","config","scheme","themes","palette","supportedAutoMode","preferColorScheme","darkModeWatcher","mediaQueryList","value","currentColorScheme","currentThemeKey","computedThemes","Array","isArray","computedPalette","styles","separationId","separation","lines","push","themeKey","themeDefs","Object","entries","colors","variables","isDark","records","themeScheme","join","install","app","directive","styleEl","document","getElementById","updateStyleEl","immediate","el","createElement","type","id","cspNonce","setAttribute","head","appendChild","innerHTML","bindTheme","yuyeon","mql","addEventListener","neo","lightTheme","darkTheme","root","dataset","init","run","themeClasses","scope","instance","global","useLocalTheme","props","themeModule","Error","moduleTheme","newTheme","useTheme"],"sources":["../../../src/composables/theme/index.ts"],"sourcesContent":["import type { App, ComputedRef, PropType, Ref } from 'vue';\r\nimport {\r\n  computed,\r\n  effectScope,\r\n  getCurrentInstance,\r\n  inject,\r\n  provide,\r\n  reactive,\r\n  readonly,\r\n  ref,\r\n  unref,\r\n  watch,\r\n} from 'vue';\r\n\r\nimport bindThemeClass from '@/directives/theme-class';\r\nimport { propsFactory } from '@/util/component/props';\r\n\r\nimport { createPalette, createThemes } from './factory';\r\nimport { cssClass, cssVariables } from './helper';\r\nimport { ThemeScheme, configureOptions } from './setting';\r\nimport type { ThemeOptions } from './types';\r\n\r\nexport type { ThemeOptions };\r\n\r\nexport const Y_THEME_PREFIX = 'y-theme';\r\n\r\nexport interface ThemeModuleInstance {\r\n  scheme: Ref<keyof typeof ThemeScheme | 'auto'>;\r\n  theme: Ref<[string, string?]>;\r\n  // theme values(schemes) for colors & variables\r\n  readonly themes: any;\r\n  readonly global: {\r\n    // currentThemeKeys: [lightThemeKey, darkThemeKey]\r\n    // If used manually, fix the scheme to 'light' and have a [lightThemeKey] value.\r\n    // Use the appropriate default theme scheme if it does not match the themeKey\r\n    scheme: Ref<keyof typeof ThemeScheme | 'auto'>;\r\n    theme: Ref<[string, string?]>;\r\n  };\r\n  /* computed */\r\n  readonly currentThemeKey: Readonly<ComputedRef<string>>;\r\n  readonly themeClasses: Readonly<ComputedRef<string | undefined>>;\r\n  readonly computedThemes: Readonly<ComputedRef<any>>;\r\n  readonly computedPalette: Readonly<ComputedRef<any>>;\r\n  /* */\r\n  readonly supportedAutoMode: Readonly<Ref<boolean>>;\r\n  readonly preferColorScheme: Readonly<Ref<'light' | 'dark'>>;\r\n}\r\n\r\nexport const YUYEON_THEME_KEY = Symbol.for('yuyeon.theme');\r\n\r\nexport const pressThemePropsOptions = propsFactory(\r\n  {\r\n    theme: String as PropType<string>,\r\n  },\r\n  'theme',\r\n);\r\n\r\nexport function isDarkMode() {\r\n  return window.matchMedia('(prefers-color-scheme: dark)').matches;\r\n}\r\n\r\nexport function isSupportAutoScheme() {\r\n  return window.matchMedia('(prefers-color-scheme)').media !== 'not all';\r\n}\r\n\r\nexport function createThemeModule(options: ThemeOptions) {\r\n  const appMountedScope = effectScope();\r\n  const config = reactive(configureOptions(options));\r\n  const scheme = ref<string>(config.scheme);\r\n  const theme = ref<[string, string]>(config.theme);\r\n  const themes = ref(config.themes);\r\n  const palette = ref(config.palette);\r\n  const supportedAutoMode = ref(true);\r\n  const preferColorScheme = ref('');\r\n\r\n  function darkModeWatcher(\r\n    mediaQueryList: MediaQueryListEvent | MediaQueryList,\r\n  ) {\r\n    preferColorScheme.value = mediaQueryList.matches ? 'dark' : 'light';\r\n  }\r\n\r\n  const currentColorScheme = computed<'light' | 'dark'>(() => {\r\n    if (scheme.value === 'auto') {\r\n      return preferColorScheme.value as 'light' | 'dark';\r\n    }\r\n    if (scheme.value === 'dark') {\r\n      return 'dark';\r\n    }\r\n    return 'light';\r\n  });\r\n\r\n  const currentThemeKey = computed(() => {\r\n    if (typeof theme.value === 'string') {\r\n      if (theme.value in computedThemes) {\r\n        return theme.value;\r\n      }\r\n    }\r\n    if (Array.isArray(theme.value)) {\r\n      return currentColorScheme.value === 'dark'\r\n        ? theme.value?.[1] ?? 'dark'\r\n        : theme.value?.[0] ?? 'light';\r\n    }\r\n    return currentColorScheme.value;\r\n  });\r\n\r\n  const computedPalette = computed(() => {\r\n    return createPalette(palette.value);\r\n  });\r\n\r\n  const computedThemes = computed(() => {\r\n    return createThemes(themes.value);\r\n  });\r\n\r\n  const styles = computed(() => {\r\n    const separationId = config.separation ? `#${config.separation}` : '';\r\n    const lines = [];\r\n    lines.push(\r\n      ...cssClass(':root', cssVariables(computedPalette.value, 'palette')),\r\n    );\r\n    for (const [themeKey, themeDefs] of Object.entries(computedThemes.value)) {\r\n      const { colors, variables, isDark } = themeDefs;\r\n      const records: Record<string, string> = {\r\n        ...colors,\r\n        ...variables,\r\n      };\r\n      // if (currentThemeKey.value === themeKey) {\r\n      //   lines.push(...cssClass(':root', cssVariables(records, 'theme')));\r\n      // }\r\n      const themeScheme = isDark ? 'dark' : 'light';\r\n      if (scheme.value === 'auto') {\r\n        lines.push(\r\n          ...cssClass(\r\n            `@media (prefers-color-scheme: ${themeScheme})`,\r\n            cssClass(\r\n              `${separationId}[data-theme-scheme='auto'][data-${themeScheme}-theme='${themeKey}']`,\r\n              cssVariables(records, 'theme'),\r\n            ),\r\n          ),\r\n        );\r\n      } else {\r\n        lines.push(\r\n          ...cssClass(\r\n            `${separationId}[data-theme-scheme='${themeScheme}'][data-${themeScheme}-theme='${themeKey}']`,\r\n            cssVariables(records, 'theme'),\r\n          ),\r\n        );\r\n      }\r\n\r\n      lines.push(\r\n        ...cssClass(\r\n          `${separationId} .y-theme--${themeKey}`,\r\n          cssVariables(records, 'theme'),\r\n        ),\r\n      );\r\n    }\r\n    return lines.join('');\r\n  });\r\n\r\n  function install(app: App) {\r\n    app.directive('theme', bindThemeClass);\r\n\r\n    let styleEl = document.getElementById(\r\n      'yuyeon-theme-palette' +\r\n        `${config.separation ? '__' + config.separation : ''}`,\r\n    );\r\n\r\n    watch(styles, updateStyleEl, { immediate: true });\r\n\r\n    function updateStyleEl() {\r\n      if (typeof document !== 'undefined' && !styleEl) {\r\n        const el = document.createElement('style');\r\n        el.type = 'text/css';\r\n        el.id =\r\n          'yuyeon-theme-palette' +\r\n          `${config.separation ? '__' + config.separation : ''}`;\r\n        if (options?.cspNonce) el.setAttribute('nonce', options.cspNonce);\r\n        styleEl = el;\r\n        document.head.appendChild(styleEl);\r\n      }\r\n      if (styleEl) {\r\n        styleEl.innerHTML = styles.value;\r\n      }\r\n    }\r\n  }\r\n\r\n  function bindTheme(yuyeon: any) {\r\n    supportedAutoMode.value = isSupportAutoScheme();\r\n    if (supportedAutoMode.value) {\r\n      const mql = window.matchMedia('(prefers-color-scheme: dark)');\r\n      darkModeWatcher(mql);\r\n      mql.addEventListener('change' as 'change', darkModeWatcher);\r\n    }\r\n    watch(\r\n      theme,\r\n      (neo) => {\r\n        const [lightTheme, darkTheme] = neo;\r\n        yuyeon.root.dataset.lightTheme = lightTheme;\r\n        yuyeon.root.dataset.darkTheme = darkTheme;\r\n      },\r\n      { immediate: true },\r\n    );\r\n    watch(\r\n      scheme,\r\n      (neo) => {\r\n        yuyeon.root.setAttribute(\r\n          'data-theme-scheme',\r\n          neo === 'auto' ? 'auto' : currentColorScheme.value,\r\n        );\r\n      },\r\n      { immediate: true },\r\n    );\r\n  }\r\n\r\n  function init(yuyeon: any) {\r\n    appMountedScope.run(() => {\r\n      bindTheme(yuyeon);\r\n    });\r\n  }\r\n\r\n  const themeClasses = computed(() => `y-theme--${currentThemeKey.value}`);\r\n\r\n  return {\r\n    install,\r\n    init,\r\n    scope: appMountedScope,\r\n    instance: {\r\n      global: {\r\n        scheme,\r\n        theme,\r\n      },\r\n      themes,\r\n      scheme,\r\n      theme,\r\n      currentThemeKey,\r\n      themeClasses,\r\n      computedThemes,\r\n      computedPalette,\r\n      supportedAutoMode: readonly(supportedAutoMode),\r\n      preferColorScheme: readonly(preferColorScheme),\r\n    },\r\n  };\r\n}\r\n\r\nexport function useLocalTheme(props: { theme?: string }) {\r\n  getCurrentInstance();\r\n\r\n  const themeModule = inject<ThemeModuleInstance | null>(\r\n    YUYEON_THEME_KEY,\r\n    null,\r\n  );\r\n\r\n  if (!themeModule) throw new Error('Not found provided \"ThemeModule\"');\r\n\r\n  const palette = themeModule.computedPalette;\r\n\r\n  const currentThemeKey = computed<string>(() => {\r\n    if (props.theme) {\r\n      const moduleTheme = unref(themeModule.theme);\r\n      switch (props.theme) {\r\n        case 'light':\r\n          return moduleTheme?.[0] ?? 'light';\r\n        case 'dark':\r\n          return moduleTheme?.[1] ?? 'dark';\r\n        // TODO: props.theme(themeKey) validation in themes\r\n        default:\r\n          return props.theme;\r\n      }\r\n    }\r\n    return unref(themeModule.currentThemeKey);\r\n  });\r\n\r\n  const themeClasses = computed(() => {\r\n    return `y-theme--${currentThemeKey.value}`;\r\n  });\r\n\r\n  const newTheme: ThemeModuleInstance = {\r\n    ...themeModule,\r\n    currentThemeKey,\r\n    themeClasses,\r\n  };\r\n\r\n  provide(YUYEON_THEME_KEY, newTheme);\r\n\r\n  return newTheme;\r\n}\r\n\r\nexport function useTheme() {\r\n  getCurrentInstance();\r\n\r\n  const theme = inject<ThemeModuleInstance | null>(YUYEON_THEME_KEY, null);\r\n\r\n  if (!theme) throw new Error('【yuyeon】 Not found provided \"ThemeModule\"');\r\n\r\n  return theme;\r\n}\r\n"],"mappings":"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"}

package/lib/composables/theme/setting.js

@@ -0,0 +1,113 @@
+import { mergeDeep } from "../../util/common.js";
+export const ThemeScheme = {
+  light: 'light',
+  dark: 'dark'
+};
+export const schemes = ['light', 'dark', 'auto'];
+export const defaultTonalLuminance = [0, 10, 20, 25, 30, 35, 40, 50, 60, 70, 80, 90, 95, 98, 99, 100];
+export const defaultPalette = {
+  scaleMethod: 'tonal',
+  colors: {
+    primary: '#0062a1',
+    secondary: '#6251a6',
+    tertiary: '#3c691b',
+    neutral: '#5d5e61',
+    positive: '#009d61',
+    negative: '#ba1a1a',
+    warning: '#f69400',
+    info: '#0d62e6'
+  }
+};
+export const defaultThemesValues = {
+  light: {
+    isDark: false,
+    colors: {
+      primary: '#0062a1',
+      secondary: '#6251a6',
+      tertiary: '#3c691b',
+      background: '#fdfbff',
+      'on-background': '#1a1c1e',
+      surface: '#fdfbff',
+      'on-surface': '#1a1c1e',
+      'surface-variant': '#dfe3eb',
+      'on-surface-variant': '#42474e',
+      outline: '#73777f',
+      'outline-variant': '#c2c7cf',
+      error: '#ba1a1a',
+      'on-error': '#ffffff',
+      warning: '#8a5100',
+      'on-warning': '#ffffff',
+      info: '#0056d0',
+      'on-info': '#ffffff',
+      success: '#006d42',
+      'on-success': '#ffffff',
+      shadow: '#000000',
+      highlighter: '#ffff00'
+    },
+    variables: {
+      'outline-opacity': 0.14,
+      'base-shadow-opacity': 0.14,
+      'base-font': '#141414'
+    }
+  },
+  dark: {
+    isDark: true,
+    colors: {
+      primary: '#9ccaff',
+      'on-primary': '#003257',
+      secondary: '#cbbeff',
+      'on-secondary': '#332074',
+      tertiary: '#a1d57a',
+      'on-tertiary': '#173800',
+      background: '#1a1c1e',
+      'on-background': '#e2e2e6',
+      surface: '#1a1c1e',
+      'on-surface': '#e2e2e6',
+      'surface-variant': '#42474e',
+      'on-surface-variant': '#c2c7cf',
+      outline: '#8c9199',
+      'outline-variant': '#42474e',
+      error: '#ffb4ab',
+      'on-error': '#690005',
+      warning: '#ffb86e',
+      'on-warning': '#492900',
+      info: '#b1c5ff',
+      'on-info': '#002c72',
+      success: '#61dd9a',
+      'on-success': '#003920',
+      shadow: '#000000',
+      highlighter: '#51510d'
+    },
+    variables: {
+      'outline-opacity': 0.14,
+      'base-shadow-opacity': 0.14,
+      'base-font': '#f5f5f5'
+    }
+  }
+};
+export function configureOptions(options) {
+  if (!options) {
+    return {
+      scheme: ThemeScheme.light,
+      theme: ['light', 'dark'],
+      themes: {
+        ...mergeDeep(defaultThemesValues)
+      },
+      palette: {
+        ...mergeDeep(defaultPalette)
+      }
+    };
+  }
+  return {
+    scheme: schemes.includes(options.scheme) ? options.scheme : ThemeScheme.light,
+    theme: options.theme ?? ['light', 'dark'],
+    themes: {
+      ...mergeDeep(defaultThemesValues, options.themes)
+    },
+    palette: {
+      ...mergeDeep(defaultPalette, options.palette)
+    },
+    separation: options?.separation
+  };
+}
+//# sourceMappingURL=setting.js.map

package/lib/composables/theme/setting.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"setting.js","names":["mergeDeep","ThemeScheme","light","dark","schemes","defaultTonalLuminance","defaultPalette","scaleMethod","colors","primary","secondary","tertiary","neutral","positive","negative","warning","info","defaultThemesValues","isDark","background","surface","outline","error","success","shadow","highlighter","variables","configureOptions","options","scheme","theme","themes","palette","includes","separation"],"sources":["../../../src/composables/theme/setting.ts"],"sourcesContent":["import { mergeDeep } from '@/util/common';\n\nimport type { PaletteOption, ThemeOptions } from './types';\n\nexport const ThemeScheme = {\n  light: 'light',\n  dark: 'dark',\n} as const;\n\nexport const schemes = ['light', 'dark', 'auto'] as const;\n\nexport const defaultTonalLuminance = [\n  0, 10, 20, 25, 30, 35, 40, 50, 60, 70, 80, 90, 95, 98, 99, 100,\n];\n\nexport const defaultPalette: PaletteOption = {\n  scaleMethod: 'tonal',\n  colors: {\n    primary: '#0062a1',\n    secondary: '#6251a6',\n    tertiary: '#3c691b',\n    neutral: '#5d5e61',\n    positive: '#009d61',\n    negative: '#ba1a1a',\n    warning: '#f69400',\n    info: '#0d62e6',\n  },\n};\n\nexport const defaultThemesValues: any = {\n  light: {\n    isDark: false,\n    colors: {\n      primary: '#0062a1',\n      secondary: '#6251a6',\n      tertiary: '#3c691b',\n      background: '#fdfbff',\n      'on-background': '#1a1c1e',\n      surface: '#fdfbff',\n      'on-surface': '#1a1c1e',\n      'surface-variant': '#dfe3eb',\n      'on-surface-variant': '#42474e',\n      outline: '#73777f',\n      'outline-variant': '#c2c7cf',\n      error: '#ba1a1a',\n      'on-error': '#ffffff',\n      warning: '#8a5100',\n      'on-warning': '#ffffff',\n      info: '#0056d0',\n      'on-info': '#ffffff',\n      success: '#006d42',\n      'on-success': '#ffffff',\n      shadow: '#000000',\n      highlighter: '#ffff00',\n    },\n    variables: {\n      'outline-opacity': 0.14,\n      'base-shadow-opacity': 0.14,\n      'base-font': '#141414',\n    },\n  },\n  dark: {\n    isDark: true,\n    colors: {\n      primary: '#9ccaff',\n      'on-primary': '#003257',\n      secondary: '#cbbeff',\n      'on-secondary': '#332074',\n      tertiary: '#a1d57a',\n      'on-tertiary': '#173800',\n      background: '#1a1c1e',\n      'on-background': '#e2e2e6',\n      surface: '#1a1c1e',\n      'on-surface': '#e2e2e6',\n      'surface-variant': '#42474e',\n      'on-surface-variant': '#c2c7cf',\n      outline: '#8c9199',\n      'outline-variant': '#42474e',\n      error: '#ffb4ab',\n      'on-error': '#690005',\n      warning: '#ffb86e',\n      'on-warning': '#492900',\n      info: '#b1c5ff',\n      'on-info': '#002c72',\n      success: '#61dd9a',\n      'on-success': '#003920',\n      shadow: '#000000',\n      highlighter: '#51510d',\n    },\n    variables: {\n      'outline-opacity': 0.14,\n      'base-shadow-opacity': 0.14,\n      'base-font': '#f5f5f5',\n    },\n  },\n};\n\nexport function configureOptions(options?: ThemeOptions): any {\n  if (!options) {\n    return {\n      scheme: ThemeScheme.light,\n      theme: ['light', 'dark'],\n      themes: { ...mergeDeep(defaultThemesValues) },\n      palette: { ...mergeDeep(defaultPalette) },\n    };\n  }\n  return {\n    scheme: schemes.includes(options.scheme)\n      ? options.scheme\n      : ThemeScheme.light,\n    theme: options.theme ?? ['light', 'dark'],\n    themes: { ...mergeDeep(defaultThemesValues, options.themes) },\n    palette: { ...mergeDeep(defaultPalette, options.palette) },\n    separation: options?.separation,\n  };\n}\n"],"mappings":"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"}

package/lib/composables/theme/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/lib/composables/theme/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","names":[],"sources":["../../../src/composables/theme/types.ts"],"sourcesContent":["export interface ThemeOptions {\r\n  scheme: 'light' | 'dark' | 'auto';\r\n  theme: [string, string?];\r\n  themes: Record<string, ThemeDefinition>;\r\n  palette?: PaletteOption;\r\n  cspNonce?: string;\r\n  separation?: string;\r\n}\r\n\r\nexport interface PaletteOption {\r\n  scaleMethod: 'manual' | 'luma' | 'tonal';\r\n  colors: Record<string, string | PaletteLevelColorOption | PaletteLumaColorOption>;\r\n  defaultLamaScale?: {\r\n    darken?: 0 | 1 | 2 | 3 | 4;\r\n    lighten?: 0 | 1 | 2 | 3 | 4 | 5;\r\n  }\r\n}\r\n\r\ntype ScaleLevel = number;\r\nexport type PaletteLevelColorOption = Record<ScaleLevel, string>\r\n\r\nexport type PaletteLumaColorOption = {\r\n  value: string,\r\n  darken?: 0 | 1 | 2 | 3 | 4;\r\n  lighten?: 0 | 1 | 2 | 3 | 4 | 5;\r\n}\r\n\r\nexport interface ThemeDefinition {\r\n  isDark: boolean;\r\n  colors: Record<string, string>;\r\n  variables: Record<string, string>;\r\n}\r\n"],"mappings":""}

package/lib/composables/timing.js

@@ -0,0 +1,102 @@
+import { computed, ref, unref, watch } from 'vue';
+export function useLazy(eager, updated) {
+  const tick = ref(false);
+  const tack = ref();
+  tack.value = updated.value;
+  const lazyValue = computed(() => {
+    if (eager.value) return updated.value;
+    return tack.value;
+  });
+  watch(updated, () => {
+    if (!tick.value) {
+      tack.value = updated.value;
+    }
+    if (!eager.value) {
+      tick.value = true;
+    }
+  });
+  function onAfterUpdate() {
+    tack.value = updated.value;
+    if (!eager.value) {
+      tick.value = false;
+    }
+  }
+  return {
+    entered: tick,
+    lazyValue,
+    onAfterUpdate
+  };
+}
+export function useTimer(cb, duration, options) {
+  const {
+    tickDuration
+  } = options ?? {};
+  let tickInterval = tickDuration ?? 100;
+  let timer = -1;
+  const tickStart = ref(0);
+  const drift = ref(unref(duration));
+  const isWork = ref(false);
+  function tick() {
+    const now = Date.now();
+    const realTick = now - tickStart.value;
+    drift.value = drift.value - realTick;
+    if (drift.value < 1) {
+      cb();
+    } else {
+      const tickDrift = now - tickStart.value + tickInterval;
+      const nextInterval = tickDrift >= 1 ? tickDrift : tickInterval;
+      tickStart.value = now;
+      timer = window.setTimeout(tick, nextInterval);
+    }
+  }
+  function start() {
+    if (isWork.value) return;
+    isWork.value = true;
+    tickStart.value = Date.now();
+    timer = window.setTimeout(tick, tickInterval);
+  }
+  function stop() {
+    window.clearTimeout(timer);
+    timer = -1;
+    isWork.value = false;
+  }
+  function reset() {
+    stop();
+    drift.value = unref(duration);
+  }
+  return {
+    start,
+    stop,
+    reset,
+    drift,
+    isWork
+  };
+}
+export function useDelay(props, callback) {
+  const state = {};
+  function clearDelay(propKey) {
+    state[propKey] && window.clearTimeout(state[propKey]);
+    delete state[propKey];
+  }
+  function setDelay(propKey, timeout, resolve) {
+    state[propKey] = window.setTimeout(() => {
+      const active = propKey === 'openDelay';
+      callback?.(active);
+      resolve(active);
+    }, timeout);
+  }
+  const generateDelay = propKey => () => {
+    clearDelay('openDelay');
+    clearDelay('closeDelay');
+    const delayTime = props[propKey] ?? 0;
+    return new Promise(resolve => {
+      const delay = parseInt(String(delayTime), 10);
+      setDelay(propKey, delay, resolve);
+    });
+  };
+  return {
+    startOpenDelay: generateDelay('openDelay'),
+    startCloseDelay: generateDelay('closeDelay')
+  };
+}
+//# sourceMappingURL=timing.js.map

package/lib/composables/timing.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"timing.js","names":["computed","ref","unref","watch","useLazy","eager","updated","tick","tack","value","lazyValue","onAfterUpdate","entered","useTimer","cb","duration","options","tickDuration","tickInterval","timer","tickStart","drift","isWork","now","Date","realTick","tickDrift","nextInterval","window","setTimeout","start","stop","clearTimeout","reset","useDelay","props","callback","state","clearDelay","propKey","setDelay","timeout","resolve","active","generateDelay","delayTime","Promise","delay","parseInt","String","startOpenDelay","startCloseDelay"],"sources":["../../src/composables/timing.ts"],"sourcesContent":["import { type MaybeRef, type Ref, computed, ref, unref, watch } from 'vue';\r\n\r\nexport function useLazy(eager: Ref<boolean | undefined>, updated: Ref<any>) {\r\n  const tick = ref(false);\r\n  const tack = ref();\r\n  tack.value = updated.value;\r\n  const lazyValue = computed(() => {\r\n    if (eager.value) return updated.value;\r\n    return tack.value;\r\n  });\r\n  watch(updated, () => {\r\n    if (!tick.value) {\r\n      tack.value = updated.value;\r\n    }\r\n    if (!eager.value) {\r\n      tick.value = true;\r\n    }\r\n  });\r\n  function onAfterUpdate() {\r\n    tack.value = updated.value;\r\n    if (!eager.value) {\r\n      tick.value = false;\r\n    }\r\n  }\r\n  return {\r\n    entered: tick,\r\n    lazyValue,\r\n    onAfterUpdate,\r\n  };\r\n}\r\n\r\nexport function useTimer(\r\n  cb: () => void,\r\n  duration: MaybeRef<number>,\r\n  options?: { tickDuration: number },\r\n) {\r\n  const { tickDuration } = options ?? {};\r\n  let tickInterval = tickDuration ?? 100;\r\n  let timer = -1;\r\n\r\n  const tickStart = ref(0);\r\n  const drift = ref(unref(duration));\r\n  const isWork = ref(false);\r\n\r\n  function tick() {\r\n    const now = Date.now();\r\n    const realTick = now - tickStart.value;\r\n    drift.value = drift.value - realTick;\r\n    if (drift.value < 1) {\r\n      cb();\r\n    } else {\r\n      const tickDrift = now - tickStart.value + tickInterval;\r\n      const nextInterval = tickDrift >= 1 ? tickDrift : tickInterval;\r\n      tickStart.value = now;\r\n      timer = window.setTimeout(tick, nextInterval);\r\n    }\r\n  }\r\n\r\n  function start() {\r\n    if (isWork.value) return;\r\n    isWork.value = true;\r\n    tickStart.value = Date.now();\r\n    timer = window.setTimeout(tick, tickInterval);\r\n  }\r\n\r\n  function stop() {\r\n    window.clearTimeout(timer);\r\n    timer = -1;\r\n    isWork.value = false;\r\n  }\r\n\r\n  function reset() {\r\n    stop();\r\n    drift.value = unref(duration);\r\n  }\r\n\r\n  return {\r\n    start,\r\n    stop,\r\n    reset,\r\n    drift,\r\n    isWork,\r\n  };\r\n}\r\n\r\ntype DelayType = 'closeDelay' | 'openDelay';\r\n\r\nexport function useDelay(props: any, callback?: (active: boolean) => void) {\r\n  const state: Partial<Record<DelayType, number>> = {};\r\n\r\n  function clearDelay(propKey: DelayType) {\r\n    state[propKey] && window.clearTimeout(state[propKey]);\r\n    delete state[propKey];\r\n  }\r\n\r\n  function setDelay(propKey: DelayType, timeout: number, resolve: any) {\r\n    state[propKey] = window.setTimeout(() => {\r\n      const active = propKey === 'openDelay';\r\n      callback?.(active);\r\n      resolve(active);\r\n    }, timeout);\r\n  }\r\n\r\n  const generateDelay = (propKey: DelayType) => () => {\r\n    clearDelay('openDelay');\r\n    clearDelay('closeDelay');\r\n    const delayTime = props[propKey] ?? 0;\r\n    return new Promise<boolean>((resolve) => {\r\n      const delay = parseInt(String(delayTime), 10);\r\n      setDelay(propKey, delay, resolve);\r\n    });\r\n  };\r\n\r\n  return {\r\n    startOpenDelay: generateDelay('openDelay'),\r\n    startCloseDelay: generateDelay('closeDelay'),\r\n  };\r\n}\r\n"],"mappings":"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"}

package/lib/composables/transition.js

@@ -0,0 +1,51 @@
+import { Transition, computed, h } from 'vue';
+import { propsFactory } from "../util/component/props.js";
+export const pressPolyTransitionPropsOptions = propsFactory({
+  transition: {
+    type: [String, Object],
+    default: 'slide-fade'
+  }
+}, 'PolyTransition');
+export function usePolyTransition(props) {
+  const polyTransitionBindProps = computed(() => {
+    const {
+      is,
+      ...transitionProps
+    } = typeof props.transition === 'object' ? props.transition : {
+      is: props.transition,
+      name: props.transition
+    };
+    return {
+      is,
+      transitionProps
+    };
+  });
+  return {
+    polyTransitionBindProps
+  };
+}
+export const PolyTransition = (props, _ref) => {
+  let {
+    slots
+  } = _ref;
+  const {
+    is,
+    transitionProps,
+    ...forcedProps
+  } = props;
+  const {
+    component = Transition,
+    ...rest
+  } = typeof is === 'object' ? {
+    component: is,
+    ...transitionProps
+  } : {
+    name: is
+  };
+  return h(component, {
+    ...rest,
+    ...transitionProps,
+    ...forcedProps
+  }, slots);
+};
+//# sourceMappingURL=transition.js.map

package/lib/composables/transition.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"transition.js","names":["Transition","computed","h","propsFactory","pressPolyTransitionPropsOptions","transition","type","String","Object","default","usePolyTransition","props","polyTransitionBindProps","is","transitionProps","name","PolyTransition","_ref","slots","forcedProps","component","rest"],"sources":["../../src/composables/transition.ts"],"sourcesContent":["import {\r\n  type Component,\r\n  type FunctionalComponent,\r\n  type PropType,\r\n  Transition,\r\n  type TransitionProps,\r\n  computed,\r\n  h,\r\n} from 'vue';\r\n\r\nimport { propsFactory } from '@/util/component/props';\r\n\r\nexport const pressPolyTransitionPropsOptions = propsFactory(\r\n  {\r\n    transition: {\r\n      type: [String, Object] as PropType<\r\n        string | (TransitionProps & { is?: Component })\r\n      >,\r\n      default: 'slide-fade',\r\n    },\r\n  },\r\n  'PolyTransition',\r\n);\r\n\r\nexport function usePolyTransition(props: { transition: any }) {\r\n  const polyTransitionBindProps = computed(() => {\r\n    const { is, ...transitionProps } =\r\n      typeof props.transition === 'object'\r\n        ? props.transition\r\n        : { is: props.transition, name: props.transition };\r\n    return {\r\n      is,\r\n      transitionProps,\r\n    };\r\n  });\r\n\r\n  return {\r\n    polyTransitionBindProps,\r\n  };\r\n}\r\n\r\nexport const PolyTransition: FunctionalComponent<\r\n  TransitionProps & { is: string | Component; transitionProps: TransitionProps }\r\n> = (props, { slots }) => {\r\n  const { is, transitionProps, ...forcedProps } = props;\r\n  const { component = Transition, ...rest } =\r\n    typeof is === 'object'\r\n      ? { component: is, ...transitionProps }\r\n      : { name: is };\r\n  return h(component, { ...rest, ...transitionProps, ...forcedProps }, slots);\r\n};\r\n"],"mappings":"AAAA,SAIEA,UAAU,EAEVC,QAAQ,EACRC,CAAC,QACI,KAAK;AAAC,SAEJC,YAAY;AAErB,OAAO,MAAMC,+BAA+B,GAAGD,YAAY,CACzD;EACEE,UAAU,EAAE;IACVC,IAAI,EAAE,CAACC,MAAM,EAAEC,MAAM,CAEpB;IACDC,OAAO,EAAE;EACX;AACF,CAAC,EACD,gBACF,CAAC;AAED,OAAO,SAASC,iBAAiBA,CAACC,KAA0B,EAAE;EAC5D,MAAMC,uBAAuB,GAAGX,QAAQ,CAAC,MAAM;IAC7C,MAAM;MAAEY,EAAE;MAAE,GAAGC;IAAgB,CAAC,GAC9B,OAAOH,KAAK,CAACN,UAAU,KAAK,QAAQ,GAChCM,KAAK,CAACN,UAAU,GAChB;MAAEQ,EAAE,EAAEF,KAAK,CAACN,UAAU;MAAEU,IAAI,EAAEJ,KAAK,CAACN;IAAW,CAAC;IACtD,OAAO;MACLQ,EAAE;MACFC;IACF,CAAC;EACH,CAAC,CAAC;EAEF,OAAO;IACLF;EACF,CAAC;AACH;AAEA,OAAO,MAAMI,cAEZ,GAAGA,CAACL,KAAK,EAAAM,IAAA,KAAgB;EAAA,IAAd;IAAEC;EAAM,CAAC,GAAAD,IAAA;EACnB,MAAM;IAAEJ,EAAE;IAAEC,eAAe;IAAE,GAAGK;EAAY,CAAC,GAAGR,KAAK;EACrD,MAAM;IAAES,SAAS,GAAGpB,UAAU;IAAE,GAAGqB;EAAK,CAAC,GACvC,OAAOR,EAAE,KAAK,QAAQ,GAClB;IAAEO,SAAS,EAAEP,EAAE;IAAE,GAAGC;EAAgB,CAAC,GACrC;IAAEC,IAAI,EAAEF;EAAG,CAAC;EAClB,OAAOX,CAAC,CAACkB,SAAS,EAAE;IAAE,GAAGC,IAAI;IAAE,GAAGP,eAAe;IAAE,GAAGK;EAAY,CAAC,EAAED,KAAK,CAAC;AAC7E,CAAC"}

package/lib/composables/validation.js

@@ -0,0 +1,126 @@
+import { computed, getCurrentInstance, onBeforeMount, ref, watch } from 'vue';
+import { getUid, propsFactory } from "../util/component/index.js";
+import { useModelDuplex } from "./communication.js";
+import { useForm } from "./form.js";
+import { useToggleScope } from "./scope.js";
+export const pressValidationPropsOptions = propsFactory({
+  readonly: Boolean,
+  disabled: Boolean,
+  status: {
+    type: String,
+    validator(value) {
+      return ['success', 'warning', 'error'].includes(value);
+    }
+  },
+  helperText: String,
+  validators: Array,
+  validateOn: {
+    type: String
+  },
+  validationValue: null,
+  maxErrors: {
+    type: [Number, String],
+    default: 1
+  }
+}, 'validation');
+export function useValidation(props, name) {
+  let uid = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : getUid();
+  const cid = computed(() => props.name ?? uid);
+  const model = useModelDuplex(props, 'modelValue');
+  const validationModel = computed(() => props.validationValue === undefined ? model.value : props.validationValue);
+  const vm = getCurrentInstance();
+  const form = useForm();
+  const validating = ref(false);
+  const validateOn = computed(() => {
+    let value = props.validateOn || 'input';
+    if (value === 'lazy') value = 'input,lazy';
+    const onSet = new Set(value?.split(',') ?? []);
+    return {
+      blur: onSet.has('blur') || onSet.has('input'),
+      input: onSet.has('input'),
+      lazy: onSet.has('lazy'),
+      submit: onSet.has('submit')
+    };
+  });
+  const errorResult = ref();
+  const errors = ref([]);
+  const isReadonly = computed(() => props.readonly ?? form?.isReadonly.value);
+  const isDisabled = computed(() => props.disabled ?? form?.isDisabled.value);
+  const isLoading = computed(() => props.loading ?? form?.isLoading.value);
+  const isError = computed(() => {
+    return props.status === 'error' || errors.value.length > 0;
+  });
+  const isSuccess = computed(() => {
+    return !isError.value && props.status === 'success';
+  });
+  useToggleScope(() => validateOn.value.input, () => {
+    watch(validationModel, () => {
+      if (validationModel.value != null) {
+        invokeValidators();
+      } else if (props.focused) {
+        const unwatch = watch(() => props.focused, val => {
+          if (!val) invokeValidators();
+          unwatch();
+        });
+      }
+    });
+  });
+  async function invokeValidators() {
+    const results = [];
+    validating.value = true;
+    if (Array.isArray(props.validators)) {
+      for (const validator of props.validators) {
+        if (results.length >= +(props.maxErrors ?? 1)) {
+          break;
+        }
+        const handler = typeof validator === 'function' ? validator : () => validator;
+        const result = await handler(validationModel.value);
+        if (result === true) {
+          continue;
+        }
+        if (result !== false && typeof result !== 'string') {
+          console.warn('Wrong validator return type');
+          continue;
+        }
+        results.push(result || '');
+      }
+    }
+    validating.value = false;
+    errors.value = results;
+    errorResult.value = results?.[0];
+    return results;
+  }
+  function resetError() {
+    errors.value = [];
+    errorResult.value = undefined;
+  }
+  async function resetValidation() {
+    if (!validateOn.value.lazy) {
+      await invokeValidators();
+    } else {
+      resetError();
+    }
+  }
+  onBeforeMount(() => {
+    form?.register({
+      id: cid.value,
+      vnode: vm.vnode,
+      resetValidation,
+      validate: invokeValidators
+    });
+  });
+  return {
+    invokeValidators,
+    resetError,
+    validating,
+    validateOn,
+    errorResult,
+    errors,
+    isReadonly,
+    isDisabled,
+    isLoading,
+    isError,
+    isSuccess
+  };
+}
+//# sourceMappingURL=validation.js.map

package/lib/composables/validation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"validation.js","names":["computed","getCurrentInstance","onBeforeMount","ref","watch","getUid","propsFactory","useModelDuplex","useForm","useToggleScope","pressValidationPropsOptions","readonly","Boolean","disabled","status","type","String","validator","value","includes","helperText","validators","Array","validateOn","validationValue","maxErrors","Number","default","useValidation","props","name","uid","arguments","length","undefined","cid","model","validationModel","vm","form","validating","onSet","Set","split","blur","has","input","lazy","submit","errorResult","errors","isReadonly","isDisabled","isLoading","loading","isError","isSuccess","invokeValidators","focused","unwatch","val","results","isArray","handler","result","console","warn","push","resetError","resetValidation","register","id","vnode","validate"],"sources":["../../src/composables/validation.ts"],"sourcesContent":["import {\r\n  type PropType,\r\n  computed,\r\n  getCurrentInstance,\r\n  onBeforeMount,\r\n  ref,\r\n  watch,\r\n} from 'vue';\r\n\r\nimport { getUid, propsFactory } from '@/util/component';\r\n\r\nimport { useModelDuplex } from './communication';\r\nimport { useForm } from './form';\r\nimport { useToggleScope } from './scope';\r\n\r\nexport interface ValidationProps {\r\n  validateOn: 'input' | 'blur' | 'lazy' | 'submit' | string;\r\n}\r\n\r\nexport const pressValidationPropsOptions = propsFactory(\r\n  {\r\n    readonly: Boolean as PropType<boolean>,\r\n    disabled: Boolean as PropType<boolean>,\r\n    status: {\r\n      type: String as PropType<'success' | 'warning' | 'error' | undefined>,\r\n      validator(value: string) {\r\n        return ['success', 'warning', 'error'].includes(value);\r\n      },\r\n    },\r\n    helperText: String,\r\n    validators: Array as PropType<((v: any) => boolean | string)[] | string[]>,\r\n    validateOn: {\r\n      type: String as PropType<ValidationProps['validateOn']>,\r\n    },\r\n    validationValue: null,\r\n    maxErrors: {\r\n      type: [Number, String] as PropType<number | string>,\r\n      default: 1,\r\n    },\r\n  },\r\n  'validation',\r\n);\r\n\r\nexport function useValidation(props: any, name: string, uid = getUid()) {\r\n  const cid = computed(() => props.name ?? uid);\r\n  const model = useModelDuplex(props, 'modelValue');\r\n  const validationModel = computed(() =>\r\n    props.validationValue === undefined ? model.value : props.validationValue,\r\n  );\r\n  const vm = getCurrentInstance()!;\r\n  const form = useForm();\r\n  const validating = ref(false);\r\n  const validateOn = computed(() => {\r\n    let value = props.validateOn || 'input';\r\n    if (value === 'lazy') value = 'input,lazy';\r\n    const onSet = new Set(value?.split(',') ?? []);\r\n\r\n    return {\r\n      blur: onSet.has('blur') || onSet.has('input'),\r\n      input: onSet.has('input'),\r\n      lazy: onSet.has('lazy'),\r\n      submit: onSet.has('submit'),\r\n    };\r\n  });\r\n\r\n  const errorResult = ref();\r\n  const errors = ref<any[]>([]);\r\n\r\n  const isReadonly = computed(() => props.readonly ?? form?.isReadonly.value);\r\n\r\n  const isDisabled = computed(() => props.disabled ?? form?.isDisabled.value);\r\n\r\n  const isLoading = computed(() => props.loading ?? form?.isLoading.value);\r\n\r\n  const isError = computed(() => {\r\n    return props.status === 'error' || errors.value.length > 0;\r\n  });\r\n\r\n  const isSuccess = computed(() => {\r\n    return !isError.value && props.status === 'success';\r\n  });\r\n\r\n  useToggleScope(\r\n    () => validateOn.value.input,\r\n    () => {\r\n      watch(validationModel, () => {\r\n        if (validationModel.value != null) {\r\n          invokeValidators();\r\n        } else if (props.focused) {\r\n          const unwatch = watch(\r\n            () => props.focused,\r\n            (val) => {\r\n              if (!val) invokeValidators();\r\n\r\n              unwatch();\r\n            },\r\n          );\r\n        }\r\n      });\r\n    },\r\n  );\r\n\r\n  async function invokeValidators() {\r\n    const results: any[] = [];\r\n    validating.value = true;\r\n\r\n    if (Array.isArray(props.validators)) {\r\n      for (const validator of props.validators) {\r\n        if (results.length >= +(props.maxErrors ?? 1)) {\r\n          break;\r\n        }\r\n\r\n        const handler =\r\n          typeof validator === 'function' ? validator : () => validator;\r\n        const result = await handler(validationModel.value);\r\n\r\n        if (result === true) {\r\n          continue;\r\n        }\r\n\r\n        if (result !== false && typeof result !== 'string') {\r\n          console.warn('Wrong validator return type');\r\n          continue;\r\n        }\r\n        results.push(result || '');\r\n      }\r\n    }\r\n    validating.value = false;\r\n    errors.value = results;\r\n    errorResult.value = results?.[0];\r\n\r\n    return results;\r\n  }\r\n\r\n  function resetError() {\r\n    errors.value = [];\r\n    errorResult.value = undefined;\r\n  }\r\n\r\n  async function resetValidation() {\r\n    if (!validateOn.value.lazy) {\r\n      await invokeValidators();\r\n    } else {\r\n      resetError();\r\n    }\r\n  }\r\n\r\n  onBeforeMount(() => {\r\n    form?.register({\r\n      id: cid.value,\r\n      vnode: vm.vnode,\r\n      resetValidation,\r\n      validate: invokeValidators,\r\n    });\r\n  });\r\n\r\n  return {\r\n    invokeValidators,\r\n    resetError,\r\n    validating,\r\n    validateOn,\r\n    errorResult,\r\n    errors,\r\n    isReadonly,\r\n    isDisabled,\r\n    isLoading,\r\n    isError,\r\n    isSuccess,\r\n  };\r\n}\r\n"],"mappings":"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"}

package/lib/composables/vue-router.js

@@ -0,0 +1,32 @@
+import { computed, resolveDynamicComponent, toRef } from 'vue';
+import { hasEventProp, propsFactory } from "../util/component/index.js";
+export const pressVueRouterPropsOptions = propsFactory({
+  href: String,
+  replace: Boolean,
+  to: [String, Object],
+  exact: Boolean
+}, 'VueRouter');
+export function useLink(props, attrs) {
+  const RouterLink = resolveDynamicComponent('RouterLink');
+  const isLink = computed(() => !!(props.href || props.to));
+  const isClickable = computed(() => {
+    return isLink?.value || hasEventProp(attrs, 'click') || hasEventProp(props, 'click');
+  });
+  if (typeof RouterLink === 'string') {
+    return {
+      isLink,
+      isClickable,
+      href: toRef(props, 'href')
+    };
+  }
+  const link = props.to ? RouterLink.useLink(props) : undefined;
+  return {
+    isLink,
+    isClickable,
+    route: link?.route,
+    navigate: link?.navigate,
+    isActive: link && computed(() => props.exact ? link.isExactActive?.value : link.isActive?.value),
+    href: computed(() => props.to ? link?.route.value.href : props.href)
+  };
+}
+//# sourceMappingURL=vue-router.js.map

package/lib/composables/vue-router.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vue-router.js","names":["computed","resolveDynamicComponent","toRef","hasEventProp","propsFactory","pressVueRouterPropsOptions","href","String","replace","Boolean","to","Object","exact","useLink","props","attrs","RouterLink","isLink","isClickable","value","link","undefined","route","navigate","isActive","isExactActive"],"sources":["../../src/composables/vue-router.ts"],"sourcesContent":["import type { ComputedRef, PropType, Ref, SetupContext } from 'vue';\r\nimport { computed, resolveDynamicComponent, toRef } from 'vue';\r\nimport type {\r\n  RouteLocationRaw,\r\n  UseLinkOptions,\r\n  RouterLink as VueRouterLink,\r\n} from 'vue-router';\r\nimport { useLink as _useLink } from 'vue-router';\r\n\r\nimport { type EventProp, hasEventProp, propsFactory } from '@/util/component';\r\n\r\nexport interface LinkProps {\r\n  href: string | undefined;\r\n  replace: boolean | undefined;\r\n  to: RouteLocationRaw | undefined;\r\n  exact: boolean | undefined;\r\n}\r\n\r\nexport interface LinkListeners {\r\n  onClick?: EventProp | undefined;\r\n  onClickOnce?: EventProp | undefined;\r\n}\r\n\r\nexport const pressVueRouterPropsOptions = propsFactory(\r\n  {\r\n    href: String,\r\n    replace: Boolean,\r\n    to: [String, Object] as PropType<RouteLocationRaw>,\r\n    exact: Boolean,\r\n  },\r\n  'VueRouter',\r\n);\r\n\r\nexport interface UseLink\r\n  extends Omit<Partial<ReturnType<typeof _useLink>>, 'href'> {\r\n  isLink: ComputedRef<boolean>;\r\n  isClickable: ComputedRef<boolean>;\r\n  href: Ref<string | undefined>;\r\n}\r\n\r\nexport function useLink(\r\n  props: LinkProps & LinkListeners,\r\n  attrs: SetupContext['attrs'],\r\n): UseLink {\r\n  const RouterLink = resolveDynamicComponent('RouterLink') as\r\n    | typeof VueRouterLink\r\n    | string;\r\n\r\n  const isLink = computed(() => !!(props.href || props.to));\r\n  const isClickable = computed(() => {\r\n    return (\r\n      isLink?.value ||\r\n      hasEventProp(attrs, 'click') ||\r\n      hasEventProp(props, 'click')\r\n    );\r\n  });\r\n  if (typeof RouterLink === 'string') {\r\n    return {\r\n      isLink,\r\n      isClickable,\r\n      href: toRef(props, 'href'),\r\n    };\r\n  }\r\n  const link = props.to\r\n    ? RouterLink.useLink(props as UseLinkOptions)\r\n    : undefined;\r\n  return {\r\n    isLink,\r\n    isClickable,\r\n    route: link?.route,\r\n    navigate: link?.navigate,\r\n    isActive:\r\n      link &&\r\n      computed(() =>\r\n        props.exact ? link.isExactActive?.value : link.isActive?.value,\r\n      ),\r\n    href: computed(() => (props.to ? link?.route.value.href : props.href)),\r\n  };\r\n}\r\n"],"mappings":"AACA,SAASA,QAAQ,EAAEC,uBAAuB,EAAEC,KAAK,QAAQ,KAAK;AAAC,SAQtCC,YAAY,EAAEC,YAAY;AAcnD,OAAO,MAAMC,0BAA0B,GAAGD,YAAY,CACpD;EACEE,IAAI,EAAEC,MAAM;EACZC,OAAO,EAAEC,OAAO;EAChBC,EAAE,EAAE,CAACH,MAAM,EAAEI,MAAM,CAA+B;EAClDC,KAAK,EAAEH;AACT,CAAC,EACD,WACF,CAAC;AASD,OAAO,SAASI,OAAOA,CACrBC,KAAgC,EAChCC,KAA4B,EACnB;EACT,MAAMC,UAAU,GAAGf,uBAAuB,CAAC,YAAY,CAE7C;EAEV,MAAMgB,MAAM,GAAGjB,QAAQ,CAAC,MAAM,CAAC,EAAEc,KAAK,CAACR,IAAI,IAAIQ,KAAK,CAACJ,EAAE,CAAC,CAAC;EACzD,MAAMQ,WAAW,GAAGlB,QAAQ,CAAC,MAAM;IACjC,OACEiB,MAAM,EAAEE,KAAK,IACbhB,YAAY,CAACY,KAAK,EAAE,OAAO,CAAC,IAC5BZ,YAAY,CAACW,KAAK,EAAE,OAAO,CAAC;EAEhC,CAAC,CAAC;EACF,IAAI,OAAOE,UAAU,KAAK,QAAQ,EAAE;IAClC,OAAO;MACLC,MAAM;MACNC,WAAW;MACXZ,IAAI,EAAEJ,KAAK,CAACY,KAAK,EAAE,MAAM;IAC3B,CAAC;EACH;EACA,MAAMM,IAAI,GAAGN,KAAK,CAACJ,EAAE,GACjBM,UAAU,CAACH,OAAO,CAACC,KAAuB,CAAC,GAC3CO,SAAS;EACb,OAAO;IACLJ,MAAM;IACNC,WAAW;IACXI,KAAK,EAAEF,IAAI,EAAEE,KAAK;IAClBC,QAAQ,EAAEH,IAAI,EAAEG,QAAQ;IACxBC,QAAQ,EACNJ,IAAI,IACJpB,QAAQ,CAAC,MACPc,KAAK,CAACF,KAAK,GAAGQ,IAAI,CAACK,aAAa,EAAEN,KAAK,GAAGC,IAAI,CAACI,QAAQ,EAAEL,KAC3D,CAAC;IACHb,IAAI,EAAEN,QAAQ,CAAC,MAAOc,KAAK,CAACJ,EAAE,GAAGU,IAAI,EAAEE,KAAK,CAACH,KAAK,CAACb,IAAI,GAAGQ,KAAK,CAACR,IAAK;EACvE,CAAC;AACH"}

package/lib/directives/complement-click/index.js

@@ -0,0 +1,78 @@
+import { documentRoot } from "../../util/dom.js";
+function defaultDetermine() {
+  return true;
+}
+function directive(mouseEvent, element, binding) {
+  const {
+    value
+  } = binding;
+  const handler = typeof value === 'function' ? value : value.handler;
+  element._complementClick.lastMousedownWasOutside && checkEvent(mouseEvent, element, binding) && setTimeout(() => {
+    determine(mouseEvent, binding) && handler && handler(mouseEvent);
+  }, 0);
+}
+function checkEvent(mouseEvent, element, binding) {
+  if (!mouseEvent || determine(mouseEvent, binding) === false) {
+    return false;
+  }
+  const root = documentRoot(element);
+  if (typeof ShadowRoot !== 'undefined' && root instanceof ShadowRoot && root.host === mouseEvent.target) {
+    return false;
+  }
+  const elements = (typeof binding.value === 'object' && binding.value.include || (() => []))();
+  elements.push(element);
+  return !elements.some(el => el?.contains(mouseEvent.target));
+}
+function determine(event, binding) {
+  const {
+    value
+  } = binding;
+  const determineFn = typeof value === 'object' && value.determine || defaultDetermine;
+  return determineFn && determineFn?.(event);
+}
+function implant(element, callback) {
+  const root = documentRoot(element);
+  callback(document);
+  if (typeof ShadowRoot !== 'undefined' && root instanceof ShadowRoot) {
+    callback(root);
+  }
+}
+export const ComplementClick = {
+  mounted(element, binding) {
+    const onClick = event => directive(event, element, binding);
+    const onMousedown = event => {
+      element._complementClick.lastMousedownWasOutside = checkEvent(event, element, binding);
+    };
+    implant(element, app => {
+      app?.addEventListener('click', onClick, true);
+      app?.addEventListener('mousedown', onMousedown, true);
+    });
+    if (!element._complementClick) {
+      element._complementClick = {
+        lastMousedownWasOutside: true
+      };
+    }
+    const _uid = binding.instance.$.uid;
+    element._complementClick[_uid] = {
+      onClick,
+      onMousedown
+    };
+  },
+  unmounted(element, binding) {
+    if (!element._complementClick) return;
+    const _uid = binding.instance.$.uid;
+    implant(element, app => {
+      const old = element._complementClick?.[_uid];
+      if (old) {
+        const {
+          onClick,
+          onMousedown
+        } = old;
+        app?.removeEventListener('click', onClick, true);
+        app?.removeEventListener('mousedown', onMousedown, true);
+      }
+    });
+    delete element._complementClick[_uid];
+  }
+};
+//# sourceMappingURL=index.js.map