@archytechtor/ui 0.0.0-stage → 0.1.0

package/dist/components/button-group/button-group.d.ts

@@ -0,0 +1,20 @@
+import { ButtonGroupPropsT, ButtonGroupSeparatorPropsT, ButtonGroupTextPropsT } from "./types.js";
+/**
+ * Группа кнопок: связанные кнопки, поля и списки вплотную с общей рамкой
+ * @param props - пропсы группы
+ * @returns div с role="group"
+ */
+export declare function ButtonGroup({ className, orientation, ...props }: ButtonGroupPropsT): import("react").JSX.Element;
+/**
+ * Текст в группе: подпись или префикс в серой плашке
+ * @param props - пропсы текста
+ * @returns div
+ */
+export declare function ButtonGroupText({ className, render, ...props }: ButtonGroupTextPropsT): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+/**
+ * Разделитель в группе: линия между кнопками без рамки (например, secondary).
+ * Без orientation идёт поперёк группы: в горизонтальной — вертикальная линия, в вертикальной — горизонтальная
+ * @param props - пропсы разделителя
+ * @returns div
+ */
+export declare function ButtonGroupSeparator({ className, orientation, ...props }: ButtonGroupSeparatorPropsT): import("react").JSX.Element;

package/dist/components/button-group/button-group.js

@@ -0,0 +1,62 @@
+"use client";
+import { cn } from "../../lib/utils.js";
+import { Separator } from "../separator/separator.js";
+import { buttonGroupVariants } from "./types.js";
+import { jsx } from "react/jsx-runtime";
+import { mergeProps } from "@base-ui/react/merge-props";
+import { createContext, useContext } from "react";
+import { useRender } from "@base-ui/react/use-render";
+// src/components/button-group/button-group.tsx
+/** Ориентация ближайшей группы: разделитель внутри поворачивается поперёк неё */
+const OrientationContext = createContext("horizontal");
+/**
+* Группа кнопок: связанные кнопки, поля и списки вплотную с общей рамкой
+* @param props - пропсы группы
+* @returns div с role="group"
+*/
+function ButtonGroup({ className, orientation, ...props }) {
+	const classes = cn(buttonGroupVariants({ orientation }), className);
+	return /* @__PURE__ */ jsx(OrientationContext, {
+		value: orientation ?? "horizontal",
+		children: /* @__PURE__ */ jsx("div", {
+			role: "group",
+			"data-slot": "button-group",
+			"data-orientation": orientation,
+			className: classes,
+			...props
+		})
+	});
+}
+/**
+* Текст в группе: подпись или префикс в серой плашке
+* @param props - пропсы текста
+* @returns div
+*/
+function ButtonGroupText({ className, render, ...props }) {
+	const classes = cn("flex", "items-center", "gap-2", "rounded-lg", "border", "bg-muted", "px-2.5", "text-sm", "font-medium", "[&_svg]:pointer-events-none", "[&_svg:not([class*=size-])]:size-4", "group-data-[orientation=vertical]/button-group:min-h-8", "group-data-[orientation=vertical]/button-group:justify-center", className);
+	return useRender({
+		defaultTagName: "div",
+		render,
+		props: mergeProps({
+			"data-slot": "button-group-text",
+			className: classes
+		}, props)
+	});
+}
+/**
+* Разделитель в группе: линия между кнопками без рамки (например, secondary).
+* Без orientation идёт поперёк группы: в горизонтальной — вертикальная линия, в вертикальной — горизонтальная
+* @param props - пропсы разделителя
+* @returns div
+*/
+function ButtonGroupSeparator({ className, orientation, ...props }) {
+	const acrossGroup = useContext(OrientationContext) === "vertical" ? "horizontal" : "vertical";
+	const classes = cn("relative", "self-stretch", "bg-input", "data-horizontal:mx-px", "data-horizontal:w-auto", "data-vertical:my-px", "data-vertical:h-auto", className);
+	return /* @__PURE__ */ jsx(Separator, {
+		"data-slot": "button-group-separator",
+		orientation: orientation ?? acrossGroup,
+		className: classes,
+		...props
+	});
+}
+export { ButtonGroup, ButtonGroupSeparator, ButtonGroupText };

package/dist/components/button-group/index.d.ts

