npm - @malilion/block-ui-react - Versions diffs - 0.3.0 → 0.4.0 - Mend

@malilion/block-ui-react 0.3.0 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (90) hide show

package/dist/components/display/Avatar/Avatar.d.ts ADDED Viewed

@@ -0,0 +1,7 @@
+import type { AvatarProps } from "./Avatar.types";
+/**
+ * Square block avatar: a pixelated face image, or initials on a material
+ * colour picked from the name, with an optional presence dot.
+ */
+export declare const Avatar: import("react").ForwardRefExoticComponent<AvatarProps & import("react").RefAttributes<HTMLSpanElement>>;
+//# sourceMappingURL=Avatar.d.ts.map

package/dist/components/display/Avatar/Avatar.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../../src/components/display/Avatar/Avatar.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAKlD;;;GAGG;AACH,eAAO,MAAM,MAAM,yGAiCjB,CAAC"}

package/dist/components/display/Avatar/Avatar.js ADDED Viewed

@@ -0,0 +1,53 @@
+import { cx } from "../../../utils/cx.js";
+import Avatar_module_default from "./Avatar.module.js";
+import { avatarMaterial, initials } from "./Avatar.utils.js";
+import { forwardRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/display/Avatar/Avatar.tsx
+var STATUS_TEXT = {
+	online: "online",
+	away: "away",
+	busy: "busy",
+	offline: "offline"
+};
+/**
+* Square block avatar: a pixelated face image, or initials on a material
+* colour picked from the name, with an optional presence dot.
+*/
+var Avatar = forwardRef(function Avatar({ name, src, icon, size = "md", status, decorative = false, className, ...rest }, ref) {
+	const [failedSrc, setFailedSrc] = useState(void 0);
+	const showImage = src !== void 0 && src !== failedSrc;
+	const accessibleName = status ? `${name} (${STATUS_TEXT[status]})` : name;
+	return /* @__PURE__ */ jsxs("span", {
+		ref,
+		role: decorative ? void 0 : "img",
+		"aria-label": decorative ? void 0 : accessibleName,
+		"aria-hidden": decorative || void 0,
+		"data-size": size,
+		"data-material": avatarMaterial(name),
+		className: cx(Avatar_module_default.avatar, className),
+		...rest,
+		children: [showImage ? /* @__PURE__ */ jsx("img", {
+			src,
+			alt: "",
+			className: Avatar_module_default.image,
+			onError: () => setFailedSrc(src)
+		}) : icon ? /* @__PURE__ */ jsx("span", {
+			className: Avatar_module_default.icon,
+			"aria-hidden": "true",
+			children: icon
+		}) : /* @__PURE__ */ jsx("span", {
+			className: Avatar_module_default.initials,
+			"aria-hidden": "true",
+			children: initials(name)
+		}), status ? /* @__PURE__ */ jsx("span", {
+			className: Avatar_module_default.status,
+			"data-status": status,
+			"aria-hidden": "true"
+		}) : null]
+	});
+});
+//#endregion
+export { Avatar };
+//# sourceMappingURL=Avatar.js.map

package/dist/components/display/Avatar/Avatar.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Avatar.js","names":["styles"],"sources":["../../../../src/components/display/Avatar/Avatar.tsx"],"sourcesContent":["import { forwardRef, useState } from \"react\";\nimport { cx } from \"../../../utils/cx\";\nimport styles from \"./Avatar.module.css\";\nimport type { AvatarProps } from \"./Avatar.types\";\nimport { avatarMaterial, initials } from \"./Avatar.utils\";\n\nconst STATUS_TEXT = { online: \"online\", away: \"away\", busy: \"busy\", offline: \"offline\" } as const;\n\n/**\n * Square block avatar: a pixelated face image, or initials on a material\n * colour picked from the name, with an optional presence dot.\n */\nexport const Avatar = forwardRef<HTMLSpanElement, AvatarProps>(function Avatar(\n { name, src, icon, size = \"md\", status, decorative = false, className, ...rest },\n ref,\n) {\n const [failedSrc, setFailedSrc] = useState<string | undefined>(undefined);\n const showImage = src !== undefined && src !== failedSrc;\n const accessibleName = status ? `${name} (${STATUS_TEXT[status]})` : name;\n\n return (\n <span\n ref={ref}\n role={decorative ? undefined : \"img\"}\n aria-label={decorative ? undefined : accessibleName}\n aria-hidden={decorative || undefined}\n data-size={size}\n data-material={avatarMaterial(name)}\n className={cx(styles.avatar, className)}\n {...rest}\n >\n {showImage ? (\n <img src={src} alt=\"\" className={styles.image} onError={() => setFailedSrc(src)} />\n ) : icon ? (\n <span className={styles.icon} aria-hidden=\"true\">\n {icon}\n </span>\n ) : (\n <span className={styles.initials} aria-hidden=\"true\">\n {initials(name)}\n </span>\n )}\n {status ? <span className={styles.status} data-status={status} aria-hidden=\"true\" /> : null}\n </span>\n );\n});\n"],"mappings":";;;;;;AAMA,IAAM,cAAc;CAAE,QAAQ;CAAU,MAAM;CAAQ,MAAM;CAAQ,SAAS;AAAU;;;;;AAMvF,IAAa,SAAS,WAAyC,SAAS,OACtE,EAAE,MAAM,KAAK,MAAM,OAAO,MAAM,QAAQ,aAAa,OAAO,WAAW,GAAG,QAC1E,KACA;CACA,MAAM,CAAC,WAAW,gBAAgB,SAA6B,KAAA,CAAS;CACxE,MAAM,YAAY,QAAQ,KAAA,KAAa,QAAQ;CAC/C,MAAM,iBAAiB,SAAS,GAAG,KAAK,IAAI,YAAY,QAAQ,KAAK;CAErE,OACE,qBAAC,QAAD;EACO;EACL,MAAM,aAAa,KAAA,IAAY;EAC/B,cAAY,aAAa,KAAA,IAAY;EACrC,eAAa,cAAc,KAAA;EAC3B,aAAW;EACX,iBAAe,eAAe,IAAI;EAClC,WAAW,GAAGA,sBAAO,QAAQ,SAAS;EACtC,GAAI;EARN,UAAA,CAUG,YACC,oBAAC,OAAD;GAAU;GAAK,KAAI;GAAG,WAAWA,sBAAO;GAAO,eAAe,aAAa,GAAG;EAAI,CAAA,IAChF,OACF,oBAAC,QAAD;GAAM,WAAWA,sBAAO;GAAM,eAAY;GACvC,UAAA;EACG,CAAA,IAEN,oBAAC,QAAD;GAAM,WAAWA,sBAAO;GAAU,eAAY;GAC3C,UAAA,SAAS,IAAI;EACV,CAAA,GAEP,SAAS,oBAAC,QAAD;GAAM,WAAWA,sBAAO;GAAQ,eAAa;GAAQ,eAAY;EAAQ,CAAA,IAAI,IACnF;;AAEV,CAAC"}

package/dist/components/display/Avatar/Avatar.module.js ADDED Viewed

@@ -0,0 +1,17 @@
+//#region src/components/display/Avatar/Avatar.module.css
+var avatar = "block-avatar-9s1vM";
+var image = "block-image-RZELF";
+var icon = "block-icon-mq-FE";
+var initials = "block-initials-siD-X";
+var status = "block-status-CalIQ";
+var Avatar_module_default = {
+	avatar,
+	image,
+	icon,
+	initials,
+	status
+};
+//#endregion
+export { avatar, Avatar_module_default as default, icon, image, initials, status };
+//# sourceMappingURL=Avatar.module.js.map

