@lobehub/ui 5.51.2 → 5.53.0

package/es/base-ui/DatePicker/calendar.mjs

@@ -0,0 +1,46 @@
+import dayjs from "dayjs";
+//#region src/base-ui/DatePicker/calendar.ts
+const DEFAULT_FORMAT = {
+	date: "MMM D, YYYY",
+	month: "MMMM YYYY",
+	year: "YYYY"
+};
+const getWeekStart = () => {
+	return dayjs.Ls[dayjs.locale()]?.weekStart ?? 0;
+};
+const offsetFromWeekStart = (date, weekStart) => (dayjs(date).day() - weekStart + 7) % 7;
+const buildMonthGrid = (month, weekStart = getWeekStart()) => {
+	const first = dayjs(month).startOf("month");
+	const start = first.subtract(offsetFromWeekStart(first.toDate(), weekStart), "day");
+	return Array.from({ length: 42 }, (_, index) => start.add(index, "day").toDate());
+};
+const getWeekdayLabels = (weekStart = getWeekStart()) => Array.from({ length: 7 }, (_, index) => dayjs().day((weekStart + index) % 7).format("dd"));
+const isSameDay = (a, b) => !!a && !!b && dayjs(a).isSame(b, "day");
+const isDayDisabled = (date, { disabledDate, max, min }) => !!min && dayjs(date).isBefore(min, "day") || !!max && dayjs(date).isAfter(max, "day") || !!disabledDate?.(date);
+const isMonthDisabled = (month, { max, min }) => !!min && dayjs(month).isBefore(min, "month") || !!max && dayjs(month).isAfter(max, "month");
+const isYearDisabled = (year, { max, min }) => !!min && dayjs(year).isBefore(min, "year") || !!max && dayjs(year).isAfter(max, "year");
+const moveDayFocus = (date, key, weekStart = getWeekStart()) => {
+	const current = dayjs(date);
+	const offset = offsetFromWeekStart(date, weekStart);
+	switch (key) {
+		case "ArrowLeft": return current.subtract(1, "day").toDate();
+		case "ArrowRight": return current.add(1, "day").toDate();
+		case "ArrowUp": return current.subtract(7, "day").toDate();
+		case "ArrowDown": return current.add(7, "day").toDate();
+		case "PageUp": return current.subtract(1, "month").toDate();
+		case "PageDown": return current.add(1, "month").toDate();
+		case "Home": return current.subtract(offset, "day").toDate();
+		case "End": return current.add(6 - offset, "day").toDate();
+		default: return null;
+	}
+};
+const orderRange = (a, b) => dayjs(a).isAfter(b, "day") ? [b, a] : [a, b];
+const clampToBounds = (date, { max, min }) => {
+	if (min && dayjs(date).isBefore(min, "day")) return min;
+	if (max && dayjs(date).isAfter(max, "day")) return max;
+	return date;
+};
+//#endregion
+export { DEFAULT_FORMAT, buildMonthGrid, clampToBounds, getWeekStart, getWeekdayLabels, isDayDisabled, isMonthDisabled, isSameDay, isYearDisabled, moveDayFocus, orderRange };
+
+//# sourceMappingURL=calendar.mjs.map

package/es/base-ui/DatePicker/calendar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar.mjs","names":[],"sources":["../../../src/base-ui/DatePicker/calendar.ts"],"sourcesContent":["import dayjs from 'dayjs';\n\nexport type CalendarMode = 'date' | 'month' | 'year';\n\nexport interface DateBounds {\n  disabledDate?: (date: Date) => boolean;\n  max?: Date;\n  min?: Date;\n}\n\nexport const DEFAULT_FORMAT: Record<CalendarMode, string> = {\n  date: 'MMM D, YYYY',\n  month: 'MMMM YYYY',\n  year: 'YYYY',\n};\n\nexport const getWeekStart = (): number => {\n  const locales = (dayjs as unknown as { Ls: Record<string, { weekStart?: number }> }).Ls;\n  return locales[dayjs.locale()]?.weekStart ?? 0;\n};\n\nconst offsetFromWeekStart = (date: Date, weekStart: number) =>\n  (dayjs(date).day() - weekStart + 7) % 7;\n\nexport const buildMonthGrid = (month: Date, weekStart = getWeekStart()): Date[] => {\n  const first = dayjs(month).startOf('month');\n  const start = first.subtract(offsetFromWeekStart(first.toDate(), weekStart), 'day');\n  return Array.from({ length: 42 }, (_, index) => start.add(index, 'day').toDate());\n};\n\nexport const getWeekdayLabels = (weekStart = getWeekStart()): string[] =>\n  Array.from({ length: 7 }, (_, index) =>\n    dayjs()\n      .day((weekStart + index) % 7)\n      .format('dd'),\n  );\n\nexport const isSameDay = (a?: Date | null, b?: Date | null) =>\n  !!a && !!b && dayjs(a).isSame(b, 'day');\n\nexport const isDayDisabled = (date: Date, { disabledDate, max, min }: DateBounds) =>\n  (!!min && dayjs(date).isBefore(min, 'day')) ||\n  (!!max && dayjs(date).isAfter(max, 'day')) ||\n  !!disabledDate?.(date);\n\nexport const isMonthDisabled = (month: Date, { max, min }: DateBounds) =>\n  (!!min && dayjs(month).isBefore(min, 'month')) || (!!max && dayjs(month).isAfter(max, 'month'));\n\nexport const isYearDisabled = (year: Date, { max, min }: DateBounds) =>\n  (!!min && dayjs(year).isBefore(min, 'year')) || (!!max && dayjs(year).isAfter(max, 'year'));\n\nexport const moveDayFocus = (date: Date, key: string, weekStart = getWeekStart()): Date | null => {\n  const current = dayjs(date);\n  const offset = offsetFromWeekStart(date, weekStart);\n  switch (key) {\n    case 'ArrowLeft': {\n      return current.subtract(1, 'day').toDate();\n    }\n    case 'ArrowRight': {\n      return current.add(1, 'day').toDate();\n    }\n    case 'ArrowUp': {\n      return current.subtract(7, 'day').toDate();\n    }\n    case 'ArrowDown': {\n      return current.add(7, 'day').toDate();\n    }\n    case 'PageUp': {\n      return current.subtract(1, 'month').toDate();\n    }\n    case 'PageDown': {\n      return current.add(1, 'month').toDate();\n    }\n    case 'Home': {\n      return current.subtract(offset, 'day').toDate();\n    }\n    case 'End': {\n      return current.add(6 - offset, 'day').toDate();\n    }\n    default: {\n      return null;\n    }\n  }\n};\n\nexport const orderRange = (a: Date, b: Date): [Date, Date] =>\n  dayjs(a).isAfter(b, 'day') ? [b, a] : [a, b];\n\nexport const clampToBounds = (date: Date, { max, min }: DateBounds): Date => {\n  if (min && dayjs(date).isBefore(min, 'day')) return min;\n  if (max && dayjs(date).isAfter(max, 'day')) return max;\n  return date;\n};\n"],"mappings":"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"}

