@jinmi/ui 0.0.0-stage → 6.0.1

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

@@ -0,0 +1,43 @@
+"use client";
+import { rootVariants } from "../Input/style.mjs";
+import ClearButton from "../Input/ClearButton.mjs";
+import { panelStyles } from "../panelStyles.mjs";
+import { PopoverPopup, PopoverPortal, PopoverPositioner, PopoverRoot, PopoverTriggerElement } from "../Popover/atoms.mjs";
+import { memo, useRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx, useThemeMode } from "antd-style";
+//#region src/base-ui/DatePicker/PickerShell.tsx
+const PickerShell = memo(({ children, className, disabled, icon, onClear, onOpenChange, open, shadow, showClear, size = "middle", style, trigger, variant }) => {
+	const { isDarkMode } = useThemeMode();
+	const anchorRef = useRef(null);
+	const popupRef = useRef(null);
+	return /* @__PURE__ */ jsxs("div", {
+		"data-disabled": disabled ? "" : void 0,
+		ref: anchorRef,
+		style,
+		className: cx(rootVariants({
+			shadow,
+			size,
+			variant: variant || (isDarkMode ? "filled" : "outlined")
+		}), className),
+		children: [/* @__PURE__ */ jsxs(PopoverRoot, {
+			open,
+			onOpenChange: (next) => !disabled && onOpenChange(next),
+			children: [/* @__PURE__ */ jsx(PopoverTriggerElement, { children: trigger }), /* @__PURE__ */ jsx(PopoverPortal, { children: /* @__PURE__ */ jsx(PopoverPositioner, {
+				anchor: anchorRef,
+				placement: "bottomLeft",
+				children: /* @__PURE__ */ jsx(PopoverPopup, {
+					className: panelStyles.popup,
+					ref: popupRef,
+					initialFocus: () => popupRef.current?.querySelector("[data-focus-target]") ?? true,
+					children
+				})
+			}) })]
+		}), showClear && !disabled ? /* @__PURE__ */ jsx(ClearButton, { onClear }) : icon]
+	});
+});
+PickerShell.displayName = "PickerShell";
+//#endregion
+export { PickerShell as default };
+
+//# sourceMappingURL=PickerShell.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PickerShell.mjs","names":[],"sources":["../../../src/base-ui/DatePicker/PickerShell.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { cx, useThemeMode } from 'antd-style';\r\nimport { type CSSProperties, memo, type ReactElement, type ReactNode, useRef } from 'react';\r\n\r\nimport ClearButton from '@/base-ui/Input/ClearButton';\r\nimport { rootVariants } from '@/base-ui/Input/style';\r\nimport type { InputSize, InputVariant } from '@/base-ui/Input/type';\r\nimport { panelStyles } from '@/base-ui/panelStyles';\r\nimport {\r\n  PopoverPopup,\r\n  PopoverPortal,\r\n  PopoverPositioner,\r\n  PopoverRoot,\r\n  PopoverTriggerElement,\r\n} from '@/base-ui/Popover';\r\n\r\nexport interface PickerShellProps {\r\n  children: ReactNode;\r\n  className?: string;\r\n  disabled?: boolean;\r\n  icon: ReactNode;\r\n  onClear: () => void;\r\n  onOpenChange: (open: boolean) => void;\r\n  open: boolean;\r\n  shadow?: boolean;\r\n  showClear: boolean;\r\n  size?: InputSize;\r\n  style?: CSSProperties;\r\n  trigger: ReactElement;\r\n  variant?: InputVariant;\r\n}\r\n\r\nconst PickerShell = memo<PickerShellProps>(\r\n  ({\r\n    children,\r\n    className,\r\n    disabled,\r\n    icon,\r\n    onClear,\r\n    onOpenChange,\r\n    open,\r\n    shadow,\r\n    showClear,\r\n    size = 'middle',\r\n    style,\r\n    trigger,\r\n    variant,\r\n  }) => {\r\n    const { isDarkMode } = useThemeMode();\r\n    const anchorRef = useRef<HTMLDivElement>(null);\r\n    const popupRef = useRef<HTMLDivElement>(null);\r\n\r\n    return (\r\n      <div\r\n        data-disabled={disabled ? '' : undefined}\r\n        ref={anchorRef}\r\n        style={style}\r\n        className={cx(\r\n          rootVariants({ shadow, size, variant: variant || (isDarkMode ? 'filled' : 'outlined') }),\r\n          className,\r\n        )}\r\n      >\r\n        <PopoverRoot open={open} onOpenChange={(next) => !disabled && onOpenChange(next)}>\r\n          <PopoverTriggerElement>{trigger}</PopoverTriggerElement>\r\n          <PopoverPortal>\r\n            <PopoverPositioner anchor={anchorRef} placement=\"bottomLeft\">\r\n              <PopoverPopup\r\n                className={panelStyles.popup}\r\n                ref={popupRef}\r\n                initialFocus={() =>\r\n                  popupRef.current?.querySelector<HTMLElement>('[data-focus-target]') ?? true\r\n                }\r\n              >\r\n                {children}\r\n              </PopoverPopup>\r\n            </PopoverPositioner>\r\n          </PopoverPortal>\r\n        </PopoverRoot>\r\n        {showClear && !disabled ? <ClearButton onClear={onClear} /> : icon}\r\n      </div>\r\n    );\r\n  },\r\n);\r\n\r\nPickerShell.displayName = 'PickerShell';\r\n\r\nexport default PickerShell;\r\n"],"mappings":";;;;;;;;;AAiCA,MAAM,cAAc,MACjB,EACC,UACA,WACA,UACA,MACA,SACA,cACA,MACA,QACA,WACA,OAAO,UACP,OACA,SACA,cACI;CACJ,MAAM,EAAE,eAAe,aAAa;CACpC,MAAM,YAAY,OAAuB,IAAI;CAC7C,MAAM,WAAW,OAAuB,IAAI;CAE5C,OACE,qBAAC,OAAD;EACE,iBAAe,WAAW,KAAK,KAAA;EAC/B,KAAK;EACE;EACP,WAAW,GACT,aAAa;GAAE;GAAQ;GAAM,SAAS,YAAY,aAAa,WAAW;EAAY,CAAC,GACvF,SACF;EAPF,UAAA,CASE,qBAAC,aAAD;GAAmB;GAAM,eAAe,SAAS,CAAC,YAAY,aAAa,IAAI;GAA/E,UAAA,CACE,oBAAC,uBAAD,EAAA,UAAwB,QAA+B,CAAA,GACvD,oBAAC,eAAD,EAAA,UACE,oBAAC,mBAAD;IAAmB,QAAQ;IAAW,WAAU;IAC9C,UAAA,oBAAC,cAAD;KACE,WAAW,YAAY;KACvB,KAAK;KACL,oBACE,SAAS,SAAS,cAA2B,qBAAqB,KAAK;KAGxE;IACW,CAAA;GACG,CAAA,EACN,CAAA,CACJ;EACZ,CAAA,GAAA,aAAa,CAAC,WAAW,oBAAC,aAAD,EAAsB,QAAU,CAAA,IAAI,IAC3D;;AAET,CACF;AAEA,YAAY,cAAc"}

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

