greeks-live-ui 0.0.19 → 0.0.21

package/es/packages/components/chart-panel/src/chart-panel.mjs

@@ -1,4 +1,4 @@
-import { defineComponent, reactive, computed, resolveComponent, openBlock, createElementBlock, normalizeClass, unref, createVNode, createSlots, withCtx, renderSlot, createElementVNode, isRef, Fragment, renderList, createCommentVNode, createBlock, createTextVNode, toDisplayString } from 'vue';
+import { defineComponent, reactive, computed, resolveComponent, openBlock, createElementBlock, normalizeClass, unref, createVNode, createSlots, withCtx, renderSlot, createElementVNode, createCommentVNode, isRef, Fragment, renderList, createBlock, createTextVNode, toDisplayString } from 'vue';
 import '../../../hooks/index.mjs';
 import { chartPanelProps, chartPanelEmits } from './chart-panel2.mjs';
 import _export_sfc from '../../../../_virtual/plugin-vue_export-helper.mjs';
@@ -89,9 +89,9 @@ const _sfc_main = defineComponent({
     });
     return (_ctx, _cache) => {
       const _component_g_icon = resolveComponent("g-icon");
+      const _component_g_radio_dropdown = resolveComponent("g-radio-dropdown");
       const _component_g_select_option = resolveComponent("g-select-option");
       const _component_g_select = resolveComponent("g-select");
-      const _component_g_radio_dropdown = resolveComponent("g-radio-dropdown");
       const _component_g_spin = resolveComponent("g-spin");
       const _component_g_panel = resolveComponent("g-panel");
       return openBlock(), createElementBlock(
@@ -120,38 +120,10 @@ const _sfc_main = defineComponent({
                 name: "header",
                 fn: withCtx(() => [
                   createElementVNode("div", _hoisted_1, [
-                    createVNode(_component_g_select, {
-                      value: unref(exchange),
-                      "onUpdate:value": _cache[0] || (_cache[0] = ($event) => isRef(exchange) ? exchange.value = $event : null),
-                      "option-label-prop": "children",
-                      disabled: ""
-                    }, {
-                      default: withCtx(() => [
-                        (openBlock(), createElementBlock(
-                          Fragment,
-                          null,
-                          renderList(exchangeList, (item) => {
-                            return createVNode(_component_g_select_option, {
-                              value: item.value,
-                              key: item.value
-                            }, {
-                              default: withCtx(() => [
-                                createVNode(_component_g_icon, {
-                                  type: item.icon
-                                }, null, 8, ["type"]),
-                                createCommentVNode(" {{ item.label }} ")
-                              ]),
-                              _: 2
-                            }, 1032, ["value"]);
-                          }),
-                          64
-                        ))
-                      ]),
-                      _: 1
-                    }, 8, ["value"]),
+                    createCommentVNode(' <g-select\n            v-model:value="exchange"\n            option-label-prop="children"\n            disabled\n          >\n            <g-select-option\n              v-for="item in exchangeList"\n              :value="item.value"\n              :key="item.value"\n            >\n              <g-icon :type="item.icon"></g-icon>\n            </g-select-option>\n          </g-select> '),
                     createVNode(_component_g_radio_dropdown, {
                       modelValue: unref(currency),
-                      "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef(currency) ? currency.value = $event : null),
+                      "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(currency) ? currency.value = $event : null),
                       options: currencyList,
                       class: "currency-radio"
                     }, {
@@ -229,7 +201,7 @@ const _sfc_main = defineComponent({
                   createElementVNode("div", _hoisted_6, [
                     createVNode(_component_g_select, {
                       value: unref(exchange),
-                      "onUpdate:value": _cache[2] || (_cache[2] = ($event) => isRef(exchange) ? exchange.value = $event : null),
+                      "onUpdate:value": _cache[1] || (_cache[1] = ($event) => isRef(exchange) ? exchange.value = $event : null),
                       "option-label-prop": "children"
                     }, {
                       default: withCtx(() => [
@@ -257,7 +229,7 @@ const _sfc_main = defineComponent({
                     }, 8, ["value"]),
                     createVNode(_component_g_select, {
                       value: unref(currency),
-                      "onUpdate:value": _cache[3] || (_cache[3] = ($event) => isRef(currency) ? currency.value = $event : null),
+                      "onUpdate:value": _cache[2] || (_cache[2] = ($event) => isRef(currency) ? currency.value = $event : null),
                       "option-label-prop": "children",
                       class: "currency-radio currency-radio-h5",
                       popupClassName: "currency-radio-popup"

package/es/packages/components/chart-panel/src/chart-panel.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"chart-panel.mjs","sources":["../../../../../../../packages/components/chart-panel/src/chart-panel.vue"],"sourcesContent":["<template>\n  <div :class=\"[ns.b()]\">\n    <g-panel>\n      <template v-if=\"isPC\" #header>\n        <div class=\"panel-header\">\n          <g-select\n            v-model:value=\"exchange\"\n            option-label-prop=\"children\"\n            disabled\n          >\n            <g-select-option\n              v-for=\"item in exchangeList\"\n              :value=\"item.value\"\n              :key=\"item.value\"\n            >\n              <g-icon :type=\"item.icon\"></g-icon>\n              <!-- {{ item.label }} -->\n            </g-select-option>\n          </g-select>\n\n          <g-radio-dropdown\n            v-model=\"currency\"\n            :options=\"currencyList\"\n            class=\"currency-radio\"\n          >\n            <template #highlightIcon>\n              <g-icon :type=\"getCurrencyIcon(currency)\" :size=\"18\"></g-icon>\n            </template>\n          </g-radio-dropdown>\n\n          <div class=\"chart-title-box\">\n            <slot name=\"title\"></slot>\n          </div>\n        </div>\n      </template>\n\n      <template v-if=\"isPC\" #header-right>\n        <slot name=\"header-right-filter\"></slot>\n\n        <div class=\"right-icons\">\n          <g-icon\n            v-for=\"item in showOperations\"\n            :type=\"item.icon\"\n            :key=\"item.value\"\n            @click=\"handleClickIcon(item.value)\"\n          >\n          </g-icon>\n        </div>\n      </template>\n\n      <template v-if=\"isPC\" #tool>\n        <slot name=\"tool\"></slot>\n      </template>\n\n      <template v-if=\"isMobile\" #header>\n        <div class=\"chart-title-box\">\n          <slot name=\"title\"></slot>\n        </div>\n      </template>\n      <template v-if=\"isMobile\" #header-right>\n        <slot name=\"header-right-filter\"></slot>\n\n        <div class=\"right-icons\">\n          <g-icon\n            v-for=\"item in showOperations\"\n            :type=\"item.icon\"\n            :key=\"item.value\"\n            @click=\"handleClickIcon(item.value)\"\n          >\n          </g-icon>\n        </div>\n      </template>\n      <template v-if=\"isMobile\" #tool>\n        <div class=\"greeks-panel-tool-box\">\n          <g-select v-model:value=\"exchange\" option-label-prop=\"children\">\n            <g-select-option\n              v-for=\"item in exchangeList\"\n              :value=\"item.value\"\n              :key=\"item.value\"\n            >\n              <g-icon :type=\"item.icon\"></g-icon>\n              <!-- {{ item.label }} -->\n            </g-select-option>\n          </g-select>\n\n          <g-select\n            v-model:value=\"currency\"\n            option-label-prop=\"children\"\n            class=\"currency-radio currency-radio-h5\"\n            popupClassName=\"currency-radio-popup\"\n          >\n            <g-select-option\n              v-for=\"periodItem in currencyList\"\n              :value=\"periodItem.value\"\n            >\n              <g-icon\n                :type=\"periodItem.icon\"\n                class=\"currency-radio-icon\"\n              ></g-icon>\n              {{ periodItem.label }}\n            </g-select-option>\n          </g-select>\n\n          <slot name=\"tool\"></slot>\n        </div>\n      </template>\n\n      <template #body>\n        <g-spin :spinning=\"props.loading\">\n          <slot name=\"body\"></slot>\n        </g-spin>\n      </template>\n    </g-panel>\n  </div>\n</template>\n<script lang=\"ts\" setup>\nimport { useNamespace, useDeviceType } from '@greeks-live-ui/hooks';\nimport { chartPanelEmits, chartPanelProps } from './chart-panel';\n\ndefineOptions({\n  name: 'GChartPanel',\n});\nconst ns = useNamespace('chart-panel');\nconst props = defineProps(chartPanelProps);\nconst emits = defineEmits(chartPanelEmits);\n\nimport { reactive, computed } from 'vue';\n\nexport type OperationType =\n  | 'line'\n  | 'bar'\n  | 'calc'\n  | 'search'\n  | 'toggle'\n  | 'refresh'\n  | 'fullscreen'\n  | 'setting'\n  | 'share';\n\nconst { isMobile, isPC } = useDeviceType();\n\nconst exchangeList = [\n  { value: 'byb', label: '', icon: 'logo_bybit_square_l' },\n  { value: 'okx', label: '', icon: 'logo_okx_square_d' },\n  { value: 'deribit', label: '', icon: 'logo_deribit_square_l' },\n];\n\nconst currencyList = [\n  { value: 'BTC', label: 'BTC', icon: 'currency_btc' },\n  { value: 'ETH', label: 'ETH', icon: 'currency_eth' },\n  { value: 'SOL_USDC', label: 'SOL', icon: 'currency_sol', isDropdown: true },\n  { value: 'BNB_USDC', label: 'BNB', icon: 'currency_bnb', isDropdown: true },\n  {\n    value: 'PAXG_USDC',\n    label: 'PAXG',\n    icon: 'currency_paxg',\n    isDropdown: true,\n  },\n  { value: 'XRP_USDC', label: 'XRP', icon: 'currency_xrp', isDropdown: true },\n];\n\nconst iconMap = {\n  line: 'chart_swtichtochart',\n  bar: 'chart_bar_switch_to_bar',\n  calc: 'chart_calculator_line',\n  calc_active: 'chart_calculator_filled',\n  search: 'chart_search_filter',\n  toggle: 'chart_switchtotable',\n  refresh: 'chart_reload',\n  fullscreen: 'chart_fullscreen',\n  setting: 'chart_settings',\n  share: 'chart_share',\n};\n\nconst state = reactive({\n  isMobile,\n  isPC,\n});\n\nconst showOperations = computed<Array<{ value: OperationType; icon: string }>>(\n  () => {\n    const defaultOperations: OperationType[] = state.isPC\n      ? // ? ['refresh', 'fullscreen', 'setting', 'share']\n        ['refresh']\n      : ['refresh'];\n    // : ['refresh', 'share'];\n    return [...props.operations, ...defaultOperations].map((v) => {\n      return {\n        value: v,\n        icon:\n          v === 'calc' && props.showType === 'calc'\n            ? iconMap['calc_active']\n            : iconMap[v],\n      };\n    });\n  }\n);\n\nconst handleClickIcon = (type: OperationType) => {\n  emits(type as 'line', true);\n  emits('operation', type);\n};\n\nconst getCurrencyIcon = (value: string) => {\n  return currencyList.find((v) => v.value === value)?.icon || '';\n};\n\nconst currency = computed({\n  get: () => props.currency || currencyList[0].value,\n  set: (newVal) => {\n    emits('update:currency', newVal);\n  },\n});\nconst exchange = computed({\n  get: () => props.exchange || exchangeList[0].value,\n  set: (newVal) => {\n    emits('update:exchange', newVal);\n  },\n});\n</script>\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"chart-panel.mjs","sources":["../../../../../../../packages/components/chart-panel/src/chart-panel.vue"],"sourcesContent":["<template>\n  <div :class=\"[ns.b()]\">\n    <g-panel>\n      <template v-if=\"isPC\" #header>\n        <div class=\"panel-header\">\n          <!-- <g-select\n            v-model:value=\"exchange\"\n            option-label-prop=\"children\"\n            disabled\n          >\n            <g-select-option\n              v-for=\"item in exchangeList\"\n              :value=\"item.value\"\n              :key=\"item.value\"\n            >\n              <g-icon :type=\"item.icon\"></g-icon>\n            </g-select-option>\n          </g-select> -->\n\n          <g-radio-dropdown\n            v-model=\"currency\"\n            :options=\"currencyList\"\n            class=\"currency-radio\"\n          >\n            <template #highlightIcon>\n              <g-icon :type=\"getCurrencyIcon(currency)\" :size=\"18\"></g-icon>\n            </template>\n          </g-radio-dropdown>\n\n          <div class=\"chart-title-box\">\n            <slot name=\"title\"></slot>\n          </div>\n        </div>\n      </template>\n\n      <template v-if=\"isPC\" #header-right>\n        <slot name=\"header-right-filter\"></slot>\n\n        <div class=\"right-icons\">\n          <g-icon\n            v-for=\"item in showOperations\"\n            :type=\"item.icon\"\n            :key=\"item.value\"\n            @click=\"handleClickIcon(item.value)\"\n          >\n          </g-icon>\n        </div>\n      </template>\n\n      <template v-if=\"isPC\" #tool>\n        <slot name=\"tool\"></slot>\n      </template>\n\n      <template v-if=\"isMobile\" #header>\n        <div class=\"chart-title-box\">\n          <slot name=\"title\"></slot>\n        </div>\n      </template>\n      <template v-if=\"isMobile\" #header-right>\n        <slot name=\"header-right-filter\"></slot>\n\n        <div class=\"right-icons\">\n          <g-icon\n            v-for=\"item in showOperations\"\n            :type=\"item.icon\"\n            :key=\"item.value\"\n            @click=\"handleClickIcon(item.value)\"\n          >\n          </g-icon>\n        </div>\n      </template>\n      <template v-if=\"isMobile\" #tool>\n        <div class=\"greeks-panel-tool-box\">\n          <g-select v-model:value=\"exchange\" option-label-prop=\"children\">\n            <g-select-option\n              v-for=\"item in exchangeList\"\n              :value=\"item.value\"\n              :key=\"item.value\"\n            >\n              <g-icon :type=\"item.icon\"></g-icon>\n              <!-- {{ item.label }} -->\n            </g-select-option>\n          </g-select>\n\n          <g-select\n            v-model:value=\"currency\"\n            option-label-prop=\"children\"\n            class=\"currency-radio currency-radio-h5\"\n            popupClassName=\"currency-radio-popup\"\n          >\n            <g-select-option\n              v-for=\"periodItem in currencyList\"\n              :value=\"periodItem.value\"\n            >\n              <g-icon\n                :type=\"periodItem.icon\"\n                class=\"currency-radio-icon\"\n              ></g-icon>\n              {{ periodItem.label }}\n            </g-select-option>\n          </g-select>\n\n          <slot name=\"tool\"></slot>\n        </div>\n      </template>\n\n      <template #body>\n        <g-spin :spinning=\"props.loading\">\n          <slot name=\"body\"></slot>\n        </g-spin>\n      </template>\n    </g-panel>\n  </div>\n</template>\n<script lang=\"ts\" setup>\nimport { useNamespace, useDeviceType } from '@greeks-live-ui/hooks';\nimport { chartPanelEmits, chartPanelProps } from './chart-panel';\n\ndefineOptions({\n  name: 'GChartPanel',\n});\nconst ns = useNamespace('chart-panel');\nconst props = defineProps(chartPanelProps);\nconst emits = defineEmits(chartPanelEmits);\n\nimport { reactive, computed } from 'vue';\n\nexport type OperationType =\n  | 'line'\n  | 'bar'\n  | 'calc'\n  | 'search'\n  | 'toggle'\n  | 'refresh'\n  | 'fullscreen'\n  | 'setting'\n  | 'share';\n\nconst { isMobile, isPC } = useDeviceType();\n\nconst exchangeList = [\n  { value: 'byb', label: '', icon: 'logo_bybit_square_l' },\n  { value: 'okx', label: '', icon: 'logo_okx_square_d' },\n  { value: 'deribit', label: '', icon: 'logo_deribit_square_l' },\n];\n\nconst currencyList = [\n  { value: 'BTC', label: 'BTC', icon: 'currency_btc' },\n  { value: 'ETH', label: 'ETH', icon: 'currency_eth' },\n  { value: 'SOL_USDC', label: 'SOL', icon: 'currency_sol', isDropdown: true },\n  { value: 'BNB_USDC', label: 'BNB', icon: 'currency_bnb', isDropdown: true },\n  {\n    value: 'PAXG_USDC',\n    label: 'PAXG',\n    icon: 'currency_paxg',\n    isDropdown: true,\n  },\n  { value: 'XRP_USDC', label: 'XRP', icon: 'currency_xrp', isDropdown: true },\n];\n\nconst iconMap = {\n  line: 'chart_swtichtochart',\n  bar: 'chart_bar_switch_to_bar',\n  calc: 'chart_calculator_line',\n  calc_active: 'chart_calculator_filled',\n  search: 'chart_search_filter',\n  toggle: 'chart_switchtotable',\n  refresh: 'chart_reload',\n  fullscreen: 'chart_fullscreen',\n  setting: 'chart_settings',\n  share: 'chart_share',\n};\n\nconst state = reactive({\n  isMobile,\n  isPC,\n});\n\nconst showOperations = computed<Array<{ value: OperationType; icon: string }>>(\n  () => {\n    const defaultOperations: OperationType[] = state.isPC\n      ? // ? ['refresh', 'fullscreen', 'setting', 'share']\n        ['refresh']\n      : ['refresh'];\n    // : ['refresh', 'share'];\n    return [...props.operations, ...defaultOperations].map((v) => {\n      return {\n        value: v,\n        icon:\n          v === 'calc' && props.showType === 'calc'\n            ? iconMap['calc_active']\n            : iconMap[v],\n      };\n    });\n  }\n);\n\nconst handleClickIcon = (type: OperationType) => {\n  emits(type as 'line', true);\n  emits('operation', type);\n};\n\nconst getCurrencyIcon = (value: string) => {\n  return currencyList.find((v) => v.value === value)?.icon || '';\n};\n\nconst currency = computed({\n  get: () => props.currency || currencyList[0].value,\n  set: (newVal) => {\n    emits('update:currency', newVal);\n  },\n});\nconst exchange = computed({\n  get: () => props.exchange || exchangeList[0].value,\n  set: (newVal) => {\n    emits('update:exchange', newVal);\n  },\n});\n</script>\n"],"names":[],"mappings":"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"}

package/es/packages/components/chart-table/index.mjs

@@ -1,6 +1,6 @@
 import '../../utils/index.mjs';
-import ChartTable from './src/chart-table.mjs';
-export { chartTableEmits, chartTableProps } from './src/chart-table2.mjs';
+import ChartTable from './src/chart-table2.mjs';
+export { chartTableEmits, chartTableProps } from './src/chart-table.mjs';
 import { withInstall } from '../../utils/vue/install.mjs';
 
 const GChartTable = withInstall(ChartTable);

package/es/packages/components/chart-table/src/chart-table.mjs

@@ -1,149 +1,20 @@
-import { defineComponent, computed, resolveComponent, openBlock, createElementBlock, normalizeClass, unref, createVNode, withCtx, createBlock, createElementVNode, toDisplayString, createCommentVNode } from 'vue';
-import '../../../hooks/index.mjs';
-import { chartTableProps, chartTableEmits } from './chart-table2.mjs';
-import _export_sfc from '../../../../_virtual/plugin-vue_export-helper.mjs';
-import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
-import { useLocale } from '../../../hooks/use-locale/index.mjs';
+import '../../../utils/index.mjs';
+import { buildProps } from '../../../utils/vue/props/runtime.mjs';
 
-const _hoisted_1 = { class: "text-tip" };
-const __default__ = {
-  name: "GChartTable"
-};
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  ...__default__,
-  props: chartTableProps,
-  emits: chartTableEmits,
-  setup(__props, { emit: emits }) {
-    const props = __props;
-    const ns = useNamespace("chart-table");
-    const { t } = useLocale();
-    const defaultColumns = [
-      {
-        title: t("message.expiryIn"),
-        key: "expire",
-        dataIndex: "expire"
-      },
-      {
-        title: "",
-        key: "atm",
-        dataIndex: "atm"
-      },
-      {
-        title: "chg-1d",
-        tooltipTitle: t("message.chg1dTips"),
-        key: "chg1",
-        dataIndex: "chg1"
-      },
-      {
-        title: "chg-2d",
-        tooltipTitle: t("message.chg2dTips"),
-        key: "chg2",
-        dataIndex: "chg2"
-      },
-      {
-        title: "chg-1w",
-        tooltipTitle: t("message.chg1wTips"),
-        key: "chg7",
-        dataIndex: "chg7"
-      },
-      {
-        title: "chg-2w",
-        tooltipTitle: t("message.chg2wTips"),
-        key: "chg14",
-        dataIndex: "chg14"
-      },
-      {
-        title: "chg-1m",
-        tooltipTitle: t("message.chg1mTips"),
-        key: "chg30",
-        dataIndex: "chg30"
-      }
-    ];
-    const columns = computed(() => {
-      var _a;
-      let _columns = JSON.parse(JSON.stringify(defaultColumns));
-      _columns = _columns.map((v) => {
-        if (v.key === "atm") {
-          v.title = {
-            SKEW: "RR",
-            IV: "ATM IV",
-            RV: "RV"
-          }[props.name];
-        }
-        return v;
-      });
-      if (props.name === "IV") {
-        _columns.push({
-          title: ((_a = props.tableData[0] || {}) == null ? void 0 : _a.vrpLabel) || "VRP",
-          key: "vrp",
-          dataIndex: "vrp"
-        });
-      }
-      return _columns;
-    });
-    const showNumber = (val) => {
-      if (typeof val !== "number")
-        return val;
-      return Number(Number(val).toFixed(2));
-    };
-    return (_ctx, _cache) => {
-      const _component_g_tooltip = resolveComponent("g-tooltip");
-      const _component_g_table = resolveComponent("g-table");
-      return openBlock(), createElementBlock(
-        "div",
-        {
-          class: normalizeClass([unref(ns).b()])
-        },
-        [
-          createVNode(_component_g_table, {
-            columns: unref(columns),
-            "data-source": _ctx.tableData,
-            loading: _ctx.loading,
-            size: "small",
-            pagination: false,
-            scroll: { x: 600 }
-          }, {
-            headerCell: withCtx(({ column }) => [
-              column.tooltipTitle ? (openBlock(), createBlock(_component_g_tooltip, {
-                key: 0,
-                title: column.tooltipTitle,
-                placement: "bottom"
-              }, {
-                default: withCtx(() => [
-                  createElementVNode(
-                    "span",
-                    _hoisted_1,
-                    toDisplayString(column.title),
-                    1
-                  )
-                ]),
-                _: 2
-              }, 1032, ["title"])) : createCommentVNode("v-if", true)
-            ]),
-            bodyCell: withCtx(({ column, record }) => [
-              column.key ? (openBlock(), createElementBlock(
-                "span",
-                {
-                  key: 0,
-                  class: normalizeClass({
-                    "column-span": true,
-                    "text-success": column.key !== "atm" && record[column.key] > 0,
-                    "text-danger": column.key !== "atm" && record[column.key] < 0
-                  })
-                },
-                toDisplayString(record && showNumber(record[column.key]) || "0.00%") + " " + toDisplayString(record && typeof record[column.key] === "number" ? "%" : ""),
-                3
-              )) : createCommentVNode("v-if", true)
-            ]),
-            _: 1
-          }, 8, ["columns", "data-source", "loading"])
-        ],
-        2
-      );
-    };
+const chartTableEmits = {};
+const chartTableProps = buildProps({
+  tableData: {
+    type: Array,
+    required: true
+  },
+  name: {
+    type: String,
+    default: "SKEW"
+  },
+  loading: {
+    type: Boolean
   }
 });
-var ChartTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/Users/luobowen/Desktop/greeks/greeks-live-ui/packages/components/chart-table/src/chart-table.vue"]]);
 
-export { ChartTable as default };
+export { chartTableEmits, chartTableProps };
 //# sourceMappingURL=chart-table.mjs.map

package/es/packages/components/chart-table/src/chart-table.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"chart-table.mjs","sources":["../../../../../../../packages/components/chart-table/src/chart-table.vue"],"sourcesContent":["<template>\n  <div :class=\"[ns.b()]\">\n    <g-table\n      :columns=\"columns\"\n      :data-source=\"tableData\"\n      :loading=\"loading\"\n      size=\"small\"\n      :pagination=\"false\"\n      :scroll=\"{ x: 600 }\"\n    >\n      <template #headerCell=\"{ column }\">\n        <template v-if=\"column.tooltipTitle\">\n          <g-tooltip :title=\"column.tooltipTitle\" placement=\"bottom\">\n            <span class=\"text-tip\">{{ column.title }}</span>\n          </g-tooltip>\n        </template>\n      </template>\n\n      <template #bodyCell=\"{ column, record }\">\n        <template v-if=\"column.key\">\n          <span\n            :class=\"{\n              'column-span': true,\n              'text-success': column.key !== 'atm' && record[column.key] > 0,\n              'text-danger': column.key !== 'atm' && record[column.key] < 0,\n            }\"\n          >\n            {{ (record && showNumber(record[column.key])) || '0.00%' }}\n            {{ record && typeof record[column.key] === 'number' ? '%' : '' }}\n          </span>\n        </template>\n      </template>\n    </g-table>\n  </div>\n</template>\n<script lang=\"ts\" setup>\nimport { useLocale, useNamespace } from '@greeks-live-ui/hooks';\nimport { chartTableEmits, chartTableProps } from './chart-table';\nimport { computed } from 'vue';\ndefineOptions({\n  name: 'GChartTable',\n});\nconst ns = useNamespace('chart-table');\nconst props = defineProps(chartTableProps);\nconst emits = defineEmits(chartTableEmits);\n\nconst { t } = useLocale();\n\nconst defaultColumns = [\n  {\n    title: t('message.expiryIn'),\n    key: 'expire',\n    dataIndex: 'expire',\n  },\n  {\n    title: '',\n    key: 'atm',\n    dataIndex: 'atm',\n  },\n  {\n    title: 'chg-1d',\n    tooltipTitle: t('message.chg1dTips'),\n    key: 'chg1',\n    dataIndex: 'chg1',\n  },\n  {\n    title: 'chg-2d',\n    tooltipTitle: t('message.chg2dTips'),\n    key: 'chg2',\n    dataIndex: 'chg2',\n  },\n  {\n    title: 'chg-1w',\n    tooltipTitle: t('message.chg1wTips'),\n    key: 'chg7',\n    dataIndex: 'chg7',\n  },\n  {\n    title: 'chg-2w',\n    tooltipTitle: t('message.chg2wTips'),\n    key: 'chg14',\n    dataIndex: 'chg14',\n  },\n  {\n    title: 'chg-1m',\n    tooltipTitle: t('message.chg1mTips'),\n    key: 'chg30',\n    dataIndex: 'chg30',\n  },\n];\n\nconst columns = computed(() => {\n  let _columns = JSON.parse(JSON.stringify(defaultColumns));\n\n  _columns = _columns.map((v: { key: string; title: string | undefined }) => {\n    if (v.key === 'atm') {\n      v.title = {\n        SKEW: 'RR',\n        IV: 'ATM IV',\n        RV: 'RV',\n      }[props.name];\n    }\n    return v;\n  });\n\n  if (props.name === 'IV') {\n    _columns.push({\n      title: (((props as any).tableData[0] || {}) as any)?.vrpLabel || 'VRP',\n      key: 'vrp',\n      dataIndex: 'vrp',\n    });\n  }\n  return _columns;\n});\n\nconst showNumber = (val: number | string) => {\n  if (typeof val !== 'number') return val;\n  return Number(Number(val).toFixed(2));\n};\n</script>\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"chart-table.mjs","sources":["../../../../../../../packages/components/chart-table/src/chart-table.ts"],"sourcesContent":["import { buildProps } from '@greeks-live-ui/utils';\nimport type ChartTable from './chart-table.vue';\nimport type { ExtractPropTypes } from 'vue';\n\nexport const chartTableEmits = {};\nexport type ChartTableEmits = typeof chartTableEmits;\nexport const chartTableProps = buildProps({\n  tableData: {\n    type: Array,\n    required: true,\n  },\n  name: {\n    type: String,\n    default: 'SKEW', // 'SKEW' | 'IV' | 'RV'\n  },\n  loading: {\n    type: Boolean,\n  },\n});\nexport type ChartTableProps = ExtractPropTypes<typeof chartTableProps>;\nexport type ChartTableInstance = InstanceType<typeof ChartTable>;\n"],"names":[],"mappings":";;;AAIO,MAAM,kBAAkB,GAAC;AAEzB,MAAM,kBAAkB,UAAW,CAAA;AAAA,EACxC,SAAW,EAAA;AAAA,IACT,IAAM,EAAA,KAAA;AAAA,IACN,QAAU,EAAA,IAAA;AAAA,GACZ;AAAA,EACA,IAAM,EAAA;AAAA,IACJ,IAAM,EAAA,MAAA;AAAA,IACN,OAAS,EAAA,MAAA;AAAA,GACX;AAAA,EACA,OAAS,EAAA;AAAA,IACP,IAAM,EAAA,OAAA;AAAA,GACR;AACF,CAAC;;;;"}

package/es/packages/components/chart-table/src/chart-table2.mjs

@@ -1,20 +1,149 @@
-import '../../../utils/index.mjs';
-import { buildProps } from '../../../utils/vue/props/runtime.mjs';
+import { defineComponent, computed, resolveComponent, openBlock, createElementBlock, normalizeClass, unref, createVNode, withCtx, createBlock, createElementVNode, toDisplayString, createCommentVNode } from 'vue';
+import '../../../hooks/index.mjs';
+import { chartTableProps, chartTableEmits } from './chart-table.mjs';
+import _export_sfc from '../../../../_virtual/plugin-vue_export-helper.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
+import { useLocale } from '../../../hooks/use-locale/index.mjs';
 
-const chartTableEmits = {};
-const chartTableProps = buildProps({
-  tableData: {
-    type: Array,
-    required: true
-  },
-  name: {
-    type: String,
-    default: "SKEW"
-  },
-  loading: {
-    type: Boolean
+const _hoisted_1 = { class: "text-tip" };
+const __default__ = {
+  name: "GChartTable"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: chartTableProps,
+  emits: chartTableEmits,
+  setup(__props, { emit: emits }) {
+    const props = __props;
+    const ns = useNamespace("chart-table");
+    const { t } = useLocale();
+    const defaultColumns = [
+      {
+        title: t("message.expiryIn"),
+        key: "expire",
+        dataIndex: "expire"
+      },
+      {
+        title: "",
+        key: "atm",
+        dataIndex: "atm"
+      },
+      {
+        title: "chg-1d",
+        tooltipTitle: t("message.chg1dTips"),
+        key: "chg1",
+        dataIndex: "chg1"
+      },
+      {
+        title: "chg-2d",
+        tooltipTitle: t("message.chg2dTips"),
+        key: "chg2",
+        dataIndex: "chg2"
+      },
+      {
+        title: "chg-1w",
+        tooltipTitle: t("message.chg1wTips"),
+        key: "chg7",
+        dataIndex: "chg7"
+      },
+      {
+        title: "chg-2w",
+        tooltipTitle: t("message.chg2wTips"),
+        key: "chg14",
+        dataIndex: "chg14"
+      },
+      {
+        title: "chg-1m",
+        tooltipTitle: t("message.chg1mTips"),
+        key: "chg30",
+        dataIndex: "chg30"
+      }
+    ];
+    const columns = computed(() => {
+      var _a;
+      let _columns = JSON.parse(JSON.stringify(defaultColumns));
+      _columns = _columns.map((v) => {
+        if (v.key === "atm") {
+          v.title = {
+            SKEW: "RR",
+            IV: "ATM IV",
+            RV: "RV"
+          }[props.name];
+        }
+        return v;
+      });
+      if (props.name === "IV") {
+        _columns.push({
+          title: ((_a = props.tableData[0] || {}) == null ? void 0 : _a.vrpLabel) || "VRP",
+          key: "vrp",
+          dataIndex: "vrp"
+        });
+      }
+      return _columns;
+    });
+    const showNumber = (val) => {
+      if (typeof val !== "number")
+        return val;
+      return Number(Number(val).toFixed(2));
+    };
+    return (_ctx, _cache) => {
+      const _component_g_tooltip = resolveComponent("g-tooltip");
+      const _component_g_table = resolveComponent("g-table");
+      return openBlock(), createElementBlock(
+        "div",
+        {
+          class: normalizeClass([unref(ns).b()])
+        },
+        [
+          createVNode(_component_g_table, {
+            columns: unref(columns),
+            "data-source": _ctx.tableData,
+            loading: _ctx.loading,
+            size: "small",
+            pagination: false,
+            scroll: { x: 600 }
+          }, {
+            headerCell: withCtx(({ column }) => [
+              column.tooltipTitle ? (openBlock(), createBlock(_component_g_tooltip, {
+                key: 0,
+                title: column.tooltipTitle,
+                placement: "bottom"
+              }, {
+                default: withCtx(() => [
+                  createElementVNode(
+                    "span",
+                    _hoisted_1,
+                    toDisplayString(column.title),
+                    1
+                  )
+                ]),
+                _: 2
+              }, 1032, ["title"])) : createCommentVNode("v-if", true)
+            ]),
+            bodyCell: withCtx(({ column, record }) => [
+              column.key ? (openBlock(), createElementBlock(
+                "span",
+                {
+                  key: 0,
+                  class: normalizeClass({
+                    "column-span": true,
+                    "text-success": column.key !== "atm" && record[column.key] > 0,
+                    "text-danger": column.key !== "atm" && record[column.key] < 0
+                  })
+                },
+                toDisplayString(record && showNumber(record[column.key]) || "0.00%") + " " + toDisplayString(record && typeof record[column.key] === "number" ? "%" : ""),
+                3
+              )) : createCommentVNode("v-if", true)
+            ]),
+            _: 1
+          }, 8, ["columns", "data-source", "loading"])
+        ],
+        2
+      );
+    };
   }
 });
+var ChartTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/Users/luobowen/Desktop/greeks/greeks-live-ui/packages/components/chart-table/src/chart-table.vue"]]);
 
-export { chartTableEmits, chartTableProps };
+export { ChartTable as default };
 //# sourceMappingURL=chart-table2.mjs.map

package/es/packages/components/chart-table/src/chart-table2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"chart-table2.mjs","sources":["../../../../../../../packages/components/chart-table/src/chart-table.ts"],"sourcesContent":["import { buildProps } from '@greeks-live-ui/utils';\nimport type ChartTable from './chart-table.vue';\nimport type { ExtractPropTypes } from 'vue';\n\nexport const chartTableEmits = {};\nexport type ChartTableEmits = typeof chartTableEmits;\nexport const chartTableProps = buildProps({\n  tableData: {\n    type: Array,\n    required: true,\n  },\n  name: {\n    type: String,\n    default: 'SKEW', // 'SKEW' | 'IV' | 'RV'\n  },\n  loading: {\n    type: Boolean,\n  },\n});\nexport type ChartTableProps = ExtractPropTypes<typeof chartTableProps>;\nexport type ChartTableInstance = InstanceType<typeof ChartTable>;\n"],"names":[],"mappings":";;;AAIO,MAAM,kBAAkB,GAAC;AAEzB,MAAM,kBAAkB,UAAW,CAAA;AAAA,EACxC,SAAW,EAAA;AAAA,IACT,IAAM,EAAA,KAAA;AAAA,IACN,QAAU,EAAA,IAAA;AAAA,GACZ;AAAA,EACA,IAAM,EAAA;AAAA,IACJ,IAAM,EAAA,MAAA;AAAA,IACN,OAAS,EAAA,MAAA;AAAA,GACX;AAAA,EACA,OAAS,EAAA;AAAA,IACP,IAAM,EAAA,OAAA;AAAA,GACR;AACF,CAAC;;;;"}
+{"version":3,"file":"chart-table2.mjs","sources":["../../../../../../../packages/components/chart-table/src/chart-table.vue"],"sourcesContent":["<template>\n  <div :class=\"[ns.b()]\">\n    <g-table\n      :columns=\"columns\"\n      :data-source=\"tableData\"\n      :loading=\"loading\"\n      size=\"small\"\n      :pagination=\"false\"\n      :scroll=\"{ x: 600 }\"\n    >\n      <template #headerCell=\"{ column }\">\n        <template v-if=\"column.tooltipTitle\">\n          <g-tooltip :title=\"column.tooltipTitle\" placement=\"bottom\">\n            <span class=\"text-tip\">{{ column.title }}</span>\n          </g-tooltip>\n        </template>\n      </template>\n\n      <template #bodyCell=\"{ column, record }\">\n        <template v-if=\"column.key\">\n          <span\n            :class=\"{\n              'column-span': true,\n              'text-success': column.key !== 'atm' && record[column.key] > 0,\n              'text-danger': column.key !== 'atm' && record[column.key] < 0,\n            }\"\n          >\n            {{ (record && showNumber(record[column.key])) || '0.00%' }}\n            {{ record && typeof record[column.key] === 'number' ? '%' : '' }}\n          </span>\n        </template>\n      </template>\n    </g-table>\n  </div>\n</template>\n<script lang=\"ts\" setup>\nimport { useLocale, useNamespace } from '@greeks-live-ui/hooks';\nimport { chartTableEmits, chartTableProps } from './chart-table';\nimport { computed } from 'vue';\ndefineOptions({\n  name: 'GChartTable',\n});\nconst ns = useNamespace('chart-table');\nconst props = defineProps(chartTableProps);\nconst emits = defineEmits(chartTableEmits);\n\nconst { t } = useLocale();\n\nconst defaultColumns = [\n  {\n    title: t('message.expiryIn'),\n    key: 'expire',\n    dataIndex: 'expire',\n  },\n  {\n    title: '',\n    key: 'atm',\n    dataIndex: 'atm',\n  },\n  {\n    title: 'chg-1d',\n    tooltipTitle: t('message.chg1dTips'),\n    key: 'chg1',\n    dataIndex: 'chg1',\n  },\n  {\n    title: 'chg-2d',\n    tooltipTitle: t('message.chg2dTips'),\n    key: 'chg2',\n    dataIndex: 'chg2',\n  },\n  {\n    title: 'chg-1w',\n    tooltipTitle: t('message.chg1wTips'),\n    key: 'chg7',\n    dataIndex: 'chg7',\n  },\n  {\n    title: 'chg-2w',\n    tooltipTitle: t('message.chg2wTips'),\n    key: 'chg14',\n    dataIndex: 'chg14',\n  },\n  {\n    title: 'chg-1m',\n    tooltipTitle: t('message.chg1mTips'),\n    key: 'chg30',\n    dataIndex: 'chg30',\n  },\n];\n\nconst columns = computed(() => {\n  let _columns = JSON.parse(JSON.stringify(defaultColumns));\n\n  _columns = _columns.map((v: { key: string; title: string | undefined }) => {\n    if (v.key === 'atm') {\n      v.title = {\n        SKEW: 'RR',\n        IV: 'ATM IV',\n        RV: 'RV',\n      }[props.name];\n    }\n    return v;\n  });\n\n  if (props.name === 'IV') {\n    _columns.push({\n      title: (((props as any).tableData[0] || {}) as any)?.vrpLabel || 'VRP',\n      key: 'vrp',\n      dataIndex: 'vrp',\n    });\n  }\n  return _columns;\n});\n\nconst showNumber = (val: number | string) => {\n  if (typeof val !== 'number') return val;\n  return Number(Number(val).toFixed(2));\n};\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AA0CA,IAAA,MAAA,EAAA,GAAA,YAAA,CAAA,aAAA,CAAA,CAAA;AAIA,IAAA,MAAA,EAAA,CAAA,EAAA,GAAA,SAAA,EAAA,CAAA;AAEA,IAAA,MAAA,cAAA,GAAA;AAAA,MAAA;AACA,QAAA,KAAA,EAAA,CAAA,CAAA,kBAAA,CAAA;AACA,QAAA,GAAA,EAAA,QAAA;AACA,QAAA,SAAA,EAAA,QAAA;AACA,OAAA;AACA,MAAA;AACA,QAAA,KAAA,EAAA,EAAA;AACA,QAAA,GAAA,EAAA,KAAA;AACA,QAAA,SAAA,EAAA,KAAA;AACA,OAAA;AACA,MAAA;AACA,QAAA,KAAA,EAAA,QAAA;AACA,QAAA,YAAA,EAAA,CAAA,CAAA,mBAAA,CAAA;AACA,QAAA,GAAA,EAAA,MAAA;AACA,QAAA,SAAA,EAAA,MAAA;AACA,OAAA;AACA,MAAA;AACA,QAAA,KAAA,EAAA,QAAA;AACA,QAAA,YAAA,EAAA,CAAA,CAAA,mBAAA,CAAA;AACA,QAAA,GAAA,EAAA,MAAA;AACA,QAAA,SAAA,EAAA,MAAA;AACA,OAAA;AACA,MAAA;AACA,QAAA,KAAA,EAAA,QAAA;AACA,QAAA,YAAA,EAAA,CAAA,CAAA,mBAAA,CAAA;AACA,QAAA,GAAA,EAAA,MAAA;AACA,QAAA,SAAA,EAAA,MAAA;AACA,OAAA;AACA,MAAA;AACA,QAAA,KAAA,EAAA,QAAA;AACA,QAAA,YAAA,EAAA,CAAA,CAAA,mBAAA,CAAA;AACA,QAAA,GAAA,EAAA,OAAA;AACA,QAAA,SAAA,EAAA,OAAA;AACA,OAAA;AACA,MAAA;AACA,QAAA,KAAA,EAAA,QAAA;AACA,QAAA,YAAA,EAAA,CAAA,CAAA,mBAAA,CAAA;AACA,QAAA,GAAA,EAAA,OAAA;AACA,QAAA,SAAA,EAAA,OAAA;AACA,OAAA;AACA,KAAA,CAAA;AAGA,IAAA,MAAA,OAAA,GAAA,QAAA,CAAA,MAAA;;AACA,MAAA,IAAA,QAAA,GAAA,IAAA,CAAA,KAAA,CAAA,IAAA,CAAA,SAAA,CAAA,cAAA,CAAA,CAAA,CAAA;AAEA,MAAA,QAAA,GAAA,QAAA,CAAA,GAAA,CAAA,CAAA,CAAA,KAAA;AACA,QAAA,IAAA,CAAA,CAAA,GAAA,KAAA,KAAA,EAAA;AACA,UAAA,CAAA,CAAA,KAAA,GAAA;AAAA,YAAA,IAAA,EAAA,IAAA;AACA,YAAA,EAAA,EAAA,QAAA;AACA,YAAA,EAAA,EAAA,IAAA;AACA,WAAA,CAAA,KAAA,CAAA,IAAA,CAAA,CAAA;AACA,SAAA;AAEA,QAAA,OAAA,CAAA,CAAA;AAAA,OAAA,CAAA,CAAA;AAGA,MAAA,IAAA,KAAA,CAAA,IAAA,KAAA,IAAA,EAAA;AACA,QAAA,QAAA,CAAA,IAAA,CAAA;AAAA,UAAA,KAAA,EAAA,CAAA,CAAA,EAAA,GAAA,KAAA,CAAA,SAAA,CAAA,CAAA,CAAA,IAAA,EAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,QAAA,KAAA,KAAA;AACA,UAAA,GAAA,EAAA,KAAA;AACA,UAAA,SAAA,EAAA,KAAA;AACA,SAAA,CAAA,CAAA;AACA,OAAA;AAEA,MAAA,OAAA,QAAA,CAAA;AAAA,KAAA,CAAA,CAAA;AAGA,IAAA,MAAA,UAAA,GAAA,CAAA,GAAA,KAAA;AACA,MAAA,IAAA,OAAA,GAAA,KAAA,QAAA;AAAA,QAAA,OAAA,GAAA,CAAA;AACA,MAAA,OAAA,MAAA,CAAA,MAAA,CAAA,GAAA,CAAA,CAAA,OAAA,CAAA,CAAA,CAAA,CAAA,CAAA;AAAA,KAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/packages/components/checkbox/index.mjs

@@ -1,6 +1,6 @@
 import '../../utils/index.mjs';
-import Checkbox from './src/checkbox.mjs';
-export { checkboxEmits, checkboxProps } from './src/checkbox2.mjs';
+import Checkbox from './src/checkbox2.mjs';
+export { checkboxEmits, checkboxProps } from './src/checkbox.mjs';
 import { withInstall } from '../../utils/vue/install.mjs';
 
 const GCheckbox = withInstall(Checkbox);

package/es/packages/components/checkbox/src/checkbox.mjs

@@ -1,34 +1,8 @@
-import { Checkbox as Checkbox$1 } from 'ant-design-vue/es';
-import { defineComponent, openBlock, createBlock, mergeProps, unref, toHandlers, withCtx, renderSlot } from 'vue';
-import '../../../hooks/index.mjs';
-import { checkboxProps, checkboxEmits } from './checkbox2.mjs';
-import _export_sfc from '../../../../_virtual/plugin-vue_export-helper.mjs';
-import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
+import '../../../utils/index.mjs';
+import { buildProps } from '../../../utils/vue/props/runtime.mjs';
 
-const __default__ = {
-  name: "GCheckbox"
-};
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  ...__default__,
-  props: checkboxProps,
-  emits: checkboxEmits,
-  setup(__props, { emit: emits }) {
-    const props = __props;
-    const ns = useNamespace("checkbox");
-    return (_ctx, _cache) => {
-      const _component_a_checkbox = Checkbox$1;
-      return openBlock(), createBlock(_component_a_checkbox, mergeProps({
-        class: [unref(ns).b()]
-      }, props, toHandlers(emits)), {
-        default: withCtx(() => [
-          renderSlot(_ctx.$slots, "default")
-        ]),
-        _: 3
-      }, 16, ["class"]);
-    };
-  }
-});
-var Checkbox = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/Users/luobowen/Desktop/greeks/greeks-live-ui/packages/components/checkbox/src/checkbox.vue"]]);
+const checkboxEmits = {};
+const checkboxProps = buildProps({});
 
-export { Checkbox as default };
+export { checkboxEmits, checkboxProps };
 //# sourceMappingURL=checkbox.mjs.map

package/es/packages/components/checkbox/src/checkbox.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.mjs","sources":["../../../../../../../packages/components/checkbox/src/checkbox.vue"],"sourcesContent":["<template>\n  <a-checkbox\n    :class=\"[ns.b()]\"\n    v-bind=\"props\"\n    v-on=\"emits\"\n  >\n    <slot></slot>\n  </a-checkbox>\n</template>\n<script lang=\"ts\" setup>\nimport { useNamespace } from '@greeks-live-ui/hooks'\nimport { checkboxEmits, checkboxProps } from './checkbox'\ndefineOptions({\n  name: 'GCheckbox',\n})\nconst ns = useNamespace('checkbox')\nconst props = defineProps(checkboxProps)\nconst emits = defineEmits(checkboxEmits)\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAeA,IAAA,MAAA,EAAA,GAAA,YAAA,CAAA,UAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"checkbox.mjs","sources":["../../../../../../../packages/components/checkbox/src/checkbox.ts"],"sourcesContent":["import { buildProps } from '@greeks-live-ui/utils'\nimport type Checkbox from './checkbox.vue'\nimport type { ExtractPropTypes } from 'vue'\n\nexport const checkboxEmits = {}\nexport type CheckboxEmits = typeof checkboxEmits\nexport const checkboxProps = buildProps({})\nexport type CheckboxProps = ExtractPropTypes<typeof checkboxProps>\nexport type CheckboxInstance = InstanceType<typeof Checkbox>\n"],"names":[],"mappings":";;;AAIO,MAAM,gBAAgB,GAAC;AAEjB,MAAA,aAAA,GAAgB,UAAW,CAAA,EAAE;;;;"}

package/es/packages/components/checkbox/src/checkbox2.mjs

@@ -1,8 +1,34 @@
-import '../../../utils/index.mjs';
-import { buildProps } from '../../../utils/vue/props/runtime.mjs';
+import { Checkbox as Checkbox$1 } from 'ant-design-vue/es';
+import { defineComponent, openBlock, createBlock, mergeProps, unref, toHandlers, withCtx, renderSlot } from 'vue';
+import '../../../hooks/index.mjs';
+import { checkboxProps, checkboxEmits } from './checkbox.mjs';
+import _export_sfc from '../../../../_virtual/plugin-vue_export-helper.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
 
-const checkboxEmits = {};
-const checkboxProps = buildProps({});
+const __default__ = {
+  name: "GCheckbox"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: checkboxProps,
+  emits: checkboxEmits,
+  setup(__props, { emit: emits }) {
+    const props = __props;
+    const ns = useNamespace("checkbox");
+    return (_ctx, _cache) => {
+      const _component_a_checkbox = Checkbox$1;
+      return openBlock(), createBlock(_component_a_checkbox, mergeProps({
+        class: [unref(ns).b()]
+      }, props, toHandlers(emits)), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16, ["class"]);
+    };
+  }
+});
+var Checkbox = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/Users/luobowen/Desktop/greeks/greeks-live-ui/packages/components/checkbox/src/checkbox.vue"]]);
 
-export { checkboxEmits, checkboxProps };
+export { Checkbox as default };
 //# sourceMappingURL=checkbox2.mjs.map

package/es/packages/components/checkbox/src/checkbox2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox2.mjs","sources":["../../../../../../../packages/components/checkbox/src/checkbox.ts"],"sourcesContent":["import { buildProps } from '@greeks-live-ui/utils'\nimport type Checkbox from './checkbox.vue'\nimport type { ExtractPropTypes } from 'vue'\n\nexport const checkboxEmits = {}\nexport type CheckboxEmits = typeof checkboxEmits\nexport const checkboxProps = buildProps({})\nexport type CheckboxProps = ExtractPropTypes<typeof checkboxProps>\nexport type CheckboxInstance = InstanceType<typeof Checkbox>\n"],"names":[],"mappings":";;;AAIO,MAAM,gBAAgB,GAAC;AAEjB,MAAA,aAAA,GAAgB,UAAW,CAAA,EAAE;;;;"}
+{"version":3,"file":"checkbox2.mjs","sources":["../../../../../../../packages/components/checkbox/src/checkbox.vue"],"sourcesContent":["<template>\n  <a-checkbox\n    :class=\"[ns.b()]\"\n    v-bind=\"props\"\n    v-on=\"emits\"\n  >\n    <slot></slot>\n  </a-checkbox>\n</template>\n<script lang=\"ts\" setup>\nimport { useNamespace } from '@greeks-live-ui/hooks'\nimport { checkboxEmits, checkboxProps } from './checkbox'\ndefineOptions({\n  name: 'GCheckbox',\n})\nconst ns = useNamespace('checkbox')\nconst props = defineProps(checkboxProps)\nconst emits = defineEmits(checkboxEmits)\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAeA,IAAA,MAAA,EAAA,GAAA,YAAA,CAAA,UAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;;"}

package/es/packages/components/checkbox-group/index.mjs

@@ -1,6 +1,6 @@
 import '../../utils/index.mjs';
-import CheckboxGroup from './src/checkbox-group2.mjs';
-export { checkboxGroupEmits, checkboxGroupProps } from './src/checkbox-group.mjs';
+import CheckboxGroup from './src/checkbox-group.mjs';
+export { checkboxGroupEmits, checkboxGroupProps } from './src/checkbox-group2.mjs';
 import { withInstall } from '../../utils/vue/install.mjs';
 
 const GCheckboxGroup = withInstall(CheckboxGroup);