package/es/base-ui/DatePicker/index.d.mts

@@ -0,0 +1,5 @@
+import { CalendarMode } from "./calendar.mjs";
+import { DatePickerProps, DateRangePickerProps, DateRangeValue } from "./type.mjs";
+import DatePicker from "./DatePicker.mjs";
+import DateRangePicker from "./DateRangePicker.mjs";
+export { type CalendarMode, DatePicker, type DatePickerProps, DateRangePicker, type DateRangePickerProps, type DateRangeValue };

package/es/base-ui/DatePicker/style.mjs

@@ -0,0 +1,193 @@
+import { focusRing } from "../focusRing.mjs";
+import { createStaticStyles } from "antd-style";
+//#region src/base-ui/DatePicker/style.ts
+const styles = createStaticStyles(({ css, cssVar }) => ({
+	band: css`
+    background: ${cssVar.colorFillSecondary};
+  `,
+	bandEnd: css`
+    background: linear-gradient(to left, transparent 50%, ${cssVar.colorFillSecondary} 50%);
+  `,
+	bandStart: css`
+    background: linear-gradient(to right, transparent 50%, ${cssVar.colorFillSecondary} 50%);
+  `,
+	calendar: css`
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+    width: 266px;
+  `,
+	cell: css`
+    display: flex;
+    justify-content: center;
+  `,
+	day: css`
+    ${focusRing};
+    cursor: pointer;
+
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    width: 34px;
+    height: 34px;
+    padding: 0;
+    border: 0;
+    border-radius: 50%;
+
+    font: inherit;
+    font-size: 13px;
+    font-variant-numeric: tabular-nums;
+    color: ${cssVar.colorText};
+
+    background: none;
+
+    &:hover:not(:disabled, [aria-pressed='true']) {
+      background: ${cssVar.colorFillTertiary};
+    }
+
+    &:disabled {
+      cursor: not-allowed;
+      color: ${cssVar.colorTextQuaternary};
+    }
+
+    &[data-outside] {
+      color: ${cssVar.colorTextQuaternary};
+    }
+
+    &[data-today] {
+      box-shadow: inset 0 0 0 1px ${cssVar.colorText};
+    }
+
+    &[aria-pressed='true'] {
+      font-weight: 600;
+      color: ${cssVar.colorBgContainer};
+      background: ${cssVar.colorText};
+    }
+  `,
+	footer: css`
+    display: flex;
+    justify-content: center;
+
+    margin-block-start: 12px;
+    padding-block-start: 12px;
+    border-block-start: 1px solid ${cssVar.colorBorderSecondary};
+  `,
+	grid: css`
+    display: grid;
+    grid-template-columns: repeat(7, minmax(0, 1fr));
+    row-gap: 2px;
+  `,
+	header: css`
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-block-end: 4px;
+  `,
+	icon: css`
+    display: inline-flex;
+    flex: none;
+    color: ${cssVar.colorTextTertiary};
+  `,
+	navGroup: css`
+    display: flex;
+    gap: 2px;
+  `,
+	placeholder: css`
+    color: ${cssVar.colorTextPlaceholder};
+  `,
+	range: css`
+    display: flex;
+    gap: 28px;
+  `,
+	rangeHalf: css`
+    min-width: 0;
+    padding-block: 2px;
+
+    &[data-active] {
+      box-shadow: inset 0 -2px 0 ${cssVar.colorText};
+    }
+  `,
+	rangeTrigger: css`
+    display: flex;
+    flex: 1;
+    gap: 8px;
+    align-items: center;
+
+    min-width: 0;
+  `,
+	tile: css`
+    ${focusRing};
+    cursor: pointer;
+
+    height: 40px;
+    padding: 0;
+    border: 0;
+    border-radius: 999px;
+
+    font: inherit;
+    font-size: 14px;
+    color: ${cssVar.colorText};
+
+    background: none;
+
+    &:hover:not(:disabled, [aria-pressed='true']) {
+      background: ${cssVar.colorFillTertiary};
+    }
+
+    &:disabled {
+      cursor: not-allowed;
+      color: ${cssVar.colorTextQuaternary};
+    }
+
+    &[data-today] {
+      box-shadow: inset 0 0 0 1px ${cssVar.colorText};
+    }
+
+    &[aria-pressed='true'] {
+      font-weight: 600;
+      color: ${cssVar.colorBgContainer};
+      background: ${cssVar.colorText};
+    }
+  `,
+	tiles: css`
+    display: grid;
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+    gap: 6px 4px;
+    width: 266px;
+  `,
+	trigger: css`
+    ${focusRing};
+    cursor: pointer;
+
+    display: flex;
+    flex: 1;
+    align-items: center;
+
+    min-width: 0;
+    height: 100%;
+    padding: 0;
+    border: 0;
+
+    font: inherit;
+    color: inherit;
+    text-align: start;
+    white-space: nowrap;
+
+    background: none;
+
+    &:disabled {
+      cursor: not-allowed;
+    }
+  `,
+	weekday: css`
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 20px;
+  `
+}));
+//#endregion
+export { styles };
+
+//# sourceMappingURL=style.mjs.map

