chore: wip

This commit is contained in:
zernonia 2024-03-23 10:02:49 +08:00
parent dc219b4046
commit 8e85823d32
7 changed files with 19 additions and 11 deletions

View File

@ -28,9 +28,9 @@ const sourceLink = 'https://github.com/radix-vue/shadcn-vue/tree/dev/'
> >
{{ docsGroup.title }} {{ docsGroup.title }}
<Badge v-if="docsGroup.label" class="ml-2"> <span v-if="docsGroup.label" class="ml-2 font-normal rounded-md bg-[#adfa1d] px-1.5 py-0.5 text-xs leading-none text-[#000000] no-underline group-hover:no-underline">
{{ docsGroup.label }} {{ docsGroup.label }}
</Badge> </span>
</h4> </h4>
<div <div
@ -80,9 +80,9 @@ const sourceLink = 'https://github.com/radix-vue/shadcn-vue/tree/dev/'
<h1 class="scroll-m-20 text-4xl font-bold tracking-tight"> <h1 class="scroll-m-20 text-4xl font-bold tracking-tight">
{{ frontmatter.title }} {{ frontmatter.title }}
</h1> </h1>
<Badge v-if="frontmatter.label"> <span v-if="frontmatter.label" class="ml-2 rounded-md bg-[#adfa1d] px-1.5 py-0.5 text-xs leading-none text-[#000000] no-underline group-hover:no-underline">
{{ frontmatter.label }} {{ frontmatter.label }}
</Badge> </span>
</div> </div>
<p class="text-lg text-muted-foreground"> <p class="text-lg text-muted-foreground">
{{ frontmatter.description }} {{ frontmatter.description }}

View File

@ -28,6 +28,9 @@
--ring: 240 5% 64.9%; --ring: 240 5% 64.9%;
--radius: 0.5rem; --radius: 0.5rem;
--vis-font-family: inherit !important;
--vis-area-stroke-width: 2px !important;
--vis-donut-central-label-text-color: hsl(var(--muted-foreground)) !important;
--vis-tooltip-background-color: none !important; --vis-tooltip-background-color: none !important;
--vis-tooltip-border-color: none !important; --vis-tooltip-border-color: none !important;
--vis-tooltip-text-color: none !important; --vis-tooltip-text-color: none !important;

View File

