@drivenets/design-system 0.0.3 → 0.0.5

package/dist/components/ds-drawer/ds-drawer.cjs

@@ -4,6 +4,7 @@ require('../ds-icon/index.cjs');
 const require_ds_typography = require('../ds-typography/ds-typography.cjs');
 require('../ds-typography/index.cjs');
 const require_ds_drawer_module = require('./ds-drawer.module.cjs');
+let react_compiler_runtime = require("react/compiler-runtime");
 let classnames = require("classnames");
 classnames = require_rolldown_runtime.__toESM(classnames);
 let react_jsx_runtime = require("react/jsx-runtime");
@@ -17,73 +18,272 @@ let __ark_ui_react_dialog = require("@ark-ui/react/dialog");
 * Supports grid-based sizing, flexible positioning, and compound components.
 * Use columns prop to control drawer width (1-12 grid columns).
 */
-const DsDrawer = ({ open, onOpenChange, columns = 4, position = "end", backdrop = false, closeOnEscape = true, closeOnInteractOutside = false, portal = false, style, className, children }) => {
-	const handleOpenChange = (details) => {
-		onOpenChange(details.open);
-	};
+const DsDrawer = (t0) => {
+	const $ = (0, react_compiler_runtime.c)(25);
+	const { open, onOpenChange, columns: t1, position: t2, backdrop: t3, closeOnEscape: t4, closeOnInteractOutside: t5, portal: t6, style, className, children } = t0;
+	const columns = t1 === void 0 ? 4 : t1;
+	const position = t2 === void 0 ? "end" : t2;
+	const backdrop = t3 === void 0 ? false : t3;
+	const closeOnEscape = t4 === void 0 ? true : t4;
+	const closeOnInteractOutside = t5 === void 0 ? false : t5;
+	const portal = t6 === void 0 ? false : t6;
+	let t7;
+	if ($[0] !== onOpenChange) {
+		t7 = (details) => {
+			onOpenChange(details.open);
+		};
+		$[0] = onOpenChange;
+		$[1] = t7;
+	} else t7 = $[1];
+	const handleOpenChange = t7;
 	const Wrapper = portal ? __ark_ui_react_portal.Portal : react.Fragment;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_dialog.Dialog.Root, {
-		open,
-		onOpenChange: handleOpenChange,
-		modal: backdrop,
-		closeOnEscape,
-		closeOnInteractOutside,
-		preventScroll: backdrop,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Wrapper, { children: [backdrop && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_dialog.Dialog.Backdrop, { className: require_ds_drawer_module.default.backdrop }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_dialog.Dialog.Positioner, {
+	let t8;
+	if ($[2] !== backdrop) {
+		t8 = backdrop && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_dialog.Dialog.Backdrop, { className: require_ds_drawer_module.default.backdrop });
+		$[2] = backdrop;
+		$[3] = t8;
+	} else t8 = $[3];
+	const t9 = require_ds_drawer_module.default[`cols-${String(columns)}`];
+	const t10 = require_ds_drawer_module.default[`position-${position}`];
+	let t11;
+	if ($[4] !== className || $[5] !== t10 || $[6] !== t9) {
+		t11 = (0, classnames.default)(require_ds_drawer_module.default.drawer, t9, t10, className);
+		$[4] = className;
+		$[5] = t10;
+		$[6] = t9;
+		$[7] = t11;
+	} else t11 = $[7];
+	let t12;
+	if ($[8] !== children) {
+		t12 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: require_ds_drawer_module.default.content,
+			children
+		});
+		$[8] = children;
+		$[9] = t12;
+	} else t12 = $[9];
+	let t13;
+	if ($[10] !== style || $[11] !== t11 || $[12] !== t12) {
+		t13 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_dialog.Dialog.Positioner, {
 			className: require_ds_drawer_module.default.positioner,
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_dialog.Dialog.Content, {
 				style,
-				className: (0, classnames.default)(require_ds_drawer_module.default.drawer, require_ds_drawer_module.default[`cols-${String(columns)}`], require_ds_drawer_module.default[`position-${position}`], className),
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-					className: require_ds_drawer_module.default.content,
-					children
-				})
+				className: t11,
+				children: t12
 			})
-		})] })
-	});
+		});
+		$[10] = style;
+		$[11] = t11;
+		$[12] = t12;
+		$[13] = t13;
+	} else t13 = $[13];
+	let t14;
+	if ($[14] !== Wrapper || $[15] !== t13 || $[16] !== t8) {
+		t14 = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Wrapper, { children: [t8, t13] });
+		$[14] = Wrapper;
+		$[15] = t13;
+		$[16] = t8;
+		$[17] = t14;
+	} else t14 = $[17];
+	let t15;
+	if ($[18] !== backdrop || $[19] !== closeOnEscape || $[20] !== closeOnInteractOutside || $[21] !== handleOpenChange || $[22] !== open || $[23] !== t14) {
+		t15 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_dialog.Dialog.Root, {
+			open,
+			onOpenChange: handleOpenChange,
+			modal: backdrop,
+			closeOnEscape,
+			closeOnInteractOutside,
+			preventScroll: backdrop,
+			children: t14
+		});
+		$[18] = backdrop;
+		$[19] = closeOnEscape;
+		$[20] = closeOnInteractOutside;
+		$[21] = handleOpenChange;
+		$[22] = open;
+		$[23] = t14;
+		$[24] = t15;
+	} else t15 = $[24];
+	return t15;
+};
+const Header = (t0) => {
+	const $ = (0, react_compiler_runtime.c)(6);
+	const { style, className, children } = t0;
+	let t1;
+	if ($[0] !== className) {
+		t1 = (0, classnames.default)(require_ds_drawer_module.default.header, className);
+		$[0] = className;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] !== children || $[3] !== style || $[4] !== t1) {
+		t2 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			style,
+			className: t1,
+			children
+		});
+		$[2] = children;
+		$[3] = style;
+		$[4] = t1;
+		$[5] = t2;
+	} else t2 = $[5];
+	return t2;
+};
+const Title = (t0) => {
+	const $ = (0, react_compiler_runtime.c)(8);
+	const { style, className, children } = t0;
+	let t1;
+	if ($[0] !== className) {
+		t1 = (0, classnames.default)(require_ds_drawer_module.default.title, className);
+		$[0] = className;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] !== children) {
+		t2 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_typography.default, {
+			variant: "heading3",
+			children
+		});
+		$[2] = children;
+		$[3] = t2;
+	} else t2 = $[3];
+	let t3;
+	if ($[4] !== style || $[5] !== t1 || $[6] !== t2) {
+		t3 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_dialog.Dialog.Title, {
+			className: t1,
+			style,
+			asChild: true,
+			children: t2
+		});
+		$[4] = style;
+		$[5] = t1;
+		$[6] = t2;
+		$[7] = t3;
+	} else t3 = $[7];
+	return t3;
+};
+const CloseTrigger = (t0) => {
+	const $ = (0, react_compiler_runtime.c)(6);
+	const { style, className } = t0;
+	let t1;
+	if ($[0] !== className) {
+		t1 = (0, classnames.default)(require_ds_drawer_module.default.closeTrigger, className);
+		$[0] = className;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_icon.default, {
+			icon: "close",
+			size: "small"
+		});
+		$[2] = t2;
+	} else t2 = $[2];
+	let t3;
+	if ($[3] !== style || $[4] !== t1) {
+		t3 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_dialog.Dialog.CloseTrigger, {
+			style,
+			className: t1,
+			children: t2
+		});
+		$[3] = style;
+		$[4] = t1;
+		$[5] = t3;
+	} else t3 = $[5];
+	return t3;
+};
+const Toolbar = (t0) => {
+	const $ = (0, react_compiler_runtime.c)(6);
+	const { style, className, children } = t0;
+	let t1;
+	if ($[0] !== className) {
+		t1 = (0, classnames.default)(require_ds_drawer_module.default.toolbar, className);
+		$[0] = className;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] !== children || $[3] !== style || $[4] !== t1) {
+		t2 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			style,
+			className: t1,
+			children
+		});
+		$[2] = children;
+		$[3] = style;
+		$[4] = t1;
+		$[5] = t2;
+	} else t2 = $[5];
+	return t2;
+};
+const Body = (t0) => {
+	const $ = (0, react_compiler_runtime.c)(6);
+	const { style, className, children } = t0;
+	let t1;
+	if ($[0] !== className) {
+		t1 = (0, classnames.default)(require_ds_drawer_module.default.body, className);
+		$[0] = className;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] !== children || $[3] !== style || $[4] !== t1) {
+		t2 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			style,
+			className: t1,
+			children
+		});
+		$[2] = children;
+		$[3] = style;
+		$[4] = t1;
+		$[5] = t2;
+	} else t2 = $[5];
+	return t2;
+};
+const Footer = (t0) => {
+	const $ = (0, react_compiler_runtime.c)(6);
+	const { style, className, children } = t0;
+	let t1;
+	if ($[0] !== className) {
+		t1 = (0, classnames.default)(require_ds_drawer_module.default.footer, className);
+		$[0] = className;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] !== children || $[3] !== style || $[4] !== t1) {
+		t2 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			style,
+			className: t1,
+			children
+		});
+		$[2] = children;
+		$[3] = style;
+		$[4] = t1;
+		$[5] = t2;
+	} else t2 = $[5];
+	return t2;
+};
+const Actions = (t0) => {
+	const $ = (0, react_compiler_runtime.c)(6);
+	const { style, className, children } = t0;
+	let t1;
+	if ($[0] !== className) {
+		t1 = (0, classnames.default)(require_ds_drawer_module.default.actions, className);
+		$[0] = className;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] !== children || $[3] !== style || $[4] !== t1) {
+		t2 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			style,
+			className: t1,
+			children
+		});
+		$[2] = children;
+		$[3] = style;
+		$[4] = t1;
+		$[5] = t2;
+	} else t2 = $[5];
+	return t2;
 };