package/es/base-ui/DatePicker/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/DatePicker/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nimport { focusRing } from '@/base-ui/focusRing';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  band: css`\n    background: ${cssVar.colorFillSecondary};\n  `,\n  bandEnd: css`\n    background: linear-gradient(to left, transparent 50%, ${cssVar.colorFillSecondary} 50%);\n  `,\n  bandStart: css`\n    background: linear-gradient(to right, transparent 50%, ${cssVar.colorFillSecondary} 50%);\n  `,\n  calendar: css`\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n    width: 266px;\n  `,\n  cell: css`\n    display: flex;\n    justify-content: center;\n  `,\n  day: css`\n    ${focusRing};\n    cursor: pointer;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    width: 34px;\n    height: 34px;\n    padding: 0;\n    border: 0;\n    border-radius: 50%;\n\n    font: inherit;\n    font-size: 13px;\n    font-variant-numeric: tabular-nums;\n    color: ${cssVar.colorText};\n\n    background: none;\n\n    &:hover:not(:disabled, [aria-pressed='true']) {\n      background: ${cssVar.colorFillTertiary};\n    }\n\n    &:disabled {\n      cursor: not-allowed;\n      color: ${cssVar.colorTextQuaternary};\n    }\n\n    &[data-outside] {\n      color: ${cssVar.colorTextQuaternary};\n    }\n\n    &[data-today] {\n      box-shadow: inset 0 0 0 1px ${cssVar.colorText};\n    }\n\n    &[aria-pressed='true'] {\n      font-weight: 600;\n      color: ${cssVar.colorBgContainer};\n      background: ${cssVar.colorText};\n    }\n  `,\n  footer: css`\n    display: flex;\n    justify-content: center;\n\n    margin-block-start: 12px;\n    padding-block-start: 12px;\n    border-block-start: 1px solid ${cssVar.colorBorderSecondary};\n  `,\n  grid: css`\n    display: grid;\n    grid-template-columns: repeat(7, minmax(0, 1fr));\n    row-gap: 2px;\n  `,\n  header: css`\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    margin-block-end: 4px;\n  `,\n  icon: css`\n    display: inline-flex;\n    flex: none;\n    color: ${cssVar.colorTextTertiary};\n  `,\n  navGroup: css`\n    display: flex;\n    gap: 2px;\n  `,\n  placeholder: css`\n    color: ${cssVar.colorTextPlaceholder};\n  `,\n  range: css`\n    display: flex;\n    gap: 28px;\n  `,\n  rangeHalf: css`\n    min-width: 0;\n    padding-block: 2px;\n\n    &[data-active] {\n      box-shadow: inset 0 -2px 0 ${cssVar.colorText};\n    }\n  `,\n  rangeTrigger: css`\n    display: flex;\n    flex: 1;\n    gap: 8px;\n    align-items: center;\n\n    min-width: 0;\n  `,\n  tile: css`\n    ${focusRing};\n    cursor: pointer;\n\n    height: 40px;\n    padding: 0;\n    border: 0;\n    border-radius: 999px;\n\n    font: inherit;\n    font-size: 14px;\n    color: ${cssVar.colorText};\n\n    background: none;\n\n    &:hover:not(:disabled, [aria-pressed='true']) {\n      background: ${cssVar.colorFillTertiary};\n    }\n\n    &:disabled {\n      cursor: not-allowed;\n      color: ${cssVar.colorTextQuaternary};\n    }\n\n    &[data-today] {\n      box-shadow: inset 0 0 0 1px ${cssVar.colorText};\n    }\n\n    &[aria-pressed='true'] {\n      font-weight: 600;\n      color: ${cssVar.colorBgContainer};\n      background: ${cssVar.colorText};\n    }\n  `,\n  tiles: css`\n    display: grid;\n    grid-template-columns: repeat(3, minmax(0, 1fr));\n    gap: 6px 4px;\n    width: 266px;\n  `,\n  trigger: css`\n    ${focusRing};\n    cursor: pointer;\n\n    display: flex;\n    flex: 1;\n    align-items: center;\n\n    min-width: 0;\n    height: 100%;\n    padding: 0;\n    border: 0;\n\n    font: inherit;\n    color: inherit;\n    text-align: start;\n    white-space: nowrap;\n\n    background: none;\n\n    &:disabled {\n      cursor: not-allowed;\n    }\n  `,\n  weekday: css`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    height: 20px;\n  `,\n}));\n"],"mappings":";;;AAIA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,MAAM,GAAG;kBACO,OAAO,mBAAmB;;CAE1C,SAAS,GAAG;4DAC8C,OAAO,mBAAmB;;CAEpF,WAAW,GAAG;6DAC6C,OAAO,mBAAmB;;CAErF,UAAU,GAAG;;;;;;CAMb,MAAM,GAAG;;;;CAIT,KAAK,GAAG;MACJ,UAAU;;;;;;;;;;;;;;;;aAgBH,OAAO,UAAU;;;;;oBAKV,OAAO,kBAAkB;;;;;eAK9B,OAAO,oBAAoB;;;;eAI3B,OAAO,oBAAoB;;;;oCAIN,OAAO,UAAU;;;;;eAKtC,OAAO,iBAAiB;oBACnB,OAAO,UAAU;;;CAGnC,QAAQ,GAAG;;;;;;oCAMuB,OAAO,qBAAqB;;CAE9D,MAAM,GAAG;;;;;CAKT,QAAQ,GAAG;;;;;;CAMX,MAAM,GAAG;;;aAGE,OAAO,kBAAkB;;CAEpC,UAAU,GAAG;;;;CAIb,aAAa,GAAG;aACL,OAAO,qBAAqB;;CAEvC,OAAO,GAAG;;;;CAIV,WAAW,GAAG;;;;;mCAKmB,OAAO,UAAU;;;CAGlD,cAAc,GAAG;;;;;;;;CAQjB,MAAM,GAAG;MACL,UAAU;;;;;;;;;;aAUH,OAAO,UAAU;;;;;oBAKV,OAAO,kBAAkB;;;;;eAK9B,OAAO,oBAAoB;;;;oCAIN,OAAO,UAAU;;;;;eAKtC,OAAO,iBAAiB;oBACnB,OAAO,UAAU;;;CAGnC,OAAO,GAAG;;;;;;CAMV,SAAS,GAAG;MACR,UAAU;;;;;;;;;;;;;;;;;;;;;;;CAuBd,SAAS,GAAG;;;;;;AAMd,EAAE"}

