@dao-style/core 1.5.0 → 1.5.1-beta.10

package/dist/styles/color/alias.js

@@ -0,0 +1,61 @@
+/* DON'T MODIFY THIS FILE! */
+module.exports = {
+  'dao-text-page-title': 'rgba(var(--dao-text-page-title-rgb), <alpha-value>)',
+  'dao-text-primary': 'rgba(var(--dao-text-primary-rgb), <alpha-value>)',
+  'dao-text-secondary': 'rgba(var(--dao-text-secondary-rgb), <alpha-value>)',
+  'dao-text-tertiary': 'rgba(var(--dao-text-tertiary-rgb), <alpha-value>)',
+  'dao-text-disabled': 'rgba(var(--dao-text-disabled-rgb), <alpha-value>)',
+  'dao-text-black-primary': 'rgba(var(--dao-text-black-primary-rgb), <alpha-value>)',
+  'dao-text-black-secondary': 'rgba(var(--dao-text-black-secondary-rgb), <alpha-value>)',
+  'dao-text-black-tertiary': 'rgba(var(--dao-text-black-tertiary-rgb), <alpha-value>)',
+  'dao-text-black-disabled': 'rgba(var(--dao-text-black-disabled-rgb), <alpha-value>)',
+  'dao-icon': 'rgba(var(--dao-icon-rgb), <alpha-value>)',
+  'dao-icon-hover': 'rgba(var(--dao-icon-hover-rgb), <alpha-value>)',
+  'dao-icon-disabled': 'rgba(var(--dao-icon-disabled-rgb), <alpha-value>)',
+  'dao-icon-primary': 'rgba(var(--dao-icon-primary-rgb), <alpha-value>)',
+  'dao-icon-primary-hover': 'rgba(var(--dao-icon-primary-hover-rgb), <alpha-value>)',
+  'dao-icon-primary-active': 'rgba(var(--dao-icon-primary-active-rgb), <alpha-value>)',
+  'dao-icon-primary-disabled': 'rgba(var(--dao-icon-primary-disabled-rgb), <alpha-value>)',
+  'dao-icon-primary-focus': 'rgba(var(--dao-icon-primary-focus-rgb), <alpha-value>)',
+  'dao-bg': 'rgba(var(--dao-bg-rgb), <alpha-value>)',
+  'dao-bg-secondary': 'rgba(var(--dao-bg-secondary-rgb), <alpha-value>)',
+  'dao-bg-tertiary': 'rgba(var(--dao-bg-tertiary-rgb), <alpha-value>)',
+  'dao-bg-component': 'rgba(var(--dao-bg-component-rgb), <alpha-value>)',
+  'dao-bg-component-selected': 'rgba(var(--dao-bg-component-selected-rgb), <alpha-value>)',
+  'dao-line-divider': 'rgba(var(--dao-line-divider-rgb), <alpha-value>)',
+  'dao-status-success': 'rgba(var(--dao-status-success-rgb), <alpha-value>)',
+  'dao-status-warning': 'rgba(var(--dao-status-warning-rgb), <alpha-value>)',
+  'dao-status-error': 'rgba(var(--dao-status-error-rgb), <alpha-value>)',
+  'dao-status-info': 'rgba(var(--dao-status-info-rgb), <alpha-value>)',
+  'dao-running-status-health': 'rgba(var(--dao-running-status-health-rgb), <alpha-value>)',
+  'dao-running-status-warning': 'rgba(var(--dao-running-status-warning-rgb), <alpha-value>)',
+  'dao-running-status-error': 'rgba(var(--dao-running-status-error-rgb), <alpha-value>)',
+  'dao-running-status-info': 'rgba(var(--dao-running-status-info-rgb), <alpha-value>)',
+  'dao-tag-health': 'rgba(var(--dao-tag-health-rgb), <alpha-value>)',
+  'dao-tag-warning': 'rgba(var(--dao-tag-warning-rgb), <alpha-value>)',
+  'dao-tag-error': 'rgba(var(--dao-tag-error-rgb), <alpha-value>)',
+  'dao-tag-info': 'rgba(var(--dao-tag-info-rgb), <alpha-value>)',
+  'dao-tag-bg-health': 'rgba(var(--dao-tag-bg-health-rgb), <alpha-value>)',
+  'dao-tag-bg-warning': 'rgba(var(--dao-tag-bg-warning-rgb), <alpha-value>)',
+  'dao-tag-bg-error': 'rgba(var(--dao-tag-bg-error-rgb), <alpha-value>)',
+  'dao-tag-bg-info': 'rgba(var(--dao-tag-bg-info-rgb), <alpha-value>)',
+  'dao-system-primary': 'rgba(var(--dao-system-primary-rgb), <alpha-value>)',
+  'dao-system-secondary': 'rgba(var(--dao-system-secondary-rgb), <alpha-value>)',
+  'dao-top-gray-010': 'rgba(var(--dao-top-gray-010-rgb), <alpha-value>)',
+  'dao-top-gray-020': 'rgba(var(--dao-top-gray-020-rgb), <alpha-value>)',
+  'dao-tag-blue-010': 'rgba(var(--dao-tag-blue-010-rgb), <alpha-value>)',
+  'dao-tag-blue-020': 'rgba(var(--dao-tag-blue-020-rgb), <alpha-value>)',
+  'dao-tag-green-010': 'rgba(var(--dao-tag-green-010-rgb), <alpha-value>)',
+  'dao-tag-green-020': 'rgba(var(--dao-tag-green-020-rgb), <alpha-value>)',
+  'dao-tag-green-030': 'rgba(var(--dao-tag-green-030-rgb), <alpha-value>)',
+  'dao-tag-yellow-010': 'rgba(var(--dao-tag-yellow-010-rgb), <alpha-value>)',
+  'dao-tag-yellow-020': 'rgba(var(--dao-tag-yellow-020-rgb), <alpha-value>)',
+  'dao-tag-orange-010': 'rgba(var(--dao-tag-orange-010-rgb), <alpha-value>)',
+  'dao-tag-orange-020': 'rgba(var(--dao-tag-orange-020-rgb), <alpha-value>)',
+  'dao-tag-purple-010': 'rgba(var(--dao-tag-purple-010-rgb), <alpha-value>)',
+  'dao-tag-purple-020': 'rgba(var(--dao-tag-purple-020-rgb), <alpha-value>)',
+  'dao-line-gray-010': 'rgba(var(--dao-line-gray-010-rgb), <alpha-value>)',
+  'dao-line-gray-020': 'rgba(var(--dao-line-gray-020-rgb), <alpha-value>)',
+  'dao-line-gray-030': 'rgba(var(--dao-line-gray-030-rgb), <alpha-value>)',
+  'dao-line-gray-040': 'rgba(var(--dao-line-gray-040-rgb), <alpha-value>)',
+};

