@veracity/vui 3.0.0-beta.7 → 3.0.0-beta.9

package/dist/definition/definitionContent.js

@@ -1,2 +1,81 @@
-import{isArray as e}from"../utils/assertion.js";import{cs as t}from"../utils/styles.js";import{useStyleConfig as n}from"../core/theme.js";import{styled as r}from"../core/styled.js";import{vui as i}from"../core/vui.js";import a from"../box/box.js";import o from"../icon/icon.js";import s from"../p/p.js";import{createElement as c}from"react";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";const f=r.dtBox``,p=r.ddBox``,m=i((r,i)=>{let{iconLeft:m,iconRight:h,isLabelBold:g,isValueBold:_,items:v,orientation:y}=r,b=n(`Definition`,r);return u(l,{children:e(v)?v.map(({key:n,value:r,...l},v)=>d(a,{className:`vui-definitionItemWrapper`,ref:i,children:[d(f,{fontWeight:g?`demi`:`default`,...b.dt,children:[l.keyHasIcon&&m&&u(o,{className:t(`vui-definitionIcon`),name:m,...b.icon}),n,l.keyHasIcon&&h&&u(o,{className:t(`vui-definitionIcon`),name:h,...b.icon})]}),e(r)?c(p,{display:`block`,fontWeight:_?`demi`:`default`,...b.dd,key:v},y===`horizontal`?r.join(`, `):r.map((e,n)=>d(s,{display:`flex`,children:[l.valueHasIcon&&m&&u(o,{className:t(`vui-definitionIcon`),name:m,...b.icon}),e,l.valueHasIcon&&h&&u(o,{className:t(`vui-definitionIcon`),name:h,...b.icon})]},n+e))):d(p,{fontWeight:_?`demi`:`default`,...b.dd,children:[l.valueHasIcon&&m&&u(o,{className:t(`vui-definitionIcon`),name:m,...b.icon}),r,l.valueHasIcon&&h&&u(o,{className:t(`vui-definitionIcon`),name:h,...b.icon})]})]},v)):v})});m.displayName=`DefinitionContent`;export{m as DefinitionContent};globalThis.__vuiVersion__=`3.0.0-beta.7`;
+import { isArray } from "../utils/assertion.js";
+import { cs } from "../utils/styles.js";
+import { useStyleConfig } from "../core/theme.js";
+import { styled } from "../core/styled.js";
+import { vui } from "../core/vui.js";
+import box_default from "../box/box.js";
+import icon_default from "../icon/icon.js";
+import p_default from "../p/p.js";
+import { createElement } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/definition/definitionContent.tsx
+const DefinitionItemKey = styled.dtBox``;
+const DefinitionItemValue = styled.ddBox``;
+const DefinitionContent = vui((props, ref) => {
+	const { iconLeft, iconRight, isLabelBold, isValueBold, items, orientation } = props;
+	const styles = useStyleConfig("Definition", props);
+	return /* @__PURE__ */ jsx(Fragment$1, { children: isArray(items) ? items.map(({ key, value,...props$1 }, index) => /* @__PURE__ */ jsxs(box_default, {
+		className: "vui-definitionItemWrapper",
+		ref,
+		children: [/* @__PURE__ */ jsxs(DefinitionItemKey, {
+			fontWeight: isLabelBold ? "demi" : "default",
+			...styles.dt,
+			children: [
+				props$1.keyHasIcon && iconLeft && /* @__PURE__ */ jsx(icon_default, {
+					className: cs("vui-definitionIcon"),
+					name: iconLeft,
+					...styles.icon
+				}),
+				key,
+				props$1.keyHasIcon && iconRight && /* @__PURE__ */ jsx(icon_default, {
+					className: cs("vui-definitionIcon"),
+					name: iconRight,
+					...styles.icon
+				})
+			]
+		}), isArray(value) ? /* @__PURE__ */ createElement(DefinitionItemValue, {
+			display: "block",
+			fontWeight: isValueBold ? "demi" : "default",
+			...styles.dd,
+			key: index
+		}, orientation === "horizontal" ? value.join(", ") : value.map((value$1, index$1) => /* @__PURE__ */ jsxs(p_default, {
+			display: "flex",
+			children: [
+				props$1.valueHasIcon && iconLeft && /* @__PURE__ */ jsx(icon_default, {
+					className: cs("vui-definitionIcon"),
+					name: iconLeft,
+					...styles.icon
+				}),
+				value$1,
+				props$1.valueHasIcon && iconRight && /* @__PURE__ */ jsx(icon_default, {
+					className: cs("vui-definitionIcon"),
+					name: iconRight,
+					...styles.icon
+				})
+			]
+		}, index$1 + value$1))) : /* @__PURE__ */ jsxs(DefinitionItemValue, {
+			fontWeight: isValueBold ? "demi" : "default",
+			...styles.dd,
+			children: [
+				props$1.valueHasIcon && iconLeft && /* @__PURE__ */ jsx(icon_default, {
+					className: cs("vui-definitionIcon"),
+					name: iconLeft,
+					...styles.icon
+				}),
+				value,
+				props$1.valueHasIcon && iconRight && /* @__PURE__ */ jsx(icon_default, {
+					className: cs("vui-definitionIcon"),
+					name: iconRight,
+					...styles.icon
+				})
+			]
+		})]
+	}, index)) : items });
+});
+DefinitionContent.displayName = "DefinitionContent";
+
+//#endregion
+export { DefinitionContent };
+globalThis.__vuiVersion__ = "3.0.0-beta.9"
 //# sourceMappingURL=definitionContent.js.map