package/es/base-ui/DatePicker/type.d.mts

@@ -0,0 +1,35 @@
+import { InputSize, InputVariant } from "../Input/type.mjs";
+import { CalendarMode } from "./calendar.mjs";
+import { CSSProperties, ReactNode } from "react";
+//#region src/base-ui/DatePicker/type.d.ts
+interface PickerCommonProps {
+  allowClear?: boolean;
+  className?: string;
+  disabled?: boolean;
+  disabledDate?: (date: Date) => boolean;
+  format?: string | ((date: Date) => string);
+  max?: Date;
+  min?: Date;
+  shadow?: boolean;
+  size?: InputSize;
+  style?: CSSProperties;
+  variant?: InputVariant;
+}
+interface DatePickerProps extends PickerCommonProps {
+  defaultValue?: Date | null;
+  footer?: ReactNode;
+  mode?: CalendarMode;
+  onChange?: (date: Date | null) => void;
+  placeholder?: string;
+  value?: Date | null;
+}
+type DateRangeValue = [Date | null, Date | null];
+interface DateRangePickerProps extends PickerCommonProps {
+  defaultValue?: DateRangeValue;
+  onChange?: (range: DateRangeValue) => void;
+  placeholder?: [string, string];
+  value?: DateRangeValue;
+}
+//#endregion
+export { type CalendarMode, DatePickerProps, DateRangePickerProps, DateRangeValue };
+//# sourceMappingURL=type.d.mts.map

package/es/base-ui/Descriptions/Descriptions.d.mts

@@ -0,0 +1,6 @@
+import { DescriptionsProps } from "./type.mjs";
+//#region src/base-ui/Descriptions/Descriptions.d.ts
+declare const Descriptions: import("react").NamedExoticComponent<DescriptionsProps>;
+//#endregion
+export { Descriptions as default };
+//# sourceMappingURL=Descriptions.d.mts.map

package/es/base-ui/Descriptions/Descriptions.mjs