@@ -0,0 +1,3 @@
+import { ButtonGroupPropsT, ButtonGroupSeparatorPropsT, ButtonGroupTextPropsT, buttonGroupVariants } from "./types.js";
+import { ButtonGroup, ButtonGroupSeparator, ButtonGroupText } from "./button-group.js";
+export { ButtonGroup, type ButtonGroupPropsT, ButtonGroupSeparator, type ButtonGroupSeparatorPropsT, ButtonGroupText, type ButtonGroupTextPropsT, buttonGroupVariants };

package/dist/components/button-group/index.js

@@ -0,0 +1,3 @@
+import { buttonGroupVariants } from "./types.js";
+import { ButtonGroup, ButtonGroupSeparator, ButtonGroupText } from "./button-group.js";
+export { ButtonGroup, ButtonGroupSeparator, ButtonGroupText, buttonGroupVariants };

package/dist/components/button-group/types.d.ts

@@ -0,0 +1,30 @@
+import { SeparatorPropsT } from "../separator/types.js";
+import { VariantProps } from "class-variance-authority";
+import { ComponentProps } from "react";
+import { useRender } from "@base-ui/react/use-render";
+/**
+ * Стили группы кнопок: ориентация.
+ * Экспортируются, чтобы оформить группой другой элемент: buttonGroupVariants({ orientation: 'vertical' }).
+ */
+export declare const buttonGroupVariants: (props?: ({
+  orientation?: "horizontal" | "vertical" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+/**
+ * Варианты стилей группы
+ */
+export type ButtonGroupVariantsT = VariantProps<typeof buttonGroupVariants>;
+/**
+ * Пропсы группы кнопок
+ */
+export type ButtonGroupPropsT = ComponentProps<'div'> & {
+  /** Ориентация: horizontal — в ряд, vertical — столбиком */
+  orientation?: ButtonGroupVariantsT['orientation'];
+};
+/**
+ * Пропсы текста в группе
+ */
+export type ButtonGroupTextPropsT = useRender.ComponentProps<'div'>;
+/**
+ * Пропсы разделителя в группе
+ */
+export type ButtonGroupSeparatorPropsT = SeparatorPropsT;

package/dist/components/button-group/types.js

@@ -0,0 +1,19 @@
+import { cva } from "class-variance-authority";
+// src/components/button-group/types.ts
+/**
+* Стили группы кнопок: ориентация.
+* Экспортируются, чтобы оформить группой другой элемент: buttonGroupVariants({ orientation: 'vertical' }).
+*/
+const buttonGroupVariants = cva([
+	"group/button-group flex w-fit items-stretch *:focus-visible:relative *:focus-visible:z-10",
+	"[&>[data-slot=select-trigger]:not([class*=w-])]:w-fit [&>input]:flex-1",
+	"has-[>[data-slot=button-group]]:gap-2",
+	"has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-lg"
+], {
+	variants: { orientation: {
+		horizontal: ["[&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0", "[&>*:not(:last-child)]:rounded-r-none [&>[data-slot]:not(:has(~[data-slot]))]:rounded-r-lg!"],
+		vertical: ["flex-col [&>*:not(:first-child)]:rounded-t-none [&>*:not(:first-child)]:border-t-0", "[&>*:not(:last-child)]:rounded-b-none [&>[data-slot]:not(:has(~[data-slot]))]:rounded-b-lg!"]
+	} },
+	defaultVariants: { orientation: "horizontal" }
+});
+export { buttonGroupVariants };

package/dist/components/calendar/calendar.d.ts

@@ -0,0 +1,15 @@
+import { CalendarDayButtonPropsT, CalendarPropsT } from "./types.js";
+/**
+ * Календарь: выбор даты, нескольких дат или периода. Неделя начинается с понедельника,
+ * названия месяцев и дней — на русском
+ * @param props - пропсы DayPicker; mode — single, multiple или range
+ * @returns div
+ */
+export declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, locale, weekStartsOn, formatters, components, ...props }: CalendarPropsT): import("react").JSX.Element;
+/**
+ * Кнопка дня: подсветка выбранного дня и периода. Используется в components.DayButton,
+ * чтобы дописать в день свой текст
+ * @param props - пропсы кнопки от DayPicker; day и modifiers — день и его состояния
+ * @returns кнопка
+ */
+export declare function CalendarDayButton({ className, day, modifiers, locale, ...props }: CalendarDayButtonPropsT): import("react").JSX.Element;

package/dist/components/calendar/calendar.js

@@ -0,0 +1,157 @@
+"use client";
+import { cn } from "../../lib/utils.js";
+import "../../lib/locale.js";
+import { buttonVariants } from "../button/types.js";
+import { Button } from "../button/button.js";
+import { ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon } from "lucide-react";
+import { jsx } from "react/jsx-runtime";
+import { useEffect, useRef } from "react";
+import { DayPicker, getDefaultClassNames, useDayPicker } from "react-day-picker";
+import { ru } from "react-day-picker/locale/ru";
+// src/components/calendar/calendar.tsx
+/**
+* Корень календаря с data-slot
+* @param props - пропсы корня от DayPicker
+* @returns div
+*/
+function CalendarRoot({ className, rootRef, ...props }) {
+	const classes = cn(className);
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "calendar",
+		ref: rootRef,
+		className: classes,
+		...props
+	});
+}
+/**
+* Стрелка навигации и выпадающих списков
+* @param props - пропсы стрелки от DayPicker; orientation — направление
+* @returns иконка
+*/
+function CalendarChevron({ className, orientation, size: _size, ...props }) {
+	const classes = cn("size-4", className);
+	if (orientation === "left") return /* @__PURE__ */ jsx(ChevronLeftIcon, {
+		className: classes,
+		...props
+	});
+	if (orientation === "right") return /* @__PURE__ */ jsx(ChevronRightIcon, {
+		className: classes,
+		...props
+	});
+	return /* @__PURE__ */ jsx(ChevronDownIcon, {
+		className: classes,
+		...props
+	});
+}
+/**
+* Ячейка с номером недели
+* @param props - пропсы ячейки от DayPicker
+* @returns td
+*/
+function CalendarWeekNumber({ children, week: _week, ...props }) {
+	return /* @__PURE__ */ jsx("td", {
+		...props,
+		children: /* @__PURE__ */ jsx("div", {
+			className: "flex size-(--cell-size) items-center justify-center text-center",
+			children
+		})
+	});
+}
+/**
+* Календарь: выбор даты, нескольких дат или периода. Неделя начинается с понедельника,
+* названия месяцев и дней — на русском
+* @param props - пропсы DayPicker; mode — single, multiple или range
+* @returns div
+*/
+function Calendar({ className, classNames, showOutsideDays = true, captionLayout = "label", buttonVariant = "ghost", locale = ru, weekStartsOn: weekStartsOn$1 = 1, formatters, components, ...props }) {
+	const defaultClassNames = getDefaultClassNames();
+	const classes = cn("group/calendar", "bg-background", "p-2", "[--cell-radius:var(--radius-md)]", "[--cell-size:--spacing(7)]", "in-data-[slot=card-content]:bg-transparent", "in-data-[slot=popover-content]:bg-transparent", className);
+	const captionLabelClasses = captionLayout === "label" ? "text-sm" : "flex h-6 items-center gap-1 rounded-(--cell-radius) pr-1 pl-1.5 text-sm [&>svg]:size-3.5 [&>svg]:text-muted-foreground";
+	const dayEdgeClasses = props.showWeekNumber ? "[&:nth-child(2)[data-selected=true]_button]:rounded-l-(--cell-radius)" : "[&:first-child[data-selected=true]_button]:rounded-l-(--cell-radius)";
+	const navButtonClasses = cn(buttonVariants({ variant: buttonVariant }), "size-(--cell-size)", "p-0", "select-none", "aria-disabled:opacity-50");
+	/**
+	* Короткое название месяца в выпадающем списке: «янв.»
+	* @param date - месяц
+	* @returns название
+	*/
+	const formatMonthDropdown = (date) => date.toLocaleString(locale?.code, { month: "short" });
+	return /* @__PURE__ */ jsx(DayPicker, {
+		showOutsideDays,
+		className: classes,
+		captionLayout,
+		locale,
+		weekStartsOn: weekStartsOn$1,
+		formatters: {
+			formatMonthDropdown,
+			...formatters
+		},
+		classNames: {
+			root: cn("w-fit", defaultClassNames.root),
+			months: cn("relative", "flex", "flex-col", "gap-4", "md:flex-row", defaultClassNames.months),
+			month: cn("flex", "w-full", "flex-col", "gap-4", defaultClassNames.month),
+			nav: cn("absolute", "inset-x-0", "top-0", "flex", "w-full", "items-center", "justify-between", "gap-1", defaultClassNames.nav),
+			button_previous: cn(navButtonClasses, defaultClassNames.button_previous),
+			button_next: cn(navButtonClasses, defaultClassNames.button_next),
+			month_caption: cn("flex", "h-(--cell-size)", "w-full", "items-center", "justify-center", "px-(--cell-size)", defaultClassNames.month_caption),
+			dropdowns: cn("flex", "h-(--cell-size)", "w-full", "items-center", "justify-center", "gap-1.5", "text-sm", "font-medium", defaultClassNames.dropdowns),
+			dropdown_root: cn("relative", "rounded-(--cell-radius)", "border", "border-input", "keyboard:has-focus:border-ring", "keyboard:has-focus:ring-3", "keyboard:has-focus:ring-ring/50", defaultClassNames.dropdown_root),
+			dropdown: cn("absolute", "inset-0", "bg-popover", "opacity-0", defaultClassNames.dropdown),
+			caption_label: cn("font-medium", "select-none", captionLabelClasses, defaultClassNames.caption_label),
+			month_grid: cn("w-full", "border-collapse", defaultClassNames.month_grid),
+			weekdays: cn("flex", defaultClassNames.weekdays),
+			weekday: cn("flex-1", "rounded-(--cell-radius)", "text-[0.8rem]", "font-normal", "text-muted-foreground", "select-none", defaultClassNames.weekday),
+			week: cn("mt-2", "flex", "w-full", defaultClassNames.week),
+			week_number_header: cn("w-(--cell-size)", "select-none", defaultClassNames.week_number_header),
+			week_number: cn("text-[0.8rem]", "text-muted-foreground", "select-none", defaultClassNames.week_number),
+			day: cn("group/day", "relative", "aspect-square", "h-full", "w-full", "rounded-(--cell-radius)", "p-0", "text-center", "select-none", "[&:last-child[data-selected=true]_button]:rounded-r-(--cell-radius)", dayEdgeClasses, defaultClassNames.day),
+			range_start: cn("relative", "isolate", "z-0", "rounded-l-(--cell-radius)", "bg-muted", "after:absolute", "after:inset-y-0", "after:right-0", "after:w-4", "after:bg-muted", defaultClassNames.range_start),
+			range_middle: cn("rounded-none", defaultClassNames.range_middle),
+			range_end: cn("relative", "isolate", "z-0", "rounded-r-(--cell-radius)", "bg-muted", "after:absolute", "after:inset-y-0", "after:left-0", "after:w-4", "after:bg-muted", defaultClassNames.range_end),
+			today: cn("rounded-(--cell-radius)", "bg-muted", "text-foreground", "data-[selected=true]:rounded-none", defaultClassNames.today),
+			outside: cn("text-muted-foreground", "aria-selected:text-muted-foreground", defaultClassNames.outside),
+			disabled: cn("text-muted-foreground", "opacity-50", defaultClassNames.disabled),
+			hidden: cn("invisible", defaultClassNames.hidden),
+			...classNames
+		},
+		components: {
+			Root: CalendarRoot,
+			Chevron: CalendarChevron,
+			DayButton: CalendarDayButton,
+			WeekNumber: CalendarWeekNumber,
+			...components
+		},
+		...props
+	});
+}
+/**
+* Кнопка дня: подсветка выбранного дня и периода. Используется в components.DayButton,
+* чтобы дописать в день свой текст
+* @param props - пропсы кнопки от DayPicker; day и modifiers — день и его состояния
+* @returns кнопка
+*/
+function CalendarDayButton({ className, day, modifiers, locale, ...props }) {
+	const { dayPickerProps } = useDayPicker();
+	const dayLocale = locale ?? dayPickerProps.locale;
+	const defaultClassNames = getDefaultClassNames();
+	const ref = useRef(null);
+	const isRange = modifiers.range_start || modifiers.range_end || modifiers.range_middle;
+	const isSelectedSingle = modifiers.selected && !isRange;
+	const dayLabel = day.date.toLocaleDateString(dayLocale?.code);
+	const classes = cn("relative", "isolate", "z-10", "flex", "aspect-square", "size-auto", "w-full", "min-w-(--cell-size)", "flex-col", "gap-1", "border-0", "leading-none", "font-normal", "group-data-[focused=true]/day:relative", "group-data-[focused=true]/day:z-10", "keyboard:group-data-[focused=true]/day:border-ring", "keyboard:group-data-[focused=true]/day:ring-[3px]", "keyboard:group-data-[focused=true]/day:ring-ring/50", "data-[range-end=true]:rounded-(--cell-radius)", "data-[range-end=true]:rounded-r-(--cell-radius)", "data-[range-end=true]:bg-primary", "data-[range-end=true]:text-primary-foreground", "data-[range-middle=true]:rounded-none", "data-[range-middle=true]:bg-muted", "data-[range-middle=true]:text-foreground", "data-[range-start=true]:rounded-(--cell-radius)", "data-[range-start=true]:rounded-l-(--cell-radius)", "data-[range-start=true]:bg-primary", "data-[range-start=true]:text-primary-foreground", "data-[selected-single=true]:bg-primary", "data-[selected-single=true]:text-primary-foreground", "dark:hover:text-foreground", "[&>span]:text-xs", "[&>span]:opacity-70", defaultClassNames.day, className);
+	useEffect(() => {
+		if (modifiers.focused) ref.current?.focus();
+	}, [modifiers.focused]);
+	return /* @__PURE__ */ jsx(Button, {
+		ref,
+		variant: "ghost",
+		size: "icon",
+		"data-day": dayLabel,
+		"data-selected-single": isSelectedSingle,
+		"data-range-start": modifiers.range_start,
+		"data-range-end": modifiers.range_end,
+		"data-range-middle": modifiers.range_middle,
+		className: classes,
+		...props
+	});
+}
+export { Calendar, CalendarDayButton };