@ -2,7 +2,7 @@
import { VisCrosshair, VisTooltip } from '@unovis/vue' import { VisCrosshair, VisTooltip } from '@unovis/vue'
import type { BulletLegendItemInterface } from '@unovis/ts' import type { BulletLegendItemInterface } from '@unovis/ts'
import { omit } from '@unovis/ts' import { omit } from '@unovis/ts'
import { createApp } from 'vue' import { createApp, watch } from 'vue'
import { ChartTooltip } from '@/lib/registry/default/ui/chart' import { ChartTooltip } from '@/lib/registry/default/ui/chart'
const props = withDefaults(defineProps<{ const props = withDefaults(defineProps<{
@ -15,7 +15,7 @@ const props = withDefaults(defineProps<{
// Use weakmap to store reference to each datapoint for Tooltip // Use weakmap to store reference to each datapoint for Tooltip
const wm = new WeakMap() const wm = new WeakMap()
function template(d: any, ...a: any) { function template(d: any) {
if (wm.has(d)) { if (wm.has(d)) {
return wm.get(d) return wm.get(d)
} }

View File

@ -3,6 +3,8 @@ export { default as ChartSingleTooltip } from './ChartSingleTooltip.vue'
export { default as ChartLegend } from './ChartLegend.vue' export { default as ChartLegend } from './ChartLegend.vue'
export { default as ChartCrosshair } from './ChartCrosshair.vue' export { default as ChartCrosshair } from './ChartCrosshair.vue'
const SECONDARY_COLOR = '153 48% 49%'
export function defaultColors(count: number = 3) { export function defaultColors(count: number = 3) {
const quotient = Math.floor(count / 2) const quotient = Math.floor(count / 2)
const remainder = count % 2 const remainder = count % 2
@ -11,6 +13,6 @@ export function defaultColors(count: number = 3) {
const secondaryCount = quotient const secondaryCount = quotient
return [ return [
...Array.from(Array(primaryCount).keys()).map(i => `hsl(var(--primary) / ${1 - (1 / primaryCount) * i})`), ...Array.from(Array(primaryCount).keys()).map(i => `hsl(var(--primary) / ${1 - (1 / primaryCount) * i})`),
...Array.from(Array(secondaryCount).keys()).map(i => `hsl(var(--border) / ${1 - (1 / secondaryCount) * i})`), ...Array.from(Array(secondaryCount).keys()).map(i => `hsl(${SECONDARY_COLOR} / ${1 - (1 / secondaryCount) * i})`),
] ]
} }

View File

@ -100,6 +100,7 @@ const totalValue = computed(() => props.data.reduce((prev, curr) => {
:events="{ :events="{
[Donut.selectors.segment]: { [Donut.selectors.segment]: {
click: (d: Data, ev: PointerEvent, i: number, elements: HTMLElement[]) => { click: (d: Data, ev: PointerEvent, i: number, elements: HTMLElement[]) => {
console.log(d, ev, i, elements)
if (d?.data?.[index] === activeSegmentKey) { if (d?.data?.[index] === activeSegmentKey) {
activeSegmentKey = undefined activeSegmentKey = undefined
elements.forEach(el => el.style.opacity = '1') elements.forEach(el => el.style.opacity = '1')

View File

@ -2,7 +2,7 @@
import { VisCrosshair, VisTooltip } from '@unovis/vue' import { VisCrosshair, VisTooltip } from '@unovis/vue'
import type { BulletLegendItemInterface } from '@unovis/ts' import type { BulletLegendItemInterface } from '@unovis/ts'
import { omit } from '@unovis/ts' import { omit } from '@unovis/ts'
import { createApp } from 'vue' import { createApp, watch } from 'vue'
import { ChartTooltip } from '@/lib/registry/new-york/ui/chart' import { ChartTooltip } from '@/lib/registry/new-york/ui/chart'
const props = withDefaults(defineProps<{ const props = withDefaults(defineProps<{
@ -15,7 +15,7 @@ const props = withDefaults(defineProps<{
// Use weakmap to store reference to each datapoint for Tooltip // Use weakmap to store reference to each datapoint for Tooltip
const wm = new WeakMap() const wm = new WeakMap()
function template(d: any, ...a: any) { function template(d: any) {
if (wm.has(d)) { if (wm.has(d)) {
return wm.get(d) return wm.get(d)
} }
@ -34,5 +34,5 @@ function template(d: any, ...a: any) {
<template> <template>
<VisTooltip :horizontal-shift="20" :vertical-shift="20" /> <VisTooltip :horizontal-shift="20" :vertical-shift="20" />
<VisCrosshair :color="colors" :template="template" /> <VisCrosshair :template="template" />
</template> </template>

View File

@ -3,6 +3,8 @@ export { default as ChartSingleTooltip } from './ChartSingleTooltip.vue'
export { default as ChartLegend } from './ChartLegend.vue' export { default as ChartLegend } from './ChartLegend.vue'
export { default as ChartCrosshair } from './ChartCrosshair.vue' export { default as ChartCrosshair } from './ChartCrosshair.vue'
const SECONDARY_COLOR = '153 48% 49%'
export function defaultColors(count: number = 3) { export function defaultColors(count: number = 3) {
const quotient = Math.floor(count / 2) const quotient = Math.floor(count / 2)
const remainder = count % 2 const remainder = count % 2
@ -11,6 +13,6 @@ export function defaultColors(count: number = 3) {
const secondaryCount = quotient const secondaryCount = quotient
return [ return [
...Array.from(Array(primaryCount).keys()).map(i => `hsl(var(--primary) / ${1 - (1 / primaryCount) * i})`), ...Array.from(Array(primaryCount).keys()).map(i => `hsl(var(--primary) / ${1 - (1 / primaryCount) * i})`),
...Array.from(Array(secondaryCount).keys()).map(i => `hsl(var(--border) / ${1 - (1 / secondaryCount) * i})`), ...Array.from(Array(secondaryCount).keys()).map(i => `hsl(${SECONDARY_COLOR} / ${1 - (1 / secondaryCount) * i})`),
] ]
} }