@@ -0,0 +1,62 @@
+"use client";
+import { styles } from "./style.mjs";
+import { Fragment, memo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx } from "antd-style";
+//#region src/base-ui/Descriptions/Descriptions.tsx
+const Descriptions = memo(({ bordered = false, className, classNames, colon = true, column = 1, extra, items, ref, styles: customStyles, title, ...rest }) => {
+	const columnCount = Math.max(1, Math.floor(column));
+	let cursor = 0;
+	const placements = items.map((item) => {
+		const span = Math.min(Math.max(Math.floor(item.span ?? 1), 1), columnCount);
+		if (cursor + span > columnCount) cursor = 0;
+		const start = cursor;
+		cursor = (cursor + span) % columnCount;
+		return {
+			span,
+			start
+		};
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		className: cx(styles.root, className),
+		ref,
+		...rest,
+		children: [(title != null || extra != null) && /* @__PURE__ */ jsxs("div", {
+			className: styles.header,
+			children: [/* @__PURE__ */ jsx("div", {
+				className: styles.title,
+				children: title
+			}), extra != null && /* @__PURE__ */ jsx("div", {
+				className: styles.extra,
+				children: extra
+			})]
+		}), /* @__PURE__ */ jsx("dl", {
+			className: cx(styles.list, bordered && styles.bordered),
+			style: { gridTemplateColumns: `repeat(${columnCount}, auto minmax(0, 1fr))` },
+			children: items.map((item, index) => {
+				const { span, start } = placements[index];
+				const contentStart = String(start * 2 + 2);
+				return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("dt", {
+					className: cx(styles.label, classNames?.label),
+					style: {
+						gridColumn: String(start * 2 + 1),
+						...customStyles?.label
+					},
+					children: [item.label, colon && item.label != null ? ":" : null]
+				}), /* @__PURE__ */ jsx("dd", {
+					className: cx(styles.content, classNames?.content),
+					style: {
+						gridColumn: span > 1 ? `${contentStart} / span ${span * 2 - 1}` : contentStart,
+						...customStyles?.content
+					},
+					children: item.children
+				})] }, item.key ?? index);
+			})
+		})]
+	});
+});
+Descriptions.displayName = "Descriptions";
+//#endregion
+export { Descriptions as default };
+
+//# sourceMappingURL=Descriptions.mjs.map

package/es/base-ui/Descriptions/Descriptions.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Descriptions.mjs","names":[],"sources":["../../../src/base-ui/Descriptions/Descriptions.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { Fragment, memo } from 'react';\n\nimport { styles } from './style';\nimport type { DescriptionsProps } from './type';\n\nconst Descriptions = memo<DescriptionsProps>(\n  ({\n    bordered = false,\n    className,\n    classNames,\n    colon = true,\n    column = 1,\n    extra,\n    items,\n    ref,\n    styles: customStyles,\n    title,\n    ...rest\n  }) => {\n    const columnCount = Math.max(1, Math.floor(column));\n\n    let cursor = 0;\n    const placements = items.map((item) => {\n      const span = Math.min(Math.max(Math.floor(item.span ?? 1), 1), columnCount);\n      if (cursor + span > columnCount) cursor = 0;\n      const start = cursor;\n      cursor = (cursor + span) % columnCount;\n      return { span, start };\n    });\n\n    return (\n      <div className={cx(styles.root, className)} ref={ref} {...rest}>\n        {(title != null || extra != null) && (\n          <div className={styles.header}>\n            <div className={styles.title}>{title}</div>\n            {extra != null && <div className={styles.extra}>{extra}</div>}\n          </div>\n        )}\n        <dl\n          className={cx(styles.list, bordered && styles.bordered)}\n          style={{ gridTemplateColumns: `repeat(${columnCount}, auto minmax(0, 1fr))` }}\n        >\n          {items.map((item, index) => {\n            const { span, start } = placements[index];\n            const contentStart = String(start * 2 + 2);\n\n            return (\n              <Fragment key={item.key ?? index}>\n                <dt\n                  className={cx(styles.label, classNames?.label)}\n                  style={{ gridColumn: String(start * 2 + 1), ...customStyles?.label }}\n                >\n                  {item.label}\n                  {colon && item.label != null ? ':' : null}\n                </dt>\n                <dd\n                  className={cx(styles.content, classNames?.content)}\n                  style={{\n                    gridColumn: span > 1 ? `${contentStart} / span ${span * 2 - 1}` : contentStart,\n                    ...customStyles?.content,\n                  }}\n                >\n                  {item.children}\n                </dd>\n              </Fragment>\n            );\n          })}\n        </dl>\n      </div>\n    );\n  },\n);\n\nDescriptions.displayName = 'Descriptions';\n\nexport default Descriptions;\n"],"mappings":";;;;;;AAQA,MAAM,eAAe,MAClB,EACC,WAAW,OACX,WACA,YACA,QAAQ,MACR,SAAS,GACT,OACA,OACA,KACA,QAAQ,cACR,OACA,GAAG,WACC;CACJ,MAAM,cAAc,KAAK,IAAI,GAAG,KAAK,MAAM,MAAM,CAAC;CAElD,IAAI,SAAS;CACb,MAAM,aAAa,MAAM,KAAK,SAAS;EACrC,MAAM,OAAO,KAAK,IAAI,KAAK,IAAI,KAAK,MAAM,KAAK,QAAQ,CAAC,GAAG,CAAC,GAAG,WAAW;EAC1E,IAAI,SAAS,OAAO,aAAa,SAAS;EAC1C,MAAM,QAAQ;EACd,UAAU,SAAS,QAAQ;EAC3B,OAAO;GAAE;GAAM;EAAM;CACvB,CAAC;CAED,OACE,qBAAC,OAAD;EAAK,WAAW,GAAG,OAAO,MAAM,SAAS;EAAQ;EAAK,GAAI;EAA1D,UAAA,EACI,SAAS,QAAQ,SAAS,SAC1B,qBAAC,OAAD;GAAK,WAAW,OAAO;GAAvB,UAAA,CACE,oBAAC,OAAD;IAAK,WAAW,OAAO;IAAQ,UAAA;GAAW,CAAA,GACzC,SAAS,QAAQ,oBAAC,OAAD;IAAK,WAAW,OAAO;IAAQ,UAAA;GAAW,CAAA,CACzD;EAEP,CAAA,GAAA,oBAAC,MAAD;GACE,WAAW,GAAG,OAAO,MAAM,YAAY,OAAO,QAAQ;GACtD,OAAO,EAAE,qBAAqB,UAAU,YAAY,wBAAwB;GAE3E,UAAA,MAAM,KAAK,MAAM,UAAU;IAC1B,MAAM,EAAE,MAAM,UAAU,WAAW;IACnC,MAAM,eAAe,OAAO,QAAQ,IAAI,CAAC;IAEzC,OACE,qBAAC,UAAD,EAAA,UAAA,CACE,qBAAC,MAAD;KACE,WAAW,GAAG,OAAO,OAAO,YAAY,KAAK;KAC7C,OAAO;MAAE,YAAY,OAAO,QAAQ,IAAI,CAAC;MAAG,GAAG,cAAc;KAAM;KAFrE,UAAA,CAIG,KAAK,OACL,SAAS,KAAK,SAAS,OAAO,MAAM,IACnC;IACJ,CAAA,GAAA,oBAAC,MAAD;KACE,WAAW,GAAG,OAAO,SAAS,YAAY,OAAO;KACjD,OAAO;MACL,YAAY,OAAO,IAAI,GAAG,aAAa,UAAU,OAAO,IAAI,MAAM;MAClE,GAAG,cAAc;KACnB;KAEC,UAAA,KAAK;IACJ,CAAA,CACI,EAAA,GAjBK,KAAK,OAAO,KAiBjB;GAEd,CAAC;EACC,CAAA,CACD;;AAET,CACF;AAEA,aAAa,cAAc"}

