@jinmi/ui 6.0.2 → 6.1.0

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

@@ -1,5 +1,5 @@
 import { createStaticStyles } from "antd-style";
-//#region src/base-ui/Popover/style.ts
+// src/base-ui/Popover/style.ts
 const styles = createStaticStyles(({ css, cssVar }) => ({
 	arrow: css`
     --jinmi-popover-arrow-offset-block: 5px;
@@ -309,7 +309,6 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
     }
   `
 }));
-//#endregion
 export { styles };
 
 //# sourceMappingURL=style.mjs.map

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

@@ -3,7 +3,6 @@ import { Trigger } from "../../types/trigger.mjs";
 import "../../types/index.mjs";
 import { CSSProperties, ComponentPropsWithRef, ReactElement, ReactNode } from "react";
 import { Popover, PopoverBackdropProps, PopoverPopupProps, PopoverPortalProps, PopoverPositionerProps, PopoverTriggerProps } from "@base-ui/react/popover";
-//#region src/base-ui/Popover/type.d.ts
 type PopoverPlacement = Placement;
 type PopoverTrigger = Trigger;
 /**
@@ -148,6 +147,5 @@ interface PopoverProps {
    */
   zIndex?: number;
 }
-//#endregion
 export { PopoverBackdropProps$1 as PopoverBackdropProps, PopoverPlacement, PopoverPopupProps$1 as PopoverPopupProps, PopoverPortalProps$1 as PopoverPortalProps, PopoverPositionerProps$1 as PopoverPositionerProps, PopoverProps, PopoverTrigger, PopoverTriggerComponentProps };
 //# sourceMappingURL=type.d.mts.map

package/es/base-ui/Popover/useMergedPopoverProps.mjs

@@ -1,7 +1,7 @@
 "use client";
 import { PopoverGroupPropsContext } from "./groupContext.mjs";
 import { useContext, useMemo } from "react";
-//#region src/base-ui/Popover/useMergedPopoverProps.ts
+// src/base-ui/Popover/useMergedPopoverProps.ts
 const useMergedPopoverProps = (props) => {
 	const sharedProps = useContext(PopoverGroupPropsContext);
 	const { arrow, trigger, placement, className, classNames, styles: styleProps, onOpenChange, content, closeDelay, disabled, getPopupContainer, mouseEnterDelay, mouseLeaveDelay, nativeButton, openDelay, zIndex, positionerProps, triggerProps, popupProps, backdropProps } = props;
@@ -89,7 +89,6 @@ const useMergedPopoverProps = (props) => {
 		zIndex
 	]);
 };
-//#endregion
 export { useMergedPopoverProps };
 
 //# sourceMappingURL=useMergedPopoverProps.mjs.map

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

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

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

