@malilion/block-ui-react 0.3.0 → 0.5.0

package/dist/components/forms/NumberInput/NumberInput.js

@@ -0,0 +1,122 @@
+import { cx } from "../../../utils/cx.js";
+import { Field } from "../Field/Field.js";
+import control_module_default from "../Field/control.module.js";
+import { useControllableState } from "../../../hooks/useControllableState.js";
+import NumberInput_module_default from "./NumberInput.module.js";
+import { normalizeNumber, parseNumber, stepPrecision } from "./NumberInput.utils.js";
+import { forwardRef, useState } from "react";
+import { MinusIcon, PlusIcon } from "@malilion/block-ui-icons";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/forms/NumberInput/NumberInput.tsx
+/**
+* Number field with − / + buttons, following the WAI-ARIA spinbutton pattern:
+* ↑ / ↓ step, Page Up / Down step ×10, Home / End jump to min / max. Values are
+* clamped and rounded when committed (step, Enter or blur).
+*/
+var NumberInput = forwardRef(function NumberInput({ id, label, error, success, helperText, value, defaultValue = null, onValueChange, min, max, step = 1, disabled, required, className, wrapperClassName, onBlur, onKeyDown, "aria-describedby": ariaDescribedBy, ...rest }, ref) {
+	const [current, setCurrent] = useControllableState({
+		value,
+		defaultValue,
+		onChange: onValueChange
+	});
+	const [draft, setDraft] = useState(null);
+	const precision = stepPrecision(step);
+	const format = (n) => n === null ? "" : n.toFixed(precision);
+	const commit = (next) => {
+		const normalized = next === null ? null : normalizeNumber(next, {
+			min,
+			max,
+			step
+		});
+		setDraft(null);
+		if (normalized !== current) setCurrent(normalized);
+	};
+	const base = () => {
+		return (draft !== null ? parseNumber(draft) : current) ?? min ?? 0;
+	};
+	const stepBy = (amount) => {
+		if (disabled) return;
+		commit(base() + amount);
+	};
+	const atMin = current !== null && min !== void 0 && current <= min;
+	const atMax = current !== null && max !== void 0 && current >= max;
+	const handleKeyDown = (event) => {
+		onKeyDown?.(event);
+		if (event.defaultPrevented) return;
+		let handled = true;
+		if (event.key === "ArrowUp") stepBy(step);
+		else if (event.key === "ArrowDown") stepBy(-step);
+		else if (event.key === "PageUp") stepBy(step * 10);
+		else if (event.key === "PageDown") stepBy(-step * 10);
+		else if (event.key === "Home" && min !== void 0) commit(min);
+		else if (event.key === "End" && max !== void 0) commit(max);
+		else if (event.key === "Enter" && draft !== null) commit(parseNumber(draft));
+		else handled = false;
+		if (handled) event.preventDefault();
+	};
+	return /* @__PURE__ */ jsx(Field, {
+		id,
+		label,
+		error,
+		success,
+		helperText,
+		disabled,
+		required,
+		className: wrapperClassName,
+		children: ({ inputId, describedBy, invalid }) => /* @__PURE__ */ jsxs("div", {
+			className: NumberInput_module_default.wrapper,
+			children: [
+				/* @__PURE__ */ jsx("button", {
+					type: "button",
+					tabIndex: -1,
+					"aria-label": "Decrease",
+					"aria-controls": inputId,
+					disabled: disabled || atMin,
+					className: NumberInput_module_default.button,
+					onMouseDown: (event) => event.preventDefault(),
+					onClick: () => stepBy(-step),
+					children: /* @__PURE__ */ jsx(MinusIcon, { size: 16 })
+				}),
+				/* @__PURE__ */ jsx("input", {
+					ref,
+					id: inputId,
+					type: "text",
+					role: "spinbutton",
+					inputMode: precision > 0 || min !== void 0 && min < 0 ? "decimal" : "numeric",
+					autoComplete: "off",
+					value: draft ?? format(current),
+					"aria-valuenow": current ?? void 0,
+					"aria-valuemin": min,
+					"aria-valuemax": max,
+					disabled,
+					required,
+					"aria-invalid": invalid || void 0,
+					"aria-describedby": cx(describedBy, ariaDescribedBy) || void 0,
+					className: cx(control_module_default.control, NumberInput_module_default.input, className),
+					onChange: (event) => setDraft(event.target.value),
+					onBlur: (event) => {
+						if (draft !== null) commit(parseNumber(draft));
+						onBlur?.(event);
+					},
+					onKeyDown: handleKeyDown,
+					...rest
+				}),
+				/* @__PURE__ */ jsx("button", {
+					type: "button",
+					tabIndex: -1,
+					"aria-label": "Increase",
+					"aria-controls": inputId,
+					disabled: disabled || atMax,
+					className: NumberInput_module_default.button,
+					onMouseDown: (event) => event.preventDefault(),
+					onClick: () => stepBy(step),
+					children: /* @__PURE__ */ jsx(PlusIcon, { size: 16 })
+				})
+			]
+		})
+	});
+});
+//#endregion
+export { NumberInput };
+
+//# sourceMappingURL=NumberInput.js.map