@@ -0,0 +1,5 @@
+//#region src/base-ui/DatePicker/calendar.d.ts
+type CalendarMode = 'date' | 'month' | 'year';
+//#endregion
+export { CalendarMode };
+//# sourceMappingURL=calendar.d.mts.map

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';\r\n\r\nexport type CalendarMode = 'date' | 'month' | 'year';\r\n\r\nexport interface DateBounds {\r\n  disabledDate?: (date: Date) => boolean;\r\n  max?: Date;\r\n  min?: Date;\r\n}\r\n\r\nexport const DEFAULT_FORMAT: Record<CalendarMode, string> = {\r\n  date: 'MMM D, YYYY',\r\n  month: 'MMMM YYYY',\r\n  year: 'YYYY',\r\n};\r\n\r\nexport const getWeekStart = (): number => {\r\n  const locales = (dayjs as unknown as { Ls: Record<string, { weekStart?: number }> }).Ls;\r\n  return locales[dayjs.locale()]?.weekStart ?? 0;\r\n};\r\n\r\nconst offsetFromWeekStart = (date: Date, weekStart: number) =>\r\n  (dayjs(date).day() - weekStart + 7) % 7;\r\n\r\nexport const buildMonthGrid = (month: Date, weekStart = getWeekStart()): Date[] => {\r\n  const first = dayjs(month).startOf('month');\r\n  const start = first.subtract(offsetFromWeekStart(first.toDate(), weekStart), 'day');\r\n  return Array.from({ length: 42 }, (_, index) => start.add(index, 'day').toDate());\r\n};\r\n\r\nexport const getWeekdayLabels = (weekStart = getWeekStart()): string[] =>\r\n  Array.from({ length: 7 }, (_, index) =>\r\n    dayjs()\r\n      .day((weekStart + index) % 7)\r\n      .format('dd'),\r\n  );\r\n\r\nexport const isSameDay = (a?: Date | null, b?: Date | null) =>\r\n  !!a && !!b && dayjs(a).isSame(b, 'day');\r\n\r\nexport const isDayDisabled = (date: Date, { disabledDate, max, min }: DateBounds) =>\r\n  (!!min && dayjs(date).isBefore(min, 'day')) ||\r\n  (!!max && dayjs(date).isAfter(max, 'day')) ||\r\n  !!disabledDate?.(date);\r\n\r\nexport const isMonthDisabled = (month: Date, { max, min }: DateBounds) =>\r\n  (!!min && dayjs(month).isBefore(min, 'month')) || (!!max && dayjs(month).isAfter(max, 'month'));\r\n\r\nexport const isYearDisabled = (year: Date, { max, min }: DateBounds) =>\r\n  (!!min && dayjs(year).isBefore(min, 'year')) || (!!max && dayjs(year).isAfter(max, 'year'));\r\n\r\nexport const moveDayFocus = (date: Date, key: string, weekStart = getWeekStart()): Date | null => {\r\n  const current = dayjs(date);\r\n  const offset = offsetFromWeekStart(date, weekStart);\r\n  switch (key) {\r\n    case 'ArrowLeft': {\r\n      return current.subtract(1, 'day').toDate();\r\n    }\r\n    case 'ArrowRight': {\r\n      return current.add(1, 'day').toDate();\r\n    }\r\n    case 'ArrowUp': {\r\n      return current.subtract(7, 'day').toDate();\r\n    }\r\n    case 'ArrowDown': {\r\n      return current.add(7, 'day').toDate();\r\n    }\r\n    case 'PageUp': {\r\n      return current.subtract(1, 'month').toDate();\r\n    }\r\n    case 'PageDown': {\r\n      return current.add(1, 'month').toDate();\r\n    }\r\n    case 'Home': {\r\n      return current.subtract(offset, 'day').toDate();\r\n    }\r\n    case 'End': {\r\n      return current.add(6 - offset, 'day').toDate();\r\n    }\r\n    default: {\r\n      return null;\r\n    }\r\n  }\r\n};\r\n\r\nexport const orderRange = (a: Date, b: Date): [Date, Date] =>\r\n  dayjs(a).isAfter(b, 'day') ? [b, a] : [a, b];\r\n\r\nexport const clampToBounds = (date: Date, { max, min }: DateBounds): Date => {\r\n  if (min && dayjs(date).isBefore(min, 'day')) return min;\r\n  if (max && dayjs(date).isAfter(max, 'day')) return max;\r\n  return date;\r\n};\r\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,194 @@
+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`
+    flex: 1;
+    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';\r\n\r\nimport { focusRing } from '@/base-ui/focusRing';\r\n\r\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\r\n  band: css`\r\n    background: ${cssVar.colorFillSecondary};\r\n  `,\r\n  bandEnd: css`\r\n    background: linear-gradient(to left, transparent 50%, ${cssVar.colorFillSecondary} 50%);\r\n  `,\r\n  bandStart: css`\r\n    background: linear-gradient(to right, transparent 50%, ${cssVar.colorFillSecondary} 50%);\r\n  `,\r\n  calendar: css`\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: 8px;\r\n    width: 266px;\r\n  `,\r\n  cell: css`\r\n    display: flex;\r\n    justify-content: center;\r\n  `,\r\n  day: css`\r\n    ${focusRing};\r\n    cursor: pointer;\r\n\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    width: 34px;\r\n    height: 34px;\r\n    padding: 0;\r\n    border: 0;\r\n    border-radius: 50%;\r\n\r\n    font: inherit;\r\n    font-size: 13px;\r\n    font-variant-numeric: tabular-nums;\r\n    color: ${cssVar.colorText};\r\n\r\n    background: none;\r\n\r\n    &:hover:not(:disabled, [aria-pressed='true']) {\r\n      background: ${cssVar.colorFillTertiary};\r\n    }\r\n\r\n    &:disabled {\r\n      cursor: not-allowed;\r\n      color: ${cssVar.colorTextQuaternary};\r\n    }\r\n\r\n    &[data-outside] {\r\n      color: ${cssVar.colorTextQuaternary};\r\n    }\r\n\r\n    &[data-today] {\r\n      box-shadow: inset 0 0 0 1px ${cssVar.colorText};\r\n    }\r\n\r\n    &[aria-pressed='true'] {\r\n      font-weight: 600;\r\n      color: ${cssVar.colorBgContainer};\r\n      background: ${cssVar.colorText};\r\n    }\r\n  `,\r\n  footer: css`\r\n    display: flex;\r\n    justify-content: center;\r\n\r\n    margin-block-start: 12px;\r\n    padding-block-start: 12px;\r\n    border-block-start: 1px solid ${cssVar.colorBorderSecondary};\r\n  `,\r\n  grid: css`\r\n    display: grid;\r\n    grid-template-columns: repeat(7, minmax(0, 1fr));\r\n    row-gap: 2px;\r\n  `,\r\n  header: css`\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: space-between;\r\n    margin-block-end: 4px;\r\n  `,\r\n  icon: css`\r\n    display: inline-flex;\r\n    flex: none;\r\n    color: ${cssVar.colorTextTertiary};\r\n  `,\r\n  navGroup: css`\r\n    display: flex;\r\n    gap: 2px;\r\n  `,\r\n  placeholder: css`\r\n    color: ${cssVar.colorTextPlaceholder};\r\n  `,\r\n  range: css`\r\n    display: flex;\r\n    gap: 28px;\r\n  `,\r\n  rangeHalf: css`\r\n    flex: 1;\r\n    min-width: 0;\r\n    padding-block: 2px;\r\n\r\n    &[data-active] {\r\n      box-shadow: inset 0 -2px 0 ${cssVar.colorText};\r\n    }\r\n  `,\r\n  rangeTrigger: css`\r\n    display: flex;\r\n    flex: 1;\r\n    gap: 8px;\r\n    align-items: center;\r\n\r\n    min-width: 0;\r\n  `,\r\n  tile: css`\r\n    ${focusRing};\r\n    cursor: pointer;\r\n\r\n    height: 40px;\r\n    padding: 0;\r\n    border: 0;\r\n    border-radius: 999px;\r\n\r\n    font: inherit;\r\n    font-size: 14px;\r\n    color: ${cssVar.colorText};\r\n\r\n    background: none;\r\n\r\n    &:hover:not(:disabled, [aria-pressed='true']) {\r\n      background: ${cssVar.colorFillTertiary};\r\n    }\r\n\r\n    &:disabled {\r\n      cursor: not-allowed;\r\n      color: ${cssVar.colorTextQuaternary};\r\n    }\r\n\r\n    &[data-today] {\r\n      box-shadow: inset 0 0 0 1px ${cssVar.colorText};\r\n    }\r\n\r\n    &[aria-pressed='true'] {\r\n      font-weight: 600;\r\n      color: ${cssVar.colorBgContainer};\r\n      background: ${cssVar.colorText};\r\n    }\r\n  `,\r\n  tiles: css`\r\n    display: grid;\r\n    grid-template-columns: repeat(3, minmax(0, 1fr));\r\n    gap: 6px 4px;\r\n    width: 266px;\r\n  `,\r\n  trigger: css`\r\n    ${focusRing};\r\n    cursor: pointer;\r\n\r\n    display: flex;\r\n    flex: 1;\r\n    align-items: center;\r\n\r\n    min-width: 0;\r\n    height: 100%;\r\n    padding: 0;\r\n    border: 0;\r\n\r\n    font: inherit;\r\n    color: inherit;\r\n    text-align: start;\r\n    white-space: nowrap;\r\n\r\n    background: none;\r\n\r\n    &:disabled {\r\n      cursor: not-allowed;\r\n    }\r\n  `,\r\n  weekday: css`\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    height: 20px;\r\n  `,\r\n}));\r\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;;;;;;mCAMmB,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';\r\n\r\nimport { cx } from 'antd-style';\r\nimport { Fragment, memo } from 'react';\r\n\r\nimport { styles } from './style';\r\nimport type { DescriptionsProps } from './type';\r\n\r\nconst Descriptions = memo<DescriptionsProps>(\r\n  ({\r\n    bordered = false,\r\n    className,\r\n    classNames,\r\n    colon = true,\r\n    column = 1,\r\n    extra,\r\n    items,\r\n    ref,\r\n    styles: customStyles,\r\n    title,\r\n    ...rest\r\n  }) => {\r\n    const columnCount = Math.max(1, Math.floor(column));\r\n\r\n    let cursor = 0;\r\n    const placements = items.map((item) => {\r\n      const span = Math.min(Math.max(Math.floor(item.span ?? 1), 1), columnCount);\r\n      if (cursor + span > columnCount) cursor = 0;\r\n      const start = cursor;\r\n      cursor = (cursor + span) % columnCount;\r\n      return { span, start };\r\n    });\r\n\r\n    return (\r\n      <div className={cx(styles.root, className)} ref={ref} {...rest}>\r\n        {(title != null || extra != null) && (\r\n          <div className={styles.header}>\r\n            <div className={styles.title}>{title}</div>\r\n            {extra != null && <div className={styles.extra}>{extra}</div>}\r\n          </div>\r\n        )}\r\n        <dl\r\n          className={cx(styles.list, bordered && styles.bordered)}\r\n          style={{ gridTemplateColumns: `repeat(${columnCount}, auto minmax(0, 1fr))` }}\r\n        >\r\n          {items.map((item, index) => {\r\n            const { span, start } = placements[index];\r\n            const contentStart = String(start * 2 + 2);\r\n\r\n            return (\r\n              <Fragment key={item.key ?? index}>\r\n                <dt\r\n                  className={cx(styles.label, classNames?.label)}\r\n                  style={{ gridColumn: String(start * 2 + 1), ...customStyles?.label }}\r\n                >\r\n                  {item.label}\r\n                  {colon && item.label != null ? ':' : null}\r\n                </dt>\r\n                <dd\r\n                  className={cx(styles.content, classNames?.content)}\r\n                  style={{\r\n                    gridColumn: span > 1 ? `${contentStart} / span ${span * 2 - 1}` : contentStart,\r\n                    ...customStyles?.content,\r\n                  }}\r\n                >\r\n                  {item.children}\r\n                </dd>\r\n              </Fragment>\r\n            );\r\n          })}\r\n        </dl>\r\n      </div>\r\n    );\r\n  },\r\n);\r\n\r\nDescriptions.displayName = 'Descriptions';\r\n\r\nexport default Descriptions;\r\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';\r\n\r\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\r\n  bordered: css`\r\n    gap: 0;\r\n    border: 1px solid ${cssVar.colorBorderSecondary};\r\n    border-block-start: 0;\r\n    border-radius: ${cssVar.borderRadius};\r\n\r\n    & > dt,\r\n    & > dd {\r\n      padding-block: 8px;\r\n      padding-inline: 12px;\r\n      border-block-start: 1px solid ${cssVar.colorBorderSecondary};\r\n    }\r\n\r\n    & > dt {\r\n      border-inline-end: 1px solid ${cssVar.colorBorderSecondary};\r\n      background: ${cssVar.colorFillQuaternary};\r\n    }\r\n  `,\r\n  content: css`\r\n    min-width: 0;\r\n    margin: 0;\r\n    color: ${cssVar.colorText};\r\n    overflow-wrap: anywhere;\r\n  `,\r\n  extra: css`\r\n    flex: none;\r\n  `,\r\n  header: css`\r\n    display: flex;\r\n    gap: 12px;\r\n    align-items: center;\r\n    justify-content: space-between;\r\n\r\n    margin-block-end: 8px;\r\n  `,\r\n  label: css`\r\n    color: ${cssVar.colorTextDescription};\r\n    white-space: nowrap;\r\n  `,\r\n  list: css`\r\n    display: grid;\r\n    gap: 6px 12px;\r\n\r\n    margin: 0;\r\n\r\n    font-size: 13px;\r\n    line-height: 1.5;\r\n  `,\r\n  root: css`\r\n    min-width: 0;\r\n  `,\r\n  title: css`\r\n    font-size: 14px;\r\n    font-weight: 600;\r\n    color: ${cssVar.colorText};\r\n  `,\r\n}));\r\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';\r\n\r\nimport { Separator } from '@base-ui/react/separator';\r\nimport { cx } from 'antd-style';\r\nimport { memo } from 'react';\r\n\r\nimport { styles } from './style';\r\nimport type { DividerProps } from './type';\r\n\r\nconst Divider = memo<DividerProps>(\r\n  ({ children, className, dashed = false, orientation = 'horizontal', ref, ...rest }) => {\r\n    if (children != null && orientation === 'horizontal') {\r\n      return (\r\n        <Separator\r\n          className={cx(styles.withText, dashed && styles.dashed, className)}\r\n          orientation=\"horizontal\"\r\n          ref={ref}\r\n          {...rest}\r\n        >\r\n          <span className={styles.text}>{children}</span>\r\n        </Separator>\r\n      );\r\n    }\r\n\r\n    return (\r\n      <Separator\r\n        orientation={orientation}\r\n        ref={ref}\r\n        className={cx(\r\n          orientation === 'vertical' ? styles.vertical : styles.horizontal,\r\n          dashed && styles.dashed,\r\n          className,\r\n        )}\r\n        {...rest}\r\n      />\r\n    );\r\n  },\r\n);\r\n\r\nDivider.displayName = 'Divider';\r\n\r\nexport default Divider;\r\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