@cube-dev/ui-kit 0.0.0-canary-6df2b58 → 0.0.0-canary-afff9bd

package/dist/components/content/Layout/LayoutBlock.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | Cube Dev Team */
 import { _LayoutContent } from "./LayoutContent.js";
 import { c } from "react-compiler-runtime";
 import { tasty } from "@tenphi/tasty";

package/dist/components/content/Layout/LayoutCenter.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | Cube Dev Team */
 import { _LayoutContainer } from "./LayoutContainer.js";
 import { c } from "react-compiler-runtime";
 import { tasty } from "@tenphi/tasty";

package/dist/components/content/Layout/LayoutContainer.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { LayoutContextReset } from "./LayoutContext.js";

package/dist/components/content/Layout/LayoutContent.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { LayoutContextReset } from "./LayoutContext.js";

package/dist/components/content/Layout/LayoutContext.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { c } from "react-compiler-runtime";
 import { createContext, useContext, useRef, useState } from "react";

package/dist/components/content/Layout/LayoutFlex.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | Cube Dev Team */
 import { _LayoutContent } from "./LayoutContent.js";
 import { c } from "react-compiler-runtime";
 import { tasty } from "@tenphi/tasty";

package/dist/components/content/Layout/LayoutFooter.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | Cube Dev Team */
 import { _LayoutContent } from "./LayoutContent.js";
 import { c } from "react-compiler-runtime";
 import { tasty } from "@tenphi/tasty";

package/dist/components/content/Layout/LayoutGrid.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | Cube Dev Team */
 import { _LayoutContent } from "./LayoutContent.js";
 import { c } from "react-compiler-runtime";
 import { tasty } from "@tenphi/tasty";

package/dist/components/content/Layout/LayoutHeader.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | Cube Dev Team */
 import { useAutoTooltip } from "../use-auto-tooltip.js";
 import { useI18n } from "../../../i18n/useI18n.js";
 import { Button } from "../../actions/Button/Button.js";

package/dist/components/content/Layout/LayoutPane.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";

package/dist/components/content/Layout/LayoutPanel.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";

package/dist/components/content/Layout/LayoutPanelHeader.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
 import { _Item } from "../Item/Item.js";

package/dist/components/content/Layout/LayoutToolbar.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | Cube Dev Team */
 import { _LayoutContent } from "./LayoutContent.js";
 import { c } from "react-compiler-runtime";
 import { tasty } from "@tenphi/tasty";

package/dist/components/content/Layout/hooks/useTinyScrollbar.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | Cube Dev Team */
 import { c } from "react-compiler-runtime";
 import { useEffect, useRef, useState } from "react";
 

package/dist/components/content/Layout/index.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | Cube Dev Team */
 import { LayoutActionsContext, LayoutContextReset, LayoutPanelContext, LayoutRefsContext, LayoutStateContext, useLayoutActionsContext, useLayoutPanelContext, useLayoutRefsContext, useLayoutStateContext } from "./LayoutContext.js";
 import { _Layout } from "./Layout.js";
 import { _LayoutContent } from "./LayoutContent.js";

