daisyui / react-daisyui

daisyUI components built with React 🌼
http://react.daisyui.com/
MIT License
886 stars 98 forks source link

Stats doesn not work. #446

Open pociej opened 1 month ago

pociej commented 1 month ago

Im using newest version. When i do

import { Stats } from "react-daisyui";

....
        <Stats >
          <Stats.Stat>
            <Stats.Stat.Title>Active</Stats.Stat.Title>
          </Stats.Stat>
        </Stats>

it throws :

React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

because there is no Stats.Stat.Title indeed when i check the build it is typed like this

import React from 'react';
import { IComponentBaseProps } from '../types';
export type StatsProps = React.HTMLAttributes<HTMLDivElement> & IComponentBaseProps & {
    horizontal?: boolean;
    vertical?: boolean;
};
declare const _default: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & IComponentBaseProps & {
    horizontal?: boolean | undefined;
    vertical?: boolean | undefined;
} & React.RefAttributes<HTMLDivElement>> & {
    Stat: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & IComponentBaseProps & React.RefAttributes<HTMLDivElement>> & {
        Item: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & IComponentBaseProps & {
            variant: "title" | "value" | "desc" | "figure" | "actions";
        } & React.RefAttributes<HTMLDivElement>>;
    };
};
export default _default;
dev0T commented 1 month ago

Are you sure you are using the latest version (5.0.1)? The code you pasted from Stat.tsx isn't using the current Stat structure which explains why your attempt isn't working.

pociej commented 1 month ago

@dev0T yep i have version 5.0.0. It uses storybook as usage documentation. Wehn you go to story book and check stats it is exactly like this :

    <Stats {...args} className="shadow">
      <Stats.Stat>
        <Stats.Stat.Title>Total Page Views</Stats.Stat.Title>
        <Stats.Stat.Value>89,400</Stats.Stat.Value>
        <Stats.Stat.Desc>21% more than last month</Stats.Stat.Desc>
      </Stats.Stat>
    </Stats>

Which is same structure i used i believe.

dev0T commented 1 month ago

@dev0T yep i have version 5.0.0. It uses storybook as usage documentation. Wehn you go to story book and check stats it is exactly like this :

    <Stats {...args} className="shadow">
      <Stats.Stat>
        <Stats.Stat.Title>Total Page Views</Stats.Stat.Title>
        <Stats.Stat.Value>89,400</Stats.Stat.Value>
        <Stats.Stat.Desc>21% more than last month</Stats.Stat.Desc>
      </Stats.Stat>
    </Stats>

Which is same structure i used i believe.

The storybook is updated for version 5.0.1 and not for 5.0.0. You need to upgrade your version.