Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Tooltip not working in Next.js + Mantine #205

Open
YunusEmreAlps opened this issue Jul 13, 2023 · 4 comments
Open

Tooltip not working in Next.js + Mantine #205

YunusEmreAlps opened this issue Jul 13, 2023 · 4 comments

Comments

@YunusEmreAlps
Copy link

Hello,

I hope you're well and everything is good with you.

I'm using this library with mantine + next.js. Everything working good but tooltip feature not working. How can I activate this feature in my code?

               <CalendarHeatmap
                  startDate={
                    currentYear.startDate
                  }
                  endDate={
                    currentYear.endDate
                  }
                  values={
                    pastShellsbyDate && pastShellsbyDate?.length > 0
                      ? pastShellsbyDate?.map((s: any) => {
                          return {
                            date: moment(s?.started_at).isValid()
                              ? moment(s?.started_at).format("YYYY-MM-DD")
                              : moment().format("YYYY-MM-DD"),
                            count: s?.shells?.length ?? 1,
                          };
                        })
                      : []
                  }
                  showWeekdayLabels={false}
                  tooltipDataAttrs={(value: any) => {
                    return {
                      "data-tip": `${value.date} has count: ${value.count}`,
                    };
                  }}
                  showOutOfRangeDays={true}
                  classForValue	={(value: any) => {
                    if (!value) {
                      return "color-empty";
                    } else if (value.count < 4) {
                      return `color-gitlab-${value.count}`;
                    } else {
                      return `color-gitlab-4`;
                    }
                  }}
                  monthLabels	= {[
                    tp("january_short"),
                    tp("february_short"),
                    tp("march_short"),
                    tp("april_short"),
                    tp("may_short"),
                    tp("june_short"),
                    tp("july_short"),
                    tp("august_short"),
                    tp("september_short"),
                    tp("october_short"),
                    tp("november_short"),
                    tp("december_short"),
                  ]}
                />

Thank you very much.
Best regards,

@punit-mistry
Copy link

facing same problem in the next js any updates on this ?

@veerviren
Copy link

+1 tooltip not working for me too

@jackfriks
Copy link

not working for me either

@shivamka1
Copy link

shivamka1 commented Apr 1, 2024

Let me know if this works for you guys! #208

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants