@dao-style/core 0.0.1-beta.1 → 0.0.1-beta.10

package/dist/styles/color/alias.json

@@ -0,0 +1,67 @@
+{
+  "meta": {
+    "extend": "var"
+  },
+  "spec": {
+    "Text": {
+      "": {
+        "PageTitle": "$Navigation.060",
+        "Primary": "$Gray.010",
+        "Secondary": "$Gray.040",
+        "Tertiary": "$Gray.070",
+        "Disabled": "$Gray.120"
+      }, 
+      "Black": {
+        "Primary": "$Gray.110",
+        "Secondary": "$Gray.080",
+        "Helper": "$Gray.050",
+        "Disabled": "$Gray.020"
+      }
+    },
+    "Icon": {
+      "": {
+        "": "$GrayBlue.040",
+        "Hover": "$GrayBlue.030",
+        "Disabled": "$Gray.120"
+      },
+      "Primary": {
+        "": "$PrimaryBlue.040",
+        "Hover": "$PrimaryBlue.060",
+        "Active": "$PrimaryBlue.030",
+        "Disabled": "$GrayBlue.110",
+        "Focus": "$PrimaryBlue.060"
+      }
+    },
+    "Bg": {
+      "": {
+        "": "$GrayBlue.090",
+        "Secondary": "$GrayBlue.100",
+        "Tertiary": "$GrayBlue.110"
+      },
+      "Component": {
+        "": "$GrayBlue.070",
+        "Selected": "$Acidblue.040"
+      }
+    },
+    "Line":{
+      "Divider":"$GrayBlue.070"
+    },
+    "Status": {
+      "Success": "$Green.030",
+      "Warning": "$Yellow.040",
+      "Error": "$Red.050",
+      "Info": "$Acidblue.040"
+    },
+    "Running": {
+      "Status": {
+        "Health": "#6BAB6D",
+        "Warning": "$Yellow.040",
+        "Error": "#D26052"
+      }
+    },
+    "System": {
+      "Primary": "$PrimaryBlue.040",
+      "Secondary": "$Acidblue.040"
+    }
+  }
+}

package/dist/styles/color/alias.scss

@@ -0,0 +1,37 @@
+/* DON'T MODIFY THIS FILE! */
+/* Auto generated css and scss from ./src/styles/color/alias.json. */
+@import './var.scss';
+
+$dao-text-page-title: $dao-navigation-060;
+$dao-text-primary: $dao-gray-010;
+$dao-text-secondary: $dao-gray-040;
+$dao-text-tertiary: $dao-gray-070;
+$dao-text-disabled: $dao-gray-120;
+$dao-text-black-primary: $dao-gray-110;
+$dao-text-black-secondary: $dao-gray-080;
+$dao-text-black-helper: $dao-gray-050;
+$dao-text-black-disabled: $dao-gray-020;
+$dao-icon: $dao-gray-blue-040;
+$dao-icon-hover: $dao-gray-blue-030;
+$dao-icon-disabled: $dao-gray-120;
+$dao-icon-primary: $dao-primary-blue-040;
+$dao-icon-primary-hover: $dao-primary-blue-060;
+$dao-icon-primary-active: $dao-primary-blue-030;
+$dao-icon-primary-disabled: $dao-gray-blue-110;
+$dao-icon-primary-focus: $dao-primary-blue-060;
+$dao-bg: $dao-gray-blue-090;
+$dao-bg-secondary: $dao-gray-blue-100;
+$dao-bg-tertiary: $dao-gray-blue-110;
+$dao-bg-component: $dao-gray-blue-070;
+$dao-bg-component-selected: $dao-acidblue-040;
+$dao-line-divider: $dao-gray-blue-070;
+$dao-status-success: $dao-green-030;
+$dao-status-warning: $dao-yellow-040;
+$dao-status-error: $dao-red-050;
+$dao-status-info: $dao-acidblue-040;
+$dao-running-status-health: #6BAB6D;
+$dao-running-status-warning: $dao-yellow-040;
+$dao-running-status-error: #D26052;
+$dao-system-primary: $dao-primary-blue-040;
+$dao-system-secondary: $dao-acidblue-040;
+

