chore: update utils paths

README.md

@@ -13,7 +13,7 @@
 ## Features
 ### Caring About Styles
 As is.
-> The reason I started to build the library is I'm not satisfied with the UI framework I used. I think maybe it's possible to caring about nearily all the details of an UI framework, except the compatibility of IE.
+> The reason I started to build the library is I'm not satisfied with the UI framework I used. I think maybe it's possible to caring about nearily all the details of an UI framework, except the compitability of IE.
 ### Themed
 Dark theme included. Theme switching is seamlessly.
 > At first there's only dark mode UI design drafts. It's wired but true. After you starting to build a dark mode UI, sooner or later you will have to create a light theme for it. As a result, naive-ui has both of them.

src/_base/select-menu/src/styles/themed-size.js

@@ -1,6 +1,5 @@
 import { cTB, c, cB, cM, createKey } from '../../../../_utils/cssr'
-import depx from '../../../../_utils/css/depx'
-import pxfy from '../../../../_utils/css/pxfy'
+import { depx, pxfy } from '../../../../_utils/css'
 
 export default c([
   ({ props }) => {

src/_utils/cssr/index.js

@@ -22,7 +22,7 @@ function insideFormItem (status, style) {
   if (status === null) return style
   return c(`${prefix}form-item`, [
     c(`${prefix}form-item-blank`, [
-      c(({ props }) => `&${prefix}form-item-blank${modifierPrefix}${status}`, [
+      c(() => `&${prefix}form-item-blank${modifierPrefix}${status}`, [
         style
       ])
     ])

src/_utils/delegate/mutationObserverDelegate.js

@@ -1,55 +0,0 @@
-class MutationObserverDelegate {
-  constructor () {
-    if (__DEV__) {
-      console.debug('[MutationObserverDelegate]: Ctor called')
-    }
-    this.handlers = new Map()
-    this.observers = new Map()
-    this.handleMutation = this.handleMutation.bind(this)
-  }
-
-  handleMutation (mutationList) {
-    for (const mutationRecord of mutationList) {
-      const handlers = this.handlers.get(mutationRecord.target)
-      if (handlers) {
-        for (const handler of handlers) {
-          handler()
-        }
-      }
-    }
-  }
-
-  unregisterHandler (el, handler) {
-    const handlers = this.handlers.get(el)
-    if (handlers) {
-      const handlerIndex = handlers.findIndex(h => handler === h)
-      if (~handlerIndex) {
-        handlers.splice(handlerIndex, 1)
-      }
-      if (!handler.length) {
-        this.handlers.delete(el)
-        const observer = this.observers.get(el)
-        if (observer) this.observer.disconnect()
-        this.observers.delete(el)
-      }
-    }
-  }
-
-  registerHandler (el, handler) {
-    if (this.handlers.get(el)) {
-      this.handlers.get(el).push(handler)
-    } else {
-      const observer = new MutationObserver(mutationList => {
-        this.handleMutation(mutationList)
-      })
-      this.observers.set(el, observer)
-      this.handlers.set(el, [handler])
-      observer.observe(el, {
-        attributes: true,
-        attributeFilter: ['class']
-      })
-    }
-  }
-}
-
-export default new MutationObserverDelegate()

src/_utils/index.js

@@ -16,7 +16,7 @@ export {
   depx,
   formatLength
 } from './css'
-export * from './composition'
+export * from './composable'
 export {
   nextFrame
 } from './misc'

src/anchor/src/BaseAnchor.vue

@@ -31,7 +31,7 @@ import {
   themeable,
   usecssr
 } from '../../_mixins'
-import { onFontReady } from '../../_utils/composition/index'
+import { onFontReady } from '../../_utils/composable/index'
 import { warn } from '../../_utils/naive/warn'
 import getTarget from '../../_utils/dom/get-target'
 import styles from './styles'

src/anchor/src/Link.vue

@@ -24,7 +24,7 @@ import {
   useInjectionRef,
   useInjectionCollection,
   useInjectionElementCollection
-} from '../../_utils/composition'
+} from '../../_utils/composable'
 
 export default {
   name: 'AnchorLink',

src/avatar/src/styles/themed-size.cssr.js

@@ -1,6 +1,5 @@
 import { c, cE, cM, cTB, cB } from '../../../_utils/cssr'
-import depx from '../../../_utils/css/depx'
-import pxfy from '../../../_utils/css/pxfy'
+import { depx, pxfy } from '../../../../_utils/css'
 
 export default c([
   ({ props }) => {

src/collapse/src/CollapseItem.vue

@@ -41,7 +41,7 @@ import { toRef } from 'vue'
 import NIcon from '../../icon'
 import { ChevronRightIcon as ArrowIcon } from '../../_base/icons'
 import NCollapseItemContent from './CollapseItemContent.js'
-import { useInjectionCollection } from '../../_utils/composition'
+import { useInjectionCollection } from '../../_utils/composable'
 
 export default {
   name: 'CollapseItem',

src/dropdown/src/DropdownOption.js

@@ -4,7 +4,7 @@ import { placeable } from '../../_mixins'
 import { ChevronRightIcon } from '../../_base/icons'
 import NIcon from '../../icon'
 import { useMemo } from 'vooks'
-import { useDelayedTrue } from '../../_utils/composition'
+import { useDelayedTrue } from '../../_utils/composable'
 import NDropdownMenu from './DropdownMenu'
 import { isSubmenuNode } from './utils'
 

src/form/src/styles/themed-size.cssr.js

@@ -1,6 +1,5 @@
 import { c, cB, cM, createKey } from '../../../_utils/cssr'
-import depx from '../../../_utils/css/depx'
-import pxfy from '../../../_utils/css/pxfy'
+import { depx, pxfy } from '../../../../_utils/css'
 
 export default c([
   ({ props }) => {

src/input/src/styles/themed-size.cssr.js

@@ -1,6 +1,5 @@
 import { cTB, c, cE, cM, cNotM, createKey } from '../../../_utils/cssr'
-import depx from '../../../_utils/css/depx'
-import pxfy from '../../../_utils/css/pxfy'
+import { depx, pxfy } from '../../../_utils/css'
 
 export default c([
   ({ props }) => {

src/menu/src/MenuItem.vue

@@ -34,7 +34,7 @@ import NMenuItemContent from './MenuItemContent.vue'
 import NTooltip from '../../tooltip'
 import menuChildMixin from './menu-child-mixin'
 import { useMemo } from 'vooks'
-import { useInjectionRef } from '../../_utils/composition'
+import { useInjectionRef } from '../../_utils/composable'
 
 export default {
   name: 'MenuItem',

src/menu/src/Submenu.js

@@ -5,7 +5,7 @@ import NMenuItemContent from './MenuItemContent.vue'
 import menuChildMixin from './menu-child-mixin'
 import { itemRenderer } from './utils'
 import { useMemo } from 'vooks'
-import { useInjectionRef } from '../../_utils/composition'
+import { useInjectionRef } from '../../_utils/composable'
 
 export default {
   name: 'Submenu',

src/popover/src/styles/themed-base.cssr.js

@@ -1,6 +1,5 @@
 import { c, cTB, cB, cM } from '../../../_utils/cssr'
-import depx from '../../../_utils/css/depx'
-import pxfy from '../../../_utils/css/pxfy'
+import { depx, pxfy } from '../../../../_utils/css'
 
 export default c([
   ({ props }) => {

src/progress/src/Progress.vue

@@ -251,7 +251,7 @@ import {
 } from '../../_mixins'
 import styles from './styles/index.js'
 import formatLength from '../../_utils/css/formatLength.js'
-import { onFontReady } from '../../_utils/composition'
+import { onFontReady } from '../../_utils/composable'
 
 function circlePath (r, sw, vw = 100) {
   return `m ${vw / 2} ${vw / 2 - r} a ${r} ${r} 0 1 1 0 ${2 * r} a ${r} ${r} 0 1 1 0 -${2 * r}`

src/slider/src/styles/themed-base.cssr.js

@@ -1,7 +1,6 @@
 import { cTB, c, cB, cM, cE } from '../../../_utils/cssr'
 import fadeInScaleUpTransition from '../../../_styles/transitions/fade-in-scale-up'
-import pxfy from '../../../_utils/css/pxfy'
-import depx from '../../../_utils/css/depx'
+import { depx, pxfy } from '../../../_utils/css'
 
 export default c([
   ({ props }) => {

src/steps/src/styles/steps/themed-base.cssr.js

@@ -1,6 +1,5 @@
 import { c, cTB, cB, cE, cM, createKey } from '../../../../_utils/cssr'
-import depx from '../../../../_utils/css/depx'
-import pxfy from '../../../../_utils/css/pxfy'
+import { depx, pxfy } from '../../../../_utils/css'
 import iconSwitchTransition from '../../../../_styles/transitions/icon-switch'
 
 export default c([

src/tabs/src/Tabs.vue

@@ -107,7 +107,7 @@ import { throttle } from 'lodash-es'
 import styles from './styles'
 import { warn } from '../../_utils/naive/warn'
 import { useCompitable } from 'vooks'
-import { onFontReady } from '../../_utils/composition'
+import { onFontReady } from '../../_utils/composable'
 
 export default {
   name: 'Tabs',

src/tag/src/styles/themed-size.cssr.js

@@ -1,6 +1,5 @@
 import { c, cE, cM, cTB } from '../../../_utils/cssr'
-import depx from '../../../_utils/css/depx'
-import pxfy from '../../../_utils/css/pxfy'
+import { depx, pxfy } from '../../../_utils/css'
 
 export default c([
   ({ props }) => {

src/transfer/src/styles/themed-size.cssr.js

@@ -1,7 +1,5 @@
 import { c, cTB, cB, cM, createKey } from '../../../_utils/cssr'
-import depx from '../../../_utils/css/depx'
-import pxfy from '../../../_utils/css/pxfy'
-
+import { depx, pxfy } from '../../../_utils/css'
 export default c([
   ({ props }) => {
     const size = props.$instance.mergedSize