@@ -6,7 +6,7 @@ import { memo, useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { cssVar, cx } from "antd-style";
 import { Check, X } from "lucide-react";
-//#region src/base-ui/Progress/Progress.tsx
+// src/base-ui/Progress/Progress.tsx
 const circleDiameterMap = {
 	large: 72,
 	middle: 40,
@@ -176,7 +176,6 @@ const Progress = memo(({ className, format, label, percent, ref, segments = 20,
 	});
 });
 Progress.displayName = "Progress";
-//#endregion
 export { Progress as default };
 
 //# sourceMappingURL=Progress.mjs.map

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

@@ -1,7 +1,7 @@
 import { inkCssVar } from "../../styles/inkCssVar.mjs";
 import { createStaticStyles, keyframes } from "antd-style";
 import { cva } from "class-variance-authority";
-//#region src/base-ui/Progress/style.ts
+// src/base-ui/Progress/style.ts
 const shimmer = keyframes`
   from {
     background-position: -80px 0;
@@ -191,7 +191,6 @@ const trackHeight = cva(void 0, {
 		}
 	}
 });
-//#endregion
 export { styles, trackHeight };
 
 //# sourceMappingURL=style.mjs.map

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

@@ -1,5 +1,4 @@
 import { CSSProperties, ComponentProps, ReactNode, Ref } from "react";
-//#region src/base-ui/Progress/type.d.ts
 type ProgressType = 'line' | 'circle';
 type ProgressVariant = 'line' | 'segments' | 'inset';
 type ProgressStatus = 'normal' | 'active' | 'success' | 'exception';
@@ -19,6 +18,5 @@ interface ProgressProps extends Omit<ComponentProps<'div'>, 'children'> {
   type?: ProgressType;
   variant?: ProgressVariant;
 }
-//#endregion
 export { ProgressProps, ProgressSize, ProgressStatus, ProgressType, ProgressVariant };
 //# sourceMappingURL=type.d.mts.map

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

@@ -0,0 +1,15 @@
+import { ReactNode } from "react";
+interface PromptGridItem {
+  key: string;
+  label: ReactNode;
+}
+interface PromptGridProps {
+  className?: string;
+  disabled?: boolean;
+  items: PromptGridItem[];
+  onPick: (key: string) => void;
+}
+/** Two columns of ready-made prompts ("Thử hỏi"); picking one starts a chat with it. */
+declare const PromptGrid: import("react").NamedExoticComponent<PromptGridProps>;
+export { PromptGridItem, PromptGridProps, PromptGrid as default };
+//# sourceMappingURL=PromptGrid.d.mts.map

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

@@ -0,0 +1,79 @@
+"use client";
+import { focusRing } from "../focusRing.mjs";
+import { memo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { createStaticStyles, cssVar, cx } from "antd-style";
+import { ArrowRight } from "lucide-react";
+// src/base-ui/PromptGrid/PromptGrid.tsx
+const styles = createStaticStyles(({ css }) => ({
+	arrow: css`
+    flex: none;
+    color: ${cssVar.colorTextTertiary};
+  `,
+	grid: css`
+    display: grid;
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    gap: 10px;
+
+    @media (width <= 720px) {
+      grid-template-columns: minmax(0, 1fr);
+    }
+  `,
+	item: css`
+    cursor: pointer;
+
+    display: flex;
+    gap: 10px;
+    align-items: center;
+
+    padding-block: 14px;
+    padding-inline: 16px;
+    border: 0;
+    border-radius: 14px;
+
+    font: inherit;
+    font-size: 14px;
+    color: ${cssVar.colorText};
+    text-align: start;
+
+    background: ${cssVar.colorFillQuaternary};
+
+    transition: background 0.15s;
+
+    ${focusRing};
+
+    &:hover:not(:disabled) {
+      background: ${cssVar.colorFillTertiary};
+    }
+
+    &:disabled {
+      cursor: not-allowed;
+      opacity: 0.6;
+    }
+  `,
+	label: css`
+    flex: 1;
+    min-width: 0;
+  `
+}));
+/** Two columns of ready-made prompts ("Thử hỏi"); picking one starts a chat with it. */
+const PromptGrid = memo(({ className, disabled, items, onPick }) => /* @__PURE__ */ jsx("div", {
+	className: cx(styles.grid, className),
+	children: items.map((item) => /* @__PURE__ */ jsxs("button", {
+		className: styles.item,
+		disabled,
+		type: "button",
+		onClick: () => onPick(item.key),
+		children: [/* @__PURE__ */ jsx("span", {
+			className: styles.label,
+			children: item.label
+		}), /* @__PURE__ */ jsx(ArrowRight, {
+			className: styles.arrow,
+			size: 15
+		})]
+	}, item.key))
+}));
+PromptGrid.displayName = "PromptGrid";
+export { PromptGrid as default };
+
+//# sourceMappingURL=PromptGrid.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PromptGrid.mjs","names":[],"sources":["../../../src/base-ui/PromptGrid/PromptGrid.tsx"],"sourcesContent":["'use client';\n\nimport { createStaticStyles, cssVar, cx } from 'antd-style';\nimport { ArrowRight } from 'lucide-react';\nimport { memo, type ReactNode } from 'react';\n\nimport { focusRing } from '@/base-ui/focusRing';\n\nconst styles = createStaticStyles(({ css }) => ({\n  arrow: css`\n    flex: none;\n    color: ${cssVar.colorTextTertiary};\n  `,\n  grid: css`\n    display: grid;\n    grid-template-columns: repeat(2, minmax(0, 1fr));\n    gap: 10px;\n\n    @media (width <= 720px) {\n      grid-template-columns: minmax(0, 1fr);\n    }\n  `,\n  item: css`\n    cursor: pointer;\n\n    display: flex;\n    gap: 10px;\n    align-items: center;\n\n    padding-block: 14px;\n    padding-inline: 16px;\n    border: 0;\n    border-radius: 14px;\n\n    font: inherit;\n    font-size: 14px;\n    color: ${cssVar.colorText};\n    text-align: start;\n\n    background: ${cssVar.colorFillQuaternary};\n\n    transition: background 0.15s;\n\n    ${focusRing};\n\n    &:hover:not(:disabled) {\n      background: ${cssVar.colorFillTertiary};\n    }\n\n    &:disabled {\n      cursor: not-allowed;\n      opacity: 0.6;\n    }\n  `,\n  label: css`\n    flex: 1;\n    min-width: 0;\n  `,\n}));\n\nexport interface PromptGridItem {\n  key: string;\n  label: ReactNode;\n}\n\nexport interface PromptGridProps {\n  className?: string;\n  disabled?: boolean;\n  items: PromptGridItem[];\n  onPick: (key: string) => void;\n}\n\n/** Two columns of ready-made prompts (\"Thử hỏi\"); picking one starts a chat with it. */\nconst PromptGrid = memo<PromptGridProps>(({ className, disabled, items, onPick }) => (\n  <div className={cx(styles.grid, className)}>\n    {items.map((item) => (\n      <button\n        className={styles.item}\n        disabled={disabled}\n        key={item.key}\n        type={'button'}\n        onClick={() => onPick(item.key)}\n      >\n        <span className={styles.label}>{item.label}</span>\n        <ArrowRight className={styles.arrow} size={15} />\n      </button>\n    ))}\n  </div>\n));\n\nPromptGrid.displayName = 'PromptGrid';\n\nexport default PromptGrid;\n"],"mappings":";;;;;;;AAQA,MAAM,SAAS,oBAAoB,EAAE,WAAW;CAC9C,OAAO,GAAG;;aAEC,OAAO,kBAAkB;;CAEpC,MAAM,GAAG;;;;;;;;;CAST,MAAM,GAAG;;;;;;;;;;;;;;aAcE,OAAO,UAAU;;;kBAGZ,OAAO,oBAAoB;;;;MAIvC,UAAU;;;oBAGI,OAAO,kBAAkB;;;;;;;;CAQ3C,OAAO,GAAG;;;;AAIZ,EAAE;;AAeF,MAAM,aAAa,MAAuB,EAAE,WAAW,UAAU,OAAO,aACtE,oBAAC,OAAD;CAAK,WAAW,GAAG,OAAO,MAAM,SAAS;CACtC,UAAA,MAAM,KAAK,SACV,qBAAC,UAAD;EACE,WAAW,OAAO;EACR;EAEV,MAAM;EACN,eAAe,OAAO,KAAK,GAAG;EALhC,UAAA,CAOE,oBAAC,QAAD;GAAM,WAAW,OAAO;GAAQ,UAAA,KAAK;EAAY,CAAA,GACjD,oBAAC,YAAD;GAAY,WAAW,OAAO;GAAO,MAAM;EAAK,CAAA,CAC1C;CAND,GAAA,KAAK,GAMJ,CACT;AACE,CAAA,CACN;AAED,WAAW,cAAc"}

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

@@ -0,0 +1,2 @@
+import PromptGrid, { PromptGridItem, PromptGridProps } from "./PromptGrid.mjs";
+export { type PromptGridItem, type PromptGridProps, PromptGrid as default };

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

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

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

@@ -11,7 +11,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { cx } from "antd-style";
 import { RotateCw } from "lucide-react";
 import { encode } from "uqr";
-//#region src/base-ui/QRCode/QRCode.tsx
+// src/base-ui/QRCode/QRCode.tsx
 const ICON_RATIO = .22;
 const QRCode = memo(({ bgColor = "#fff", bordered = true, className, color = "#000", errorLevel = "M", icon, onRefresh, ref, size = 160, status = "active", style, value, ...rest }) => {
 	const { t } = useTranslation(qrCode_default);
@@ -99,7 +99,6 @@ const QRCode = memo(({ bgColor = "#fff", bordered = true, className, color = "#0
 	});
 });
 QRCode.displayName = "QRCode";
-//#endregion
 export { QRCode as default };
 
 //# sourceMappingURL=QRCode.mjs.map

package/es/base-ui/QRCode/qrPath.mjs

@@ -1,4 +1,4 @@
-//#region src/base-ui/QRCode/qrPath.ts
+// src/base-ui/QRCode/qrPath.ts
 const buildQrPath = (matrix, hole) => {
 	const count = matrix.length;
 	const from = Math.floor((count - hole) / 2);
@@ -10,7 +10,6 @@ const buildQrPath = (matrix, hole) => {
 	}
 	return path;
 };
-//#endregion
 export { buildQrPath };
 
 //# sourceMappingURL=qrPath.mjs.map

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

@@ -1,5 +1,5 @@
 import { createStaticStyles } from "antd-style";
-//#region src/base-ui/QRCode/style.ts
+// src/base-ui/QRCode/style.ts
 const styles = createStaticStyles(({ css, cssVar }) => ({
 	bordered: css`
     box-shadow: inset 0 0 0 1px ${cssVar.colorBorderSecondary};
@@ -46,7 +46,6 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
     border-radius: 16px;
   `
 }));
-//#endregion
 export { styles };
 
 //# sourceMappingURL=style.mjs.map

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

@@ -1,5 +1,4 @@
 import { ComponentProps, ReactNode, Ref } from "react";
-//#region src/base-ui/QRCode/type.d.ts
 type QRCodeErrorLevel = 'L' | 'M' | 'Q' | 'H';
 type QRCodeStatus = 'active' | 'loading' | 'expired';
 interface QRCodeProps extends Omit<ComponentProps<'div'>, 'children'> {
@@ -14,6 +13,5 @@ interface QRCodeProps extends Omit<ComponentProps<'div'>, 'children'> {
   status?: QRCodeStatus;
   value: string;
 }
-//#endregion
 export { QRCodeErrorLevel, QRCodeProps, QRCodeStatus };
 //# sourceMappingURL=type.d.mts.map

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

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

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

@@ -5,7 +5,7 @@ import { memo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { cx } from "antd-style";
 import { Radio } from "@base-ui/react/radio";
-//#region src/base-ui/Radio/Radio.tsx
+// src/base-ui/Radio/Radio.tsx
 const Radio$1 = memo(({ size = 16, backgroundColor, children, className, classNames, styles: customStyles, style, textProps, disabled, ...rest }) => {
 	const dotStyle = {
 		height: size,
@@ -46,7 +46,6 @@ const Radio$1 = memo(({ size = 16, backgroundColor, children, className, classNa
 	});
 });
 Radio$1.displayName = "Radio";
-//#endregion
 export { Radio$1 as default };
 
 //# sourceMappingURL=Radio.mjs.map

package/es/base-ui/Radio/RadioGroup.d.mts

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

package/es/base-ui/Radio/RadioGroup.mjs

@@ -3,7 +3,7 @@ import Radio from "./Radio.mjs";
 import { memo, useMemo } from "react";
 import { jsx } from "react/jsx-runtime";
 import { RadioGroup } from "@base-ui/react/radio-group";
-//#region src/base-ui/Radio/RadioGroup.tsx
+// src/base-ui/Radio/RadioGroup.tsx
 const RadioGroup$1 = memo(({ options, onChange, gap = 12, horizontal = true, size, textProps, style, ...rest }) => {
 	const items = useMemo(() => options.map((option) => typeof option === "string" ? {
 		label: option,
@@ -29,7 +29,6 @@ const RadioGroup$1 = memo(({ options, onChange, gap = 12, horizontal = true, siz
 	});
 });
 RadioGroup$1.displayName = "RadioGroup";
-//#endregion
 export { RadioGroup$1 as default };
 
 //# sourceMappingURL=RadioGroup.mjs.map

package/es/base-ui/Radio/style.d.mts

@@ -1,9 +1,7 @@
-//#region src/base-ui/Radio/style.d.ts
 declare const styles: {
   indicator: string;
   label: string;
   root: string;
 };
-//#endregion
 export { styles };
 //# sourceMappingURL=style.d.mts.map

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

@@ -1,7 +1,7 @@
 import { inkCssVar } from "../../styles/inkCssVar.mjs";
 import { focusRing } from "../focusRing.mjs";
 import { createStaticStyles } from "antd-style";
-//#region src/base-ui/Radio/style.ts
+// src/base-ui/Radio/style.ts
 const styles = createStaticStyles(({ css, cssVar }) => ({
 	indicator: css`
     display: block;
@@ -64,7 +64,6 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
     }
   `
 }));
-//#endregion
 export { styles };
 
 //# sourceMappingURL=style.mjs.map

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

@@ -5,7 +5,6 @@ import "../../Text/index.mjs";
 import { CSSProperties, ComponentProps, ReactNode } from "react";
 import { Radio } from "@base-ui/react/radio";
 import { RadioGroup } from "@base-ui/react/radio-group";
-//#region src/base-ui/Radio/type.d.ts
 type BaseRadioProps = Omit<ComponentProps<typeof Radio.Root>, 'className' | 'style' | 'render' | 'children'>;
 interface RadioProps extends BaseRadioProps {
   backgroundColor?: string;
@@ -53,6 +52,5 @@ interface RadioGroupProps extends BaseRadioGroupProps {
   style?: CSSProperties;
   textProps?: RadioProps['textProps'];
 }
-//#endregion
 export { RadioGroupOption, RadioGroupProps, RadioProps };
 //# sourceMappingURL=type.d.mts.map

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

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

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

@@ -5,7 +5,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { cssVar, cx } from "antd-style";
 import useMergeState from "use-merge-value";
 import { Star } from "lucide-react";
-//#region src/base-ui/Rate/Rate.tsx
+// src/base-ui/Rate/Rate.tsx
 const clamp = (value, min, max) => Math.min(max, Math.max(min, value));
 const formatValue = (value) => String(Math.round(value * 100) / 100);
 const Rate = memo(({ allowHalf = false, character, className, color = cssVar.colorWarning, count = 5, defaultValue = 0, disabled = false, gap, onChange, onKeyDown, onPointerLeave, readOnly = false, size = 20, style, value, ...rest }) => {
@@ -105,7 +105,6 @@ const Rate = memo(({ allowHalf = false, character, className, color = cssVar.col
 	});
 });
 Rate.displayName = "Rate";
-//#endregion
 export { Rate as default };
 
 //# sourceMappingURL=Rate.mjs.map

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

@@ -1,6 +1,6 @@
 import { brandCssVar } from "../../styles/brandCssVar.mjs";
 import { createStaticStyles } from "antd-style";
-//#region src/base-ui/Rate/style.ts
+// src/base-ui/Rate/style.ts
 const styles = createStaticStyles(({ css, cssVar }) => ({
 	empty: css`
     /* Group opacity instead of the translucent colorFill so the star's stroke and fill don't double up where they overlap. */