package/dist/components/content/Layout/utils.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | Cube Dev Team */
 //#region src/components/content/Layout/utils.ts
 /**
 * Clamps a size value within min/max constraints.

package/dist/components/content/Paragraph.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { _Text } from "./Text.js";
 import { c } from "react-compiler-runtime";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useI18n } from "../../../i18n/useI18n.js";
 import { c } from "react-compiler-runtime";

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","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"],"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 } 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      ref={ref}\n      mods={{ animated: !isStatic, circle }}\n      styles={{\n        height: size,\n        // eslint-disable-next-line tasty/no-style-spread -- consumer styles override the `size`-derived height\n        ...styles,\n      }}\n    />\n  );\n});\n"],"mappings":";;;;;;;;;AAeA,MAAMU,uBAAuBN,UAAU;CACrC,MAAM,EACJ,uBAAuB,OACxB;CACD,QAAQ,EACN,uBAAuB,iCACzB;CACD,CAAC;AAEF,MAAMO,oBAAoBL,MAAM;CAC9BM,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,cAActB,WAAW,SAAAsB,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,MAAc7B,SAAS;CAEvB,MAAAK,SAAaJ,cAAc0B,OAAOlC,iBAAiB;CAGhD,MAAAqC,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,KAAAtC,gBAAgBgC,OAAO,EAAAO,YAAc,MAAM,CAAC;CAE9B,MAAAC,KAAA,CAACf;CAAQ,IAAAgB;AAAA,KAAAZ,EAAA,OAAAd,UAAAc,EAAA,OAAAW,IAAA;AAArBC,OAAA;GAAApB,UAAYmB;GAASzB;GAAU;AAAAc,IAAA,KAAAd;AAAAc,IAAA,KAAAW;AAAAX,IAAA,KAAAY;OAAAA,MAAAZ,EAAA;CAAA,IAAAa;AAAA,KAAAb,EAAA,OAAAL,QAAAK,EAAA,OAAAnB,QAAA;AAC7BgC,OAAA;GAAA9B,QACEY;GAAI,GAETd;GACJ;AAAAmB,IAAA,KAAAL;AAAAK,IAAA,KAAAnB;AAAAmB,IAAA,KAAAa;OAAAA,MAAAb,EAAA;CAAA,IAAAc;AAAA,KAAAd,EAAA,OAAAM,MAAAN,EAAA,OAAAD,OAAAC,EAAA,QAAAQ,MAAAR,EAAA,QAAAS,MAAAT,EAAA,QAAAY,MAAAZ,EAAA,QAAAa,IAAA;AAVHC,OAAA,oBAAC;GACM,MAAAP;GACO,cAAAC;GAAuD,GAC/DC;GACCV;GACC,MAAAa;GACE,QAAAC;IAKR;AAAAb,IAAA,KAAAM;AAAAN,IAAA,KAAAD;AAAAC,IAAA,MAAAQ;AAAAR,IAAA,MAAAS;AAAAT,IAAA,MAAAY;AAAAZ,IAAA,MAAAa;AAAAb,IAAA,MAAAc;OAAAA,MAAAd,EAAA;AAAA,QAXFc;EAaF"}
+{"version":3,"file":"Placeholder.js","names":["BaseProps","CONTAINER_STYLES","ContainerStyleProps","filterBaseProps","keyframes","Styles","tasty","forwardRef","useI18n","extractStyles","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"],"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 } 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      ref={ref}\n      mods={{ animated: !isStatic, circle }}\n      styles={{\n        height: size,\n        ...styles,\n      }}\n    />\n  );\n});\n"],"mappings":";;;;;;;;;AAeA,MAAMU,uBAAuBN,UAAU;CACrC,MAAM,EACJ,uBAAuB,OACxB;CACD,QAAQ,EACN,uBAAuB,iCACzB;CACD,CAAC;AAEF,MAAMO,oBAAoBL,MAAM;CAC9BM,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,cAActB,WAAW,SAAAsB,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,MAAc7B,SAAS;CAEvB,MAAAK,SAAaJ,cAAc0B,OAAOlC,iBAAiB;CAGhD,MAAAqC,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,KAAAtC,gBAAgBgC,OAAO,EAAAO,YAAc,MAAM,CAAC;CAE9B,MAAAC,KAAA,CAACf;CAAQ,IAAAgB;AAAA,KAAAZ,EAAA,OAAAd,UAAAc,EAAA,OAAAW,IAAA;AAArBC,OAAA;GAAApB,UAAYmB;GAASzB;GAAU;AAAAc,IAAA,KAAAd;AAAAc,IAAA,KAAAW;AAAAX,IAAA,KAAAY;OAAAA,MAAAZ,EAAA;CAAA,IAAAa;AAAA,KAAAb,EAAA,OAAAL,QAAAK,EAAA,OAAAnB,QAAA;AAC7BgC,OAAA;GAAA9B,QACEY;GAAI,GACTd;GACJ;AAAAmB,IAAA,KAAAL;AAAAK,IAAA,KAAAnB;AAAAmB,IAAA,KAAAa;OAAAA,MAAAb,EAAA;CAAA,IAAAc;AAAA,KAAAd,EAAA,OAAAM,MAAAN,EAAA,OAAAD,OAAAC,EAAA,QAAAQ,MAAAR,EAAA,QAAAS,MAAAT,EAAA,QAAAY,MAAAZ,EAAA,QAAAa,IAAA;AATHC,OAAA,oBAAC;GACM,MAAAP;GACO,cAAAC;GAAuD,GAC/DC;GACCV;GACC,MAAAa;GACE,QAAAC;IAIR;AAAAb,IAAA,KAAAM;AAAAN,IAAA,KAAAD;AAAAC,IAAA,MAAAQ;AAAAR,IAAA,MAAAS;AAAAT,IAAA,MAAAY;AAAAZ,IAAA,MAAAa;AAAAb,IAAA,MAAAc;OAAAA,MAAAd,EAAA;AAAA,QAVFc;EAYF"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | 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.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | 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.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | 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.d.ts

@@ -1,11 +1,13 @@
 
+import { CubeButtonProps } from "../../actions/Button/Button.js";
 import { BaseProps, ContainerStyleProps } from "@tenphi/tasty";
 import * as react from "react";
 import { ReactNode } from "react";
+import * as _react_types_shared0 from "@react-types/shared";
 
 //#region src/components/content/Result/Result.d.ts
 interface CubeResultProps extends BaseProps, ContainerStyleProps {
-  /** Additional block content. For example, a set of buttons */
+  /** Free content between the text and the actions, e.g. an alert or details */
   children?: ReactNode;
   /** Custom icon element */
   icon?: ReactNode;