package/dist/definition/definitionContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"definitionContent.js","names":["props","Box","Icon","P","value","index"],"sources":["../../src/definition/definitionContent.tsx"],"sourcesContent":["import Box from '../box'\nimport { styled, useStyleConfig, vui } from '../core'\nimport Icon from '../icon'\nimport P from '../p'\nimport { cs, isArray } from '../utils'\nimport type { DefinitionItem, DefinitionProps } from './definition.types'\n\nexport const DefinitionItemKey = styled.dtBox``\nexport const DefinitionItemValue = styled.ddBox``\n\nexport const DefinitionContent = vui<'dl', DefinitionProps>((props, ref) => {\n  const { iconLeft, iconRight, isLabelBold, isValueBold, items, orientation } = props as DefinitionProps\n\n  const styles = useStyleConfig('Definition', props)\n\n  return (\n    <>\n      {isArray<DefinitionItem>(items)\n        ? items.map(({ key, value, ...props }, index) => (\n            <Box className=\"vui-definitionItemWrapper\" key={index} ref={ref}>\n              <DefinitionItemKey fontWeight={isLabelBold ? 'demi' : 'default'} {...styles.dt}>\n                {props.keyHasIcon && iconLeft && (\n                  <Icon className={cs('vui-definitionIcon')} name={iconLeft} {...styles.icon} />\n                )}\n                {key}\n                {props.keyHasIcon && iconRight && (\n                  <Icon className={cs('vui-definitionIcon')} name={iconRight} {...styles.icon} />\n                )}\n              </DefinitionItemKey>\n              {isArray(value) ? (\n                <DefinitionItemValue\n                  display=\"block\"\n                  fontWeight={isValueBold ? 'demi' : 'default'}\n                  {...styles.dd}\n                  key={index}\n                >\n                  {orientation === 'horizontal'\n                    ? value.join(', ')\n                    : value.map((value, index) => (\n                        <P display=\"flex\" key={index + value}>\n                          {props.valueHasIcon && iconLeft && (\n                            <Icon className={cs('vui-definitionIcon')} name={iconLeft} {...styles.icon} />\n                          )}\n                          {value}\n                          {props.valueHasIcon && iconRight && (\n                            <Icon className={cs('vui-definitionIcon')} name={iconRight} {...styles.icon} />\n                          )}\n                        </P>\n                      ))}\n                  {}\n                </DefinitionItemValue>\n              ) : (\n                <DefinitionItemValue fontWeight={isValueBold ? 'demi' : 'default'} {...styles.dd}>\n                  {props.valueHasIcon && iconLeft && (\n                    <Icon className={cs('vui-definitionIcon')} name={iconLeft} {...styles.icon} />\n                  )}\n                  {value}\n                  {props.valueHasIcon && iconRight && (\n                    <Icon className={cs('vui-definitionIcon')} name={iconRight} {...styles.icon} />\n                  )}\n                </DefinitionItemValue>\n              )}\n            </Box>\n          ))\n        : items}\n    </>\n  )\n})\n\nDefinitionContent.displayName = 'DefinitionContent'\n\nexport default DefinitionContent\n"],"mappings":"qZAOA,MAAa,EAAoB,EAAO,KAAK,GAChC,EAAsB,EAAO,KAAK,GAElC,EAAoB,GAA4B,EAAO,IAAQ,CAC1E,GAAM,CAAE,WAAU,YAAW,cAAa,cAAa,QAAO,eAAgB,EAExE,EAAS,EAAe,aAAc,EAAM,CAElD,OACE,EAAA,EAAA,CAAA,SACG,EAAwB,EAAM,CAC3B,EAAM,KAAK,CAAE,MAAK,QAAO,GAAGA,GAAS,IACnC,EAACC,EAAAA,CAAI,UAAU,4BAA6C,gBAC1D,EAAC,EAAA,CAAkB,WAAY,EAAc,OAAS,UAAW,GAAI,EAAO,aACzED,EAAM,YAAc,GACnB,EAACE,EAAAA,CAAK,UAAW,EAAG,qBAAqB,CAAE,KAAM,EAAU,GAAI,EAAO,MAAQ,CAE/E,EACAF,EAAM,YAAc,GACnB,EAACE,EAAAA,CAAK,UAAW,EAAG,qBAAqB,CAAE,KAAM,EAAW,GAAI,EAAO,MAAQ,GAE/D,CACnB,EAAQ,EAAM,CACb,EAAC,EAAA,CACC,QAAQ,QACR,WAAY,EAAc,OAAS,UACnC,GAAI,EAAO,GACX,IAAK,GAEJ,IAAgB,aACb,EAAM,KAAK,KAAK,CAChB,EAAM,KAAK,EAAO,IAChB,EAACC,EAAAA,CAAE,QAAQ,iBACRH,EAAM,cAAgB,GACrB,EAACE,EAAAA,CAAK,UAAW,EAAG,qBAAqB,CAAE,KAAM,EAAU,GAAI,EAAO,MAAQ,CAE/EE,EACAJ,EAAM,cAAgB,GACrB,EAACE,EAAAA,CAAK,UAAW,EAAG,qBAAqB,CAAE,KAAM,EAAW,GAAI,EAAO,MAAQ,GAN5DG,EAAQD,EAQ3B,CACJ,CAEc,CAEtB,EAAC,EAAA,CAAoB,WAAY,EAAc,OAAS,UAAW,GAAI,EAAO,aAC3EJ,EAAM,cAAgB,GACrB,EAACE,EAAAA,CAAK,UAAW,EAAG,qBAAqB,CAAE,KAAM,EAAU,GAAI,EAAO,MAAQ,CAE/E,EACAF,EAAM,cAAgB,GACrB,EAACE,EAAAA,CAAK,UAAW,EAAG,qBAAqB,CAAE,KAAM,EAAW,GAAI,EAAO,MAAQ,GAE7D,CAAA,EAzCsB,EA2C1C,CACN,CACF,EAAA,CACH,EAEL,CAEF,EAAkB,YAAc"}
+{"version":3,"file":"definitionContent.js","names":["props","Box","Icon","P","value","index"],"sources":["../../src/definition/definitionContent.tsx"],"sourcesContent":["import Box from '../box'\nimport { styled, useStyleConfig, vui } from '../core'\nimport Icon from '../icon'\nimport P from '../p'\nimport { cs, isArray } from '../utils'\nimport type { DefinitionItem, DefinitionProps } from './definition.types'\n\nexport const DefinitionItemKey = styled.dtBox``\nexport const DefinitionItemValue = styled.ddBox``\n\nexport const DefinitionContent = vui<'dl', DefinitionProps>((props, ref) => {\n  const { iconLeft, iconRight, isLabelBold, isValueBold, items, orientation } = props as DefinitionProps\n\n  const styles = useStyleConfig('Definition', props)\n\n  return (\n    <>\n      {isArray<DefinitionItem>(items)\n        ? items.map(({ key, value, ...props }, index) => (\n            <Box className=\"vui-definitionItemWrapper\" key={index} ref={ref}>\n              <DefinitionItemKey fontWeight={isLabelBold ? 'demi' : 'default'} {...styles.dt}>\n                {props.keyHasIcon && iconLeft && (\n                  <Icon className={cs('vui-definitionIcon')} name={iconLeft} {...styles.icon} />\n                )}\n                {key}\n                {props.keyHasIcon && iconRight && (\n                  <Icon className={cs('vui-definitionIcon')} name={iconRight} {...styles.icon} />\n                )}\n              </DefinitionItemKey>\n              {isArray(value) ? (\n                <DefinitionItemValue\n                  display=\"block\"\n                  fontWeight={isValueBold ? 'demi' : 'default'}\n                  {...styles.dd}\n                  key={index}\n                >\n                  {orientation === 'horizontal'\n                    ? value.join(', ')\n                    : value.map((value, index) => (\n                        <P display=\"flex\" key={index + value}>\n                          {props.valueHasIcon && iconLeft && (\n                            <Icon className={cs('vui-definitionIcon')} name={iconLeft} {...styles.icon} />\n                          )}\n                          {value}\n                          {props.valueHasIcon && iconRight && (\n                            <Icon className={cs('vui-definitionIcon')} name={iconRight} {...styles.icon} />\n                          )}\n                        </P>\n                      ))}\n                  {}\n                </DefinitionItemValue>\n              ) : (\n                <DefinitionItemValue fontWeight={isValueBold ? 'demi' : 'default'} {...styles.dd}>\n                  {props.valueHasIcon && iconLeft && (\n                    <Icon className={cs('vui-definitionIcon')} name={iconLeft} {...styles.icon} />\n                  )}\n                  {value}\n                  {props.valueHasIcon && iconRight && (\n                    <Icon className={cs('vui-definitionIcon')} name={iconRight} {...styles.icon} />\n                  )}\n                </DefinitionItemValue>\n              )}\n            </Box>\n          ))\n        : items}\n    </>\n  )\n})\n\nDefinitionContent.displayName = 'DefinitionContent'\n\nexport default DefinitionContent\n"],"mappings":";;;;;;;;;;;;AAOA,MAAa,oBAAoB,OAAO,KAAK;AAC7C,MAAa,sBAAsB,OAAO,KAAK;AAE/C,MAAa,oBAAoB,KAA4B,OAAO,QAAQ;CAC1E,MAAM,EAAE,UAAU,WAAW,aAAa,aAAa,OAAO,gBAAgB;CAE9E,MAAM,SAAS,eAAe,cAAc,MAAM;AAElD,QACE,4CACG,QAAwB,MAAM,GAC3B,MAAM,KAAK,EAAE,KAAK,MAAO,GAAGA,WAAS,UACnC,qBAACC;EAAI,WAAU;EAA6C;aAC1D,qBAAC;GAAkB,YAAY,cAAc,SAAS;GAAW,GAAI,OAAO;;IACzED,QAAM,cAAc,YACnB,oBAACE;KAAK,WAAW,GAAG,qBAAqB;KAAE,MAAM;KAAU,GAAI,OAAO;MAAQ;IAE/E;IACAF,QAAM,cAAc,aACnB,oBAACE;KAAK,WAAW,GAAG,qBAAqB;KAAE,MAAM;KAAW,GAAI,OAAO;MAAQ;;IAE/D,EACnB,QAAQ,MAAM,GACb,8BAAC;GACC,SAAQ;GACR,YAAY,cAAc,SAAS;GACnC,GAAI,OAAO;GACX,KAAK;KAEJ,gBAAgB,eACb,MAAM,KAAK,KAAK,GAChB,MAAM,KAAK,SAAO,YAChB,qBAACC;GAAE,SAAQ;;IACRH,QAAM,gBAAgB,YACrB,oBAACE;KAAK,WAAW,GAAG,qBAAqB;KAAE,MAAM;KAAU,GAAI,OAAO;MAAQ;IAE/EE;IACAJ,QAAM,gBAAgB,aACrB,oBAACE;KAAK,WAAW,GAAG,qBAAqB;KAAE,MAAM;KAAW,GAAI,OAAO;MAAQ;;KAN5DG,UAAQD,QAQ3B,CACJ,CAEc,GAEtB,qBAAC;GAAoB,YAAY,cAAc,SAAS;GAAW,GAAI,OAAO;;IAC3EJ,QAAM,gBAAgB,YACrB,oBAACE;KAAK,WAAW,GAAG,qBAAqB;KAAE,MAAM;KAAU,GAAI,OAAO;MAAQ;IAE/E;IACAF,QAAM,gBAAgB,aACrB,oBAACE;KAAK,WAAW,GAAG,qBAAqB;KAAE,MAAM;KAAW,GAAI,OAAO;MAAQ;;IAE7D;IAzCsB,MA2C1C,CACN,GACF,QACH;EAEL;AAEF,kBAAkB,cAAc"}

package/dist/definition/theme.js

@@ -1,2 +1,71 @@
-var e={baseStyle:{},defaultProps:{size:`md`,variant:`light`},parts:[`container`,`icon`,`dt`,`dd`],sizes:{sm:{container:{fontSize:`sm`,lineHeight:`22px`},dt:{fontSize:`sm`,spaceX:4},dd:{fontSize:`sm`,spaceX:4},icon:{size:`sm`,mx:.5,my:`auto`}},md:{container:{fontSize:`md`,lineHeight:`30px`},dt:{fontSize:`md`,spaceX:6},dd:{fontSize:`md`,spaceX:6},icon:{size:`md`,mx:.5,my:`auto`}}},variants:{light:{container:{color:`sandstone.20`}},dark:{container:{bg:`darkBlue.main`,color:`white`}}}};export{e as default};globalThis.__vuiVersion__=`3.0.0-beta.7`;
+//#region src/definition/theme.ts
+const baseStyle = {};
+const defaultProps = {
+	size: "md",
+	variant: "light"
+};
+const parts = [
+	"container",
+	"icon",
+	"dt",
+	"dd"
+];
+const sizes = {
+	sm: {
+		container: {
+			fontSize: "sm",
+			lineHeight: "22px"
+		},
+		dt: {
+			fontSize: "sm",
+			spaceX: 4
+		},
+		dd: {
+			fontSize: "sm",
+			spaceX: 4
+		},
+		icon: {
+			size: "sm",
+			mx: .5,
+			my: "auto"
+		}
+	},
+	md: {
+		container: {
+			fontSize: "md",
+			lineHeight: "30px"
+		},
+		dt: {
+			fontSize: "md",
+			spaceX: 6
+		},
+		dd: {
+			fontSize: "md",
+			spaceX: 6
+		},
+		icon: {
+			size: "md",
+			mx: .5,
+			my: "auto"
+		}
+	}
+};
+const variants = {
+	light: { container: { color: "sandstone.20" } },
+	dark: { container: {
+		bg: "darkBlue.main",
+		color: "white"
+	} }
+};
+var theme_default = {
+	baseStyle,
+	defaultProps,
+	parts,
+	sizes,
+	variants
+};
+
+//#endregion
+export { theme_default as default };
+globalThis.__vuiVersion__ = "3.0.0-beta.9"
 //# sourceMappingURL=theme.js.map