@@ -76,7 +76,6 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
     }
   `
 }));
-//#endregion
 export { styles };
 
 //# sourceMappingURL=style.mjs.map

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

@@ -1,5 +1,4 @@
 import { ComponentProps, ReactNode, Ref } from "react";
-//#region src/base-ui/Rate/type.d.ts
 interface RateProps extends Omit<ComponentProps<'div'>, 'children' | 'defaultValue' | 'onChange'> {
   allowHalf?: boolean;
   character?: ReactNode;
@@ -14,6 +13,5 @@ interface RateProps extends Omit<ComponentProps<'div'>, 'children' | 'defaultVal
   size?: number;
   value?: number;
 }
-//#endregion
 export { RateProps };
 //# sourceMappingURL=type.d.mts.map

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

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

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

@@ -4,7 +4,7 @@ import { memo, useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { cssVar, cx } from "antd-style";
 import { Check, Info, TriangleAlert, X } from "lucide-react";
-//#region src/base-ui/Result/Result.tsx
+// src/base-ui/Result/Result.tsx
 const statusIcon = {
 	error: /* @__PURE__ */ jsx(X, {
 		size: 36,
@@ -66,7 +66,6 @@ const Result = memo(({ children, className, extra, icon, ref, status = "info", s
 	});
 });
 Result.displayName = "Result";
-//#endregion
 export { Result as default };
 
 //# sourceMappingURL=Result.mjs.map

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

@@ -1,5 +1,5 @@
 import { createStaticStyles, cssVar } from "antd-style";
-//#region src/base-ui/Result/style.ts
+// src/base-ui/Result/style.ts
 const styles = createStaticStyles(({ css, cssVar }) => ({
 	customIcon: css`
     display: flex;