@@ -25,11 +27,39 @@ interface CubeResultProps extends BaseProps, ContainerStyleProps {
   subtitle?: ReactNode;
   /** The title */
   title?: ReactNode;
-  /** Whether the result component has a compact presentation */
+  /**
+   * Action buttons, as `Result.Action` elements so they follow the Result's size.
+   * A centered row by default, a full-width column in the `stacked` layout
+   */
+  actions?: ReactNode;
+  /**
+   * Visual scale: the icon size and the title and subtitle presets. Does not change the layout.
+   * Ignored when `isCompact` is set
+   * @default 'medium'
+   */
+  size?: CubeResultSize;
+  /**
+   * Arrangement of the block. `stacked` fills the container and stacks the actions to the full width,
+   * as in a confirmation or result dialog. Combine with `size="large"` for the dialog card.
+   * Ignored when `isCompact` is set
+   * @default 'default'
+   */
+  layout?: CubeResultLayout;
+  /** Whether the result component has a compact presentation. Overrides `size` and `layout` */
   isCompact?: boolean;
 }
+type CubeResultSize = 'medium' | 'large';
+type CubeResultLayout = 'default' | 'stacked';
 type CubeResultStatus = 'success' | 'error' | 'info' | 'warning' | 404 | 403 | 500;
-declare const _Result: react.ForwardRefExoticComponent<CubeResultProps & react.RefAttributes<unknown>>;
+type CubeResultActionProps = CubeButtonProps;
+/**
+ * A `Button` for the Result `actions` slot. Its size follows the Result's `size` unless set.
+ * A link keeps Button's own `inline` size
+ */
+declare const ResultAction: react.ForwardRefExoticComponent<Omit<CubeButtonProps, "ref"> & react.RefAttributes<_react_types_shared0.FocusableRefValue<HTMLElement, HTMLElement>>>;
+declare const _Result: react.ForwardRefExoticComponent<CubeResultProps & react.RefAttributes<unknown>> & {
+  Action: react.ForwardRefExoticComponent<Omit<CubeButtonProps, "ref"> & react.RefAttributes<_react_types_shared0.FocusableRefValue<HTMLElement, HTMLElement>>>;
+};
 //#endregion
-export { CubeResultProps, CubeResultStatus, _Result };
+export { CubeResultActionProps, CubeResultLayout, CubeResultProps, CubeResultSize, CubeResultStatus, ResultAction, _Result };
 //# sourceMappingURL=Result.d.ts.map

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

@@ -1,11 +1,12 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-6df2b58 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-afff9bd | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { wrapNodeIfPlain } from "../../../utils/react/wrapNodeIfPlain.js";
 import { _Title } from "../Title.js";