package/dist/styles/color/var.json

@@ -0,0 +1,146 @@
+{
+  "meta": {},
+  "spec": {
+    "PrimaryBlue": {
+      "010": "#0E2B58",
+      "020": "#154184",
+      "030": "#1B56B1",
+      "040": "#226BDB",
+      "050": "#3E85E2",
+      "060": "#4E89E4",
+      "070": "#7BA7EA",
+      "080": "#A7C4F1",
+      "090": "#E9F0FC"
+    },
+    "Orange": {
+      "010": "#823108",
+      "020": "#B2430B",
+      "030": "#E2550E",
+      "040": "#F27131",
+      "050": "#F59260",
+      "060": "#F8B391",
+      "070": "#FBD4C1",
+      "080": "#FEF5F1"
+    },
+    "Yellow": {
+      "010": "#885D07",
+      "020": "#B87E0A",
+      "030": "#E99F0C",
+      "040": "#F4B434",
+      "050": "#F7C664",
+      "060": "#F9D894",
+      "070": "#FCEAC5",
+      "080": "#FEFBF5"
+    },
+    "Green": {
+      "010": "#1A753E",
+      "020": "#239F55",
+      "030": "#2CC76A",
+      "040": "#4FD886",
+      "050": "#79E2A3",
+      "060": "#A3EBC0",
+      "070": "#CDF4DC",
+      "080": "#F7FDF9"
+    },
+    "Cyan": {
+      "010": "#146E80",
+      "020": "#1B94AC",
+      "030": "#21BAD9",
+      "040": "#4ACAE3",
+      "050": "#76D7EA",
+      "060": "#A2E4F1",
+      "070": "#CEF1F8",
+      "080": "#F2FBFD"
+    },
+    "Purple": {
+      "010": "#1E1977",
+      "020": "#2922A0",
+      "030": "#3529CC",
+      "040": "#584FDC",
+      "050": "#7F78E3",
+      "060": "#A7A2EC",
+      "070": "#CECCF5",
+      "080": "#F7F7FD"
+    },
+    "Red": {
+      "010": "#5F0C0C",
+      "020": "#8C1212",
+      "030": "#B91818",
+      "040": "#E22222",
+      "050": "#E84F4F",
+      "060": "#EE7C7C",
+      "070": "#F4A9A9",
+      "080": "#FDEDED"
+    },
+    "Acidblue": {
+      "100": "#F4F9FC",
+      "010": "#0A4061",
+      "020": "#0F5F8F",
+      "030": "#137EBE",
+      "040": "#1E9CE8",
+      "050": "#43A1E5",
+      "060": "#4BB0ED",
+      "070": "#79C4F1",
+      "080": "#A7D8F6",
+      "090": "#ECF7FD"
+    },
+    "GrayBlue": {
+      "100": "#F7F8FA",
+      "110": "#F8FAFC",
+      "010": "#101114",
+      "020": "#3D444F",
+      "030": "#80868E",
+      "040": "#AAB0B8",
+      "050": "#CBCFD8",
+      "060": "#D6DBE6",
+      "070": "#E4E7ED",
+      "075": "#EAEDF3",
+      "080": "#EEF1F5",
+      "090": "#F1F3F6"
+    },
+    "Gray": {
+      "010": "#333333",
+      "020": "#4F4F4F",
+      "030": "#5c5c5c",
+      "040": "#666666",
+      "050": "#7F7F7F",
+      "060": "#888888",
+      "070": "#999999",
+      "080": "#A5A5A5",
+      "090": "#AFAFAF",
+      "100": "#BBBBBB",
+      "110": "#C7C7C7",
+      "120": "#CCCCCC",
+      "130": "#D2D2D2",
+      "140": "#DDDDDD",
+      "150": "#E2E2E2",
+      "160": "#EAEAEA",
+      "170": "#EEEEEE",
+      "180": "#F2F2F2",
+      "190": "#F9F9F9",
+      "200": "#FAFAFA"
+    },
+    "Navigation": {
+      "010": "#2C3037",
+      "020": "#3B3F4A",
+      "030": "#676B75",
+      "040": "#878C98",
+      "050": "#C5CAD8",
+      "060": "#203548",
+      "070": "#2975D2",
+      "080": "#B6C2D2",
+      "090": "#EAEEF5",
+      "100": "#F6F8FB"
+    },
+    "Pure": {
+      "White": "#FFFFFF",
+      "Black": "#000000"
+    },
+    "LineGray": {
+      "010": "#C7D0DE",
+      "020": "#C8CCD0",
+      "030": "#DADBDE",
+      "040": "#EBEDF0"
+    }
+  }
+}