package/dist/components/forms/NumberInput/NumberInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberInput.js","names":["styles","control"],"sources":["../../../../src/components/forms/NumberInput/NumberInput.tsx"],"sourcesContent":["import { MinusIcon, PlusIcon } from \"@malilion/block-ui-icons\";\nimport { forwardRef, useState, type KeyboardEvent } from \"react\";\nimport { useControllableState } from \"../../../hooks/useControllableState\";\nimport { cx } from \"../../../utils/cx\";\nimport { Field } from \"../Field/Field\";\nimport control from \"../Field/control.module.css\";\nimport styles from \"./NumberInput.module.css\";\nimport type { NumberInputProps } from \"./NumberInput.types\";\nimport { normalizeNumber, parseNumber, stepPrecision } from \"./NumberInput.utils\";\n\n/**\n * Number field with − / + buttons, following the WAI-ARIA spinbutton pattern:\n * ↑ / ↓ step, Page Up / Down step ×10, Home / End jump to min / max. Values are\n * clamped and rounded when committed (step, Enter or blur).\n */\nexport const NumberInput = forwardRef<HTMLInputElement, NumberInputProps>(function NumberInput(\n  {\n    id,\n    label,\n    error,\n    success,\n    helperText,\n    value,\n    defaultValue = null,\n    onValueChange,\n    min,\n    max,\n    step = 1,\n    disabled,\n    required,\n    className,\n    wrapperClassName,\n    onBlur,\n    onKeyDown,\n    \"aria-describedby\": ariaDescribedBy,\n    ...rest\n  },\n  ref,\n) {\n  const [current, setCurrent] = useControllableState<number | null>({\n    value,\n    defaultValue,\n    onChange: onValueChange,\n  });\n  const [draft, setDraft] = useState<string | null>(null);\n  const precision = stepPrecision(step);\n  const format = (n: number | null) => (n === null ? \"\" : n.toFixed(precision));\n\n  const commit = (next: number | null) => {\n    const normalized = next === null ? null : normalizeNumber(next, { min, max, step });\n    setDraft(null);\n    if (normalized !== current) setCurrent(normalized);\n  };\n\n  const base = () => {\n    const parsed = draft !== null ? parseNumber(draft) : current;\n    return parsed ?? min ?? 0;\n  };\n  const stepBy = (amount: number) => {\n    if (disabled) return;\n    commit(base() + amount);\n  };\n\n  const atMin = current !== null && min !== undefined && current <= min;\n  const atMax = current !== null && max !== undefined && current >= max;\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n    onKeyDown?.(event);\n    if (event.defaultPrevented) return;\n    let handled = true;\n    if (event.key === \"ArrowUp\") stepBy(step);\n    else if (event.key === \"ArrowDown\") stepBy(-step);\n    else if (event.key === \"PageUp\") stepBy(step * 10);\n    else if (event.key === \"PageDown\") stepBy(-step * 10);\n    else if (event.key === \"Home\" && min !== undefined) commit(min);\n    else if (event.key === \"End\" && max !== undefined) commit(max);\n    else if (event.key === \"Enter\" && draft !== null) commit(parseNumber(draft));\n    else handled = false;\n    if (handled) event.preventDefault();\n  };\n\n  return (\n    <Field\n      id={id}\n      label={label}\n      error={error}\n      success={success}\n      helperText={helperText}\n      disabled={disabled}\n      required={required}\n      className={wrapperClassName}\n    >\n      {({ inputId, describedBy, invalid }) => (\n        <div className={styles.wrapper}>\n          <button\n            type=\"button\"\n            tabIndex={-1}\n            aria-label=\"Decrease\"\n            aria-controls={inputId}\n            disabled={disabled || atMin}\n            className={styles.button}\n            onMouseDown={(event) => event.preventDefault()}\n            onClick={() => stepBy(-step)}\n          >\n            <MinusIcon size={16} />\n          </button>\n          <input\n            ref={ref}\n            id={inputId}\n            type=\"text\"\n            role=\"spinbutton\"\n            inputMode={precision > 0 || (min !== undefined && min < 0) ? \"decimal\" : \"numeric\"}\n            autoComplete=\"off\"\n            value={draft ?? format(current)}\n            aria-valuenow={current ?? undefined}\n            aria-valuemin={min}\n            aria-valuemax={max}\n            disabled={disabled}\n            required={required}\n            aria-invalid={invalid || undefined}\n            aria-describedby={cx(describedBy, ariaDescribedBy) || undefined}\n            className={cx(control.control, styles.input, className)}\n            onChange={(event) => setDraft(event.target.value)}\n            onBlur={(event) => {\n              if (draft !== null) commit(parseNumber(draft));\n              onBlur?.(event);\n            }}\n            onKeyDown={handleKeyDown}\n            {...rest}\n          />\n          <button\n            type=\"button\"\n            tabIndex={-1}\n            aria-label=\"Increase\"\n            aria-controls={inputId}\n            disabled={disabled || atMax}\n            className={styles.button}\n            onMouseDown={(event) => event.preventDefault()}\n            onClick={() => stepBy(step)}\n          >\n            <PlusIcon size={16} />\n          </button>\n        </div>\n      )}\n    </Field>\n  );\n});\n"],"mappings":"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"}

package/dist/components/forms/NumberInput/NumberInput.module.js

@@ -0,0 +1,13 @@
+//#region src/components/forms/NumberInput/NumberInput.module.css
+var wrapper = "block-wrapper-b-npH";
+var input = "block-input-cg-Fv";
+var button = "block-button-8xOEk";
+var NumberInput_module_default = {
+	wrapper,
+	input,
+	button
+};
+//#endregion
+export { button, NumberInput_module_default as default, input, wrapper };
+
+//# sourceMappingURL=NumberInput.module.js.map

package/dist/components/forms/NumberInput/NumberInput.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberInput.module.js","names":[],"sources":["../../../../src/components/forms/NumberInput/NumberInput.module.css"],"sourcesContent":[".wrapper {\n  display: flex;\n  align-items: stretch;\n  gap: var(--block-space-1);\n}\n\n.input {\n  flex: 1;\n  min-width: 0;\n  height: var(--block-size-control-md);\n  text-align: center;\n  font-variant-numeric: tabular-nums;\n}\n\n.button {\n  display: inline-flex;\n  flex-shrink: 0;\n  align-items: center;\n  justify-content: center;\n  width: var(--block-size-control-md);\n  padding: 0;\n  color: var(--block-text);\n  background-color: var(--block-surface-alt);\n  border: var(--block-border-width-thin) solid var(--block-border);\n  box-shadow: var(--block-shadow-bevel);\n  cursor: pointer;\n}\n\n.button:hover:not(:disabled) {\n  background-color: var(--block-slot-hover);\n}\n\n.button:active:not(:disabled) {\n  box-shadow: var(--block-shadow-inset);\n}\n\n.button:disabled {\n  cursor: not-allowed;\n  opacity: 0.45;\n}\n"],"mappings":""}

package/dist/components/forms/NumberInput/NumberInput.types.d.ts

@@ -0,0 +1,20 @@
+import type { InputHTMLAttributes } from "react";
+export interface NumberInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "value" | "defaultValue" | "onChange" | "type" | "min" | "max" | "step" | "size"> {
+    label?: string;
+    error?: string;
+    success?: boolean;
+    helperText?: string;
+    /** Controlled value; `null` is empty. */
+    value?: number | null;
+    /** Initial value when uncontrolled. @default null */
+    defaultValue?: number | null;
+    /** Called with the committed value (on step, Enter or blur). */
+    onValueChange?: (value: number | null) => void;
+    min?: number;
+    max?: number;
+    /** Amount per step; its decimals set the precision. @default 1 */
+    step?: number;
+    /** Class name for the outer field wrapper. */
+    wrapperClassName?: string;
+}
+//# sourceMappingURL=NumberInput.types.d.ts.map

package/dist/components/forms/NumberInput/NumberInput.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberInput.types.d.ts","sourceRoot":"","sources":["../../../../src/components/forms/NumberInput/NumberInput.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAEjD,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAC5C,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,OAAO,GAAG,cAAc,GAAG,UAAU,GAAG,MAAM,GAAG,KAAK,GAAG,KAAK,GAAG,MAAM,GAAG,MAAM,CACjF;IACC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,yCAAyC;IACzC,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,qDAAqD;IACrD,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,gEAAgE;IAChE,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC/C,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,kEAAkE;IAClE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,8CAA8C;IAC9C,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B"}

package/dist/components/forms/NumberInput/NumberInput.utils.d.ts

@@ -0,0 +1,11 @@
+/** Decimal places of a step, e.g. 0.25 → 2. */
+export declare function stepPrecision(step: number): number;
+/** Clamps to [min, max] and rounds to the step's precision. */
+export declare function normalizeNumber(value: number, { min, max, step }: {
+    min?: number;
+    max?: number;
+    step?: number;
+}): number;
+/** Parses user text ("12", "-3.5", " 4 "); returns null for empty or invalid input. */
+export declare function parseNumber(text: string): number | null;
+//# sourceMappingURL=NumberInput.utils.d.ts.map