+import { Button } from "../../actions/Button/Button.js";
 import { c } from "react-compiler-runtime";
 import { CONTAINER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";
-import { forwardRef } from "react";
+import { createContext, forwardRef, useContext } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { IconAlertTriangleFilled, IconCircleCheckFilled, IconCircleXFilled, IconInfoCircleFilled } from "@tabler/icons-react";
 
@@ -14,11 +15,12 @@ const Container = tasty({
 	qa: "ResultContainer",
 	as: "section",
 	styles: {
+		"@in-dialog": "@parent(id=Dialog)",
 		display: {
 			"": "flex",
 			compact: "grid"
 		},
-		gridAreas: "\"icon title\" \"content content\"",
+		gridAreas: "\"icon title\" \"content content\" \"actions actions\"",
 		flow: "column",
 		placeContent: {
 			"": "center",
@@ -29,32 +31,47 @@ const Container = tasty({
 			compact: "start"
 		},
 		gap: {
-			"": "3x",
+			"": "0",
 			compact: "2x 1x"
 		},
 		padding: {
 			"": "6x 4x",
-			compact: "0"
+			compact: "0",
+			"layout=stacked": "1.5x",
+			"layout=stacked & @in-dialog": "0"
 		},
 		textAlign: {
 			"": "center",
 			compact: "left"
 		},
-		width: "max 80ch",
+		boxSizing: "border-box",
+		width: {
+			"": "max 80ch",
+			"layout=stacked": "0 100% 80ch"
+		},
 		margin: {
 			"": "0 auto",
 			compact: "0"
 		},
-		"--icon-size": "6x",
+		"--icon-size": {
+			"": "6x",
+			"size=large": "10x"
+		},
 		Icon: {
 			$: ">",
 			display: "grid",
-			gridArea: "icon"
-		},
-		Content: {
-			$: ">",
-			gridArea: "content",
-			display: "block"
+			gridArea: "icon",
+			padding: {
+				"": "max($icon-size / 4, 3x)",
+				compact: "0"
+			},
+			color: {
+				"": "inherit",
+				"status=info": "#purple",
+				"status=success": "#success",
+				"status=error": "#danger",
+				"status=warning": "#warning"
+			}
 		},
 		Title: {
 			$: ">",
@@ -65,77 +82,144 @@ const Container = tasty({
 			gap: "1x",
 			placeSelf: "center",
 			textWrap: "balance"
+		},
+		Content: {
+			$: ">",
+			gridArea: "content",
+			display: "block",
+			margin: {
+				"": "top 3x",
+				compact: "0"
+			},
+			placeSelf: {
+				"": "auto",
+				"layout=stacked": "stretch"
+			}
+		},
+		Actions: {
+			$: ">",
+			gridArea: "actions",
+			display: "flex",
+			margin: {
+				"": "top 3x",
+				compact: "0"
+			},
+			flow: {
+				"": "row wrap",
+				"layout=stacked": "column"
+			},
+			gap: "1x",
+			placeContent: {
+				"": "center",
+				compact: "start"
+			},
+			placeItems: {
+				"": "center",
+				"layout=stacked": "stretch"
+			},
+			placeSelf: {
+				"": "auto",
+				"layout=stacked": "stretch"
+			}
 		}
 	}
 });
-const statusIconMap = {
-	success: {
-		color: "success",
-		component: () => /* @__PURE__ */ jsx(IconCircleCheckFilled, {})
-	},
-	error: {
-		color: "danger",
-		component: () => /* @__PURE__ */ jsx(IconCircleXFilled, {})
-	},
-	info: {
-		color: "purple",
-		component: () => /* @__PURE__ */ jsx(IconInfoCircleFilled, {})
-	},
-	warning: {
-		color: "warning",
-		component: () => /* @__PURE__ */ jsx(IconAlertTriangleFilled, {})
-	},
-	404: {
-		color: "purple",
-		component: () => {
-			return null;
-		}
-	},
-	403: {
-		color: "purple",
-		component: () => {
-			return null;
-		}
-	},
-	500: {
-		color: "purple",
-		component: () => {
-			return null;
-		}
+const ResultSizeContext = createContext(void 0);
+/**
+* A `Button` for the Result `actions` slot. Its size follows the Result's `size` unless set.
+* A link keeps Button's own `inline` size
+*/
+const ResultAction = forwardRef(function ResultAction(t0, ref) {
+	const $ = c(7);
+	let props;
+	let size;
+	if ($[0] !== t0) {
+		({size, ...props} = t0);
+		$[0] = t0;
+		$[1] = props;
+		$[2] = size;
+	} else {
+		props = $[1];
+		size = $[2];
 	}
+	const resultSize = useContext(ResultSizeContext);
+	const t1 = size ?? (props.type === "link" ? void 0 : resultSize);
+	let t2;
+	if ($[3] !== props || $[4] !== ref || $[5] !== t1) {
+		t2 = /* @__PURE__ */ jsx(Button, {
+			ref,
+			...props,
+			size: t1
+		});
+		$[3] = props;
+		$[4] = ref;
+		$[5] = t1;
+		$[6] = t2;
+	} else t2 = $[6];
+	return t2;
+});
+const statusIconMap = {
+	success: () => /* @__PURE__ */ jsx(IconCircleCheckFilled, {}),
+	error: () => /* @__PURE__ */ jsx(IconCircleXFilled, {}),
+	info: () => /* @__PURE__ */ jsx(IconInfoCircleFilled, {}),
+	warning: () => /* @__PURE__ */ jsx(IconAlertTriangleFilled, {}),
+	404: null,
+	403: null,
+	500: null
 };
 function Result(props, ref) {
-	const $ = c(23);
+	const $ = c(30);
 	let T0;
+	let actions;
 	let children;
+	let size;
 	let t0;
 	let t1;
 	let t2;
 	let t3;
 	let t4;
 	if ($[0] !== props || $[1] !== ref) {
-		const { children: t5, isCompact, icon, status, subTitle, subtitle: t6, title, ...otherProps } = props;
+		const { children: t5, isCompact, icon, status, subTitle, subtitle: t6, title, actions: t7, size: t8, layout: t9, ...otherProps } = props;
 		children = t5;
+		actions = t7;
 		let subtitle = t6;
+		size = t8 === void 0 ? "medium" : t8;
+		let layout = t9 === void 0 ? "default" : t9;
 		subtitle = subtitle ?? subTitle;
 		if (icon && status) console.warn("Don't use \"icon\" and \"status\" together, it can lead to possible errors.");
-		const { color, component: StatusIcon } = status && statusIconMap.hasOwnProperty(status) ? statusIconMap[status] : statusIconMap.info;
-		let t7;
-		if ($[9] !== StatusIcon || $[10] !== color || $[11] !== icon) {
-			t7 = icon || /* @__PURE__ */ jsx("div", {
+		if (isCompact) {
+			size = "medium";
+			layout = "default";
+		}
+		const isLarge = size === "large";
+		const knownStatus = status && statusIconMap.hasOwnProperty(status) ? status : "info";
+		const StatusIcon = statusIconMap[knownStatus];
+		let t10;
+		if ($[11] !== StatusIcon || $[12] !== icon) {
+			t10 = icon || StatusIcon && /* @__PURE__ */ jsx(StatusIcon, {});
+			$[11] = StatusIcon;
+			$[12] = icon;
+			$[13] = t10;
+		} else t10 = $[13];
+		const iconContent = t10;
+		let t11;
+		if ($[14] !== iconContent) {
+			t11 = iconContent && /* @__PURE__ */ jsx("div", {
 				"data-element": "Icon",
-				style: { color: `var(--${color}-color)` },
-				children: /* @__PURE__ */ jsx(StatusIcon, { "data-element": "Icon" })
+				children: iconContent
 			});
-			$[9] = StatusIcon;
-			$[10] = color;
-			$[11] = icon;
-			$[12] = t7;
-		} else t7 = $[12];
-		const iconNode = t7;
+			$[14] = iconContent;
+			$[15] = t11;
+		} else t11 = $[15];
+		const iconNode = t11;
 		const styles = extractStyles(otherProps, CONTAINER_STYLES);
 		T0 = Container;
-		t0 = mergeProps(filterBaseProps(otherProps, { eventProps: true }), { mods: { compact: isCompact } });
+		t0 = mergeProps(filterBaseProps(otherProps, { eventProps: true }), { mods: {
+			compact: isCompact,
+			size,
+			layout,
+			status: icon ? void 0 : knownStatus
+		} });
 		t1 = ref;
 		t2 = styles;
 		t3 = iconNode;
@@ -143,67 +227,87 @@ function Result(props, ref) {
 			"data-element": "Title",
 			children: [wrapNodeIfPlain(title, () => /* @__PURE__ */ jsx(_Title, {
 				level: 2,
-				preset: isCompact ? "h5" : "h4",
+				preset: isCompact ? "h5" : isLarge ? "h2" : "h4",
 				children: title
 			})), wrapNodeIfPlain(subtitle, () => /* @__PURE__ */ jsx(_Title, {
+				slot: "subtitle",
 				level: 3,
-				preset: isCompact ? "t3m" : "t2m",
+				preset: isCompact ? "t3m" : isLarge ? "t2" : "t2m",
 				children: subtitle
 			}))]
 		});
 		$[0] = props;
 		$[1] = ref;
 		$[2] = T0;
-		$[3] = children;
-		$[4] = t0;
-		$[5] = t1;
-		$[6] = t2;
-		$[7] = t3;
-		$[8] = t4;
+		$[3] = actions;
+		$[4] = children;
+		$[5] = size;
+		$[6] = t0;
+		$[7] = t1;
+		$[8] = t2;
+		$[9] = t3;
+		$[10] = t4;
 	} else {
 		T0 = $[2];
-		children = $[3];
-		t0 = $[4];
-		t1 = $[5];
-		t2 = $[6];
-		t3 = $[7];
-		t4 = $[8];
+		actions = $[3];
+		children = $[4];
+		size = $[5];
+		t0 = $[6];
+		t1 = $[7];
+		t2 = $[8];
+		t3 = $[9];
+		t4 = $[10];
 	}
 	let t5;
-	if ($[13] !== children) {
+	if ($[16] !== children) {
 		t5 = children && /* @__PURE__ */ jsx("div", {
 			"data-element": "Content",
 			children
 		});
-		$[13] = children;
-		$[14] = t5;
-	} else t5 = $[14];
+		$[16] = children;
+		$[17] = t5;
+	} else t5 = $[17];
 	let t6;
-	if ($[15] !== T0 || $[16] !== t0 || $[17] !== t1 || $[18] !== t2 || $[19] !== t3 || $[20] !== t4 || $[21] !== t5) {
-		t6 = /* @__PURE__ */ jsxs(T0, {
+	if ($[18] !== actions || $[19] !== size) {
+		t6 = actions && /* @__PURE__ */ jsx("div", {
+			"data-element": "Actions",
+			children: /* @__PURE__ */ jsx(ResultSizeContext.Provider, {
+				value: size,
+				children: actions
+			})
+		});
+		$[18] = actions;
+		$[19] = size;
+		$[20] = t6;
+	} else t6 = $[20];
+	let t7;
+	if ($[21] !== T0 || $[22] !== t0 || $[23] !== t1 || $[24] !== t2 || $[25] !== t3 || $[26] !== t4 || $[27] !== t5 || $[28] !== t6) {
+		t7 = /* @__PURE__ */ jsxs(T0, {
 			...t0,
 			ref: t1,
 			styles: t2,
 			children: [
 				t3,
 				t4,
-				t5
+				t5,
+				t6
 			]
 		});
-		$[15] = T0;
-		$[16] = t0;
-		$[17] = t1;
-		$[18] = t2;
-		$[19] = t3;
-		$[20] = t4;
-		$[21] = t5;
-		$[22] = t6;
-	} else t6 = $[22];
-	return t6;
+		$[21] = T0;
+		$[22] = t0;
+		$[23] = t1;
+		$[24] = t2;
+		$[25] = t3;
+		$[26] = t4;
+		$[27] = t5;
+		$[28] = t6;
+		$[29] = t7;
+	} else t7 = $[29];
+	return t7;
 }
-const _Result = forwardRef(Result);
+const _Result = Object.assign(forwardRef(Result), { Action: ResultAction });
 _Result.displayName = "Result";
 
 //#endregion
-export { _Result };
+export { ResultAction, _Result };
 //# sourceMappingURL=Result.js.map