-const Header = ({ style, className, children }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-	style,
-	className: (0, classnames.default)(require_ds_drawer_module.default.header, className),
-	children
-});
-const Title = ({ style, className, children }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_dialog.Dialog.Title, {
-	className: (0, classnames.default)(require_ds_drawer_module.default.title, className),
-	style,
-	asChild: true,
-	children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_typography.default, {
-		variant: "heading3",
-		children
-	})
-});
-const CloseTrigger = ({ style, className }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_dialog.Dialog.CloseTrigger, {
-	style,
-	className: (0, classnames.default)(require_ds_drawer_module.default.closeTrigger, className),
-	children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_icon.default, {
-		icon: "close",
-		size: "small"
-	})
-});
-const Toolbar = ({ style, className, children }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-	style,
-	className: (0, classnames.default)(require_ds_drawer_module.default.toolbar, className),
-	children
-});
-const Body = ({ style, className, children }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-	style,
-	className: (0, classnames.default)(require_ds_drawer_module.default.body, className),
-	children
-});
-const Footer = ({ style, className, children }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-	style,
-	className: (0, classnames.default)(require_ds_drawer_module.default.footer, className),
-	children
-});
-const Actions = ({ style, className, children }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-	style,
-	className: (0, classnames.default)(require_ds_drawer_module.default.actions, className),
-	children
-});
 DsDrawer.Header = Header;
 DsDrawer.Title = Title;
 DsDrawer.CloseTrigger = CloseTrigger;