package/dist/components/display/Avatar/Avatar.module.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Avatar.module.js","names":[],"sources":["../../../../src/components/display/Avatar/Avatar.module.css"],"sourcesContent":[".avatar {\n --avatar-size: 32px;\n position: relative;\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n width: var(--avatar-size);\n height: var(--avatar-size);\n color: var(--block-mat-on);\n background-color: var(--block-mat);\n border: var(--block-border-width-thin) solid var(--block-black);\n box-shadow:\n inset 2px 2px 0 var(--block-mat-light),\n inset -2px -2px 0 var(--block-mat-dark);\n vertical-align: middle;\n}\n\n.avatar[data-size=\"sm\"] {\n --avatar-size: 24px;\n}\n\n.avatar[data-size=\"lg\"] {\n --avatar-size: 48px;\n}\n\n.avatar[data-size=\"xl\"] {\n --avatar-size: 64px;\n}\n\n.image {\n width: 100%;\n height: 100%;\n object-fit: cover;\n image-rendering: pixelated;\n}\n\n.icon {\n display: inline-flex;\n width: 70%;\n height: 70%;\n}\n\n.icon > * {\n width: 100%;\n height: 100%;\n}\n\n.initials {\n font-family: var(--block-font-display);\n font-size: calc(var(--avatar-size) * 0.4);\n font-weight: var(--block-font-weight-bold);\n line-height: 1;\n text-shadow: var(--block-mat-text-shadow, none);\n}\n\n/* Presence dot, a quarter of the avatar, in the bottom-right corner. */\n.status {\n position: absolute;\n right: -3px;\n bottom: -3px;\n width: max(8px, calc(var(--avatar-size) * 0.3));\n height: max(8px, calc(var(--avatar-size) * 0.3));\n border: 2px solid var(--block-black);\n}\n\n.status[data-status=\"online\"] {\n background-color: var(--block-emerald-light);\n}\n\n.status[data-status=\"away\"] {\n background-color: var(--block-gold-light);\n}\n\n.status[data-status=\"busy\"] {\n background-color: var(--block-redstone-light);\n}\n\n.status[data-status=\"offline\"] {\n background-color: var(--block-stone);\n}\n"],"mappings":""}

package/dist/components/display/Avatar/Avatar.types.d.ts ADDED Viewed

@@ -0,0 +1,18 @@
+import type { HTMLAttributes, ReactNode } from "react";
+export declare const avatarStatuses: readonly ["online", "away", "busy", "offline"];
+export type AvatarStatus = (typeof avatarStatuses)[number];
+export interface AvatarProps extends HTMLAttributes<HTMLSpanElement> {
+    /** Player name: the accessible name and the source of the initials. */
+    name: string;
+    /** Skin / face image URL (rendered pixelated). Falls back to initials if it fails. */
+    src?: string;
+    /** Icon instead of initials when there is no image. */
+    icon?: ReactNode;
+    /** 24 / 32 / 48 / 64 px. @default "md" */
+    size?: "sm" | "md" | "lg" | "xl";
+    /** Presence dot in the corner. */
+    status?: AvatarStatus;
+    /** Hide from assistive technology when the name is already shown next to it. */
+    decorative?: boolean;
+}
+//# sourceMappingURL=Avatar.types.d.ts.map

package/dist/components/display/Avatar/Avatar.types.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Avatar.types.d.ts","sourceRoot":"","sources":["../../../../src/components/display/Avatar/Avatar.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,eAAO,MAAM,cAAc,gDAAiD,CAAC;AAE7E,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAC;AAE3D,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAC,eAAe,CAAC;IAClE,uEAAuE;IACvE,IAAI,EAAE,MAAM,CAAC;IACb,sFAAsF;IACtF,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,uDAAuD;IACvD,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,0CAA0C;IAC1C,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACjC,kCAAkC;IAClC,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,gFAAgF;IAChF,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB"}

package/dist/components/display/Avatar/Avatar.types.js ADDED Viewed

@@ -0,0 +1,11 @@
+//#region src/components/display/Avatar/Avatar.types.ts
+var avatarStatuses = [
+	"online",
+	"away",
+	"busy",
+	"offline"
+];
+//#endregion
+export { avatarStatuses };
+//# sourceMappingURL=Avatar.types.js.map

package/dist/components/display/Avatar/Avatar.types.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Avatar.types.js","names":[],"sources":["../../../../src/components/display/Avatar/Avatar.types.ts"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\n\nexport const avatarStatuses = [\"online\", \"away\", \"busy\", \"offline\"] as const;\n\nexport type AvatarStatus = (typeof avatarStatuses)[number];\n\nexport interface AvatarProps extends HTMLAttributes<HTMLSpanElement> {\n /** Player name: the accessible name and the source of the initials. */\n name: string;\n /** Skin / face image URL (rendered pixelated). Falls back to initials if it fails. */\n src?: string;\n /** Icon instead of initials when there is no image. */\n icon?: ReactNode;\n /** 24 / 32 / 48 / 64 px. @default \"md\" */\n size?: \"sm\" | \"md\" | \"lg\" | \"xl\";\n /** Presence dot in the corner. */\n status?: AvatarStatus;\n /** Hide from assistive technology when the name is already shown next to it. */\n decorative?: boolean;\n}\n"],"mappings":";AAEA,IAAa,iBAAiB;CAAC;CAAU;CAAQ;CAAQ;AAAS"}

package/dist/components/display/Avatar/Avatar.utils.d.ts ADDED Viewed

@@ -0,0 +1,7 @@
+/** Up to two letters: first letters of the first two words, or the first two characters. */
+export declare function initials(name: string): string;
+declare const MATERIALS: readonly ["grass", "diamond", "gold", "redstone", "amethyst", "emerald", "wood", "water"];
+/** Stable block material for a name, so a player always gets the same colour. */
+export declare function avatarMaterial(name: string): (typeof MATERIALS)[number];
+export {};
+//# sourceMappingURL=Avatar.utils.d.ts.map

package/dist/components/display/Avatar/Avatar.utils.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"Avatar.utils.d.ts","sourceRoot":"","sources":["../../../../src/components/display/Avatar/Avatar.utils.ts"],"names":[],"mappings":"AAAA,4FAA4F;AAC5F,wBAAgB,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAS7C;AAED,QAAA,MAAM,SAAS,2FASL,CAAC;AAEX,iFAAiF;AACjF,wBAAgB,cAAc,CAAC,IAAI,EAAE,MAAM,GAAG,CAAC,OAAO,SAAS,CAAC,CAAC,MAAM,CAAC,CAIvE"}

package/dist/components/display/Avatar/Avatar.utils.js ADDED Viewed

@@ -0,0 +1,28 @@
+//#region src/components/display/Avatar/Avatar.utils.ts
+/** Up to two letters: first letters of the first two words, or the first two characters. */
+function initials(name) {
+	const words = name.replace(/[_\-.]+/g, " ").trim().split(/\s+/).filter(Boolean);
+	if (words.length === 0) return "?";
+	if (words.length === 1) return (words[0] ?? "").slice(0, 2).toUpperCase();
+	return `${words[0]?.[0] ?? ""}${words[1]?.[0] ?? ""}`.toUpperCase();
+}
+var MATERIALS = [
+	"grass",
+	"diamond",
+	"gold",
+	"redstone",
+	"amethyst",
+	"emerald",
+	"wood",
+	"water"
+];
+/** Stable block material for a name, so a player always gets the same colour. */
+function avatarMaterial(name) {
+	let hash = 0;
+	for (const char of name) hash = hash * 31 + char.charCodeAt(0) >>> 0;
+	return MATERIALS[hash % MATERIALS.length] ?? "grass";
+}
+//#endregion
+export { avatarMaterial, initials };
+//# sourceMappingURL=Avatar.utils.js.map