package/dist/components/calendar/index.d.ts

@@ -0,0 +1,3 @@
+import { CalendarDayButtonPropsT, CalendarPropsT, CalendarRangeT } from "./types.js";
+import { Calendar, CalendarDayButton } from "./calendar.js";
+export { Calendar, CalendarDayButton, type CalendarDayButtonPropsT, type CalendarPropsT, type CalendarRangeT };

package/dist/components/calendar/index.js

@@ -0,0 +1 @@
+export { Calendar, CalendarDayButton } from "./calendar.js";

package/dist/components/calendar/types.d.ts

@@ -0,0 +1,21 @@
+import { ButtonPropsT } from "../button/types.js";
+import { ComponentProps } from "react";
+import { DateRange, DayButtonProps, DayPicker, DayPickerLocale } from "react-day-picker";
+/**
+ * Выбранный период: from — начало, to — конец
+ */
+export type CalendarRangeT = DateRange;
+/**
+ * Пропсы календаря
+ */
+export type CalendarPropsT = ComponentProps<typeof DayPicker> & {
+  /** Вариант кнопок «назад» и «вперёд». По умолчанию ghost */
+  buttonVariant?: ButtonPropsT['variant'];
+};
+/**
+ * Пропсы кнопки дня
+ */
+export type CalendarDayButtonPropsT = DayButtonProps & {
+  /** Локаль для data-day. По умолчанию — локаль календаря */
+  locale?: Partial<DayPickerLocale>;
+};

