@drivenets/design-system 0.0.1 → 0.0.3

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,85 @@
+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 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 = ({ open, onOpenChange, columns = 6, style, className, modal = true, closeOnEscape, closeOnInteractOutside = false, children }) => {
+	const handleOpenChange = (details) => {
+		onOpenChange(details.open);
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_dialog.Dialog.Root, {
+		open,
+		onOpenChange: handleOpenChange,
+		modal,
+		closeOnEscape,
+		closeOnInteractOutside,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__ark_ui_react_portal.Portal, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_dialog.Dialog.Backdrop, { className: require_ds_modal_module.default.overlay }), /* @__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: (0, classnames.default)(require_ds_modal_module.default.modal, require_ds_modal_module.default[`cols-${String(columns)}`], className),
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: (0, classnames.default)(require_ds_modal_module.default.content),
+				children
+			})
+		}) })] })
+	});
+};
+const Header = ({ style, className, children }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+	style,
+	className: (0, classnames.default)(require_ds_modal_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_modal_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,
+	children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_icon.default, {
+		icon: "close",
+		size: "small"
+	})
+});
+const Body = ({ style, className, children }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+	style,
+	className: (0, classnames.default)(require_ds_modal_module.default.body, className),
+	children
+});
+const Footer = ({ style, className, children }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+	style,
+	className: (0, classnames.default)(require_ds_modal_module.default.footer, className),
+	children
+});
+const Actions = ({ style, className, children }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+	style,
+	className: (0, classnames.default)(require_ds_modal_module.default.actions, className),
+	children
+});
+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_runtime0 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_runtime0.JSX.Element;
+  Header: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime0.JSX.Element;
+  Title: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime0.JSX.Element;
+  CloseTrigger: ({
+    style,
+    className
+  }: {
+    style?: CSSProperties;
+    className?: string;
+  }) => react_jsx_runtime0.JSX.Element;
+  Body: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime0.JSX.Element;
+  Footer: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime0.JSX.Element;
+  Actions: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime0.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,kBAAA,CAAA,GAAA,CAAA;;;;;;YAiCN;;cAEE;QACV,kBAAA,CAAA,GAAA,CAAA;;;;;;IApCE,KAAA,CAAA,EA+CM,aA/CN;IAAY,SAAA,CAAA,EAAA,MAAA;cAiDJ;QACV,kBAAA,CAAA,GAAA,CAAA;;;;EAdA;IAHQ,KAAA,CAAA,EAuB6C,aAvB7C;IAEE,SAAA,CAAA,EAAA,MAAA;EACV,CAAA,EAAA,GAoBwF,kBAAA,CAAA,GAAA,CAAA,OApBxF;;;;;EAaU;YAkBF;;IApBA,QAAA,EAsBE,SAtBF;EAEE,CAAA,EAAA,GAqBV,kBAAA,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,kBAAA,CAAA,GAAA,CAAA,OA5BwF;;;;;EAa9E;YA0BF;;IA5BA,QAAA,EA8BE,SA9BF;EAEE,CAAA,EAAA,GA6BV,kBAAA,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_runtime5 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_runtime5.JSX.Element;
+  Header: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime5.JSX.Element;
+  Title: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime5.JSX.Element;
+  CloseTrigger: ({
+    style,
+    className
+  }: {
+    style?: CSSProperties;
+    className?: string;
+  }) => react_jsx_runtime5.JSX.Element;
+  Body: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime5.JSX.Element;
+  Footer: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime5.JSX.Element;
+  Actions: ({
+    style,
+    className,
+    children
+  }: {
+    style?: CSSProperties;
+    className?: string;
+    children: ReactNode;
+  }) => react_jsx_runtime5.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,kBAAA,CAAA,GAAA,CAAA;;;;;;YAiCN;;cAEE;QACV,kBAAA,CAAA,GAAA,CAAA;;;;;;IApCE,KAAA,CAAA,EA+CM,aA/CN;IAAY,SAAA,CAAA,EAAA,MAAA;cAiDJ;QACV,kBAAA,CAAA,GAAA,CAAA;;;;EAdA;IAHQ,KAAA,CAAA,EAuB6C,aAvB7C;IAEE,SAAA,CAAA,EAAA,MAAA;EACV,CAAA,EAAA,GAoBwF,kBAAA,CAAA,GAAA,CAAA,OApBxF;;;;;EAaU;YAkBF;;IApBA,QAAA,EAsBE,SAtBF;EAEE,CAAA,EAAA,GAqBV,kBAAA,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,kBAAA,CAAA,GAAA,CAAA,OA5BwF;;;;;EAa9E;YA0BF;;IA5BA,QAAA,EA8BE,SA9BF;EAEE,CAAA,EAAA,GA6BV,kBAAA,CAAA,GAAA,CAAA,OA7BU;CACV"}

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

@@ -0,0 +1,84 @@
+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 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 = ({ open, onOpenChange, columns = 6, style, className, modal = true, closeOnEscape, closeOnInteractOutside = false, children }) => {
+	const handleOpenChange = (details) => {
+		onOpenChange(details.open);
+	};
+	return /* @__PURE__ */ jsx(Dialog.Root, {
+		open,
+		onOpenChange: handleOpenChange,
+		modal,
+		closeOnEscape,
+		closeOnInteractOutside,
+		children: /* @__PURE__ */ jsxs(Portal, { children: [/* @__PURE__ */ jsx(Dialog.Backdrop, { className: ds_modal_module_default.overlay }), /* @__PURE__ */ jsx(Dialog.Positioner, { children: /* @__PURE__ */ jsx(Dialog.Content, {
+			style,
+			className: classNames(ds_modal_module_default.modal, ds_modal_module_default[`cols-${String(columns)}`], className),
+			children: /* @__PURE__ */ jsx("div", {
+				className: classNames(ds_modal_module_default.content),
+				children
+			})
+		}) })] })
+	});
+};
+const Header = ({ style, className, children }) => /* @__PURE__ */ jsx("div", {
+	style,
+	className: classNames(ds_modal_module_default.header, className),
+	children
+});
+const Title = ({ style, className, children }) => /* @__PURE__ */ jsx(Dialog.Title, {
+	className: classNames(ds_modal_module_default.title, className),
+	style,
+	asChild: true,
+	children: /* @__PURE__ */ jsx(ds_typography_default, {
+		variant: "heading3",
+		children
+	})
+});
+const CloseTrigger = ({ style, className }) => /* @__PURE__ */ jsx(Dialog.CloseTrigger, {
+	style,
+	className,
+	children: /* @__PURE__ */ jsx(ds_icon_default, {
+		icon: "close",
+		size: "small"
+	})
+});
+const Body = ({ style, className, children }) => /* @__PURE__ */ jsx("div", {
+	style,
+	className: classNames(ds_modal_module_default.body, className),
+	children
+});
+const Footer = ({ style, className, children }) => /* @__PURE__ */ jsx("div", {
+	style,
+	className: classNames(ds_modal_module_default.footer, className),
+	children
+});
+const Actions = ({ style, className, children }) => /* @__PURE__ */ jsx("div", {
+	style,
+	className: classNames(ds_modal_module_default.actions, className),
+	children
+});
+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":["styles","DsTypography","DsIcon"],"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":";;;;;;;;;;;;;;;;AAcA,MAAM,WAAW,EAChB,MACA,cACA,UAAU,GACV,OACA,WACA,QAAQ,MACR,eACA,yBAAyB,OACzB,eACmB;CACnB,MAAM,oBAAoB,YAA+B;AACxD,eAAa,QAAQ,KAAK;;AAG3B,QACC,oBAAC,OAAO;EACD;EACN,cAAc;EACP;EACQ;EACS;YAExB,qBAAC,qBACA,oBAAC,OAAO,YAAS,WAAWA,wBAAO,UAAW,EAC9C,oBAAC,OAAO,wBACP,oBAAC,OAAO;GACA;GACP,WAAW,WAAWA,wBAAO,OAAOA,wBAAO,QAAQ,OAAO,QAAQ,KAAK,UAAU;aAEjF,oBAAC;IAAI,WAAW,WAAWA,wBAAO,QAAQ;IAAG;KAAe;IAC5C,GACE,IACZ;GACI;;AAIhB,MAAM,UAAU,EACf,OACA,WACA,eAMA,oBAAC;CAAW;CAAO,WAAW,WAAWA,wBAAO,QAAQ,UAAU;CAChE;EACI;AAGP,MAAM,SAAS,EACd,OACA,WACA,eAMA,oBAAC,OAAO;CAAM,WAAW,WAAWA,wBAAO,OAAO,UAAU;CAAS;CAAO;WAC3E,oBAACC;EAAa,SAAQ;EAAY;GAAwB;EAC5C;AAGhB,MAAM,gBAAgB,EAAE,OAAO,gBAC9B,oBAAC,OAAO;CAAoB;CAAkB;WAC7C,oBAACC;EAAO,MAAK;EAAQ,MAAK;GAAiB;EACtB;AAGvB,MAAM,QAAQ,EACb,OACA,WACA,eAMA,oBAAC;CAAW;CAAO,WAAW,WAAWF,wBAAO,MAAM,UAAU;CAC9D;EACI;AAGP,MAAM,UAAU,EACf,OACA,WACA,eAMA,oBAAC;CAAW;CAAO,WAAW,WAAWA,wBAAO,QAAQ,UAAU;CAChE;EACI;AAGP,MAAM,WAAW,EAChB,OACA,WACA,eAMA,oBAAC;CAAW;CAAO,WAAW,WAAWA,wBAAO,SAAS,UAAU;CACjE;EACI;AAGP,QAAQ,SAAS;AACjB,QAAQ,QAAQ;AAChB,QAAQ,eAAe;AACvB,QAAQ,OAAO;AACf,QAAQ,SAAS;AACjB,QAAQ,UAAU;AAElB,uBAAe"}

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

@@ -0,0 +1,31 @@
+
+//#region src/components/ds-modal/ds-modal.module.scss
+var ds_modal_module_default = {
+	"overlay": "_overlay_rw1e4_1",
+	"fade-in-overlay": "_fade-in-overlay_rw1e4_1",
+	"fade-out-overlay": "_fade-out-overlay_rw1e4_1",
+	"modal": "_modal_rw1e4_1",
+	"scale-in-modal": "_scale-in-modal_rw1e4_1",
+	"scale-out-modal": "_scale-out-modal_rw1e4_1",
+	"content": "_content_rw1e4_1",
+	"header": "_header_rw1e4_1",
+	"footer": "_footer_rw1e4_1",
+	"body": "_body_rw1e4_1",
+	"title": "_title_rw1e4_1",
+	"actions": "_actions_rw1e4_1",
+	"cols-1": "_cols-1_rw1e4_1",
+	"cols-2": "_cols-2_rw1e4_1",
+	"cols-3": "_cols-3_rw1e4_1",
+	"cols-4": "_cols-4_rw1e4_1",
+	"cols-5": "_cols-5_rw1e4_1",
+	"cols-6": "_cols-6_rw1e4_1",
+	"cols-7": "_cols-7_rw1e4_1",
+	"cols-8": "_cols-8_rw1e4_1",
+	"cols-9": "_cols-9_rw1e4_1",
+	"cols-10": "_cols-10_rw1e4_1",
+	"cols-11": "_cols-11_rw1e4_1",
+	"cols-12": "_cols-12_rw1e4_1"
+};
+
+//#endregion
+exports.default = ds_modal_module_default;

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

@@ -0,0 +1,31 @@
+//#region src/components/ds-modal/ds-modal.module.scss
+var ds_modal_module_default = {
+	"overlay": "_overlay_rw1e4_1",
+	"fade-in-overlay": "_fade-in-overlay_rw1e4_1",
+	"fade-out-overlay": "_fade-out-overlay_rw1e4_1",
+	"modal": "_modal_rw1e4_1",
+	"scale-in-modal": "_scale-in-modal_rw1e4_1",
+	"scale-out-modal": "_scale-out-modal_rw1e4_1",
+	"content": "_content_rw1e4_1",
+	"header": "_header_rw1e4_1",
+	"footer": "_footer_rw1e4_1",
+	"body": "_body_rw1e4_1",
+	"title": "_title_rw1e4_1",
+	"actions": "_actions_rw1e4_1",
+	"cols-1": "_cols-1_rw1e4_1",
+	"cols-2": "_cols-2_rw1e4_1",
+	"cols-3": "_cols-3_rw1e4_1",
+	"cols-4": "_cols-4_rw1e4_1",
+	"cols-5": "_cols-5_rw1e4_1",
+	"cols-6": "_cols-6_rw1e4_1",
+	"cols-7": "_cols-7_rw1e4_1",
+	"cols-8": "_cols-8_rw1e4_1",
+	"cols-9": "_cols-9_rw1e4_1",
+	"cols-10": "_cols-10_rw1e4_1",
+	"cols-11": "_cols-11_rw1e4_1",
+	"cols-12": "_cols-12_rw1e4_1"
+};
+
+//#endregion
+export { ds_modal_module_default as default };
+//# sourceMappingURL=ds-modal.module.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ds-modal.module.js","names":[],"sources":["../../../file:/home/runner/work/design-system/design-system/packages/design-system/src/styles/shared/_modal.scss","../../../file:/home/runner/work/design-system/design-system/packages/design-system/src/components/ds-modal/ds-modal.module.scss"],"sourcesContent":["@use '../../styles/shared/modal' as shared;\n\n$pad-x: 24px;\n$pad-y: 16px;\n$max-width: 90vw;\n$max-height: 90vh;\n\n.overlay {\n\t@include shared.overlay-base;\n}\n\n.modal {\n\t@include shared.modal-base;\n}\n\n.content {\n\t@include shared.content-base;\n\theight: 100%;\n}\n\n.header,\n.footer,\n.body {\n\tpadding: $pad-y $pad-x;\n}\n\n.header {\n\t@include shared.header-base;\n}\n\n.footer {\n\t@include shared.footer-base;\n\tdisplay: flex;\n}\n\n.title {\n\t@include shared.title-base;\n}\n\n.body {\n\t@include shared.body-base;\n}\n\n.actions {\n\t@include shared.actions-base;\n\tmargin-left: auto;\n}\n\n// width classes derived from DS grid\n.modal {\n\tinline-size: min(var(--col-span-6), $max-width);\n}\n\n.modal.cols-1 {\n\tinline-size: min(var(--col-span-1), $max-width);\n}\n\n.modal.cols-2 {\n\tinline-size: min(var(--col-span-2), $max-width);\n}\n\n.modal.cols-3 {\n\tinline-size: min(var(--col-span-3), $max-width);\n}\n\n.modal.cols-4 {\n\tinline-size: min(var(--col-span-4), $max-width);\n}\n\n.modal.cols-5 {\n\tinline-size: min(var(--col-span-5), $max-width);\n}\n\n.modal.cols-6 {\n\tinline-size: min(var(--col-span-6), $max-width);\n}\n\n.modal.cols-7 {\n\tinline-size: min(var(--col-span-7), $max-width);\n}\n\n.modal.cols-8 {\n\tinline-size: min(var(--col-span-8), $max-width);\n}\n\n.modal.cols-9 {\n\tinline-size: min(var(--col-span-9), $max-width);\n}\n\n.modal.cols-10 {\n\tinline-size: min(var(--col-span-10), $max-width);\n}\n\n.modal.cols-11 {\n\tinline-size: min(var(--col-span-11), $max-width);\n}\n\n.modal.cols-12 {\n\tinline-size: min(var(--col-span-12), $max-width);\n}\n"],"mappings":""}

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

@@ -0,0 +1,43 @@
+import { CSSProperties, ReactNode } from "react";
+import { UseDialogProps } from "@ark-ui/react/dialog";
+
+//#region src/components/ds-modal/ds-modal.types.d.ts
+
+/**
+ * Available column sizes for modal width
+ */
+type DsModalColumns = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+/**
+ * Props for the DsModal component
+ */
+interface DsModalProps extends Pick<UseDialogProps, 'modal' | 'closeOnEscape' | 'closeOnInteractOutside'> {
+  /**
+   * Whether the modal is open
+   */
+  open: boolean;
+  /**
+   * Callback when modal open state changes
+   * @param open - whether the modal is open
+   */
+  onOpenChange: (open: boolean) => void;
+  /**
+   * Number of grid columns for modal width
+   * @default 6
+   */
+  columns?: DsModalColumns;
+  /**
+   * Optional inline styles to apply to the component
+   */
+  style?: CSSProperties;
+  /**
+   * Additional CSS class name
+   */
+  className?: string;
+  /**
+   * Modal body content
+   */
+  children: ReactNode;
+}
+//#endregion
+export { DsModalColumns, DsModalProps };
+//# sourceMappingURL=ds-modal.types.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ds-modal.types.d.cts","names":[],"sources":["../../../src/components/ds-modal/ds-modal.types.tsx"],"sourcesContent":[],"mappings":";;;;;;;AAMA;AAKiB,KALL,cAAA,GAKkB,CAAA,GAAA,CAAA,GAAA,CAAA,GAAA,CAAA,GAAA,CAAA,GAAA,CAAA,GAAA,CAAA,GAAA,CAAA,GAAA,CAAA,GAAA,EAAA,GAAA,EAAA,GAAA,EAAA;;;;AA+BnB,UA/BM,YAAA,SAAqB,IA+B3B,CA9BV,cA8BU,EAAA,OAAA,GAAA,eAAA,GAAA,wBAAA,CAAA,CAAA;EA/B2B;;;;;;;;;;;;;YAkB3B;;;;UAIF;;;;;;;;YASE"}

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

@@ -0,0 +1,43 @@
+import { CSSProperties, ReactNode } from "react";
+import { UseDialogProps } from "@ark-ui/react/dialog";
+
+//#region src/components/ds-modal/ds-modal.types.d.ts
+
+/**
+ * Available column sizes for modal width
+ */
+type DsModalColumns = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+/**
+ * Props for the DsModal component
+ */
+interface DsModalProps extends Pick<UseDialogProps, 'modal' | 'closeOnEscape' | 'closeOnInteractOutside'> {
+  /**
+   * Whether the modal is open
+   */
+  open: boolean;
+  /**
+   * Callback when modal open state changes
+   * @param open - whether the modal is open
+   */
+  onOpenChange: (open: boolean) => void;
+  /**
+   * Number of grid columns for modal width
+   * @default 6
+   */
+  columns?: DsModalColumns;
+  /**
+   * Optional inline styles to apply to the component
+   */
+  style?: CSSProperties;
+  /**
+   * Additional CSS class name
+   */
+  className?: string;
+  /**
+   * Modal body content
+   */
+  children: ReactNode;
+}
+//#endregion
+export { DsModalColumns, DsModalProps };
+//# sourceMappingURL=ds-modal.types.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ds-modal.types.d.ts","names":[],"sources":["../../../src/components/ds-modal/ds-modal.types.tsx"],"sourcesContent":[],"mappings":";;;;;;;AAMA;AAKiB,KALL,cAAA,GAKkB,CAAA,GAAA,CAAA,GAAA,CAAA,GAAA,CAAA,GAAA,CAAA,GAAA,CAAA,GAAA,CAAA,GAAA,CAAA,GAAA,CAAA,GAAA,EAAA,GAAA,EAAA,GAAA,EAAA;;;;AA+BnB,UA/BM,YAAA,SAAqB,IA+B3B,CA9BV,cA8BU,EAAA,OAAA,GAAA,eAAA,GAAA,wBAAA,CAAA,CAAA;EA/B2B;;;;;;;;;;;;;YAkB3B;;;;UAIF;;;;;;;;YASE"}

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

@@ -0,0 +1 @@
+const require_ds_modal = require('./ds-modal.cjs');

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

@@ -0,0 +1,2 @@
+import { DsModalColumns, DsModalProps } from "./ds-modal.types.js";
+import { DsModal } from "./ds-modal.js";

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

@@ -0,0 +1 @@
+import ds_modal_default from "./ds-modal.js";

package/dist/components/ds-number-input/ds-number-input.cjs

@@ -0,0 +1,71 @@
+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_number_input_module = require('./ds-number-input.module.cjs');
+let classnames = require("classnames");
+classnames = require_rolldown_runtime.__toESM(classnames);
+let react_jsx_runtime = require("react/jsx-runtime");
+let __ark_ui_react = require("@ark-ui/react");
+
+//#region src/components/ds-number-input/ds-number-input.tsx
+const DsNumberInput = ({ id, ref, name, size = "default", onBlur, onChange, onValueChange, className, style = {}, placeholder, disabled = false, min, max, step, value, defaultValue }) => {
+	const containerClass = (0, classnames.default)(require_ds_number_input_module.default.textInputContainer, {
+		[require_ds_number_input_module.default.small]: size === "small",
+		[require_ds_number_input_module.default.default]: size === "default"
+	}, className);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react.NumberInput.Root, {
+		id,
+		min,
+		max,
+		step,
+		disabled,
+		value: typeof value !== "undefined" ? String(value) : void 0,
+		defaultValue: typeof defaultValue !== "undefined" ? String(defaultValue) : void 0,
+		onValueChange: (details) => onValueChange?.(details.valueAsNumber),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react.NumberInput.Control, {
+			asChild: true,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: containerClass,
+				style,
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react.NumberInput.DecrementTrigger, {
+						asChild: true,
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+							type: "button",
+							className: (0, classnames.default)(require_ds_number_input_module.default.iconButton),
+							"aria-label": "Decrease value",
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_icon.default, {
+								icon: "remove",
+								size: "tiny"
+							})
+						})
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react.NumberInput.Input, {
+						ref,
+						name,
+						className: (0, classnames.default)(require_ds_number_input_module.default.input),
+						placeholder,
+						onBlur,
+						onChange
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react.NumberInput.IncrementTrigger, {
+						asChild: true,
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+							type: "button",
+							className: (0, classnames.default)(require_ds_number_input_module.default.iconButton),
+							"aria-label": "Increase value",
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_icon.default, {
+								icon: "add",
+								size: "tiny"
+							})
+						})
+					})
+				]
+			})
+		})
+	});
+};
+var ds_number_input_default = DsNumberInput;
+
+//#endregion
+exports.default = ds_number_input_default;