package/dist/components/forms/NumberInput/NumberInput.utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberInput.utils.d.ts","sourceRoot":"","sources":["../../../../src/components/forms/NumberInput/NumberInput.utils.ts"],"names":[],"mappings":"AAAA,+CAA+C;AAC/C,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAIlD;AAED,+DAA+D;AAC/D,wBAAgB,eAAe,CAC7B,KAAK,EAAE,MAAM,EACb,EAAE,GAAG,EAAE,GAAG,EAAE,IAAQ,EAAE,EAAE;IAAE,GAAG,CAAC,EAAE,MAAM,CAAC;IAAC,GAAG,CAAC,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,GACpE,MAAM,CAMR;AAED,uFAAuF;AACvF,wBAAgB,WAAW,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAKvD"}

package/dist/components/forms/NumberInput/NumberInput.utils.js

@@ -0,0 +1,26 @@
+//#region src/components/forms/NumberInput/NumberInput.utils.ts
+/** Decimal places of a step, e.g. 0.25 → 2. */
+function stepPrecision(step) {
+	const text = String(step);
+	const dot = text.indexOf(".");
+	return dot < 0 ? 0 : text.length - dot - 1;
+}
+/** Clamps to [min, max] and rounds to the step's precision. */
+function normalizeNumber(value, { min, max, step = 1 }) {
+	let next = value;
+	if (min !== void 0) next = Math.max(min, next);
+	if (max !== void 0) next = Math.min(max, next);
+	const precision = stepPrecision(step);
+	return Number(next.toFixed(precision));
+}
+/** Parses user text ("12", "-3.5", " 4 "); returns null for empty or invalid input. */
+function parseNumber(text) {
+	const trimmed = text.trim().replace(",", ".");
+	if (trimmed === "" || trimmed === "-" || trimmed === ".") return null;
+	const value = Number(trimmed);
+	return Number.isFinite(value) ? value : null;
+}
+//#endregion
+export { normalizeNumber, parseNumber, stepPrecision };
+
+//# sourceMappingURL=NumberInput.utils.js.map

package/dist/components/forms/NumberInput/NumberInput.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberInput.utils.js","names":[],"sources":["../../../../src/components/forms/NumberInput/NumberInput.utils.ts"],"sourcesContent":["/** Decimal places of a step, e.g. 0.25 → 2. */\nexport function stepPrecision(step: number): number {\n  const text = String(step);\n  const dot = text.indexOf(\".\");\n  return dot < 0 ? 0 : text.length - dot - 1;\n}\n\n/** Clamps to [min, max] and rounds to the step's precision. */\nexport function normalizeNumber(\n  value: number,\n  { min, max, step = 1 }: { min?: number; max?: number; step?: number },\n): number {\n  let next = value;\n  if (min !== undefined) next = Math.max(min, next);\n  if (max !== undefined) next = Math.min(max, next);\n  const precision = stepPrecision(step);\n  return Number(next.toFixed(precision));\n}\n\n/** Parses user text (\"12\", \"-3.5\", \" 4 \"); returns null for empty or invalid input. */\nexport function parseNumber(text: string): number | null {\n  const trimmed = text.trim().replace(\",\", \".\");\n  if (trimmed === \"\" || trimmed === \"-\" || trimmed === \".\") return null;\n  const value = Number(trimmed);\n  return Number.isFinite(value) ? value : null;\n}\n"],"mappings":";;AACA,SAAgB,cAAc,MAAsB;CAClD,MAAM,OAAO,OAAO,IAAI;CACxB,MAAM,MAAM,KAAK,QAAQ,GAAG;CAC5B,OAAO,MAAM,IAAI,IAAI,KAAK,SAAS,MAAM;AAC3C;;AAGA,SAAgB,gBACd,OACA,EAAE,KAAK,KAAK,OAAO,KACX;CACR,IAAI,OAAO;CACX,IAAI,QAAQ,KAAA,GAAW,OAAO,KAAK,IAAI,KAAK,IAAI;CAChD,IAAI,QAAQ,KAAA,GAAW,OAAO,KAAK,IAAI,KAAK,IAAI;CAChD,MAAM,YAAY,cAAc,IAAI;CACpC,OAAO,OAAO,KAAK,QAAQ,SAAS,CAAC;AACvC;;AAGA,SAAgB,YAAY,MAA6B;CACvD,MAAM,UAAU,KAAK,KAAK,CAAC,CAAC,QAAQ,KAAK,GAAG;CAC5C,IAAI,YAAY,MAAM,YAAY,OAAO,YAAY,KAAK,OAAO;CACjE,MAAM,QAAQ,OAAO,OAAO;CAC5B,OAAO,OAAO,SAAS,KAAK,IAAI,QAAQ;AAC1C"}

package/dist/components/forms/NumberInput/index.d.ts

@@ -0,0 +1,3 @@
+export { NumberInput } from "./NumberInput";
+export type { NumberInputProps } from "./NumberInput.types";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/forms/NumberInput/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/forms/NumberInput/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,YAAY,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC"}

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

@@ -5,4 +5,5 @@ export * from "./BlockCheckbox";
 export * from "./BlockRadio";
 export * from "./BlockToggle";
 export * from "./BlockSlider";
+export * from "./NumberInput";
 //# sourceMappingURL=index.d.ts.map

package/dist/components/forms/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/forms/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/forms/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC"}

package/dist/components/inventory/InventorySlot/InventorySlot.js