package/dist/components/ds-drawer/ds-drawer.d.cts

@@ -1,5 +1,5 @@
 import { DsDrawerProps } from "./ds-drawer.types.cjs";
-import * as react_jsx_runtime23 from "react/jsx-runtime";
+import * as react_jsx_runtime19 from "react/jsx-runtime";
 import { CSSProperties, ReactNode } from "react";
 
 //#region src/components/ds-drawer/ds-drawer.d.ts
@@ -22,7 +22,7 @@ declare const DsDrawer: {
     style,
     className,
     children
-  }: DsDrawerProps): react_jsx_runtime23.JSX.Element;
+  }: DsDrawerProps): react_jsx_runtime19.JSX.Element;
   Header: ({
     style,
     className,
@@ -31,7 +31,7 @@ declare const DsDrawer: {
     style?: CSSProperties;
     className?: string;
     children: ReactNode;
-  }) => react_jsx_runtime23.JSX.Element;
+  }) => react_jsx_runtime19.JSX.Element;
   Title: ({
     style,
     className,
@@ -40,14 +40,14 @@ declare const DsDrawer: {
     style?: CSSProperties;
     className?: string;
     children: ReactNode;
-  }) => react_jsx_runtime23.JSX.Element;
+  }) => react_jsx_runtime19.JSX.Element;
   CloseTrigger: ({
     style,
     className
   }: {
     style?: CSSProperties;
     className?: string;
-  }) => react_jsx_runtime23.JSX.Element;
+  }) => react_jsx_runtime19.JSX.Element;
   Toolbar: ({
     style,
     className,
@@ -56,7 +56,7 @@ declare const DsDrawer: {
     style?: CSSProperties;
     className?: string;
     children: ReactNode;
-  }) => react_jsx_runtime23.JSX.Element;
+  }) => react_jsx_runtime19.JSX.Element;
   Body: ({
     style,
     className,
@@ -65,7 +65,7 @@ declare const DsDrawer: {
     style?: CSSProperties;
     className?: string;
     children: ReactNode;
-  }) => react_jsx_runtime23.JSX.Element;
+  }) => react_jsx_runtime19.JSX.Element;
   Footer: ({
     style,
     className,
@@ -74,7 +74,7 @@ declare const DsDrawer: {
     style?: CSSProperties;
     className?: string;
     children: ReactNode;
-  }) => react_jsx_runtime23.JSX.Element;
+  }) => react_jsx_runtime19.JSX.Element;
   Actions: ({
     style,
     className,
@@ -83,7 +83,7 @@ declare const DsDrawer: {
     style?: CSSProperties;
     className?: string;
     children: ReactNode;
-  }) => react_jsx_runtime23.JSX.Element;
+  }) => react_jsx_runtime19.JSX.Element;
 };
 //#endregion
 export { DsDrawer };