package/dist/definition/theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme.js","names":[],"sources":["../../src/definition/theme.ts"],"sourcesContent":["const baseStyle = {}\n\nconst defaultProps = {\n  size: 'md',\n  variant: 'light',\n}\n\nconst parts = ['container', 'icon', 'dt', 'dd']\n\nconst sizes = {\n  sm: {\n    container: {\n      fontSize: 'sm',\n      lineHeight: '22px',\n    },\n    dt: {\n      fontSize: 'sm',\n      spaceX: 4,\n    },\n    dd: {\n      fontSize: 'sm',\n      spaceX: 4,\n    },\n    icon: {\n      size: 'sm',\n      mx: 0.5,\n      my: 'auto',\n    },\n  },\n  md: {\n    container: {\n      fontSize: 'md',\n      lineHeight: '30px',\n    },\n    dt: {\n      fontSize: 'md',\n      spaceX: 6,\n    },\n    dd: {\n      fontSize: 'md',\n      spaceX: 6,\n    },\n    icon: {\n      size: 'md',\n      mx: 0.5,\n      my: 'auto',\n    },\n  },\n}\n\nconst variants = {\n  light: {\n    container: {\n      color: 'sandstone.20',\n    },\n  },\n  dark: {\n    container: {\n      bg: 'darkBlue.main',\n      color: 'white',\n    },\n  },\n}\n\nexport default {\n  baseStyle,\n  defaultProps,\n  parts,\n  sizes,\n  variants,\n}\n"],"mappings":"AAgEA,IAAA,EAAe,CACb,UAjEgB,EAAE,CAkElB,aAhEmB,CACnB,KAAM,KACN,QAAS,QACV,CA8DC,MA5DY,CAAC,YAAa,OAAQ,KAAM,KAAK,CA6D7C,MA3DY,CACZ,GAAI,CACF,UAAW,CACT,SAAU,KACV,WAAY,OACb,CACD,GAAI,CACF,SAAU,KACV,OAAQ,EACT,CACD,GAAI,CACF,SAAU,KACV,OAAQ,EACT,CACD,KAAM,CACJ,KAAM,KACN,GAAI,GACJ,GAAI,OACL,CACF,CACD,GAAI,CACF,UAAW,CACT,SAAU,KACV,WAAY,OACb,CACD,GAAI,CACF,SAAU,KACV,OAAQ,EACT,CACD,GAAI,CACF,SAAU,KACV,OAAQ,EACT,CACD,KAAM,CACJ,KAAM,KACN,GAAI,GACJ,GAAI,OACL,CACF,CACF,CAqBC,SAnBe,CACf,MAAO,CACL,UAAW,CACT,MAAO,eACR,CACF,CACD,KAAM,CACJ,UAAW,CACT,GAAI,gBACJ,MAAO,QACR,CACF,CACF,CAQA"}
+{"version":3,"file":"theme.js","names":[],"sources":["../../src/definition/theme.ts"],"sourcesContent":["const baseStyle = {}\n\nconst defaultProps = {\n  size: 'md',\n  variant: 'light',\n}\n\nconst parts = ['container', 'icon', 'dt', 'dd']\n\nconst sizes = {\n  sm: {\n    container: {\n      fontSize: 'sm',\n      lineHeight: '22px',\n    },\n    dt: {\n      fontSize: 'sm',\n      spaceX: 4,\n    },\n    dd: {\n      fontSize: 'sm',\n      spaceX: 4,\n    },\n    icon: {\n      size: 'sm',\n      mx: 0.5,\n      my: 'auto',\n    },\n  },\n  md: {\n    container: {\n      fontSize: 'md',\n      lineHeight: '30px',\n    },\n    dt: {\n      fontSize: 'md',\n      spaceX: 6,\n    },\n    dd: {\n      fontSize: 'md',\n      spaceX: 6,\n    },\n    icon: {\n      size: 'md',\n      mx: 0.5,\n      my: 'auto',\n    },\n  },\n}\n\nconst variants = {\n  light: {\n    container: {\n      color: 'sandstone.20',\n    },\n  },\n  dark: {\n    container: {\n      bg: 'darkBlue.main',\n      color: 'white',\n    },\n  },\n}\n\nexport default {\n  baseStyle,\n  defaultProps,\n  parts,\n  sizes,\n  variants,\n}\n"],"mappings":";AAAA,MAAM,YAAY,EAAE;AAEpB,MAAM,eAAe;CACnB,MAAM;CACN,SAAS;CACV;AAED,MAAM,QAAQ;CAAC;CAAa;CAAQ;CAAM;CAAK;AAE/C,MAAM,QAAQ;CACZ,IAAI;EACF,WAAW;GACT,UAAU;GACV,YAAY;GACb;EACD,IAAI;GACF,UAAU;GACV,QAAQ;GACT;EACD,IAAI;GACF,UAAU;GACV,QAAQ;GACT;EACD,MAAM;GACJ,MAAM;GACN,IAAI;GACJ,IAAI;GACL;EACF;CACD,IAAI;EACF,WAAW;GACT,UAAU;GACV,YAAY;GACb;EACD,IAAI;GACF,UAAU;GACV,QAAQ;GACT;EACD,IAAI;GACF,UAAU;GACV,QAAQ;GACT;EACD,MAAM;GACJ,MAAM;GACN,IAAI;GACJ,IAAI;GACL;EACF;CACF;AAED,MAAM,WAAW;CACf,OAAO,EACL,WAAW,EACT,OAAO,gBACR,EACF;CACD,MAAM,EACJ,WAAW;EACT,IAAI;EACJ,OAAO;EACR,EACF;CACF;AAED,oBAAe;CACb;CACA;CACA;CACA;CACA;CACD"}

package/dist/dialog/consts.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"consts.d.ts","names":[],"sources":["../../src/dialog/consts.ts"],"sourcesContent":[],"mappings":";;;;cAGa,qBAAqB;AAArB,cA2BA,cAFZ,EAAA;EAEY,IAAA,EAAA,MAAA;EAMA,MAAA,EAAA,MAAA;EAMA,KAAA,EAAA,MAAA;AAEb,CAAA;cARa;;;;;cAMA,WAAA;cAEA,UAAA"}
+{"version":3,"file":"consts.d.ts","names":[],"sources":["../../src/dialog/consts.ts"],"sourcesContent":[],"mappings":";;;;cAGa,qBAAqB;AAArB,OAAA,CAAA,KAAA,CA2BA,cAFZ,CAAA,CAAA;EAEY,IAAA,CAAA,CAAA,MAAA;EAMA,MAAA,CAAA,CAAA,MAAA;EAMA,KAAA,CAAA,CAAA,MAAA;AAEb,CAAA;cARa;;;;;cAMA,WAAA,CAAA,CAAA;cAEA,UAAA,CAAA,CAAA"}

package/dist/dialog/consts.js

@@ -1,2 +1,37 @@
-const e={danger:{iconProps:{color:`red.80`,name:`falExclamationTriangle`}},error:{iconProps:{color:`red.80`,name:`falTimesCircle`}},info:{iconProps:{color:`blue.80`,name:`falInfoCircle`}},warning:{iconProps:{color:`yellow.90`,name:`falExclamationTriangle`}}},t={left:`fadeRightLong`,center:`fadeDown`,right:`fadeLeftLong`},n={left:`start`,center:`center`,right:`end`},r=`vui-dynamic-container`,i=`vui-modal`;export{r as containerId,e as dialogStatusMapping,t as modalAnimation,i as modalClass,n as modalJustifyContent};globalThis.__vuiVersion__=`3.0.0-beta.7`;
+//#region src/dialog/consts.ts
+/** Defines icon visuals for each Dialog status. */
+const dialogStatusMapping = {
+	danger: { iconProps: {
+		color: "red.80",
+		name: "falExclamationTriangle"
+	} },
+	error: { iconProps: {
+		color: "red.80",
+		name: "falTimesCircle"
+	} },
+	info: { iconProps: {
+		color: "blue.80",
+		name: "falInfoCircle"
+	} },
+	warning: { iconProps: {
+		color: "yellow.90",
+		name: "falExclamationTriangle"
+	} }
+};
+const modalAnimation = {
+	left: "fadeRightLong",
+	center: "fadeDown",
+	right: "fadeLeftLong"
+};
+const modalJustifyContent = {
+	left: "start",
+	center: "center",
+	right: "end"
+};
+const containerId = "vui-dynamic-container";
+const modalClass = "vui-modal";
+
+//#endregion
+export { containerId, dialogStatusMapping, modalAnimation, modalClass, modalJustifyContent };
+globalThis.__vuiVersion__ = "3.0.0-beta.9"
 //# sourceMappingURL=consts.js.map

package/dist/dialog/consts.js.map

