@dynatrace/strato-components 3.13.2 → 3.14.0

package/esm/content/chip-group/Control.js

@@ -1,4 +1,4 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 import clsx from "clsx";
 import {
   useEffect,
@@ -6,13 +6,13 @@ import {
   useRef
 } from "react";
 import { useIntl } from "react-intl";
+import { COMPONENT_NAME } from "./chip-group-constants.js";
 import * as styles from "./Control.sty.js";
 import { useChipGroupContext } from "./hooks/useChipGroupContext.js";
 import { useInternalChipGroupContext } from "./hooks/useInternalChipGroupContext.js";
 import { ChipGroupActions } from "./state/chip-group-state-reducer.js";
+import { InlineButton } from "../../buttons/inline-button/InlineButton.js";
 import { useContainerSize } from "../../core/hooks/useContainerSize.js";
-import { useFocusRing } from "../../core/hooks/useFocusRing.js";
-import { ProgressCircle } from "../progress/ProgressCircle.js";
 const Control = (props) => {
   const {
     display,
@@ -25,9 +25,6 @@ const Control = (props) => {
     "data-testid": dataTestId
   } = props;
   const intl = useIntl();
-  const { focusProps, focusClassName, isFocusVisible } = useFocusRing({
-    color: "neutral"
-  });
   const { hiddenKeys, visibleKeys } = useChipGroupContext();
   const internalChipGroupContext = useInternalChipGroupContext();
   const {
@@ -82,45 +79,35 @@ const Control = (props) => {
   if (shouldHide) {
     return null;
   }
-  return /* @__PURE__ */ jsxs(
-    "button",
+  const isShowingLess = expanded && display !== "more";
+  return /* @__PURE__ */ jsx(
+    InlineButton,
     {
-      "data-testid": dataTestId,
+      as: "button",
       ref: controlRef,
+      "data-testid": dataTestId,
+      "data-dt-children-name": "ShowMoreLess",
+      "data-dt-properties": isShowingLess ? "state:less" : "state:more",
+      loading,
       onClick: (event) => {
         onClick?.(event);
         const isExpanding = display === "more" || !expanded;
-        if (isExpanding && hiddenKeys.length > 0) {
+        const firstHiddenKey = hiddenKeys[0];
+        if (isExpanding && firstHiddenKey !== void 0) {
           setPendingFocusChip?.({
-            uniqueId: hiddenKeys[0],
-            showFocusRing: isFocusVisible
+            uniqueId: firstHiddenKey,
+            // Use :focus-visible to detect input modality — event.detail is unreliable with NVDA (synthesizes pointer clicks via MSAA).
+            showFocusRing: controlRef.current?.matches(":focus-visible") ?? false
           });
         }
         setExpanded?.((prev) => display === "more" ? true : !prev);
       },
       "aria-controls": chipGroupId,
       "aria-expanded": expanded,
-      className: clsx(
-        styles.expandButton({ isFocusVisible }),
-        focusClassName,
-        consumerClassName
-      ),
+      className: clsx(styles.expandButton, consumerClassName),
       style: consumerStyle,
-      ...focusProps,
-      children: [
-        loading && /* @__PURE__ */ jsx(
-          ProgressCircle,
-          {
-            size: "small",
-            "aria-label": intl.formatMessage({
-              defaultMessage: "Loading",
-              id: "cycz+bYG+VH7Of4e",
-              description: "Label for the loading state."
-            })
-          }
-        ),
-        children ?? label
-      ]
+      "data-dt-component": COMPONENT_NAME,
+      children: children ?? label
     }
   );
 };

package/esm/content/chip-group/Control.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/content/chip-group/Control.tsx"],
-  "sourcesContent": ["import clsx from 'clsx';\nimport {\n  useEffect,\n  useMemo,\n  useRef,\n  type MouseEventHandler as ReactMouseEventHandler,\n  type MouseEvent as ReactMouseEvent,\n} from 'react';\nimport { useIntl } from 'react-intl';\n\nimport * as styles from './Control.sty.js';\nimport { useChipGroupContext } from './hooks/useChipGroupContext.js';\nimport { useInternalChipGroupContext } from './hooks/useInternalChipGroupContext.js';\nimport { ChipGroupActions } from './state/chip-group-state-reducer.js';\nimport { useContainerSize } from '../../core/hooks/useContainerSize.js';\nimport { useFocusRing } from '../../core/hooks/useFocusRing.js';\nimport { DataTestId } from '../../core/types/data-props.js';\nimport { StylingProps } from '../../core/types/styling-props.js';\nimport { WithChildren } from '../../core/types/with-children.js';\nimport { ProgressCircle } from '../progress/ProgressCircle.js';\n\n//#region Types\n\n/**\n * @public\n */\nexport interface ChipGroupControlProps\n  extends WithChildren, StylingProps, DataTestId {\n  /**\n   * Whether to show more chips or collapse chips.\n   * If undefined, the action is inferred.\n   * If no more items are available and all items fit in one line,\n   * the control is automatically hidden unless display is set.\n   * @defaultValue inferred from the `expanded` / `defaultExpanded` prop of the `ChipGroup`\n   */\n  display?: 'more' | 'less';\n\n  /**\n   * Whether to render `Show more` or `Show x more` by default.\n   * If true, the count is calculated automatically. The count can be overridden\n   * by passing a number.\n   * @defaultValue undefined\n   */\n  count?: boolean | number;\n\n  /**\n   * Whether the control should show the loading indicator.\n   * @defaultValue false\n   */\n  loading?: boolean;\n\n  /** Callback triggered when the control is interacted with. */\n  onClick?: ReactMouseEventHandler<HTMLButtonElement>;\n}\n//#endregion\n\n/**\n * @public\n */\nexport const Control = (props: ChipGroupControlProps) => {\n  const {\n    display,\n    count,\n    loading = false,\n    onClick,\n    children,\n    className: consumerClassName,\n    style: consumerStyle,\n    'data-testid': dataTestId,\n  }: ChipGroupControlProps = props;\n  const intl = useIntl();\n\n  const { focusProps, focusClassName, isFocusVisible } = useFocusRing({\n    color: 'neutral',\n  });\n\n  const { hiddenKeys, visibleKeys } = useChipGroupContext();\n  const internalChipGroupContext = useInternalChipGroupContext();\n  const {\n    chipGroupId,\n    expanded,\n    allChipsFit,\n    setExpanded,\n    dispatch,\n    setPendingFocusChip,\n  } = internalChipGroupContext || {};\n\n  const controlRef = useRef<HTMLButtonElement | null>(null);\n  const { width: controlWidth } = useContainerSize(controlRef);\n  const width = Math.ceil(controlWidth);\n\n  const label = useMemo(() => {\n    const moreOrLess = expanded && display !== 'more' ? 'less' : 'more';\n    const hiddenChipsCount =\n      count === true && hiddenKeys.length > 0 ? hiddenKeys.length : count;\n    const showCount =\n      typeof hiddenChipsCount === 'number' && moreOrLess === 'more';\n\n    return intl.formatMessage(\n      {\n        defaultMessage: 'Show {count} {moreOrLess}',\n        id: 'ARdI7d8cJxHnUayP',\n        description: 'Label for the expand / collapse button.',\n      },\n      {\n        moreOrLess: expanded && display !== 'more' ? 'less' : 'more',\n        count: showCount ? hiddenChipsCount : undefined,\n      },\n    );\n  }, [count, display, expanded, hiddenKeys, intl]);\n\n  useEffect(() => {\n    dispatch?.({\n      type: ChipGroupActions.ADDCONTROL,\n      payload: { width },\n    });\n\n    return () => {\n      dispatch?.({\n        type: ChipGroupActions.REMOVECONTROL,\n        payload: {},\n      });\n    };\n    // only for mount and unmount\n    // oxlint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffect(() => {\n    dispatch?.({\n      type: ChipGroupActions.UPDATECONTROL,\n      payload: {\n        width: width === 0 ? undefined : width,\n        show: display !== undefined ? 'always' : 'auto',\n      },\n    });\n  }, [dispatch, display, width]);\n\n  const shouldHide =\n    display === undefined &&\n    (allChipsFit || visibleKeys.length === 0) &&\n    !loading;\n\n  if (shouldHide) {\n    return null;\n  }\n\n  return (\n    <button\n      data-testid={dataTestId}\n      ref={controlRef}\n      onClick={(event: ReactMouseEvent<HTMLButtonElement>) => {\n        onClick?.(event);\n        const isExpanding = display === 'more' || !expanded;\n        if (isExpanding && hiddenKeys.length > 0) {\n          setPendingFocusChip?.({\n            uniqueId: hiddenKeys[0],\n            showFocusRing: isFocusVisible,\n          });\n        }\n        setExpanded?.((prev) => (display === 'more' ? true : !prev));\n      }}\n      aria-controls={chipGroupId}\n      aria-expanded={expanded}\n      className={clsx(\n        styles.expandButton({ isFocusVisible }),\n        focusClassName,\n        consumerClassName,\n      )}\n      style={consumerStyle}\n      {...focusProps}\n    >\n      {loading && (\n        <ProgressCircle\n          size=\"small\"\n          aria-label={intl.formatMessage({\n            defaultMessage: 'Loading',\n            id: 'cycz+bYG+VH7Of4e',\n            description: 'Label for the loading state.',\n          })}\n        />\n      )}\n      {children ?? label}\n    </button>\n  );\n};\n"],
-  "mappings": "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",
+  "sourcesContent": ["import clsx from 'clsx';\nimport {\n  useEffect,\n  useMemo,\n  useRef,\n  type MouseEvent as ReactMouseEvent,\n  type MouseEventHandler as ReactMouseEventHandler,\n} from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { COMPONENT_NAME } from './chip-group-constants.js';\nimport * as styles from './Control.sty.js';\nimport { useChipGroupContext } from './hooks/useChipGroupContext.js';\nimport { useInternalChipGroupContext } from './hooks/useInternalChipGroupContext.js';\nimport { ChipGroupActions } from './state/chip-group-state-reducer.js';\nimport { InlineButton } from '../../buttons/inline-button/InlineButton.js';\nimport { useContainerSize } from '../../core/hooks/useContainerSize.js';\nimport { DataTestId } from '../../core/types/data-props.js';\nimport { StylingProps } from '../../core/types/styling-props.js';\nimport { WithChildren } from '../../core/types/with-children.js';\n\n//#region Types\n\n/**\n * @public\n */\nexport interface ChipGroupControlProps\n  extends WithChildren, StylingProps, DataTestId {\n  /**\n   * Whether to show more chips or collapse chips.\n   * If undefined, the action is inferred.\n   * If no more items are available and all items fit in one line,\n   * the control is automatically hidden unless display is set.\n   * @defaultValue inferred from the `expanded` / `defaultExpanded` prop of the `ChipGroup`\n   */\n  display?: 'more' | 'less';\n\n  /**\n   * Whether to render `Show more` or `Show x more` by default.\n   * If true, the count is calculated automatically. The count can be overridden\n   * by passing a number.\n   * @defaultValue undefined\n   */\n  count?: boolean | number;\n\n  /**\n   * Whether the control should show the loading indicator.\n   * @defaultValue false\n   */\n  loading?: boolean;\n\n  /** Callback triggered when the control is interacted with. */\n  onClick?: ReactMouseEventHandler<HTMLButtonElement>;\n}\n//#endregion\n\n/**\n * @public\n */\nexport const Control = (props: ChipGroupControlProps) => {\n  const {\n    display,\n    count,\n    loading = false,\n    onClick,\n    children,\n    className: consumerClassName,\n    style: consumerStyle,\n    'data-testid': dataTestId,\n  }: ChipGroupControlProps = props;\n  const intl = useIntl();\n\n  const { hiddenKeys, visibleKeys } = useChipGroupContext();\n  const internalChipGroupContext = useInternalChipGroupContext();\n  const {\n    chipGroupId,\n    expanded,\n    allChipsFit,\n    setExpanded,\n    dispatch,\n    setPendingFocusChip,\n  } = internalChipGroupContext || {};\n\n  const controlRef = useRef<HTMLButtonElement | null>(null);\n  const { width: controlWidth } = useContainerSize(controlRef);\n  const width = Math.ceil(controlWidth);\n\n  const label = useMemo(() => {\n    const moreOrLess = expanded && display !== 'more' ? 'less' : 'more';\n    const hiddenChipsCount =\n      count === true && hiddenKeys.length > 0 ? hiddenKeys.length : count;\n    const showCount =\n      typeof hiddenChipsCount === 'number' && moreOrLess === 'more';\n\n    return intl.formatMessage(\n      {\n        defaultMessage: 'Show {count} {moreOrLess}',\n        id: 'ARdI7d8cJxHnUayP',\n        description: 'Label for the expand / collapse button.',\n      },\n      {\n        moreOrLess: expanded && display !== 'more' ? 'less' : 'more',\n        count: showCount ? hiddenChipsCount : undefined,\n      },\n    );\n  }, [count, display, expanded, hiddenKeys, intl]);\n\n  useEffect(() => {\n    dispatch?.({\n      type: ChipGroupActions.ADDCONTROL,\n      payload: { width },\n    });\n\n    return () => {\n      dispatch?.({\n        type: ChipGroupActions.REMOVECONTROL,\n        payload: {},\n      });\n    };\n    // only for mount and unmount\n    // oxlint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffect(() => {\n    dispatch?.({\n      type: ChipGroupActions.UPDATECONTROL,\n      payload: {\n        width: width === 0 ? undefined : width,\n        show: display !== undefined ? 'always' : 'auto',\n      },\n    });\n  }, [dispatch, display, width]);\n\n  const shouldHide =\n    display === undefined &&\n    (allChipsFit || visibleKeys.length === 0) &&\n    !loading;\n\n  if (shouldHide) {\n    return null;\n  }\n\n  const isShowingLess = expanded && display !== 'more';\n\n  return (\n    <InlineButton\n      as=\"button\"\n      ref={controlRef}\n      data-testid={dataTestId}\n      data-dt-children-name=\"ShowMoreLess\"\n      data-dt-properties={isShowingLess ? 'state:less' : 'state:more'}\n      loading={loading}\n      onClick={(event) => {\n        onClick?.(event as ReactMouseEvent<HTMLButtonElement>);\n        const isExpanding = display === 'more' || !expanded;\n        const firstHiddenKey = hiddenKeys[0];\n        if (isExpanding && firstHiddenKey !== undefined) {\n          setPendingFocusChip?.({\n            uniqueId: firstHiddenKey,\n            // Use :focus-visible to detect input modality \u2014 event.detail is unreliable with NVDA (synthesizes pointer clicks via MSAA).\n            showFocusRing:\n              controlRef.current?.matches(':focus-visible') ?? false,\n          });\n        }\n        setExpanded?.((prev) => (display === 'more' ? true : !prev));\n      }}\n      aria-controls={chipGroupId}\n      aria-expanded={expanded}\n      className={clsx(styles.expandButton, consumerClassName)}\n      style={consumerStyle}\n      data-dt-component={COMPONENT_NAME}\n    >\n      {children ?? label}\n    </InlineButton>\n  );\n};\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/content/chip-group/Control.sty.js

@@ -1,6 +1,5 @@
 import "./Control.css";
-import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var expandButton = _7a468({ defaultClassName: "_uoyq2d0-3-13-2", variantClassNames: { isFocusVisible: { true: "_uoyq2d1-3-13-2", false: "_uoyq2d2-3-13-2" } }, defaultVariants: {}, compoundVariants: [] });
+var expandButton = "_uoyq2d0-3-14-0";
 export {
   expandButton
 };

package/esm/content/chip-group/Control.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/content/chip-group/Control.css.ts"],
-  "sourcesContent": ["import './Control.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var expandButton = _7a468({defaultClassName:'_uoyq2d0-3-13-2',variantClassNames:{isFocusVisible:{true:'_uoyq2d1-3-13-2',false:'_uoyq2d2-3-13-2'}},defaultVariants:{},compoundVariants:[]});"],
-  "mappings": "AAAA,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,eAAe,OAAO,EAAC,kBAAiB,mBAAkB,mBAAkB,EAAC,gBAAe,EAAC,MAAK,mBAAkB,OAAM,kBAAiB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,EAAC,CAAC;",
+  "sourcesContent": ["import './Control.css';\nexport var expandButton = '_uoyq2d0-3-14-0';"],
+  "mappings": "AAAA,OAAO;AACA,IAAI,eAAe;",
   "names": []
 }

package/esm/content/chip-group/chip-group-constants.js

@@ -0,0 +1,5 @@
+const COMPONENT_NAME = "ChipGroup";
+export {
+  COMPONENT_NAME
+};
+//# sourceMappingURL=chip-group-constants.js.map

package/esm/content/chip-group/chip-group-constants.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/content/chip-group/chip-group-constants.ts"],
+  "sourcesContent": ["/**\n * @internal\n */\nexport const COMPONENT_NAME = 'ChipGroup';\n"],
+  "mappings": "AAGO,MAAM,iBAAiB;",
+  "names": []
+}

package/esm/content/code-snippet/CodeHighlight.css

@@ -1,4 +1,4 @@
-._1jmxup81-3-13-2 {
+._1jmxup81-3-14-0 {
   margin: 0;
   padding: 0;
   overflow: visible;
@@ -8,19 +8,19 @@
   font-weight: var(--dt-typography-code-base-default-weight, 400);
   word-break: break-word;
 }
-._1jmxup82-3-13-2 {
+._1jmxup82-3-14-0 {
   font-family: var(--dt-typography-code-base-default-family, Roboto Mono,monospace);
   font-size: var(--dt-typography-code-base-default-size, 14px);
   line-height: var(--dt-typography-code-base-default-line-height, 1.4285714286);
   min-height: calc(2 * var(--dt-spacings-size-12, 12px) + var(--dt-spacings-size-20, 20px));
 }
-._1jmxup83-3-13-2 {
+._1jmxup83-3-14-0 {
   font-family: var(--dt-typography-code-small-default-family, Roboto Mono,monospace);
   font-size: var(--dt-typography-code-small-default-size, 12px);
   line-height: var(--dt-typography-code-small-default-line-height, 1.333333333);
   min-height: calc(2 * var(--dt-spacings-size-6, 6px) + var(--dt-spacings-size-16, 16px));
 }
-._1jmxup84-3-13-2 {
+._1jmxup84-3-14-0 {
   display: table-cell;
   position: sticky;
   left: 0;
@@ -32,75 +32,75 @@
   background-color: var(--dt-colors-background-container-neutral-subdued, #f9f9fa);
   user-select: none;
 }
-._1jgl8s50-3-13-2 ._1jmxup84-3-13-2 {
+._1jgl8s50-3-14-0 ._1jmxup84-3-14-0 {
   border-right-width: var(--dt-borders-width-default, 1px);
 }
-._1jmxup85-3-13-2 {
+._1jmxup85-3-14-0 {
   white-space: nowrap;
 }
-._1jmxup86-3-13-2 {
+._1jmxup86-3-14-0 {
   white-space: pre;
 }
-._1jmxup87-3-13-2 {
+._1jmxup87-3-14-0 {
   display: table-row;
 }
-._1jmxup88-3-13-2 {
+._1jmxup88-3-14-0 {
   display: block;
   box-sizing: border-box;
   pointer-events: none;
   user-select: none;
   -webkit-user-select: none;
 }
-._1jmxup88-3-13-2::before {
+._1jmxup88-3-14-0::before {
   content: attr(data-linenumber);
 }
-._1jmxup82-3-13-2 ._1jmxup87-3-13-2:first-child ._1jmxup88-3-13-2 {
+._1jmxup82-3-14-0 ._1jmxup87-3-14-0:first-child ._1jmxup88-3-14-0 {
   padding-top: var(--dt-spacings-size-12, 12px);
 }
-._1jmxup83-3-13-2 ._1jmxup87-3-13-2:first-child ._1jmxup88-3-13-2 {
+._1jmxup83-3-14-0 ._1jmxup87-3-14-0:first-child ._1jmxup88-3-14-0 {
   padding-top: var(--dt-spacings-size-6, 6px);
 }
-._1jmxup82-3-13-2 ._1jmxup87-3-13-2:last-child ._1jmxup88-3-13-2 {
+._1jmxup82-3-14-0 ._1jmxup87-3-14-0:last-child ._1jmxup88-3-14-0 {
   padding-bottom: var(--dt-spacings-size-12, 12px);
 }
-._1jmxup83-3-13-2 ._1jmxup87-3-13-2:last-child ._1jmxup88-3-13-2 {
+._1jmxup83-3-14-0 ._1jmxup87-3-14-0:last-child ._1jmxup88-3-14-0 {
   padding-bottom: var(--dt-spacings-size-6, 6px);
 }
-._1jmxup89-3-13-2 {
+._1jmxup89-3-14-0 {
   padding-left: var(--dt-spacings-size-16, 16px);
   min-width: 33px;
 }
-._1jmxup8a-3-13-2 {
+._1jmxup8a-3-14-0 {
   padding-left: var(--dt-spacings-size-12, 12px);
   min-width: 27px;
 }
-._1jmxup8c-3-13-2 {
+._1jmxup8c-3-14-0 {
   white-space: pre;
 }
-._1jmxup8d-3-13-2 {
+._1jmxup8d-3-14-0 {
   display: table-cell;
   width: 100%;
 }
-._1jmxup82-3-13-2 ._1jmxup87-3-13-2:first-child ._1jmxup8d-3-13-2 {
+._1jmxup82-3-14-0 ._1jmxup87-3-14-0:first-child ._1jmxup8d-3-14-0 {
   padding-top: var(--dt-spacings-size-12, 12px);
 }
-._1jmxup83-3-13-2 ._1jmxup87-3-13-2:first-child ._1jmxup8d-3-13-2 {
+._1jmxup83-3-14-0 ._1jmxup87-3-14-0:first-child ._1jmxup8d-3-14-0 {
   padding-top: var(--dt-spacings-size-6, 6px);
 }
-._1jmxup82-3-13-2 ._1jmxup87-3-13-2:last-child ._1jmxup8d-3-13-2 {
+._1jmxup82-3-14-0 ._1jmxup87-3-14-0:last-child ._1jmxup8d-3-14-0 {
   padding-bottom: var(--dt-spacings-size-12, 12px);
 }
-._1jmxup83-3-13-2 ._1jmxup87-3-13-2:last-child ._1jmxup8d-3-13-2 {
+._1jmxup83-3-14-0 ._1jmxup87-3-14-0:last-child ._1jmxup8d-3-14-0 {
   padding-bottom: var(--dt-spacings-size-6, 6px);
 }
-._1jmxup8e-3-13-2 {
+._1jmxup8e-3-14-0 {
   padding-left: var(--dt-spacings-size-16, 16px);
   padding-right: var(--dt-spacings-size-8, 8px);
 }
-._1jmxup8f-3-13-2 {
+._1jmxup8f-3-14-0 {
   padding-left: var(--dt-spacings-size-12, 12px);
   padding-right: var(--dt-spacings-size-6, 6px);
 }
-._1jmxup8h-3-13-2 {
+._1jmxup8h-3-14-0 {
   white-space: pre;
 }

package/esm/content/code-snippet/CodeHighlight.sty.js

@@ -1,12 +1,12 @@
 import "../../core/components/app-root/AppRoot.css";
 import "./CodeHighlight.css";
 import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var gutterColumnWidth = "var(--_1jmxup80-3-13-2)";
-var highlightWrapper = _7a468({ defaultClassName: "_1jmxup81-3-13-2", variantClassNames: { size: { "default": "_1jmxup82-3-13-2", condensed: "_1jmxup83-3-13-2" } }, defaultVariants: { size: "default" }, compoundVariants: [] });
-var line = "_1jmxup87-3-13-2";
-var lineContent = _7a468({ defaultClassName: "_1jmxup8d-3-13-2", variantClassNames: { size: { "default": "_1jmxup8e-3-13-2", condensed: "_1jmxup8f-3-13-2" }, multiLine: { false: "_1jmxup8g-3-13-2", true: "_1jmxup8h-3-13-2" } }, defaultVariants: { size: "default", multiLine: false }, compoundVariants: [] });
-var lineNumber = _7a468({ defaultClassName: "_1jmxup88-3-13-2", variantClassNames: { size: { "default": "_1jmxup89-3-13-2", condensed: "_1jmxup8a-3-13-2" }, multiLine: { false: "_1jmxup8b-3-13-2", true: "_1jmxup8c-3-13-2" } }, defaultVariants: { size: "default", multiLine: false }, compoundVariants: [] });
-var lineNumberContainer = _7a468({ defaultClassName: "_1jmxup84-3-13-2", variantClassNames: { multiLine: { false: "_1jmxup85-3-13-2", true: "_1jmxup86-3-13-2" } }, defaultVariants: { multiLine: false }, compoundVariants: [] });
+var gutterColumnWidth = "var(--_1jmxup80-3-14-0)";
+var highlightWrapper = _7a468({ defaultClassName: "_1jmxup81-3-14-0", variantClassNames: { size: { "default": "_1jmxup82-3-14-0", condensed: "_1jmxup83-3-14-0" } }, defaultVariants: { size: "default" }, compoundVariants: [] });
+var line = "_1jmxup87-3-14-0";
+var lineContent = _7a468({ defaultClassName: "_1jmxup8d-3-14-0", variantClassNames: { size: { "default": "_1jmxup8e-3-14-0", condensed: "_1jmxup8f-3-14-0" }, multiLine: { false: "_1jmxup8g-3-14-0", true: "_1jmxup8h-3-14-0" } }, defaultVariants: { size: "default", multiLine: false }, compoundVariants: [] });
+var lineNumber = _7a468({ defaultClassName: "_1jmxup88-3-14-0", variantClassNames: { size: { "default": "_1jmxup89-3-14-0", condensed: "_1jmxup8a-3-14-0" }, multiLine: { false: "_1jmxup8b-3-14-0", true: "_1jmxup8c-3-14-0" } }, defaultVariants: { size: "default", multiLine: false }, compoundVariants: [] });
+var lineNumberContainer = _7a468({ defaultClassName: "_1jmxup84-3-14-0", variantClassNames: { multiLine: { false: "_1jmxup85-3-14-0", true: "_1jmxup86-3-14-0" } }, defaultVariants: { multiLine: false }, compoundVariants: [] });
 var lineNumberMinWidth = { "default": "33px", condensed: "27px" };
 export {
   gutterColumnWidth,

package/esm/content/code-snippet/CodeHighlight.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/content/code-snippet/CodeHighlight.css.ts"],
-  "sourcesContent": ["import '../../core/components/app-root/AppRoot.css';\nimport './CodeHighlight.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var gutterColumnWidth = 'var(--_1jmxup80-3-13-2)';\nexport var highlightWrapper = _7a468({defaultClassName:'_1jmxup81-3-13-2',variantClassNames:{size:{'default':'_1jmxup82-3-13-2',condensed:'_1jmxup83-3-13-2'}},defaultVariants:{size:'default'},compoundVariants:[]});\nexport var line = '_1jmxup87-3-13-2';\nexport var lineContent = _7a468({defaultClassName:'_1jmxup8d-3-13-2',variantClassNames:{size:{'default':'_1jmxup8e-3-13-2',condensed:'_1jmxup8f-3-13-2'},multiLine:{false:'_1jmxup8g-3-13-2',true:'_1jmxup8h-3-13-2'}},defaultVariants:{size:'default',multiLine:false},compoundVariants:[]});\nexport var lineNumber = _7a468({defaultClassName:'_1jmxup88-3-13-2',variantClassNames:{size:{'default':'_1jmxup89-3-13-2',condensed:'_1jmxup8a-3-13-2'},multiLine:{false:'_1jmxup8b-3-13-2',true:'_1jmxup8c-3-13-2'}},defaultVariants:{size:'default',multiLine:false},compoundVariants:[]});\nexport var lineNumberContainer = _7a468({defaultClassName:'_1jmxup84-3-13-2',variantClassNames:{multiLine:{false:'_1jmxup85-3-13-2',true:'_1jmxup86-3-13-2'}},defaultVariants:{multiLine:false},compoundVariants:[]});\nexport var lineNumberMinWidth = {'default':'33px',condensed:'27px'};"],
+  "sourcesContent": ["import '../../core/components/app-root/AppRoot.css';\nimport './CodeHighlight.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var gutterColumnWidth = 'var(--_1jmxup80-3-14-0)';\nexport var highlightWrapper = _7a468({defaultClassName:'_1jmxup81-3-14-0',variantClassNames:{size:{'default':'_1jmxup82-3-14-0',condensed:'_1jmxup83-3-14-0'}},defaultVariants:{size:'default'},compoundVariants:[]});\nexport var line = '_1jmxup87-3-14-0';\nexport var lineContent = _7a468({defaultClassName:'_1jmxup8d-3-14-0',variantClassNames:{size:{'default':'_1jmxup8e-3-14-0',condensed:'_1jmxup8f-3-14-0'},multiLine:{false:'_1jmxup8g-3-14-0',true:'_1jmxup8h-3-14-0'}},defaultVariants:{size:'default',multiLine:false},compoundVariants:[]});\nexport var lineNumber = _7a468({defaultClassName:'_1jmxup88-3-14-0',variantClassNames:{size:{'default':'_1jmxup89-3-14-0',condensed:'_1jmxup8a-3-14-0'},multiLine:{false:'_1jmxup8b-3-14-0',true:'_1jmxup8c-3-14-0'}},defaultVariants:{size:'default',multiLine:false},compoundVariants:[]});\nexport var lineNumberContainer = _7a468({defaultClassName:'_1jmxup84-3-14-0',variantClassNames:{multiLine:{false:'_1jmxup85-3-14-0',true:'_1jmxup86-3-14-0'}},defaultVariants:{multiLine:false},compoundVariants:[]});\nexport var lineNumberMinWidth = {'default':'33px',condensed:'27px'};"],
   "mappings": "AAAA,OAAO;AACP,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,oBAAoB;AACxB,IAAI,mBAAmB,OAAO,EAAC,kBAAiB,oBAAmB,mBAAkB,EAAC,MAAK,EAAC,WAAU,oBAAmB,WAAU,mBAAkB,EAAC,GAAE,iBAAgB,EAAC,MAAK,UAAS,GAAE,kBAAiB,CAAC,EAAC,CAAC;AAC7M,IAAI,OAAO;AACX,IAAI,cAAc,OAAO,EAAC,kBAAiB,oBAAmB,mBAAkB,EAAC,MAAK,EAAC,WAAU,oBAAmB,WAAU,mBAAkB,GAAE,WAAU,EAAC,OAAM,oBAAmB,MAAK,mBAAkB,EAAC,GAAE,iBAAgB,EAAC,MAAK,WAAU,WAAU,MAAK,GAAE,kBAAiB,CAAC,EAAC,CAAC;AACrR,IAAI,aAAa,OAAO,EAAC,kBAAiB,oBAAmB,mBAAkB,EAAC,MAAK,EAAC,WAAU,oBAAmB,WAAU,mBAAkB,GAAE,WAAU,EAAC,OAAM,oBAAmB,MAAK,mBAAkB,EAAC,GAAE,iBAAgB,EAAC,MAAK,WAAU,WAAU,MAAK,GAAE,kBAAiB,CAAC,EAAC,CAAC;AACpR,IAAI,sBAAsB,OAAO,EAAC,kBAAiB,oBAAmB,mBAAkB,EAAC,WAAU,EAAC,OAAM,oBAAmB,MAAK,mBAAkB,EAAC,GAAE,iBAAgB,EAAC,WAAU,MAAK,GAAE,kBAAiB,CAAC,EAAC,CAAC;AAC7M,IAAI,qBAAqB,EAAC,WAAU,QAAO,WAAU,OAAM;",
   "names": []
 }

package/esm/content/code-snippet/CodeSnippet.css

@@ -1,4 +1,4 @@
-._17pa72a1-3-13-2 {
+._17pa72a1-3-14-0 {
   position: relative;
   display: flex;
   border-radius: var(--dt-borders-radius-container-subdued, 6px);
@@ -9,36 +9,36 @@
   overflow: auto;
   background-color: var(--dt-colors-background-surface-default, #fff);
 }
-._1jgl8s50-3-13-2 ._17pa72a1-3-13-2 {
+._1jgl8s50-3-14-0 ._17pa72a1-3-14-0 {
   border-width: var(--dt-borders-width-default, 1px);
 }
-._17pa72a2-3-13-2 {
+._17pa72a2-3-14-0 {
   min-height: 100%;
   max-height: 100%;
 }
-._17pa72a3-3-13-2 {
-  --_17pa72a0-3-13-2: var(--dt-borders-width-emphasized, 2px);
+._17pa72a3-3-14-0 {
+  --_17pa72a0-3-14-0: var(--dt-borders-width-emphasized, 2px);
 }
-._1jgl8s50-3-13-2 ._17pa72a3-3-13-2 {
-  --_17pa72a0-3-13-2: var(--dt-borders-width-default, 1px);
+._1jgl8s50-3-14-0 ._17pa72a3-3-14-0 {
+  --_17pa72a0-3-14-0: var(--dt-borders-width-default, 1px);
 }
-._17pa72a3-3-13-2::before {
+._17pa72a3-3-14-0::before {
   content: "";
   position: sticky;
   left: 0;
   flex-shrink: 0;
-  width: var(--_1jmxup80-3-13-2);
-  margin-right: calc(-1 * var(--_1jmxup80-3-13-2));
+  width: var(--_1jmxup80-3-14-0);
+  margin-right: calc(-1 * var(--_1jmxup80-3-14-0));
   background-color: var(--dt-colors-background-container-neutral-subdued, #f9f9fa);
-  box-shadow: inset calc(-1 * var(--_17pa72a0-3-13-2)) 0 0 0 var(--dt-colors-border-neutral-default, #dadbe4);
+  box-shadow: inset calc(-1 * var(--_17pa72a0-3-14-0)) 0 0 0 var(--dt-colors-border-neutral-default, #dadbe4);
 }
-._17pa72a4-3-13-2 {
-  --_1jmxup80-3-13-2: calc(33px + var(--dt-spacings-size-16, 16px) + var(--_17pa72a0-3-13-2));
+._17pa72a4-3-14-0 {
+  --_1jmxup80-3-14-0: calc(33px + var(--dt-spacings-size-16, 16px) + var(--_17pa72a0-3-14-0));
 }
-._17pa72a5-3-13-2 {
-  --_1jmxup80-3-13-2: calc(27px + var(--dt-spacings-size-16, 16px) + var(--_17pa72a0-3-13-2));
+._17pa72a5-3-14-0 {
+  --_1jmxup80-3-14-0: calc(27px + var(--dt-spacings-size-16, 16px) + var(--_17pa72a0-3-14-0));
 }
-._17pa72a6-3-13-2 {
+._17pa72a6-3-14-0 {
   position: sticky;
   display: flex;
   align-self: stretch;
@@ -47,9 +47,9 @@
   inset-block: 0;
   right: 0;
 }
-._17pa72a7-3-13-2 {
+._17pa72a7-3-14-0 {
   padding: var(--dt-spacings-size-6, 6px) var(--dt-spacings-size-6, 6px) var(--dt-spacings-size-6, 6px) 0;
 }
-._17pa72a8-3-13-2 {
+._17pa72a8-3-14-0 {
   padding: var(--dt-spacings-size-2, 2px) var(--dt-spacings-size-2, 2px) var(--dt-spacings-size-2, 2px) 0;
 }

package/esm/content/code-snippet/CodeSnippet.sty.js

@@ -2,10 +2,10 @@ import "../../core/components/app-root/AppRoot.css";
 import "./CodeHighlight.css";
 import "./CodeSnippet.css";
 import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var copyButtonContainer = _7a468({ defaultClassName: "_17pa72a6-3-13-2", variantClassNames: { size: { "default": "_17pa72a7-3-13-2", condensed: "_17pa72a8-3-13-2" } }, defaultVariants: { size: "default" }, compoundVariants: [] });
-var wrapper = "_17pa72a1-3-13-2";
-var wrapperFullHeight = "_17pa72a2-3-13-2";
-var wrapperGutter = _7a468({ defaultClassName: "_17pa72a3-3-13-2", variantClassNames: { size: { "default": "_17pa72a4-3-13-2", condensed: "_17pa72a5-3-13-2" } }, defaultVariants: { size: "default" }, compoundVariants: [] });
+var copyButtonContainer = _7a468({ defaultClassName: "_17pa72a6-3-14-0", variantClassNames: { size: { "default": "_17pa72a7-3-14-0", condensed: "_17pa72a8-3-14-0" } }, defaultVariants: { size: "default" }, compoundVariants: [] });
+var wrapper = "_17pa72a1-3-14-0";
+var wrapperFullHeight = "_17pa72a2-3-14-0";
+var wrapperGutter = _7a468({ defaultClassName: "_17pa72a3-3-14-0", variantClassNames: { size: { "default": "_17pa72a4-3-14-0", condensed: "_17pa72a5-3-14-0" } }, defaultVariants: { size: "default" }, compoundVariants: [] });
 export {
   copyButtonContainer,
   wrapper,

package/esm/content/code-snippet/CodeSnippet.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/content/code-snippet/CodeSnippet.css.ts"],
-  "sourcesContent": ["import '../../core/components/app-root/AppRoot.css';\nimport './CodeHighlight.css';\nimport './CodeSnippet.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var copyButtonContainer = _7a468({defaultClassName:'_17pa72a6-3-13-2',variantClassNames:{size:{'default':'_17pa72a7-3-13-2',condensed:'_17pa72a8-3-13-2'}},defaultVariants:{size:'default'},compoundVariants:[]});\nexport var wrapper = '_17pa72a1-3-13-2';\nexport var wrapperFullHeight = '_17pa72a2-3-13-2';\nexport var wrapperGutter = _7a468({defaultClassName:'_17pa72a3-3-13-2',variantClassNames:{size:{'default':'_17pa72a4-3-13-2',condensed:'_17pa72a5-3-13-2'}},defaultVariants:{size:'default'},compoundVariants:[]});"],
+  "sourcesContent": ["import '../../core/components/app-root/AppRoot.css';\nimport './CodeHighlight.css';\nimport './CodeSnippet.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var copyButtonContainer = _7a468({defaultClassName:'_17pa72a6-3-14-0',variantClassNames:{size:{'default':'_17pa72a7-3-14-0',condensed:'_17pa72a8-3-14-0'}},defaultVariants:{size:'default'},compoundVariants:[]});\nexport var wrapper = '_17pa72a1-3-14-0';\nexport var wrapperFullHeight = '_17pa72a2-3-14-0';\nexport var wrapperGutter = _7a468({defaultClassName:'_17pa72a3-3-14-0',variantClassNames:{size:{'default':'_17pa72a4-3-14-0',condensed:'_17pa72a5-3-14-0'}},defaultVariants:{size:'default'},compoundVariants:[]});"],
   "mappings": "AAAA,OAAO;AACP,OAAO;AACP,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,sBAAsB,OAAO,EAAC,kBAAiB,oBAAmB,mBAAkB,EAAC,MAAK,EAAC,WAAU,oBAAmB,WAAU,mBAAkB,EAAC,GAAE,iBAAgB,EAAC,MAAK,UAAS,GAAE,kBAAiB,CAAC,EAAC,CAAC;AAChN,IAAI,UAAU;AACd,IAAI,oBAAoB;AACxB,IAAI,gBAAgB,OAAO,EAAC,kBAAiB,oBAAmB,mBAAkB,EAAC,MAAK,EAAC,WAAU,oBAAmB,WAAU,mBAAkB,EAAC,GAAE,iBAAgB,EAAC,MAAK,UAAS,GAAE,kBAAiB,CAAC,EAAC,CAAC;",
   "names": []
 }

package/esm/content/empty-state/EmptyState.css

@@ -1,104 +1,104 @@
-._1os652u1-3-13-2 {
+._1os652u1-3-14-0 {
   justify-content: center;
   align-items: center;
   flex-direction: column;
   gap: var(--dt-spacings-size-0, 0);
 }
-._1os652u2-3-13-2 {
+._1os652u2-3-14-0 {
   justify-content: center;
   align-items: center;
   flex-direction: column;
   gap: var(--dt-spacings-size-0, 0);
 }
-._1os652u3-3-13-2 {
+._1os652u3-3-14-0 {
   justify-content: center;
   align-items: center;
   flex-direction: row-reverse;
   gap: var(--dt-spacings-size-64, 64px);
 }
-._1os652u4-3-13-2 {
+._1os652u4-3-14-0 {
   justify-content: center;
   align-items: center;
   flex-direction: column;
   gap: var(--dt-spacings-size-0, 0);
 }
-._1os652u1-3-13-2 ._1os652u5-3-13-2 {
+._1os652u1-3-14-0 ._1os652u5-3-14-0 {
   margin-bottom: var(--dt-spacings-size-8, 8px);
   height: 128px;
   width: 128px;
 }
-._1os652u2-3-13-2 ._1os652u5-3-13-2 {
+._1os652u2-3-14-0 ._1os652u5-3-14-0 {
   margin-bottom: var(--dt-spacings-size-16, 16px);
   height: 192px;
   width: 192px;
 }
-._1os652u3-3-13-2 ._1os652u5-3-13-2 {
+._1os652u3-3-14-0 ._1os652u5-3-14-0 {
   margin-bottom: var(--dt-spacings-size-0, 0);
   height: 320px;
   width: 320px;
 }
-._1os652u4-3-13-2 ._1os652u5-3-13-2 {
+._1os652u4-3-14-0 ._1os652u5-3-14-0 {
   margin-bottom: var(--dt-spacings-size-32, 32px);
   height: 320px;
   width: 320px;
 }
-._1os652u1-3-13-2 ._1os652u6-3-13-2 {
+._1os652u1-3-14-0 ._1os652u6-3-14-0 {
   align-items: center;
 }
-._1os652u2-3-13-2 ._1os652u6-3-13-2 {
+._1os652u2-3-14-0 ._1os652u6-3-14-0 {
   align-items: center;
 }
-._1os652u3-3-13-2 ._1os652u6-3-13-2 {
+._1os652u3-3-14-0 ._1os652u6-3-14-0 {
   align-items: flex-start;
 }
-._1os652u4-3-13-2 ._1os652u6-3-13-2 {
+._1os652u4-3-14-0 ._1os652u6-3-14-0 {
   align-items: center;
 }
-._1os652u1-3-13-2 ._1os652u7-3-13-2 {
+._1os652u1-3-14-0 ._1os652u7-3-14-0 {
   margin-bottom: var(--dt-spacings-size-4, 4px);
 }
-._1os652u2-3-13-2 ._1os652u7-3-13-2 {
+._1os652u2-3-14-0 ._1os652u7-3-14-0 {
   margin-bottom: var(--dt-spacings-size-6, 6px);
 }
-._1os652u3-3-13-2 ._1os652u7-3-13-2 {
+._1os652u3-3-14-0 ._1os652u7-3-14-0 {
   margin-bottom: var(--dt-spacings-size-16, 16px);
 }
-._1os652u4-3-13-2 ._1os652u7-3-13-2 {
+._1os652u4-3-14-0 ._1os652u7-3-14-0 {
   margin-bottom: var(--dt-spacings-size-16, 16px);
 }
-._1os652u1-3-13-2 ._1os652u8-3-13-2 {
+._1os652u1-3-14-0 ._1os652u8-3-14-0 {
   margin-bottom: var(--dt-spacings-size-16, 16px);
 }
-._1os652u2-3-13-2 ._1os652u8-3-13-2 {
+._1os652u2-3-14-0 ._1os652u8-3-14-0 {
   margin-bottom: var(--dt-spacings-size-32, 32px);
 }
-._1os652u3-3-13-2 ._1os652u8-3-13-2 {
+._1os652u3-3-14-0 ._1os652u8-3-14-0 {
   margin-bottom: var(--dt-spacings-size-32, 32px);
 }
-._1os652u4-3-13-2 ._1os652u8-3-13-2 {
+._1os652u4-3-14-0 ._1os652u8-3-14-0 {
   margin-bottom: var(--dt-spacings-size-32, 32px);
 }
-._1os652u1-3-13-2 ._1os652u9-3-13-2 {
+._1os652u1-3-14-0 ._1os652u9-3-14-0 {
   margin-bottom: var(--dt-spacings-size-16, 16px);
 }
-._1os652u2-3-13-2 ._1os652u9-3-13-2 {
+._1os652u2-3-14-0 ._1os652u9-3-14-0 {
   margin-bottom: var(--dt-spacings-size-16, 16px);
 }
-._1os652u3-3-13-2 ._1os652u9-3-13-2 {
+._1os652u3-3-14-0 ._1os652u9-3-14-0 {
   margin-bottom: var(--dt-spacings-size-32, 32px);
 }
-._1os652u4-3-13-2 ._1os652u9-3-13-2 {
+._1os652u4-3-14-0 ._1os652u9-3-14-0 {
   margin-bottom: var(--dt-spacings-size-32, 32px);
 }
-._1os652u1-3-13-2 ._1os652ua-3-13-2 {
+._1os652u1-3-14-0 ._1os652ua-3-14-0 {
   margin-top: var(--dt-spacings-size-16, 16px);
 }
-._1os652u2-3-13-2 ._1os652ua-3-13-2 {
+._1os652u2-3-14-0 ._1os652ua-3-14-0 {
   margin-top: var(--dt-spacings-size-16, 16px);
 }
-._1os652u3-3-13-2 ._1os652ua-3-13-2 {
+._1os652u3-3-14-0 ._1os652ua-3-14-0 {
   margin-top: var(--dt-spacings-size-32, 32px);
 }
-._1os652u4-3-13-2 ._1os652ua-3-13-2 {
+._1os652u4-3-14-0 ._1os652ua-3-14-0 {
   margin-top: var(--dt-spacings-size-32, 32px);
 }

package/esm/content/empty-state/EmptyState.sty.js

@@ -1,12 +1,12 @@
 import "./EmptyState.css";
 import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var actionsSlotCss = "_1os652u9-3-13-2";
-var contentContainerCss = "_1os652u6-3-13-2";
-var detailsSlotCss = "_1os652u8-3-13-2";
-var emptyStateContainerCss = _7a468({ defaultClassName: "_1os652u0-3-13-2", variantClassNames: { size: { small: "_1os652u1-3-13-2", "default": "_1os652u2-3-13-2", large: "_1os652u3-3-13-2", largeResponsive: "_1os652u4-3-13-2" } }, defaultVariants: {}, compoundVariants: [] });
-var footerSlotCss = "_1os652ua-3-13-2";
-var titleSlotCss = "_1os652u7-3-13-2";
-var visualSlotCss = "_1os652u5-3-13-2";
+var actionsSlotCss = "_1os652u9-3-14-0";
+var contentContainerCss = "_1os652u6-3-14-0";
+var detailsSlotCss = "_1os652u8-3-14-0";
+var emptyStateContainerCss = _7a468({ defaultClassName: "_1os652u0-3-14-0", variantClassNames: { size: { small: "_1os652u1-3-14-0", "default": "_1os652u2-3-14-0", large: "_1os652u3-3-14-0", largeResponsive: "_1os652u4-3-14-0" } }, defaultVariants: {}, compoundVariants: [] });
+var footerSlotCss = "_1os652ua-3-14-0";
+var titleSlotCss = "_1os652u7-3-14-0";
+var visualSlotCss = "_1os652u5-3-14-0";
 export {
   actionsSlotCss,
   contentContainerCss,

package/esm/content/empty-state/EmptyState.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/content/empty-state/EmptyState.css.ts"],
-  "sourcesContent": ["import './EmptyState.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var actionsSlotCss = '_1os652u9-3-13-2';\nexport var contentContainerCss = '_1os652u6-3-13-2';\nexport var detailsSlotCss = '_1os652u8-3-13-2';\nexport var emptyStateContainerCss = _7a468({defaultClassName:'_1os652u0-3-13-2',variantClassNames:{size:{small:'_1os652u1-3-13-2','default':'_1os652u2-3-13-2',large:'_1os652u3-3-13-2',largeResponsive:'_1os652u4-3-13-2'}},defaultVariants:{},compoundVariants:[]});\nexport var footerSlotCss = '_1os652ua-3-13-2';\nexport var titleSlotCss = '_1os652u7-3-13-2';\nexport var visualSlotCss = '_1os652u5-3-13-2';"],
+  "sourcesContent": ["import './EmptyState.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var actionsSlotCss = '_1os652u9-3-14-0';\nexport var contentContainerCss = '_1os652u6-3-14-0';\nexport var detailsSlotCss = '_1os652u8-3-14-0';\nexport var emptyStateContainerCss = _7a468({defaultClassName:'_1os652u0-3-14-0',variantClassNames:{size:{small:'_1os652u1-3-14-0','default':'_1os652u2-3-14-0',large:'_1os652u3-3-14-0',largeResponsive:'_1os652u4-3-14-0'}},defaultVariants:{},compoundVariants:[]});\nexport var footerSlotCss = '_1os652ua-3-14-0';\nexport var titleSlotCss = '_1os652u7-3-14-0';\nexport var visualSlotCss = '_1os652u5-3-14-0';"],
   "mappings": "AAAA,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,iBAAiB;AACrB,IAAI,sBAAsB;AAC1B,IAAI,iBAAiB;AACrB,IAAI,yBAAyB,OAAO,EAAC,kBAAiB,oBAAmB,mBAAkB,EAAC,MAAK,EAAC,OAAM,oBAAmB,WAAU,oBAAmB,OAAM,oBAAmB,iBAAgB,mBAAkB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,EAAC,CAAC;AAC7P,IAAI,gBAAgB;AACpB,IAAI,eAAe;AACnB,IAAI,gBAAgB;",
   "names": []
 }