@drivenets/design-system 0.0.2 → 0.0.4

package/dist/components/ds-icon/material-icons.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"material-icons.d.ts","names":[],"sources":["../../../src/components/ds-icon/material-icons.ts"],"sourcesContent":[],"mappings":";KACY,UAAA;AAAA,cAqBC,aArBS,EAAA;EAqBT,aAAA,EAAA,MAoiMZ"}

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

@@ -0,0 +1,252 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_ds_icon = require('../ds-icon/ds-icon.cjs');
+require('../ds-icon/index.cjs');
+const require_ds_typography = require('../ds-typography/ds-typography.cjs');
+require('../ds-typography/index.cjs');
+const require_ds_modal_module = require('./ds-modal.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");
+let __ark_ui_react_portal = require("@ark-ui/react/portal");
+let __ark_ui_react_dialog = require("@ark-ui/react/dialog");
+
+//#region src/components/ds-modal/ds-modal.tsx
+/**
+* Composable modal dialog.
+* Supports custom header, footer, and body content with grid-based sizing.
+* Use columns prop to control modal width (1-12 grid columns).
+*/
+const DsModal = (t0) => {
+	const $ = (0, react_compiler_runtime.c)(20);
+	const { open, onOpenChange, columns: t1, style, className, modal: t2, closeOnEscape, closeOnInteractOutside: t3, children } = t0;
+	const columns = t1 === void 0 ? 6 : t1;
+	const modal = t2 === void 0 ? true : t2;
+	const closeOnInteractOutside = t3 === void 0 ? false : t3;
+	let t4;
+	if ($[0] !== onOpenChange) {
+		t4 = (details) => {
+			onOpenChange(details.open);
+		};
+		$[0] = onOpenChange;
+		$[1] = t4;
+	} else t4 = $[1];
+	const handleOpenChange = t4;
+	let t5;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t5 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_dialog.Dialog.Backdrop, { className: require_ds_modal_module.default.overlay });
+		$[2] = t5;
+	} else t5 = $[2];
+	const t6 = require_ds_modal_module.default[`cols-${String(columns)}`];
+	let t7;
+	if ($[3] !== className || $[4] !== t6) {
+		t7 = (0, classnames.default)(require_ds_modal_module.default.modal, t6, className);
+		$[3] = className;
+		$[4] = t6;
+		$[5] = t7;
+	} else t7 = $[5];
+	let t8;
+	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+		t8 = (0, classnames.default)(require_ds_modal_module.default.content);
+		$[6] = t8;
+	} else t8 = $[6];
+	let t9;
+	if ($[7] !== children) {
+		t9 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: t8,
+			children
+		});
+		$[7] = children;
+		$[8] = t9;
+	} else t9 = $[8];
+	let t10;
+	if ($[9] !== style || $[10] !== t7 || $[11] !== t9) {
+		t10 = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__ark_ui_react_portal.Portal, { children: [t5, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_dialog.Dialog.Positioner, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_dialog.Dialog.Content, {
+			style,
+			className: t7,
+			children: t9
+		}) })] });
+		$[9] = style;
+		$[10] = t7;
+		$[11] = t9;
+		$[12] = t10;
+	} else t10 = $[12];
+	let t11;
+	if ($[13] !== closeOnEscape || $[14] !== closeOnInteractOutside || $[15] !== handleOpenChange || $[16] !== modal || $[17] !== open || $[18] !== t10) {
+		t11 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_dialog.Dialog.Root, {
+			open,
+			onOpenChange: handleOpenChange,
+			modal,
+			closeOnEscape,
+			closeOnInteractOutside,
+			children: t10
+		});
+		$[13] = closeOnEscape;
+		$[14] = closeOnInteractOutside;
+		$[15] = handleOpenChange;
+		$[16] = modal;
+		$[17] = open;
+		$[18] = t10;
+		$[19] = t11;
+	} else t11 = $[19];
+	return t11;
+};
+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_modal_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_modal_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)(4);
+	const { style, className } = t0;
+	let t1;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_icon.default, {
+			icon: "close",
+			size: "small"
+		});
+		$[0] = t1;
+	} else t1 = $[0];
+	let t2;
+	if ($[1] !== className || $[2] !== style) {
+		t2 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_dialog.Dialog.CloseTrigger, {
+			style,
+			className,
+			children: t1
+		});
+		$[1] = className;
+		$[2] = style;
+		$[3] = t2;
+	} else t2 = $[3];
+	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_modal_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_modal_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_modal_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;
+};
+DsModal.Header = Header;
+DsModal.Title = Title;
+DsModal.CloseTrigger = CloseTrigger;
+DsModal.Body = Body;
+DsModal.Footer = Footer;
+DsModal.Actions = Actions;
+var ds_modal_default = DsModal;
+
+//#endregion
+exports.default = ds_modal_default;

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