@@ -1 +1 @@
-{"version":3,"file":"consts.js","names":["dialogStatusMapping: DialogStatusMapping"],"sources":["../../src/dialog/consts.ts"],"sourcesContent":["import type { DialogStatusMapping } from './dialog.types'\n\n/** Defines icon visuals for each Dialog status. */\nexport const dialogStatusMapping: DialogStatusMapping = {\n  danger: {\n    iconProps: {\n      color: 'red.80',\n      name: 'falExclamationTriangle',\n    },\n  },\n  error: {\n    iconProps: {\n      color: 'red.80',\n      name: 'falTimesCircle',\n    },\n  },\n  info: {\n    iconProps: {\n      color: 'blue.80',\n      name: 'falInfoCircle',\n    },\n  },\n  warning: {\n    iconProps: {\n      color: 'yellow.90',\n      name: 'falExclamationTriangle',\n    },\n  },\n}\n\nexport const modalAnimation = {\n  left: 'fadeRightLong',\n  center: 'fadeDown',\n  right: 'fadeLeftLong',\n}\n\nexport const modalJustifyContent = {\n  left: 'start',\n  center: 'center',\n  right: 'end',\n}\n\nexport const containerId = 'vui-dynamic-container'\n\nexport const modalClass = 'vui-modal'\n"],"mappings":"AAGA,MAAaA,EAA2C,CACtD,OAAQ,CACN,UAAW,CACT,MAAO,SACP,KAAM,yBACP,CACF,CACD,MAAO,CACL,UAAW,CACT,MAAO,SACP,KAAM,iBACP,CACF,CACD,KAAM,CACJ,UAAW,CACT,MAAO,UACP,KAAM,gBACP,CACF,CACD,QAAS,CACP,UAAW,CACT,MAAO,YACP,KAAM,yBACP,CACF,CACF,CAEY,EAAiB,CAC5B,KAAM,gBACN,OAAQ,WACR,MAAO,eACR,CAEY,EAAsB,CACjC,KAAM,QACN,OAAQ,SACR,MAAO,MACR,CAEY,EAAc,wBAEd,EAAa"}
+{"version":3,"file":"consts.js","names":["dialogStatusMapping: DialogStatusMapping"],"sources":["../../src/dialog/consts.ts"],"sourcesContent":["import type { DialogStatusMapping } from './dialog.types'\n\n/** Defines icon visuals for each Dialog status. */\nexport const dialogStatusMapping: DialogStatusMapping = {\n  danger: {\n    iconProps: {\n      color: 'red.80',\n      name: 'falExclamationTriangle',\n    },\n  },\n  error: {\n    iconProps: {\n      color: 'red.80',\n      name: 'falTimesCircle',\n    },\n  },\n  info: {\n    iconProps: {\n      color: 'blue.80',\n      name: 'falInfoCircle',\n    },\n  },\n  warning: {\n    iconProps: {\n      color: 'yellow.90',\n      name: 'falExclamationTriangle',\n    },\n  },\n}\n\nexport const modalAnimation = {\n  left: 'fadeRightLong',\n  center: 'fadeDown',\n  right: 'fadeLeftLong',\n}\n\nexport const modalJustifyContent = {\n  left: 'start',\n  center: 'center',\n  right: 'end',\n}\n\nexport const containerId = 'vui-dynamic-container'\n\nexport const modalClass = 'vui-modal'\n"],"mappings":";;AAGA,MAAaA,sBAA2C;CACtD,QAAQ,EACN,WAAW;EACT,OAAO;EACP,MAAM;EACP,EACF;CACD,OAAO,EACL,WAAW;EACT,OAAO;EACP,MAAM;EACP,EACF;CACD,MAAM,EACJ,WAAW;EACT,OAAO;EACP,MAAM;EACP,EACF;CACD,SAAS,EACP,WAAW;EACT,OAAO;EACP,MAAM;EACP,EACF;CACF;AAED,MAAa,iBAAiB;CAC5B,MAAM;CACN,QAAQ;CACR,OAAO;CACR;AAED,MAAa,sBAAsB;CACjC,MAAM;CACN,QAAQ;CACR,OAAO;CACR;AAED,MAAa,cAAc;AAE3B,MAAa,aAAa"}

package/dist/dialog/context.d.ts

@@ -1,8 +1,8 @@
 import { DialogContext } from "./dialog.types.js";
-import * as react8 from "react";
+import * as react936 from "react";
 
 //#region src/dialog/context.d.ts
-declare const DialogProvider: react8.Provider<DialogContext>, useDialogContext: () => DialogContext;
+declare const DialogProvider: react936.Provider<DialogContext>, useDialogContext: () => DialogContext;
 //#endregion
 export { DialogProvider, useDialogContext };
 //# sourceMappingURL=context.d.ts.map

package/dist/dialog/context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"context.d.ts","names":[],"sources":["../../src/dialog/context.ts"],"sourcesContent":[],"mappings":";;;;cAGO,gBAAc,MAAA,CAAA,SAAA,gBAAE,wBAAgB"}
+{"version":3,"file":"context.d.ts","names":[],"sources":["../../src/dialog/context.ts"],"sourcesContent":[],"mappings":";;;;cAGO,gBAAc,QAAA,CAAA,SAAA,gBAAE,wBAAgB"}

package/dist/dialog/context.js

@@ -1,2 +1,9 @@
-import{createContext as e}from"../utils/react.js";const[t,n]=e({isOptional:!0});export{t as DialogProvider,n as useDialogContext};globalThis.__vuiVersion__=`3.0.0-beta.7`;
+import { createContext } from "../utils/react.js";
+
+//#region src/dialog/context.ts
+const [DialogProvider, useDialogContext] = createContext({ isOptional: true });
+
+//#endregion
+export { DialogProvider, useDialogContext };
+globalThis.__vuiVersion__ = "3.0.0-beta.9"
 //# sourceMappingURL=context.js.map

package/dist/dialog/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","names":[],"sources":["../../src/dialog/context.ts"],"sourcesContent":["import { createContext } from '../utils'\nimport type { DialogContext } from './dialog.types'\n\nconst [DialogProvider, useDialogContext] = createContext<DialogContext>({ isOptional: true })\n\nexport { DialogProvider, useDialogContext }\n"],"mappings":"kDAGA,KAAM,CAAC,EAAgB,GAAoB,EAA6B,CAAE,WAAY,GAAM,CAAC"}
+{"version":3,"file":"context.js","names":[],"sources":["../../src/dialog/context.ts"],"sourcesContent":["import { createContext } from '../utils'\nimport type { DialogContext } from './dialog.types'\n\nconst [DialogProvider, useDialogContext] = createContext<DialogContext>({ isOptional: true })\n\nexport { DialogProvider, useDialogContext }\n"],"mappings":";;;AAGA,MAAM,CAAC,gBAAgB,oBAAoB,cAA6B,EAAE,YAAY,MAAM,CAAC"}

package/dist/dialog/dialog.d.ts

@@ -9,10 +9,10 @@ import { DialogHeader } from "./dialogHeader.js";
 import { DialogIcon } from "./dialogIcon.js";
 import { DialogSubmitButton } from "./dialogSubmitButton.js";
 import { DialogTitle } from "./dialogTitle.js";
-import * as styled_components32 from "styled-components";
+import * as styled_components371 from "styled-components";
 
 //#region src/dialog/dialog.d.ts
-declare const DialogBase: styled_components32.StyledComponent<"div", styled_components32.DefaultTheme, SystemProps, never>;
+declare const DialogBase: styled_components371.StyledComponent<"div", styled_components371.DefaultTheme, SystemProps, never>;
 /**
  * Displays content in a Modal window. Includes required accessibility configuration.
  *

package/dist/dialog/dialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.d.ts","names":[],"sources":["../../src/dialog/dialog.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;;;;;;cAkBa,YAAU,mBAAA,CAAA,uBAOtB,mBAAA,CAPsB,YAAA;;;;AAAvB;;;;AAAuB,cAgBV,MAhBU,EA2FjB,YA3FiB,CAAA,KAAA,EA2FG,WA3FH,CAAA,GAAA;EAAA,IAAA,EAAA,OA4FR,UA5FQ;EAgBV,YAoFZ,EAAA,OAPsB,kBAOtB;EAAA,WAAA,EAAA,OANqB,iBAMrB;QATyB,EAAA,OAIT,YAJS;QAApB,EAAA,OAKW,YALX;MACS,EAAA,OAKA,UALA;cACQ,EAAA,OAKA,kBALA;OACD,EAAA,OAKN,WALM"}
+{"version":3,"file":"dialog.d.ts","names":[],"sources":["../../src/dialog/dialog.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;;;;;;cAkBa,YAAU,oBAAA,CAAA,uBAOtB,oBAAA,CAPsB,YAAA,CAAA,CAAA,WAAA,CAAA;;;;AAAvB,CAAA,CAAA,CAAA,MAAA,CAAA,EAAA,CAAA,KAAA,CAAA,IAAA,CAAA,CAAA,KAAA,CAAA;;;;AAAuB,OAAA,CAAA,KAAA,CAgBV,MAhBU,CAAA,CA2FjB,YA3FiB,CAAA,CAAA,GAAA,CAAA,CAAA,CA2FG,WA3FH,CAAA,CAAA,CAAA,CAAA;EAAA,IAAA,CAAA,CAAA,MAAA,CA4FR,UA5FQ;EAgBV,YAoFZ,CAAA,CAAA,MAAA,CAPsB,kBAOtB;EAAA,WAAA,CAAA,CAAA,MAAA,CANqB,iBAMrB;QATyB,CAAA,CAAA,MAAA,CAIT,YAJS;QAApB,CAAA,CAAA,MAAA,CAKW,YALX;MACS,CAAA,CAAA,MAAA,CAKA,UALA;cACQ,CAAA,CAAA,MAAA,CAKA,kBALA;OACD,CAAA,CAAA,MAAA,CAKN,WALM"}

package/dist/dialog/dialog.js

@@ -1,9 +1,119 @@
-import{isJsx as e,isReactText as t}from"../utils/assertion.js";import{random as n}from"../utils/number.js";import{useIds as r}from"../utils/react.js";import{cs as i}from"../utils/styles.js";import{useStyleConfig as a}from"../core/theme.js";import{styled as o}from"../core/styled.js";import{vui as s}from"../core/vui.js";import{modalAnimation as c,modalJustifyContent as l}from"./consts.js";import{DialogProvider as u}from"./context.js";import d from"../modal/modal.js";import f from"./dialogBody.js";import p from"./dialogCancelButton.js";import m from"./dialogCloseButton.js";import h from"./dialogSubmitButton.js";import g from"./dialogFooter.js";import _ from"./dialogIcon.js";import v from"./dialogTitle.js";import y from"./dialogHeader.js";import{useRef as b}from"react";import{Fragment as x,jsx as S,jsxs as C}from"react/jsx-runtime";const w=o.divBox`
+import { isJsx, isReactText } from "../utils/assertion.js";
+import { random } from "../utils/number.js";
+import { useIds } from "../utils/react.js";
+import { cs } from "../utils/styles.js";
+import { useStyleConfig } from "../core/theme.js";
+import { styled } from "../core/styled.js";
+import { vui } from "../core/vui.js";
+import { modalAnimation, modalJustifyContent } from "./consts.js";
+import { DialogProvider } from "./context.js";
+import modal_default from "../modal/modal.js";
+import dialogBody_default from "./dialogBody.js";
+import dialogCancelButton_default from "./dialogCancelButton.js";
+import dialogCloseButton_default from "./dialogCloseButton.js";
+import dialogSubmitButton_default from "./dialogSubmitButton.js";
+import dialogFooter_default from "./dialogFooter.js";
+import dialogIcon_default from "./dialogIcon.js";
+import dialogTitle_default from "./dialogTitle.js";
+import dialogHeader_default from "./dialogHeader.js";
+import { useRef } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/dialog/dialog.tsx
+const DialogBase = styled.divBox`
   background-color: white;
   border-radius: 1px;
   box-shadow: modal;
   display: flex;
   flex-direction: column;
   width: 100%;
-`,T=s((o,s)=>{let{body:p,cancelButton:m,children:h,className:_,closeButton:v,disableBackdropClose:T,footer:E,header:D,icon:O,id:k,isOpen:A,modalProps:j,placement:M=`center`,onClose:N,size:P,status:F,submitButton:I,title:L,variant:R,...z}=o,B=a(`Dialog`,o),V=b(k??n().toString()),[H,U,W]=r(V.current,[`dialog`,`dialog-body`,`dialog-title`]),G=t(p)?{children:p}:p,K=!!(D||v||O||L),q=!!(E||m||I),J={"aria-describedby":U,"aria-labelledby":W},Y={animation:c[M],contentProps:{alignItems:M===`center`?`center`:`auto`,justifyContent:l[M],...j?.contentProps},...j};return S(u,{value:{bodyId:U,icon:O,isOpen:A,onClose:N,size:P,status:F,titleId:W,variant:R},children:S(d,{isOpen:A,onClose:N,...Y,disableBackdropClose:T,children:S(w,{className:i(`vui-dialog`,_),id:H,maxH:M===`center`?`calc(100vh - 32px)`:`100%`,ref:s,role:`dialog`,...J,...B.container,...z,children:h??C(x,{children:[e(D)?D:K&&S(y,{closeButton:v,icon:O,title:L,...D}),e(G)?G:G&&S(f,{...G}),e(E)?E:q&&S(g,{cancelButton:m,submitButton:I,...E})]})})})})});T.Body=f,T.CancelButton=p,T.CloseButton=m,T.Footer=g,T.Header=y,T.Icon=_,T.SubmitButton=h,T.Title=v,T.displayName=`Dialog`;var E=T;export{w as DialogBase,E as default};globalThis.__vuiVersion__=`3.0.0-beta.7`;
+`;
+/**
+* Displays content in a Modal window. Includes required accessibility configuration.
+*
+* Dialog is built upon `Modal`.
+*
+* The content can include important information, like warnings or errors, simple forms or prompts for user's decision. It blocks interaction with the rest of the page, but often can be disabled by pressing Escape, clicking on the backdrop or close button.
+*/
+const Dialog = vui((props, ref) => {
+	const { body: bodyProp, cancelButton, children, className, closeButton, disableBackdropClose, footer, header, icon, id, isOpen, modalProps: modalPropsProp, placement = "center", onClose, size, status, submitButton, title, variant,...rest } = props;
+	const styles = useStyleConfig("Dialog", props);
+	const [dialogId, bodyId, titleId] = useIds(useRef(id ?? random().toString()).current, [
+		"dialog",
+		"dialog-body",
+		"dialog-title"
+	]);
+	const body = isReactText(bodyProp) ? { children: bodyProp } : bodyProp;
+	const showHeader = Boolean(header || closeButton || icon || title);
+	const showFooter = Boolean(footer || cancelButton || submitButton);
+	const ariaProps = {
+		"aria-describedby": bodyId,
+		"aria-labelledby": titleId
+	};
+	const modalProps = {
+		animation: modalAnimation[placement],
+		contentProps: {
+			alignItems: placement === "center" ? "center" : "auto",
+			justifyContent: modalJustifyContent[placement],
+			...modalPropsProp?.contentProps
+		},
+		...modalPropsProp
+	};
+	return /* @__PURE__ */ jsx(DialogProvider, {
+		value: {
+			bodyId,
+			icon,
+			isOpen,
+			onClose,
+			size,
+			status,
+			titleId,
+			variant
+		},
+		children: /* @__PURE__ */ jsx(modal_default, {
+			isOpen,
+			onClose,
+			...modalProps,
+			disableBackdropClose,
+			children: /* @__PURE__ */ jsx(DialogBase, {
+				className: cs("vui-dialog", className),
+				id: dialogId,
+				maxH: placement === "center" ? "calc(100vh - 32px)" : "100%",
+				ref,
+				role: "dialog",
+				...ariaProps,
+				...styles.container,
+				...rest,
+				children: children ?? /* @__PURE__ */ jsxs(Fragment$1, { children: [
+					isJsx(header) ? header : showHeader && /* @__PURE__ */ jsx(dialogHeader_default, {
+						closeButton,
+						icon,
+						title,
+						...header
+					}),
+					isJsx(body) ? body : body && /* @__PURE__ */ jsx(dialogBody_default, { ...body }),
+					isJsx(footer) ? footer : showFooter && /* @__PURE__ */ jsx(dialogFooter_default, {
+						cancelButton,
+						submitButton,
+						...footer
+					})
+				] })
+			})
+		})
+	});
+});
+Dialog.Body = dialogBody_default;
+Dialog.CancelButton = dialogCancelButton_default;
+Dialog.CloseButton = dialogCloseButton_default;
+Dialog.Footer = dialogFooter_default;
+Dialog.Header = dialogHeader_default;
+Dialog.Icon = dialogIcon_default;
+Dialog.SubmitButton = dialogSubmitButton_default;
+Dialog.Title = dialogTitle_default;
+Dialog.displayName = "Dialog";
+var dialog_default = Dialog;
+
+//#endregion
+export { DialogBase, dialog_default as default };
+globalThis.__vuiVersion__ = "3.0.0-beta.9"
 //# sourceMappingURL=dialog.js.map

package/dist/dialog/dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.js","names":["Modal","DialogHeader","DialogBody","DialogFooter","DialogCancelButton","DialogCloseButton","DialogIcon","DialogSubmitButton","DialogTitle"],"sources":["../../src/dialog/dialog.tsx"],"sourcesContent":["import { useRef } from 'react'\n\nimport type { VuiComponent } from '../core'\nimport { styled, useStyleConfig, vui } from '../core'\nimport { Modal } from '../modal'\nimport { cs, isJsx, isReactText, random, useIds } from '../utils'\nimport { modalAnimation, modalJustifyContent } from './consts'\nimport { DialogProvider } from './context'\nimport type { DialogProps } from './dialog.types'\nimport DialogBody from './dialogBody'\nimport DialogCancelButton from './dialogCancelButton'\nimport DialogCloseButton from './dialogCloseButton'\nimport DialogFooter from './dialogFooter'\nimport DialogHeader from './dialogHeader'\nimport DialogIcon from './dialogIcon'\nimport DialogSubmitButton from './dialogSubmitButton'\nimport DialogTitle from './dialogTitle'\n\nexport const DialogBase = styled.divBox`\n  background-color: white;\n  border-radius: 1px;\n  box-shadow: modal;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n`\n\n/**\n * Displays content in a Modal window. Includes required accessibility configuration.\n *\n * Dialog is built upon `Modal`.\n *\n * The content can include important information, like warnings or errors, simple forms or prompts for user's decision. It blocks interaction with the rest of the page, but often can be disabled by pressing Escape, clicking on the backdrop or close button.\n */\nexport const Dialog = vui<'div', DialogProps>((props, ref) => {\n  const {\n    body: bodyProp,\n    cancelButton,\n    children,\n    className,\n    closeButton,\n    disableBackdropClose,\n    footer,\n    header,\n    icon,\n    id,\n    isOpen,\n    modalProps: modalPropsProp,\n    placement = 'center',\n    onClose,\n    size,\n    status,\n    submitButton,\n    title,\n    variant,\n    ...rest\n  } = props\n  const styles = useStyleConfig('Dialog', props)\n\n  const idRef = useRef(id ?? random().toString())\n  const [dialogId, bodyId, titleId] = useIds(idRef.current, ['dialog', 'dialog-body', 'dialog-title'])\n\n  const body = isReactText(bodyProp) ? { children: bodyProp } : bodyProp\n  const showHeader = Boolean(header || closeButton || icon || title)\n  const showFooter = Boolean(footer || cancelButton || submitButton)\n\n  const ariaProps = {\n    'aria-describedby': bodyId,\n    'aria-labelledby': titleId,\n  }\n\n  const modalProps = {\n    animation: modalAnimation[placement as keyof typeof modalAnimation],\n    contentProps: {\n      alignItems: placement === 'center' ? 'center' : 'auto',\n      justifyContent: modalJustifyContent[placement as keyof typeof modalJustifyContent],\n      ...modalPropsProp?.contentProps,\n    },\n    ...modalPropsProp,\n  }\n\n  const context = { bodyId, icon, isOpen, onClose, size, status, titleId, variant }\n\n  return (\n    <DialogProvider value={context}>\n      <Modal {...{ isOpen, onClose }} {...{ ...modalProps, disableBackdropClose }}>\n        <DialogBase\n          className={cs('vui-dialog', className)}\n          id={dialogId}\n          maxH={placement === 'center' ? 'calc(100vh - 32px)' : '100%'}\n          ref={ref}\n          role=\"dialog\"\n          {...ariaProps}\n          {...styles.container}\n          {...rest}\n        >\n          {children ?? (\n            <>\n              {isJsx(header) ? header : showHeader && <DialogHeader {...{ closeButton, icon, title }} {...header} />}\n\n              {isJsx(body) ? body : body && <DialogBody {...body} />}\n\n              {isJsx(footer) ? footer : showFooter && <DialogFooter {...{ cancelButton, submitButton }} {...footer} />}\n            </>\n          )}\n        </DialogBase>\n      </Modal>\n    </DialogProvider>\n  )\n}) as VuiComponent<'div', DialogProps> & {\n  Body: typeof DialogBody\n  CancelButton: typeof DialogCancelButton\n  CloseButton: typeof DialogCloseButton\n  Footer: typeof DialogFooter\n  Header: typeof DialogHeader\n  Icon: typeof DialogIcon\n  SubmitButton: typeof DialogSubmitButton\n  Title: typeof DialogTitle\n}\n\nDialog.Body = DialogBody\nDialog.CancelButton = DialogCancelButton\nDialog.CloseButton = DialogCloseButton\nDialog.Footer = DialogFooter\nDialog.Header = DialogHeader\nDialog.Icon = DialogIcon\nDialog.SubmitButton = DialogSubmitButton\nDialog.Title = DialogTitle\nDialog.displayName = 'Dialog'\n\nexport default Dialog\n"],"mappings":"w0BAkBA,MAAa,EAAa,EAAO,MAAM;;;;;;;EAgB1B,EAAS,GAAyB,EAAO,IAAQ,CAC5D,GAAM,CACJ,KAAM,EACN,eACA,WACA,YACA,cACA,uBACA,SACA,SACA,OACA,KACA,SACA,WAAY,EACZ,YAAY,SACZ,UACA,OACA,SACA,eACA,QACA,UACA,GAAG,GACD,EACE,EAAS,EAAe,SAAU,EAAM,CAExC,EAAQ,EAAO,GAAM,GAAQ,CAAC,UAAU,CAAC,CACzC,CAAC,EAAU,EAAQ,GAAW,EAAO,EAAM,QAAS,CAAC,SAAU,cAAe,eAAe,CAAC,CAE9F,EAAO,EAAY,EAAS,CAAG,CAAE,SAAU,EAAU,CAAG,EACxD,EAAa,GAAQ,GAAU,GAAe,GAAQ,GACtD,EAAa,GAAQ,GAAU,GAAgB,GAE/C,EAAY,CAChB,mBAAoB,EACpB,kBAAmB,EACpB,CAEK,EAAa,CACjB,UAAW,EAAe,GAC1B,aAAc,CACZ,WAAY,IAAc,SAAW,SAAW,OAChD,eAAgB,EAAoB,GACpC,GAAG,GAAgB,aACpB,CACD,GAAG,EACJ,CAID,OACE,EAAC,EAAA,CAAe,MAHF,CAAE,SAAQ,OAAM,SAAQ,UAAS,OAAM,SAAQ,UAAS,UAAS,UAI7E,EAACA,EAAAA,CAAY,SAAQ,UAAiB,GAAG,EAAY,gCACnD,EAAC,EAAA,CACC,UAAW,EAAG,aAAc,EAAU,CACtC,GAAI,EACJ,KAAM,IAAc,SAAW,qBAAuB,OACjD,MACL,KAAK,SACL,GAAI,EACJ,GAAI,EAAO,UACX,GAAI,WAEH,GACC,EAAA,EAAA,CAAA,SAAA,CACG,EAAM,EAAO,CAAG,EAAS,GAAc,EAACC,EAAAA,CAAmB,cAAa,OAAM,QAAS,GAAI,GAAU,CAErG,EAAM,EAAK,CAAG,EAAO,GAAQ,EAACC,EAAAA,CAAW,GAAI,EAAA,CAAQ,CAErD,EAAM,EAAO,CAAG,EAAS,GAAc,EAACC,EAAAA,CAAmB,eAAc,eAAgB,GAAI,GAAU,GACvG,EAEM,EACP,EACO,EAEnB,CAWF,EAAO,KAAOD,EACd,EAAO,aAAeE,EACtB,EAAO,YAAcC,EACrB,EAAO,OAASF,EAChB,EAAO,OAASF,EAChB,EAAO,KAAOK,EACd,EAAO,aAAeC,EACtB,EAAO,MAAQC,EACf,EAAO,YAAc,SAErB,IAAA,EAAe"}
+{"version":3,"file":"dialog.js","names":["Modal","DialogHeader","DialogBody","DialogFooter","DialogCancelButton","DialogCloseButton","DialogIcon","DialogSubmitButton","DialogTitle"],"sources":["../../src/dialog/dialog.tsx"],"sourcesContent":["import { useRef } from 'react'\n\nimport type { VuiComponent } from '../core'\nimport { styled, useStyleConfig, vui } from '../core'\nimport { Modal } from '../modal'\nimport { cs, isJsx, isReactText, random, useIds } from '../utils'\nimport { modalAnimation, modalJustifyContent } from './consts'\nimport { DialogProvider } from './context'\nimport type { DialogProps } from './dialog.types'\nimport DialogBody from './dialogBody'\nimport DialogCancelButton from './dialogCancelButton'\nimport DialogCloseButton from './dialogCloseButton'\nimport DialogFooter from './dialogFooter'\nimport DialogHeader from './dialogHeader'\nimport DialogIcon from './dialogIcon'\nimport DialogSubmitButton from './dialogSubmitButton'\nimport DialogTitle from './dialogTitle'\n\nexport const DialogBase = styled.divBox`\n  background-color: white;\n  border-radius: 1px;\n  box-shadow: modal;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n`\n\n/**\n * Displays content in a Modal window. Includes required accessibility configuration.\n *\n * Dialog is built upon `Modal`.\n *\n * The content can include important information, like warnings or errors, simple forms or prompts for user's decision. It blocks interaction with the rest of the page, but often can be disabled by pressing Escape, clicking on the backdrop or close button.\n */\nexport const Dialog = vui<'div', DialogProps>((props, ref) => {\n  const {\n    body: bodyProp,\n    cancelButton,\n    children,\n    className,\n    closeButton,\n    disableBackdropClose,\n    footer,\n    header,\n    icon,\n    id,\n    isOpen,\n    modalProps: modalPropsProp,\n    placement = 'center',\n    onClose,\n    size,\n    status,\n    submitButton,\n    title,\n    variant,\n    ...rest\n  } = props\n  const styles = useStyleConfig('Dialog', props)\n\n  const idRef = useRef(id ?? random().toString())\n  const [dialogId, bodyId, titleId] = useIds(idRef.current, ['dialog', 'dialog-body', 'dialog-title'])\n\n  const body = isReactText(bodyProp) ? { children: bodyProp } : bodyProp\n  const showHeader = Boolean(header || closeButton || icon || title)\n  const showFooter = Boolean(footer || cancelButton || submitButton)\n\n  const ariaProps = {\n    'aria-describedby': bodyId,\n    'aria-labelledby': titleId,\n  }\n\n  const modalProps = {\n    animation: modalAnimation[placement as keyof typeof modalAnimation],\n    contentProps: {\n      alignItems: placement === 'center' ? 'center' : 'auto',\n      justifyContent: modalJustifyContent[placement as keyof typeof modalJustifyContent],\n      ...modalPropsProp?.contentProps,\n    },\n    ...modalPropsProp,\n  }\n\n  const context = { bodyId, icon, isOpen, onClose, size, status, titleId, variant }\n\n  return (\n    <DialogProvider value={context}>\n      <Modal {...{ isOpen, onClose }} {...{ ...modalProps, disableBackdropClose }}>\n        <DialogBase\n          className={cs('vui-dialog', className)}\n          id={dialogId}\n          maxH={placement === 'center' ? 'calc(100vh - 32px)' : '100%'}\n          ref={ref}\n          role=\"dialog\"\n          {...ariaProps}\n          {...styles.container}\n          {...rest}\n        >\n          {children ?? (\n            <>\n              {isJsx(header) ? header : showHeader && <DialogHeader {...{ closeButton, icon, title }} {...header} />}\n\n              {isJsx(body) ? body : body && <DialogBody {...body} />}\n\n              {isJsx(footer) ? footer : showFooter && <DialogFooter {...{ cancelButton, submitButton }} {...footer} />}\n            </>\n          )}\n        </DialogBase>\n      </Modal>\n    </DialogProvider>\n  )\n}) as VuiComponent<'div', DialogProps> & {\n  Body: typeof DialogBody\n  CancelButton: typeof DialogCancelButton\n  CloseButton: typeof DialogCloseButton\n  Footer: typeof DialogFooter\n  Header: typeof DialogHeader\n  Icon: typeof DialogIcon\n  SubmitButton: typeof DialogSubmitButton\n  Title: typeof DialogTitle\n}\n\nDialog.Body = DialogBody\nDialog.CancelButton = DialogCancelButton\nDialog.CloseButton = DialogCloseButton\nDialog.Footer = DialogFooter\nDialog.Header = DialogHeader\nDialog.Icon = DialogIcon\nDialog.SubmitButton = DialogSubmitButton\nDialog.Title = DialogTitle\nDialog.displayName = 'Dialog'\n\nexport default Dialog\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAkBA,MAAa,aAAa,OAAO,MAAM;;;;;;;;;;;;;;;AAgBvC,MAAa,SAAS,KAAyB,OAAO,QAAQ;CAC5D,MAAM,EACJ,MAAM,UACN,cACA,UACA,WACA,aACA,sBACA,QACA,QACA,MACA,IACA,QACA,YAAY,gBACZ,YAAY,UACZ,SACA,MACA,QACA,cACA,OACA,QACA,GAAG,SACD;CACJ,MAAM,SAAS,eAAe,UAAU,MAAM;CAG9C,MAAM,CAAC,UAAU,QAAQ,WAAW,OADtB,OAAO,MAAM,QAAQ,CAAC,UAAU,CAAC,CACE,SAAS;EAAC;EAAU;EAAe;EAAe,CAAC;CAEpG,MAAM,OAAO,YAAY,SAAS,GAAG,EAAE,UAAU,UAAU,GAAG;CAC9D,MAAM,aAAa,QAAQ,UAAU,eAAe,QAAQ,MAAM;CAClE,MAAM,aAAa,QAAQ,UAAU,gBAAgB,aAAa;CAElE,MAAM,YAAY;EAChB,oBAAoB;EACpB,mBAAmB;EACpB;CAED,MAAM,aAAa;EACjB,WAAW,eAAe;EAC1B,cAAc;GACZ,YAAY,cAAc,WAAW,WAAW;GAChD,gBAAgB,oBAAoB;GACpC,GAAG,gBAAgB;GACpB;EACD,GAAG;EACJ;AAID,QACE,oBAAC;EAAe,OAHF;GAAE;GAAQ;GAAM;GAAQ;GAAS;GAAM;GAAQ;GAAS;GAAS;YAI7E,oBAACA;GAAY;GAAQ;GAAiB,GAAG;GAAY;aACnD,oBAAC;IACC,WAAW,GAAG,cAAc,UAAU;IACtC,IAAI;IACJ,MAAM,cAAc,WAAW,uBAAuB;IACjD;IACL,MAAK;IACL,GAAI;IACJ,GAAI,OAAO;IACX,GAAI;cAEH,YACC;KACG,MAAM,OAAO,GAAG,SAAS,cAAc,oBAACC;MAAmB;MAAa;MAAM;MAAS,GAAI;OAAU;KAErG,MAAM,KAAK,GAAG,OAAO,QAAQ,oBAACC,sBAAW,GAAI,OAAQ;KAErD,MAAM,OAAO,GAAG,SAAS,cAAc,oBAACC;MAAmB;MAAc;MAAgB,GAAI;OAAU;QACvG;KAEM;IACP;GACO;EAEnB;AAWF,OAAO,OAAOD;AACd,OAAO,eAAeE;AACtB,OAAO,cAAcC;AACrB,OAAO,SAASF;AAChB,OAAO,SAASF;AAChB,OAAO,OAAOK;AACd,OAAO,eAAeC;AACtB,OAAO,QAAQC;AACf,OAAO,cAAc;AAErB,qBAAe"}

package/dist/dialog/dialog.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.types.d.ts","names":[],"sources":["../../src/dialog/dialog.types.ts"],"sourcesContent":[],"mappings":";;;;;;;;;;KASY,eAAA,GAAkB,eAAe;KAEjC,uBAAA,GAA0B,kBAAkB;AAF5C,KAIA,sBAAA,GAAyB,OAJV,CAAA,QAAA,EAI4B,eAJ5B,CAAA;AAAA,KAMf,aAAA,GAAgB,IAND,CAMM,WANN,EAAA,MAAA,GAAA,QAAA,GAAA,SAAA,GAAA,MAAA,GAAA,QAAA,GAAA,SAAA,CAAA,GAAA;QAAkB,CAAA,EAAA,MAAA;SAAf,CAAA,EAAA,MAAA;CAAO;AAEzB,KASA,iBAAA,GAAoB,OATG,CAAA,KAAA,EASY,QATZ,GASuB,IATvB,CAS4B,WAT5B,EAAA,cAAA,GAAA,cAAA,CAAA,CAAA;AAAA,KAWvB,iBAAA,GAAoB,OAXG,CAAA,KAAA,EAWY,QAXZ,GAWuB,IAXvB,CAW4B,WAX5B,EAAA,aAAA,GAAA,MAAA,GAAA,OAAA,CAAA,CAAA;AAAqB,KAa5C,eAAA,GAAkB,OAb0B,CAAA,KAAA,EAaX,SAbW,CAAA;AAAlB,KAe1B,eAAA,GAf0B,MAAA,GAAA,QAAA,GAAA,OAAA;AAAO,KAiBjC,WAAA,GAAc,WAjBmB,GAkB3C,YAlB2C,CAAA,QAAA,CAAA,GAmB3C,IAnB2C,CAmBtC,UAnBsC,EAAA,QAAA,GAAA,SAAA,CAAA,GAAA;EAEjC;EAAsB,IAAA,CAAA,EAAA,MAAA,GAAA,MAAA,GAmBL,eAnBK,GAmBa,GAAA,CAAI,OAnBjB;;cAAG,CAAA,EAqBlB,uBArBkB,GAqBQ,GAAA,CAAI,OArBZ;EAAO;EAEhC,WAAA,CAAA,EAAA,OAAa,GAqBG,sBArBH,GAqB4B,GAAA,CAAI,OArBhC;EAAA;sBAAQ,CAAA,EAAA,OAAA;;EAAD,MAAA,CAAA,EAyBnB,iBAzBmB,GAyBC,GAAA,CAAI,OAzBL;EAKpB;EAAiB,MAAA,CAAA,EAsBhB,iBAtBgB,GAsBI,GAAA,CAAI,OAtBR;;MAAkC,CAAA,EAwBpD,QAxBoD,GAwBzC,eAxByC,GAwBvB,GAAA,CAAI,OAxBmB;;YAA/B,CAAA,EA0Bf,UA1Be;EAAO;EAE3B,SAAA,CAAA,EA0BI,eA1Ba;EAAA;QAAkB,CAAA,EA4BlC,YA5BkC;;cAAW,CAAA,EA8BvC,uBA9BuC,GA8Bb,GAAA,CAAI,OA9BS;;EAAnB,KAAA,CAAA,EAgC3B,YAhC2B,CAAA,MAAA,CAAA,GAgCJ,gBAhCI,GAgCe,GAAA,CAAI,OAhCnB;AAEvC,CAAA;AAA2B,KAiCf,YAAA,GAjCe,QAAA,GAAA,OAAA,GAAA,MAAA,GAAA,SAAA;AAAkB,KAmCjC,mBAAA,GAAsB,MAnCW,CAAA,MAAA,EAAA;WAAf,EAmCgC,SAnChC;CAAO,CAAA;AAEzB,KAmCA,uBAAA,GAA0B,OAnCX,CAAA,QAAA,EAmC6B,WAnC7B,CAAA;AAEf,KAmCA,gBAAA,GAAmB,OAnCR,CAAA,IAAA,EAmCsB,YAnCtB,CAAA"}
+{"version":3,"file":"dialog.types.d.ts","names":[],"sources":["../../src/dialog/dialog.types.ts"],"sourcesContent":[],"mappings":"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"}

package/dist/dialog/dialogBody.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialogBody.d.ts","names":[],"sources":["../../src/dialog/dialogBody.tsx"],"sourcesContent":[],"mappings":";;;;;;;;AAcA;;;cAAa,gCAAU"}
+{"version":3,"file":"dialogBody.d.ts","names":[],"sources":["../../src/dialog/dialogBody.tsx"],"sourcesContent":[],"mappings":";;;;;;;;AAcA,CAAA,CAAA,CAAA,QAAA,CAAA,IAAA,CAAA,UAAA,CAAA,OAAA,CAAA,IAAA,CAAA,MAAA,CAAA,GAAA,CAAA,IAAA,CAAA,CAAA,EAAA,CAAA,KAAA,CAAA,IAAA,CAAA,IAAA,CAAA,KAAA;;;AAAuB,OAAA,CAAA,KAAA,CAAV,UAAU,CAAA,CAAA,YAAA,CAAA,CAAA,GAAA,CAAA,CAAA,CAAA,eAAA,CAAA"}

package/dist/dialog/dialogBody.js

@@ -1,2 +1,56 @@
-import{mergeRefs as e}from"../utils/react.js";import{cs as t}from"../utils/styles.js";import{useStyleConfig as n}from"../core/theme.js";import{vui as r}from"../core/vui.js";import{Box as i}from"../box/box.js";import{useDialogContext as a}from"./context.js";import{useEffect as o,useRef as s,useState as c}from"react";import{jsx as l}from"react/jsx-runtime";const u=r((r,u)=>{let{className:d,...f}=r,{bodyId:p,icon:m,status:h}=a()??{},g=n(`Dialog`,a()),[_,v]=c(!1),y=s(null),b=s(new ResizeObserver(()=>{if(y.current){let{clientHeight:e,scrollHeight:t}=y.current;v(t>e)}}));o(()=>{y.current&&b.current?.observe(y.current)},[]);let x=_?{borderColor:`grey.30`}:{},S=(m??h)===void 0?{px:3}:{px:8};return l(i,{borderBottom:`1px solid transparent`,borderTop:`1px solid transparent`,className:t(`vui-dialogBody`,d),column:!0,id:p,overflowY:`auto`,pb:2,pt:1.5,ref:e(u,y),...x,...S,...g.body,...f})});u.displayName=`DialogBody`;var d=u;export{u as DialogBody,d as default};globalThis.__vuiVersion__=`3.0.0-beta.7`;
+import { mergeRefs } from "../utils/react.js";
+import { cs } from "../utils/styles.js";
+import { useStyleConfig } from "../core/theme.js";
+import { vui } from "../core/vui.js";
+import { Box } from "../box/box.js";
+import { useDialogContext } from "./context.js";
+import { useEffect, useRef, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/dialog/dialogBody.tsx
+/**
+* Shows the main content between the Dialog Header and Footer.
+* It becomes scrollable when content does not fit vertically. Borders are shown automatically.
+* Receives more horizontal padding when Dialog has icon, so align text with title.
+* Receives id linked to aria-describedby on the Dialog for accessibility.
+*/
+const DialogBody = vui((props, ref) => {
+	const { className,...rest } = props;
+	const { bodyId, icon, status } = useDialogContext() ?? {};
+	const styles = useStyleConfig("Dialog", useDialogContext());
+	const [isScrolled, setIsScrolled] = useState(false);
+	const bodyRef = useRef(null);
+	const observerRef = useRef(new ResizeObserver(() => {
+		if (bodyRef.current) {
+			const { clientHeight, scrollHeight } = bodyRef.current;
+			setIsScrolled(scrollHeight > clientHeight);
+		}
+	}));
+	useEffect(() => {
+		bodyRef.current && observerRef.current?.observe(bodyRef.current);
+	}, []);
+	const borderProps = isScrolled ? { borderColor: "grey.30" } : {};
+	const paddingProps = (icon ?? status) !== void 0 ? { px: 8 } : { px: 3 };
+	return /* @__PURE__ */ jsx(Box, {
+		borderBottom: "1px solid transparent",
+		borderTop: "1px solid transparent",
+		className: cs("vui-dialogBody", className),
+		column: true,
+		id: bodyId,
+		overflowY: "auto",
+		pb: 2,
+		pt: 1.5,
+		ref: mergeRefs(ref, bodyRef),
+		...borderProps,
+		...paddingProps,
+		...styles.body,
+		...rest
+	});
+});
+DialogBody.displayName = "DialogBody";
+var dialogBody_default = DialogBody;
+
+//#endregion
+export { DialogBody, dialogBody_default as default };
+globalThis.__vuiVersion__ = "3.0.0-beta.9"
 //# sourceMappingURL=dialogBody.js.map

package/dist/dialog/dialogBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialogBody.js","names":[],"sources":["../../src/dialog/dialogBody.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react'\n\nimport { Box } from '../box'\nimport { useStyleConfig, vui } from '../core'\nimport { cs, mergeRefs } from '../utils'\nimport { useDialogContext } from './context'\nimport type { DialogBodyProps } from './dialog.types'\n\n/**\n * Shows the main content between the Dialog Header and Footer.\n * It becomes scrollable when content does not fit vertically. Borders are shown automatically.\n * Receives more horizontal padding when Dialog has icon, so align text with title.\n * Receives id linked to aria-describedby on the Dialog for accessibility.\n */\nexport const DialogBody = vui<'div', DialogBodyProps>((props, ref) => {\n  const { className, ...rest } = props\n  const { bodyId, icon, status } = useDialogContext() ?? {}\n  const styles = useStyleConfig('Dialog', useDialogContext())\n\n  const [isScrolled, setIsScrolled] = useState(false)\n  const bodyRef = useRef<HTMLDivElement>(null)\n\n  // Observe size changes of the body to detect if it becomes vertically scrollable\n  const observerRef = useRef(\n    new ResizeObserver(() => {\n      if (bodyRef.current) {\n        const { clientHeight, scrollHeight } = bodyRef.current\n        setIsScrolled(scrollHeight > clientHeight)\n      }\n    }),\n  )\n\n  useEffect(() => {\n    bodyRef.current && observerRef.current?.observe(bodyRef.current)\n  }, [])\n\n  // If body can be scrolled vertically, add dividing lines on top and bottom\n  const borderProps = isScrolled ? { borderColor: 'grey.30' } : {}\n\n  // Add more body padding when custom or status icon is displayed\n  const paddingProps = (icon ?? status) !== undefined ? { px: 8 } : { px: 3 }\n\n  return (\n    <Box\n      borderBottom=\"1px solid transparent\"\n      borderTop=\"1px solid transparent\"\n      className={cs('vui-dialogBody', className)}\n      column\n      id={bodyId}\n      overflowY=\"auto\"\n      pb={2}\n      pt={1.5}\n      ref={mergeRefs(ref, bodyRef)}\n      {...borderProps}\n      {...paddingProps}\n      {...styles.body}\n      {...rest}\n    />\n  )\n})\n\nDialogBody.displayName = 'DialogBody'\n\nexport default DialogBody\n"],"mappings":"qWAcA,MAAa,EAAa,GAA6B,EAAO,IAAQ,CACpE,GAAM,CAAE,YAAW,GAAG,GAAS,EACzB,CAAE,SAAQ,OAAM,UAAW,GAAkB,EAAI,EAAE,CACnD,EAAS,EAAe,SAAU,GAAkB,CAAC,CAErD,CAAC,EAAY,GAAiB,EAAS,GAAM,CAC7C,EAAU,EAAuB,KAAK,CAGtC,EAAc,EAClB,IAAI,mBAAqB,CACvB,GAAI,EAAQ,QAAS,CACnB,GAAM,CAAE,eAAc,gBAAiB,EAAQ,QAC/C,EAAc,EAAe,EAAa,GAE5C,CACH,CAED,MAAgB,CACd,EAAQ,SAAW,EAAY,SAAS,QAAQ,EAAQ,QAAQ,EAC/D,EAAE,CAAC,CAGN,IAAM,EAAc,EAAa,CAAE,YAAa,UAAW,CAAG,EAAE,CAG1D,GAAgB,GAAQ,KAAY,IAAA,GAAwB,CAAE,GAAI,EAAG,CAArB,CAAE,GAAI,EAAG,CAE/D,OACE,EAAC,EAAA,CACC,aAAa,wBACb,UAAU,wBACV,UAAW,EAAG,iBAAkB,EAAU,CAC1C,OAAA,GACA,GAAI,EACJ,UAAU,OACV,GAAI,EACJ,GAAI,IACJ,IAAK,EAAU,EAAK,EAAQ,CAC5B,GAAI,EACJ,GAAI,EACJ,GAAI,EAAO,KACX,GAAI,GACJ,EAEJ,CAEF,EAAW,YAAc,aAEzB,IAAA,EAAe"}
+{"version":3,"file":"dialogBody.js","names":[],"sources":["../../src/dialog/dialogBody.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react'\n\nimport { Box } from '../box'\nimport { useStyleConfig, vui } from '../core'\nimport { cs, mergeRefs } from '../utils'\nimport { useDialogContext } from './context'\nimport type { DialogBodyProps } from './dialog.types'\n\n/**\n * Shows the main content between the Dialog Header and Footer.\n * It becomes scrollable when content does not fit vertically. Borders are shown automatically.\n * Receives more horizontal padding when Dialog has icon, so align text with title.\n * Receives id linked to aria-describedby on the Dialog for accessibility.\n */\nexport const DialogBody = vui<'div', DialogBodyProps>((props, ref) => {\n  const { className, ...rest } = props\n  const { bodyId, icon, status } = useDialogContext() ?? {}\n  const styles = useStyleConfig('Dialog', useDialogContext())\n\n  const [isScrolled, setIsScrolled] = useState(false)\n  const bodyRef = useRef<HTMLDivElement>(null)\n\n  // Observe size changes of the body to detect if it becomes vertically scrollable\n  const observerRef = useRef(\n    new ResizeObserver(() => {\n      if (bodyRef.current) {\n        const { clientHeight, scrollHeight } = bodyRef.current\n        setIsScrolled(scrollHeight > clientHeight)\n      }\n    }),\n  )\n\n  useEffect(() => {\n    bodyRef.current && observerRef.current?.observe(bodyRef.current)\n  }, [])\n\n  // If body can be scrolled vertically, add dividing lines on top and bottom\n  const borderProps = isScrolled ? { borderColor: 'grey.30' } : {}\n\n  // Add more body padding when custom or status icon is displayed\n  const paddingProps = (icon ?? status) !== undefined ? { px: 8 } : { px: 3 }\n\n  return (\n    <Box\n      borderBottom=\"1px solid transparent\"\n      borderTop=\"1px solid transparent\"\n      className={cs('vui-dialogBody', className)}\n      column\n      id={bodyId}\n      overflowY=\"auto\"\n      pb={2}\n      pt={1.5}\n      ref={mergeRefs(ref, bodyRef)}\n      {...borderProps}\n      {...paddingProps}\n      {...styles.body}\n      {...rest}\n    />\n  )\n})\n\nDialogBody.displayName = 'DialogBody'\n\nexport default DialogBody\n"],"mappings":";;;;;;;;;;;;;;;;AAcA,MAAa,aAAa,KAA6B,OAAO,QAAQ;CACpE,MAAM,EAAE,UAAW,GAAG,SAAS;CAC/B,MAAM,EAAE,QAAQ,MAAM,WAAW,kBAAkB,IAAI,EAAE;CACzD,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC;CAE3D,MAAM,CAAC,YAAY,iBAAiB,SAAS,MAAM;CACnD,MAAM,UAAU,OAAuB,KAAK;CAG5C,MAAM,cAAc,OAClB,IAAI,qBAAqB;AACvB,MAAI,QAAQ,SAAS;GACnB,MAAM,EAAE,cAAc,iBAAiB,QAAQ;AAC/C,iBAAc,eAAe,aAAa;;GAE5C,CACH;AAED,iBAAgB;AACd,UAAQ,WAAW,YAAY,SAAS,QAAQ,QAAQ,QAAQ;IAC/D,EAAE,CAAC;CAGN,MAAM,cAAc,aAAa,EAAE,aAAa,WAAW,GAAG,EAAE;CAGhE,MAAM,gBAAgB,QAAQ,YAAY,SAAY,EAAE,IAAI,GAAG,GAAG,EAAE,IAAI,GAAG;AAE3E,QACE,oBAAC;EACC,cAAa;EACb,WAAU;EACV,WAAW,GAAG,kBAAkB,UAAU;EAC1C;EACA,IAAI;EACJ,WAAU;EACV,IAAI;EACJ,IAAI;EACJ,KAAK,UAAU,KAAK,QAAQ;EAC5B,GAAI;EACJ,GAAI;EACJ,GAAI,OAAO;EACX,GAAI;GACJ;EAEJ;AAEF,WAAW,cAAc;AAEzB,yBAAe"}

package/dist/dialog/dialogCancelButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialogCancelButton.d.ts","names":[],"sources":["../../src/dialog/dialogCancelButton.tsx"],"sourcesContent":[],"mappings":";;;;;cAOa,2CAAkB"}
+{"version":3,"file":"dialogCancelButton.d.ts","names":[],"sources":["../../src/dialog/dialogCancelButton.tsx"],"sourcesContent":[],"mappings":";;;;;cAOa,oBAAkB,uBAAA"}

package/dist/dialog/dialogCancelButton.js

@@ -1,2 +1,28 @@
-import{cs as e}from"../utils/styles.js";import{useStyleConfig as t}from"../core/theme.js";import{vui as n}from"../core/vui.js";import{LineButton as r}from"../button/buttons.js";import{useDialogContext as i}from"./context.js";import{jsx as a}from"react/jsx-runtime";const o=n((n,o)=>{let{className:s,...c}=n,{onClose:l}=i()??{},u=t(`Dialog`,i());return a(r,{className:e(`vui-dialogCancelButton`,s),onClick:l,ref:o,...u.cancelButton,...c})});o.displayName=`DialogCancelButton`;var s=o;export{o as DialogCancelButton,s as default};globalThis.__vuiVersion__=`3.0.0-beta.7`;
+import { cs } from "../utils/styles.js";
+import { useStyleConfig } from "../core/theme.js";
+import { vui } from "../core/vui.js";
+import { LineButton } from "../button/buttons.js";
+import { useDialogContext } from "./context.js";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/dialog/dialogCancelButton.tsx
+/** Shows an outlined Button in the Dialog Footer, which by default closes the Dialog. */
+const DialogCancelButton = vui((props, ref) => {
+	const { className,...rest } = props;
+	const { onClose } = useDialogContext() ?? {};
+	const styles = useStyleConfig("Dialog", useDialogContext());
+	return /* @__PURE__ */ jsx(LineButton, {
+		className: cs("vui-dialogCancelButton", className),
+		onClick: onClose,
+		ref,
+		...styles.cancelButton,
+		...rest
+	});
+});
+DialogCancelButton.displayName = "DialogCancelButton";
+var dialogCancelButton_default = DialogCancelButton;
+
+//#endregion
+export { DialogCancelButton, dialogCancelButton_default as default };
+globalThis.__vuiVersion__ = "3.0.0-beta.9"
 //# sourceMappingURL=dialogCancelButton.js.map