weblogin/trendchart-elements

Web components to generate simple charts representing trends

trendchart-elements's Issues

How can I use this package with svelte?

Wondering if anyone has experience on how I could import this library using svelte.

the tc- tags don't work with the import statement neither the hover tooltip

<script lang="ts">
  import '@weblogin/trendchart-elements';

</script>

<tc-column
	class="h-full w-full p-4 pt-0 [--shape-color:oklch(var(--pc))]"
	values="[12,10,12,4,13,16,14,10,12,11,17,18,16,17,20,14,15,13,12,14]"
	min="0"
	shape-radius="4"
	shape-gap="4"
></tc-column>

Here is a repl to demo the issue:
https://svelte.dev/repl/d56f19987687410dba37ef055124c6e4?version=4.2.0

Thanks!

Capturing click event

Hello! Great library :)

Is it possible to capture a click event? I am trying to execute a function when I click on part of a graph (for example a bar from a bar graph).

Cheers.

Use the library inside a jsx/tsx component

Hi, I would like to ask if is possible in some way to use your library inside a JSX/TSX component. I'm trying to use it in my code but I encountered an error.

To reproduce

1. install the package
   npm install @weblogin/trendchart-elements

2. import a chart
   import { TcLine } from "@weblogin/trendchart-elements";

3. create a component

import { TcColumn } from "@weblogin/trendchart-elements"

export default function Page() {
  return (
    <main>
      <div>
       <TcColumn />
      </div>
    </main>
  )
} 

The error encountered is the following:

'TcColumn' cannot be used as a JSX component.
Its type 'typeof TcColumn' is not a valid JSX element type.
Types of construct signatures are incompatible.
Type 'new () => TcColumn' is not assignable to type 'new (props: any, deprecatedLegacyContext?: any) => Component<any, any, any>'.
Type 'TcColumn' is missing the following properties from type 'Component<any, any, any>': context, setState, forceUpdate, props, and 2 more.