You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

1 line
6.9 KiB

{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-namespace/index.ts"],"sourcesContent":["import { computed, getCurrentInstance, inject, ref, unref } from 'vue'\n\nimport type { InjectionKey, Ref } from 'vue'\n\nexport const defaultNamespace = 'el'\nconst statePrefix = 'is-'\n\nconst _bem = (\n namespace: string,\n block: string,\n blockSuffix: string,\n element: string,\n modifier: string\n) => {\n let cls = `${namespace}-${block}`\n if (blockSuffix) {\n cls += `-${blockSuffix}`\n }\n if (element) {\n cls += `__${element}`\n }\n if (modifier) {\n cls += `--${modifier}`\n }\n return cls\n}\n\nexport const namespaceContextKey: InjectionKey<Ref<string | undefined>> =\n Symbol('namespaceContextKey')\n\nexport const useGetDerivedNamespace = (\n namespaceOverrides?: Ref<string | undefined>\n) => {\n const derivedNamespace =\n namespaceOverrides ||\n (getCurrentInstance()\n ? inject(namespaceContextKey, ref(defaultNamespace))\n : ref(defaultNamespace))\n const namespace = computed(() => {\n return unref(derivedNamespace) || defaultNamespace\n })\n return namespace\n}\n\nexport const useNamespace = (\n block: string,\n namespaceOverrides?: Ref<string | undefined>\n) => {\n const namespace = useGetDerivedNamespace(namespaceOverrides)\n const b = (blockSuffix = '') =>\n _bem(namespace.value, block, blockSuffix, '', '')\n const e = (element?: string) =>\n element ? _bem(namespace.value, block, '', element, '') : ''\n const m = (modifier?: string) =>\n modifier ? _bem(namespace.value, block, '', '', modifier) : ''\n const be = (blockSuffix?: string, element?: string) =>\n blockSuffix && element\n ? _bem(namespace.value, block, blockSuffix, element, '')\n : ''\n const em = (element?: string, modifier?: string) =>\n element && modifier\n ? _bem(namespace.value, block, '', element, modifier)\n : ''\n const bm = (blockSuffix?: string, modifier?: string) =>\n blockSuffix && modifier\n ? _bem(namespace.value, block, blockSuffix, '', modifier)\n : ''\n const bem = (blockSuffix?: string, element?: string, modifier?: string) =>\n blockSuffix && element && modifier\n ? _bem(namespace.value, block, blockSuffix, element, modifier)\n : ''\n const is: {\n (name: string, state: boolean | undefined): string\n (name: string): string\n } = (name: string, ...args: [boolean | undefined] | []) => {\n const state = args.length >= 1 ? args[0]! : true\n return name && state ? `${statePrefix}${name}` : ''\n }\n\n // for css var\n // --el-xxx: value;\n const cssVar = (object: Record<string, string>) => {\n const styles: Record<string, string> = {}\n for (const key in object) {\n if (object[key]) {\n styles[`--${namespace.value}-${key}`] = object[key]\n }\n }\n return styles\n }\n // with block\n const cssVarBlock = (object: Record<string, string>) => {\n const styles: Record<string, string> = {}\n for (const key in object) {\n if (object[key]) {\n styles[`--${namespace.value}-${block}-${key}`] = object[key]\n }\n }\n return styles\n }\n\n const cssVarName = (name: string) => `--${namespace.value}-${name}`\n const cssVarBlockName = (name: string) =>\n `--${namespace.value}-${block}-${name}`\n\n return {\n namespace,\n b,\n e,\n m,\n be,\n em,\n bm,\n bem,\n is,\n // css\n cssVar,\n cssVarName,\n cssVarBlock,\n cssVarBlockName,\n }\n}\n\nexport type UseNamespaceReturn = ReturnType<typeof useNamespace>\n"],"names":[],"mappings":";;AACY,MAAC,gBAAgB,GAAG,KAAK;AACrC,MAAM,WAAW,GAAG,KAAK,CAAC;AAC1B,MAAM,IAAI,GAAG,CAAC,SAAS,EAAE,KAAK,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,KAAK;AACnE,EAAE,IAAI,GAAG,GAAG,CAAC,EAAE,SAAS,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC;AACpC,EAAE,IAAI,WAAW,EAAE;AACnB,IAAI,GAAG,IAAI,CAAC,CAAC,EAAE,WAAW,CAAC,CAAC,CAAC;AAC7B,GAAG;AACH,EAAE,IAAI,OAAO,EAAE;AACf,IAAI,GAAG,IAAI,CAAC,EAAE,EAAE,OAAO,CAAC,CAAC,CAAC;AAC1B,GAAG;AACH,EAAE,IAAI,QAAQ,EAAE;AAChB,IAAI,GAAG,IAAI,CAAC,EAAE,EAAE,QAAQ,CAAC,CA