@carbon-labs/react-animated-header 0.38.0 → 0.40.0

package/es/__stories__/AnimatedHeader.stories.d.ts

@@ -15065,7 +15065,7 @@ export declare const ThemeG10: {
                     type: string;
                     button: {
                         href: string;
-                        icon: import("@carbon/react/icons").CarbonIconType;
+                        icon: import("@carbon/icons-react").CarbonIconType;
                         text: string;
                         type: "tertiary";
                     };
@@ -30258,7 +30258,7 @@ export declare const ThemeG100: {
                     type: string;
                     button: {
                         href: string;
-                        icon: import("@carbon/react/icons").CarbonIconType;
+                        icon: import("@carbon/icons-react").CarbonIconType;
                         text: string;
                         type: "tertiary";
                     };

package/es/components/AnimatedHeader/AnimatedHeader.js

@@ -8,10 +8,10 @@
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React, { useRef, useState, useEffect } from 'react';
 import PropTypes from 'prop-types';
-import lottie from '../../_virtual/lottie.js';
+import lottie from 'lottie-web';
 import { Grid, Column, Button } from '@carbon/react';
 import { ChevronUp, ChevronDown } from '@carbon/icons-react';
-import { usePrefix } from '../../node_modules/@carbon-labs/utilities/es/usePrefix.js';
+import { usePrefix } from '@carbon-labs/utilities/usePrefix';
 import '@carbon/react/icons';
 import { BaseTile } from '../Tiles/BaseTile/BaseTile.js';
 import TasksController from '../TasksController/TasksController.js';

package/es/components/ContentSwitcherSelector/ContentSwitcherSelector.js

@@ -8,7 +8,7 @@
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React from 'react';
 import { SkeletonPlaceholder, ContentSwitcher, Switch } from '@carbon/react';
-import { usePrefix } from '../../node_modules/@carbon-labs/utilities/es/usePrefix.js';
+import { usePrefix } from '@carbon-labs/utilities/usePrefix';
 
 const ContentSwitcherSelector = ({
   contentSwitcherConfig,

package/es/components/HeaderAction/HeaderAction.js

@@ -7,7 +7,7 @@
 
 import React from 'react';
 import { IconButton, Button } from '@carbon/react';
-import { usePrefix } from '../../node_modules/@carbon-labs/utilities/es/usePrefix.js';
+import { usePrefix } from '@carbon-labs/utilities/usePrefix';
 
 const HeaderAction = ({
   config,

package/es/components/HeaderTitle/HeaderTitle.js

@@ -7,7 +7,7 @@
 
 import React from 'react';
 import { Tooltip } from '@carbon/react';
-import { usePrefix } from '../../node_modules/@carbon-labs/utilities/es/usePrefix.js';
+import { usePrefix } from '@carbon-labs/utilities/usePrefix';
 
 const NAME_FIRST_LANGS = ['ar',
 // Arabic

package/es/components/TasksController/TasksController.js

@@ -8,7 +8,7 @@
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React, { useMemo } from 'react';
 import { SkeletonPlaceholder, Button, Dropdown } from '@carbon/react';
-import { usePrefix } from '../../node_modules/@carbon-labs/utilities/es/usePrefix.js';
+import { usePrefix } from '@carbon-labs/utilities/usePrefix';
 
 const TasksController = ({
   tasksControllerConfig,

package/es/components/Tiles/AIPromptTile/AIPromptTile.d.ts

@@ -7,6 +7,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { ElementType } from 'react';
+import { type AITileBodyProps, type AITileLabelVariant } from '../AITile/AITileBody';
 export type AIPromptTileProps = {
     variant: 'aiPrompt';
     tileId: string;
@@ -16,6 +17,9 @@ export type AIPromptTileProps = {
     productName?: string;
     promptPlaceholder?: string;
     primaryIcon?: ElementType | null;
+    aiLabelVariant?: AITileLabelVariant;
+    aiLabelText?: string;
+    aiLabelTagType?: AITileBodyProps['aiLabelTagType'];
     onClick?: ((event: React.MouseEvent<HTMLElement>) => void) | null;
     ariaLabel?: string;
     open?: boolean;

package/es/components/Tiles/AIPromptTile/AIPromptTile.js

@@ -6,8 +6,8 @@
  */
 
 import React, { useState } from 'react';
-import { SkeletonPlaceholder, AILabel, TextInput, IconButton, Button } from '@carbon/react';
-import { usePrefix } from '../../../node_modules/@carbon-labs/utilities/es/usePrefix.js';
+import { SkeletonPlaceholder, Tag, AILabel, TextInput, IconButton, Button } from '@carbon/react';
+import { usePrefix } from '@carbon-labs/utilities/usePrefix';
 import { Send } from '@carbon/react/icons';
 
 var _AILabel, _Send;
@@ -19,6 +19,9 @@ const AIPromptTile = ({
   productName,
   promptPlaceholder = 'Start chatting...',
   primaryIcon: PrimaryIcon,
+  aiLabelVariant = 'aiLabel',
+  aiLabelText = 'AI',
+  aiLabelTagType = 'gray',
   onClick,
   ariaLabel,
   open,
@@ -64,11 +67,20 @@ const AIPromptTile = ({
   }, PrimaryIcon && /*#__PURE__*/React.createElement(PrimaryIcon, {
     fill: `var(--cds-icon-secondary)`,
     size: 24
-  }), _AILabel || (_AILabel = /*#__PURE__*/React.createElement(AILabel, {
+  }), aiLabelVariant === 'tag' ? /*#__PURE__*/React.createElement(Tag, {
+    size: "sm",
+    type: aiLabelTagType,
+    className: `${blockClass}--tag`,
+    decorator: _AILabel || (_AILabel = /*#__PURE__*/React.createElement(AILabel, {
+      aiText: "AI",
+      size: "xs",
+      kind: "inline"
+    }))
+  }, aiLabelText) : /*#__PURE__*/React.createElement(AILabel, {
     autoAlign: true,
-    aiText: "AI",
+    aiText: aiLabelText,
     size: "xs"
-  }))), /*#__PURE__*/React.createElement("div", {
+  })), /*#__PURE__*/React.createElement("div", {
     className: `${blockClass}--title`
   }, title), /*#__PURE__*/React.createElement("div", {
     className: `${blockClass}--text-input-container ${textInput && `${blockClass}--text-input-container__active`}`

package/es/components/Tiles/AITile/AITile.d.ts

@@ -7,6 +7,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { ElementType } from 'react';
+import { AITileBodyProps, AITileLabelVariant } from '../AITile/AITileBody';
 export type AITileProps = {
     variant: 'ai';
     tileId: string;
@@ -17,6 +18,9 @@ export type AITileProps = {
     customContent?: React.ReactNode | null;
     primaryIcon?: ElementType | null;
     secondaryIcon?: ElementType | null;
+    aiLabelVariant?: AITileLabelVariant;
+    aiLabelText?: string;
+    aiLabelTagType?: AITileBodyProps['aiLabelTagType'];
     onClick?: ((event: React.MouseEvent<HTMLElement>) => void) | null;
     ariaLabel?: string;
     open?: boolean;

package/es/components/Tiles/AITile/AITile.js

@@ -7,7 +7,7 @@
 
 import React from 'react';
 import { Link } from '@carbon/react';
-import { usePrefix } from '../../../node_modules/@carbon-labs/utilities/es/usePrefix.js';
+import { usePrefix } from '@carbon-labs/utilities/usePrefix';
 import { AITileBody } from './AITileBody.js';
 
 const AITile = ({
@@ -19,6 +19,9 @@ const AITile = ({
   customContent,
   primaryIcon: PrimaryIcon,
   secondaryIcon: SecondaryIcon,
+  aiLabelVariant,
+  aiLabelText,
+  aiLabelTagType,
   onClick: aiTileClickHandler,
   ariaLabel,
   open,
@@ -34,6 +37,9 @@ const AITile = ({
     title: title,
     subtitle: subtitle,
     customContent: customContent,
+    aiLabelVariant: aiLabelVariant,
+    aiLabelText: aiLabelText,
+    aiLabelTagType: aiLabelTagType,
     isLoading: isLoading
   });
 

package/es/components/Tiles/AITile/AITileBody.d.ts

@@ -7,6 +7,9 @@
  * LICENSE file in the root directory of this source tree.
  */
 import { ElementType, ReactNode } from 'react';
+import { type TagProps } from '@carbon/react';
+type TagTypeName = TagProps<'div'>['type'];
+export type AITileLabelVariant = 'aiLabel' | 'tag';
 export type AITileBodyProps = {
     open?: boolean;
     title?: string | null;
@@ -14,6 +17,10 @@ export type AITileBodyProps = {
     customContent?: ReactNode;
     primaryIcon?: ElementType | null;
     secondaryIcon?: ElementType | null;
+    aiLabelVariant?: AITileLabelVariant;
+    aiLabelText?: string;
+    aiLabelTagType?: TagTypeName;
     isLoading?: boolean;
 };
-export declare const AITileBody: ({ open, title, subtitle, customContent, primaryIcon: PrimaryIcon, secondaryIcon: SecondaryIcon, isLoading, }: AITileBodyProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AITileBody: ({ open, title, subtitle, customContent, primaryIcon: PrimaryIcon, secondaryIcon: SecondaryIcon, aiLabelVariant, aiLabelText, aiLabelTagType, isLoading, }: AITileBodyProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/es/components/Tiles/AITile/AITileBody.js

@@ -6,8 +6,8 @@
  */
 
 import React from 'react';
-import { usePrefix } from '../../../node_modules/@carbon-labs/utilities/es/usePrefix.js';
-import { SkeletonPlaceholder, AILabel } from '@carbon/react';
+import { usePrefix } from '@carbon-labs/utilities/usePrefix';
+import { SkeletonPlaceholder, Tag, AILabel } from '@carbon/react';
 
 var _AILabel;
 const AITileBody = ({
@@ -17,6 +17,9 @@ const AITileBody = ({
   customContent,
   primaryIcon: PrimaryIcon,
   secondaryIcon: SecondaryIcon,
+  aiLabelVariant = 'aiLabel',
+  aiLabelText = 'AI',
+  aiLabelTagType = 'gray',
   isLoading
 }) => {
   const prefix = usePrefix();
@@ -40,11 +43,20 @@ const AITileBody = ({
   }, PrimaryIcon && /*#__PURE__*/React.createElement(PrimaryIcon, {
     fill: `var(--cds-icon-secondary)`,
     size: 24
-  }), _AILabel || (_AILabel = /*#__PURE__*/React.createElement(AILabel, {
+  }), aiLabelVariant === 'tag' ? /*#__PURE__*/React.createElement(Tag, {
+    size: "sm",
+    type: aiLabelTagType,
+    className: `${blockClass}--tag`,
+    decorator: _AILabel || (_AILabel = /*#__PURE__*/React.createElement(AILabel, {
+      aiText: "AI",
+      size: "xs",
+      kind: "inline"
+    }))
+  }, aiLabelText) : /*#__PURE__*/React.createElement(AILabel, {
     autoAlign: true,
-    aiText: "AI",
+    aiText: aiLabelText,
     size: "xs"
-  }))), /*#__PURE__*/React.createElement("div", {
+  })), /*#__PURE__*/React.createElement("div", {
     className: `${blockClass}--title`
   }, title), /*#__PURE__*/React.createElement("div", {
     className: `${blockClass}--footer`

package/es/components/Tiles/GlassTile/GlassTile.d.ts

@@ -7,6 +7,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { ElementType } from 'react';
+import { GlassTileBodyProps } from './GlassTileBody';
 export type GlassTileProps = {
     variant?: 'glass';
     tileId: string;
@@ -17,6 +18,8 @@ export type GlassTileProps = {
     customContent?: React.ReactNode | null;
     primaryIcon?: ElementType | null;
     secondaryIcon?: ElementType | null;
+    tagLabel?: string | null;
+    tagType?: GlassTileBodyProps['tagType'];
     onClick?: ((event: React.MouseEvent<HTMLElement>) => void) | null;
     ariaLabel?: string;
     open?: boolean;

package/es/components/Tiles/GlassTile/GlassTile.js

@@ -7,7 +7,7 @@
 
 import React from 'react';
 import { Link } from '@carbon/react';
-import { usePrefix } from '../../../node_modules/@carbon-labs/utilities/es/usePrefix.js';
+import { usePrefix } from '@carbon-labs/utilities/usePrefix';
 import { GlassTileBody } from './GlassTileBody.js';
 
 const GlassTile = ({
@@ -19,6 +19,8 @@ const GlassTile = ({
   customContent,
   primaryIcon: PrimaryIcon,
   secondaryIcon: SecondaryIcon,
+  tagLabel,
+  tagType,
   onClick: glassTileClickHandler,
   ariaLabel,
   open,
@@ -34,6 +36,8 @@ const GlassTile = ({
     title: title,
     subtitle: subtitle,
     customContent: customContent,
+    tagLabel: tagLabel,
+    tagType: tagType,
     isLoading: isLoading
   });
 

package/es/components/Tiles/GlassTile/GlassTileBody.d.ts

@@ -7,6 +7,8 @@
  * LICENSE file in the root directory of this source tree.
  */
 import { ElementType, ReactNode } from 'react';
+import { type TagProps } from '@carbon/react';
+type TagTypeName = TagProps<'div'>['type'];
 export type GlassTileBodyProps = {
     open?: boolean;
     title?: string | null;
@@ -14,6 +16,9 @@ export type GlassTileBodyProps = {
     customContent?: ReactNode;
     primaryIcon?: ElementType | null;
     secondaryIcon?: ElementType | null;
+    tagLabel?: string | null;
+    tagType?: TagTypeName;
     isLoading?: boolean;
 };
-export declare const GlassTileBody: ({ open, title, subtitle, customContent, primaryIcon: PrimaryIcon, secondaryIcon: SecondaryIcon, isLoading, }: GlassTileBodyProps) => import("react/jsx-runtime").JSX.Element;
+export declare const GlassTileBody: ({ open, title, subtitle, customContent, primaryIcon: PrimaryIcon, secondaryIcon: SecondaryIcon, tagLabel, tagType, isLoading, }: GlassTileBodyProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/es/components/Tiles/GlassTile/GlassTileBody.js

@@ -6,8 +6,8 @@
  */
 
 import React from 'react';
-import { usePrefix } from '../../../node_modules/@carbon-labs/utilities/es/usePrefix.js';
-import { SkeletonPlaceholder } from '@carbon/react';
+import { usePrefix } from '@carbon-labs/utilities/usePrefix';
+import { SkeletonPlaceholder, Tag } from '@carbon/react';
 
 const GlassTileBody = ({
   open,
@@ -16,6 +16,8 @@ const GlassTileBody = ({
   customContent,
   primaryIcon: PrimaryIcon,
   secondaryIcon: SecondaryIcon,
+  tagLabel,
+  tagType = 'gray',
   isLoading
 }) => {
   const prefix = usePrefix();
@@ -37,7 +39,11 @@ const GlassTileBody = ({
   }, PrimaryIcon && /*#__PURE__*/React.createElement(PrimaryIcon, {
     fill: `var(--cds-icon-secondary)`,
     size: 24
-  })), /*#__PURE__*/React.createElement("div", {
+  }), tagLabel && /*#__PURE__*/React.createElement(Tag, {
+    size: "sm",
+    type: tagType,
+    className: `${blockClass}--tag`
+  }, tagLabel)), /*#__PURE__*/React.createElement("div", {
     className: `${blockClass}--title`
   }, title), /*#__PURE__*/React.createElement("div", {
     className: `${blockClass}--footer`

package/es/components/WorkspaceSelector/WorkspaceSelector.js

@@ -6,7 +6,7 @@
  */
 
 import { SkeletonPlaceholder, Dropdown } from '@carbon/react';
-import { usePrefix } from '../../node_modules/@carbon-labs/utilities/es/usePrefix.js';
+import { usePrefix } from '@carbon-labs/utilities/usePrefix';
 import React, { useMemo } from 'react';
 
 const WorkspaceSelector = ({

package/es/index.js

@@ -10,6 +10,7 @@ export { default as HeaderAction } from './components/HeaderAction/HeaderAction.
 export { default as HeaderTitle } from './components/HeaderTitle/HeaderTitle.js';
 import 'react';
 import '@carbon/react';
+import '@carbon-labs/utilities/usePrefix';
 import '@carbon/react/icons';
 export { BaseTile } from './components/Tiles/BaseTile/BaseTile.js';
 export { default as dataFabricStaticLight } from './assets/static/header_static_data_fabric_light_06.svg.js';

package/lib/__stories__/AnimatedHeader.stories.d.ts

@@ -15065,7 +15065,7 @@ export declare const ThemeG10: {
                     type: string;
                     button: {
                         href: string;
-                        icon: import("@carbon/react/icons").CarbonIconType;
+                        icon: import("@carbon/icons-react").CarbonIconType;
                         text: string;
                         type: "tertiary";
                     };
@@ -30258,7 +30258,7 @@ export declare const ThemeG100: {
                     type: string;
                     button: {
                         href: string;
-                        icon: import("@carbon/react/icons").CarbonIconType;
+                        icon: import("@carbon/icons-react").CarbonIconType;
                         text: string;
                         type: "tertiary";
                     };

package/lib/components/AnimatedHeader/AnimatedHeader.js

@@ -12,10 +12,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var PropTypes = require('prop-types');
-var lottie = require('../../_virtual/lottie.js');
+var lottie = require('lottie-web');
 var react = require('@carbon/react');
 var iconsReact = require('@carbon/icons-react');
-var usePrefix = require('../../node_modules/@carbon-labs/utilities/es/usePrefix.js');
+var usePrefix = require('@carbon-labs/utilities/usePrefix');
 require('@carbon/react/icons');
 var BaseTile = require('../Tiles/BaseTile/BaseTile.js');
 var TasksController = require('../TasksController/TasksController.js');
@@ -65,7 +65,7 @@ const AnimatedHeader = ({
     if (!animationContainer.current || !headerAnimation) {
       return;
     }
-    const animation = lottie.default.loadAnimation({
+    const animation = lottie.loadAnimation({
       container: animationContainer.current,
       animationData: headerAnimation,
       renderer: 'svg',

package/lib/components/ContentSwitcherSelector/ContentSwitcherSelector.js

@@ -12,7 +12,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var react = require('@carbon/react');
-var usePrefix = require('../../node_modules/@carbon-labs/utilities/es/usePrefix.js');
+var usePrefix = require('@carbon-labs/utilities/usePrefix');
 
 const ContentSwitcherSelector = ({
   contentSwitcherConfig,

package/lib/components/HeaderAction/HeaderAction.js

@@ -11,7 +11,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@carbon/react');
-var usePrefix = require('../../node_modules/@carbon-labs/utilities/es/usePrefix.js');
+var usePrefix = require('@carbon-labs/utilities/usePrefix');
 
 const HeaderAction = ({
   config,

package/lib/components/HeaderTitle/HeaderTitle.js

@@ -11,7 +11,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@carbon/react');
-var usePrefix = require('../../node_modules/@carbon-labs/utilities/es/usePrefix.js');
+var usePrefix = require('@carbon-labs/utilities/usePrefix');
 
 const NAME_FIRST_LANGS = ['ar',
 // Arabic

package/lib/components/TasksController/TasksController.js

@@ -12,7 +12,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var react = require('@carbon/react');
-var usePrefix = require('../../node_modules/@carbon-labs/utilities/es/usePrefix.js');
+var usePrefix = require('@carbon-labs/utilities/usePrefix');
 
 const TasksController = ({
   tasksControllerConfig,

package/lib/components/Tiles/AIPromptTile/AIPromptTile.d.ts

@@ -7,6 +7,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { ElementType } from 'react';
+import { type AITileBodyProps, type AITileLabelVariant } from '../AITile/AITileBody';
 export type AIPromptTileProps = {
     variant: 'aiPrompt';
     tileId: string;
@@ -16,6 +17,9 @@ export type AIPromptTileProps = {
     productName?: string;
     promptPlaceholder?: string;
     primaryIcon?: ElementType | null;
+    aiLabelVariant?: AITileLabelVariant;
+    aiLabelText?: string;
+    aiLabelTagType?: AITileBodyProps['aiLabelTagType'];
     onClick?: ((event: React.MouseEvent<HTMLElement>) => void) | null;
     ariaLabel?: string;
     open?: boolean;

package/lib/components/Tiles/AIPromptTile/AIPromptTile.js

@@ -9,7 +9,7 @@
 
 var React = require('react');
 var react = require('@carbon/react');
-var usePrefix = require('../../../node_modules/@carbon-labs/utilities/es/usePrefix.js');
+var usePrefix = require('@carbon-labs/utilities/usePrefix');
 var icons = require('@carbon/react/icons');
 
 var _AILabel, _Send;
@@ -21,6 +21,9 @@ const AIPromptTile = ({
   productName,
   promptPlaceholder = 'Start chatting...',
   primaryIcon: PrimaryIcon,
+  aiLabelVariant = 'aiLabel',
+  aiLabelText = 'AI',
+  aiLabelTagType = 'gray',
   onClick,
   ariaLabel,
   open,
@@ -66,11 +69,20 @@ const AIPromptTile = ({
   }, PrimaryIcon && /*#__PURE__*/React.createElement(PrimaryIcon, {
     fill: `var(--cds-icon-secondary)`,
     size: 24
-  }), _AILabel || (_AILabel = /*#__PURE__*/React.createElement(react.AILabel, {
+  }), aiLabelVariant === 'tag' ? /*#__PURE__*/React.createElement(react.Tag, {
+    size: "sm",
+    type: aiLabelTagType,
+    className: `${blockClass}--tag`,
+    decorator: _AILabel || (_AILabel = /*#__PURE__*/React.createElement(react.AILabel, {
+      aiText: "AI",
+      size: "xs",
+      kind: "inline"
+    }))
+  }, aiLabelText) : /*#__PURE__*/React.createElement(react.AILabel, {
     autoAlign: true,
-    aiText: "AI",
+    aiText: aiLabelText,
     size: "xs"
-  }))), /*#__PURE__*/React.createElement("div", {
+  })), /*#__PURE__*/React.createElement("div", {
     className: `${blockClass}--title`
   }, title), /*#__PURE__*/React.createElement("div", {
     className: `${blockClass}--text-input-container ${textInput && `${blockClass}--text-input-container__active`}`

package/lib/components/Tiles/AITile/AITile.d.ts

@@ -7,6 +7,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { ElementType } from 'react';
+import { AITileBodyProps, AITileLabelVariant } from '../AITile/AITileBody';
 export type AITileProps = {
     variant: 'ai';
     tileId: string;
@@ -17,6 +18,9 @@ export type AITileProps = {
     customContent?: React.ReactNode | null;
     primaryIcon?: ElementType | null;
     secondaryIcon?: ElementType | null;
+    aiLabelVariant?: AITileLabelVariant;
+    aiLabelText?: string;
+    aiLabelTagType?: AITileBodyProps['aiLabelTagType'];
     onClick?: ((event: React.MouseEvent<HTMLElement>) => void) | null;
     ariaLabel?: string;
     open?: boolean;

package/lib/components/Tiles/AITile/AITile.js

@@ -11,7 +11,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var react = require('@carbon/react');
-var usePrefix = require('../../../node_modules/@carbon-labs/utilities/es/usePrefix.js');
+var usePrefix = require('@carbon-labs/utilities/usePrefix');
 var AITileBody = require('./AITileBody.js');
 
 const AITile = ({
@@ -23,6 +23,9 @@ const AITile = ({
   customContent,
   primaryIcon: PrimaryIcon,
   secondaryIcon: SecondaryIcon,
+  aiLabelVariant,
+  aiLabelText,
+  aiLabelTagType,
   onClick: aiTileClickHandler,
   ariaLabel,
   open,
@@ -38,6 +41,9 @@ const AITile = ({
     title: title,
     subtitle: subtitle,
     customContent: customContent,
+    aiLabelVariant: aiLabelVariant,
+    aiLabelText: aiLabelText,
+    aiLabelTagType: aiLabelTagType,
     isLoading: isLoading
   });
 

package/lib/components/Tiles/AITile/AITileBody.d.ts

@@ -7,6 +7,9 @@
  * LICENSE file in the root directory of this source tree.
  */
 import { ElementType, ReactNode } from 'react';
+import { type TagProps } from '@carbon/react';
+type TagTypeName = TagProps<'div'>['type'];
+export type AITileLabelVariant = 'aiLabel' | 'tag';
 export type AITileBodyProps = {
     open?: boolean;
     title?: string | null;
@@ -14,6 +17,10 @@ export type AITileBodyProps = {
     customContent?: ReactNode;
     primaryIcon?: ElementType | null;
     secondaryIcon?: ElementType | null;
+    aiLabelVariant?: AITileLabelVariant;
+    aiLabelText?: string;
+    aiLabelTagType?: TagTypeName;
     isLoading?: boolean;
 };
-export declare const AITileBody: ({ open, title, subtitle, customContent, primaryIcon: PrimaryIcon, secondaryIcon: SecondaryIcon, isLoading, }: AITileBodyProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AITileBody: ({ open, title, subtitle, customContent, primaryIcon: PrimaryIcon, secondaryIcon: SecondaryIcon, aiLabelVariant, aiLabelText, aiLabelTagType, isLoading, }: AITileBodyProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/components/Tiles/AITile/AITileBody.js

@@ -8,7 +8,7 @@
 'use strict';
 
 var React = require('react');
-var usePrefix = require('../../../node_modules/@carbon-labs/utilities/es/usePrefix.js');
+var usePrefix = require('@carbon-labs/utilities/usePrefix');
 var react = require('@carbon/react');
 
 var _AILabel;
@@ -19,6 +19,9 @@ const AITileBody = ({
   customContent,
   primaryIcon: PrimaryIcon,
   secondaryIcon: SecondaryIcon,
+  aiLabelVariant = 'aiLabel',
+  aiLabelText = 'AI',
+  aiLabelTagType = 'gray',
   isLoading
 }) => {
   const prefix = usePrefix.usePrefix();
@@ -42,11 +45,20 @@ const AITileBody = ({
   }, PrimaryIcon && /*#__PURE__*/React.createElement(PrimaryIcon, {
     fill: `var(--cds-icon-secondary)`,
     size: 24
-  }), _AILabel || (_AILabel = /*#__PURE__*/React.createElement(react.AILabel, {
+  }), aiLabelVariant === 'tag' ? /*#__PURE__*/React.createElement(react.Tag, {
+    size: "sm",
+    type: aiLabelTagType,
+    className: `${blockClass}--tag`,
+    decorator: _AILabel || (_AILabel = /*#__PURE__*/React.createElement(react.AILabel, {
+      aiText: "AI",
+      size: "xs",
+      kind: "inline"
+    }))
+  }, aiLabelText) : /*#__PURE__*/React.createElement(react.AILabel, {
     autoAlign: true,
-    aiText: "AI",
+    aiText: aiLabelText,
     size: "xs"
-  }))), /*#__PURE__*/React.createElement("div", {
+  })), /*#__PURE__*/React.createElement("div", {
     className: `${blockClass}--title`
   }, title), /*#__PURE__*/React.createElement("div", {
     className: `${blockClass}--footer`

package/lib/components/Tiles/GlassTile/GlassTile.d.ts

@@ -7,6 +7,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { ElementType } from 'react';
+import { GlassTileBodyProps } from './GlassTileBody';
 export type GlassTileProps = {
     variant?: 'glass';
     tileId: string;
@@ -17,6 +18,8 @@ export type GlassTileProps = {
     customContent?: React.ReactNode | null;
     primaryIcon?: ElementType | null;
     secondaryIcon?: ElementType | null;
+    tagLabel?: string | null;
+    tagType?: GlassTileBodyProps['tagType'];
     onClick?: ((event: React.MouseEvent<HTMLElement>) => void) | null;
     ariaLabel?: string;
     open?: boolean;