@cube-dev/ui-kit 0.193.2 → 0.194.0

package/dist/components/content/Placeholder/Placeholder.js

@@ -1,9 +1,9 @@
-/** @license MIT | @cube-dev/ui-kit v0.193.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.194.0 | Cube Dev Team */
 import { extractStyles, mergeStyleLayers } from "../../../utils/styles.js";
 import { useI18n } from "../../../i18n/useI18n.js";
 import { c } from "react/compiler-runtime";
 import { CONTAINER_STYLES, filterBaseProps, keyframes, tasty } from "@tenphi/tasty";
-import { forwardRef } from "react";
+import { createContext, forwardRef, useContext } from "react";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/components/content/Placeholder/Placeholder.tsx
@@ -11,33 +11,30 @@ const placeholderAnimation = keyframes({
 	"0%": { "background-position": "0 0" },
 	"100%": { "background-position": "$placeholder-animation-size 0" }
 });
-const StyledPlaceholder = tasty({
-	role: "alert",
-	"aria-live": "polite",
-	styles: {
-		display: "block",
-		height: "2x",
-		opacity: ".35",
-		aspectRatio: {
-			"": "initial",
-			circle: "1 / 1"
-		},
-		radius: {
-			"": "1r",
-			circle: "round"
-		},
-		"$placeholder-animation-time": "1.4s",
-		"$placeholder-animation-size": "calc((180rem + 100vw) / 3)",
-		backgroundRepeat: "repeat",
-		backgroundSize: "$placeholder-animation-size",
-		fill: "#dark.15",
-		animation: {
-			"": "none",
-			animated: `${placeholderAnimation} $placeholder-animation-time linear infinite`
-		},
-		image: {
-			"": "none",
-			animated: `linear-gradient(
+const StyledPlaceholder = tasty({ styles: {
+	display: "block",
+	height: "2x",
+	opacity: ".35",
+	aspectRatio: {
+		"": "initial",
+		circle: "1 / 1"
+	},
+	radius: {
+		"": "1r",
+		circle: "round"
+	},
+	"$placeholder-animation-time": "1.4s",
+	"$placeholder-animation-size": "calc((180rem + 100vw) / 3)",
+	backgroundRepeat: "repeat",
+	backgroundSize: "$placeholder-animation-size",
+	fill: "#dark.15",
+	animation: {
+		"": "none",
+		animated: `${placeholderAnimation} $placeholder-animation-time linear infinite`
+	},
+	image: {
+		"": "none",
+		animated: `linear-gradient(
         135deg,
         #dark.15 0%,
         #dark.15 5%,
@@ -47,59 +44,69 @@ const StyledPlaceholder = tasty({
         #dark.15 95%,
         #dark.15 100%
       )`
-		}
 	}
-});
+} });
+/**
+* Set by a component that says once that a whole group of placeholders is
+* loading — `Skeleton` is one region around all of its bars, and a table's
+* loading row is `aria-busy`. The placeholders inside are then decoration, and
+* stay out of the accessibility tree rather than each being a landmark of its
+* own.
+*/
+const PlaceholderGroupContext = createContext(false);
 const Placeholder = forwardRef(function Placeholder(allProps, ref) {
-	const $ = c(12);
+	const $ = c(13);
 	const { size: t0, isStatic, circle, ...props } = allProps;
 	const size = t0 === void 0 ? "2x" : t0;
 	const { t } = useI18n();
+	const isInGroup = useContext(PlaceholderGroupContext);
 	const styles = extractStyles(props, CONTAINER_STYLES);
 	const T0 = StyledPlaceholder;
-	const t1 = "region";
-	let t2;
-	if ($[0] !== t) {
-		t2 = t("placeholder.contentIsLoading", "Content is loading");
-		$[0] = t;
-		$[1] = t2;
-	} else t2 = $[1];
-	const t3 = filterBaseProps(props, { eventProps: true });
-	const t4 = "";
-	const t5 = !isStatic;
-	let t6;
-	if ($[2] !== circle || $[3] !== t5) {
-		t6 = {
-			animated: t5,
+	let t1;
+	if ($[0] !== isInGroup || $[1] !== t) {
+		t1 = isInGroup ? { "aria-hidden": true } : {
+			role: "region",
+			"aria-label": t("placeholder.contentIsLoading", "Content is loading")
+		};
+		$[0] = isInGroup;
+		$[1] = t;
+		$[2] = t1;
+	} else t1 = $[2];
+	const t2 = filterBaseProps(props, { eventProps: true });
+	const t3 = "";
+	const t4 = !isStatic;
+	let t5;
+	if ($[3] !== circle || $[4] !== t4) {
+		t5 = {
+			animated: t4,
 			circle
 		};
-		$[2] = circle;
-		$[3] = t5;
-		$[4] = t6;
-	} else t6 = $[4];
-	const t7 = mergeStyleLayers({ height: size }, styles);
-	let t8;
-	if ($[5] !== T0 || $[6] !== ref || $[7] !== t2 || $[8] !== t3 || $[9] !== t6 || $[10] !== t7) {
-		t8 = /* @__PURE__ */ jsx(T0, {
-			role: t1,
-			"aria-label": t2,
-			...t3,
-			"data-loading-placeholder": t4,
+		$[3] = circle;
+		$[4] = t4;
+		$[5] = t5;
+	} else t5 = $[5];
+	const t6 = mergeStyleLayers({ height: size }, styles);
+	let t7;
+	if ($[6] !== T0 || $[7] !== ref || $[8] !== t1 || $[9] !== t2 || $[10] !== t5 || $[11] !== t6) {
+		t7 = /* @__PURE__ */ jsx(T0, {
+			...t1,
+			...t2,
+			"data-loading-placeholder": t3,
 			ref,
-			mods: t6,
-			styles: t7
+			mods: t5,
+			styles: t6
 		});
-		$[5] = T0;
-		$[6] = ref;
-		$[7] = t2;
-		$[8] = t3;
-		$[9] = t6;
-		$[10] = t7;
-		$[11] = t8;
-	} else t8 = $[11];
-	return t8;
+		$[6] = T0;
+		$[7] = ref;
+		$[8] = t1;
+		$[9] = t2;
+		$[10] = t5;
+		$[11] = t6;
+		$[12] = t7;
+	} else t7 = $[12];
+	return t7;
 });
 
 //#endregion
-export { Placeholder };
+export { Placeholder, PlaceholderGroupContext };
 //# sourceMappingURL=Placeholder.js.map

package/dist/components/content/Placeholder/Placeholder.js.map

@@ -1 +1 @@
-{"version":3,"file":"Placeholder.js","names":["BaseProps","CONTAINER_STYLES","ContainerStyleProps","filterBaseProps","keyframes","Styles","tasty","forwardRef","useI18n","extractStyles","mergeStyleLayers","placeholderAnimation","StyledPlaceholder","role","styles","display","height","opacity","aspectRatio","circle","radius","backgroundRepeat","backgroundSize","fill","animation","animated","image","CubePlaceholderProps","size","isStatic","Placeholder","allProps","ref","$","_c","t0","props","undefined","t","T0","t1","t2","t3","eventProps","t4","t5","t6","t7","t8"],"sources":["../../../../src/components/content/Placeholder/Placeholder.tsx"],"sourcesContent":["import {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  filterBaseProps,\n  keyframes,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { forwardRef } from 'react';\n\nimport { useI18n } from '../../../i18n';\nimport { extractStyles, mergeStyleLayers } from '../../../utils/styles';\n\n// Create the placeholder animation using keyframes helper\nconst placeholderAnimation = keyframes({\n  '0%': {\n    'background-position': '0 0',\n  },\n  '100%': {\n    'background-position': '$placeholder-animation-size 0',\n  },\n});\n\nconst StyledPlaceholder = tasty({\n  role: 'alert',\n  'aria-live': 'polite',\n  styles: {\n    display: 'block',\n    height: '2x',\n    opacity: '.35',\n    aspectRatio: {\n      '': 'initial',\n      circle: '1 / 1',\n    },\n    radius: {\n      '': '1r',\n      circle: 'round',\n    },\n\n    // CSS custom properties for animation\n    '$placeholder-animation-time': '1.4s',\n    '$placeholder-animation-size': 'calc((180rem + 100vw) / 3)',\n\n    // Base background styling\n    backgroundRepeat: 'repeat',\n    backgroundSize: '$placeholder-animation-size',\n    fill: '#dark.15',\n\n    // Animated state styling\n    animation: {\n      '': 'none',\n      animated: `${placeholderAnimation} $placeholder-animation-time linear infinite`,\n    },\n    image: {\n      '': 'none',\n      animated: `linear-gradient(\n        135deg,\n        #dark.15 0%,\n        #dark.15 5%,\n        #dark.0 35%,\n        #dark-03.2 50%,\n        #dark-03.0 65%,\n        #dark.15 95%,\n        #dark.15 100%\n      )`,\n    },\n  },\n});\n\nexport interface CubePlaceholderProps extends BaseProps, ContainerStyleProps {\n  size?: Styles['fontSize'];\n  circle?: boolean;\n  isStatic?: boolean;\n}\n\nexport const Placeholder = forwardRef(function Placeholder(\n  allProps: CubePlaceholderProps,\n  ref,\n) {\n  let { size = '2x', isStatic, circle, ...props } = allProps;\n\n  const { t } = useI18n();\n\n  let styles = extractStyles(props, CONTAINER_STYLES);\n\n  return (\n    <StyledPlaceholder\n      role=\"region\"\n      aria-label={t('placeholder.contentIsLoading', 'Content is loading')}\n      {...filterBaseProps(props, { eventProps: true })}\n      // The documented way to detect a loading placeholder. Fixed, so a\n      // caller's `qa` or a translated `aria-label` doesn't change it.\n      data-loading-placeholder=\"\"\n      ref={ref}\n      mods={{ animated: !isStatic, circle }}\n      styles={mergeStyleLayers({ height: size }, styles)}\n    />\n  );\n});\n"],"mappings":";;;;;;;;;AAeA,MAAMW,uBAAuBP,UAAU;CACrC,MAAM,EACJ,uBAAuB,OACxB;CACD,QAAQ,EACN,uBAAuB,iCACzB;CACD,CAAC;AAEF,MAAMQ,oBAAoBN,MAAM;CAC9BO,MAAM;CACN,aAAa;CACbC,QAAQ;EACNC,SAAS;EACTC,QAAQ;EACRC,SAAS;EACTC,aAAa;GACX,IAAI;GACJC,QAAQ;GACT;EACDC,QAAQ;GACN,IAAI;GACJD,QAAQ;GACT;EAGD,+BAA+B;EAC/B,+BAA+B;EAG/BE,kBAAkB;EAClBC,gBAAgB;EAChBC,MAAM;EAGNC,WAAW;GACT,IAAI;GACJC,UAAU,GAAGd,qBAAoB;GAClC;EACDe,OAAO;GACL,IAAI;GACJD,UAAU;;;;;;;;;;GAUZ;EACF;CACD,CAAC;AAQF,MAAaK,cAAcvB,WAAW,SAAAuB,YAAAC,UAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,GAAA;CAIpC,MAAA,EAAAN,MAAAO,IAAAN,UAAAV,QAAA,GAAAiB,UAAkDL;CAA5C,MAAAH,OAAAO,OAAAE,SAAA,OAAAF;CAEN,MAAA,EAAAG,MAAc9B,SAAS;CAEvB,MAAAM,SAAaL,cAAc2B,OAAOnC,iBAAiB;CAGhD,MAAAsC,KAAA3B;CACM,MAAA4B,KAAA;CAAQ,IAAAC;AAAA,KAAAR,EAAA,OAAAK,GAAA;AACDG,OAAAH,EAAE,gCAAgC,qBAAqB;AAAAL,IAAA,KAAAK;AAAAL,IAAA,KAAAQ;OAAAA,MAAAR,EAAA;CAC/D,MAAAS,KAAAvC,gBAAgBiC,OAAO,EAAAO,YAAc,MAAM,CAAC;CAGvB,MAAAC,KAAA;CAEP,MAAAC,KAAA,CAAChB;CAAQ,IAAAiB;AAAA,KAAAb,EAAA,OAAAd,UAAAc,EAAA,OAAAY,IAAA;AAArBC,OAAA;GAAArB,UAAYoB;GAAS1B;GAAU;AAAAc,IAAA,KAAAd;AAAAc,IAAA,KAAAY;AAAAZ,IAAA,KAAAa;OAAAA,MAAAb,EAAA;CAC7B,MAAAc,KAAArC,iBAAiB,EAAAM,QAAUY,MAAM,EAAEd,OAAO;CAAA,IAAAkC;AAAA,KAAAf,EAAA,OAAAM,MAAAN,EAAA,OAAAD,OAAAC,EAAA,OAAAQ,MAAAR,EAAA,OAAAS,MAAAT,EAAA,OAAAa,MAAAb,EAAA,QAAAc,IAAA;AATpDC,OAAA,oBAAC;GACM,MAAAR;GACO,cAAAC;GAAuD,GAC/DC;GAGqB,4BAAAE;GACpBZ;GACC,MAAAc;GACE,QAAAC;IACR;AAAAd,IAAA,KAAAM;AAAAN,IAAA,KAAAD;AAAAC,IAAA,KAAAQ;AAAAR,IAAA,KAAAS;AAAAT,IAAA,KAAAa;AAAAb,IAAA,MAAAc;AAAAd,IAAA,MAAAe;OAAAA,MAAAf,EAAA;AAAA,QAVFe;EAYF"}
+{"version":3,"file":"Placeholder.js","names":["BaseProps","CONTAINER_STYLES","ContainerStyleProps","filterBaseProps","keyframes","Styles","tasty","createContext","forwardRef","useContext","useI18n","extractStyles","mergeStyleLayers","placeholderAnimation","StyledPlaceholder","styles","display","height","opacity","aspectRatio","circle","radius","backgroundRepeat","backgroundSize","fill","animation","animated","image","PlaceholderGroupContext","CubePlaceholderProps","size","isStatic","Placeholder","allProps","ref","$","_c","t0","props","undefined","t","isInGroup","T0","t1","role","t2","eventProps","t3","t4","t5","t6","t7"],"sources":["../../../../src/components/content/Placeholder/Placeholder.tsx"],"sourcesContent":["import {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  filterBaseProps,\n  keyframes,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { createContext, forwardRef, useContext } from 'react';\n\nimport { useI18n } from '../../../i18n';\nimport { extractStyles, mergeStyleLayers } from '../../../utils/styles';\n\n// Create the placeholder animation using keyframes helper\nconst placeholderAnimation = keyframes({\n  '0%': {\n    'background-position': '0 0',\n  },\n  '100%': {\n    'background-position': '$placeholder-animation-size 0',\n  },\n});\n\nconst StyledPlaceholder = tasty({\n  styles: {\n    display: 'block',\n    height: '2x',\n    opacity: '.35',\n    aspectRatio: {\n      '': 'initial',\n      circle: '1 / 1',\n    },\n    radius: {\n      '': '1r',\n      circle: 'round',\n    },\n\n    // CSS custom properties for animation\n    '$placeholder-animation-time': '1.4s',\n    '$placeholder-animation-size': 'calc((180rem + 100vw) / 3)',\n\n    // Base background styling\n    backgroundRepeat: 'repeat',\n    backgroundSize: '$placeholder-animation-size',\n    fill: '#dark.15',\n\n    // Animated state styling\n    animation: {\n      '': 'none',\n      animated: `${placeholderAnimation} $placeholder-animation-time linear infinite`,\n    },\n    image: {\n      '': 'none',\n      animated: `linear-gradient(\n        135deg,\n        #dark.15 0%,\n        #dark.15 5%,\n        #dark.0 35%,\n        #dark-03.2 50%,\n        #dark-03.0 65%,\n        #dark.15 95%,\n        #dark.15 100%\n      )`,\n    },\n  },\n});\n\n/**\n * Set by a component that says once that a whole group of placeholders is\n * loading — `Skeleton` is one region around all of its bars, and a table's\n * loading row is `aria-busy`. The placeholders inside are then decoration, and\n * stay out of the accessibility tree rather than each being a landmark of its\n * own.\n */\nexport const PlaceholderGroupContext = createContext(false);\n\nexport interface CubePlaceholderProps extends BaseProps, ContainerStyleProps {\n  size?: Styles['fontSize'];\n  circle?: boolean;\n  isStatic?: boolean;\n}\n\nexport const Placeholder = forwardRef(function Placeholder(\n  allProps: CubePlaceholderProps,\n  ref,\n) {\n  let { size = '2x', isStatic, circle, ...props } = allProps;\n\n  const { t } = useI18n();\n  const isInGroup = useContext(PlaceholderGroupContext);\n\n  let styles = extractStyles(props, CONTAINER_STYLES);\n\n  return (\n    <StyledPlaceholder\n      {...(isInGroup\n        ? { 'aria-hidden': true }\n        : {\n            role: 'region',\n            'aria-label': t(\n              'placeholder.contentIsLoading',\n              'Content is loading',\n            ),\n          })}\n      {...filterBaseProps(props, { eventProps: true })}\n      // The documented way to detect a loading placeholder. Fixed, so a\n      // caller's `qa` or a translated `aria-label` doesn't change it.\n      data-loading-placeholder=\"\"\n      ref={ref}\n      mods={{ animated: !isStatic, circle }}\n      styles={mergeStyleLayers({ height: size }, styles)}\n    />\n  );\n});\n"],"mappings":";;;;;;;;;AAeA,MAAMa,uBAAuBT,UAAU;CACrC,MAAM,EACJ,uBAAuB,OACxB;CACD,QAAQ,EACN,uBAAuB,iCACzB;CACD,CAAC;AAEF,MAAMU,oBAAoBR,MAAM,EAC9BS,QAAQ;CACNC,SAAS;CACTC,QAAQ;CACRC,SAAS;CACTC,aAAa;EACX,IAAI;EACJC,QAAQ;EACT;CACDC,QAAQ;EACN,IAAI;EACJD,QAAQ;EACT;CAGD,+BAA+B;CAC/B,+BAA+B;CAG/BE,kBAAkB;CAClBC,gBAAgB;CAChBC,MAAM;CAGNC,WAAW;EACT,IAAI;EACJC,UAAU,GAAGb,qBAAoB;EAClC;CACDc,OAAO;EACL,IAAI;EACJD,UAAU;;;;;;;;;;EAUZ;CACF,EACD,CAAC;;;;;;;;AASF,MAAaE,0BAA0BrB,cAAc,MAAM;AAQ3D,MAAayB,cAAcxB,WAAW,SAAAwB,YAAAC,UAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,GAAA;CAIpC,MAAA,EAAAN,MAAAO,IAAAN,UAAAX,QAAA,GAAAkB,UAAkDL;CAA5C,MAAAH,OAAAO,OAAAE,SAAA,OAAAF;CAEN,MAAA,EAAAG,MAAc9B,SAAS;CACvB,MAAA+B,YAAkBhC,WAAWmB,wBAAwB;CAErD,MAAAb,SAAaJ,cAAc2B,OAAOrC,iBAAiB;CAGhD,MAAAyC,KAAA5B;CAAiB,IAAA6B;AAAA,KAAAR,EAAA,OAAAM,aAAAN,EAAA,OAAAK,GAAA;AACXG,OAAAF,YAAA,EAAA,eACgB,MAOhB,GARA;GAAAG,MAGO;GAAQ,cACAJ,EACZ,gCACA,qBACF;GACD;AAAAL,IAAA,KAAAM;AAAAN,IAAA,KAAAK;AAAAL,IAAA,KAAAQ;OAAAA,MAAAR,EAAA;CACD,MAAAU,KAAA1C,gBAAgBmC,OAAO,EAAAQ,YAAc,MAAM,CAAC;CAGvB,MAAAC,KAAA;CAEP,MAAAC,KAAA,CAACjB;CAAQ,IAAAkB;AAAA,KAAAd,EAAA,OAAAf,UAAAe,EAAA,OAAAa,IAAA;AAArBC,OAAA;GAAAvB,UAAYsB;GAAS5B;GAAU;AAAAe,IAAA,KAAAf;AAAAe,IAAA,KAAAa;AAAAb,IAAA,KAAAc;OAAAA,MAAAd,EAAA;CAC7B,MAAAe,KAAAtC,iBAAiB,EAAAK,QAAUa,MAAM,EAAEf,OAAO;CAAA,IAAAoC;AAAA,KAAAhB,EAAA,OAAAO,MAAAP,EAAA,OAAAD,OAAAC,EAAA,OAAAQ,MAAAR,EAAA,OAAAU,MAAAV,EAAA,QAAAc,MAAAd,EAAA,QAAAe,IAAA;AAhBpDC,OAAA,oBAAC;GAAiB,GACXR;GAQA,GACDE;GAGqB,4BAAAE;GACpBb;GACC,MAAAe;GACE,QAAAC;IACR;AAAAf,IAAA,KAAAO;AAAAP,IAAA,KAAAD;AAAAC,IAAA,KAAAQ;AAAAR,IAAA,KAAAU;AAAAV,IAAA,MAAAc;AAAAd,IAAA,MAAAe;AAAAf,IAAA,MAAAgB;OAAAA,MAAAhB,EAAA;AAAA,QAjBFgB;EAmBF"}

package/dist/components/content/PrismCode/PrismCode.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.193.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.194.0 | Cube Dev Team */
 import { RendererPrism, ensureYamlSqlExtensions } from "./prismSetup.js";
 import { CONTAINER_STYLES, tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";

package/dist/components/content/PrismCode/prismSetup.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.193.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.194.0 | Cube Dev Team */
 import { Prism as RendererPrism } from "prism-react-renderer";
 
 //#region src/components/content/PrismCode/prismSetup.tsx

package/dist/components/content/PrismDiffCode/PrismDiffCode.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.193.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.194.0 | Cube Dev Team */
 import { _PrismCode } from "../PrismCode/PrismCode.js";
 import { c } from "react/compiler-runtime";
 import { jsx } from "react/jsx-runtime";

package/dist/components/content/Result/Result.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.193.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.194.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { wrapNodeIfPlain } from "../../../utils/react/wrapNodeIfPlain.js";
@@ -159,10 +159,10 @@ const ResultAction = forwardRef(function ResultAction(t0, ref) {
 	return t2;
 });
 const statusIconMap = {
-	success: () => /* @__PURE__ */ jsx(IconCircleCheckFilled, {}),
-	error: () => /* @__PURE__ */ jsx(IconCircleXFilled, {}),
-	info: () => /* @__PURE__ */ jsx(IconInfoCircleFilled, {}),
-	warning: () => /* @__PURE__ */ jsx(IconAlertTriangleFilled, {}),
+	success: () => /* @__PURE__ */ jsx(IconCircleCheckFilled, { "aria-hidden": "true" }),
+	error: () => /* @__PURE__ */ jsx(IconCircleXFilled, { "aria-hidden": "true" }),
+	info: () => /* @__PURE__ */ jsx(IconInfoCircleFilled, { "aria-hidden": "true" }),
+	warning: () => /* @__PURE__ */ jsx(IconAlertTriangleFilled, { "aria-hidden": "true" }),
 	404: null,
 	403: null,
 	500: null

package/dist/components/content/Result/Result.js.map

@@ -1 +1 @@
-{"version":3,"file":"Result.js","names":["FocusableRef","IconAlertTriangleFilled","IconCircleCheckFilled","IconCircleXFilled","IconInfoCircleFilled","BaseProps","CONTAINER_STYLES","ContainerStyleProps","filterBaseProps","tasty","ComponentType","createContext","forwardRef","ReactNode","useContext","mergeProps","wrapNodeIfPlain","extractStyles","Button","CubeButtonProps","Title","CubeResultProps","children","icon","status","CubeResultStatus","subTitle","subtitle","title","actions","size","CubeResultSize","layout","CubeResultLayout","isCompact","StatusIconMap","Record","Container","qa","as","styles","display","compact","gridAreas","flow","placeContent","placeItems","gap","padding","textAlign","boxSizing","width","margin","Icon","$","gridArea","color","placeSelf","textWrap","Content","Actions","ResultSizeContext","undefined","CubeResultActionProps","ResultAction","t0","ref","_c","props","resultSize","t1","type","t2","statusIconMap","success","error","info","warning","Result","T0","t3","t4","t5","t6","t7","t8","t9","otherProps","console","warn","isLarge","knownStatus","hasOwnProperty","StatusIcon","t10","iconContent","t11","iconNode","eventProps","mods","_Result","Object","assign","Action","displayName"],"sources":["../../../../src/components/content/Result/Result.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport {\n  IconAlertTriangleFilled,\n  IconCircleCheckFilled,\n  IconCircleXFilled,\n  IconInfoCircleFilled,\n} from '@tabler/icons-react';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  filterBaseProps,\n  tasty,\n} from '@tenphi/tasty';\nimport {\n  ComponentType,\n  createContext,\n  forwardRef,\n  ReactNode,\n  useContext,\n} from 'react';\n\nimport { mergeProps, wrapNodeIfPlain } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { Button, CubeButtonProps } from '../../actions/Button/Button';\nimport { Title } from '../Title';\n\nexport interface CubeResultProps extends BaseProps, ContainerStyleProps {\n  /** Free content between the text and the actions, e.g. an alert or details */\n  children?: ReactNode;\n  /** Custom icon element */\n  icon?: ReactNode;\n  /**\n   * Result status from ready-made templates\n   * @default 'info'\n   */\n  status?: CubeResultStatus;\n  /**\n   * The subTitle\n   * @deprecated The subTitle prop is deprecated and will be removed in next major release. consider using subtitle instead\n   */\n  subTitle?: ReactNode;\n  /**\n   * Subtitle of the Result component\n   */\n  subtitle?: ReactNode;\n  /** The title */\n  title?: ReactNode;\n  /**\n   * Action buttons, as `Result.Action` elements so they follow the Result's size.\n   * A centered row by default, a full-width column in the `stacked` layout\n   */\n  actions?: ReactNode;\n  /**\n   * Visual scale: the icon size and the title and subtitle presets. Does not change the layout.\n   * Ignored when `isCompact` is set\n   * @default 'medium'\n   */\n  size?: CubeResultSize;\n  /**\n   * Arrangement of the block. `stacked` fills the container and stacks the actions to the full width,\n   * as in a confirmation or result dialog. Combine with `size=\"large\"` for the dialog card.\n   * Ignored when `isCompact` is set\n   * @default 'default'\n   */\n  layout?: CubeResultLayout;\n  /** Whether the result component has a compact presentation. Overrides `size` and `layout` */\n  isCompact?: boolean;\n}\n\nexport type CubeResultSize = 'medium' | 'large';\n\nexport type CubeResultLayout = 'default' | 'stacked';\n\nexport type CubeResultStatus =\n  | 'success'\n  | 'error'\n  | 'info'\n  | 'warning'\n  | 404\n  | 403\n  | 500;\n\n// `null` for a status without an icon, so no empty slot is rendered\ntype StatusIconMap = Record<CubeResultStatus, ComponentType | null>;\n\nconst Container = tasty({\n  qa: 'ResultContainer',\n  as: 'section',\n  styles: {\n    // Any ancestor: the Result sits in the dialog's `Content`, not in `Dialog`\n    '@in-dialog': '@parent(id=Dialog)',\n\n    display: {\n      '': 'flex',\n      compact: 'grid',\n    },\n    gridAreas: '\"icon title\" \"content content\" \"actions actions\"',\n    flow: 'column',\n    placeContent: {\n      '': 'center',\n      compact: 'start',\n    },\n    placeItems: {\n      '': 'center',\n      compact: 'start',\n    },\n    // Outside compact the blocks below the title space themselves, so the\n    // icon's own room is the whole distance to the title\n    gap: {\n      '': '0',\n      compact: '2x 1x',\n    },\n    padding: {\n      '': '6x 4x',\n      // The host pads: a dialog `Content` or the page section the card fills\n      compact: '0',\n      'layout=stacked': '1.5x',\n      // The dialog's `Content` already pads it\n      'layout=stacked & @in-dialog': '0',\n    },\n    textAlign: {\n      '': 'center',\n      compact: 'left',\n    },\n    boxSizing: 'border-box',\n    width: {\n      '': 'max 80ch',\n      // Fill the container so stacked actions share one width wherever the card sits\n      'layout=stacked': '0 100% 80ch',\n    },\n    margin: {\n      '': '0 auto',\n      compact: '0',\n    },\n    '--icon-size': {\n      '': '6x',\n      'size=large': '10x',\n    },\n\n    Icon: {\n      $: '>',\n      display: 'grid',\n      gridArea: 'icon',\n      // At least the 3x between the other blocks; an icon above 12x gets a\n      // quarter of its size, so a big one is not crowded\n      padding: {\n        '': 'max($icon-size / 4, 3x)',\n        compact: '0',\n      },\n      // A custom icon keeps its own color\n      color: {\n        '': 'inherit',\n        'status=info': '#purple',\n        'status=success': '#success',\n        'status=error': '#danger',\n        'status=warning': '#warning',\n      },\n    },\n\n    Title: {\n      $: '>',\n      gridArea: 'title',\n      display: 'flex',\n      flow: 'column',\n      placeItems: 'inherit',\n      gap: '1x',\n      placeSelf: 'center',\n      textWrap: 'balance',\n    },\n\n    Content: {\n      $: '>',\n      gridArea: 'content',\n      display: 'block',\n      margin: {\n        '': 'top 3x',\n        compact: '0',\n      },\n      placeSelf: {\n        '': 'auto',\n        'layout=stacked': 'stretch',\n      },\n    },\n\n    Actions: {\n      $: '>',\n      gridArea: 'actions',\n      display: 'flex',\n      margin: {\n        '': 'top 3x',\n        compact: '0',\n      },\n      flow: {\n        '': 'row wrap',\n        'layout=stacked': 'column',\n      },\n      gap: '1x',\n      placeContent: {\n        '': 'center',\n        compact: 'start',\n      },\n      placeItems: {\n        '': 'center',\n        'layout=stacked': 'stretch',\n      },\n      placeSelf: {\n        '': 'auto',\n        'layout=stacked': 'stretch',\n      },\n    },\n  },\n});\n\nconst ResultSizeContext = createContext<CubeResultSize | undefined>(undefined);\n\nexport type CubeResultActionProps = CubeButtonProps;\n\n/**\n * A `Button` for the Result `actions` slot. Its size follows the Result's `size` unless set.\n * A link keeps Button's own `inline` size\n */\nconst ResultAction = forwardRef(function ResultAction(\n  { size, ...props }: CubeResultActionProps,\n  ref: FocusableRef<HTMLElement>,\n) {\n  const resultSize = useContext(ResultSizeContext);\n\n  return (\n    <Button\n      ref={ref}\n      {...props}\n      size={size ?? (props.type === 'link' ? undefined : resultSize)}\n    />\n  );\n});\n\nconst statusIconMap: StatusIconMap = {\n  success: () => <IconCircleCheckFilled />,\n  error: () => <IconCircleXFilled />,\n  info: () => <IconInfoCircleFilled />,\n  warning: () => <IconAlertTriangleFilled />,\n  // TODO: Needs to be implemented in the future\n  404: null,\n  403: null,\n  500: null,\n};\n\nfunction Result(props: CubeResultProps, ref) {\n  let {\n    children,\n    isCompact,\n    icon,\n    status,\n    subTitle,\n    subtitle,\n    title,\n    actions,\n    size = 'medium',\n    layout = 'default',\n    ...otherProps\n  } = props;\n\n  subtitle = subtitle ?? subTitle;\n\n  if (icon && status) {\n    console.warn(\n      'Don\\'t use \"icon\" and \"status\" together, it can lead to possible errors.',\n    );\n  }\n\n  // The compact grid has its own scale and arrangement; `size` and `layout`\n  // describe the centered column only, so they are dropped rather than mixed in\n  if (isCompact) {\n    size = 'medium';\n    layout = 'default';\n  }\n\n  const isLarge = size === 'large';\n\n  // An unknown status falls back to `info` for the color too, not only the icon\n  const knownStatus: CubeResultStatus =\n    status && statusIconMap.hasOwnProperty(status) ? status : 'info';\n  const StatusIcon = statusIconMap[knownStatus];\n\n  // A custom icon shares the status icon's wrapper, so it gets the same room\n  const iconContent = icon || (StatusIcon && <StatusIcon />);\n  const iconNode = iconContent && <div data-element=\"Icon\">{iconContent}</div>;\n\n  const styles = extractStyles(otherProps, CONTAINER_STYLES);\n\n  return (\n    <Container\n      {...mergeProps(filterBaseProps(otherProps, { eventProps: true }), {\n        mods: {\n          compact: isCompact,\n          size,\n          layout,\n          status: icon ? undefined : knownStatus,\n        },\n      })}\n      ref={ref}\n      styles={styles}\n    >\n      {iconNode}\n      {(title || subtitle) && (\n        <div data-element=\"Title\">\n          {wrapNodeIfPlain(title, () => (\n            <Title level={2} preset={isCompact ? 'h5' : isLarge ? 'h2' : 'h4'}>\n              {title}\n            </Title>\n          ))}\n          {wrapNodeIfPlain(subtitle, () => (\n            <Title\n              // A name no provider defines: the dialog `title` slot must reach\n              // the title only, or both headings get the dialog's label id\n              slot=\"subtitle\"\n              level={3}\n              preset={isCompact ? 't3m' : isLarge ? 't2' : 't2m'}\n            >\n              {subtitle}\n            </Title>\n          ))}\n        </div>\n      )}\n      {children && <div data-element=\"Content\">{children}</div>}\n      {actions && (\n        <div data-element=\"Actions\">\n          <ResultSizeContext.Provider value={size}>\n            {actions}\n          </ResultSizeContext.Provider>\n        </div>\n      )}\n    </Container>\n  );\n}\n\nconst _Result = Object.assign(forwardRef(Result), { Action: ResultAction });\n\n_Result.displayName = 'Result';\n\nexport { _Result as Result, ResultAction };\n"],"mappings":"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"}
+{"version":3,"file":"Result.js","names":["FocusableRef","IconAlertTriangleFilled","IconCircleCheckFilled","IconCircleXFilled","IconInfoCircleFilled","BaseProps","CONTAINER_STYLES","ContainerStyleProps","filterBaseProps","tasty","ComponentType","createContext","forwardRef","ReactNode","useContext","mergeProps","wrapNodeIfPlain","extractStyles","Button","CubeButtonProps","Title","CubeResultProps","children","icon","status","CubeResultStatus","subTitle","subtitle","title","actions","size","CubeResultSize","layout","CubeResultLayout","isCompact","StatusIconMap","Record","Container","qa","as","styles","display","compact","gridAreas","flow","placeContent","placeItems","gap","padding","textAlign","boxSizing","width","margin","Icon","$","gridArea","color","placeSelf","textWrap","Content","Actions","ResultSizeContext","undefined","CubeResultActionProps","ResultAction","t0","ref","_c","props","resultSize","t1","type","t2","statusIconMap","success","error","info","warning","Result","T0","t3","t4","t5","t6","t7","t8","t9","otherProps","console","warn","isLarge","knownStatus","hasOwnProperty","StatusIcon","t10","iconContent","t11","iconNode","eventProps","mods","_Result","Object","assign","Action","displayName"],"sources":["../../../../src/components/content/Result/Result.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport {\n  IconAlertTriangleFilled,\n  IconCircleCheckFilled,\n  IconCircleXFilled,\n  IconInfoCircleFilled,\n} from '@tabler/icons-react';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  filterBaseProps,\n  tasty,\n} from '@tenphi/tasty';\nimport {\n  ComponentType,\n  createContext,\n  forwardRef,\n  ReactNode,\n  useContext,\n} from 'react';\n\nimport { mergeProps, wrapNodeIfPlain } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { Button, CubeButtonProps } from '../../actions/Button/Button';\nimport { Title } from '../Title';\n\nexport interface CubeResultProps extends BaseProps, ContainerStyleProps {\n  /** Free content between the text and the actions, e.g. an alert or details */\n  children?: ReactNode;\n  /** Custom icon element */\n  icon?: ReactNode;\n  /**\n   * Result status from ready-made templates\n   * @default 'info'\n   */\n  status?: CubeResultStatus;\n  /**\n   * The subTitle\n   * @deprecated The subTitle prop is deprecated and will be removed in next major release. consider using subtitle instead\n   */\n  subTitle?: ReactNode;\n  /**\n   * Subtitle of the Result component\n   */\n  subtitle?: ReactNode;\n  /** The title */\n  title?: ReactNode;\n  /**\n   * Action buttons, as `Result.Action` elements so they follow the Result's size.\n   * A centered row by default, a full-width column in the `stacked` layout\n   */\n  actions?: ReactNode;\n  /**\n   * Visual scale: the icon size and the title and subtitle presets. Does not change the layout.\n   * Ignored when `isCompact` is set\n   * @default 'medium'\n   */\n  size?: CubeResultSize;\n  /**\n   * Arrangement of the block. `stacked` fills the container and stacks the actions to the full width,\n   * as in a confirmation or result dialog. Combine with `size=\"large\"` for the dialog card.\n   * Ignored when `isCompact` is set\n   * @default 'default'\n   */\n  layout?: CubeResultLayout;\n  /** Whether the result component has a compact presentation. Overrides `size` and `layout` */\n  isCompact?: boolean;\n}\n\nexport type CubeResultSize = 'medium' | 'large';\n\nexport type CubeResultLayout = 'default' | 'stacked';\n\nexport type CubeResultStatus =\n  | 'success'\n  | 'error'\n  | 'info'\n  | 'warning'\n  | 404\n  | 403\n  | 500;\n\n// `null` for a status without an icon, so no empty slot is rendered\ntype StatusIconMap = Record<CubeResultStatus, ComponentType | null>;\n\nconst Container = tasty({\n  qa: 'ResultContainer',\n  as: 'section',\n  styles: {\n    // Any ancestor: the Result sits in the dialog's `Content`, not in `Dialog`\n    '@in-dialog': '@parent(id=Dialog)',\n\n    display: {\n      '': 'flex',\n      compact: 'grid',\n    },\n    gridAreas: '\"icon title\" \"content content\" \"actions actions\"',\n    flow: 'column',\n    placeContent: {\n      '': 'center',\n      compact: 'start',\n    },\n    placeItems: {\n      '': 'center',\n      compact: 'start',\n    },\n    // Outside compact the blocks below the title space themselves, so the\n    // icon's own room is the whole distance to the title\n    gap: {\n      '': '0',\n      compact: '2x 1x',\n    },\n    padding: {\n      '': '6x 4x',\n      // The host pads: a dialog `Content` or the page section the card fills\n      compact: '0',\n      'layout=stacked': '1.5x',\n      // The dialog's `Content` already pads it\n      'layout=stacked & @in-dialog': '0',\n    },\n    textAlign: {\n      '': 'center',\n      compact: 'left',\n    },\n    boxSizing: 'border-box',\n    width: {\n      '': 'max 80ch',\n      // Fill the container so stacked actions share one width wherever the card sits\n      'layout=stacked': '0 100% 80ch',\n    },\n    margin: {\n      '': '0 auto',\n      compact: '0',\n    },\n    '--icon-size': {\n      '': '6x',\n      'size=large': '10x',\n    },\n\n    Icon: {\n      $: '>',\n      display: 'grid',\n      gridArea: 'icon',\n      // At least the 3x between the other blocks; an icon above 12x gets a\n      // quarter of its size, so a big one is not crowded\n      padding: {\n        '': 'max($icon-size / 4, 3x)',\n        compact: '0',\n      },\n      // A custom icon keeps its own color\n      color: {\n        '': 'inherit',\n        'status=info': '#purple',\n        'status=success': '#success',\n        'status=error': '#danger',\n        'status=warning': '#warning',\n      },\n    },\n\n    Title: {\n      $: '>',\n      gridArea: 'title',\n      display: 'flex',\n      flow: 'column',\n      placeItems: 'inherit',\n      gap: '1x',\n      placeSelf: 'center',\n      textWrap: 'balance',\n    },\n\n    Content: {\n      $: '>',\n      gridArea: 'content',\n      display: 'block',\n      margin: {\n        '': 'top 3x',\n        compact: '0',\n      },\n      placeSelf: {\n        '': 'auto',\n        'layout=stacked': 'stretch',\n      },\n    },\n\n    Actions: {\n      $: '>',\n      gridArea: 'actions',\n      display: 'flex',\n      margin: {\n        '': 'top 3x',\n        compact: '0',\n      },\n      flow: {\n        '': 'row wrap',\n        'layout=stacked': 'column',\n      },\n      gap: '1x',\n      placeContent: {\n        '': 'center',\n        compact: 'start',\n      },\n      placeItems: {\n        '': 'center',\n        'layout=stacked': 'stretch',\n      },\n      placeSelf: {\n        '': 'auto',\n        'layout=stacked': 'stretch',\n      },\n    },\n  },\n});\n\nconst ResultSizeContext = createContext<CubeResultSize | undefined>(undefined);\n\nexport type CubeResultActionProps = CubeButtonProps;\n\n/**\n * A `Button` for the Result `actions` slot. Its size follows the Result's `size` unless set.\n * A link keeps Button's own `inline` size\n */\nconst ResultAction = forwardRef(function ResultAction(\n  { size, ...props }: CubeResultActionProps,\n  ref: FocusableRef<HTMLElement>,\n) {\n  const resultSize = useContext(ResultSizeContext);\n\n  return (\n    <Button\n      ref={ref}\n      {...props}\n      size={size ?? (props.type === 'link' ? undefined : resultSize)}\n    />\n  );\n});\n\nconst statusIconMap: StatusIconMap = {\n  // Decorative: the title says what happened.\n  success: () => <IconCircleCheckFilled aria-hidden=\"true\" />,\n  error: () => <IconCircleXFilled aria-hidden=\"true\" />,\n  info: () => <IconInfoCircleFilled aria-hidden=\"true\" />,\n  warning: () => <IconAlertTriangleFilled aria-hidden=\"true\" />,\n  // TODO: Needs to be implemented in the future\n  404: null,\n  403: null,\n  500: null,\n};\n\nfunction Result(props: CubeResultProps, ref) {\n  let {\n    children,\n    isCompact,\n    icon,\n    status,\n    subTitle,\n    subtitle,\n    title,\n    actions,\n    size = 'medium',\n    layout = 'default',\n    ...otherProps\n  } = props;\n\n  subtitle = subtitle ?? subTitle;\n\n  if (icon && status) {\n    console.warn(\n      'Don\\'t use \"icon\" and \"status\" together, it can lead to possible errors.',\n    );\n  }\n\n  // The compact grid has its own scale and arrangement; `size` and `layout`\n  // describe the centered column only, so they are dropped rather than mixed in\n  if (isCompact) {\n    size = 'medium';\n    layout = 'default';\n  }\n\n  const isLarge = size === 'large';\n\n  // An unknown status falls back to `info` for the color too, not only the icon\n  const knownStatus: CubeResultStatus =\n    status && statusIconMap.hasOwnProperty(status) ? status : 'info';\n  const StatusIcon = statusIconMap[knownStatus];\n\n  // A custom icon shares the status icon's wrapper, so it gets the same room\n  const iconContent = icon || (StatusIcon && <StatusIcon />);\n  const iconNode = iconContent && <div data-element=\"Icon\">{iconContent}</div>;\n\n  const styles = extractStyles(otherProps, CONTAINER_STYLES);\n\n  return (\n    <Container\n      {...mergeProps(filterBaseProps(otherProps, { eventProps: true }), {\n        mods: {\n          compact: isCompact,\n          size,\n          layout,\n          status: icon ? undefined : knownStatus,\n        },\n      })}\n      ref={ref}\n      styles={styles}\n    >\n      {iconNode}\n      {(title || subtitle) && (\n        <div data-element=\"Title\">\n          {wrapNodeIfPlain(title, () => (\n            <Title level={2} preset={isCompact ? 'h5' : isLarge ? 'h2' : 'h4'}>\n              {title}\n            </Title>\n          ))}\n          {wrapNodeIfPlain(subtitle, () => (\n            <Title\n              // A name no provider defines: the dialog `title` slot must reach\n              // the title only, or both headings get the dialog's label id\n              slot=\"subtitle\"\n              level={3}\n              preset={isCompact ? 't3m' : isLarge ? 't2' : 't2m'}\n            >\n              {subtitle}\n            </Title>\n          ))}\n        </div>\n      )}\n      {children && <div data-element=\"Content\">{children}</div>}\n      {actions && (\n        <div data-element=\"Actions\">\n          <ResultSizeContext.Provider value={size}>\n            {actions}\n          </ResultSizeContext.Provider>\n        </div>\n      )}\n    </Container>\n  );\n}\n\nconst _Result = Object.assign(forwardRef(Result), { Action: ResultAction });\n\n_Result.displayName = 'Result';\n\nexport { _Result as Result, ResultAction };\n"],"mappings":"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"}

package/dist/components/content/Skeleton/Skeleton.js

@@ -1,9 +1,9 @@
-/** @license MIT | @cube-dev/ui-kit v0.193.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.194.0 | Cube Dev Team */
+import { useI18n } from "../../../i18n/useI18n.js";
 import { Space } from "../../layout/Space.js";
 import { Grid } from "../../layout/Grid.js";
 import { Flow } from "../../layout/Flow.js";
-import { Placeholder } from "../Placeholder/Placeholder.js";
-import { c } from "react/compiler-runtime";
+import { Placeholder, PlaceholderGroupContext } from "../Placeholder/Placeholder.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/content/Skeleton/Skeleton.tsx
@@ -146,12 +146,12 @@ const LAYOUT_MAP = {
 	}
 };
 function Skeleton(t0) {
-	const $ = c(2);
-	let t1;
-	if ($[0] !== t0) {
-		let { layout, isStatic, columns, rows, lines, tabs, cards, children, ...props } = t0;
-		layout = layout || "page";
-		t1 = LAYOUT_MAP[layout] ? LAYOUT_MAP[layout]({
+	let { layout, isStatic, columns, rows, lines, tabs, cards, children, ...props } = t0;
+	const { t } = useI18n();
+	layout = layout || "page";
+	return LAYOUT_MAP[layout] ? /* @__PURE__ */ jsx(PlaceholderGroupContext.Provider, {
+		value: true,
+		children: LAYOUT_MAP[layout]({
 			isStatic,
 			columns,
 			rows,
@@ -161,18 +161,17 @@ function Skeleton(t0) {
 			children,
 			rootProps: {
 				qa: "Skeleton",
+				role: "region",
+				"aria-label": t("placeholder.contentIsLoading", "Content is loading"),
 				...props
 			}
-		}) : /* @__PURE__ */ jsx(Placeholder, {
-			qa: "Skeleton",
-			isStatic,
-			...props,
-			children
-		});
-		$[0] = t0;
-		$[1] = t1;
-	} else t1 = $[1];
-	return t1;
+		})
+	}) : /* @__PURE__ */ jsx(Placeholder, {
+		qa: "Skeleton",
+		isStatic,
+		...props,
+		children
+	});
 }
 
 //#endregion

package/dist/components/content/Skeleton/Skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.js","names":["BaseProps","ContainerStyleProps","ReactNode","Flow","CubeGridProps","Grid","Space","CubePlaceholderProps","Placeholder","LAYOUT_MAP","page","lines","children","isStatic","rootProps","CubeSkeletonLayoutProps","Array","fill","map","item","i","content","topbar","menu","stats","cards","tabs","table","rows","columns","j","chart","heightMap","const","CubeSkeletonProps","CubeSkeletonRootProps","Omit","layout","Skeleton","t0","$","_c","t1","props","qa"],"sources":["../../../../src/components/content/Skeleton/Skeleton.tsx"],"sourcesContent":["import { BaseProps, ContainerStyleProps } from '@tenphi/tasty';\nimport { ReactNode } from 'react';\n\nimport { Flow } from '../../layout/Flow';\nimport { CubeGridProps, Grid } from '../../layout/Grid';\nimport { Space } from '../../layout/Space';\nimport { CubePlaceholderProps, Placeholder } from '../Placeholder/Placeholder';\n\nconst LAYOUT_MAP = {\n  page({\n    lines,\n    children,\n    isStatic = false,\n    rootProps,\n  }: CubeSkeletonLayoutProps) {\n    return (\n      <Flow gap=\"4x\" {...rootProps}>\n        <Space placeContent=\"space-between\">\n          <Placeholder isStatic={isStatic} width=\"100px 25% 300px\" />\n          <Placeholder isStatic={isStatic} width=\"50px 10% 150px\" />\n        </Space>\n        <Flow gap=\"2x\">\n          {children ||\n            Array(lines || 5)\n              .fill(0)\n              .map((item, i) => <Placeholder key={i} isStatic={isStatic} />)}\n        </Flow>\n      </Flow>\n    );\n  },\n  content({\n    children,\n    lines,\n    isStatic = false,\n    rootProps,\n  }: CubeSkeletonLayoutProps) {\n    return (\n      <Flow gap=\"2x\" {...rootProps}>\n        {children ||\n          Array(lines || 5)\n            .fill(0)\n            .map((item, i) => <Placeholder key={i} isStatic={isStatic} />)}\n      </Flow>\n    );\n  },\n  topbar({ isStatic = false, rootProps }: CubeSkeletonLayoutProps) {\n    return (\n      <Space\n        gap=\"4x\"\n        placeContent=\"space-between\"\n        height=\"6x\"\n        padding=\"1x\"\n        border=\"bottom\"\n        {...rootProps}\n      >\n        <Space>\n          <Placeholder circle isStatic={isStatic} size=\"4x\" />\n          <Placeholder isStatic={isStatic} width=\"20x\" />\n        </Space>\n\n        <Space>\n          <Placeholder isStatic={isStatic} width=\"10x\" />\n          <Placeholder circle isStatic={isStatic} size=\"4x\" />\n        </Space>\n      </Space>\n    );\n  },\n  menu({ lines, isStatic = false, rootProps }: CubeSkeletonLayoutProps) {\n    return (\n      <Flow gap=\"3.25x\" padding=\"3x 1x\" {...rootProps}>\n        {Array(lines || 5)\n          .fill(0)\n          .map((item, i) => (\n            <Placeholder key={i} isStatic={isStatic} />\n          ))}\n      </Flow>\n    );\n  },\n  stats({ cards, isStatic = false, rootProps }: CubeSkeletonLayoutProps) {\n    return (\n      <Space gap=\"4x\" {...rootProps}>\n        {Array(cards || 3)\n          .fill(0)\n          .map((item, i) => (\n            <Placeholder\n              key={i}\n              isStatic={isStatic}\n              radius=\"1r\"\n              width=\"20x\"\n              height=\"12x\"\n              flexGrow={1}\n            />\n          ))}\n      </Space>\n    );\n  },\n  tabs({\n    tabs,\n    children,\n    lines,\n    isStatic = false,\n    rootProps,\n  }: CubeSkeletonLayoutProps) {\n    return (\n      <Flow gap=\"4x\" {...rootProps}>\n        <Space>\n          {Array(tabs || 3)\n            .fill(0)\n            .map((item, i) => (\n              <Placeholder key={i} isStatic={isStatic} width=\"15x\" />\n            ))}\n        </Space>\n        <Flow gap=\"2x\">\n          {children ||\n            Array(lines || 5)\n              .fill(0)\n              .map((item, i) => <Placeholder key={i} isStatic={isStatic} />)}\n        </Flow>\n      </Flow>\n    );\n  },\n  table({\n    rows,\n    columns,\n    isStatic = false,\n    rootProps,\n  }: CubeSkeletonLayoutProps) {\n    columns = columns || 5;\n    rows = rows || 5;\n\n    return (\n      <Grid\n        columns={`repeat(${columns}, 1fr)`}\n        gap=\"3x\"\n        padding=\"1x 0\"\n        {...rootProps}\n      >\n        {Array(rows)\n          .fill(0)\n          .map((item, i) => {\n            return Array(columns)\n              .fill(0)\n              .map((item, j) => {\n                return (\n                  <Placeholder\n                    key={`${i}.${j}`}\n                    isStatic={isStatic}\n                    size={!i ? '3x' : '2x'}\n                  />\n                );\n              });\n          })}\n      </Grid>\n    );\n  },\n  chart({ columns, isStatic = false, rootProps }: CubeSkeletonLayoutProps) {\n    columns = columns || 12;\n\n    const heightMap = [1, 4, 2, 5, 8, 9, 5, 3, 4, 2, 6, 7, 2];\n\n    return (\n      <Grid\n        columns={`repeat(${columns}, 1fr)`}\n        gap=\"3x\"\n        padding=\"1x 0\"\n        placeItems=\"end stretch\"\n        height=\"40x\"\n        {...rootProps}\n      >\n        {Array(columns)\n          .fill(0)\n          .map((item, i) => {\n            return (\n              <Placeholder\n                key={i}\n                isStatic={isStatic}\n                height={`${heightMap[i % 12] * 10}%`}\n                width=\"max 6x\"\n              />\n            );\n          })}\n      </Grid>\n    );\n  },\n} as const;\n\nexport interface CubeSkeletonProps\n  extends CubeSkeletonRootProps,\n    Omit<CubeSkeletonLayoutProps, 'rootProps'> {\n  /** The type of the layout */\n  layout?: keyof typeof LAYOUT_MAP;\n}\n\nexport interface CubeSkeletonRootProps\n  extends Omit<CubeGridProps, 'columns' | 'rows'>,\n    CubePlaceholderProps,\n    BaseProps,\n    ContainerStyleProps {}\n\nexport interface CubeSkeletonLayoutProps {\n  /** The number of columns for the table layout */\n  columns?: number;\n  /** The number of rows for the table layout */\n  rows?: number;\n  /** The number of placeholder lines */\n  lines?: number;\n  /** The number of tabs */\n  tabs?: number;\n  /** The number of cards */\n  cards?: number;\n  /** The static mode */\n  isStatic?: boolean;\n  rootProps?: CubeSkeletonRootProps;\n  children?: ReactNode;\n}\n\nexport function Skeleton({\n  layout,\n  isStatic,\n  columns,\n  rows,\n  lines,\n  tabs,\n  cards,\n  children,\n  ...props\n}: CubeSkeletonProps) {\n  layout = layout || 'page';\n\n  return LAYOUT_MAP[layout] ? (\n    LAYOUT_MAP[layout]({\n      isStatic,\n      columns,\n      rows,\n      lines,\n      tabs,\n      cards,\n      children,\n      rootProps: { qa: 'Skeleton', ...props },\n    })\n  ) : (\n    <Placeholder qa=\"Skeleton\" isStatic={isStatic} {...props}>\n      {children}\n    </Placeholder>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"Skeleton.js","names":["BaseProps","ContainerStyleProps","ReactNode","useI18n","Flow","CubeGridProps","Grid","Space","CubePlaceholderProps","Placeholder","PlaceholderGroupContext","LAYOUT_MAP","page","lines","children","isStatic","rootProps","CubeSkeletonLayoutProps","Array","fill","map","item","i","content","topbar","menu","stats","cards","tabs","table","rows","columns","j","chart","heightMap","const","CubeSkeletonProps","CubeSkeletonRootProps","Omit","layout","Skeleton","t0","props","t","qa","role"],"sources":["../../../../src/components/content/Skeleton/Skeleton.tsx"],"sourcesContent":["import { BaseProps, ContainerStyleProps } from '@tenphi/tasty';\nimport { ReactNode } from 'react';\n\nimport { useI18n } from '../../../i18n';\nimport { Flow } from '../../layout/Flow';\nimport { CubeGridProps, Grid } from '../../layout/Grid';\nimport { Space } from '../../layout/Space';\nimport {\n  CubePlaceholderProps,\n  Placeholder,\n  PlaceholderGroupContext,\n} from '../Placeholder/Placeholder';\n\nconst LAYOUT_MAP = {\n  page({\n    lines,\n    children,\n    isStatic = false,\n    rootProps,\n  }: CubeSkeletonLayoutProps) {\n    return (\n      <Flow gap=\"4x\" {...rootProps}>\n        <Space placeContent=\"space-between\">\n          <Placeholder isStatic={isStatic} width=\"100px 25% 300px\" />\n          <Placeholder isStatic={isStatic} width=\"50px 10% 150px\" />\n        </Space>\n        <Flow gap=\"2x\">\n          {children ||\n            Array(lines || 5)\n              .fill(0)\n              .map((item, i) => <Placeholder key={i} isStatic={isStatic} />)}\n        </Flow>\n      </Flow>\n    );\n  },\n  content({\n    children,\n    lines,\n    isStatic = false,\n    rootProps,\n  }: CubeSkeletonLayoutProps) {\n    return (\n      <Flow gap=\"2x\" {...rootProps}>\n        {children ||\n          Array(lines || 5)\n            .fill(0)\n            .map((item, i) => <Placeholder key={i} isStatic={isStatic} />)}\n      </Flow>\n    );\n  },\n  topbar({ isStatic = false, rootProps }: CubeSkeletonLayoutProps) {\n    return (\n      <Space\n        gap=\"4x\"\n        placeContent=\"space-between\"\n        height=\"6x\"\n        padding=\"1x\"\n        border=\"bottom\"\n        {...rootProps}\n      >\n        <Space>\n          <Placeholder circle isStatic={isStatic} size=\"4x\" />\n          <Placeholder isStatic={isStatic} width=\"20x\" />\n        </Space>\n\n        <Space>\n          <Placeholder isStatic={isStatic} width=\"10x\" />\n          <Placeholder circle isStatic={isStatic} size=\"4x\" />\n        </Space>\n      </Space>\n    );\n  },\n  menu({ lines, isStatic = false, rootProps }: CubeSkeletonLayoutProps) {\n    return (\n      <Flow gap=\"3.25x\" padding=\"3x 1x\" {...rootProps}>\n        {Array(lines || 5)\n          .fill(0)\n          .map((item, i) => (\n            <Placeholder key={i} isStatic={isStatic} />\n          ))}\n      </Flow>\n    );\n  },\n  stats({ cards, isStatic = false, rootProps }: CubeSkeletonLayoutProps) {\n    return (\n      <Space gap=\"4x\" {...rootProps}>\n        {Array(cards || 3)\n          .fill(0)\n          .map((item, i) => (\n            <Placeholder\n              key={i}\n              isStatic={isStatic}\n              radius=\"1r\"\n              width=\"20x\"\n              height=\"12x\"\n              flexGrow={1}\n            />\n          ))}\n      </Space>\n    );\n  },\n  tabs({\n    tabs,\n    children,\n    lines,\n    isStatic = false,\n    rootProps,\n  }: CubeSkeletonLayoutProps) {\n    return (\n      <Flow gap=\"4x\" {...rootProps}>\n        <Space>\n          {Array(tabs || 3)\n            .fill(0)\n            .map((item, i) => (\n              <Placeholder key={i} isStatic={isStatic} width=\"15x\" />\n            ))}\n        </Space>\n        <Flow gap=\"2x\">\n          {children ||\n            Array(lines || 5)\n              .fill(0)\n              .map((item, i) => <Placeholder key={i} isStatic={isStatic} />)}\n        </Flow>\n      </Flow>\n    );\n  },\n  table({\n    rows,\n    columns,\n    isStatic = false,\n    rootProps,\n  }: CubeSkeletonLayoutProps) {\n    columns = columns || 5;\n    rows = rows || 5;\n\n    return (\n      <Grid\n        columns={`repeat(${columns}, 1fr)`}\n        gap=\"3x\"\n        padding=\"1x 0\"\n        {...rootProps}\n      >\n        {Array(rows)\n          .fill(0)\n          .map((item, i) => {\n            return Array(columns)\n              .fill(0)\n              .map((item, j) => {\n                return (\n                  <Placeholder\n                    key={`${i}.${j}`}\n                    isStatic={isStatic}\n                    size={!i ? '3x' : '2x'}\n                  />\n                );\n              });\n          })}\n      </Grid>\n    );\n  },\n  chart({ columns, isStatic = false, rootProps }: CubeSkeletonLayoutProps) {\n    columns = columns || 12;\n\n    const heightMap = [1, 4, 2, 5, 8, 9, 5, 3, 4, 2, 6, 7, 2];\n\n    return (\n      <Grid\n        columns={`repeat(${columns}, 1fr)`}\n        gap=\"3x\"\n        padding=\"1x 0\"\n        placeItems=\"end stretch\"\n        height=\"40x\"\n        {...rootProps}\n      >\n        {Array(columns)\n          .fill(0)\n          .map((item, i) => {\n            return (\n              <Placeholder\n                key={i}\n                isStatic={isStatic}\n                height={`${heightMap[i % 12] * 10}%`}\n                width=\"max 6x\"\n              />\n            );\n          })}\n      </Grid>\n    );\n  },\n} as const;\n\nexport interface CubeSkeletonProps\n  extends CubeSkeletonRootProps,\n    Omit<CubeSkeletonLayoutProps, 'rootProps'> {\n  /** The type of the layout */\n  layout?: keyof typeof LAYOUT_MAP;\n}\n\nexport interface CubeSkeletonRootProps\n  extends Omit<CubeGridProps, 'columns' | 'rows'>,\n    CubePlaceholderProps,\n    BaseProps,\n    ContainerStyleProps {}\n\nexport interface CubeSkeletonLayoutProps {\n  /** The number of columns for the table layout */\n  columns?: number;\n  /** The number of rows for the table layout */\n  rows?: number;\n  /** The number of placeholder lines */\n  lines?: number;\n  /** The number of tabs */\n  tabs?: number;\n  /** The number of cards */\n  cards?: number;\n  /** The static mode */\n  isStatic?: boolean;\n  rootProps?: CubeSkeletonRootProps;\n  children?: ReactNode;\n}\n\nexport function Skeleton({\n  layout,\n  isStatic,\n  columns,\n  rows,\n  lines,\n  tabs,\n  cards,\n  children,\n  ...props\n}: CubeSkeletonProps) {\n  const { t } = useI18n();\n\n  layout = layout || 'page';\n\n  // One \"Content is loading\" region for the whole layout, rather than one per\n  // bar: a page skeleton would otherwise list a dozen identical landmarks.\n  return LAYOUT_MAP[layout] ? (\n    <PlaceholderGroupContext.Provider value>\n      {LAYOUT_MAP[layout]({\n        isStatic,\n        columns,\n        rows,\n        lines,\n        tabs,\n        cards,\n        children,\n        rootProps: {\n          qa: 'Skeleton',\n          role: 'region',\n          'aria-label': t('placeholder.contentIsLoading', 'Content is loading'),\n          ...props,\n        },\n      })}\n    </PlaceholderGroupContext.Provider>\n  ) : (\n    <Placeholder qa=\"Skeleton\" isStatic={isStatic} {...props}>\n      {children}\n    </Placeholder>\n  );\n}\n"],"mappings":";;;;;;;;;AAaA,MAAMW,aAAa;CACjBC,KAAK,EACHC,OACAC,UACAC,WAAW,OACXC,aAC0B;AAC1B,SACE,qBAAC;GAAK,KAAI;GAAK,GAAIA;cACjB,qBAAC;IAAM,cAAa;eAClB,oBAAC;KAAsBD;KAAU,OAAM;MAAiB,EACxD,oBAAC;KAAsBA;KAAU,OAAM;MAAgB;KAClD,EACP,oBAAC;IAAK,KAAI;cACPD,YACCI,MAAML,SAAS,EAAE,CACdM,KAAK,EAAE,CACPC,KAAKC,MAAMC,MAAM,oBAAC,eAA8BP,YAAbO,EAAyB,CAAC;KAC9D;IACD;;CAGXC,QAAQ,EACNT,UACAD,OACAE,WAAW,OACXC,aAC0B;AAC1B,SACE,oBAAC;GAAK,KAAI;GAAK,GAAIA;aAChBF,YACCI,MAAML,SAAS,EAAE,CACdM,KAAK,EAAE,CACPC,KAAKC,MAAMC,MAAM,oBAAC,eAA8BP,YAAbO,EAAyB,CAAC;IAC7D;;CAGXE,OAAO,EAAET,WAAW,OAAOC,aAAsC;AAC/D,SACE,qBAAC;GACC,KAAI;GACJ,cAAa;GACb,QAAO;GACP,SAAQ;GACR,QAAO;GACP,GAAIA;cAEJ,qBAAC,oBACC,oBAAC;IAAY;IAAiBD;IAAU,MAAK;KAAI,EACjD,oBAAC;IAAsBA;IAAU,OAAM;KAAK,IACvC,EAEP,qBAAC,oBACC,oBAAC;IAAsBA;IAAU,OAAM;KAAK,EAC5C,oBAAC;IAAY;IAAiBA;IAAU,MAAK;KAAI,IAC5C;IACD;;CAGZU,KAAK,EAAEZ,OAAOE,WAAW,OAAOC,aAAsC;AACpE,SACE,oBAAC;GAAK,KAAI;GAAQ,SAAQ;GAAQ,GAAIA;aACnCE,MAAML,SAAS,EAAE,CACfM,KAAK,EAAE,CACPC,KAAKC,MAAMC,MACV,oBAAC,eAA8BP,YAAbO,EACnB,CAAC;IACC;;CAGXI,MAAM,EAAEC,OAAOZ,WAAW,OAAOC,aAAsC;AACrE,SACE,oBAAC;GAAM,KAAI;GAAK,GAAIA;aACjBE,MAAMS,SAAS,EAAE,CACfR,KAAK,EAAE,CACPC,KAAKC,MAAMC,MACV,oBAAC;IAEWP;IACV,QAAO;IACP,OAAM;IACN,QAAO;IACP,UAAU;MALLO,EAOR,CAAC;IACE;;CAGZM,KAAK,EACHA,MACAd,UACAD,OACAE,WAAW,OACXC,aAC0B;AAC1B,SACE,qBAAC;GAAK,KAAI;GAAK,GAAIA;cACjB,oBAAC,mBACEE,MAAMU,QAAQ,EAAE,CACdT,KAAK,EAAE,CACPC,KAAKC,MAAMC,MACV,oBAAC;IAA8BP;IAAU,OAAM;MAA7BO,EACnB,CAAC,GACC,EACP,oBAAC;IAAK,KAAI;cACPR,YACCI,MAAML,SAAS,EAAE,CACdM,KAAK,EAAE,CACPC,KAAKC,MAAMC,MAAM,oBAAC,eAA8BP,YAAbO,EAAyB,CAAC;KAC9D;IACD;;CAGXO,MAAM,EACJC,MACAC,SACAhB,WAAW,OACXC,aAC0B;AAC1Be,YAAUA,WAAW;AACrBD,SAAOA,QAAQ;AAEf,SACE,oBAAC;GACC,SAAS,UAAUC,QAAO;GAC1B,KAAI;GACJ,SAAQ;GACR,GAAIf;aAEHE,MAAMY,KAAK,CACTX,KAAK,EAAE,CACPC,KAAKC,MAAMC,MAAM;AAChB,WAAOJ,MAAMa,QAAQ,CAClBZ,KAAK,EAAE,CACPC,KAAKC,MAAMW,MAAM;AAChB,YACE,oBAAC;MAEWjB;MACV,MAAM,CAACO,IAAI,OAAO;QAFb,GAAGA,EAAC,GAAIU,IAGb;MAEJ;KACJ;IACC;;CAGXC,MAAM,EAAEF,SAAShB,WAAW,OAAOC,aAAsC;AACvEe,YAAUA,WAAW;EAErB,MAAMG,YAAY;GAAC;GAAG;GAAG;GAAG;GAAG;GAAG;GAAG;GAAG;GAAG;GAAG;GAAG;GAAG;GAAG;GAAE;AAEzD,SACE,oBAAC;GACC,SAAS,UAAUH,QAAO;GAC1B,KAAI;GACJ,SAAQ;GACR,YAAW;GACX,QAAO;GACP,GAAIf;aAEHE,MAAMa,QAAQ,CACZZ,KAAK,EAAE,CACPC,KAAKC,MAAMC,MAAM;AAChB,WACE,oBAAC;KAEWP;KACV,QAAQ,GAAGmB,UAAUZ,IAAI,MAAM,GAAE;KACjC,OAAM;OAHDA,EAIL;KAEJ;IACC;;CAGZ;AAgCD,SAAOkB,SAAAC,IAAA;CAAkB,IAAA,EAAAF,QAAAxB,UAAAgB,SAAAD,MAAAjB,OAAAe,MAAAD,OAAAb,UAAA,GAAA4B,UAAAD;CAWvB,MAAA,EAAAE,MAAcxC,SAAS;AAEvBoC,UAASA,UAAAA;AAAH,QAIC5B,WAAW4B,UAChB,oBAAA,wBAAA;EAAkC,OAAA;YAC/B5B,WAAW4B,QAAQ;GAAAxB;GAAAgB;GAAAD;GAAAjB;GAAAe;GAAAD;GAAAb;GAAAE,WAQP;IAAA4B,IACL;IAAUC,MACR;IAAQ,cACAF,EAAE,gCAAgC,qBAAqB;IAAA,GAClED;IACL;GACD,CAAA;GAMJ,GAHC,oBAAC;EAAe,IAAA;EAAqB3B;EAAQ,GAAM2B;EAChD5B;GAEJ"}

package/dist/components/content/Tag/Tag.js

@@ -1,7 +1,7 @@
-/** @license MIT | @cube-dev/ui-kit v0.193.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.194.0 | Cube Dev Team */
 import { mergeStyleLayers } from "../../../utils/styles.js";
-import { _Item } from "../Item/Item.js";
 import { useI18n } from "../../../i18n/useI18n.js";
+import { _Item } from "../Item/Item.js";
 import { CloseIcon } from "../../../icons/CloseIcon.js";
 import { c } from "react/compiler-runtime";
 import { tasty } from "@tenphi/tasty";

package/dist/components/content/Text.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.193.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.194.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useSlotProps } from "../../utils/react/Slots.js";
 import { c } from "react/compiler-runtime";

package/dist/components/content/TextItem/TextItem.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.193.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.194.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { TEXT_PROP_MAP, _Text } from "../Text.js";
 import { highlightText } from "../highlightText.js";

package/dist/components/content/Title.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.193.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.194.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useSlotProps } from "../../utils/react/Slots.js";
 import { TEXT_PROP_MAP } from "./Text.js";
@@ -45,61 +45,78 @@ const TitleElement = tasty({
 	}
 });
 const Title = forwardRef(function CubeTitle(t0, ref) {
-	const $ = c(22);
+	const $ = c(30);
 	let as;
 	let ellipsis;
-	let level;
 	let nowrap;
 	let props;
 	let qa;
 	if ($[0] !== t0) {
-		({qa, as, nowrap, ellipsis, level, ...props} = t0);
+		({qa, as, nowrap, ellipsis, ...props} = t0);
 		$[0] = t0;
 		$[1] = as;
 		$[2] = ellipsis;
-		$[3] = level;
-		$[4] = nowrap;
-		$[5] = props;
-		$[6] = qa;
+		$[3] = nowrap;
+		$[4] = props;
+		$[5] = qa;
 	} else {
 		as = $[1];
 		ellipsis = $[2];
-		level = $[3];
-		nowrap = $[4];
-		props = $[5];
-		qa = $[6];
+		nowrap = $[3];
+		props = $[4];
+		qa = $[5];
 	}
-	const propsWithSlots = useSlotProps(props, "title");
-	const tag = `h${level || 1}`;
-	let t1;
-	if ($[7] !== propsWithSlots) {
-		t1 = extractStyles(propsWithSlots, STYLE_LIST, {}, TEXT_PROP_MAP);
-		$[7] = propsWithSlots;
-		$[8] = t1;
-	} else t1 = $[8];
-	const styles = t1;
-	const t2 = qa || "Title";
-	const t3 = as || tag;
-	const t4 = level || 1;
+	const t1 = useSlotProps(props, "title");
+	let T0;
+	let styles;
+	let t2;
+	let t3;
+	let t4;
 	let t5;
-	if ($[9] !== ellipsis || $[10] !== nowrap) {
-		t5 = {
-			nowrap,
-			ellipsis
-		};
-		$[9] = ellipsis;
-		$[10] = nowrap;
-		$[11] = t5;
-	} else t5 = $[11];
 	let t6;
-	if ($[12] !== propsWithSlots) {
+	if ($[6] !== as || $[7] !== ellipsis || $[8] !== nowrap || $[9] !== qa || $[10] !== t1) {
+		const { level, ...propsWithSlots } = t1;
+		const headingLevel = level || 1;
+		const tag = `h${headingLevel}`;
+		styles = extractStyles(propsWithSlots, STYLE_LIST, {}, TEXT_PROP_MAP);
+		T0 = TitleElement;
+		t2 = qa || "Title";
+		t3 = as || tag;
+		t4 = headingLevel;
+		if ($[18] !== ellipsis || $[19] !== nowrap) {
+			t5 = {
+				nowrap,
+				ellipsis
+			};
+			$[18] = ellipsis;
+			$[19] = nowrap;
+			$[20] = t5;
+		} else t5 = $[20];
 		t6 = filterBaseProps(propsWithSlots, { eventProps: true });
-		$[12] = propsWithSlots;
-		$[13] = t6;
-	} else t6 = $[13];
+		$[6] = as;
+		$[7] = ellipsis;
+		$[8] = nowrap;
+		$[9] = qa;
+		$[10] = t1;
+		$[11] = T0;
+		$[12] = styles;
+		$[13] = t2;
+		$[14] = t3;
+		$[15] = t4;
+		$[16] = t5;
+		$[17] = t6;
+	} else {
+		T0 = $[11];
+		styles = $[12];
+		t2 = $[13];
+		t3 = $[14];
+		t4 = $[15];
+		t5 = $[16];
+		t6 = $[17];
+	}
 	let t7;
-	if ($[14] !== ref || $[15] !== styles || $[16] !== t2 || $[17] !== t3 || $[18] !== t4 || $[19] !== t5 || $[20] !== t6) {
-		t7 = /* @__PURE__ */ jsx(TitleElement, {
+	if ($[21] !== T0 || $[22] !== ref || $[23] !== styles || $[24] !== t2 || $[25] !== t3 || $[26] !== t4 || $[27] !== t5 || $[28] !== t6) {
+		t7 = /* @__PURE__ */ jsx(T0, {
 			qa: t2,
 			as: t3,
 			"data-level": t4,
@@ -108,15 +125,16 @@ const Title = forwardRef(function CubeTitle(t0, ref) {
 			ref,
 			styles
 		});
-		$[14] = ref;
-		$[15] = styles;
-		$[16] = t2;
-		$[17] = t3;
-		$[18] = t4;
-		$[19] = t5;
-		$[20] = t6;
-		$[21] = t7;
-	} else t7 = $[21];
+		$[21] = T0;
+		$[22] = ref;
+		$[23] = styles;
+		$[24] = t2;
+		$[25] = t3;
+		$[26] = t4;
+		$[27] = t5;
+		$[28] = t6;
+		$[29] = t7;
+	} else t7 = $[29];
 	return t7;
 });
 const _Title = Object.assign(Title, {