package/dist/components/card/card.d.ts

@@ -0,0 +1,43 @@
+import { CardActionPropsT, CardContentPropsT, CardDescriptionPropsT, CardFooterPropsT, CardHeaderPropsT, CardPropsT, CardTitlePropsT } from "./types.js";
+/**
+ * Карточка: контейнер с шапкой, содержимым и подвалом
+ * @param props - пропсы карточки
+ * @returns карточка
+ */
+export declare function Card({ className, size, ...props }: CardPropsT): import("react").JSX.Element;
+/**
+ * Шапка карточки: заголовок, описание и действие справа
+ * @param props - пропсы шапки
+ * @returns шапка
+ */
+export declare function CardHeader({ className, ...props }: CardHeaderPropsT): import("react").JSX.Element;
+/**
+ * Заголовок карточки
+ * @param props - пропсы заголовка
+ * @returns заголовок
+ */
+export declare function CardTitle({ className, ...props }: CardTitlePropsT): import("react").JSX.Element;
+/**
+ * Описание карточки: поясняющий текст под заголовком
+ * @param props - пропсы описания
+ * @returns описание
+ */
+export declare function CardDescription({ className, ...props }: CardDescriptionPropsT): import("react").JSX.Element;
+/**
+ * Действие в правом верхнем углу шапки: кнопка, бейдж
+ * @param props - пропсы действия
+ * @returns блок действия
+ */
+export declare function CardAction({ className, ...props }: CardActionPropsT): import("react").JSX.Element;
+/**
+ * Содержимое карточки
+ * @param props - пропсы содержимого
+ * @returns содержимое
+ */
+export declare function CardContent({ className, ...props }: CardContentPropsT): import("react").JSX.Element;
+/**
+ * Подвал карточки: действия и дополнительная информация
+ * @param props - пропсы подвала
+ * @returns подвал
+ */
+export declare function CardFooter({ className, ...props }: CardFooterPropsT): import("react").JSX.Element;