package/dist/styles/color/var.scss

@@ -0,0 +1,119 @@
+/* DON'T MODIFY THIS FILE! */
+/* Auto generated css and scss from ./src/styles/color/var.json. */
+
+$dao-primary-blue-010: #0E2B58;
+$dao-primary-blue-020: #154184;
+$dao-primary-blue-030: #1B56B1;
+$dao-primary-blue-040: #226BDB;
+$dao-primary-blue-050: #3E85E2;
+$dao-primary-blue-060: #4E89E4;
+$dao-primary-blue-070: #7BA7EA;
+$dao-primary-blue-080: #A7C4F1;
+$dao-primary-blue-090: #E9F0FC;
+$dao-orange-010: #823108;
+$dao-orange-020: #B2430B;
+$dao-orange-030: #E2550E;
+$dao-orange-040: #F27131;
+$dao-orange-050: #F59260;
+$dao-orange-060: #F8B391;
+$dao-orange-070: #FBD4C1;
+$dao-orange-080: #FEF5F1;
+$dao-yellow-010: #885D07;
+$dao-yellow-020: #B87E0A;
+$dao-yellow-030: #E99F0C;
+$dao-yellow-040: #F4B434;
+$dao-yellow-050: #F7C664;
+$dao-yellow-060: #F9D894;
+$dao-yellow-070: #FCEAC5;
+$dao-yellow-080: #FEFBF5;
+$dao-green-010: #1A753E;
+$dao-green-020: #239F55;
+$dao-green-030: #2CC76A;
+$dao-green-040: #4FD886;
+$dao-green-050: #79E2A3;
+$dao-green-060: #A3EBC0;
+$dao-green-070: #CDF4DC;
+$dao-green-080: #F7FDF9;
+$dao-cyan-010: #146E80;
+$dao-cyan-020: #1B94AC;
+$dao-cyan-030: #21BAD9;
+$dao-cyan-040: #4ACAE3;
+$dao-cyan-050: #76D7EA;
+$dao-cyan-060: #A2E4F1;
+$dao-cyan-070: #CEF1F8;
+$dao-cyan-080: #F2FBFD;
+$dao-purple-010: #1E1977;
+$dao-purple-020: #2922A0;
+$dao-purple-030: #3529CC;
+$dao-purple-040: #584FDC;
+$dao-purple-050: #7F78E3;
+$dao-purple-060: #A7A2EC;
+$dao-purple-070: #CECCF5;
+$dao-purple-080: #F7F7FD;
+$dao-red-010: #5F0C0C;
+$dao-red-020: #8C1212;
+$dao-red-030: #B91818;
+$dao-red-040: #E22222;
+$dao-red-050: #E84F4F;
+$dao-red-060: #EE7C7C;
+$dao-red-070: #F4A9A9;
+$dao-red-080: #FDEDED;
+$dao-acidblue-100: #F4F9FC;
+$dao-acidblue-010: #0A4061;
+$dao-acidblue-020: #0F5F8F;
+$dao-acidblue-030: #137EBE;
+$dao-acidblue-040: #1E9CE8;
+$dao-acidblue-050: #43A1E5;
+$dao-acidblue-060: #4BB0ED;
+$dao-acidblue-070: #79C4F1;
+$dao-acidblue-080: #A7D8F6;
+$dao-acidblue-090: #ECF7FD;
+$dao-gray-blue-100: #F7F8FA;
+$dao-gray-blue-110: #F8FAFC;
+$dao-gray-blue-010: #101114;
+$dao-gray-blue-020: #3D444F;
+$dao-gray-blue-030: #80868E;
+$dao-gray-blue-040: #AAB0B8;
+$dao-gray-blue-050: #CBCFD8;
+$dao-gray-blue-060: #D6DBE6;
+$dao-gray-blue-070: #E4E7ED;
+$dao-gray-blue-075: #EAEDF3;
+$dao-gray-blue-080: #EEF1F5;
+$dao-gray-blue-090: #F1F3F6;
+$dao-gray-100: #BBBBBB;
+$dao-gray-110: #C7C7C7;
+$dao-gray-120: #CCCCCC;
+$dao-gray-130: #D2D2D2;
+$dao-gray-140: #DDDDDD;
+$dao-gray-150: #E2E2E2;
+$dao-gray-160: #EAEAEA;
+$dao-gray-170: #EEEEEE;
+$dao-gray-180: #F2F2F2;
+$dao-gray-190: #F9F9F9;
+$dao-gray-200: #FAFAFA;
+$dao-gray-010: #333333;
+$dao-gray-020: #4F4F4F;
+$dao-gray-030: #5c5c5c;
+$dao-gray-040: #666666;
+$dao-gray-050: #7F7F7F;
+$dao-gray-060: #888888;
+$dao-gray-070: #999999;
+$dao-gray-080: #A5A5A5;
+$dao-gray-090: #AFAFAF;
+$dao-navigation-100: #F6F8FB;
+$dao-navigation-010: #2C3037;
+$dao-navigation-020: #3B3F4A;
+$dao-navigation-030: #676B75;
+$dao-navigation-040: #878C98;
+$dao-navigation-050: #C5CAD8;
+$dao-navigation-060: #203548;
+$dao-navigation-070: #2975D2;
+$dao-navigation-080: #B6C2D2;
+$dao-navigation-090: #EAEEF5;
+$dao-pure-white: #FFFFFF;
+$dao-pure-black: #000000;
+$dao-line-gray-010: #C7D0DE;
+$dao-line-gray-020: #C8CCD0;
+$dao-line-gray-030: #DADBDE;
+$dao-line-gray-040: #EBEDF0;
+

