@aortl/admin-react 0.9.0 → 0.11.0

package/dist/index.cjs

@@ -100,7 +100,7 @@ function renderIcon(icon, size = "1em") {
 }
 //#endregion
 //#region src/Alert.tsx
-function AlertRoot({ variant = "info", icon, title, description, className, role, children, ...rest }) {
+function AlertRoot({ variant, icon, title, description, className, role, children, ...rest }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		role: role ?? (variant === "danger" || variant === "warning" ? "alert" : "status"),
 		className: cn(["alert", `alert-${variant}`], className),
@@ -183,7 +183,7 @@ function Badge({ variant = "neutral", size = "md", icon, className, children, ..
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
 		className: cn([
 			"badge",
-			`badge-${variant}`,
+			variant !== "neutral" && `badge-${variant}`,
 			size !== "md" && `badge-${size}`
 		], className),
 		...rest,
@@ -447,7 +447,7 @@ function useHotkey(keys, handler, options) {
 }
 //#endregion
 //#region src/Button.tsx
-function Button({ variant = "primary", size = "md", fullWidth, loading, icon, iconTrailing, hotkey, className, type = "button", disabled, children, onClick, ...rest }) {
+function Button({ variant = "default", size = "md", fullWidth, loading, icon, iconTrailing, hotkey, className, type = "button", disabled, children, onClick, ...rest }) {
 	const { ariaKeyShortcuts, primaryChord } = useHotkey(hotkey, (e) => onClick?.(e), { enabled: !disabled && !loading });
 	const iconOnly = children == null && (icon != null || iconTrailing != null);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_base_ui_react_button.Button, {
@@ -458,7 +458,7 @@ function Button({ variant = "primary", size = "md", fullWidth, loading, icon, ic
 		"aria-keyshortcuts": ariaKeyShortcuts,
 		className: cn([
 			"btn",
-			`btn-${variant}`,
+			variant !== "default" && `btn-${variant}`,
 			size !== "md" && `btn-${size}`,
 			fullWidth && "btn-full-width",
 			loading && "btn-loading",
@@ -531,7 +531,7 @@ function Input({ variant = "bordered", inputSize = "md", className, type = "text
 		type,
 		className: cn([
 			"input",
-			`input-${variant}`,
+			variant !== "bordered" && `input-${variant}`,
 			inputSize !== "md" && `input-${inputSize}`
 		], className),
 		...rest
@@ -544,7 +544,7 @@ function FileInput({ variant = "bordered", inputSize = "md", className, ...rest
 		type: "file",
 		className: cn([
 			"file-input",
-			`file-input-${variant}`,
+			variant !== "bordered" && `file-input-${variant}`,
 			inputSize !== "md" && `file-input-${inputSize}`
 		], className),
 		...rest
@@ -763,7 +763,7 @@ function Textarea({ variant = "bordered", textareaSize = "md", className, ...res
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
 		className: cn([
 			"textarea",
-			`textarea-${variant}`,
+			variant !== "bordered" && `textarea-${variant}`,
 			textareaSize !== "md" && `textarea-${textareaSize}`
 		], className),
 		...rest
@@ -879,7 +879,7 @@ function SelectTrigger({ variant = "bordered", triggerSize = "md", className, ..
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_select.Select.Trigger, {
 		className: cn([
 			"select",
-			`select-${variant}`,
+			variant !== "bordered" && `select-${variant}`,
 			triggerSize !== "md" && `select-${triggerSize}`
 		], className),
 		...rest
@@ -975,6 +975,24 @@ var Select = Object.assign(SelectRoot, {
 	GroupLabel: SelectGroupLabel
 });
 //#endregion
+//#region src/Container.tsx
+/**
+* Page content region: a centered, max-width column that also owns the
+* vertical gap between stacked sections. Place inside `<AppShell.Main>`,
+* which provides no padding of its own. Distinct from the `.Container`
+* escape hatch (e.g. `Card.Container`) — this is a standalone page region.
+*/
+function Container({ size = "md", compact, className, ...rest }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: cn([
+			"container",
+			size !== "md" && `container-${size}`,
+			compact && "container-compact"
+		], className),
+		...rest
+	});
+}
+//#endregion
 //#region src/Card.tsx
 /**
 * The bare `.card` container — no body, no title. Use this when you need to
@@ -1060,6 +1078,40 @@ var Card = Object.assign(CardRoot, {
 	Actions: CardActions
 });
 //#endregion
+//#region src/StatCard.tsx
+/**
+* Compact KPI tile — `label / value / detail`. Outer chrome matches `<Card>`
+* (border, radius, shadow) but the inner shape inverts the visual hierarchy:
+* value dominates, label is the small annotation. For free-form tiles, use
+* `<Card>`; for label/value tables, use `<PropertyList>`.
+*/
+function StatCard({ label, value, detail, icon, compact, bordered, className, children, ...rest }) {
+	const hasLabel = icon !== void 0 || label !== void 0;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: cn([
+			"stat-card",
+			compact && "stat-card-compact",
+			bordered && "stat-card-bordered"
+		], className),
+		...rest,
+		children: [
+			hasLabel ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
+				className: cn("stat-card-label", void 0),
+				children: [renderIcon(icon), label]
+			}) : null,
+			value !== void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: cn("stat-card-value", void 0),
+				children: value
+			}) : null,
+			detail !== void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: cn("stat-card-detail", void 0),
+				children: detail
+			}) : null,
+			children
+		]
+	});
+}
+//#endregion
 //#region src/Dialog.tsx
 var DialogContext = (0, react.createContext)(null);
 function DefaultCloseIcon() {
@@ -1189,12 +1241,43 @@ var Dialog = Object.assign(DialogRoot, {
 });
 //#endregion
 //#region src/Field.tsx
-function FieldRoot({ className, ...rest }) {
+/**
+* The bare `.field` container. Use this when the default layout doesn't fit —
+* multiple validity-keyed `<Field.Error>` messages, a control that needs to
+* sit between description and error, etc.
+*/
+function FieldContainer({ className, ...rest }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_field.Field.Root, {
 		className: cn("field", className),
 		...rest
 	});
 }
+/**
+* Standard field: a `.field` container that lays out an optional label, the
+* control passed as `children`, an optional description, and an optional
+* single-message error. For anything outside that shape, use
+* `<Field.Container>` and compose by hand.
+*/
+function FieldRoot({ label, description, error, required, inline, className, children, ...rest }) {
+	const labelEl = label !== void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldLabel, {
+		required,
+		children: label
+	}) : null;
+	const descriptionEl = description !== void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldDescription, { children: description }) : null;
+	const errorEl = error !== void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldError, {
+		match: true,
+		children: error
+	}) : null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(FieldContainer, {
+		className: cn(inline && "field-row", className),
+		...rest,
+		children: [
+			inline ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [children, labelEl] }) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [labelEl, children] }),
+			descriptionEl,
+			errorEl
+		]
+	});
+}
 function FieldLabel({ className, required, ...rest }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_field.Field.Label, {
 		"data-required": required ? "" : void 0,
@@ -1215,6 +1298,7 @@ function FieldError({ className, ...rest }) {
 	});
 }
 var Field = Object.assign(FieldRoot, {
+	Container: FieldContainer,
 	Label: FieldLabel,
 	Description: FieldDescription,
 	Error: FieldError
@@ -1403,7 +1487,7 @@ function TabsRoot({ variant = "bordered", size = "md", fullWidth = false, classN
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_tabs.Tabs.Root, {
 		className: cn([
 			"tabs",
-			`tabs-${variant}`,
+			variant !== "bordered" && `tabs-${variant}`,
 			size !== "md" && `tabs-${size}`,
 			fullWidth && "tabs-full-width"
 		], className),
@@ -1441,6 +1525,20 @@ var Tabs = Object.assign(TabsRoot, {
 	Indicator: TabsIndicator
 });
 //#endregion
+//#region src/CodeBlock.tsx
+/**
+* Styled `<pre>` for logs, JSON dumps, terminal output, raw model output.
+* Theme-following surface via `--color-code-surface` / `--color-code-text`.
+* Wraps by default; opt out with `nowrap`. No syntax highlighting — layer
+* Shiki/Prism on a nested `<code>` if needed.
+*/
+function CodeBlock({ nowrap, className, ...rest }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("pre", {
+		className: cn(["code-block", nowrap && "code-block-nowrap"], className),
+		...rest
+	});
+}
+//#endregion
 //#region src/Tooltip.tsx
 function TooltipProvider(props) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_tooltip.Tooltip.Provider, { ...props });
@@ -1838,6 +1936,8 @@ exports.Button = Button;
 exports.ButtonGroup = ButtonGroup;
 exports.Card = Card;
 exports.Checkbox = Checkbox;
+exports.CodeBlock = CodeBlock;
+exports.Container = Container;
 exports.Dialog = Dialog;
 exports.Field = Field;
 exports.FileInput = FileInput;
@@ -1856,6 +1956,7 @@ exports.RadioGroup = RadioGroup;
 exports.Select = Select;
 exports.Sidebar = Sidebar;
 exports.Spinner = Spinner;
+exports.StatCard = StatCard;
 exports.Switch = Switch;
 exports.Table = Table;
 exports.Tabs = Tabs;