package/es/base-ui/Descriptions/index.d.mts

@@ -0,0 +1,3 @@
+import { DescriptionsItem, DescriptionsProps } from "./type.mjs";
+import Descriptions from "./Descriptions.mjs";
+export { type DescriptionsItem, type DescriptionsProps, Descriptions as default };

package/es/base-ui/Descriptions/style.mjs

@@ -0,0 +1,64 @@
+import { createStaticStyles } from "antd-style";
+//#region src/base-ui/Descriptions/style.ts
+const styles = createStaticStyles(({ css, cssVar }) => ({
+	bordered: css`
+    gap: 0;
+    border: 1px solid ${cssVar.colorBorderSecondary};
+    border-block-start: 0;
+    border-radius: ${cssVar.borderRadius};
+
+    & > dt,
+    & > dd {
+      padding-block: 8px;
+      padding-inline: 12px;
+      border-block-start: 1px solid ${cssVar.colorBorderSecondary};
+    }
+
+    & > dt {
+      border-inline-end: 1px solid ${cssVar.colorBorderSecondary};
+      background: ${cssVar.colorFillQuaternary};
+    }
+  `,
+	content: css`
+    min-width: 0;
+    margin: 0;
+    color: ${cssVar.colorText};
+    overflow-wrap: anywhere;
+  `,
+	extra: css`
+    flex: none;
+  `,
+	header: css`
+    display: flex;
+    gap: 12px;
+    align-items: center;
+    justify-content: space-between;
+
+    margin-block-end: 8px;
+  `,
+	label: css`
+    color: ${cssVar.colorTextDescription};
+    white-space: nowrap;
+  `,
+	list: css`
+    display: grid;
+    gap: 6px 12px;
+
+    margin: 0;
+
+    font-size: 13px;
+    line-height: 1.5;
+  `,
+	root: css`
+    min-width: 0;
+  `,
+	title: css`
+    font-size: 14px;
+    font-weight: 600;
+    color: ${cssVar.colorText};
+  `
+}));
+//#endregion
+export { styles };
+
+//# sourceMappingURL=style.mjs.map