package/dist/styles/color/preset.js

@@ -0,0 +1,15 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
+/* eslint-disable import/extensions */
+const aliasThemeColor = require('./alias.js');
+const varThemeColor = require('./var.js');
+
+module.exports = {
+  theme: {
+    extend: {
+      colors: {
+        ...aliasThemeColor,
+        ...varThemeColor,
+      },
+    },
+  },
+};

package/dist/styles/color/var.js

@@ -0,0 +1,118 @@
+/* DON'T MODIFY THIS FILE! */
+module.exports = {
+  'dao-primary-blue-010': 'rgba(var(--dao-primary-blue-010-rgb), <alpha-value>)',
+  'dao-primary-blue-020': 'rgba(var(--dao-primary-blue-020-rgb), <alpha-value>)',
+  'dao-primary-blue-030': 'rgba(var(--dao-primary-blue-030-rgb), <alpha-value>)',
+  'dao-primary-blue-040': 'rgba(var(--dao-primary-blue-040-rgb), <alpha-value>)',
+  'dao-primary-blue-050': 'rgba(var(--dao-primary-blue-050-rgb), <alpha-value>)',
+  'dao-primary-blue-060': 'rgba(var(--dao-primary-blue-060-rgb), <alpha-value>)',
+  'dao-primary-blue-070': 'rgba(var(--dao-primary-blue-070-rgb), <alpha-value>)',
+  'dao-primary-blue-080': 'rgba(var(--dao-primary-blue-080-rgb), <alpha-value>)',
+  'dao-primary-blue-090': 'rgba(var(--dao-primary-blue-090-rgb), <alpha-value>)',
+  'dao-orange-010': 'rgba(var(--dao-orange-010-rgb), <alpha-value>)',
+  'dao-orange-020': 'rgba(var(--dao-orange-020-rgb), <alpha-value>)',
+  'dao-orange-030': 'rgba(var(--dao-orange-030-rgb), <alpha-value>)',
+  'dao-orange-040': 'rgba(var(--dao-orange-040-rgb), <alpha-value>)',
+  'dao-orange-050': 'rgba(var(--dao-orange-050-rgb), <alpha-value>)',
+  'dao-orange-060': 'rgba(var(--dao-orange-060-rgb), <alpha-value>)',
+  'dao-orange-070': 'rgba(var(--dao-orange-070-rgb), <alpha-value>)',
+  'dao-orange-080': 'rgba(var(--dao-orange-080-rgb), <alpha-value>)',
+  'dao-yellow-010': 'rgba(var(--dao-yellow-010-rgb), <alpha-value>)',
+  'dao-yellow-020': 'rgba(var(--dao-yellow-020-rgb), <alpha-value>)',
+  'dao-yellow-030': 'rgba(var(--dao-yellow-030-rgb), <alpha-value>)',
+  'dao-yellow-040': 'rgba(var(--dao-yellow-040-rgb), <alpha-value>)',
+  'dao-yellow-050': 'rgba(var(--dao-yellow-050-rgb), <alpha-value>)',
+  'dao-yellow-060': 'rgba(var(--dao-yellow-060-rgb), <alpha-value>)',
+  'dao-yellow-070': 'rgba(var(--dao-yellow-070-rgb), <alpha-value>)',
+  'dao-yellow-075': 'rgba(var(--dao-yellow-075-rgb), <alpha-value>)',
+  'dao-yellow-080': 'rgba(var(--dao-yellow-080-rgb), <alpha-value>)',
+  'dao-green-010': 'rgba(var(--dao-green-010-rgb), <alpha-value>)',
+  'dao-green-020': 'rgba(var(--dao-green-020-rgb), <alpha-value>)',
+  'dao-green-030': 'rgba(var(--dao-green-030-rgb), <alpha-value>)',
+  'dao-green-040': 'rgba(var(--dao-green-040-rgb), <alpha-value>)',
+  'dao-green-050': 'rgba(var(--dao-green-050-rgb), <alpha-value>)',
+  'dao-green-060': 'rgba(var(--dao-green-060-rgb), <alpha-value>)',
+  'dao-green-070': 'rgba(var(--dao-green-070-rgb), <alpha-value>)',
+  'dao-green-080': 'rgba(var(--dao-green-080-rgb), <alpha-value>)',
+  'dao-cyan-010': 'rgba(var(--dao-cyan-010-rgb), <alpha-value>)',
+  'dao-cyan-020': 'rgba(var(--dao-cyan-020-rgb), <alpha-value>)',
+  'dao-cyan-030': 'rgba(var(--dao-cyan-030-rgb), <alpha-value>)',
+  'dao-cyan-040': 'rgba(var(--dao-cyan-040-rgb), <alpha-value>)',
+  'dao-cyan-050': 'rgba(var(--dao-cyan-050-rgb), <alpha-value>)',
+  'dao-cyan-060': 'rgba(var(--dao-cyan-060-rgb), <alpha-value>)',
+  'dao-cyan-070': 'rgba(var(--dao-cyan-070-rgb), <alpha-value>)',
+  'dao-cyan-080': 'rgba(var(--dao-cyan-080-rgb), <alpha-value>)',
+  'dao-purple-010': 'rgba(var(--dao-purple-010-rgb), <alpha-value>)',
+  'dao-purple-020': 'rgba(var(--dao-purple-020-rgb), <alpha-value>)',
+  'dao-purple-030': 'rgba(var(--dao-purple-030-rgb), <alpha-value>)',
+  'dao-purple-040': 'rgba(var(--dao-purple-040-rgb), <alpha-value>)',
+  'dao-purple-050': 'rgba(var(--dao-purple-050-rgb), <alpha-value>)',
+  'dao-purple-060': 'rgba(var(--dao-purple-060-rgb), <alpha-value>)',
+  'dao-purple-070': 'rgba(var(--dao-purple-070-rgb), <alpha-value>)',
+  'dao-purple-080': 'rgba(var(--dao-purple-080-rgb), <alpha-value>)',
+  'dao-red-010': 'rgba(var(--dao-red-010-rgb), <alpha-value>)',
+  'dao-red-020': 'rgba(var(--dao-red-020-rgb), <alpha-value>)',
+  'dao-red-030': 'rgba(var(--dao-red-030-rgb), <alpha-value>)',
+  'dao-red-040': 'rgba(var(--dao-red-040-rgb), <alpha-value>)',
+  'dao-red-050': 'rgba(var(--dao-red-050-rgb), <alpha-value>)',
+  'dao-red-060': 'rgba(var(--dao-red-060-rgb), <alpha-value>)',
+  'dao-red-070': 'rgba(var(--dao-red-070-rgb), <alpha-value>)',
+  'dao-red-080': 'rgba(var(--dao-red-080-rgb), <alpha-value>)',
+  'dao-acidblue-100': 'rgba(var(--dao-acidblue-100-rgb), <alpha-value>)',
+  'dao-acidblue-010': 'rgba(var(--dao-acidblue-010-rgb), <alpha-value>)',
+  'dao-acidblue-020': 'rgba(var(--dao-acidblue-020-rgb), <alpha-value>)',
+  'dao-acidblue-030': 'rgba(var(--dao-acidblue-030-rgb), <alpha-value>)',
+  'dao-acidblue-040': 'rgba(var(--dao-acidblue-040-rgb), <alpha-value>)',
+  'dao-acidblue-050': 'rgba(var(--dao-acidblue-050-rgb), <alpha-value>)',
+  'dao-acidblue-060': 'rgba(var(--dao-acidblue-060-rgb), <alpha-value>)',
+  'dao-acidblue-070': 'rgba(var(--dao-acidblue-070-rgb), <alpha-value>)',
+  'dao-acidblue-080': 'rgba(var(--dao-acidblue-080-rgb), <alpha-value>)',
+  'dao-acidblue-084': 'rgba(var(--dao-acidblue-084-rgb), <alpha-value>)',
+  'dao-acidblue-086': 'rgba(var(--dao-acidblue-086-rgb), <alpha-value>)',
+  'dao-acidblue-088': 'rgba(var(--dao-acidblue-088-rgb), <alpha-value>)',
+  'dao-acidblue-090': 'rgba(var(--dao-acidblue-090-rgb), <alpha-value>)',
+  'dao-gray-blue-100': 'rgba(var(--dao-gray-blue-100-rgb), <alpha-value>)',
+  'dao-gray-blue-110': 'rgba(var(--dao-gray-blue-110-rgb), <alpha-value>)',
+  'dao-gray-blue-010': 'rgba(var(--dao-gray-blue-010-rgb), <alpha-value>)',
+  'dao-gray-blue-020': 'rgba(var(--dao-gray-blue-020-rgb), <alpha-value>)',
+  'dao-gray-blue-030': 'rgba(var(--dao-gray-blue-030-rgb), <alpha-value>)',
+  'dao-gray-blue-040': 'rgba(var(--dao-gray-blue-040-rgb), <alpha-value>)',
+  'dao-gray-blue-050': 'rgba(var(--dao-gray-blue-050-rgb), <alpha-value>)',
+  'dao-gray-blue-060': 'rgba(var(--dao-gray-blue-060-rgb), <alpha-value>)',
+  'dao-gray-blue-070': 'rgba(var(--dao-gray-blue-070-rgb), <alpha-value>)',
+  'dao-gray-blue-075': 'rgba(var(--dao-gray-blue-075-rgb), <alpha-value>)',
+  'dao-gray-blue-080': 'rgba(var(--dao-gray-blue-080-rgb), <alpha-value>)',
+  'dao-gray-blue-090': 'rgba(var(--dao-gray-blue-090-rgb), <alpha-value>)',
+  'dao-gray-100': 'rgba(var(--dao-gray-100-rgb), <alpha-value>)',
+  'dao-gray-110': 'rgba(var(--dao-gray-110-rgb), <alpha-value>)',
+  'dao-gray-120': 'rgba(var(--dao-gray-120-rgb), <alpha-value>)',
+  'dao-gray-130': 'rgba(var(--dao-gray-130-rgb), <alpha-value>)',
+  'dao-gray-140': 'rgba(var(--dao-gray-140-rgb), <alpha-value>)',
+  'dao-gray-150': 'rgba(var(--dao-gray-150-rgb), <alpha-value>)',
+  'dao-gray-160': 'rgba(var(--dao-gray-160-rgb), <alpha-value>)',
+  'dao-gray-170': 'rgba(var(--dao-gray-170-rgb), <alpha-value>)',
+  'dao-gray-180': 'rgba(var(--dao-gray-180-rgb), <alpha-value>)',
+  'dao-gray-190': 'rgba(var(--dao-gray-190-rgb), <alpha-value>)',
+  'dao-gray-200': 'rgba(var(--dao-gray-200-rgb), <alpha-value>)',
+  'dao-gray-010': 'rgba(var(--dao-gray-010-rgb), <alpha-value>)',
+  'dao-gray-020': 'rgba(var(--dao-gray-020-rgb), <alpha-value>)',
+  'dao-gray-030': 'rgba(var(--dao-gray-030-rgb), <alpha-value>)',
+  'dao-gray-040': 'rgba(var(--dao-gray-040-rgb), <alpha-value>)',
+  'dao-gray-050': 'rgba(var(--dao-gray-050-rgb), <alpha-value>)',
+  'dao-gray-060': 'rgba(var(--dao-gray-060-rgb), <alpha-value>)',
+  'dao-gray-070': 'rgba(var(--dao-gray-070-rgb), <alpha-value>)',
+  'dao-gray-080': 'rgba(var(--dao-gray-080-rgb), <alpha-value>)',
+  'dao-gray-090': 'rgba(var(--dao-gray-090-rgb), <alpha-value>)',
+  'dao-navigation-100': 'rgba(var(--dao-navigation-100-rgb), <alpha-value>)',
+  'dao-navigation-010': 'rgba(var(--dao-navigation-010-rgb), <alpha-value>)',
+  'dao-navigation-020': 'rgba(var(--dao-navigation-020-rgb), <alpha-value>)',
+  'dao-navigation-030': 'rgba(var(--dao-navigation-030-rgb), <alpha-value>)',
+  'dao-navigation-040': 'rgba(var(--dao-navigation-040-rgb), <alpha-value>)',
+  'dao-navigation-050': 'rgba(var(--dao-navigation-050-rgb), <alpha-value>)',
+  'dao-navigation-060': 'rgba(var(--dao-navigation-060-rgb), <alpha-value>)',
+  'dao-navigation-070': 'rgba(var(--dao-navigation-070-rgb), <alpha-value>)',
+  'dao-navigation-080': 'rgba(var(--dao-navigation-080-rgb), <alpha-value>)',
+  'dao-navigation-090': 'rgba(var(--dao-navigation-090-rgb), <alpha-value>)',
+  'dao-pure-white': 'rgba(var(--dao-pure-white-rgb), <alpha-value>)',
+  'dao-pure-black': 'rgba(var(--dao-pure-black-rgb), <alpha-value>)',
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dao-style/core",
-  "version": "1.5.0",
+  "version": "1.5.1-beta.10",
   "scripts": {
     "commit": "git-cz",
     "dev": "npm run dev:docs",

package/scripts/transform-variable.mjs

@@ -130,6 +130,36 @@ export function renderSCSSAndCSSVariable(data) {
   };
 }
 
+export const renderThemeColor = (data) => {
+  const values = Object.values(data.content);
+
+  const declareContent = '/* DON\'T MODIFY THIS FILE! */\n';
+
+  const themeColorContentList = values.map((content) => {
+    let str = `  'dao-${content.name}': `;
+    str += `'rgba(var(--dao-${content.name}-rgb), <alpha-value>)',`;
+
+    return str;
+  });
+
+  const themeColor = [
+    ...themeColorContentList,
+  ].join('\n');
+
+  const exportContent = [
+    'module.exports = {',
+    `${themeColor}`,
+    '};',
+    '',
+  ].join('\n');
+
+  return {
+    filename: `${data.meta.name}.js`,
+    content: declareContent + exportContent,
+    origin: data,
+  };
+};
+
 export const transformVariable = () => ({
   name: 'generate-css-variable',
   load(id) {
@@ -155,6 +185,12 @@ export const transformVariable = () => ({
       const parsedFileName = id.replace(`${filename}.json`, `${filename}.scss`);
 
       writeFileSync(parsedFileName, dataPreparedToWrite.content);
+
+      const colorTheme = renderThemeColor(parseSpec);
+
+      const parsedThemeFileName = id.replace(`${filename}.json`, `${filename}.js`);
+
+      writeFileSync(parsedThemeFileName, colorTheme.content);
     }
   },
 });

package/volar.d.ts

@@ -55,6 +55,8 @@ declare module 'vue' {
     DaoTooltip: typeof import('@dao-style/core')['DaoTooltip']
     DaoTransfer: typeof import('@dao-style/core')['DaoTransfer']
     DaoTransferPanel: typeof import('@dao-style/core')['DaoTransferPanel']
+    vDaoTooltip: typeof import('@dao-style/core')['vDaoTooltip']
+    DaoPopperContentWrapper: typeof import('@dao-style/core')['DaoPopperContentWrapper']
   }
 }
 export {};