package/dist/utils/assist.d.ts

@@ -0,0 +1,13 @@
+import type { ComponentInternalInstance as CII, VNode, VNodeChild } from 'vue';
+declare function findComponentUpward(context: CII, componentName: string): CII;
+declare const getFirstValidNode: (nodes: VNodeChild, maxDepth?: number) => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | undefined;
+declare const getFocusElementRange: (elementNode: HTMLElement | null) => {
+    lastTab: HTMLElement | null;
+    firstTab: HTMLElement | null;
+    focusedElementOrigin: Element | null;
+};
+declare const trapTabKey: (e: KeyboardEvent, firstTab: HTMLElement, lastTab: HTMLElement) => void;
+export { getFirstValidNode, getFocusElementRange, trapTabKey, };
+export default findComponentUpward;

package/dist/utils/constant.d.ts

@@ -0,0 +1,17 @@
+import type { Placement } from '@popperjs/core';
+import type { Ref, InjectionKey, ComputedRef } from 'vue';
+import type { AddTabFn, RemoveTabFn } from '../components/tabs/types';
+import type { NavProvide, NavSubProvide } from '../components/nav/types';
+import type { BreadcrumbProvide } from '../components/breadcrumb/breadcrumb-props';
+export declare const placements: Placement[];
+export declare const radioGroupKey: unique symbol;
+export declare const tabModelValueKey: InjectionKey<Ref<string>>;
+export declare const addTabFnKey: InjectionKey<AddTabFn>;
+export declare const removeTabFnKey: InjectionKey<RemoveTabFn>;
+export declare const checkboxGroupModelValueKey: InjectionKey<ComputedRef<unknown[] | Set<unknown>>>;
+export declare const checkboxUpdateGroupModelValueFnKey: InjectionKey<($event: unknown) => unknown>;
+export declare const checkboxGroupChangeFnKey: InjectionKey<(modelValue: unknown, event: Event) => void>;
+export declare const formLabelWidthKey: InjectionKey<string>;
+export declare const navRootKey: InjectionKey<NavProvide>;
+export declare const navSubKey: InjectionKey<NavSubProvide>;
+export declare const breadcrumbKey: InjectionKey<BreadcrumbProvide>;