@@ -66,7 +66,6 @@ const statusColor = {
 	success: cssVar.colorSuccess,
 	warning: cssVar.colorWarning
 };
-//#endregion
 export { statusColor, styles };
 
 //# sourceMappingURL=style.mjs.map

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

@@ -1,5 +1,4 @@
 import { ComponentProps, ReactNode, Ref } from "react";
-//#region src/base-ui/Result/type.d.ts
 type ResultStatus = 'success' | 'error' | 'info' | 'warning';
 interface ResultProps extends Omit<ComponentProps<'section'>, 'title'> {
   extra?: ReactNode;
@@ -9,6 +8,5 @@ interface ResultProps extends Omit<ComponentProps<'section'>, 'title'> {
   subTitle?: ReactNode;
   title?: ReactNode;
 }
-//#endregion
 export { ResultProps, ResultStatus };
 //# sourceMappingURL=type.d.mts.map

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

@@ -0,0 +1,14 @@
+import { RowActionProps, RowIconButtonProps, RowItemProps, RowListProps } from "./type.mjs";
+/** A bordered list of `RowItem`s, optionally under a small group label. */
+declare const RowList: import("react").NamedExoticComponent<RowListProps>;
+/** One 58px row: icon tile, title (+ tag), meta, trailing controls. */
+declare const RowItem: import("react").NamedExoticComponent<RowItemProps>;
+/**
+ * Trailing text of a row. With `onClick` it is a text action ("Sửa", "Gỡ"),
+ * with `primary` the filled ink button ("Kết nối"); otherwise plain text ("10:42").
+ */
+declare const RowAction: import("react").NamedExoticComponent<RowActionProps>;
+/** A 30px icon button for rows and section heads (menus, remove, sort). */
+declare const RowIconButton: import("react").NamedExoticComponent<RowIconButtonProps>;
+export { RowAction, RowIconButton, RowItem, RowList as default };
+//# sourceMappingURL=RowList.d.mts.map

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

@@ -0,0 +1,105 @@
+"use client";
+import { styles } from "./style.mjs";
+import { memo } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { cx } from "antd-style";
+// src/base-ui/RowList/RowList.tsx
+/** A bordered list of `RowItem`s, optionally under a small group label. */
+const RowList = memo(({ children, className, label, ref, ...rest }) => {
+	const list = /* @__PURE__ */ jsx("div", {
+		className: cx(styles.list, className),
+		ref,
+		role: "list",
+		...rest,
+		children
+	});
+	if (!label) return list;
+	return /* @__PURE__ */ jsxs("div", {
+		className: styles.wrap,
+		children: [/* @__PURE__ */ jsx("span", {
+			className: styles.label,
+			children: label
+		}), list]
+	});
+});
+RowList.displayName = "RowList";
+/** One 58px row: icon tile, title (+ tag), meta, trailing controls. */
+const RowItem = memo(({ below, children, className, icon, meta, onOpen, ref, running, tag, tagTone = "default", title, titleText, ...rest }) => {
+	const text = /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs("span", {
+		className: styles.titleLine,
+		children: [/* @__PURE__ */ jsx("span", {
+			className: styles.title,
+			title: titleText,
+			children: title
+		}), tag && /* @__PURE__ */ jsx("span", {
+			className: styles.tag,
+			"data-tone": tagTone,
+			children: tag
+		})]
+	}), meta && /* @__PURE__ */ jsx("span", {
+		className: styles.meta,
+		children: meta
+	})] });
+	const textBlock = onOpen ? /* @__PURE__ */ jsx("button", {
+		className: styles.text,
+		type: "button",
+		onClick: onOpen,
+		children: text
+	}) : /* @__PURE__ */ jsx("span", {
+		className: styles.text,
+		children: text
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		"data-row-item": true,
+		className: cx(styles.row, className),
+		"data-openable": !!onOpen,
+		ref,
+		role: "listitem",
+		...rest,
+		children: [
+			icon !== void 0 && /* @__PURE__ */ jsxs("span", {
+				className: styles.icon,
+				children: [icon, running && /* @__PURE__ */ jsx("span", { className: styles.running })]
+			}),
+			below ? /* @__PURE__ */ jsxs("div", {
+				className: styles.column,
+				children: [textBlock, below]
+			}) : textBlock,
+			children
+		]
+	});
+});
+RowItem.displayName = "RowItem";
+/**
+* Trailing text of a row. With `onClick` it is a text action ("Sửa", "Gỡ"),
+* with `primary` the filled ink button ("Kết nối"); otherwise plain text ("10:42").
+*/
+const RowAction = memo(({ children, className, onClick, primary, ref, type = "button", ...rest }) => {
+	if (!onClick && !primary) return /* @__PURE__ */ jsx("span", {
+		className: cx(styles.trail, className),
+		children
+	});
+	return /* @__PURE__ */ jsx("button", {
+		className: cx(styles.action, primary && styles.actionPrimary, className),
+		ref,
+		type,
+		onClick,
+		...rest,
+		children
+	});
+});
+RowAction.displayName = "RowAction";
+/** A 30px icon button for rows and section heads (menus, remove, sort). */
+const RowIconButton = memo(({ className, hoverOnly, icon, label, ref, type = "button", ...rest }) => /* @__PURE__ */ jsx("button", {
+	"aria-label": label,
+	className: cx(styles.iconButton, hoverOnly && styles.hoverOnly, className),
+	ref,
+	title: label,
+	type,
+	...rest,
+	children: icon
+}));
+RowIconButton.displayName = "RowIconButton";
+export { RowAction, RowIconButton, RowItem, RowList as default };
+
+//# sourceMappingURL=RowList.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RowList.mjs","names":[],"sources":["../../../src/base-ui/RowList/RowList.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { memo } from 'react';\n\nimport { styles } from './style';\nimport type { RowActionProps, RowIconButtonProps, RowItemProps, RowListProps } from './type';\n\n/** A bordered list of `RowItem`s, optionally under a small group label. */\nconst RowList = memo<RowListProps>(({ children, className, label, ref, ...rest }) => {\n  const list = (\n    <div className={cx(styles.list, className)} ref={ref} role={'list'} {...rest}>\n      {children}\n    </div>\n  );\n  if (!label) return list;\n  return (\n    <div className={styles.wrap}>\n      <span className={styles.label}>{label}</span>\n      {list}\n    </div>\n  );\n});\n\nRowList.displayName = 'RowList';\n\n/** One 58px row: icon tile, title (+ tag), meta, trailing controls. */\nexport const RowItem = memo<RowItemProps>(\n  ({\n    below,\n    children,\n    className,\n    icon,\n    meta,\n    onOpen,\n    ref,\n    running,\n    tag,\n    tagTone = 'default',\n    title,\n    titleText,\n    ...rest\n  }) => {\n    const text = (\n      <>\n        <span className={styles.titleLine}>\n          <span className={styles.title} title={titleText}>\n            {title}\n          </span>\n          {tag && (\n            <span className={styles.tag} data-tone={tagTone}>\n              {tag}\n            </span>\n          )}\n        </span>\n        {meta && <span className={styles.meta}>{meta}</span>}\n      </>\n    );\n\n    const textBlock = onOpen ? (\n      <button className={styles.text} type={'button'} onClick={onOpen}>\n        {text}\n      </button>\n    ) : (\n      <span className={styles.text}>{text}</span>\n    );\n\n    return (\n      <div\n        data-row-item\n        className={cx(styles.row, className)}\n        data-openable={!!onOpen}\n        ref={ref}\n        role={'listitem'}\n        {...rest}\n      >\n        {icon !== undefined && (\n          <span className={styles.icon}>\n            {icon}\n            {running && <span className={styles.running} />}\n          </span>\n        )}\n        {below ? (\n          <div className={styles.column}>\n            {textBlock}\n            {below}\n          </div>\n        ) : (\n          textBlock\n        )}\n        {children}\n      </div>\n    );\n  },\n);\n\nRowItem.displayName = 'RowItem';\n\n/**\n * Trailing text of a row. With `onClick` it is a text action (\"Sửa\", \"Gỡ\"),\n * with `primary` the filled ink button (\"Kết nối\"); otherwise plain text (\"10:42\").\n */\nexport const RowAction = memo<RowActionProps>(\n  ({ children, className, onClick, primary, ref, type = 'button', ...rest }) => {\n    if (!onClick && !primary) {\n      return <span className={cx(styles.trail, className)}>{children}</span>;\n    }\n    return (\n      <button\n        className={cx(styles.action, primary && styles.actionPrimary, className)}\n        ref={ref}\n        type={type}\n        onClick={onClick}\n        {...rest}\n      >\n        {children}\n      </button>\n    );\n  },\n);\n\nRowAction.displayName = 'RowAction';\n\n/** A 30px icon button for rows and section heads (menus, remove, sort). */\nexport const RowIconButton = memo<RowIconButtonProps>(\n  ({ className, hoverOnly, icon, label, ref, type = 'button', ...rest }) => (\n    <button\n      aria-label={label}\n      className={cx(styles.iconButton, hoverOnly && styles.hoverOnly, className)}\n      ref={ref}\n      title={label}\n      type={type}\n      {...rest}\n    >\n      {icon}\n    </button>\n  ),\n);\n\nRowIconButton.displayName = 'RowIconButton';\n\nexport default RowList;\n"],"mappings":";;;;;;;AASA,MAAM,UAAU,MAAoB,EAAE,UAAU,WAAW,OAAO,KAAK,GAAG,WAAW;CACnF,MAAM,OACJ,oBAAC,OAAD;EAAK,WAAW,GAAG,OAAO,MAAM,SAAS;EAAQ;EAAK,MAAM;EAAQ,GAAI;EACrE;CACE,CAAA;CAEP,IAAI,CAAC,OAAO,OAAO;CACnB,OACE,qBAAC,OAAD;EAAK,WAAW,OAAO;EAAvB,UAAA,CACE,oBAAC,QAAD;GAAM,WAAW,OAAO;GAAQ,UAAA;EAAY,CAAA,GAC3C,IACE;;AAET,CAAC;AAED,QAAQ,cAAc;;AAGtB,MAAa,UAAU,MACpB,EACC,OACA,UACA,WACA,MACA,MACA,QACA,KACA,SACA,KACA,UAAU,WACV,OACA,WACA,GAAG,WACC;CACJ,MAAM,OACJ,qBAAA,YAAA,EAAA,UAAA,CACE,qBAAC,QAAD;EAAM,WAAW,OAAO;EAAxB,UAAA,CACE,oBAAC,QAAD;GAAM,WAAW,OAAO;GAAO,OAAO;GACnC,UAAA;EACG,CAAA,GACL,OACC,oBAAC,QAAD;GAAM,WAAW,OAAO;GAAK,aAAW;GACrC,UAAA;EACG,CAAA,CAEJ;CACL,CAAA,GAAA,QAAQ,oBAAC,QAAD;EAAM,WAAW,OAAO;EAAO,UAAA;CAAW,CAAA,CACnD,EAAA,CAAA;CAGJ,MAAM,YAAY,SAChB,oBAAC,UAAD;EAAQ,WAAW,OAAO;EAAM,MAAM;EAAU,SAAS;EACtD,UAAA;CACK,CAAA,IAER,oBAAC,QAAD;EAAM,WAAW,OAAO;EAAO,UAAA;CAAW,CAAA;CAG5C,OACE,qBAAC,OAAD;EACE,iBAAA;EACA,WAAW,GAAG,OAAO,KAAK,SAAS;EACnC,iBAAe,CAAC,CAAC;EACZ;EACL,MAAM;EACN,GAAI;EANN,UAAA;GAQG,SAAS,KAAA,KACR,qBAAC,QAAD;IAAM,WAAW,OAAO;IAAxB,UAAA,CACG,MACA,WAAW,oBAAC,QAAD,EAAM,WAAW,OAAO,QAAU,CAAA,CAC1C;;GAEP,QACC,qBAAC,OAAD;IAAK,WAAW,OAAO;IAAvB,UAAA,CACG,WACA,KACE;GAEL,CAAA,IAAA;GAED;EACE;;AAET,CACF;AAEA,QAAQ,cAAc;;;;;AAMtB,MAAa,YAAY,MACtB,EAAE,UAAU,WAAW,SAAS,SAAS,KAAK,OAAO,UAAU,GAAG,WAAW;CAC5E,IAAI,CAAC,WAAW,CAAC,SACf,OAAO,oBAAC,QAAD;EAAM,WAAW,GAAG,OAAO,OAAO,SAAS;EAAI;CAAe,CAAA;CAEvE,OACE,oBAAC,UAAD;EACE,WAAW,GAAG,OAAO,QAAQ,WAAW,OAAO,eAAe,SAAS;EAClE;EACC;EACG;EACT,GAAI;EAEH;CACK,CAAA;AAEZ,CACF;AAEA,UAAU,cAAc;;AAGxB,MAAa,gBAAgB,MAC1B,EAAE,WAAW,WAAW,MAAM,OAAO,KAAK,OAAO,UAAU,GAAG,WAC7D,oBAAC,UAAD;CACE,cAAY;CACZ,WAAW,GAAG,OAAO,YAAY,aAAa,OAAO,WAAW,SAAS;CACpE;CACL,OAAO;CACD;CACN,GAAI;CAEH,UAAA;AACK,CAAA,CAEZ;AAEA,cAAc,cAAc"}

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

@@ -0,0 +1,4 @@
+import { RowActionProps, RowIconButtonProps, RowItemProps, RowItemTagTone, RowListProps } from "./type.mjs";
+import RowList, { RowAction, RowIconButton, RowItem } from "./RowList.mjs";
+import { styles } from "./style.mjs";
+export { RowAction, type RowActionProps, RowIconButton, type RowIconButtonProps, RowItem, type RowItemProps, type RowItemTagTone, type RowListProps, RowList as default, styles as rowListStyles };