@cupcodev/ui 0.1.0

package/README.md

@@ -0,0 +1,99 @@
+## @cupcode/ui
+
+Design system Cupcode pronto para uso (componentes React + estilos + presets Tailwind).
+
+### Instalação
+
+```bash
+npm install @cupcode/ui
+```
+
+Além do pacote, instale as peer dependencies listadas em `peerDependencies` (React 18, Tailwind 3, Radix UI, etc.). Um comando típico:
+
+```bash
+npm install react react-dom tailwindcss class-variance-authority tailwind-merge lucide-react next-themes react-router-dom \
+cmdk embla-carousel-react input-otp react-day-picker react-resizable-panels recharts sonner vaul \
+@radix-ui/react-accordion @radix-ui/react-alert-dialog @radix-ui/react-aspect-ratio @radix-ui/react-avatar \
+@radix-ui/react-checkbox @radix-ui/react-collapsible @radix-ui/react-context-menu @radix-ui/react-dialog \
+@radix-ui/react-dropdown-menu @radix-ui/react-hover-card @radix-ui/react-label @radix-ui/react-menubar \
+@radix-ui/react-navigation-menu @radix-ui/react-popover @radix-ui/react-progress @radix-ui/react-radio-group \
+@radix-ui/react-scroll-area @radix-ui/react-select @radix-ui/react-separator @radix-ui/react-slider \
+@radix-ui/react-slot @radix-ui/react-switch @radix-ui/react-tabs @radix-ui/react-toast @radix-ui/react-toggle \
+@radix-ui/react-toggle-group @radix-ui/react-tooltip tailwindcss-animate @tailwindcss/typography
+```
+
+### Tailwind
+
+Use o preset disponibilizado pelo pacote:
+
+```js
+// tailwind.config.js
+module.exports = {
+  presets: [require("@cupcode/ui/tailwind-preset.cjs")],
+  content: [
+    "./src/**/*.{ts,tsx}", // ajuste para o seu projeto
+    "./node_modules/@cupcode/ui/dist/**/*.{js,jsx}", // necessário para as classes dos componentes
+  ],
+};
+```
+
+E importe os estilos globais (tokens + reset):
+
+```ts
+import "@cupcode/ui/styles/global.css";
+```
+
+### Uso básico
+
+```tsx
+import { Button } from "@cupcode/ui";
+
+export default function Example() {
+  return <Button variant="default">Oi Cupcode</Button>;
+}
+```
+
+Todos os componentes Cupcode e shadcn/ui base são reexportados de `@cupcode/ui`. Exemplo:
+
+```ts
+import { NavbarCupcode, ThemeToggle, Card } from "@cupcode/ui";
+```
+
+Para importações segmentadas, há submódulos como `@cupcode/ui/charts`, que expõe apenas os componentes de gráficos/carrossel.
+
+### Tema / Dark mode
+
+O `ThemeToggle` depende de [next-themes](https://github.com/pacocoursey/next-themes). Adicione o provider na raiz do app:
+
+```tsx
+import { ThemeProvider } from "next-themes";
+
+export function App() {
+  return (
+    <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
+      {/* sua aplicação */}
+    </ThemeProvider>
+  );
+}
+
+No Next.js (app router), coloque o provider em `layout.tsx`; em Vite/CRA, envolva a raiz.
+
+### Peers
+
+| Pacote | Versão mínima | Uso no DS |
+| --- | --- | --- |
+| `react`, `react-dom` | ^18.3.1 | base dos componentes |
+| `tailwindcss` | ^3.4.17 | util classes + preset |
+| `class-variance-authority`, `tailwind-merge` | ^0.7.1 / ^2.6.0 | variantes e merge de classes |
+| `lucide-react` | ^0.462.0 | ícones |
+| `next-themes` | ^0.3.0 | controle de tema (ThemeToggle) |
+| `@radix-ui/*` | conforme `package.json` | primitives dos componentes shadcn |
+| `cmdk`, `embla-carousel-react`, `react-day-picker`, `input-otp`, `react-resizable-panels`, `recharts`, `sonner`, `vaul` | conforme `package.json` | componentes específicos (command palette, carousel, calendário, OTP, panels, charts, toasts, drawers) |
+| `tailwindcss-animate`, `@tailwindcss/typography` | ^1.0.7 / ^0.5.16 | plugins usados pelo preset |
+
+Consulte `peerDependencies` para a lista completa ao instalar.
+```
+
+### Tipos e superfícies
+
+Os componentes são exportados via `export { Component }` (ex.: `export { default as DockWrapper }`). Importe sempre de `@cupcode/ui` para garantir que os tipos e estilos correspondentes estejam alinhados.

package/dist/charts-KwYmX5He.d.cts

@@ -0,0 +1,97 @@
+import * as recharts_types_util_payload_getUniqPayload from 'recharts/types/util/payload/getUniqPayload';
+import * as recharts_types_component_Tooltip from 'recharts/types/component/Tooltip';
+import * as recharts_types_util_types from 'recharts/types/util/types';
+import * as recharts_types_component_DefaultTooltipContent from 'recharts/types/component/DefaultTooltipContent';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+import * as RechartsPrimitive from 'recharts';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+import useEmblaCarousel, { UseEmblaCarouselType } from 'embla-carousel-react';
+
+declare const buttonVariants: (props?: {
+    variant?: "link" | "default" | "secondary" | "outline" | "destructive" | "ghost";
+    size?: "default" | "sm" | "lg" | "icon";
+} & class_variance_authority_types.ClassProp) => string;
+interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+    asChild?: boolean;
+}
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+
+type CarouselApi = UseEmblaCarouselType[1];
+type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
+type CarouselOptions = UseCarouselParameters[0];
+type CarouselPlugin = UseCarouselParameters[1];
+type CarouselProps = {
+    opts?: CarouselOptions;
+    plugins?: CarouselPlugin;
+    orientation?: "horizontal" | "vertical";
+    setApi?: (api: CarouselApi) => void;
+};
+declare const Carousel: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & CarouselProps & React.RefAttributes<HTMLDivElement>>;
+declare const CarouselContent: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CarouselItem: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CarouselPrevious: React.ForwardRefExoticComponent<Omit<ButtonProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const CarouselNext: React.ForwardRefExoticComponent<Omit<ButtonProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+
+declare const THEMES: {
+    readonly light: "";
+    readonly dark: ".dark";
+};
+type ChartConfig = {
+    [k in string]: {
+        label?: React.ReactNode;
+        icon?: React.ComponentType;
+    } & ({
+        color?: string;
+        theme?: never;
+    } | {
+        color?: never;
+        theme: Record<keyof typeof THEMES, string>;
+    });
+};
+declare const ChartContainer: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
+    config: ChartConfig;
+    children: React.ComponentProps<typeof RechartsPrimitive.ResponsiveContainer>["children"];
+}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const ChartStyle: ({ id, config }: {
+    id: string;
+    config: ChartConfig;
+}) => react_jsx_runtime.JSX.Element;
+declare const ChartTooltip: typeof RechartsPrimitive.Tooltip;
+declare const ChartTooltipContent: React.ForwardRefExoticComponent<Omit<RechartsPrimitive.DefaultTooltipContentProps<recharts_types_component_DefaultTooltipContent.ValueType, recharts_types_component_DefaultTooltipContent.NameType> & {
+    accessibilityLayer?: boolean;
+    active?: boolean | undefined;
+    includeHidden?: boolean | undefined;
+    allowEscapeViewBox?: recharts_types_util_types.AllowInDimension;
+    animationDuration?: recharts_types_util_types.AnimationDuration;
+    animationEasing?: recharts_types_util_types.AnimationTiming;
+    content?: recharts_types_component_Tooltip.ContentType<recharts_types_component_DefaultTooltipContent.ValueType, recharts_types_component_DefaultTooltipContent.NameType>;
+    coordinate?: Partial<recharts_types_util_types.Coordinate>;
+    cursor?: boolean | React.ReactElement | React.SVGProps<SVGElement>;
+    filterNull?: boolean;
+    defaultIndex?: number;
+    isAnimationActive?: boolean;
+    offset?: number;
+    payloadUniqBy?: recharts_types_util_payload_getUniqPayload.UniqueOption<recharts_types_component_DefaultTooltipContent.Payload<recharts_types_component_DefaultTooltipContent.ValueType, recharts_types_component_DefaultTooltipContent.NameType>>;
+    position?: Partial<recharts_types_util_types.Coordinate>;
+    reverseDirection?: recharts_types_util_types.AllowInDimension;
+    shared?: boolean;
+    trigger?: "hover" | "click";
+    useTranslate3d?: boolean;
+    viewBox?: recharts_types_util_types.CartesianViewBox;
+    wrapperStyle?: React.CSSProperties;
+} & React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
+    hideLabel?: boolean;
+    hideIndicator?: boolean;
+    indicator?: "line" | "dot" | "dashed";
+    nameKey?: string;
+    labelKey?: string;
+}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const ChartLegend: typeof RechartsPrimitive.Legend;
+declare const ChartLegendContent: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & Pick<RechartsPrimitive.LegendProps, "verticalAlign" | "payload"> & {
+    hideIcon?: boolean;
+    nameKey?: string;
+}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+
+export { type ButtonProps as B, type CarouselApi as C, Button as a, buttonVariants as b, Carousel as c, CarouselContent as d, CarouselItem as e, CarouselPrevious as f, CarouselNext as g, ChartContainer as h, ChartTooltip as i, ChartTooltipContent as j, ChartLegend as k, ChartLegendContent as l, ChartStyle as m, type ChartConfig as n };

package/dist/charts-KwYmX5He.d.ts

@@ -0,0 +1,97 @@
+import * as recharts_types_util_payload_getUniqPayload from 'recharts/types/util/payload/getUniqPayload';
+import * as recharts_types_component_Tooltip from 'recharts/types/component/Tooltip';
+import * as recharts_types_util_types from 'recharts/types/util/types';
+import * as recharts_types_component_DefaultTooltipContent from 'recharts/types/component/DefaultTooltipContent';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+import * as RechartsPrimitive from 'recharts';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+import useEmblaCarousel, { UseEmblaCarouselType } from 'embla-carousel-react';
+
+declare const buttonVariants: (props?: {
+    variant?: "link" | "default" | "secondary" | "outline" | "destructive" | "ghost";
+    size?: "default" | "sm" | "lg" | "icon";
+} & class_variance_authority_types.ClassProp) => string;
+interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+    asChild?: boolean;
+}
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+
+type CarouselApi = UseEmblaCarouselType[1];
+type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
+type CarouselOptions = UseCarouselParameters[0];
+type CarouselPlugin = UseCarouselParameters[1];
+type CarouselProps = {
+    opts?: CarouselOptions;
+    plugins?: CarouselPlugin;
+    orientation?: "horizontal" | "vertical";
+    setApi?: (api: CarouselApi) => void;
+};
+declare const Carousel: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & CarouselProps & React.RefAttributes<HTMLDivElement>>;
+declare const CarouselContent: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CarouselItem: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CarouselPrevious: React.ForwardRefExoticComponent<Omit<ButtonProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const CarouselNext: React.ForwardRefExoticComponent<Omit<ButtonProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+
+declare const THEMES: {
+    readonly light: "";
+    readonly dark: ".dark";
+};
+type ChartConfig = {
+    [k in string]: {
+        label?: React.ReactNode;
+        icon?: React.ComponentType;
+    } & ({
+        color?: string;
+        theme?: never;
+    } | {
+        color?: never;
+        theme: Record<keyof typeof THEMES, string>;
+    });
+};
+declare const ChartContainer: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
+    config: ChartConfig;
+    children: React.ComponentProps<typeof RechartsPrimitive.ResponsiveContainer>["children"];
+}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const ChartStyle: ({ id, config }: {
+    id: string;
+    config: ChartConfig;
+}) => react_jsx_runtime.JSX.Element;
+declare const ChartTooltip: typeof RechartsPrimitive.Tooltip;
+declare const ChartTooltipContent: React.ForwardRefExoticComponent<Omit<RechartsPrimitive.DefaultTooltipContentProps<recharts_types_component_DefaultTooltipContent.ValueType, recharts_types_component_DefaultTooltipContent.NameType> & {
+    accessibilityLayer?: boolean;
+    active?: boolean | undefined;
+    includeHidden?: boolean | undefined;
+    allowEscapeViewBox?: recharts_types_util_types.AllowInDimension;
+    animationDuration?: recharts_types_util_types.AnimationDuration;
+    animationEasing?: recharts_types_util_types.AnimationTiming;
+    content?: recharts_types_component_Tooltip.ContentType<recharts_types_component_DefaultTooltipContent.ValueType, recharts_types_component_DefaultTooltipContent.NameType>;
+    coordinate?: Partial<recharts_types_util_types.Coordinate>;
+    cursor?: boolean | React.ReactElement | React.SVGProps<SVGElement>;
+    filterNull?: boolean;
+    defaultIndex?: number;
+    isAnimationActive?: boolean;
+    offset?: number;
+    payloadUniqBy?: recharts_types_util_payload_getUniqPayload.UniqueOption<recharts_types_component_DefaultTooltipContent.Payload<recharts_types_component_DefaultTooltipContent.ValueType, recharts_types_component_DefaultTooltipContent.NameType>>;
+    position?: Partial<recharts_types_util_types.Coordinate>;
+    reverseDirection?: recharts_types_util_types.AllowInDimension;
+    shared?: boolean;
+    trigger?: "hover" | "click";
+    useTranslate3d?: boolean;
+    viewBox?: recharts_types_util_types.CartesianViewBox;
+    wrapperStyle?: React.CSSProperties;
+} & React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
+    hideLabel?: boolean;
+    hideIndicator?: boolean;
+    indicator?: "line" | "dot" | "dashed";
+    nameKey?: string;
+    labelKey?: string;
+}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const ChartLegend: typeof RechartsPrimitive.Legend;
+declare const ChartLegendContent: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & Pick<RechartsPrimitive.LegendProps, "verticalAlign" | "payload"> & {
+    hideIcon?: boolean;
+    nameKey?: string;
+}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+
+export { type ButtonProps as B, type CarouselApi as C, Button as a, buttonVariants as b, Carousel as c, CarouselContent as d, CarouselItem as e, CarouselPrevious as f, CarouselNext as g, ChartContainer as h, ChartTooltip as i, ChartTooltipContent as j, ChartLegend as k, ChartLegendContent as l, ChartStyle as m, type ChartConfig as n };