package/dist/utils/copy-content.d.ts

@@ -0,0 +1,2 @@
+import clipboardCopy from 'clipboard-copy';
+export default clipboardCopy;

package/dist/utils/is-nullish.d.ts

@@ -0,0 +1 @@
+export default function isNullish(val: unknown): boolean;

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@dao-style/core",
-  "version": "0.0.1-beta.1",
+  "version": "0.0.1-beta.10",
   "scripts": {
     "dev": "vite",
-    "build": "vue-tsc --noEmit && vite build",
+    "build": "node scripts/transform-variable.mjs --build && npm run typecheck && vite build && vue-tsc -d --emitDeclarationOnly && npm run build:dts",
     "serve": "vite preview --port 5050",
     "test": "jest src",
     "test:watch": "jest src --watch",
@@ -15,9 +15,10 @@
     "style:lint": "stylelint \"src/**/*.{vue,css,scss}\" --config .stylelintrc.js --fix",
     "lint": "npm run style:lint & npm run docs:lint & npm run typecheck & npm run eslint",
     "docs:lint": "prettier \"**/*.md\" --write",
-    "docs:dev": "vitepress dev docs",
-    "docs:build": "vitepress build docs",
-    "docs:serve": "vitepress serve docs"
+    "docs:dev": "concurrently \"node scripts/transform-variable.mjs\" \"vitepress dev docs\"",
+    "docs:build": "node scripts/transform-variable.mjs --build && vitepress build docs",
+    "docs:serve": "vitepress serve docs",
+    "build:dts": "node scripts/gen-volar-dts.mjs"
   },
   "dependencies": {
     "@popperjs/core": "^2.10.2"
@@ -35,6 +36,9 @@
     "@vue/vue3-jest": "^27.0.0-alpha.1",
     "autoprefixer": "^10.3.7",
     "bumpp": "^7.1.1",
+    "chokidar": "^3.5.3",
+    "clipboard-copy": "^4.0.1",
+    "concurrently": "^7.0.0",
     "eslint": "^7.32.0",
     "eslint-config-airbnb-base": "^14.2.1",
     "eslint-config-prettier": "^8.3.0",
@@ -46,9 +50,12 @@
     "jest": "^27.2.5",
     "jest-environment-jsdom": "^27.2.5",
     "jest-junit": "^13.0.0",
+    "json5": "^2.2.0",
     "lint-staged": "^11.2.1",
+    "lodash.kebabcase": "^4.1.1",
     "postcss": "^8.3.9",
     "prettier": "^2.4.1",
+    "rollup-plugin-copy": "^3.4.0",
     "sass": "^1.42.1",
     "stylelint": "^13.13.1",
     "stylelint-config-recess-order": "^2.5.0",
@@ -60,35 +67,29 @@
     "tslib": "^2.3.1",
     "typescript": "~4.4.3",
     "vite": "^2.6.3",
-    "vite-plugin-svg-icons": "^1.0.5",
+    "vite-plugin-svg-icons": "^2.0.1",
     "vitepress": "^0.20.0",
     "vue": "^3.2.14",
     "vue-eslint-parser": "^7.11.0",
     "vue-jest": "^5.0.0-alpha.10",
     "vue-router": "^4.0.0-0",
-    "vue-tsc": "^0.3.0",
+    "vue-tsc": "^0.31.2",
     "yorkie": "^2.0.0"
   },
   "gitHooks": {
     "pre-commit": "lint-staged"
   },