package/es/base-ui/Descriptions/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Descriptions/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  bordered: css`\n    gap: 0;\n    border: 1px solid ${cssVar.colorBorderSecondary};\n    border-block-start: 0;\n    border-radius: ${cssVar.borderRadius};\n\n    & > dt,\n    & > dd {\n      padding-block: 8px;\n      padding-inline: 12px;\n      border-block-start: 1px solid ${cssVar.colorBorderSecondary};\n    }\n\n    & > dt {\n      border-inline-end: 1px solid ${cssVar.colorBorderSecondary};\n      background: ${cssVar.colorFillQuaternary};\n    }\n  `,\n  content: css`\n    min-width: 0;\n    margin: 0;\n    color: ${cssVar.colorText};\n    overflow-wrap: anywhere;\n  `,\n  extra: css`\n    flex: none;\n  `,\n  header: css`\n    display: flex;\n    gap: 12px;\n    align-items: center;\n    justify-content: space-between;\n\n    margin-block-end: 8px;\n  `,\n  label: css`\n    color: ${cssVar.colorTextDescription};\n    white-space: nowrap;\n  `,\n  list: css`\n    display: grid;\n    gap: 6px 12px;\n\n    margin: 0;\n\n    font-size: 13px;\n    line-height: 1.5;\n  `,\n  root: css`\n    min-width: 0;\n  `,\n  title: css`\n    font-size: 14px;\n    font-weight: 600;\n    color: ${cssVar.colorText};\n  `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,UAAU,GAAG;;wBAES,OAAO,qBAAqB;;qBAE/B,OAAO,aAAa;;;;;;sCAMH,OAAO,qBAAqB;;;;qCAI7B,OAAO,qBAAqB;oBAC7C,OAAO,oBAAoB;;;CAG7C,SAAS,GAAG;;;aAGD,OAAO,UAAU;;;CAG5B,OAAO,GAAG;;;CAGV,QAAQ,GAAG;;;;;;;;CAQX,OAAO,GAAG;aACC,OAAO,qBAAqB;;;CAGvC,MAAM,GAAG;;;;;;;;;CAST,MAAM,GAAG;;;CAGT,OAAO,GAAG;;;aAGC,OAAO,UAAU;;AAE9B,EAAE"}

package/es/base-ui/Descriptions/type.d.mts

@@ -0,0 +1,28 @@
+import { CSSProperties, ComponentProps, Key, ReactNode, Ref } from "react";
+//#region src/base-ui/Descriptions/type.d.ts
+interface DescriptionsItem {
+  children?: ReactNode;
+  key?: Key;
+  label?: ReactNode;
+  span?: number;
+}
+interface DescriptionsProps extends Omit<ComponentProps<'div'>, 'title'> {
+  bordered?: boolean;
+  classNames?: {
+    content?: string;
+    label?: string;
+  };
+  colon?: boolean;
+  column?: number;
+  extra?: ReactNode;
+  items: DescriptionsItem[];
+  ref?: Ref<HTMLDivElement>;
+  styles?: {
+    content?: CSSProperties;
+    label?: CSSProperties;
+  };
+  title?: ReactNode;
+}
+//#endregion
+export { DescriptionsItem, DescriptionsProps };
+//# sourceMappingURL=type.d.mts.map

package/es/base-ui/Divider/Divider.d.mts

@@ -0,0 +1,6 @@
+import { DividerProps } from "./type.mjs";
+//#region src/base-ui/Divider/Divider.d.ts
+declare const Divider: import("react").NamedExoticComponent<DividerProps>;
+//#endregion
+export { Divider as default };
+//# sourceMappingURL=Divider.d.mts.map

package/es/base-ui/Divider/Divider.mjs

@@ -0,0 +1,30 @@
+"use client";
+import { styles } from "./style.mjs";
+import { memo } from "react";
+import { jsx } from "react/jsx-runtime";
+import { cx } from "antd-style";
+import { Separator } from "@base-ui/react/separator";
+//#region src/base-ui/Divider/Divider.tsx
+const Divider = memo(({ children, className, dashed = false, orientation = "horizontal", ref, ...rest }) => {
+	if (children != null && orientation === "horizontal") return /* @__PURE__ */ jsx(Separator, {
+		className: cx(styles.withText, dashed && styles.dashed, className),
+		orientation: "horizontal",
+		ref,
+		...rest,
+		children: /* @__PURE__ */ jsx("span", {
+			className: styles.text,
+			children
+		})
+	});
+	return /* @__PURE__ */ jsx(Separator, {
+		orientation,
+		ref,
+		className: cx(orientation === "vertical" ? styles.vertical : styles.horizontal, dashed && styles.dashed, className),
+		...rest
+	});
+});
+Divider.displayName = "Divider";
+//#endregion
+export { Divider as default };
+
+//# sourceMappingURL=Divider.mjs.map