package/dist/components/ds-drawer/ds-drawer.d.ts

@@ -1,5 +1,5 @@
 import { DsDrawerProps } from "./ds-drawer.types.js";
-import * as react_jsx_runtime29 from "react/jsx-runtime";
+import * as react_jsx_runtime18 from "react/jsx-runtime";
 import { CSSProperties, ReactNode } from "react";
 
 //#region src/components/ds-drawer/ds-drawer.d.ts
@@ -22,7 +22,7 @@ declare const DsDrawer: {
     style,
     className,
     children
-  }: DsDrawerProps): react_jsx_runtime29.JSX.Element;
+  }: DsDrawerProps): react_jsx_runtime18.JSX.Element;
   Header: ({
     style,
     className,
@@ -31,7 +31,7 @@ declare const DsDrawer: {
     style?: CSSProperties;
     className?: string;
     children: ReactNode;
-  }) => react_jsx_runtime29.JSX.Element;
+  }) => react_jsx_runtime18.JSX.Element;
   Title: ({
     style,
     className,
@@ -40,14 +40,14 @@ declare const DsDrawer: {
     style?: CSSProperties;
     className?: string;
     children: ReactNode;
-  }) => react_jsx_runtime29.JSX.Element;
+  }) => react_jsx_runtime18.JSX.Element;
   CloseTrigger: ({
     style,
     className
   }: {
     style?: CSSProperties;
     className?: string;
-  }) => react_jsx_runtime29.JSX.Element;
+  }) => react_jsx_runtime18.JSX.Element;
   Toolbar: ({
     style,
     className,
@@ -56,7 +56,7 @@ declare const DsDrawer: {
     style?: CSSProperties;
     className?: string;
     children: ReactNode;
-  }) => react_jsx_runtime29.JSX.Element;
+  }) => react_jsx_runtime18.JSX.Element;
   Body: ({
     style,
     className,
@@ -65,7 +65,7 @@ declare const DsDrawer: {
     style?: CSSProperties;
     className?: string;
     children: ReactNode;
-  }) => react_jsx_runtime29.JSX.Element;
+  }) => react_jsx_runtime18.JSX.Element;
   Footer: ({
     style,
     className,
@@ -74,7 +74,7 @@ declare const DsDrawer: {
     style?: CSSProperties;
     className?: string;
     children: ReactNode;
-  }) => react_jsx_runtime29.JSX.Element;
+  }) => react_jsx_runtime18.JSX.Element;
   Actions: ({
     style,
     className,
@@ -83,7 +83,7 @@ declare const DsDrawer: {
     style?: CSSProperties;
     className?: string;
     children: ReactNode;
-  }) => react_jsx_runtime29.JSX.Element;
+  }) => react_jsx_runtime18.JSX.Element;
 };
 //#endregion
 export { DsDrawer };