@@ -0,0 +1,79 @@
+import { DsModalProps } from "./ds-modal.types.cjs";
+import * as react_jsx_runtime26 from "react/jsx-runtime";
+import { CSSProperties, ReactNode } from "react";
+
+//#region src/components/ds-modal/ds-modal.d.ts
+
+/**
+ * Composable modal dialog.
+ * Supports custom header, footer, and body content with grid-based sizing.
+ * Use columns prop to control modal width (1-12 grid columns).
+ */
+declare const DsModal: {
+  ({
+    open,
+    onOpenChange,
+    columns,
+    style,
+    className,
+    modal,
+    closeOnEscape,
+    closeOnInteractOutside,
+    children
+  }: DsModalProps): react_jsx_runtime26.JSX.Element;
+  Header: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime26.JSX.Element;
+  Title: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime26.JSX.Element;
+  CloseTrigger: ({
+    style,
+    className
+  }: {
+    style?: CSSProperties;
+    className?: string;
+  }) => react_jsx_runtime26.JSX.Element;
+  Body: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime26.JSX.Element;
+  Footer: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime26.JSX.Element;
+  Actions: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime26.JSX.Element;
+};
+//#endregion
+export { DsModal };
+//# sourceMappingURL=ds-modal.d.cts.map

package/dist/components/ds-modal/ds-modal.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ds-modal.d.cts","names":[],"sources":["../../../src/components/ds-modal/ds-modal.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;AAIqD;;cAU/C;;;;;;;;;;;KAUH,eAAY,mBAAA,CAAA,GAAA,CAAA;;;;;;YAiCN;;cAEE;QACV,mBAAA,CAAA,GAAA,CAAA;;;;;;IApCE,KAAA,CAAA,EA+CM,aA/CN;IAAY,SAAA,CAAA,EAAA,MAAA;cAiDJ;QACV,mBAAA,CAAA,GAAA,CAAA;;;;EAdA;IAHQ,KAAA,CAAA,EAuB6C,aAvB7C;IAEE,SAAA,CAAA,EAAA,MAAA;EACV,CAAA,EAAA,GAoBwF,mBAAA,CAAA,GAAA,CAAA,OApBxF;;;;;EAaU;YAkBF;;IApBA,QAAA,EAsBE,SAtBF;EAEE,CAAA,EAAA,GAqBV,mBAAA,CAAA,GAAA,CAAA,OArBU;EACV,MAAA,EAAA,CAAA;IAAA,KAAA;IAAA,SAAA;IAAA;EAMwF,CANxF,EAAA;YA+BQ;;IAzB6C,QAAA,EA2B3C,SA3B2C;EAAmC,CAAA,EAAA,GA4BxF,mBAAA,CAAA,GAAA,CAAA,OA5BwF;;;;;EAa9E;YA0BF;;IA5BA,QAAA,EA8BE,SA9BF;EAEE,CAAA,EAAA,GA6BV,mBAAA,CAAA,GAAA,CAAA,OA7BU;CACV"}

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