package/dist/components/ds-number-input/ds-number-input.d.cts

@@ -0,0 +1,8 @@
+import { DsNumberInputProps } from "./ds-number-input.types.cjs";
+import { FC } from "react";
+
+//#region src/components/ds-number-input/ds-number-input.d.ts
+declare const DsNumberInput: FC<DsNumberInputProps>;
+//#endregion
+export { DsNumberInput };
+//# sourceMappingURL=ds-number-input.d.cts.map

package/dist/components/ds-number-input/ds-number-input.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ds-number-input.d.cts","names":[],"sources":["../../../src/components/ds-number-input/ds-number-input.tsx"],"sourcesContent":[],"mappings":";;;;cAOM,eAAe,GAAG"}

package/dist/components/ds-number-input/ds-number-input.d.ts

@@ -0,0 +1,8 @@
+import { DsNumberInputProps } from "./ds-number-input.types.js";
+import { FC } from "react";
+
+//#region src/components/ds-number-input/ds-number-input.d.ts
+declare const DsNumberInput: FC<DsNumberInputProps>;
+//#endregion
+export { DsNumberInput };
+//# sourceMappingURL=ds-number-input.d.ts.map

package/dist/components/ds-number-input/ds-number-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ds-number-input.d.ts","names":[],"sources":["../../../src/components/ds-number-input/ds-number-input.tsx"],"sourcesContent":[],"mappings":";;;;cAOM,eAAe,GAAG"}