package/es/base-ui/Divider/Divider.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Divider.mjs","names":[],"sources":["../../../src/base-ui/Divider/Divider.tsx"],"sourcesContent":["'use client';\n\nimport { Separator } from '@base-ui/react/separator';\nimport { cx } from 'antd-style';\nimport { memo } from 'react';\n\nimport { styles } from './style';\nimport type { DividerProps } from './type';\n\nconst Divider = memo<DividerProps>(\n  ({ children, className, dashed = false, orientation = 'horizontal', ref, ...rest }) => {\n    if (children != null && orientation === 'horizontal') {\n      return (\n        <Separator\n          className={cx(styles.withText, dashed && styles.dashed, className)}\n          orientation=\"horizontal\"\n          ref={ref}\n          {...rest}\n        >\n          <span className={styles.text}>{children}</span>\n        </Separator>\n      );\n    }\n\n    return (\n      <Separator\n        orientation={orientation}\n        ref={ref}\n        className={cx(\n          orientation === 'vertical' ? styles.vertical : styles.horizontal,\n          dashed && styles.dashed,\n          className,\n        )}\n        {...rest}\n      />\n    );\n  },\n);\n\nDivider.displayName = 'Divider';\n\nexport default Divider;\n"],"mappings":";;;;;;;AASA,MAAM,UAAU,MACb,EAAE,UAAU,WAAW,SAAS,OAAO,cAAc,cAAc,KAAK,GAAG,WAAW;CACrF,IAAI,YAAY,QAAQ,gBAAgB,cACtC,OACE,oBAAC,WAAD;EACE,WAAW,GAAG,OAAO,UAAU,UAAU,OAAO,QAAQ,SAAS;EACjE,aAAY;EACP;EACL,GAAI;EAEJ,UAAA,oBAAC,QAAD;GAAM,WAAW,OAAO;GAAO;EAAe,CAAA;CACrC,CAAA;CAIf,OACE,oBAAC,WAAD;EACe;EACR;EACL,WAAW,GACT,gBAAgB,aAAa,OAAO,WAAW,OAAO,YACtD,UAAU,OAAO,QACjB,SACF;EACA,GAAI;CACL,CAAA;AAEL,CACF;AAEA,QAAQ,cAAc"}

package/es/base-ui/Divider/index.d.mts

@@ -0,0 +1,3 @@
+import { DividerOrientation, DividerProps } from "./type.mjs";
+import Divider from "./Divider.mjs";
+export { type DividerOrientation, type DividerProps, Divider as default };

package/es/base-ui/Divider/style.mjs

@@ -0,0 +1,59 @@
+import { createStaticStyles } from "antd-style";
+//#region src/base-ui/Divider/style.ts
+const styles = createStaticStyles(({ css, cssVar }) => ({
+	dashed: css`
+    border-style: dashed;
+
+    &::before,
+    &::after {
+      border-block-start-style: dashed;
+    }
+  `,
+	horizontal: css`
+    flex-shrink: 0;
+
+    width: 100%;
+    height: 0;
+    margin: 0;
+    border: 0;
+    border-block-start: 1px solid ${cssVar.colorBorderSecondary};
+  `,
+	text: css`
+    flex: none;
+    font-size: 12px;
+    line-height: 1.5;
+    color: ${cssVar.colorTextDescription};
+  `,
+	vertical: css`
+    display: inline-block;
+    flex-shrink: 0;
+    align-self: center;
+
+    width: 0;
+    height: 1em;
+    margin: 0;
+    border: 0;
+    border-inline-start: 1px solid ${cssVar.colorBorderSecondary};
+
+    vertical-align: middle;
+  `,
+	withText: css`
+    display: flex;
+    gap: 12px;
+    align-items: center;
+
+    width: 100%;
+    margin: 0;
+
+    &::before,
+    &::after {
+      content: '';
+      flex: 1;
+      border-block-start: 1px solid ${cssVar.colorBorderSecondary};
+    }
+  `
+}));
+//#endregion
+export { styles };
+
+//# sourceMappingURL=style.mjs.map

package/es/base-ui/Divider/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Divider/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  dashed: css`\n    border-style: dashed;\n\n    &::before,\n    &::after {\n      border-block-start-style: dashed;\n    }\n  `,\n  horizontal: css`\n    flex-shrink: 0;\n\n    width: 100%;\n    height: 0;\n    margin: 0;\n    border: 0;\n    border-block-start: 1px solid ${cssVar.colorBorderSecondary};\n  `,\n  text: css`\n    flex: none;\n    font-size: 12px;\n    line-height: 1.5;\n    color: ${cssVar.colorTextDescription};\n  `,\n  vertical: css`\n    display: inline-block;\n    flex-shrink: 0;\n    align-self: center;\n\n    width: 0;\n    height: 1em;\n    margin: 0;\n    border: 0;\n    border-inline-start: 1px solid ${cssVar.colorBorderSecondary};\n\n    vertical-align: middle;\n  `,\n  withText: css`\n    display: flex;\n    gap: 12px;\n    align-items: center;\n\n    width: 100%;\n    margin: 0;\n\n    &::before,\n    &::after {\n      content: '';\n      flex: 1;\n      border-block-start: 1px solid ${cssVar.colorBorderSecondary};\n    }\n  `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,QAAQ,GAAG;;;;;;;;CAQX,YAAY,GAAG;;;;;;;oCAOmB,OAAO,qBAAqB;;CAE9D,MAAM,GAAG;;;;aAIE,OAAO,qBAAqB;;CAEvC,UAAU,GAAG;;;;;;;;;qCASsB,OAAO,qBAAqB;;;;CAI/D,UAAU,GAAG;;;;;;;;;;;;sCAYuB,OAAO,qBAAqB;;;AAGlE,EAAE"}

package/es/base-ui/Divider/type.d.mts

@@ -0,0 +1,12 @@
+import { ComponentProps, ReactNode, Ref } from "react";
+//#region src/base-ui/Divider/type.d.ts
+type DividerOrientation = 'horizontal' | 'vertical';
+interface DividerProps extends Omit<ComponentProps<'div'>, 'children'> {
+  children?: ReactNode;
+  dashed?: boolean;
+  orientation?: DividerOrientation;
+  ref?: Ref<HTMLDivElement>;
+}
+//#endregion
+export { DividerOrientation, DividerProps };
+//# sourceMappingURL=type.d.mts.map