@@ -0,0 +1,79 @@
+import { DsModalProps } from "./ds-modal.types.js";
+import * as react_jsx_runtime10 from "react/jsx-runtime";
+import { CSSProperties, ReactNode } from "react";
+
+//#region src/components/ds-modal/ds-modal.d.ts
+
+/**
+ * Composable modal dialog.
+ * Supports custom header, footer, and body content with grid-based sizing.
+ * Use columns prop to control modal width (1-12 grid columns).
+ */
+declare const DsModal: {
+  ({
+    open,
+    onOpenChange,
+    columns,
+    style,
+    className,
+    modal,
+    closeOnEscape,
+    closeOnInteractOutside,
+    children
+  }: DsModalProps): react_jsx_runtime10.JSX.Element;
+  Header: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime10.JSX.Element;
+  Title: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime10.JSX.Element;
+  CloseTrigger: ({
+    style,
+    className
+  }: {
+    style?: CSSProperties;
+    className?: string;
+  }) => react_jsx_runtime10.JSX.Element;
+  Body: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime10.JSX.Element;
+  Footer: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime10.JSX.Element;
+  Actions: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime10.JSX.Element;
+};
+//#endregion
+export { DsModal };
+//# sourceMappingURL=ds-modal.d.ts.map

package/dist/components/ds-modal/ds-modal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ds-modal.d.ts","names":[],"sources":["../../../src/components/ds-modal/ds-modal.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;AAIqD;;cAU/C;;;;;;;;;;;KAUH,eAAY,mBAAA,CAAA,GAAA,CAAA;;;;;;YAiCN;;cAEE;QACV,mBAAA,CAAA,GAAA,CAAA;;;;;;IApCE,KAAA,CAAA,EA+CM,aA/CN;IAAY,SAAA,CAAA,EAAA,MAAA;cAiDJ;QACV,mBAAA,CAAA,GAAA,CAAA;;;;EAdA;IAHQ,KAAA,CAAA,EAuB6C,aAvB7C;IAEE,SAAA,CAAA,EAAA,MAAA;EACV,CAAA,EAAA,GAoBwF,mBAAA,CAAA,GAAA,CAAA,OApBxF;;;;;EAaU;YAkBF;;IApBA,QAAA,EAsBE,SAtBF;EAEE,CAAA,EAAA,GAqBV,mBAAA,CAAA,GAAA,CAAA,OArBU;EACV,MAAA,EAAA,CAAA;IAAA,KAAA;IAAA,SAAA;IAAA;EAMwF,CANxF,EAAA;YA+BQ;;IAzB6C,QAAA,EA2B3C,SA3B2C;EAAmC,CAAA,EAAA,GA4BxF,mBAAA,CAAA,GAAA,CAAA,OA5BwF;;;;;EAa9E;YA0BF;;IA5BA,QAAA,EA8BE,SA9BF;EAEE,CAAA,EAAA,GA6BV,mBAAA,CAAA,GAAA,CAAA,OA7BU;CACV"}

package/dist/components/ds-modal/ds-modal.js