-  "lint-staged": {
-    "**/*.md": "npm run docs:lint",
-    "**/*.{ts,tsx,vue}": [
-      "npm run typecheck",
-      "npm run eslint"
-    ],
-    "**/*.{vue,scss}": "npm run style:lint"
-  },
   "engines": {
     "node": ">=16.0.0",
     "npm": ">=7.0.0"
   },
   "files": [
-    "dist"
+    "dist",
+    "volar.d.ts"
   ],
   "main": "./dist/dao-style.umd.js",
   "module": "./dist/dao-style.es.js",
+  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
       "import": "./dist/dao-style.es.js",

package/volar.d.ts

@@ -0,0 +1,48 @@
+// Auto generated component declarations
+declare module 'vue' {
+  export interface GlobalComponents {
+    DaoActionIcon: typeof import('@dao-style/core')['ActionIcon']
+    DaoBreadcrumb: typeof import('@dao-style/core')['Breadcrumb']
+    DaoBreadcrumbItem: typeof import('@dao-style/core')['BreadcrumbItem']
+    DaoButton: typeof import('@dao-style/core')['Button']
+    DaoButtonGroup: typeof import('@dao-style/core')['ButtonGroup']
+    DaoCard: typeof import('@dao-style/core')['Card']
+    DaoCardItem: typeof import('@dao-style/core')['CardItem']
+    DaoCheckbox: typeof import('@dao-style/core')['Checkbox']
+    DaoCheckboxGroup: typeof import('@dao-style/core')['CheckboxGroup']
+    DaoDialog: typeof import('@dao-style/core')['Dialog']
+    DaoDialogFooter: typeof import('@dao-style/core')['DialogFooter']
+    DaoDialogHeader: typeof import('@dao-style/core')['DialogHeader']
+    DaoDrawer: typeof import('@dao-style/core')['Drawer']
+    DaoDropdown: typeof import('@dao-style/core')['Dropdown']
+    DaoDropdownMenu: typeof import('@dao-style/core')['DropdownMenu']
+    DaoDropdownItem: typeof import('@dao-style/core')['DropdownItem']
+    DaoForm: typeof import('@dao-style/core')['Form']
+    DaoFormItem: typeof import('@dao-style/core')['FormItem']
+    DaoFormGroup: typeof import('@dao-style/core')['FormGroup']
+    DaoHeader: typeof import('@dao-style/core')['Header']
+    DaoIcon: typeof import('@dao-style/core')['Icon']
+    DaoInput: typeof import('@dao-style/core')['Input']
+    DaoMessage: typeof import('@dao-style/core')['Message']
+    DaoNav: typeof import('@dao-style/core')['Nav']
+    DaoNavHead: typeof import('@dao-style/core')['NavHead']
+    DaoNavItem: typeof import('@dao-style/core')['NavItem']
+    DaoNavSub: typeof import('@dao-style/core')['NavSub']
+    DaoPagination: typeof import('@dao-style/core')['Pagination']
+    DaoPopover: typeof import('@dao-style/core')['Popover']
+    DaoPopper: typeof import('@dao-style/core')['Popper']
+    DaoProgress: typeof import('@dao-style/core')['Progress']
+    DaoRadio: typeof import('@dao-style/core')['Radio']
+    DaoRadioGroup: typeof import('@dao-style/core')['RadioGroup']
+    DaoSelect: typeof import('@dao-style/core')['Select']
+    DaoOption: typeof import('@dao-style/core')['Option']
+    DaoSwitch: typeof import('@dao-style/core')['Switch']
+    DaoTable: typeof import('@dao-style/core')['Table']
+    DaoTabs: typeof import('@dao-style/core')['Tabs']
+    DaoTabNav: typeof import('@dao-style/core')['TabNav']
+    DaoTabItem: typeof import('@dao-style/core')['TabItem']
+    DaoTooltip: typeof import('@dao-style/core')['Tooltip']
+    [key: string]: unknown
+  }
+}
+export {};