@@ -4,7 +4,7 @@ import { useInventoryGrid, useSlotIndex } from "../InventoryGrid/context.js";
 import InventorySlot_module_default from "./InventorySlot.module.js";
 import { forwardRef, useCallback, useId, useLayoutEffect, useRef, useState } from "react";
 import { LockIcon } from "@malilion/block-ui-icons";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/inventory/InventorySlot/InventorySlot.tsx
 /**
 * A single inventory slot. Inside an `InventoryGrid` it becomes a roving-focus
@@ -61,7 +61,7 @@ var InventorySlot = forwardRef(function InventorySlot({ selected, disabled = fal
 		}
 		onKeyDown?.(event);
 	};
-	const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+	const content = /* @__PURE__ */ jsxs(Fragment$1, { children: [
 		/* @__PURE__ */ jsx("span", {
 			className: InventorySlot_module_default.content,
 			children

package/dist/components/inventory/InventorySlot/InventorySlot.js.map

@@ -1 +1 @@
-{"version":3,"file":"InventorySlot.js","names":["_Fragment","styles"],"sources":["../../../../src/components/inventory/InventorySlot/InventorySlot.tsx"],"sourcesContent":["import { LockIcon } from \"@malilion/block-ui-icons\";\nimport {\n  forwardRef,\n  useCallback,\n  useId,\n  useLayoutEffect,\n  useRef,\n  useState,\n  type FocusEvent,\n  type KeyboardEvent,\n  type MouseEvent,\n  type Ref,\n} from \"react\";\nimport { cx } from \"../../../utils/cx\";\nimport { mergeRefs } from \"../../../utils/refs\";\nimport { useInventoryGrid, useSlotIndex } from \"../InventoryGrid/context\";\nimport styles from \"./InventorySlot.module.css\";\nimport type { InventorySlotProps } from \"./InventorySlot.types\";\n\ntype Placement = \"right\" | \"left\";\n\n/**\n * A single inventory slot. Inside an `InventoryGrid` it becomes a roving-focus\n * grid cell; standalone it is a toggle button (when `onClick` is set) or a\n * static well.\n */\nexport const InventorySlot = forwardRef<HTMLElement, InventorySlotProps>(function InventorySlot(\n  {\n    selected,\n    disabled = false,\n    locked = false,\n    rarity,\n    children,\n    onClick,\n    tooltip,\n    label,\n    size = \"md\",\n    className,\n    onKeyDown,\n    onMouseEnter,\n    onMouseLeave,\n    onFocus,\n    onBlur,\n    ...rest\n  },\n  ref,\n) {\n  const grid = useInventoryGrid();\n  const index = useSlotIndex();\n  const inGrid = grid !== null && index >= 0;\n  const inactive = disabled || locked;\n  const isSelected = selected ?? (inGrid ? grid.selectedIndex === index : false);\n  const empty = children === undefined || children === null || children === false;\n  /** Non-interactive wells cannot carry aria-label, so their label is rendered as hidden text. */\n  const staticWell = !inGrid && !onClick;\n\n  const tooltipId = useId();\n  const [tooltipOpen, setTooltipOpen] = useState(false);\n  const [placement, setPlacement] = useState<Placement>(\"right\");\n  const tooltipRef = useRef<HTMLDivElement>(null);\n\n  useLayoutEffect(() => {\n    if (!tooltipOpen || !tooltipRef.current) return;\n    const rect = tooltipRef.current.getBoundingClientRect();\n    if (placement === \"right\" && rect.right > window.innerWidth - 8) setPlacement(\"left\");\n  }, [tooltipOpen, placement]);\n\n  const register = useCallback(\n    (element: HTMLElement | null) => {\n      if (inGrid) grid.registerCell(index, element);\n    },\n    [grid, inGrid, index],\n  );\n\n  const openTooltip = () => {\n    if (tooltip) setTooltipOpen(true);\n  };\n  const closeTooltip = () => {\n    setTooltipOpen(false);\n    setPlacement(\"right\");\n  };\n\n  const handleClick = () => {\n    if (inGrid) {\n      grid.setFocusedIndex(index);\n      if (!inactive) grid.select(index);\n    }\n    if (!inactive) onClick?.();\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLElement>) => {\n    if (event.key === \"Escape\" && tooltipOpen) {\n      event.stopPropagation();\n      closeTooltip();\n    }\n    if (inGrid && (event.key === \"Enter\" || event.key === \" \")) {\n      event.preventDefault();\n      handleClick();\n    }\n    onKeyDown?.(event);\n  };\n\n  const content = (\n    <>\n      <span className={styles.content}>{children}</span>\n      {empty && !label ? <span className=\"block-visually-hidden\">Empty slot</span> : null}\n      {label && staticWell ? <span className=\"block-visually-hidden\">{label}</span> : null}\n      {locked ? (\n        <span className={styles.lock} aria-hidden=\"true\">\n          <LockIcon size={16} />\n        </span>\n      ) : null}\n      {tooltip ? (\n        <div\n          ref={tooltipRef}\n          id={tooltipId}\n          role=\"tooltip\"\n          aria-hidden=\"true\"\n          hidden={!tooltipOpen}\n          className={styles.tooltip}\n          data-placement={placement}\n        >\n          {tooltip}\n        </div>\n      ) : null}\n    </>\n  );\n\n  const shared = {\n    className: cx(styles.slot, !inGrid && styles[size], className),\n    \"data-selected\": isSelected || undefined,\n    \"data-disabled\": disabled || undefined,\n    \"data-locked\": locked || undefined,\n    \"data-rarity\": rarity,\n    \"data-empty\": empty || undefined,\n    \"aria-label\": staticWell ? undefined : label,\n    \"aria-describedby\": tooltip ? tooltipId : undefined,\n    onKeyDown: handleKeyDown,\n    onMouseEnter: (event: MouseEvent<HTMLElement>) => {\n      openTooltip();\n      onMouseEnter?.(event);\n    },\n    onMouseLeave: (event: MouseEvent<HTMLElement>) => {\n      closeTooltip();\n      onMouseLeave?.(event);\n    },\n    onFocus: (event: FocusEvent<HTMLElement>) => {\n      openTooltip();\n      onFocus?.(event);\n    },\n    onBlur: (event: FocusEvent<HTMLElement>) => {\n      closeTooltip();\n      onBlur?.(event);\n    },\n    ...rest,\n  };\n\n  if (inGrid) {\n    return (\n      <div\n        ref={mergeRefs(ref, register)}\n        role=\"gridcell\"\n        tabIndex={grid.focusedIndex === index ? 0 : -1}\n        aria-selected={isSelected}\n        aria-disabled={inactive || undefined}\n        onClick={handleClick}\n        {...shared}\n        onKeyDown={handleKeyDown}\n      >\n        {content}\n      </div>\n    );\n  }\n\n  if (onClick) {\n    return (\n      <button\n        ref={ref as Ref<HTMLButtonElement>}\n        type=\"button\"\n        aria-pressed={isSelected}\n        aria-disabled={inactive || undefined}\n        onClick={handleClick}\n        {...shared}\n      >\n        {content}\n      </button>\n    );\n  }\n\n  return (\n    // Non-interactive slots with tooltips must be focusable so keyboard users can trigger the tooltip\n    // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n    <div ref={ref as Ref<HTMLDivElement>} tabIndex={tooltip ? 0 : undefined} {...shared}>\n      {content}\n    </div>\n  );\n});\n"],"mappings":"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"}
+{"version":3,"file":"InventorySlot.js","names":["_Fragment","styles"],"sources":["../../../../src/components/inventory/InventorySlot/InventorySlot.tsx"],"sourcesContent":["import { LockIcon } from \"@malilion/block-ui-icons\";\nimport {\n  forwardRef,\n  useCallback,\n  useId,\n  useLayoutEffect,\n  useRef,\n  useState,\n  type FocusEvent,\n  type KeyboardEvent,\n  type MouseEvent,\n  type Ref,\n} from \"react\";\nimport { cx } from \"../../../utils/cx\";\nimport { mergeRefs } from \"../../../utils/refs\";\nimport { useInventoryGrid, useSlotIndex } from \"../InventoryGrid/context\";\nimport styles from \"./InventorySlot.module.css\";\nimport type { InventorySlotProps } from \"./InventorySlot.types\";\n\ntype Placement = \"right\" | \"left\";\n\n/**\n * A single inventory slot. Inside an `InventoryGrid` it becomes a roving-focus\n * grid cell; standalone it is a toggle button (when `onClick` is set) or a\n * static well.\n */\nexport const InventorySlot = forwardRef<HTMLElement, InventorySlotProps>(function InventorySlot(\n  {\n    selected,\n    disabled = false,\n    locked = false,\n    rarity,\n    children,\n    onClick,\n    tooltip,\n    label,\n    size = \"md\",\n    className,\n    onKeyDown,\n    onMouseEnter,\n    onMouseLeave,\n    onFocus,\n    onBlur,\n    ...rest\n  },\n  ref,\n) {\n  const grid = useInventoryGrid();\n  const index = useSlotIndex();\n  const inGrid = grid !== null && index >= 0;\n  const inactive = disabled || locked;\n  const isSelected = selected ?? (inGrid ? grid.selectedIndex === index : false);\n  const empty = children === undefined || children === null || children === false;\n  /** Non-interactive wells cannot carry aria-label, so their label is rendered as hidden text. */\n  const staticWell = !inGrid && !onClick;\n\n  const tooltipId = useId();\n  const [tooltipOpen, setTooltipOpen] = useState(false);\n  const [placement, setPlacement] = useState<Placement>(\"right\");\n  const tooltipRef = useRef<HTMLDivElement>(null);\n\n  useLayoutEffect(() => {\n    if (!tooltipOpen || !tooltipRef.current) return;\n    const rect = tooltipRef.current.getBoundingClientRect();\n    if (placement === \"right\" && rect.right > window.innerWidth - 8) setPlacement(\"left\");\n  }, [tooltipOpen, placement]);\n\n  const register = useCallback(\n    (element: HTMLElement | null) => {\n      if (inGrid) grid.registerCell(index, element);\n    },\n    [grid, inGrid, index],\n  );\n\n  const openTooltip = () => {\n    if (tooltip) setTooltipOpen(true);\n  };\n  const closeTooltip = () => {\n    setTooltipOpen(false);\n    setPlacement(\"right\");\n  };\n\n  const handleClick = () => {\n    if (inGrid) {\n      grid.setFocusedIndex(index);\n      if (!inactive) grid.select(index);\n    }\n    if (!inactive) onClick?.();\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLElement>) => {\n    if (event.key === \"Escape\" && tooltipOpen) {\n      event.stopPropagation();\n      closeTooltip();\n    }\n    if (inGrid && (event.key === \"Enter\" || event.key === \" \")) {\n      event.preventDefault();\n      handleClick();\n    }\n    onKeyDown?.(event);\n  };\n\n  const content = (\n    <>\n      <span className={styles.content}>{children}</span>\n      {empty && !label ? <span className=\"block-visually-hidden\">Empty slot</span> : null}\n      {label && staticWell ? <span className=\"block-visually-hidden\">{label}</span> : null}\n      {locked ? (\n        <span className={styles.lock} aria-hidden=\"true\">\n          <LockIcon size={16} />\n        </span>\n      ) : null}\n      {tooltip ? (\n        <div\n          ref={tooltipRef}\n          id={tooltipId}\n          role=\"tooltip\"\n          aria-hidden=\"true\"\n          hidden={!tooltipOpen}\n          className={styles.tooltip}\n          data-placement={placement}\n        >\n          {tooltip}\n        </div>\n      ) : null}\n    </>\n  );\n\n  const shared = {\n    className: cx(styles.slot, !inGrid && styles[size], className),\n    \"data-selected\": isSelected || undefined,\n    \"data-disabled\": disabled || undefined,\n    \"data-locked\": locked || undefined,\n    \"data-rarity\": rarity,\n    \"data-empty\": empty || undefined,\n    \"aria-label\": staticWell ? undefined : label,\n    \"aria-describedby\": tooltip ? tooltipId : undefined,\n    onKeyDown: handleKeyDown,\n    onMouseEnter: (event: MouseEvent<HTMLElement>) => {\n      openTooltip();\n      onMouseEnter?.(event);\n    },\n    onMouseLeave: (event: MouseEvent<HTMLElement>) => {\n      closeTooltip();\n      onMouseLeave?.(event);\n    },\n    onFocus: (event: FocusEvent<HTMLElement>) => {\n      openTooltip();\n      onFocus?.(event);\n    },\n    onBlur: (event: FocusEvent<HTMLElement>) => {\n      closeTooltip();\n      onBlur?.(event);\n    },\n    ...rest,\n  };\n\n  if (inGrid) {\n    return (\n      <div\n        ref={mergeRefs(ref, register)}\n        role=\"gridcell\"\n        tabIndex={grid.focusedIndex === index ? 0 : -1}\n        aria-selected={isSelected}\n        aria-disabled={inactive || undefined}\n        onClick={handleClick}\n        {...shared}\n        onKeyDown={handleKeyDown}\n      >\n        {content}\n      </div>\n    );\n  }\n\n  if (onClick) {\n    return (\n      <button\n        ref={ref as Ref<HTMLButtonElement>}\n        type=\"button\"\n        aria-pressed={isSelected}\n        aria-disabled={inactive || undefined}\n        onClick={handleClick}\n        {...shared}\n      >\n        {content}\n      </button>\n    );\n  }\n\n  return (\n    // Non-interactive slots with tooltips must be focusable so keyboard users can trigger the tooltip\n    // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n    <div ref={ref as Ref<HTMLDivElement>} tabIndex={tooltip ? 0 : undefined} {...shared}>\n      {content}\n    </div>\n  );\n});\n"],"mappings":"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"}

package/dist/components/layout/Accordion/Accordion.d.ts

@@ -0,0 +1,7 @@
+import type { AccordionProps } from "./Accordion.types";
+/**
+ * Collapsible sections following the WAI-ARIA accordion pattern: each header is
+ * a button inside a heading; ↑ / ↓ / Home / End move between headers.
+ */
+export declare const Accordion: import("react").ForwardRefExoticComponent<AccordionProps & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=Accordion.d.ts.map

package/dist/components/layout/Accordion/Accordion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/Accordion/Accordion.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAIxD;;;GAGG;AACH,eAAO,MAAM,SAAS,2GA0FpB,CAAC"}

package/dist/components/layout/Accordion/Accordion.js

@@ -0,0 +1,95 @@
+import { cx } from "../../../utils/cx.js";
+import { useControllableState } from "../../../hooks/useControllableState.js";
+import Accordion_module_default from "./Accordion.module.js";
+import { createElement, forwardRef, useId, useRef } from "react";
+import { ChevronDownIcon } from "@malilion/block-ui-icons";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/layout/Accordion/Accordion.tsx
+var EMPTY = [];
+/**
+* Collapsible sections following the WAI-ARIA accordion pattern: each header is
+* a button inside a heading; ↑ / ↓ / Home / End move between headers.
+*/
+var Accordion = forwardRef(function Accordion({ items, type = "single", value, defaultValue = EMPTY, onValueChange, headingLevel = 3, className, ...rest }, ref) {
+	const baseId = useId();
+	const [open, setOpen] = useControllableState({
+		value,
+		defaultValue,
+		onChange: onValueChange
+	});
+	const triggers = useRef(/* @__PURE__ */ new Map());
+	const enabled = items.filter((item) => !item.disabled);
+	const toggle = (id) => {
+		const isOpen = open.includes(id);
+		if (type === "single") setOpen(isOpen ? [] : [id]);
+		else setOpen(isOpen ? open.filter((openId) => openId !== id) : [...open, id]);
+	};
+	const onKeyDown = (event) => {
+		const index = enabled.findIndex((item) => triggers.current.get(item.id) === document.activeElement);
+		if (index < 0) return;
+		let next = null;
+		if (event.key === "ArrowDown") next = (index + 1) % enabled.length;
+		else if (event.key === "ArrowUp") next = (index - 1 + enabled.length) % enabled.length;
+		else if (event.key === "Home") next = 0;
+		else if (event.key === "End") next = enabled.length - 1;
+		if (next === null) return;
+		event.preventDefault();
+		const target = enabled[next];
+		if (target) triggers.current.get(target.id)?.focus();
+	};
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		className: cx(Accordion_module_default.accordion, className),
+		...rest,
+		children: items.map((item) => {
+			const isOpen = open.includes(item.id);
+			const triggerId = `${baseId}-trigger-${item.id}`;
+			const panelId = `${baseId}-panel-${item.id}`;
+			return /* @__PURE__ */ jsxs("div", {
+				className: Accordion_module_default.item,
+				"data-open": isOpen || void 0,
+				children: [createElement(`h${headingLevel}`, { className: Accordion_module_default.heading }, /* @__PURE__ */ jsxs("button", {
+					ref: (element) => {
+						if (element) triggers.current.set(item.id, element);
+						else triggers.current.delete(item.id);
+					},
+					id: triggerId,
+					type: "button",
+					"aria-expanded": isOpen,
+					"aria-controls": panelId,
+					disabled: item.disabled,
+					className: Accordion_module_default.trigger,
+					onClick: () => toggle(item.id),
+					onKeyDown,
+					children: [
+						item.icon ? /* @__PURE__ */ jsx("span", {
+							className: Accordion_module_default.icon,
+							"aria-hidden": "true",
+							children: item.icon
+						}) : null,
+						/* @__PURE__ */ jsx("span", {
+							className: Accordion_module_default.title,
+							children: item.title
+						}),
+						/* @__PURE__ */ jsx("span", {
+							className: Accordion_module_default.chevron,
+							"aria-hidden": "true",
+							children: /* @__PURE__ */ jsx(ChevronDownIcon, { size: 16 })
+						})
+					]
+				})), /* @__PURE__ */ jsx("div", {
+					id: panelId,
+					role: "region",
+					"aria-labelledby": triggerId,
+					hidden: !isOpen,
+					className: Accordion_module_default.panel,
+					children: item.content
+				})]
+			}, item.id);
+		})
+	});
+});
+//#endregion
+export { Accordion };
+
+//# sourceMappingURL=Accordion.js.map

package/dist/components/layout/Accordion/Accordion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.js","names":["styles"],"sources":["../../../../src/components/layout/Accordion/Accordion.tsx"],"sourcesContent":["import { ChevronDownIcon } from \"@malilion/block-ui-icons\";\nimport { createElement, forwardRef, useId, useRef, type KeyboardEvent } from \"react\";\nimport { useControllableState } from \"../../../hooks/useControllableState\";\nimport { cx } from \"../../../utils/cx\";\nimport styles from \"./Accordion.module.css\";\nimport type { AccordionProps } from \"./Accordion.types\";\n\nconst EMPTY: string[] = [];\n\n/**\n * Collapsible sections following the WAI-ARIA accordion pattern: each header is\n * a button inside a heading; ↑ / ↓ / Home / End move between headers.\n */\nexport const Accordion = forwardRef<HTMLDivElement, AccordionProps>(function Accordion(\n  {\n    items,\n    type = \"single\",\n    value,\n    defaultValue = EMPTY,\n    onValueChange,\n    headingLevel = 3,\n    className,\n    ...rest\n  },\n  ref,\n) {\n  const baseId = useId();\n  const [open, setOpen] = useControllableState({ value, defaultValue, onChange: onValueChange });\n  const triggers = useRef(new Map<string, HTMLButtonElement>());\n  const enabled = items.filter((item) => !item.disabled);\n\n  const toggle = (id: string) => {\n    const isOpen = open.includes(id);\n    if (type === \"single\") setOpen(isOpen ? [] : [id]);\n    else setOpen(isOpen ? open.filter((openId) => openId !== id) : [...open, id]);\n  };\n\n  const onKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n    const index = enabled.findIndex(\n      (item) => triggers.current.get(item.id) === document.activeElement,\n    );\n    if (index < 0) return;\n    let next: number | null = null;\n    if (event.key === \"ArrowDown\") next = (index + 1) % enabled.length;\n    else if (event.key === \"ArrowUp\") next = (index - 1 + enabled.length) % enabled.length;\n    else if (event.key === \"Home\") next = 0;\n    else if (event.key === \"End\") next = enabled.length - 1;\n    if (next === null) return;\n    event.preventDefault();\n    const target = enabled[next];\n    if (target) triggers.current.get(target.id)?.focus();\n  };\n\n  return (\n    <div ref={ref} className={cx(styles.accordion, className)} {...rest}>\n      {items.map((item) => {\n        const isOpen = open.includes(item.id);\n        const triggerId = `${baseId}-trigger-${item.id}`;\n        const panelId = `${baseId}-panel-${item.id}`;\n        return (\n          <div key={item.id} className={styles.item} data-open={isOpen || undefined}>\n            {createElement(\n              `h${headingLevel}`,\n              { className: styles.heading },\n              <button\n                ref={(element) => {\n                  if (element) triggers.current.set(item.id, element);\n                  else triggers.current.delete(item.id);\n                }}\n                id={triggerId}\n                type=\"button\"\n                aria-expanded={isOpen}\n                aria-controls={panelId}\n                disabled={item.disabled}\n                className={styles.trigger}\n                onClick={() => toggle(item.id)}\n                onKeyDown={onKeyDown}\n              >\n                {item.icon ? (\n                  <span className={styles.icon} aria-hidden=\"true\">\n                    {item.icon}\n                  </span>\n                ) : null}\n                <span className={styles.title}>{item.title}</span>\n                <span className={styles.chevron} aria-hidden=\"true\">\n                  <ChevronDownIcon size={16} />\n                </span>\n              </button>,\n            )}\n            <div\n              id={panelId}\n              role=\"region\"\n              aria-labelledby={triggerId}\n              hidden={!isOpen}\n              className={styles.panel}\n            >\n              {item.content}\n            </div>\n          </div>\n        );\n      })}\n    </div>\n  );\n});\n"],"mappings":";;;;;;;AAOA,IAAM,QAAkB,CAAC;;;;;AAMzB,IAAa,YAAY,WAA2C,SAAS,UAC3E,EACE,OACA,OAAO,UACP,OACA,eAAe,OACf,eACA,eAAe,GACf,WACA,GAAG,QAEL,KACA;CACA,MAAM,SAAS,MAAM;CACrB,MAAM,CAAC,MAAM,WAAW,qBAAqB;EAAE;EAAO;EAAc,UAAU;CAAc,CAAC;CAC7F,MAAM,WAAW,uBAAO,IAAI,IAA+B,CAAC;CAC5D,MAAM,UAAU,MAAM,QAAQ,SAAS,CAAC,KAAK,QAAQ;CAErD,MAAM,UAAU,OAAe;EAC7B,MAAM,SAAS,KAAK,SAAS,EAAE;EAC/B,IAAI,SAAS,UAAU,QAAQ,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC;OAC5C,QAAQ,SAAS,KAAK,QAAQ,WAAW,WAAW,EAAE,IAAI,CAAC,GAAG,MAAM,EAAE,CAAC;CAC9E;CAEA,MAAM,aAAa,UAA4C;EAC7D,MAAM,QAAQ,QAAQ,WACnB,SAAS,SAAS,QAAQ,IAAI,KAAK,EAAE,MAAM,SAAS,aACvD;EACA,IAAI,QAAQ,GAAG;EACf,IAAI,OAAsB;EAC1B,IAAI,MAAM,QAAQ,aAAa,QAAQ,QAAQ,KAAK,QAAQ;OACvD,IAAI,MAAM,QAAQ,WAAW,QAAQ,QAAQ,IAAI,QAAQ,UAAU,QAAQ;OAC3E,IAAI,MAAM,QAAQ,QAAQ,OAAO;OACjC,IAAI,MAAM,QAAQ,OAAO,OAAO,QAAQ,SAAS;EACtD,IAAI,SAAS,MAAM;EACnB,MAAM,eAAe;EACrB,MAAM,SAAS,QAAQ;EACvB,IAAI,QAAQ,SAAS,QAAQ,IAAI,OAAO,EAAE,CAAC,EAAE,MAAM;CACrD;CAEA,OACE,oBAAC,OAAD;EAAU;EAAK,WAAW,GAAGA,yBAAO,WAAW,SAAS;EAAG,GAAI;EAC5D,UAAA,MAAM,KAAK,SAAS;GACnB,MAAM,SAAS,KAAK,SAAS,KAAK,EAAE;GACpC,MAAM,YAAY,GAAG,OAAO,WAAW,KAAK;GAC5C,MAAM,UAAU,GAAG,OAAO,SAAS,KAAK;GACxC,OACE,qBAAC,OAAD;IAAmB,WAAWA,yBAAO;IAAM,aAAW,UAAU,KAAA;IAAhE,UAAA,CACG,cACC,IAAI,gBACJ,EAAE,WAAWA,yBAAO,QAAQ,GAC5B,qBAAC,UAAD;KACE,MAAM,YAAY;MAChB,IAAI,SAAS,SAAS,QAAQ,IAAI,KAAK,IAAI,OAAO;WAC7C,SAAS,QAAQ,OAAO,KAAK,EAAE;KACtC;KACA,IAAI;KACJ,MAAK;KACL,iBAAe;KACf,iBAAe;KACf,UAAU,KAAK;KACf,WAAWA,yBAAO;KAClB,eAAe,OAAO,KAAK,EAAE;KAClB;KAZb,UAAA;MAcG,KAAK,OACJ,oBAAC,QAAD;OAAM,WAAWA,yBAAO;OAAM,eAAY;OACvC,UAAA,KAAK;MACF,CAAA,IACJ;MACJ,oBAAC,QAAD;OAAM,WAAWA,yBAAO;OAAQ,UAAA,KAAK;MAAY,CAAA;MACjD,oBAAC,QAAD;OAAM,WAAWA,yBAAO;OAAS,eAAY;OAC3C,UAAA,oBAAC,iBAAD,EAAiB,MAAM,GAAK,CAAA;MACxB,CAAA;KACA;IACV,CAAA,CAAA,GACA,oBAAC,OAAD;KACE,IAAI;KACJ,MAAK;KACL,mBAAiB;KACjB,QAAQ,CAAC;KACT,WAAWA,yBAAO;KAEjB,UAAA,KAAK;IACH,CAAA,CACF;GAtCK,GAAA,KAAK,EAsCV;EAET,CAAC;CACE,CAAA;AAET,CAAC"}

package/dist/components/layout/Accordion/Accordion.module.js

@@ -0,0 +1,23 @@
+//#region src/components/layout/Accordion/Accordion.module.css
+var accordion = "block-accordion-u7KUD";
+var item = "block-item-Anf9u";
+var heading = "block-heading-YzlrO";
+var trigger = "block-trigger-r-rVI";
+var icon = "block-icon-ja4pL";
+var title = "block-title-xq19m";
+var chevron = "block-chevron-hKGfT";
+var panel = "block-panel-wcIDx";
+var Accordion_module_default = {
+	accordion,
+	item,
+	heading,
+	trigger,
+	icon,
+	title,
+	chevron,
+	panel
+};
+//#endregion
+export { accordion, chevron, Accordion_module_default as default, heading, icon, item, panel, title, trigger };
+
+//# sourceMappingURL=Accordion.module.js.map

package/dist/components/layout/Accordion/Accordion.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.module.js","names":[],"sources":["../../../../src/components/layout/Accordion/Accordion.module.css"],"sourcesContent":[".accordion {\n  display: flex;\n  flex-direction: column;\n  gap: var(--block-space-1);\n  width: 100%;\n}\n\n.item {\n  background-color: var(--block-surface);\n  border: var(--block-border-width) solid var(--block-border);\n  box-shadow: var(--block-shadow-bevel);\n}\n\n.heading {\n  margin: 0;\n}\n\n.trigger {\n  display: flex;\n  align-items: center;\n  gap: var(--block-space-2);\n  width: 100%;\n  min-height: 44px;\n  padding: var(--block-space-2) var(--block-space-3);\n  font-family: var(--block-font-display);\n  font-size: var(--block-font-size-sm);\n  font-weight: var(--block-font-weight-bold);\n  letter-spacing: var(--block-letter-spacing-wide);\n  text-align: left;\n  text-transform: uppercase;\n  color: var(--block-text);\n  background-color: var(--block-surface-header);\n  border: 0;\n  cursor: pointer;\n}\n\n.trigger:hover:not(:disabled) {\n  background-color: var(--block-slot-hover);\n}\n\n.trigger:focus-visible {\n  outline: 3px solid var(--block-focus);\n  outline-offset: -3px;\n}\n\n.trigger:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n.icon {\n  display: inline-flex;\n  flex-shrink: 0;\n}\n\n.title {\n  flex: 1;\n  min-width: 0;\n  overflow-wrap: anywhere;\n}\n\n.chevron {\n  display: inline-flex;\n  flex-shrink: 0;\n  transition: transform var(--block-duration-instant) var(--block-ease-step);\n}\n\n.item[data-open] .chevron {\n  transform: rotate(180deg);\n}\n\n.panel {\n  padding: var(--block-space-3);\n  border-top: var(--block-border-width-thin) solid var(--block-border);\n  color: var(--block-text);\n}\n\n.panel[hidden] {\n  display: none;\n}\n"],"mappings":""}

package/dist/components/layout/Accordion/Accordion.types.d.ts

@@ -0,0 +1,21 @@
+import type { HTMLAttributes, ReactNode } from "react";
+export interface AccordionItem {
+    id: string;
+    title: ReactNode;
+    content: ReactNode;
+    icon?: ReactNode;
+    disabled?: boolean;
+}
+export interface AccordionProps extends Omit<HTMLAttributes<HTMLDivElement>, "defaultValue"> {
+    items: AccordionItem[];
+    /** `single` keeps at most one section open. @default "single" */
+    type?: "single" | "multiple";
+    /** Controlled open section ids. */
+    value?: string[];
+    /** Initially open section ids. @default [] */
+    defaultValue?: string[];
+    onValueChange?: (open: string[]) => void;
+    /** Heading level wrapping each trigger. @default 3 */
+    headingLevel?: 2 | 3 | 4 | 5 | 6;
+}
+//# sourceMappingURL=Accordion.types.d.ts.map

package/dist/components/layout/Accordion/Accordion.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.types.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/Accordion/Accordion.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,MAAM,WAAW,aAAa;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,SAAS,CAAC;IACjB,OAAO,EAAE,SAAS,CAAC;IACnB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,cAAc,CAAC;IAC1F,KAAK,EAAE,aAAa,EAAE,CAAC;IACvB,iEAAiE;IACjE,IAAI,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC;IAC7B,mCAAmC;IACnC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,8CAA8C;IAC9C,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACzC,sDAAsD;IACtD,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;CAClC"}

package/dist/components/layout/Accordion/index.d.ts

@@ -0,0 +1,3 @@
+export { Accordion } from "./Accordion";
+export type { AccordionItem, AccordionProps } from "./Accordion.types";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/layout/Accordion/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/Accordion/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/components/layout/BlockContainer/BlockContainer.d.ts

@@ -0,0 +1,4 @@
+import type { BlockContainerProps } from "./BlockContainer.types";
+/** Centres content at a readable max width with 16px side gutters. */
+export declare const BlockContainer: import("react").ForwardRefExoticComponent<BlockContainerProps & import("react").RefAttributes<HTMLElement>>;
+//# sourceMappingURL=BlockContainer.d.ts.map

package/dist/components/layout/BlockContainer/BlockContainer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BlockContainer.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/BlockContainer/BlockContainer.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAElE,sEAAsE;AACtE,eAAO,MAAM,cAAc,6GAezB,CAAC"}

package/dist/components/layout/BlockContainer/BlockContainer.js

@@ -0,0 +1,18 @@
+import { cx } from "../../../utils/cx.js";
+import BlockContainer_module_default from "./BlockContainer.module.js";
+import { createElement, forwardRef } from "react";
+//#region src/components/layout/BlockContainer/BlockContainer.tsx
+/** Centres content at a readable max width with 16px side gutters. */
+var BlockContainer = forwardRef(function BlockContainer({ size = "lg", flush = false, as = "div", className, children, ...rest }, ref) {
+	return createElement(as, {
+		ref,
+		"data-size": size,
+		"data-flush": flush || void 0,
+		className: cx(BlockContainer_module_default.container, className),
+		...rest
+	}, children);
+});
+//#endregion
+export { BlockContainer };
+
+//# sourceMappingURL=BlockContainer.js.map

package/dist/components/layout/BlockContainer/BlockContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BlockContainer.js","names":["styles"],"sources":["../../../../src/components/layout/BlockContainer/BlockContainer.tsx"],"sourcesContent":["import { createElement, forwardRef } from \"react\";\nimport { cx } from \"../../../utils/cx\";\nimport styles from \"./BlockContainer.module.css\";\nimport type { BlockContainerProps } from \"./BlockContainer.types\";\n\n/** Centres content at a readable max width with 16px side gutters. */\nexport const BlockContainer = forwardRef<HTMLElement, BlockContainerProps>(function BlockContainer(\n  { size = \"lg\", flush = false, as = \"div\", className, children, ...rest },\n  ref,\n) {\n  return createElement(\n    as,\n    {\n      ref,\n      \"data-size\": size,\n      \"data-flush\": flush || undefined,\n      className: cx(styles.container, className),\n      ...rest,\n    },\n    children,\n  );\n});\n"],"mappings":";;;;;AAMA,IAAa,iBAAiB,WAA6C,SAAS,eAClF,EAAE,OAAO,MAAM,QAAQ,OAAO,KAAK,OAAO,WAAW,UAAU,GAAG,QAClE,KACA;CACA,OAAO,cACL,IACA;EACE;EACA,aAAa;EACb,cAAc,SAAS,KAAA;EACvB,WAAW,GAAGA,8BAAO,WAAW,SAAS;EACzC,GAAG;CACL,GACA,QACF;AACF,CAAC"}

package/dist/components/layout/BlockContainer/BlockContainer.module.js

@@ -0,0 +1,7 @@
+//#region src/components/layout/BlockContainer/BlockContainer.module.css
+var container = "block-container-UJuv-";
+var BlockContainer_module_default = { container };
+//#endregion
+export { container, BlockContainer_module_default as default };
+
+//# sourceMappingURL=BlockContainer.module.js.map

package/dist/components/layout/BlockContainer/BlockContainer.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BlockContainer.module.js","names":[],"sources":["../../../../src/components/layout/BlockContainer/BlockContainer.module.css"],"sourcesContent":[".container {\n  box-sizing: border-box;\n  width: 100%;\n  max-width: 1024px;\n  margin-inline: auto;\n  padding-inline: var(--block-space-4);\n}\n\n.container[data-size=\"sm\"] {\n  max-width: 640px;\n}\n\n.container[data-size=\"md\"] {\n  max-width: 768px;\n}\n\n.container[data-size=\"xl\"] {\n  max-width: 1280px;\n}\n\n.container[data-size=\"full\"] {\n  max-width: none;\n}\n\n.container[data-flush] {\n  padding-inline: 0;\n}\n"],"mappings":""}

package/dist/components/layout/BlockContainer/BlockContainer.types.d.ts

@@ -0,0 +1,11 @@
+import type { HTMLAttributes, ReactNode } from "react";
+export interface BlockContainerProps extends HTMLAttributes<HTMLElement> {
+    /** Max width: 640 / 768 / 1024 / 1280 px (the breakpoints) or `full`. @default "lg" */
+    size?: "sm" | "md" | "lg" | "xl" | "full";
+    /** Remove the 16px side gutters. */
+    flush?: boolean;
+    /** Render as a different element. @default "div" */
+    as?: "div" | "main" | "section" | "article" | "header" | "footer";
+    children?: ReactNode;
+}
+//# sourceMappingURL=BlockContainer.types.d.ts.map

package/dist/components/layout/BlockContainer/BlockContainer.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BlockContainer.types.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/BlockContainer/BlockContainer.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,MAAM,WAAW,mBAAoB,SAAQ,cAAc,CAAC,WAAW,CAAC;IACtE,uFAAuF;IACvF,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;IAC1C,oCAAoC;IACpC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,oDAAoD;IACpD,EAAE,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAClE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB"}

package/dist/components/layout/BlockContainer/index.d.ts

@@ -0,0 +1,3 @@
+export { BlockContainer } from "./BlockContainer";
+export type { BlockContainerProps } from "./BlockContainer.types";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/layout/BlockContainer/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/BlockContainer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,YAAY,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC"}

package/dist/components/layout/BlockGrid/BlockGrid.d.ts

@@ -0,0 +1,4 @@
+import type { BlockGridProps } from "./BlockGrid.types";
+/** Two-dimensional grid: fixed equal columns, or auto-fill with a minimum item width. */
+export declare const BlockGrid: import("react").ForwardRefExoticComponent<BlockGridProps & import("react").RefAttributes<HTMLElement>>;
+//# sourceMappingURL=BlockGrid.d.ts.map

package/dist/components/layout/BlockGrid/BlockGrid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BlockGrid.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/BlockGrid/BlockGrid.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAExD,yFAAyF;AACzF,eAAO,MAAM,SAAS,wGAgCpB,CAAC"}