@@ -0,0 +1,251 @@
+import ds_icon_default from "../ds-icon/ds-icon.js";
+import "../ds-icon/index.js";
+import ds_typography_default from "../ds-typography/ds-typography.js";
+import "../ds-typography/index.js";
+import ds_modal_module_default from "./ds-modal.module.js";
+import { c } from "react/compiler-runtime";
+import classNames from "classnames";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Portal } from "@ark-ui/react/portal";
+import { Dialog } from "@ark-ui/react/dialog";
+
+//#region src/components/ds-modal/ds-modal.tsx
+/**
+* Composable modal dialog.
+* Supports custom header, footer, and body content with grid-based sizing.
+* Use columns prop to control modal width (1-12 grid columns).
+*/
+const DsModal = (t0) => {
+	const $ = c(20);
+	const { open, onOpenChange, columns: t1, style, className, modal: t2, closeOnEscape, closeOnInteractOutside: t3, children } = t0;
+	const columns = t1 === void 0 ? 6 : t1;
+	const modal = t2 === void 0 ? true : t2;
+	const closeOnInteractOutside = t3 === void 0 ? false : t3;
+	let t4;
+	if ($[0] !== onOpenChange) {
+		t4 = (details) => {
+			onOpenChange(details.open);
+		};
+		$[0] = onOpenChange;
+		$[1] = t4;
+	} else t4 = $[1];
+	const handleOpenChange = t4;
+	let t5;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t5 = /* @__PURE__ */ jsx(Dialog.Backdrop, { className: ds_modal_module_default.overlay });
+		$[2] = t5;
+	} else t5 = $[2];
+	const t6 = ds_modal_module_default[`cols-${String(columns)}`];
+	let t7;
+	if ($[3] !== className || $[4] !== t6) {
+		t7 = classNames(ds_modal_module_default.modal, t6, className);
+		$[3] = className;
+		$[4] = t6;
+		$[5] = t7;
+	} else t7 = $[5];
+	let t8;
+	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+		t8 = classNames(ds_modal_module_default.content);
+		$[6] = t8;
+	} else t8 = $[6];
+	let t9;
+	if ($[7] !== children) {
+		t9 = /* @__PURE__ */ jsx("div", {
+			className: t8,
+			children
+		});
+		$[7] = children;
+		$[8] = t9;
+	} else t9 = $[8];
+	let t10;
+	if ($[9] !== style || $[10] !== t7 || $[11] !== t9) {
+		t10 = /* @__PURE__ */ jsxs(Portal, { children: [t5, /* @__PURE__ */ jsx(Dialog.Positioner, { children: /* @__PURE__ */ jsx(Dialog.Content, {
+			style,
+			className: t7,
+			children: t9
+		}) })] });
+		$[9] = style;
+		$[10] = t7;
+		$[11] = t9;
+		$[12] = t10;
+	} else t10 = $[12];
+	let t11;
+	if ($[13] !== closeOnEscape || $[14] !== closeOnInteractOutside || $[15] !== handleOpenChange || $[16] !== modal || $[17] !== open || $[18] !== t10) {
+		t11 = /* @__PURE__ */ jsx(Dialog.Root, {
+			open,
+			onOpenChange: handleOpenChange,
+			modal,
+			closeOnEscape,
+			closeOnInteractOutside,
+			children: t10
+		});
+		$[13] = closeOnEscape;
+		$[14] = closeOnInteractOutside;
+		$[15] = handleOpenChange;
+		$[16] = modal;
+		$[17] = open;
+		$[18] = t10;
+		$[19] = t11;
+	} else t11 = $[19];
+	return t11;
+};
+const Header = (t0) => {
+	const $ = c(6);
+	const { style, className, children } = t0;
+	let t1;
+	if ($[0] !== className) {
+		t1 = classNames(ds_modal_module_default.header, className);
+		$[0] = className;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] !== children || $[3] !== style || $[4] !== t1) {
+		t2 = /* @__PURE__ */ jsx("div", {
+			style,
+			className: t1,
+			children
+		});
+		$[2] = children;
+		$[3] = style;
+		$[4] = t1;
+		$[5] = t2;
+	} else t2 = $[5];
+	return t2;
+};
+const Title = (t0) => {
+	const $ = c(8);
+	const { style, className, children } = t0;
+	let t1;
+	if ($[0] !== className) {
+		t1 = classNames(ds_modal_module_default.title, className);
+		$[0] = className;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] !== children) {
+		t2 = /* @__PURE__ */ jsx(ds_typography_default, {
+			variant: "heading3",
+			children
+		});
+		$[2] = children;
+		$[3] = t2;
+	} else t2 = $[3];
+	let t3;
+	if ($[4] !== style || $[5] !== t1 || $[6] !== t2) {
+		t3 = /* @__PURE__ */ jsx(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 $ = c(4);
+	const { style, className } = t0;
+	let t1;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = /* @__PURE__ */ jsx(ds_icon_default, {
+			icon: "close",
+			size: "small"
+		});
+		$[0] = t1;
+	} else t1 = $[0];
+	let t2;
+	if ($[1] !== className || $[2] !== style) {
+		t2 = /* @__PURE__ */ jsx(Dialog.CloseTrigger, {
+			style,
+			className,
+			children: t1
+		});
+		$[1] = className;
+		$[2] = style;
+		$[3] = t2;
+	} else t2 = $[3];
+	return t2;
+};
+const Body = (t0) => {
+	const $ = c(6);
+	const { style, className, children } = t0;
+	let t1;
+	if ($[0] !== className) {
+		t1 = classNames(ds_modal_module_default.body, className);
+		$[0] = className;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] !== children || $[3] !== style || $[4] !== t1) {
+		t2 = /* @__PURE__ */ jsx("div", {
+			style,
+			className: t1,
+			children
+		});
+		$[2] = children;
+		$[3] = style;
+		$[4] = t1;
+		$[5] = t2;
+	} else t2 = $[5];
+	return t2;
+};
+const Footer = (t0) => {
+	const $ = c(6);
+	const { style, className, children } = t0;
+	let t1;
+	if ($[0] !== className) {
+		t1 = classNames(ds_modal_module_default.footer, className);
+		$[0] = className;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] !== children || $[3] !== style || $[4] !== t1) {
+		t2 = /* @__PURE__ */ jsx("div", {
+			style,
+			className: t1,
+			children
+		});
+		$[2] = children;
+		$[3] = style;
+		$[4] = t1;
+		$[5] = t2;
+	} else t2 = $[5];
+	return t2;
+};
+const Actions = (t0) => {
+	const $ = c(6);
+	const { style, className, children } = t0;
+	let t1;
+	if ($[0] !== className) {
+		t1 = classNames(ds_modal_module_default.actions, className);
+		$[0] = className;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] !== children || $[3] !== style || $[4] !== t1) {
+		t2 = /* @__PURE__ */ jsx("div", {
+			style,
+			className: t1,
+			children
+		});
+		$[2] = children;
+		$[3] = style;
+		$[4] = t1;
+		$[5] = t2;
+	} else t2 = $[5];
+	return t2;
+};
+DsModal.Header = Header;
+DsModal.Title = Title;
+DsModal.CloseTrigger = CloseTrigger;
+DsModal.Body = Body;
+DsModal.Footer = Footer;
+DsModal.Actions = Actions;
+var ds_modal_default = DsModal;
+
+//#endregion
+export { ds_modal_default as default };
+//# sourceMappingURL=ds-modal.js.map

package/dist/components/ds-modal/ds-modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ds-modal.js","names":["CSSProperties","ReactNode","Dialog","Portal","classNames","DsModalProps","styles","DsIcon","DsTypography","DsModal","t0","$","_c","open","onOpenChange","columns","t1","style","className","modal","t2","closeOnEscape","closeOnInteractOutside","t3","children","undefined","t4","details","handleOpenChange","t5","Symbol","for","overlay","t6","String","t7","t8","content","t9","t10","t11","Header","header","Title","title","CloseTrigger","Body","body","Footer","footer","Actions","actions"],"sources":["../../../src/components/ds-modal/ds-modal.tsx"],"sourcesContent":["import type { CSSProperties, ReactNode } from 'react';\nimport { Dialog } from '@ark-ui/react/dialog';\nimport { Portal } from '@ark-ui/react/portal';\nimport classNames from 'classnames';\nimport type { DsModalProps } from './ds-modal.types';\nimport styles from './ds-modal.module.scss';\nimport { DsIcon } from '../ds-icon';\nimport { DsTypography } from '../ds-typography';\n\n/**\n * Composable modal dialog.\n * Supports custom header, footer, and body content with grid-based sizing.\n * Use columns prop to control modal width (1-12 grid columns).\n */\nconst DsModal = ({\n\topen,\n\tonOpenChange,\n\tcolumns = 6,\n\tstyle,\n\tclassName,\n\tmodal = true,\n\tcloseOnEscape,\n\tcloseOnInteractOutside = false,\n\tchildren,\n}: DsModalProps) => {\n\tconst handleOpenChange = (details: { open: boolean }) => {\n\t\tonOpenChange(details.open);\n\t};\n\n\treturn (\n\t\t<Dialog.Root\n\t\t\topen={open}\n\t\t\tonOpenChange={handleOpenChange}\n\t\t\tmodal={modal}\n\t\t\tcloseOnEscape={closeOnEscape}\n\t\t\tcloseOnInteractOutside={closeOnInteractOutside}\n\t\t>\n\t\t\t<Portal>\n\t\t\t\t<Dialog.Backdrop className={styles.overlay} />\n\t\t\t\t<Dialog.Positioner>\n\t\t\t\t\t<Dialog.Content\n\t\t\t\t\t\tstyle={style}\n\t\t\t\t\t\tclassName={classNames(styles.modal, styles[`cols-${String(columns)}`], className)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<div className={classNames(styles.content)}>{children}</div>\n\t\t\t\t\t</Dialog.Content>\n\t\t\t\t</Dialog.Positioner>\n\t\t\t</Portal>\n\t\t</Dialog.Root>\n\t);\n};\n\nconst Header = ({\n\tstyle,\n\tclassName,\n\tchildren,\n}: {\n\tstyle?: CSSProperties;\n\tclassName?: string;\n\tchildren: ReactNode;\n}) => (\n\t<div style={style} className={classNames(styles.header, className)}>\n\t\t{children}\n\t</div>\n);\n\nconst Title = ({\n\tstyle,\n\tclassName,\n\tchildren,\n}: {\n\tstyle?: CSSProperties;\n\tclassName?: string;\n\tchildren: ReactNode;\n}) => (\n\t<Dialog.Title className={classNames(styles.title, className)} style={style} asChild>\n\t\t<DsTypography variant=\"heading3\">{children}</DsTypography>\n\t</Dialog.Title>\n);\n\nconst CloseTrigger = ({ style, className }: { style?: CSSProperties; className?: string }) => (\n\t<Dialog.CloseTrigger style={style} className={className}>\n\t\t<DsIcon icon=\"close\" size=\"small\"></DsIcon>\n\t</Dialog.CloseTrigger>\n);\n\nconst Body = ({\n\tstyle,\n\tclassName,\n\tchildren,\n}: {\n\tstyle?: CSSProperties;\n\tclassName?: string;\n\tchildren: ReactNode;\n}) => (\n\t<div style={style} className={classNames(styles.body, className)}>\n\t\t{children}\n\t</div>\n);\n\nconst Footer = ({\n\tstyle,\n\tclassName,\n\tchildren,\n}: {\n\tstyle?: CSSProperties;\n\tclassName?: string;\n\tchildren: ReactNode;\n}) => (\n\t<div style={style} className={classNames(styles.footer, className)}>\n\t\t{children}\n\t</div>\n);\n\nconst Actions = ({\n\tstyle,\n\tclassName,\n\tchildren,\n}: {\n\tstyle?: CSSProperties;\n\tclassName?: string;\n\tchildren: ReactNode;\n}) => (\n\t<div style={style} className={classNames(styles.actions, className)}>\n\t\t{children}\n\t</div>\n);\n\nDsModal.Header = Header;\nDsModal.Title = Title;\nDsModal.CloseTrigger = CloseTrigger;\nDsModal.Body = Body;\nDsModal.Footer = Footer;\nDsModal.Actions = Actions;\n\nexport default DsModal;\n"],"mappings":"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"}