package/dist/components/display/Avatar/Avatar.utils.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Avatar.utils.js","names":[],"sources":["../../../../src/components/display/Avatar/Avatar.utils.ts"],"sourcesContent":["/** Up to two letters: first letters of the first two words, or the first two characters. */\nexport function initials(name: string): string {\n const words = name\n .replace(/[_\\-.]+/g, \" \")\n .trim()\n .split(/\\s+/)\n .filter(Boolean);\n if (words.length === 0) return \"?\";\n if (words.length === 1) return (words[0] ?? \"\").slice(0, 2).toUpperCase();\n return `${words[0]?.[0] ?? \"\"}${words[1]?.[0] ?? \"\"}`.toUpperCase();\n}\n\nconst MATERIALS = [\n \"grass\",\n \"diamond\",\n \"gold\",\n \"redstone\",\n \"amethyst\",\n \"emerald\",\n \"wood\",\n \"water\",\n] as const;\n\n/** Stable block material for a name, so a player always gets the same colour. */\nexport function avatarMaterial(name: string): (typeof MATERIALS)[number] {\n let hash = 0;\n for (const char of name) hash = (hash * 31 + char.charCodeAt(0)) >>> 0;\n return MATERIALS[hash % MATERIALS.length] ?? \"grass\";\n}\n"],"mappings":";;AACA,SAAgB,SAAS,MAAsB;CAC7C,MAAM,QAAQ,KACX,QAAQ,YAAY,GAAG,CAAC,CACxB,KAAK,CAAC,CACN,MAAM,KAAK,CAAC,CACZ,OAAO,OAAO;CACjB,IAAI,MAAM,WAAW,GAAG,OAAO;CAC/B,IAAI,MAAM,WAAW,GAAG,QAAQ,MAAM,MAAM,GAAA,CAAI,MAAM,GAAG,CAAC,CAAC,CAAC,YAAY;CACxE,OAAO,GAAG,MAAM,EAAE,GAAG,MAAM,KAAK,MAAM,EAAE,GAAG,MAAM,KAAK,YAAY;AACpE;AAEA,IAAM,YAAY;CAChB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF;;AAGA,SAAgB,eAAe,MAA0C;CACvE,IAAI,OAAO;CACX,KAAK,MAAM,QAAQ,MAAM,OAAQ,OAAO,KAAK,KAAK,WAAW,CAAC,MAAO;CACrE,OAAO,UAAU,OAAO,UAAU,WAAW;AAC/C"}

package/dist/components/display/Avatar/index.d.ts ADDED Viewed

@@ -0,0 +1,5 @@
+export { Avatar } from "./Avatar";
+export { avatarStatuses } from "./Avatar.types";
+export { initials } from "./Avatar.utils";
+export type { AvatarProps, AvatarStatus } from "./Avatar.types";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/display/Avatar/index.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/display/Avatar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,YAAY,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/components/display/index.d.ts CHANGED Viewed

@@ -2,4 +2,5 @@ export * from "./BlockBadge";
 export * from "./BlockTooltip";
 export * from "./BlockTable";
 export * from "./SkillTree";
+export * from "./Avatar";
 //# sourceMappingURL=index.d.ts.map

package/dist/components/display/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/display/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/display/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC"}

package/dist/components/feedback/Drawer/Drawer.d.ts ADDED Viewed

@@ -0,0 +1,7 @@
+import type { DrawerProps } from "./Drawer.types";
+/**
+ * Panel that slides in from an edge (inventory, settings, mobile menu). Modal
+ * like `BlockModal`: focus trap, Escape, overlay click and focus restoration.
+ */
+export declare const Drawer: import("react").ForwardRefExoticComponent<DrawerProps & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=Drawer.d.ts.map

package/dist/components/feedback/Drawer/Drawer.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/Drawer/Drawer.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAElD;;;GAGG;AACH,eAAO,MAAM,MAAM,wGAsEjB,CAAC"}

package/dist/components/feedback/Drawer/Drawer.js ADDED Viewed

@@ -0,0 +1,78 @@
+import { cx } from "../../../utils/cx.js";
+import { usePortalContainer } from "../../../provider/context.js";
+import { mergeRefs } from "../../../utils/refs.js";
+import { useFocusTrap } from "../../../hooks/useFocusTrap.js";
+import { useScrollLock } from "../../../hooks/useScrollLock.js";
+import Drawer_module_default from "./Drawer.module.js";
+import { forwardRef, useId, useRef } from "react";
+import { createPortal } from "react-dom";
+import { CloseIcon } from "@malilion/block-ui-icons";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/feedback/Drawer/Drawer.tsx
+/**
+* Panel that slides in from an edge (inventory, settings, mobile menu). Modal
+* like `BlockModal`: focus trap, Escape, overlay click and focus restoration.
+*/
+var Drawer = forwardRef(function Drawer({ open, onClose, title, children, footer, side = "right", size = "md", closeOnOverlayClick = true, closeOnEscape = true, initialFocusRef, className, ...rest }, ref) {
+	const container = usePortalContainer();
+	const panelRef = useRef(null);
+	const titleId = useId();
+	useFocusTrap(panelRef, open && container !== null, { initialFocus: initialFocusRef });
+	useScrollLock(open);
+	if (!open || !container) return null;
+	const handleKeyDown = (event) => {
+		if (event.key === "Escape" && closeOnEscape) {
+			event.stopPropagation();
+			onClose();
+		}
+	};
+	const handleOverlayClick = (event) => {
+		if (closeOnOverlayClick && event.target === event.currentTarget) onClose();
+	};
+	return createPortal(/* @__PURE__ */ jsx("div", {
+		role: "presentation",
+		className: Drawer_module_default.overlay,
+		"data-side": side,
+		onMouseDown: handleOverlayClick,
+		onKeyDown: handleKeyDown,
+		children: /* @__PURE__ */ jsxs("div", {
+			ref: mergeRefs(panelRef, ref),
+			role: "dialog",
+			"aria-modal": "true",
+			"aria-labelledby": titleId,
+			tabIndex: -1,
+			"data-side": side,
+			"data-size": size,
+			className: cx(Drawer_module_default.drawer, className),
+			...rest,
+			children: [
+				/* @__PURE__ */ jsxs("div", {
+					className: Drawer_module_default.header,
+					children: [/* @__PURE__ */ jsx("h2", {
+						id: titleId,
+						className: Drawer_module_default.title,
+						children: title
+					}), /* @__PURE__ */ jsx("button", {
+						type: "button",
+						className: Drawer_module_default.close,
+						"aria-label": "Close",
+						onClick: onClose,
+						children: /* @__PURE__ */ jsx(CloseIcon, { size: 16 })
+					})]
+				}),
+				/* @__PURE__ */ jsx("div", {
+					className: Drawer_module_default.body,
+					children
+				}),
+				footer ? /* @__PURE__ */ jsx("div", {
+					className: Drawer_module_default.footer,
+					children: footer
+				}) : null
+			]
+		})
+	}), container);
+});
+//#endregion
+export { Drawer };
+//# sourceMappingURL=Drawer.js.map

package/dist/components/feedback/Drawer/Drawer.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Drawer.js","names":["styles"],"sources":["../../../../src/components/feedback/Drawer/Drawer.tsx"],"sourcesContent":["import { CloseIcon } from \"@malilion/block-ui-icons\";\nimport { forwardRef, useId, useRef, type KeyboardEvent, type MouseEvent } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { useFocusTrap } from \"../../../hooks/useFocusTrap\";\nimport { useScrollLock } from \"../../../hooks/useScrollLock\";\nimport { usePortalContainer } from \"../../../provider/context\";\nimport { cx } from \"../../../utils/cx\";\nimport { mergeRefs } from \"../../../utils/refs\";\nimport styles from \"./Drawer.module.css\";\nimport type { DrawerProps } from \"./Drawer.types\";\n\n/**\n * Panel that slides in from an edge (inventory, settings, mobile menu). Modal\n * like `BlockModal`: focus trap, Escape, overlay click and focus restoration.\n */\nexport const Drawer = forwardRef<HTMLDivElement, DrawerProps>(function Drawer(\n {\n open,\n onClose,\n title,\n children,\n footer,\n side = \"right\",\n size = \"md\",\n closeOnOverlayClick = true,\n closeOnEscape = true,\n initialFocusRef,\n className,\n ...rest\n },\n ref,\n) {\n const container = usePortalContainer();\n const panelRef = useRef<HTMLDivElement>(null);\n const titleId = useId();\n\n useFocusTrap(panelRef, open && container !== null, { initialFocus: initialFocusRef });\n useScrollLock(open);\n\n if (!open || !container) return null;\n\n const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key === \"Escape\" && closeOnEscape) {\n event.stopPropagation();\n onClose();\n }\n };\n\n const handleOverlayClick = (event: MouseEvent<HTMLDivElement>) => {\n if (closeOnOverlayClick && event.target === event.currentTarget) onClose();\n };\n\n return createPortal(\n <div\n role=\"presentation\"\n className={styles.overlay}\n data-side={side}\n onMouseDown={handleOverlayClick}\n onKeyDown={handleKeyDown}\n >\n <div\n ref={mergeRefs(panelRef, ref)}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={titleId}\n tabIndex={-1}\n data-side={side}\n data-size={size}\n className={cx(styles.drawer, className)}\n {...rest}\n >\n <div className={styles.header}>\n <h2 id={titleId} className={styles.title}>\n {title}\n </h2>\n <button type=\"button\" className={styles.close} aria-label=\"Close\" onClick={onClose}>\n <CloseIcon size={16} />\n </button>\n </div>\n <div className={styles.body}>{children}</div>\n {footer ? <div className={styles.footer}>{footer}</div> : null}\n </div>\n </div>,\n container,\n );\n});\n"],"mappings":";;;;;;;;;;;;;;;AAeA,IAAa,SAAS,WAAwC,SAAS,OACrE,EACE,MACA,SACA,OACA,UACA,QACA,OAAO,SACP,OAAO,MACP,sBAAsB,MACtB,gBAAgB,MAChB,iBACA,WACA,GAAG,QAEL,KACA;CACA,MAAM,YAAY,mBAAmB;CACrC,MAAM,WAAW,OAAuB,IAAI;CAC5C,MAAM,UAAU,MAAM;CAEtB,aAAa,UAAU,QAAQ,cAAc,MAAM,EAAE,cAAc,gBAAgB,CAAC;CACpF,cAAc,IAAI;CAElB,IAAI,CAAC,QAAQ,CAAC,WAAW,OAAO;CAEhC,MAAM,iBAAiB,UAAyC;EAC9D,IAAI,MAAM,QAAQ,YAAY,eAAe;GAC3C,MAAM,gBAAgB;GACtB,QAAQ;EACV;CACF;CAEA,MAAM,sBAAsB,UAAsC;EAChE,IAAI,uBAAuB,MAAM,WAAW,MAAM,eAAe,QAAQ;CAC3E;CAEA,OAAO,aACL,oBAAC,OAAD;EACE,MAAK;EACL,WAAWA,sBAAO;EAClB,aAAW;EACX,aAAa;EACb,WAAW;EAEX,UAAA,qBAAC,OAAD;GACE,KAAK,UAAU,UAAU,GAAG;GAC5B,MAAK;GACL,cAAW;GACX,mBAAiB;GACjB,UAAU;GACV,aAAW;GACX,aAAW;GACX,WAAW,GAAGA,sBAAO,QAAQ,SAAS;GACtC,GAAI;GATN,UAAA;IAWE,qBAAC,OAAD;KAAK,WAAWA,sBAAO;KAAvB,UAAA,CACE,oBAAC,MAAD;MAAI,IAAI;MAAS,WAAWA,sBAAO;MAChC,UAAA;KACC,CAAA,GACJ,oBAAC,UAAD;MAAQ,MAAK;MAAS,WAAWA,sBAAO;MAAO,cAAW;MAAQ,SAAS;MACzE,UAAA,oBAAC,WAAD,EAAW,MAAM,GAAK,CAAA;KAChB,CAAA,CACL;;IACL,oBAAC,OAAD;KAAK,WAAWA,sBAAO;KAAO;IAAc,CAAA;IAC3C,SAAS,oBAAC,OAAD;KAAK,WAAWA,sBAAO;KAAS,UAAA;IAAY,CAAA,IAAI;GACvD;;CACF,CAAA,GACL,SACF;AACF,CAAC"}

package/dist/components/feedback/Drawer/Drawer.module.js ADDED Viewed

@@ -0,0 +1,25 @@
+//#region src/components/feedback/Drawer/Drawer.module.css
+var overlay = "block-overlay-MaF41";
+var drawer = "block-drawer-aWDC6";
+var header = "block-header-FheCx";
+var title = "block-title-4QE9I";
+var close = "block-close-fdVrq";
+var body = "block-body-aFN-w";
+var footer = "block-footer-m9z0P";
+var Drawer_module_default = {
+	overlay,
+	"block-drawer-fade": "block-block-drawer-fade-4rcmM",
+	drawer,
+	"block-drawer-in-right": "block-block-drawer-in-right-Krar9",
+	"block-drawer-in-left": "block-block-drawer-in-left-EnlSn",
+	"block-drawer-in-bottom": "block-block-drawer-in-bottom-yyZ8z",
+	header,
+	title,
+	close,
+	body,
+	footer
+};
+//#endregion
+export { body, close, Drawer_module_default as default, drawer, footer, header, overlay, title };
+//# sourceMappingURL=Drawer.module.js.map

package/dist/components/feedback/Drawer/Drawer.module.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Drawer.module.js","names":[],"sources":["../../../../src/components/feedback/Drawer/Drawer.module.css"],"sourcesContent":[".overlay {\n position: fixed;\n inset: 0;\n z-index: var(--block-z-modal);\n display: flex;\n justify-content: flex-end;\n background-color: var(--block-overlay);\n animation: block-drawer-fade var(--block-duration-fast) steps(3, end);\n}\n\n.overlay[data-side=\"left\"] {\n justify-content: flex-start;\n}\n\n.overlay[data-side=\"bottom\"] {\n flex-direction: column;\n justify-content: flex-end;\n}\n\n.drawer {\n --drawer-size: 360px;\n display: flex;\n flex-direction: column;\n width: min(var(--drawer-size), 100%);\n height: 100%;\n color: var(--block-text);\n background-color: var(--block-surface);\n background-image:\n linear-gradient(\n color-mix(in srgb, var(--block-surface) 88%, transparent),\n color-mix(in srgb, var(--block-surface) 88%, transparent)\n ),\n var(--block-texture);\n background-size:\n auto,\n 64px 64px;\n border-left: var(--block-border-width) solid var(--block-border);\n box-shadow: var(--block-shadow-bevel);\n outline: none;\n animation: block-drawer-in-right var(--block-duration-normal) steps(4, end);\n}\n\n.drawer[data-size=\"sm\"] {\n --drawer-size: 280px;\n}\n\n.drawer[data-size=\"lg\"] {\n --drawer-size: 520px;\n}\n\n.drawer[data-side=\"left\"] {\n border-left: 0;\n border-right: var(--block-border-width) solid var(--block-border);\n animation-name: block-drawer-in-left;\n}\n\n.drawer[data-side=\"bottom\"] {\n --drawer-size: 50dvh;\n width: 100%;\n height: min(var(--drawer-size), 100%);\n border-left: 0;\n border-top: var(--block-border-width) solid var(--block-border);\n animation-name: block-drawer-in-bottom;\n}\n\n.drawer[data-side=\"bottom\"][data-size=\"sm\"] {\n --drawer-size: 33dvh;\n}\n\n.drawer[data-side=\"bottom\"][data-size=\"lg\"] {\n --drawer-size: 80dvh;\n}\n\n.header {\n display: flex;\n align-items: center;\n gap: var(--block-space-2);\n margin: 3px 3px 0;\n padding: var(--block-space-2) var(--block-space-3);\n background-color: var(--block-surface-header);\n border-bottom: var(--block-border-width-thin) solid var(--block-border);\n}\n\n.title {\n flex: 1;\n margin: 0;\n font-family: var(--block-font-display);\n font-size: var(--block-font-size-lg);\n font-weight: var(--block-font-weight-bold);\n letter-spacing: var(--block-letter-spacing-wide);\n text-transform: uppercase;\n text-shadow: var(--block-shadow-text);\n}\n\n.close {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n padding: 0;\n color: var(--block-text);\n background-color: var(--block-slot);\n border: var(--block-border-width-thin) solid var(--block-border);\n box-shadow: var(--block-shadow-inset);\n cursor: pointer;\n}\n\n.close:focus-visible {\n outline: 3px solid var(--block-focus);\n outline-offset: 2px;\n}\n\n.body {\n flex: 1;\n min-height: 0;\n padding: var(--block-space-4);\n overflow-y: auto;\n}\n\n.footer {\n display: flex;\n flex-wrap: wrap;\n justify-content: flex-end;\n gap: var(--block-space-2);\n padding: var(--block-space-3) var(--block-space-4);\n border-top: var(--block-border-width-thin) solid var(--block-border);\n}\n\n@keyframes block-drawer-fade {\n from {\n opacity: 0;\n }\n}\n\n@keyframes block-drawer-in-right {\n from {\n transform: translateX(100%);\n }\n}\n\n@keyframes block-drawer-in-left {\n from {\n transform: translateX(-100%);\n }\n}\n\n@keyframes block-drawer-in-bottom {\n from {\n transform: translateY(100%);\n }\n}\n"],"mappings":""}

package/dist/components/feedback/Drawer/Drawer.types.d.ts ADDED Viewed

@@ -0,0 +1,21 @@
+import type { HTMLAttributes, ReactNode, RefObject } from "react";
+export interface DrawerProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
+    open: boolean;
+    /** Called on Escape, overlay click or the close button. */
+    onClose: () => void;
+    title: ReactNode;
+    children?: ReactNode;
+    /** Action row pinned to the bottom. */
+    footer?: ReactNode;
+    /** Edge the drawer slides from. @default "right" */
+    side?: "left" | "right" | "bottom";
+    /** Width (or height for `bottom`). @default "md" */
+    size?: "sm" | "md" | "lg";
+    /** @default true */
+    closeOnOverlayClick?: boolean;
+    /** @default true */
+    closeOnEscape?: boolean;
+    /** Element focused when the drawer opens. Defaults to the first focusable element. */
+    initialFocusRef?: RefObject<HTMLElement | null>;
+}
+//# sourceMappingURL=Drawer.types.d.ts.map

package/dist/components/feedback/Drawer/Drawer.types.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Drawer.types.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/Drawer/Drawer.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElE,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAChF,IAAI,EAAE,OAAO,CAAC;IACd,2DAA2D;IAC3D,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,uCAAuC;IACvC,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,oDAAoD;IACpD,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;IACnC,oDAAoD;IACpD,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,oBAAoB;IACpB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,oBAAoB;IACpB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,sFAAsF;IACtF,eAAe,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CACjD"}

package/dist/components/feedback/Drawer/index.d.ts ADDED Viewed

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

package/dist/components/feedback/Drawer/index.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/Drawer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/components/feedback/EmptyState/EmptyState.d.ts ADDED Viewed

@@ -0,0 +1,4 @@
+import type { EmptyStateProps } from "./EmptyState.types";
+/** Placeholder for an empty list or search: icon, title, description and an action. */
+export declare const EmptyState: import("react").ForwardRefExoticComponent<EmptyStateProps & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=EmptyState.d.ts.map

package/dist/components/feedback/EmptyState/EmptyState.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/EmptyState/EmptyState.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAE1D,uFAAuF;AACvF,eAAO,MAAM,UAAU,4GAcrB,CAAC"}

package/dist/components/feedback/EmptyState/EmptyState.js ADDED Viewed

@@ -0,0 +1,35 @@
+import { cx } from "../../../utils/cx.js";
+import EmptyState_module_default from "./EmptyState.module.js";
+import { createElement, forwardRef } from "react";
+import { ChestIcon } from "@malilion/block-ui-icons";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/feedback/EmptyState/EmptyState.tsx
+/** Placeholder for an empty list or search: icon, title, description and an action. */
+var EmptyState = forwardRef(function EmptyState({ title, description, icon, action, headingLevel = 3, size = "md", className, ...rest }, ref) {
+	return /* @__PURE__ */ jsxs("div", {
+		ref,
+		"data-size": size,
+		className: cx(EmptyState_module_default.empty, className),
+		...rest,
+		children: [
+			/* @__PURE__ */ jsx("span", {
+				className: EmptyState_module_default.icon,
+				"aria-hidden": "true",
+				children: icon ?? /* @__PURE__ */ jsx(ChestIcon, { size: size === "sm" ? 32 : 48 })
+			}),
+			createElement(`h${headingLevel}`, { className: EmptyState_module_default.title }, title),
+			description ? /* @__PURE__ */ jsx("p", {
+				className: EmptyState_module_default.description,
+				children: description
+			}) : null,
+			action ? /* @__PURE__ */ jsx("div", {
+				className: EmptyState_module_default.action,
+				children: action
+			}) : null
+		]
+	});
+});
+//#endregion
+export { EmptyState };
+//# sourceMappingURL=EmptyState.js.map

package/dist/components/feedback/EmptyState/EmptyState.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"EmptyState.js","names":["styles"],"sources":["../../../../src/components/feedback/EmptyState/EmptyState.tsx"],"sourcesContent":["import { ChestIcon } from \"@malilion/block-ui-icons\";\nimport { createElement, forwardRef } from \"react\";\nimport { cx } from \"../../../utils/cx\";\nimport styles from \"./EmptyState.module.css\";\nimport type { EmptyStateProps } from \"./EmptyState.types\";\n\n/** Placeholder for an empty list or search: icon, title, description and an action. */\nexport const EmptyState = forwardRef<HTMLDivElement, EmptyStateProps>(function EmptyState(\n { title, description, icon, action, headingLevel = 3, size = \"md\", className, ...rest },\n ref,\n) {\n return (\n <div ref={ref} data-size={size} className={cx(styles.empty, className)} {...rest}>\n <span className={styles.icon} aria-hidden=\"true\">\n {icon ?? <ChestIcon size={size === \"sm\" ? 32 : 48} />}\n </span>\n {createElement(`h${headingLevel}`, { className: styles.title }, title)}\n {description ? <p className={styles.description}>{description}</p> : null}\n {action ? <div className={styles.action}>{action}</div> : null}\n </div>\n );\n});\n"],"mappings":";;;;;;;AAOA,IAAa,aAAa,WAA4C,SAAS,WAC7E,EAAE,OAAO,aAAa,MAAM,QAAQ,eAAe,GAAG,OAAO,MAAM,WAAW,GAAG,QACjF,KACA;CACA,OACE,qBAAC,OAAD;EAAU;EAAK,aAAW;EAAM,WAAW,GAAGA,0BAAO,OAAO,SAAS;EAAG,GAAI;EAA5E,UAAA;GACE,oBAAC,QAAD;IAAM,WAAWA,0BAAO;IAAM,eAAY;IACvC,UAAA,QAAQ,oBAAC,WAAD,EAAW,MAAM,SAAS,OAAO,KAAK,GAAK,CAAA;GAChD,CAAA;GACL,cAAc,IAAI,gBAAgB,EAAE,WAAWA,0BAAO,MAAM,GAAG,KAAK;GACpE,cAAc,oBAAC,KAAD;IAAG,WAAWA,0BAAO;IAAc,UAAA;GAAe,CAAA,IAAI;GACpE,SAAS,oBAAC,OAAD;IAAK,WAAWA,0BAAO;IAAS,UAAA;GAAY,CAAA,IAAI;EACvD;;AAET,CAAC"}

package/dist/components/feedback/EmptyState/EmptyState.module.js ADDED Viewed

@@ -0,0 +1,17 @@
+//#region src/components/feedback/EmptyState/EmptyState.module.css
+var empty = "block-empty-CypAE";
+var icon = "block-icon-RT29d";
+var title = "block-title-gsp4I";
+var description = "block-description-es-JM";
+var action = "block-action-TqLZE";
+var EmptyState_module_default = {
+	empty,
+	icon,
+	title,
+	description,
+	action
+};
+//#endregion
+export { action, EmptyState_module_default as default, description, empty, icon, title };
+//# sourceMappingURL=EmptyState.module.js.map

package/dist/components/feedback/EmptyState/EmptyState.module.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"EmptyState.module.js","names":[],"sources":["../../../../src/components/feedback/EmptyState/EmptyState.module.css"],"sourcesContent":[".empty {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: var(--block-space-2);\n width: 100%;\n padding: var(--block-space-8) var(--block-space-4);\n text-align: center;\n color: var(--block-text);\n background-color: var(--block-slot);\n border: var(--block-border-width-thin) dashed var(--block-border);\n}\n\n.empty[data-size=\"sm\"] {\n padding: var(--block-space-4) var(--block-space-3);\n}\n\n.icon {\n display: inline-flex;\n opacity: 0.6;\n filter: grayscale(0.5);\n}\n\n.title {\n margin: 0;\n font-family: var(--block-font-display);\n font-size: var(--block-font-size-md);\n font-weight: var(--block-font-weight-bold);\n letter-spacing: var(--block-letter-spacing-wide);\n text-transform: uppercase;\n text-shadow: var(--block-shadow-text);\n}\n\n.empty[data-size=\"sm\"] .title {\n font-size: var(--block-font-size-sm);\n}\n\n.description {\n max-width: 42ch;\n margin: 0;\n font-size: var(--block-font-size-sm);\n color: var(--block-text-muted);\n}\n\n.action {\n margin-top: var(--block-space-2);\n}\n"],"mappings":""}

package/dist/components/feedback/EmptyState/EmptyState.types.d.ts ADDED Viewed

@@ -0,0 +1,14 @@
+import type { HTMLAttributes, ReactNode } from "react";
+export interface EmptyStateProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
+    title: ReactNode;
+    description?: ReactNode;
+    /** Pixel icon above the title. Defaults to an empty chest. */
+    icon?: ReactNode;
+    /** Call to action, usually a `BlockButton`. */
+    action?: ReactNode;
+    /** Heading level of the title. @default 3 */
+    headingLevel?: 2 | 3 | 4 | 5 | 6;
+    /** @default "md" */
+    size?: "sm" | "md";
+}
+//# sourceMappingURL=EmptyState.types.d.ts.map

package/dist/components/feedback/EmptyState/EmptyState.types.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"EmptyState.types.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/EmptyState/EmptyState.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IACpF,KAAK,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,8DAA8D;IAC9D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,+CAA+C;IAC/C,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,6CAA6C;IAC7C,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACjC,oBAAoB;IACpB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;CACpB"}

package/dist/components/feedback/EmptyState/index.d.ts ADDED Viewed

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

package/dist/components/feedback/EmptyState/index.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/EmptyState/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC"}

package/dist/components/feedback/Modal/BlockModal.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BlockModal.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/Modal/BlockModal.tsx"],"names":[],"mappings":"~~AAQA~~,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;~~AAI1D~~;;;GAGG;AACH,eAAO,MAAM,UAAU,~~4GAiGrB~~,CAAC"}
1	+ {"version":3,"file":"BlockModal.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/Modal/BlockModal.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAE1D;;;GAGG;AACH,eAAO,MAAM,UAAU,4GAwFrB,CAAC"}

package/dist/components/feedback/Modal/BlockModal.js CHANGED Viewed

@@ -2,13 +2,13 @@ import { cx } from "../../../utils/cx.js";
 import { usePortalContainer } from "../../../provider/context.js";
 import { mergeRefs } from "../../../utils/refs.js";
 import { useFocusTrap } from "../../../hooks/useFocusTrap.js";
+import { useScrollLock } from "../../../hooks/useScrollLock.js";
 import BlockModal_module_default from "./BlockModal.module.js";
-import { forwardRef, useEffect, useId, useRef } from "react";
+import { forwardRef, useId, useRef } from "react";
 import { createPortal } from "react-dom";
 import { CloseIcon } from "@malilion/block-ui-icons";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/feedback/Modal/BlockModal.tsx
-var openModals = 0;
 /**
 * Accessible modal dialog: focus trap, `Escape` to close, overlay, focus
 * restoration and `aria-modal` dialog semantics (PRD §45).
@@ -19,16 +19,7 @@ var BlockModal = forwardRef(function BlockModal({ open, onClose, title, descript
 	const titleId = useId();
 	const descriptionId = useId();
 	useFocusTrap(dialogRef, open && container !== null, { initialFocus: initialFocusRef });
-	useEffect(() => {
-		if (!open) return void 0;
-		openModals += 1;
-		const previous = document.body.style.overflow;
-		document.body.style.overflow = "hidden";
-		return () => {
-			openModals -= 1;
-			if (openModals === 0) document.body.style.overflow = previous;
-		};
-	}, [open]);
+	useScrollLock(open);
 	if (!open || !container) return null;
 	const handleKeyDown = (event) => {
 		if (event.key === "Escape" && closeOnEscape) {

package/dist/components/feedback/Modal/BlockModal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BlockModal.js","names":["styles"],"sources":["../../../../src/components/feedback/Modal/BlockModal.tsx"],"sourcesContent":["import { CloseIcon } from \"@malilion/block-ui-icons\";\nimport { forwardRef, ~~useEffect,~~ useId, useRef, type KeyboardEvent, type MouseEvent } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { useFocusTrap } from \"../../../hooks/useFocusTrap\";\nimport { usePortalContainer } from \"../../../provider/context\";\nimport { cx } from \"../../../utils/cx\";\nimport { mergeRefs } from \"../../../utils/refs\";\nimport styles from \"./BlockModal.module.css\";\nimport type { BlockModalProps } from \"./BlockModal.types\";\n\~~nlet openModals = 0;\~~n\n/*\n Accessible modal dialog: focus trap, `Escape` to close, overlay, focus\n * restoration and `aria-modal` dialog semantics (PRD §45).\n */\nexport const BlockModal = forwardRef<HTMLDivElement, BlockModalProps>(function BlockModal(\n {\n open,\n onClose,\n title,\n description,\n children,\n footer,\n size = \"md\",\n closeOnOverlayClick = true,\n closeOnEscape = true,\n hideCloseButton = false,\n initialFocusRef,\n role = \"dialog\",\n icon,\n className,\n ...rest\n },\n ref,\n) {\n const container = usePortalContainer();\n const dialogRef = useRef<HTMLDivElement>(null);\n const titleId = useId();\n const descriptionId = useId();\n\n useFocusTrap(dialogRef, open && container !== null, { initialFocus: initialFocusRef });\n\n ~~useEffect~~(~~() => {\n if (!~~open) ~~return undefined~~;\n ~~openModals += 1;\n const previous = document.body.style.overflow;\n document.body.style.overflow =~~ \~~"hidden\";\~~n ~~return () => {\n openModals -= 1;\n if (openModals === 0) document.body.style.overflow = previous;\n };\n~~ ~~}, [open]);\n\n~~ if (!open \|\| !container) return null;\n\n const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key === \"Escape\" && closeOnEscape) {\n event.stopPropagation();\n onClose();\n }\n };\n\n const handleOverlayClick = (event: MouseEvent<HTMLDivElement>) => {\n if (closeOnOverlayClick && event.target === event.currentTarget) onClose();\n };\n\n return createPortal(\n <div\n role=\"presentation\"\n className={styles.overlay}\n onMouseDown={handleOverlayClick}\n onKeyDown={handleKeyDown}\n >\n <div\n ref={mergeRefs(dialogRef, ref)}\n role={role}\n aria-modal=\"true\"\n aria-labelledby={titleId}\n aria-describedby={description ? descriptionId : undefined}\n tabIndex={-1}\n data-size={size}\n className={cx(styles.dialog, className)}\n {...rest}\n >\n <div className={styles.header}>\n <h2 id={titleId} className={styles.title}>\n {title}\n </h2>\n {hideCloseButton ? null : (\n <button type=\"button\" className={styles.close} aria-label=\"Close\" onClick={onClose}>\n <CloseIcon size={16} />\n </button>\n )}\n </div>\n <div className={styles.body}>\n {icon ? (\n <div className={styles.icon} aria-hidden=\"true\">\n {icon}\n </div>\n ) : null}\n {description ? (\n <div id={descriptionId} className={styles.description}>\n {description}\n </div>\n ) : null}\n {children}\n </div>\n {footer ? <div className={styles.footer}>{footer}</div> : null}\n </div>\n </div>,\n container,\n );\n});\n"],"mappings":"~~;;;;;;;;;;AAUA~~,~~IAAI,aAAa;;;;;AAMjB,~~IAAa,aAAa,WAA4C,SAAS,WAC7E,EACE,MACA,SACA,OACA,aACA,UACA,QACA,OAAO,MACP,sBAAsB,MACtB,gBAAgB,MAChB,kBAAkB,OAClB,iBACA,OAAO,UACP,MACA,WACA,GAAG,QAEL,KACA;CACA,MAAM,YAAY,mBAAmB;CACrC,MAAM,YAAY,OAAuB,IAAI;CAC7C,MAAM,UAAU,MAAM;CACtB,MAAM,gBAAgB,MAAM;CAE5B,aAAa,WAAW,QAAQ,cAAc,MAAM,EAAE,cAAc,gBAAgB,CAAC;CAErF,~~gBAAgB;EACd,IAAI,CAAC,MAAM,OAAO,KAAA;EAClB,~~cAAc~~;EACd~~,~~MAAM,WAAW,SAAS,KAAK,MAAM;EACrC,SAAS,KAAK,MAAM,WAAW;EAC/B,aAAa;GACX,cAAc;GACd,~~IAAI~~,eAAe,GAAG,SAAS,KAAK,MAAM,WAAW~~;~~EACvD;CACF~~,~~GAAG,CAAC,~~IAAI,CAAC~~;CAET~~,~~IAAI,CAAC,~~QAAQ,CAAC,WAAW,OAAO;CAEhC,MAAM,iBAAiB,UAAyC;EAC9D,IAAI,MAAM,QAAQ,YAAY,eAAe;GAC3C,MAAM,gBAAgB;GACtB,QAAQ;EACV;CACF;CAEA,MAAM,sBAAsB,UAAsC;EAChE,IAAI,uBAAuB,MAAM,WAAW,MAAM,eAAe,QAAQ;CAC3E;CAEA,OAAO,aACL,oBAAC,OAAD;EACE,MAAK;EACL,WAAWA,0BAAO;EAClB,aAAa;EACb,WAAW;EAEX,UAAA,qBAAC,OAAD;GACE,KAAK,UAAU,WAAW,GAAG;GACvB;GACN,cAAW;GACX,mBAAiB;GACjB,oBAAkB,cAAc,gBAAgB,KAAA;GAChD,UAAU;GACV,aAAW;GACX,WAAW,GAAGA,0BAAO,QAAQ,SAAS;GACtC,GAAI;GATN,UAAA;IAWE,qBAAC,OAAD;KAAK,WAAWA,0BAAO;KAAvB,UAAA,CACE,oBAAC,MAAD;MAAI,IAAI;MAAS,WAAWA,0BAAO;MAChC,UAAA;KACC,CAAA,GACH,kBAAkB,OACjB,oBAAC,UAAD;MAAQ,MAAK;MAAS,WAAWA,0BAAO;MAAO,cAAW;MAAQ,SAAS;MACzE,UAAA,oBAAC,WAAD,EAAW,MAAM,GAAK,CAAA;KAChB,CAAA,CAEP;;IACL,qBAAC,OAAD;KAAK,WAAWA,0BAAO;KAAvB,UAAA;MACG,OACC,oBAAC,OAAD;OAAK,WAAWA,0BAAO;OAAM,eAAY;OACtC,UAAA;MACE,CAAA,IACH;MACH,cACC,oBAAC,OAAD;OAAK,IAAI;OAAe,WAAWA,0BAAO;OACvC,UAAA;MACE,CAAA,IACH;MACH;KACE;;IACJ,SAAS,oBAAC,OAAD;KAAK,WAAWA,0BAAO;KAAS,UAAA;IAAY,CAAA,IAAI;GACvD;;CACF,CAAA,GACL,SACF;AACF,CAAC"}
1	+ {"version":3,"file":"BlockModal.js","names":["styles"],"sources":["../../../../src/components/feedback/Modal/BlockModal.tsx"],"sourcesContent":["import { CloseIcon } from \"@malilion/block-ui-icons\";\nimport { forwardRef, useId, useRef, type KeyboardEvent, type MouseEvent } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { useFocusTrap } from \"../../../hooks/useFocusTrap\";\nimport { useScrollLock } from \"../../../hooks/useScrollLock\";\nimport { usePortalContainer } from \"../../../provider/context\";\nimport { cx } from \"../../../utils/cx\";\nimport { mergeRefs } from \"../../../utils/refs\";\nimport styles from \"./BlockModal.module.css\";\nimport type { BlockModalProps } from \"./BlockModal.types\";\n\n/*\n Accessible modal dialog: focus trap, `Escape` to close, overlay, focus\n * restoration and `aria-modal` dialog semantics (PRD §45).\n */\nexport const BlockModal = forwardRef<HTMLDivElement, BlockModalProps>(function BlockModal(\n {\n open,\n onClose,\n title,\n description,\n children,\n footer,\n size = \"md\",\n closeOnOverlayClick = true,\n closeOnEscape = true,\n hideCloseButton = false,\n initialFocusRef,\n role = \"dialog\",\n icon,\n className,\n ...rest\n },\n ref,\n) {\n const container = usePortalContainer();\n const dialogRef = useRef<HTMLDivElement>(null);\n const titleId = useId();\n const descriptionId = useId();\n\n useFocusTrap(dialogRef, open && container !== null, { initialFocus: initialFocusRef });\n\n useScrollLock(open);\n\n if (!open \|\| !container) return null;\n\n const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key === \"Escape\" && closeOnEscape) {\n event.stopPropagation();\n onClose();\n }\n };\n\n const handleOverlayClick = (event: MouseEvent<HTMLDivElement>) => {\n if (closeOnOverlayClick && event.target === event.currentTarget) onClose();\n };\n\n return createPortal(\n <div\n role=\"presentation\"\n className={styles.overlay}\n onMouseDown={handleOverlayClick}\n onKeyDown={handleKeyDown}\n >\n <div\n ref={mergeRefs(dialogRef, ref)}\n role={role}\n aria-modal=\"true\"\n aria-labelledby={titleId}\n aria-describedby={description ? descriptionId : undefined}\n tabIndex={-1}\n data-size={size}\n className={cx(styles.dialog, className)}\n {...rest}\n >\n <div className={styles.header}>\n <h2 id={titleId} className={styles.title}>\n {title}\n </h2>\n {hideCloseButton ? null : (\n <button type=\"button\" className={styles.close} aria-label=\"Close\" onClick={onClose}>\n <CloseIcon size={16} />\n </button>\n )}\n </div>\n <div className={styles.body}>\n {icon ? (\n <div className={styles.icon} aria-hidden=\"true\">\n {icon}\n </div>\n ) : null}\n {description ? (\n <div id={descriptionId} className={styles.description}>\n {description}\n </div>\n ) : null}\n {children}\n </div>\n {footer ? <div className={styles.footer}>{footer}</div> : null}\n </div>\n </div>,\n container,\n );\n});\n"],"mappings":";;;;;;;;;;;;;;;AAeA,IAAa,aAAa,WAA4C,SAAS,WAC7E,EACE,MACA,SACA,OACA,aACA,UACA,QACA,OAAO,MACP,sBAAsB,MACtB,gBAAgB,MAChB,kBAAkB,OAClB,iBACA,OAAO,UACP,MACA,WACA,GAAG,QAEL,KACA;CACA,MAAM,YAAY,mBAAmB;CACrC,MAAM,YAAY,OAAuB,IAAI;CAC7C,MAAM,UAAU,MAAM;CACtB,MAAM,gBAAgB,MAAM;CAE5B,aAAa,WAAW,QAAQ,cAAc,MAAM,EAAE,cAAc,gBAAgB,CAAC;CAErF,cAAc,IAAI;CAElB,IAAI,CAAC,QAAQ,CAAC,WAAW,OAAO;CAEhC,MAAM,iBAAiB,UAAyC;EAC9D,IAAI,MAAM,QAAQ,YAAY,eAAe;GAC3C,MAAM,gBAAgB;GACtB,QAAQ;EACV;CACF;CAEA,MAAM,sBAAsB,UAAsC;EAChE,IAAI,uBAAuB,MAAM,WAAW,MAAM,eAAe,QAAQ;CAC3E;CAEA,OAAO,aACL,oBAAC,OAAD;EACE,MAAK;EACL,WAAWA,0BAAO;EAClB,aAAa;EACb,WAAW;EAEX,UAAA,qBAAC,OAAD;GACE,KAAK,UAAU,WAAW,GAAG;GACvB;GACN,cAAW;GACX,mBAAiB;GACjB,oBAAkB,cAAc,gBAAgB,KAAA;GAChD,UAAU;GACV,aAAW;GACX,WAAW,GAAGA,0BAAO,QAAQ,SAAS;GACtC,GAAI;GATN,UAAA;IAWE,qBAAC,OAAD;KAAK,WAAWA,0BAAO;KAAvB,UAAA,CACE,oBAAC,MAAD;MAAI,IAAI;MAAS,WAAWA,0BAAO;MAChC,UAAA;KACC,CAAA,GACH,kBAAkB,OACjB,oBAAC,UAAD;MAAQ,MAAK;MAAS,WAAWA,0BAAO;MAAO,cAAW;MAAQ,SAAS;MACzE,UAAA,oBAAC,WAAD,EAAW,MAAM,GAAK,CAAA;KAChB,CAAA,CAEP;;IACL,qBAAC,OAAD;KAAK,WAAWA,0BAAO;KAAvB,UAAA;MACG,OACC,oBAAC,OAAD;OAAK,WAAWA,0BAAO;OAAM,eAAY;OACtC,UAAA;MACE,CAAA,IACH;MACH,cACC,oBAAC,OAAD;OAAK,IAAI;OAAe,WAAWA,0BAAO;OACvC,UAAA;MACE,CAAA,IACH;MACH;KACE;;IACJ,SAAS,oBAAC,OAAD;KAAK,WAAWA,0BAAO;KAAS,UAAA;IAAY,CAAA,IAAI;GACvD;;CACF,CAAA,GACL,SACF;AACF,CAAC"}

package/dist/components/feedback/Skeleton/Skeleton.d.ts ADDED Viewed

@@ -0,0 +1,7 @@
+import type { SkeletonProps } from "./Skeleton.types";
+/**
+ * Pixel placeholder shown while content loads. Decorative (`aria-hidden`):
+ * mark the loading container with `aria-busy` and announce loading separately.
+ */
+export declare const Skeleton: import("react").ForwardRefExoticComponent<SkeletonProps & import("react").RefAttributes<HTMLSpanElement>>;
+//# sourceMappingURL=Skeleton.d.ts.map

package/dist/components/feedback/Skeleton/Skeleton.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../../../src/components/feedback/Skeleton/Skeleton.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEtD;;;GAGG;AACH,eAAO,MAAM,QAAQ,2GA6BnB,CAAC"}

package/dist/components/feedback/Skeleton/Skeleton.js ADDED Viewed

@@ -0,0 +1,33 @@
+import { cx } from "../../../utils/cx.js";
+import Skeleton_module_default from "./Skeleton.module.js";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/feedback/Skeleton/Skeleton.tsx
+/**
+* Pixel placeholder shown while content loads. Decorative (`aria-hidden`):
+* mark the loading container with `aria-busy` and announce loading separately.
+*/
+var Skeleton = forwardRef(function Skeleton({ variant = "text", lines = 1, width, height, className, style, ...rest }, ref) {
+	const sizing = {
+		...width ? { "--block-skeleton-width": width } : null,
+		...height ? { "--block-skeleton-height": height } : null,
+		...style
+	};
+	const count = variant === "text" ? Math.max(1, Math.floor(lines)) : 1;
+	return /* @__PURE__ */ jsx("span", {
+		ref,
+		"aria-hidden": "true",
+		"data-variant": variant,
+		className: cx(Skeleton_module_default.skeleton, className),
+		style: sizing,
+		...rest,
+		children: Array.from({ length: count }, (_, index) => /* @__PURE__ */ jsx("span", {
+			className: Skeleton_module_default.bone,
+			"data-last": count > 1 && index === count - 1 || void 0
+		}, index))
+	});
+});
+//#endregion
+export { Skeleton };
+//# sourceMappingURL=Skeleton.js.map