package/dist/components/card/card.js

@@ -0,0 +1,97 @@
+import { cn } from "../../lib/utils.js";
+import { cardVariants } from "./types.js";
+import { jsx } from "react/jsx-runtime";
+// src/components/card/card.tsx
+/**
+* Карточка: контейнер с шапкой, содержимым и подвалом
+* @param props - пропсы карточки
+* @returns карточка
+*/
+function Card({ className, size = "default", ...props }) {
+	const classes = cn(cardVariants({ size }), className);
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card",
+		"data-size": size,
+		className: classes,
+		...props
+	});
+}
+/**
+* Шапка карточки: заголовок, описание и действие справа
+* @param props - пропсы шапки
+* @returns шапка
+*/
+function CardHeader({ className, ...props }) {
+	const classes = cn("group/card-header", "@container/card-header", "grid", "auto-rows-min", "items-start", "gap-1", "rounded-t-xl", "px-(--card-spacing)", "has-data-[slot=card-action]:grid-cols-[1fr_auto]", "has-data-[slot=card-description]:grid-rows-[auto_auto]", "[.border-b]:pb-(--card-spacing)", className);
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card-header",
+		className: classes,
+		...props
+	});
+}
+/**
+* Заголовок карточки
+* @param props - пропсы заголовка
+* @returns заголовок
+*/
+function CardTitle({ className, ...props }) {
+	const classes = cn("text-base", "leading-snug", "font-medium", "group-data-[size=sm]/card:text-sm", className);
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card-title",
+		className: classes,
+		...props
+	});
+}
+/**
+* Описание карточки: поясняющий текст под заголовком
+* @param props - пропсы описания
+* @returns описание
+*/
+function CardDescription({ className, ...props }) {
+	const classes = cn("text-sm", "text-muted-foreground", className);
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card-description",
+		className: classes,
+		...props
+	});
+}
+/**
+* Действие в правом верхнем углу шапки: кнопка, бейдж
+* @param props - пропсы действия
+* @returns блок действия
+*/
+function CardAction({ className, ...props }) {
+	const classes = cn("col-start-2", "row-span-2", "row-start-1", "self-start", "justify-self-end", className);
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card-action",
+		className: classes,
+		...props
+	});
+}
+/**
+* Содержимое карточки
+* @param props - пропсы содержимого
+* @returns содержимое
+*/
+function CardContent({ className, ...props }) {
+	const classes = cn("px-(--card-spacing)", className);
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card-content",
+		className: classes,
+		...props
+	});
+}
+/**
+* Подвал карточки: действия и дополнительная информация
+* @param props - пропсы подвала
+* @returns подвал
+*/
+function CardFooter({ className, ...props }) {
+	const classes = cn("flex", "items-center", "rounded-b-xl", "border-t", "bg-muted/50", "p-(--card-spacing)", className);
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card-footer",
+		className: classes,
+		...props
+	});
+}
+export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };

package/dist/components/card/index.d.ts

@@ -0,0 +1,3 @@
+import { CardActionPropsT, CardContentPropsT, CardDescriptionPropsT, CardFooterPropsT, CardHeaderPropsT, CardPropsT, CardTitlePropsT, cardVariants } from "./types.js";
+import { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "./card.js";
+export { Card, CardAction, type CardActionPropsT, CardContent, type CardContentPropsT, CardDescription, type CardDescriptionPropsT, CardFooter, type CardFooterPropsT, CardHeader, type CardHeaderPropsT, type CardPropsT, CardTitle, type CardTitlePropsT, cardVariants };

package/dist/components/card/index.js

@@ -0,0 +1,3 @@
+import { cardVariants } from "./types.js";
+import { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "./card.js";
+export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, cardVariants };

package/dist/components/card/types.d.ts

@@ -0,0 +1,44 @@
+import { VariantProps } from "class-variance-authority";
+import { ComponentProps } from "react";
+/**
+ * Стили карточки: размер задаёт отступы через CSS-переменную --card-spacing.
+ * Свои отступы — классом: className={'[--card-spacing:--spacing(6)]'}.
+ */
+export declare const cardVariants: (props?: ({
+  size?: "default" | "sm" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+/**
+ * Размеры карточки
+ */
+export type CardVariantsT = VariantProps<typeof cardVariants>;
+/**
+ * Пропсы карточки
+ */
+export type CardPropsT = ComponentProps<'div'> & {
+  /** Размер: default — отступы 16px, sm — компактные отступы 12px */
+  size?: CardVariantsT['size'];
+};
+/**
+ * Пропсы шапки карточки
+ */
+export type CardHeaderPropsT = ComponentProps<'div'>;
+/**
+ * Пропсы заголовка карточки
+ */
+export type CardTitlePropsT = ComponentProps<'div'>;
+/**
+ * Пропсы описания карточки
+ */
+export type CardDescriptionPropsT = ComponentProps<'div'>;
+/**
+ * Пропсы действия в шапке карточки
+ */
+export type CardActionPropsT = ComponentProps<'div'>;
+/**
+ * Пропсы содержимого карточки
+ */
+export type CardContentPropsT = ComponentProps<'div'>;
+/**
+ * Пропсы подвала карточки
+ */
+export type CardFooterPropsT = ComponentProps<'div'>;

package/dist/components/card/types.js

@@ -0,0 +1,19 @@
+import { cva } from "class-variance-authority";
+// src/components/card/types.ts
+/**
+* Стили карточки: размер задаёт отступы через CSS-переменную --card-spacing.
+* Свои отступы — классом: className={'[--card-spacing:--spacing(6)]'}.
+*/
+const cardVariants = cva([
+	"group/card flex flex-col gap-(--card-spacing) overflow-hidden rounded-xl bg-card py-(--card-spacing)",
+	"text-sm text-card-foreground ring-1 ring-foreground/10",
+	"has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0",
+	"*:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl"
+], {
+	variants: { size: {
+		default: "[--card-spacing:--spacing(4)]",
+		sm: "[--card-spacing:--spacing(3)]"
+	} },
+	defaultVariants: { size: "default" }
+});
+export { cardVariants };

package/dist/components/carousel/carousel.d.ts

@@ -0,0 +1,36 @@
+import { CarouselContentPropsT, CarouselContextI, CarouselItemPropsT, CarouselNextPropsT, CarouselPreviousPropsT, CarouselPropsT } from "./types.js";
+/**
+ * Состояние карусели: API, направление, функции прокрутки
+ * @returns состояние из Carousel
+ */
+export declare function useCarousel(): CarouselContextI;
+/**
+ * Карусель на Embla: слайды листаются свайпом, кнопками и стрелками клавиатуры
+ * @param props - пропсы карусели
+ * @returns div с role="region"
+ */
+export declare function Carousel({ orientation, opts, setApi, plugins, className, children, ...props }: CarouselPropsT): import("react").JSX.Element;
+/**
+ * Лента слайдов: область прокрутки с CarouselItem внутри
+ * @param props - пропсы ленты; className уходит на внутренний flex-контейнер
+ * @returns div
+ */
+export declare function CarouselContent({ className, ...props }: CarouselContentPropsT): import("react").JSX.Element;
+/**
+ * Слайд: по умолчанию во всю ширину; basis-1/2, basis-1/3 — несколько слайдов в ряд
+ * @param props - пропсы слайда
+ * @returns div с role="group"
+ */
+export declare function CarouselItem({ className, ...props }: CarouselItemPropsT): import("react").JSX.Element;
+/**
+ * Кнопка «назад»: круглая, слева от карусели, неактивна на первом слайде
+ * @param props - пропсы кнопки; по умолчанию variant="outline", size="icon-sm"
+ * @returns кнопка
+ */
+export declare function CarouselPrevious({ className, variant, size, label, onClick, ...props }: CarouselPreviousPropsT): import("react").JSX.Element;
+/**
+ * Кнопка «вперёд»: круглая, справа от карусели, неактивна на последнем слайде
+ * @param props - пропсы кнопки; по умолчанию variant="outline", size="icon-sm"
+ * @returns кнопка
+ */
+export declare function CarouselNext({ className, variant, size, label, onClick, ...props }: CarouselNextPropsT): import("react").JSX.Element;